Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
21f82d49 by simon
Options

版本提交

1 parent 059054a1
Inline Side-by-side
Showing 14 changed files with 718 additions and 64 deletions
...@@ -16,7 +16,7 @@ module.exports = { ...@@ -16,7 +16,7 @@ module.exports = {
16 name: "register", 16 name: "register",
17 path: "/register", 17 path: "/register",
18 value: "" 18 value: ""
19 },{ 19 }, {
20 name: "login", 20 name: "login",
21 path: "/login", 21 path: "/login",
22 value: "" 22 value: ""
...@@ -42,38 +42,38 @@ module.exports = { ...@@ -42,38 +42,38 @@ module.exports = {
42 name: "Customer service", 42 name: "Customer service",
43 path: "/custom/product", 43 path: "/custom/product",
44 list: [{ 44 list: [{
45 name: "Contact us", 45 name: "Contact us",
46 path: "/custom/service?q=m1" 46 path: "/custom/service?q=m1"
47 }, 47 },
48 { 48 {
49 name: "Pay premium", 49 name: "Pay premium",
50 path: "/payment/type" 50 path: "/payment/type"
51 }, 51 },
52 { 52 {
53 name: "Query policy", 53 name: "Query policy",
54 path: "/custom/service?q=m3" 54 path: "/custom/service?q=m3"
55 }, 55 },
56 { 56 {
57 name: "Change policy", 57 name: "Change policy",
58 path: "/custom/service?q=m4" 58 path: "/custom/service?q=m4"
59 }, 59 },
60 { 60 {
61 name: "Claim report", 61 name: "Claim report",
62 path: "/custom/service?q=m5" 62 path: "/custom/service?q=m5"
63 }, 63 },
64 { 64 {
65 name: "Reservation service", 65 name: "Reservation service",
66 path: "/custom/service?q=m6" 66 path: "/custom/service?q=m6"
67 }, 67 },
68 { 68 {
69 name: "Suggestions", 69 name: "Suggestions",
70 path: "/custom/service?q=m7" 70 path: "/custom/service?q=m7"
71 }, 71 },
72 { 72 {
73 name: "Common form", 73 name: "Common form",
74 path: "/custom/service?q=m8" 74 path: "/custom/service?q=m8"
75 }, 75 },
76 ] 76 ]
77 }, 77 },
78 { 78 {
79 name: "News", 79 name: "News",
...@@ -110,7 +110,7 @@ module.exports = { ...@@ -110,7 +110,7 @@ module.exports = {
110 contactInformation: "Contact Information", 110 contactInformation: "Contact Information",
111 service: "Service", 111 service: "Service",
112 qrcode: "Official Accounts", 112 qrcode: "Official Accounts",
113 copyright:"版權所有 © 中國平安保險（集團）股份有限公司未經許可不得復制、轉載或摘編，違者必究!" 113 copyright: "版權所有 © 中國平安保險（集團）股份有限公司未經許可不得復制、轉載或摘編，違者必究!"
114 }, 114 },
115 login: { 115 login: {
116 title: "平安一賬通", 116 title: "平安一賬通",
...@@ -208,6 +208,80 @@ module.exports = { ...@@ -208,6 +208,80 @@ module.exports = {
208 menu7: "Suggestions", 208 menu7: "Suggestions",
209 menu8: "Common form", 209 menu8: "Common form",
210 }, 210 },
211 commonForm: {
212 head1: "表格類型",
213 head2: "表格名稱",
214 head3: "使用說明",
215 head4: "附件",
216 download: "下載文檔",
217 form: [{
218 type: "繳費類",
219 list: [{
220 name: "「電子入賬服務」及銀行戶口<br>直接付款授權申請",
221 desc: "申請設立「 電子入賬服務」 及銀行戶口<br>直接付款授權時須提供",
222 download: "",
223 },
224 {
225 name: "信用卡戶口直接付款授權書",
226 desc: "申請信用卡戶口直接付款授權時須提供",
227 download: "",
228 }
229 ]
230 },
231 {
232 type: "保單變更類",
233 list: [{
234 name: "保險合同解除申請書",
235 desc: "退保、猶豫期退保業務適用",
236 download: "",
237 },
238 {
239 name: "保險合同變更申請書（ 保單貸款還款類）",
240 desc: "保單貸款、還款業務適用",
241 download: "",
242 },
243 {
244 name: "保險合同變更申請書（ 保險合同計劃變更類）",
245 desc: "加保、減保、新增附險、復效等業務適用",
246 download: "",
247 },
248 {
249 name: "保險合同變更申請書（ 客戶信息變更類）",
250 desc: "基本信息變更業務適用",
251 download: "",
252 },
253 {
254 name: "保險合同變更申請書（ 客戶權益變更類）",
255 desc: "交費方式、自墊選擇權變更、補發等業務適用",
256 download: "",
257 },
258 {
259 name: "授權委托書",
260 desc: "委托他人代辦時須提供",
261 download: "",
262 },
263 {
264 name: "稅收聲明",
265 desc: "CRS要求",
266 download: "",
267 },
268 {
269 name: "健康告知",
270 desc: "須二次核保的業務須提供",
271 download: "",
272 }
273 ]
274 },
275 {
276 type: "理賠類",
277 list: [{
278 name: "理賠申請書",
279 desc: "紙質申請的應備文件",
280 download: "",
281 }]
282 },
283 ]
284 },
211 customService: { 285 customService: {
212 name: "Customer service", 286 name: "Customer service",
213 menu1: "Contact us", 287 menu1: "Contact us",
...@@ -246,7 +320,7 @@ module.exports = { ...@@ -246,7 +320,7 @@ module.exports = {
246 t4Title: "Beneficiary information", 320 t4Title: "Beneficiary information",
247 t4NameCn: "Name (Cn)", 321 t4NameCn: "Name (Cn)",
248 t4NameEn: "Name (En)", 322 t4NameEn: "Name (En)",
249 t4Relation : "與受保人關係", 323 t4Relation: "與受保人關係",
250 t4Allocation: "Distribution ratio", 324 t4Allocation: "Distribution ratio",
251 325
252 t5Title: "Payment information", 326 t5Title: "Payment information",
...@@ -263,8 +337,8 @@ module.exports = { ...@@ -263,8 +337,8 @@ module.exports = {
263 t6ClosingDate: "Closing date", 337 t6ClosingDate: "Closing date",
264 t6PaymentAmount: "Payment amount", 338 t6PaymentAmount: "Payment amount",
265 }, 339 },
266 reservation :{ 340 reservation: {
267 submitBtn : '確認' 341 submitBtn: '確認'
268 } 342 }
269 } 343 }
270 } 344 }
......
...@@ -16,7 +16,7 @@ module.exports = { ...@@ -16,7 +16,7 @@ module.exports = {
16 name: "註冊", 16 name: "註冊",
17 path: "/register", 17 path: "/register",
18 value: "" 18 value: ""
19 },{ 19 }, {
20 name: "登入", 20 name: "登入",
21 path: "/login", 21 path: "/login",
22 value: "" 22 value: ""
...@@ -208,6 +208,80 @@ module.exports = { ...@@ -208,6 +208,80 @@ module.exports = {
208 menu7: "投訴受理", 208 menu7: "投訴受理",
209 menu8: "常用表格", 209 menu8: "常用表格",
210 }, 210 },
211 commonForm: {
212 head1: "表格類型",
213 head2: "表格名稱",
214 head3: "使用說明",
215 head4: "附件",
216 download: "下載文檔",
217 form: [{
218 type: "繳費類",
219 list: [{
220 name: "「電子入賬服務」及銀行戶口<br>直接付款授權申請",
221 desc: "申請設立「 電子入賬服務」 及銀行戶口<br>直接付款授權時須提供",
222 download: "",
223 },
224 {
225 name: "信用卡戶口直接付款授權書",
226 desc: "申請信用卡戶口直接付款授權時須提供",
227 download: "",
228 }
229 ]
230 },
231 {
232 type: "保單變更類",
233 list: [{
234 name: "保險合同解除申請書",
235 desc: "退保、猶豫期退保業務適用",
236 download: "",
237 },
238 {
239 name: "保險合同變更申請書（ 保單貸款還款類）",
240 desc: "保單貸款、還款業務適用",
241 download: "",
242 },
243 {
244 name: "保險合同變更申請書（ 保險合同計劃變更類）",
245 desc: "加保、減保、新增附險、復效等業務適用",
246 download: "",
247 },
248 {
249 name: "保險合同變更申請書（ 客戶信息變更類）",
250 desc: "基本信息變更業務適用",
251 download: "",
252 },
253 {
254 name: "保險合同變更申請書（ 客戶權益變更類）",
255 desc: "交費方式、自墊選擇權變更、補發等業務適用",
256 download: "",
257 },
258 {
259 name: "授權委托書",
260 desc: "委托他人代辦時須提供",
261 download: "",
262 },
263 {
264 name: "稅收聲明",
265 desc: "CRS要求",
266 download: "",
267 },
268 {
269 name: "健康告知",
270 desc: "須二次核保的業務須提供",
271 download: "",
272 }
273 ]
274 },
275 {
276 type: "理賠類",
277 list: [{
278 name: "理賠申請書",
279 desc: "紙質申請的應備文件",
280 download: "",
281 }]
282 },
283 ]
284 },
211 customService: { 285 customService: {
212 name: "客戶服務", 286 name: "客戶服務",
213 menu1: "聯繫我們", 287 menu1: "聯繫我們",
...@@ -246,7 +320,7 @@ module.exports = { ...@@ -246,7 +320,7 @@ module.exports = {
246 t4Title: "受益人資料", // t4BeneficiaryInformation 320 t4Title: "受益人資料", // t4BeneficiaryInformation
247 t4NameCn: "姓名（中文）", 321 t4NameCn: "姓名（中文）",
248 t4NameEn: "姓名（英文）", 322 t4NameEn: "姓名（英文）",
249 t4Relation : "與受保人關係", 323 t4Relation: "與受保人關係",
250 t4Allocation: "分配比例", 324 t4Allocation: "分配比例",
251 325
252 t5Title: "繳費資料", 326 t5Title: "繳費資料",
...@@ -263,8 +337,8 @@ module.exports = { ...@@ -263,8 +337,8 @@ module.exports = {
263 t6ClosingDate: "實收日期", 337 t6ClosingDate: "實收日期",
264 t6PaymentAmount: "繳費金額", 338 t6PaymentAmount: "繳費金額",
265 }, 339 },
266 reservation :{ 340 reservation: {
267 submitBtn : '確認' 341 submitBtn: '確認'
268 } 342 }
269 } 343 }
270 } 344 }
......
...@@ -16,7 +16,7 @@ module.exports = { ...@@ -16,7 +16,7 @@ module.exports = {
16 name: "注册", 16 name: "注册",
17 path: "/register", 17 path: "/register",
18 value: "" 18 value: ""
19 },{ 19 }, {
20 name: "登陆", 20 name: "登陆",
21 path: "/login", 21 path: "/login",
22 value: "" 22 value: ""
...@@ -208,6 +208,81 @@ module.exports = { ...@@ -208,6 +208,81 @@ module.exports = {
208 menu7: "投诉受理", 208 menu7: "投诉受理",
209 menu8: "常用表格", 209 menu8: "常用表格",
210 }, 210 },
211 commonForm: {
212 head1: "表格类型",
213 head2: "表格名称",
214 head3: "使用说明",
215 head4: "附件",
216 download: "下载文档",
217 form: [{
218 type: "缴费类",
219 list: [{
220 name: "「电子入账服务」及银行户口<br>直接付款授权申请",
221 desc: "申请设立「电子入账服务」及银行户口<br>直接付款授权时须提供",
222 download: "",
223 },
224 {
225 name: "信用卡户口直接付款授权书",
226 desc: "申请信用卡户口直接付款授权时须提供",
227 download: "",
228 }
229 ]
230 },
231 {
232 type: "保单变更类",
233 list: [{
234 name: "保险合同解除申请书",
235 desc: "退保、犹豫期退保业务适用",
236 download: "",
237 },
238 {
239 name: "保险合同变更申请书（保单贷款还款类）",
240 desc: "保单贷款、还款业务适用",
241 download: "",
242 },
243 {
244 name: "保险合同变更申请书（保险合同计划变更类）",
245 desc: "加保、减保、新增附险、复效等业务适用",
246 download: "",
247 },
248 {
249 name: "保险合同变更申请书（客户信息变更类）",
250 desc: "基本信息变更业务适用",
251 download: "",
252 },
253 {
254 name: "保险合同变更申请书（客户权益变更类）",
255 desc: "交费方式、自垫选择权变更、补发等业务适用",
256 download: "",
257 },
258 {
259 name: "授权委托书",
260 desc: "委托他人代办时须提供",
261 download: "",
262 },
263 {
264 name: "税收声明",
265 desc: "CRS要求",
266 download: "",
267 },
268 {
269 name: "健康告知",
270 desc: "须二次核保的业务须提供",
271 download: "",
272 }
273
274 ]
275 },
276 {
277 type: "理赔类",
278 list: [{
279 name: "理赔申请书",
280 desc: "纸质申请的应备文件",
281 download: "",
282 }]
283 },
284 ]
285 },
211 customService: { 286 customService: {
212 name: "客户服务", 287 name: "客户服务",
213 menu1: "联系我们", 288 menu1: "联系我们",
...@@ -246,7 +321,7 @@ module.exports = { ...@@ -246,7 +321,7 @@ module.exports = {
246 t4Title: "受益人资料", // t4BeneficiaryInformation 321 t4Title: "受益人资料", // t4BeneficiaryInformation
247 t4NameCn: "姓名（中文）", 322 t4NameCn: "姓名（中文）",
248 t4NameEn: "姓名（英文）", 323 t4NameEn: "姓名（英文）",
249 t4Relation : "与受保人关系", 324 t4Relation: "与受保人关系",
250 t4Allocation: "分配比例", 325 t4Allocation: "分配比例",
251 326
252 t5Title: "缴费资料", 327 t5Title: "缴费资料",
...@@ -263,8 +338,8 @@ module.exports = { ...@@ -263,8 +338,8 @@ module.exports = {
263 t6ClosingDate: "实收日期", 338 t6ClosingDate: "实收日期",
264 t6PaymentAmount: "缴费金额", 339 t6PaymentAmount: "缴费金额",
265 }, 340 },
266 reservation :{ 341 reservation: {
267 submitBtn : '确认' 342 submitBtn: '确认'
268 } 343 }
269 } 344 }
270 } 345 }
......
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 }
12 },
13 components: {},
14 computed: {
15 locale() {
16 return this.$i18n.locale || 'tc';
17 },
18 i18n() {
19 return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
20 },
21 },
22 methods: {
23 initData() {}
24 },
25 mounted() {},
26 created() {}
27 }
1 @import '@/styles/_support';
2
3 .common-form-container {}
4
5 .table {
6 $girdHei: 4.333333rem;
7 text-align: center;
8
9 &-header {
10 @include border-top-radius(.666667rem);
11 display: flex;
12 align-items: center;
13 height: 2.5rem;
14 color: #ffffff;
15 font-weight: bold;
16 letter-spacing: .1rem;
17
18 &-item {}
19 }
20
21 &-content {
22 background-color: #f2f2f2;
23 text-align: center;
24 border: solid 1px #f2f2f2;
25 @include border-bottom-radius(.666667rem);
26 $gridHei: 4.333333rem;
27
28 &-item {
29 position: relative;
30 // @extend .fcc;
31 display: flex;
32 align-items: center;
33 width: 100%;
34 height: auto;
35
36 .hl {
37 position: absolute;
38 width: 5.25rem;
39 height: 1px;
40 background-color: #dcdddd;
41 bottom: 0;
42 left: .75rem;
43 }
44
45 .grid {
46 position: relative;
47 height: $gridHei;
48 @extend .fcc;
49 // border-bottom: solid 1px #f2f2f2;
50 background-color: #ffffff;
51
52 .v-line {
53 position: absolute;
54 width: 1px;
55 height: 2.25rem;
56 background-color: #dcdddd;
57 right: 0;
58 top: 0;
59 bottom: 0;
60 margin: auto 0;
61 }
62
63 .icon{
64 margin-right: .916667rem;
65 }
66 }
67
68 .ww {
69 position: relative;
70
71 .h-line {
72 position: absolute;
73 width: 100%;
74 height: 1px;
75 background-color: #dcdddd;
76 bottom: 0;
77 left: 0;
78 }
79 }
80
81 .w1 {}
82
83 .w4 {
84 .h-line {
85 width: 9rem;
86 }
87 color: $cOrange;
88 }
89 }
90 }
91
92 .t1 {
93 background-color: #f2f2f2;
94 }
95
96 .w1 {
97 width: 7rem;
98 }
99
100 .w2 {
101 width: 23rem;
102 }
103
104 .w3 {
105 width: 23.5rem;
106 }
107
108 .w4 {
109 flex: 1;
110 }
111 }
112
113
114 .orange {
115 background-color: $cOrange;
116 }
1
2 <template>
3 <div class="common-form-container">
4 <div class="table">
5 <div class="table-header orange">
6 <div class="table-header-item w1">{{$t('commonForm.head1')}}</div>
7 <div class="table-header-item w2">{{$t('commonForm.head2')}}</div>
8 <div class="table-header-item w3">{{$t('commonForm.head3')}}</div>
9 <div class="table-header-item w4">{{$t('commonForm.head4')}}</div>
10 </div>
11 <div class="table-content">
12 <div v-for="(item,index) in i18n.commonForm.form" :key="index" class="table-content-item">
13 <div v-if="index < i18n.commonForm.form.length-1" class="hl"></div>
14 <div class="ww w1">
15 {{item.type}}
16 </div>
17 <div class="ww w2">
18 <div v-for="(item2,index2) in item.list" :key="index2" class="grid">
19 <div class="v-line"></div>
20 <div v-if="index < i18n.commonForm.form.length-1 || index2 < item.list.length-1" class="h-line"></div>
21 <span v-html="item2.name"> {{item2.name}}</span>
22 </div>
23 </div>
24 <div class="ww w3">
25 <div v-for="(item2,index2) in item.list" :key="index2" class="grid">
26 <div class="v-line"></div>
27 <div v-if="index < i18n.commonForm.form.length-1 || index2 < item.list.length-1" class="h-line"></div>
28 <span v-html="item2.desc"> {{item2.desc}}</span>
29 </div>
30 </div>
31 <div class="ww w4">
32 <div v-for="(item2,index2) in item.list" :key="index2" class="grid pointer">
33 <div v-if="index < i18n.commonForm.form.length-1 || index2 < item.list.length-1" class="h-line"></div>
34 <img class="icon" src="@/assets/images/common-form/icon-cf-download.png" alt=""> {{$t('commonForm.download')}}
35 </div>
36 </div>
37 </div>
38
39 <!-- 繳費類 -->
40 <!-- <div class="table-content-item">
41 <div class="hl"></div>
42 <div class="ww w1">
43 繳費類
44 </div>
45 <div class="ww w2">
46 <div class="grid">
47 <div class="v-line"></div>
48 <div class="h-line"></div>
49 「電子入賬服務」及銀行戶口
50 <br> 直接付款授權申請
51 </div>
52 <div class="grid">
53 <div class="v-line"></div>
54 <div class="h-line"></div>
55 信用卡戶口直接付款授權書
56 </div>
57 </div>
58 <div class="ww w3">
59 <div class="grid">
60 <div class="v-line"></div>
61 <div class="h-line"></div>
62 申請設立「電子入賬服務」及銀行戶口
63 <br>直接付款授權時須提供
64 </div>
65 <div class="grid">
66 <div class="v-line"></div>
67 <div class="h-line"></div>
68 申請信用卡戶口直接付款授權時須提供
69 </div>
70
71 </div>
72 <div class="ww w4">
73 <div class="grid pointer">
74 <div class="h-line"></div>
75 <img class="icon" src="@/assets/images/common-form/icon-cf-download.png" alt=""> 下載文檔
76 </div>
77 <div class="grid pointer">
78 <div class="h-line"></div>
79 <img class="icon" src="@/assets/images/common-form/icon-cf-download.png" alt=""> 下載文檔
80 </div>
81
82 </div>
83 </div> -->
84
85 <!-- 保單變更類 -->
86 <!-- <div class="table-content-item">
87 <div class="hl"></div>
88 <div class="ww w1">
89 保單變更類
90 </div>
91 <div class="ww w2">
92 <div class="grid">
93 <div class="v-line"></div>
94 <div class="h-line"></div>
95 保險合同解除申請書
96 </div>
97 <div class="grid">
98 <div class="v-line"></div>
99 <div class="h-line"></div>
100 信用卡戶口直接付款授權書
101 </div>
102 </div>
103 <div class="ww w3">
104 <div class="grid">
105 <div class="v-line"></div>
106 <div class="h-line"></div>
107 申請設立「電子入賬服務」及銀行戶口
108 <br>直接付款授權時須提供
109 </div>
110 <div class="grid">
111 <div class="v-line"></div>
112 <div class="h-line"></div>
113 申請信用卡戶口直接付款授權時須提供
114 </div>
115
116 </div>
117 <div class="ww w4">
118 <div class="grid pointer">
119 <div class="h-line"></div>
120 <img class="icon" src="@/assets/images/common-form/icon-cf-download.png" alt=""> 下載文檔
121 </div>
122 <div class="grid pointer">
123 <div class="h-line"></div>
124 <img class="icon" src="@/assets/images/common-form/icon-cf-download.png" alt=""> 下載文檔
125 </div>
126 </div>
127 </div> -->
128
129 <!-- 理賠類 -->
130 <!-- <div class="table-content-item">
131 <div class="ww w1">
132 理賠類
133 </div>
134 <div class="ww w2">
135 <div class="grid">
136 <div class="v-line"></div>
137 理賠申請書
138 </div>
139 </div>
140 <div class="ww w3">
141 <div class="grid">
142 <div class="v-line"></div>
143 紙質申請的應備文件
144 </div>
145 </div>
146 <div class="ww w4">
147 <div class="grid pointer">
148 <img class="icon" src="@/assets/images/common-form/icon-cf-download.png" alt=""> 下載文檔
149 </div>
150 </div>
151 </div> -->
152
153 </div>
154 </div>
155 </div>
156 </template>
157
158 <script src="./common-form.js"></script>
159 <style lang="scss" scoped>
160 @import "./common-form.scss";
161 </style>
1 @import '@/styles/_support'; 1 @import '@/styles/_support';
2 2
3 .content {} 3
4 .contact-us-container {}
4 5
5 .border { 6 .border {
7 @extend .bb;
8 padding: 2.833333rem 4.0rem 0 3.5rem;
6 width: 770px; 9 width: 770px;
7 height: 387px; 10 height: 387px;
8 border-radius: 8px; 11 border-radius: 8px;
9 border: solid 1px #f2f2f2; 12 border: solid 1px #f2f2f2;
10 background-color: #ffffff; 13 background-color: #ffffff;
11 } 14 }
15
16 .info {
17 display: flex;
18 justify-content: space-between;
19 margin-bottom: 4.416667rem;
20
21 &-item {
22 font-size: 12px;
23
24 &-tit {
25 display: flex;
26 align-items: center;
27 color: $cOrange;
28 font-size: 18px;
29 font-weight: bold;
30 height: 2.833333rem;
31
32 .icon-wrap {
33 margin-right: .75rem;
34 }
35 }
36
37 &:last-child {
38 margin-right: 0;
39 }
40 }
41
42 .qrcode-wrap {
43 text-align: center;
44
45 // margin:;
46 // margin-right: ;
47 .qrocde {}
48 }
49
50 ul {
51 list-style-type: none;
52 margin-top: 1.5rem;
53 }
54
55 li {
56 background-image: url('~@assets/images/payment-type/icon-li.png');
57 background-repeat: no-repeat;
58 background-position: 0rem .5rem;
59 padding-left: 1rem;
60 margin: .6rem 0;
61 }
62 }
63
64 .info2 {
65 .info-item {
66 margin: 0;
67 }
68 }
......
1 1
2 <template> 2 <template>
3 <div class="contact-us-container"> 3 <div class="contact-us-container">
4 <div class="border"> 4 <div class=" border">
5 contact-us 5 <div class="info">
6 <div class="info-item">
7 <div class="info-item-tit">
8 <div class="icon-wrap">
9 <img class="icon" src="@/assets/images/contact-us/icon-cs-service.png">
10 </div>
11 客戶服務中心
12 </div>
13 <div class="info-item-detail">
14 <ul>
15 <li>地址：香港尖沙嘴港威永金融大樓</li>
16 <li>服務時間：星期壹至五9:00-18:00</li>
17 </ul>
18 </div>
19
20 </div>
21
22 <div class="info-item">
23 <div class="info-item-tit">
24 <div class="icon-wrap">
25 <img class="icon" src="@/assets/images/contact-us/icon-cs-call.png">
26 </div>
27 客戶服務熱線
28 </div>
29 <div class="info-item-detail">
30 <ul>
31 <li>香港號碼：(852)2983 8866</li>
32 <li>內地號碼：(86)40078 95511</li>
33 <li>服務時間：星期壹至五9:00-18:00</li>
34 </ul>
35 </div>
36 </div>
37
38 <div class="info-item">
39 <div class="info-item-tit">
40 <div class="icon-wrap">
41 <img class="icon" src="@/assets/images/contact-us/icon-cs-email.png">
42 </div>
43 客戶服務電郵
44 </div>
45 <div class="info-item-detail">
46 <ul>
47 <li>cs@pingan.com.hk</li>
48 </ul>
49 </div>
50 </div>
51 </div>
52 <!-- 微信公众号 -->
53 <div class="info info2">
54 <div class="info-item">
55 <div class="info-item-tit">
56 <div class="icon-wrap">
57 <img class="icon" src="@/assets/images/contact-us/icon-cs-wechat.png">
58 </div>
59 微信公眾號
60 </div>
61 <div class="info-item-detail">
62 <ul>
63 <li>登陸「微信」APP，按右上角的「+按鈕並選擇「添加朋友」選擇「公眾號」輸入並搜索「平安人壽香港」</li>
64 <li>登陸「微信」APP，按右上角的「+」按鈕並選擇「掃壹掃」</li>
65 </ul>
66 </div>
67 </div>
68 <div class="qrcode-wrap">
69 <img src="@/assets/images/contact-us/cs-qrcode.png">
70 <div class="t1">官方公眾號</div>
71 </div>
72 </div>
6 </div> 73 </div>
74
7 </div> 75 </div>
8 </template> 76 </template>
9 77
......
...@@ -8,11 +8,12 @@ import ContactUs from './components/contact-us.vue' ...@@ -8,11 +8,12 @@ import ContactUs from './components/contact-us.vue'
8 import InsuranceQuery from './components/insurance-query.vue' 8 import InsuranceQuery from './components/insurance-query.vue'
9 import reservation from './components/reservation.vue' 9 import reservation from './components/reservation.vue'
10 import PaymentType from './components/payment-type.vue' 10 import PaymentType from './components/payment-type.vue'
11 import CommonForm from './components/common-form.vue'
11 12
12 export default { 13 export default {
13 data() { 14 data() {
14 return { 15 return {
15 activity: "m3" 16 activity: "m8"
16 } 17 }
17 }, 18 },
18 methods: { 19 methods: {
...@@ -29,24 +30,23 @@ export default { ...@@ -29,24 +30,23 @@ export default {
29 } 30 }
30 }, 31 },
31 watch: { 32 watch: {
32 $route() { 33 // $route() {
33 let activity = this.$route.query.q; 34 // let activity = this.$route.query.q;
34 // console.log("watch", this.$route); 35 // if (activity) {
35 if (activity) { 36 // this.$set(this, 'activity', activity);
36 this.$set(this, 'activity', activity); 37 // }
37 } 38 // }
38 // console.log("activity === ", this.activity);
39 }
40 }, 39 },
41 created() { 40 created() {
42 let activity = this.$route.query.q; 41 // let activity = this.$route.query.q;
43 activity = activity ? activity : "m3"; 42 // activity = activity ? activity : "m3";
44 this.activity = activity; 43 // this.activity = activity;
45 }, 44 },
46 components: { 45 components: {
47 ContactUs, 46 ContactUs,
48 InsuranceQuery, 47 InsuranceQuery,
49 reservation, 48 reservation,
50 PaymentType 49 PaymentType,
50 CommonForm
51 } 51 }
52 } 52 }
......
...@@ -22,7 +22,8 @@ ...@@ -22,7 +22,8 @@
22 .menu-item { 22 .menu-item {
23 position: relative; 23 position: relative;
24 @extend .bb; 24 @extend .bb;
25 padding: 1rem 0; 25 padding: 1.25rem 0;
26 // height: 3.833333rem;
26 font-weight: bold; 27 font-weight: bold;
27 color: $cFontGray; 28 color: $cFontGray;
28 text-align: center; 29 text-align: center;
......
...@@ -25,7 +25,9 @@ ...@@ -25,7 +25,9 @@
25 <reservation></reservation> 25 <reservation></reservation>
26 </div> 26 </div>
27 <div class="panel" :class="{activity : activity == 'm7'}"></div> 27 <div class="panel" :class="{activity : activity == 'm7'}"></div>
28 <div class="panel" :class="{activity : activity == 'm8'}"></div> 28 <div class="panel" :class="{activity : activity == 'm8'}">
29 <common-form></common-form>
30 </div>
29 </div> 31 </div>
30 </div> 32 </div>
31 </template> 33 </template>
......
...@@ -50,5 +50,4 @@ ...@@ -50,5 +50,4 @@
50 50
51 .bc{ 51 .bc{
52 text-align: center; 52 text-align: center;
53
54 } 53 }
......