Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
0b5e6d57 by simon
Options

保单查询修改

1 parent f91f43a5
Inline Side-by-side
Showing 4 changed files with 72 additions and 39 deletions
......@@ -36,6 +36,7 @@ export default {
this.dataForm = null;
httpPost({ url: api.policyDetail, sid: true, data: submitData }).then(res => {
this.dataForm = res;
console.log("this.dataForm:",this.dataForm.productCode)
if (this.dataForm.clientNameCn) {
......
@import '@/styles/_support.scss';
@import "@/styles/_support.scss";
.container{
.container {
// font-size: 18px;
}
......@@ -52,7 +52,8 @@
cursor: pointer;
width: 12px;
height: 8px;
background: url("~@/assets/images/insurance-query/triangle-down.png") no-repeat center center;
background: url("~@/assets/images/insurance-query/triangle-down.png")
no-repeat center center;
background-size: 100% 100%;
}
......@@ -64,9 +65,7 @@
}
.table-content {
height: auto;
// display: inline-block;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
border-left: solid 1px #f2f2f2;
......@@ -77,6 +76,49 @@
transition: max-height ease-out 0.3s !important;
overflow: scroll;
.cell {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
height: 50px;
border-bottom: solid 1px #f2f2f2;
.label span {
color: $cOrange;
margin-left: 7px;
cursor: pointer;
text-decoration: underline;
}
&:last-child(){
border-bottom: none;
}
&:nth-last-child(2){
border-bottom: none;
}
&:nth-child(odd) {
padding-right: 10px;
}
&:nth-child(even) {
padding-left: 10px;
}
&:nth-child(odd):after {
content: "";
background-color: #f2f2f2;
position: absolute;
top: 10px;
right: 0;
height: 30px;
width: 1px;
}
}
.cell1:nth-child(1){
text-align: right !important;
}
.data-line {
height: 50px;
margin: auto;
......@@ -114,7 +156,6 @@
}
}
.label span {
color: #f05a23;
margin-left: 7px;
......@@ -141,7 +182,6 @@
max-height: 0;
border-bottom: none;
}
}
.cell-between {
......@@ -156,7 +196,6 @@
}
}
}
}
.icon-download {
......@@ -201,4 +240,3 @@
// .table-content{
// -ms-overflow-style: none;
// }
......
......@@ -8,6 +8,8 @@
<!-- 保单详情 -->
<template v-if="dataForm">
<!-- 1 -->
<div class="cell-group">
<div class="table-header">
<div class="normal-header">
......@@ -15,79 +17,65 @@
<div class="guide" :class="{rotate180 : !insuranceForm.f1}" @click="insuranceForm.f1 = !insuranceForm.f1"></div>
</div>
</div>
<div class="table-content" :class="{hide : !insuranceForm.f1}">
<div class="data-line">
<div class="cell1">
<div class="gird-g table-content flw" :class="{hide : !insuranceForm.f1}">
<div class="pure-u-1-2 pure-u-md-1-2 cell">
<div class="label">{{$t('customService.insuranceQuery.t2n1')}}</div>
<div class="label">{{formatPolicyName(dataForm.productCode, dataForm.productName)}}</div>
</div>
<div class="separator-v"></div>
<div class="cell1">
<div class="pure-u-1-2 pure-u-md-1-2 cell">
<div class="label">{{$t('customService.insuranceQuery.t2n2')}}</div>
<div class="label">{{dataForm.moneyMark}} {{formatMoney(dataForm.amount,0)}}</div>
</div>
</div>
<div class="separator-h"></div>
<div class="data-line">
<div class="cell1">
<div class="pure-u-1-2 pure-u-md-1-2 cell" v-if="dataForm.productCode == 'WLPAR01' || dataForm.productCode == 'WLPAR02'">
<div class="label">{{$t('customService.insuranceQuery.t2n9k')}}</div>
<div class="label">{{$t('customService.insuranceQuery.t2n9v')}}</div>
</div>
<div class="separator-v"></div>
<div class="cell1">
<div class="pure-u-1-2 pure-u-md-1-2 cell">
<div class="label">{{$t('customService.insuranceQuery.t2n3')}}</div>
<div class="label">{{dataForm.activeDate?dataForm.activeDate.split(" ")[0]:""}}</div>
</div>
</div>
<div class="separator-h"></div>
<div class="data-line">
<div class="cell1">
<div class="pure-u-1-2 pure-u-md-1-2 cell">
<div class="label">{{$t('customService.insuranceQuery.t2n4')}}</div>
<div class="label">{{formatInsuredPeriod(dataForm.periodType,dataForm.periodValue)}}</div>
</div>
<div class="separator-v"></div>
<div class="cell1">
<div class="pure-u-1-2 pure-u-md-1-2 cell">
<div class="label">{{$t('customService.insuranceQuery.t2n5')}}
<span @click="toModifyPage(1)">{{$t('customService.insuranceQuery.modify')}}</span>
</div>
<div class="label">{{dataForm.insuredNameCn}}</div>
</div>
</div>
<div class="separator-h"></div>
<div class="data-line">
<div class="cell1">
<div class="pure-u-1-2 pure-u-md-1-2 cell">
<div class="label">{{$t('customService.insuranceQuery.t2n6')}}
<span @click="toModifyPage(1)">{{$t('customService.insuranceQuery.modify')}}</span>
</div>
<div class="label">{{dataForm.insuredNameEn}}</div>
</div>
<div class="separator-v"></div>
<div class="cell1">
<div class="pure-u-1-2 pure-u-md-1-2 cell">
<div class="label">{{$t('customService.insuranceQuery.t2n7')}}</div>
<div class="label">{{dataForm.insuredBirthday?dataForm.insuredBirthday.split(" ")[0]:""}}</div>
</div>
</div>
<div class="separator-h"></div>
<div class="data-line">
<div class="cell1">
<div class="pure-u-1-2 pure-u-md-1-2 cell">
<div class="label">{{$t('customService.insuranceQuery.t2n8')}}
<span @click="toModifyPage(1)">{{$t('customService.insuranceQuery.modify')}}</span>
</div>
<div class="label">{{dataForm.insuredIdNumber}}</div>
</div>
<div class="separator-v"></div>
<div class="cell1">
<!-- 为了凑正对 -->
<div class="pure-u-1-2 pure-u-md-1-2 cell" v-if="dataForm.productCode == 'WLPAR01' || dataForm.productCode == 'WLPAR02'">
<div class="label"></div>
<div class="label"></div>
</div>
</div>
</div>
</div>
<!-- 2 -->
<div class="cell-group">
<div class="table-header">
<div class="normal-header">
......@@ -161,6 +149,7 @@
</div>
</div>
<!-- 3 -->
<div class="cell-group cell-between">
<div class="table-header">
<div class="normal-header">
......
......@@ -8,6 +8,11 @@
display: flex;
}
.flw {
display: flex;
flex-wrap: wrap;
}
.flc {
display: flex;
justify-content: center;
......