补录订单

src/views/additionalOrder/additional/index.vue

@@ -1232,7 +1232,9 @@
                     </template>
                   </el-table-column>
                   <el-table-column label="操作">
-                    <el-button link type="primary" icon="delete">删除</el-button>
+                    <template #default="scope">
+                      <el-button link type="primary" icon="delete" @click="handleDelete(scope.row)">删除</el-button>
+                    </template>
                   </el-table-column>
                 </el-table>
                 <el-popover :visible="insuranceShow" placement="bottom-start" :width="400" trigger="click">
@@ -1453,6 +1455,7 @@
                   </el-input>
                 </el-form-item>
               </el-col>
+
               <el-col :span="6">
                 <el-form-item label="驾意险保费" prop="jyPremium">
                   <el-input v-model="additionalForm.jyPremium" @input="autoSumPremium()" placeholder="请输入驾意险保费">
@@ -1463,6 +1466,7 @@
                 </el-form-item>
               </el-col>
 
+
               <el-col :span="6">
                 <el-form-item class="white-m-p24" label="商业险保单号" prop="syPolicyNo">
                   <el-input v-model="additionalForm.syPolicyNo" placeholder="请输入商业险保单号"></el-input>
@@ -1494,6 +1498,12 @@
                   </el-input>
                 </el-form-item>
               </el-col>
+              <el-col :span="6">
+                <el-form-item label="驾意险保单号"  class="white-m-p24">
+                  <el-input v-model="additionalForm.jyPolicyNo" placeholder="请输入驾意险保单号">
+                  </el-input>
+                </el-form-item>
+              </el-col>
             </el-row>
             <template #icon="{ isActive }">
               <span class="icon">
@@ -1602,7 +1612,7 @@
                 </el-upload>
                 <div class="fileInfo" v-else>
                   <img style="width: 40px; height: 40px"
-                    :src="jqPolicyName.includes('.png') || jqPolicyName.includes('.jpg') || jqPolicyName.includes('.jpeg') ? image : jqPolicyName.includes('.pdf') ? pdf : jqPolicyName.includes('.doc') || jqPolicyName.includes('.docx') ? word : ''" />
+                    :src="jqPolicyName.includes('.png') || jqPolicyName?.includes('.jpg') || jqPolicyName?.includes('.jpeg') ? image : jqPolicyName?.includes('.pdf') ? pdf : jqPolicyName.includes('.doc') || jqPolicyName.includes('.docx') ? word : ''" />
                   <div class="fileName">{{ jqPolicyName }}</div>
                   <div class="fileBtn">
                     <el-upload :auto-upload="false" :show-file-list="false" accept=".pdf"
@@ -1820,6 +1830,7 @@ import imageData from './modules/imageData.vue'
 import { gainFocus } from "@/utils/dataformat"
 
 import agreement from "@/api/modules/agreement.ts";
+import { id } from 'element-plus/es/locale/index.mjs'
 // import { Search } from '@element-plus/icons-vue'
 
 const myRouter = useRouter()
@@ -1968,7 +1979,7 @@ const handleSwitch = (type) => {
 
 let AdditionalFormRefs = ref()
 // 证件识别
-let additionalForm = ref({
+let  additionalForm = ref({
   // 车辆信息
   licenseNo: '', // 车牌
   vinNo: '', // 车牌识别代码
@@ -2065,6 +2076,7 @@ let additionalForm = ref({
   jqPremium: '',
   jyPremium: '',
   syPolicyNo: '',
+  jyPolicyNo: '',
   syRenewal: '',
   syPremium: '',
   sumPremium: '',
@@ -2515,6 +2527,10 @@ const noeYearPast = (time) => {
     Seconds;
   return datastr;
 }
+// 删除险种
+const handleDelete = (item) => {
+  insuranceData.value = insuranceData.value.filter(a => a.id !== item.id)
+}
 const oneYearPast1 = (time) => {
   //明年减一秒
   let date = new Date(time);
@@ -3648,6 +3664,7 @@ const handleSave = () => {
     jqPremium: additionalForm.value.jqPremium,
     jyPremium: additionalForm.value.jyPremium,
     syPolicyNo: additionalForm.value.syPolicyNo,
+    jyPolicyNo: additionalForm.value.jyPolicyNo,
     syRenewal: additionalForm.value.syRenewal,
     syPremium: additionalForm.value.syPremium,
     sumPremium: additionalForm.value.sumPremium,

src/views/additionalOrder/order/orderDetail.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="orderDetail">
-    <div class="state" v-if="dataDetail?.audit_status == 2">
+    <div class="state" v-if="dataDetail?.insOrders?.auditStatus == 2">
       <el-icon :size="20" style="color: red; margin: 3px 10px 0 0;">
         <CircleClose />
       </el-icon>
@@ -14,9 +14,12 @@
     <div class="userInfo">
       <el-row :gutter="20">
         <el-col :span="12" class="right">
-          <img class="userLogo" :src="car1"/>
-          <span class="userName">{{ dataDetail?.quoteNo }}</span>
-          <span class="userState">{{ dataDetail?.audit_status===0?'待审核':dataDetail?.audit_status===1?'已审核':dataDetail?.audit_status===2?'已驳回':'--' }}</span>
+          <img class="userLogo" :src="car1" />
+          <span class="userName">{{ dataDetail?.id }}</span>
+          <span class="userState">{{
+            dataDetail?.insOrders?.auditStatus === 0 ? '待审核' : dataDetail?.insOrders?.auditStatus === 1 ? '已审核' :
+              dataDetail?.insOrders?.auditStatus === 2 ? '已驳回' : '--'
+          }}</span>
         </el-col>
         <el-col :span="12" class="left">
           <el-button class="radius-2px" plain type="primary" @click="editDetail">编辑</el-button>
@@ -24,8 +27,9 @@
         </el-col>
       </el-row>
       <div class="tap">
-        <a class="anchor-item" :class="{'active': tapIndex===index}" v-for="(item, index) in taps" :href="`#${item.href}`" @click.prevent="handleTap(item, index)">
-          <img :src="tapIndex===index?item.active:item.img"/>
+        <a class="anchor-item" :class="{ 'active': tapIndex === index }" v-for="(item, index) in taps"
+          :href="`#${item.href}`" @click.prevent="handleTap(item, index)">
+          <img :src="tapIndex === index ? item.active : item.img" />
           {{ item.text }}
         </a>
       </div>
@@ -36,15 +40,15 @@
         <el-row :gutter="20">
           <el-col :span="6" class="col-m-b-16 item">
             <span class="name">保险公司：</span>
-            <span>{{ dataDetail?.insOrdersOtherInfo?.companyName || '--' }}</span>
+            <span>{{ dataDetail?.insOrders?.companyName || '--' }}</span>
           </el-col>
           <el-col :span="6" class="col-m-b-16 item">
             <span class="name">签单日期：</span>
-            <span>{{ dataDetail?.insOrdersOtherInfo?.signingTime || '--' }}</span>
+            <span>{{ dataDetail?.insOrders?.signingTime || '--' }}</span>
           </el-col>
           <el-col :span="6" class="col-m-b-16 item">
             <span class="name">评分：</span>
-            <span>{{ dataDetail?.insOrdersOtherInfo?.scope || '--' }}</span>
+            <span>{{ dataDetail?.insOrdersOtherInfo?.score || '--' }}</span>
           </el-col>
           <el-col :span="6" class="col-m-b-16 item">
             <span class="name">车船税：</span>
@@ -52,7 +56,7 @@
           </el-col>
           <el-col :span="6" class="col-m-b-16 item">
             <span class="name">交强险保单号：</span>
-            <span>{{ dataDetail?.insOrdersOtherInfo?.jqApplyNo || '--' }}</span>
+            <span>{{ dataDetail?.insOrdersOtherInfo?.jqPolicyNo || '--' }}</span>
           </el-col>
           <el-col :span="6" class="col-m-b-16 item">
             <span class="name">交强险续保：</span>
@@ -154,30 +158,49 @@
         <div class="title">险种信息</div>
         <el-row :gutter="20" style="margin-bottom: 16px">
           <el-col :span="14">
-            <el-table
-              :data="dataDetail?.insOrdersRiskList"
-              :span-method="typeSpanMethod"
-              border
-            >
-              <el-table-column label="类型"></el-table-column>
+            <el-table :data="dataDetail?.kindInfoVo" :span-method="objectSpanMethod" border>
+              <el-table-column label="名称" prop="kindName" width="100">
+                <template #default="scope">
+                  <span v-if="scope.row.kindCode === 'A'">交强险</span>
+                  <span v-else>商业险</span>
+                </template>
+              </el-table-column>
               <el-table-column label="时间">
-                <template #default="scope">{{ scope.row.startDate }}至{{ scope.row.endDate }}</template>
+                <template #default="scope">
+                  <span v-if="scope.row.kindCode === 'A'">
+                    {{ compulsoryInsuranceCategory?.startDate }}至{{ compulsoryInsuranceCategory?.endDate }}
+                  </span>
+                  <span v-else>
+                    {{ commercialInsuranceCategory?.startDate }}至{{ commercialInsuranceCategory?.endDate }}
+                  </span>
+                </template>
+              </el-table-column>
+              <el-table-column label="险种" prop="kindName"></el-table-column>
+              <el-table-column label="保额" prop="amount" width="100">
+                <template #default="scope">
+                  <span v-if="['A'].includes(scope.row.kindCode)" class="td">投保</span>
+                  <span v-else-if="['SY_FJ_YBW2'].includes(scope.row.kindCode)" class="td">{{
+                    convertedValue(scope.row.unitAmount) }}</span>
+                  <span v-else-if="['MJ1', 'MJ2', 'MJ3', 'MJ4'].includes(scope.row.kindCode)" class="td">{{
+                    scope.row.amount }}%</span>
+                  <span v-else-if="['TY1', 'TY2', 'TY3', 'TY4'].includes(scope.row.kindCode)" class="td">{{
+                    scope.row.serviceTimes }}次</span>
+                  <span v-else class="td">{{ convertedValue(scope.row.amount) }}</span>
+                </template>
               </el-table-column>
-              <el-table-column label="险种" prop="riskName"></el-table-column>
-              <el-table-column label="保额" prop="premium"></el-table-column>
             </el-table>
           </el-col>
           <el-col :span="10">
-            <el-table
-              :data="carData"
-              :span-method="carSpanMethod"
-              border
-              class="hiddenHeader"
-            >
-              <el-table-column label="" prop="a"></el-table-column>
-              <el-table-column label="" prop="b"></el-table-column>
-              <el-table-column label="" prop="c"></el-table-column>
-            </el-table>
+            <el-descriptions border :column="1" title="车船税" v-if="vehicleAndVesselTaxVo">
+              <el-descriptions-item v-if=" vehicleAndVesselTaxVo.taxRelifFlag == 2 || vehicleAndVesselTaxVo.taxRelifFlag == 3" label="减免税凭证号" label-class-name="my-content">{{vehicleAndVesselTaxVo.extendChar2}}</el-descriptions-item>
+              <el-descriptions-item v-if="vehicleAndVesselTaxVo.taxRelifFlag == 4"  label="完税凭证号" label-class-name="my-content">{{vehicleAndVesselTaxVo.paidFreeCertificate}}</el-descriptions-item>
+              <el-descriptions-item v-if="vehicleAndVesselTaxVo.taxRelifFlag == 2 || vehicleAndVesselTaxVo.taxRelifFlag == 3" label="减免税原因" label-class-name="my-content">{{vehicleAndVesselTaxVo.relifReason}}</el-descriptions-item>
+              <el-descriptions-item v-if="vehicleAndVesselTaxVo.taxRelifFlag == 3" label="减税比例" label-class-name="my-content">{{vehicleAndVesselTaxVo.taxRelief}}%</el-descriptions-item>
+              <el-descriptions-item v-if="vehicleAndVesselTaxVo.taxRelifFlag !=1" label="税务机关代码" label-class-name="my-content">{{vehicleAndVesselTaxVo.taxComCode}}</el-descriptions-item>
+              <el-descriptions-item v-if="vehicleAndVesselTaxVo.taxRelifFlag !=1" label="税务机关名称" label-class-name="my-content">{{vehicleAndVesselTaxVo.taxComName}}</el-descriptions-item>
+              <el-descriptions-item v-if="vehicleAndVesselTaxVo.taxRelifFlag ==4" label="完税凭证填发日期" label-class-name="my-content">{{vehicleAndVesselTaxVo.taxDocumentDate}}</el-descriptions-item>
+              <el-descriptions-item v-if="vehicleAndVesselTaxVo.taxRelifFlag ==4" label="完税凭证地区" label-class-name="my-content">{{vehicleAndVesselTaxVo.taxPaidAreaCode}}</el-descriptions-item>
+            </el-descriptions>
           </el-col>
         </el-row>
       </div>
@@ -268,8 +291,29 @@
             <el-tab-pane v-for="(item, index) in infoList" :label="item.label" :name="item.name">
               <el-row :gutter="10" class="list">
                 <el-col :span="4" class="list-item" v-for="sub in item.list">
-                  <img :src="sub.previewUrl"/>
-                  <div class="tips">{{ sub.imageType === 'C01'?'行驶证主页':sub.imageType === 'D01'?'行驶证副页':sub.imageType === 'TAR05'?'机动车辆登记证书':sub.imageType === 'XC00'?'新车合格证':sub.imageType === 'GC00'?'购车发票':sub.imageType === 'C02'?'车主身份证（正面）':sub.imageType === 'D02'?'车主身份证（反面）':sub.imageType === 'Y02'?'车主营业执照':sub.imageType === 'C03'?'投保人身份证（正面）':sub.imageType === 'D03'?'投保人身份证（反面） ':sub.imageType === 'Y03'?'投保人营业执照':sub.imageType === 'C04'?'被保人身份证（正面）':sub.imageType === 'D04'?'被保人身份证（反面）':sub.imageType === 'Y04'?'被保人营业执照':sub.imageType === 'GX00'?'关系证明':sub.imageType === 'C0500'?'验车照（车架）':sub.imageType === 'C0501'?'验车照（后左）':sub.imageType === 'C0502'?'验车照（后右）':sub.imageType === 'C0503'?'验车照（前右）':sub.imageType === 'C0504'?'验车照（前左）':sub.imageType === 'C0506'?'验车照（正前）':sub.imageType === 'C0507'?'验车照（正后）':sub.imageType === 'C0505'?'验车照（人车合影）':sub.imageType === 'C0508'?'验车照（地标合影）':sub.imageType === 'C0509'?'验车照（工作台）':sub.imageType === 'C0510'?'验车照（天窗）':sub.imageType === 'LAST_INSURANCE_POLICY'?'上年商业险保单':'--' }}</div>
+                  <img :src="sub.previewUrl" />
+                  <div class="tips">{{ sub.imageType === 'C01' ? '行驶证主页' : sub.imageType === 'D01' ? '行驶证副页' :
+                    sub.imageType
+                      ===
+                      'TAR05' ? '机动车辆登记证书' : sub.imageType === 'XC00' ? '新车合格证' : sub.imageType === 'GC00' ? '购车发票' :
+                        sub.imageType
+                          ===
+                          'C02' ? '车主身份证（正面）' : sub.imageType === 'D02' ? '车主身份证（反面）' : sub.imageType === 'Y02' ? '车主营业执照' :
+                            sub.imageType
+                              ===
+                              'C03' ? '投保人身份证（正面）' : sub.imageType === 'D03' ? '投保人身份证（反面） ' : sub.imageType ===
+                                'Y03' ? '投保人营业执照' : sub.imageType
+                                  === 'C04' ? '被保人身份证（正面）' : sub.imageType === 'D04' ? '被保人身份证（反面）' : sub.imageType ===
+                                    'Y04' ? '被保人营业执照' : sub.imageType === 'GX00' ? '关系证明' : sub.imageType === 'C0500' ? '验车照（车架）' :
+                                      sub.imageType
+                                        ===
+                                        'C0501' ? '验车照（后左）' : sub.imageType === 'C0502' ? '验车照（后右）' : sub.imageType ===
+                                          'C0503' ? '验车照（前右）' : sub.imageType
+                                            === 'C0504' ? '验车照（前左）' : sub.imageType === 'C0506' ? '验车照（正前）' : sub.imageType ===
+                                              'C0507' ? '验车照（正后）' : sub.imageType === 'C0505' ? '验车照（人车合影）' : sub.imageType ===
+                                                'C0508' ? '验车照（地标合影）' : sub.imageType === 'C0509' ? '验车照（工作台）' : sub.imageType ===
+                                                  'C0510' ? '验车照（天窗）' : sub.imageType
+                                                    === 'LAST_INSURANCE_POLICY' ? '上年商业险保单' : '--' }}</div>
                 </el-col>
               </el-row>
             </el-tab-pane>
@@ -281,15 +325,20 @@
             <el-col :span="6" v-for="(item, index) in fileList" :key="index">
               <p>{{ item.name }}</p>
               <div class="fileInfo">
-                <img style="width: 40px; height: 40px" :src="item.fileName.includes('.png') || item.fileName.includes('.jpg') || item.fileName.includes('.jpeg')?image:item.fileName.includes('.pdf')?pdf:item.fileName.includes('.doc') || item.fileName.includes('.docx')?word:''" />
+                <img style="width: 40px; height: 40px"
+                  :src="item.fileName?.includes('.png') || item.fileName?.includes('.jpg') || item.fileName?.includes('.jpeg') ? image : item.fileName?.includes('.pdf') ? pdf : item.fileName?.includes('.doc') || item.fileName?.includes('.docx') ? word : ''" />
                 <div class="fileName">{{ item.fileName }}</div>
                 <div class="fileBtn">
-<!--                  <el-upload :auto-upload="false"  :show-file-list="false" accept=".png, .jpg, .jpeg, .pdf, .doc, .docx" @change="uploadImage($event, 7)" style="display: flex; align-items: center">
+                  <!--                  <el-upload :auto-upload="false"  :show-file-list="false" accept=".png, .jpg, .jpeg, .pdf, .doc, .docx" @change="uploadImage($event, 7)" style="display: flex; align-items: center">
                     <el-icon class="btn-icon"><Upload /></el-icon>
                   </el-upload>-->
-                  <el-icon class="btn-icon" @click="imageView(item)"><View /></el-icon>
-                  <el-icon class="btn-icon" @click="download(item)"><Download /></el-icon>
-<!--                  <el-icon class="btn-icon" @click="deleteImage(7)"><Delete /></el-icon>-->
+                  <el-icon class="btn-icon" @click="imageView(item)">
+                    <View />
+                  </el-icon>
+                  <el-icon class="btn-icon" @click="download(item)">
+                    <Download />
+                  </el-icon>
+                  <!--                  <el-icon class="btn-icon" @click="deleteImage(7)"><Delete /></el-icon>-->
                 </div>
               </div>
             </el-col>
@@ -297,76 +346,61 @@
         </div>
       </div>
       <div id="line">
-          <div class="title">订单轨迹</div>
-          <el-table
-            :data="lineData"
-            height="300"
-          >
-              <el-table-column label="变更信息">
-                  <template #default="scope">
-                      {{ `${scope.row.createBy}：${scope.row.createTime}` }}
-                  </template>
-              </el-table-column>
-              <el-table-column prop="optContent" label="变更内容"></el-table-column>
-              <el-table-column prop="changeBefore" label="变更前">
-                  <template #default="scope">
-                      <span v-if="scope.row.changeBefore">{{ scope.row.changeBefore }}</span>
-                      <el-button v-else type="primary" link size="small" @click="viewDetail(scope.row)">查看明细</el-button>
-                  </template>
-              </el-table-column>
-              <el-table-column prop="changeAfter" label="变更后">
-                  <template #default="scope">
-                      <span v-if="scope.row.changeAfter">{{ scope.row.changeAfter }}</span>
-                      <el-button v-else type="primary" link size="small" @click="viewDetail(scope.row)">查看明细</el-button>
-                  </template>
-              </el-table-column>
-              <el-table-column prop="result" label="保司反馈"></el-table-column>
-          </el-table>
+        <div class="title">订单轨迹</div>
+        <el-table :data="lineData" height="300">
+          <el-table-column label="变更信息">
+            <template #default="scope">
+              {{ `${scope.row.createBy}：${scope.row.createTime}` }}
+            </template>
+          </el-table-column>
+          <el-table-column prop="optContent" label="变更内容"></el-table-column>
+          <el-table-column prop="changeBefore" label="变更前">
+            <template #default="scope">
+              <span v-if="scope.row.changeBefore">{{ scope.row.changeBefore }}</span>
+              <el-button v-else type="primary" link size="small" @click="viewDetail(scope.row)">查看明细</el-button>
+            </template>
+          </el-table-column>
+          <el-table-column prop="changeAfter" label="变更后">
+            <template #default="scope">
+              <span v-if="scope.row.changeAfter">{{ scope.row.changeAfter }}</span>
+              <el-button v-else type="primary" link size="small" @click="viewDetail(scope.row)">查看明细</el-button>
+            </template>
+          </el-table-column>
+          <el-table-column prop="result" label="保司反馈"></el-table-column>
+        </el-table>
       </div>
-        <div id="equities" style="margin-top: 10px;">
-            <div class="title">权益信息</div>
-            <el-table
-                    :data="equitiesData"
-                    height="300"
-            >
-                <el-table-column prop="a" label="权益名称"></el-table-column>
-                <el-table-column prop="a" label="权益类型"></el-table-column>
-                <el-table-column prop="a" label="接收人"></el-table-column>
-                <el-table-column prop="a" label="发放数量"></el-table-column>
-                <el-table-column prop="a" label="价格"></el-table-column>
-            </el-table>
-            <div class="total">
-                <div class="money">
-                    <div class="totalItem">
-                        <span>可用金额：</span>
-                        <span>{{ useMoney }}</span>
-                    </div>
-                    <div class="totalItem">
-                        <span>已使用：</span>
-                        <span>{{ usedMoney }}</span>
-                    </div>
-                    <div class="totalItem">
-                        <span>剩余金额：</span>
-                        <span style="color: #FF8C21">{{ lastMoney }}</span>
-                    </div>
-                </div>
+      <div id="equities" style="margin-top: 10px;">
+        <div class="title">权益信息</div>
+        <el-table :data="equitiesData" height="300">
+          <el-table-column prop="a" label="权益名称"></el-table-column>
+          <el-table-column prop="a" label="权益类型"></el-table-column>
+          <el-table-column prop="a" label="接收人"></el-table-column>
+          <el-table-column prop="a" label="发放数量"></el-table-column>
+          <el-table-column prop="a" label="价格"></el-table-column>
+        </el-table>
+        <div class="total">
+          <div class="money">
+            <div class="totalItem">
+              <span>可用金额：</span>
+              <span>{{ useMoney }}</span>
+            </div>
+            <div class="totalItem">
+              <span>已使用：</span>
+              <span>{{ usedMoney }}</span>
+            </div>
+            <div class="totalItem">
+              <span>剩余金额：</span>
+              <span style="color: #FF8C21">{{ lastMoney }}</span>
             </div>
+          </div>
         </div>
+      </div>
     </div>
-    <el-dialog
-      title="图片预览"
-      v-model="imageShow"
-    >
+    <el-dialog title="图片预览" v-model="imageShow">
       <img class="image-view" :src="imageUrl" />
     </el-dialog>
-    <el-dialog
-      title="文件预览"
-      v-model="fileShow"
-    >
-      <vue-office-docx
-        :src="fileUrl"
-        style="height: 600px; margin: 0; padding: 0"
-      ></vue-office-docx>
+    <el-dialog title="文件预览" v-model="fileShow">
+      <vue-office-docx :src="fileUrl" style="height: 600px; margin: 0; padding: 0"></vue-office-docx>
     </el-dialog>
   </div>
 </template>
@@ -396,7 +430,7 @@ import api from '@/api'
 
 import VueOfficeDocx from "@vue-office/docx";
 import { ElMessage } from "element-plus";
-
+import type { TableColumnCtx, valueEquals } from 'element-plus'
 const myRouter = useRouter()
 const myRoute = useRoute()
 
@@ -447,29 +481,29 @@ const taps = ref([
     active: ower2
   },
   {
-      text: '附件信息',
-      href: 'file',
-      img: file1,
-      active: file2
+    text: '附件信息',
+    href: 'file',
+    img: file1,
+    active: file2
   },
   {
-      text: '订单轨迹',
-      href: 'line',
-      img: file1,
-      active: file2
+    text: '订单轨迹',
+    href: 'line',
+    img: file1,
+    active: file2
   },
-    {
-        text: '权益信息',
-        href: 'equities',
-        img: equities2,
-        active: equities1
-    }
+  {
+    text: '权益信息',
+    href: 'equities',
+    img: equities2,
+    active: equities1
+  }
 ])
 const handleTap = (item, index) => {
   tapIndex.value = index
   const element = document.getElementById(`${item.href}`)
-  if(element) {
-    element.scrollIntoView({behavior: 'smooth'})
+  if (element) {
+    element.scrollIntoView({ behavior: 'smooth' })
   }
 }
 
@@ -480,7 +514,7 @@ let typeData = ref([
     b: 1,
     c: 1,
     d: 1
-  },{
+  }, {
     a: 1,
     b: 1,
     c: 1,
@@ -493,46 +527,54 @@ let carData = ref([
     b: 1,
     c: 2,
     d: 3
-  },{
+  }, {
     a: '车船税',
     b: 1,
     c: 2,
     d: 3
-  },{
+  }, {
     a: '车船税',
     b: 1,
     c: 2,
     d: 3
   },
 ])
-
-const typeSpanMethod = ({
+interface SpanMethodProps {
+  row: any
+  column: TableColumnCtx<any>
+  rowIndex: number
+  columnIndex: number
+}
+const objectSpanMethod = ({
   row,
   column,
   rowIndex,
-  columnIndex
-}) => {
-  if(columnIndex === 0) {
-    if(rowIndex === 1) {
-      return [typeData.value.length - 1, 1]
+  columnIndex,
+}: SpanMethodProps) => {
+  const totalRows = dataDetail.value?.kindInfoVo.length || 0;
+  if (columnIndex === 0) {
+    if (rowIndex === 0) {
+      return { rowspan: 1, colspan: 1 }
+    } else if (rowIndex === 1) {
+      // 从第2行到最后一行的行数 = 总行数 - 1
+      return { rowspan: totalRows - 1, colspan: 1 }
+    } else {
+      return { rowspan: 0, colspan: 0 }
     }
   }
-}
-const carSpanMethod = ({
-  row,
-  column,
-  rowIndex,
-  columnIndex
-}) => {
-  if(columnIndex === 0) {
-    if(rowIndex === 0) {
-      return [carData.value.length, 1]
+  if (columnIndex === 1) {
+    if (rowIndex === 0) {
+      return { rowspan: 1, colspan: 1 }
+    } else if (rowIndex === 1) {
+      // 从第2行到最后一行的行数 = 总行数 - 1
+      return { rowspan: totalRows - 1, colspan: 1 }
     } else {
-      return [0,0]
+      return { rowspan: 0, colspan: 0 }
     }
   }
 }
 
+
 // 影像资料
 let activeName = ref('car')
 let infoList = ref([
@@ -540,27 +582,27 @@ let infoList = ref([
     label: '车辆',
     name: 'car',
     list: []
-  },{
+  }, {
     label: '车主',
     name: 'ower',
     list: []
-  },{
+  }, {
     label: '投保人',
     name: 'insured',
     list: []
-  },{
+  }, {
     label: '被保人',
     name: 'person',
     list: []
-  },{
+  }, {
     label: '关系证明',
     name: 'relation',
     list: []
-  },{
+  }, {
     label: '验车照',
     name: 'photo',
     list: []
-  },{
+  }, {
     label: '上年商业险保单',
     name: 'policy',
     list: []
@@ -574,14 +616,14 @@ let imageUrl = ref('')
 let fileShow = ref(false)
 let fileUrl = ref('')
 const imageView = (item) => {
-  if(item.fileName.includes('.png') || item.fileName.includes('.jpg') || item.fileName.includes('.jpeg')) {
+  if (item.fileName.includes('.png') || item.fileName.includes('.jpg') || item.fileName.includes('.jpeg')) {
     imageShow.value = true
     imageUrl.value = item.fileName
   }
-  if(item.fileName.includes('.pdf')) {
+  if (item.fileName.includes('.pdf')) {
     window.open(item.fileName, '_blank')
   }
-  if(item.fileName.includes('.doc') || item.fileName.includes('.docx')) {
+  if (item.fileName.includes('.doc') || item.fileName.includes('.docx')) {
     fileShow.value = true
     nextTick(() => {
       filePreview(item.fileName)
@@ -620,18 +662,18 @@ const download = (item) => {
 // 订单轨迹
 let lineData = ref([])
 const initTrack = () => {
-    api.insurancePolicyApi.orderTrack({
-        orderNo: myRoute.query.id
-    }).then((res: any) => {
-        if(res.code == 200) {
-            lineData.value = res.data
-        } else {
-            ElMessage({
-                message: res.msg,
-                type: 'warning'
-            })
-        }
-    })
+  api.insurancePolicyApi.orderTrack({
+    orderNo: myRoute.query.id
+  }).then((res: any) => {
+    if (res.code == 200) {
+      lineData.value = res.data
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
 }
 
 // 权益
@@ -641,24 +683,42 @@ let usedMoney = ref(0)
 let lastMoney = ref(0)
 
 const viewDetail = (row) => {
-    myRouter.push({
-        name: 'InsurancePolicyViewDetail',
-        query: {
-            module: row.module,
-            subModule: row.subModule,
-            optType: row.optType,
-            createBy: row.createBy,
-            createTime: row.createTime,
-            content: row.optContent,
-            obj: row.result
-        }
-    })
+  myRouter.push({
+    name: 'InsurancePolicyViewDetail',
+    query: {
+      module: row.module,
+      subModule: row.subModule,
+      optType: row.optType,
+      createBy: row.createBy,
+      createTime: row.createTime,
+      content: row.optContent,
+      obj: row.result
+    }
+  })
+}//数字格式化
+const convertedValue = (num) => {
+  if (!num) {
+    return "-";
+  }
+  if (num < 10000) {
+    return num.toString();
+  } else if (num < 100000000) {
+    return (Math.floor(num / 10000 * 10) / 10) + '万';
+  } else {
+    return (Math.floor(num / 100000000 * 10) / 10) + '亿';
+  }
 }
-
+const vehicleAndVesselTaxVo = ref()//车船税
+const compulsoryInsuranceCategory = ref({})//强制险大类
+const commercialInsuranceCategory = ref({})//商业险大类
 const initDetail = () => {
   api.additionalApi.selectById(myRoute.query.id).then((res: any) => {
-    if(res.code == 200) {
-      dataDetail.value = res.data
+    if (res.code == 200) {
+      dataDetail.value = res.data;
+      vehicleAndVesselTaxVo.value = res.data?.vehicleAndVesselTaxVo || {}
+      console.log(vehicleAndVesselTaxVo.value)
+      compulsoryInsuranceCategory.value = res.data?.insOrdersRiskList?.find(a => a.riskCode == '0507') || {}
+      commercialInsuranceCategory.value = res.data?.insOrdersRiskList?.find(a => a.riskCode == '0510') || {}
       // 影像资料
       let car = infoList.value.find(a => a.name === 'car'),
         carType = ['C01', 'D01', 'TAR05', 'XC00', 'GC00'],
@@ -671,7 +731,7 @@ const initDetail = () => {
         relation = infoList.value.find(a => a.name === 'relation'),
         relationType = ['GX00'],
         photo = infoList.value.find(a => a.name === 'photo'),
-        photoType = ['C0500', 'C0501', 'C0502', 'C0503', 'C0504', 'C0505', 'C0506', 'C0507', 'C0508', 'C0509', 'C0510',  ],
+        photoType = ['C0500', 'C0501', 'C0502', 'C0503', 'C0504', 'C0505', 'C0506', 'C0507', 'C0508', 'C0509', 'C0510',],
         policy = infoList.value.find(a => a.name === 'policy'),
         policyType = ['LAST_INSURANCE_POLICY'],
         list = res.data?.imagesAdds?.images
@@ -698,13 +758,13 @@ const initDetail = () => {
         {
           name: '交强电子保单',
           fileName: dataDetail.value?.insOrdersExternalPolicy?.jqPolicyPreviewUrl
-        },{
+        }, {
           name: '商业电子保单',
           fileName: dataDetail.value?.insOrdersExternalPolicy?.syPolicyPreviewUrl
-        },{
+        }, {
           name: '驾意险电子保单',
           fileName: dataDetail.value?.insOrdersExternalPolicy?.noPolicyPreviewUrl
-        },{
+        }, {
           name: '交强险电子标志',
           fileName: dataDetail.value?.insOrdersExternalPolicy?.jqSignPreviewUrl
         }
@@ -725,13 +785,19 @@ onMounted(() => {
 })
 
 </script>
-
+<style></style>
 <style scoped lang="scss">
 @use "@/assets/styles/common/style";
-.orderDetail{
+
+:deep(.my-content) {
+  background: #fff !important;
+}
+
+.orderDetail {
   height: calc(100vh - 120px);
   overflow: hidden;
-  .state{
+
+  .state {
     border: 1px solid #FF4545;
     border-radius: 10px;
     padding: 10px 20px;
@@ -740,35 +806,42 @@ onMounted(() => {
     margin: 10px 24px;
     font-weight: 400;
     color: #333333;
-    h3{
+
+    h3 {
       font-size: 16px;
       margin: 0 0 10px;
-      color: rgba(0,0,0,.64);
+      color: rgba(0, 0, 0, .64);
     }
-    p{
+
+    p {
       font-size: 14px;
       margin: 10px 0;
     }
   }
-  .userInfo{
+
+  .userInfo {
     margin: 10px 24px;
     background: #FFFFFF;
     padding: 24px;
     border-radius: 6px;
-    .right{
+
+    .right {
       display: flex;
       align-items: center;
       justify-content: flex-start;
-      .userLogo{
+
+      .userLogo {
         width: 26px;
         height: 26px;
       }
-      .userName{
+
+      .userName {
         font-size: 16px;
         color: #333333;
         margin: 0 12px 0 16px;
       }
-      .userState{
+
+      .userState {
         padding: 2px 12px;
         border: 1px solid #FF8C21;
         background: #FFF4E9;
@@ -777,18 +850,21 @@ onMounted(() => {
         border-radius: 3px;
       }
     }
-    .left{
+
+    .left {
       display: flex;
       align-items: center;
       justify-content: flex-end;
     }
-    .tap{
+
+    .tap {
       width: 100%;
       display: flex;
       align-items: center;
       justify-content: space-between;
       margin: 10px 0 0;
-      .anchor-item{
+
+      .anchor-item {
         width: 12%;
         height: 44px;
         text-decoration: none;
@@ -800,45 +876,54 @@ onMounted(() => {
         border-radius: 4px;
         font-size: 18px;
         border: 1px solid #EEEEEE;
-        img{
+
+        img {
           width: 30px;
           height: 30px;
           margin-right: 5px;
         }
       }
-      .active{
+
+      .active {
         color: #FFFFFF;
-        background: linear-gradient( 91deg, #4FCAFF 0%, #2B62FF 100%);
+        background: linear-gradient(91deg, #4FCAFF 0%, #2B62FF 100%);
       }
     }
   }
-  .content{
+
+  .content {
     margin: 0 24px;
     height: calc(100% - 150px);
     background: #FFFFFF;
     border-radius: 6px;
     overflow-y: auto;
     padding: 24px;
-    .title{
+
+    .title {
       border-left: 4px solid #00a0f4;
       padding: 0 0 0 12px;
       margin-bottom: 16px;
     }
-    .item{
+
+    .item {
       color: #666666;
       font-size: 14px;
       display: flex;
-      .name{
+
+      .name {
         width: 120px;
       }
     }
-    .information{
+
+    .information {
       height: 280px;
       margin-bottom: 16px;
-      .list{
+
+      .list {
         height: 290px;
         overflow-y: auto;
-        .list-item{
+
+        .list-item {
           height: calc(50% - 12px);
           display: flex;
           align-items: center;
@@ -846,11 +931,13 @@ onMounted(() => {
           position: relative;
           margin: 0 0 12px;
           border-radius: 0 0 6px 6px;
-          img{
+
+          img {
             width: 100%;
             height: 130px;
             border-radius: 0 0 6px 6px;
           }
+
           .tips {
             position: absolute;
             left: 5px;
@@ -866,36 +953,42 @@ onMounted(() => {
         }
       }
     }
-    .fileList{
-      .fileInfo{
+
+    .fileList {
+      .fileInfo {
         display: flex;
         align-items: center;
         justify-content: flex-start;
         border: 1px solid #EEEEEE;
         border-radius: 4px;
         padding: 18px 24px;
-        .fileName{
+
+        .fileName {
           width: 200px;
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
         }
-        .fileBtn{
+
+        .fileBtn {
           display: flex;
           align-items: center;
-          .btn-icon{
+
+          .btn-icon {
             margin: 0 10px;
             font-size: 16px;
             cursor: pointer;
-            &:hover{
+
+            &:hover {
               color: #00a0f4;
             }
           }
         }
 
-        .file-box{
+        .file-box {
           position: relative;
-          .btn-top{
+
+          .btn-top {
             width: 100%;
             display: flex;
             align-items: center;
@@ -903,19 +996,22 @@ onMounted(() => {
             position: absolute;
             top: 0;
             left: 0;
-            .image-close{
+
+            .image-close {
               display: block;
               width: 12px;
               height: 12px;
             }
           }
-          .file-img{
+
+          .file-img {
             display: block;
             width: 208px;
             height: 130px;
             border-radius: 5px;
           }
-          .btn-bottom{
+
+          .btn-bottom {
             position: absolute;
             left: 0;
             bottom: 0;
@@ -926,7 +1022,8 @@ onMounted(() => {
             width: 100%;
             background: url("@/assets/images/btn-bg.png") no-repeat;
             background-size: 100% 100%;
-            .width-50{
+
+            .width-50 {
               width: 50%;
             }
           }
@@ -934,14 +1031,17 @@ onMounted(() => {
 
       }
     }
-    .total{
+
+    .total {
       display: flex;
       justify-content: flex-end;
       margin-top: 20px;
-      .money{
+
+      .money {
         width: 200px;
         margin-right: 30px;
-        .totalItem{
+
+        .totalItem {
           display: flex;
           align-items: center;
           justify-content: space-between;
@@ -949,6 +1049,7 @@ onMounted(() => {
       }
     }
   }
+
   :deep(.hiddenHeader .el-table__header-wrapper) {
     display: none;
   }