Merge branch 'master' of 120.27.44.69:dev/pingan-life-index-pro
Showing
25 changed files
with
1089 additions
and
236 deletions
1 | NODE_ENV = 'sandbox' | 1 | NODE_ENV = 'sandbox' |
2 | VUE_APP_TITLE = 'sandbox' | 2 | VUE_APP_TITLE = 'sandbox' |
3 | REQUEST_DOMAIN= 'https://ow.go.qudone.com' | ||
4 | RSA_PUBLIC_KEY = 'B5FE03847F02046C47292AF0FF2DE88977241483DD40C123046EB39CBE4C48167B120096CFF12CD16559322884A3C56FA92B07B89AB51FC8C91A75127622151DDD730DFF1F993D5A290CEAC0BBA7FC88285D8994ACBAFF50101EDE9A0925AD5DFFAFE96D53C370E9C5B37DF2F871F81C4D7CA6B7EC37FF459C07975AD9A74A95' | ||
5 | RSA_KEY_INDEX = '10001' | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -18,6 +18,7 @@ | ... | @@ -18,6 +18,7 @@ |
18 | </noscript> | 18 | </noscript> |
19 | <div id="app"></div> | 19 | <div id="app"></div> |
20 | <!-- built files will be auto injected --> | 20 | <!-- built files will be auto injected --> |
21 | <script src="./js/unionrsa.js"></script> | ||
21 | </body> | 22 | </body> |
22 | 23 | ||
23 | </html> | 24 | </html> | ... | ... |
public/js/unionrsa.js
0 → 100644
This diff is collapsed.
Click to expand it.
... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
2 | <div id="app"> | 2 | <div id="app"> |
3 | <v-header></v-header> | 3 | <v-header></v-header> |
4 | <main ref="container" class="main-container"> | 4 | <main ref="container" class="main-container"> |
5 | <router-view/> | 5 | <router-view /> |
6 | </main> | 6 | </main> |
7 | <v-footer></v-footer> | 7 | <v-footer></v-footer> |
8 | </div> | 8 | </div> |
... | @@ -11,6 +11,7 @@ | ... | @@ -11,6 +11,7 @@ |
11 | 11 | ||
12 | <script> | 12 | <script> |
13 | import { mapGetters, mapActions, mapState } from "vuex"; | 13 | import { mapGetters, mapActions, mapState } from "vuex"; |
14 | import { getCookie } from "@utils/utils.js"; | ||
14 | import VHeader from "@components/home/header/header.vue"; | 15 | import VHeader from "@components/home/header/header.vue"; |
15 | import VFooter from "@components/home/footer/footer.vue"; | 16 | import VFooter from "@components/home/footer/footer.vue"; |
16 | var UA = require("ua-device"); | 17 | var UA = require("ua-device"); |
... | @@ -36,6 +37,15 @@ export default { | ... | @@ -36,6 +37,15 @@ export default { |
36 | let deviceType = output.device.type; | 37 | let deviceType = output.device.type; |
37 | let isMobile = deviceType == "mobile"; | 38 | let isMobile = deviceType == "mobile"; |
38 | this.$store.commit("IS_MOBILE", isMobile); | 39 | this.$store.commit("IS_MOBILE", isMobile); |
40 | |||
41 | // | ||
42 | let userInfoStr = decodeURIComponent(getCookie("_user_profile")); | ||
43 | if (userInfoStr) { | ||
44 | try { | ||
45 | let userInfo = JSON.parse(decodeURIComponent(userInfoStr)); | ||
46 | this.$store.commit("SET_USER_INFO", userInfo); | ||
47 | } catch (e) {} | ||
48 | } | ||
39 | } | 49 | } |
40 | }; | 50 | }; |
41 | </script> | 51 | </script> |
... | @@ -44,7 +54,7 @@ export default { | ... | @@ -44,7 +54,7 @@ export default { |
44 | @import "@/styles/_support"; | 54 | @import "@/styles/_support"; |
45 | 55 | ||
46 | html { | 56 | html { |
47 | font-family: "Microsoft YaHei","Arial"; | 57 | font-family: "Microsoft YaHei", "Arial"; |
48 | font-size: 12px; | 58 | font-size: 12px; |
49 | word-spacing: 1px; | 59 | word-spacing: 1px; |
50 | word-break: break-word; | 60 | word-break: break-word; | ... | ... |
1 | module.exports = { | 1 | module.exports = { |
2 | testListGet: '/xxx/xxx/list' | 2 | logout : "/pingan_hklife_webapi/logout", |
3 | // 是否显示图形验证码接口 | ||
4 | stdIsShowImageVcode : "/pingan_hklife_webapi/auth/stdIsShowImageVcode", | ||
5 | // 刷新图形验证码接口 | ||
6 | stdRefreshVcode : "/pingan_hklife_webapi/auth/stdRefreshVcode", | ||
7 | // OTP发送接口 | ||
8 | stdSendOTP : "/pingan_hklife_webapi/auth/stdSendOTP", | ||
9 | // OTP验证与验重接口 | ||
10 | stdValidateOTPandRepeat : "/pingan_hklife_webapi/auth/stdValidateOTPandRepeat", | ||
11 | // 注册手机号验重接口 | ||
12 | gsRegCheck : "/pingan_hklife_webapi/auth/gsRegCheck", | ||
13 | // 账户整合登录接口 | ||
14 | gsLogin : "/pingan_hklife_webapi/auth/gsLogin", | ||
15 | // 注册接口 | ||
16 | stdRegister : "/pingan_hklife_webapi/auth/stdRegister", | ||
17 | // 找回密码定位用户信息 | ||
18 | gsLocateUserV2 : "/pingan_hklife_webapi/auth/gsLocateUserV2", | ||
19 | // 账户整合忘记密码重置用户密码 | ||
20 | gsResetPwd : "/pingan_hklife_webapi/auth/gsResetPwd", | ||
21 | // 账户整合修改密码接口 | ||
22 | gsModifyPwd : "/pingan_hklife_webapi/auth/gsModifyPwd", | ||
23 | // 短信验证码登录 | ||
24 | otpLogin : "/pingan_hklife_webapi/otpLogin", | ||
25 | |||
3 | } | 26 | } |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -11,10 +11,7 @@ function Toast(msg) { | ... | @@ -11,10 +11,7 @@ function Toast(msg) { |
11 | // axios.defaults.baseURL = "" | 11 | // axios.defaults.baseURL = "" |
12 | 12 | ||
13 | // 服务器地址 | 13 | // 服务器地址 |
14 | let base = "https://ow.go.qudone.com"; | 14 | let base = process.env.REQUEST_DOMAIN || "http://localhost:9101"; |
15 | if (location.href.indexOf("//k.wxpai.cn") > 0) { | ||
16 | base = "https://api.k.wxpai.cn/bizproxy" | ||
17 | } | ||
18 | // let base = COM.baseUrl; | 15 | // let base = COM.baseUrl; |
19 | 16 | ||
20 | // 请求拦截器 | 17 | // 请求拦截器 |
... | @@ -59,10 +56,10 @@ axios.interceptors.response.use( | ... | @@ -59,10 +56,10 @@ axios.interceptors.response.use( |
59 | } | 56 | } |
60 | }); | 57 | }); |
61 | break; | 58 | break; |
62 | // 403 token过期 | 59 | // 403 token过期 |
63 | // 登录过期对用户进行提示 | 60 | // 登录过期对用户进行提示 |
64 | // 清除本地token和清空vuex中token对象 | 61 | // 清除本地token和清空vuex中token对象 |
65 | // 跳转登录页面 | 62 | // 跳转登录页面 |
66 | case 403: | 63 | case 403: |
67 | Toast({ | 64 | Toast({ |
68 | message: '登录过期,请重新登录', | 65 | message: '登录过期,请重新登录', |
... | @@ -82,7 +79,7 @@ axios.interceptors.response.use( | ... | @@ -82,7 +79,7 @@ axios.interceptors.response.use( |
82 | }); | 79 | }); |
83 | }, 1000); | 80 | }, 1000); |
84 | break; | 81 | break; |
85 | // 404请求不存在 | 82 | // 404请求不存在 |
86 | case 404: | 83 | case 404: |
87 | Toast({ | 84 | Toast({ |
88 | message: '网络请求不存在', | 85 | message: '网络请求不存在', |
... | @@ -90,7 +87,7 @@ axios.interceptors.response.use( | ... | @@ -90,7 +87,7 @@ axios.interceptors.response.use( |
90 | forbidClick: true | 87 | forbidClick: true |
91 | }); | 88 | }); |
92 | break; | 89 | break; |
93 | // 其他错误,直接抛出错误提示 | 90 | // 其他错误,直接抛出错误提示 |
94 | default: | 91 | default: |
95 | Toast({ | 92 | Toast({ |
96 | message: error.response.data.message, | 93 | message: error.response.data.message, | ... | ... |
src/assets/images/login/check.png
0 → 100644
431 Bytes
src/assets/images/login/un-check.png
0 → 100644
293 Bytes
... | @@ -15,21 +15,25 @@ module.exports = { | ... | @@ -15,21 +15,25 @@ module.exports = { |
15 | list: [{ | 15 | list: [{ |
16 | name: "register", | 16 | name: "register", |
17 | path: "/register", | 17 | path: "/register", |
18 | type : "noAuth", | ||
18 | value: "" | 19 | value: "" |
19 | }, { | 20 | }, { |
20 | name: "login", | 21 | name: "login", |
21 | path: "/login", | 22 | path: "/login", |
23 | type : "noAuth", | ||
22 | value: "" | 24 | value: "" |
23 | }, | 25 | }, |
24 | { | 26 | { |
25 | name: "modify password", | 27 | name: "modify password", |
26 | path: "", | 28 | path: "", |
29 | type : "auth", | ||
27 | value: "" | 30 | value: "" |
28 | }, | 31 | }, |
29 | { | 32 | { |
30 | name: "logout", | 33 | name: "logout", |
31 | path: "", | 34 | path: "", |
32 | value: "" | 35 | type : "auth", |
36 | value: "logout" | ||
33 | }, | 37 | }, |
34 | ] | 38 | ] |
35 | }, | 39 | }, |
... | @@ -133,6 +137,18 @@ module.exports = { | ... | @@ -133,6 +137,18 @@ module.exports = { |
133 | verifyCodeGet: "獲取驗證碼", | 137 | verifyCodeGet: "獲取驗證碼", |
134 | }, | 138 | }, |
135 | register: { | 139 | register: { |
140 | mobileOptions: [{ | ||
141 | type: "hk", | ||
142 | name: "香港手機號", | ||
143 | placeHolder: "請輸入8位手機號碼", | ||
144 | areaCode: "+852" | ||
145 | }, { | ||
146 | type: "zh", | ||
147 | name: "大陸手機號", | ||
148 | placeHolder: "請輸入11位手機號碼", | ||
149 | areaCode: "+86" | ||
150 | }], | ||
151 | coutTips : "{second}秒後重新獲取", | ||
136 | title: "歡迎註冊一賬通", | 152 | title: "歡迎註冊一賬通", |
137 | title2: "請設置新的密碼", | 153 | title2: "請設置新的密碼", |
138 | mobilePlaceholder: "请输入8位手机号码", | 154 | mobilePlaceholder: "请输入8位手机号码", | ... | ... |
... | @@ -13,86 +13,89 @@ module.exports = { | ... | @@ -13,86 +13,89 @@ module.exports = { |
13 | name: "登入", | 13 | name: "登入", |
14 | path: "", | 14 | path: "", |
15 | list: [{ | 15 | list: [{ |
16 | name: "註冊", | 16 | name: "註冊", |
17 | path: "/register", | 17 | path: "/register", |
18 | value: "" | 18 | type: "noAuth", |
19 | }, { | 19 | value: "" |
20 | name: "登入", | 20 | }, { |
21 | path: "/login", | 21 | name: "登入", |
22 | value: "" | 22 | path: "/login", |
23 | }, | 23 | type: "noAuth", |
24 | { | 24 | value: "" |
25 | name: "修改密碼", | 25 | }, |
26 | path: "", | 26 | { |
27 | value: "" | 27 | name: "修改密碼", |
28 | }, | 28 | path: "", |
29 | { | 29 | type: "auth", |
30 | name: "登出", | 30 | value: "" |
31 | path: "", | 31 | }, |
32 | value: "" | 32 | { |
33 | }, | 33 | name: "登出", |
34 | ] | 34 | path: "", |
35 | type: "auth", | ||
36 | value: "logout" | ||
37 | }] | ||
35 | }, | 38 | }, |
36 | navList: [{ | 39 | navList: [{ |
37 | name: "產品介紹", | 40 | name: "產品介紹", |
38 | path: "/product", | 41 | path: "/product", |
39 | list: [] | 42 | list: [] |
43 | }, | ||
44 | { | ||
45 | name: "客戶服務", | ||
46 | path: "/custom/product", | ||
47 | list: [{ | ||
48 | name: "聯系我們", | ||
49 | path: "/custom/service?q=m1" | ||
40 | }, | 50 | }, |
41 | { | 51 | { |
42 | name: "客戶服務", | 52 | name: "繳付保費", |
43 | path: "/custom/product", | 53 | path: "/payment/type" |
44 | list: [{ | ||
45 | name: "聯系我們", | ||
46 | path: "/custom/service?q=m1" | ||
47 | }, | ||
48 | { | ||
49 | name: "繳付保費", | ||
50 | path: "/payment/type" | ||
51 | }, | ||
52 | { | ||
53 | name: "保單查詢", | ||
54 | path: "/custom/service?q=m3" | ||
55 | }, | ||
56 | { | ||
57 | name: "保單變更", | ||
58 | path: "/custom/service?q=m4" | ||
59 | }, | ||
60 | { | ||
61 | name: "理賠申請", | ||
62 | path: "/custom/service?q=m5" | ||
63 | }, | ||
64 | { | ||
65 | name: "預約服務", | ||
66 | path: "/custom/service?q=m6" | ||
67 | }, | ||
68 | { | ||
69 | name: "投訴受理", | ||
70 | path: "/custom/service?q=m7" | ||
71 | }, | ||
72 | { | ||
73 | name: "常用表格", | ||
74 | path: "/custom/service?q=m8" | ||
75 | }, | ||
76 | ] | ||
77 | }, | 54 | }, |
78 | { | 55 | { |
79 | name: "新聞資訊", | 56 | name: "保單查詢", |
80 | path: "/news/list", | 57 | path: "/custom/service?q=m3" |
81 | list: [] | ||
82 | }, | 58 | }, |
83 | { | 59 | { |
84 | name: "關於平安人壽", | 60 | name: "保單變更", |
85 | path: "", | 61 | path: "/custom/service?q=m4" |
86 | list: [{ | 62 | }, |
87 | name: "公司簡介", | 63 | { |
88 | path: "/profile" | 64 | name: "理賠申請", |
89 | }, | 65 | path: "/custom/service?q=m5" |
90 | { | 66 | }, |
91 | name: "領導人概況", | 67 | { |
92 | path: "" | 68 | name: "預約服務", |
93 | }, | 69 | path: "/custom/service?q=m6" |
94 | ] | 70 | }, |
71 | { | ||
72 | name: "投訴受理", | ||
73 | path: "/custom/service?q=m7" | ||
95 | }, | 74 | }, |
75 | { | ||
76 | name: "常用表格", | ||
77 | path: "/custom/service?q=m8" | ||
78 | }, | ||
79 | ] | ||
80 | }, | ||
81 | { | ||
82 | name: "新聞資訊", | ||
83 | path: "/news/list", | ||
84 | list: [] | ||
85 | }, | ||
86 | { | ||
87 | name: "關於平安人壽", | ||
88 | path: "", | ||
89 | list: [{ | ||
90 | name: "公司簡介", | ||
91 | path: "/profile" | ||
92 | }, | ||
93 | { | ||
94 | name: "領導人概況", | ||
95 | path: "" | ||
96 | }, | ||
97 | ] | ||
98 | }, | ||
96 | ] | 99 | ] |
97 | }, | 100 | }, |
98 | footer: { | 101 | footer: { |
... | @@ -133,6 +136,18 @@ module.exports = { | ... | @@ -133,6 +136,18 @@ module.exports = { |
133 | verifyCodeGet: "獲取驗證碼", | 136 | verifyCodeGet: "獲取驗證碼", |
134 | }, | 137 | }, |
135 | register: { | 138 | register: { |
139 | mobileOptions: [{ | ||
140 | type: "hk", | ||
141 | name: "香港手機號", | ||
142 | placeHolder: "請輸入8位手機號碼", | ||
143 | areaCode: "+852" | ||
144 | }, { | ||
145 | type: "zh", | ||
146 | name: "大陸手機號", | ||
147 | placeHolder: "請輸入11位手機號碼", | ||
148 | areaCode: "+86" | ||
149 | }], | ||
150 | coutTips : "{second}秒後重新獲取", | ||
136 | title: "歡迎註冊一賬通", | 151 | title: "歡迎註冊一賬通", |
137 | title2: "請設置新的密碼", | 152 | title2: "請設置新的密碼", |
138 | mobilePlaceholder: "請輸入8位手機號碼", | 153 | mobilePlaceholder: "請輸入8位手機號碼", | ... | ... |
... | @@ -13,86 +13,89 @@ module.exports = { | ... | @@ -13,86 +13,89 @@ module.exports = { |
13 | name: "登陆", | 13 | name: "登陆", |
14 | path: "", | 14 | path: "", |
15 | list: [{ | 15 | list: [{ |
16 | name: "注册", | 16 | name: "注册", |
17 | path: "/register", | 17 | path: "/register", |
18 | value: "" | 18 | type: "noAuth", |
19 | }, { | 19 | value: "" |
20 | name: "登陆", | 20 | }, { |
21 | path: "/login", | 21 | name: "登陆", |
22 | value: "" | 22 | path: "/login", |
23 | }, | 23 | type: "noAuth", |
24 | { | 24 | value: "" |
25 | name: "修改密码", | 25 | }, |
26 | path: "", | 26 | { |
27 | value: "" | 27 | name: "修改密码", |
28 | }, | 28 | path: "", |
29 | { | 29 | type: "auth", |
30 | name: "登出", | 30 | value: "" |
31 | path: "", | 31 | }, |
32 | value: "" | 32 | { |
33 | }, | 33 | name: "登出", |
34 | ] | 34 | path: "", |
35 | type: "auth", | ||
36 | value: "logout" | ||
37 | }] | ||
35 | }, | 38 | }, |
36 | navList: [{ | 39 | navList: [{ |
37 | name: "产品介绍", | 40 | name: "产品介绍", |
38 | path: "/product", | 41 | path: "/product", |
39 | list: [] | 42 | list: [] |
43 | }, | ||
44 | { | ||
45 | name: "客户服务", | ||
46 | path: "/custom/product", | ||
47 | list: [{ | ||
48 | name: "联系我们", | ||
49 | path: "/custom/service?q=m1" | ||
40 | }, | 50 | }, |
41 | { | 51 | { |
42 | name: "客户服务", | 52 | name: "缴付保费", |
43 | path: "/custom/product", | 53 | path: "/payment/type" |
44 | list: [{ | ||
45 | name: "联系我们", | ||
46 | path: "/custom/service?q=m1" | ||
47 | }, | ||
48 | { | ||
49 | name: "缴付保费", | ||
50 | path: "/payment/type" | ||
51 | }, | ||
52 | { | ||
53 | name: "保单查询", | ||
54 | path: "/custom/service?q=m3" | ||
55 | }, | ||
56 | { | ||
57 | name: "保单变更", | ||
58 | path: "/custom/service?q=m4" | ||
59 | }, | ||
60 | { | ||
61 | name: "理赔申请", | ||
62 | path: "/custom/service?q=m5" | ||
63 | }, | ||
64 | { | ||
65 | name: "预约服务", | ||
66 | path: "/custom/service?q=m6" | ||
67 | }, | ||
68 | { | ||
69 | name: "投诉受理", | ||
70 | path: "/custom/service?q=m7" | ||
71 | }, | ||
72 | { | ||
73 | name: "常用表格", | ||
74 | path: "/custom/service?q=m8" | ||
75 | }, | ||
76 | ] | ||
77 | }, | 54 | }, |
78 | { | 55 | { |
79 | name: "新闻资讯", | 56 | name: "保单查询", |
80 | path: "/news/list", | 57 | path: "/custom/service?q=m3" |
81 | list: [] | ||
82 | }, | 58 | }, |
83 | { | 59 | { |
84 | name: "关于平安人寿", | 60 | name: "保单变更", |
85 | path: "", | 61 | path: "/custom/service?q=m4" |
86 | list: [{ | 62 | }, |
87 | name: "公司简介", | 63 | { |
88 | path: "/profile" | 64 | name: "理赔申请", |
89 | }, | 65 | path: "/custom/service?q=m5" |
90 | { | 66 | }, |
91 | name: "领导人概况", | 67 | { |
92 | path: "" | 68 | name: "预约服务", |
93 | }, | 69 | path: "/custom/service?q=m6" |
94 | ] | 70 | }, |
71 | { | ||
72 | name: "投诉受理", | ||
73 | path: "/custom/service?q=m7" | ||
95 | }, | 74 | }, |
75 | { | ||
76 | name: "常用表格", | ||
77 | path: "/custom/service?q=m8" | ||
78 | }, | ||
79 | ] | ||
80 | }, | ||
81 | { | ||
82 | name: "新闻资讯", | ||
83 | path: "/news/list", | ||
84 | list: [] | ||
85 | }, | ||
86 | { | ||
87 | name: "关于平安人寿", | ||
88 | path: "", | ||
89 | list: [{ | ||
90 | name: "公司简介", | ||
91 | path: "/profile" | ||
92 | }, | ||
93 | { | ||
94 | name: "领导人概况", | ||
95 | path: "" | ||
96 | }, | ||
97 | ] | ||
98 | }, | ||
96 | ] | 99 | ] |
97 | }, | 100 | }, |
98 | footer: { | 101 | footer: { |
... | @@ -133,6 +136,18 @@ module.exports = { | ... | @@ -133,6 +136,18 @@ module.exports = { |
133 | verifyCodeGet: "获取验证码", | 136 | verifyCodeGet: "获取验证码", |
134 | }, | 137 | }, |
135 | register: { | 138 | register: { |
139 | mobileOptions: [{ | ||
140 | type: "hk", | ||
141 | name: "香港手机号", | ||
142 | placeHolder: "请输入8位手机号码", | ||
143 | areaCode: "+852" | ||
144 | }, { | ||
145 | type: "zh", | ||
146 | name: "大陆手机号", | ||
147 | placeHolder: "请输入11位手机号码", | ||
148 | areaCode: "+86" | ||
149 | }], | ||
150 | coutTips : "{second}秒后重新获取", | ||
136 | title: "欢迎注册一账通", | 151 | title: "欢迎注册一账通", |
137 | title2: "请设置新的密码", | 152 | title2: "请设置新的密码", |
138 | mobilePlaceholder: "请输入8位手机号码", | 153 | mobilePlaceholder: "请输入8位手机号码", | ... | ... |
... | @@ -2,6 +2,9 @@ import { | ... | @@ -2,6 +2,9 @@ import { |
2 | mapState | 2 | mapState |
3 | } from 'vuex' | 3 | } from 'vuex' |
4 | 4 | ||
5 | import api from '@/api/api' | ||
6 | import { httpPost } from '@/api/fetch-api.js' | ||
7 | |||
5 | export default { | 8 | export default { |
6 | name: "DropDownList", | 9 | name: "DropDownList", |
7 | data() { | 10 | data() { |
... | @@ -13,25 +16,25 @@ export default { | ... | @@ -13,25 +16,25 @@ export default { |
13 | props: { | 16 | props: { |
14 | type: { | 17 | type: { |
15 | type: String, | 18 | type: String, |
16 | default () { | 19 | default() { |
17 | return "nav"; | 20 | return "nav"; |
18 | } | 21 | } |
19 | }, | 22 | }, |
20 | dataObj: { | 23 | dataObj: { |
21 | type: Object, | 24 | type: Object, |
22 | default () { | 25 | default() { |
23 | return {}; | 26 | return {}; |
24 | } | 27 | } |
25 | }, | 28 | }, |
26 | dataList: { | 29 | dataList: { |
27 | type: Array, | 30 | type: Array, |
28 | default () { | 31 | default() { |
29 | return []; | 32 | return []; |
30 | } | 33 | } |
31 | }, | 34 | }, |
32 | labelProperty: { | 35 | labelProperty: { |
33 | type: String, | 36 | type: String, |
34 | default () { | 37 | default() { |
35 | return "name"; | 38 | return "name"; |
36 | } | 39 | } |
37 | } | 40 | } |
... | @@ -81,16 +84,32 @@ export default { | ... | @@ -81,16 +84,32 @@ export default { |
81 | this.sTitle = curData.name; | 84 | this.sTitle = curData.name; |
82 | window.location.reload(); | 85 | window.location.reload(); |
83 | } else { | 86 | } else { |
84 | // 不是的话,跳转页面 | 87 | // console.log("curData.value == =", curData.value) |
85 | this.$router.push({ | 88 | if (curData.value == "logout") { |
86 | path: curData.path | 89 | // this.$store.commit("SET_USER_INFO", null); |
87 | }) | 90 | this._loginHandler(); |
91 | } else { | ||
92 | // 不是的话,跳转页面 | ||
93 | this.$router.push({ | ||
94 | path: curData.path | ||
95 | }) | ||
96 | } | ||
88 | } | 97 | } |
89 | // console.log("name:", this.dataList[index].name); | 98 | // console.log("name:", this.dataList[index].name); |
90 | // this.$emit("change", { | 99 | // this.$emit("change", { |
91 | // index: index, | 100 | // index: index, |
92 | // value: this.dataList[index] | 101 | // value: this.dataList[index] |
93 | // }); | 102 | // }); |
103 | }, | ||
104 | _loginHandler() { | ||
105 | httpPost({ url: api.logout }).then(() => { | ||
106 | this.$store.commit("SET_USER_INFO", null); | ||
107 | this._showLogoutTip(); | ||
108 | }); | ||
109 | }, | ||
110 | _showLogoutTip() { | ||
111 | // 登出后的提示 | ||
112 | alert("登出成功"); | ||
94 | } | 113 | } |
95 | }, | 114 | }, |
96 | computed: { | 115 | computed: { | ... | ... |
... | @@ -57,6 +57,13 @@ | ... | @@ -57,6 +57,13 @@ |
57 | justify-content: center; | 57 | justify-content: center; |
58 | color: #ffffff; | 58 | color: #ffffff; |
59 | 59 | ||
60 | span { | ||
61 | max-width: 4.25rem ;/* 51/12 */ | ||
62 | overflow: hidden; | ||
63 | white-space: nowrap; | ||
64 | text-overflow: ellipsis; | ||
65 | } | ||
66 | |||
60 | .icon-img { | 67 | .icon-img { |
61 | margin: 0 .5rem; | 68 | margin: 0 .5rem; |
62 | } | 69 | } | ... | ... |
... | @@ -4,7 +4,8 @@ | ... | @@ -4,7 +4,8 @@ |
4 | <!-- 登陆下拉样式 --> | 4 | <!-- 登陆下拉样式 --> |
5 | <template v-if="type=='login'"> | 5 | <template v-if="type=='login'"> |
6 | <div class="user"> | 6 | <div class="user"> |
7 | <img class="icon-img" src="@/assets/images/home/icon-user.png"> {{dataObj.name}} | 7 | <img class="icon-img" src="@/assets/images/home/icon-user.png"> |
8 | <span>{{dataObj.name}}</span> | ||
8 | </div> | 9 | </div> |
9 | </template> | 10 | </template> |
10 | <!-- 其他下拉样式 --> | 11 | <!-- 其他下拉样式 --> | ... | ... |
... | @@ -26,27 +26,28 @@ export default { | ... | @@ -26,27 +26,28 @@ export default { |
26 | name: "繁", | 26 | name: "繁", |
27 | path: "", | 27 | path: "", |
28 | list: [{ | 28 | list: [{ |
29 | name: "繁", | 29 | name: "繁", |
30 | path: "", | 30 | path: "", |
31 | value: "tc" | 31 | value: "tc" |
32 | }, | 32 | }, |
33 | { | 33 | { |
34 | name: "简", | 34 | name: "简", |
35 | path: "", | 35 | path: "", |
36 | value: "zh" | 36 | value: "zh" |
37 | }, | 37 | }, |
38 | { | 38 | { |
39 | name: "EN", | 39 | name: "EN", |
40 | path: "", | 40 | path: "", |
41 | value: "en" | 41 | value: "en" |
42 | }, | 42 | }, |
43 | ] | 43 | ] |
44 | } | 44 | } |
45 | } | 45 | } |
46 | }, | 46 | }, |
47 | computed: { | 47 | computed: { |
48 | ...mapState({ | 48 | ...mapState({ |
49 | isSmallScreen: state => state.isSmallScreen | 49 | isSmallScreen: state => state.isSmallScreen, |
50 | userInfo: state => state.userInfo | ||
50 | }) | 51 | }) |
51 | }, | 52 | }, |
52 | methods: { | 53 | methods: { |
... | @@ -65,10 +66,33 @@ export default { | ... | @@ -65,10 +66,33 @@ export default { |
65 | }, | 66 | }, |
66 | initData() { | 67 | initData() { |
67 | let i18n = this.$i18n.messages[this.$i18n.locale] || {}; | 68 | let i18n = this.$i18n.messages[this.$i18n.locale] || {}; |
68 | this.loginData = i18n.nav.loginData; | 69 | // this.loginData = i18n.nav.loginData; |
70 | this._buildLoginMenu(); | ||
69 | this.navList = i18n.nav.navList; | 71 | this.navList = i18n.nav.navList; |
70 | let curLang = getObjByListKeyValue(this.$i18n.locale, "value", this.langData.list) | 72 | let curLang = getObjByListKeyValue(this.$i18n.locale, "value", this.langData.list) |
71 | this.langData.name = curLang.name; | 73 | this.langData.name = curLang.name; |
74 | }, | ||
75 | _buildLoginMenu() { | ||
76 | // 构建登录页 | ||
77 | let i18n = this.$i18n.messages[this.$i18n.locale] || {}; | ||
78 | let menuData = JSON.parse(JSON.stringify(i18n.nav.loginData)); | ||
79 | let list = []; | ||
80 | if (this.userInfo && this.userInfo.name) { | ||
81 | menuData.name = this.userInfo.name; | ||
82 | menuData.list.forEach(element => { | ||
83 | if (element.type == "auth") { | ||
84 | list.push(element); | ||
85 | } | ||
86 | }); | ||
87 | } else { | ||
88 | menuData.list.forEach(element => { | ||
89 | if (element.type == "noAuth") { | ||
90 | list.push(element); | ||
91 | } | ||
92 | }); | ||
93 | } | ||
94 | menuData.list = list; | ||
95 | this.$set(this, 'loginData', menuData); | ||
72 | } | 96 | } |
73 | }, | 97 | }, |
74 | mounted() { | 98 | mounted() { |
... | @@ -78,6 +102,11 @@ export default { | ... | @@ -78,6 +102,11 @@ export default { |
78 | self.checkIsSmallScreen(); | 102 | self.checkIsSmallScreen(); |
79 | } | 103 | } |
80 | }, | 104 | }, |
105 | watch: { | ||
106 | userInfo(val) { | ||
107 | this._buildLoginMenu(); | ||
108 | } | ||
109 | }, | ||
81 | created() { | 110 | created() { |
82 | this.initData(); | 111 | this.initData(); |
83 | }, | 112 | }, | ... | ... |
... | @@ -7,7 +7,7 @@ import store from './store/index'; | ... | @@ -7,7 +7,7 @@ import store from './store/index'; |
7 | import VueAwesomeSwiper from 'vue-awesome-swiper' | 7 | import VueAwesomeSwiper from 'vue-awesome-swiper' |
8 | // require styles | 8 | // require styles |
9 | import 'swiper/dist/css/swiper.css' | 9 | import 'swiper/dist/css/swiper.css' |
10 | Vue.use(VueAwesomeSwiper, /* { default global options } */ ) | 10 | Vue.use(VueAwesomeSwiper) |
11 | 11 | ||
12 | 12 | ||
13 | import Mock from './mock' | 13 | import Mock from './mock' | ... | ... |
1 | |||
2 | import { mapGetters, mapActions, mapState } from "vuex"; | ||
3 | |||
1 | import api from '@/api/api' | 4 | import api from '@/api/api' |
2 | import { | 5 | import { |
3 | httpGet, | 6 | httpGet, |
4 | httpPost | 7 | httpPost |
5 | } from '@/api/fetch-api.js' | 8 | } from '@/api/fetch-api.js' |
6 | 9 | ||
10 | let PK = 'B5FE03847F02046C47292AF0FF2DE88977241483DD40C123046EB39CBE4C48167B120096CFF12CD16559322884A3C56FA92B07B89AB51FC8C91A75127622151DDD730DFF1F993D5A290CEAC0BBA7FC88285D8994ACBAFF50101EDE9A0925AD5DFFAFE96D53C370E9C5B37DF2F871F81C4D7CA6B7EC37FF459C07975AD9A74A95'; | ||
11 | let E = '10001'; | ||
12 | |||
7 | export default { | 13 | export default { |
8 | data() { | 14 | data() { |
9 | return { | 15 | return { |
10 | key: 'value', | 16 | key: 'value', |
11 | type: 1, // 1:帐密登陆 2:OTP登陆 | 17 | type: 1, // 1:帐密登陆 2:OTP登陆, |
18 | values: { | ||
19 | // 返回的token,串连整个流程,后台安全校验使用 | ||
20 | token: "", | ||
21 | deviceId: "", | ||
22 | vcodeuuid: "", | ||
23 | token: "", | ||
24 | deviceId: "", | ||
25 | imageBase64: "", | ||
26 | password: "", | ||
27 | passwordRepeat: "" | ||
28 | }, | ||
29 | times: { | ||
30 | interval: 0, // 索引 | ||
31 | remain: 0, // 剩余时间 | ||
32 | tip: "" // 显示的文字 | ||
33 | }, | ||
34 | loginForm: { | ||
35 | // userId: "18334783910", | ||
36 | // password: "qweqwe123" | ||
37 | userId: "", | ||
38 | password: "", | ||
39 | |||
40 | imageValue: "", | ||
41 | mobileNo: "", | ||
42 | otp: "" | ||
43 | }, | ||
44 | loginCheck: { | ||
45 | showImageCode: false, | ||
46 | agreeProtocol: false | ||
47 | }, | ||
48 | PK: process.env.RSA_PUBLIC_KEY || PK, | ||
49 | E: process.env.RSA_KEY_INDEX || E, | ||
12 | } | 50 | } |
13 | }, | 51 | }, |
14 | components: {}, | 52 | components: {}, |
15 | computed: { | 53 | computed: { |
54 | ...mapState({ | ||
55 | userInfo: state => state.userInfo | ||
56 | }), | ||
16 | locale() { | 57 | locale() { |
17 | return this.$i18n.locale || 'tc'; | 58 | return this.$i18n.locale || 'tc'; |
18 | }, | 59 | }, |
... | @@ -43,8 +84,254 @@ export default { | ... | @@ -43,8 +84,254 @@ export default { |
43 | onLoginTypeHandler(val) { | 84 | onLoginTypeHandler(val) { |
44 | this.type = val; | 85 | this.type = val; |
45 | }, | 86 | }, |
46 | initData() {} | 87 | initData() { }, |
88 | handlerIsShowImageVcode() { | ||
89 | return new Promise((resolve, reject) => { | ||
90 | httpPost({ | ||
91 | url: api.stdIsShowImageVcode, | ||
92 | data: { | ||
93 | deviceId: this.values.deviceId, | ||
94 | userId: this.loginForm.userId | ||
95 | } | ||
96 | }).then(response => { | ||
97 | // 判断是否显示图形验证码 | ||
98 | if (this._handlerIsShowImageVcodeResponse(response)) { | ||
99 | resolve(response); | ||
100 | } | ||
101 | }) | ||
102 | }); | ||
103 | }, | ||
104 | _handlerIsShowImageVcodeResponse(response) { | ||
105 | if (response.returnCode == "0" && response.data.isShowVcode == "N") { | ||
106 | return true; | ||
107 | } | ||
108 | this.values.token = response.data.token; | ||
109 | return false; | ||
110 | }, | ||
111 | handlerRefreshVcode() { | ||
112 | // 刷新图形二维码 | ||
113 | }, | ||
114 | handlerLogin() { | ||
115 | this.refreshDeviceId(); | ||
116 | if (!this.loginCheck.agreeProtocol) { | ||
117 | this._showAgreeProtocalTips(); | ||
118 | return; | ||
119 | } | ||
120 | if (this.type == 1) { | ||
121 | this._passwordLogin(); | ||
122 | } else { | ||
123 | this._otpLogin(); | ||
124 | } | ||
125 | }, | ||
126 | _passwordLogin() { | ||
127 | // 刷新图形二维码 | ||
128 | this.handlerIsShowImageVcode().then(() => { | ||
129 | httpPost({ | ||
130 | url: api.gsLogin, | ||
131 | data: { | ||
132 | deviceId: this.values.deviceId, | ||
133 | loginName: this.loginForm.userId, | ||
134 | loginPwd: this._passwordEncrypt(this.loginForm.password) | ||
135 | } | ||
136 | }).then(response => { | ||
137 | this._handlerLoginResponse(response); | ||
138 | }) | ||
139 | }); | ||
140 | }, | ||
141 | // 处理登录结果 | ||
142 | _handlerLoginResponse(response) { | ||
143 | // let res = response.content; | ||
144 | if (response.returnCode == 0 || response.resultCode == "0") { | ||
145 | this.$store.commit("SET_USER_INFO", response.data); | ||
146 | this._redirectTo(); | ||
147 | } else { | ||
148 | let msg = response.returnMsg; | ||
149 | this._showLoginErrorMessage(msg); | ||
150 | } | ||
151 | }, | ||
152 | _showAgreeProtocalTips() { | ||
153 | alert("请同意《平安一账通会员服务协议》"); | ||
154 | }, | ||
155 | _showLoginErrorMessage(message) { | ||
156 | alert(message); | ||
157 | }, | ||
158 | _redirectTo() { | ||
159 | let path = this.$route.query.callback || "/index"; | ||
160 | this.$router.push({ | ||
161 | path: path | ||
162 | }); | ||
163 | }, | ||
164 | _otpLogin() { | ||
165 | this._checkOptParams().then(() => { | ||
166 | let data = { | ||
167 | mobileNo: this.loginForm.mobileNo, | ||
168 | token: this.values.token, | ||
169 | otp: this.loginForm.otp, | ||
170 | deviceId: this.refreshDeviceId() | ||
171 | }; | ||
172 | httpPost({ | ||
173 | url: api.otpLogin, | ||
174 | data: data | ||
175 | }).then(response => { | ||
176 | this._handlerLoginResponse(response); | ||
177 | }); | ||
178 | }); | ||
179 | }, | ||
180 | _checkOptParams() { | ||
181 | return new Promise((resolve, reject) => { | ||
182 | this._checkMobileLegal().then(() => { | ||
183 | if (!this.loginForm.otp) { | ||
184 | this._showOtpEmptyTips(); | ||
185 | return; | ||
186 | } | ||
187 | if (!this.values.token) { | ||
188 | this._showGetOptTips(); | ||
189 | return; | ||
190 | } | ||
191 | resolve(); | ||
192 | }); | ||
193 | }) | ||
194 | }, | ||
195 | _showGetOptTips() { | ||
196 | alert('请先获取短信验证码'); | ||
197 | }, | ||
198 | _showImageValueTip() { | ||
199 | alert("请输入图片验证码") | ||
200 | }, | ||
201 | _showOtpEmptyTips() { | ||
202 | alert('请输入短信验证码'); | ||
203 | }, | ||
204 | handlerStdSendOTP() { | ||
205 | // 发送短信验证码 | ||
206 | this._checkMobileLegal().then(() => { | ||
207 | if (this.times.remain > 0) { | ||
208 | return; | ||
209 | } | ||
210 | if (this.values.vcodeuuid && !this.loginForm.imageValue) { | ||
211 | this._showImageValueTip(); | ||
212 | return; | ||
213 | } | ||
214 | this._handlerIsShowImageVcode().then(() => { | ||
215 | this._startStdSendOTP(); | ||
216 | this._startTimeClick(); | ||
217 | }); | ||
218 | }); | ||
219 | }, | ||
220 | handlerRefreshImageValue() { | ||
221 | httpPost({ | ||
222 | url: api.stdRefreshVcode, | ||
223 | data: { | ||
224 | vcodeuuid: this.values.vcodeuuid | ||
225 | } | ||
226 | }).then(response => { | ||
227 | this.values.imageBase64 = response.data.image; | ||
228 | }) | ||
229 | }, | ||
230 | _checkMobileLegal() { | ||
231 | // 检测手机号是否正确 | ||
232 | return new Promise((resolve, reject) => { | ||
233 | let mobile = this.loginForm.mobileNo; | ||
234 | if (mobile.length != 8 && mobile.length != 11) { | ||
235 | this._showMobileNoIllegalTip() | ||
236 | return; | ||
237 | } | ||
238 | resolve(true); | ||
239 | }); | ||
240 | }, | ||
241 | _handlerIsShowImageVcode() { | ||
242 | return new Promise((resolve, reject) => { | ||
243 | // 如果这个值不为空,标识出现了图片验证码,不需要重新询问是否需要图像验证码了 | ||
244 | if (this.values.vcodeuuid) { | ||
245 | resolve(); | ||
246 | return; | ||
247 | } | ||
248 | httpPost({ | ||
249 | url: api.stdIsShowImageVcode, | ||
250 | data: { | ||
251 | deviceId: this.values.deviceId, | ||
252 | userId: this.loginForm.mobileNo | ||
253 | } | ||
254 | }).then(response => { | ||
255 | // 判断是否显示图形验证码 | ||
256 | if (response.returnCode == "0") { | ||
257 | this.values.token = response.data.token; | ||
258 | if (response.data.isShowVcode == "N") { | ||
259 | // if (!this.values.vcodeuuid) { | ||
260 | // this.loginCheck.showImageCode = true; | ||
261 | // this.values.vcodeuuid = "123456"; | ||
262 | // return; | ||
263 | // } | ||
264 | this.values.vcodeuuid = null; | ||
265 | resolve(response); | ||
266 | } else { | ||
267 | // image 值: | ||
268 | this.loginCheck.showImageCode = true; | ||
269 | this.values.vcodeuuid = response.data.vcodeuuid; | ||
270 | this.values.imageBase64 = response.data.image; | ||
271 | } | ||
272 | } | ||
273 | return false; | ||
274 | }) | ||
275 | }); | ||
276 | }, | ||
277 | _showMobileNoIllegalTip() { | ||
278 | alert("手机号不正确"); | ||
279 | }, | ||
280 | _startStdSendOTP() { | ||
281 | // 正式发送OTP信号 | ||
282 | let data = { | ||
283 | mobileNo: this.loginForm.mobileNo, | ||
284 | token: this.values.token, | ||
285 | signFactor: new Date().getTime(), | ||
286 | scene: "otpLogin", | ||
287 | deviceId: this.refreshDeviceId() | ||
288 | } | ||
289 | if (this.values.vcodeuuid) { | ||
290 | data["vcodeuuid"] = this.values.vcodeuuid; | ||
291 | data["imageValue"] = this.loginForm.imageValue; | ||
292 | } | ||
293 | httpPost({ url: api.stdSendOTP, data: data }); | ||
294 | }, | ||
295 | _startTimeClick() { | ||
296 | this.times.remain = 120; | ||
297 | let _this = this; | ||
298 | let i18n = this.$i18n.messages[this.$i18n.locale] || {}; | ||
299 | let msg = i18n.register.coutTips; | ||
300 | _this.times.tip = msg.replace("{second}", _this.times.remain); | ||
301 | this.times.interval = setInterval(function () { | ||
302 | if (_this.times.remain <= 0) { | ||
303 | clearInterval(_this.times.interval); | ||
304 | _this.times.interval = 0; | ||
305 | _this.times.remain = 0; | ||
306 | return; | ||
307 | } | ||
308 | _this.times.remain--; | ||
309 | _this.times.tip = msg.replace("{second}", _this.times.remain); | ||
310 | _this.$set(_this, 'times', _this.times); | ||
311 | }, 1000); | ||
312 | }, | ||
313 | refreshDeviceId() { | ||
314 | if (!this.values.deviceId) { | ||
315 | this.values.deviceId = (Math.random() + "").substring(2) | ||
316 | } | ||
317 | return this.values.deviceId | ||
318 | }, | ||
319 | _passwordEncrypt(rawPwd) { | ||
320 | let rsa = new RSAKey(); | ||
321 | rsa.setPublic(this.PK, this.E); | ||
322 | let res = rsa.encrypt(rawPwd); | ||
323 | if (res == null) return rawPwd; | ||
324 | return res; | ||
325 | } | ||
326 | }, | ||
327 | watch: { | ||
328 | type() { | ||
329 | this.loginCheck.showImageCode = false; | ||
330 | } | ||
331 | }, | ||
332 | mounted() { | ||
333 | // console.log("PK === ", this.PK) | ||
334 | // console.log("E === ", this.E) | ||
47 | }, | 335 | }, |
48 | mounted() {}, | 336 | created() { } |
49 | created() {} | ||
50 | } | 337 | } | ... | ... |
... | @@ -124,7 +124,16 @@ | ... | @@ -124,7 +124,16 @@ |
124 | justify-content: space-between; | 124 | justify-content: space-between; |
125 | flex-wrap: wrap; | 125 | flex-wrap: wrap; |
126 | 126 | ||
127 | 127 | .vcode { | |
128 | background-color: transparent !important; | ||
129 | padding: 0 !important; | ||
130 | overflow: hidden; | ||
131 | img { | ||
132 | width: 100%; | ||
133 | height: 100%; | ||
134 | } | ||
135 | } | ||
136 | |||
128 | &-item { | 137 | &-item { |
129 | position: relative; | 138 | position: relative; |
130 | // margin-top: 2.75rem; | 139 | // margin-top: 2.75rem; |
... | @@ -160,6 +169,8 @@ | ... | @@ -160,6 +169,8 @@ |
160 | border-radius: 3.5rem; | 169 | border-radius: 3.5rem; |
161 | padding: 0 1.75rem; | 170 | padding: 0 1.75rem; |
162 | flex: 1; | 171 | flex: 1; |
172 | font-size: 1.166667rem; /* 14/12 */ | ||
173 | letter-spacing: .1rem;/* 1.2/12 */ | ||
163 | } | 174 | } |
164 | 175 | ||
165 | // 长文本 | 176 | // 长文本 |
... | @@ -187,6 +198,7 @@ | ... | @@ -187,6 +198,7 @@ |
187 | color: #4c4948; | 198 | color: #4c4948; |
188 | } | 199 | } |
189 | 200 | ||
201 | |||
190 | // 框内按钮 | 202 | // 框内按钮 |
191 | .ipt2 { | 203 | .ipt2 { |
192 | display: flex; | 204 | display: flex; |
... | @@ -202,13 +214,12 @@ | ... | @@ -202,13 +214,12 @@ |
202 | color: #f05a23; | 214 | color: #f05a23; |
203 | text-decoration: underline; | 215 | text-decoration: underline; |
204 | } | 216 | } |
205 | } | ||
206 | |||
207 | |||
208 | |||
209 | 217 | ||
218 | .veri-btn-default { | ||
219 | color: #aaaaaa; | ||
220 | } | ||
221 | } | ||
210 | } | 222 | } |
211 | |||
212 | } | 223 | } |
213 | } | 224 | } |
214 | 225 | ... | ... |
... | @@ -24,7 +24,7 @@ | ... | @@ -24,7 +24,7 @@ |
24 | <img src="@/assets/images/login/icon-login-user.png"> {{$t('login.account')}} | 24 | <img src="@/assets/images/login/icon-login-user.png"> {{$t('login.account')}} |
25 | </div> | 25 | </div> |
26 | <div class="ipt-wrap"> | 26 | <div class="ipt-wrap"> |
27 | <input :placeholder="$t('login.accountPlaceholder')" class="ipt" type="text"> | 27 | <input v-model="loginForm.userId" :placeholder="$t('login.accountPlaceholder')" class="ipt" type="text"> |
28 | </div> | 28 | </div> |
29 | </div> | 29 | </div> |
30 | <div class="pure-u-1 form-item"> | 30 | <div class="pure-u-1 form-item"> |
... | @@ -32,21 +32,25 @@ | ... | @@ -32,21 +32,25 @@ |
32 | <img src="@/assets/images/login/icon-login-password.png"> {{$t('login.password')}} | 32 | <img src="@/assets/images/login/icon-login-password.png"> {{$t('login.password')}} |
33 | </div> | 33 | </div> |
34 | <div class="ipt-wrap"> | 34 | <div class="ipt-wrap"> |
35 | <input :placeholder="$t('login.passwordPlaceholder')" class="ipt" type="text"> | 35 | <input v-model="loginForm.password" :placeholder="$t('login.passwordPlaceholder')" class="ipt" type="password"> |
36 | </div> | 36 | </div> |
37 | </div> | 37 | </div> |
38 | <div class="pure-u-1 form-item"> | 38 | <div class="pure-u-1 form-item" v-if="type == 1 && loginCheck.showImageCode"> |
39 | <div class="ipt-wrap"> | 39 | <div class="ipt-wrap"> |
40 | <input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" type="text"> | 40 | <input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" type="text" v-model="loginForm.imageValue"> |
41 | <div class="ipt verify-btn pointer">5136</div> | 41 | <div class="ipt verify-btn pointer vcode" @click="handlerRefreshImageValue"> |
42 | <img :src="values.imageBase64"> | ||
43 | </div> | ||
42 | </div> | 44 | </div> |
43 | </div> | 45 | </div> |
44 | </div> | 46 | </div> |
45 | <div class="login-protocol"> | 47 | <div class="login-protocol pointer" @click="loginCheck.agreeProtocol = !loginCheck.agreeProtocol" > |
46 | <img @click="onCheckHandler()" class="check pointer" src="@/assets/images/login/login-check.png"> {{$t('login.agree')}} | 48 | <img v-if="!loginCheck.agreeProtocol" class="check" src="@/assets/images/login/un-check.png"> |
49 | <img v-if="loginCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> | ||
50 | {{$t('login.agree')}} | ||
47 | <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span> | 51 | <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span> |
48 | </div> | 52 | </div> |
49 | <div @click="onSubmitHandler()" class="login-submit pointer">{{$t('login.login')}}</div> | 53 | <div @click="handlerLogin()" class="login-submit pointer">{{$t('login.login')}}</div> |
50 | <div class="login-func"> | 54 | <div class="login-func"> |
51 | <div @click="onRegisterHandler()" class="login-func-btn pointer">{{$t('login.register')}}</div> | 55 | <div @click="onRegisterHandler()" class="login-func-btn pointer">{{$t('login.register')}}</div> |
52 | <div @click="onForgetHandler()" class="login-func-btn pointer">{{$t('login.forget')}}</div> | 56 | <div @click="onForgetHandler()" class="login-func-btn pointer">{{$t('login.forget')}}</div> |
... | @@ -71,7 +75,15 @@ | ... | @@ -71,7 +75,15 @@ |
71 | <img src="@/assets/images/login/icon-login-phone.png"> {{$t('login.mobile')}} | 75 | <img src="@/assets/images/login/icon-login-phone.png"> {{$t('login.mobile')}} |
72 | </div> | 76 | </div> |
73 | <div class="ipt-wrap"> | 77 | <div class="ipt-wrap"> |
74 | <input :placeholder="$t('login.mobilePlaceholder')" class="ipt" type="text"> | 78 | <input :placeholder="$t('login.mobilePlaceholder')" class="ipt" type="text" v-model="loginForm.mobileNo"> |
79 | </div> | ||
80 | </div> | ||
81 | <div class="pure-u-1 form-item" v-if="type == 2 && loginCheck.showImageCode"> | ||
82 | <div class="ipt-wrap"> | ||
83 | <input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" type="text" v-model="loginForm.imageValue"> | ||
84 | <div class="ipt verify-btn pointer vcode" @click="handlerRefreshImageValue"> | ||
85 | <img :src="values.imageBase64"> | ||
86 | </div> | ||
75 | </div> | 87 | </div> |
76 | </div> | 88 | </div> |
77 | <div class="pure-u-1 form-item"> | 89 | <div class="pure-u-1 form-item"> |
... | @@ -80,17 +92,20 @@ | ... | @@ -80,17 +92,20 @@ |
80 | </div> | 92 | </div> |
81 | <div class="ipt-wrap"> | 93 | <div class="ipt-wrap"> |
82 | <div class="ipt ipt2"> | 94 | <div class="ipt ipt2"> |
83 | <input :placeholder="$t('login.verifyCodePlaceholder')" class="ipt-code" type="text"> | 95 | <input :placeholder="$t('login.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="loginForm.otp"> |
84 | <div class="veri-btn pointer"> {{$t('login.verifyCodeGet')}}</div> | 96 | <div v-if="times.remain == 0" class="veri-btn pointer" @click="handlerStdSendOTP" >{{$t('register.verifyCodeGet')}}</div> |
97 | <div v-else class="veri-btn-default">{{times.tip}}</div> | ||
85 | </div> | 98 | </div> |
86 | </div> | 99 | </div> |
87 | </div> | 100 | </div> |
88 | </div> | 101 | </div> |
89 | <div class="login-protocol"> | 102 | <div class="login-protocol pointer" @click="loginCheck.agreeProtocol = !loginCheck.agreeProtocol" > |
90 | <img @click="onCheckHandler()" class="check pointer" src="@/assets/images/login/login-check.png"> {{$t('login.agree')}} | 103 | <img v-if="!loginCheck.agreeProtocol" class="check" src="@/assets/images/login/un-check.png"> |
104 | <img v-if="loginCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> | ||
105 | {{$t('login.agree')}} | ||
91 | <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span> | 106 | <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span> |
92 | </div> | 107 | </div> |
93 | <div @click="onSubmitHandler()" class="login-submit pointer">{{$t('login.login')}}</div> | 108 | <div @click="handlerLogin()" class="login-submit pointer">{{$t('login.login')}}</div> |
94 | <div class="login-func"> | 109 | <div class="login-func"> |
95 | <div @click="onRegisterHandler()" class="login-func-btn pointer">{{$t('login.register')}}</div> | 110 | <div @click="onRegisterHandler()" class="login-func-btn pointer">{{$t('login.register')}}</div> |
96 | <div @click="onForgetHandler()" class="login-func-btn pointer">{{$t('login.forget')}}</div> | 111 | <div @click="onForgetHandler()" class="login-func-btn pointer">{{$t('login.forget')}}</div> | ... | ... |
... | @@ -4,11 +4,43 @@ import { | ... | @@ -4,11 +4,43 @@ import { |
4 | httpPost | 4 | httpPost |
5 | } from '@/api/fetch-api.js' | 5 | } from '@/api/fetch-api.js' |
6 | 6 | ||
7 | let PK = 'B5FE03847F02046C47292AF0FF2DE88977241483DD40C123046EB39CBE4C48167B120096CFF12CD16559322884A3C56FA92B07B89AB51FC8C91A75127622151DDD730DFF1F993D5A290CEAC0BBA7FC88285D8994ACBAFF50101EDE9A0925AD5DFFAFE96D53C370E9C5B37DF2F871F81C4D7CA6B7EC37FF459C07975AD9A74A95'; | ||
8 | let E = '10001'; | ||
9 | |||
7 | export default { | 10 | export default { |
8 | data() { | 11 | data() { |
9 | return { | 12 | return { |
10 | key: 'value', | 13 | key: 'value', |
11 | type: 1, // 1:手机验证 2:输入密码 | 14 | type: 1, // 1:手机验证 2:输入密码 |
15 | mobileNoType: "hk",// 选择的手机好类型 | ||
16 | mobileTip: {}, | ||
17 | mobileOptions: [], | ||
18 | |||
19 | registerCheck: { | ||
20 | showImageCode: false, | ||
21 | agreeProtocol: false | ||
22 | }, | ||
23 | values: { | ||
24 | // 返回的token,串连整个流程,后台安全校验使用 | ||
25 | vcodeuuid: "", | ||
26 | token: "", | ||
27 | deviceId: "", | ||
28 | imageBase64: "", | ||
29 | password: "", | ||
30 | passwordRepeat: "" | ||
31 | }, | ||
32 | registerForm: { | ||
33 | imageValue: "", | ||
34 | mobileNo: "", | ||
35 | otp: "" | ||
36 | }, | ||
37 | times: { | ||
38 | interval: 0, // 索引 | ||
39 | remain: 0, // 剩余时间 | ||
40 | tip: "" // 显示的文字 | ||
41 | }, | ||
42 | PK: process.env.RSA_PUBLIC_KEY || PK, | ||
43 | E: process.env.RSA_KEY_INDEX || E, | ||
12 | } | 44 | } |
13 | }, | 45 | }, |
14 | components: {}, | 46 | components: {}, |
... | @@ -21,19 +53,324 @@ export default { | ... | @@ -21,19 +53,324 @@ export default { |
21 | } | 53 | } |
22 | }, | 54 | }, |
23 | methods: { | 55 | methods: { |
24 | onCheckHandler() { | ||
25 | |||
26 | }, | ||
27 | onProtocolHandler() { | 56 | onProtocolHandler() { |
28 | this.$router.push({ | 57 | this.$router.push({ |
29 | path: "/protocol" | 58 | path: "/protocol" |
30 | }) | 59 | }) |
31 | }, | 60 | }, |
61 | handlerStdSendOTP() { | ||
62 | // 发送短信验证码 | ||
63 | this._checkMobileLegal().then(() => { | ||
64 | if (this.times.remain > 0) { | ||
65 | return; | ||
66 | } | ||
67 | if (this.values.vcodeuuid && !this.registerForm.imageValue) { | ||
68 | this._showImageValueTip(); | ||
69 | return; | ||
70 | } | ||
71 | this._handlerIsShowImageVcode().then(() => { | ||
72 | this._startStdSendOTP(); | ||
73 | this._startTimeClick(); | ||
74 | }); | ||
75 | }); | ||
76 | }, | ||
77 | _checkMobileLegal() { | ||
78 | // 检测手机号是否正确 | ||
79 | return new Promise((resolve, reject) => { | ||
80 | let mobile = this.registerForm.mobileNo; | ||
81 | if (this.mobileNoType == "hk") { | ||
82 | if (mobile.length != 8) { | ||
83 | this._showMobileNoIllegalTip() | ||
84 | return; | ||
85 | } | ||
86 | } else { | ||
87 | if (mobile.length != 11) { | ||
88 | this._showMobileNoIllegalTip() | ||
89 | return; | ||
90 | } | ||
91 | } | ||
92 | resolve(true); | ||
93 | }); | ||
94 | }, | ||
95 | _handlerIsShowImageVcode() { | ||
96 | return new Promise((resolve, reject) => { | ||
97 | |||
98 | // 如果这个值不为空,标识出现了图片验证码,不需要重新询问是否需要图像验证码了 | ||
99 | if (this.values.vcodeuuid) { | ||
100 | resolve(); | ||
101 | return; | ||
102 | } | ||
103 | |||
104 | httpPost({ | ||
105 | url: api.stdIsShowImageVcode, | ||
106 | data: { | ||
107 | deviceId: this.values.deviceId, | ||
108 | userId: this.registerForm.mobileNo | ||
109 | } | ||
110 | }).then(response => { | ||
111 | // 判断是否显示图形验证码 | ||
112 | if (response.returnCode == "0") { | ||
113 | this.values.token = response.data.token; | ||
114 | if (response.data.isShowVcode == "N") { | ||
115 | // 测试代码 | ||
116 | // if (!this.values.vcodeuuid) { | ||
117 | // this.registerCheck.showImageCode = true; | ||
118 | // this.values.vcodeuuid = "123456"; | ||
119 | // return; | ||
120 | // } | ||
121 | this.values.vcodeuuid = null; | ||
122 | resolve(response); | ||
123 | } else { | ||
124 | // image 值: | ||
125 | this.registerCheck.showImageCode = true; | ||
126 | this.values.vcodeuuid = response.data.vcodeuuid; | ||
127 | this.values.imageBase64 = response.data.image; | ||
128 | } | ||
129 | } | ||
130 | return false; | ||
131 | }) | ||
132 | }); | ||
133 | }, | ||
134 | _showMobileNoIllegalTip() { | ||
135 | alert("手机号不正确"); | ||
136 | }, | ||
137 | _startStdSendOTP() { | ||
138 | // 正式发送OTP信号 | ||
139 | let data = { | ||
140 | mobileNo: this.registerForm.mobileNo, | ||
141 | token: this.values.token, | ||
142 | signFactor: new Date().getTime(), | ||
143 | scene: "register", | ||
144 | } | ||
145 | if (this.values.vcodeuuid) { | ||
146 | data["vcodeuuid"] = this.values.vcodeuuid; | ||
147 | data["imageValue"] = this.registerForm.imageValue; | ||
148 | } | ||
149 | httpPost({ url: api.stdSendOTP, data: data }); | ||
150 | }, | ||
151 | _startTimeClick() { | ||
152 | this.times.remain = 120; | ||
153 | let _this = this; | ||
154 | let i18n = this.$i18n.messages[this.$i18n.locale] || {}; | ||
155 | let msg = i18n.register.coutTips; | ||
156 | _this.times.tip = msg.replace("{second}", _this.times.remain); | ||
157 | this.times.interval = setInterval(function () { | ||
158 | if (_this.times.remain <= 0) { | ||
159 | clearInterval(_this.times.interval); | ||
160 | _this.times.interval = 0; | ||
161 | _this.times.remain = 0; | ||
162 | return; | ||
163 | } | ||
164 | _this.times.remain--; | ||
165 | _this.times.tip = msg.replace("{second}", _this.times.remain); | ||
166 | _this.$set(_this, 'times', _this.times); | ||
167 | }, 1000); | ||
168 | }, | ||
32 | onSubmitHandler() { | 169 | onSubmitHandler() { |
33 | this.type = 2; | 170 | // this.type = 2; |
171 | this._checkParams().then(() => { | ||
172 | this._regCheck().then(() => { | ||
173 | // 验证短信验证码 | ||
174 | this._validateOTPandRepeat().then(() => { | ||
175 | this.type = 2; | ||
176 | }); | ||
177 | }); | ||
178 | }); | ||
179 | }, | ||
180 | _validateOTPandRepeat() { | ||
181 | return new Promise((resolve, reject) => { | ||
182 | let data = { | ||
183 | mobileNo: this.registerForm.mobileNo, | ||
184 | token: this.values.token, | ||
185 | signFactor: new Date().getTime(), | ||
186 | otp: this.registerForm.opt | ||
187 | }; | ||
188 | httpPost({ | ||
189 | url: api.stdValidateOTPandRepeat, | ||
190 | data: data | ||
191 | }).then(response => { | ||
192 | if (response.returnCode != "0") { | ||
193 | this._showCheckOTPErrTip(response.returnMsg); | ||
194 | // TODO 测试代码 | ||
195 | // resolve(); | ||
196 | } else { | ||
197 | // this.type = 2; | ||
198 | resolve(); | ||
199 | } | ||
200 | }) | ||
201 | }); | ||
202 | }, | ||
203 | _regCheck() { | ||
204 | // 检测手机号注册情况 | ||
205 | return new Promise((resolve, reject) => { | ||
206 | let data = { | ||
207 | mobileNo: this.registerForm.mobileNo, | ||
208 | }; | ||
209 | httpPost({ | ||
210 | url: api.gsRegCheck, | ||
211 | data: data | ||
212 | }).then(response => { | ||
213 | if (response.returnCode == "0") { | ||
214 | if (response.data.mobileStatus == "N") { | ||
215 | resolve(); | ||
216 | } else { | ||
217 | // 重复注册 | ||
218 | this._showDuplicateRegistrationTip(); | ||
219 | } | ||
220 | } else { | ||
221 | // 错误提示 | ||
222 | this._showCheckOTPErrTip(response.returnMsg); | ||
223 | } | ||
224 | }) | ||
225 | }); | ||
226 | }, | ||
227 | _checkParams() { | ||
228 | return new Promise((resolve, reject) => { | ||
229 | if (!this.registerCheck.agreeProtocol) { | ||
230 | this._showAgreeProtocolTip(); | ||
231 | return; | ||
232 | } | ||
233 | if (!this.values.token) { | ||
234 | this._showTokenTip(); | ||
235 | return; | ||
236 | } | ||
237 | if (this.values.vcodeuuid && !this.registerForm.imageValue) { | ||
238 | this._showImageValueTip(); | ||
239 | return; | ||
240 | } | ||
241 | if (!this.registerForm.opt) { | ||
242 | this._showOTPTip(); | ||
243 | return; | ||
244 | } | ||
245 | this._checkMobileLegal().then(() => { | ||
246 | resolve(); | ||
247 | }) | ||
248 | }); | ||
249 | }, | ||
250 | |||
251 | _showAgreeProtocolTip() { | ||
252 | alert("请同意协议") | ||
253 | }, | ||
254 | _showOTPTip() { | ||
255 | alert("请填写短信验证码") | ||
256 | }, | ||
257 | _showTokenTip() { | ||
258 | alert("请先请求短信验证码") | ||
259 | }, | ||
260 | _showDuplicateRegistrationTip() { | ||
261 | alert("手机号已经被注册,请使用其他手机号重新注册") | ||
262 | }, | ||
263 | _showImageValueTip() { | ||
264 | alert("请输入图片验证码") | ||
265 | }, | ||
266 | _showCheckOTPErrTip(msg) { | ||
267 | alert(msg); | ||
34 | }, | 268 | }, |
35 | onRegisterHandler() { | 269 | onRegisterHandler() { |
270 | this._checkPassword().then(() => { | ||
271 | let data = { | ||
272 | token: this.values.token, | ||
273 | mobileNo: this.registerForm.mobileNo, | ||
274 | loginPwd: this._passwordEncrypt(this.values.password) | ||
275 | }; | ||
276 | httpPost({ | ||
277 | url: api.stdRegister, | ||
278 | data: data | ||
279 | }).then(response => { | ||
280 | if (response.returnCode != 0) { | ||
281 | this._showRegisterFailure(response); | ||
282 | this.type = 1; | ||
283 | } else { | ||
284 | this._showSuccessMessage(); | ||
285 | this.$router.push({ | ||
286 | path: "/login" | ||
287 | }); | ||
288 | } | ||
289 | }) | ||
290 | }); | ||
291 | }, | ||
292 | _checkPassword() { | ||
293 | return new Promise((resolve, reject) => { | ||
294 | let password = this.values.password; | ||
295 | if (password.length < 8) { | ||
296 | this._showPasswordLenthNotEnouth(); | ||
297 | return; | ||
298 | } | ||
299 | // 匹配字母 | ||
300 | let m1 = /([a-z])+/.test(password); | ||
301 | let m2 = /([A-Z])+/.test(password); | ||
302 | // 匹配数字 | ||
303 | let m3 = /([0-9])+/.test(password); | ||
304 | // 匹配特殊字符 | ||
305 | let m4 = /[^a-zA-Z0-9]+/.test(password); | ||
306 | console.log(m1, m2, m3, m4) | ||
307 | if ((m1 | m2) & m3 & m4) { | ||
308 | if (password != this.values.passwordRepeat) { | ||
309 | this._showPasswordNotTheSameTips(); | ||
310 | } else { | ||
311 | resolve(); | ||
312 | } | ||
313 | } else { | ||
314 | this._showPasswordComplexityTips(); | ||
315 | } | ||
316 | }); | ||
317 | }, | ||
318 | _showPasswordLenthNotEnouth() { | ||
319 | alert("密码长度不能少于8位") | ||
320 | }, | ||
321 | _showPasswordComplexityTips() { | ||
322 | alert("密码必须同时包含数字、字母、特殊字符") | ||
323 | }, | ||
324 | _showPasswordNotTheSameTips() { | ||
325 | alert("两次输入的密码不一致") | ||
326 | }, | ||
327 | _showRegisterFailure(response) { | ||
328 | if ("COMMON_ERROR_052" == response.returnCode) { | ||
329 | this._resetRegisterParam(); | ||
330 | this.handlerRefreshImageVcode(); | ||
331 | alert("验证码过期,请重新申请验证码"); | ||
332 | } else { | ||
333 | this._resetAllParams(); | ||
334 | alert("注册失败,请联系工作人员"); | ||
335 | } | ||
336 | }, | ||
337 | _resetAllParams() { | ||
338 | this.values.vcodeuuid = ""; | ||
339 | this.values.token = ""; | ||
340 | this.values.imageBase64 = ""; | ||
341 | this.values.password = ""; | ||
342 | this.values.passwordRepeat = ""; | ||
36 | 343 | ||
344 | this.registerForm.imageValue = ""; | ||
345 | this.registerForm.mobileNo = ""; | ||
346 | this.registerForm.otp = ""; | ||
347 | |||
348 | this.times.interval = ""; | ||
349 | this.times.remain = ""; | ||
350 | this.times.tip = ""; | ||
351 | }, | ||
352 | _resetRegisterParam() { | ||
353 | this.values.token = ""; | ||
354 | this.registerForm.otp = ""; | ||
355 | this.times.interval = ""; | ||
356 | this.times.remain = ""; | ||
357 | this.times.tip = ""; | ||
358 | }, | ||
359 | handlerRefreshImageVcode() { | ||
360 | if (this.values.vcodeuuid) { | ||
361 | let data = { | ||
362 | vcodeuuid: this.values.vcodeuuid | ||
363 | } | ||
364 | httpPost({ | ||
365 | url: api.stdRefreshVcode, | ||
366 | data: data | ||
367 | }).then(response => { | ||
368 | this.$set(this.values, 'imageBase64', response.data.image); | ||
369 | }) | ||
370 | } | ||
371 | }, | ||
372 | _showSuccessMessage() { | ||
373 | alert("注册成功") | ||
37 | }, | 374 | }, |
38 | onForgetHandler() { | 375 | onForgetHandler() { |
39 | 376 | ||
... | @@ -41,8 +378,31 @@ export default { | ... | @@ -41,8 +378,31 @@ export default { |
41 | onLoginTypeHandler(val) { | 378 | onLoginTypeHandler(val) { |
42 | 379 | ||
43 | }, | 380 | }, |
44 | initData() {} | 381 | _passwordEncrypt(rawPwd) { |
382 | let rsa = new RSAKey(); | ||
383 | rsa.setPublic(this.PK, this.E); | ||
384 | let res = rsa.encrypt(rawPwd); | ||
385 | if (res == null) return rawPwd; | ||
386 | return res; | ||
387 | }, | ||
388 | initData() { | ||
389 | let i18n = this.$i18n.messages[this.$i18n.locale] || {}; | ||
390 | let mobileOptions = JSON.parse(JSON.stringify(i18n.register.mobileOptions)); | ||
391 | this.mobileOptions = mobileOptions; | ||
392 | this.mobileTip = this.mobileOptions[0]; | ||
393 | } | ||
394 | }, | ||
395 | mounted() { }, | ||
396 | watch: { | ||
397 | mobileNoType() { | ||
398 | this.mobileOptions.forEach(element => { | ||
399 | if (element.type == this.mobileNoType) { | ||
400 | this.$set(this, 'mobileTip', element); | ||
401 | } | ||
402 | }) | ||
403 | } | ||
45 | }, | 404 | }, |
46 | mounted() {}, | 405 | created() { |
47 | created() {} | 406 | this.initData(); |
407 | } | ||
48 | } | 408 | } | ... | ... |
... | @@ -120,6 +120,20 @@ | ... | @@ -120,6 +120,20 @@ |
120 | justify-content: space-between; | 120 | justify-content: space-between; |
121 | flex-wrap: wrap; | 121 | flex-wrap: wrap; |
122 | 122 | ||
123 | .vcode { | ||
124 | background-color: transparent !important; | ||
125 | padding: 0 !important; | ||
126 | overflow: hidden; | ||
127 | img { | ||
128 | width: 100%; | ||
129 | height: 100%; | ||
130 | } | ||
131 | } | ||
132 | |||
133 | input { | ||
134 | font-size: 1.166667rem; /* 14/12 */ | ||
135 | letter-spacing: .1rem;/* 1.2/12 */ | ||
136 | } | ||
123 | 137 | ||
124 | &-item { | 138 | &-item { |
125 | position: relative; | 139 | position: relative; |
... | @@ -206,6 +220,9 @@ | ... | @@ -206,6 +220,9 @@ |
206 | color: #f05a23; | 220 | color: #f05a23; |
207 | text-decoration: underline; | 221 | text-decoration: underline; |
208 | } | 222 | } |
223 | .veri-btn-default { | ||
224 | color: #aaaaaa; | ||
225 | } | ||
209 | } | 226 | } |
210 | 227 | ||
211 | } | 228 | } | ... | ... |
... | @@ -16,36 +16,44 @@ | ... | @@ -16,36 +16,44 @@ |
16 | <div class="pure-u-1 form-item"> | 16 | <div class="pure-u-1 form-item"> |
17 | <div class="ipt-wrap"> | 17 | <div class="ipt-wrap"> |
18 | <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt=""> | 18 | <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt=""> |
19 | <select class="ipt"> | 19 | <select class="ipt" v-model="mobileNoType"> |
20 | <template v-if="locale == 'zh'"> | 20 | <option v-for="(item,index) in mobileOptions" :key="index" :value="item.type">{{item.name}}</option> |
21 | <option>香港手机号</option> | ||
22 | </template> | ||
23 | <template v-else> | ||
24 | <option>香港手機號</option> | ||
25 | </template> | ||
26 | </select> | 21 | </select> |
27 | </div> | 22 | </div> |
28 | </div> | 23 | </div> |
29 | <div class="pure-u-1 form-item"> | 24 | <div class="pure-u-1 form-item"> |
30 | <div class="ipt-wrap"> | 25 | <div class="ipt-wrap"> |
31 | <div class="ipt ipt2"> | 26 | <div class="ipt ipt2"> |
32 | <div class="region-tel">+852</div> | 27 | <div class="region-tel">{{mobileTip.areaCode}}</div> |
33 | <input :placeholder="$t('register.mobilePlaceholder')" class="ipt-tel" type="text"> | 28 | <input :placeholder="mobileTip.placeHolder" class="ipt-tel" type="text" v-model="registerForm.mobileNo"> |
29 | </div> | ||
30 | </div> | ||
31 | </div> | ||
32 | |||
33 | <div class="pure-u-1 form-item" v-if="registerCheck.showImageCode"> | ||
34 | <div class="ipt-wrap"> | ||
35 | <input :placeholder="$t('login.verifyPlaceholder')" class="ipt ipt-verify" type="text" v-model="registerForm.imageValue"> | ||
36 | <div class="ipt verify-btn pointer vcode" @click="handlerRefreshImageVcode"> | ||
37 | <img :src="values.imageBase64"> | ||
34 | </div> | 38 | </div> |
35 | </div> | 39 | </div> |
36 | </div> | 40 | </div> |
37 | <div class="pure-u-1 form-item"> | 41 | <div class="pure-u-1 form-item"> |
38 | <div class="ipt-wrap"> | 42 | <div class="ipt-wrap"> |
39 | <div class="ipt ipt2"> | 43 | <div class="ipt ipt2"> |
40 | <input :placeholder="$t('register.verifyCodePlaceholder')" class="ipt-code" type="text"> | 44 | <input :placeholder="$t('register.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="registerForm.opt"> |
41 | <div class="veri-btn pointer">{{$t('register.verifyCodeGet')}}</div> | 45 | <div v-if="times.remain == 0" class="veri-btn pointer" @click="handlerStdSendOTP" >{{$t('register.verifyCodeGet')}}</div> |
46 | <div v-else class="veri-btn-default">{{times.tip}}</div> | ||
42 | </div> | 47 | </div> |
43 | </div> | 48 | </div> |
44 | </div> | 49 | </div> |
45 | </div> | 50 | </div> |
46 | <div class="login-protocol"> | 51 | |
47 | <img @click="onCheckHandler()" class="check pointer" src="@/assets/images/login/login-check.png">{{$t('register.agree')}} | 52 | <div class="login-protocol pointer" @click="registerCheck.agreeProtocol = !registerCheck.agreeProtocol" > |
48 | <span @click="onProtocolHandler()" class="protocol pointer">{{$t('register.protocol')}}</span> | 53 | <img v-if="!registerCheck.agreeProtocol" class="check" src="@/assets/images/login/un-check.png"> |
54 | <img v-if="registerCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> | ||
55 | {{$t('login.agree')}} | ||
56 | <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span> | ||
49 | </div> | 57 | </div> |
50 | <div @click="onSubmitHandler()" class="login-submit pointer">{{$t('register.register')}}</div> | 58 | <div @click="onSubmitHandler()" class="login-submit pointer">{{$t('register.register')}}</div> |
51 | </div> | 59 | </div> |
... | @@ -57,7 +65,7 @@ | ... | @@ -57,7 +65,7 @@ |
57 | <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}} | 65 | <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}} |
58 | </div> | 66 | </div> |
59 | <div class="ipt-wrap"> | 67 | <div class="ipt-wrap"> |
60 | <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" type="text"> | 68 | <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" type="password" v-model="values.password"> |
61 | </div> | 69 | </div> |
62 | </div> | 70 | </div> |
63 | <div class="pure-u-1 form-item"> | 71 | <div class="pure-u-1 form-item"> |
... | @@ -65,11 +73,11 @@ | ... | @@ -65,11 +73,11 @@ |
65 | <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}} | 73 | <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}} |
66 | </div> | 74 | </div> |
67 | <div class="ipt-wrap"> | 75 | <div class="ipt-wrap"> |
68 | <input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" type="text"> | 76 | <input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" type="password" v-model="values.passwordRepeat"> |
69 | </div> | 77 | </div> |
70 | </div> | 78 | </div> |
71 | </div> | 79 | </div> |
72 | <div @click="onSubmitHandler()" class="login-submit pointer">{{$t('register.sure')}}</div> | 80 | <div @click="onRegisterHandler()" class="login-submit pointer">{{$t('register.sure')}}</div> |
73 | </div> | 81 | </div> |
74 | </div> | 82 | </div> |
75 | </div> | 83 | </div> | ... | ... |
1 | import { setCookie, getCookie } from '@/utils/utils.js' | ||
2 | import { stat } from 'fs'; | ||
3 | |||
1 | export function INCREMENT(state) { | 4 | export function INCREMENT(state) { |
2 | state.counter++ | 5 | state.counter++ |
3 | } | 6 | } |
... | @@ -9,3 +12,13 @@ export function IS_MOBILE(state, bool) { | ... | @@ -9,3 +12,13 @@ export function IS_MOBILE(state, bool) { |
9 | export function IS_SMALL_SCREEN(state, bool) { | 12 | export function IS_SMALL_SCREEN(state, bool) { |
10 | state.isSmallScreen = bool | 13 | state.isSmallScreen = bool |
11 | } | 14 | } |
15 | |||
16 | export function SET_USER_INFO(state, val) { | ||
17 | if (val) { | ||
18 | setCookie("_user_profile", encodeURIComponent(JSON.stringify(val)), 7200); | ||
19 | state.userInfo = val; | ||
20 | } else { | ||
21 | setCookie("_user_profile", "", 1); | ||
22 | state.userInfo = null; | ||
23 | } | ||
24 | } | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -2,4 +2,10 @@ export default { | ... | @@ -2,4 +2,10 @@ export default { |
2 | counter: 2, // 例子 | 2 | counter: 2, // 例子 |
3 | isMobile: false, //是否手机访问 | 3 | isMobile: false, //是否手机访问 |
4 | isSmallScreen: false, // 是否小屏幕 (PC时,小屏幕机导航栏会改变)) | 4 | isSmallScreen: false, // 是否小屏幕 (PC时,小屏幕机导航栏会改变)) |
5 | |||
6 | userInfo : { | ||
7 | sid : "", | ||
8 | name : "", | ||
9 | hadFullInfo: "" | ||
10 | } | ||
5 | } | 11 | } | ... | ... |
... | @@ -21,9 +21,9 @@ export function param2Obj(url) { | ... | @@ -21,9 +21,9 @@ export function param2Obj(url) { |
21 | return JSON.parse( | 21 | return JSON.parse( |
22 | '{"' + | 22 | '{"' + |
23 | decodeURIComponent(search) | 23 | decodeURIComponent(search) |
24 | .replace(/"/g, '\\"') | 24 | .replace(/"/g, '\\"') |
25 | .replace(/&/g, '","') | 25 | .replace(/&/g, '","') |
26 | .replace(/=/g, '":"') + | 26 | .replace(/=/g, '":"') + |
27 | '"}' | 27 | '"}' |
28 | ) | 28 | ) |
29 | } | 29 | } |
... | @@ -40,10 +40,10 @@ export function getCookie(name) { | ... | @@ -40,10 +40,10 @@ export function getCookie(name) { |
40 | } | 40 | } |
41 | 41 | ||
42 | //设置cookie | 42 | //设置cookie |
43 | export function setCookie(c_name, value, expiredays) { | 43 | export function setCookie(c_name, value, second) { |
44 | var exdate = new Date(); | 44 | var exdate = new Date(); |
45 | exdate.setDate(exdate.getDate() + expiredays); | 45 | exdate.setTime(exdate.getTime() + second * 1000); |
46 | document.cookie = c_name + "=" + escape(value) + ((expiredays == null) ? "" : ";expires=" + exdate.toGMTString()); | 46 | document.cookie = c_name + "=" + escape(value) + ((second == null) ? "" : ";expires=" + exdate.toGMTString()); |
47 | }; | 47 | }; |
48 | 48 | ||
49 | //删除cookie | 49 | //删除cookie | ... | ... |
-
Please register or sign in to post a comment