|
@@ -25,43 +25,45 @@
|
|
|
</view>
|
|
|
<input type="number" v-model="form.mobile" placeholder="请输入手机号" />
|
|
|
</view>
|
|
|
-
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
<view class="login-input yzm fx-r fx-bc">
|
|
|
<view class="left fx-h fx-ac">
|
|
|
<image class="icon" style="margin-left: 20rpx;" src="/static/img/login-password.png"></image>
|
|
|
</view>
|
|
|
- <input type="text" v-model="form.verify" placeholder="请输入验证码" />
|
|
|
+ <input type="text" v-model="form.verify" placeholder="请输入验证码" />
|
|
|
<view class="line"></view>
|
|
|
<view v-if="verifyCount <= 0" class="sbtn" @tap="getVcode">验证码</view>
|
|
|
<view v-else class="no-sbtn">{{ verifyCount }} S</view>
|
|
|
</view>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
<view class="login-input pass fx-r fx-bc">
|
|
|
<view class="left fx-h fx-ac">
|
|
|
<image class="icon" style="margin-left: 20rpx;" src="/static/img/login-password.png"></image>
|
|
|
</view>
|
|
|
- <input type="text" v-model="form.password" password="*" placeholder="请输入密码" />
|
|
|
+ <input type="text" v-model="form.password" password="*" placeholder="请输入密码" />
|
|
|
<view class="fx-g1"></view>
|
|
|
- <image @tap="showPass = !showPass" :src="showPass ? '/static/img/mis_pass.png' : '/static/img/ck_pass.png' " class="miss-pass"></image>
|
|
|
+ <image @tap="showPass = !showPass"
|
|
|
+ :src="showPass ? '/static/img/mis_pass.png' : '/static/img/ck_pass.png' " class="miss-pass">
|
|
|
+ </image>
|
|
|
</view>
|
|
|
<view class="login-input fx-r" v-if="showData">
|
|
|
<view class="left fx-h fx-ac">
|
|
|
<image class="icon" style="margin-left: 20rpx;" src="/static/img/login-password.png"></image>
|
|
|
</view>
|
|
|
- <input type="text" v-model="form.code" placeholder="请输入邀请码(非必填)" />
|
|
|
+ <input type="text" v-model="form.code" placeholder="请输入邀请码(非必填)" />
|
|
|
</view>
|
|
|
<view class="btn ihover" @tap="tapSubmit">注册账号</view>
|
|
|
<view class="agament fx-r fx-bc fx-ac">
|
|
|
<view @tap="isRead = !isRead" class="fx-r fx-ac fx-bc">
|
|
|
- <image v-if="!isRead" src="/static/img/radio_buttons.png"></image>
|
|
|
- <image v-else src="/static/img/radio_buttons_btn.png"></image>
|
|
|
+ <image v-if="!isRead" src="/static/img/radio_buttons.png"></image>
|
|
|
+ <image v-else src="/static/img/radio_buttons_btn.png"></image>
|
|
|
注册及同意
|
|
|
</view>
|
|
|
- <text @tap="tapOpen" data-url="/pages/operation/user">《用户协议》</text>
|
|
|
- ,认真阅读<text @tap="tapOpen" data-url="/pages/operation/package">《长城易趣拍产品购买协议》</text>
|
|
|
+ <text @tap="tapOpen" data-url="/pages/operation/user">《用户协议》</text>
|
|
|
+ ,认真阅读<text @tap="tapOpen" data-url="/pages/operation/package">《长城易趣拍产品购买协议》</text>
|
|
|
</view>
|
|
|
<view id="captcha"></view>
|
|
|
</view>
|
|
@@ -69,107 +71,147 @@
|
|
|
</view>
|
|
|
</template>
|
|
|
<style lang="scss">
|
|
|
- page{background: #fff;}
|
|
|
- .top-view{
|
|
|
+ page {
|
|
|
+ background: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .top-view {
|
|
|
position: relative;
|
|
|
width: 100vw;
|
|
|
height: 62vw;
|
|
|
- .bg{width: 100vw;height: 62vw;}
|
|
|
- .inner{
|
|
|
+
|
|
|
+ .bg {
|
|
|
+ width: 100vw;
|
|
|
+ height: 62vw;
|
|
|
+ }
|
|
|
+
|
|
|
+ .inner {
|
|
|
position: absolute;
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
- .inner-body{
|
|
|
- position:relative;
|
|
|
- .prv{
|
|
|
+
|
|
|
+ .inner-body {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .prv {
|
|
|
position: absolute;
|
|
|
left: 20rpx;
|
|
|
top: 20rpx;
|
|
|
- .icon-back{
|
|
|
+
|
|
|
+ .icon-back {
|
|
|
width: 60rpx;
|
|
|
height: 60rpx;
|
|
|
}
|
|
|
}
|
|
|
- .logo{
|
|
|
+
|
|
|
+ .logo {
|
|
|
width: 200rpx;
|
|
|
height: 119rpx;
|
|
|
margin-bottom: 40rpx;
|
|
|
margin-top: 60rpx;
|
|
|
- image{width: 100%;height: 100%;}
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
}
|
|
|
- .label-text{
|
|
|
+
|
|
|
+ .label-text {
|
|
|
font-size: 42rpx;
|
|
|
color: #FFFFFF;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
- .body{
|
|
|
+
|
|
|
+ .body {
|
|
|
position: relative;
|
|
|
background: #fff;
|
|
|
border-radius: 80rpx 80rpx 0px 0px;
|
|
|
top: -120rpx;
|
|
|
z-index: 9;
|
|
|
height: 500px;
|
|
|
- .h120{height: 100rpx;}
|
|
|
-
|
|
|
- .input-view{
|
|
|
+
|
|
|
+ .h120 {
|
|
|
+ height: 100rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .input-view {
|
|
|
padding: 0px 60rpx;
|
|
|
- .login-input{
|
|
|
+
|
|
|
+ .login-input {
|
|
|
border-radius: 70rpx;
|
|
|
border: 1px solid #E0E0E0;
|
|
|
padding: 30rpx 46rpx;
|
|
|
margin-bottom: 50rpx;
|
|
|
- .left{
|
|
|
- .label{
|
|
|
+
|
|
|
+ .left {
|
|
|
+ .label {
|
|
|
font-size: 28rpx;
|
|
|
color: #DB292B;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
- .loginv{width: 15rpx;height: 12rpx;margin-left: 14rpx;}
|
|
|
- .icon{width: 30rpx;height: 33rpx;}
|
|
|
+
|
|
|
+ .loginv {
|
|
|
+ width: 15rpx;
|
|
|
+ height: 12rpx;
|
|
|
+ margin-left: 14rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon {
|
|
|
+ width: 30rpx;
|
|
|
+ height: 33rpx;
|
|
|
+ }
|
|
|
+
|
|
|
width: 90rpx;
|
|
|
}
|
|
|
- input{
|
|
|
+
|
|
|
+ input {
|
|
|
width: calc(100% - 90rpx);
|
|
|
}
|
|
|
-
|
|
|
- &.yzm{
|
|
|
- input{
|
|
|
+
|
|
|
+ &.yzm {
|
|
|
+ input {
|
|
|
width: calc(100% - 90rpx - 22rpx - 80rpx);
|
|
|
}
|
|
|
- .line{
|
|
|
+
|
|
|
+ .line {
|
|
|
width: 1px;
|
|
|
height: 36rpx;
|
|
|
background: #eee;
|
|
|
margin-right: 20rpx;
|
|
|
}
|
|
|
- .sbtn{
|
|
|
+
|
|
|
+ .sbtn {
|
|
|
font-size: 12px;
|
|
|
color: #DB292B;
|
|
|
}
|
|
|
- .no-sbtn{
|
|
|
+
|
|
|
+ .no-sbtn {
|
|
|
font-size: 12px;
|
|
|
color: #999999;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
-
|
|
|
- &.pass{
|
|
|
- input{
|
|
|
+
|
|
|
+
|
|
|
+ &.pass {
|
|
|
+ input {
|
|
|
width: calc(100% - 180rpx);
|
|
|
}
|
|
|
- .miss-pass{width: 60rpx;height: 60rpx}
|
|
|
+
|
|
|
+ .miss-pass {
|
|
|
+ width: 60rpx;
|
|
|
+ height: 60rpx
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
- .btn{
|
|
|
+
|
|
|
+ .btn {
|
|
|
background: #DB292B;
|
|
|
border-radius: 60rpx;
|
|
|
text-align: center;
|
|
@@ -178,100 +220,138 @@
|
|
|
padding: 30rpx 0;
|
|
|
color: #FAFAFA;
|
|
|
}
|
|
|
-
|
|
|
- .agament{
|
|
|
+
|
|
|
+ .agament {
|
|
|
margin-top: 40rpx;
|
|
|
- image{width: 36rpx;height: 36rpx;margin-right: 20rpx;}
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 36rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ margin-right: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
color: #999999;
|
|
|
font-size:24rpx;
|
|
|
- text{color: #DB292B;}
|
|
|
+
|
|
|
+ text {
|
|
|
+ color: #DB292B;
|
|
|
+ }
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .miss-pass {
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mb-view {
|
|
|
+ font-size: 14px;
|
|
|
+ margin-top: 30px;
|
|
|
+ padding: 0px 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mb-view .link {
|
|
|
+ color: #DB292B;
|
|
|
}
|
|
|
- .miss-pass{width: 30px;height: 30px;}
|
|
|
- .mb-view{font-size: 14px; margin-top: 30px;padding: 0px 5px;}
|
|
|
- .mb-view .link{color: #DB292B;}
|
|
|
-
|
|
|
</style>
|
|
|
|
|
|
<script>
|
|
|
import maoScroll from '@/components/mao-scroll/mao-scroll.vue';
|
|
|
import customerWiget from '@/components/ui-public/customer-wiget.vue';
|
|
|
- import { mapState, mapMutations } from 'vuex';
|
|
|
+ import {
|
|
|
+ mapState,
|
|
|
+ mapMutations
|
|
|
+ } from 'vuex';
|
|
|
export default {
|
|
|
components: {
|
|
|
maoScroll,
|
|
|
customerWiget
|
|
|
},
|
|
|
- computed:mapState(['showData']),
|
|
|
+ computed: {
|
|
|
+ ...mapState(['showData']),
|
|
|
+ getWebSocket() {
|
|
|
+ // #ifdef APP-PLUS
|
|
|
+ const webSocket = getApp().globalData.webSocket
|
|
|
+ // #endif
|
|
|
+ // #ifndef APP-PLUS
|
|
|
+ const webSocket = this.webSocket
|
|
|
+ // #endif
|
|
|
+ return webSocket
|
|
|
+ }
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
statusBarHeight: 20,
|
|
|
- form:{
|
|
|
- mobile : "",
|
|
|
- password : "",
|
|
|
- verify : "",
|
|
|
- code : ""
|
|
|
+ form: {
|
|
|
+ mobile: "",
|
|
|
+ password: "",
|
|
|
+ verify: "",
|
|
|
+ code: ""
|
|
|
},
|
|
|
- isRead : false,
|
|
|
- verifyCount : 0,
|
|
|
- showPass : false,
|
|
|
- captchaIns : null,
|
|
|
- validate : "",
|
|
|
+ isRead: false,
|
|
|
+ verifyCount: 0,
|
|
|
+ showPass: false,
|
|
|
+ captchaIns: null,
|
|
|
+ validate: "",
|
|
|
}
|
|
|
},
|
|
|
onLoad() {
|
|
|
this.initView();
|
|
|
- this.$nextTick(()=>{
|
|
|
+ this.$nextTick(() => {
|
|
|
this.initNeCaptcha();
|
|
|
});
|
|
|
},
|
|
|
methods: {
|
|
|
- ...mapMutations(['setSys','setUser']),
|
|
|
+ ...mapMutations(['setSys', 'setUser']),
|
|
|
initView: function() {
|
|
|
uni.getSystemInfo({
|
|
|
success: (res) => {
|
|
|
this.statusBarHeight = res.statusBarHeight;
|
|
|
}
|
|
|
- });
|
|
|
+ });
|
|
|
},
|
|
|
- initNeCaptcha () {
|
|
|
+ initNeCaptcha() {
|
|
|
// #ifdef H5
|
|
|
- const options = {
|
|
|
- captchaId: 'c6af8490405544f8a169504b11c86fdc',
|
|
|
- element: '#captcha',
|
|
|
- protocol: 'https',
|
|
|
- onVerify: (err, data) => {
|
|
|
- if(data != null || data != "") {
|
|
|
- this.validate = data.validate;
|
|
|
- this.getVcode2();
|
|
|
- }
|
|
|
+ const options = {
|
|
|
+ captchaId: 'c6af8490405544f8a169504b11c86fdc',
|
|
|
+ element: '#captcha',
|
|
|
+ protocol: 'https',
|
|
|
+ onVerify: (err, data) => {
|
|
|
+ if (data != null || data != "") {
|
|
|
+ this.validate = data.validate;
|
|
|
+ this.getVcode2();
|
|
|
}
|
|
|
}
|
|
|
- options.mode = 'popup';
|
|
|
- initNECaptcha({ ...options }, ins => {
|
|
|
- this.captchaIns = ins
|
|
|
- })
|
|
|
+ }
|
|
|
+ options.mode = 'popup';
|
|
|
+ initNECaptcha({
|
|
|
+ ...options
|
|
|
+ }, ins => {
|
|
|
+ this.captchaIns = ins
|
|
|
+ })
|
|
|
// #endif
|
|
|
-
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
// #ifdef APP
|
|
|
- this.captchaIns = uni.requireNativePlugin('YD-Captcha')
|
|
|
- this.captchaIns.init({
|
|
|
- captcha_id: 'c6af8490405544f8a169504b11c86fdc',
|
|
|
- is_no_sense_mode: false
|
|
|
- });
|
|
|
+ this.captchaIns = uni.requireNativePlugin('YD-Captcha')
|
|
|
+ this.captchaIns.init({
|
|
|
+ captcha_id: 'c6af8490405544f8a169504b11c86fdc',
|
|
|
+ is_no_sense_mode: false
|
|
|
+ });
|
|
|
// #endif
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
/**
|
|
|
* 注册
|
|
|
*/
|
|
|
- tapReg:function(){
|
|
|
- uni.navigateTo({ url:"./register" });
|
|
|
+ tapReg: function() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: "./register"
|
|
|
+ });
|
|
|
},
|
|
|
-
|
|
|
- getVcode:function(){
|
|
|
+
|
|
|
+ getVcode: function() {
|
|
|
if (this.verifyCount > 0) return;
|
|
|
if (!this.utils.isPoneAvailable(this.form.mobile)) {
|
|
|
return uni.showToast({
|
|
@@ -280,15 +360,15 @@
|
|
|
icon: 'none'
|
|
|
});
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// #ifdef H5
|
|
|
- this.captchaIns.popUp();
|
|
|
+ this.captchaIns.popUp();
|
|
|
// #endif
|
|
|
-
|
|
|
+
|
|
|
// #ifdef APP
|
|
|
- this.captchaIns.showCaptcha((data)=>{
|
|
|
+ this.captchaIns.showCaptcha((data) => {
|
|
|
var method = data.method;
|
|
|
- if(method == "onSuccess"){
|
|
|
+ if (method == "onSuccess") {
|
|
|
var data = data.data;
|
|
|
this.validate = data.validate;
|
|
|
this.getVcode2();
|
|
@@ -302,7 +382,10 @@
|
|
|
});
|
|
|
this
|
|
|
.request
|
|
|
- .post("getYzm", { mobile: this.form.mobile,validate : this.validate})
|
|
|
+ .post("getYzm", {
|
|
|
+ mobile: this.form.mobile,
|
|
|
+ validate: this.validate
|
|
|
+ })
|
|
|
.then(res => {
|
|
|
uni.hideLoading();
|
|
|
if (res.code == 200) {
|
|
@@ -311,7 +394,7 @@
|
|
|
this.verifyCount = e;
|
|
|
});
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
if (res.data.status == 1) {
|
|
|
this.utils.CountDowm(120, (e, s) => {
|
|
|
this.verifyCount = e;
|
|
@@ -342,28 +425,32 @@
|
|
|
let url = ev.currentTarget.dataset.url;
|
|
|
this.utils.navigateTo(url);
|
|
|
},
|
|
|
-
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
/**
|
|
|
* 提交数据
|
|
|
*/
|
|
|
- tapSubmit:function(){
|
|
|
+ tapSubmit: function() {
|
|
|
//手机号码
|
|
|
- if(this.form.mobile == ""){
|
|
|
+ if (this.form.mobile == "") {
|
|
|
uni.showToast({
|
|
|
- title:"请输入手机号码",icon:"none",mask:true
|
|
|
+ title: "请输入手机号码",
|
|
|
+ icon: "none",
|
|
|
+ mask: true
|
|
|
})
|
|
|
return;
|
|
|
}
|
|
|
//手机验证号码
|
|
|
//this.form.mobile
|
|
|
- if(!this.utils.isPoneAvailable(this.form.mobile) ){
|
|
|
+ if (!this.utils.isPoneAvailable(this.form.mobile)) {
|
|
|
uni.showToast({
|
|
|
- title:"请输入正确的手机号码",icon:"none",mask:true
|
|
|
+ title: "请输入正确的手机号码",
|
|
|
+ icon: "none",
|
|
|
+ mask: true
|
|
|
})
|
|
|
return;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
if (this.form.password == '') {
|
|
|
uni.showToast({
|
|
|
title: '请输入密码',
|
|
@@ -372,7 +459,7 @@
|
|
|
});
|
|
|
return;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// if (this.form.code == '') {
|
|
|
// uni.showToast({
|
|
|
// title: '请填写推荐码',
|
|
@@ -381,36 +468,48 @@
|
|
|
// });
|
|
|
// return;
|
|
|
// }
|
|
|
-
|
|
|
- if(!this.isRead){
|
|
|
+
|
|
|
+ if (!this.isRead) {
|
|
|
uni.showToast({
|
|
|
- title:"请阅读并同意相关政策",icon:"none",mask:true
|
|
|
+ title: "请阅读并同意相关政策",
|
|
|
+ icon: "none",
|
|
|
+ mask: true
|
|
|
})
|
|
|
return;
|
|
|
}
|
|
|
-
|
|
|
- uni.showLoading({ title: '登录中..' });
|
|
|
- this.request
|
|
|
- .post("register",this.form)
|
|
|
- .then(res=>{
|
|
|
- uni.hideLoading();
|
|
|
- if(res.code == 200) {
|
|
|
- this.setUser(res.data);
|
|
|
- this.webSocket.connect();
|
|
|
- uni.reLaunch({ url:"../index/index"});
|
|
|
- } else {
|
|
|
- uni.showToast({ title:res.msg,icon:"none",mask:true});
|
|
|
- }
|
|
|
- })
|
|
|
- .catch(res=>{
|
|
|
- uni.hideLoading();
|
|
|
- uni.showModal({title: '系统提示',content: '加载失败,重新点击尝试!',showCancel: false});
|
|
|
+
|
|
|
+ uni.showLoading({
|
|
|
+ title: '登录中..'
|
|
|
});
|
|
|
-
|
|
|
+ this.request
|
|
|
+ .post("register", this.form)
|
|
|
+ .then(res => {
|
|
|
+ uni.hideLoading();
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.setUser(res.data);
|
|
|
+ this.getWebSocket.connect();
|
|
|
+ uni.reLaunch({
|
|
|
+ url: "../index/index"
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ title: res.msg,
|
|
|
+ icon: "none",
|
|
|
+ mask: true
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(res => {
|
|
|
+ uni.hideLoading();
|
|
|
+ uni.showModal({
|
|
|
+ title: '系统提示',
|
|
|
+ content: '加载失败,重新点击尝试!',
|
|
|
+ showCancel: false
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
-</script>
|
|
|
-
|
|
|
-
|
|
|
+</script>
|