From d803cbd94880cfa29f038bd3260ef78f510050cb Mon Sep 17 00:00:00 2001
From: sunzehua <sunzehua@jchshipping.net>
Date: Tue, 12 Nov 2024 09:43:01 +0800
Subject: [PATCH] =?UTF-8?q?deep=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Cropper/src/CropperAvatar.vue  |   2 +-
 .../header/components/notify/NoticeList.vue   |   2 +-
 .../bookingcabin/CabinInventory/index.vue     | 254 +++--
 .../CabinManagement/detail/index.vue          |  52 +-
 .../bookingcabin/CabinManagement/index.vue    | 891 +++++++++---------
 .../bookingcabin/ContractnoList/index.vue     |   4 +-
 .../bookingcabin/cabinBooking/detail.vue      |   6 +-
 src/views/bookingcabin/cabinBooking/index.vue |   4 +-
 src/views/bookingcabin/generation/index.vue   |   6 +-
 src/views/bookingcabin/labelSet/index.vue     |   4 +-
 .../CustomerReconciliation/detail/index.vue   |  16 +-
 src/views/operation/bill/index.vue            |  14 +-
 src/views/operation/invoicExamine/index.vue   |  14 +-
 .../invoiceApply/detail/InvoiceDetails.vue    |  12 +-
 .../invoiceApply/detail/feeTable.vue          |   2 +-
 .../operation/invoiceApply/detail/index.vue   |  10 +-
 .../invoiceIssue/detail/applyInvoice.vue      |  12 +-
 .../operation/invoiceIssue/detail/index.vue   |   6 +-
 .../seaexport/detail/modules/preOrder.vue     |   2 +-
 .../seaexport/detail/modules/remarksInfo.vue  |   4 +-
 .../TenantAuditStepModal.vue                  |   2 +-
 src/views/system/datarule/index.vue           |   4 +-
 src/views/system/user/UserModal.vue           |   6 +-
 src/views/taskmanage/components/pdf.vue       |   6 +-
 src/views/taskmanage/components/taskData.vue  |   6 +-
 src/views/taskmanage/index.vue                |  24 +-
 src/views/taskmanage/taskList/siFeedback.vue  |   4 +-
 src/views/taskmanage/taskList/taskCustom.vue  |   2 +-
 src/views/taskmanage/taskList/taskStyle.less  |   4 +-
 29 files changed, 654 insertions(+), 721 deletions(-)

diff --git a/src/components/Cropper/src/CropperAvatar.vue b/src/components/Cropper/src/CropperAvatar.vue
index 23a48e0c..d4381859 100644
--- a/src/components/Cropper/src/CropperAvatar.vue
+++ b/src/components/Cropper/src/CropperAvatar.vue
@@ -145,7 +145,7 @@
       cursor: pointer;
       transition: opacity 0.4s;
 
-      ::v-deep(svg) {
+      :deep(svg) {
         margin: auto;
       }
     }
diff --git a/src/layouts/default/header/components/notify/NoticeList.vue b/src/layouts/default/header/components/notify/NoticeList.vue
index ed348a6e..c5a715fd 100644
--- a/src/layouts/default/header/components/notify/NoticeList.vue
+++ b/src/layouts/default/header/components/notify/NoticeList.vue
@@ -144,7 +144,7 @@
       display: none;
     }
 
-    ::v-deep(.ant-pagination-disabled) {
+    :deep(.ant-pagination-disabled) {
       display: inline-block !important;
     }
 
diff --git a/src/views/bookingcabin/CabinInventory/index.vue b/src/views/bookingcabin/CabinInventory/index.vue
index 1e23596c..55727a20 100644
--- a/src/views/bookingcabin/CabinInventory/index.vue
+++ b/src/views/bookingcabin/CabinInventory/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div >
+  <div>
     <BasicTable class="ds-table" @register="registerTable" @row-dbClick="handledbclick">
       <template #toolbar> </template>
       <template v-slot:bodyCell="{ column, record }">
@@ -16,167 +16,159 @@
           <span>{{ record.shipRateTotalCurrency }} {{ record.shipRateTotalAmount }}</span>
         </template>
         <template v-if="column.dataIndex == 'remainCtnsNum'">
-          <span>{{ record.totalOrders  - record.useNum }}</span>
+          <span>{{ record.totalOrders - record.useNum }}</span>
         </template>
         <template v-if="column.dataIndex == 'isRecvBC'">
-          <BulbFilled
-            style="color: green; font-size: 16px"
-            :title="record.lstRecvBCDate"
-            v-if="record.isRecvBC"
-          />
+          <BulbFilled style="color: green; font-size: 16px" :title="record.lstRecvBCDate" v-if="record.isRecvBC" />
         </template>
         <template v-if="column.dataIndex == 'isRecvBKCancel'">
-          <BulbFilled
-            style="color: red; font-size: 16px"
-            :title="record.lstRecvBCDate"
-            v-if="record.isRecvBKCancel"
-          />
+          <BulbFilled style="color: red; font-size: 16px" :title="record.lstRecvBCDate" v-if="record.isRecvBKCancel" />
         </template>
         <template v-if="column.dataIndex == 'isShipperOwned'">
           <CheckCircleFilled v-if="record.isShipperOwned" style="color: green; font-size: 16px" />
         </template>
         <template v-if="column.dataIndex === 'action'">
-          <a @click="handleRefsh(record)"  >刷新</a>
+          <a @click="handleRefsh(record)">刷新</a>
         </template>
       </template>
     </BasicTable>
   </div>
 </template>
 <script lang="ts" setup>
-  import { BasicTable, useTable, TableAction } from '/@/components/Table'
-  import { BookingSlotPageStock,BookingSlotRefreshStock } from './api'
-  import { columns, searchFormSchema, FeeStatus } from './columns'
-  import { BulbFilled, CheckCircleFilled } from '@ant-design/icons-vue'
-  import { useModal } from '/@/components/Modal'
-  import { formatParams } from '/@/hooks/web/common'
-  import { useMessage } from '../../../hooks/web/useMessage'
+import { BasicTable, useTable, TableAction } from '/@/components/Table'
+import { BookingSlotPageStock, BookingSlotRefreshStock } from './api'
+import { columns, searchFormSchema, FeeStatus } from './columns'
+import { BulbFilled, CheckCircleFilled } from '@ant-design/icons-vue'
+import { useModal } from '/@/components/Modal'
+import { formatParams } from '/@/hooks/web/common'
+import { useMessage } from '../../../hooks/web/useMessage'
 const { createMessage } = useMessage()
-  const [registerModal, { openModal }] = useModal()
-  const [registerTable, { reload, getForm, getPaginationRef, getSelectRows, setProps }] = useTable({
-    title: '',
-    api: async (p) => {
-      const res: API.DataResult = await BookingSlotPageStock(p)
-      return new Promise((resolve) => {
-        resolve({
-          data: res.data,
-          total: res.count,
-        })
+const [registerModal, { openModal }] = useModal()
+const [registerTable, { reload, getForm, getPaginationRef, getSelectRows, setProps }] = useTable({
+  title: '',
+  api: async (p) => {
+    const res: API.DataResult = await BookingSlotPageStock(p)
+    return new Promise((resolve) => {
+      resolve({
+        data: res.data,
+        total: res.count,
       })
-    },
-    beforeFetch: (p) => {
-      return formatParams(p)
-    },
-    columns,
-    formConfig: {
-      labelWidth: 120,
-      schemas: searchFormSchema,
-    },
-    isTreeTable: false,
-    pagination: true,
-    striped: true,
-    useSearchForm: true,
-    showTableSetting: true,
-    bordered: true,
-    showIndexColumn: true,
-    indexColumnProps: {
-      width: 60,
-    },
-    canResize: true,
-    resizeHeightOffset: 35,
-    immediate: true,
+    })
+  },
+  beforeFetch: (p) => {
+    return formatParams(p)
+  },
+  columns,
+  formConfig: {
+    labelWidth: 120,
+    schemas: searchFormSchema,
+  },
+  isTreeTable: false,
+  pagination: true,
+  striped: true,
+  useSearchForm: true,
+  showTableSetting: true,
+  bordered: true,
+  showIndexColumn: true,
+  indexColumnProps: {
+    width: 60,
+  },
+  canResize: true,
+  resizeHeightOffset: 35,
+  immediate: true,
 
-    actionColumn: {
-      width: 50,
-      title: '操作',
-      dataIndex: 'action',
-      fixed: 'right',
-    },
-  })
-  function handledbclick(record) {
-    console.log('双击')
-  }
-  function handleAdd() {
-    openModal(true, 123)
-  }
-  function handleRefsh(row){
-    const data = {
-        vessel: row.vessel,
-        voyno: row.voyno,
-        contracT_NO: row.contracT_NO,
-        portloadid: row.portloadid,
-        portdischargeid: row.portdischargeid,
-        bookinG_SLOT_TYPE: row.bookinG_SLOT_TYPE,
-        carrierid: row.carrierid
-      }
-      setProps({ loading: true })
-      BookingSlotRefreshStock(data).then(res => {
-        if (res.succeeded) {
-          createMessage.success('刷新成功')
-          reload()
-        } else {
-          createMessage.error(res.message)
-        }
-        setProps({ loading: false })
-      })
+  actionColumn: {
+    width: 50,
+    title: '操作',
+    dataIndex: 'action',
+    fixed: 'right',
+  },
+})
+function handledbclick(record) {
+  console.log('双击')
+}
+function handleAdd() {
+  openModal(true, 123)
+}
+function handleRefsh(row) {
+  const data = {
+    vessel: row.vessel,
+    voyno: row.voyno,
+    contracT_NO: row.contracT_NO,
+    portloadid: row.portloadid,
+    portdischargeid: row.portdischargeid,
+    bookinG_SLOT_TYPE: row.bookinG_SLOT_TYPE,
+    carrierid: row.carrierid
   }
+  setProps({ loading: true })
+  BookingSlotRefreshStock(data).then(res => {
+    if (res.succeeded) {
+      createMessage.success('刷新成功')
+      reload()
+    } else {
+      createMessage.error(res.message)
+    }
+    setProps({ loading: false })
+  })
+}
 </script>
 
 <style lang="less" scoped>
-  /deep/ .ant-form-item {
-    margin-bottom: 10px !important;
-  }
+:deep(.ant-form-item) {
+  margin-bottom: 10px !important;
+}
 
-  /deep/ .ant-card-body {
-    padding-bottom: 0px !important;
-  }
+:deep(.ant-card-body) {
+  padding-bottom: 0px !important;
+}
 
-  .table-operator {
-    margin-bottom: 18px;
-  }
+.table-operator {
+  margin-bottom: 18px;
+}
 
-  .Close {
-    height: 45px;
-    overflow: hidden;
-  }
+.Close {
+  height: 45px;
+  overflow: hidden;
+}
 
-  .vxe-table--render-default .vxe-body--row.row--stripe {
-    background: #f5f9fe;
-  }
+.vxe-table--render-default .vxe-body--row.row--stripe {
+  background: #f5f9fe;
+}
 
-  .ant-card-body {
-    padding-top: 10px;
-  }
+.ant-card-body {
+  padding-top: 10px;
+}
 
-  .inline {
-    position: relative;
-  }
+.inline {
+  position: relative;
+}
 
-  .inline-right {
-    position: absolute;
-    top: 6px;
-    right: 25px;
-  }
+.inline-right {
+  position: absolute;
+  top: 6px;
+  right: 25px;
+}
 
-  .change {
-    display: flex;
-    justify-content: center;
-    margin-top: 25px;
+.change {
+  display: flex;
+  justify-content: center;
+  margin-top: 25px;
 
-    div {
-      width: 120px;
-      height: 50px;
-      background-color: rgb(247, 249, 250);
-      border: 1px solid rgb(247, 249, 250);
-      color: rgb(105, 102, 102);
-      line-height: 50px;
-      text-align: center;
-      cursor: pointer;
-      transition: box-shadow 0.3s, background-color 0.3s;
-      margin-right: 10px;
-    }
+  div {
+    width: 120px;
+    height: 50px;
+    background-color: rgb(247, 249, 250);
+    border: 1px solid rgb(247, 249, 250);
+    color: rgb(105, 102, 102);
+    line-height: 50px;
+    text-align: center;
+    cursor: pointer;
+    transition: box-shadow 0.3s, background-color 0.3s;
+    margin-right: 10px;
+  }
 
-    div:hover {
-      border: 1px solid #d1cfcf;
-    }
+  div:hover {
+    border: 1px solid #d1cfcf;
   }
+}
 </style>
diff --git a/src/views/bookingcabin/CabinManagement/detail/index.vue b/src/views/bookingcabin/CabinManagement/detail/index.vue
index 38470e9b..75ed556f 100644
--- a/src/views/bookingcabin/CabinManagement/detail/index.vue
+++ b/src/views/bookingcabin/CabinManagement/detail/index.vue
@@ -283,7 +283,7 @@
             </a-form-item>
         </a-modal>
         <a-modal @ok="handleSaveRoll" title="舱位延迟" width="600px" @cancel="rollFlag = false" :visible="rollFlag">
-            <a-spin :spinning="rollLoad" >
+            <a-spin :spinning="rollLoad">
                 <BasicForm @register="registerFormRoll" />
             </a-spin>
         </a-modal>
@@ -294,7 +294,7 @@ import { GetCtnSelectList, GetClientListByCode } from '/@/api/common'
 import DsFile from '/@/components/File/index.vue'
 import { ref, nextTick, onMounted, watch } from 'vue'
 import {
-    BookingSlotSave, BookingSlotDetail, SaveRolling,GetRollingList
+    BookingSlotSave, BookingSlotDetail, SaveRolling, GetRollingList
 } from '../api'
 import {
     GetCustomerServiceList, GetSaleList, GetVouchingClerkList
@@ -740,15 +740,15 @@ function getDetail() {
         }
         loading.value = false
     })
-    GetRollingList({ slotId: id.value }).then(res=>{
-        if(res.succeeded){
+    GetRollingList({ slotId: id.value }).then(res => {
+        if (res.succeeded) {
             setTableData(res.data)
         }
     })
 }
 const rollLoad = ref(false)
-function handleSaveRoll(){
-    if(!form.value.id){
+function handleSaveRoll() {
+    if (!form.value.id) {
         createMessage.error('请先保存数据')
         return false
     }
@@ -757,13 +757,13 @@ function handleSaveRoll(){
     }
     data.slotId = form.value.id
     rollLoad.value = true
-    SaveRolling(data).then(res=>{
-        if(res.succeeded){
+    SaveRolling(data).then(res => {
+        if (res.succeeded) {
             createMessage.success('保存成功')
             getDetail()
         }
         rollLoad.value = false
-    }).catch(()=>{
+    }).catch(() => {
         rollLoad.value = false
     })
 }
@@ -990,11 +990,11 @@ function getWeek(dateTime) {
 }
 </script>
 <style lang="less" scoped>
-/deep/ .ant-form-item-control-input-content div {
+:deep(.ant-form-item-control-input-content div) {
     font-size: 12px !important;
 }
 
-/deep/ .ant-input-number-handler-wrap {
+:deep(.ant-input-number-handler-wrap) {
     opacity: 1;
 }
 
@@ -1060,17 +1060,17 @@ function getWeek(dateTime) {
     display: flex;
     flex-wrap: wrap;
 
-    /deep/ .ant-input-number-input {
+    :deep(.ant-input-number-input) {
         background-color: rgba(245, 249, 252, 1);
         ;
     }
 
-    /deep/ .ant-input-number-affix-wrapper {
+    :deep(.ant-input-number-affix-wrapper) {
         background-color: rgba(245, 249, 252, 1);
         ;
     }
 
-    /deep/ .ant-input-number-input {
+    :deep(.ant-input-number-input) {
         text-align: center;
     }
 
@@ -1278,49 +1278,49 @@ function getWeek(dateTime) {
     margin-bottom: 10px;
 }
 
-/deep/ .ant-form-item {
+:deep(.ant-form-item) {
     margin-bottom: 10px !important;
 }
 
 
 
 
-/deep/ .ant-table.ant-table-bordered>.ant-table-container {
+:deep(.ant-table.ant-table-bordered>.ant-table-container) {
     border-left: none !important;
 }
 
-/deep/ .ds-table .ant-table-container,
-.ds-table-detail .ant-table-container {
+:deep(.ds-table .ant-table-container,
+    .ds-table-detail .ant-table-container) {
     padding: 0px !important;
 }
 
 .bookslot {
-    /deep/ .ant-input {
+    :deep(.ant-input)  {
         height: 26px;
     }
 
-    /deep/ .ant-input-number-input {
+    :deep( .ant-input-number-input) {
         height: 26px;
     }
 
-    /deep/ .ant-picker-input>input {
+    :deep(.ant-picker-input>input)  {
         height: 26px;
     }
 
-    /deep/ .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
+    :deep(.ant-select-single:not(.ant-select-customize-input) .ant-select-selector)  {
         height: 26px;
     }
 
-    /deep/ .ant-select-single:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-search-input {
+    :deep(.ant-select-single:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-search-input)  {
         height: 26px;
     }
 
-    /deep/ .ant-picker {
+    :deep(.ant-picker) {
         height: 26px;
     }
 
-    /deep/ .ant-select-single .ant-select-selector .ant-select-selection-item,
-    .ant-select-single .ant-select-selector .ant-select-selection-placeholder {
+    :deep(.ant-select-single .ant-select-selector .ant-select-selection-item,
+    .ant-select-single .ant-select-selector .ant-select-selection-placeholder)  {
         line-height: 26px;
     }
 }
diff --git a/src/views/bookingcabin/CabinManagement/index.vue b/src/views/bookingcabin/CabinManagement/index.vue
index 2224731d..c71942be 100644
--- a/src/views/bookingcabin/CabinManagement/index.vue
+++ b/src/views/bookingcabin/CabinManagement/index.vue
@@ -10,17 +10,12 @@
           <span class="iconfont icon-shujuyingshe"></span>
           合票
         </a-button>
-        <a-upload
-          :customRequest="customRequest"
-          :multiple="false"
+        <a-upload :customRequest="customRequest" :multiple="false"
           accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
-          :showUploadList="false"
-          name="file"
-        >
+          :showUploadList="false" name="file">
           <a-button size="mini" type="link">
             <span class="iconfont icon-a-17Fdaoru"></span>
-            导入</a-button
-          >
+            导入</a-button>
         </a-upload>
         <a-button type="link" @click="handleSuport" :loading="loadingExport" size="mini">
           <span class="iconfont icon-jiantouxia"></span>
@@ -36,12 +31,7 @@
           <span class="iconfont icon-jiahao2fill"></span>
           新增
         </a-button>
-        <a-popconfirm
-          title="确定删除吗?"
-          ok-text="确定"
-          cancel-text="取消"
-          @confirm="handleDeleteAll"
-        >
+        <a-popconfirm title="确定删除吗?" ok-text="确定" cancel-text="取消" @confirm="handleDeleteAll">
           <a-button type="link" size="mini">
             <span class="iconfont icon-shanchu2"></span>
             删除
@@ -67,102 +57,67 @@
           <span>{{ record.shipRateTotalCurrency }} {{ record.shipRateTotalAmount }}</span>
         </template>
         <template v-if="column.dataIndex == 'iS_CANCELLATION'">
-          <BulbOutlined
-            v-if="record.iS_CANCELLATION"
-            style="color: red; font-size: 16px"
-            :title="record.cancellatioN_DATE"
-          />
+          <BulbOutlined v-if="record.iS_CANCELLATION" style="color: red; font-size: 16px"
+            :title="record.cancellatioN_DATE" />
         </template>
         <template v-if="column.dataIndex == 'isRecvBC'">
-          <BulbFilled
-            style="color: green; font-size: 16px"
-            :title="record.lstRecvBCDate"
-            v-if="record.isRecvBC"
-          />
+          <BulbFilled style="color: green; font-size: 16px" :title="record.lstRecvBCDate" v-if="record.isRecvBC" />
         </template>
         <template v-if="column.dataIndex == 'labelList'">
           <div @click="handleLabelBind(record)" style="min-width: 200px; min-height: 15px">
-            <a-tag
-              style="color: black !important; font-weight: bold; cursor: pointer"
-              :color="item.color"
-              @click="handleLabelBind(record)"
-              v-for="(item, index) in record.labelList"
-              :key="index"
-              >{{ item.name }}</a-tag
-            >
+            <a-tag style="color: black !important; font-weight: bold; cursor: pointer" :color="item.color"
+              @click="handleLabelBind(record)" v-for="(item, index) in record.labelList" :key="index">{{ item.name
+              }}</a-tag>
           </div>
         </template>
         <template v-if="column.dataIndex == 'isRecvBKCancel'">
-          <BulbFilled
-            style="color: red; font-size: 16px"
-            :title="record.lstRecvBCDate"
-            v-if="record.isRecvBKCancel"
-          />
+          <BulbFilled style="color: red; font-size: 16px" :title="record.lstRecvBCDate" v-if="record.isRecvBKCancel" />
         </template>
         <template v-if="column.dataIndex == 'isShipperOwned'">
           <CheckCircleFilled v-if="record.isShipperOwned" style="color: green; font-size: 16px" />
         </template>
         <template v-if="column.key === 'action'">
-          <TableAction
-            :actions="[
-              {
-                icon: 'clarity:note-edit-line',
-                tooltip: '编辑',
-                onClick: () => {
-                  handleEdit(record)
-                },
+          <TableAction :actions="[
+            {
+              icon: 'clarity:note-edit-line',
+              tooltip: '编辑',
+              onClick: () => {
+                handleEdit(record)
               },
-              {
-                icon: 'ant-design:delete-outlined',
-                tooltip: '删除',
-                popConfirm: {
-                  title: '是否要删除？',
-                  okText: '是',
-                  cancelText: '否',
-                  confirm: handleDelete.bind(null, record),
-                },
+            },
+            {
+              icon: 'ant-design:delete-outlined',
+              tooltip: '删除',
+              popConfirm: {
+                title: '是否要删除？',
+                okText: '是',
+                cancelText: '否',
+                confirm: handleDelete.bind(null, record),
               },
-              {
-                icon: 'ant-design:profile-outlined',
-                tooltip: '生成订舱',
-                onClick: () => {
-                  handleOpenSlot(record)
-                },
+            },
+            {
+              icon: 'ant-design:profile-outlined',
+              tooltip: '生成订舱',
+              onClick: () => {
+                handleOpenSlot(record)
               },
-            ]"
-          />
+            },
+          ]" />
         </template>
       </template>
     </BasicTable>
-    <a-modal
-      width="800px"
-      @ok="handleSubmitLabel"
-      :visible="visible"
-      title="分配标签"
-      @cancel="visible = false"
-    >
+    <a-modal width="800px" @ok="handleSubmitLabel" :visible="visible" title="分配标签" @cancel="visible = false">
       <a-spin :spinning="labelLoad">
         <div class="content">
-          <div
-            class="items"
-            v-for="(serive, sindex) in labelList"
-            :key="sindex"
-            @click="handleClickLable(sindex)"
-            :class="{ active: serive.isActive }"
-          >
+          <div class="items" v-for="(serive, sindex) in labelList" :key="sindex" @click="handleClickLable(sindex)"
+            :class="{ active: serive.isActive }">
             {{ serive.name }}
           </div>
         </div>
       </a-spin>
     </a-modal>
     <generationModal ref="generation" @register="registerModal"> </generationModal>
-    <a-modal
-      title="多提单号查询"
-      :width="400"
-      :visible="moreFlag"
-      @ok="moreNumSubmit"
-      @cancel="moreFlag = false"
-    >
+    <a-modal title="多提单号查询" :width="400" :visible="moreFlag" @ok="moreNumSubmit" @cancel="moreFlag = false">
       <div>
         <a-textarea v-model:value="moreNumVal" style="height: 200px" />
       </div>
@@ -170,442 +125,442 @@
   </div>
 </template>
 <script lang="ts" setup name="舱位台账">
-  import { BasicTable, useTable, TableAction } from '/@/components/Table'
-  import {
-    BookingSlotPage,
-    BookingLabelList,
-    BookingLabelBind,
-    GetMergeList,
-    ImportSlotFromFile,
-    PrintOrder,
-    BookingSlotDelete,
-  } from './api'
-  import { reactive, ref, h, onMounted } from 'vue'
-  import { columns, searchFormSchema, FeeStatus } from './columns'
-  import { BulbFilled, CheckCircleFilled, BulbOutlined } from '@ant-design/icons-vue'
-  import { useModal } from '/@/components/Modal'
-  import generationModal from '../generation/index.vue'
-  import { formatParams } from '/@/hooks/web/common'
-  import { useGo } from '/@/hooks/web/usePage'
-  import { useOptionsStore } from '/@/store/modules/options'
-  import { useMessage } from '../../../hooks/web/useMessage'
-  const { createMessage } = useMessage()
-  const optionsStore = useOptionsStore()
-  const go = useGo()
-  const queryStr = ref({})
-  const [registerModal, { openModal }] = useModal()
-  const [
-    registerTable,
-    { reload, setLoading, getForm, getSelectRows, setProps, setSelectedRowKeys },
-  ] = useTable({
-    title: '',
-    api: async (p) => {
-      const res: API.DataResult = await BookingSlotPage(p)
-      return new Promise((resolve) => {
-        const arr = res.data
-        for (let i = arr.length - 1; i >= 0; i--) {
-          if (arr[i].bookingSlotSaleInfoList && arr[i].bookingSlotSaleInfoList.length > 1) {
-            arr[i].bookingSlotSaleInfoList.forEach((ite, index) => {
-              const data = JSON.parse(JSON.stringify(arr[i]))
-              delete data.bookingSlotSaleInfoList
-              data.isRemark = true
-              data.dzmarkLoading = false
-              if (index === 0) {
-                data.isSPan = arr[i].bookingSlotSaleInfoList.length
-              } else {
-                data.isSPan = 0
-              }
-              arr.push({
-                ...ite,
-                ...data,
-              })
+import { BasicTable, useTable, TableAction } from '/@/components/Table'
+import {
+  BookingSlotPage,
+  BookingLabelList,
+  BookingLabelBind,
+  GetMergeList,
+  ImportSlotFromFile,
+  PrintOrder,
+  BookingSlotDelete,
+} from './api'
+import { reactive, ref, h, onMounted } from 'vue'
+import { columns, searchFormSchema, FeeStatus } from './columns'
+import { BulbFilled, CheckCircleFilled, BulbOutlined } from '@ant-design/icons-vue'
+import { useModal } from '/@/components/Modal'
+import generationModal from '../generation/index.vue'
+import { formatParams } from '/@/hooks/web/common'
+import { useGo } from '/@/hooks/web/usePage'
+import { useOptionsStore } from '/@/store/modules/options'
+import { useMessage } from '../../../hooks/web/useMessage'
+const { createMessage } = useMessage()
+const optionsStore = useOptionsStore()
+const go = useGo()
+const queryStr = ref({})
+const [registerModal, { openModal }] = useModal()
+const [
+  registerTable,
+  { reload, setLoading, getForm, getSelectRows, setProps, setSelectedRowKeys },
+] = useTable({
+  title: '',
+  api: async (p) => {
+    const res: API.DataResult = await BookingSlotPage(p)
+    return new Promise((resolve) => {
+      const arr = res.data
+      for (let i = arr.length - 1; i >= 0; i--) {
+        if (arr[i].bookingSlotSaleInfoList && arr[i].bookingSlotSaleInfoList.length > 1) {
+          arr[i].bookingSlotSaleInfoList.forEach((ite, index) => {
+            const data = JSON.parse(JSON.stringify(arr[i]))
+            delete data.bookingSlotSaleInfoList
+            data.isRemark = true
+            data.dzmarkLoading = false
+            if (index === 0) {
+              data.isSPan = arr[i].bookingSlotSaleInfoList.length
+            } else {
+              data.isSPan = 0
+            }
+            arr.push({
+              ...ite,
+              ...data,
             })
-            arr.splice(i, 1)
-          }
-          if (arr[i].bookingSlotSaleInfoList && arr[i].bookingSlotSaleInfoList.length == 1) {
-            arr[i].op = arr[i].bookingSlotSaleInfoList[0].op
-            arr[i].customerName = arr[i].bookingSlotSaleInfoList[0].customerName
-            arr[i].custService = arr[i].bookingSlotSaleInfoList[0].custService
-            arr[i].saleTime = arr[i].bookingSlotSaleInfoList[0].saleTime
-            arr[i].sellingPrice = arr[i].bookingSlotSaleInfoList[0].sellingPrice
-            arr[i].goodsName = arr[i].bookingSlotSaleInfoList[0].goodsName
-            arr[i].shipper = arr[i].bookingSlotSaleInfoList[0].shipper
-            arr[i].sale = arr[i].bookingSlotSaleInfoList[0].sale
-            arr[i].business = arr[i].bookingSlotSaleInfoList[0].business
-            arr[i].doc = arr[i].bookingSlotSaleInfoList[0].doc
-          }
-          arr[i].isRemark = true
-          arr[i].dzmarkLoading = false
+          })
+          arr.splice(i, 1)
         }
-        setProps({
-          showIndexColumn: false,
-        }),
-          resolve({ data: arr, total: res.count })
-        optionsStore.getOptionsByCode('GetClientPortSelectList')
-      })
-    },
-    beforeFetch: (p) => {
-      queryStr.value = formatParams(p)
-      return formatParams(p)
-    },
-    columns,
-    formConfig: {
-      labelWidth: 120,
-      schemas: searchFormSchema,
-      useAdvancedSearch: true,
-    },
-    isTreeTable: false,
-    pagination: true,
-    striped: true,
-    useSearchForm: true,
-    showTableSetting: true,
-    bordered: true,
-    showIndexColumn: true,
-    rowKey: 'id',
-    indexColumnProps: {
-      width: 60,
-    },
-    canResize: true,
-    resizeHeightOffset: 35,
-    immediate: true,
-  })
-  const generation = ref('')
-  function handleOpenSlot(row) {
-    openModal(true, { type: 'cabin', row: row })
-  }
-  function handleRowclick(record, index, event) {
-    console.log(record, index, event)
-  }
-  function handledbclick(record) {
-    go(`/CabinManagementDetail?type=edit&id=${record.id}`)
-  }
-  function handleDelete(row) {
-    setLoading(true)
-    BookingSlotDelete([row.id]).then((res) => {
-      if (res.succeeded) {
-        reload()
-      } else {
-        createMessage.error(res.message)
+        if (arr[i].bookingSlotSaleInfoList && arr[i].bookingSlotSaleInfoList.length == 1) {
+          arr[i].op = arr[i].bookingSlotSaleInfoList[0].op
+          arr[i].customerName = arr[i].bookingSlotSaleInfoList[0].customerName
+          arr[i].custService = arr[i].bookingSlotSaleInfoList[0].custService
+          arr[i].saleTime = arr[i].bookingSlotSaleInfoList[0].saleTime
+          arr[i].sellingPrice = arr[i].bookingSlotSaleInfoList[0].sellingPrice
+          arr[i].goodsName = arr[i].bookingSlotSaleInfoList[0].goodsName
+          arr[i].shipper = arr[i].bookingSlotSaleInfoList[0].shipper
+          arr[i].sale = arr[i].bookingSlotSaleInfoList[0].sale
+          arr[i].business = arr[i].bookingSlotSaleInfoList[0].business
+          arr[i].doc = arr[i].bookingSlotSaleInfoList[0].doc
+        }
+        arr[i].isRemark = true
+        arr[i].dzmarkLoading = false
       }
-      setLoading(false)
+      setProps({
+        showIndexColumn: false,
+      }),
+        resolve({ data: arr, total: res.count })
+      optionsStore.getOptionsByCode('GetClientPortSelectList')
     })
-  }
-  const labelIdArray = ref([])
-  const labelList = ref([]) as any
-  const labelLoad = ref(false)
-  const visible = ref(false)
-  function handleLabel() {
-    const select = getSelectRows()
-    const pkIdArr = select.map((item, index) => {
-      return item.id
-    })
-    if (pkIdArr.length === 0) {
-      createMessage.error('请选择要分配的数据')
-      return false
+  },
+  beforeFetch: (p) => {
+    queryStr.value = formatParams(p)
+    return formatParams(p)
+  },
+  columns,
+  formConfig: {
+    labelWidth: 120,
+    schemas: searchFormSchema,
+    useAdvancedSearch: true,
+  },
+  isTreeTable: false,
+  pagination: true,
+  striped: true,
+  useSearchForm: true,
+  showTableSetting: true,
+  bordered: true,
+  showIndexColumn: true,
+  rowKey: 'id',
+  indexColumnProps: {
+    width: 60,
+  },
+  canResize: true,
+  resizeHeightOffset: 35,
+  immediate: true,
+})
+const generation = ref('')
+function handleOpenSlot(row) {
+  openModal(true, { type: 'cabin', row: row })
+}
+function handleRowclick(record, index, event) {
+  console.log(record, index, event)
+}
+function handledbclick(record) {
+  go(`/CabinManagementDetail?type=edit&id=${record.id}`)
+}
+function handleDelete(row) {
+  setLoading(true)
+  BookingSlotDelete([row.id]).then((res) => {
+    if (res.succeeded) {
+      reload()
+    } else {
+      createMessage.error(res.message)
     }
-    visible.value = true
-    labelIdArray.value = []
-    labelLoad.value = true
-    BookingLabelList({ scope: 1 }).then((res) => {
-      res.data.forEach((item) => {
-        item.isActive = false
-      })
-      labelList.value = res.data
-      labelLoad.value = false
-    })
+    setLoading(false)
+  })
+}
+const labelIdArray = ref([])
+const labelList = ref([]) as any
+const labelLoad = ref(false)
+const visible = ref(false)
+function handleLabel() {
+  const select = getSelectRows()
+  const pkIdArr = select.map((item, index) => {
+    return item.id
+  })
+  if (pkIdArr.length === 0) {
+    createMessage.error('请选择要分配的数据')
+    return false
   }
-  function handleDeleteAll() {
-    const select = getSelectRows()
-    const pkIdArr = select.map((item, index) => {
-      return item.id
+  visible.value = true
+  labelIdArray.value = []
+  labelLoad.value = true
+  BookingLabelList({ scope: 1 }).then((res) => {
+    res.data.forEach((item) => {
+      item.isActive = false
     })
-    if (pkIdArr.length === 0) {
-      createMessage.error('请选择要删除的数据')
-      return false
+    labelList.value = res.data
+    labelLoad.value = false
+  })
+}
+function handleDeleteAll() {
+  const select = getSelectRows()
+  const pkIdArr = select.map((item, index) => {
+    return item.id
+  })
+  if (pkIdArr.length === 0) {
+    createMessage.error('请选择要删除的数据')
+    return false
+  }
+  setLoading(true)
+  BookingSlotDelete(pkIdArr).then((res) => {
+    if (res.succeeded) {
+      reload()
+    } else {
+      createMessage.error(res.message)
     }
-    setLoading(true)
-    BookingSlotDelete(pkIdArr).then((res) => {
-      if (res.succeeded) {
-        reload()
-      } else {
-        createMessage.error(res.message)
+    setLoading(false)
+  })
+}
+const moreNumVal = ref('')
+function moreNumSubmit() {
+  let data = ''
+  moreNumVal.value
+    .replace(/\n|\r/g, ',')
+    .split(',')
+    .forEach((item) => {
+      if (item.replace(/\s*/g, '')) {
+        if (data) {
+          data = `${data},${item}`
+        } else {
+          data = item
+        }
       }
-      setLoading(false)
     })
-  }
-  const moreNumVal = ref('')
-  function moreNumSubmit() {
-    let data = ''
-    moreNumVal.value
-      .replace(/\n|\r/g, ',')
-      .split(',')
-      .forEach((item) => {
-        if (item.replace(/\s*/g, '')) {
-          if (data) {
-            data = `${data},${item}`
-          } else {
-            data = item
+  getForm().setFieldsValue({
+    slotBookingNo: data,
+  })
+  moreFlag.value = false
+}
+const moreFlag = ref(false)
+function handleOpenS() {
+  moreFlag.value = true
+}
+function handleLabelBind(row) {
+  visible.value = true
+  labelIdArray.value = []
+  labelLoad.value = true
+  // setSelectedRowKeys([row.id])
+  BookingLabelList({ scope: 1 }).then((res) => {
+    res.data.forEach((item) => {
+      item.isActive = false
+      if (row.labelList) {
+        row.labelList.forEach((ite) => {
+          if (ite.id === item.id) {
+            item.isActive = true
           }
-        }
-      })
-    getForm().setFieldsValue({
-      slotBookingNo: data,
+        })
+      }
     })
-    moreFlag.value = false
-  }
-  const moreFlag = ref(false)
-  function handleOpenS() {
-    moreFlag.value = true
-  }
-  function handleLabelBind(row) {
-    visible.value = true
-    labelIdArray.value = []
-    labelLoad.value = true
-    // setSelectedRowKeys([row.id])
-    BookingLabelList({ scope: 1 }).then((res) => {
-      res.data.forEach((item) => {
-        item.isActive = false
-        if (row.labelList) {
-          row.labelList.forEach((ite) => {
-            if (ite.id === item.id) {
-              item.isActive = true
-            }
-          })
-        }
-      })
-      labelList.value = res.data
-      labelLoad.value = false
+    labelList.value = res.data
+    labelLoad.value = false
+  })
+}
+function customRequest(data) {
+  const formData = new FormData()
+  formData.append('file', data.file)
+  setLoading(true)
+  ImportSlotFromFile(formData)
+    .then((res) => {
+      reload()
+      setLoading(false)
     })
-  }
-  function customRequest(data) {
-    const formData = new FormData()
-    formData.append('file', data.file)
-    setLoading(true)
-    ImportSlotFromFile(formData)
-      .then((res) => {
-        reload()
-        setLoading(false)
-      })
-      .catch((err) => {
-        setLoading(false)
-      })
-  }
+    .catch((err) => {
+      setLoading(false)
+    })
+}
 
-  function handleAdd() {
-    go(`/CabinManagementDetail?type=Add`)
-  }
-  function handleEdit(row) {
-    go(`/CabinManagementDetail?type=edit&id=${row.id}`)
-  }
+function handleAdd() {
+  go(`/CabinManagementDetail?type=Add`)
+}
+function handleEdit(row) {
+  go(`/CabinManagementDetail?type=edit&id=${row.id}`)
+}
 
-  function handleSubmitLabel() {
-    const select = getSelectRows()
-    const pkIdArr = select.map((item, index) => {
-      return item.id
-    })
-    const arr = [] as any
-    labelList.value.forEach((item) => {
-      if (item.isActive) {
-        arr.push(item.id)
-      }
-    })
-    const data = {
-      labelIdArray: arr,
-      businessIdArray: pkIdArr,
+function handleSubmitLabel() {
+  const select = getSelectRows()
+  const pkIdArr = select.map((item, index) => {
+    return item.id
+  })
+  const arr = [] as any
+  labelList.value.forEach((item) => {
+    if (item.isActive) {
+      arr.push(item.id)
     }
-    labelLoad.value = true
-    BookingLabelBind(data).then((res) => {
-      if (res.succeeded) {
-        createMessage.success('分配成功')
-        visible.value = false
-        reload()
-      } else {
-        createMessage.error(res.message)
-      }
-      labelLoad.value = false
-    })
+  })
+  const data = {
+    labelIdArray: arr,
+    businessIdArray: pkIdArr,
   }
-  const sumload = ref(false)
-  function handleSum() {
-    const select = getSelectRows()
-    const pkIdArr = select.map((item, index) => {
-      return item.id
-    })
-    if (select.length <= 1) {
-      createMessage.warning('至少选择两条数据')
-      return false
+  labelLoad.value = true
+  BookingLabelBind(data).then((res) => {
+    if (res.succeeded) {
+      createMessage.success('分配成功')
+      visible.value = false
+      reload()
+    } else {
+      createMessage.error(res.message)
     }
-    const data = {
-      mergeList: pkIdArr,
+    labelLoad.value = false
+  })
+}
+const sumload = ref(false)
+function handleSum() {
+  const select = getSelectRows()
+  const pkIdArr = select.map((item, index) => {
+    return item.id
+  })
+  if (select.length <= 1) {
+    createMessage.warning('至少选择两条数据')
+    return false
+  }
+  const data = {
+    mergeList: pkIdArr,
+  }
+  sumload.value = true
+  GetMergeList(data).then((res) => {
+    if (res.succeeded) {
+      this.$refs.generation.initSum(res.data)
+    } else {
+      createMessage.error(res.message)
     }
-    sumload.value = true
-    GetMergeList(data).then((res) => {
+    sumload.value = false
+  })
+}
+function handleClickLable(index) {
+  labelList.value[index].isActive = !labelList.value[index].isActive
+}
+const loadingExport = ref(false)
+function handleSuport() {
+  loadingExport.value = true
+  if (getSelectRows().length > 0) {
+    const arr = []
+    getSelectRows().forEach((item) => {
+      arr.push(item.id)
+    })
+    queryStr.value.otherQueryCondition = arr.join(',')
+  }
+  PrintOrder(queryStr.value)
+    .then((res) => {
       if (res.succeeded) {
-        this.$refs.generation.initSum(res.data)
+        const fname = res.data // 下载文件的名字
+        const link = document.createElement('a')
+        link.href = `http://118.190.144.189:3008/LinkAttach/${res.data}`
+        link.setAttribute('download', fname)
+        document.body.appendChild(link)
+        link.click()
       } else {
         createMessage.error(res.message)
       }
-      sumload.value = false
+      loadingExport.value = false
     })
-  }
-  function handleClickLable(index) {
-    labelList.value[index].isActive = !labelList.value[index].isActive
-  }
-  const loadingExport = ref(false)
-  function handleSuport() {
-    loadingExport.value = true
-    if (getSelectRows().length > 0) {
-      const arr = []
-      getSelectRows().forEach((item) => {
-        arr.push(item.id)
-      })
-      queryStr.value.otherQueryCondition = arr.join(',')
-    }
-    PrintOrder(queryStr.value)
-      .then((res) => {
-        if (res.succeeded) {
-          const fname = res.data // 下载文件的名字
-          const link = document.createElement('a')
-          link.href = `http://118.190.144.189:3008/LinkAttach/${res.data}`
-          link.setAttribute('download', fname)
-          document.body.appendChild(link)
-          link.click()
-        } else {
-          createMessage.error(res.message)
-        }
-        loadingExport.value = false
-      })
-      .catch(() => {
-        loadingExport.value = false
-      })
-  }
+    .catch(() => {
+      loadingExport.value = false
+    })
+}
 </script>
 
 <style lang="less" scoped>
-  /deep/ .ant-form-item {
-    margin-bottom: 10px !important;
-  }
+:deep(.ant-form-item) {
+  margin-bottom: 10px !important;
+}
 
-  /deep/ .ant-card-body {
-    padding-bottom: 0px !important;
-  }
+:deep(.ant-card-body) {
+  padding-bottom: 0px !important;
+}
 
-  .table-operator {
-    margin-bottom: 18px;
-  }
+.table-operator {
+  margin-bottom: 18px;
+}
 
-  .Close {
-    height: 45px;
-    overflow: hidden;
-  }
+.Close {
+  height: 45px;
+  overflow: hidden;
+}
 
-  .vxe-table--render-default .vxe-body--row.row--stripe {
-    background: #f5f9fe;
-  }
+.vxe-table--render-default .vxe-body--row.row--stripe {
+  background: #f5f9fe;
+}
 
-  .ant-card-body {
-    padding-top: 10px;
-  }
+.ant-card-body {
+  padding-top: 10px;
+}
 
-  .inline {
-    position: relative;
-  }
+.inline {
+  position: relative;
+}
+
+.inline-right {
+  position: absolute;
+  top: 6px;
+  right: 25px;
+}
 
-  .inline-right {
-    position: absolute;
-    top: 6px;
-    right: 25px;
+.change {
+  display: flex;
+  justify-content: center;
+  margin-top: 25px;
+
+  div {
+    width: 120px;
+    height: 50px;
+    background-color: rgb(247, 249, 250);
+    border: 1px solid rgb(247, 249, 250);
+    color: rgb(105, 102, 102);
+    line-height: 50px;
+    text-align: center;
+    cursor: pointer;
+    transition: box-shadow 0.3s, background-color 0.3s;
+    margin-right: 10px;
   }
 
-  .change {
-    display: flex;
-    justify-content: center;
-    margin-top: 25px;
+  div:hover {
+    border: 1px solid #d1cfcf;
+  }
+}
 
-    div {
-      width: 120px;
-      height: 50px;
-      background-color: rgb(247, 249, 250);
-      border: 1px solid rgb(247, 249, 250);
-      color: rgb(105, 102, 102);
-      line-height: 50px;
-      text-align: center;
-      cursor: pointer;
-      transition: box-shadow 0.3s, background-color 0.3s;
-      margin-right: 10px;
-    }
+.content {
+  max-height: 300px;
+  overflow-y: auto;
+  overflow-x: hidden;
+  width: 100%;
 
-    div:hover {
-      border: 1px solid #d1cfcf;
-    }
+  &::-webkit-scrollbar {
+    width: 0 !important;
   }
 
-  .content {
-    max-height: 300px;
-    overflow-y: auto;
-    overflow-x: hidden;
-    width: 100%;
+  .items {
+    display: inline-block;
+    height: 28px;
+    line-height: 26px;
+    border: 1px dashed #ccc;
+    border-radius: 4px;
+    padding: 0 10px;
+    margin-top: 10px;
+    margin-right: 10px;
+    font-size: 13px;
+    cursor: pointer;
+    position: relative;
 
-    &::-webkit-scrollbar {
-      width: 0 !important;
+    .edit {
+      width: 17px;
+      height: 17px;
+      border-radius: 0 3px 0 0;
+      background: #c9c9c9;
+      display: none;
+      position: absolute;
+      right: -1px;
+      top: -1px;
+      text-align: center;
+      line-height: 17px;
     }
 
-    .items {
-      display: inline-block;
-      height: 28px;
-      line-height: 26px;
-      border: 1px dashed #ccc;
-      border-radius: 4px;
-      padding: 0 10px;
-      margin-top: 10px;
-      margin-right: 10px;
-      font-size: 13px;
-      cursor: pointer;
+    &:hover {
+      border: 1px dashed @primary-color;
       position: relative;
 
-      .edit {
-        width: 17px;
-        height: 17px;
-        border-radius: 0 3px 0 0;
-        background: #c9c9c9;
-        display: none;
+      &::before {
+        width: 100%;
+        height: 100%;
+        content: '';
+        background: @primary-color;
+        opacity: 0.08;
         position: absolute;
-        right: -1px;
-        top: -1px;
-        text-align: center;
-        line-height: 17px;
+        top: 0;
+        left: 0;
+        border-radius: 4px;
       }
 
-      &:hover {
-        border: 1px dashed @primary-color;
-        position: relative;
-
-        &::before {
-          width: 100%;
-          height: 100%;
-          content: '';
-          background: @primary-color;
-          opacity: 0.08;
-          position: absolute;
-          top: 0;
-          left: 0;
-          border-radius: 4px;
-        }
-
-        .edit {
-          display: block;
-        }
+      .edit {
+        display: block;
       }
+    }
 
-      &.active {
-        background: @primary-color;
-        border: 1px dashed @primary-color;
-        color: #fff;
-      }
+    &.active {
+      background: @primary-color;
+      border: 1px dashed @primary-color;
+      color: #fff;
     }
   }
+}
 
-  /deep/ .vben-basic-table-action button {
-    padding: 0 3px !important;
-  }
+:deep(.vben-basic-table-action button)  {
+  padding: 0 3px !important;
+}
 </style>
diff --git a/src/views/bookingcabin/ContractnoList/index.vue b/src/views/bookingcabin/ContractnoList/index.vue
index e04b9104..77ee353e 100644
--- a/src/views/bookingcabin/ContractnoList/index.vue
+++ b/src/views/bookingcabin/ContractnoList/index.vue
@@ -133,11 +133,11 @@ function handleAdd() {
 </script>
 
 <style lang="less" scoped>
-/deep/ .ant-form-item {
+:deep(.ant-form-item) {
   margin-bottom: 10px !important;
 }
 
-/deep/ .ant-card-body {
+:deep(.ant-card-body) {
   padding-bottom: 0px !important;
 }
 
diff --git a/src/views/bookingcabin/cabinBooking/detail.vue b/src/views/bookingcabin/cabinBooking/detail.vue
index e3582bee..b55fdc57 100644
--- a/src/views/bookingcabin/cabinBooking/detail.vue
+++ b/src/views/bookingcabin/cabinBooking/detail.vue
@@ -1345,14 +1345,14 @@ function getContractnoList() {
 
 </script>
 <style lang="less" scoped>
-/deep/ .ant-form-item {
+:deep(.ant-form-item) {
   margin-bottom: 10px !important;
 }
 
-/deep/ .ant-form-item-label>label {
+:deep(.ant-form-item-label>label) {
   height: 25px !important;
 }
-/deep/ .ant-form-item-control-input-content{
+:deep(.ant-form-item-control-input-content) {
   div{
     font-size: 12px;
   }
diff --git a/src/views/bookingcabin/cabinBooking/index.vue b/src/views/bookingcabin/cabinBooking/index.vue
index e259ecbd..9ca1e71b 100644
--- a/src/views/bookingcabin/cabinBooking/index.vue
+++ b/src/views/bookingcabin/cabinBooking/index.vue
@@ -541,11 +541,11 @@ function handleOpenCopy() {
 </script>
 
 <style lang="less" scoped>
-/deep/ .ant-form-item {
+:deep(.ant-form-item)   {
   margin-bottom: 10px !important;
 }
 
-/deep/ .ant-card-body {
+:deep(.ant-card-body)  {
   padding-bottom: 0px !important;
 }
 
diff --git a/src/views/bookingcabin/generation/index.vue b/src/views/bookingcabin/generation/index.vue
index fea2728b..e1f02d53 100644
--- a/src/views/bookingcabin/generation/index.vue
+++ b/src/views/bookingcabin/generation/index.vue
@@ -631,17 +631,17 @@ function handleSaveTask() {
   display: flex;
   flex-wrap: wrap;
 
-  /deep/ .ant-input-number-input {
+  :deep(.ant-input-number-input)  {
     background-color: rgb(255, 255, 255);
     ;
   }
 
-  /deep/ .ant-input-number-affix-wrapper {
+  :deep(.ant-input-number-affix-wrapper)  {
     background-color: rgb(255, 255, 255);
     ;
   }
 
-  /deep/ .ant-input-number-input {
+  :deep(.ant-input-number-input)  {
     text-align: center;
   }
 
diff --git a/src/views/bookingcabin/labelSet/index.vue b/src/views/bookingcabin/labelSet/index.vue
index 44adecc6..017dbd14 100644
--- a/src/views/bookingcabin/labelSet/index.vue
+++ b/src/views/bookingcabin/labelSet/index.vue
@@ -119,11 +119,11 @@ function handleAdd() {
 </script>
 
 <style lang="less" scoped>
-/deep/ .ant-form-item {
+:deep(.ant-form-item) {
   margin-bottom: 10px !important;
 }
 
-/deep/ .ant-card-body {
+:deep(.ant-card-body) {
   padding-bottom: 0px !important;
 }
 
diff --git a/src/views/operation/CustomerReconciliation/detail/index.vue b/src/views/operation/CustomerReconciliation/detail/index.vue
index 00c1413f..0f060931 100644
--- a/src/views/operation/CustomerReconciliation/detail/index.vue
+++ b/src/views/operation/CustomerReconciliation/detail/index.vue
@@ -658,21 +658,7 @@
     })
   }
 </script>
-<!-- <style lang="less" scoped>
-  /deep/.ant-table-container {
-    height: calc(100vh - 301px);
-    .ant-table-body {
-      max-height: none !important;
-      height: calc(100% - 50px) !important;
-      .ant-table-placeholder {
-        display: none;
-        .ant-table-expanded-row-fixed {
-          height: calc(100vh - 300px);
-        }
-      }
-    }
-  }
-</style> -->
+
 <style lang="less" scoped>
   // ----------------------
   .infoclientBox {
diff --git a/src/views/operation/bill/index.vue b/src/views/operation/bill/index.vue
index 1ae4e354..0bdd8251 100644
--- a/src/views/operation/bill/index.vue
+++ b/src/views/operation/bill/index.vue
@@ -640,7 +640,7 @@ function cancelCheckIn(type) {
 }
 </script>
 <style lang="less" scoped>
-/deep/ .ant-table-pagination.ant-pagination {
+ :deep(.ant-table-pagination.ant-pagination) {
   border-bottom: 1px solid #ebebeb;
   margin-bottom: 0px;
   padding-bottom: 10px;
@@ -704,12 +704,12 @@ function cancelCheckIn(type) {
     height: 0 !important;
   }
 
-  /deep/ .ant-table-footer {
-    /deep/ .ant-table-measure-row {
+  :deep(.ant-table-footer)  {
+    :deep(.ant-table-measure-row)  {
       display: none;
     }
 
-    /deep/ .ant-table-row-level-0 {
+    :deep(.ant-table-row-level-0 ){
       height: 26px !important;
       padding-left: 50px;
 
@@ -723,18 +723,18 @@ function cancelCheckIn(type) {
 }
 
 .fee-table {
-  /deep/ .ant-table-body {
+  :deep(.ant-table-body) {
     min-height: calc(50vh - 210px);
   }
 }
 
-/deep/ .ant-divider-vertical {
+:deep(.ant-divider-vertical) {
   height: 20px;
   margin: 0 10px;
   background: #eeeeee;
 }
 
-/deep/ .vben-basic-table .ant-table-footer td {
+:deep(.vben-basic-table .ant-table-footer td) {
   padding: 0px 10px !important;
 }
 
diff --git a/src/views/operation/invoicExamine/index.vue b/src/views/operation/invoicExamine/index.vue
index 325814e6..72e029bf 100644
--- a/src/views/operation/invoicExamine/index.vue
+++ b/src/views/operation/invoicExamine/index.vue
@@ -371,7 +371,7 @@ function sureRefuse() {
 }
 </script>
 <style lang="less" scoped>
-/deep/ .ant-table-pagination.ant-pagination {
+:deep(.ant-table-pagination.ant-pagination) {
     border-bottom: 1px solid #ebebeb;
     margin-bottom: 0px;
     padding-bottom: 10px;
@@ -428,12 +428,12 @@ function sureRefuse() {
         height: 0 !important;
     }
 
-    /deep/ .ant-table-footer {
-        /deep/ .ant-table-measure-row {
+    :deep(.ant-table-footer)  {
+        :deep(.ant-table-measure-row)  {
             display: none;
         }
 
-        /deep/ .ant-table-row-level-0 {
+        :deep(.ant-table-row-level-0)  {
             height: 26px !important;
             padding-left: 50px;
 
@@ -447,18 +447,18 @@ function sureRefuse() {
 }
 
 .fee-table {
-    /deep/ .ant-table-body {
+    :deep(.ant-table-body)  {
         min-height: calc(50vh - 210px);
     }
 }
 
-/deep/ .ant-divider-vertical {
+:deep(.ant-divider-vertical)  {
     height: 20px;
     margin: 0 10px;
     background: #eeeeee;
 }
 
-/deep/ .vben-basic-table .ant-table-footer td {
+:deep(.vben-basic-table .ant-table-footer td)  {
     padding: 0px 10px !important;
 }
 </style>
diff --git a/src/views/operation/invoiceApply/detail/InvoiceDetails.vue b/src/views/operation/invoiceApply/detail/InvoiceDetails.vue
index b2af1f21..32192c9b 100644
--- a/src/views/operation/invoiceApply/detail/InvoiceDetails.vue
+++ b/src/views/operation/invoiceApply/detail/InvoiceDetails.vue
@@ -690,12 +690,12 @@ defineExpose({ init, changeCustIn })
     }
 }
 
-/deep/ .ant-table-footer {
+:deep(.ant-table-footer) {
     padding: 0px !important;
     background: white;
 }
 
-/deep/ .ant-table-container {
+:deep(.ant-table-container)   {
     padding: 0px;
 }
 
@@ -712,7 +712,7 @@ defineExpose({ init, changeCustIn })
     margin-right: 20px;
     border: 1px solid white;
 
-    /deep/ .ant-checkbox-wrapper {
+    :deep(.ant-checkbox-wrapper) {
         font-size: 12px !important;
     }
 
@@ -733,16 +733,16 @@ defineExpose({ init, changeCustIn })
     margin: 0 10px;
 }
 
-/deep/ .ant-checkbox-wrapper-checked .ant-checkbox-inner {
+:deep(.ant-checkbox-wrapper-checked .ant-checkbox-inner)   {
     background-color: #257afa;
     border-color: #257afa;
 }
 
-/deep/ .ant-checkbox-disabled.ant-checkbox-checked .ant-checkbox-inner::after {
+:deep(.ant-checkbox-disabled.ant-checkbox-checked .ant-checkbox-inner::after) {
     border-color: #f5f5f5;
 }
 
-/deep/ .ant-checkbox-wrapper-checked .ant-checkbox-disabled+span {
+:deep(.ant-checkbox-wrapper-checked .ant-checkbox-disabled+span)  {
     color: #257afa;
 }
 
diff --git a/src/views/operation/invoiceApply/detail/feeTable.vue b/src/views/operation/invoiceApply/detail/feeTable.vue
index 331e0413..c6db5625 100644
--- a/src/views/operation/invoiceApply/detail/feeTable.vue
+++ b/src/views/operation/invoiceApply/detail/feeTable.vue
@@ -686,7 +686,7 @@ defineExpose({ list, dataSource, init, changeCust, open })
   }
 }
 
-/deep/ .ant-tabs-nav {
+:deep(.ant-tabs-nav) {
   margin-bottom: 2px;
 }
 </style>
diff --git a/src/views/operation/invoiceApply/detail/index.vue b/src/views/operation/invoiceApply/detail/index.vue
index 90cbf373..5d52e1c9 100644
--- a/src/views/operation/invoiceApply/detail/index.vue
+++ b/src/views/operation/invoiceApply/detail/index.vue
@@ -1184,7 +1184,7 @@ function handleSelect(value) {
     padding-top: 5px;
 }
 
-/deep/ .ant-btn-link {
+:deep(.ant-btn-link)  {
     padding: 0px !important;
 }
 
@@ -1292,7 +1292,7 @@ function handleSelect(value) {
     margin-right: 20px;
     border: 1px solid white;
 
-    /deep/ .ant-checkbox-wrapper {
+    :deep(.ant-checkbox-wrapper)  {
         font-size: 12px !important;
     }
 
@@ -1317,16 +1317,16 @@ function handleSelect(value) {
     padding: 0 20px;
 }
 
-/deep/ .ant-checkbox-wrapper-checked .ant-checkbox-inner {
+:deep(.ant-checkbox-wrapper-checked .ant-checkbox-inner) {
     background-color: #257afa;
     border-color: #257afa;
 }
 
-/deep/ .ant-checkbox-disabled.ant-checkbox-checked .ant-checkbox-inner::after {
+:deep(.ant-checkbox-disabled.ant-checkbox-checked .ant-checkbox-inner::after)  {
     border-color: #f5f5f5;
 }
 
-/deep/ .ant-checkbox-wrapper-checked .ant-checkbox-disabled+span {
+:deep(.ant-checkbox-wrapper-checked .ant-checkbox-disabled+span)  {
     color: #257afa;
 }
 
diff --git a/src/views/operation/invoiceIssue/detail/applyInvoice.vue b/src/views/operation/invoiceIssue/detail/applyInvoice.vue
index cabb3cb4..c91140af 100644
--- a/src/views/operation/invoiceIssue/detail/applyInvoice.vue
+++ b/src/views/operation/invoiceIssue/detail/applyInvoice.vue
@@ -876,12 +876,12 @@ defineExpose({ init, customerIdP, customerIdPName })
     }
 }
 
-/deep/ .ant-table-footer {
+:deep(.ant-table-footer) {
     padding: 0px !important;
     background: white;
 }
 
-/deep/ .ant-table-container {
+:deep(.ant-table-container)   {
     padding: 0px;
 }
 
@@ -898,7 +898,7 @@ defineExpose({ init, customerIdP, customerIdPName })
     margin-right: 20px;
     border: 1px solid white;
 
-    /deep/ .ant-checkbox-wrapper {
+    :deep(.ant-checkbox-wrapper) {
         font-size: 12px !important;
     }
 
@@ -919,16 +919,16 @@ defineExpose({ init, customerIdP, customerIdPName })
     margin: 0 10px;
 }
 
-/deep/ .ant-checkbox-wrapper-checked .ant-checkbox-inner {
+:deep(.ant-checkbox-wrapper-checked .ant-checkbox-inner)   {
     background-color: #257afa;
     border-color: #257afa;
 }
 
-/deep/ .ant-checkbox-disabled.ant-checkbox-checked .ant-checkbox-inner::after {
+:deep(.ant-checkbox-disabled.ant-checkbox-checked .ant-checkbox-inner::after) {
     border-color: #f5f5f5;
 }
 
-/deep/ .ant-checkbox-wrapper-checked .ant-checkbox-disabled+span {
+:deep(.ant-checkbox-wrapper-checked .ant-checkbox-disabled+span)  {
     color: #257afa;
 }
 
diff --git a/src/views/operation/invoiceIssue/detail/index.vue b/src/views/operation/invoiceIssue/detail/index.vue
index 1786c0be..b3169afe 100644
--- a/src/views/operation/invoiceIssue/detail/index.vue
+++ b/src/views/operation/invoiceIssue/detail/index.vue
@@ -1540,16 +1540,16 @@ watchEffect(() => {
     left: 35px;
 }
 
-/deep/ .ant-divider-inner-text {
+:deep(.ant-divider-inner-text) {
     font-size: 12px;
     font-weight: bold;
 }
 
-/deep/ .ant-divider-horizontal.ant-divider-with-text {
+:deep(.ant-divider-horizontal.ant-divider-with-text) {
     margin: 3px;
 }
 
-/deep/ .vben-basic-table {
+:deep(.vben-basic-table)  {
     height: auto;
 }
 
diff --git a/src/views/operation/seaexport/detail/modules/preOrder.vue b/src/views/operation/seaexport/detail/modules/preOrder.vue
index e9cb4fe6..8bc2a6ba 100644
--- a/src/views/operation/seaexport/detail/modules/preOrder.vue
+++ b/src/views/operation/seaexport/detail/modules/preOrder.vue
@@ -1165,7 +1165,7 @@ defineExpose({
 .left-title {
   display: flex;
 
-  /deep/ .ant-btn-link {
+  :deep(.ant-btn-link) {
     padding: 0px !important;
     margin-right: 10px;
   }
diff --git a/src/views/operation/seaexport/detail/modules/remarksInfo.vue b/src/views/operation/seaexport/detail/modules/remarksInfo.vue
index d7d1af5f..1c4b133c 100644
--- a/src/views/operation/seaexport/detail/modules/remarksInfo.vue
+++ b/src/views/operation/seaexport/detail/modules/remarksInfo.vue
@@ -91,11 +91,11 @@ export default {
 </script>
 <style lang="less" scoped>
 
-/deep/ .ant-form-explain{
+:deep(.ant-form-explain){
   display: none !important;
 }
 
-/deep/ .ant-form-item-children-icon .anticon-check-circle{
+:deep(.ant-form-item-children-icon .anticon-check-circle){
   display: none;
 }
 </style>
diff --git a/src/views/system/CodeDataRuleTemplate/TenantAuditStepModal.vue b/src/views/system/CodeDataRuleTemplate/TenantAuditStepModal.vue
index 87a116ea..25c068fb 100644
--- a/src/views/system/CodeDataRuleTemplate/TenantAuditStepModal.vue
+++ b/src/views/system/CodeDataRuleTemplate/TenantAuditStepModal.vue
@@ -429,7 +429,7 @@ function replaceEndChar(str, target, replacement) {
 }
 </script>
 <style scoped lang="less">
-/deep/ .ant-form-small {
+:deep(.ant-form-small) {
   margin-top: 0px !important;
 }
 </style>
diff --git a/src/views/system/datarule/index.vue b/src/views/system/datarule/index.vue
index bf7002fa..3c6d1933 100644
--- a/src/views/system/datarule/index.vue
+++ b/src/views/system/datarule/index.vue
@@ -377,12 +377,12 @@ function processNode(node) {
   width: 50%;
 }
 
-/deep/ .ant-tree-node-selected {
+:deep(.ant-tree-node-selected) {
   color: #257afa;
   background-color: #f5f9fc !important;
 }
 
-/deep/ .vben-basic-table .ant-table-wrapper .ant-table.ant-table-bordered .ant-table-title {
+:deep(.vben-basic-table .ant-table-wrapper .ant-table.ant-table-bordered .ant-table-title)  {
   padding-top: 0px !important;
 }
 </style>
diff --git a/src/views/system/user/UserModal.vue b/src/views/system/user/UserModal.vue
index c3cac3dd..e79842ff 100644
--- a/src/views/system/user/UserModal.vue
+++ b/src/views/system/user/UserModal.vue
@@ -233,15 +233,15 @@
   .p-active {
     color: #17A6A3;
   }
-  /deep/ .ant-divider {
+  :deep(.ant-divider) {
     font-size: 12px;
     font-weight: 600;
     margin: 16px 0 8px -19px;
   }
-  /deep/ .ant-divider-horizontal.ant-divider-with-text-left::before {
+  :deep(.ant-divider-horizontal.ant-divider-with-text-left::before)  {
     width: 0;
   }
-  /deep/ .ant-divider-horizontal.ant-divider-with-text-left::after {
+  :deep(.ant-divider-horizontal.ant-divider-with-text-left::after) {
     width: 0;
   }
 </style>
\ No newline at end of file
diff --git a/src/views/taskmanage/components/pdf.vue b/src/views/taskmanage/components/pdf.vue
index 1f7a4880..2bc17ab5 100644
--- a/src/views/taskmanage/components/pdf.vue
+++ b/src/views/taskmanage/components/pdf.vue
@@ -98,13 +98,13 @@ defineExpose({ startInit })
   padding-left: 40px;
 }
 
-/deep/ .ant-tabs-nav {
+:deep(.ant-tabs-nav)  {
   margin-bottom: 0px !important;
 }
-/deep/ .ant-spin-nested-loading{
+:deep(.ant-spin-nested-loading) {
   height: 100%;
 }
-/deep/ .ant-spin-container{
+:deep(.ant-spin-container)  {
   height: 100%;
 }
 </style>
\ No newline at end of file
diff --git a/src/views/taskmanage/components/taskData.vue b/src/views/taskmanage/components/taskData.vue
index 10b179bb..12099d74 100644
--- a/src/views/taskmanage/components/taskData.vue
+++ b/src/views/taskmanage/components/taskData.vue
@@ -340,7 +340,7 @@ defineExpose({ getInfo })
     font-size: 12px;
 }
 
-/deep/ .ant-form-item-control-input-content {
+:deep(.ant-form-item-control-input-content)  {
     div {
         color: rgba(122, 135, 152, 1);
         font-size: 12px;
@@ -374,10 +374,10 @@ defineExpose({ getInfo })
     }
 }
 
-/deep/ .ant-form-item {
+:deep(.ant-form-item) {
     margin-bottom: 10px;
 }
-/deep/ .ant-form-item-control-input-content{
+:deep(.ant-form-item-control-input-content) {
     display: flex;
     div{
         margin-right: 5px;
diff --git a/src/views/taskmanage/index.vue b/src/views/taskmanage/index.vue
index 11c723ec..8901fd64 100644
--- a/src/views/taskmanage/index.vue
+++ b/src/views/taskmanage/index.vue
@@ -1669,59 +1669,59 @@ function handleClickTree(row, index) {
 }
 </script>
 <style lang="less" scoped>
-/deep/ .ant-popover-placement-top {
+:deep( .ant-popover-placement-top) {
   width: 330px !important;
 }
 
-/deep/ .ant-tabs-bar {
+:deep(.ant-tabs-bar) {
   margin-bottom: 0 !important;
 }
 
-/deep/ .ant-table.ant-table-bordered>.ant-table-container {
+:deep(.ant-table.ant-table-bordered>.ant-table-container)  {
   border-left: none !important;
 }
 
-/deep/ .ant-tabs-tab {
+:deep(.ant-tabs-tab) {
   padding: 8px !important;
   margin-right: 8px !important;
 }
 
-/deep/ .ant-form-item {
+:deep(.ant-form-item) {
   display: flex;
 }
 
-/deep/ .ant-radio-button-wrapper-checked {
+:deep(.ant-radio-button-wrapper-checked) {
   background: white;
   color: black;
   border: none;
   font-weight: 700;
 }
 
-/deep/ .ant-radio-button-wrapper {
+:deep(.ant-radio-button-wrapper) {
   background: rgba(245, 249, 252, 1);
   border: none !important;
 }
 
-/deep/ .ant-tabs-tab+.ant-tabs-tab {
+:deep(.ant-tabs-tab+.ant-tabs-tab)  {
   margin: 0 0 0 12px;
 }
 
-/deep/ .ant-radio-group-solid .ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled) {
+:deep(.ant-radio-group-solid .ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled))  {
   background: white;
   color: black;
   font-weight: 700;
 }
 
-/deep/ .nav-title .ant-radio-button-wrapper {
+:deep(.nav-title .ant-radio-button-wrapper)  {
   padding: 0px;
   flex-grow: 1;
 }
 
-/deep/ .ant-radio-button-wrapper:not(:first-child)::before {
+:deep(.ant-radio-button-wrapper:not(:first-child)::before)  {
   width: 0px;
 }
 
-/deep/ .ant-radio-group {
+:deep(.ant-radio-group)  {
   width: 100%;
 }
 
diff --git a/src/views/taskmanage/taskList/siFeedback.vue b/src/views/taskmanage/taskList/siFeedback.vue
index 383c7543..688ae821 100644
--- a/src/views/taskmanage/taskList/siFeedback.vue
+++ b/src/views/taskmanage/taskList/siFeedback.vue
@@ -1412,7 +1412,7 @@ const boxSiColumns = [
     overflow: hidden;
 }
 
-/deep/ .ant-form-item-label {
+:deep(.ant-form-item-label) {
     height: 29px;
     line-height: 35px;
     text-align: left;
@@ -1501,7 +1501,7 @@ const boxSiColumns = [
 }
 
 .si-model {
-    /deep/ .ant-form-item-label {
+    :deep(.ant-form-item-label)  {
         text-align: right !important;
     }
 }
diff --git a/src/views/taskmanage/taskList/taskCustom.vue b/src/views/taskmanage/taskList/taskCustom.vue
index 1a48374e..5e2a5f1f 100644
--- a/src/views/taskmanage/taskList/taskCustom.vue
+++ b/src/views/taskmanage/taskList/taskCustom.vue
@@ -265,7 +265,7 @@ defineExpose({ init })
         cursor: pointer;
         margin-bottom: 3px;
 
-        /deep/ .ant-checkbox-wrapper {
+        :deep(.ant-checkbox-wrapper)  {
             span {
                 font-size: 12px;
             }
diff --git a/src/views/taskmanage/taskList/taskStyle.less b/src/views/taskmanage/taskList/taskStyle.less
index 626823fc..e53fcefd 100644
--- a/src/views/taskmanage/taskList/taskStyle.less
+++ b/src/views/taskmanage/taskList/taskStyle.less
@@ -22,7 +22,7 @@
     color: black;
 }
 
-/deep/ .ant-form-item-control-input-content {
+:deep(.ant-form-item-control-input-content) {
     div {
         color: rgba(122, 135, 152, 1);
     }
@@ -55,7 +55,7 @@
     }
 }
 
-/deep/ .ant-form-item {
+:deep(.ant-form-item) {
     margin-bottom: 10px;
 }