9f9a9aef by joe

Merge branch 'master' of http://120.27.44.69/dev/pingan-life-index-pro

# Conflicts:
#	src/components/clarms/clarms-plugins-modal1.vue
2 parents eecd8829 0179c704
...@@ -837,6 +837,7 @@ module.exports = { ...@@ -837,6 +837,7 @@ module.exports = {
837 tip4: "contact customer service hotline" 837 tip4: "contact customer service hotline"
838 }, 838 },
839 clarms: { 839 clarms: {
840 title:"File a claim",
840 step1: { 841 step1: {
841 register: "Register", 842 register: "Register",
842 login: "Login", 843 login: "Login",
......
...@@ -832,6 +832,7 @@ module.exports = { ...@@ -832,6 +832,7 @@ module.exports = {
832 tip4: "我想聯絡客服" 832 tip4: "我想聯絡客服"
833 }, 833 },
834 clarms: { 834 clarms: {
835 title:"索償申請",
835 step1: { 836 step1: {
836 register: "註冊", 837 register: "註冊",
837 login: "登入", 838 login: "登入",
......
...@@ -834,6 +834,7 @@ module.exports = { ...@@ -834,6 +834,7 @@ module.exports = {
834 tip4: "我想联络客服" 834 tip4: "我想联络客服"
835 }, 835 },
836 clarms: { 836 clarms: {
837 title:"索偿申请",
837 step1: { 838 step1: {
838 register: "注册", 839 register: "注册",
839 login: "登入", 840 login: "登入",
......
...@@ -17,6 +17,9 @@ export default { ...@@ -17,6 +17,9 @@ export default {
17 }, 17 },
18 components: {}, 18 components: {},
19 computed: { 19 computed: {
20 locale() {
21 return this.$i18n.locale || 'tc';
22 },
20 }, 23 },
21 methods: { 24 methods: {
22 initData() { 25 initData() {
......
...@@ -55,18 +55,24 @@ ...@@ -55,18 +55,24 @@
55 55
56 .message { 56 .message {
57 margin-left: 48px; 57 margin-left: 48px;
58 // font-size: 1.333333rem;
59 font-weight: bold; 58 font-weight: bold;
60 color: $cOrange2; 59 color: $cOrange2;
61 letter-spacing: 1.4px; 60 display: inline-block;
62 text-align: left; 61 height: 100%;
63 line-height: 1.5; 62 min-width: 100px;
63 text-align: justify;
64 text-align-last: left;
64 65
65 span { 66 span {
66 cursor: pointer; 67 cursor: pointer;
67 text-decoration: underline; 68 text-decoration: underline;
68 } 69 }
69 } 70 }
71
72 .lsp {
73 line-height: 1.4;
74 letter-spacing: 0.7px;
75 }
70 } 76 }
71 77
72 .close { 78 .close {
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <div class="content"> 8 <div class="content">
9 <div class="info-icon"> 9 <div class="info-icon">
10 <img src="@/assets/images/clarms/info.png"> 10 <img src="@/assets/images/clarms/info.png">
11 </div> 11 </div>
12 <div class="message"> 12 <div class="message" :class="{'lsp':locale != 'en'}">
13 <template v-if="type == 1"> 13 <template v-if="type == 1">
14 {{$t('clarms.step2.tip5')}} 14 {{$t('clarms.step2.tip5')}}
15 </template> 15 </template>
......
...@@ -5,7 +5,11 @@ export default { ...@@ -5,7 +5,11 @@ export default {
5 } 5 }
6 }, 6 },
7 components: {}, 7 components: {},
8 computed: {}, 8 computed: {
9 locale() {
10 return this.$i18n.locale || 'tc';
11 },
12 },
9 methods: { 13 methods: {
10 initData() { 14 initData() {
11 15
......
...@@ -55,12 +55,13 @@ ...@@ -55,12 +55,13 @@
55 55
56 .message { 56 .message {
57 margin-left: 48px; 57 margin-left: 48px;
58 // font-size: 1.333333rem;
59 font-weight: bold; 58 font-weight: bold;
60 color: $cOrange2; 59 color: $cOrange2;
61 letter-spacing: 1.4px; 60 display: inline-block;
62 text-align: left; 61 height: 100%;
63 line-height: 1.5; 62 min-width: 100px;
63 text-align: justify;
64 text-align-last: left;
64 65
65 span { 66 span {
66 cursor: pointer; 67 cursor: pointer;
...@@ -69,6 +70,11 @@ ...@@ -69,6 +70,11 @@
69 } 70 }
70 } 71 }
71 72
73 .lsp {
74 line-height: 1.4;
75 letter-spacing: 0.7px;
76 }
77
72 .close { 78 .close {
73 cursor: pointer; 79 cursor: pointer;
74 80
......
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
9 <div class="info-icon"> 9 <div class="info-icon">
10 <img src="@/assets/images/clarms/suc.png"> 10 <img src="@/assets/images/clarms/suc.png">
11 </div> 11 </div>
12 <div class="message"> 12 <div class="message" :class="{'lsp':locale != 'en'}">
13 {{$t('clarms.step2.tip7')}} 13 {{$t('clarms.step2.tip7')}}
14 <span @click="toAccountInformation">{{$t('clarms.step2.tip8')}}</span> 14 <span @click="toAccountInformation">{{$t('clarms.step2.tip8')}}</span>
15 </div> 15 </div>
......
...@@ -13,19 +13,21 @@ $borderSize: 8px; ...@@ -13,19 +13,21 @@ $borderSize: 8px;
13 background-image: linear-gradient(to right, #ffb31d, #f15907); 13 background-image: linear-gradient(to right, #ffb31d, #f15907);
14 14
15 .clarms-box { 15 .clarms-box {
16 @extend .bb;
16 position: relative; 17 position: relative;
17 width: 100%; 18 width: 100%;
18 height: 100%; 19 height: 100%;
19 border-radius: .416667rem; 20 border-radius: .416667rem;
20 background: #fff; 21 background: #fff;
21 padding: 40px 50px 20px 40px; 22 // padding: 40px 50px 20px 40px;
23 padding: 40px 0 20px;
22 24
23 .clarms-tips { 25 .clarms-tips {
24 top: 20px; 26 top: 40px;
25 left: 80px; 27 left: 98px;
26 position: absolute; 28 position: absolute;
27 z-index: 11; 29 z-index: 11;
28 border-radius: 2px; 30 border-radius: 4px;
29 padding: 2px; 31 padding: 2px;
30 background-image: linear-gradient(to right, #ffb31d, #f15907); 32 background-image: linear-gradient(to right, #ffb31d, #f15907);
31 max-width: 400px; 33 max-width: 400px;
...@@ -36,29 +38,36 @@ $borderSize: 8px; ...@@ -36,29 +38,36 @@ $borderSize: 8px;
36 width: 100%; 38 width: 100%;
37 height: 100%; 39 height: 100%;
38 background-color: #ffffff; 40 background-color: #ffffff;
39 border-radius: 2px;
40 font-size: 18px; 41 font-size: 18px;
42 border-radius: 4px;
41 } 43 }
42 } 44 }
43 45
44 .clarms-header { 46 .clarms-header {
45 display: flex; 47 display: flex;
46 align-items: center; 48 align-items: center;
47 padding-bottom: 1.666667rem; 49 padding-bottom: 20px;
50 padding-right: 40px;
48 51
49 .clarms-header-2 { 52 .clarms-header-2 {
50 position: relative; 53 position: relative;
51 flex-grow: 1; 54 flex-grow: 1;
52 display: flex; 55 display: flex;
53 align-items: center; 56 align-items: center;
54 }
55 57
56 .clarms-icon { 58
59 .clarms-icon {
60 @extend .fcc;
61 width: 182px;
62 height: 100%;
63 }
57 } 64 }
65
66
58 } 67 }
59 68
60 .clarms-title-container { 69 .clarms-title-container {
61 margin-left: 2.5rem; 70 // margin-left: 2.5rem;
62 flex-grow: 1; 71 flex-grow: 1;
63 width: 100%; 72 width: 100%;
64 73
...@@ -80,12 +89,11 @@ $borderSize: 8px; ...@@ -80,12 +89,11 @@ $borderSize: 8px;
80 } 89 }
81 } 90 }
82 91
83 hr { 92
84 margin: 0 .833333rem 1.666667rem .833333rem; 93
85 border-top: 1px solid #dddede;
86 }
87 94
88 .clarms-btn { 95 .clarms-btn {
96
89 background: url(~@/assets/images/clarms/button.png); 97 background: url(~@/assets/images/clarms/button.png);
90 background-size: 100% 100%; 98 background-size: 100% 100%;
91 width: 150px; 99 width: 150px;
...@@ -98,7 +106,20 @@ $borderSize: 8px; ...@@ -98,7 +106,20 @@ $borderSize: 8px;
98 cursor: pointer; 106 cursor: pointer;
99 } 107 }
100 108
109 .line {
110 @extend .bb;
111 padding: 0 24px;
112 }
113
114 hr {
115 border-top: 1px solid #dddede;
116 width: 100%;
117 margin-bottom: 20px;
118 }
119
101 .clarms-img-group { 120 .clarms-img-group {
121 @extend .bb;
122 padding: 0 28px;
102 display: flex; 123 display: flex;
103 flex-wrap: wrap; 124 flex-wrap: wrap;
104 125
......
...@@ -7,8 +7,8 @@ ...@@ -7,8 +7,8 @@
7 </div> 7 </div>
8 <div class="clarms-header"> 8 <div class="clarms-header">
9 <div class="clarms-header-2"> 9 <div class="clarms-header-2">
10 <div @mouseover="onShowTipsOverHandler($event)" @mouseout="onShowTipsOutHandler($event)"> 10 <div class="clarms-icon" @mouseover="onShowTipsOverHandler($event)" @mouseout="onShowTipsOutHandler($event)">
11 <img class="clarms-icon" :src='icon'> 11 <img :src='icon'>
12 </div> 12 </div>
13 <div class="clarms-title-container"> 13 <div class="clarms-title-container">
14 <div class="clarms-t1" :class="{clarmsActivty:images && images.length > 0}">{{options.name}}</div> 14 <div class="clarms-t1" :class="{clarmsActivty:images && images.length > 0}">{{options.name}}</div>
...@@ -20,7 +20,9 @@ ...@@ -20,7 +20,9 @@
20 </div> 20 </div>
21 </div> 21 </div>
22 <div v-if="images && images.length > 0"> 22 <div v-if="images && images.length > 0">
23 <hr> 23 <div class="line">
24 <hr>
25 </div>
24 <div class="clarms-img-group"> 26 <div class="clarms-img-group">
25 <div class="clarms-img-item-plugin" @mouseover="onOverHandler($event,item,index)" v-for="(item,index) in images" :key="index"> 27 <div class="clarms-img-item-plugin" @mouseover="onOverHandler($event,item,index)" v-for="(item,index) in images" :key="index">
26 <div class="clarms-img-item"> 28 <div class="clarms-img-item">
...@@ -39,7 +41,7 @@ ...@@ -39,7 +41,7 @@
39 </div> 41 </div>
40 </div> 42 </div>
41 </div> 43 </div>
42 <div class="clarms-empty-line"></div> 44 <!-- <div class="clarms-empty-line"></div> -->
43 </div> 45 </div>
44 </div> 46 </div>
45 </div> 47 </div>
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
3 <div class="navigate"> 3 <div class="navigate">
4 <div class="bg"></div> 4 <div class="bg"></div>
5 <div class="cont"> 5 <div class="cont">
6 <span class="tt">{{$t('customService.menu5')}}</span> 6 <span class="tt">{{$t('clarms.title')}}</span>
7 </div> 7 </div>
8 </div> 8 </div>
9 <div class="content" v-if="step == 3"> 9 <div class="content" v-if="step == 3">
......
...@@ -152,20 +152,37 @@ export default { ...@@ -152,20 +152,37 @@ export default {
152 }, 152 },
153 initProduct() { 153 initProduct() {
154 let productList = [{ 154 let productList = [{
155 title: "保證續保至100歲" 155 showMore: false,
156 title: "保證續保至100歲",
157 desc: "平安人壽(香港)「好e時」自願醫保標準計劃 接受任何介乎14天至80歲人士投保,您可以一直續保至100歲。計劃保證不會因您的索償記錄或身體狀況變而調高續保保費,而您的續保保費將根據當時保單週年日之保費表釐定。"
156 }, { 158 }, {
159 showMore: false,
157 title: "不設終身保障限額" 160 title: "不設終身保障限額"
158 }, { 161 }, {
162 showMore: false,
159 title: "一家投保 盡享稅務扣減" 163 title: "一家投保 盡享稅務扣減"
160 }, { 164 }, {
165 showMore: false,
161 title: "承保投保前未知的已有疾病" 166 title: "承保投保前未知的已有疾病"
162 }, { 167 }, {
168 showMore: false,
163 title: "出院免找數 讓您安心無憂" 169 title: "出院免找數 讓您安心無憂"
164 }, { 170 }, {
171 showMore: false,
165 title: "無索償折扣" 172 title: "無索償折扣"
166 }]; 173 }];
167 this.productList = productList; 174 this.productList = productList;
168 }, 175 },
176 onShowMoreHandler(idx) {
177 console.log("idx:", idx);
178 let productList = this.productList;
179 let curProduct = productList[idx];
180 if (curProduct) {
181 curProduct.showMore = !curProduct.showMore;
182 }
183 this.productList = productList;
184 console.log("this.productList:",this.productList);
185 },
169 initData() { 186 initData() {
170 this.initProduct(); 187 this.initProduct();
171 let targetData = null; 188 let targetData = null;
...@@ -210,8 +227,7 @@ export default { ...@@ -210,8 +227,7 @@ export default {
210 try { 227 try {
211 this.sourceData = JSON.parse(d); 228 this.sourceData = JSON.parse(d);
212 this.initData(); 229 this.initData();
213 } catch (e) { 230 } catch (e) {}
214 }
215 } 231 }
216 } 232 }
217 }, 233 },
...@@ -219,7 +235,12 @@ export default { ...@@ -219,7 +235,12 @@ export default {
219 this.initActivity(); 235 this.initActivity();
220 }, 236 },
221 created() { 237 created() {
222 httpGet({ url: api.productInfo, data: { code: "voluntary" } }).then(res => { 238 httpGet({
239 url: api.productInfo,
240 data: {
241 code: "voluntary"
242 }
243 }).then(res => {
223 if (res) { 244 if (res) {
224 localStorage.setItem("voluntaryInfo", JSON.stringify(res)); 245 localStorage.setItem("voluntaryInfo", JSON.stringify(res));
225 this.sourceData = res; 246 this.sourceData = res;
......
...@@ -104,7 +104,9 @@ ...@@ -104,7 +104,9 @@
104 right: 50px; 104 right: 50px;
105 top: 50px; 105 top: 50px;
106 padding: 2px; 106 padding: 2px;
107 border-radius: $borderSize; 107 // border-radius: $borderSize;
108 background-image: url('~@assets/images/vhis/vhis-tips-bg.png');
109 @extend .bis;
108 110
109 .close { 111 .close {
110 cursor: pointer; 112 cursor: pointer;
...@@ -119,7 +121,6 @@ ...@@ -119,7 +121,6 @@
119 position: relative; 121 position: relative;
120 width: 100%; 122 width: 100%;
121 height: 100%; 123 height: 100%;
122 background-color: rgba($color: #ffffff, $alpha: 0.8);
123 border-radius: $borderSize; 124 border-radius: $borderSize;
124 125
125 .tit { 126 .tit {
...@@ -221,7 +222,7 @@ ...@@ -221,7 +222,7 @@
221 @extend .fcc; 222 @extend .fcc;
222 padding: 2px; 223 padding: 2px;
223 width: 582px; 224 width: 582px;
224 height: 262px; 225 height: 280px;
225 margin-bottom: 25px; 226 margin-bottom: 25px;
226 227
227 .cont { 228 .cont {
...@@ -237,8 +238,8 @@ ...@@ -237,8 +238,8 @@
237 } 238 }
238 239
239 .detail { 240 .detail {
240 padding: 52px 40px 0 0; 241 padding: 52px 32px 0 0;
241 // flex: 1; 242 flex: 1;
242 flex-grow: 1; 243 flex-grow: 1;
243 244
244 .t1 { 245 .t1 {
...@@ -247,7 +248,7 @@ ...@@ -247,7 +248,7 @@
247 font-weight: bold; 248 font-weight: bold;
248 } 249 }
249 250
250 .desc { 251 .more {
251 display: flex; 252 display: flex;
252 // margin: 12px auto 0; 253 // margin: 12px auto 0;
253 254
...@@ -261,6 +262,13 @@ ...@@ -261,6 +262,13 @@
261 font-size: 18px; 262 font-size: 18px;
262 } 263 }
263 } 264 }
265
266 .desc {
267 margin-top: 6px;
268 font-size: 18px;
269 font-weight: 300;
270 // letter-spacing: -0.45px;
271 }
264 } 272 }
265 } 273 }
266 } 274 }
......
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
35 <!-- <div class="swiper-button-prev" slot="button-prev"></div> 35 <!-- <div class="swiper-button-prev" slot="button-prev"></div>
36 <div class="swiper-button-next" slot="button-next"></div> --> 36 <div class="swiper-button-next" slot="button-next"></div> -->
37 37
38 <div v-if="bannerTipsVisible" class="border2 banner-tips"> 38 <div v-if="bannerTipsVisible" class="banner-tips">
39 <div class="cont"> 39 <div class="cont">
40 <div class="tit"> 40 <div class="tit">
41 <img class="icon" src="@/assets/images/vhis/hot-deal-icon.png"> 【期間限定保費8折優惠】 41 <img class="icon" src="@/assets/images/vhis/hot-deal-icon.png"> 【期間限定保費8折優惠】
...@@ -67,11 +67,14 @@ ...@@ -67,11 +67,14 @@
67 </div> 67 </div>
68 <div class="detail"> 68 <div class="detail">
69 <div class="t1" v-html="item.title">{{item.title}}</div> 69 <div class="t1" v-html="item.title">{{item.title}}</div>
70 <div class="desc"> 70 <div class="more pointer" @click="onShowMoreHandler(index)">
71 <div class="desc-icon-wrap"> 71 <div class="more-icon-wrap" >
72 <img src="@/assets/images/vhis/vhis-plus.png"> 72 <img src="@/assets/images/vhis/vhis-plus.png">
73 </div> 73 </div>
74 <div class="c1">展開</div> 74 <div class="c1">{{item.showMore ? '收起' : '展開'}}</div>
75 </div>
76 <div v-if="item.showMore" class="desc">
77 {{item.desc}}
75 </div> 78 </div>
76 </div> 79 </div>
77 </div> 80 </div>
......