列表样式修改

src/views/additionalOrder/order/index.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="order">
-    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
-      <el-tab-pane name="first">
+  <PageMain class="vh100">
+    <el-tabs v-model="activeName" class="demo-tabs h-full" @tab-click="handleClick">
+      <el-tab-pane name="first" class="h-full">
         <template #label>
           待审核（{{ total1 }}）
         </template>
@@ -19,14 +19,15 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="业务员归属">
-                <el-cascader clearable v-model="form.salesmanCompany" style="width: 100%" :options="option" :props="tableProps"
-                @change="organizationChange" />
+                <el-cascader clearable v-model="form.salesmanCompany" style="width: 100%" :options="option"
+                  :props="tableProps" @change="organizationChange" />
               </el-form-item>
             </el-col>
             <el-col :span="8">
               <el-form-item label="保险公司">
-                <el-select v-model="form.companyId" placeholder="请选择" filterable clearable  >
-                    <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode" :label="item.name"></el-option>
+                <el-select v-model="form.companyId" placeholder="请选择" filterable clearable>
+                  <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode"
+                    :label="item.name"></el-option>
                 </el-select>
               </el-form-item>
             </el-col>
@@ -37,16 +38,9 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="录单时间">
-                <el-date-picker
-                  v-model="form.recordingTime"
-                  type="daterange"
-                  range-separator="至"
-                  start-placeholder="开始时间"
-                  end-placeholder="结束时间"
-                  format="YYYY-MM-DD"
-                  value-format="YYYY-MM-DD"
-                  @change="timeChange"
-                />
+                <el-date-picker v-model="form.recordingTime" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
+                  @change="timeChange" />
               </el-form-item>
             </el-col>
             <el-col :span="24" style="display: flex; justify-content: flex-end">
@@ -55,16 +49,12 @@
             </el-col>
           </el-row>
         </el-form>
-        <el-table
-          :data="tableData1"
-          style="margin-top: 24px"
-          hight="500"
-        >
+        <el-table :data="tableData1" style="margin-top: 10px" height="calc(100% - 184px)">
           <el-table-column label="订单号" prop="a" width="200">
             <template #default="scope">
               <el-button link type="primary" @click="handleDetail(scope.row)">{{ scope.row.id }}</el-button>
             </template>
-          </el-table-column  >
+          </el-table-column>
           <el-table-column label="业务员信息" prop="realQuoteUserName" width="120"></el-table-column>
           <el-table-column label="业务员归属" prop="salesmanCompany" width="120"></el-table-column>
           <el-table-column label="保险公司" prop="companyName" width="120"></el-table-column>
@@ -85,18 +75,12 @@
           </el-table-column>
         </el-table>
         <div class="pagination">
-          <el-pagination
-            v-model:current-page="pages"
-            v-model:page-size="size"
-            :page-sizes="[10, 20, 30, 40]"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="total1"
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-          ></el-pagination>
+          <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
+            layout="total, sizes, prev, pager, next, jumper" :total="total1" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-tab-pane>
-      <el-tab-pane name="second">
+      <el-tab-pane name="second" class="h-full">
         <template #label>
           审核通过（{{ total2 }}）
         </template>
@@ -114,19 +98,15 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="业务员归属">
-                <el-cascader
-                  clearable
-                  style="width: 100%"
-                  v-model="form.salesmanCompany"
-                  :options="option"
-                  :props="tableProps"
-                />
+                <el-cascader clearable style="width: 100%" v-model="form.salesmanCompany" :options="option"
+                  :props="tableProps" />
               </el-form-item>
             </el-col>
             <el-col :span="8">
               <el-form-item label="保险公司">
                 <el-select v-model="form.companyId" placeholder="请选择" filterable clearable>
-                    <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode" :label="item.name"></el-option>
+                  <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode"
+                    :label="item.name"></el-option>
                 </el-select>
               </el-form-item>
             </el-col>
@@ -137,22 +117,16 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="录单时间">
-                <el-date-picker
-                  v-model="form.recordingTime"
-                  type="daterange"
-                  range-separator="至"
-                  start-placeholder="开始时间"
-                  end-placeholder="结束时间"
-                  format="YYYY-MM-DD"
-                  value-format="YYYY-MM-DD"
-                  @change="timeChange"
-                />
+                <el-date-picker v-model="form.recordingTime" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
+                  @change="timeChange" />
               </el-form-item>
             </el-col>
             <el-col :span="8">
               <el-form-item label="批改状态">
                 <el-select v-model="form.adjustStatus" placeholder="请选择">
-                  <el-option v-for="item in dictData.ADJUST_STATUSDATA" :key="item.value" :value="item.value" :label="item.label"></el-option>
+                  <el-option v-for="item in dictData.ADJUST_STATUSDATA" :key="item.value" :value="item.value"
+                    :label="item.label"></el-option>
                 </el-select>
               </el-form-item>
             </el-col>
@@ -162,16 +136,12 @@
             </el-col>
           </el-row>
         </el-form>
-        <el-table
-          :data="tableData2"
-          style="margin-top: 24px"
-          hight="500"
-        >
+        <el-table :data="tableData2" style="margin-top: 10px" height="calc(100% - 202px)">
           <el-table-column label="订单号" prop="a" width="200">
             <template #default="scope">
               <el-button link type="primary" @click="handleDetail(scope.row)">{{ scope.row.quoteNo }}</el-button>
             </template>
-          </el-table-column  >
+          </el-table-column>
           <el-table-column label="业务员信息" prop="auditName" width="120"></el-table-column>
           <el-table-column label="业务员归属" prop="salesmanCompany" width="120"></el-table-column>
           <el-table-column label="保险公司" prop="companyName" width="120"></el-table-column>
@@ -182,12 +152,7 @@
           <el-table-column label="驾意险保费" prop="jyPremium" width="120"></el-table-column>
           <el-table-column label="保费总额" prop="sumPremium" width="120">
             <template #default="scope">
-              <el-tooltip
-                effect="dark"
-                content="红色保费是订单批改后的保费"
-                placement="top"
-                :disabled="!scope.row.adjustPremium"
-              >
+              <el-tooltip effect="dark" content="红色保费是订单批改后的保费" placement="top" :disabled="!scope.row.adjustPremium">
                 <span :style="{
                   color: !scope.row.adjustPremium ? 'inherit' : '#F56C6C'
                 }">{{ scope.row.adjustPremium || scope.row.sumPremium }}</span>
@@ -196,7 +161,8 @@
           </el-table-column>
           <el-table-column label="批改状态" prop="status" width="200">
             <template #default="scope">
-              <el-link type="primary" v-if="scope.row.adjustStatus" @click="openDetail(scope.row)">{{ getStateText(dictData.ADJUST_STATUSDATA, scope.row.adjustStatus) }}</el-link>
+              <el-link type="primary" v-if="scope.row.adjustStatus" @click="openDetail(scope.row)">{{
+                getStateText(dictData.ADJUST_STATUSDATA, scope.row.adjustStatus) }}</el-link>
               <span v-else>{{ getStateText(dictData.ADJUST_STATUSDATA, scope.row.adjustStatus) }}</span>
             </template>
           </el-table-column>
@@ -225,18 +191,12 @@
           </el-table-column>
         </el-table>
         <div class="pagination">
-          <el-pagination
-            v-model:current-page="pages"
-            v-model:page-size="size"
-            :page-sizes="[10, 20, 30, 40]"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="total2"
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-          ></el-pagination>
+          <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
+            layout="total, sizes, prev, pager, next, jumper" :total="total2" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-tab-pane>
-      <el-tab-pane name="third">
+      <el-tab-pane name="third" class="h-full">
         <template #label>
           审核不通过（{{ total3 }}）
         </template>
@@ -254,19 +214,15 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="业务员归属">
-                <el-cascader
-                  clearable
-                  style="width: 100%"
-                  v-model="form.salesmanCompany"
-                  :options="option"
-                  :props="tableProps"
-                />
+                <el-cascader clearable style="width: 100%" v-model="form.salesmanCompany" :options="option"
+                  :props="tableProps" />
               </el-form-item>
             </el-col>
             <el-col :span="8">
               <el-form-item label="保险公司">
                 <el-select v-model="form.companyId" placeholder="请选择" filterable clearable>
-                    <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode" :label="item.name"></el-option>
+                  <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode"
+                    :label="item.name"></el-option>
                 </el-select>
               </el-form-item>
             </el-col>
@@ -277,16 +233,9 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="录单时间">
-                <el-date-picker
-                  v-model="form.recordingTime"
-                  type="daterange"
-                  range-separator="至"
-                  start-placeholder="开始时间"
-                  end-placeholder="结束时间"
-                  format="YYYY-MM-DD"
-                  value-format="YYYY-MM-DD"
-                  @change="timeChange"
-                />
+                <el-date-picker v-model="form.recordingTime" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
+                  @change="timeChange" />
               </el-form-item>
             </el-col>
             <el-col :span="24" style="display: flex; justify-content: flex-end">
@@ -295,16 +244,12 @@
             </el-col>
           </el-row>
         </el-form>
-        <el-table
-          :data="tableData3"
-          style="margin-top: 24px"
-          height="500"
-        >
+        <el-table :data="tableData3" style="margin-top: 10px" height="calc(100% - 184px)">
           <el-table-column label="订单号" prop="a" width="200">
             <template #default="scope">
               <el-button link type="primary" @click="handleDetail(scope.row)">{{ scope.row.quoteNo }}</el-button>
             </template>
-          </el-table-column  >
+          </el-table-column>
           <el-table-column label="业务员信息" prop="realQuoteUserName" width="120"></el-table-column>
           <el-table-column label="业务员归属" prop="salesmanCompany" width="120"></el-table-column>
           <el-table-column label="保险公司" prop="companyName" width="120"></el-table-column>
@@ -325,22 +270,16 @@
           </el-table-column>
         </el-table>
         <div class="pagination">
-          <el-pagination
-            v-model:current-page="pages"
-            v-model:page-size="size"
-            :page-sizes="[10, 20, 30, 40]"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="total3"
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-          ></el-pagination>
+          <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
+            layout="total, sizes, prev, pager, next, jumper" :total="total3" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-tab-pane>
     </el-tabs>
     <!-- 批改 -->
     <DialogInsuranceEdit v-model="isEditVisible" :data="formData" />
     <DialogInsuranceCancel v-model="isCancelVisible" :data="formData" />
-  </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -435,11 +374,11 @@ const handleDel = (row: any) => {
     confirmButtonText: "确认",
     cancelButtonText: "取消",
     type: "warning",
-    center:true
+    center: true
   }).then((action) => {
-    if(action === 'confirm') {
+    if (action === 'confirm') {
       api.additionalApi.deleteById(row.id).then((res: any) => {
-        if(res.code == 200) {
+        if (res.code == 200) {
           ElMessage({
             message: res.msg,
             type: 'success'
@@ -499,8 +438,8 @@ const handleSizeChange = (size) => {
   }
 }
 const handleCurrentChange = (page) => {
-    pages.value = page
-    switch (type.value) {
+  pages.value = page
+  switch (type.value) {
     case 'first':
       initData(0)
       break;
@@ -526,21 +465,21 @@ const initData = (type) => {
     licenseNo: form.value.licenseNo,
     recordingTime: form.value.recordingTime
   }).then((res: any) => {
-    if(res.code == 200) {
-        switch (type) {
-            case 0:
-                tableData1.value = res.data.records
-                total1.value = res.data.total
-                break;
-            case 1:
-                tableData2.value = res.data.records
-                total2.value = res.data.total
-                break;
-            case 2:
-                tableData3.value = res.data.records
-                total3.value = res.data.total
-                break;
-        }
+    if (res.code == 200) {
+      switch (type) {
+        case 0:
+          tableData1.value = res.data.records
+          total1.value = res.data.total
+          break;
+        case 1:
+          tableData2.value = res.data.records
+          total2.value = res.data.total
+          break;
+        case 2:
+          tableData3.value = res.data.records
+          total3.value = res.data.total
+          break;
+      }
     } else {
       ElMessage({
         message: res.msg,
@@ -553,11 +492,11 @@ const initData = (type) => {
 // 获取保险公司
 let companyList = ref([])
 const initCompany = () => {
-    api.insuranceApi.leftList('').then(res => {
-        if(res.code == 200) {
-            companyList.value = res.data
-        }
-    })
+  api.insuranceApi.leftList('').then(res => {
+    if (res.code == 200) {
+      companyList.value = res.data
+    }
+  })
 }
 
 // 订单批改
@@ -566,7 +505,7 @@ const onClick = (type: any, row: any) => {
     type: type,
     orderNo: row.id,
   }).then((res: any) => {
-    if(res.code == 200) {
+    if (res.code == 200) {
       formData.value = {
         ...row,
         orderNo: row.id,
@@ -589,8 +528,8 @@ const onClick = (type: any, row: any) => {
 }
 
 const getStateText = (d: any, v: any) => {
-	let label = d.find((item: any) => item.value == v)?.label;
-	return label || '--';
+  let label = d.find((item: any) => item.value == v)?.label;
+  return label || '--';
 };
 
 // 批改记录
@@ -599,26 +538,19 @@ const openDetail = (e: any) => {
 };
 
 onMounted(() => {
-    initData(0);
-    initData(1);
-    initData(2);
-    initCompany();
-    institutionList();
+  initData(0);
+  initData(1);
+  initData(2);
+  initCompany();
+  institutionList();
 })
 </script>
 
 <style scoped lang="scss">
-.order{
-  width: 100%;
-  height: calc(100vh - 120px);
-  background: #FFFFFF;
-  padding: 24px;
-  overflow-y: auto;
-  .pagination{
-    margin-top: 24px;
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-  }
+.pagination {
+  margin-top: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
 }
 </style>

src/views/additionalOrder/temporarily/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="order">
+  <PageMain class="vh100">
     <el-form label-width="100" label-position="left" :model="form">
       <el-row :gutter="20">
         <el-col :span="8">
@@ -14,19 +14,15 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="业务员归属">
-            <el-cascader
-              clearable
-              style="width: 100%"
-              v-model="form.salesmanCompany"
-              :options="option"
-              :props="tableProps"
-            />
+            <el-cascader clearable style="width: 100%" v-model="form.salesmanCompany" :options="option"
+              :props="tableProps" />
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="保险公司">
             <el-select v-model="form.companyName" filterable placeholder="请选择">
-                <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode" :label="item.name"></el-option>
+              <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode"
+                :label="item.name"></el-option>
             </el-select>
           </el-form-item>
         </el-col>
@@ -37,16 +33,8 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="录单时间">
-            <el-date-picker
-              v-model="form.recordingTime"
-              type="daterange"
-              range-separator="至"
-              start-placeholder="开始时间"
-              end-placeholder="结束时间"
-              format="YYYY-MM-DD"
-              value-format="YYYY-MM-DD"
-              @change="timeChange"
-            />
+            <el-date-picker v-model="form.recordingTime" type="daterange" range-separator="至" start-placeholder="开始时间"
+              end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" @change="timeChange" />
           </el-form-item>
         </el-col>
         <el-col :span="24" style="display: flex; justify-content: flex-end">
@@ -55,15 +43,12 @@
         </el-col>
       </el-row>
     </el-form>
-    <el-table
-      :data="tableData"
-      style="margin-top: 24px"
-    >
+    <el-table :data="tableData" style="margin-top: 10px" height="calc(100% - 184px)">
       <el-table-column label="订单号" prop="a" width="200">
         <template #default="scope">
           <el-button link type="primary" @click="handleDetail(scope.row)">{{ scope.row.id }}</el-button>
         </template>
-      </el-table-column  >
+      </el-table-column>
       <el-table-column label="业务员信息" prop="realQuoteUserName" width="120"></el-table-column>
       <el-table-column label="业务员归属" prop="salesmanCompany" width="120"></el-table-column>
       <el-table-column label="保险公司" prop="companyName" width="120"></el-table-column>
@@ -83,17 +68,11 @@
       </el-table-column>
     </el-table>
     <div class="pagination">
-      <el-pagination
-        v-model:current-page="pages"
-        v-model:page-size="size"
-        :page-sizes="[10, 20, 30, 40]"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="total"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-      ></el-pagination>
+      <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
+        layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"></el-pagination>
     </div>
-  </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -148,11 +127,11 @@ const handleDel = (row) => {
     confirmButtonText: "确认",
     cancelButtonText: "取消",
     type: "warning",
-    center:true
+    center: true
   }).then((action) => {
-    if(action === 'confirm') {
+    if (action === 'confirm') {
       api.additionalApi.deleteById(row.id).then((res: any) => {
-        if(res.code == 200) {
+        if (res.code == 200) {
           ElMessage({
             message: res.msg,
             type: 'success'
@@ -195,7 +174,7 @@ const initData = () => {
     licenseNo: form.value.licenseNo,
     recordingTime: form.value.recordingTime
   }).then((res: any) => {
-    if(res.code == 200) {
+    if (res.code == 200) {
       tableData.value = res.data.records
       total.value = res.data.total
     } else {
@@ -210,32 +189,25 @@ const initData = () => {
 // 获取保险公司
 let companyList = ref([])
 const initCompany = () => {
-    api.insuranceApi.leftList('').then(res => {
-        if(res.code == 200) {
-            companyList.value = res.data
-        }
-    })
+  api.insuranceApi.leftList('').then(res => {
+    if (res.code == 200) {
+      companyList.value = res.data
+    }
+  })
 }
 
 onMounted(() => {
   initData();
-    initCompany();
+  initCompany();
 })
 
 </script>
 
 <style scoped lang="scss">
-.order{
-  width: 100%;
-  height: calc(100vh - 120px);
-  background: #FFFFFF;
-  padding: 24px;
-  overflow-y: auto;
-  .pagination{
-    margin-top: 24px;
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-  }
+.pagination {
+  margin-top: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
 }
 </style>

src/views/finance/index.vue

@@ -1,456 +1,383 @@
 <template>
-    <div class="finance">
-        <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
-            <el-tab-pane name="0">
-                <template #label>
-                    <el-badge :value="total1">
-                        <span>待审核</span>
-                    </el-badge>
-                </template>
-                <el-form v-model="firstForm" label-width="100">
-                    <el-row :gutter="20">
-                        <el-col :span="8">
-                            <el-form-item label="车牌号">
-                                <el-input v-model="firstForm.licenseNo" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="业务员类型">
-                                <el-select v-model="firstForm.attrType" placeholder="请选择" clearable>
-                                    <el-option label="团队" value="5"></el-option>
-                                    <el-option label="个代" value="6"></el-option>
-                                    <el-option label="渠道" value="7"></el-option>
-                                    <el-option label="电销组" value="8"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="业务员">
-                                <el-input v-model="firstForm.salesman" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="订单类型">
-                                <el-select v-model="firstForm.orderType" placeholder="请选择" clearable>
-                                    <el-option label="车险录入" value="1"></el-option>
-                                    <el-option label="代客录单" value="2"></el-option>
-                                    <el-option label="外部订单" value="3"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="保险公司">
-                                <el-select v-model="firstForm.companyId" placeholder="请选择" clearable>
-                                    <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode" :label="item.name"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="出单机构">
-                                <el-cascader
-                                    clearable
-                                    style="width: 100%"
-                                    v-model="firstForm.deptId"
-                                    :options="option"
-                                    :props="tableProps"
-                                ></el-cascader>
-                            </el-form-item>
-                        </el-col>
-                        <el-col v-show="isTrue" :span="8">
-                            <el-form-item label="被保人">
-                                <el-input v-model="firstForm.insurName" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col v-show="isTrue" :span="8">
-                            <el-form-item label="报价时间">
-                                <el-date-picker
-                                    v-model="firstForm.quotationTime"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始时间"
-                                    end-placeholder="结束时间"
-                                    format="YYYY-MM-DD"
-                                    value-format="YYYY-MM-DD"
-                                />
-                            </el-form-item>
-                        </el-col>
-                        <el-col v-show="isTrue" :span="8">
-                            <el-form-item label="签单时间">
-                                <el-date-picker
-                                    v-model="firstForm.signingTime"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始时间"
-                                    end-placeholder="结束时间"
-                                    format="YYYY-MM-DD"
-                                    value-format="YYYY-MM-DD"
-                                />
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="24" style="display: flex; align-items: center; justify-content: flex-end">
-                            <el-button type="primary" @click="handleSearch">搜索</el-button>
-                            <el-button plain @click="handleReset">重置</el-button>
-                            <span class="icon_s">
-                                <span @click="isTrue = !isTrue">高级搜索</span>
-                                <el-icon class="is_icon" :class="{ 'is_down': isTrue }"><ArrowDown /></el-icon>
-                            </span>
-                        </el-col>
-                    </el-row>
-                </el-form>
-                <el-table :data="firstData" style="width: 100%; margin-top: 20px;">
-                    <el-table-column prop="orderNo" label="订单号" width="120"></el-table-column>
-                    <el-table-column prop="companyName" label="保险公司" width="120"></el-table-column>
-                    <el-table-column prop="licenseNo" label="车牌号" width="120"></el-table-column>
-                    <el-table-column prop="insurName" label="被保人" width="120"></el-table-column>
-                    <el-table-column prop="orderType" label="订单类型" width="120"></el-table-column>
-                    <el-table-column prop="name" label="业务员信息" width="120"></el-table-column>
-                    <el-table-column prop="attrType" label="业务员类型" width="120"></el-table-column>
-                    <el-table-column prop="signingTime" label="签单时间" width="120"></el-table-column>
-                    <el-table-column prop="quotationTime" label="报价时间" width="120"></el-table-column>
-                    <el-table-column prop="dockingPerson" label="对接人" width="120"></el-table-column>
-                    <el-table-column prop="agreementName" label="出单协议" width="120"></el-table-column>
-                    <el-table-column prop="productName" label="险种" width="120"></el-table-column>
-                    <el-table-column prop="sumPremium" label="保费总计" width="120"></el-table-column>
-                    <el-table-column prop="equityAmount" label="权益金额" width="120"></el-table-column>
-                    <el-table-column prop="deptName" label="出单机构" width="120"></el-table-column>
-                    <el-table-column prop="createTime" label="录单时间" width="120"></el-table-column>
-                    <el-table-column prop="createBy" label="录单人" width="120"></el-table-column>
-                    <el-table-column prop="payTime" label="支付时间" width="120"></el-table-column>
-                    <el-table-column prop="jqPremium" label="交强险" width="120"></el-table-column>
-                    <el-table-column prop="syPremium" label="商业险" width="120"></el-table-column>
-                    <el-table-column prop="jyPremium" label="驾意险" width="120"></el-table-column>
-                    <el-table-column label="操作" fixed="right" width="200">
-                        <template #default="scope">
-                            <el-button link type="primary" size="small" @click="auditReceive(scope.row)">领取</el-button>
-                            <el-button link type="primary" size="small" @click="updateSigningTime(scope.row)">更新签单时间</el-button>
-                            <el-button link type="primary" size="small" @click="handleToDetail(scope)">详情</el-button>
-                        </template>
-                    </el-table-column>
-                </el-table>
-                <div class="pagination">
-                    <el-pagination
-                        v-model:current-page="pages"
-                        v-model:page-size="size"
-                        :page-sizes="[10, 20, 30, 40]"
-                        layout="total, sizes, prev, pager, next, jumper"
-                        :total="total1"
-                        @size-change="handleSizeChange"
-                        @current-change="handleCurrentChange"
-                    ></el-pagination>
-                </div>
-            </el-tab-pane>
-            <el-tab-pane name="1">
-                <template #label>
-                    <el-badge :value="total2">
-                        <span>审核通过</span>
-                    </el-badge>
-                </template>
-                <el-form v-model="firstForm" label-width="100">
-                    <el-row :gutter="20">
-                        <el-col :span="8">
-                            <el-form-item label="车牌号">
-                                <el-input v-model="firstForm.licenseNo" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="业务员类型">
-                                <el-select v-model="firstForm.attrType" placeholder="请选择" clearable>
-                                    <el-option label="团队" value="5"></el-option>
-                                    <el-option label="个代" value="6"></el-option>
-                                    <el-option label="渠道" value="7"></el-option>
-                                    <el-option label="电销组" value="8"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="业务员">
-                                <el-input v-model="firstForm.salesman" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="订单类型">
-                                <el-select v-model="firstForm.orderType" placeholder="请选择" clearable>
-                                    <el-option label="车险录入" value="1"></el-option>
-                                    <el-option label="代客录单" value="2"></el-option>
-                                    <el-option label="外部订单" value="3"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="保险公司">
-                                <el-select v-model="firstForm.companyId" placeholder="请选择" clearable>
-                                    <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode" :label="item.name"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="出单机构">
-                                <el-cascader
-                                    clearable
-                                    style="width: 100%"
-                                    v-model="firstForm.deptId"
-                                    :options="option"
-                                    :props="tableProps"
-                                ></el-cascader>
-                            </el-form-item>
-                        </el-col>
-                        <el-col v-show="isTrue" :span="8">
-                            <el-form-item label="被保人">
-                                <el-input v-model="firstForm.insurName" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col v-show="isTrue" :span="8">
-                            <el-form-item label="报价时间">
-                                <el-date-picker
-                                    v-model="firstForm.quotationTime"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始时间"
-                                    end-placeholder="结束时间"
-                                    format="YYYY-MM-DD"
-                                    value-format="YYYY-MM-DD"
-                                />
-                            </el-form-item>
-                        </el-col>
-                        <el-col v-show="isTrue" :span="8">
-                            <el-form-item label="签单时间">
-                                <el-date-picker
-                                    v-model="firstForm.signingTime"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始时间"
-                                    end-placeholder="结束时间"
-                                    format="YYYY-MM-DD"
-                                    value-format="YYYY-MM-DD"
-                                />
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="24" style="display: flex; align-items: center; justify-content: flex-end">
-                            <el-button type="primary" @click="handleSearch">搜索</el-button>
-                            <el-button plain @click="handleReset">重置</el-button>
-                            <span class="icon_s">
-                                <span @click="isTrue = !isTrue">高级搜索</span>
-                                <el-icon class="is_icon" :class="{ 'is_down': isTrue }"><ArrowDown /></el-icon>
-                            </span>
-                        </el-col>
-                    </el-row>
-                </el-form>
-                <el-table :data="secondData" style="width: 100%; margin-top: 20px;">
-                    <el-table-column prop="orderNo" label="订单号" width="120"></el-table-column>
-                    <el-table-column prop="companyName" label="保险公司" width="120"></el-table-column>
-                    <el-table-column prop="licenseNo" label="车牌号" width="120"></el-table-column>
-                    <el-table-column prop="insurName" label="被保人" width="120"></el-table-column>
-                    <el-table-column prop="orderType" label="订单类型" width="120"></el-table-column>
-                    <el-table-column prop="name" label="业务员信息" width="120"></el-table-column>
-                    <el-table-column prop="attrType" label="业务员类型" width="120"></el-table-column>
-                    <el-table-column prop="signingTime" label="签单时间" width="120"></el-table-column>
-                    <el-table-column prop="quotationTime" label="报价时间" width="120"></el-table-column>
-                    <el-table-column prop="dockingPerson" label="对接人" width="120"></el-table-column>
-                    <el-table-column prop="agreementName" label="出单协议" width="120"></el-table-column>
-                    <el-table-column prop="productName" label="险种" width="120"></el-table-column>
-                    <el-table-column prop="sumPremium" label="保费总计" width="120"></el-table-column>
-                    <el-table-column prop="equityAmount" label="权益金额" width="120"></el-table-column>
-                    <el-table-column prop="deptName" label="出单机构" width="120"></el-table-column>
-                    <el-table-column prop="createTime" label="录单时间" width="120"></el-table-column>
-                    <el-table-column prop="createBy" label="录单人" width="120"></el-table-column>
-                    <el-table-column prop="payTime" label="支付时间" width="120"></el-table-column>
-                    <el-table-column prop="jqPremium" label="交强险" width="120"></el-table-column>
-                    <el-table-column prop="syPremium" label="商业险" width="120"></el-table-column>
-                    <el-table-column prop="jyPremium" label="驾意险" width="120"></el-table-column>
-                    <el-table-column label="操作" fixed="right" width="150">
-                        <template #default="scope">
-<!--                            <el-button link type="primary" size="small" @click="auditReceive(scope.row)">领取</el-button>
+  <PageMain class="vh100">
+    <el-tabs v-model="activeName" class="demo-tabs h-full" @tab-click="handleClick">
+      <el-tab-pane name="0" class="h-full">
+        <template #label>
+          <el-badge :value="total1">
+            <span>待审核</span>
+          </el-badge>
+        </template>
+        <el-form v-model="firstForm" label-width="100">
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <el-form-item label="车牌号">
+                <el-input v-model="firstForm.licenseNo" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="业务员类型">
+                <el-select v-model="firstForm.attrType" placeholder="请选择" clearable>
+                  <el-option label="团队" value="5"></el-option>
+                  <el-option label="个代" value="6"></el-option>
+                  <el-option label="渠道" value="7"></el-option>
+                  <el-option label="电销组" value="8"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="业务员">
+                <el-input v-model="firstForm.salesman" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="订单类型">
+                <el-select v-model="firstForm.orderType" placeholder="请选择" clearable>
+                  <el-option label="车险录入" value="1"></el-option>
+                  <el-option label="代客录单" value="2"></el-option>
+                  <el-option label="外部订单" value="3"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="保险公司">
+                <el-select v-model="firstForm.companyId" placeholder="请选择" clearable>
+                  <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode"
+                    :label="item.name"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="出单机构">
+                <el-cascader clearable style="width: 100%" v-model="firstForm.deptId" :options="option"
+                  :props="tableProps"></el-cascader>
+              </el-form-item>
+            </el-col>
+            <el-col v-show="isTrue" :span="8">
+              <el-form-item label="被保人">
+                <el-input v-model="firstForm.insurName" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col v-show="isTrue" :span="8">
+              <el-form-item label="报价时间">
+                <el-date-picker v-model="firstForm.quotationTime" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+              </el-form-item>
+            </el-col>
+            <el-col v-show="isTrue" :span="8">
+              <el-form-item label="签单时间">
+                <el-date-picker v-model="firstForm.signingTime" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="24" style="display: flex; align-items: center; justify-content: flex-end">
+              <el-button type="primary" @click="handleSearch">搜索</el-button>
+              <el-button plain @click="handleReset">重置</el-button>
+              <span class="icon_s">
+                <span @click="isTrue = !isTrue">高级搜索</span>
+                <el-icon class="is_icon" :class="{ 'is_down': isTrue }">
+                  <ArrowDown />
+                </el-icon>
+              </span>
+            </el-col>
+          </el-row>
+        </el-form>
+        <el-table :data="firstData" :height="isTrue?'calc(100% - 246px)':'calc(100% - 196px)'" style="width: 100%; margin-top: 20px;">
+          <el-table-column prop="orderNo" label="订单号" width="120"></el-table-column>
+          <el-table-column prop="companyName" label="保险公司" width="120"></el-table-column>
+          <el-table-column prop="licenseNo" label="车牌号" width="120"></el-table-column>
+          <el-table-column prop="insurName" label="被保人" width="120"></el-table-column>
+          <el-table-column prop="orderType" label="订单类型" width="120"></el-table-column>
+          <el-table-column prop="name" label="业务员信息" width="120"></el-table-column>
+          <el-table-column prop="attrType" label="业务员类型" width="120"></el-table-column>
+          <el-table-column prop="signingTime" label="签单时间" width="120"></el-table-column>
+          <el-table-column prop="quotationTime" label="报价时间" width="120"></el-table-column>
+          <el-table-column prop="dockingPerson" label="对接人" width="120"></el-table-column>
+          <el-table-column prop="agreementName" label="出单协议" width="120"></el-table-column>
+          <el-table-column prop="productName" label="险种" width="120"></el-table-column>
+          <el-table-column prop="sumPremium" label="保费总计" width="120"></el-table-column>
+          <el-table-column prop="equityAmount" label="权益金额" width="120"></el-table-column>
+          <el-table-column prop="deptName" label="出单机构" width="120"></el-table-column>
+          <el-table-column prop="createTime" label="录单时间" width="120"></el-table-column>
+          <el-table-column prop="createBy" label="录单人" width="120"></el-table-column>
+          <el-table-column prop="payTime" label="支付时间" width="120"></el-table-column>
+          <el-table-column prop="jqPremium" label="交强险" width="120"></el-table-column>
+          <el-table-column prop="syPremium" label="商业险" width="120"></el-table-column>
+          <el-table-column prop="jyPremium" label="驾意险" width="120"></el-table-column>
+          <el-table-column label="操作" fixed="right" width="200">
+            <template #default="scope">
+              <el-button link type="primary" size="small" @click="auditReceive(scope.row)">领取</el-button>
+              <el-button link type="primary" size="small" @click="updateSigningTime(scope.row)">更新签单时间</el-button>
+              <el-button link type="primary" size="small" @click="handleToDetail(scope)">详情</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="pagination">
+          <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
+            layout="total, sizes, prev, pager, next, jumper" :total="total1" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane name="1" class="h-full">
+        <template #label>
+          <el-badge :value="total2">
+            <span>审核通过</span>
+          </el-badge>
+        </template>
+        <el-form v-model="firstForm" label-width="100">
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <el-form-item label="车牌号">
+                <el-input v-model="firstForm.licenseNo" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="业务员类型">
+                <el-select v-model="firstForm.attrType" placeholder="请选择" clearable>
+                  <el-option label="团队" value="5"></el-option>
+                  <el-option label="个代" value="6"></el-option>
+                  <el-option label="渠道" value="7"></el-option>
+                  <el-option label="电销组" value="8"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="业务员">
+                <el-input v-model="firstForm.salesman" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="订单类型">
+                <el-select v-model="firstForm.orderType" placeholder="请选择" clearable>
+                  <el-option label="车险录入" value="1"></el-option>
+                  <el-option label="代客录单" value="2"></el-option>
+                  <el-option label="外部订单" value="3"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="保险公司">
+                <el-select v-model="firstForm.companyId" placeholder="请选择" clearable>
+                  <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode"
+                    :label="item.name"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="出单机构">
+                <el-cascader clearable style="width: 100%" v-model="firstForm.deptId" :options="option"
+                  :props="tableProps"></el-cascader>
+              </el-form-item>
+            </el-col>
+            <el-col v-show="isTrue" :span="8">
+              <el-form-item label="被保人">
+                <el-input v-model="firstForm.insurName" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col v-show="isTrue" :span="8">
+              <el-form-item label="报价时间">
+                <el-date-picker v-model="firstForm.quotationTime" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+              </el-form-item>
+            </el-col>
+            <el-col v-show="isTrue" :span="8">
+              <el-form-item label="签单时间">
+                <el-date-picker v-model="firstForm.signingTime" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="24" style="display: flex; align-items: center; justify-content: flex-end">
+              <el-button type="primary" @click="handleSearch">搜索</el-button>
+              <el-button plain @click="handleReset">重置</el-button>
+              <span class="icon_s">
+                <span @click="isTrue = !isTrue">高级搜索</span>
+                <el-icon class="is_icon" :class="{ 'is_down': isTrue }">
+                  <ArrowDown />
+                </el-icon>
+              </span>
+            </el-col>
+          </el-row>
+        </el-form>
+        <el-table :data="secondData" :height="isTrue?'calc(100% - 246px)':'calc(100% - 196px)'" style="width: 100%; margin-top: 20px;">
+          <el-table-column prop="orderNo" label="订单号" width="120"></el-table-column>
+          <el-table-column prop="companyName" label="保险公司" width="120"></el-table-column>
+          <el-table-column prop="licenseNo" label="车牌号" width="120"></el-table-column>
+          <el-table-column prop="insurName" label="被保人" width="120"></el-table-column>
+          <el-table-column prop="orderType" label="订单类型" width="120"></el-table-column>
+          <el-table-column prop="name" label="业务员信息" width="120"></el-table-column>
+          <el-table-column prop="attrType" label="业务员类型" width="120"></el-table-column>
+          <el-table-column prop="signingTime" label="签单时间" width="120"></el-table-column>
+          <el-table-column prop="quotationTime" label="报价时间" width="120"></el-table-column>
+          <el-table-column prop="dockingPerson" label="对接人" width="120"></el-table-column>
+          <el-table-column prop="agreementName" label="出单协议" width="120"></el-table-column>
+          <el-table-column prop="productName" label="险种" width="120"></el-table-column>
+          <el-table-column prop="sumPremium" label="保费总计" width="120"></el-table-column>
+          <el-table-column prop="equityAmount" label="权益金额" width="120"></el-table-column>
+          <el-table-column prop="deptName" label="出单机构" width="120"></el-table-column>
+          <el-table-column prop="createTime" label="录单时间" width="120"></el-table-column>
+          <el-table-column prop="createBy" label="录单人" width="120"></el-table-column>
+          <el-table-column prop="payTime" label="支付时间" width="120"></el-table-column>
+          <el-table-column prop="jqPremium" label="交强险" width="120"></el-table-column>
+          <el-table-column prop="syPremium" label="商业险" width="120"></el-table-column>
+          <el-table-column prop="jyPremium" label="驾意险" width="120"></el-table-column>
+          <el-table-column label="操作" fixed="right" width="150">
+            <template #default="scope">
+              <!--                            <el-button link type="primary" size="small" @click="auditReceive(scope.row)">领取</el-button>
                             <el-button link type="primary" size="small" @click="updateSigningTime(scope.row)">更新签单时间</el-button>-->
-                            <el-button link type="primary" size="small" @click="handleToDetail(scope)">详情</el-button>
-                            <el-button link type="primary" size="small" @click="handleTrack(scope)">订单轨迹</el-button>
-                        </template>
-                    </el-table-column>
-                </el-table>
-                <div class="pagination">
-                    <el-pagination
-                        v-model:current-page="pages"
-                        v-model:page-size="size"
-                        :page-sizes="[10, 20, 30, 40]"
-                        layout="total, sizes, prev, pager, next, jumper"
-                        :total="total2"
-                        @size-change="handleSizeChange"
-                        @current-change="handleCurrentChange"
-                    ></el-pagination>
-                </div>
-            </el-tab-pane>
-            <el-tab-pane name="2">
-                <template #label>
-                    <el-badge :value="total3">
-                        <span>审核不通过</span>
-                    </el-badge>
-                </template>
-                <el-form v-model="firstForm" label-width="100">
-                    <el-row :gutter="20">
-                        <el-col :span="8">
-                            <el-form-item label="车牌号">
-                                <el-input v-model="firstForm.licenseNo" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="业务员类型">
-                                <el-select v-model="firstForm.attrType" placeholder="请选择" clearable>
-                                    <el-option label="团队" value="5"></el-option>
-                                    <el-option label="个代" value="6"></el-option>
-                                    <el-option label="渠道" value="7"></el-option>
-                                    <el-option label="电销组" value="8"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="业务员">
-                                <el-input v-model="firstForm.salesman" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="订单类型">
-                                <el-select v-model="firstForm.orderType" placeholder="请选择" clearable>
-                                    <el-option label="车险录入" value="1"></el-option>
-                                    <el-option label="代客录单" value="2"></el-option>
-                                    <el-option label="外部订单" value="3"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="保险公司">
-                                <el-select v-model="firstForm.companyId" placeholder="请选择" clearable>
-                                    <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode" :label="item.name"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="出单机构">
-                                <el-cascader
-                                    clearable
-                                    style="width: 100%"
-                                    v-model="firstForm.deptId"
-                                    :options="option"
-                                    :props="tableProps"
-                                ></el-cascader>
-                            </el-form-item>
-                        </el-col>
-                        <el-col v-show="isTrue" :span="8">
-                            <el-form-item label="被保人">
-                                <el-input v-model="firstForm.insurName" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col v-show="isTrue" :span="8">
-                            <el-form-item label="报价时间">
-                                <el-date-picker
-                                    v-model="firstForm.quotationTime"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始时间"
-                                    end-placeholder="结束时间"
-                                    format="YYYY-MM-DD"
-                                    value-format="YYYY-MM-DD"
-                                />
-                            </el-form-item>
-                        </el-col>
-                        <el-col v-show="isTrue" :span="8">
-                            <el-form-item label="签单时间">
-                                <el-date-picker
-                                    v-model="firstForm.signingTime"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始时间"
-                                    end-placeholder="结束时间"
-                                    format="YYYY-MM-DD"
-                                    value-format="YYYY-MM-DD"
-                                />
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="24" style="display: flex; align-items: center; justify-content: flex-end">
-                            <el-button type="primary" @click="handleSearch">搜索</el-button>
-                            <el-button plain @click="handleReset">重置</el-button>
-                            <span class="icon_s">
-                                <span @click="isTrue = !isTrue">高级搜索</span>
-                                <el-icon class="is_icon" :class="{ 'is_down': isTrue }"><ArrowDown /></el-icon>
-                            </span>
-                        </el-col>
-                    </el-row>
-                </el-form>
-                <el-table :data="thirdData" style="width: 100%; margin-top: 20px;">
-                    <el-table-column prop="orderNo" label="订单号" width="120"></el-table-column>
-                    <el-table-column prop="companyName" label="保险公司" width="120"></el-table-column>
-                    <el-table-column prop="licenseNo" label="车牌号" width="120"></el-table-column>
-                    <el-table-column prop="insurName" label="被保人" width="120"></el-table-column>
-                    <el-table-column prop="orderType" label="订单类型" width="120"></el-table-column>
-                    <el-table-column prop="name" label="业务员信息" width="120"></el-table-column>
-                    <el-table-column prop="attrType" label="业务员类型" width="120"></el-table-column>
-                    <el-table-column prop="auditUser" label="驳回人" width="120"></el-table-column>
-                    <el-table-column prop="auditTime" label="驳回时间" width="120"></el-table-column>
-                    <el-table-column prop="refuse" label="驳回原因" width="120"></el-table-column>
-                    <el-table-column prop="signingTime" label="签单时间" width="120"></el-table-column>
-                    <el-table-column prop="quotationTime" label="报价时间" width="120"></el-table-column>
-                    <el-table-column prop="dockingPerson" label="对接人" width="120"></el-table-column>
-                    <el-table-column prop="agreementName" label="出单协议" width="120"></el-table-column>
-                    <el-table-column prop="productName" label="险种" width="120"></el-table-column>
-                    <el-table-column prop="sumPremium" label="保费总计" width="120"></el-table-column>
-                    <el-table-column prop="equityAmount" label="权益金额" width="120"></el-table-column>
-                    <el-table-column prop="deptName" label="出单机构" width="120"></el-table-column>
-                    <el-table-column prop="createTime" label="录单时间" width="120"></el-table-column>
-                    <el-table-column prop="createBy" label="录单人" width="120"></el-table-column>
-                    <el-table-column prop="payTime" label="支付时间" width="120"></el-table-column>
-                    <el-table-column prop="jqPremium" label="交强险" width="120"></el-table-column>
-                    <el-table-column prop="syPremium" label="商业险" width="120"></el-table-column>
-                    <el-table-column prop="jyPremium" label="驾意险" width="120"></el-table-column>
-                    <el-table-column label="操作" fixed="right" width="200">
-                        <template #default="scope">
-                            <el-button link type="primary" size="small" @click="auditReceive(scope.row)">领取</el-button>
-                            <el-button link type="primary" size="small" @click="updateSigningTime(scope.row)">更新签单时间</el-button>
-                            <el-button link type="primary" size="small" @click="handleToDetail(scope)">详情</el-button>
-                        </template>
-                    </el-table-column>
-                </el-table>
-                <div class="pagination">
-                    <el-pagination
-                        v-model:current-page="pages"
-                        v-model:page-size="size"
-                        :page-sizes="[10, 20, 30, 40]"
-                        layout="total, sizes, prev, pager, next, jumper"
-                        :total="total3"
-                        @size-change="handleSizeChange"
-                        @current-change="handleCurrentChange"
-                    ></el-pagination>
-                </div>
-            </el-tab-pane>
-        </el-tabs>
-        <el-dialog
-            v-model="trackShow"
-            width="1000"
-            title="订单轨迹"
-        >
-            <el-table
-                :data="orderData"
-                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>
-        </el-dialog>
-    </div>
+              <el-button link type="primary" size="small" @click="handleToDetail(scope)">详情</el-button>
+              <el-button link type="primary" size="small" @click="handleTrack(scope)">订单轨迹</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="pagination">
+          <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
+            layout="total, sizes, prev, pager, next, jumper" :total="total2" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane name="2" class="h-full">
+        <template #label>
+          <el-badge :value="total3">
+            <span>审核不通过</span>
+          </el-badge>
+        </template>
+        <el-form v-model="firstForm" label-width="100">
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <el-form-item label="车牌号">
+                <el-input v-model="firstForm.licenseNo" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="业务员类型">
+                <el-select v-model="firstForm.attrType" placeholder="请选择" clearable>
+                  <el-option label="团队" value="5"></el-option>
+                  <el-option label="个代" value="6"></el-option>
+                  <el-option label="渠道" value="7"></el-option>
+                  <el-option label="电销组" value="8"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="业务员">
+                <el-input v-model="firstForm.salesman" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="订单类型">
+                <el-select v-model="firstForm.orderType" placeholder="请选择" clearable>
+                  <el-option label="车险录入" value="1"></el-option>
+                  <el-option label="代客录单" value="2"></el-option>
+                  <el-option label="外部订单" value="3"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="保险公司">
+                <el-select v-model="firstForm.companyId" placeholder="请选择" clearable>
+                  <el-option v-for="item in companyList" :key="item.companyCode" :value="item.companyCode"
+                    :label="item.name"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="出单机构">
+                <el-cascader clearable style="width: 100%" v-model="firstForm.deptId" :options="option"
+                  :props="tableProps"></el-cascader>
+              </el-form-item>
+            </el-col>
+            <el-col v-show="isTrue" :span="8">
+              <el-form-item label="被保人">
+                <el-input v-model="firstForm.insurName" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col v-show="isTrue" :span="8">
+              <el-form-item label="报价时间">
+                <el-date-picker v-model="firstForm.quotationTime" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+              </el-form-item>
+            </el-col>
+            <el-col v-show="isTrue" :span="8">
+              <el-form-item label="签单时间">
+                <el-date-picker v-model="firstForm.signingTime" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="24" style="display: flex; align-items: center; justify-content: flex-end">
+              <el-button type="primary" @click="handleSearch">搜索</el-button>
+              <el-button plain @click="handleReset">重置</el-button>
+              <span class="icon_s">
+                <span @click="isTrue = !isTrue">高级搜索</span>
+                <el-icon class="is_icon" :class="{ 'is_down': isTrue }">
+                  <ArrowDown />
+                </el-icon>
+              </span>
+            </el-col>
+          </el-row>
+        </el-form>
+        <el-table :data="thirdData" :height="isTrue?'calc(100% - 246px)':'calc(100% - 196px)'" style="width: 100%; margin-top: 20px;">
+          <el-table-column prop="orderNo" label="订单号" width="120"></el-table-column>
+          <el-table-column prop="companyName" label="保险公司" width="120"></el-table-column>
+          <el-table-column prop="licenseNo" label="车牌号" width="120"></el-table-column>
+          <el-table-column prop="insurName" label="被保人" width="120"></el-table-column>
+          <el-table-column prop="orderType" label="订单类型" width="120"></el-table-column>
+          <el-table-column prop="name" label="业务员信息" width="120"></el-table-column>
+          <el-table-column prop="attrType" label="业务员类型" width="120"></el-table-column>
+          <el-table-column prop="auditUser" label="驳回人" width="120"></el-table-column>
+          <el-table-column prop="auditTime" label="驳回时间" width="120"></el-table-column>
+          <el-table-column prop="refuse" label="驳回原因" width="120"></el-table-column>
+          <el-table-column prop="signingTime" label="签单时间" width="120"></el-table-column>
+          <el-table-column prop="quotationTime" label="报价时间" width="120"></el-table-column>
+          <el-table-column prop="dockingPerson" label="对接人" width="120"></el-table-column>
+          <el-table-column prop="agreementName" label="出单协议" width="120"></el-table-column>
+          <el-table-column prop="productName" label="险种" width="120"></el-table-column>
+          <el-table-column prop="sumPremium" label="保费总计" width="120"></el-table-column>
+          <el-table-column prop="equityAmount" label="权益金额" width="120"></el-table-column>
+          <el-table-column prop="deptName" label="出单机构" width="120"></el-table-column>
+          <el-table-column prop="createTime" label="录单时间" width="120"></el-table-column>
+          <el-table-column prop="createBy" label="录单人" width="120"></el-table-column>
+          <el-table-column prop="payTime" label="支付时间" width="120"></el-table-column>
+          <el-table-column prop="jqPremium" label="交强险" width="120"></el-table-column>
+          <el-table-column prop="syPremium" label="商业险" width="120"></el-table-column>
+          <el-table-column prop="jyPremium" label="驾意险" width="120"></el-table-column>
+          <el-table-column label="操作" fixed="right" width="200">
+            <template #default="scope">
+              <el-button link type="primary" size="small" @click="auditReceive(scope.row)">领取</el-button>
+              <el-button link type="primary" size="small" @click="updateSigningTime(scope.row)">更新签单时间</el-button>
+              <el-button link type="primary" size="small" @click="handleToDetail(scope)">详情</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="pagination">
+          <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
+            layout="total, sizes, prev, pager, next, jumper" :total="total3" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
+        </div>
+      </el-tab-pane>
+    </el-tabs>
+    <el-dialog v-model="trackShow" width="1000" title="订单轨迹">
+      <el-table :data="orderData" 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>
+    </el-dialog>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -463,33 +390,33 @@ const myRouter = useRouter()
 
 let activeName = ref('0')
 const handleClick = (e) => {
-    activeName.value = e.props.name
-    pages.value = 1
-    size.value = 10
-    firstForm.value = {}
-    initData(activeName.value)
+  activeName.value = e.props.name
+  pages.value = 1
+  size.value = 10
+  firstForm.value = {}
+  initData(activeName.value)
 }
 
 // 待审核
 let firstForm = ref({})
 let option = ref([])
 const tableProps = ref({
-    value: "id",
-    label: "name",
-    children: "children",
-    checkStrictly: true,
+  value: "id",
+  label: "name",
+  children: "children",
+  checkStrictly: true,
 });
 const institutionList = () => {
-    api.institutionApi.institutionList({ name: '', system: '' }).then((res: any) => {
-        if(res.code == 200) {
-            option.value = res.data
-        } else {
-            ElMessage({
-                message: res.msg,
-                type: 'warning'
-            })
-        }
-    })
+  api.institutionApi.institutionList({ name: '', system: '' }).then((res: any) => {
+    if (res.code == 200) {
+      option.value = res.data
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
 }
 let firstData = ref([])
 let secondData = ref([])
@@ -502,12 +429,12 @@ let total3 = ref(0)
 let pages = ref(1)
 let size = ref(10)
 const handleSizeChange = (size) => {
-    size.value = size
-    initData(activeName.value)
+  size.value = size
+  initData(activeName.value)
 }
 const handleCurrentChange = (page) => {
-    pages.value = page
-    initData(activeName.value)
+  pages.value = page
+  initData(activeName.value)
 }
 
 // 是否高级搜索
@@ -515,183 +442,180 @@ let isTrue = ref(false)
 
 let companyList = ref([])
 const initCompany = () => {
-    api.insuranceApi.leftList('').then((res: any) => {
-        if(res.code == 200) {
-            companyList.value = res.data
-        }
-    })
+  api.insuranceApi.leftList('').then((res: any) => {
+    if (res.code == 200) {
+      companyList.value = res.data
+    }
+  })
 }
 
 // 领取
 const auditReceive = (row) => {
-    /**
-     * 领取财务审核订单
-     *
-     * 功能说明：
-     * 1. 首先检查订单是否被锁定（防止多人同时领取）
-     * 2. 若未被锁定（res.data 为 false），则调用领取接口
-     * 3. 领取成功后显示成功提示
-     * 4. 若订单已被锁定，则显示警告提示
-     *
-     * @param {Object} row - 订单数据对象
-     * @param {string} row.orderNo - 订单编号，用于锁定检查和领取操作
-     */
-    api.financeApi.isLock(row.orderNo).then((res: any) => {
-        if(res.code == 200) {
-            if(!res.data) {
-                api.financeApi.auditReceive(row.orderNo).then((res: any) => {
-                    if(res.code == 200) {
-                        ElMessage({
-                            message: res.msg,
-                            type: 'success'
-                        })
-                    }
-                })
-            } else {
-                ElMessage({
-                    message: res.msg,
-                    type: 'warning'
-                })
-            }
-        }
-    })
+  /**
+   * 领取财务审核订单
+   *
+   * 功能说明：
+   * 1. 首先检查订单是否被锁定（防止多人同时领取）
+   * 2. 若未被锁定（res.data 为 false），则调用领取接口
+   * 3. 领取成功后显示成功提示
+   * 4. 若订单已被锁定，则显示警告提示
+   *
+   * @param {Object} row - 订单数据对象
+   * @param {string} row.orderNo - 订单编号，用于锁定检查和领取操作
+   */
+  api.financeApi.isLock(row.orderNo).then((res: any) => {
+    if (res.code == 200) {
+      if (!res.data) {
+        api.financeApi.auditReceive(row.orderNo).then((res: any) => {
+          if (res.code == 200) {
+            ElMessage({
+              message: res.msg,
+              type: 'success'
+            })
+          }
+        })
+      } else {
+        ElMessage({
+          message: res.msg,
+          type: 'warning'
+        })
+      }
+    }
+  })
 }
 //更新签单时间
 const updateSigningTime = (row) => {
-    api.financeApi.updateSigningTime(row.orderNo).then((res: any) => {
-        if(res.code == 200) {
-            ElMessage({
-                message: res.msg,
-                type: 'success'
-            })
-        } else {
-            ElMessage({
-                message: res.msg,
-                type: 'warning'
-            })
-        }
-    })
+  api.financeApi.updateSigningTime(row.orderNo).then((res: any) => {
+    if (res.code == 200) {
+      ElMessage({
+        message: res.msg,
+        type: 'success'
+      })
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
 }
 
 const initData = (type) => {
-    api.financeApi.auditList({
-        ...firstForm.value,
-        auditStatus: type,
-        pages: pages.value,
-        size: size.value,
-    }).then((res: any) => {
-        if(res.code == 200) {
-            switch (type) {
-                case '0' :
-                    firstData.value = res.data.records
-                    total1.value = res.data.total
-                    console.log('数据', firstData.value)
-                    break;
-                case '1' :
-                    secondData.value = res.data.records
-                    total2.value = res.data.total
-                    break;
-                case '2' :
-                    thirdData.value = res.data.records
-                    total3.value = res.data.total
-                    break;
-            }
-        }
-    })
+  api.financeApi.auditList({
+    ...firstForm.value,
+    auditStatus: type,
+    pages: pages.value,
+    size: size.value,
+  }).then((res: any) => {
+    if (res.code == 200) {
+      switch (type) {
+        case '0':
+          firstData.value = res.data.records
+          total1.value = res.data.total
+          console.log('数据', firstData.value)
+          break;
+        case '1':
+          secondData.value = res.data.records
+          total2.value = res.data.total
+          break;
+        case '2':
+          thirdData.value = res.data.records
+          total3.value = res.data.total
+          break;
+      }
+    }
+  })
 }
 const handleSearch = () => {
-    initData(activeName.value)
+  initData(activeName.value)
 }
 const handleReset = () => {
-    firstForm.value = {}
-    initData(activeName.value)
+  firstForm.value = {}
+  initData(activeName.value)
 }
 
 const handleToDetail = (scope) => {
-    myRouter.push({
-        path: '/finance/auditOrderDetail',
-        query: {
-            id: scope.row.orderNo,
-            isShow: 0
-        }
-    })
+  myRouter.push({
+    path: '/finance/auditOrderDetail',
+    query: {
+      id: scope.row.orderNo,
+      isShow: 0
+    }
+  })
 }
 
 let orderData = ref([])
 let trackShow = ref(false)
 const handleTrack = (scope) => {
-    api.insurancePolicyApi.orderTrack({
-        orderNo: scope.row.orderNo
-    }).then((res: any) => {
-        if(res.code == 200) {
-            orderData.value = res.data
-            trackShow.value = true
-        } else {
-            ElMessage({
-                message: res.msg,
-                type: 'warning'
-            })
-        }
-    })
+  api.insurancePolicyApi.orderTrack({
+    orderNo: scope.row.orderNo
+  }).then((res: any) => {
+    if (res.code == 200) {
+      orderData.value = res.data
+      trackShow.value = true
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
 }
 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
+    }
+  })
 }
 
 onMounted(() => {
-    institutionList();
-    initCompany();
-    initData('0')
-    initData('1')
-    initData('2')
+  institutionList();
+  initCompany();
+  initData('0')
+  initData('1')
+  initData('2')
 })
 
 </script>
 
 <style scoped lang="scss">
-.finance{
-    height: calc(100vh - 130px);
-    width: calc(100% - 24px);
-    margin: 12px auto;
-    padding: 12px;
-    background: #FFFFFF;
-    overflow-y: auto;
-    .icon_s{
-        display: flex;
-        align-items: center;
-        justify-content: flex-end;
-        margin-left: 20px;
-        color: #00a0f4;
-        cursor: pointer;
-        .is_icon{
-            transition: ease 0.2s;
-        }
-        .is_down{
-            transform: rotate(180deg);
-        }
-    }
-    .pagination{
-        margin-top: 20px;
-        display: flex;
-        justify-content: flex-end;
-    }
-    :deep(.el-badge__content.is-fixed) {
-        right: calc(var(--el-badge-size) / 2 - 10px);
-        top: 50%;
-    }
-    :deep(.el-badge__content--danger) {
-        background-color: #D40000;
-    }
+.icon_s {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  margin-left: 20px;
+  color: #00a0f4;
+  cursor: pointer;
+
+  .is_icon {
+    transition: ease 0.2s;
+  }
+
+  .is_down {
+    transform: rotate(180deg);
+  }
+}
+
+.pagination {
+  margin-top: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
+
+:deep(.el-badge__content.is-fixed) {
+  right: calc(var(--el-badge-size) / 2 - 10px);
+  top: 50%;
+}
+
+:deep(.el-badge__content--danger) {
+  background-color: #D40000;
 }
 </style>

src/views/insurancePolicy/carRules.vue

@@ -1,90 +1,78 @@
 <template>
-    <div class="carRules">
-        <div class="btn">
-            <el-button icon="Plus" type="primary" @click="add">添加</el-button>
-        </div>
-        <el-table
-            :data="tableData"
-            style="width: 100%"
-        >
-            <el-table-column type="index" label="序号" width="80"></el-table-column>
-            <el-table-column prop="companyName" label="保险公司名称"></el-table-column>
-            <el-table-column prop="unitTypeCode" label="新车判断单位">
-                <template #default="scope">
-                    {{ scope.row.unitTypeCode === '1'?'天':scope.row.unitTypeCode === '2'?'月':'' }}
-                </template>
-            </el-table-column>
-            <el-table-column prop="vehicleType" label="车辆类型">
-                <template #default="scope">
-                    {{ scope.row.vehicleType === 'A1'?'货车':scope.row.vehicleType === 'A0'?'客车':'' }}
-                </template>
-            </el-table-column>
-            <el-table-column prop="unitTypeValue" label="新车判断单位值"></el-table-column>
-            <el-table-column label="操作">
-                <template #default="scope">
-                    <el-button link type="primary" size="small" @click="handleEdit(scope)">编辑</el-button>
-                    <el-button link type="primary" size="small" @click="handleDel(scope)">删除</el-button>
-                </template>
-            </el-table-column>
-        </el-table>
-        <div class="pagination">
-            <el-pagination
-                v-model:current-page="pageNum"
-                v-model:page-size="pageSize"
-                :page-sizes="[10, 20, 30, 40]"
-                layout="total, sizes, prev, pager, next, jumper"
-                :total="total"
-                @size-change="handleSizeChange"
-                @current-change="handleCurrentChange"
-            ></el-pagination>
-        </div>
-        <el-dialog
-            v-model="addShow"
-            title="新增"
-            width="800"
-        >
-            <el-form ref="AddFormRefs" :model="addForm" :rules="addRules" label-width="100">
-                <el-form-item prop="companyId" label="归属保司">
-                    <el-select v-model="addForm.companyId" placeholder="请选择" filterable clearable>
-                        <el-option v-for="(item, index) in companyList" :key="item.id" :value="item.id" :label="item.name"></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item prop="vehicleType" label="车辆类型">
-                    <el-radio-group v-model="addForm.vehicleType">
-                        <el-radio v-for="(item, index) in carType" :key="item.value" :value="item.value">{{ item.label }}</el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item prop="unitTypeCode" label="单位">
-                    <el-select v-model="addForm.unitTypeCode" placeholder="请选择">
-                        <el-option v-for="(item, index) in unit" :key="item.id" :value="item.value" :label="item.label"></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item prop="unitTypeValue" label="单位值">
-                    <el-input-number v-model="addForm.unitTypeValue"/>
-                </el-form-item>
-            </el-form>
-            <template #footer>
-                <el-button @click="handleCancel">取消</el-button>
-                <el-button type="primary" @click="handleSave(AddFormRefs)">保存</el-button>
-            </template>
-        </el-dialog>
+  <PageMain class="vh100">
+    <div class="btn">
+      <el-button icon="Plus" type="primary" @click="add">添加</el-button>
     </div>
+    <el-table :data="tableData" height="calc(100% - 94px)">
+      <el-table-column type="index" label="序号" width="80"></el-table-column>
+      <el-table-column prop="companyName" label="保险公司名称"></el-table-column>
+      <el-table-column prop="unitTypeCode" label="新车判断单位">
+        <template #default="scope">
+          {{ scope.row.unitTypeCode === '1' ? '天' : scope.row.unitTypeCode === '2' ? '月' : '' }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="vehicleType" label="车辆类型">
+        <template #default="scope">
+          {{ scope.row.vehicleType === 'A1' ? '货车' : scope.row.vehicleType === 'A0' ? '客车' : '' }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="unitTypeValue" label="新车判断单位值"></el-table-column>
+      <el-table-column label="操作">
+        <template #default="scope">
+          <el-button link type="primary" size="small" @click="handleEdit(scope)">编辑</el-button>
+          <el-button link type="primary" size="small" @click="handleDel(scope)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <div class="pagination">
+      <el-pagination v-model:current-page="pageNum" v-model:page-size="pageSize" :page-sizes="[10, 20, 30, 40]"
+        layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"></el-pagination>
+    </div>
+    <el-dialog v-model="addShow" title="新增" width="800">
+      <el-form ref="AddFormRefs" :model="addForm" :rules="addRules" label-width="100">
+        <el-form-item prop="companyId" label="归属保司">
+          <el-select v-model="addForm.companyId" placeholder="请选择" filterable clearable>
+            <el-option v-for="(item, index) in companyList" :key="item.id" :value="item.id"
+              :label="item.name"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="vehicleType" label="车辆类型">
+          <el-radio-group v-model="addForm.vehicleType">
+            <el-radio v-for="(item, index) in carType" :key="item.value" :value="item.value">{{ item.label }}</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item prop="unitTypeCode" label="单位">
+          <el-select v-model="addForm.unitTypeCode" placeholder="请选择">
+            <el-option v-for="(item, index) in unit" :key="item.id" :value="item.value" :label="item.label"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="unitTypeValue" label="单位值">
+          <el-input-number v-model="addForm.unitTypeValue" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="handleCancel">取消</el-button>
+        <el-button type="primary" @click="handleSave(AddFormRefs)">保存</el-button>
+      </template>
+    </el-dialog>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
 import api from '@/api'
-import {ElMessage, ElMessageBox} from "element-plus";
+import { ElMessage, ElMessageBox } from "element-plus";
 
 let id = ref('')
-const add = ()=> {
-    id.value = ''
-    addForm.value = {
-        companyId: '',
-        vehicleType: '',
-        unitTypeCode: '',
-        unitTypeValue: 0
-    }
-    addShow.value = true
+const add = () => {
+  id.value = ''
+  addForm.value = {
+    companyId: '',
+    vehicleType: '',
+    unitTypeCode: '',
+    unitTypeValue: 0
+  }
+  addShow.value = true
 }
 
 let tableData = ref([])
@@ -92,223 +80,218 @@ let pageNum = ref(1)
 let pageSize = ref(10)
 let total = ref(0)
 const initData = () => {
-    api.insurancePolicyApi.getNewCarList({
-        pageNum: pageNum.value,
-        pageSize: pageSize.value
-    }).then((res: any) => {
-        if(res.code == 200) {
-            tableData.value = res.data.records
-            total.value = res.data.total
-        } else {
-            ElMessage({
-                message: res.msg,
-                type: 'warning'
-            })
-        }
-    })
+  api.insurancePolicyApi.getNewCarList({
+    pageNum: pageNum.value,
+    pageSize: pageSize.value
+  }).then((res: any) => {
+    if (res.code == 200) {
+      tableData.value = res.data.records
+      total.value = res.data.total
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
 }
 const handleSizeChange = (size) => {
-    pageNum.value = 1
-    pageSize.value = size
-    initData()
+  pageNum.value = 1
+  pageSize.value = size
+  initData()
 }
 const handleCurrentChange = (page) => {
-    pageNum.value = page
-    initData()
+  pageNum.value = page
+  initData()
 }
 
 let addShow = ref(false)
 let AddFormRefs = ref()
 let addForm = ref({
-    companyId: '',
-    vehicleType: '',
-    unitTypeCode: '',
-    unitTypeValue: 0
+  companyId: '',
+  vehicleType: '',
+  unitTypeCode: '',
+  unitTypeValue: 0
 })
 let addRules = ref({
-    companyId: [
-        { required: true, message: "请选择归属公司", trigger: "change" },
-    ],
-    vehicleType: [
-        { required: true, message: "请选择车辆类型", trigger: "change" },
-    ],
-    unitTypeCode: [
-        { required: true, message: "请选择单位", trigger: "change" },
-    ],
-    unitTypeValue: [
-        { required: true, message: "请填写单位值", trigger: "blur" },
-    ],
+  companyId: [
+    { required: true, message: "请选择归属公司", trigger: "change" },
+  ],
+  vehicleType: [
+    { required: true, message: "请选择车辆类型", trigger: "change" },
+  ],
+  unitTypeCode: [
+    { required: true, message: "请选择单位", trigger: "change" },
+  ],
+  unitTypeValue: [
+    { required: true, message: "请填写单位值", trigger: "blur" },
+  ],
 })
 
 const handleCancel = () => {
-    addForm.value = {
-        companyId: '',
-        vehicleType: '',
-        unitTypeCode: '',
-        unitTypeValue: 0
-    }
-    addShow.value = false
+  addForm.value = {
+    companyId: '',
+    vehicleType: '',
+    unitTypeCode: '',
+    unitTypeValue: 0
+  }
+  addShow.value = false
 }
 const handleSave = async (form) => {
-    if(!form) {
-        form.resetFields()
-        return
-    }
-    await form.validate((valid) => {
-        if(valid) {
-            if(id.value) {
-                api.insurancePolicyApi.updateNewCar({
-                    ...addForm.value,
-                    id: id.value
-                }).then((res: any) => {
-                    if(res.code == 200) {
-                        addForm.value = {
-                            companyId: '',
-                            vehicleType: '',
-                            unitTypeCode: '',
-                            unitTypeValue: 0
-                        }
-                        ElMessage({
-                            message: res.msg,
-                            type: 'success'
-                        })
-                        initData()
-                    } else {
-                        ElMessage({
-                            message: res.msg,
-                            type: 'warning'
-                        })
-                    }
-                })
-            } else {
-                api.insurancePolicyApi.addNewCar({
-                    ...addForm.value
-                }).then((res: any) => {
-                    if(res.code == 200) {
-                        addForm.value = {
-                            companyId: '',
-                            vehicleType: '',
-                            unitTypeCode: '',
-                            unitTypeValue: 0
-                        }
-                        ElMessage({
-                            message: res.msg,
-                            type: 'success'
-                        })
-                        initData()
-                    } else {
-                        ElMessage({
-                            message: res.msg,
-                            type: 'warning'
-                        })
-                    }
-                })
+  if (!form) {
+    form.resetFields()
+    return
+  }
+  await form.validate((valid) => {
+    if (valid) {
+      if (id.value) {
+        api.insurancePolicyApi.updateNewCar({
+          ...addForm.value,
+          id: id.value
+        }).then((res: any) => {
+          if (res.code == 200) {
+            addForm.value = {
+              companyId: '',
+              vehicleType: '',
+              unitTypeCode: '',
+              unitTypeValue: 0
             }
-        }
-    })
-    addShow.value = false
+            ElMessage({
+              message: res.msg,
+              type: 'success'
+            })
+            initData()
+          } else {
+            ElMessage({
+              message: res.msg,
+              type: 'warning'
+            })
+          }
+        })
+      } else {
+        api.insurancePolicyApi.addNewCar({
+          ...addForm.value
+        }).then((res: any) => {
+          if (res.code == 200) {
+            addForm.value = {
+              companyId: '',
+              vehicleType: '',
+              unitTypeCode: '',
+              unitTypeValue: 0
+            }
+            ElMessage({
+              message: res.msg,
+              type: 'success'
+            })
+            initData()
+          } else {
+            ElMessage({
+              message: res.msg,
+              type: 'warning'
+            })
+          }
+        })
+      }
+    }
+  })
+  addShow.value = false
 }
 
 const handleEdit = (scow) => {
-    addForm.value = {
-        companyId: scow.row.companyId,
-        vehicleType: scow.row.vehicleType,
-        unitTypeCode: scow.row.unitTypeCode,
-        unitTypeValue: scow.row.unitTypeValue,
-    }
-    id.value = scow.row.id
-    addShow.value = true
+  addForm.value = {
+    companyId: scow.row.companyId,
+    vehicleType: scow.row.vehicleType,
+    unitTypeCode: scow.row.unitTypeCode,
+    unitTypeValue: scow.row.unitTypeValue,
+  }
+  id.value = scow.row.id
+  addShow.value = true
 }
 const handleDel = (scow) => {
-    ElMessageBox({
-        title: '提示',
-        message: '确认要删除当前数据吗?',
-        confirmButtonText: "确认",
-        cancelButtonText: "取消",
-        type: "warning",
-        center:true
-    }).then((action) => {
-        if(action === 'confirm') {
-            api.insurancePolicyApi.delNewCar({
-                id: scow.row.id
-            }).then((res: any) => {
-                if(res.code == 200) {
-                    ElMessage({
-                        message: res.msg,
-                        type: 'success'
-                    })
-                    initData();
-                } else {
-                    ElMessage({
-                        message: res.msg,
-                        type: 'warning'
-                    })
-                }
-            })
+  ElMessageBox({
+    title: '提示',
+    message: '确认要删除当前数据吗?',
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+    center: true
+  }).then((action) => {
+    if (action === 'confirm') {
+      api.insurancePolicyApi.delNewCar({
+        id: scow.row.id
+      }).then((res: any) => {
+        if (res.code == 200) {
+          ElMessage({
+            message: res.msg,
+            type: 'success'
+          })
+          initData();
+        } else {
+          ElMessage({
+            message: res.msg,
+            type: 'warning'
+          })
         }
-    })
+      })
+    }
+  })
 }
 
 let companyList = ref([])
-const initCompany = ()=> {
-    api.insuranceApi.leftList('').then((res: any) => {
-        if(res.code == 200) {
-            companyList.value = res.data
-        } else {
-            ElMessage({
-                message: res.msg,
-                type: 'warning'
-            })
-        }
-    })
+const initCompany = () => {
+  api.insuranceApi.leftList('').then((res: any) => {
+    if (res.code == 200) {
+      companyList.value = res.data
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
 }
 
 let carType = ref([])
 let unit = ref([])
-const initDict = ()=> {
-    api.commonApi.personInfo('car_kind_code').then((res: any) => {
-        if(res.code == 200) {
-            carType.value = res.data
-        } else {
-            ElMessage({
-                message: res.msg,
-                type: 'warning'
-            })
-        }
-    })
-    api.commonApi.personInfo('new_car_unit').then((res: any) => {
-        if(res.code == 200) {
-            unit.value = res.data
-        } else {
-            ElMessage({
-                message: res.msg,
-                type: 'warning'
-            })
-        }
-    })
+const initDict = () => {
+  api.commonApi.personInfo('car_kind_code').then((res: any) => {
+    if (res.code == 200) {
+      carType.value = res.data
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
+  api.commonApi.personInfo('new_car_unit').then((res: any) => {
+    if (res.code == 200) {
+      unit.value = res.data
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
 }
 
 onMounted(() => {
-    initData();
-    initCompany();
-    initDict();
+  initData();
+  initCompany();
+  initDict();
 })
 </script>
 
 <style scoped lang="scss">
-.carRules {
-    width: calc(100% - 48px);
-    height: calc(100vh - 130px);
-    margin: 10px auto;
-    overflow: hidden;
-    .btn{
-        margin-bottom: 20px;
-    }
-    .pagination{
-        margin-top: 20px;
-        display: flex;
-        align-items: center;
-        justify-content: flex-end;
-    }
+.btn {
+  margin-bottom: 20px;
+}
+
+.pagination {
+  margin-top: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
 }
 </style>

src/views/insurancePolicy/order.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="order">
+  <PageMain class="vh100">
     <SearchBar :show-toggle="false" @toggle="onToggle">
       <template #default="{ fold, toggle }">
         <el-form class="search-form" :model="orderForm" label-width="120" ref="multipleTableRef">
@@ -211,7 +211,7 @@
     </el-dialog>
     <DialogInsuranceEdit v-model="isEditVisible" :data="formData" />
     <DialogInsuranceCancel v-model="isCancelVisible" :data="formData" />
-  </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -268,7 +268,7 @@ const allFields = {
 };
 
 const processPartnerTypeAttr = (partnerTypeAttr: string) => {
-  if(!partnerTypeAttr) return ''
+  if (!partnerTypeAttr) return ''
   const map = {
     "5": '团队',
     "6": '个代',
@@ -334,7 +334,7 @@ const orderStatusList = ref([
 ],)
 
 // 初始化默认数据
-const initializationOrderForm={
+const initializationOrderForm = {
   orderNo: '',
   licenseNo: '',
   orderStatus: '',
@@ -345,7 +345,7 @@ const initializationOrderForm={
   salesmanType: '',//业务员类型
   deptId: '',//出单机构
 }
-let orderForm = ref({...initializationOrderForm})
+let orderForm = ref({ ...initializationOrderForm })
 let tableData = ref([])
 // 分页
 let pages = ref(1)
@@ -376,7 +376,7 @@ function handleResize() {
     const paginationHeight = paginationElement ? paginationElement.offsetHeight : 40;
 
     // 计算表格高度：窗口高度 - 表单高度 - 分页高度 - 页面顶部预留空间
-    const availableHeight = height - formHeight - paginationHeight - 200; // 60是页面顶部预留空间
+    const availableHeight = height - formHeight - paginationHeight - 216; // 60是页面顶部预留空间
 
     // 确保表格高度不小于最小值
     tableHeight.value = Math.max(availableHeight, 200) + "px";
@@ -439,9 +439,9 @@ const initDept = () => {
 }
 // 重置列表筛选
 const handleReset = () => {
-    orderForm.value= {...initializationOrderForm}
+  orderForm.value = { ...initializationOrderForm }
 
-    handleSearch()
+  handleSearch()
 }
 const initData = () => {
   loading.value = true;
@@ -514,7 +514,7 @@ const handleSearch = () => {
   initData()
 }
 const handleCancel = () => {
-  orderForm.value={}
+  orderForm.value = {}
   initData()
 }
 // 详情
@@ -564,7 +564,7 @@ const updateOrderStatus = (orderNo) => {
  * - 删除成功后显示成功提示并刷新订单列表
  * - 删除失败时显示警告提示
  */
-const deleteOrder = (id:string):void => {
+const deleteOrder = (id: string): void => {
   api.insurancePolicyApi.deleteOrder({ id }).then((res: any) => {
     if (res.code == 200) {
       ElMessage({
@@ -680,26 +680,19 @@ const openDetail = (e: any) => {
   }
 }
 
-.order {
-  width: 100%;
-  height: calc(100vh - 120px);
-  background: #FFFFFF;
-  padding: 24px;
-  overflow-y: auto;
-
-  .pagination {
-    margin-top: 24px;
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-  }
 
-  .payCode {
-    display: block;
-    width: 140px;
-    height: 140px;
-    margin: 10px auto;
-  }
+.pagination {
+  margin-top: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+
+.payCode {
+  display: block;
+  width: 140px;
+  height: 140px;
+  margin: 10px auto;
 }
 
 :deep(.el-dialog__body) {

src/views/quoteConfig/dispatch/index.vue

@@ -24,7 +24,7 @@
         </div>
       </div>
     </PageMain>
-    <PageMain class="vh100" style="width: calc(100% - 250px);">
+    <PageMain class="vh100 m-l-0" style="width: calc(100% - 250px);">
       <ElRow class="vh99">
         <ElCol :span="24">
           <div class="right">

src/views/quoteConfig/insuranceCompanyAccount/insuranceCompanyAccount.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="insuranceAccount">
+  <PageMain class="vh100">
     <el-form :model="insuranceForm" ref="InsuranceFormRefs" label-width="70">
       <el-row :gutter="29">
         <el-col :span="8">
@@ -16,14 +16,8 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="归属">
-            <el-cascader
-              style="width: 100%"
-              v-model="insuranceForm.userDeptId"
-              placeholder="请选择"
-              :options="deptOption"
-              :props="cascaderProps"
-              clearable
-            ></el-cascader>
+            <el-cascader style="width: 100%" v-model="insuranceForm.userDeptId" placeholder="请选择" :options="deptOption"
+              :props="cascaderProps" clearable></el-cascader>
           </el-form-item>
         </el-col>
       </el-row>
@@ -62,17 +56,12 @@
             <el-dropdown-item command="删除">删除</el-dropdown-item>
             <el-dropdown-item command="启用">启用</el-dropdown-item>
             <el-dropdown-item command="禁用">禁用</el-dropdown-item>
-<!--            <el-dropdown-item command="账号授权">账号授权</el-dropdown-item>-->
+            <!--            <el-dropdown-item command="账号授权">账号授权</el-dropdown-item>-->
           </el-dropdown-menu>
         </template>
       </el-dropdown>
     </div>
-    <el-table
-      :data="tableData"
-      ref="insuranceDataRefs"
-      @selectionChange="tableSelectChange"
-      height="520"
-    >
+    <el-table :data="tableData" ref="insuranceDataRefs" @selectionChange="tableSelectChange" height="calc(100% - 210px)">
       <el-table-column type="selection" width="80"></el-table-column>
       <el-table-column prop="username" label="账号信息" width="300">
         <template #default="scope">
@@ -84,7 +73,7 @@
       <el-table-column prop="url" label="账号登录地址"></el-table-column>
       <el-table-column prop="apiType" label="报价对接方式">
         <template #default="scope">
-          {{ scope.row.apiType == '1'?'直连':'非直连' }}
+          {{ scope.row.apiType == '1' ? '直连' : '非直连' }}
         </template>
       </el-table-column>
       <el-table-column prop="deptName" label="归属"></el-table-column>
@@ -92,30 +81,31 @@
         <template #header>
           <div style="display: flex; align-items: center">
             可用状态&nbsp;
-            <el-tooltip
-              class="box-item"
-              effect="dark"
-              content="<span>使用该账号报价后，保司返回的账号可用结果</br>
+            <el-tooltip class="box-item" effect="dark" content="<span>使用该账号报价后，保司返回的账号可用结果</br>
               正常：说明该账号可使用</br>
               不可用：说明该账号在最近1次的报价时，保司返回的账号状态</br>
-              未知：超过7天未使用该账号报价出单</span>"
-              placement="top-start"
-              raw-content
-            >
-              <el-icon size="14"><QuestionFilled /></el-icon>
+              未知：超过7天未使用该账号报价出单</span>" placement="top-start" raw-content>
+              <el-icon size="14">
+                <QuestionFilled />
+              </el-icon>
             </el-tooltip>
           </div>
         </template>
         <template #default="scope">
           <div class="tableState">
-            <span :class="{'state-use': scope.row.useStatus==='0','state-noUse': scope.row.useStatus==='1','state-noKnow': scope.row.useStatus==='2', }"></span>{{ scope.row.useStatus==='0'?'正常':scope.row.useStatus==='1'?'不可用':scope.row.useStatus==='2'?'未知':'' }}
+            <span
+              :class="{ 'state-use': scope.row.useStatus === '0', 'state-noUse': scope.row.useStatus === '1', 'state-noKnow': scope.row.useStatus === '2', }"></span>{{
+                scope.row.useStatus === '0' ? '正常' : scope.row.useStatus === '1' ? '不可用' : scope.row.useStatus === '2'
+                  ? '未知' : '' }}
           </div>
         </template>
       </el-table-column>
       <el-table-column prop="quoteStatus" label="账号状态">
         <template #default="scope">
           <div class="tableState">
-            <span :class="{'state-use': scope.row.quoteStatus==='0','state-noUse': scope.row.quoteStatus==='1'}"></span>{{ scope.row.quoteStatus==='0'?'启用':scope.row.quoteStatus==='1'?'禁用':''  }}
+            <span
+              :class="{ 'state-use': scope.row.quoteStatus === '0', 'state-noUse': scope.row.quoteStatus === '1' }"></span>{{
+                scope.row.quoteStatus === '0' ? '启用' : scope.row.quoteStatus === '1' ? '禁用' : '' }}
           </div>
         </template>
       </el-table-column>
@@ -138,41 +128,23 @@
       </el-table-column>
     </el-table>
     <div class="paginationBox">
-      <el-pagination
-        v-model:current-page="currentPage"
-        v-model:page-size="pageSize"
-        :page-sizes="[10, 20, 30, 40]"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="total"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-      ></el-pagination>
+      <el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 20, 30, 40]"
+        layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"></el-pagination>
     </div>
-    <el-drawer
-      v-model="accreditDrawer"
-      title="账号授权"
-      :size="800"
-    >
+    <el-drawer v-model="accreditDrawer" title="账号授权" :size="800">
       <el-input prefix-icon="search" v-model="searchValue" @keyup.enter="searchInsurance"></el-input>
       <div style="height: calc(100vh - 200px); margin: 10px 0;">
         <el-checkbox @change="insuranceSelectAll">全选</el-checkbox>
-        <el-tree
-          ref="insuranceTreeRefs"
-          :props="treeProps"
-          :data="insuranceTree"
-          show-checkbox
-          default-expand-all
-          node-key="id"
-          :default-checked-keys="checkedKeys"
-          @check="handleCheckChange"
-        />
+        <el-tree ref="insuranceTreeRefs" :props="treeProps" :data="insuranceTree" show-checkbox default-expand-all
+          node-key="id" :default-checked-keys="checkedKeys" @check="handleCheckChange" />
       </div>
       <div style="display: flex; justify-content: flex-end">
         <el-button plain @click="accreditDrawer = false">取消</el-button>
         <el-button type="primary" @click="handleSave">确定</el-button>
       </div>
     </el-drawer>
-  </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -183,32 +155,32 @@ import api from '@/api'
 const myRouter = useRouter()
 
 let insuranceForm = ref({
-    username: '',
-    insCompanyId: '',
-    userDeptId: [],
-    useStatus: '',
-    quoteStatus: '',
-    userDept: ''
+  username: '',
+  insCompanyId: '',
+  userDeptId: [],
+  useStatus: '',
+  quoteStatus: '',
+  userDept: ''
 })
 
 // 列表数据
 let tableData = ref([])
 // 查询
 const search = () => {
-    if(insuranceForm.value.userDeptId.length > 0) {
-        insuranceForm.value.userDept = insuranceForm.value.userDeptId[insuranceForm.value.userDeptId.length - 1]
-    }
-    initData()
+  if (insuranceForm.value.userDeptId.length > 0) {
+    insuranceForm.value.userDept = insuranceForm.value.userDeptId[insuranceForm.value.userDeptId.length - 1]
+  }
+  initData()
 }
 // 重置
 const reset = () => {
   insuranceForm.value = {
-      username: '',
-      insCompanyId: '',
-      userDeptId: [],
-      useStatus: '',
-      quoteStatus: '',
-      userDept: ''
+    username: '',
+    insCompanyId: '',
+    userDeptId: [],
+    useStatus: '',
+    quoteStatus: '',
+    userDept: ''
   }
   initData()
 }
@@ -229,7 +201,7 @@ const editInsuranceAccount = (row) => {
 }
 // 批量操作
 const batchCommand = (e) => {
-  if(selectRows.value.length == 0) {
+  if (selectRows.value.length == 0) {
     ElMessage({
       message: '请选择需要操作的数据！',
       type: 'warning'
@@ -245,10 +217,10 @@ const batchCommand = (e) => {
         showCancelButton: true,
         confirmButtonText: '确定删除',
         cancelButtonText: '取消',
-      }).then((  action ) => {
-        if(action === 'confirm') {
+      }).then((action) => {
+        if (action === 'confirm') {
           api.insuranceApi.deleteAgreementAttribution({ ids: [...selectRows.value] }).then(res => {
-            if(res.code == 200) {
+            if (res.code == 200) {
               initData()
               ElMessage({
                 message: res.msg,
@@ -272,10 +244,10 @@ const batchCommand = (e) => {
         showCancelButton: true,
         confirmButtonText: '确定禁用',
         cancelButtonText: '取消',
-      }).then((  action ) => {
-        if(action === 'confirm') {
+      }).then((action) => {
+        if (action === 'confirm') {
           api.insuranceApi.disableAgreementAttribution({ ids: [...selectRows.value] }).then(res => {
-            if(res.code == 200) {
+            if (res.code == 200) {
               initData()
               ElMessage({
                 message: res.msg,
@@ -294,7 +266,7 @@ const batchCommand = (e) => {
     case '启用':
       // 启用的逻辑
       api.insuranceApi.enableAgreementAttribution({ ids: [...selectRows.value] }).then(res => {
-        if(res.code == 200) {
+        if (res.code == 200) {
           initData()
           ElMessage({
             message: res.msg,
@@ -325,10 +297,10 @@ const tableDataCommand = (scope, e) => {
         showCancelButton: true,
         confirmButtonText: '确定删除',
         cancelButtonText: '取消',
-      }).then((  action ) => {
-        if(action === 'confirm') {
+      }).then((action) => {
+        if (action === 'confirm') {
           api.insuranceApi.deleteAgreementAttribution({ ids: [scope.row.id] }).then(res => {
-            if(res.code == 200) {
+            if (res.code == 200) {
               initData()
               ElMessage({
                 message: res.msg,
@@ -352,10 +324,10 @@ const tableDataCommand = (scope, e) => {
         showCancelButton: true,
         confirmButtonText: '确定禁用',
         cancelButtonText: '取消',
-      }).then((  action ) => {
-        if(action === 'confirm') {
+      }).then((action) => {
+        if (action === 'confirm') {
           api.insuranceApi.disableAgreementAttribution({ ids: [scope.row.id] }).then(res => {
-            if(res.code == 200) {
+            if (res.code == 200) {
               initData()
               ElMessage({
                 message: res.msg,
@@ -373,7 +345,7 @@ const tableDataCommand = (scope, e) => {
       break;
     case '启用':
       api.insuranceApi.enableAgreementAttribution({ ids: [scope.row.id] }).then(res => {
-        if(res.code == 200) {
+        if (res.code == 200) {
           initData()
           ElMessage({
             message: res.msg,
@@ -400,14 +372,14 @@ let searchValue = ref('')
 let searchId = ref('')
 let deptIds = ref([])
 let checkedKeys = ref([])
-const initTree = ( id: string ) => {
+const initTree = (id: string) => {
   searchId.value = id
   api.insuranceApi.deptTree({
     id: id,
     deptName: searchValue.value
   }).then((res: any) => {
     checkedKeys.value = []
-    if(res.code == 200) {
+    if (res.code == 200) {
       checkedKeys.value = res.data.deptIds
       insuranceTree.value = res.data.deptList
     } else {
@@ -429,7 +401,7 @@ const handleSave = () => {
     id: searchId.value,
     deptIds: deptIds.value
   }).then((res: any) => {
-    if(res.code == 200) {
+    if (res.code == 200) {
       ElMessage({
         message: res.msg,
         type: 'success'
@@ -448,7 +420,7 @@ const handleSave = () => {
 let selectRows = ref([])
 const tableSelectChange = (rows) => {
   selectRows.value = []
-  if(rows.length>0) {
+  if (rows.length > 0) {
     rows.forEach(item => {
       selectRows.value.push(item.id)
     })
@@ -474,7 +446,7 @@ let insuranceList = ref([
   {
     name: '保司1',
     id: '1'
-  },{
+  }, {
     name: '保司2',
     id: '2'
   }
@@ -499,7 +471,7 @@ const initData = () => {
     pages: currentPage.value,
     size: pageSize.value
   }).then(res => {
-    if(res.code == 200) {
+    if (res.code == 200) {
       tableData.value = res.data.records
       total.value = res.data.total
     } else {
@@ -514,7 +486,7 @@ const initData = () => {
 let bankOption = ref([])
 const initCompany = () => {
   api.insuranceApi.leftList('').then(res => {
-    if(res.code == 200) {
+    if (res.code == 200) {
       bankOption.value = res.data
     } else {
       ElMessage({
@@ -534,8 +506,8 @@ const cascaderProps = {
   checkStrictly: true,
 }
 const initDept = () => {
-  api.insuranceApi.getDeptTree({ sysCode: localStorage.getItem('sysCode')}).then(res => {
-    if(res.code == 200) {
+  api.insuranceApi.getDeptTree({ sysCode: localStorage.getItem('sysCode') }).then(res => {
+    if (res.code == 200) {
       deptOption.value = res.data
     } else {
       ElMessage({
@@ -555,53 +527,54 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
-.insuranceAccount{
-  width: 100%;
-  height: 100%;
-  background: white;
-  padding: 20px;
-  .btns{
-    margin: 10px 0 20px;
+.btns {
+  margin: 10px 0 20px;
+}
+
+.paginationBox {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 10px;
+}
+
+.insuranceItem {
+  padding: 5px 10px;
+  border-radius: 5px;
+  cursor: pointer;
+  margin: 10px 0;
+
+  &:hover {
+    background: #00a3ec;
+    color: white;
   }
-  .paginationBox{
-    display: flex;
-    justify-content: flex-end;
-    margin-top: 20px;
+}
+
+.tableState {
+  display: flex;
+  align-items: center;
+
+  .state-use {
+    width: 6px;
+    height: 6px;
+    background: #00a3ec;
+    border-radius: 50%;
+    margin-right: 10px;
   }
-  .insuranceItem{
-    padding: 5px 10px;
-    border-radius: 5px;
-    cursor: pointer;
-    margin: 10px 0;
-    &:hover{
-      background: #00a3ec;
-      color: white;
-    }
+
+  .state-noUse {
+    width: 6px;
+    height: 6px;
+    background: red;
+    border-radius: 50%;
+    margin-right: 10px;
   }
-  .tableState{
-    display: flex;
-    align-items: center;
-    .state-use{
-      width: 6px;
-      height: 6px;
-      background: #00a3ec;
-      border-radius: 50%;
-      margin-right: 10px;
-    }
-    .state-noUse{
-      width: 6px;
-      height: 6px;
-      background: red;
-      border-radius: 50%;
-      margin-right: 10px;
-    }
-    .state-noKnow{
-      width: 6px;
-      height: 6px;
-      background: orange;
-      border-radius: 50%;
-      margin-right: 10px;
-    }
+
+  .state-noKnow {
+    width: 6px;
+    height: 6px;
+    background: orange;
+    border-radius: 50%;
+    margin-right: 10px;
   }
 }
 </style>

src/views/quoteConfig/project/index.vue

@@ -1,10 +1,90 @@
 <template>
-  <div class="project">
-    <el-row :gutter="20" style="height: 100%; padding: 10px">
+  <PageMain class="vh100">
+    <div class="flex  h-full">
+      <div class="w-282px h-full relative flex-shrink-0 member-tree box-border">
+        <el-input class="w-250px m-l-8px" placeholder="请输入保险公司名称" v-model="company" @keyup.enter="searchCompany">
+          <template #append>
+            <el-button icon="Search" link @click="searchCompany" />
+          </template>
+        </el-input>
+        <div style="height: calc(100% - 80px); overflow: auto;" class="m-t-14px">
+          <div v-for="item, index in filterList" :key="item.id" :class="companyIndex == index ? 'on' : 'role-item'"
+            @click="companyChose(item, index)"
+            class="h-64px w-266px p-[0_8px] flex flex-col items-start justify-center">
+            <div class="text-16px color-[#333]">{{ item.nameSimple }}</div>
+          </div>
+        </div>
+      </div>
+      <div class="w-[calc(100%-282px)]">
+        <div
+          class="flex m-r--16px m-t-4px h-52px justify-between items-center p-b-20px p-l-24px p-r-24px b-b-(1px solid #EEEEEE)">
+          <div class="">
+
+            <div class="text-20px color-[#333] font-500">险种方案配置</div>
+            <div class="text-14px color-[#999]">配置各家保险公司险种方案套餐，报价时根据规则信息匹配符合报价车辆的保司与保司内的方案</div>
+          </div>
+          <div>
+            <ElButton type="primary" @click="addProject">添加新方案</ElButton>
+          </div>
+        </div>
+        <el-form  class="p-[20px_8px_0_24px]" :model="projectForm" ref="projectRefs">
+          <el-row :gutter="20">
+            <el-col :span="4">
+              <el-form-item label="方案类型">
+                <el-select clearable v-model="projectForm.schemeType" placeholder="请选择" @change="search">
+                  <el-option key="1" value="1" label="基础方案"></el-option>
+                  <el-option key="2" value="2" label="自选方案"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="4">
+              <el-form-item label="险种">
+                <el-select clearable v-model="projectForm.productId" placeholder="请选择" @change="search">
+                  <el-option v-for="item in insuranceType" :key="item.value" :value="item.value"
+                    :label="item.label"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="4">
+              <el-form-item>
+                <el-input clearable prefix-icon="search" placeholder="输入规则描述查找" @keyup.enter="search"
+                  v-model="projectForm.ruleDesc"></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+        <el-table class="p-l-24px" :data="tableData" height="calc(100% - 182px)">
+          <el-table-column label="方案名称" prop="schemeName"></el-table-column>
+          <el-table-column label="方案描述" prop="description"></el-table-column>
+          <el-table-column label="方案类型" prop="schemeType">
+            <template #default="scope">
+              {{ scope.row.schemeType == '1' ? '基础方案' : scope.row.schemeType == '2' ? '自选方案' : '' }}
+            </template>
+          </el-table-column>
+          <el-table-column label="险种" prop="productName"></el-table-column>
+          <el-table-column label="驾意险" prop="drivingIntentionNum"></el-table-column>
+          <el-table-column label="规则描述" prop="ruleDesc"></el-table-column>
+          <el-table-column label="操作">
+            <template #default="scope">
+              <el-button link type="primary" @click="handleEdit(scope.row)">编辑</el-button>
+              <el-button link type="primary" @click="handleDel(scope.row)">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="paginationBox p-r-8px">
+          <el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 20, 30, 40]"
+            layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
+        </div>
+      </div>
+    </div>
+    <!-- <el-row :gutter="20" style="height: 100%; padding: 10px">
       <el-col :span="4">
-        <el-input placeholder="请输入保险公司名称" v-model="company" prefix-icon="search" @keyup.enter="searchCompany"></el-input>
+        <el-input placeholder="请输入保险公司名称" v-model="company" prefix-icon="search"
+          @keyup.enter="searchCompany"></el-input>
         <div class="companyList">
-          <div class="companyItem" :class="{'active': companyIndex === index}" v-for="(item, index) in filterList" @click="companyChose(item, index)">{{ item.nameSimple }}</div>
+          <div class="companyItem" :class="{ 'active': companyIndex === index }" v-for="(item, index) in filterList"
+            @click="companyChose(item, index)">{{ item.nameSimple }}</div>
         </div>
       </el-col>
       <el-col :span="20">
@@ -31,26 +111,25 @@
             <el-col :span="4">
               <el-form-item label="险种">
                 <el-select clearable v-model="projectForm.productId" placeholder="请选择" @change="search">
-                  <el-option v-for="item in insuranceType" :key="item.value" :value="item.value" :label="item.label"></el-option>
+                  <el-option v-for="item in insuranceType" :key="item.value" :value="item.value"
+                    :label="item.label"></el-option>
                 </el-select>
               </el-form-item>
             </el-col>
             <el-col :span="4">
               <el-form-item>
-                <el-input clearable prefix-icon="search" placeholder="输入规则描述查找" @keyup.enter="search" v-model="projectForm.ruleDesc"></el-input>
+                <el-input clearable prefix-icon="search" placeholder="输入规则描述查找" @keyup.enter="search"
+                  v-model="projectForm.ruleDesc"></el-input>
               </el-form-item>
             </el-col>
           </el-row>
         </el-form>
-        <el-table
-          :data="tableData"
-          height="600"
-        >
+        <el-table :data="tableData" height="600">
           <el-table-column label="方案名称" prop="schemeName"></el-table-column>
           <el-table-column label="方案描述" prop="description"></el-table-column>
           <el-table-column label="方案类型" prop="schemeType">
             <template #default="scope">
-              {{ scope.row.schemeType == '1'?'基础方案':scope.row.schemeType == '2'?'自选方案':'' }}
+              {{ scope.row.schemeType == '1' ? '基础方案' : scope.row.schemeType == '2' ? '自选方案' : '' }}
             </template>
           </el-table-column>
           <el-table-column label="险种" prop="productName"></el-table-column>
@@ -64,24 +143,18 @@
           </el-table-column>
         </el-table>
         <div class="paginationBox">
-          <el-pagination
-            v-model:current-page="currentPage"
-            v-model:page-size="pageSize"
-            :page-sizes="[10, 20, 30, 40]"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="total"
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-          ></el-pagination>
+          <el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 20, 30, 40]"
+            layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-col>
-    </el-row>
-  </div>
+    </el-row> -->
+  </PageMain>
 </template>
 
 <script setup lang="ts">
 import api from '@/api'
-import {ElMessage, ElMessageBox} from "element-plus";
+import { ElMessage, ElMessageBox } from "element-plus";
 import { useRouter, useRoute } from 'vue-router'
 
 const myRouter = useRouter()
@@ -108,11 +181,11 @@ let companyId = ref('')
 
 const initCompany = () => {
   api.projectApi.getCompanyList().then(res => {
-    if(res.code == 200) {
+    if (res.code == 200) {
       companyOption.value = res.data
-      if(muRoute.query.id){
+      if (muRoute.query.id) {
         companyIndex.value = companyOption.value.findIndex(a => a.id == muRoute.query.id)
-      }else{
+      } else {
         companyIndex.value = 0
       }
       companyId.value = muRoute.query.id || companyOption.value[companyIndex.value].id
@@ -156,7 +229,7 @@ const initData = () => {
     schemeType: projectForm.value.schemeType,
     ruleDesc: projectForm.value.ruleDesc
   }).then(res => {
-    if(res.code == 200) {
+    if (res.code == 200) {
       tableData.value = res.data.records
       total.value = res.data.total
     } else {
@@ -171,7 +244,7 @@ const initData = () => {
 let insuranceType = ref([])
 const initType = () => {
   api.commonApi.personInfo('insurance_type').then(res => {
-    if(res.code == 200) {
+    if (res.code == 200) {
       insuranceType.value = res.data
     } else {
       ElMessage({
@@ -192,14 +265,14 @@ const handleCurrentChange = (page) => {
 
 // 编辑
 const handleEdit = (row) => {
-    myRouter.push({
-      path: '/quoteConfig/agreement/project/projectAdd',
-      query: {
-        id: row.id,
-        companyId: companyId.value,
-        productId: row.productId
-      }
-    })
+  myRouter.push({
+    path: '/quoteConfig/agreement/project/projectAdd',
+    query: {
+      id: row.id,
+      companyId: companyId.value,
+      productId: row.productId
+    }
+  })
 }
 // 删除
 const handleDel = (row) => {
@@ -210,12 +283,12 @@ const handleDel = (row) => {
     showCancelButton: true,
     confirmButtonText: '确定',
     cancelButtonText: '取消',
-  }).then(( action ) => {
-    if(action === 'confirm') {
+  }).then((action) => {
+    if (action === 'confirm') {
       api.projectApi.deleteScheme({
         id: row.id
       }).then(res => {
-        if(res.code == 200) {
+        if (res.code == 200) {
           ElMessage({
             message: res.msg,
             type: 'success'
@@ -229,7 +302,7 @@ const handleDel = (row) => {
         }
       })
     }
-  }).catch(( action ) => {
+  }).catch((action) => {
 
   })
 }
@@ -243,39 +316,38 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
-.project{
-  width: 100%;
-  height: 100%;
-  background: white;
-  h4,p{
-    margin: 5px 0;
-  }
-  .companyList{
-    height: 700px;
-    overflow-y: auto;
-    margin-top: 20px;
-    .companyItem{
-      padding: 10px;
-      cursor: pointer;
-      margin: 10px 0;
-      width: 100%;
-      overflow: hidden;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-      &:hover{
-        background: #f0f0f0;
-      }
-    }
-    .active{
-      padding: 10px;
-      background: #F0F0F0;
-      color: #00a3ec;
-    }
-  }
-  .paginationBox{
-    display: flex;
-    justify-content: center;
-    margin-top: 20px;
+:deep(.main-container){
+  padding: 16px;
+}
+:deep(.el-input-group__append) {
+  color: #fff;
+  background: linear-gradient( 91deg, #4FCAFF 0%, #2B62FF 100%);
+}
+.member-tree {
+  &::after {
+    content: '';
+    position: absolute;
+    height: calc(100% + 40px);
+    width: 1px;
+    background-color: #EEEEEE;
+    top: -16px;
+    right: 0;
+    bottom: -16px;
   }
 }
+.role-item {
+  cursor: pointer;
+}
+
+.on {
+  cursor: pointer;
+  background: #F4FAFF;
+  border-right: 1px solid #0083FF;
+}
+
+.paginationBox {
+  display: flex;
+  justify-content: end;
+  margin-top: 10px;
+}
 </style>