Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
fe41890b by joe
Options

部分交互修改

1 parent 17e9ce89
Inline Side-by-side
Showing 15 changed files with 408 additions and 253 deletions
<template>
<div id="app">
<v-header class="header"></v-header>
<main ref="container" class="main-container">
<router-view />
</main>
<v-footer></v-footer>
</div>
<div id="app">
<v-header class="header"></v-header>
<main ref="container" class="main-container">
<router-view />
</main>
<v-footer></v-footer>
</div>
</template>
......@@ -14,6 +14,10 @@ import { mapGetters, mapActions, mapState } from "vuex";
import { getCookie } from "@utils/utils.js";
import VHeader from "@components/home/header/header.vue";
import VFooter from "@components/home/footer/footer.vue";
import api from "@/api/api";
import { httpGet, httpPost } from "@/api/fetch-api.js";
var UA = require("ua-device");
export default {
......@@ -35,6 +39,24 @@ export default {
let deviceType = output.device.type;
let isMobile = deviceType == "mobile";
this.$store.commit("IS_MOBILE", isMobile);
},
refreshProfile() {
let userInfoStr = decodeURIComponent(getCookie("_user_profile"));
if (userInfoStr) {
try {
let userInfo = JSON.parse(decodeURIComponent(userInfoStr));
this.$store.commit("SET_USER_INFO", userInfo);
if (userInfo && userInfo.sid) {
httpPost({ url: api.profile, sidStr: userInfo.sid }).then(res => {
if (res) {
this.$store.commit("SET_USER_INFO", userInfo);
} else {
this.$store.commit("SET_USER_INFO", null);
}
});
}
} catch (e) {}
}
}
},
created() {
......@@ -43,13 +65,7 @@ export default {
// };
this.refreshUA();
//
let userInfoStr = decodeURIComponent(getCookie("_user_profile"));
if (userInfoStr) {
try {
let userInfo = JSON.parse(decodeURIComponent(userInfoStr));
this.$store.commit("SET_USER_INFO", userInfo);
} catch (e) {}
}
this.refreshProfile();
}
};
</script>
......
module.exports = {
load: "/pingan_hklife_webapi/user/load",
logout: "/pingan_hklife_webapi/user/logout",
// 用户身份信息
profile: "/pingan_hklife_webapi/user/profile",
// 是否显示图形验证码接口
stdIsShowImageVcode: "/pingan_hklife_webapi/auth/stdIsShowImageVcode",
// 刷新图形验证码接口
......
......@@ -14,7 +14,7 @@ function Toast(msg) {
// 服务器地址
// let base = process.env.REQUEST_DOMAIN || "http://localhost:9101";
// let base = COM.baseUrl;
console.log(process.env);
// console.log(process.env);
let base = "";
const axios = axiosIns.create({
baseURL: process.env.VUE_APP_BASE_URL,
......@@ -146,7 +146,8 @@ export const httpPost = params => {
let {
url,
data,
sid
sid,
sidStr
} = params;
let headers = {};
if (sid) {
......@@ -157,6 +158,13 @@ export const httpPost = params => {
}
}
}
if (sidStr) {
headers = {
headers: {
sid: sidStr
}
}
}
return axios.post(`${base}${url}`, data, headers).then(res => res.data.content);
}
......
......@@ -44,6 +44,10 @@ export default {
},
},
computed: {
...mapState({
isSmallScreen: state => state.isSmallScreen,
userInfo: state => state.userInfo
}),
locale() {
return this.$i18n.locale || 'tc';
},
......@@ -108,7 +112,7 @@ export default {
}
// menuData.list = list;
navList = list;
console.log("navList:", navList);
// console.log("navList:", navList);
}
this.navList = navList;
......@@ -122,6 +126,9 @@ export default {
this.$nextTick(() => {
this.$refs.panel.scrollTop = 0;
});
},
userInfo(val) {
this.initData();
}
},
};
......
......@@ -92,6 +92,7 @@
width: 90%;
height: auto;
top: 20%;
&-title {}
......
......@@ -104,7 +104,7 @@ export default {
case "0":
message = this.i18n.infomationImprove.successMsg;
this.showModal(message, "succ");
let path = this.$route.query.callback || "/index";
let path = this.$route.query.callback || "/";
this.targetPath = path;
break;
}
......@@ -169,9 +169,9 @@ export default {
message = this.i18n.infomationImprove.errorTips.e6;
let idNo = this.information.idNo + "";
switch (this.information.idType) {
case "1": // 身份證
message = idNo.length == 18 ? "" : message;
break;
// case "1": // 身份證
// message = idNo.length == 18 ? "" : message;
// break;
case "2": // 護照
message = idNo.length > 3 && idNo.length < 50 ? "" : message;
break;
......
......@@ -43,8 +43,8 @@ export default {
loginForm: {
// userId: "18334783910",
// password: "qweqwe123"
userId: "",
password: "",
userId: "18145729463",
password: "ccc123!@#",
imageValue: "",
mobileNo: "",
......@@ -90,14 +90,36 @@ export default {
},
i18n() {
return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
},
pwdLoginDisabled() {
let b1 = !this.loginCheck.agreeProtocol;
let b2 = !this.loginForm.userId;
let b3 = !this.loginForm.password;
return b1 || b2 || b3;
},
otpLoginDisabled() {
let b1 = !this.loginCheck.agreeProtocol;
let b2 = !this.loginForm.mobileNo;
let b3 = !this.loginForm.otp;
let b4 = !this.values.token;
let b5 = this.values.vcodeuuid && !this.loginForm.imageValue;
return b1 || b2 || b3 || b4 || b5;
}
},
methods: {
showModal(content, icon) {
icon = !icon || typeof icon === "undefined" ? "succ" : "succ";
icon = !icon || typeof icon === "undefined" ? "succ" : icon;
this.modalIcon = icon;
this.modalContent = content;
this.modalVisiable = true;
if (icon == "succ") {
this.modalVisiable = true;
} else {
this.modalSimpleVisiable = true;
}
},
closeModal() {
this.modalVisiable = false;
this.modalSimpleVisiable = false;
},
onCheckHandler() {
......@@ -123,7 +145,7 @@ export default {
onLoginTypeHandler(val) {
this.type = val;
},
initData() {},
initData() { },
handlerIsShowImageVcode() {
return new Promise((resolve, reject) => {
httpPost({
......@@ -151,6 +173,9 @@ export default {
// 刷新图形二维码
},
handlerLogin() {
if ((this.type == 1 && this.pwdLoginDisabled) || (this.type == 2 && this.otpLoginDisabled)) {
return;
}
this.refreshDeviceId();
if (!this.loginCheck.agreeProtocol) {
this._showAgreeProtocalTips();
......@@ -233,7 +258,7 @@ export default {
}
},
_redirectTo() {
let path = this.$route.query.callback || "/index";
let path = this.$route.query.callback || "/";
this.$router.push({
path: path
});
......@@ -331,7 +356,9 @@ export default {
// 检测手机号是否正确
return new Promise((resolve, reject) => {
let mobile = this.loginForm.mobileNo;
if (mobile.length != 8 && mobile.length != 11) {
let hkMobile = mobile.length == 8 && /^[5689]{1}\d{7}$/.test(mobile);
let zhMobile = mobile.length == 11 && /^((13[0-9])|(14[5,7,9])|(15([0-3]|[5-9]))|(166)|(17[0-9])|(18[0-9])|(19[0-9]))\d{8}$/.test(mobile);
if (!hkMobile && !zhMobile) {
this._showMobileNoIllegalTip()
return;
}
......@@ -492,5 +519,5 @@ export default {
// console.log("PK === ", this.PK)
// console.log("E === ", this.E)
},
created() {}
created() { }
}
......
......@@ -2,7 +2,7 @@
<template>
<div>
<modal-comp :visible="modalVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback"></modal-comp>
<modal-simple-comp :visible="modalSimpleVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback" :close="closeCallback"></modal-simple-comp>
<modal-simple-comp :visible="modalSimpleVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="closeModal" :overlay="closeModal" :close="closeModal"></modal-simple-comp>
<modal-upload-card-comp :visible="modalUploadCardVisiable" :show-confirm="true" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback" :close="closeCallback"></modal-upload-card-comp>
<div class="content">
<div class="ebg">
......@@ -62,7 +62,7 @@
<img v-if="loginCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> {{$t('login.agree')}}
<span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span>
</div>
<div @click="handlerLogin()" class="login-submit pointer">{{$t('login.login')}}</div>
<div @click="handlerLogin()" class="login-submit pointer" :class="{disabled: pwdLoginDisabled}">{{$t('login.login')}}</div>
<div class="login-func">
<div @click="onRegisterHandler()" class="login-func-btn pointer">{{$t('login.register')}}</div>
<div @click="onForgetHandler()" class="login-func-btn pointer">{{$t('login.forget')}}</div>
......@@ -125,7 +125,7 @@
<img v-if="loginCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> {{$t('login.agree')}}
<span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span>
</div>
<div @click="handlerLogin()" class="login-submit pointer">{{$t('login.login')}}</div>
<div @click="handlerLogin()" class="login-submit pointer" :class="{disabled: otpLoginDisabled}">{{$t('login.login')}}</div>
<div class="login-func">
<div @click="toRegisterPage()" class="login-func-btn pointer">{{$t('login.register')}}</div>
<div @click="onForgetHandler()" class="login-func-btn pointer">{{$t('login.forget')}}</div>
......
......@@ -5,6 +5,7 @@ import {
} from '@/api/fetch-api.js'
import modalComp from '@/components/modal-comp/modal-comp.vue';
import modalSimpleComp from '@/components/modal-simple-comp/modal-simple-comp.vue';
import { passwordEncrypt } from '@/utils/encrypt.js';
export default {
......@@ -20,6 +21,7 @@ export default {
remain: 0, // 剩余时间
tip: "" // 显示的文字
},
modalSimpleVisiable: false,
modalVisiable: false,
targetPath: "",
modalIcon: "succ",
......@@ -45,6 +47,21 @@ export default {
}
},
components: {},
computed: {
s1BtnDisabled() {
let b1 = !this.step1.userId ? true : false;
return b1;
},
s3BtnDisabled() {
let b1 = !this.step3.otp ? true : false;
return b1;
},
s4BtnDisabled() {
let b1 = !this.step4.pwd ? true : false;
let b2 = !this.step4.pwdRepeat ? true : false;
return b1 || b2;
}
},
methods: {
initData() { },
i18n() {
......@@ -52,12 +69,23 @@ export default {
return i18n;
},
showModal(content, icon) {
icon = !icon || typeof icon === "undefined" ? "succ" : "succ";
icon = !icon || typeof icon === "undefined" ? "succ" : icon;
this.modalIcon = icon;
this.modalContent = content;
this.modalVisiable = true;
if (icon == "succ") {
this.modalVisiable = true;
} else {
this.modalSimpleVisiable = true;
}
},
closeModal() {
this.modalVisiable = false;
this.modalSimpleVisiable = false;
},
locateUserInfo() {
if (this.s1BtnDisabled) {
return
}
// 定位用户信息
if (!this.step1.userId) {
this.step1.error = this.i18n().passwordReset.type1.error;
......@@ -109,6 +137,9 @@ export default {
})
},
checkOtp() {
if (this.s3BtnDisabled) {
return;
}
// 发送验证码
if (!this.step3.otp) {
this.step3.error = this.i18n().passwordReset.type2.error1;
......@@ -136,6 +167,9 @@ export default {
})
},
resetPwd() {
if (this.s4BtnDisabled) {
return;
}
let c1 = this.checkPassword(this.step4.pwd);
if (c1) {
this.$set(this.step, 'error1', c1);
......@@ -163,7 +197,7 @@ export default {
break
default:
message = this.i18n().passwordCheck.error4;
this.showModal(message, "succ");
this.showModal(message, "info");
break;
}
}
......@@ -211,7 +245,7 @@ export default {
case "COMMON_ERROR_E2":
// 身份过期了，请重新登录
this.values.cid = "";
this.showModal(this.i18n().passwordReset.cidExpire);
this.showModal(this.i18n().passwordReset.cidExpire, "info");
this.step2.idNo = "";
this.step3.otp = "";
this.step3.error = "";
......@@ -259,6 +293,7 @@ export default {
mounted() { },
created() { },
components: {
modalComp
modalComp,
modalSimpleComp
}
}
......
<template>
<div class="content">
<div>
<modal-comp :visible="modalVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback"></modal-comp>
<div class="ebg">
<img src="@/assets/images/common/login-bg.png">
</div>
<div class="top-space"></div>
<div class="box">
<modal-simple-comp :visible="modalSimpleVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="closeModal" :overlay="closeModal" :close="closeModal"></modal-simple-comp>
<div class="content">
<div class="ebg">
<img src="@/assets/images/common/login-bg.png">
</div>
<div class="top-space"></div>
<div class="box">
<!-- 输入用户信息 -->
<div v-if="type == 1" class="login">
<div class="login-tit">{{$t('passwordReset.type1.title')}}</div>
<div class="login-tit-space-1"></div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-phone.png"> {{$t('passwordReset.type1.t1')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.type1.t1Placeholder')" class="ipt" type="text" v-model="step1.userId">
</div>
<div class="validator" v-if="step1.error.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step1.error}}
<!-- 输入用户信息 -->
<div v-if="type == 1" class="login">
<div class="login-tit">{{$t('passwordReset.type1.title')}}</div>
<div class="login-tit-space-1"></div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-phone.png"> {{$t('passwordReset.type1.t1')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.type1.t1Placeholder')" class="ipt" type="text" v-model="step1.userId">
</div>
<div class="validator" v-if="step1.error.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step1.error}}
</div>
</div>
</div>
<div @click="locateUserInfo()" class="login-submit pointer" :class="{disabled: s1BtnDisabled}">{{$t('passwordReset.type1.submit')}}</div>
</div>
<div @click="locateUserInfo()" class="login-submit pointer">{{$t('passwordReset.type1.submit')}}</div>
</div>
<!-- 核对信息 -->
<div v-if="type == 2" class="login">
<div class="login-tit">{{$t('passwordReset.type3.title')}}</div>
<div class="login-tit-space-1"></div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-phone.png"> {{$t('passwordReset.type3.t1')}}
</div>
<div class="ipt-wrap">
<input class="ipt disable" type="text" v-model="step2.idNo">
<!-- 核对信息 -->
<div v-if="type == 2" class="login">
<div class="login-tit">{{$t('passwordReset.type3.title')}}</div>
<div class="login-tit-space-1"></div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-phone.png"> {{$t('passwordReset.type3.t1')}}
</div>
<div class="ipt-wrap">
<input class="ipt disable" type="text" v-model="step2.idNo">
</div>
</div>
</div>
<div @click="sureIdNo()" class="login-submit pointer">{{$t('passwordReset.type3.submit')}}</div>
</div>
<div @click="sureIdNo()" class="login-submit pointer">{{$t('passwordReset.type3.submit')}}</div>
</div>
<!-- 找回密码 -->
<div v-if="type == 3" class="login">
<div class="login-tit">{{$t('passwordReset.type2.title')}}</div>
<div class="login-tit-space-1"></div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-phone.png"> {{$t('passwordReset.type2.t1Placeholder')}}
</div>
<div class="ipt-wrap">
<div class="ipt ipt2">
<input :placeholder="$t('passwordReset.type2.t1Placeholder')" type="text" v-model="step3.otp">
<div v-if="times.remain == 0" class="veri-btn pointer" @click="sendOtp" >{{$t('register.verifyCodeGet')}}</div>
<div v-else class="veri-btn-default">{{times.tip}}</div>
<!-- 找回密码 -->
<div v-if="type == 3" class="login">
<div class="login-tit">{{$t('passwordReset.type2.title')}}</div>
<div class="login-tit-space-1"></div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-phone.png"> {{$t('passwordReset.type2.t1Placeholder')}}
</div>
<div class="ipt-wrap">
<div class="ipt ipt2">
<input :placeholder="$t('passwordReset.type2.t1Placeholder')" type="text" v-model="step3.otp">
<div v-if="times.remain == 0" class="veri-btn pointer" @click="sendOtp" >{{$t('register.verifyCodeGet')}}</div>
<div v-else class="veri-btn-default">{{times.tip}}</div>
</div>
</div>
<div class="validator" v-if="step3.error.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step3.error}}
</div>
</div>
<div class="validator" v-if="step3.error.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step3.error}}
</div>
</div>
<div @click="checkOtp()" class="login-submit pointer" :class="{disabled: s3BtnDisabled}">{{$t('passwordReset.type2.submit')}}</div>
</div>
<div @click="checkOtp()" class="login-submit pointer">{{$t('passwordReset.type2.submit')}}</div>
</div>
<!-- 重置密码 -->
<div v-if="type == 4" class="login">
<div class="login-tit">{{$t('passwordReset.type4.title')}}</div>
<div class="login-tit-space-4"></div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('passwordReset.type4.t1')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.type4.t1Placeholder')" class="ipt" type="password" v-model="step4.pwd">
</div>
<div class="validator" v-if="step4.error1.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step4.error1}}
</div>
</div>
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('passwordReset.type4.t2')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.type4.t2Placeholder')" class="ipt" type="password" v-model="step4.pwdRepeat">
<!-- 重置密码 -->
<div v-if="type == 4" class="login">
<div class="login-tit">{{$t('passwordReset.type4.title')}}</div>
<div class="login-tit-space-4"></div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('passwordReset.type4.t1')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.type4.t1Placeholder')" class="ipt" type="password" v-model="step4.pwd">
</div>
<div class="validator" v-if="step4.error1.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step4.error1}}
</div>
</div>
<div class="validator" v-if="step4.error2.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step4.error2}}
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('passwordReset.type4.t2')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.type4.t2Placeholder')" class="ipt" type="password" v-model="step4.pwdRepeat">
</div>
<div class="validator" v-if="step4.error2.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step4.error2}}
</div>
</div>
</div>
<div @click="resetPwd()" class="login-submit pointer" :class="{disabled: s4BtnDisabled}">{{$t('passwordReset.type4.submit')}}</div>
</div>
<div @click="resetPwd()" class="login-submit pointer">{{$t('passwordReset.type4.submit')}}</div>
</div>
</div>
</div>
......
......@@ -8,6 +8,7 @@ import {
} from '@/api/fetch-api.js'
import modalComp from '@/components/modal-comp/modal-comp.vue';
import modalSimpleComp from '@/components/modal-simple-comp/modal-simple-comp.vue';
import { passwordEncrypt } from '@/utils/encrypt.js';
export default {
......@@ -31,6 +32,7 @@ export default {
remain: 0, // 剩余时间
tip: "" // 显示的文字
},
modalSimpleVisiable: false,
modalVisiable: false,
targetPath: "",
modalIcon: "succ",
......@@ -44,12 +46,23 @@ export default {
return i18n;
},
showModal(content, icon) {
icon = !icon || typeof icon === "undefined" ? "succ" : "succ";
icon = !icon || typeof icon === "undefined" ? "succ" : icon;
this.modalIcon = icon;
this.modalContent = content;
this.modalVisiable = true;
if (icon == "succ") {
this.modalVisiable = true;
} else {
this.modalSimpleVisiable = true;
}
},
closeModal() {
this.modalVisiable = false;
this.modalSimpleVisiable = false;
},
resetPwd() {
if (this.submitBtnDisabled) {
return;
}
if (!this.values.oldPwd) {
this.step.error0 = this.i18n().passwordReset.oldPwdPlaceholde;
return;
......@@ -139,9 +152,18 @@ export default {
}
},
},
computed: {
submitBtnDisabled() {
let b1 = !this.values.oldPwd ? true : false;
let b2 = !this.values.pwd ? true : false;
let b3 = !this.values.pwdRepeat ? true : false;
return b1 || b2 || b3;
}
},
mounted() { },
created() { },
components: {
modalComp
modalComp,
modalSimpleComp
}
}
......
<template>
<div class="content">
<div>
<modal-simple-comp :visible="modalSimpleVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="closeModal" :overlay="closeModal" :close="closeModal"></modal-simple-comp>
<modal-comp :visible="modalVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback"></modal-comp>
<div class="ebg">
<img src="@/assets/images/common/login-bg.png">
</div>
<div class="top-space"></div>
<div class="box">
<div class="login">
<div class="login-tit">{{$t('passwordReset.type4.title')}}</div>
<div class="login-tit-space-4"></div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('passwordReset.oldPwd')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.oldPwdPlaceholde')" class="ipt" type="password" v-model="values.oldPwd">
</div>
<div class="validator" v-if="step.error0.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step.error0}}
</div>
</div>
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('passwordReset.type4.t1')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.type4.t1Placeholder')" class="ipt" type="password" v-model="values.pwd">
</div>
<div class="validator" v-if="step.error1.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step.error1}}
</div>
</div>
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('passwordReset.type4.t2')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.type4.t2Placeholder')" class="ipt" type="password" v-model="values.pwdRepeat">
</div>
<div class="validator" v-if="step.error2.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step.error2}}
<div class="content">
<div class="ebg">
<img src="@/assets/images/common/login-bg.png">
</div>
<div class="top-space"></div>
<div class="box">
<div class="login">
<div class="login-tit">{{$t('passwordReset.type4.title')}}</div>
<div class="login-tit-space-4"></div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('passwordReset.oldPwd')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.oldPwdPlaceholde')" class="ipt" type="password" v-model="values.oldPwd">
</div>
<div class="validator" v-if="step.error0.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step.error0}}
</div>
</div>
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('passwordReset.type4.t1')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.type4.t1Placeholder')" class="ipt" type="password" v-model="values.pwd">
</div>
<div class="validator" v-if="step.error1.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step.error1}}
</div>
</div>
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('passwordReset.type4.t2')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('passwordReset.type4.t2Placeholder')" class="ipt" type="password" v-model="values.pwdRepeat">
</div>
<div class="validator" v-if="step.error2.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt=""> {{step.error2}}
</div>
</div>
</div>
<div @click="resetPwd()" class="login-submit pointer" :class="{disabled: submitBtnDisabled}">{{$t('passwordReset.type4.submit')}}</div>
</div>
<div @click="resetPwd()" class="login-submit pointer">{{$t('passwordReset.type4.submit')}}</div>
</div>
</div>
</div>
......
......@@ -5,6 +5,7 @@ import {
} from '@/api/fetch-api.js'
import modalComp from '@/components/modal-comp/modal-comp.vue';
import modalSimpleComp from '@/components/modal-simple-comp/modal-simple-comp.vue';
import { passwordEncrypt } from '@/utils/encrypt.js';
export default {
......@@ -47,6 +48,7 @@ export default {
p4: "",// 密碼
p5: "",// 確認密碼
},
modalSimpleVisiable: false,
modalVisiable: false,
targetPath: "",
modalIcon: "succ",
......@@ -54,7 +56,8 @@ export default {
}
},
components: {
modalComp
modalComp,
modalSimpleComp
},
computed: {
locale() {
......@@ -62,14 +65,34 @@ export default {
},
i18n() {
return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
},
registerDisabled() {
let b1 = !this.registerCheck.agreeProtocol;
let b2 = !this.values.token;
let b3 = this.values.vcodeuuid && !this.registerForm.imageValue;
let b4 = !this.registerForm.opt;
return b1 || b2 || b3 || b4;
},
submitDisabled() {
let b1 = !this.values.password ? true : false;
let b2 = !this.values.passwordRepeat ? true : false;
return b1 || b2;
}
},
methods: {
showModal(content, icon) {
icon = !icon || typeof icon === "undefined" ? "succ" : "succ";
icon = !icon || typeof icon === "undefined" ? "succ" : icon;
this.modalIcon = icon;
this.modalContent = content;
this.modalVisiable = true;
if (icon == "succ") {
this.modalVisiable = true;
} else {
this.modalSimpleVisiable = true;
}
},
closeModal() {
this.modalVisiable = false;
this.modalSimpleVisiable = false;
},
onProtocolHandler() {
this.$router.push({
......@@ -97,12 +120,13 @@ export default {
return new Promise((resolve, reject) => {
let mobile = this.registerForm.mobileNo;
if (this.mobileNoType == "hk") {
if (mobile.length != 8) {
if (mobile.length != 8 && !/^[5689]{1}\d{7}$/.test(mobile)) {
this._showMobileNoIllegalTip()
return;
}
} else {
if (mobile.length != 11) {
if (mobile.length != 11 &&
!/^((13[0-9])|(14[5,7,9])|(15([0-3]|[5-9]))|(166)|(17[0-9])|(18[0-9])|(19[0-9]))\d{8}$/.test(mobile)) {
this._showMobileNoIllegalTip()
return;
}
......@@ -188,6 +212,9 @@ export default {
},
onSubmitHandler() {
// this.type = 2;
if (this.registerDisabled) {
return;
}
this._checkParams().then(() => {
this._regCheck().then(() => {
// 验证短信验证码
......
<template>
<div class="content">
<div>
<modal-simple-comp :visible="modalSimpleVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="closeModal" :close="closeModal"></modal-simple-comp>
<modal-comp :visible="modalVisiable" :show-confirm="false" :icon="modalIcon" :content="modalContent" :confirm="modalCallback" :overlay="modalCallback"></modal-comp>
<div class="ebg">
<img src="@/assets/images/common/login-bg.png">
</div>
<div class="top-space"></div>
<div class="step">
<img v-if="type == 1" src="@/assets/images/register/register-step-1.png">
<img v-if="type == 2" src="@/assets/images/register/register-step-2.png">
</div>
<div class="box">
<!-- 手机验证 -->
<div v-if="type == 1" class="login">
<div class="content">
<div class="ebg">
<img src="@/assets/images/common/login-bg.png">
</div>
<div class="top-space"></div>
<div class="step">
<img v-if="type == 1" src="@/assets/images/register/register-step-1.png">
<img v-if="type == 2" src="@/assets/images/register/register-step-2.png">
</div>
<div class="box">
<!-- 手机验证 -->
<div v-if="type == 1" class="login">
<div class="login-tit">
<img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png">
<img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png">
<img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png">
</div>
<div class="login-tit2">{{$t('register.title')}}</div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="ipt-wrap">
<img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt="">
<select class="ipt" v-model="mobileNoType">
<option v-for="(item,index) in mobileOptions" :key="index" :value="item.type">{{item.name}}</option>
</select>
</div>
<div class="login-tit">
<img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png">
<img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png">
<img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png">
</div>
<div class="pure-u-1 form-item">
<div class="ipt-wrap">
<div class="ipt ipt2" :class="{err : errorTips.p1.length > 0}">
<div class="region-tel">{{mobileTip.areaCode}}</div>
<input :placeholder="mobileTip.placeHolder" class="ipt-tel" type="text" v-model="registerForm.mobileNo">
<div class="login-tit2">{{$t('register.title')}}</div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="ipt-wrap">
<img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt="">
<select class="ipt" v-model="mobileNoType">
<option v-for="(item,index) in mobileOptions" :key="index" :value="item.type">{{item.name}}</option>
</select>
</div>
</div>
<div class="validator" v-if="errorTips.p1.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p1}}
<div class="pure-u-1 form-item">
<div class="ipt-wrap">
<div class="ipt ipt2" :class="{err : errorTips.p1.length > 0}">
<div class="region-tel">{{mobileTip.areaCode}}</div>
<input :placeholder="mobileTip.placeHolder" class="ipt-tel" type="text" v-model="registerForm.mobileNo">
</div>
</div>
<div class="validator" v-if="errorTips.p1.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p1}}
</div>
</div>
</div>
<div class="pure-u-1 form-item" v-if="registerCheck.showImageCode">
<div class="ipt-wrap">
<input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" :class="{err : errorTips.p3.length > 0}" type="text" v-model="registerForm.imageValue">
<div class="ipt verify-btn pointer vcode" @click="handlerRefreshImageVcode">
<img :src="values.imageBase64">
<div class="pure-u-1 form-item" v-if="registerCheck.showImageCode">
<div class="ipt-wrap">
<input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" :class="{err : errorTips.p3.length > 0}" type="text" v-model="registerForm.imageValue">
<div class="ipt verify-btn pointer vcode" @click="handlerRefreshImageVcode">
<img :src="values.imageBase64">
</div>
</div>
</div>
<div class="validator" v-if="errorTips.p3.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p3}}
</div>
</div>
<div class="pure-u-1 form-item">
<div class="ipt-wrap">
<div class="ipt ipt2" :class="{err : errorTips.p2.length > 0}">
<input :placeholder="$t('register.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="registerForm.opt">
<div v-if="times.remain == 0" class="veri-btn pointer" @click="handlerStdSendOTP">{{$t('register.verifyCodeGet')}}</div>
<div v-else class="veri-btn-default">{{times.tip}}</div>
<div class="validator" v-if="errorTips.p3.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p3}}
</div>
</div>
<div class="validator" v-if="errorTips.p2.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p2}}
<div class="pure-u-1 form-item">
<div class="ipt-wrap">
<div class="ipt ipt2" :class="{err : errorTips.p2.length > 0}">
<input :placeholder="$t('register.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="registerForm.opt">
<div v-if="times.remain == 0" class="veri-btn pointer" @click="handlerStdSendOTP">{{$t('register.verifyCodeGet')}}</div>
<div v-else class="veri-btn-default">{{times.tip}}</div>
</div>
</div>
<div class="validator" v-if="errorTips.p2.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p2}}
</div>
</div>
</div>
</div>
<div class="login-protocol pointer" @click="registerCheck.agreeProtocol = !registerCheck.agreeProtocol">
<img v-if="!registerCheck.agreeProtocol" class="check" src="@/assets/images/login/un-check.png">
<img v-if="registerCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> {{$t('login.agree')}}
<span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span>
</div>
<div @click="onSubmitHandler()" class="login-submit pointer">{{$t('register.register')}}</div>
</div>
<!-- 输入密码 -->
<div v-if="type == 2" class="login">
<div class="login-tit">
<img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png">
<img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png">
<img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png">
<div class="login-protocol pointer" @click="registerCheck.agreeProtocol = !registerCheck.agreeProtocol">
<img v-if="!registerCheck.agreeProtocol" class="check" src="@/assets/images/login/un-check.png">
<img v-if="registerCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> {{$t('login.agree')}}
<span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span>
</div>
<div @click="onSubmitHandler()" class="login-submit pointer" :class="{disabled: registerDisabled}">{{$t('register.register')}}</div>
</div>
<div class="login-tit2">{{$t('register.title2')}}</div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" :class="{err : errorTips.p4.length > 0}" type="password" v-model="values.password">
</div>
<div class="validator" v-if="errorTips.p4.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p4}}
</div>
<!-- 输入密码 -->
<div v-if="type == 2" class="login">
<div class="login-tit">
<img v-if="locale == 'zh'" src="@/assets/images/login/login-tit-zh.png">
<img v-if="locale == 'tc'" src="@/assets/images/login/login-tit-tc.png">
<img v-if="locale == 'en'" class="img-en" src="@/assets/images/login/login-tit-en.png">
</div>
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" :class="{err : errorTips.p5.length > 0}" type="password" v-model="values.passwordRepeat">
<div class="login-tit2">{{$t('register.title2')}}</div>
<div class="gird-g form">
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" :class="{err : errorTips.p4.length > 0}" type="password" v-model="values.password">
</div>
<div class="validator" v-if="errorTips.p4.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p4}}
</div>
</div>
<div class="validator" v-if="errorTips.p5.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p5}}
<div class="pure-u-1 form-item">
<div class="label">
<img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}}
</div>
<div class="ipt-wrap">
<input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" :class="{err : errorTips.p5.length > 0}" type="password" v-model="values.passwordRepeat">
</div>
<div class="validator" v-if="errorTips.p5.length > 0 ">
<img src="@/assets/images/common/icon-notice.png" alt="">{{errorTips.p5}}
</div>
</div>
</div>
<div @click="onRegisterHandler()" class="login-submit pointer" :class="{disabled: submitDisabled}">{{$t('register.sure')}}</div>
</div>
<div @click="onRegisterHandler()" class="login-submit pointer">{{$t('register.sure')}}</div>
</div>
</div>
</div>
......
......@@ -67,6 +67,7 @@
}
.disabled {
cursor: default !important;
color: $cFontGray !important;
background-color: #dcdddd !important;
background-image: none !important;
......