Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
81f4f819 by simon
Options

默认提交

1 parent 821eb3e0
Expand all
Inline Side-by-side
Showing 6 changed files with 123 additions and 58 deletions
......@@ -810,6 +810,7 @@ module.exports = {
},
vhis: {
title: "保單確認書",
titleAft:"（由保單持有人確認）",
desc1: "多謝閣下投保平安人壽保險產品。",
desc2: "保單已經承保，內附于此供閣下參考及保存。",
desc3: "保單是重要檔，請即查閱其內容準確性，",
......
......@@ -24,7 +24,10 @@ export default {
...mapState({
userInfo: state => state.userInfo,
policyList: state => state.policyList
})
}),
locale() {
return this.$i18n.locale || 'tc';
},
},
methods: {
initData() {
......@@ -101,8 +104,11 @@ export default {
let d = now.getDate();
if (this.$i18n.locale == 'en') {
this.policyDetail.nowYmd1 = m > 10 ? m : "0" + m;
this.policyDetail.nowYmd2 = d > 10 ? d : "0" + d;
// this.policyDetail.nowYmd1 = m > 10 ? m : "0" + m;
// this.policyDetail.nowYmd2 = d > 10 ? d : "0" + d;
// this.policyDetail.nowYmd3 = y;
this.policyDetail.nowYmd2 = m > 10 ? m : "0" + m;
this.policyDetail.nowYmd1 = d > 10 ? d : "0" + d;
this.policyDetail.nowYmd3 = y;
} else {
this.policyDetail.nowYmd1 = y;
......
......@@ -22,7 +22,6 @@
.bold {
font-weight: 600;
letter-spacing: .083333rem;
}
.orange {
......@@ -42,30 +41,30 @@
position: relative;
@extend .bb;
width: 1200px;
max-height: 80vh;
max-height: 84vh;
border-radius: 16px;
background-color: #ffffff;
padding: 80px 0;
font-size: 36px;
padding: 88px 0;
font-size: 22px;
overflow-x: hidden;
overflow-y: auto;
color: $cFontGray2;
.content {
max-width: 1000px;
max-width: 800px;
margin: 0 auto;
}
.statement {
@extend .bb;
padding-left: 40px;
margin: 80px auto 0;
padding-left: 92px;
margin: 50px auto 0;
}
.form {
@extend .bb;
padding-left: 40px;
margin: 80px auto 0;
padding-left: 92px;
margin: 50px auto 0;
&-item {
display: flex;
......@@ -74,11 +73,20 @@
}
.bottom-wrap {
margin: 80px auto 0;
margin: 50px auto 0;
.notice {
letter-spacing: 2.2px;
font-size: 0;
span {
font-size: 22px;
}
}
}
.title {
font-size: 48px;
font-size: 36px;
color: $cOrange2;
font-weight: bold;
letter-spacing: 2.45px;
......@@ -86,8 +94,9 @@
.desc {
text-align: left;
line-height: 1.5;
line-height: 1.82;
letter-spacing: 3.6px;
@extend .text-jtf;
span {
margin: 0 2px;
......@@ -95,14 +104,29 @@
}
.value {
flex: 1;
text-align: left;
line-height: 1.5;
line-height: 1.82;
letter-spacing: 3.6px;
font-size: 0;
span {
font-size: 22px;
}
}
.ltz{
letter-spacing: 0;
}
.ltr-zero {
@extend .ltz;
text-align: justify;
text-align-last: left;
}
.line1 {
margin: 80px auto 0;
margin: 50px auto 0;
}
......@@ -115,15 +139,15 @@
.download {
margin: 44px auto 0;
text-align: center;
font-size: 28px;
&-item {
@extend .bb;
@extend .fcc;
margin: 0 auto 24px;
max-width: 738px;
height: 81px;
line-height: 81px;
max-width: 602px;
height: 67px;
line-height: 67px;
padding: 2px;
border-radius: 8px;
cursor: pointer;
......@@ -142,8 +166,8 @@
border-radius: 8px;
.icon {
height: 60px;
margin-right: 64px;
height: 47px;
margin-right: 52px;
}
}
......@@ -165,7 +189,7 @@
}
.btn-wrap {
margin: 40px auto 0;
margin: 50px auto 0;
display: flex;
justify-content: center;
}
......@@ -174,23 +198,21 @@
background: url("~@assets/images/vhis/vhis-btn.png");
background-size: 100% 100%;
background-repeat: no-repeat;
width: 405px;
height: 60px;
line-height: 60px;
width: 300px;
height: 50px;
line-height: 50px;
color: #ffffff;
font-weight: bold;
cursor: pointer;
letter-spacing: 1.4px;
font-size: 28px;
letter-spacing: 1.1px;
margin: 0 25px;
}
.contact {
font-size: 28px;
margin: 45px auto 0;
margin: 50px auto 0;
font-weight: bold;
span{
span {
text-decoration: underline;
}
}
......@@ -258,6 +280,11 @@
@media (max-width: 768px) {
.close {
right: -15px;
top: -40px;
}
.border {
.modal {
......@@ -274,16 +301,29 @@
.form {
margin: 24px auto 0;
.value {
span {
font-size: 18px;
}
}
}
.bottom-wrap {
margin: 24px auto 0;
.notice {
span {
font-size: 18px;
}
}
.btn-wrap {
margin: 16px auto 0;
flex-wrap: wrap;
.submit-btn{
.submit-btn {
height: 48px;
line-height: 48px;
font-size: 18px;
......@@ -291,7 +331,7 @@
}
}
.contact{
.contact {
margin: 16px auto 0;
font-size: 18px;
}
......
......@@ -6,56 +6,74 @@
<div class="close" @click="onOverLayHandler()"><img src="@/assets/images/vhis/close.png"></div>
<div class="modal">
<div class="content">
<div class="title">{{$t('vhis.title')}}</div>
<div class="title">{{$t('vhis.title')}}{{$t('vhis.titleAft')}}</div>
<div class="statement">
<div class="desc orange">{{$t('vhis.desc1')}}</div>
<div class="desc">{{$t('vhis.desc2')}}</div>
<div class="desc">{{$t('vhis.desc3')}}</div>
<div class="desc">{{$t('vhis.desc4')}}</div>
<div class="desc">{{$t('vhis.desc5')}}</div>
<div class="desc orange" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.desc1')}}</div>
<div class="desc" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.desc2')}}</div>
<div class="desc" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.desc3')}}</div>
<div class="desc" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.desc4')}}</div>
<div class="desc" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.desc5')}}</div>
</div>
<hr class="line1">
<div class="form ">
<div class="form-item">
<div class="desc">{{$t('vhis.label1')}}：</div>
<div class="value orange">{{policyDetail.policyCode}}</div>
<div class="desc" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.label1')}}：</div>
<div class="value orange">
<span>{{policyDetail.policyCode}}</span>
</div>
</div>
<div class="form-item">
<div class="desc">{{$t('vhis.label2')}}：</div>
<div class="value orange">{{policyDetail.productName}}</div>
<div class="desc" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.label2')}}：</div>
<div class="value orange">
<span>{{policyDetail.productName}}</span>
</div>
</div>
<div class="form-item">
<div class="desc">{{$t('vhis.label3')}}：</div>
<div class="desc" :class="{'ltr-zero':locale == 'en'}">{{$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')}}
<span class="orange">{{policyDetail.ymd1}}</span>
<span>{{$t('vhis.ymd1')}}</span>
<span class="orange">{{policyDetail.ymd2}}</span>
<span>{{$t('vhis.ymd2')}}</span>
<span class="orange">{{policyDetail.ymd3}}</span>
<span>{{$t('vhis.ymd3')}}</span>
</div>
</div>
<div class="form-item">
<div class="desc">{{$t('vhis.label4')}}：</div>
<div class="value orange">{{policyDetail.clientNameCn}}</div>
<div class="desc" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.label4')}}：</div>
<div class="value orange">
<span>{{policyDetail.clientNameCn}}</span>
</div>
</div>
<div class="form-item">
<div class="desc">{{$t('vhis.label5')}}：</div>
<div class="value orange">{{policyDetail.insuredNameCn}}</div>
<div class="desc" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.label5')}}：</div>
<div class="value orange">
<span>{{policyDetail.insuredNameCn}}</span>
</div>
</div>
<div class="download">
<div class="border2 download-item" @click="downloadPolicy">
<div class="cont">
<img class="icon" src="@/assets/images/vhis/vhis-download.png"> {{$t('vhis.btn1')}}
<img class="icon" src="@/assets/images/vhis/vhis-download.png">
<span class="t1">{{$t('vhis.btn1')}}</span>
</div>
</div>
</div>
</div>
<hr class="line1">
<div class="bottom-wrap ">
<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>
<span class="notice">
<span>{{$t('vhis.tip1')}}</span>
<span class="orange">{{policyDetail.clientNameCn}}</span>
<span>{{$t('vhis.tip2')}}</span>
<span class="orange">{{policyDetail.nowYmd1}}</span>
<span>{{$t('vhis.ymd1')}}</span>
<span class="orange">{{policyDetail.nowYmd2}}</span>
<span>{{$t('vhis.ymd2')}}</span>
<span class="orange">{{policyDetail.nowYmd3}}</span>
<span>{{$t('vhis.ymd3')}}{{$t('vhis.tip3')}}</span>
</span>
<div class="btn-wrap">
<div class="submit-btn" @click="handleConfirmPolicy">{{$t('vhis.btn2')}}</div>
<div class="submit-btn " @click="handleIgnorePolicy">{{$t('vhis.btn3')}}</div>
......