初始化代码
This commit is contained in:
193
uniapp/uni-app/mine/pages/fx-code.vue
Normal file
193
uniapp/uni-app/mine/pages/fx-code.vue
Normal file
@@ -0,0 +1,193 @@
|
||||
<template>
|
||||
<view class="mine-pages-phone">
|
||||
<uni-nav-bar :fixed="true" :shadow="false" :statusBar="true" :color="`#000`" backgroundColor="#fff">
|
||||
<view class="flex-center" slot="left">
|
||||
<view @tap="toHome"
|
||||
:class="[{'back-user-ios': configInfo.isIos},{'back-user-android': !configInfo.isIos}]">
|
||||
<view class="iconfont icon-home"></view>
|
||||
<view class="back-user_text">回到首页</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-nav-bar>
|
||||
<view style="height:200rpx"></view>
|
||||
<view class="flex-center flex-column">
|
||||
<view class="title c-black">请输入邀请码</view>
|
||||
<view class="confirm-btn radius-16">
|
||||
<input @input="toGetFxInfo" v-model="subForm.fx_code" type="text"
|
||||
class="item-input flex-y-center pl-lg pr-lg f-sm-title c-title" placeholder-class="c-placeholder"
|
||||
:placeholder="rule[0].errorMsg" />
|
||||
</view>
|
||||
|
||||
<view class="fx-user flex-center pd-md mt-md radius-16" :style="{border:`1rpx solid ${primaryColor}`}"
|
||||
v-if="fx_info.id">
|
||||
<image class="avatar md radius" :src="fx_info.avatarUrl"></image>
|
||||
<view class="flex-1 ml-md">
|
||||
<view class="f-title c-title max-476 ellipsis">{{fx_info.fx_name || fx_info.nickName}}</view>
|
||||
<view class="f-caption c-caption">邀请你加入</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="f-caption c-warning mt-md" v-if="isLoad && !fx_info.id">
|
||||
{{subForm.fx_code.length == 7 ? '邀请码无效' :'邀请码为7位数'}}
|
||||
</view>
|
||||
|
||||
<view @tap="submit" class="confirm-btn flex-center f-sm-title text-bold c-base radius-16"
|
||||
:style="{background:subForm.fx_code.length > 0 ? primaryColor:'#CCE9DD'}">确定绑定
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
mapState,
|
||||
mapActions,
|
||||
mapMutations
|
||||
} from "vuex"
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isLoad: false,
|
||||
options: {},
|
||||
fx_info: {},
|
||||
subForm: {
|
||||
fx_code: ''
|
||||
},
|
||||
rule: [{
|
||||
name: "fx_code",
|
||||
checkType: "isNotNull",
|
||||
errorMsg: "请输入邀请码",
|
||||
regText: "邀请码"
|
||||
}],
|
||||
lockTap: false
|
||||
}
|
||||
},
|
||||
computed: mapState({
|
||||
primaryColor: state => state.config.configInfo.primaryColor,
|
||||
subColor: state => state.config.configInfo.subColor,
|
||||
configInfo: state => state.config.configInfo,
|
||||
loginPage: state => state.user.loginPage,
|
||||
}),
|
||||
async onLoad(options) {
|
||||
let {
|
||||
phone
|
||||
} = options
|
||||
this.subForm.phone = phone
|
||||
this.$util.setNavigationBarColor({
|
||||
color: '#000000',
|
||||
bg: '#ffffff'
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['getUserInfo']),
|
||||
...mapMutations(['updateConfigItem']),
|
||||
async initIndex() {},
|
||||
async toGetFxInfo() {
|
||||
let {
|
||||
fx_code
|
||||
} = this.subForm
|
||||
if (fx_code.length == 7) {
|
||||
this.fx_info = await this.$api.user.fxcodeUser({
|
||||
fx_code
|
||||
})
|
||||
} else {
|
||||
this.fx_info = {}
|
||||
}
|
||||
this.isLoad = fx_code.length >= 7
|
||||
},
|
||||
toHome() {
|
||||
this.updateUserItem({
|
||||
key: 'isShowLogin',
|
||||
val: false
|
||||
})
|
||||
this.$util.goUrl({
|
||||
url: this.loginPage,
|
||||
openType: `switchTab`
|
||||
})
|
||||
},
|
||||
//表单验证
|
||||
validate(param) {
|
||||
let validate = new this.$util.Validate();
|
||||
this.rule.map(item => {
|
||||
let {
|
||||
name,
|
||||
} = item
|
||||
validate.add(param[name], item);
|
||||
})
|
||||
let message = validate.start();
|
||||
return message;
|
||||
},
|
||||
async submit() {
|
||||
let param = this.$util.deepCopy(this.subForm)
|
||||
let msg = this.validate(param);
|
||||
if (msg) {
|
||||
this.$util.showToast({
|
||||
title: msg
|
||||
})
|
||||
return
|
||||
}
|
||||
if (param.fx_code.length != 7) {
|
||||
this.$util.showToast({
|
||||
title: `邀请码为7位数`
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.lockTap) return
|
||||
this.lockTap = true
|
||||
this.$util.showLoading()
|
||||
try {
|
||||
await this.$api.user.bindReseller(param)
|
||||
this.$util.hideAll()
|
||||
this.$util.showToast({
|
||||
title: `绑定成功`
|
||||
})
|
||||
this.lockTap = false
|
||||
|
||||
this.updateUserItem({
|
||||
key: 'isShowLogin',
|
||||
val: false
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.$util.goUrl({
|
||||
url: this.loginPage,
|
||||
openType: `switchTab`
|
||||
})
|
||||
}, 1000)
|
||||
} catch (e) {
|
||||
setTimeout(() => {
|
||||
this.lockTap = false
|
||||
this.$util.hideAll()
|
||||
}, 2000)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.mine-pages-phone {
|
||||
.title {
|
||||
font-size: 54rpx;
|
||||
margin: 80rpx 0;
|
||||
}
|
||||
|
||||
.confirm-btn {
|
||||
width: 630rpx;
|
||||
height: 110rpx;
|
||||
background: #F7F7F7;
|
||||
margin-top: 40rpx;
|
||||
|
||||
.item-input {
|
||||
height: 110rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.fx-user {
|
||||
width: 630rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user