Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
478ae091 by simon
Options

默认提交

1 parent eed82949
Inline Side-by-side
Showing 34 changed files with 923 additions and 25 deletions
...@@ -344,6 +344,10 @@ textarea { ...@@ -344,6 +344,10 @@ textarea {
344 margin: 0 auto; 344 margin: 0 auto;
345 } 345 }
346 346
347 .focus{
348 border: 1px solid $cOrange ;
349 }
350
347 .app__width { 351 .app__width {
348 width: 750px; 352 width: 750px;
349 } 353 }
...@@ -405,4 +409,10 @@ textarea { ...@@ -405,4 +409,10 @@ textarea {
405 .swiper-pagination-bullet-active { 409 .swiper-pagination-bullet-active {
406 background: #f05a23 !important; 410 background: #f05a23 !important;
407 } 411 }
412
413
414 .ipt:focus {
415 border-color: $cOrange !important;
416 }
417
408 </style> 418 </style>
......
...@@ -13,8 +13,7 @@ function Toast(msg) { ...@@ -13,8 +13,7 @@ function Toast(msg) {
13 // 服务器地址 13 // 服务器地址
14 // let base = process.env.REQUEST_DOMAIN || "http://localhost:9101"; 14 // let base = process.env.REQUEST_DOMAIN || "http://localhost:9101";
15 // let base = COM.baseUrl; 15 // let base = COM.baseUrl;
16 let base = "" 16 let base = "";
17 console.log("process.env:", process.env);
18 const axios = axiosIns.create({ 17 const axios = axiosIns.create({
19 baseURL: process.env.VUE_APP_BASE_URL || "http://localhost:9101", 18 baseURL: process.env.VUE_APP_BASE_URL || "http://localhost:9101",
20 timeout: 5000 19 timeout: 5000
......

3 KB | W: | H:

2.2 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

2.87 KB | W: | H:

2.16 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

3.23 KB | W: | H:

2.41 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

3.05 KB | W: | H:

2.19 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

2.93 KB | W: | H:

2.16 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

3.21 KB | W: | H:

2.41 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

3.03 KB | W: | H:

2.28 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

2.95 KB | W: | H:

2.19 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
...@@ -51,7 +51,7 @@ module.exports = { ...@@ -51,7 +51,7 @@ module.exports = {
51 }, 51 },
52 { 52 {
53 name: "Pay premium", 53 name: "Pay premium",
54 path: "/payment/type" 54 path: "/custom/service?q=m2"
55 }, 55 },
56 { 56 {
57 name: "Query policy", 57 name: "Query policy",
......
...@@ -51,7 +51,7 @@ module.exports = { ...@@ -51,7 +51,7 @@ module.exports = {
51 }, 51 },
52 { 52 {
53 name: "繳付保費", 53 name: "繳付保費",
54 path: "/payment/type" 54 path: "/custom/service?q=m2"
55 }, 55 },
56 { 56 {
57 name: "保單查詢", 57 name: "保單查詢",
......
...@@ -51,7 +51,7 @@ module.exports = { ...@@ -51,7 +51,7 @@ module.exports = {
51 }, 51 },
52 { 52 {
53 name: "缴付保费", 53 name: "缴付保费",
54 path: "/payment/type" 54 path: "/custom/service?q=m2"
55 }, 55 },
56 { 56 {
57 name: "保单查询", 57 name: "保单查询",
......
...@@ -73,7 +73,7 @@ ...@@ -73,7 +73,7 @@
73 } 73 }
74 } 74 }
75 75
76 .focus { 76 .public {
77 width: 6.25rem; 77 width: 6.25rem;
78 text-align: center; 78 text-align: center;
79 margin-right: 3rem; 79 margin-right: 3rem;
......
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
39 </div> 39 </div>
40 40
41 </div> 41 </div>
42 <div class="focus"> 42 <div class="public">
43 <div class="tit">{{$t('footer.qrcode')}}</div> 43 <div class="tit">{{$t('footer.qrcode')}}</div>
44 <img class="qrcode" src="@/assets/images/home/qrcode-focus.png" alt=""> 44 <img class="qrcode" src="@/assets/images/home/qrcode-focus.png" alt="">
45 </div> 45 </div>
......
1 import api from '@/api/api'
2 import {
3 httpGet,
4 httpPost
5 } from '@/api/fetch-api.js'
6
7
8 export default {
9 data() {
10 return {
11 key: 'value'
12 }
13 },
14 components: {},
15 methods: {
16 initData() {}
17 },
18 mounted() {},
19 created() {
20 }
21 }
...\ No newline at end of file ...\ No newline at end of file
1 @import '@/styles/_support';
1
2 <template>
3 <div class="comp">
4 modal-comp
5 </div>
6 </template>
7
8 <script src="./modal-comp.js"></script>
9 <style lang="scss" scoped>
10 @import "./modal-comp.scss";
11 </style>
...@@ -6,13 +6,13 @@ ...@@ -6,13 +6,13 @@
6 </div> 6 </div>
7 <div class="top-space"></div> 7 <div class="top-space"></div>
8 <div class="box product"> 8 <div class="box product">
9 <div class="product-item" @click="toPage('/custom/service?q=m1')"> 9 <div @click="toPage('/custom/service?q=m1')" class="product-item">
10 <div class="icon-wrap"> 10 <div class="icon-wrap">
11 <img src="@/assets/images/custom-product/icon-cp-1.png"> 11 <img src="@/assets/images/custom-product/icon-cp-1.png">
12 </div> 12 </div>
13 <div class="t1">{{$t('customProduct.menu1')}}</div> 13 <div class="t1">{{$t('customProduct.menu1')}}</div>
14 </div> 14 </div>
15 <div @click="toPage('/payment/type')" class="product-item"> 15 <div @click="toPage('/custom/service?q=m2')" class="product-item">
16 <div class="icon-wrap"> 16 <div class="icon-wrap">
17 <img src="@/assets/images/custom-product/icon-cp-2.png"> 17 <img src="@/assets/images/custom-product/icon-cp-2.png">
18 </div> 18 </div>
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
38 </div> 38 </div>
39 <div class="t1">{{$t('customProduct.menu5')}}</div> 39 <div class="t1">{{$t('customProduct.menu5')}}</div>
40 </div> 40 </div>
41 <div @click="toPage('/custom/service?q=m6')" class="product-item"> 41 <div @click="toPage('/custom/service?q=m6')" class="product-item">
42 <div class="icon-wrap"> 42 <div class="icon-wrap">
43 <img src="@/assets/images/custom-product/icon-cp-6.png"> 43 <img src="@/assets/images/custom-product/icon-cp-6.png">
44 </div> 44 </div>
......
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
21 position: relative; 21 position: relative;
22 margin-bottom: 2.333333rem; 22 margin-bottom: 2.333333rem;
23 23
24 &:last-child{ 24 &:last-child {
25 margin-bottom: 0; 25 margin-bottom: 0;
26 } 26 }
27 27
...@@ -55,6 +55,7 @@ ...@@ -55,6 +55,7 @@
55 padding: 0 2.083333rem; 55 padding: 0 2.083333rem;
56 } 56 }
57 57
58
58 .name-ipt { 59 .name-ipt {
59 width: 13.666667rem; 60 width: 13.666667rem;
60 } 61 }
...@@ -84,7 +85,7 @@ ...@@ -84,7 +85,7 @@
84 cursor: default; 85 cursor: default;
85 } 86 }
86 87
87 .check-icon{ 88 .check-icon {
88 display: inline-block; 89 display: inline-block;
89 margin-left: 2.166667rem; 90 margin-left: 2.166667rem;
90 margin-right: .666667rem; 91 margin-right: .666667rem;
...@@ -93,6 +94,7 @@ ...@@ -93,6 +94,7 @@
93 } 94 }
94 95
95 } 96 }
97
96 .submit-btn { 98 .submit-btn {
97 width: 13.583333rem; 99 width: 13.583333rem;
98 height: 4.083333rem; 100 height: 4.083333rem;
......
...@@ -42,7 +42,7 @@ ...@@ -42,7 +42,7 @@
42 left: 0; 42 left: 0;
43 right: 0; 43 right: 0;
44 margin: 0 auto; 44 margin: 0 auto;
45 z-index: 11; 45 z-index: 1;
46 } 46 }
47 47
48 .grid { 48 .grid {
......
...@@ -88,7 +88,7 @@ ...@@ -88,7 +88,7 @@
88 background-color: #ffffff; 88 background-color: #ffffff;
89 89
90 .panel { 90 .panel {
91 display: none; 91 // display: none;
92 } 92 }
93 93
94 .activity { 94 .activity {
......
...@@ -22,7 +22,35 @@ ...@@ -22,7 +22,35 @@
22 </template> 22 </template>
23 </div> 23 </div>
24 <div class="right-panel"> 24 <div class="right-panel">
25 <div class="panel" :class="{activity : activity == 'm1'}"> 25 <div class="panel" v-if="activity == 'm1'">
26 <contact-us></contact-us>
27 </div>
28 <div class="panel" v-if="activity == 'm2'">
29 <payment-type></payment-type>
30 </div>
31 <div class="panel" v-if="activity == 'm3'">
32 <insurance-query></insurance-query>
33 </div>
34 <div class="panel" v-if="activity == 'm41'">
35 <policy-change-guide></policy-change-guide>
36 </div>
37 <div class="panel" v-if="activity == 'm42'">
38 <policy-change-contact></policy-change-contact>
39 </div>
40 <div class="panel" v-if="activity == 'm43'">
41 <policy-change-information></policy-change-information>
42 </div>
43 <div class="panel" v-if="activity == 'm5'"></div>
44 <div class="panel" v-if="activity == 'm6'">
45 <reservation></reservation>
46 </div>
47 <div class="panel" v-if="activity == 'm7'">
48 <complaint-acceptance></complaint-acceptance>
49 </div>
50 <div class="panel" v-if="activity == 'm8'">
51 <common-form></common-form>
52 </div>
53 <!-- <div class="panel" :class="{activity : activity == 'm1'}">
26 <contact-us></contact-us> 54 <contact-us></contact-us>
27 </div> 55 </div>
28 <div class="panel" :class="{activity : activity == 'm2'}"> 56 <div class="panel" :class="{activity : activity == 'm2'}">
...@@ -31,7 +59,6 @@ ...@@ -31,7 +59,6 @@
31 <div class="panel" :class="{activity : activity == 'm3'}"> 59 <div class="panel" :class="{activity : activity == 'm3'}">
32 <insurance-query></insurance-query> 60 <insurance-query></insurance-query>
33 </div> 61 </div>
34 <!-- <div class="panel" :class="{activity : activity == 'm4'}"></div> -->
35 <div class="panel" :class="{activity : activity == 'm41'}"> 62 <div class="panel" :class="{activity : activity == 'm41'}">
36 <policy-change-guide></policy-change-guide> 63 <policy-change-guide></policy-change-guide>
37 </div> 64 </div>
...@@ -41,7 +68,6 @@ ...@@ -41,7 +68,6 @@
41 <div class="panel" :class="{activity : activity == 'm43'}"> 68 <div class="panel" :class="{activity : activity == 'm43'}">
42 <policy-change-information></policy-change-information> 69 <policy-change-information></policy-change-information>
43 </div> 70 </div>
44
45 <div class="panel" :class="{activity : activity == 'm5'}"></div> 71 <div class="panel" :class="{activity : activity == 'm5'}"></div>
46 <div class="panel" :class="{activity : activity == 'm6'}"> 72 <div class="panel" :class="{activity : activity == 'm6'}">
47 <reservation></reservation> 73 <reservation></reservation>
...@@ -51,7 +77,7 @@ ...@@ -51,7 +77,7 @@
51 </div> 77 </div>
52 <div class="panel" :class="{activity : activity == 'm8'}"> 78 <div class="panel" :class="{activity : activity == 'm8'}">
53 <common-form></common-form> 79 <common-form></common-form>
54 </div> 80 </div> -->
55 </div> 81 </div>
56 </div> 82 </div>
57 </template> 83 </template>
......
1 import api from '@/api/api'
2 import {
3 httpGet,
4 httpPost
5 } from '@/api/fetch-api.js'
6
7 export default {
8 data() {
9 return {
10 key: 'value',
11 values: {
12 // 返回的token，串连整个流程，后台安全校验使用
13 vcodeuuid: "",
14 token: "",
15 deviceId: "",
16 imageBase64: "",
17 password: "",
18 passwordRepeat: ""
19 },
20 }
21 },
22 components: {},
23 computed: {
24 locale() {
25 return this.$i18n.locale || 'tc';
26 },
27 i18n() {
28 return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
29 }
30 },
31 methods: {
32 initData() {}
33 },
34 mounted() {},
35 created() {}
36 }
1 @import '@/styles/_support';
2
3 .content {
4 position: relative;
5 padding-bottom: 2.25rem;
6 }
7
8 .top-space {
9 height: 2.25rem;
10 }
11
12 .box {
13 position: relative;
14 }
15
16 .ebg {
17 position: absolute;
18 bottom: 0;
19 left: 0;
20 right: 0;
21
22 img {
23 max-width: 100%;
24 }
25 }
26
27 .step {
28 @extend .fcc;
29 margin-bottom: 3rem;
30 }
31
32 .login {
33 color: #4c4948;
34 @extend .bb;
35 padding: 1.416667rem 6rem 2.25rem;
36 border-bottom: solid .666667rem #006441;
37
38 margin: auto;
39 max-width: 40.25rem;
40 // height: 49.25rem;
41
42 border-radius: .75rem;
43 box-shadow: 0 0 1.5rem 0 rgba(255, 87, 0, 0.15);
44 background-color: #ffffff;
45
46 &-tit {
47 color: #f05a23;
48 text-align: center;
49 font-size: 18px;
50 font-weight: bold;
51 letter-spacing: .2rem;
52 text-shadow: 3px 5.2px 9px rgba(236, 100, 41, 0.27);
53 }
54
55 &-tit-space-1 {
56 height: 2rem;
57 }
58
59 &-nav {
60 margin: 2.25rem 0 auto;
61 display: flex;
62 justify-content: center;
63 align-items: center;
64
65 &-v-line {
66 width: .2rem;
67 height: 1.25rem;
68 background-color: #4c4948;
69 margin: 0 2.25rem;
70 }
71
72 &-tit {
73 flex: 1;
74 font-size: 18px;
75 font-weight: bold;
76 color: #4c4948;
77 }
78
79 .active {
80 color: #f05a23;
81 text-shadow: 3px 5.2px 9px rgba(236, 100, 41, 0.27);
82 }
83 }
84
85 &-protocol {
86 margin: 2.5rem auto 0;
87 display: flex;
88 align-items: center;
89 padding-left: 1rem;
90
91 .check {
92 height: 1rem;
93 margin-right: .6rem;
94 }
95
96 .protocol {
97 color: #f05a23;
98 }
99 }
100
101 &-btn-wrap {
102 display: flex;
103 justify-content: space-between;
104 margin-top: 2rem;
105 }
106
107 &-submit {
108 @include btc2(13.2rem, 4rem, 16px);
109 // margin: 2rem 1rem 0;
110 letter-spacing: 1.6px;
111 // position: absolute;
112 // left: 0;
113 // right: 0;
114 // margin: 0 auto;
115 // bottom: 2.25rem;
116 }
117
118 &-func {
119 margin: 1.5rem auto 0;
120 display: flex;
121 justify-content: center;
122
123 &-btn {
124 margin: 0 1.25rem;
125 text-decoration: underline;
126 }
127 }
128 }
129
130 .form {
131 display: flex;
132 justify-content: space-between;
133 flex-wrap: wrap;
134
135 .vcode {
136 background-color: transparent !important;
137 padding: 0 !important;
138 overflow: hidden;
139
140 img {
141 width: 100%;
142 height: 100%;
143 }
144 }
145
146 input {
147 font-size: 1.166667rem;
148 letter-spacing: .1rem;
149 }
150
151 &-item {
152 position: relative;
153 margin-bottom: 1.75rem;
154
155 .label {
156 color: $cOrange;
157 display: flex;
158 align-items: center;
159 margin-bottom: 1.25rem;
160
161 img {
162 height: 1rem;
163 margin-right: 1rem;
164 }
165 }
166
167 .ipt-wrap {
168 position: relative;
169 display: flex;
170 justify-content: space-between;
171
172 // input和下拉
173 .ipt {
174 @extend .bb;
175 width: 100%;
176 height: 3.5rem;
177 border: solid 1px #dcdddd;
178 background-color: #ffffff;
179 border-radius: 3.5rem;
180 padding: 0 1.75rem;
181 flex: 1;
182 }
183
184 // 长文本
185 .textarea {
186 min-height: 8.75rem;
187 border-radius: 1rem;
188 }
189
190 .down-arrow {
191 position: absolute;
192 top: 1.6rem;
193 right: 2rem;
194 background-image: url('~@/assets/images/reservation/re-down-arrow.png');
195 width: 1rem;
196 height: .666667rem;
197 pointer-events: none;
198 cursor: default;
199 }
200
201
202 .verify-btn {
203 @extend .fcc;
204 // font-family: Arial;
205 font-size: 18px;
206 width: 8.5rem;
207 border: solid 1px #dcdddd;
208 background-color: #f2f2f2;
209 flex: none;
210 margin-left: 1.5rem;
211 color: #4c4948;
212 }
213
214 // 框内按钮
215 .ipt2 {
216 display: flex;
217 justify-content: space-between;
218 align-items: center;
219
220 .ipt-tel {
221 flex: 1;
222 padding-left: 1.75rem;
223 }
224
225 .ipt-code {
226 flex: 1;
227 padding-right: 1.75rem;
228 }
229
230 .region-tel {}
231
232 .veri-btn {
233 color: #f05a23;
234 text-decoration: underline;
235 }
236
237 .veri-btn-default {
238 color: #aaaaaa;
239 }
240 }
241
242 }
243
244 .validator {
245 color: $cOrange;
246 margin-top: 0.5rem;
247 position: absolute;
248 right: .5rem;
249 display: flex;
250 align-items: center;
251
252 img {
253 display: inline-block;
254 margin-right: 0.4rem;
255 }
256 }
257 }
258 }
259
260 @media (max-width: 950px) {
261 .box {
262 width: 96%;
263 }
264
265 .login {
266 padding: 2rem 1rem 3.5rem;
267 }
268 }
269
270 .disable {
271 background-color: #dcdddd !important;
272 // color: $cFontGray;
273 color: #4c4948;
274 }
1
2 <template>
3 <div class="content">
4 <div class="ebg">
5 <img src="@/assets/images/common/login-bg.png">
6 </div>
7 <div class="top-space"></div>
8 <div class="box">
9 <div class="login">
10 <div class="login-tit">{{$t('register.title2')}}</div>
11 <div class="login-tit-space-1"></div>
12
13 <div class="gird-g form">
14 <div class="pure-u-1 form-item">
15 <div class="label">
16 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
17 </div>
18 <div class="ipt-wrap">
19 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" type="password" v-model="values.password">
20 </div>
21 <div class="validator">
22 <img src="@/assets/images/common/icon-notice.png" alt=""> 验证提示
23 </div>
24 </div>
25
26 <div class="pure-u-1 form-item">
27 <div class="label">
28 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
29 </div>
30 <div class="ipt-wrap">
31 <div class="down-arrow"></div>
32 <select class="ipt">
33 <template v-if="locale =='zh'">
34 <option>身份证</option>
35 </template>
36 <template v-else>
37 <option>身份證</option>
38 </template>
39 </select>
40 </div>
41 <div class="validator">
42 <img src="@/assets/images/common/icon-notice.png" alt=""> 验证提示
43 </div>
44 </div>
45
46 <div class="pure-u-1 form-item">
47 <div class="label">
48 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
49 </div>
50 <div class="ipt-wrap">
51 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" type="password" v-model="values.password">
52 </div>
53 <div class="validator">
54 <img src="@/assets/images/common/icon-notice.png" alt=""> 验证提示
55 </div>
56 </div>
57 <div class="pure-u-1 form-item">
58 <div class="label">
59 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
60 </div>
61 <div class="ipt-wrap">
62 <div class="down-arrow"></div>
63 <select class="ipt">
64 <template v-if="locale =='zh'">
65 <option>身份证</option>
66 </template>
67 <template v-else>
68 <option>身份證</option>
69 </template>
70 </select>
71 </div>
72 <div class="validator">
73 <img src="@/assets/images/common/icon-notice.png" alt=""> 验证提示
74 </div>
75 </div>
76 </div>
77 <div class="login-btn-wrap">
78 <div @click="onRegisterHandler()" class="login-submit pointer">{{$t('register.sure')}}</div>
79 <div @click="onRegisterHandler()" class="login-submit pointer">{{$t('register.sure')}}</div>
80 </div>
81 </div>
82
83 </div>
84 </div>
85 </template>
86
87 <script src="./infomation-improve.js"></script>
88 <style lang="scss" scoped>
89 @import "./infomation-improve.scss";
90 </style>
1 import api from '@/api/api'
2 import {
3 httpGet,
4 httpPost
5 } from '@/api/fetch-api.js'
6
7 export default {
8 data() {
9 return {
10 key: 'value',
11 type: 4, // 1:输入用户信息 2:找回密码 3:核对信息 4.重置密码
12 values: {
13 // 返回的token，串连整个流程，后台安全校验使用
14 vcodeuuid: "",
15 token: "",
16 deviceId: "",
17 imageBase64: "",
18 password: "",
19 passwordRepeat: ""
20 },
21 }
22 },
23 components: {},
24 computed: {
25 locale() {
26 return this.$i18n.locale || 'tc';
27 },
28 i18n() {
29 return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
30 }
31 },
32 methods: {
33 initData() {}
34 },
35 mounted() {},
36 created() {}
37 }
1 @import '@/styles/_support';
2
3 .content {
4 position: relative;
5 padding-bottom: 2.25rem;
6 }
7
8 .top-space {
9 height: 2.25rem;
10 }
11
12 .box {
13 position: relative;
14 }
15
16 .ebg {
17 position: absolute;
18 bottom: 0;
19 left: 0;
20 right: 0;
21
22 img {
23 max-width: 100%;
24 }
25 }
26
27 .step {
28 @extend .fcc;
29 margin-bottom: 3rem;
30 }
31
32 .login {
33 color: #4c4948;
34 @extend .bb;
35 padding: 1.416667rem 5rem 0;
36 border-bottom: solid .666667rem #006441;
37
38 margin: auto;
39 max-width: 40.25rem;
40 height: 31rem;
41
42 border-radius: .75rem;
43 box-shadow: 0 0 1.5rem 0 rgba(255, 87, 0, 0.15);
44 background-color: #ffffff;
45
46 &-tit {
47 color: #f05a23;
48 text-align: center;
49 font-size: 18px;
50 font-weight: bold;
51 letter-spacing: .2rem;
52 text-shadow: 3px 5.2px 9px rgba(236, 100, 41, 0.27);
53 }
54
55 &-tit-space-1 {
56 height: 5.25rem;
57 }
58
59 &-tit-space-4 {
60 height: 3rem;
61 }
62
63 &-nav {
64 margin: 2.25rem 0 auto;
65 display: flex;
66 justify-content: center;
67 align-items: center;
68
69 &-v-line {
70 width: .2rem;
71 height: 1.25rem;
72 background-color: #4c4948;
73 margin: 0 2.25rem;
74 }
75
76 &-tit {
77 flex: 1;
78 font-size: 18px;
79 font-weight: bold;
80 color: #4c4948;
81 }
82
83 .active {
84 color: #f05a23;
85 text-shadow: 3px 5.2px 9px rgba(236, 100, 41, 0.27);
86 }
87 }
88
89 &-protocol {
90 margin: 2.5rem auto 0;
91 display: flex;
92 align-items: center;
93 padding-left: 1rem;
94
95 .check {
96 height: 1rem;
97 margin-right: .6rem;
98 }
99
100 .protocol {
101 color: #f05a23;
102 }
103 }
104
105 &-submit {
106 @include btc2(13.5rem, 4rem, 16px);
107 margin: 4.166667rem auto 0;
108 letter-spacing: 1.6px;
109 position: absolute;
110 left: 0;
111 right: 0;
112 margin: 0 auto;
113 bottom: 2.25rem;
114 }
115
116 &-func {
117 margin: 1.5rem auto 0;
118 display: flex;
119 justify-content: center;
120
121 &-btn {
122 margin: 0 1.25rem;
123 text-decoration: underline;
124 }
125 }
126 }
127
128 .form {
129 display: flex;
130 justify-content: space-between;
131 flex-wrap: wrap;
132
133 .vcode {
134 background-color: transparent !important;
135 padding: 0 !important;
136 overflow: hidden;
137
138 img {
139 width: 100%;
140 height: 100%;
141 }
142 }
143
144 input {
145 font-size: 1.166667rem;
146 letter-spacing: .1rem;
147 }
148
149 &-item {
150 position: relative;
151 margin-bottom: 2.25rem;
152
153 .label {
154 font-size: 18px;
155 font-weight: bold;
156 color: #f05a23;
157 display: flex;
158 align-items: center;
159 margin-bottom: 1.25rem;
160
161 img {
162 height: 1.5rem;
163 margin-right: .8rem;
164 }
165 }
166
167 .ipt-wrap {
168 position: relative;
169 display: flex;
170 justify-content: space-between;
171
172 // input和下拉
173 .ipt {
174 @extend .bb;
175 width: 100%;
176 height: 3.5rem;
177 border: solid 1px #dcdddd;
178 background-color: #ffffff;
179 border-radius: 3.5rem;
180 padding: 0 1.75rem;
181 flex: 1;
182 }
183
184 // 长文本
185 .textarea {
186 min-height: 8.75rem;
187 border-radius: 1rem;
188 }
189
190 .down-arrow {
191 position: absolute;
192 top: 1.6rem;
193 right: 2rem;
194 }
195
196
197 .verify-btn {
198 @extend .fcc;
199 // font-family: Arial;
200 font-size: 18px;
201 width: 8.5rem;
202 border: solid 1px #dcdddd;
203 background-color: #f2f2f2;
204 flex: none;
205 margin-left: 1.5rem;
206 color: #4c4948;
207 }
208
209 // 框内按钮
210 .ipt2 {
211 display: flex;
212 justify-content: space-between;
213 align-items: center;
214
215 .ipt-tel {
216 flex: 1;
217 padding-left: 1.75rem;
218 }
219
220 .ipt-code {
221 flex: 1;
222 padding-right: 1.75rem;
223 }
224
225 .region-tel {}
226
227 .veri-btn {
228 color: #f05a23;
229 text-decoration: underline;
230 }
231
232 .veri-btn-default {
233 color: #aaaaaa;
234 }
235 }
236
237 }
238
239 .validator {
240 color: $cOrange;
241 margin-top: 0.5rem;
242 position: absolute;
243 right: .5rem;
244 display: flex;
245 align-items: center;
246
247 img {
248 display: inline-block;
249 margin-right: 0.4rem;
250 }
251 }
252 }
253 }
254
255 @media (max-width: 950px) {
256 .box {
257 width: 96%;
258 }
259
260 .login {
261 padding: 2rem 1rem 3.5rem;
262 }
263 }
264
265 .disable {
266 background-color: #dcdddd !important;
267 // color: $cFontGray;
268 color: #4c4948;
269 }
1
2 <template>
3 <div class="content">
4 <div class="ebg">
5 <img src="@/assets/images/password-reset/password-reset-bg.png">
6 </div>
7 <div class="top-space"></div>
8 <div class="box">
9
10 <!-- 输入用户信息 -->
11 <div v-if="type == 1" class="login">
12 <div class="login-tit">{{$t('register.title2')}}</div>
13 <div class="login-tit-space-1"></div>
14 <div class="gird-g form">
15 <div class="pure-u-1 form-item">
16 <div class="label">
17 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
18 </div>
19 <div class="ipt-wrap">
20 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" type="password" v-model="values.password">
21 </div>
22 <div class="validator">
23 <img src="@/assets/images/common/icon-notice.png" alt=""> 验证提示
24 </div>
25 </div>
26 </div>
27 <div @click="onRegisterHandler()" class="login-submit pointer">{{$t('register.sure')}}</div>
28 </div>
29
30 <!-- 找回密码 -->
31 <div v-if="type == 2" class="login">
32 <div class="login-tit">{{$t('register.title2')}}</div>
33 <div class="login-tit-space-1"></div>
34 <div class="gird-g form">
35 <div class="pure-u-1 form-item">
36 <div class="label">
37 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
38 </div>
39 <div class="ipt-wrap">
40 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" type="password" v-model="values.password">
41 </div>
42 <div class="validator">
43 <img src="@/assets/images/common/icon-notice.png" alt=""> 验证提示
44 </div>
45 </div>
46 </div>
47 <div @click="onRegisterHandler()" class="login-submit pointer">{{$t('register.sure')}}</div>
48 </div>
49
50 <!-- 核对信息 -->
51 <div v-if="type == 3" class="login">
52 <div class="login-tit">{{$t('register.title2')}}</div>
53 <div class="login-tit-space-1"></div>
54 <div class="gird-g form">
55 <div class="pure-u-1 form-item">
56 <div class="label">
57 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
58 </div>
59 <div class="ipt-wrap">
60 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt disable" type="password" v-model="values.password">
61 </div>
62 </div>
63 </div>
64 <div @click="onRegisterHandler()" class="login-submit pointer">{{$t('register.sure')}}</div>
65 </div>
66
67 <!-- 重置密码 -->
68 <div v-if="type == 4" class="login">
69 <div class="login-tit">{{$t('register.title2')}}</div>
70 <div class="login-tit-space-4"></div>
71 <div class="gird-g form">
72 <div class="pure-u-1 form-item">
73 <div class="label">
74 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
75 </div>
76 <div class="ipt-wrap">
77 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" type="password" v-model="values.password">
78 </div>
79 <div class="validator">
80 <img src="@/assets/images/common/icon-notice.png" alt=""> 验证提示
81 </div>
82 </div>
83 <div class="pure-u-1 form-item">
84 <div class="label">
85 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}}
86 </div>
87 <div class="ipt-wrap">
88 <input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" type="password" v-model="values.passwordRepeat">
89 </div>
90 <div class="validator">
91 <img src="@/assets/images/common/icon-notice.png" alt=""> 验证提示
92 </div>
93 </div>
94 </div>
95 <div @click="onRegisterHandler()" class="login-submit pointer">{{$t('register.sure')}}</div>
96 </div>
97 </div>
98 </div>
99 </template>
100
101 <script src="./password-reset.js"></script>
102 <style lang="scss" scoped>
103 @import "./password-reset.scss";
104 </style>
...@@ -11,7 +11,7 @@ export default { ...@@ -11,7 +11,7 @@ export default {
11 data() { 11 data() {
12 return { 12 return {
13 key: 'value', 13 key: 'value',
14 type: 1, // 1:手机验证 2:输入密码 14 type: 2, // 1:手机验证 2:输入密码
15 mobileNoType: "hk",// 选择的手机好类型 15 mobileNoType: "hk",// 选择的手机好类型
16 mobileTip: {}, 16 mobileTip: {},
17 mobileOptions: [], 17 mobileOptions: [],
......
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
10 <img v-if="type == 2" src="@/assets/images/register/register-step-2.png"> 10 <img v-if="type == 2" src="@/assets/images/register/register-step-2.png">
11 </div> 11 </div>
12 <div class="box"> 12 <div class="box">
13 <!-- 手机验证 -->
13 <div v-if="type == 1" class="login"> 14 <div v-if="type == 1" class="login">
14 <div class="login-tit">{{$t('register.title')}}</div> 15 <div class="login-tit">{{$t('register.title')}}</div>
15 <div class="gird-g form"> 16 <div class="gird-g form">
...@@ -42,21 +43,21 @@ ...@@ -42,21 +43,21 @@
42 <div class="ipt-wrap"> 43 <div class="ipt-wrap">
43 <div class="ipt ipt2"> 44 <div class="ipt ipt2">
44 <input :placeholder="$t('register.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="registerForm.opt"> 45 <input :placeholder="$t('register.verifyCodePlaceholder')" class="ipt-code" type="text" v-model="registerForm.opt">
45 <div v-if="times.remain == 0" class="veri-btn pointer" @click="handlerStdSendOTP" >{{$t('register.verifyCodeGet')}}</div> 46 <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> 47 <div v-else class="veri-btn-default">{{times.tip}}</div>
47 </div> 48 </div>
48 </div> 49 </div>
49 </div> 50 </div>
50 </div> 51 </div>
51 52
52 <div class="login-protocol pointer" @click="registerCheck.agreeProtocol = !registerCheck.agreeProtocol" > 53 <div class="login-protocol pointer" @click="registerCheck.agreeProtocol = !registerCheck.agreeProtocol">
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/un-check.png">
54 <img v-if="registerCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> 55 <img v-if="registerCheck.agreeProtocol" class="check" src="@/assets/images/login/check.png"> {{$t('login.agree')}}
55 {{$t('login.agree')}}
56 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span> 56 <span @click="onProtocolHandler()" class="protocol pointer">{{$t('login.protocol')}}</span>
57 </div> 57 </div>
58 <div @click="onSubmitHandler()" class="login-submit pointer">{{$t('register.register')}}</div> 58 <div @click="onSubmitHandler()" class="login-submit pointer">{{$t('register.register')}}</div>
59 </div> 59 </div>
60 <!-- 输入密码 -->
60 <div v-if="type == 2" class="login"> 61 <div v-if="type == 2" class="login">
61 <div class="login-tit">{{$t('register.title2')}}</div> 62 <div class="login-tit">{{$t('register.title2')}}</div>
62 <div class="gird-g form"> 63 <div class="gird-g form">
...@@ -65,7 +66,7 @@ ...@@ -65,7 +66,7 @@
65 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}} 66 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPassword')}}
66 </div> 67 </div>
67 <div class="ipt-wrap"> 68 <div class="ipt-wrap">
68 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" type="password" v-model="values.password"> 69 <input :placeholder="$t('register.newPasswordPlaceholder')" class="ipt" type="password" v-model="values.password">
69 </div> 70 </div>
70 </div> 71 </div>
71 <div class="pure-u-1 form-item"> 72 <div class="pure-u-1 form-item">
...@@ -73,12 +74,13 @@ ...@@ -73,12 +74,13 @@
73 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}} 74 <img src="@/assets/images/register/icon-register-lock.png"> {{$t('register.newPasswordSure')}}
74 </div> 75 </div>
75 <div class="ipt-wrap"> 76 <div class="ipt-wrap">
76 <input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" type="password" v-model="values.passwordRepeat"> 77 <input :placeholder="$t('register.newPasswordSurePlaceholder')" class="ipt" type="password" v-model="values.passwordRepeat">
77 </div> 78 </div>
78 </div> 79 </div>
79 </div> 80 </div>
80 <div @click="onRegisterHandler()" class="login-submit pointer">{{$t('register.sure')}}</div> 81 <div @click="onRegisterHandler()" class="login-submit pointer">{{$t('register.sure')}}</div>
81 </div> 82 </div>
83 <!-- 输入密码 -->
82 </div> 84 </div>
83 </div> 85 </div>
84 </template> 86 </template>
......
...@@ -39,6 +39,22 @@ const routes = [ ...@@ -39,6 +39,22 @@ const routes = [
39 } 39 }
40 }, 40 },
41 { 41 {
42 path: '/password/reset',
43 name: 'passwordReset',
44 component: () => import('./pages/password-reset/password-reset.vue'),
45 meta: {
46 title: ''
47 }
48 },
49 {
50 path: '/infomation/improve',
51 name: 'infomationImprove',
52 component: () => import('./pages/infomation-improve/infomation-improve.vue'),
53 meta: {
54 title: ''
55 }
56 },
57 {
42 path: '/profile', 58 path: '/profile',
43 name: 'profile', 59 name: 'profile',
44 component: () => import('./pages/profile/profile.vue'), 60 component: () => import('./pages/profile/profile.vue'),
......