Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
12c9ed1b by simon
Options

用户体系样式/文案

1 parent 035a0a77
Inline Side-by-side
Showing 8 changed files with 652 additions and 584 deletions
...@@ -191,10 +191,10 @@ module.exports = { ...@@ -191,10 +191,10 @@ module.exports = {
191 }, 191 },
192 login: { 192 login: {
193 title: "PingAn Account Member Service", 193 title: "PingAn Account Member Service",
194 loginType1: "Login with user name and password", 194 loginType1: "Dynamic password login",
195 loginType2: "Dynamic password login", 195 loginType2: "Dynamic password login",
196 account: "Account", 196 account: "Account",
197 accountPlaceholder: "Please enter Mobile no.", 197 accountPlaceholder: "Please enter user name",
198 password: "Password", 198 password: "Password",
199 passwordPlaceholder: "Please enter password", 199 passwordPlaceholder: "Please enter password",
200 verifyPlaceholder: "Please enter password", 200 verifyPlaceholder: "Please enter password",
...@@ -206,8 +206,9 @@ module.exports = { ...@@ -206,8 +206,9 @@ module.exports = {
206 mobile: "Mobile no.", 206 mobile: "Mobile no.",
207 mobilePlaceholder: "Please enter Mobile no", 207 mobilePlaceholder: "Please enter Mobile no",
208 verifyCode: "SMS verification code", 208 verifyCode: "SMS verification code",
209 verifyCodePlaceholder: "SMS verification code", 209 verifyCodePlaceholder: "Please enter verification code",
210 verifyCodeGet: "Get SMS verification code", 210 verifyCodeGet: "Get verification codee",
211 SMSVerificationCode:"SMS verification code",
211 tips: { 212 tips: {
212 e1: "Please enter account", 213 e1: "Please enter account",
213 e2: "Please enter the password", 214 e2: "Please enter the password",
...@@ -221,7 +222,8 @@ module.exports = { ...@@ -221,7 +222,8 @@ module.exports = {
221 oe2: "Please enter the picture verification code", 222 oe2: "Please enter the picture verification code",
222 oe3: "Please enter the picture verification code", 223 oe3: "Please enter the picture verification code",
223 oe4: "Your verify code is not correct. Please try again", 224 oe4: "Your verify code is not correct. Please try again",
224 } 225 },
226 accountPlaceholder:"Please setup user name ",
225 }, 227 },
226 session: { 228 session: {
227 sidExpire: "It has not been operated for a long time. For the sake of your account security, please restart", 229 sidExpire: "It has not been operated for a long time. For the sake of your account security, please restart",
......
...@@ -193,23 +193,24 @@ module.exports = { ...@@ -193,23 +193,24 @@ module.exports = {
193 }, 193 },
194 login: { 194 login: {
195 title: "平安賬戶", 195 title: "平安賬戶",
196 loginType1: "賬密登入", 196 loginType1: "動態密碼登錄",
197 loginType2: "動態密碼登入", 197 loginType2: "動態密碼登入",
198 account: "賬號", 198 account: "賬號",
199 accountPlaceholder: "請輸入手機號", 199 accountPlaceholder: "請輸入用戶名稱",
200 password: "密碼", 200 password: "密碼",
201 passwordPlaceholder: "輸入登入密碼", 201 passwordPlaceholder: "輸入登入密碼",
202 verifyPlaceholder: "請輸入驗證碼", 202 verifyPlaceholder: "請輸入驗證碼",
203 agree: "同意", 203 agree: "同意",
204 protocol: "《平安香港會員網上帳戶服務協定》", 204 protocol: "《平安香港會員網上帳戶服務協定》",
205 login: "登入", 205 login: "登錄",
206 register: "註冊", 206 register: "註冊",
207 forget: "忘記密碼", 207 forget: "忘記密碼",
208 mobile: "手機號", 208 mobile: "手機號",
209 mobilePlaceholder: "手機號", 209 mobilePlaceholder: "手機號",
210 verifyCode: "驗證碼", 210 verifyCode: "驗證碼",
211 verifyCodePlaceholder: "驗證碼", 211 verifyCodePlaceholder: "請輸入驗證碼",
212 verifyCodeGet: "獲取驗證碼", 212 verifyCodeGet: "獲取驗證碼",
213 SMSVerificationCode:"手機短信驗證碼",
213 tips: { 214 tips: {
214 e1: "請輸入賬號信息", 215 e1: "請輸入賬號信息",
215 e2: "請輸入密碼", 216 e2: "請輸入密碼",
...@@ -266,7 +267,8 @@ module.exports = { ...@@ -266,7 +267,8 @@ module.exports = {
266 e10: "驗證碼過期，請重新申請驗證碼", 267 e10: "驗證碼過期，請重新申請驗證碼",
267 e11: "註冊失敗，請聯繫工作人員", 268 e11: "註冊失敗，請聯繫工作人員",
268 e12: "註冊成功" 269 e12: "註冊成功"
269 } 270 },
271 accountPlaceholder:"請設置用戶名稱",
270 }, 272 },
271 session: { 273 session: {
272 sidExpire: "長時間未操作，為了您賬戶的安全，請登入後再操作" 274 sidExpire: "長時間未操作，為了您賬戶的安全，請登入後再操作"
......
...@@ -193,10 +193,10 @@ module.exports = { ...@@ -193,10 +193,10 @@ module.exports = {
193 }, 193 },
194 login: { 194 login: {
195 title: "平安账户", 195 title: "平安账户",
196 loginType1: "账密登入", 196 loginType1: "动态密码登录",
197 loginType2: "动态密码登入", 197 loginType2: "动态密码登入",
198 account: "账号", 198 account: "账号",
199 accountPlaceholder: "请输入手机号", 199 accountPlaceholder: "请输入用户名称",
200 password: "密码", 200 password: "密码",
201 passwordPlaceholder: "输入登入密码", 201 passwordPlaceholder: "输入登入密码",
202 verifyPlaceholder: "请输入验证码", 202 verifyPlaceholder: "请输入验证码",
...@@ -208,8 +208,9 @@ module.exports = { ...@@ -208,8 +208,9 @@ module.exports = {
208 mobile: "手机号", 208 mobile: "手机号",
209 mobilePlaceholder: "手机号", 209 mobilePlaceholder: "手机号",
210 verifyCode: "验证码", 210 verifyCode: "验证码",
211 verifyCodePlaceholder: "验证码", 211 verifyCodePlaceholder: "请输入验证码",
212 verifyCodeGet: "获取验证码", 212 verifyCodeGet: "获取验证码",
213 SMSVerificationCode:"手机短信验证码",
213 tips: { 214 tips: {
214 e1: "请输入账号信息", 215 e1: "请输入账号信息",
215 e2: "请输入密码", 216 e2: "请输入密码",
...@@ -269,7 +270,8 @@ module.exports = { ...@@ -269,7 +270,8 @@ module.exports = {
269 e10: "验证码过期，请重新申请验证码", 270 e10: "验证码过期，请重新申请验证码",
270 e11: "注册失败，请联系工作人员", 271 e11: "注册失败，请联系工作人员",
271 e12: "註冊成功" 272 e12: "註冊成功"
272 } 273 },
274 accountPlaceholder:"请设置用户名称",
273 }, 275 },
274 passwordCheck: { 276 passwordCheck: {
275 error1: "密码长度不少于8位", 277 error1: "密码长度不少于8位",
......
...@@ -91,7 +91,9 @@ ...@@ -91,7 +91,9 @@
91 91
92 &-tit { 92 &-tit {
93 flex: 1; 93 flex: 1;
94 font-size: $fontSizeTitle; 94 // font-size: $fontSizeTitle;
95 // font-size: $fontSizeTitle-M2;
96 font-size: $fontSize-M2;
95 font-weight: bold; 97 font-weight: bold;
96 } 98 }
97 99
...@@ -104,12 +106,13 @@ ...@@ -104,12 +106,13 @@
104 &-protocol { 106 &-protocol {
105 margin: 36px auto 0; 107 margin: 36px auto 0;
106 display: flex; 108 display: flex;
107 align-items: center; 109 // align-items: center;
108 // padding-left: 12px; 110 // padding-left: 12px;
109 111
110 .check { 112 .check {
111 height: 12px; 113 height: 12px;
112 margin-right: 6px; 114 margin-right: 7.2px;
115 margin-top: 4px;
113 } 116 }
114 117
115 .protocol { 118 .protocol {
......
1 1
2 <template> 2 <template>
3 <div> 3 <div>
4 <modal-comp :visible="modalVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback"></modal-comp> 4 <modal-comp :visible="modalVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback"></modal-comp>
5 <modal-simple-comp :visible="modalSimpleVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="closeModal" :overlay="closeModal" :close="closeModal"></modal-simple-comp> 5 <modal-simple-comp :visible="modalSimpleVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="closeModal" :overlay="closeModal" :close="closeModal"></modal-simple-comp>
6 <modal-upload-card-comp :visible="modalUploadCardVisiable" :show-confirm="true" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback" :close="closeCallback"></modal-upload-card-comp> 6 <modal-upload-card-comp :visible="modalUploadCardVisiable" :show-confirm="true" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback" :close="closeCallback"></modal-upload-card-comp>
7 <!-- 会员协议 --> 7 <!-- 会员协议 -->
8 <modal-protocol-comp :visible="modalProtocolVisiable" :overlay="closeModal" :close="closeModal"></modal-protocol-comp> 8 <modal-protocol-comp :visible="modalProtocolVisiable" :overlay="closeModal" :close="closeModal"></modal-protocol-comp>
9 9
10 <div class="ebg"></div> 10 <div class="ebg"></div>
11 <div class="content"> 11 <div class="content">
12 <div class="top-space"></div> 12 <div class="top-space"></div>
13 <div class="box"> 13 <div class="box">
14 <!-- 帐密登陆 --> 14 <!-- 帐密登陆 -->
15 <div v-if="type == 1" class="login"> 15 <div v-if="type == 1" class="login">
16 <template v-if="!oneAccountCenterOff"> 16 <template v-if="!oneAccountCenterOff">
17 <div class="login-tit"> 17 <div class="login-tit">
18 <img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png"> 18 <img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png">
19 <img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png"> 19 <img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png">
20 <img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png"> 20 <img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png">
21 </div> 21 </div>
22 <div class="login-nav"> 22 <div class="login-nav">
23 <div @click="onLoginTypeHandler(1)" class="login-nav-tit text-r pointer active">{{$t('login.loginType1')}}</div> 23 <div @click="onLoginTypeHandler(1)" class="login-nav-tit text-r pointer active">{{$t('login.loginType1')}}</div>
24 <div class="login-nav-v-line"></div> 24 <div class="login-nav-v-line"></div>
25 <div @click="onLoginTypeHandler(2)" class="login-nav-tit pointer">{{$t('login.loginType2')}}</div> 25 <div @click="onLoginTypeHandler(2)" class="login-nav-tit pointer">{{$t('login.loginType2')}}</div>
26 </div> 26 </div>
27 <div class="gird-g form"> 27 <div class="gird-g form">
28 <div class="pure-u-1 form-item"> 28 <div class="pure-u-1 form-item">
29 <div class="label"> 29 <div class="label">
30 <img src="@/assets/images/login/icon-login-user.png"> {{$t('login.account')}} 30 <img src="@/assets/images/login/icon-login-user.png"> {{$t('login.account')}}
31 </div> 31 </div>
32 <div class="ipt-wrap"> 32 <div class="ipt-wrap">
33 <input v-model="loginForm.userId" :placeholder="$t('login.accountPlaceholder')" class="ipt" :class="{ err : errorTips.e1.length > 0 }" type="text" @blur="userIdLegalCheck"> 33 <input v-model="loginForm.userId" :placeholder="$t('login.accountPlaceholder')" class="ipt" :class="{ err : errorTips.e1.length > 0 }" type="text" @blur="userIdLegalCheck">
34 </div> 34 </div>
35 <div class="validator" v-if="errorTips.e1.length > 0 "> 35 <div class="validator" v-if="errorTips.e1.length > 0 ">
36 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.e1}} 36 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.e1}}
37 </div> 37 </div>
38 </div> 38 </div>
39 <div class="pure-u-1 form-item"> 39 <div class="pure-u-1 form-item">
40 <div class="label"> 40 <div class="label">
41 <img src="@/assets/images/login/icon-login-password.png"> {{$t('login.password')}} 41 <img src="@/assets/images/login/icon-login-password.png"> {{$t('login.password')}}
42 </div> 42 </div>
43 <div class="ipt-wrap"> 43 <div class="ipt-wrap">
44 <input v-model="loginForm.password" :placeholder="$t('login.passwordPlaceholder')" class="ipt" :class="{ err : errorTips.e2.length > 0 }" type="password"> 44 <input v-model="loginForm.password" :placeholder="$t('login.passwordPlaceholder')" class="ipt" :class="{ err : errorTips.e2.length > 0 }" type="password">
45 </div> 45 </div>
46 <div class="validator" v-if="errorTips.e2.length > 0 "> 46 <div class="validator" v-if="errorTips.e2.length > 0 ">
47 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.e2}} 47 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.e2}}
48 </div> 48 </div>
49 </div> 49 </div>
50 <div class="pure-u-1 form-item" v-if="type == 1 && loginCheck.showImageCode"> 50 <div class="pure-u-1 form-item" v-if="type == 1 && loginCheck.showImageCode">
51 <div class="ipt-wrap"> 51 <div class="ipt-wrap">
52 <input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" :class="{ err : errorTips.e3.length > 0 }" type="text" v-model="loginForm.imageValue"> 52 <input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" :class="{ err : errorTips.e3.length > 0 }" type="text" v-model="loginForm.imageValue">
53 <div class="ipt verify-btn pointer vcode" @click="handlerRefreshImageValue"> 53 <div class="ipt verify-btn pointer vcode" @click="handlerRefreshImageValue">
54 <img :src="values.imageBase64"> 54 <img :src="values.imageBase64">
55 </div> 55 </div>
56 </div> 56 </div>
57 <div class="validator" v-if="errorTips.e3.length > 0 "> 57 <div class="validator" v-if="errorTips.e3.length > 0 ">
58 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.e3}} 58 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.e3}}
59 </div> 59 </div>
60 </div> 60 </div>
61 </div> 61 </div>
62 <div class="login-protocol pointer" :class="{loginLeft:locale!='en'}" @click="loginCheck.agreeProtocol = !loginCheck.agreeProtocol"> 62 <div class="login-protocol pointer" :class="{loginLeft:locale!='en'}" @click="loginCheck.agreeProtocol = !loginCheck.agreeProtocol">
63 <img v-if="!loginCheck.agreeProtocol" class="check" src="@/assets/images/login/uncheck.png"> 63 <img v-if="!loginCheck.agreeProtocol" class="check" src="@/assets/images/login/uncheck.png">
64 <img v-if="loginCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png">{{$t('login.agree')}} &nbsp; 64 <img v-if="loginCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png">{{$t('login.agree')}} &nbsp;
65 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span> 65 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span>
66 </div> 66 </div>
67 <div @click="handlerLogin()" class="login-submit pointer flex-center" :class="{disabled: pwdLoginDisabled}"> 67 <div @click="handlerLogin()" class="login-submit pointer flex-center" :class="{disabled: pwdLoginDisabled}">
68 <van-loading v-if="loading" /> 68 <van-loading v-if="loading" />
69 <span>{{$t('login.login')}}</span> 69 <span>{{$t('login.login')}}</span>
70 </div> 70 </div>
71 <div class="login-func"> 71 <div class="login-func">
72 <div @click="toRegisterPage()" class="login-func-btn pointer">{{$t('login.register')}}</div> 72 <div @click="toRegisterPage()" class="login-func-btn pointer">{{$t('login.register')}}</div>
73 <div @click="onForgetHandler()" class="login-func-btn pointer">{{$t('login.forget')}}</div> 73 <div @click="onForgetHandler()" class="login-func-btn pointer">{{$t('login.forget')}}</div>
74 </div> 74 </div>
75 </template> 75 </template>
76 <template v-else> 76 <template v-else>
77 <!-- 不接入一账通 -->
78 <div class="login-nav">
79 <div class="login-nav-tit text-c pointer active">{{$t('login.loginType1')}}</div>
80 </div>
81 <div class="gird-g form">
82 <div class="pure-u-1 form-item">
83 <div class="label">
84 <img src="@/assets/images/login/icon-login-user.png"> {{$t('login.account')}}
85 </div>
86 <div class="ipt-wrap">
87 <input v-model="loginForm.userId" :placeholder="$t('login.accountPlaceholder')" class="ipt" :class="{ err : errorTips.e1.length > 0 }" type="text" @blur="userIdLegalCheck">
88 </div>
89 <div class="validator" v-if="errorTips.e1.length > 0 ">
90 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.e1}}
91 </div>
92 </div>
93 <div class="pure-u-1 form-item">
94 <div class="label">
95 <img src="@/assets/images/login/icon-login-password.png"> {{$t('login.password')}}
96 </div>
97 <div class="ipt-wrap">
98 <input v-model="loginForm.password" :placeholder="$t('login.passwordPlaceholder')" class="ipt" :class="{ err : errorTips.e2.length > 0 }" type="password">
99 </div>
100 <div class="validator" v-if="errorTips.e2.length > 0 ">
101 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.e2}}
102 </div>
103 </div>
104 <div class="pure-u-1 form-item">
105 <div class="label">
106 <img src="@/assets/images/login/icon-login-message.png"> {{$t('login.verifyCode')}}
107 </div>
108 <div class="ipt-wrap">
109 <div class="ipt ipt2" :class="{ err : errorTips.oe2.length > 0 }">
110 <input :placeholder="$t('login.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="loginForm.otp">
111 <div v-if="times.remain == 0" class="veri-btn pointer" @click="sendOTPWhenOneAccountCenterOff">{{$t('register.verifyCodeGet')}}</div>
112 <div v-else class="veri-btn-default">{{times.tip}}</div>
113 </div>
114 </div>
115 <div class="validator" v-if="errorTips.oe2.length > 0 ">
116 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.oe2}}
117 </div>
118 </div>
119 </div>
120 <div class="login-protocol pointer" :class="{loginLeft:locale!='en'}" @click="loginCheck.agreeProtocol = !loginCheck.agreeProtocol">
121 <img v-if="!loginCheck.agreeProtocol" class="check" src="@/assets/images/login/uncheck.png">
122 <img v-if="loginCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png">{{$t('login.agree')}} &nbsp;
123 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span>
124 </div>
125 <div @click="pwdLoginWhenOneAccountCenterOff()" class="login-submit pointer flex-center" :class="{disabled: pwdLoginDisabledOneAccountCenterOff}">
126 <van-loading v-if="loading" />
127 <span>{{$t('login.login')}}</span>
128 </div>
129 <div class="login-func">
130 <div @click="toRegisterPage()" class="login-func-btn pointer">{{$t('login.register')}}</div>
131 </div>
132 </template>
133 </div>
134 77
135 <!-- OTP登陆 -->
136 <div v-if="type == 2" class="login">
137 <div class="login-tit">
138 <img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png">
139 <img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png">
140 <img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png">
141 </div>
142 <div class="login-nav">
143 <div @click="onLoginTypeHandler(1)" class="login-nav-tit text-r pointer"> {{$t('login.loginType1')}}</div>
144 <div class="login-nav-v-line"></div>
145 <div @click="onLoginTypeHandler(2)" class="login-nav-tit pointer active"> {{$t('login.loginType2')}}</div>
146 </div>
147 <div class="gird-g form">
148 78
149 <!-- <div class="pure-u-1 form-item"> 79 <!-- 不接入一账通 -OTP登陆 -->
80 <div class="login-nav">
81 <div class="login-nav-tit text-c pointer active">{{$t('login.loginType1')}}</div>
82 </div>
83 <div class="gird-g form">
84 <div class="pure-u-1 form-item">
85 <div class="label">
86 <img src="@/assets/images/login/icon-login-user.png"> {{$t('login.account')}}
87 </div>
88 <div class="ipt-wrap">
89 <input v-model="loginForm.userId" :placeholder="$t('login.accountPlaceholder')" class="ipt" :class="{ err : errorTips.e1.length > 0 }" type="text" @blur="userIdLegalCheck">
90 </div>
91 <div class="validator" v-if="errorTips.e1.length > 0 ">
92 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.e1}}
93 </div>
94 </div>
95 <!-- <div class="pure-u-1 form-item">
96 <div class="label">
97 <img src="@/assets/images/login/icon-login-password.png"> {{$t('login.password')}}
98 </div>
99 <div class="ipt-wrap">
100 <input v-model="loginForm.password" :placeholder="$t('login.passwordPlaceholder')" class="ipt" :class="{ err : errorTips.e2.length > 0 }" type="password">
101 </div>
102 <div class="validator" v-if="errorTips.e2.length > 0 ">
103 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.e2}}
104 </div>
105 </div> -->
106 <div class="pure-u-1 form-item">
107 <div class="label">
108 <img src="@/assets/images/login/icon-login-phone.png"> {{$t('login.SMSVerificationCode')}}
109 </div>
110 <div class="ipt-wrap">
111 <div class="ipt ipt2" :class="{ err : errorTips.oe2.length > 0 }">
112 <input :placeholder="$t('login.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="loginForm.otp">
113 <div v-if="times.remain == 0" class="veri-btn pointer" @click="sendOTPWhenOneAccountCenterOff">{{$t('register.verifyCodeGet')}}</div>
114 <div v-else class="veri-btn-default">{{times.tip}}</div>
115 </div>
116 </div>
117 <div class="validator" v-if="errorTips.oe2.length > 0 ">
118 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.oe2}}
119 </div>
120 </div>
121 </div>
122 <div class="login-protocol pointer" :class="{loginLeft:locale!='en'}" @click="loginCheck.agreeProtocol = !loginCheck.agreeProtocol">
123 <img v-if="!loginCheck.agreeProtocol" class="check" src="@/assets/images/login/uncheck.png">
124 <img v-if="loginCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png">{{$t('login.agree')}} &nbsp;
125 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span>
126 </div>
127 <div @click="pwdLoginWhenOneAccountCenterOff()" class="login-submit pointer flex-center" :class="{disabled: pwdLoginDisabledOneAccountCenterOff}">
128 <van-loading v-if="loading" />
129 <span>{{$t('login.login')}}</span>
130 </div>
131 <div class="login-func">
132 <div @click="toRegisterPage()" class="login-func-btn pointer">{{$t('login.register')}}</div>
133 </div>
134 </template>
135 </div>
136
137 <!-- OTP登陆 -->
138 <div v-if="type == 2" class="login">
139 <div class="login-tit">
140 <img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png">
141 <img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png">
142 <img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png">
143 </div>
144 <div class="login-nav">
145 <div @click="onLoginTypeHandler(1)" class="login-nav-tit text-r pointer"> {{$t('login.loginType1')}}</div>
146 <div class="login-nav-v-line"></div>
147 <div @click="onLoginTypeHandler(2)" class="login-nav-tit pointer active"> {{$t('login.loginType2')}}</div>
148 </div>
149 <div class="gird-g form">
150
151 <!-- <div class="pure-u-1 form-item">
150 <div class="ipt-wrap"> 152 <div class="ipt-wrap">
151 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt=""> 153 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt="">
152 <select class="ipt" v-model="mobileNoType"> 154 <select class="ipt" v-model="mobileNoType">
...@@ -154,27 +156,27 @@ ...@@ -154,27 +156,27 @@
154 </select> 156 </select>
155 </div> 157 </div>
156 </div> --> 158 </div> -->
157 <div class="pure-u-1 form-item"> 159 <div class="pure-u-1 form-item">
158 <div class="label"> 160 <div class="label">
159 <img src="@/assets/images/login/icon-login-phone.png"> {{$t('login.mobile')}} 161 <img src="@/assets/images/login/icon-login-phone.png"> {{$t('login.mobile')}}
160 </div> 162 </div>
161 <div class="ipt-wrap"> 163 <div class="ipt-wrap">
162 <div class="region-tel ipt-wrap"> 164 <div class="region-tel ipt-wrap">
163 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt=""> 165 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt="">
164 <el-select class="ipt" v-model="mobileNoType"> 166 <el-select class="ipt" v-model="mobileNoType">
165 <el-option v-for="(item,index) in mobileOptions" :key="index" :value="item.type" :label="item.areaCode"></el-option> 167 <el-option v-for="(item,index) in mobileOptions" :key="index" :value="item.type" :label="item.areaCode"></el-option>
166 </el-select> 168 </el-select>
167 </div> 169 </div>
168 170
169 <div class="ipt ipt2" :class="{err : errorTips.oe1.length > 0}"> 171 <div class="ipt ipt2" :class="{err : errorTips.oe1.length > 0}">
170 <input :placeholder="mobileTip.placeHolder" class="ipt-tel" type="text" :class="{ err : errorTips.oe1.length > 0 }" v-model="loginForm.mobileNo"> 172 <input :placeholder="mobileTip.placeHolder" class="ipt-tel" type="text" :class="{ err : errorTips.oe1.length > 0 }" v-model="loginForm.mobileNo">
171 </div> 173 </div>
172 </div> 174 </div>
173 <div class="validator" v-if="errorTips.oe1.length > 0 "> 175 <div class="validator" v-if="errorTips.oe1.length > 0 ">
174 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.oe1}} 176 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.oe1}}
175 </div> 177 </div>
176 </div> 178 </div>
177 <!-- <div class="pure-u-1 form-item"> 179 <!-- <div class="pure-u-1 form-item">
178 <div class="label"> 180 <div class="label">
179 <img src="@/assets/images/login/icon-login-phone.png"> {{$t('login.mobile')}} 181 <img src="@/assets/images/login/icon-login-phone.png"> {{$t('login.mobile')}}
180 </div> 182 </div>
...@@ -185,89 +187,89 @@ ...@@ -185,89 +187,89 @@
185 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.oe1}} 187 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.oe1}}
186 </div> 188 </div>
187 </div> --> 189 </div> -->
188 <div class="pure-u-1 form-item" v-if="type == 2 && loginCheck.showImageCode"> 190 <div class="pure-u-1 form-item" v-if="type == 2 && loginCheck.showImageCode">
189 <div class="ipt-wrap"> 191 <div class="ipt-wrap">
190 <input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" :class="{ err : errorTips.oe3.length > 0 }" type="text" v-model="loginForm.imageValue"> 192 <input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" :class="{ err : errorTips.oe3.length > 0 }" type="text" v-model="loginForm.imageValue">
191 <div class="ipt verify-btn pointer vcode" @click="handlerRefreshImageValue"> 193 <div class="ipt verify-btn pointer vcode" @click="handlerRefreshImageValue">
192 <img :src="values.imageBase64"> 194 <img :src="values.imageBase64">
193 </div> 195 </div>
194 </div> 196 </div>
195 <div class="validator" v-if="errorTips.oe3.length > 0 "> 197 <div class="validator" v-if="errorTips.oe3.length > 0 ">
196 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.oe3}} 198 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.oe3}}
197 </div> 199 </div>
198 </div> 200 </div>
199 <div class="pure-u-1 form-item"> 201 <div class="pure-u-1 form-item">
200 <div class="label"> 202 <div class="label">
201 <img src="@/assets/images/login/icon-login-message.png"> {{$t('login.verifyCode')}} 203 <img src="@/assets/images/login/icon-login-message.png"> {{$t('login.verifyCode')}}
202 </div> 204 </div>
203 <div class="ipt-wrap"> 205 <div class="ipt-wrap">
204 <div class="ipt ipt2" :class="{ err : errorTips.oe2.length > 0 }"> 206 <div class="ipt ipt2" :class="{ err : errorTips.oe2.length > 0 }">
205 <input :placeholder="$t('login.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="loginForm.otp"> 207 <input :placeholder="$t('login.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="loginForm.otp">
206 <div v-if="times.remain == 0" class="veri-btn pointer" @click="handlerStdSendOTP">{{$t('register.verifyCodeGet')}}</div> 208 <div v-if="times.remain == 0" class="veri-btn pointer" @click="handlerStdSendOTP">{{$t('register.verifyCodeGet')}}</div>
207 <div v-else class="veri-btn-default">{{times.tip}}</div> 209 <div v-else class="veri-btn-default">{{times.tip}}</div>
208 </div> 210 </div>
209 </div> 211 </div>
210 <div class="validator" v-if="errorTips.oe2.length > 0 "> 212 <div class="validator" v-if="errorTips.oe2.length > 0 ">
211 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.oe2}} 213 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.oe2}}
212 </div> 214 </div>
213 </div> 215 </div>
214 </div> 216 </div>
215 <div class="login-protocol pointer" @click="loginCheck.agreeProtocol = !loginCheck.agreeProtocol"> 217 <div class="login-protocol pointer" @click="loginCheck.agreeProtocol = !loginCheck.agreeProtocol">
216 <img v-if="!loginCheck.agreeProtocol" class="check" src="@/assets/images/login/uncheck.png"> 218 <img v-if="!loginCheck.agreeProtocol" class="check" src="@/assets/images/login/uncheck.png">
217 <img v-if="loginCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> {{$t('login.agree')}} &nbsp; 219 <img v-if="loginCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> {{$t('login.agree')}} &nbsp;
218 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span> 220 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span>
219 </div> 221 </div>
220 <div @click="handlerLogin()" class="login-submit pointer flex-center" :class="{disabled: otpLoginDisabled}"> 222 <div @click="handlerLogin()" class="login-submit pointer flex-center" :class="{disabled: otpLoginDisabled}">
221 <van-loading v-if="loading" /> 223 <van-loading v-if="loading" />
222 <span>{{$t('login.login')}}</span> 224 <span>{{$t('login.login')}}</span>
223 </div> 225 </div>
224 <div class="login-func"> 226 <div class="login-func">
225 <div @click="toRegisterPage()" class="login-func-btn pointer">{{$t('login.register')}}</div> 227 <div @click="toRegisterPage()" class="login-func-btn pointer">{{$t('login.register')}}</div>
226 <div @click="onForgetHandler()" class="login-func-btn pointer">{{$t('login.forget')}}</div> 228 <div @click="onForgetHandler()" class="login-func-btn pointer">{{$t('login.forget')}}</div>
227 </div> 229 </div>
228 </div> 230 </div>
229 231
230 <!----> 232 <!---->
231 <div v-if="type == 3" class="login"> 233 <div v-if="type == 3" class="login">
232 <!-- <div class="login-tit"> 234 <!-- <div class="login-tit">
233 <img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png"> 235 <img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png">
234 <img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png"> 236 <img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png">
235 <img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png"> 237 <img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png">
236 </div> --> 238 </div> -->
237 239
238 <div class="login-tit2">{{$t('register.title2')}}</div> 240 <div class="login-tit2">{{$t('register.title2')}}</div>
239 <div class="gird-g form"> 241 <div class="gird-g form">
240 <div class="pure-u-1 form-item"> 242 <div class="pure-u-1 form-item">
241 <div class="label"> 243 <div class="label">
242 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}} 244 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
243 </div> 245 </div>
244 <div class="ipt-wrap"> 246 <div class="ipt-wrap">
245 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" type="password" v-model="values.password"> 247 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" type="password" v-model="values.password">
246 </div> 248 </div>
247 <div class="validator" v-if="errorTips.p4.length > 0 "> 249 <div class="validator" v-if="errorTips.p4.length > 0 ">
248 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p4}} 250 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p4}}
249 </div> 251 </div>
250 </div> 252 </div>
251 <div class="pure-u-1 form-item"> 253 <div class="pure-u-1 form-item">
252 <div class="label"> 254 <div class="label">
253 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}} 255 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}}
254 </div> 256 </div>
255 <div class="ipt-wrap"> 257 <div class="ipt-wrap">
256 <input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" type="password" v-model="values.passwordRepeat"> 258 <input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" type="password" v-model="values.passwordRepeat">
257 </div> 259 </div>
258 <div class="validator" v-if="errorTips.p5.length > 0 "> 260 <div class="validator" v-if="errorTips.p5.length > 0 ">
259 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p5}} 261 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p5}}
260 </div> 262 </div>
261 </div> 263 </div>
262 </div> 264 </div>
263 <div @click="onRegisterHandler()" class="login-submit pointer flex-center" :class="{disabled: submitDisabled}"> 265 <div @click="onRegisterHandler()" class="login-submit pointer flex-center" :class="{disabled: submitDisabled}">
264 <van-loading v-if="loading" /> 266 <van-loading v-if="loading" />
265 <span>{{$t('register.sure')}}</span> 267 <span>{{$t('register.sure')}}</span>
266 </div> 268 </div>
267 </div> 269 </div>
268 </div> 270 </div>
269 </div> 271 </div>
270 </div> 272 </div>
271 </template> 273 </template>
272 274
273 <script src="./login.js"></script> 275 <script src="./login.js"></script>
......
...@@ -2,32 +2,28 @@ ...@@ -2,32 +2,28 @@
2 * 页面描述:用户注册 2 * 页面描述:用户注册
3 */ 3 */
4 4
5
6 import { mapState } from "vuex"; 5 import { mapState } from "vuex";
7 6
8 import api from '@/api/api' 7 import api from "@/api/api";
9 import { 8 import { httpGet, httpPost } from "@/api/fetch-api.js";
10 httpGet,
11 httpPost
12 } from '@/api/fetch-api.js'
13 9
14 import { contactMethodCheck, checkVerifyCode } from '@utils/utils.js'; 10 import { contactMethodCheck, checkVerifyCode } from "@utils/utils.js";
15 11
16 import modalComp from '@/components/modal-comp/modal-comp.vue'; 12 import modalComp from "@/components/modal-comp/modal-comp.vue";
17 import modalSimpleComp from '@/components/modal-simple-comp/modal-simple-comp.vue'; 13 import modalSimpleComp from "@/components/modal-simple-comp/modal-simple-comp.vue";
18 import modalProtocolComp from '@/components/modal-protocol-comp/modal-protocol-comp.vue'; 14 import modalProtocolComp from "@/components/modal-protocol-comp/modal-protocol-comp.vue";
19 import { passwordEncrypt } from '@/utils/encrypt.js'; 15 import { passwordEncrypt } from "@/utils/encrypt.js";
20 import Vue from 'vue'; 16 import Vue from "vue";
21 import { Loading } from 'vant'; 17 import { Loading } from "vant";
22 Vue.use(Loading); 18 Vue.use(Loading);
23 19
24 export default { 20 export default {
25 data() { 21 data() {
26 return { 22 return {
27 loading: false, 23 loading: false,
28 key: 'value', 24 key: "value",
29 type: 1, // 1:手机验证 2:输入密码 25 type: 1, // 1:手机验证 2:输入密码
30 mobileNoType: "hk",// 选择的手机好类型 26 mobileNoType: "hk", // 选择的手机好类型
31 mobileTip: {}, 27 mobileTip: {},
32 mobileOptions: [], 28 mobileOptions: [],
33 29
...@@ -47,7 +43,8 @@ export default { ...@@ -47,7 +43,8 @@ export default {
47 registerForm: { 43 registerForm: {
48 imageValue: "", 44 imageValue: "",
49 mobileNo: "", 45 mobileNo: "",
50 otp: "" 46 otp: "",
47 userId: ""
51 }, 48 },
52 times: { 49 times: {
53 interval: 0, // 索引 50 interval: 0, // 索引
...@@ -56,11 +53,24 @@ export default { ...@@ -56,11 +53,24 @@ export default {
56 }, 53 },
57 54
58 errorTips: { 55 errorTips: {
59 p1: "",// 手機號 56 p1: "", // 手機號
60 p2: "",// 短信驗證碼 57 p2: "", // 短信驗證碼
61 p3: "",// 圖像驗證碼 58 p3: "", // 圖像驗證碼
62 p4: "",// 密碼 59 p4: "", // 密碼
63 p5: "",// 確認密碼 60 p5: "", // 確認密碼
61
62 // 账密登录页
63 e1: "", // 账号
64 e2: "", // 密码
65 e3: "", // 图像验证码
66 e4: "", // 勾选同意
67 // 短信验证码
68 oe1: "", // 账号
69 oe2: "", // 短信验证码
70 oe3: "", // 图像验证码
71 // 注册
72 p4: "",
73 p5: ""
64 }, 74 },
65 modalSimpleVisiable: false, 75 modalSimpleVisiable: false,
66 modalVisiable: false, 76 modalVisiable: false,
...@@ -68,7 +78,7 @@ export default { ...@@ -68,7 +78,7 @@ export default {
68 targetPath: "", 78 targetPath: "",
69 modalIcon: "succ", 79 modalIcon: "succ",
70 modalContent: "" 80 modalContent: ""
71 } 81 };
72 }, 82 },
73 components: { 83 components: {
74 modalComp, 84 modalComp,
...@@ -80,10 +90,12 @@ export default { ...@@ -80,10 +90,12 @@ export default {
80 userInfo: state => state.userInfo 90 userInfo: state => state.userInfo
81 }), 91 }),
82 locale() { 92 locale() {
83 return this.$i18n.locale || 'tc'; 93 return this.$i18n.locale || "tc";
84 }, 94 },
85 i18n() { 95 i18n() {
86 return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {}; 96 return this.$i18n.messages && this.$i18n.locale
97 ? this.$i18n.messages[this.$i18n.locale]
98 : {};
87 }, 99 },
88 registerDisabled() { 100 registerDisabled() {
89 let b1 = !this.registerCheck.agreeProtocol; 101 let b1 = !this.registerCheck.agreeProtocol;
...@@ -93,16 +105,23 @@ export default { ...@@ -93,16 +105,23 @@ export default {
93 return b1 || b2 || b3 || b4; 105 return b1 || b2 || b3 || b4;
94 }, 106 },
95 registerDisabledV2() { 107 registerDisabledV2() {
96 let b1 = !this.values.password || this.checkPassword(this.values.password) ? true : false; 108 let b1 =
97 let b2 = this.values.passwordRepeat != this.values.password ? true : false; 109 !this.values.password || this.checkPassword(this.values.password)
110 ? true
111 : false;
112 let b2 =
113 this.values.passwordRepeat != this.values.password ? true : false;
98 let b3 = !this.registerCheck.agreeProtocol; 114 let b3 = !this.registerCheck.agreeProtocol;
99 let b4 = !this.registerForm.mobileNo ? true : false; 115 let b4 = !this.registerForm.mobileNo ? true : false;
100 return b1 || b2 || b3 || b4; 116 return b1 || b2 || b3 || b4;
101
102 }, 117 },
103 submitDisabled() { 118 submitDisabled() {
104 let b1 = !this.values.password || this.checkPassword(this.values.password) ? true : false; 119 let b1 =
105 let b2 = this.values.passwordRepeat != this.values.password ? true : false; 120 !this.values.password || this.checkPassword(this.values.password)
121 ? true
122 : false;
123 let b2 =
124 this.values.passwordRepeat != this.values.password ? true : false;
106 return b1 || b2; 125 return b1 || b2;
107 }, 126 },
108 oneAccountCenterOff() { 127 oneAccountCenterOff() {
...@@ -152,13 +171,13 @@ export default { ...@@ -152,13 +171,13 @@ export default {
152 return new Promise((resolve, reject) => { 171 return new Promise((resolve, reject) => {
153 let mobile = this.registerForm.mobileNo; 172 let mobile = this.registerForm.mobileNo;
154 if (this.mobileNoType == "hk") { 173 if (this.mobileNoType == "hk") {
155 if (!contactMethodCheck('hkmobile', mobile)) { 174 if (!contactMethodCheck("hkmobile", mobile)) {
156 this._showMobileNoIllegalTip() 175 this._showMobileNoIllegalTip();
157 return; 176 return;
158 } 177 }
159 } else { 178 } else {
160 if (!contactMethodCheck('mobile', mobile)) { 179 if (!contactMethodCheck("mobile", mobile)) {
161 this._showMobileNoIllegalTip() 180 this._showMobileNoIllegalTip();
162 return; 181 return;
163 } 182 }
164 } 183 }
...@@ -167,7 +186,6 @@ export default { ...@@ -167,7 +186,6 @@ export default {
167 }, 186 },
168 _handlerIsShowImageVcode() { 187 _handlerIsShowImageVcode() {
169 return new Promise((resolve, reject) => { 188 return new Promise((resolve, reject) => {
170
171 // 如果这个值不为空，标识出现了图片验证码，不需要重新询问是否需要图像验证码了 189 // 如果这个值不为空，标识出现了图片验证码，不需要重新询问是否需要图像验证码了
172 if (this.values.vcodeuuid) { 190 if (this.values.vcodeuuid) {
173 resolve(); 191 resolve();
...@@ -201,7 +219,7 @@ export default { ...@@ -201,7 +219,7 @@ export default {
201 } 219 }
202 } 220 }
203 return false; 221 return false;
204 }) 222 });
205 }); 223 });
206 }, 224 },
207 _showMobileNoIllegalTip() { 225 _showMobileNoIllegalTip() {
...@@ -215,8 +233,8 @@ export default { ...@@ -215,8 +233,8 @@ export default {
215 mobileNo: this.registerForm.mobileNo, 233 mobileNo: this.registerForm.mobileNo,
216 token: this.values.token, 234 token: this.values.token,
217 signFactor: new Date().getTime(), 235 signFactor: new Date().getTime(),
218 scene: "register", 236 scene: "register"
219 } 237 };
220 if (this.values.vcodeuuid) { 238 if (this.values.vcodeuuid) {
221 data["vcodeuuid"] = this.values.vcodeuuid; 239 data["vcodeuuid"] = this.values.vcodeuuid;
222 data["imageValue"] = this.registerForm.imageValue; 240 data["imageValue"] = this.registerForm.imageValue;
...@@ -230,7 +248,7 @@ export default { ...@@ -230,7 +248,7 @@ export default {
230 default: 248 default:
231 this.errorTips.p2 = response.returnMsg; 249 this.errorTips.p2 = response.returnMsg;
232 break; 250 break;
233 }; 251 }
234 }); 252 });
235 }, 253 },
236 _startTimeClick() { 254 _startTimeClick() {
...@@ -239,7 +257,7 @@ export default { ...@@ -239,7 +257,7 @@ export default {
239 let i18n = this.$i18n.messages[this.$i18n.locale] || {}; 257 let i18n = this.$i18n.messages[this.$i18n.locale] || {};
240 let msg = i18n.register.coutTips; 258 let msg = i18n.register.coutTips;
241 _this.times.tip = msg.replace("{second}", _this.times.remain); 259 _this.times.tip = msg.replace("{second}", _this.times.remain);
242 this.times.interval = setInterval(function () { 260 this.times.interval = setInterval(function() {
243 if (_this.times.remain <= 0) { 261 if (_this.times.remain <= 0) {
244 clearInterval(_this.times.interval); 262 clearInterval(_this.times.interval);
245 _this.times.interval = 0; 263 _this.times.interval = 0;
...@@ -248,7 +266,7 @@ export default { ...@@ -248,7 +266,7 @@ export default {
248 } 266 }
249 _this.times.remain--; 267 _this.times.remain--;
250 _this.times.tip = msg.replace("{second}", _this.times.remain); 268 _this.times.tip = msg.replace("{second}", _this.times.remain);
251 _this.$set(_this, 'times', _this.times); 269 _this.$set(_this, "times", _this.times);
252 }, 1000); 270 }, 1000);
253 }, 271 },
254 onSubmitHandler() { 272 onSubmitHandler() {
...@@ -258,17 +276,21 @@ export default { ...@@ -258,17 +276,21 @@ export default {
258 } 276 }
259 this._checkParams().then(() => { 277 this._checkParams().then(() => {
260 this.loading = true; 278 this.loading = true;
261 this._regCheck().then(() => { 279 this._regCheck()
262 // 验证短信验证码 280 .then(() => {
263 this._validateOTPandRepeat().then(() => { 281 // 验证短信验证码
264 this.loading = false; 282 this._validateOTPandRepeat()
265 this.type = 2; 283 .then(() => {
266 }).catch(e => { 284 this.loading = false;
285 this.type = 2;
286 })
287 .catch(e => {
288 this.loading = false;
289 });
290 })
291 .catch(e => {
267 this.loading = false; 292 this.loading = false;
268 }); 293 });
269 }).catch(e => {
270 this.loading = false;
271 });
272 }); 294 });
273 }, 295 },
274 checkMobileActivity() { 296 checkMobileActivity() {
...@@ -289,24 +311,26 @@ export default { ...@@ -289,24 +311,26 @@ export default {
289 let data = { 311 let data = {
290 account: this.registerForm.mobileNo, 312 account: this.registerForm.mobileNo,
291 password: this.values.password 313 password: this.values.password
292 } 314 };
293 this.loading = true; 315 this.loading = true;
294 httpPost({ 316 httpPost({
295 url: api.doRegisterV2, 317 url: api.doRegisterV2,
296 data: data 318 data: data
297 }).then(res => {
298 this.loading = false;
299 this.$store.commit("SET_USER_INFO", res);
300 this._showSuccessMessage();
301 }).catch(e => {
302 this.loading = false;
303 switch (e.code) {
304 case 1103:
305 let message = this.i18n.register.tips.e5;
306 this.errorTips.p1 = message;
307 break;
308 }
309 }) 319 })
320 .then(res => {
321 this.loading = false;
322 this.$store.commit("SET_USER_INFO", res);
323 this._showSuccessMessage();
324 })
325 .catch(e => {
326 this.loading = false;
327 switch (e.code) {
328 case 1103:
329 let message = this.i18n.register.tips.e5;
330 this.errorTips.p1 = message;
331 break;
332 }
333 });
310 }); 334 });
311 }, 335 },
312 _validateOTPandRepeat() { 336 _validateOTPandRepeat() {
...@@ -320,52 +344,56 @@ export default { ...@@ -320,52 +344,56 @@ export default {
320 httpPost({ 344 httpPost({
321 url: api.stdValidateOTPandRepeat, 345 url: api.stdValidateOTPandRepeat,
322 data: data 346 data: data
323 }).then(response => { 347 })
324 if (response.returnCode != "0") { 348 .then(response => {
325 switch (response.returnCode) { 349 if (response.returnCode != "0") {
326 case "SMS_ERROR_006": 350 switch (response.returnCode) {
327 this._showOTPTip(); 351 case "SMS_ERROR_006":
328 break; 352 this._showOTPTip();
329 default: 353 break;
330 this._showCheckOTPErrTip(response.returnMsg); 354 default:
331 break; 355 this._showCheckOTPErrTip(response.returnMsg);
356 break;
357 }
358 reject();
359 } else {
360 // this.type = 2;
361 resolve();
332 } 362 }
363 })
364 .catch(err => {
333 reject(); 365 reject();
334 } else { 366 });
335 // this.type = 2;
336 resolve();
337 }
338 }).catch(err => {
339 reject();
340 })
341 }); 367 });
342 }, 368 },
343 _regCheck() { 369 _regCheck() {
344 // 检测手机号注册情况 370 // 检测手机号注册情况
345 return new Promise((resolve, reject) => { 371 return new Promise((resolve, reject) => {
346 let data = { 372 let data = {
347 mobileNo: this.registerForm.mobileNo, 373 mobileNo: this.registerForm.mobileNo
348 }; 374 };
349 httpPost({ 375 httpPost({
350 url: api.gsRegCheck, 376 url: api.gsRegCheck,
351 data: data 377 data: data
352 }).then(response => { 378 })
353 if (response.returnCode == "0") { 379 .then(response => {
354 if (response.data.mobileStatus == "N") { 380 if (response.returnCode == "0") {
355 resolve(); 381 if (response.data.mobileStatus == "N") {
382 resolve();
383 } else {
384 // 重复注册
385 this._showDuplicateRegistrationTip();
386 reject();
387 }
356 } else { 388 } else {
357 // 重复注册 389 // 错误提示
358 this._showDuplicateRegistrationTip(); 390 this._showCheckOTPErrTip(response.returnMsg);
359 reject(); 391 reject();
360 } 392 }
361 } else { 393 })
362 // 错误提示 394 .catch(err => {
363 this._showCheckOTPErrTip(response.returnMsg);
364 reject(); 395 reject();
365 } 396 });
366 }).catch(err => {
367 reject();
368 })
369 }); 397 });
370 }, 398 },
371 _checkParams() { 399 _checkParams() {
...@@ -388,7 +416,7 @@ export default { ...@@ -388,7 +416,7 @@ export default {
388 return; 416 return;
389 } 417 }
390 resolve(); 418 resolve();
391 }) 419 });
392 }); 420 });
393 }, 421 },
394 422
...@@ -446,18 +474,20 @@ export default { ...@@ -446,18 +474,20 @@ export default {
446 httpPost({ 474 httpPost({
447 url: api.stdRegister, 475 url: api.stdRegister,
448 data: data 476 data: data
449 }).then(response => {
450 this.loading = false;
451 if (response.returnCode != 0) {
452 this._showRegisterFailure(response);
453 this.type = 1;
454 } else {
455 this.$store.commit("SET_USER_INFO", response.data);
456 this._showSuccessMessage();
457 }
458 }).catch(e => {
459 this.loading = false;
460 }) 477 })
478 .then(response => {
479 this.loading = false;
480 if (response.returnCode != 0) {
481 this._showRegisterFailure(response);
482 this.type = 1;
483 } else {
484 this.$store.commit("SET_USER_INFO", response.data);
485 this._showSuccessMessage();
486 }
487 })
488 .catch(e => {
489 this.loading = false;
490 });
461 } 491 }
462 }, 492 },
463 checkPassword(password) { 493 checkPassword(password) {
...@@ -534,13 +564,13 @@ export default { ...@@ -534,13 +564,13 @@ export default {
534 if (this.values.vcodeuuid) { 564 if (this.values.vcodeuuid) {
535 let data = { 565 let data = {
536 vcodeuuid: this.values.vcodeuuid 566 vcodeuuid: this.values.vcodeuuid
537 } 567 };
538 httpPost({ 568 httpPost({
539 url: api.stdRefreshVcode, 569 url: api.stdRefreshVcode,
540 data: data 570 data: data
541 }).then(response => { 571 }).then(response => {
542 this.$set(this.values, 'imageBase64', response.data.image); 572 this.$set(this.values, "imageBase64", response.data.image);
543 }) 573 });
544 } 574 }
545 }, 575 },
546 _showSuccessMessage() { 576 _showSuccessMessage() {
...@@ -552,12 +582,8 @@ export default { ...@@ -552,12 +582,8 @@ export default {
552 // }); 582 // });
553 // alert("注册成功") 583 // alert("注册成功")
554 }, 584 },
555 onForgetHandler() { 585 onForgetHandler() {},
556 586 onLoginTypeHandler(val) {},
557 },
558 onLoginTypeHandler(val) {
559
560 },
561 initData() { 587 initData() {
562 if (this.userInfo && (this.userInfo.sid || this.userInfo.name)) { 588 if (this.userInfo && (this.userInfo.sid || this.userInfo.name)) {
563 this.$router.push({ 589 this.$router.push({
...@@ -566,7 +592,9 @@ export default { ...@@ -566,7 +592,9 @@ export default {
566 return; 592 return;
567 } 593 }
568 let i18n = this.$i18n.messages[this.$i18n.locale] || {}; 594 let i18n = this.$i18n.messages[this.$i18n.locale] || {};
569 let mobileOptions = JSON.parse(JSON.stringify(i18n.register.mobileOptions)); 595 let mobileOptions = JSON.parse(
596 JSON.stringify(i18n.register.mobileOptions)
597 );
570 this.mobileOptions = mobileOptions; 598 this.mobileOptions = mobileOptions;
571 this.mobileTip = this.mobileOptions[0]; 599 this.mobileTip = this.mobileOptions[0];
572 }, 600 },
...@@ -574,7 +602,7 @@ export default { ...@@ -574,7 +602,7 @@ export default {
574 this.modalVisiable = false; 602 this.modalVisiable = false;
575 if (this.targetPath) { 603 if (this.targetPath) {
576 this.$router.push({ 604 this.$router.push({
577 "path": this.targetPath 605 path: this.targetPath
578 }); 606 });
579 } 607 }
580 } 608 }
...@@ -587,47 +615,44 @@ export default { ...@@ -587,47 +615,44 @@ export default {
587 this.mobileOptions.forEach(element => { 615 this.mobileOptions.forEach(element => {
588 // this.errorTips.p1 = ""; 616 // this.errorTips.p1 = "";
589 if (element.type == this.mobileNoType) { 617 if (element.type == this.mobileNoType) {
590 this.$set(this, 'mobileTip', element); 618 this.$set(this, "mobileTip", element);
591 this.checkMobileActivity(); 619 this.checkMobileActivity();
592 } 620 }
593 }) 621 });
594 }, 622 },
595 'registerForm.mobileNo': function () { 623 "registerForm.mobileNo": function() {
596 this.errorTips.p1 = ""; 624 this.errorTips.p1 = "";
597 }, 625 },
598 'registerForm.opt': function () { 626 "registerForm.opt": function() {
599 this.errorTips.p2 = ""; 627 this.errorTips.p2 = "";
600 }, 628 },
601 'registerForm.imageValue': function () { 629 "registerForm.imageValue": function() {
602 this.errorTips.p3 = ""; 630 this.errorTips.p3 = "";
603 }, 631 },
604 'values.password': function () { 632 "values.password": function() {
605 this.$set(this.errorTips, 'p4', this.checkPassword(this.values.password)); 633 this.$set(this.errorTips, "p4", this.checkPassword(this.values.password));
606 }, 634 },
607 'values.passwordRepeat': function () { 635 "values.passwordRepeat": function() {
608 if (this.values.password != this.values.passwordRepeat) { 636 if (this.values.password != this.values.passwordRepeat) {
609 this._showPasswordNotTheSameTips(); 637 this._showPasswordNotTheSameTips();
610 } else { 638 } else {
611 this.errorTips.p5 = ""; 639 this.errorTips.p5 = "";
612 } 640 }
613 }, 641 }
614 },
615 beforeDestroy() {
616 }, 642 },
643 beforeDestroy() {},
617 created() { 644 created() {
618 this.initData(); 645 this.initData();
619 try { 646 try {
620 this.$root.eventBus.$off("/register"); 647 this.$root.eventBus.$off("/register");
621 } catch (e) { 648 } catch (e) {}
622
623 }
624 this.$root.eventBus.$on("/register", () => { 649 this.$root.eventBus.$on("/register", () => {
625 this.type = 1; 650 this.type = 1;
626 }); 651 });
627 this.$root.eventBus.$on("langChange", () => { 652 this.$root.eventBus.$on("langChange", () => {
628 try { 653 try {
629 this.initData(); 654 this.initData();
630 } catch (e) { } 655 } catch (e) {}
631 }); 656 });
632 } 657 }
633 } 658 };
......
1 @import '@/styles/_support.scss'; 1 @import "@/styles/_support.scss";
2 2
3 .content { 3 .content {
4 position: relative; 4 position: relative;
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
21 } 21 }
22 22
23 .ebg { 23 .ebg {
24 background: url('~@/assets/images/common/login-bg.png') center no-repeat; 24 background: url("~@/assets/images/common/login-bg.png") center no-repeat;
25 width: 100%; 25 width: 100%;
26 height: 325px; 26 height: 325px;
27 position: absolute; 27 position: absolute;
...@@ -39,7 +39,6 @@ ...@@ -39,7 +39,6 @@
39 } 39 }
40 40
41 .login { 41 .login {
42
43 @extend .bb; 42 @extend .bb;
44 padding: 32px 75px 54px; 43 padding: 32px 75px 54px;
45 border-bottom: solid 10.8px $cGreen; 44 border-bottom: solid 10.8px $cGreen;
...@@ -51,8 +50,6 @@ ...@@ -51,8 +50,6 @@
51 @extend .box-shadow; 50 @extend .box-shadow;
52 background-color: #ffffff; 51 background-color: #ffffff;
53 52
54
55
56 &-tit { 53 &-tit {
57 color: $cOrange; 54 color: $cOrange;
58 display: flex; 55 display: flex;
...@@ -70,7 +67,9 @@ ...@@ -70,7 +67,9 @@
70 &-tit2 { 67 &-tit2 {
71 color: $cOrange; 68 color: $cOrange;
72 text-align: center; 69 text-align: center;
73 font-size: $fontSizeTitle; 70 // font-size: $fontSizeTitle;
71 // font-size: $fontSizeTitle-M2;
72 font-size: $fontSize-M2;
74 font-weight: bold; 73 font-weight: bold;
75 text-shadow: 3px 5.2px 9px rgba(236, 100, 41, 0.27); 74 text-shadow: 3px 5.2px 9px rgba(236, 100, 41, 0.27);
76 margin-top: 24px; 75 margin-top: 24px;
...@@ -80,7 +79,6 @@ ...@@ -80,7 +79,6 @@
80 letter-spacing: 2.4px; 79 letter-spacing: 2.4px;
81 } 80 }
82 81
83
84 &-nav { 82 &-nav {
85 margin: 32px auto 12px; 83 margin: 32px auto 12px;
86 display: flex; 84 display: flex;
...@@ -96,7 +94,9 @@ ...@@ -96,7 +94,9 @@
96 94
97 &-tit { 95 &-tit {
98 flex: 1; 96 flex: 1;
99 font-size: $fontSizeTitle; 97 // font-size: $fontSizeTitle;
98 // font-size: $fontSizeTitle-M2;
99 font-size: $fontSize-M2;
100 font-weight: bold; 100 font-weight: bold;
101 } 101 }
102 102
...@@ -109,12 +109,13 @@ ...@@ -109,12 +109,13 @@
109 &-protocol { 109 &-protocol {
110 margin: 36px auto 0; 110 margin: 36px auto 0;
111 display: flex; 111 display: flex;
112 align-items: center; 112 // align-items: center;
113 // padding-left: 12px; 113 // padding-left: 12px;
114 114
115 .check { 115 .check {
116 height: 12px; 116 height: 12px;
117 margin-right: 7.2px; 117 margin-right: 7.2px;
118 margin-top: 4px;
118 } 119 }
119 120
120 .protocol { 121 .protocol {
...@@ -126,11 +127,9 @@ ...@@ -126,11 +127,9 @@
126 padding-left: 12px; 127 padding-left: 12px;
127 } 128 }
128 129
129
130 &-submit { 130 &-submit {
131 @include btc2(207px, 63px, 16px); 131 @include btc2(207px, 63px, 16px);
132 margin: 50px auto 0; 132 margin: 50px auto 0;
133
134 } 133 }
135 134
136 &-submit:lang(zh) { 135 &-submit:lang(zh) {
...@@ -165,7 +164,8 @@ ...@@ -165,7 +164,8 @@
165 } 164 }
166 } 165 }
167 166
168 input {} 167 input {
168 }
169 169
170 input:lang(zh) { 170 input:lang(zh) {
171 letter-spacing: 1.2px; 171 letter-spacing: 1.2px;
...@@ -221,7 +221,6 @@ ...@@ -221,7 +221,6 @@
221 max-width: 30%; 221 max-width: 30%;
222 } 222 }
223 223
224
225 .verify-btn { 224 .verify-btn {
226 @extend .fcc; 225 @extend .fcc;
227 // font-family: Arial; 226 // font-family: Arial;
...@@ -234,7 +233,6 @@ ...@@ -234,7 +233,6 @@
234 color: $cFontGray; 233 color: $cFontGray;
235 } 234 }
236 235
237
238 // 框内按钮 236 // 框内按钮
239 .ipt2 { 237 .ipt2 {
240 display: flex; 238 display: flex;
...@@ -275,7 +273,6 @@ ...@@ -275,7 +273,6 @@
275 margin-right: 4.8px; 273 margin-right: 4.8px;
276 } 274 }
277 } 275 }
278
279 } 276 }
280 } 277 }
281 278
...@@ -310,7 +307,6 @@ ...@@ -310,7 +307,6 @@
310 &-item { 307 &-item {
311 margin-top: 24px; 308 margin-top: 24px;
312 } 309 }
313
314 } 310 }
315 311
316 &-protocol { 312 &-protocol {
......
1 1
2 <template> 2 <template>
3 <div> 3 <div>
4 <modal-simple-comp :visible="modalSimpleVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="closeModal" :close="closeModal"></modal-simple-comp> 4 <modal-simple-comp :visible="modalSimpleVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="closeModal" :close="closeModal"></modal-simple-comp>
5 <modal-comp :visible="modalVisiable" :show-confirm="true" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback" :confirmText="$t('register.sure')"></modal-comp> 5 <modal-comp :visible="modalVisiable" :show-confirm="true" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback" :confirmText="$t('register.sure')"></modal-comp>
6 <!-- 会员协议 --> 6 <!-- 会员协议 -->
7 <modal-protocol-comp :visible="modalProtocolVisiable" :overlay="closeModal" :close="closeModal"></modal-protocol-comp> 7 <modal-protocol-comp :visible="modalProtocolVisiable" :overlay="closeModal" :close="closeModal"></modal-protocol-comp>
8 <div class="ebg"></div> 8 <div class="ebg"></div>
9 <div class="content" v-if="!oneAccountCenterOff"> 9 <div class="content" v-if="!oneAccountCenterOff">
10 <div class="top-space"></div> 10 <div class="top-space"></div>
11 <div class="step"> 11 <div class="step">
12 <img v-if="type == 1" src="@/assets/images/register/register-step-1.png"> 12 <img v-if="type == 1" src="@/assets/images/register/register-step-1.png">
13 <img v-if="type == 2" src="@/assets/images/register/register-step-2.png"> 13 <img v-if="type == 2" src="@/assets/images/register/register-step-2.png">
14 </div> 14 </div>
15 <div class="box"> 15 <div class="box">
16 <!-- 手机验证 --> 16 <!-- 手机验证 -->
17 <div v-if="type == 1" class="login"> 17 <div v-if="type == 1" class="login">
18 18
19 <div class="login-tit"> 19 <div class="login-tit">
20 <img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png"> 20 <img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png">
21 <img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png"> 21 <img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png">
22 <img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png"> 22 <img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png">
23 </div> 23 </div>
24 <div class="login-tit2">{{$t('register.title')}}</div> 24 <div class="login-tit2">{{$t('register.title')}}</div>
25 <div class="gird-g form"> 25 <div class="gird-g form">
26 <!-- <div class="pure-u-1 form-item"> 26 <!-- <div class="pure-u-1 form-item">
27 <div class="ipt-wrap"> 27 <div class="ipt-wrap">
28 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt=""> 28 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt="">
29 <select class="ipt" v-model="mobileNoType"> 29 <select class="ipt" v-model="mobileNoType">
...@@ -31,169 +31,205 @@ ...@@ -31,169 +31,205 @@
31 </select> 31 </select>
32 </div> 32 </div>
33 </div> --> 33 </div> -->
34 <div class="pure-u-1 form-item"> 34 <div class="pure-u-1 form-item">
35 <div class="ipt-wrap"> 35 <div class="ipt-wrap">
36 36
37 <div class="region-tel ipt-wrap"> 37 <div class="region-tel ipt-wrap">
38 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt=""> 38 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt="">
39 <el-select class="ipt" v-model="mobileNoType"> 39 <el-select class="ipt" v-model="mobileNoType">
40 <el-option v-for="(item,index) in mobileOptions" :key="index" :value="item.type" :label="item.areaCode">{{item.areaCode}}</el-option> 40 <el-option v-for="(item,index) in mobileOptions" :key="index" :value="item.type" :label="item.areaCode">{{item.areaCode}}</el-option>
41 </el-select> 41 </el-select>
42 </div> 42 </div>
43 43
44 <div class="ipt ipt2" :class="{err : errorTips.p1.length > 0}"> 44 <div class="ipt ipt2" :class="{err : errorTips.p1.length > 0}">
45 <input :placeholder="mobileTip.placeHolder" class="ipt-tel" type="text" v-model="registerForm.mobileNo"> 45 <input :placeholder="mobileTip.placeHolder" class="ipt-tel" type="text" v-model="registerForm.mobileNo">
46 </div> 46 </div>
47 </div> 47 </div>
48 <div class="validator" v-if="errorTips.p1.length > 0 "> 48 <div class="validator" v-if="errorTips.p1.length > 0 ">
49 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p1}} 49 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p1}}
50 </div> 50 </div>
51 </div> 51 </div>
52 52
53 <div class="pure-u-1 form-item" v-if="registerCheck.showImageCode"> 53 <div class="pure-u-1 form-item" v-if="registerCheck.showImageCode">
54 <div class="ipt-wrap"> 54 <div class="ipt-wrap">
55 <input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" :class="{err : errorTips.p3.length > 0}" type="text" v-model="registerForm.imageValue"> 55 <input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" :class="{err : errorTips.p3.length > 0}" type="text" v-model="registerForm.imageValue">
56 <div class="ipt verify-btn pointer vcode" @click="handlerRefreshImageVcode"> 56 <div class="ipt verify-btn pointer vcode" @click="handlerRefreshImageVcode">
57 <img :src="values.imageBase64"> 57 <img :src="values.imageBase64">
58 </div> 58 </div>
59 </div> 59 </div>
60 <div class="validator" v-if="errorTips.p3.length > 0 "> 60 <div class="validator" v-if="errorTips.p3.length > 0 ">
61 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p3}} 61 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p3}}
62 </div> 62 </div>
63 </div> 63 </div>
64 <div class="pure-u-1 form-item"> 64 <div class="pure-u-1 form-item">
65 <div class="ipt-wrap"> 65 <div class="ipt-wrap">
66 <div class="ipt ipt2" :class="{err : errorTips.p2.length > 0}"> 66 <div class="ipt ipt2" :class="{err : errorTips.p2.length > 0}">
67 <input :placeholder="$t('register.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="registerForm.opt"> 67 <input :placeholder="$t('register.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="registerForm.opt">
68 <div v-if="times.remain == 0" class="veri-btn pointer" @click="handlerStdSendOTP">{{$t('register.verifyCodeGet')}}</div> 68 <div v-if="times.remain == 0" class="veri-btn pointer" @click="handlerStdSendOTP">{{$t('register.verifyCodeGet')}}</div>
69 <div v-else class="veri-btn-default">{{times.tip}}</div> 69 <div v-else class="veri-btn-default">{{times.tip}}</div>
70 </div> 70 </div>
71 </div> 71 </div>
72 <div class="validator" v-if="errorTips.p2.length > 0 "> 72 <div class="validator" v-if="errorTips.p2.length > 0 ">
73 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p2}} 73 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p2}}
74 </div> 74 </div>
75 </div> 75 </div>
76 </div> 76 </div>
77 77
78 <div class="login-protocol pointer" @click="registerCheck.agreeProtocol = !registerCheck.agreeProtocol"> 78 <div class="login-protocol pointer" @click="registerCheck.agreeProtocol = !registerCheck.agreeProtocol">
79 <img v-if="!registerCheck.agreeProtocol" class="check" src="@/assets/images/login/uncheck.png"> 79 <img v-if="!registerCheck.agreeProtocol" class="check" src="@/assets/images/login/uncheck.png">
80 <img v-if="registerCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> {{$t('login.agree')}} &nbsp; 80 <img v-if="registerCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> {{$t('login.agree')}} &nbsp;
81 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span> 81 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span>
82 </div> 82 </div>
83 <div @click="onSubmitHandler()" class="login-submit pointer flex-center" :class="{disabled: registerDisabled}"> 83 <div @click="onSubmitHandler()" class="login-submit pointer flex-center" :class="{disabled: registerDisabled}">
84 <van-loading v-if="loading" /> 84 <van-loading v-if="loading" />
85 <span>{{$t('register.register')}}</span> 85 <span>{{$t('register.register')}}</span>
86 </div> 86 </div>
87 </div> 87 </div>
88 <!-- 输入密码 --> 88 <!-- 输入密码 -->
89 <div v-if="type == 2" class="login"> 89 <div v-if="type == 2" class="login">
90 <!-- <div class="login-tit"> 90 <!-- <div class="login-tit">
91 <img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png"> 91 <img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png">
92 <img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png"> 92 <img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png">
93 <img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png"> 93 <img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png">
94 </div> --> 94 </div> -->
95 <div class="login-tit2">{{$t('register.title2')}}</div> 95 <div class="login-tit2">{{$t('register.title2')}}</div>
96 <div class="gird-g form"> 96 <div class="gird-g form">
97 <div class="pure-u-1 form-item"> 97 <div class="pure-u-1 form-item">
98 <div class="label"> 98 <div class="label">
99 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}} 99 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
100 </div> 100 </div>
101 <div class="ipt-wrap"> 101 <div class="ipt-wrap">
102 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" :class="{err : errorTips.p4.length > 0}" type="password" v-model="values.password"> 102 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" :class="{err : errorTips.p4.length > 0}" type="password" v-model="values.password">
103 </div> 103 </div>
104 <div class="validator" v-if="errorTips.p4.length > 0 "> 104 <div class="validator" v-if="errorTips.p4.length > 0 ">
105 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p4}} 105 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p4}}
106 </div> 106 </div>
107 </div> 107 </div>
108 <div class="pure-u-1 form-item"> 108 <div class="pure-u-1 form-item">
109 <div class="label"> 109 <div class="label">
110 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}} 110 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}}
111 </div> 111 </div>
112 <div class="ipt-wrap"> 112 <div class="ipt-wrap">
113 <input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" :class="{err : errorTips.p5.length > 0}" type="password" v-model="values.passwordRepeat"> 113 <input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" :class="{err : errorTips.p5.length > 0}" type="password" v-model="values.passwordRepeat">
114 </div> 114 </div>
115 <div class="validator" v-if="errorTips.p5.length > 0 "> 115 <div class="validator" v-if="errorTips.p5.length > 0 ">
116 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p5}} 116 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p5}}
117 </div> 117 </div>
118 </div> 118 </div>
119 </div> 119 </div>
120 <div @click="onRegisterHandler()" class="login-submit pointer flex-center" :class="{disabled: submitDisabled}"> 120 <div @click="onRegisterHandler()" class="login-submit pointer flex-center" :class="{disabled: submitDisabled}">
121 <van-loading v-if="loading" /> 121 <van-loading v-if="loading" />
122 <span>{{$t('register.sure')}}</span> 122 <span>{{$t('register.sure')}}</span>
123 </div> 123 </div>
124 </div> 124 </div>
125 </div> 125 </div>
126 </div> 126 </div>
127
128 <div class="content" v-else>
129 <div class="top-space"></div>
130 <div class="box">
131 <!-- 手机验证 -->
132 <div class="login">
133
134 <div class="login-tit2">{{$t('register.title')}}</div>
135 <div class="gird-g form">
136 <div class="pure-u-1 form-item">
137
138 <div class="label">
139 <img src="@/assets/images/register/icon-register-phone.png"> {{mobileTip.name}}
140 </div>
141 <div class="ipt-wrap">
142 <div class="region-tel ipt-wrap">
143 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt="">
144 <el-select class="ipt" v-model="mobileNoType">
145 <el-option v-for="(item,index) in mobileOptions" :key="index" :value="item.type" :label="item.areaCode">{{item.areaCode}}</el-option>
146 </el-select>
147 </div>
148
149 <div class="ipt ipt2" :class="{err : errorTips.p1.length > 0}">
150 <input :placeholder="mobileTip.placeHolder" class="ipt-tel" type="text" v-model="registerForm.mobileNo" @blur="checkMobileActivity($event)">
151 </div>
152 </div>
153 <div class="validator" v-if="errorTips.p1.length > 0 ">
154 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p1}}
155 </div>
156 </div>
157 127
158 <div class="pure-u-1 form-item"> 128 <!-- OPT -->
159 <div class="label"> 129 <div class="content" v-else>
160 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}} 130 <div class="top-space"></div>
161 </div> 131 <div class="box">
162 <div class="ipt-wrap"> 132 <!-- 手机验证 -->
163 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" :class="{err : errorTips.p4.length > 0}" type="password" v-model="values.password"> 133 <div class="login">
164 </div> 134
165 <div class="validator" v-if="errorTips.p4.length > 0 "> 135 <div class="login-tit2">{{$t('register.title')}}</div>
166 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p4}} 136 <div class="gird-g form">
167 </div> 137
168 </div> 138 <!-- 账号 -->
169 <div class="pure-u-1 form-item"> 139 <div class="pure-u-1 form-item">
170 <div class="label"> 140 <div class="label">
171 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}} 141 <img src="@/assets/images/login/icon-login-user.png"> {{$t('login.account')}}
172 </div> 142 </div>
173 <div class="ipt-wrap"> 143 <div class="ipt-wrap">
174 <input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" :class="{err : errorTips.p5.length > 0}" type="password" v-model="values.passwordRepeat"> 144 <!-- <input v-model="registerForm.userId" :placeholder="$t('register.accountPlaceholder')" class="ipt" :class="{ err : errorTips.e1.length > 0 }" type="text" @blur="userIdLegalCheck"> -->
175 </div> 145 <input v-model="registerForm.userId" :placeholder="$t('register.accountPlaceholder')" class="ipt" :class="{ err : errorTips.e1.length > 0 }" type="text" >
176 <div class="validator" v-if="errorTips.p5.length > 0 "> 146 </div>
177 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p5}} 147 <div class="validator" v-if="errorTips.p1.length > 0 ">
178 </div> 148 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p1}}
179 </div> 149 </div>
180 150 </div>
181 </div> 151
182 152 <!-- 手机号 -->
183 <div class="login-protocol pointer" :class="{loginLeft:locale!='en'}" @click="registerCheck.agreeProtocol = !registerCheck.agreeProtocol"> 153 <div class="pure-u-1 form-item">
184 <img v-if="!registerCheck.agreeProtocol" class="check" src="@/assets/images/login/uncheck.png"> 154
185 <img v-if="registerCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> {{$t('login.agree')}} &nbsp; 155 <div class="label">
186 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span> 156 <img src="@/assets/images/register/icon-register-phone.png"> {{mobileTip.name}}
187 </div> 157 </div>
188 <div @click="registerV2Handler()" class="login-submit pointer flex-center" :class="{disabled: registerDisabledV2}"> 158 <div class="ipt-wrap">
189 <van-loading v-if="loading" /> 159 <div class="region-tel ipt-wrap">
190 <span>{{$t('register.register')}}</span> 160 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt="">
191 </div> 161 <el-select class="ipt" v-model="mobileNoType">
192 </div> 162 <el-option v-for="(item,index) in mobileOptions" :key="index" :value="item.type" :label="item.areaCode">{{item.areaCode}}</el-option>
193 163 </el-select>
194 </div> 164 </div>
195 </div> 165
196 </div> 166 <div class="ipt ipt2" :class="{err : errorTips.p1.length > 0}">
167 <input :placeholder="mobileTip.placeHolder" class="ipt-tel" type="text" v-model="registerForm.mobileNo" @blur="checkMobileActivity($event)">
168 </div>
169 </div>
170 <div class="validator" v-if="errorTips.p1.length > 0 ">
171 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p1}}
172 </div>
173 </div>
174
175 <!-- 短信验证 -->
176 <div class="pure-u-1 form-item">
177 <div class="label">
178 <img src="@/assets/images/register/icon-register-phone.png"> {{$t('login.SMSVerificationCode')}}
179 </div>
180 <div class="ipt-wrap">
181 <div class="ipt ipt2" :class="{ err : errorTips.oe2.length > 0 }">
182 <input :placeholder="$t('login.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="registerForm.otp">
183 <!-- <div v-if="times.remain == 0" class="veri-btn pointer" @click="sendOTPWhenOneAccountCenterOff">{{$t('register.verifyCodeGet')}}</div> -->
184 <div v-if="times.remain == 0" class="veri-btn pointer" >{{$t('register.verifyCodeGet')}}</div>
185 <div v-else class="veri-btn-default">{{times.tip}}</div>
186 </div>
187 </div>
188 <div class="validator" v-if="errorTips.oe2.length > 0 ">
189 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.oe2}}
190 </div>
191 </div>
192
193 <!--
194 <div class="pure-u-1 form-item">
195 <div class="label">
196 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
197 </div>
198 <div class="ipt-wrap">
199 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" :class="{err : errorTips.p4.length > 0}" type="password" v-model="values.password">
200 </div>
201 <div class="validator" v-if="errorTips.p4.length > 0 ">
202 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p4}}
203 </div>
204 </div>
205 <div class="pure-u-1 form-item">
206 <div class="label">
207 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}}
208 </div>
209 <div class="ipt-wrap">
210 <input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" :class="{err : errorTips.p5.length > 0}" type="password" v-model="values.passwordRepeat">
211 </div>
212 <div class="validator" v-if="errorTips.p5.length > 0 ">
213 <img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p5}}
214 </div>
215 </div> -->
216
217 </div>
218
219 <div class="login-protocol pointer" :class="{loginLeft:locale!='en'}" @click="registerCheck.agreeProtocol = !registerCheck.agreeProtocol">
220 <img v-if="!registerCheck.agreeProtocol" class="check" src="@/assets/images/login/uncheck.png">
221 <img v-if="registerCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> {{$t('login.agree')}} &nbsp;
222 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span>
223 </div>
224 <div @click="registerV2Handler()" class="login-submit pointer flex-center" :class="{disabled: registerDisabledV2}">
225 <van-loading v-if="loading" />
226 <span>{{$t('register.register')}}</span>
227 </div>
228 </div>
229
230 </div>
231 </div>
232 </div>
197 </template> 233 </template>
198 234
199 <script src="./register.js"></script> 235 <script src="./register.js"></script>
......