<template>
|
<view class="invite-code-container colCen borderBox">
|
<view class="model-title rowCenCen">
|
请输入邀请码
|
</view>
|
<view class="grey-input-content rowCen borderBox">
|
<input class="iptclas" type="text" v-model="inviteCode" placeholder="请填写邀请码" placeholder-class="pla-input"/>
|
</view>
|
|
<view class="btn-bar rowCenBet">
|
<view class="close-btn rowCenCen borderBox" @tap="closeModel()">
|
<view>以后再填</view>
|
</view>
|
<view class="next-btn rowCenCen borderBox" @tap="confrim()" :class="inviteCode?'pinkbtn':''">
|
<view>下一步</view>
|
</view>
|
</view>
|
|
<view class="model-tips" v-if="appInfo.isOpenOfficialCode==1">
|
<view>填写邀请码有助于您的购物返佣哦！</view>
|
<view class="rowCen">没有邀请码可填写以下<view style="color: #FF002C;">官方邀请码</view>：</view>
|
</view>
|
<view class="copy-bar rowCenBet borderBox" v-if="appInfo.isOpenOfficialCode==1">
|
<view class="left-code">
|
{{appInfo.officialInvitationCode}}
|
</view>
|
<view class="copybtn rowCenCen" @tap="useCode()">
|
<view>使用邀请码</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data(){
|
return{
|
inviteCode:'',
|
appInfo:''
|
}
|
},
|
mounted() {
|
this.appInfo = uni.getStorageSync('appInfo')
|
},
|
methods:{
|
closeModel(){
|
this.$emit('closeModel')
|
},
|
confrim(){
|
var that = this;
|
if(this.inviteCode){
|
this.$u.api.getInviteInfo({
|
invite_code:this.inviteCode
|
}).then(e => {
|
if(e.code != 0) return that.$alert(e.msg)
|
this.$emit('confirm',e.data)
|
}).catch(function (err) {
|
})
|
}
|
},
|
useCode(){
|
this.inviteCode = this.appInfo.officialInvitationCode
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.invite-code-container{
|
width: 640rpx;
|
background: #FFFFFF;
|
border-radius: 32rpx;
|
padding: 0 46rpx;
|
.model-title{
|
width: 100%;
|
height: 135rpx;
|
font-size: 34rpx;
|
font-weight: 500;
|
color: #333333;
|
}
|
.grey-input-content{
|
width: 100%;
|
height: 90rpx;
|
background: #F8F8F8;
|
border-radius: 45rpx;
|
padding: 0 21rpx;
|
margin-bottom: 65rpx;
|
.iptclas{
|
flex: 1;
|
}
|
.pla-input{
|
font-size: 28rpx;
|
font-weight: 500;
|
color: #999999;
|
}
|
}
|
|
.btn-bar{
|
width: 100%;
|
margin-bottom: 50rpx;
|
.close-btn{
|
width: 263rpx;
|
height: 90rpx;
|
background: #F7F7F7;
|
border: 1rpx solid #CBCBC9;
|
border-radius: 45rpx;
|
font-size: 28rpx;
|
font-weight: 500;
|
color: #999999;
|
}
|
.next-btn{
|
width: 263rpx;
|
height: 90rpx;
|
background: #CBCBC9;
|
border-radius: 45rpx;
|
font-size: 28rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
}
|
.pinkbtn{
|
background-color: #FD002F;
|
}
|
}
|
|
.model-tips{
|
width: 100%;
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #999999;
|
margin-bottom: 25rpx;
|
}
|
|
.copy-bar{
|
width: 100%;
|
height: 72rpx;
|
background: #F8F8F8;
|
border-radius: 12rpx;
|
margin-bottom: 30rpx;
|
padding: 0 20rpx;
|
.left-code{
|
font-size: 26rpx;
|
font-weight: 500;
|
color: #FF002C;
|
}
|
.copybtn{
|
width: 158rpx;
|
height: 54rpx;
|
background: #FFFFFF;
|
border-radius: 12rpx;
|
font-size: 26rpx;
|
font-weight: 500;
|
color: #333333;
|
}
|
}
|
}
|
</style>
|
