### 注冊
```
<template>
<view class="content">
<view class="logo">
<image src="/static/image/logo.png"></image>
</view>
<view class="from">
<view class="input-controls">
<image class="img" src="/static/image/account.png"></image>
<input class="input" v-model="username" type="text" placeholder="昵稱" />
</view>
<view class="input-controls">
<image class="img" src="/static/image/phone.png"></image>
<input class="input" v-model="mobile" type="number" maxlength="11" placeholder="手機號" />
</view>
<view class="input-controls">
<image class="img" src="/static/image/pwd.png"></image>
<input class="input" v-model="password" type="text" maxlength="32" placeholder="登錄密碼" :password="!showPassword" />
<image class="img" :src="showPassword?'/static/image/open.png':'/static/image/close.png'" @tap="pwd"></image>
</view>
<view class="input-controls">
<image class="img" src="/static/image/pwd.png"></image>
<input class="input" v-model="repassword" type="text" maxlength="32" placeholder="確認登錄密碼" :password="!showrePassword" />
<image class="img" :src="showrePassword?'/static/image/open.png':'/static/image/close.png'" @tap="repwd"></image>
</view>
<view class="input-controls">
<image class="img" src="/static/image/pwd.png"></image>
<input class="input" v-model="pay_pwd" type="text" maxlength="32" placeholder="支付密碼" :password="!showpayPassword" />
<image class="img" :src="showpayPassword?'/static/image/open.png':'/static/image/close.png'" @tap="paypwd"></image>
</view>
<view class="input-controls">
<image class="img" src="/static/image/pwd.png"></image>
<input class="input" v-model="repay_pwd" type="text" maxlength="32" placeholder="確認支付密碼" :password="!showrepayPassword" />
<image class="img" :src="showrepayPassword?'/static/image/open.png':'/static/image/close.png'" @tap="repaypwd"></image>
</view>
<view class="input-controls">
<image class="img" src="/static/image/verify.png"></image>
<input class="input" v-model="code" type="number" maxlength="6" placeholder="驗證碼" />
<view class="yzm" :class="{ yzms: second>0 }" @tap="getcode">{{yanzhengma}}</view>
</view>
<view class="input-controls">
<image class="img" src="/static/image/phone.png"></image>
<input class="input" v-model="p_mobile" type="text" maxlength="11" placeholder="推薦人手機號碼" />
</view>
</view>
<view class="btn" hover-class="btn-hover" @tap="reg">
<text>注冊</text>
</view>
<view class="txt">
<image @tap="xieyitong" :src="xieyi==true?'/static/image/ty1.png':'/static/image/ty0.png'"></image>
<text @tap="xieyitong"> 同意</text>
<navigator url="blog?id=1" open-type="navigate">《軟件用戶協議》</navigator>
</view>
</view>
</template>
<script>
import md5 from "@/common/SDK/md5.min.js";
var tha, js;
export default {
onLoad() {
tha = this;
},
onUnload() {
clearInterval(js)
this.second = 0;
},
data() {
return {
username: '',
mobile: '',
password: '',
code: '',
p_mobile: '',
xieyi: true,
showPassword: false,
showrePassword: false,
showpayPassword: false,
showrepayPassword: false,
second: 0
};
},
computed: {
yanzhengma() {
if (this.second == 0) {
return '獲取驗證碼';
} else {
if (this.second < 1) {
return '重新獲取0' + this.second;
} else {
return '重新獲取' + this.second;
}
}
}
},
methods: {
pwd() {
this.showPassword = !this.showPassword
},
repwd() {
this.showrePassword = !this.showrePassword
},
paypwd() {
this.showpayPassword = !this.showpayPassword
},
repaypwd() {
this.showrepayPassword = !this.showrepayPassword
},
xieyitong() {
this.xieyi = !this.xieyi;
},
getcode() {
if (this.second > 0) {
return;
}
this.second = 60;
uni.request({
url: this.$url + '/api/v1.sms/getsms', // 獲取短信接口
data: {
mobile: this.mobile,
type:1
},
method: 'POST',
dataType: 'json',
success: (res) => {
// console.log(res.data);
if (res.data.code != 1) {
uni.showToast({
title: res.data.msg,
icon: 'none'
});
} else {
uni.showToast({
title: res.data.msg
});
js = setInterval(function() {
tha.second--;
if (tha.second == 0) {
clearInterval(js)
}
}, 1000)
}
}
});
},
reg() {
if (this.username == "" || this.username == null || this.username == undefined) {
uni.showToast({
icon: 'none',
title: '昵稱不能為空'
});
return;
}
if (this.xieyi == false) {
uni.showToast({
icon: 'none',
title: '請先閱讀《軟件用戶協議》'
});
return;
}
if (this.mobile.length != 11) {
uni.showToast({
icon: 'none',
title: '手機號不正確'
});
return;
}
if (this.password.length < 6) {
uni.showToast({
icon: 'none',
title: '密碼長度必須6-20位'
});
return;
}
if (this.username == "" || this.username == null || this.username == undefined) {
uni.showToast({
icon: 'none',
title: '請輸入驗證碼'
});
return;
}
uni.request({
url: global.host +'/api/v1.login/reg',
data: {
username: this.username,
mobile: this.mobile,
password: md5(this.password),
repassword: md5(this.repassword),
pay_pwd: md5(this.pay_pwd),
repay_pwd: md5(this.repay_pwd),
code: this.code,
p_mobile: this.p_mobile
},
method: 'POST',
dataType: 'json',
success: (res) => {
console.log(res);
if (res.data.code != 1) {
uni.showToast({
title: res.data.msg,
icon: 'none'
});
} else {
uni.showToast({
title: res.data.msg
});
setTimeout(function() {
uni.navigateBack();
}, 1500)
}
}
});
}
}
}
</script>
<style>
@import url("../../static/css/common.css");
</style>
```
