Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
34259a6a by joe
Options

回执回销

1 parent b4da88d9
Expand all
Inline Side-by-side
Showing 13 changed files with 546 additions and 4 deletions
...@@ -5,6 +5,7 @@ ...@@ -5,6 +5,7 @@
5 <router-view /> 5 <router-view />
6 </main> 6 </main>
7 <v-footer></v-footer> 7 <v-footer></v-footer>
8 <vhis-modal></vhis-modal>
8 </div> 9 </div>
9 </template> 10 </template>
10 11
...@@ -16,6 +17,7 @@ import { mapGetters, mapActions, mapState } from "vuex"; ...@@ -16,6 +17,7 @@ import { mapGetters, mapActions, mapState } from "vuex";
16 import { getCookie } from "@utils/utils.js"; 17 import { getCookie } from "@utils/utils.js";
17 import VHeader from "@components/home/header/header.vue"; 18 import VHeader from "@components/home/header/header.vue";
18 import VFooter from "@components/home/footer/footer.vue"; 19 import VFooter from "@components/home/footer/footer.vue";
20 import VhisModal from "@components/vhis-modal/vhis-modal.vue";
19 21
20 import api from "@/api/api"; 22 import api from "@/api/api";
21 import { httpGet, httpPost } from "@/api/fetch-api.js"; 23 import { httpGet, httpPost } from "@/api/fetch-api.js";
...@@ -26,7 +28,8 @@ export default { ...@@ -26,7 +28,8 @@ export default {
26 name: "app", 28 name: "app",
27 components: { 29 components: {
28 VHeader, 30 VHeader,
29 VFooter 31 VFooter,
32 VhisModal
30 }, 33 },
31 computed: { 34 computed: {
32 ...mapState({ 35 ...mapState({
......
...@@ -56,6 +56,8 @@ module.exports = { ...@@ -56,6 +56,8 @@ module.exports = {
56 updatePolicyInfo : "/pingan_hklife_webapi/policy/updateInfo", 56 updatePolicyInfo : "/pingan_hklife_webapi/policy/updateInfo",
57 // 证件上传 57 // 证件上传
58 idPicUpload : "/pingan_hklife_webapi/policy/idPicUpload", 58 idPicUpload : "/pingan_hklife_webapi/policy/idPicUpload",
59 // 回销回执
60 policyReceipt : "/pingan_hklife_webapi/policy/policyReceipt",
59 61
60 62
61 // cms相关 63 // cms相关
......
...@@ -807,5 +807,29 @@ module.exports = { ...@@ -807,5 +807,29 @@ module.exports = {
807 publishAt: "Publish time", 807 publishAt: "Publish time",
808 readers: "Number of reader", 808 readers: "Number of reader",
809 per: "" 809 per: ""
810 },
811
812 vhis: {
813 title: "Policy confirmation",
814 desc1: "Thank you for purchasing Ping An Life insurance products.",
815 desc2: "The policy is covered and enclosed for your reference and preservation.",
816 desc3: "The policy is an important file. Please check the accuracy of the content immediately,",
817 desc4: "If you have any missing files or wrong information, please call the customer service hotline.",
818 desc5: "Please sign and issue a confirmation receipt for our records.",
819 label1: "Policy number",
820 label2: "Product name",
821 label3: "effective date",
822 label4: "Policyholder",
823 label5: "Insured",
824 btn1: "Download e-policy",
825 btn2: "Confirm immediately",
826 btn3: "Confirm later",
827 ymd1: "/",
828 ymd2: "/",
829 ymd3: "",
830 tip1: "I",
831 tip2: "hereby confirmed that",
832 tip3: "collection of the above policies",
833 tip4: "I would like to contact customer service"
810 } 834 }
811 } 835 }
......
...@@ -803,5 +803,28 @@ module.exports = { ...@@ -803,5 +803,28 @@ module.exports = {
803 publishAt: "發佈時間", 803 publishAt: "發佈時間",
804 readers: "閱讀人數", 804 readers: "閱讀人數",
805 per: "人" 805 per: "人"
806 },
807 vhis: {
808 title: "保單確認書",
809 desc1: "多謝閣下投保平安人壽保險產品。",
810 desc2: "保單已經承保，內附于此供閣下參考及保存。",
811 desc3: "保單是重要檔，請即查閱其內容準確性，",
812 desc4: "如有任何遺漏檔或資料錯誤，請致電客戶服務熱線。",
813 desc5: "煩請簽署下發確認簽收書以作為本公司記錄之用。",
814 label1: "保單編號",
815 label2: "產品名稱",
816 label3: "生效日期",
817 label4: "保單持有人",
818 label5: "受保人",
819 btn1: "下載電子保單",
820 btn2: "立即確認",
821 btn3: "稍後確認",
822 ymd1: "年",
823 ymd2: "月",
824 ymd3: "日",
825 tip1: "本人",
826 tip2: "現確認於",
827 tip3: "收托上述保單",
828 tip4: "我想聯絡客服"
806 } 829 }
807 } 830 }
......
...@@ -805,5 +805,28 @@ module.exports = { ...@@ -805,5 +805,28 @@ module.exports = {
805 publishAt: "发布时间", 805 publishAt: "发布时间",
806 readers: "阅读人数", 806 readers: "阅读人数",
807 per: "人" 807 per: "人"
808 },
809 vhis: {
810 title: "保单确认书",
811 desc1: "多谢阁下投保平安人寿保险产品。",
812 desc2: "保单已经承保，内附于此供阁下参考及保存。",
813 desc3: "保单是重要档，请即查阅其内容准确性，",
814 desc4: "如有任何遗漏档或资料错误，请致电客户服务热线。",
815 desc5: "烦请签署下发确认签收书以作为本公司记录只用。",
816 label1: "保单编号",
817 label2: "产品名称",
818 label3: "生效日期",
819 label4: "保单持有人",
820 label5: "受保人",
821 btn1: "下载电子保单",
822 btn2: "立即确认",
823 btn3: "稍后确认",
824 ymd1: "年",
825 ymd2: "月",
826 ymd3: "日",
827 tip1: "本人",
828 tip2: "现确认于",
829 tip3: "受托上述保单",
830 tip4: "我想联络客服"
808 } 831 }
809 } 832 }
......
1
2 import { mapState } from "vuex";
3 import api from '@/api/api'
4 import {
5 httpGet,
6 httpPost
7 } from '@/api/fetch-api.js'
8
9 export default {
10 data() {
11 return {
12 showPolicy: true,
13 key: 'value',
14 hadLoadPolicy: false,
15 ignorePolicyCodes: [],
16 // 显示
17 policyDetail: null
18 }
19 },
20 components: {},
21 computed: {
22 ...mapState({
23 userInfo: state => state.userInfo,
24 policyList: state => state.policyList
25 })
26 },
27 methods: {
28 initData() {
29 if (this.isLogin() && !this.hadLoadPolicy) {
30 this.ignorePolicyCodes = [];
31 let temp = sessionStorage.getItem("ignorePolicyCodes");
32 if (temp) {
33 try {
34 JSON.parse(temp).forEach(element => {
35 this.ignorePolicyCodes.push(element);
36 });
37 } catch (e) {
38
39 }
40 }
41 httpPost({ url: api.policyList, sid: true }).then(res => {
42 this.hadLoadPolicy = true;
43 if (!res || res.length == 0) {
44 } else {
45 this.$store.commit("CACHE_POLICY_LIST", res);
46 this.checkIfShowPolicy();
47 }
48 }).catch(e => {
49 });
50 } else {
51 this.checkIfShowPolicy();
52 }
53 },
54 // 检查是否需要显示policyModal
55 checkIfShowPolicy() {
56 this.policyDetail = null;
57 if (this.policyList) {
58 for (let index = 0; index < this.policyList.length; index++) {
59 let policy = this.policyList[index];
60 if (policy.checkFlag == "Y") {
61 continue;
62 }
63 if (this.ignorePolicyCodes.indexOf(policy.policyCode) >= 0) {
64 continue;
65 }
66 this.initPolicyForShow(policy);
67 break;
68 }
69 }
70 },
71 initPolicyForShow(policy) {
72 let params = {
73 policyId: policy.policyId,
74 policyCode: policy.policyCode
75 };
76 httpPost({ url: api.policyDetail, sid: true, data: params }).then(res => {
77 this.policyDetail = res;
78 this.policyDetail.ymd1 = "";
79 this.policyDetail.ymd2 = "";
80 this.policyDetail.ymd3 = "";
81
82 let now = new Date();
83 let y = now.getFullYear();
84 let m = now.getMonth() + 1;
85 let d = now.getDate();
86
87 if (this.$i18n.locale == 'en') {
88 this.policyDetail.nowYmd1 = m > 10 ? m : "0" + m;
89 this.policyDetail.nowYmd2 = d > 10 ? d : "0" + d;
90 this.policyDetail.nowYmd3 = y;
91 } else {
92 this.policyDetail.nowYmd1 = y;
93 this.policyDetail.nowYmd2 = m > 10 ? m : "0" + m;
94 this.policyDetail.nowYmd3 = d > 10 ? d : "0" + d;
95 }
96
97 if (this.policyDetail.activeDate) {
98 let ymds = this.policyDetail.activeDate.split(" ")[0].split("-");
99 if (this.$i18n.locale == 'en') {
100 this.policyDetail.ymd1 = ymds[1];
101 this.policyDetail.ymd2 = ymds[2];
102 this.policyDetail.ymd3 = ymds[0];
103 } else {
104 this.policyDetail.ymd1 = ymds[0];
105 this.policyDetail.ymd2 = ymds[1];
106 this.policyDetail.ymd3 = ymds[2];
107 }
108 }
109 }).catch(err => {
110
111 });
112 },
113 // 确认保单按钮
114 handleConfirmPolicy() {
115 if (this.policyDetail) {
116 let policyCode = this.policyDetail.policyCode;
117 this.ignorePolicyCodes.push(policyCode);
118 sessionStorage.setItem("ignorePolicyCodes", JSON.stringify(this.ignorePolicyCodes));
119 this.checkIfShowPolicy();
120
121 let params = {
122 policyCode: policyCode
123 };
124 // 回销
125 httpPost({ url: api.policyReceipt, sid: true, data: params }).then(res => {
126
127 }).catch(e => {
128
129 });
130
131 }
132 },
133 // 忽略保单按钮
134 handleIgnorePolicy() {
135 console.log(this.policyDetail);
136 if (this.policyDetail) {
137 this.ignorePolicyCodes.push(this.policyDetail.policyCode);
138 sessionStorage.setItem("ignorePolicyCodes", JSON.stringify(this.ignorePolicyCodes));
139 this.checkIfShowPolicy();
140 }
141 },
142 onOverLayHandler() {
143 this.showPolicy = false;
144 },
145 toContact() {
146 this.showPolicy = false;
147 this.$router.push({
148 path: "/custom/service?q=m1"
149 });
150 },
151 loginAction() {
152 this.showPolicy = true;
153 this.initData();
154 },
155 logoutAction() {
156 this.showPolicy = false;
157 this.hadLoadPolicy = false;
158 this.policyDetail = null;
159 this.ignorePolicyCodes = [];
160 sessionStorage.removeItem("ignorePolicyCodes");
161 },
162 isLogin() {
163 return this.userInfo && this.userInfo.sid;
164 }
165 },
166 mounted() {
167
168 },
169 created() {
170 this.initData();
171 },
172 watch: {
173 userInfo(val) {
174 if (val && val.name) {
175 this.loginAction();
176 } else {
177 this.logoutAction();
178 }
179 }
180 },
181 }
1 @import '@/styles/_support';
2
3 .comp {
4 position: fixed;
5 top: 0;
6 left: 0;
7 z-index: 999;
8 width: 100%;
9 height: 100%;
10 @extend .fcc;
11 text-align: center;
12 }
13
14 .overlay {
15 position: absolute;
16 top: 0;
17 left: 0;
18 width: 100%;
19 height: 100%;
20 background: rgba($color: #000000, $alpha: 0.7);
21 }
22
23
24 .orange {
25 color: $cOrange;
26 }
27
28
29 .modal {
30 position: relative;
31 @extend .bb;
32 width: 63.333333rem;
33 // height: 28.5rem;
34 border-radius: .8333rem;
35 background-color: #ffffff;
36 padding: 4.5rem 3rem 2.5rem;
37 border: .083333rem solid $cOrange;
38
39 .title {
40 font-size: 1.5rem ;
41 color: $cOrange;
42 }
43
44 .content {
45 width: 70%;
46 margin: auto;
47 }
48
49 .desc {
50 text-align: left;
51 line-height: 2.2rem ;
52 min-width: 7.5rem ;
53
54 span {
55 margin: 0 .166667rem ;
56 }
57 }
58
59 .value {
60 text-align: left;
61 line-height: 2rem ;
62 }
63
64 hr {
65 border-top: 1px solid #e4e4e5;
66 width: 70%;
67 margin: auto;
68 }
69
70 .download-btn {
71 cursor: pointer;
72 border: 1px solid $cOrange;
73 border-radius: .416667rem;
74 padding: .5rem;
75 margin: 2rem auto;
76 width: 35rem;
77
78 img {
79 max-height: 2.083333rem;
80 }
81
82 .btn-name {
83 margin-left: 1.666667rem ;
84 }
85 }
86
87 .flex-center {
88 display: flex;
89 justify-items: center;
90 align-items: center;
91 }
92
93 .default-mt {
94 margin-top: 3.2rem;
95 }
96
97 .half-mt {
98 margin-top: 1rem;
99 }
100
101 .submit-btn {
102 background: url("~@assets/images/vhis/vhis-btn.png");
103 background-size: 100% 100%;
104 background-repeat: no-repeat;
105 width: 14rem;
106 height: 2rem;
107 line-height: 2rem;
108 color: white;
109 font-weight: 600;
110 cursor: pointer;
111 }
112
113 .btn-margin {
114 margin-left: 2rem !important;
115 }
116 }
117
118 .flex-left {
119 display: flex;
120 justify-content: flex-start;
121 align-items: flex-start;
122 }
123
124 .hide {
125 display: none;
126 }
127
128 @media (max-width: 1200px) {
129 .comp {
130 position: fixed;
131 }
132
133 .modal {
134 width: 70%;
135 position: absolute;
136
137 .content {
138 width: 80%;
139 margin: auto;
140 }
141
142
143 .download-btn{
144 width: 80%;
145 }
146
147 .default-mt {
148 margin-top: 2rem;
149 }
150
151 .half-mt {
152 margin-top: 1rem;
153 }
154
155 hr {
156 border-top: 1px solid #e4e4e5;
157 width: 80%;
158 margin: auto;
159 }
160 }
161
162
163 }
164
165
166 @media (max-width: 768px) {
167 .modal {
168 // height: 28.5rem;
169 padding: 3rem 1.5rem;
170 width: 80%;
171 height: auto;
172
173 .content {
174 width: 90%;
175 margin: auto;
176 }
177
178 .download-btn {
179 margin: 1rem auto;
180 width: 90%;
181 }
182
183 hr {
184 border-top: 1px solid #e4e4e5;
185 width: 90% ;
186 margin: auto;
187 }
188
189 .default-mt {
190 margin-top: 1.5rem ;
191 }
192
193 .download-btn{
194 width: 100%;
195 }
196
197 .submit-btn {
198 background-size: 100% 100% ;
199 width: 10rem ;
200 }
201
202 .btn-margin {
203 margin-left: 1.666667rem ;
204 }
205 }
206 }
207
208
209 @media (max-width: 400px) {
210 .modal {
211 // height: 28.5rem;
212 padding: 3rem 1.5rem;
213 width: 90%;
214 height: auto;
215
216 .content {
217 width: 100%;
218 margin: auto;
219 }
220
221 .download-btn {
222 margin: 1rem auto;
223 width: 100%;
224 }
225
226 hr {
227 border-top: 1px solid #e4e4e5;
228 width: 100% ;
229 margin: auto;
230 }
231
232 .default-mt {
233 margin-top: 1.5rem ;
234 }
235
236
237 .submit-btn {
238 background-size: 100% 100% ;
239 width: 10rem ;
240 }
241
242 .btn-margin {
243 margin-left: 1.666667rem ;
244 }
245 }
246 }
...\ No newline at end of file ...\ No newline at end of file
1
2 <template>
3 <div class="comp" v-if="policyDetail && showPolicy">
4 <div @click="onOverLayHandler()" class="overlay"></div>
5 <div class="modal">
6 <div class="title">{{$t('vhis.title')}}</div>
7 <div class="content default-mt">
8 <div class="desc orange">{{$t('vhis.desc1')}}</div>
9 <div class="desc">{{$t('vhis.desc2')}}</div>
10 <div class="desc">{{$t('vhis.desc3')}}</div>
11 <div class="desc">{{$t('vhis.desc4')}}</div>
12 <div class="desc">{{$t('vhis.desc5')}}</div>
13 </div>
14 <hr class="default-mt">
15 <div class="content default-mt">
16 <div class="flex-left"><div class="desc">{{$t('vhis.label1')}}：</div><div class="value orange">{{policyDetail.policyCode}}</div></div>
17 <div class="flex-left"><div class="desc">{{$t('vhis.label2')}}：</div><div class="value">{{policyDetail.productName}}</div></div>
18 <div class="flex-left"><div class="desc">{{$t('vhis.label3')}}：</div><div class="value"><span class="orange">{{policyDetail.ymd1}}</span>{{$t('vhis.ymd1')}}<span class="orange">{{policyDetail.ymd2}}</span>{{$t('vhis.ymd2')}}<span class="orange">{{policyDetail.ymd2}}</span>{{$t('vhis.ymd3')}}</div></div>
19 <div class="flex-left"><div class="desc">{{$t('vhis.label4')}}：</div><div class="value">{{policyDetail.clientNameCn}}</div></div>
20 <div class="flex-left"><div class="desc">{{$t('vhis.label5')}}：</div><div class="value">{{policyDetail.insuredNameCn}}</div></div>
21
22 <div class="download-btn flex-center"><img src="@/assets/images/vhis/vhis-download.png"><span class="btn-name">{{$t('vhis.btn1')}}</span></div>
23 </div>
24 <hr class="default-mt">
25 <div class="content default-mt">
26 <span class="desc">{{$t('vhis.tip1')}}<span class="orange">{{policyDetail.clientNameCn}}</span>{{$t('vhis.tip2')}}<span class="orange">{{policyDetail.nowYmd1}}</span>{{$t('vhis.ymd1')}}<span class="orange">{{policyDetail.nowYmd2}}</span>{{$t('vhis.ymd2')}}<span class="orange">{{policyDetail.nowYmd3}}</span>{{$t('vhis.ymd3')}}{{$t('vhis.tip3')}}</span>
27 <div class="flex-center half-mt">
28 <div class="submit-btn" @click="handleConfirmPolicy" >{{$t('vhis.btn2')}}</div>
29 <div class="submit-btn btn-margin" @click="handleIgnorePolicy" >{{$t('vhis.btn3')}}</div>
30 </div>
31 <div class="flex-center half-mt pointer" @click="toContact()"><span class="orange bold">{{$t('vhis.tip4')}}</span></div>
32 </div>
33 </div>
34 </div>
35 </template>
36
37 <script src="./vhis-modal.js"></script>
38 <style lang="scss" scoped>
39 @import "./vhis-modal.scss";
40 </style>
...@@ -70,13 +70,13 @@ export default { ...@@ -70,13 +70,13 @@ export default {
70 return i18n.infomationImprove.candidates.idType; 70 return i18n.infomationImprove.candidates.idType;
71 }, 71 },
72 nationList() { 72 nationList() {
73 return getNationsList(); 73 return getNationsList(this.$i18n.locale);
74 }, 74 },
75 marryList() { 75 marryList() {
76 return getMarryList(); 76 return getMarryList();
77 }, 77 },
78 policyIdTypeList() { 78 policyIdTypeList() {
79 return getPolicyIdTypeList(); 79 return getPolicyIdTypeList(this.$i18n.locale);
80 } 80 }
81 }, 81 },
82 methods: { 82 methods: {
......
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
40 <div class="icon"><img src="@/assets/images/policy-change-information/icon-pci-info.png"></div>{{$t('policyChangeInformation.sex')}} 40 <div class="icon"><img src="@/assets/images/policy-change-information/icon-pci-info.png"></div>{{$t('policyChangeInformation.sex')}}
41 </div> 41 </div>
42 <div class="fla"> 42 <div class="fla">
43 <div class="icon icon2"><img src="@/assets/images/policy-change-information/icon-pci-notice.png"></div> 43 <span class="icon icon2"><img src="@/assets/images/policy-change-information/icon-pci-notice.png"></span>
44 <span class="t1">{{$t('policyChangeInformation.modifyTips1')}}</span>&nbsp; 44 <span class="t1">{{$t('policyChangeInformation.modifyTips1')}}</span>&nbsp;
45 <span class="t2" @click="toContactUs()">{{$t('policyChangeInformation.modifyTips2')}}</span> 45 <span class="t2" @click="toContactUs()">{{$t('policyChangeInformation.modifyTips2')}}</span>
46 </div> 46 </div>
......