报价单中显示驾意险的详情

src/views/insurancePolicy/index.vue

@@ -973,7 +973,7 @@
                                     :value="item.value"></el-option>
                                 </el-select>
                                 <span v-if="props.row.kindName == '乘客责任险'">*{{ insurancePolicyForm.seatCount - 1
-                                  }}/座</span>
+                                }}/座</span>
                               </div>
                             </template>
                           </el-table-column>
@@ -1045,7 +1045,7 @@
                           <el-table-column label="产品名称" prop="productName" align="center">
                             <template #default="props">
                               <el-button link type="primary" @click="getJYXDetail(props.row)">{{ props.row.productName
-                                }}</el-button>
+                              }}</el-button>
                             </template>
                           </el-table-column>
                           <el-table-column label="数量" align="center">
@@ -1098,12 +1098,12 @@
                             <div class="Factor-item flex a-c f-c ">
                               <span class="item-header flex a-c ">交强续保</span>
                               <span>{{ ['', '新保', '续保', '转保'][Number(scope.row.quoteResult?.scoreVo?.jqRenewal)] || '--'
-                              }}</span>
+                                }}</span>
                             </div>
                             <div class="Factor-item flex a-c f-c ">
                               <span class="item-header flex a-c ">商业续保</span>
                               <span>{{ ['', '新保', '续保', '转保'][Number(scope.row.quoteResult?.scoreVo?.syRenewal)] || '--'
-                              }}</span>
+                                }}</span>
                             </div>
                             <div class="Factor-item flex a-c f-c ">
                               <span class="item-header flex a-c ">总折扣率</span>
@@ -4004,9 +4004,7 @@ const filterKind = (row, key) => {
 const quotationRef = ref(null)
 const quotationObj = ref({})
 const handleQuotationView = (obj) => {
-  quotationObj.value = obj
-  insurancePolicyForm.value.vehicleUseName = optionObj.value.vehicle_use_code.find(a => a.value === insurancePolicyForm.value.vehicleUseCode)?.label
-  quotationRef.value.show(obj)
+  quotationRef.value.show(obj.quoteResult.ordersNo)
 }
 
 // 组件挂载后执行初始化操作

src/views/insurancePolicy/modules/quotation.vue

@@ -4,8 +4,8 @@
     <el-dialog v-model="dialogFormVisible" :close-on-click-modal="false" :show-close="false" width="1200" top="40px">
       <template #header="{ titleId, titleClass }">
       </template>
-      <div class="max-h-[calc(100vh-140px)] overflow-y-auto">
-        <div class="content font-size-16px color-[#000] line-height-[1] p-24px">
+      <div class="max-h-[calc(100vh-140px)] min-h-500px overflow-y-auto" v-loading="dialogFormLoading">
+        <div class="content font-size-16px color-[#000] line-height-[1] p-24px" v-if="!dialogFormLoading">
           <div class="flex justify-center flex-col items-center">
             <img class="w-[48px] h-[48px]" :src="quotationObj.logo" />
             <div class="font-size-[24px]">{{ quotationObj.nameSimple }}</div>
@@ -34,12 +34,16 @@
                 <template v-if="!row.total">
                   <div
                     class="w-[calc(50%-0px)] h-full min-h-[38px] p-[8px] flex items-center b-r-(1px solid #DDDDDD) b-b-(1px solid #DDDDDD)">
-                    {{ row.title }}</div>
+                    {{ row.title }}
+                    <div class="color-[#666] m-l-20px" v-if="row.jyxBlames">
+                      <div v-for="blame in row.jyxBlames" :key="blame.id">{{ blame.blame }}({{ blame.blameCoverage }})*{{ blame.blamePremium }}</div>
+                    </div>
+                  </div>
                   <div
-                    class="w-[calc(50%-160px)] h-full min-h-[38px] p-[8px] flex items-center b-r-(1px solid #DDDDDD) b-b-(1px solid #DDDDDD)">
+                    class="w-[calc(50%-160px)] min-h-[38px] p-[8px] flex items-center b-r-(1px solid #DDDDDD) b-b-(1px solid #DDDDDD)">
                     {{ row.amount }}</div>
                   <div
-                    class="w-[160px] min-h-[38px] p-[8px_0] h-full flex justify-center items-center b-r-(1px solid #DDDDDD) b-b-(1px solid #DDDDDD)">
+                    class="w-[160px] min-h-[38px] p-[8px_0] flex justify-center items-center b-r-(1px solid #DDDDDD) b-b-(1px solid #DDDDDD)">
                     {{ row.premium }}</div>
                 </template>
                 <template v-if="row.total">
@@ -74,6 +78,7 @@
   </div>
 </template>
 <script setup lang="ts">
+import api from '@/api';
 import html2canvas from 'html2canvas';
 import QRCode from 'qrcode'
 import dayjs from "dayjs";
@@ -83,45 +88,48 @@ const props = defineProps<{
   insurancePolicyForm: object
 }>();
 
+const quotationObj=ref({})
+const insurancePolicyForm=ref({})
+
 const descriptionsData = computed(() => {
   return [
     [
-      { title: '投保人姓名/名称', value: props.insurancePolicyForm.name2, },
-      { title: '车主姓名/名称', value: props.insurancePolicyForm.name1, },
+      { title: '投保人姓名/名称', value: insurancePolicyForm.value.name2, },
+      { title: '车主姓名/名称', value: insurancePolicyForm.value.name1, },
     ], [
-      { title: '被保人姓名/名称', value: props.insurancePolicyForm.name3 },
-      { title: '车牌号', value: props.insurancePolicyForm.licenseNo },
+      { title: '被保人姓名/名称', value: insurancePolicyForm.value.name3 },
+      { title: '车牌号', value: insurancePolicyForm.value.licenseNo },
     ], [
-      { title: '车型名称', value: props.insurancePolicyForm.brandName },
+      { title: '车型名称', value: insurancePolicyForm.value.brandName },
     ], [
-      { title: '新车购置价(元)', value: props.insurancePolicyForm.purchasePrice },
-      { title: '座位数', value: props.insurancePolicyForm.seatCount },
+      { title: '新车购置价(元)', value: insurancePolicyForm.value.purchasePrice },
+      { title: '座位数', value: insurancePolicyForm.value.seatCount },
     ], [
-      { title: '发动机号、VIN码', value: props.insurancePolicyForm.engineNo + '、' + props.insurancePolicyForm.vinNo },
-      { title: '初登日期', value: props.insurancePolicyForm.registerDate },
+      { title: '发动机号、VIN码', value: insurancePolicyForm.value.engineNo + '、' + insurancePolicyForm.value.vinNo },
+      { title: '初登日期', value: insurancePolicyForm.value.registerDate },
     ], [
-      { title: '使用性质', value: props.insurancePolicyForm.vehicleUseName },
+      { title: '使用性质', value: insurancePolicyForm.value.vehicleUseName },
       {
-        title: '承保年数、出险次数', value: `商业险:期间内共出险${props.quotationObj.quoteResult?.scoreVo?.biClaims || 0}次<br>
-        交强险:期间内共出险${props.quotationObj.quoteResult?.scoreVo?.ciClaims || 0}次`
+        title: '承保年数、出险次数', value: `商业险:期间内共出险${quotationObj.value.quoteResult?.scoreVo?.biClaims || 0}次<br>
+        交强险:期间内共出险${quotationObj.value.quoteResult?.scoreVo?.ciClaims || 0}次`
       },
     ], [
-      { title: '商业险保险期限', value: props.insurancePolicyForm.SYStartDate + '至' + props.insurancePolicyForm.SYEndDate },
-      { title: '交强险保险期限', value: props.insurancePolicyForm.JQStartDate + '至' + props.insurancePolicyForm.JQEndDate },
+      { title: '商业险保险期限', value: insurancePolicyForm.value.SYStartDate + '至' + insurancePolicyForm.value.SYEndDate },
+      { title: '交强险保险期限', value: insurancePolicyForm.value.JQStartDate + '至' + insurancePolicyForm.value.JQEndDate },
     ],
   ]
 })
 
 const tableData = computed(() => {
   let arr = []
-  const quoteResult = props.quotationObj.quoteResult
+  const quoteResult = quotationObj.value.quoteResult
   if (quoteResult.kindInfoVo) {
     const kindArr = quoteResult.kindInfoVo.filter(v => v.kindCode !== "J1")
     for (let i = 0; i < kindArr.length; i++) {
       const element = kindArr[i];
       const obj = {
         title: element.kindName,
-        amount: element.kindCode === 'D4' ? element.amount + '*' + (props.insurancePolicyForm.seatCount - 1) : element.amount,
+        amount: element.kindCode === 'D4' ? element.amount + '*' + (insurancePolicyForm.value.seatCount - 1) : element.amount,
         premium: element.premium,
       }
       arr.push(obj)
@@ -130,7 +138,7 @@ const tableData = computed(() => {
   if (quoteResult?.costs?.biPremium) arr.push({ total: true, title: '商业险合计保费', premium: quoteResult.costs.biPremium })
   if (quoteResult?.costs?.ciPremium) arr.push({ total: true, title: '机动车交通事故责任强制保险', premium: quoteResult.costs.ciPremium })
   if (quoteResult?.costs?.vvTax) arr.push({ total: true, title: '车船税', premium: quoteResult.costs.vvTax })
-  const drivings = props.quotationObj.quoteResult?.accidentalDrivings ?? []
+  const drivings = quotationObj.value.quoteResult?.accidentalDrivings ?? []
   if (drivings.length > 0) {
     for (let i = 0; i < drivings.length; i++) {
       const element = drivings[i];
@@ -138,6 +146,7 @@ const tableData = computed(() => {
         title: element.productName,
         amount: element.quantity + '份',
         premium: element.premium,
+        jyxBlames: element.jyxBlames,
       }
       arr.push(obj)
     }
@@ -148,10 +157,51 @@ const tableData = computed(() => {
 })
 
 const dialogFormVisible = ref(false)
+const dialogFormLoading = ref(false)
+
+let optionObj = ref({
+  vehicle_use_code: [], // 车辆用途
+})
+const initOption = () => {
+  api.additionalApi.dictDetails('vehicle_use_code').then((res: any) => {
+    if (res.code == 200) {
+      if (res.data) {
+        optionObj.value['vehicle_use_code'] = res.data
+      }
+    }
+  })
+}
+initOption()
 
 const shareImageUrl = ref('')
-const show = async (obj) => {
+const show = async (orderNo) => {
+  dialogFormLoading.value = true
   dialogFormVisible.value = true
+
+  const { data } = await api.insurancePolicyApi.getOrderDetail(orderNo)
+  dialogFormLoading.value = false
+
+  quotationObj.value = {
+    ...data,
+    logo: data.insCompanyVo[0]?.logo,
+    nameSimple: data.insCompanyVo[0]?.nameSimple,
+    insurancePlanInfo: { drivings: data.accidentalDrivings },
+    quoteResult: data
+  }
+  const { carInfoVo, ownersInfo, policyHolderInfo, insuredPersonInfo, biRiskInfoVo, ciRiskInfoVo } = data
+  insurancePolicyForm.value = {
+    ...data,
+    name1: ownersInfo?.name,
+    name2: policyHolderInfo?.name,
+    name3: insuredPersonInfo?.name,
+    ...carInfoVo,
+    SYStartDate: biRiskInfoVo?.startDate,
+    SYEndDate: biRiskInfoVo?.endDate,
+    JQStartDate: ciRiskInfoVo?.startDate,
+    JQEndDate: ciRiskInfoVo?.endDate,
+  }
+  insurancePolicyForm.value.vehicleUseName = optionObj.value.vehicle_use_code.find(a => a.value === insurancePolicyForm.value.vehicleUseCode)?.label
+
   shareImageUrl.value = await QRCode.toDataURL(`https://tennat.baoxianzhanggui.com/test_h5/#/pages/quote/quoteRecordDetail?ordersNo=${obj.quoteResult?.ordersNo}&from=share`, {
     width: 160,
     margin: 2
@@ -159,7 +209,7 @@ const show = async (obj) => {
 }
 const savePoster = () => {
   html2canvas(document.querySelector(".content"), { useCORS: true }).then((canvas) => {
-    downloadBase64(canvas.toDataURL(), props.insurancePolicyForm.licenseNo + "报价单");
+    downloadBase64(canvas.toDataURL(), insurancePolicyForm.value.licenseNo + "报价单");
   });
 };
 

src/views/insurancePolicy/order.vue

@@ -742,49 +742,11 @@ const uploadStatus = (row: any) => {
   })
 }
 
-let optionObj = ref({
-  vehicle_use_code: [], // 车辆用途
-})
-const initOption = () => {
-  api.additionalApi.dictDetails('vehicle_use_code').then((res: any) => {
-    if (res.code == 200) {
-      if (res.data) {
-        optionObj.value['vehicle_use_code'] = res.data
-      }
-    }
-  })
-}
-initOption()
-const quotationObj = ref({})
-const insurancePolicyForm = ref({})
+
 const quotationRef = ref(null)
 // 订单批改
 const handleQuotationView = async (row: any) => {
-  row.loading = true
-  const { data } = await api.insurancePolicyApi.getOrderDetail(row.orderNo)
-  row.loading = false
-
-  quotationObj.value = {
-    ...data,
-    logo: data.insCompanyVo[0]?.logo,
-    nameSimple: data.insCompanyVo[0]?.nameSimple,
-    insurancePlanInfo: { drivings: data.accidentalDrivings },
-    quoteResult: data
-  }
-  const { carInfoVo, ownersInfo, policyHolderInfo, insuredPersonInfo, biRiskInfoVo, ciRiskInfoVo } = data
-  insurancePolicyForm.value = {
-    ...data,
-    name1: ownersInfo?.name,
-    name2: policyHolderInfo?.name,
-    name3: insuredPersonInfo?.name,
-    ...carInfoVo,
-    SYStartDate: biRiskInfoVo?.startDate,
-    SYEndDate: biRiskInfoVo?.endDate,
-    JQStartDate: ciRiskInfoVo?.startDate,
-    JQEndDate: ciRiskInfoVo?.endDate,
-  }
-  insurancePolicyForm.value.vehicleUseName = optionObj.value.vehicle_use_code.find(a => a.value === insurancePolicyForm.value.vehicleUseCode)?.label
-  quotationRef.value.show(quotationObj.value)
+  quotationRef.value.show(row.orderNo)
 }
 
 const getStateText = (d: any, v: any) => {