默认提交
Showing
18 changed files
with
360 additions
and
167 deletions
... | @@ -46,48 +46,49 @@ module.exports = { | ... | @@ -46,48 +46,49 @@ module.exports = { |
46 | saveComplain: "/pingan_hklife_webapi/customService/complain/save", | 46 | saveComplain: "/pingan_hklife_webapi/customService/complain/save", |
47 | 47 | ||
48 | // 身份认证 | 48 | // 身份认证 |
49 | customerAuth :"/pingan_hklife_webapi/policy/auth", | 49 | customerAuth: "/pingan_hklife_webapi/policy/auth", |
50 | // 保单接口 | 50 | // 保单接口 |
51 | policyList : "/pingan_hklife_webapi/policy/list", | 51 | policyList: "/pingan_hklife_webapi/policy/list", |
52 | // 保单接口 | 52 | // 保单接口 |
53 | policyDetail : "/pingan_hklife_webapi/policy/detail", | 53 | policyDetail: "/pingan_hklife_webapi/policy/detail", |
54 | // 保单聯系方式變更 | 54 | // 保单聯系方式變更 |
55 | updatePolicyContanct : "/pingan_hklife_webapi/policy/updateContacts", | 55 | updatePolicyContanct: "/pingan_hklife_webapi/policy/updateContacts", |
56 | // 保单客戶資料變更 | 56 | // 保单客戶資料變更 |
57 | updatePolicyInfo : "/pingan_hklife_webapi/policy/updateInfo", | 57 | updatePolicyInfo: "/pingan_hklife_webapi/policy/updateInfo", |
58 | updatePolicyInfoV2 : "/pingan_hklife_webapi/policy/updatePolicyInfo", | 58 | updatePolicyInfoV2: "/pingan_hklife_webapi/policy/updatePolicyInfo", |
59 | // 证件上传 | 59 | // 证件上传 |
60 | idPicUpload : "/pingan_hklife_webapi/policy/idPicUpload", | 60 | idPicUpload: "/pingan_hklife_webapi/policy/idPicUpload", |
61 | updateIdFileV2 : "/pingan_hklife_webapi/policy/updateIdFileV2", | 61 | updateIdFileV2: "/pingan_hklife_webapi/policy/updateIdFileV2", |
62 | // 回销回执 | 62 | // 回销回执 |
63 | policyReceipt : "/pingan_hklife_webapi/policy/policyReceipt", | 63 | policyReceipt: "/pingan_hklife_webapi/policy/policyReceipt", |
64 | // 获取电子保单下载code | 64 | // 获取电子保单下载code |
65 | getDownloadPath : "/pingan_hklife_webapi/policy/getDownloadPath", | 65 | getDownloadPath: "/pingan_hklife_webapi/policy/getDownloadPath", |
66 | // 下载电子保单 | 66 | // 下载电子保单 |
67 | downloadPolicy : "/pingan_hklife_webapi/policy/d", | 67 | downloadPolicy: "/pingan_hklife_webapi/policy/d", |
68 | // 上传电子文档 | 68 | // 上传电子文档 |
69 | uploadClarmsImage : "/pingan_hklife_webapi/policy/clarmsUpload", | 69 | uploadClarmsImage: "/pingan_hklife_webapi/policy/clarmsUpload", |
70 | // 如果是登录用户,直接从库中获取cid | 70 | // 如果是登录用户,直接从库中获取cid |
71 | getCidByLogin : "/pingan_hklife_webapi/policy/getCidByLogin", | 71 | getCidByLogin: "/pingan_hklife_webapi/policy/getCidByLogin", |
72 | // 校验方式获取cid | 72 | // 校验方式获取cid |
73 | getCidByVerify : "/pingan_hklife_webapi/policy/getCidByVerify", | 73 | getCidByVerify: "/pingan_hklife_webapi/policy/getCidByVerify", |
74 | // 客户信息 | 74 | // 客户信息 |
75 | clarmsCustomerList : "/pingan_hklife_webapi/policy/clarmsCustomerList", | 75 | clarmsCustomerList: "/pingan_hklife_webapi/policy/clarmsCustomerList", |
76 | // 理赔报案 | 76 | // 理赔报案 |
77 | clarmsRegisterCase : "/pingan_hklife_webapi/policy/clarmsRegisterCase", | 77 | clarmsRegisterCase: "/pingan_hklife_webapi/policy/clarmsRegisterCase", |
78 | 78 | ||
79 | 79 | ||
80 | // cms相关 | 80 | // cms相关 |
81 | indexVideo : "/pingan_hklife_webapi/cms/indexVideo", | 81 | indexVideo: "/pingan_hklife_webapi/cms/indexVideo", |
82 | banner : "/pingan_hklife_webapi/cms/banner/list", | 82 | banner: "/pingan_hklife_webapi/cms/banner/list", |
83 | newsList : "/pingan_hklife_webapi/cms/news/list", | 83 | newsList: "/pingan_hklife_webapi/cms/news/list", |
84 | newsDetail : "/pingan_hklife_webapi/cms/news/get", | 84 | newsDetail: "/pingan_hklife_webapi/cms/news/get", |
85 | companyOutline : "/pingan_hklife_webapi/cms/company/outline", | 85 | companyOutline: "/pingan_hklife_webapi/cms/company/outline", |
86 | productInfo : "/pingan_hklife_webapi/cms/product", | 86 | productInfo: "/pingan_hklife_webapi/cms/product", |
87 | faq: "/pingan_hklife_webapi/cms/faq", | ||
87 | 88 | ||
88 | config : "/pingan_hklife_webapi/config", | 89 | config: "/pingan_hklife_webapi/config", |
89 | 90 | ||
90 | // 为了香港上线而增加的身份自行管理接口 | 91 | // 为了香港上线而增加的身份自行管理接口 |
91 | doLoginV2 : "/pingan_hklife_webapi/user/loginv2", | 92 | doLoginV2: "/pingan_hklife_webapi/user/loginv2", |
92 | doRegisterV2 : "/pingan_hklife_webapi/user/registerv2" | 93 | doRegisterV2: "/pingan_hklife_webapi/user/registerv2" |
93 | } | 94 | } | ... | ... |
1.84 KB
1.19 KB
... | @@ -489,6 +489,8 @@ module.exports = { | ... | @@ -489,6 +489,8 @@ module.exports = { |
489 | menu6: "Reservation", | 489 | menu6: "Reservation", |
490 | menu7: "Complaints", | 490 | menu7: "Complaints", |
491 | menu8: "Useful Forms", | 491 | menu8: "Useful Forms", |
492 | menu9: "eCorrespondence<br>Enquiry", | ||
493 | menu10: "FAQ", | ||
492 | }, | 494 | }, |
493 | commonForm: { | 495 | commonForm: { |
494 | head1: "Type of Forms", | 496 | head1: "Type of Forms", |
... | @@ -733,12 +735,15 @@ module.exports = { | ... | @@ -733,12 +735,15 @@ module.exports = { |
733 | title: "Official WeChat Account" | 735 | title: "Official WeChat Account" |
734 | } | 736 | } |
735 | }, | 737 | }, |
738 | FAQ: { | ||
739 | title: "FAQ", | ||
740 | }, | ||
736 | eCorrespondenceEnquiry: { | 741 | eCorrespondenceEnquiry: { |
737 | PolicyNumber:"Policy Number", | 742 | PolicyNumber: "Policy Number", |
738 | TypeOfCorrespondence:"Type of Correspondence", | 743 | TypeOfCorrespondence: "Type of Correspondence", |
739 | SentOutDate:"Sent Out Date", | 744 | SentOutDate: "Sent Out Date", |
740 | DownloadLink:"Download link", | 745 | DownloadLink: "Download link", |
741 | Status:"Status", | 746 | Status: "Status", |
742 | }, | 747 | }, |
743 | customService: { | 748 | customService: { |
744 | name: "Customer service", | 749 | name: "Customer service", | ... | ... |
... | @@ -477,7 +477,7 @@ module.exports = { | ... | @@ -477,7 +477,7 @@ module.exports = { |
477 | iconProduct: "產品詳情" | 477 | iconProduct: "產品詳情" |
478 | }, | 478 | }, |
479 | customProduct: { | 479 | customProduct: { |
480 | menu1: "聯繫我們", | 480 | menu1: "聯絡我們", |
481 | menu2: "繳付保費", | 481 | menu2: "繳付保費", |
482 | menu3: "保單查詢", | 482 | menu3: "保單查詢", |
483 | menu4: "更改保單資料", | 483 | menu4: "更改保單資料", |
... | @@ -485,6 +485,8 @@ module.exports = { | ... | @@ -485,6 +485,8 @@ module.exports = { |
485 | menu6: "預約服務", | 485 | menu6: "預約服務", |
486 | menu7: "投訴受理", | 486 | menu7: "投訴受理", |
487 | menu8: "常用表格", | 487 | menu8: "常用表格", |
488 | menu9: "電子通知書查詢", | ||
489 | menu10: "常見問題", | ||
488 | }, | 490 | }, |
489 | commonForm: { | 491 | commonForm: { |
490 | head1: "表格類型", | 492 | head1: "表格類型", |
... | @@ -734,9 +736,12 @@ module.exports = { | ... | @@ -734,9 +736,12 @@ module.exports = { |
734 | DownloadLink:"下載鏈接", | 736 | DownloadLink:"下載鏈接", |
735 | Status:"狀况", | 737 | Status:"狀况", |
736 | }, | 738 | }, |
739 | FAQ:{ | ||
740 | title:"常見問題", | ||
741 | }, | ||
737 | customService: { | 742 | customService: { |
738 | name: "客戶服務", | 743 | name: "客戶服務", |
739 | menu1: "聯繫我們", | 744 | menu1: "聯絡我們", |
740 | menu2: "繳付保費", | 745 | menu2: "繳付保費", |
741 | menu3: "保單查詢", | 746 | menu3: "保單查詢", |
742 | menu4: "更改保單資料", | 747 | menu4: "更改保單資料", | ... | ... |
... | @@ -174,7 +174,7 @@ module.exports = { | ... | @@ -174,7 +174,7 @@ module.exports = { |
174 | terms: "使用条款", | 174 | terms: "使用条款", |
175 | protocol: "个人资料收集声明", | 175 | protocol: "个人资料收集声明", |
176 | map: "网站地图", | 176 | map: "网站地图", |
177 | contactUs: "联络我们", | 177 | contactUs: "联系我们", |
178 | contactInformation: "联系方式", | 178 | contactInformation: "联系方式", |
179 | service: "服务网络", | 179 | service: "服务网络", |
180 | qrcode: "社交媒体", | 180 | qrcode: "社交媒体", |
... | @@ -387,7 +387,7 @@ module.exports = { | ... | @@ -387,7 +387,7 @@ module.exports = { |
387 | t1: "专业客服为你服务", | 387 | t1: "专业客服为你服务", |
388 | t2: "想了解更多,可致电", | 388 | t2: "想了解更多,可致电", |
389 | t3: "95511", | 389 | t3: "95511", |
390 | t4: "联络我们,或进入", | 390 | t4: "联系我们,或进入", |
391 | } | 391 | } |
392 | }, | 392 | }, |
393 | }, | 393 | }, |
... | @@ -485,6 +485,8 @@ module.exports = { | ... | @@ -485,6 +485,8 @@ module.exports = { |
485 | menu6: "预约服务", | 485 | menu6: "预约服务", |
486 | menu7: "投诉受理", | 486 | menu7: "投诉受理", |
487 | menu8: "常用表格", | 487 | menu8: "常用表格", |
488 | menu9: "电子通知书查询", | ||
489 | menu10: "常见问题", | ||
488 | }, | 490 | }, |
489 | commonForm: { | 491 | commonForm: { |
490 | head1: "表格类型", | 492 | head1: "表格类型", |
... | @@ -729,11 +731,14 @@ module.exports = { | ... | @@ -729,11 +731,14 @@ module.exports = { |
729 | } | 731 | } |
730 | }, | 732 | }, |
731 | eCorrespondenceEnquiry: { | 733 | eCorrespondenceEnquiry: { |
732 | PolicyNumber:"保單號碼", | 734 | PolicyNumber: "保单号码", |
733 | TypeOfCorrespondence:"通知書類型", | 735 | TypeOfCorrespondence: "通知书类型", |
734 | SentOutDate:"發出時間", | 736 | SentOutDate: "发出时间", |
735 | DownloadLink:"下載鏈接", | 737 | DownloadLink: "下载链接", |
736 | Status:"狀况", | 738 | Status: "状况", |
739 | }, | ||
740 | FAQ: { | ||
741 | title: "常见问题", | ||
737 | }, | 742 | }, |
738 | customService: { | 743 | customService: { |
739 | name: "客户服务", | 744 | name: "客户服务", | ... | ... |
src/components/filter-comp/filter-comp.js
0 → 100644
1 | /** | ||
2 | * 组件描述:过滤组件 | ||
3 | * PC端样式为左图标右文案 | ||
4 | * 主要用于错误提示 | ||
5 | */ | ||
6 | |||
7 | export default { | ||
8 | props: { | ||
9 | // 是否显示组件 | ||
10 | visible: { | ||
11 | type: Boolean, | ||
12 | default: true, | ||
13 | }, | ||
14 | // 取消按钮回调方法 | ||
15 | close: { | ||
16 | type: Function, | ||
17 | default: null | ||
18 | }, | ||
19 | // 点击蒙层回调方法 | ||
20 | overlay: { | ||
21 | type: Function, | ||
22 | default: null | ||
23 | }, | ||
24 | // 传入数据 | ||
25 | items: { | ||
26 | type: Array, | ||
27 | default: () => [ | ||
28 | "复选框 A", | ||
29 | "复选框 B", | ||
30 | "复选框 C", | ||
31 | "复选框 D", | ||
32 | "复选框 E", | ||
33 | "复选框 F", | ||
34 | "复选框 G", | ||
35 | "复选框 H", | ||
36 | "复选框 I", | ||
37 | "复选框 J", | ||
38 | "复选框 K", | ||
39 | "复选框 L", | ||
40 | ] | ||
41 | } | ||
42 | }, | ||
43 | data() { | ||
44 | return { | ||
45 | key: 'value', | ||
46 | checkList: [] | ||
47 | } | ||
48 | }, | ||
49 | components: {}, | ||
50 | computed: { | ||
51 | locale() { | ||
52 | return this.$i18n.locale || 'tc'; | ||
53 | }, | ||
54 | }, | ||
55 | methods: { | ||
56 | // 点击关闭 | ||
57 | onCloseHandler() { | ||
58 | if (this.close) { | ||
59 | this.close(); | ||
60 | } | ||
61 | }, | ||
62 | // 点击蒙层 | ||
63 | onOverLayHandler() { | ||
64 | if (this.overlay) { | ||
65 | this.overlay(); | ||
66 | } | ||
67 | }, | ||
68 | toTarget() { | ||
69 | if (this.target) { | ||
70 | this.$emit("targetCallbak", this.target1); | ||
71 | } | ||
72 | }, | ||
73 | initData() {} | ||
74 | }, | ||
75 | mounted() {}, | ||
76 | created() {}, | ||
77 | } |
src/components/filter-comp/filter-comp.scss
0 → 100644
1 | @import '@/styles/_support.scss'; | ||
2 | |||
3 | |||
4 | .comp { | ||
5 | position: fixed; | ||
6 | top: 0; | ||
7 | left: 0; | ||
8 | z-index: 5000; | ||
9 | width: 100%; | ||
10 | height: 100%; | ||
11 | @extend .fcc; | ||
12 | text-align: center; | ||
13 | font-size: 28px; | ||
14 | } | ||
15 | |||
16 | .hide { | ||
17 | display: none; | ||
18 | } | ||
19 | |||
20 | .overlay { | ||
21 | position: absolute; | ||
22 | top: 0; | ||
23 | left: 0; | ||
24 | width: 100%; | ||
25 | height: 100%; | ||
26 | background: rgba($color: #000000, $alpha: 0.7); | ||
27 | } | ||
28 | |||
29 | .border { | ||
30 | position: relative; | ||
31 | @include border-tans(20px); | ||
32 | } | ||
33 | |||
34 | .modal { | ||
35 | position: relative; | ||
36 | max-width: 900px; | ||
37 | margin: 0 auto; | ||
38 | |||
39 | &-content { | ||
40 | padding: 72px 60px; | ||
41 | max-height: 534px; | ||
42 | } | ||
43 | |||
44 | } | ||
45 | |||
46 | |||
47 | .close { | ||
48 | position: absolute; | ||
49 | right: -55px; | ||
50 | top: -15px; | ||
51 | cursor: pointer; | ||
52 | |||
53 | img { | ||
54 | position: relative; | ||
55 | width: 30px; | ||
56 | height: 30px; | ||
57 | } | ||
58 | } | ||
59 | |||
60 | @media (max-width: 1150px) { | ||
61 | .close { | ||
62 | right: -15px; | ||
63 | top: -55px; | ||
64 | } | ||
65 | } | ||
66 | |||
67 | @media (max-width: 1000px) { | ||
68 | .border { | ||
69 | width: 90%; | ||
70 | } | ||
71 | } | ||
72 | |||
73 | @media (max-width: 768px) { | ||
74 | .border { | ||
75 | width: 80%; | ||
76 | |||
77 | .modal { | ||
78 | .modal-content { | ||
79 | flex-wrap: wrap; | ||
80 | padding: 32px 16px; | ||
81 | |||
82 | .info-icon { | ||
83 | margin: 0 auto; | ||
84 | width: 32%; | ||
85 | min-width: auto; | ||
86 | } | ||
87 | |||
88 | .message { | ||
89 | margin: 16px auto 0; | ||
90 | font-size: 20px; | ||
91 | } | ||
92 | } | ||
93 | } | ||
94 | |||
95 | } | ||
96 | } |
src/components/filter-comp/filter-comp.vue
0 → 100644
1 | |||
2 | <template> | ||
3 | <div class="comp filter-comp" :class="{'hide' : !visible }"> | ||
4 | <div @click="onOverLayHandler()" class="overlay"></div> | ||
5 | <div class="border"> | ||
6 | <div class="close" @click="onCloseHandler()"><img src="@/assets/images/clarms/close.png"></div> | ||
7 | <div class="modal"> | ||
8 | <div class="modal-content"> | ||
9 | <el-checkbox-group v-model="checkList"> | ||
10 | <el-checkbox v-for="item in items" :key="item.id" :label="item"></el-checkbox> | ||
11 | </el-checkbox-group> | ||
12 | </div> | ||
13 | </div> | ||
14 | </div> | ||
15 | </div> | ||
16 | </template> | ||
17 | |||
18 | <script src="./filter-comp.js"></script> | ||
19 | <style lang="scss" scoped> | ||
20 | @import "./filter-comp.scss"; | ||
21 | </style> |
... | @@ -30,8 +30,12 @@ | ... | @@ -30,8 +30,12 @@ |
30 | </div> | 30 | </div> |
31 | <div class="t1">{{$t('customProduct.menu4')}}</div> | 31 | <div class="t1">{{$t('customProduct.menu4')}}</div> |
32 | </div> | 32 | </div> |
33 | <div @click="toPage('/custom/service?q=m9')" class="product-item"> | ||
34 | <div class="icon-wrap"> | ||
35 | <img src="@/assets/images/custom-product/icon-cp-9.png"> | ||
36 | </div> | ||
37 | <div v-html="$t('customProduct.menu9')" class="t1">{{$t('customProduct.menu9')}}</div> | ||
33 | </div> | 38 | </div> |
34 | <div class="box product"> | ||
35 | <div @click="toPage('/custom/service?q=m5')" class="product-item"> | 39 | <div @click="toPage('/custom/service?q=m5')" class="product-item"> |
36 | <div class="icon-wrap"> | 40 | <div class="icon-wrap"> |
37 | <img src="@/assets/images/custom-product/icon-cp-5.png"> | 41 | <img src="@/assets/images/custom-product/icon-cp-5.png"> |
... | @@ -56,6 +60,12 @@ | ... | @@ -56,6 +60,12 @@ |
56 | </div> | 60 | </div> |
57 | <div class="t1">{{$t('customProduct.menu8')}}</div> | 61 | <div class="t1">{{$t('customProduct.menu8')}}</div> |
58 | </div> | 62 | </div> |
63 | <div @click="toPage('/custom/service?q=m10')" class="product-item"> | ||
64 | <div class="icon-wrap"> | ||
65 | <img src="@/assets/images/custom-product/icon-cp-10.png"> | ||
66 | </div> | ||
67 | <div class="t1">{{$t('customProduct.menu10')}}</div> | ||
68 | </div> | ||
59 | </div> | 69 | </div> |
60 | </div> | 70 | </div> |
61 | </div> | 71 | </div> | ... | ... |
... | @@ -18,7 +18,7 @@ import { | ... | @@ -18,7 +18,7 @@ import { |
18 | getPolicyName | 18 | getPolicyName |
19 | } from "@/utils/biz.js"; | 19 | } from "@/utils/biz.js"; |
20 | import Modal2Comp from '@/components/modal2-comp/modal2-comp.vue'; | 20 | import Modal2Comp from '@/components/modal2-comp/modal2-comp.vue'; |
21 | import ModalComp from '@/components/modal-comp/modal-comp.vue'; | 21 | import FilterComp from '@/components/filter-comp/filter-comp.vue'; |
22 | 22 | ||
23 | export default { | 23 | export default { |
24 | props: { | 24 | props: { |
... | @@ -39,7 +39,9 @@ export default { | ... | @@ -39,7 +39,9 @@ export default { |
39 | selectPolicyCode: "", | 39 | selectPolicyCode: "", |
40 | selectPolicyCodes: {}, | 40 | selectPolicyCodes: {}, |
41 | hide: false, | 41 | hide: false, |
42 | showDownloadError: false | 42 | showDownloadError: false, |
43 | filterVisible: true, | ||
44 | checkList:[] | ||
43 | } | 45 | } |
44 | }, | 46 | }, |
45 | computed: { | 47 | computed: { |
... | @@ -282,12 +284,12 @@ export default { | ... | @@ -282,12 +284,12 @@ export default { |
282 | } | 284 | } |
283 | 285 | ||
284 | // 显示模态窗 | 286 | // 显示模态窗 |
285 | this.showDownloadError = true; | 287 | this.filterVisible = true; |
286 | } | 288 | } |
287 | }, | 289 | }, |
288 | components: { | 290 | components: { |
289 | Modal2Comp, | 291 | Modal2Comp, |
290 | ModalComp | 292 | FilterComp |
291 | }, | 293 | }, |
292 | mounted() { | 294 | mounted() { |
293 | this.queryList(); | 295 | this.queryList(); | ... | ... |
1 | <template> | 1 | <template> |
2 | <div class="list-container"> | 2 | <div class="list-container"> |
3 | <modal2-comp :visible="showDownloadError" :close="()=>{showDownloadError = false}" :content="$t('glbalTips.sysError')"></modal2-comp> | 3 | <modal2-comp :visible="showDownloadError" :close="()=>{showDownloadError = false}" :content="$t('glbalTips.sysError')"></modal2-comp> |
4 | <!-- <modal-comp :visible="showDownloadError" :close="()=>{showDownloadError = false}" :content="$t('glbalTips.sysError')"></modal-comp> --> | 4 | <filter-comp v-model="checkList" :visible="filterVisible" :close="()=>{filterVisible = false}" ></filter-comp> |
5 | <div class="cell-group"> | 5 | <div class="cell-group"> |
6 | <div class="table-contaner"> | 6 | <div class="table-contaner"> |
7 | <div class="table-header orange new"> | 7 | <div class="table-header orange new"> | ... | ... |
... | @@ -13,10 +13,7 @@ export default { | ... | @@ -13,10 +13,7 @@ export default { |
13 | data() { | 13 | data() { |
14 | return { | 14 | return { |
15 | key: 'value', | 15 | key: 'value', |
16 | dataList: [{ | 16 | dataList: [] |
17 | q: "我可以更改平安•傳家福的身故賠償支付方式嗎?", | ||
18 | a: "答: 於第一保單週年日後,您可填妥<保單服務申請書>並遞交給我們申請更改身故賠償支付方式。這項表格可於我們的官網下載。", | ||
19 | }] | ||
20 | } | 17 | } |
21 | }, | 18 | }, |
22 | components: {}, | 19 | components: {}, |
... | @@ -29,13 +26,58 @@ export default { | ... | @@ -29,13 +26,58 @@ export default { |
29 | }, | 26 | }, |
30 | }, | 27 | }, |
31 | methods: { | 28 | methods: { |
32 | downloadHandle(item) { | 29 | // 折叠/收起 |
33 | if (item.download) { | 30 | onMoreHandler(item) { |
34 | window.open(item.download); | 31 | item.more = !item.more; |
32 | }, | ||
33 | queryFaq() { | ||
34 | httpPost({ | ||
35 | url: api.faq, | ||
36 | data: { | ||
37 | page: 1, | ||
38 | size: 999999 | ||
39 | } | ||
40 | }).then((result) => { | ||
41 | console.log("result:", result); | ||
42 | let lang = this.$i18n.locale; | ||
43 | let dataList = []; | ||
44 | result.forEach(element => { | ||
45 | let item = {} | ||
46 | switch (lang) { | ||
47 | case "en": | ||
48 | item.q = element.questionEn; | ||
49 | item.a = element.answerEn; | ||
50 | break; | ||
51 | |||
52 | case "zh": | ||
53 | item.q = element.questionCn; | ||
54 | item.a = element.answerCn; | ||
55 | break; | ||
56 | |||
57 | default: | ||
58 | item.q = element.questionTc; | ||
59 | item.a = element.answerTc; | ||
60 | break; | ||
35 | } | 61 | } |
62 | item.more = false; | ||
63 | dataList.push(item) | ||
64 | }); | ||
65 | this.dataList = dataList; | ||
66 | console.log("dataList:", dataList); | ||
67 | }).catch((err) => {}); | ||
36 | }, | 68 | }, |
37 | initData() {} | 69 | initData() { |
70 | this.queryFaq(); | ||
71 | } | ||
72 | }, | ||
73 | mounted() { | ||
74 | this.initData(); | ||
38 | }, | 75 | }, |
39 | mounted() {}, | 76 | created() { |
40 | created() {} | 77 | this.$root.eventBus.$on("langChange", () => { |
78 | try { | ||
79 | this.initData(); | ||
80 | } catch (e) {} | ||
81 | }); | ||
82 | } | ||
41 | } | 83 | } | ... | ... |
... | @@ -21,16 +21,17 @@ | ... | @@ -21,16 +21,17 @@ |
21 | @extend .bb; | 21 | @extend .bb; |
22 | padding: 40px 0 42px; | 22 | padding: 40px 0 42px; |
23 | border-bottom: solid 2px #eaebeb; | 23 | border-bottom: solid 2px #eaebeb; |
24 | cursor: pointer; | ||
25 | |||
24 | 26 | ||
25 | // 问题 | 27 | // 问题 |
26 | .question { | 28 | .question { |
27 | font-weight: bold; | 29 | font-weight: bold; |
30 | margin-bottom: 12px; | ||
28 | } | 31 | } |
29 | 32 | ||
30 | // 答案 | 33 | // 答案 |
31 | .answer { | 34 | .answer {} |
32 | margin-top: 12px; | ||
33 | } | ||
34 | 35 | ||
35 | table { | 36 | table { |
36 | width: 100%; | 37 | width: 100%; | ... | ... |
... | @@ -3,118 +3,27 @@ | ... | @@ -3,118 +3,27 @@ |
3 | <div class="container "> | 3 | <div class="container "> |
4 | <div class="top-space"></div> | 4 | <div class="top-space"></div> |
5 | <div class="title"> | 5 | <div class="title"> |
6 | 常见问题 | 6 | {{$t('FAQ.title')}} |
7 | </div> | 7 | </div> |
8 | <div class="desc"> | 8 | <div class="desc"> |
9 | <!-- <div class="desc-item" v-for="item in dataList" :key="item.id"> | 9 | <div @click="onMoreHandler(items)" class="desc-item" v-for="(items) in dataList" :key="items.id"> |
10 | <div class="question">{{ item.q }}</div> | 10 | <div class="question">{{ items.q }}</div> |
11 | <div class="answer">{{ item.a }}</div> | 11 | <template v-if="items.more"> |
12 | </div> --> | 12 | <template v-for="item in items.a"> |
13 | <div class="desc-item" v-for="item in 8" :key="item.id"> | 13 | <span v-if="item.type == 'text'" class="ql-editor answer" :key="item.id" v-html="item.content"></span> |
14 | <div class="question">{{ dataList[0].q }}</div> | 14 | <table v-if="item.type == 'table'" :key="item.id"> |
15 | <div class="answer">{{ dataList[0].a }}</div> | 15 | <tr v-for="(rows,rowIndex) in item.content" :key="rows.id"> |
16 | 16 | <template v-if="rowIndex == 0"> | |
17 | <table > | 17 | <th v-for="gird in rows" :key="gird.id">{{gird}}</th> |
18 | <tr> | 18 | </template> |
19 | <th>保單周年日或保單日期</th> | 19 | <template v-else> |
20 | <th>計算徵費率</th> | 20 | <td v-for="gird in rows" :key="gird.id">{{gird}}</td> |
21 | <th>徵費上限 (HKD)</th> | 21 | </template> |
22 | </tr> | ||
23 | <tr> | ||
24 | <td>2018年1月1日至2019年3月31日</td> | ||
25 | <td>$0.04%</td> | ||
26 | <td>40</td> | ||
27 | </tr> | ||
28 | <tr> | ||
29 | <td>2019年4月1日至2020年3月31日</td> | ||
30 | <td>0.06%</td> | ||
31 | <td>60</td> | ||
32 | </tr> | ||
33 | <tr> | ||
34 | <td>2020年4月1日至2021年3月31日</td> | ||
35 | <td>0.085%</td> | ||
36 | <td>80</td> | ||
37 | </tr> | ||
38 | <tr> | ||
39 | <td>2021年4月1日或之後</td> | ||
40 | <td>0.10%</td> | ||
41 | <td>100</td> | ||
42 | </tr> | 22 | </tr> |
43 | </table> | 23 | </table> |
24 | </template> | ||
25 | </template> | ||
44 | 26 | ||
45 | <!-- <div class="table"> | ||
46 | <div class="table-col"> | ||
47 | <div class="table-col-item"> | ||
48 | 保單周年日或保單日期 | ||
49 | </div> | ||
50 | <div class="table-col-item"> | ||
51 | 2018年1月1日至2019年3月31日 | ||
52 | </div> | ||
53 | <div class="table-col-item"> | ||
54 | 2019年4月1日至2020年3月31日 | ||
55 | </div> | ||
56 | <div class="table-col-item"> | ||
57 | 2020年4月1日至2021年3月31日 | ||
58 | </div> | ||
59 | <div class="table-col-item"> | ||
60 | 2021年4月1日或之後 | ||
61 | </div> | ||
62 | </div> | ||
63 | |||
64 | <div class="table-col"> | ||
65 | <div class="table-col-item"> | ||
66 | 計算徵費率 | ||
67 | </div> | ||
68 | <div class="table-col-item"> | ||
69 | 0.04% | ||
70 | </div> | ||
71 | <div class="table-col-item"> | ||
72 | 0.06% | ||
73 | </div> | ||
74 | <div class="table-col-item"> | ||
75 | 0.085 | ||
76 | </div> | ||
77 | <div class="table-col-item"> | ||
78 | 0.10% | ||
79 | </div> | ||
80 | </div> | ||
81 | |||
82 | <div class="table-col"> | ||
83 | <div class="table-col-item"> | ||
84 | 徵費上限 (HKD) | ||
85 | </div> | ||
86 | <div class="table-col-item"> | ||
87 | 40 | ||
88 | </div> | ||
89 | <div class="table-col-item"> | ||
90 | 60 | ||
91 | </div> | ||
92 | <div class="table-col-item"> | ||
93 | 80 | ||
94 | </div> | ||
95 | <div class="table-col-item"> | ||
96 | 100 | ||
97 | </div> | ||
98 | </div> | ||
99 | |||
100 | <div class="table-col"> | ||
101 | <div class="table-col-item"> | ||
102 | 徵費上限 (HKD) | ||
103 | </div> | ||
104 | <div class="table-col-item"> | ||
105 | 40 | ||
106 | </div> | ||
107 | <div class="table-col-item"> | ||
108 | 60 | ||
109 | </div> | ||
110 | <div class="table-col-item"> | ||
111 | 80 | ||
112 | </div> | ||
113 | <div class="table-col-item"> | ||
114 | 100 | ||
115 | </div> | ||
116 | </div> | ||
117 | </div> --> | ||
118 | </div> | 27 | </div> |
119 | </div> | 28 | </div> |
120 | </div> | 29 | </div> | ... | ... |
... | @@ -5,3 +5,22 @@ $--color-primary: #f05a23; | ... | @@ -5,3 +5,22 @@ $--color-primary: #f05a23; |
5 | $--font-path: '~element-ui/lib/theme-chalk/fonts'; | 5 | $--font-path: '~element-ui/lib/theme-chalk/fonts'; |
6 | 6 | ||
7 | @import "~element-ui/packages/theme-chalk/src/index"; | 7 | @import "~element-ui/packages/theme-chalk/src/index"; |
8 | |||
9 | @import '@/styles/_support.scss'; | ||
10 | |||
11 | .filter-comp{ | ||
12 | .el-checkbox-group { | ||
13 | display: flex; | ||
14 | flex-wrap: wrap; | ||
15 | |||
16 | .el-checkbox { | ||
17 | margin-bottom: 24px; | ||
18 | display: block; | ||
19 | } | ||
20 | |||
21 | .el-checkbox__label { | ||
22 | font-size: $fontSize-M2; | ||
23 | } | ||
24 | } | ||
25 | |||
26 | } | ... | ... |
-
Please register or sign in to post a comment