From b46f7d2b267b08aa4e79401ee9c36e446189087b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E5=90=8C=E6=B5=B7?=
 <14166000+zhangtonghai@user.noreply.gitee.com>
Date: Wed, 20 Nov 2024 14:40:37 +0800
Subject: [PATCH 1/6] =?UTF-8?q?=E7=AE=B1=E7=AE=A1=20=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../CurrentState/columns.tsx                  |  34 +--
 .../CurrentState/index.vue                    |  79 ++++++-
 .../OfflineAudit/index.vue                    | 193 ++++++++++++------
 .../ContainerManagement/dsxxcl/columns.tsx    |  83 +++++---
 .../ContainerManagement/dsxxcl/index.vue      |  84 +++++++-
 5 files changed, 355 insertions(+), 118 deletions(-)

diff --git a/src/views/ContainerManagement/CurrentState/columns.tsx b/src/views/ContainerManagement/CurrentState/columns.tsx
index a34b8fab..1b477b82 100644
--- a/src/views/ContainerManagement/CurrentState/columns.tsx
+++ b/src/views/ContainerManagement/CurrentState/columns.tsx
@@ -40,6 +40,12 @@ export const columns: BasicColumn[] = [
     sorter: true,
     width: 150,
   },
+  {
+    title: '是否上线',
+    dataIndex: 'isOnline',
+    sorter: true,
+    width: 200,
+  },
   {
     title: '序号',
     dataIndex: 'index',
@@ -176,12 +182,6 @@ export const columns: BasicColumn[] = [
   //   sorter: true,
   //   width: 200,
   // },
-  // {
-  //   title: '是否上线',
-  //   dataIndex: 'isOnline',
-  //   sorter: true,
-  //   width: 200,
-  // },
 
   // {
   //   title: '当前港口',
@@ -223,6 +223,17 @@ export const columns: BasicColumn[] = [
 ]
 
 export const searchFormSchema: FormSchema[] = [
+  {
+    field: 'cntrno',
+    label: '箱号',
+    component: 'InputTextArea',
+    colProps: { span: 8 },
+    componentProps: {
+      validateOnRuleChange: false,
+      placeholder: '可输入多个箱号',
+      rows: 1,
+    },
+  },
   {
     field: 'ctnOwner',
     label: '箱主',
@@ -342,17 +353,6 @@ export const searchFormSchema: FormSchema[] = [
     component: 'InputNumber',
     colProps: { span: 4 },
   },
-  {
-    field: 'cntrno',
-    label: '箱号',
-    component: 'InputTextArea',
-    colProps: { span: 8 },
-    componentProps: {
-      validateOnRuleChange: false,
-      placeholder: '可输入多个箱号',
-      rows: 1,
-    },
-  },
   {
     field: 'portid',
     label: '当前港口',
diff --git a/src/views/ContainerManagement/CurrentState/index.vue b/src/views/ContainerManagement/CurrentState/index.vue
index 92f14f54..d8226ef8 100644
--- a/src/views/ContainerManagement/CurrentState/index.vue
+++ b/src/views/ContainerManagement/CurrentState/index.vue
@@ -2,10 +2,10 @@
   <div>
     <BasicTable class="ds-table" @register="registerTable">
       <template #tableTitle>
-        <!-- <a-button type="link" @click="handleCreate">
-          <span class="iconfont icon-piliangbianji"></span>
-          批量维护
-        </a-button> -->
+        <a-button type="link" class="pl0" @click="derivedExcel">
+          <span class="iconfont icon-Excel"></span>
+          导出待上线
+        </a-button>
       </template>
       <template #bodyCell="{ column, record }">
         <!-- <template v-if="column.key === 'action'">
@@ -47,6 +47,7 @@
   import { BasicTable, useTable, TableAction, SorterResult } from '/@/components/Table'
   import InfoModal from './infoModal.vue'
   import { ApiList } from './api'
+  import { ExportExcelByColumn } from '/@/api/common'
   import { useModal } from '/@/components/Modal'
   import TenantAuditStepModal from './TenantAuditStepModal.vue'
   import { columns, searchFormSchema } from './columns'
@@ -56,11 +57,36 @@
   const refInfoModal = ref()
   const [registerModal, { openModal }] = useModal()
   const [registerInfoModal, { openModal: openInfoModal }] = useModal()
-
-  const [registerTable, { reload, getForm, getSelectRows }] = useTable({
+  const [registerTable, { reload, getForm, getVxeSelectRows }] = useTable({
     title: '集装箱信息列表',
     api: async (p) => {
       const res: API.DataResult = await ApiList(p)
+      let type = true
+      JSON.parse(p.queryCondition).forEach((e) => {
+        if (e.FieldName == 'isOnlineId') {
+          type = false
+        }
+      })
+      if (type) {
+        let MessageArr: any = []
+        res.data.forEach((item) => {
+          if (item.isOnlineId == 0) {
+            MessageArr.push(item.cntrno)
+          }
+        })
+        if (MessageArr.length) {
+          let txt = `有${MessageArr.length}个待上线：`
+          for (let i = 0; i < 5; i++) {
+            if (MessageArr[i]) {
+              txt = i == 0 ? `${txt} ${MessageArr[i]}` : `${txt},\n${MessageArr[i]}`
+            }
+          }
+          notification.warning({
+            message: MessageArr.length > 5 ? `${txt}...` : txt,
+            duration: 6000,
+          })
+        }
+      }
       res.data.forEach((item, index) => {
         item.index = index + 1
       })
@@ -177,7 +203,7 @@
     autoHeight: window.innerHeight - 250,
   })
   function handleCreate() {
-    const select = getSelectRows()
+    const select = getVxeSelectRows()
     openModal(true, {
       isParent: false,
       isUpdate: false,
@@ -192,4 +218,43 @@
   function handleSuccess() {
     reload()
   }
+  function derivedExcel() {
+    let ApiData: any = {
+      columnSets: [],
+      jsonDataStr: [],
+    }
+    columns.forEach((item) => {
+      ApiData.columnSets.push({
+        title: item.title,
+        enTitle: item.dataIndex,
+        dataIndex: item.dataIndex,
+        visible: true,
+      })
+    })
+    console.log(getVxeSelectRows())
+
+    getVxeSelectRows().forEach((item: any) => {
+      console.log(item, item.isOnlineId)
+
+      if (item.isOnlineId === 0) {
+        item.isHeavy = item.isHeavy ? '重箱' : '空箱'
+        ApiData.jsonDataStr.push(item)
+      }
+    })
+
+    ApiData.jsonDataStr = JSON.stringify(ApiData.jsonDataStr)
+    ExportExcelByColumn(ApiData).then((res) => {
+      const xlsUrl = window.URL.createObjectURL(
+        new Blob([res], {
+          type: 'application/vnd.ms-excel;charset=utf-8',
+        }),
+      )
+      const fname = '批量查询_待上线数据'
+      const link = document.createElement('a')
+      link.href = xlsUrl
+      link.setAttribute('download', fname)
+      document.body.appendChild(link)
+      link.click()
+    })
+  }
 </script>
diff --git a/src/views/ContainerManagement/OfflineAudit/index.vue b/src/views/ContainerManagement/OfflineAudit/index.vue
index 66c16d19..83fc13d5 100644
--- a/src/views/ContainerManagement/OfflineAudit/index.vue
+++ b/src/views/ContainerManagement/OfflineAudit/index.vue
@@ -4,14 +4,28 @@
       <BasicTable class="ds-table" @register="registerTableTop"> </BasicTable>
     </div>
     <div>
-      <a-button type="link" @click="FnAudit(true, 'confirm')">
-        <span class="iconfont icon-yiwancheng2-copy" :style="{ fontSize: '13px' }"></span>
-        整票审核通过
-      </a-button>
-      <a-button type="link" @click="FnAudit(false, 'confirm')">
-        <span class="iconfont icon-yiwancheng2-copy" :style="{ fontSize: '13px' }"></span>
-        选中审核通过
-      </a-button>
+      <a-popconfirm
+        title="将会审核选中的最后一条整票，是否确认？"
+        ok-text="是"
+        cancel-text="否"
+        @confirm="FnAudit(true, 'confirm')"
+      >
+        <a-button type="link">
+          <span class="iconfont icon-yiwancheng2-copy" :style="{ fontSize: '13px' }"></span>
+          整票审核通过
+        </a-button>
+      </a-popconfirm>
+      <a-popconfirm
+        title="是否确认审核通过？"
+        ok-text="是"
+        cancel-text="否"
+        @confirm="FnAudit(false, 'confirm')"
+      >
+        <a-button type="link">
+          <span class="iconfont icon-yiwancheng2-copy" :style="{ fontSize: '13px' }"></span>
+          选中审核通过
+        </a-button>
+      </a-popconfirm>
       <a-button type="link" @click="FnAudit(true, 'cancel')">
         <span class="iconfont icon-bohui-01" :style="{ fontSize: '13px' }"></span>
         整票驳回
@@ -20,6 +34,10 @@
         <span class="iconfont icon-bohui-01" :style="{ fontSize: '13px' }"></span>
         驳回选中行
       </a-button>
+      <a-button type="link" class="pl0" @click="derivedExcel">
+        <span class="iconfont icon-Excel"></span>
+        导出审核通过
+      </a-button>
     </div>
     <div>
       <BasicTable class="ds-table" @register="registerTableBotton"> </BasicTable>
@@ -40,69 +58,84 @@
   import { BasicTable, useTable } from '/@/components/Table'
   import { BasicForm, useForm } from '/@/components/Form/index'
   import { ApiList, ApiDetailList, ApiConfirm, ApiCancel } from './api'
+  import { ExportExcelByColumn } from '/@/api/common'
   import { columns, searchFormSchema, detailColumns } from './columns'
   import { useMessage } from '/@/hooks/web/useMessage'
   const { notification } = useMessage()
   // 引入处理入参方法
   import { formatParams } from '/@/hooks/web/common'
-  const [registerTableTop, { reload, clearSelectedRowKeys, getSelectRows }] = useTable({
-    title: '',
-    api: async (p) => {
-      clearSelectedRowKeys()
-      getSelectRowsBotton()
-      const res: API.DataResult = await ApiList(p)
-      return new Promise((resolve) => {
-        resolve({ data: [...res.data], total: res.count })
-      })
-    },
-    beforeFetch: (p) => {
-      let Rdata = formatParams(p)
-      let data = JSON.parse(Rdata.queryCondition)
-      data.forEach((item) => {
-        if (item.FieldName == 'cntrnoall') {
-          item.FieldValue = item.FieldValue.replace(/ {1,}/g, ',')
-          item.FieldValue = item.FieldValue.replace(/\n/g, ',')
-          item.ConditionalType = 15
-        }
-      })
-      Rdata.queryCondition = JSON.stringify(data)
-      return Rdata
-    },
-    columns,
-    rowSelection: {
-      type: 'radio',
-      onChange: () => {
-        reloadBotton()
+  const TopSelectLast = ref('')
+  const [registerTableTop, { reload, clearSelectedRowKeys, setSelectedRowKeys, getSelectRows }] =
+    useTable({
+      title: '',
+      api: async (p) => {
+        clearSelectedRowKeys()
+        getSelectRowsBotton()
+        const res: API.DataResult = await ApiList(p)
+        return new Promise((resolve) => {
+          resolve({ data: [...res.data], total: res.count })
+        })
       },
-    },
-    formConfig: {
-      labelWidth: 120,
-      schemas: searchFormSchema,
-    },
-    pagination: true,
-    striped: true,
-    useSearchForm: true,
-    showTableSetting: false,
-    bordered: true,
-    showIndexColumn: true,
-    indexColumnProps: {
-      width: 60,
-    },
-    canResize: true,
-    resizeHeightOffset: 335,
-    immediate: true,
-  })
+      beforeFetch: (p) => {
+        let Rdata = formatParams(p)
+        let data = JSON.parse(Rdata.queryCondition)
+        data.forEach((item) => {
+          if (item.FieldName == 'cntrnoall') {
+            item.FieldValue = item.FieldValue.replace(/ {1,}/g, ',')
+            item.FieldValue = item.FieldValue.replace(/\n/g, ',')
+            item.ConditionalType = 15
+          }
+        })
+        Rdata.queryCondition = JSON.stringify(data)
+        return Rdata
+      },
+      columns,
+      rowKey: 'id',
+      rowSelection: {
+        // type: 'radio',
+        type: 'checkbox',
+        onChange: (e, a) => {
+          TopSelectLast.value = JSON.stringify(a[a.length - 1])
+          reloadBotton()
+        },
+      },
+      formConfig: {
+        labelWidth: 120,
+        schemas: searchFormSchema,
+      },
+      pagination: true,
+      striped: true,
+      useSearchForm: true,
+      showTableSetting: false,
+      bordered: true,
+      showIndexColumn: true,
+      indexColumnProps: {
+        width: 60,
+      },
+      canResize: true,
+      resizeHeightOffset: 335,
+      immediate: true,
+    })
+  const derivedObj = ref('{}')
   const [registerTableBotton, { reload: reloadBotton, getSelectRows: getSelectRowsBotton }] =
     useTable({
       title: '',
       api: async (p) => {
         const res: API.DataResult = await ApiDetailList(p)
+        if (JSON.parse(TopSelectLast.value).billState == 1100) {
+          let Obj = JSON.parse(derivedObj.value)
+          if (!Obj[JSON.parse(TopSelectLast.value).id]) {
+            Obj[JSON.parse(TopSelectLast.value).id] = res.data
+          }
+          derivedObj.value = JSON.stringify(Obj)
+        }
         return new Promise((resolve) => {
           resolve({ data: [...res.data], total: res.count })
         })
       },
       beforeFetch: (p) => {
-        p['Pid'] = getSelectRows()[0].id
+        // p['Pid'] = getSelectRows()[0].id
+        p['Pid'] = JSON.parse(TopSelectLast.value).id
         return formatParams(p)
       },
       columns: detailColumns,
@@ -130,8 +163,8 @@
     }
     try {
       if (type) {
-        if (getSelectRows()[0]?.id) {
-          ApiData.id = getSelectRows()[0].id
+        if (JSON.parse(TopSelectLast.value)?.id) {
+          ApiData.id = JSON.parse(TopSelectLast.value).id
         } else {
           notification.warning({ message: '请选择一条数据', duration: 3 })
           throw new Error('请选择一条数据')
@@ -141,13 +174,13 @@
           getSelectRowsBotton().forEach((item) => {
             ApiData.ids.push(item.id)
           })
-          ApiData.id = getSelectRows()[0].id
+          ApiData.id = JSON.parse(TopSelectLast.value).id
         } else {
           notification.warning({ message: '请至少选择一条数据', duration: 3 })
           throw new Error('请至少选择一条数据')
         }
       }
-      ApiData.businessType = getSelectRows()[0]?.ctnBizStateId
+      ApiData.businessType = JSON.parse(TopSelectLast.value)?.ctnBizStateId
       if (state == 'cancel') {
         Ctype.value = type
         CApiData.value = JSON.stringify(ApiData)
@@ -160,6 +193,10 @@
     }
   }
   async function FnExamine(type, state, ApiData) {
+    if (state == 'confirm' && type) {
+      clearSelectedRowKeys()
+      setSelectedRowKeys([JSON.parse(TopSelectLast.value)?.id])
+    }
     let res: any = state == 'confirm' ? await ApiConfirm(ApiData) : await ApiCancel(ApiData)
     if (res.succeeded) {
       notification.success({ message: res.message, duration: 3 })
@@ -204,6 +241,44 @@
     modalResetFields()
     visible.value = false
   }
+  function derivedExcel() {
+    let ApiData: any = {
+      columnSets: [],
+      jsonDataStr: [],
+    }
+    detailColumns.forEach((item) => {
+      ApiData.columnSets.push({
+        title: item.title,
+        enTitle: item.dataIndex,
+        dataIndex: item.dataIndex,
+        visible: true,
+      })
+    })
+    getSelectRows().forEach((item) => {
+      let Obj = JSON.parse(derivedObj.value)
+      if (Obj[item.id]) {
+        ApiData.jsonDataStr = [...ApiData.jsonDataStr, ...Obj[item.id]]
+      }
+    })
+    if (ApiData.jsonDataStr.length) {
+      ApiData.jsonDataStr = JSON.stringify(ApiData.jsonDataStr)
+      ExportExcelByColumn(ApiData).then((res) => {
+        const xlsUrl = window.URL.createObjectURL(
+          new Blob([res], {
+            type: 'application/vnd.ms-excel;charset=utf-8',
+          }),
+        )
+        const fname = '下线审批_审核通过数据'
+        const link = document.createElement('a')
+        link.href = xlsUrl
+        link.setAttribute('download', fname)
+        document.body.appendChild(link)
+        link.click()
+      })
+    } else {
+      notification.warning({ message: '请选择审核通过数据。', duration: 3 })
+    }
+  }
 </script>
 <style lang="less" scoped>
   :deep(.ant-table-column-sorters) {
diff --git a/src/views/ContainerManagement/dsxxcl/columns.tsx b/src/views/ContainerManagement/dsxxcl/columns.tsx
index cf1262f1..89a1bbf4 100644
--- a/src/views/ContainerManagement/dsxxcl/columns.tsx
+++ b/src/views/ContainerManagement/dsxxcl/columns.tsx
@@ -27,6 +27,12 @@ export const columns: BasicColumn[] = [
     sorter: true,
     width: 100,
   },
+  {
+    title: '是否上线',
+    dataIndex: 'isOnline',
+    sorter: true,
+    width: 200,
+  },
   {
     title: '新旧箱',
     dataIndex: 'usedState',
@@ -75,17 +81,20 @@ export const columns: BasicColumn[] = [
     sorter: true,
     width: 200,
   },
-  {
-    title: '是否上线',
-    dataIndex: 'isOnline',
-    sorter: true,
-    width: 200,
-  },
+
   {
     title: '空重',
     dataIndex: 'isHeavy',
     sorter: true,
     width: 200,
+    customRender: ({ text }) => {
+      if (text) {
+        return <Tag color="success">重箱</Tag>
+      } else {
+        return <Tag color="error">空箱</Tag>
+      }
+      return text
+    },
   },
   {
     title: '当前港口',
@@ -150,22 +159,34 @@ export const columns: BasicColumn[] = [
 ]
 
 export const searchFormSchema: FormSchema[] = [
+  // {
+  //   field: 'cntrno',
+  //   label: '箱号',
+  //   component: 'Input',
+  //   colProps: { span: 4 },
+  // },
   {
     field: 'cntrno',
     label: '箱号',
-    component: 'Input',
-    colProps: { span: 4 },
+    component: 'InputTextArea',
+    colProps: { span: 8 },
+    componentProps: {
+      validateOnRuleChange: false,
+      placeholder: '可输入多个箱号',
+      rows: 2,
+    },
   },
   {
-    field: 'CM_ctnCode',
-    label: '箱型',
+    field: 'isOnlineId',
+    label: '是否上线',
     component: 'ApiSelect',
     colProps: { span: 4 },
-    componentProps: () => {
+    defaultValue: '0',
+    componentProps: ({}) => {
       return {
         api: () => {
           return new Promise((resolve) => {
-            getDictOption('CM_ctnCode').then((res) => {
+            getDictOption('CM_IsOnlineEnum').then((res) => {
               resolve(res)
             })
           })
@@ -180,15 +201,15 @@ export const searchFormSchema: FormSchema[] = [
     },
   },
   {
-    field: 'CM_ctnSize',
-    label: '尺寸',
+    field: 'CM_ctnCode',
+    label: '箱型',
     component: 'ApiSelect',
     colProps: { span: 4 },
     componentProps: () => {
       return {
         api: () => {
           return new Promise((resolve) => {
-            getDictOption('CM_ctnSize').then((res) => {
+            getDictOption('CM_ctnCode').then((res) => {
               resolve(res)
             })
           })
@@ -203,16 +224,15 @@ export const searchFormSchema: FormSchema[] = [
     },
   },
   {
-    field: 'ctnSourceId',
-    label: '箱来源',
+    field: 'CM_ctnSize',
+    label: '尺寸',
     component: 'ApiSelect',
     colProps: { span: 4 },
-    defaultValue: '',
-    componentProps: ({ formModel }) => {
+    componentProps: () => {
       return {
         api: () => {
           return new Promise((resolve) => {
-            getDictOption('CM_CtnSource').then((res) => {
+            getDictOption('CM_ctnSize').then((res) => {
               resolve(res)
             })
           })
@@ -227,22 +247,16 @@ export const searchFormSchema: FormSchema[] = [
     },
   },
   {
-    field: 'mblno',
-    label: '业务编号',
-    component: 'Input',
-    colProps: { span: 4 },
-  },
-  {
-    field: 'isOnlineId',
-    label: '是否上线',
+    field: 'ctnSourceId',
+    label: '箱来源',
     component: 'ApiSelect',
     colProps: { span: 4 },
-    defaultValue: '0',
-    componentProps: ({}) => {
+    defaultValue: '',
+    componentProps: ({ formModel }) => {
       return {
         api: () => {
           return new Promise((resolve) => {
-            getDictOption('CM_IsOnlineEnum').then((res) => {
+            getDictOption('CM_CtnSource').then((res) => {
               resolve(res)
             })
           })
@@ -256,6 +270,13 @@ export const searchFormSchema: FormSchema[] = [
       }
     },
   },
+  {
+    field: 'mblno',
+    label: '业务编号',
+    component: 'Input',
+    colProps: { span: 4 },
+  },
+
   {
     field: 'etd',
     label: 'ETD',
diff --git a/src/views/ContainerManagement/dsxxcl/index.vue b/src/views/ContainerManagement/dsxxcl/index.vue
index 512ac830..9cbf4ab0 100644
--- a/src/views/ContainerManagement/dsxxcl/index.vue
+++ b/src/views/ContainerManagement/dsxxcl/index.vue
@@ -15,18 +15,59 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { ref } from 'vue'
+  import { ref, h } from 'vue'
   import { BasicTable, useTable } from '/@/components/Table'
   import { ApiList, ApiOnLine, ApiOffLine } from './api'
+  import { ExportExcelByColumn } from '/@/api/common'
   import { columns, searchFormSchema } from './columns'
   import { useMessage } from '/@/hooks/web/useMessage'
   const { notification } = useMessage()
   // 引入处理入参方法
   import { formatParams } from '/@/hooks/web/common'
+  import { Button } from 'ant-design-vue'
   const [registerTable, { reload, getSelectRows }] = useTable({
     title: '',
     api: async (p) => {
       const res: API.DataResult = await ApiList(p)
+      // 未查询是否上线时
+      let type = true
+      JSON.parse(p.queryCondition).forEach((e) => {
+        if (e.FieldName == 'isOnlineId') {
+          type = false
+        }
+      })
+      if (type) {
+        let Num = 0
+        let Text = ''
+        let Arr = []
+        res.data.forEach((e) => {
+          if (e.isOnline == '待上线') {
+            Num = Num + 1
+            Text = Text == '' ? e.cntrno : `${Text},${e.cntrno}`
+            Arr.push(e)
+          }
+        })
+        const key = `open${Date.now()}`
+        notification.open({
+          message: `共${Num}条待上线`,
+          description: Num == 0 ? '' : `箱号为${Text}`,
+          btn: () =>
+            h(
+              Button,
+              {
+                type: 'primary',
+                size: 'small',
+                onClick: () => {
+                  derivedExcel(Arr)
+                  notification.close(key)
+                },
+              },
+              { default: () => '导出待上线' },
+            ),
+          key,
+          duration: 0,
+        })
+      }
       return new Promise((resolve) => {
         resolve({ data: [...res.data], total: res.count })
       })
@@ -34,7 +75,7 @@
     beforeFetch: (p) => {
       // ['ctnall', 'ctnSourceId', 'isOnlineId']
       let Rdata = formatParams(p, searchFormSchema)
-      if (!!p.CM_ctnCode || !!p.CM_ctnSize) {
+      if (!!p.CM_ctnCode || !!p.CM_ctnSize || !!p.cntrno) {
         let data = JSON.parse(Rdata.queryCondition)
         let CM_ctnCode: any = null
         let CM_ctnSize: any = null
@@ -45,6 +86,12 @@
           if (item.FieldName == 'CM_ctnSize') {
             CM_ctnSize = item
           }
+          if (item.FieldName == 'cntrno') {
+            item.FieldValue = item.FieldValue.replace(/ {1,}/g, ',')
+            item.FieldValue = item.FieldValue.replace(/\n/g, ',')
+
+            item.ConditionalType = 15
+          }
         })
         data = data.filter(
           (item) => item.FieldName !== 'CM_ctnCode' && item.FieldName !== 'CM_ctnSize',
@@ -136,7 +183,6 @@
     }
 
     ApiOnLine(ApiData).then((res) => {
-      console.log(res)
       notification.success({ message: res.message, duration: 3 })
       reload()
     })
@@ -156,11 +202,41 @@
     }
 
     ApiOffLine(ApiData).then((res) => {
-      console.log(res)
       notification.success({ message: res.message, duration: 3 })
       reload()
     })
   }
+  function derivedExcel(jsonDataStr) {
+    let ApiData: any = {
+      columnSets: [],
+      jsonDataStr,
+    }
+    columns.forEach((item) => {
+      ApiData.columnSets.push({
+        title: item.title,
+        enTitle: item.dataIndex,
+        dataIndex: item.dataIndex,
+        visible: true,
+      })
+    })
+    ApiData.jsonDataStr.forEach((item) => {
+      item.isHeavy = item.isHeavy ? '重箱' : '空箱'
+    })
+    ApiData.jsonDataStr = JSON.stringify(ApiData.jsonDataStr)
+    ExportExcelByColumn(ApiData).then((res) => {
+      const xlsUrl = window.URL.createObjectURL(
+        new Blob([res], {
+          type: 'application/vnd.ms-excel;charset=utf-8',
+        }),
+      )
+      const fname = '待上线箱处理数据'
+      const link = document.createElement('a')
+      link.href = xlsUrl
+      link.setAttribute('download', fname)
+      document.body.appendChild(link)
+      link.click()
+    })
+  }
 </script>
 <style lang="less" scoped>
   :deep(.ant-table-column-sorters) {

From bbbfed1e64c0a5540159118b46f1c1f7513cdf6d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E5=90=8C=E6=B5=B7?=
 <14166000+zhangtonghai@user.noreply.gitee.com>
Date: Wed, 20 Nov 2024 16:08:19 +0800
Subject: [PATCH 2/6] =?UTF-8?q?=E7=AE=B1=E7=AE=A1=20=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../TemplatImport/TenantAuditStepModal.vue    |   8 +-
 .../ContainerManagement/dsxxcl/columns.tsx    | 209 +++++++++++-------
 .../ContainerManagement/dsxxcl/index.vue      |   3 +
 3 files changed, 143 insertions(+), 77 deletions(-)

diff --git a/src/views/ContainerManagement/TemplatImport/TenantAuditStepModal.vue b/src/views/ContainerManagement/TemplatImport/TenantAuditStepModal.vue
index d7e54920..c2760c1f 100644
--- a/src/views/ContainerManagement/TemplatImport/TenantAuditStepModal.vue
+++ b/src/views/ContainerManagement/TemplatImport/TenantAuditStepModal.vue
@@ -660,9 +660,11 @@
       }
     })
     list.value.forEach((item) => {
-      ApiData.jsonDataStr.push({
-        ...item,
-      })
+      if (item.isOnlineId === 0) {
+        ApiData.jsonDataStr.push({
+          ...item,
+        })
+      }
     })
 
     ApiData.jsonDataStr = JSON.stringify(ApiData.jsonDataStr)
diff --git a/src/views/ContainerManagement/dsxxcl/columns.tsx b/src/views/ContainerManagement/dsxxcl/columns.tsx
index 89a1bbf4..d8b7ee04 100644
--- a/src/views/ContainerManagement/dsxxcl/columns.tsx
+++ b/src/views/ContainerManagement/dsxxcl/columns.tsx
@@ -34,54 +34,40 @@ export const columns: BasicColumn[] = [
     width: 200,
   },
   {
-    title: '新旧箱',
-    dataIndex: 'usedState',
-    sorter: true,
-    width: 200,
-  },
-  {
-    title: '箱主',
-    dataIndex: 'ctnOwner',
-    sorter: true,
-    width: 200,
+    title: '序号',
+    dataIndex: 'index',
+    width: 50,
   },
   {
-    title: '箱来源',
-    dataIndex: 'ctnSource',
+    title: '状态',
+    dataIndex: 'ctnFlowState',
     sorter: true,
     width: 200,
   },
   {
-    title: '箱业务状态',
-    dataIndex: 'ctnBizState',
-    sorter: true,
-    width: 200,
-  },
-  {
-    title: '箱业务编号',
-    dataIndex: 'billno',
+    title: '船名',
+    dataIndex: 'vessel',
     sorter: true,
     width: 200,
   },
   {
-    title: '合同号',
-    dataIndex: 'ctnReleaseNo',
+    title: '航次',
+    dataIndex: 'voyno',
     sorter: true,
     width: 200,
   },
   {
-    title: '箱可用状态',
-    dataIndex: 'ctnState',
+    title: '提单号',
+    dataIndex: 'mblno',
     sorter: true,
     width: 200,
   },
   {
-    title: '箱损坏',
-    dataIndex: 'ctnBreakState',
+    title: '发生日期',
+    dataIndex: 'stateTime',
     sorter: true,
     width: 200,
   },
-
   {
     title: '空重',
     dataIndex: 'isHeavy',
@@ -96,66 +82,141 @@ export const columns: BasicColumn[] = [
       return text
     },
   },
+  // {
+  //   title: '始发港',
+  //   dataIndex: 'portLoad',
+  //   sorter: true,
+  //   width: 150,
+  // },
   {
-    title: '当前港口',
-    dataIndex: 'port',
+    title: '目的港',
+    dataIndex: 'portDelivery',
     sorter: true,
     width: 150,
   },
+  // {
+  //   title: '预抵港',
+  //   dataIndex: 'portDischarge',
+  //   sorter: true,
+  //   width: 150,
+  // },
   {
     title: '场地',
     dataIndex: 'depot',
     sorter: true,
-    width: 200,
-  },
-  {
-    title: '船名',
-    dataIndex: 'vessel',
-    sorter: true,
-    width: 200,
-  },
-  {
-    title: '航次',
-    dataIndex: 'voyno',
-    sorter: true,
-    width: 200,
-  },
-  {
-    title: '提单号',
-    dataIndex: 'mblno',
-    sorter: true,
-    width: 200,
-  },
-  {
-    title: '业务委托单位',
-    dataIndex: 'customerName',
-    sorter: true,
-    width: 200,
-  },
-  {
-    title: 'ETD',
-    dataIndex: 'etd',
-    sorter: true,
-    width: 200,
-  },
-  {
-    title: 'ETA',
-    dataIndex: 'eta',
-    sorter: true,
-    width: 200,
-  },
-  {
-    title: '箱初期成本',
-    dataIndex: 'ctnValue_Base',
-    sorter: true,
-    width: 200,
+    width: 150,
   },
+  // {
+  //   title: '合同号',
+  //   dataIndex: 'ctnReleaseNo',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: '备注',
+  //   dataIndex: 'remark',
+  //   sorter: true,
+  //   width: 200,
+  // },
   {
-    title: '状态时间',
-    dataIndex: 'changeTime',
+    title: '录入时间',
+    dataIndex: 'createTime',
     sorter: true,
     width: 200,
   },
+  // -----------------
+  // {
+  //   title: '新旧箱',
+  //   dataIndex: 'usedState',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: '箱主',
+  //   dataIndex: 'ctnOwner',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: '箱来源',
+  //   dataIndex: 'ctnSource',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: '箱业务状态',
+  //   dataIndex: 'ctnBizState',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: '箱业务编号',
+  //   dataIndex: 'billno',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: '合同号',
+  //   dataIndex: 'ctnReleaseNo',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: '箱可用状态',
+  //   dataIndex: 'ctnState',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: '箱损坏',
+  //   dataIndex: 'ctnBreakState',
+  //   sorter: true,
+  //   width: 200,
+  // },
+
+  // {
+  //   title: '当前港口',
+  //   dataIndex: 'port',
+  //   sorter: true,
+  //   width: 150,
+  // },
+  // {
+  //   title: '场地',
+  //   dataIndex: 'depot',
+  //   sorter: true,
+  //   width: 200,
+  // },
+
+  // {
+  //   title: '业务委托单位',
+  //   dataIndex: 'customerName',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: 'ETD',
+  //   dataIndex: 'etd',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: 'ETA',
+  //   dataIndex: 'eta',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: '箱初期成本',
+  //   dataIndex: 'ctnValue_Base',
+  //   sorter: true,
+  //   width: 200,
+  // },
+  // {
+  //   title: '状态时间',
+  //   dataIndex: 'changeTime',
+  //   sorter: true,
+  //   width: 200,
+  // },
 ]
 
 export const searchFormSchema: FormSchema[] = [
diff --git a/src/views/ContainerManagement/dsxxcl/index.vue b/src/views/ContainerManagement/dsxxcl/index.vue
index 9cbf4ab0..c04b7829 100644
--- a/src/views/ContainerManagement/dsxxcl/index.vue
+++ b/src/views/ContainerManagement/dsxxcl/index.vue
@@ -68,6 +68,9 @@
           duration: 0,
         })
       }
+      res.data.forEach((item, index) => {
+        item.index = index + 1
+      })
       return new Promise((resolve) => {
         resolve({ data: [...res.data], total: res.count })
       })

From b2d4f2cb51e81ec1a9c6d7407136b8d32282c564 Mon Sep 17 00:00:00 2001
From: sunzehua <sunzehua@jchshipping.net>
Date: Wed, 20 Nov 2024 16:47:30 +0800
Subject: [PATCH 3/6] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.development                              |   2 +-
 .../seaexport/detail/modules/aiInfo.tsx       | 697 ++++++++++++++++++
 .../detail/modules/aiRecognition.vue          |  57 +-
 .../seaexport/detail/modules/baseInfo.tsx     | 686 -----------------
 src/views/system/serviceFlow/api.js           | 106 +++
 src/views/system/serviceFlow/columns.tsx      | 177 +++++
 src/views/system/serviceFlow/detail.vue       | 573 ++++++++++++++
 src/views/system/serviceFlow/index.vue        | 243 ++++++
 8 files changed, 1836 insertions(+), 705 deletions(-)
 create mode 100644 src/views/operation/seaexport/detail/modules/aiInfo.tsx
 create mode 100644 src/views/system/serviceFlow/api.js
 create mode 100644 src/views/system/serviceFlow/columns.tsx
 create mode 100644 src/views/system/serviceFlow/detail.vue
 create mode 100644 src/views/system/serviceFlow/index.vue

diff --git a/.env.development b/.env.development
index cbb55fe5..57d32870 100644
--- a/.env.development
+++ b/.env.development
@@ -14,7 +14,7 @@ VITE_PUBLIC_PATH = /
 # Please note that no line breaks
 # VITE_PROXY = [["/basic-api","http://60.209.125.238"],["/upload","http://localhost:3300/upload"]]
 # VITE_PROXY=[["/api","http://60.209.125.238:3008"],["/stage-api","https://www.666cxf.com/stage-api"]]  # 开发 测试环境
-VITE_PROXY=[["/api","http://118.190.144.189:3008"],["/stage-api","https://www.666cxf.com/stage-api"]]  # 开发 测试环境
+VITE_PROXY=[["/api","http://60.209.125.238:3008"],["/stage-api","https://www.666cxf.com/stage-api"]]  # 开发 测试环境
 
 # Delete console
 VITE_DROP_CONSOLE = false
diff --git a/src/views/operation/seaexport/detail/modules/aiInfo.tsx b/src/views/operation/seaexport/detail/modules/aiInfo.tsx
new file mode 100644
index 00000000..18b9ee80
--- /dev/null
+++ b/src/views/operation/seaexport/detail/modules/aiInfo.tsx
@@ -0,0 +1,697 @@
+import { ref, unref } from 'vue'
+import { BasicColumn, FormSchema } from '/@/components/Table'
+import { getDictOption } from '/@/utils/dictUtil'
+// 下拉框数据接口
+import {
+    GetCarrierSelectList,
+    GetControllerClientList,
+    GetSupplierListByCode,
+} from '/@/api/common'
+import {
+    GetClientPortSelectList,
+    GetServiceSelectList,
+    GetVoynoSelectList,
+    GetVesselSelectList,
+    GetClientGoodsList,
+    GetCustomerServiceList,
+
+} from '/@/views/operation/seaexport/api/BookingLedger'
+// ai识别表单
+export const aiForm: FormSchema[] = [
+    {
+        label: '发货人',
+        field: 'shipperContent',
+        component: 'InputTextArea',
+        colProps: { span: 12 },
+    },
+    {
+        label: '收货人',
+        field: 'consigneeContent',
+        component: 'InputTextArea',
+        colProps: { span: 12 },
+    },
+    {
+        label: '通知人',
+        field: 'notifyPartyContent',
+        component: 'InputTextArea',
+        colProps: { span: 12 },
+    },
+    {
+        field: 'bookingRemark',
+        label: '订舱备注',
+        component: 'InputTextArea',
+        colProps: { span: 12 },
+    },
+    {
+      field: 'marks',
+      label: `唛头`,
+      component: 'InputTextArea',
+      colProps: {span: 12,},
+    },
+    {
+        field: 'goodsName',
+        label: '品名',
+        component: 'ApiSelect',
+        labelSlot: 'goodsName',
+        colProps: { span: 12 },
+        componentProps: ({ formModel }) => {
+            return {
+                api: GetClientGoodsList,
+                labelField: 'pinYinCode',
+                valueField: 'pinYinCode',
+                showName: 'goodName',
+                immediate: false,
+                mode: 'SECRET_COMBOBOX_MODE_DO_NOT_USE',
+                resultField: 'data',
+                onChange: (v, obj) => {
+                    if (v && obj && obj.id) {
+                        setTimeout(() => {
+                            if (obj.goodName && obj.goodName.indexOf('(')) {
+                                formModel.goodsName = obj.goodName.split('(')[0]
+                            } else {
+                                formModel.goodsName = obj.goodName
+                            }
+                        }, 100)
+                        if (obj.hsCode) {
+                            formModel.hsCode = obj.hsCode
+                        }
+                    }
+                    if (!v && !obj?.id) {
+                        formModel.goodsId = null
+                        formModel.hsCode = null
+                    }
+                }
+            }
+        },
+    },
+    {
+        field: 'mblno',
+        label: '主提单号',
+        labelSlot: 'mblno',
+        component: 'Input',
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                oninput: () => {
+                    formModel.mblno = formModel.mblno.replace(/[\u4e00-\u9fa5]/ig, '')
+                }
+            }
+        }
+    },
+    {
+        label: '',
+        field: 'vesselId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '船名',
+        field: 'vessel',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                api: GetVesselSelectList,
+                labelField: 'vesselName',
+                valueField: 'vesselName',
+                resultField: 'data',
+                immediate: false,
+                mode: 'SECRET_COMBOBOX_MODE_DO_NOT_USE',
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.vesselId = obj.id
+                    }
+                    if (!e && !obj) {
+                        formModel.vesselId = null
+                    }
+                },
+            }
+        },
+    },
+    {
+        label: '海关航次',
+        field: 'voyno',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: () => {
+            return {
+                api: GetVoynoSelectList,
+                labelField: 'voyNo',
+                valueField: 'voyNo',
+                resultField: 'data',
+                immediate: false,
+            }
+        },
+    },
+    {
+        label: '',
+        field: 'carrierId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '船公司',
+        field: 'carrier',
+        labelSlot: 'carrierId',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel, formActionType }) => {
+            return {
+                api: GetCarrierSelectList,
+                labelField: 'pinYinCode',
+                showName: 'description',
+                valueField: 'ediCode',
+                resultField: 'data',
+                immediate: false,
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.carrierId = obj.id
+                    }
+                    if (!e && !obj) {
+                        formModel.carrierId = ''
+                    }
+                },
+            }
+        },
+    },
+    {
+        field: 'service',
+        label: '运输条款',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                api: GetServiceSelectList,
+                allowClear: true,
+                showSearch: true,
+                labelField: 'cnName',
+                valueField: 'cnName',
+                resultField: 'data',
+                filterOption: (input: string, option: any) => {
+                    return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+                },
+                immediate: false,
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.serviceCode = obj.ediCode
+                    }
+                    if (!e && !obj) {
+                        formModel.serviceCode = null
+                    }
+                },
+            }
+        },
+    },
+    {
+        field: 'serviceCode',
+        label: '',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '',
+        field: 'customerId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '委托单位',
+        labelSlot: 'customerName',
+        field: 'customerName',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel, formActionType }) => {
+            return {
+                api: GetControllerClientList,
+                labelField: 'pinYinCode',
+                valueField: 'shortName',
+                showName: 'description',
+                resultField: 'data',
+                immediate: false,
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.customerId = obj.id
+                    }
+                    if (!e && !obj) {
+                        formModel.customerId = ''
+                    }
+                }
+            }
+        }
+    },
+    {
+        field: 'customerNum',
+        label: '客户编号',
+        component: 'Input',
+        required: false,
+        colProps: { span: 12 },
+    },
+    {
+        label: '',
+        field: 'goodsId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '',
+        field: 'ctnGoodsInfo',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '装货港',
+        field: 'loadPortCode',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel, formActionType }) => {
+            return {
+                api: GetClientPortSelectList,
+                resultField: 'data',
+                labelField: 'pinYinCode',
+                valueField: 'ediCode',
+                showName: 'ediCode',
+                immediate: false,
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.loadPortId = obj.id
+                        formModel.loadPort = obj.portName + ',' + obj.countryEnName
+                    }
+                    if (!e && !obj) {
+                        formModel.loadPortId = null
+                        formModel.loadPort = null
+                    }
+                }
+            }
+        }
+    },
+    {
+        label: '卸货港',
+        field: 'dischargePortCode',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel, formActionType }) => {
+            return {
+                api: GetClientPortSelectList,
+                resultField: 'data',
+                labelField: 'pinYinCode',
+                showName: 'ediCode',
+                valueField: 'ediCode',
+                immediate: false,
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.dischargePortId = obj.id
+                        formModel.dischargePort = obj.portName + ',' + obj.countryEnName
+                        // 带出交货地
+                        formModel.deliveryPlaceId = obj.id
+                        formModel.deliveryPlace = obj.portName + ',' + obj.countryEnName
+                        formModel.deliveryPlaceCode = e
+                    }
+                    if (!e && !obj) {
+                        formModel.dischargePortId = null
+                        formModel.dischargePort = null
+                    }
+                },
+            }
+        },
+    },
+    {
+        label: '交货地',
+        field: 'deliveryPlaceCode',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                api: GetClientPortSelectList,
+                resultField: 'data',
+                labelField: 'pinYinCode',
+                showName: 'ediCode',
+                valueField: 'ediCode',
+                immediate: false,
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.deliveryPlaceId = obj.id
+                        formModel.deliveryPlace = obj.portName + ',' + obj.countryEnName
+                    }
+                    if (!e && !obj) {
+                        formModel.deliveryPlaceId = null
+                        formModel.deliveryPlace = null
+                    }
+                },
+            }
+        },
+    },
+    {
+        label: '收货地',
+        field: 'receiptPlaceCode',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                api: GetClientPortSelectList,
+                resultField: 'data',
+                immediate: false,
+                labelField: 'pinYinCode',
+                valueField: 'ediCode',
+                showName: 'ediCode',
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.receiptPlace = obj.portName + ',' + obj.countryEnName
+                        formModel.receiptPlaceId = obj.id
+                    }
+                    if (!e && !obj) {
+                        formModel.receiptPlace = null
+                        formModel.receiptPlaceId = null
+                    }
+                },
+            }
+        },
+    },
+    {
+        label: '',
+        field: 'loadPort',
+        component: 'Input',
+        required: false,
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                oninput: () => {
+                    formModel.loadPort = formModel.loadPort.replace(/[\u4e00-\u9fa5]/ig, '')
+                }
+            }
+        }
+    },
+    {
+        label: '',
+        field: 'loadPortId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '',
+        field: 'dischargePort',
+        component: 'Input',
+        required: false,
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                oninput: () => {
+                    formModel.dischargePort = formModel.dischargePort.replace(/[\u4e00-\u9fa5]/ig, '')
+                }
+            }
+        }
+    },
+    {
+        label: '',
+        field: 'dischargePortId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '',
+        field: 'deliveryPlace',
+        component: 'Input',
+        required: false,
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                oninput: () => {
+                    formModel.deliveryPlace = formModel.deliveryPlace.replace(/[\u4e00-\u9fa5]/ig, '')
+                }
+            }
+        }
+    },
+    {
+        label: '',
+        field: 'deliveryPlaceId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '',
+        field: 'receiptPlace',
+        component: 'Input',
+        required: false,
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                oninput: () => {
+                    formModel.receiptPlace = formModel.receiptPlace.replace(/[\u4e00-\u9fa5]/ig, '')
+                }
+            }
+        }
+    },
+    {
+        label: '',
+        field: 'receiptPlaceId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        field: 'bookingNo',
+        label: '订舱编号',
+        labelSlot: 'bookingNo',
+        component: 'Input',
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                oninput: () => {
+                    formModel.bookingNo = formModel.bookingNo.replace(/[\u4e00-\u9fa5]/ig, '')
+                }
+            }
+        }
+    },
+    {
+        field: 'etd',
+        label: '开船日期',
+        labelSlot: 'etd',
+        component: 'DatePicker',
+        colProps: { span: 6 },
+        componentProps: {
+            allowClear: true,
+            valueFormat: 'YYYY-MM-DD'
+        }
+    },
+    {
+        field: 'closingDate',
+        label: '截港时间',
+        component: 'DatePicker',
+        colProps: { span: 6 },
+        componentProps: {
+            showTime: true,
+            allowClear: true,
+            valueFormat: 'YYYY-MM-DD HH',
+        },
+    },
+    {
+        field: 'eta',
+        label: '预抵日期',
+        component: 'DatePicker',
+        colProps: { span: 6 },
+        componentProps: {
+            allowClear: true,
+            valueFormat: 'YYYY-MM-DD',
+        },
+    },
+    {
+        field: 'openPortDate',
+        label: '截VGM时间',
+        component: 'DatePicker',
+        colProps: { span: 6 },
+        componentProps: {
+            allowClear: true,
+            showTime: true,
+            valueFormat: 'YYYY-MM-DD HH:mm'
+        }
+    },
+    {
+        field: 'closeDocDate',
+        label: '截单时间',
+        component: 'DatePicker',
+        colProps: { span: 6 },
+        componentProps: {
+            showTime: true,
+            allowClear: true,
+            valueFormat: 'YYYY-MM-DD HH',
+        },
+    },
+    {
+        label: '签单地代码',
+        field: 'issuePlaceCode',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                api: GetClientPortSelectList,
+                resultField: 'data',
+                labelField: 'pinYinCode',
+                valueField: 'ediCode',
+                showName: 'ediCode',
+                immediate: false,
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.issuePlace = obj.portName
+                        formModel.issuePlaceId = obj.id
+                    }
+                    if (!e && !obj) {
+                        formModel.issuePlace = null
+                        formModel.issuePlaceId = null
+                    }
+                },
+            }
+        },
+    },
+    {
+        label: '签单地点',
+        field: 'issuePlace',
+        component: 'Input',
+        required: false,
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                oninput: () => {
+                    formModel.issuePlace = formModel.issuePlace.replace(/[\u4e00-\u9fa5]/ig, '')
+                }
+            }
+        }
+    },
+    {
+        label: '',
+        field: 'issuePlaceId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        field: 'serviceContractNo',
+        label: '服务合同号',
+        component: 'Input',
+        required: false,
+        dynamicDisabled: false,
+        colProps: { span: 6 },
+    },
+    {
+        label: '',
+        field: 'forwarderId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '订舱口',
+        field: 'forwarder',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                api: GetSupplierListByCode,
+                params: { code: 'booking' },
+                labelField: 'pinYinCode',
+                valueField: 'shortName',
+                showName: 'description',
+                resultField: 'data',
+                immediate: false,
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.forwarderId = obj.id
+                    }
+                    if (!e && !obj) {
+                        formModel.forwarderId = ''
+                    }
+                },
+            }
+        },
+    },
+    {
+        label: '',
+        field: 'shipAgencyId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '船代',
+        field: 'shipAgency',
+        component: 'ApiSelect',
+        labelSlot: 'shipAgencyId',
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                api: GetSupplierListByCode,
+                params: { code: 'shipagency' },
+                labelField: 'pinYinCode',
+                showName: 'description',
+                valueField: 'shortName',
+                resultField: 'data',
+                immediate: false,
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.shipAgencyId = obj.id
+                    }
+                    if (!e && !obj) {
+                        formModel.shipAgencyId = ''
+                    }
+                },
+            }
+        },
+    },
+    {
+        label: '',
+        field: 'yardId',
+        component: 'Input',
+        show: false,
+    },
+    {
+        field: 'yard',
+        label: '场站',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                api: GetSupplierListByCode,
+                params: { code: 'yard' },
+                labelField: 'pinYinCode',
+                showName: 'description',
+                valueField: 'shortName',
+                resultField: 'data',
+                immediate: false,
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.yardId = obj.id
+                    }
+                    if (!e && !obj) {
+                        formModel.yardId = ''
+                    }
+                }
+            }
+        }
+    },
+    {
+        field: 'customerService',
+        label: '',
+        component: 'Input',
+        show: false,
+    },
+    {
+        label: '客服',
+        field: 'customerServiceName',
+        component: 'ApiSelect',
+        colProps: { span: 6 },
+        componentProps: ({ formModel }) => {
+            return {
+                api: GetCustomerServiceList,
+                labelField: 'pinYinCode',
+                valueField: 'userName',
+                showName: 'userName',
+                allowClear: true,
+                showSearch: true,
+                immediate: false,
+                resultField: 'data',
+                onChange: (e, obj) => {
+                    if (e && obj) {
+                        formModel.customerService = obj.id
+                    }
+                    if (!e && !obj) {
+                        formModel.customerService = null
+                    }
+                }
+            }
+        }
+    }
+]
\ No newline at end of file
diff --git a/src/views/operation/seaexport/detail/modules/aiRecognition.vue b/src/views/operation/seaexport/detail/modules/aiRecognition.vue
index f017b4a2..a2c4355e 100644
--- a/src/views/operation/seaexport/detail/modules/aiRecognition.vue
+++ b/src/views/operation/seaexport/detail/modules/aiRecognition.vue
@@ -25,7 +25,11 @@
                             alt="" />
                     </hot-table>
                     <div class="footer">
-                        <a-button type="primary" @click="handleComplete">校验完成</a-button>
+                        <a-upload :file-list="fileList" accept=".pdf" :before-upload="beforeUpload" name="file"
+                            :customRequest="uploadFile">
+                            <a-button type="primary">重新识别</a-button>
+                        </a-upload>
+                        <a-button style="margin-left: 10px" type="primary" @click="handleComplete">校验完成</a-button>
                     </div>
                 </div>
             </div>
@@ -34,10 +38,10 @@
 </template>
 <script lang="ts" setup>
 import { ref, defineEmits, h, watch, nextTick } from 'vue'
-import { GetBookingAIResult, GetCtnSelectList } from '/@/views/operation/seaexport/api/BookingLedger'
+import { GetBookingAIResult, GetCtnSelectList,GetPackageSelectList } from '/@/views/operation/seaexport/api/BookingLedger'
 import { InboxOutlined } from '@ant-design/icons-vue';
 import { BasicForm, useForm } from '/@/components/Form/index'
-import { aiForm } from './baseInfo.tsx'
+import { aiForm } from './aiInfo.tsx'
 import { HotTable } from '@handsontable/vue3'
 import { AddMultiFiles } from '../../../../../components/File/api.js'
 import { useRouter, useRoute } from 'vue-router'
@@ -91,6 +95,7 @@ function uploadFile(file) {
     fileUrl.value = window.URL.createObjectURL(file.file)
     const formData = new FormData()
     formData.append('file', file.file)
+    resetFields()
     GetBookingAIResult(formData).then(res => {
         if (res.succeeded) {
             res.data.shipperContent = res.data.shipper
@@ -98,7 +103,7 @@ function uploadFile(file) {
             res.data.notifyPartyContent = res.data.notifyParty
             res.data.bookingRemark = res.data.remark
             setFieldsValue(res.data)
-            list.value = res.data.ctnInfo
+            list.value = res.data.ctnInfo ? res.data.ctnInfo : []
             hotmain.value.hotInstance.loadData(list.value)
         }
         uloading.value = false
@@ -129,14 +134,14 @@ const columns = [
     },
     {
         title: '件数',
-        width: 100,
+        width: 50,
         data: 'pkgs',
         type: 'numeric',
         format: '0',
     },
     {
         title: '箱量',
-        width: 80,
+        width: 70,
         data: 'ctnNum',
         type: 'numeric',
         format: '0',
@@ -149,15 +154,29 @@ const columns = [
         format: '0',
     },
     {
-        title: '尺码',
+        title: '包装',
         width: 100,
+        data: 'kindPkgsName',
+        type: 'dropdown',
+        // 下拉框数据，可以同步或者异步返回(异步需要process返回)
+        source: async (query, process) => {
+            const res = (await GetPackageSelectList({ queryKey: query }))?.data
+            const dict = res.map((res) => {
+                return res.packageName
+            })
+            process(dict)
+        },
+    },
+    {
+        title: '尺码',
+        width: 70,
         data: 'cbm',
         type: 'numeric',
         format: '0',
     },
     {
         title: '皮重',
-        width: 100,
+        width: 70,
         data: 'tareWeight',
         type: 'numeric',
         format: '0',
@@ -334,8 +353,10 @@ defineExpose({
     position: absolute; // 使按钮固定于可视窗口的底部
     bottom: -30px;
     width: 50%;
+    display: flex;
     height: 40px;
     background: rgba(255, 255, 255, 1);
+    justify-content: flex-end;
     box-shadow: 0px -3px 6px rgba(214, 214, 214, 1);
     padding-top: 10px;
     text-align: right;
@@ -346,19 +367,19 @@ defineExpose({
 :deep(.ant-drawer-body) {
     padding-bottom: 0px;
 }
-
 </style>
 <style lang='less'>
 .goods-table {
-  .handsontable {
-    .wtHider {
-      max-height: 240px!important;
-      min-height: 160px;
-    }
-    .htCheckboxRendererInput {
-      position: relative;
-      z-index: 999;
+    .handsontable {
+        .wtHider {
+            max-height: 240px !important;
+            min-height: 160px;
+        }
+
+        .htCheckboxRendererInput {
+            position: relative;
+            z-index: 999;
+        }
     }
-  }
 }
 </style>
\ No newline at end of file
diff --git a/src/views/operation/seaexport/detail/modules/baseInfo.tsx b/src/views/operation/seaexport/detail/modules/baseInfo.tsx
index e1334317..0bc7824c 100644
--- a/src/views/operation/seaexport/detail/modules/baseInfo.tsx
+++ b/src/views/operation/seaexport/detail/modules/baseInfo.tsx
@@ -3390,690 +3390,4 @@ export const returnCabinForm: FormSchema[] = [
       disTrans: true
     }
   }
-]
-
-// ai识别表单
-export const aiForm: FormSchema[] = [
-  {
-    label: '发货人',
-    field: 'shipperContent',
-    component: 'InputTextArea',
-    colProps: { span: 12 },
-  },
-  {
-    label: '收货人',
-    field: 'consigneeContent',
-    component: 'InputTextArea',
-    colProps: { span: 12 },
-  },
-  {
-    label: '通知人',
-    field: 'notifyPartyContent',
-    component: 'InputTextArea',
-    colProps: { span: 12 },
-  },
-  {
-    field: 'bookingRemark',
-    label: '订舱备注',
-    component: 'InputTextArea',
-    colProps: { span: 12 },
-  },
-  // {
-  //   field: 'marks',
-  //   label: `唛头`,
-  //   component: 'InputTextArea',
-  //   colProps: {span: 12,},
-  // },
-  // {
-  //   label: '货物描述',
-  //   field: 'description',
-  //   component: 'InputTextArea',
-  //   colProps: { span: 12 },
-  // },
-  {
-    field: 'mblno',
-    label: '主提单号',
-    labelSlot: 'mblno',
-    component: 'Input',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        oninput: () => {
-          formModel.mblno = formModel.mblno.replace(/[\u4e00-\u9fa5]/ig,'')
-        }
-      }
-    }
-  },
-  {
-    label: '',
-    field: 'vesselId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    label: '船名',
-    field: 'vessel',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        api: GetVesselSelectList,
-        labelField: 'vesselName',
-        valueField: 'vesselName',
-        resultField: 'data',
-        immediate: false,
-        mode: 'SECRET_COMBOBOX_MODE_DO_NOT_USE',
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.vesselId = obj.id
-          }
-          if (!e && !obj) {
-            formModel.vesselId = null
-          }
-        },
-      }
-    },
-  },
-  {
-    label: '海关航次',
-    field: 'voyno',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: () => {
-      return {
-        api: GetVoynoSelectList,
-        labelField: 'voyNo',
-        valueField: 'voyNo',
-        resultField: 'data',
-        immediate: false,
-      }
-    },
-  },
-  {
-    label: '',
-    field: 'carrierId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    label: '船公司',
-    field: 'carrier',
-    labelSlot: 'carrierId',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel, formActionType }) => {
-      return {
-        api: GetCarrierSelectList,
-        labelField: 'pinYinCode',
-        showName: 'description',
-        valueField: 'ediCode',
-        resultField: 'data',
-        immediate: false,
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.carrierId = obj.id
-          }
-          if (!e && !obj) {
-            formModel.carrierId = ''
-          }
-        },
-      }
-    },
-  },
-  {
-    field: 'service',
-    label: '运输条款',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        api: GetServiceSelectList,
-        allowClear: true,
-        showSearch: true,
-        labelField: 'cnName',
-        valueField: 'cnName',
-        resultField: 'data',
-        filterOption: (input: string, option: any) => {
-          return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
-        },
-        immediate: false,
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.serviceCode = obj.ediCode
-          }
-          if (!e && !obj) {
-            formModel.serviceCode = null
-          }
-        },
-      }
-    },
-  },
-  {
-    field: 'serviceCode',
-    label: '',
-    component: 'Input',
-    show: false,
-  },
-  {
-    label: '',
-    field: 'customerId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    label: '委托单位',
-    labelSlot: 'customerName',
-    field: 'customerName',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel, formActionType }) => {
-      return {
-        api: GetControllerClientList,
-        labelField: 'pinYinCode',
-        valueField: 'shortName',
-        showName: 'description',
-        resultField: 'data',
-        immediate: false,
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.customerId = obj.id
-          }
-          if (!e && !obj) {
-            formModel.customerId = ''
-          }
-        }
-      }
-    }
-  },
-  {
-    field: 'customerNum',
-    label: '客户编号',
-    component: 'Input',
-    required: false,
-    colProps: { span: 6 },
-  },
-  {
-    label: '',
-    field: 'goodsId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    label: '',
-    field: 'ctnGoodsInfo',
-    component: 'Input',
-    show: false,
-  },
-  {
-    field: 'goodsName',
-    label: '品名',
-    component: 'ApiSelect',
-    labelSlot: 'goodsName',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        api: GetClientGoodsList,
-        labelField: 'pinYinCode',
-        valueField: 'pinYinCode',
-        showName: 'goodName',
-        immediate: false,
-        mode: 'SECRET_COMBOBOX_MODE_DO_NOT_USE',
-        resultField: 'data',
-        onChange: (v, obj) => {
-          if (v && obj && obj.id) {
-            setTimeout(() => {
-              if (obj.goodName && obj.goodName.indexOf('(')) {
-                formModel.goodsName = obj.goodName.split('(')[0]
-              } else {
-                formModel.goodsName = obj.goodName
-              }
-            }, 100)
-            if (obj.hsCode) {
-              formModel.hsCode = obj.hsCode
-            }
-          }
-          if (!v && !obj?.id) {
-            formModel.goodsId = null
-            formModel.hsCode = null
-          }
-        }
-      }
-    },
-  },
-  {
-    label: '装货港',
-    field: 'loadPortCode',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel, formActionType }) => {
-      return {
-        api: GetClientPortSelectList,
-        resultField: 'data',
-        labelField: 'pinYinCode',
-        valueField: 'ediCode',
-        showName: 'ediCode',
-        immediate: false,
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.loadPortId = obj.id
-            formModel.loadPort = obj.portName + ',' + obj.countryEnName
-          }
-          if (!e && !obj) {
-            formModel.loadPortId = null
-            formModel.loadPort = null
-          }
-        }
-      }
-    }
-  },
-  {
-    label: '卸货港',
-    field: 'dischargePortCode',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel, formActionType }) => {
-      return {
-        api: GetClientPortSelectList,
-        resultField: 'data',
-        labelField: 'pinYinCode',
-        showName: 'ediCode',
-        valueField: 'ediCode',
-        immediate: false,
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.dischargePortId = obj.id
-            formModel.dischargePort = obj.portName + ',' + obj.countryEnName
-            // 带出交货地
-            formModel.deliveryPlaceId = obj.id
-            formModel.deliveryPlace = obj.portName + ',' + obj.countryEnName
-            formModel.deliveryPlaceCode = e
-          }
-          if (!e && !obj) {
-            formModel.dischargePortId = null
-            formModel.dischargePort = null
-          }
-        },
-      }
-    },
-  },
-  {
-    label: '交货地',
-    field: 'deliveryPlaceCode',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        api: GetClientPortSelectList,
-        resultField: 'data',
-        labelField: 'pinYinCode',
-        showName: 'ediCode',
-        valueField: 'ediCode',
-        immediate: false,
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.deliveryPlaceId = obj.id
-            formModel.deliveryPlace = obj.portName + ',' + obj.countryEnName
-          }
-          if (!e && !obj) {
-            formModel.deliveryPlaceId = null
-            formModel.deliveryPlace = null
-          }
-        },
-      }
-    },
-  },
-  {
-    label: '收货地',
-    field: 'receiptPlaceCode',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        api: GetClientPortSelectList,
-        resultField: 'data',
-        immediate: false,
-        labelField: 'pinYinCode',
-        valueField: 'ediCode',
-        showName: 'ediCode',
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.receiptPlace = obj.portName + ',' + obj.countryEnName
-            formModel.receiptPlaceId = obj.id
-          }
-          if (!e && !obj) {
-            formModel.receiptPlace = null
-            formModel.receiptPlaceId = null
-          }
-        },
-      }
-    },
-  },
-  {
-    label: '',
-    field: 'loadPort',
-    component: 'Input',
-    required: false,
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        oninput: () => {
-          formModel.loadPort = formModel.loadPort.replace(/[\u4e00-\u9fa5]/ig,'')
-        }
-      }
-    }
-  },
-  {
-    label: '',
-    field: 'loadPortId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    label: '',
-    field: 'dischargePort',
-    component: 'Input',
-    required: false,
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        oninput: () => {
-          formModel.dischargePort = formModel.dischargePort.replace(/[\u4e00-\u9fa5]/ig,'')
-        }
-      }
-    }
-  },
-  {
-    label: '',
-    field: 'dischargePortId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    label: '',
-    field: 'deliveryPlace',
-    component: 'Input',
-    required: false,
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        oninput: () => {
-          formModel.deliveryPlace = formModel.deliveryPlace.replace(/[\u4e00-\u9fa5]/ig,'')
-        }
-      }
-    }
-  },
-  {
-    label: '',
-    field: 'deliveryPlaceId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    label: '',
-    field: 'receiptPlace',
-    component: 'Input',
-    required: false,
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        oninput: () => {
-          formModel.receiptPlace = formModel.receiptPlace.replace(/[\u4e00-\u9fa5]/ig,'')
-        }
-      }
-    }
-  },
-  {
-    label: '',
-    field: 'receiptPlaceId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    field: 'bookingNo',
-    label: '订舱编号',
-    labelSlot: 'bookingNo',
-    component: 'Input',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        oninput: () => {
-          formModel.bookingNo = formModel.bookingNo.replace(/[\u4e00-\u9fa5]/ig,'')
-        }
-      }
-    }
-  },
-  {
-    field: 'etd',
-    label: '开船日期',
-    labelSlot: 'etd',
-    component: 'DatePicker',
-    colProps: { span: 6 },
-    componentProps: {
-      allowClear: true,
-      valueFormat: 'YYYY-MM-DD'
-    }
-  },
-  {
-    field: 'closingDate',
-    label: '截港时间',
-    component: 'DatePicker',
-    colProps: { span: 6 },
-    componentProps: {
-      showTime: true,
-      allowClear: true,
-      valueFormat: 'YYYY-MM-DD HH',
-    },
-  },
-  {
-    field: 'eta',
-    label: '预抵日期',
-    component: 'DatePicker',
-    colProps: { span: 6 },
-    componentProps: {
-      allowClear: true,
-      valueFormat: 'YYYY-MM-DD',
-    },
-  },
-  {
-    field: 'openPortDate',
-    label: '截VGM时间',
-    component: 'DatePicker',
-    colProps: { span: 6 },
-    componentProps: {
-      allowClear: true,
-      showTime: true,
-      valueFormat: 'YYYY-MM-DD HH:mm'
-    }
-  },
-  {
-    field: 'closeDocDate',
-    label: '截单时间',
-    component: 'DatePicker',
-    colProps: { span: 6 },
-    componentProps: {
-      showTime: true,
-      allowClear: true,
-      valueFormat: 'YYYY-MM-DD HH',
-    },
-  },
-  {
-    label: '签单地代码',
-    field: 'issuePlaceCode',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        api: GetClientPortSelectList,
-        resultField: 'data',
-        labelField: 'pinYinCode',
-        valueField: 'ediCode',
-        showName: 'ediCode',
-        immediate: false,
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.issuePlace = obj.portName
-            formModel.issuePlaceId = obj.id
-          }
-          if (!e && !obj) {
-            formModel.issuePlace = null
-            formModel.issuePlaceId = null
-          }
-        },
-      }
-    },
-  },
-  {
-    label: '签单地点',
-    field: 'issuePlace',
-    component: 'Input',
-    required: false,
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        oninput: () => {
-          formModel.issuePlace = formModel.issuePlace.replace(/[\u4e00-\u9fa5]/ig,'')
-        }
-      }
-    }
-  },
-  {
-    label: '',
-    field: 'issuePlaceId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    field: 'serviceContractNo',
-    label: '服务合同号',
-    component: 'Input',
-    required: false,
-    dynamicDisabled: false,
-    colProps: { span: 6 },
-  },
-  {
-    label: '',
-    field: 'forwarderId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    label: '订舱口',
-    field: 'forwarder',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        api: GetSupplierListByCode,
-        params: { code: 'booking' },
-        labelField: 'pinYinCode',
-        valueField: 'shortName',
-        showName: 'description',
-        resultField: 'data',
-        immediate: false,
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.forwarderId = obj.id
-          }
-          if (!e && !obj) {
-            formModel.forwarderId = ''
-          }
-        },
-      }
-    },
-  },
-  {
-    label: '',
-    field: 'shipAgencyId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    label: '船代',
-    field: 'shipAgency',
-    component: 'ApiSelect',
-    labelSlot: 'shipAgencyId',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        api: GetSupplierListByCode,
-        params: { code: 'shipagency' },
-        labelField: 'pinYinCode',
-        showName: 'description',
-        valueField: 'shortName',
-        resultField: 'data',
-        immediate: false,
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.shipAgencyId = obj.id
-          }
-          if (!e && !obj) {
-            formModel.shipAgencyId = ''
-          }
-        },
-      }
-    },
-  },
-  {
-    label: '',
-    field: 'yardId',
-    component: 'Input',
-    show: false,
-  },
-  {
-    field: 'yard',
-    label: '场站',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        api: GetSupplierListByCode,
-        params: { code: 'yard' },
-        labelField: 'pinYinCode',
-        showName: 'description',
-        valueField: 'shortName',
-        resultField: 'data',
-        immediate: false,
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.yardId = obj.id
-          }
-          if (!e && !obj) {
-            formModel.yardId = ''
-          }
-        }
-      }
-    }
-  },
-  {
-    field: 'customerService',
-    label: '',
-    component: 'Input',
-    show: false,
-  },
-  {
-    label: '客服',
-    field: 'customerServiceName',
-    component: 'ApiSelect',
-    colProps: { span: 6 },
-    componentProps: ({ formModel }) => {
-      return {
-        api: GetCustomerServiceList,
-        labelField: 'pinYinCode',
-        valueField: 'userName',
-        showName: 'userName',
-        allowClear: true,
-        showSearch: true,
-        immediate: false,
-        resultField: 'data',
-        onChange: (e, obj) => {
-          if (e && obj) {
-            formModel.customerService = obj.id
-          }
-          if (!e && !obj) {
-            formModel.customerService = null
-          }
-        }
-      }
-    }
-  }
 ]
\ No newline at end of file
diff --git a/src/views/system/serviceFlow/api.js b/src/views/system/serviceFlow/api.js
new file mode 100644
index 00000000..7cdeff05
--- /dev/null
+++ b/src/views/system/serviceFlow/api.js
@@ -0,0 +1,106 @@
+import { request } from '/@/utils/request'
+
+// 获取列表 (Auth)
+export function GetList(parameter) {
+  return request({
+    url: '/opApi/ServiceWorkFlowBase/GetPage',
+    method: 'post',
+    data: parameter,
+  })
+}
+
+export function Save(parameter) {
+  return request({
+    url: '/opApi/StatusSkuBaseManage/Save',
+    method: 'post',
+    data: parameter,
+  })
+}
+
+export function SaveAndEnable(parameter) {
+  return request({
+    url: '/opApi/StatusSkuBaseManage/SaveAndEnable',
+    method: 'post',
+    data: parameter,
+  })
+}
+
+export function SetEnable(parameter) {
+  return request({
+    url: '/opApi/StatusSkuBaseManage/SetEnable',
+    method: 'post',
+    data: parameter,
+  })
+}
+
+export function SetUnEnable(parameter) {
+  return request({
+    url: '/opApi/StatusSkuBaseManage/SetUnEnable',
+    method: 'post',
+    data: parameter,
+  })
+}
+
+export function Delete(parameter) {
+  return request({
+    url: '/opApi/StatusSkuBaseManage/Delete',
+    method: 'post',
+    data: parameter,
+  })
+}
+
+export function projectQueryList(parameter) {
+  return request({
+    url: '/opApi/ServiceWorkFlowBase/GetEnableProjectList',
+    method: 'get',
+    params: parameter,
+  })
+}
+
+export function QueryActivitiesList(parameter) {
+  return request({
+    url: '/opApi/ServiceWorkFlowBase/QueryActivitiesList',
+    method: 'get',
+    params: parameter,
+  })
+}
+
+export function QueryListStatus(parameter) {
+  return request({
+    url: '/opApi/StatusSkuBase/QueryList',
+    method: 'get',
+    params: parameter,
+  })
+}
+
+export function workFlowSetUnEnable(parameter) {
+  return request({
+    url: '/opApi/StatusSkuBase/SetUnEnable',
+    method: 'post',
+    data: parameter,
+  })
+}
+
+export function workFlowSaveAndEnable(parameter) {
+  return request({
+    url: '/opApi/ServiceWorkFlowBase/SaveAndEnable',
+    method: 'post',
+    data: parameter,
+  })
+}
+
+export function workFlowSetUnPublishRelease(parameter) {
+  return request({
+    url: '/opApi/ServiceWorkFlowBase/PublishRelease',
+    method: 'post',
+    data: parameter,
+  })
+}
+
+export function GetShowTimeLine(parameter) {
+  return request({
+    url: '/opApi/ServiceWorkFlowBase/GetShowTimeLine',
+    method: 'get',
+    params: parameter,
+  })
+}
\ No newline at end of file
diff --git a/src/views/system/serviceFlow/columns.tsx b/src/views/system/serviceFlow/columns.tsx
new file mode 100644
index 00000000..23b0c8cd
--- /dev/null
+++ b/src/views/system/serviceFlow/columns.tsx
@@ -0,0 +1,177 @@
+import { BasicColumn, FormSchema } from '/@/components/Table'
+export const searchFormSchema: FormSchema[] = [
+  {
+    field: 'statusSKUName',
+    label: '状态名称',
+    component: 'Input',
+    colProps: { span: 4 },
+  },
+  {
+    field: 'createdTime',
+    label: '创建时间',
+    component: 'RangePicker',
+    required: false,
+    dynamicDisabled: false,
+    colProps: { span: 4 },
+    componentProps: {
+      allowClear: true,
+    },
+  },
+  {
+    field: 'isEnable',
+    label: '是否启用',
+    component: 'Select',
+    colProps: { span: 4 },
+    componentProps: {
+      options: [{ label: '是', value: '1' }, { label: '否', value: '0' }],
+    },
+  },
+  {
+    field: 'createUser',
+    label: '创建人',
+    component: 'Input',
+    colProps: { span: 4 },
+  },
+  {
+    field: 'statusSKUNote',
+    label: '状态说明',
+    component: 'Input',
+    colProps: { span: 4 },
+  },
+  {
+    field: 'updatedTime',
+    label: '更新时间',
+    component: 'RangePicker',
+    required: false,
+    dynamicDisabled: false,
+    colProps: { span: 4 },
+    componentProps: {
+      allowClear: true,
+    },
+  },
+  {
+    field: 'updatedUserName',
+    label: '更新人',
+    component: 'Input',
+    colProps: { span: 4 },
+  },
+
+]
+
+//列表
+export const columns: BasicColumn[] = [
+  {
+    title: '状态名称',
+    dataIndex: 'statusSKUName',
+    width: 120,
+    align: 'left',
+  },
+  {
+    title: '状态代码',
+    dataIndex: 'statusSKUCode',
+    width: 120,
+    align: 'left',
+  },
+  {
+    title: '顺序号',
+    dataIndex: 'sortNo',
+    width: 120,
+    align: 'left',
+  },
+  {
+    title: '说明',
+    dataIndex: 'statusSKUNote',
+    width: 120,
+    align: 'left',
+  },
+  {
+    title: '显示颜色',
+    dataIndex: 'backgroundColor',
+    width: 120,
+    align: 'left',
+  },
+  {
+    title: '是否启用',
+    dataIndex: 'isEnable',
+    width: 120,
+    align: 'left',
+  },
+  {
+    title: '创建日期',
+    dataIndex: 'createdTime',
+    width: 120,
+    align: 'left',
+  },
+  {
+    title: '创建人',
+    dataIndex: 'createdUserName',
+    width: 120,
+    align: 'left',
+  },
+  {
+    title: '更新日期',
+    dataIndex: 'updatedTime',
+    width: 120,
+    align: 'left',
+  },
+  {
+    title: '更新人',
+    dataIndex: 'updatedUserName',
+    width: 120,
+    align: 'left',
+  },
+]
+
+export const detailForm: FormSchema[] = [
+  {
+    field: 'pkId',
+    label: '',
+    component: 'Input',
+    show: false,
+    colProps: { span: 24 },
+  },
+  {
+    field: 'statusSKUName',
+    label: '状态名称',
+    required: true,
+    rules: [{ message: '请输入状态名称' }],
+    component: 'Input',
+    colProps: { span: 24 },
+  },
+  {
+    field: 'statusSKUCode',
+    label: '状态代码',
+    required: true,
+    rules: [{ message: '请输入状态代码' }],
+    component: 'Input',
+    colProps: { span: 24 },
+  },
+  {
+    field: 'backgroundColor',
+    label: '显示颜色',
+    required: true,
+    rules: [{ message: '请选择颜色' }],
+    defaultValue: '#000000',
+    component: 'Input',
+    slot: 'color',
+    colProps: { span: 24 },
+  },
+  {
+    field: 'sortNo',
+    label: '排序',
+    component: 'Input',
+    colProps: { span: 24 },
+  },
+  {
+    field: 'statusSKUNote',
+    label: '状态说明',
+    required: true,
+    rules: [{ message: '请输入状态说明' }],
+    component: 'Input',
+    colProps: { span: 24 },
+  },
+
+
+]
+
+
diff --git a/src/views/system/serviceFlow/detail.vue b/src/views/system/serviceFlow/detail.vue
new file mode 100644
index 00000000..97d00937
--- /dev/null
+++ b/src/views/system/serviceFlow/detail.vue
@@ -0,0 +1,573 @@
+<template>
+    <a-modal class="addModel" title="服务流程编辑" :width="1200" :visible="visible" @cancel="handleCancel">
+        <a-spin :spinning="confirmLoading">
+            <a-form ref="form" :rules="formRule" class="main" :model="form">
+                <a-row>
+                    <a-col :span="8">
+                        <a-form-item name="serviceWorkflowName" label="服务流程名称" :wrapperCol="wrapperCol"
+                            :labelCol="labelCol">
+                            <a-input placeholder="服务流程名称" v-model:value="form.serviceWorkflowName" />
+                        </a-form-item>
+                    </a-col>
+                    <a-col :span="8">
+                        <a-form-item name="serviceWorkflowCode" label="服务流程代码" :labelCol="labelCol"
+                            :wrapperCol="wrapperCol">
+                            <a-input placeholder="服务流程代码" v-model:value="form.serviceWorkflowCode" />
+                        </a-form-item>
+                    </a-col>
+                    <a-col :span="8">
+                        <a-form-item label="所属租户" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                            {{ form.belongTenantName }}
+                        </a-form-item>
+                    </a-col>
+                </a-row>
+                <a-row v-if="form.pkId">
+                    <a-col :span="8">
+                        <a-form-item label="发布版本号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                            {{ form.releaseVersion }}
+                        </a-form-item>
+                    </a-col>
+                    <a-col :span="8">
+                        <a-form-item label="最后发布日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                        </a-form-item>
+                    </a-col>
+                    <a-col :span="8">
+                        <a-form-item label="发布人" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                        </a-form-item>
+                    </a-col>
+                </a-row>
+                <a-row v-if="form.pkId">
+                    <a-col :span="8">
+                        <a-form-item label="创建人" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                            {{ form.createdUserName }}
+                        </a-form-item>
+                    </a-col>
+                    <a-col :span="8">
+                        <a-form-item label="创建日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                            {{ form.createdTime }}
+                        </a-form-item></a-col>
+                </a-row>
+                <a-row v-if="form.pkId">
+                    <a-col :span="8">
+                        <a-form-item label="流水号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                        </a-form-item></a-col>
+                    <a-col :span="8"> <a-form-item label="更新人" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                            {{ form.updatedUserName }}
+                        </a-form-item></a-col>
+                    <a-col :span="8"> <a-form-item label="更新日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                            {{ form.updatedTime }}
+                        </a-form-item></a-col>
+                </a-row>
+                <div>
+                    <div class="title">
+                        <span>服务信息</span>
+                        <a v-if="!form.serviceProject.serviceProjectName" @click="addItemFlag = true">添加</a>
+                    </div>
+                    <div v-if="form.serviceProject.serviceProjectName">
+                        <span style="margin-right: 30px;">服务名称:{{ form.serviceProject.serviceProjectName }}</span>
+                        <span style="margin-right: 30px;">服务代码:{{ form.serviceProject.serviceProjectCode }}</span>
+                        <a @click="addItemFlag = true">修改</a>
+                    </div>
+                </div>
+                <div>
+                    <div class="title">
+                        <span>状态</span>
+                        <a @click="handleAddStatus">添加</a>
+                    </div>
+                    <div class="statBox" v-if="form.statusSkuList && form.statusSkuList.length > 0">
+                        <div class="status" v-for="(item, index) in form.statusSkuList" :key="item.sortNo">
+                            <span class="sort">{{ item.sortNo }}</span>
+                            <span class="name">{{ item.showName }}</span>
+                            <span class="action">
+                                <a-icon type="setting" @click="handleEditStatus(item, index)"
+                                    style="margin-right: 10px;cursor: pointer;" />
+                                <a-icon type="delete" @click="handleDelStatus(index)" style="cursor: pointer;" />
+                            </span>
+                        </div>
+                    </div>
+                </div>
+            </a-form>
+        </a-spin>
+        <template slot="footer">
+            <a-button @click="handleCancel">
+                关闭
+            </a-button>
+            <a-button @click="handleUnable" type="danger">
+                取消启用
+            </a-button>
+            <a-button @click="handleSubmit" type="primary">
+                保存并启用
+            </a-button>
+            <a-button @click="handlePub" type="primary">
+                发布
+            </a-button>
+            <a-button @click="handleTime" type="primary">
+                展示时间轴
+            </a-button>
+        </template>
+    </a-modal>
+    <a-modal title="服务项目" :width="800" :visible="addItemFlag" @cancel="addItemFlag = false">
+        <div>
+            <span>服务项目：</span>
+            <a-select show-search placeholder="请选择服务项目" v-model:value="serviceItem"
+                style="width: 300px;margin-right: 20px;" @search="projectSearch" :default-active-first-option="false"
+                :show-arrow="false" :filter-option="false" :not-found-content="null">
+                <a-select-option v-for="item in projectList" :key="item.pkId" :value="item.pkId">
+                    {{ item.serviceProjectName }}
+                </a-select-option>
+            </a-select>
+            <a @click="handleInto">引入</a>
+        </div>
+        <template slot="footer">
+            <a-button @click="addItemFlag = false">
+                关闭
+            </a-button>
+        </template>
+    </a-modal>
+    <a-modal title="流程活动引入" :width="800" :visible="activeFlag" @cancel="activeFlag = false">
+        <div>
+            <a-form ref="activeForm" :rules="activeRules" :labelCol="{ span: 3 }" :wrapperCol="{ span: 21 }"
+                :model="activeForm">
+                <a-form-item name="pkId" style="margin-bottom: 10px;" label="流程活动">
+                    <a-select show-search placeholder="请选择流程活动" v-model:value="activeForm.pkId"
+                        style="width: 300px;margin-right: 20px;" @search="activeSearch"
+                        :default-active-first-option="false" :show-arrow="false" :filter-option="false"
+                        :not-found-content="null">
+                        <a-select-option v-for="item in activeList" :key="item.pkId" :value="item.pkId">
+                            {{ item.showName }}
+                        </a-select-option>
+                    </a-select>
+                    <a @click="addActiveFlag = true">添加</a>
+                </a-form-item>
+                <a-form-item name="sortNo" style="margin-bottom: 10px;" label="顺序号">
+                    <a-input-number :precision="0" v-model:value="activeForm.sortNo" :min="1" :max="100" />
+                </a-form-item>
+                <a-form-item name="valType" label="值类型">
+                    <a-select placeholder="请选择值类型" v-model:value="activeForm.valType"
+                        style="width: 300px;margin-right: 20px;">
+                        <a-select-option value="DATETIME">时间</a-select-option>
+                        <a-select-option value="STRING">字符串</a-select-option>
+                    </a-select>
+                </a-form-item>
+                <a-form-item style="margin-bottom: 10px;" label="包含子状态">
+                    <a-checkbox v-model:checked="activeForm.isContainsSubs"></a-checkbox>
+                    <a v-if="activeForm.isContainsSubs" style="margin-left: 10px;" @click="handlePushSub">添加子状态</a>
+                </a-form-item>
+                <p>说明：包含子状态，可指定多个子状态，启用一个状态触发后，当前状态触发</p>
+                <div class="statBox" v-if="activeForm.subList && activeForm.subList.length > 0">
+                    <div class="status" v-for="(item, index) in activeForm.subList" :key="item.sortNo">
+                        <span class="sort">{{ item.sortNo }}</span>
+                        <span class="name">{{ item.showName }}</span>
+                        <span class="action">
+                            <a-icon type="setting" @click="handleEditSub(item, index)"
+                                style="margin-right: 10px;cursor: pointer;" />
+                            <a-icon type="delete" @click="handleDelSub(index)" style="cursor: pointer;" />
+                        </span>
+                    </div>
+                </div>
+            </a-form>
+        </div>
+        <template slot="footer">
+            <a-button type="primary" @click="handleSaveActive">
+                确定
+            </a-button>
+            <a-button @click="activeFlag = false">
+                关闭
+            </a-button>
+        </template>
+    </a-modal>
+    <a-modal title="服务活动新增" :width="800" :visible="addActiveFlag" @cancel="addActiveFlag = false">
+        <div>
+            <a-form ref="addActiveForm" :rules="addRules" :labelCol="{ span: 3 }" :wrapperCol="{ span: 21 }"
+                :model="addActiveForm">
+                <a-form-item name="statusSKUId" style="margin-bottom: 10px;" label="状态名称">
+                    <a-select show-search placeholder="请选择状态名称" v-model:value="addActiveForm.statusSKUId"
+                        style="width: 300px;margin-right: 20px;" @search="statusSearch" @change="handleChangeStatus"
+                        :default-active-first-option="false" :show-arrow="false" :filter-option="false"
+                        :not-found-content="null">
+                        <a-select-option v-for="item in statusList" :key="item.pkId" :value="item.pkId">
+                            {{ item.statusSKUName }}
+                        </a-select-option>
+                    </a-select>
+                </a-form-item>
+                <a-form-item style="margin-bottom: 10px;" label="状态代码">
+                    {{ statusSKUCode }}
+                </a-form-item>
+                <a-form-item name="showName" style="margin-bottom: 10px;" label="活动名称">
+                    <a-input v-model:value="addActiveForm.showName" />
+                </a-form-item>
+            </a-form>
+        </div>
+        <template slot="footer">
+            <a-button type="primary" @click="handleSaveAddActive">
+                确定
+            </a-button>
+            <a-button @click="addActiveFlag = false">
+                关闭
+            </a-button>
+        </template>
+    </a-modal>
+    <a-modal title="流程展示" :width="1400" :visible="timeFlag" @cancel="timeFlag = false">
+      <a-spin :spinning="timeLoading">
+        <div v-if="timeForm.activitiesList && timeForm.activitiesList.length > 0" class="time">
+          <div class="time-title">{{ timeForm.serviceProjectName }}</div>
+          <div class="item" v-for="(item, index) in timeForm.activitiesList" :key="item.actId">
+            <div class="top">
+              <div class="line" :class="{ active: item.isYield == 1 }"></div>
+              <div class="point" :class="{ active: item.isYield == 1 }"></div>
+              <div class="line" v-if="index != timeForm.activitiesList.length - 1" :class="{ active: item.isYield == 1 }">
+              </div>
+            </div>
+            <div class="bottom">
+              <div :title="item.showName + item.actDate">{{ item.showName }}</div>
+              <div v-if="item.isYield == 1">{{ item.actDate ? item.actDate.substring(0, 11) : '' }}</div>
+              <div class="subList">
+                <div class="sub" v-for="ite in item.subList" :key="ite.actId">
+                  <div :class="{ active: ite.isYield == 1 }" class="subPoint"></div>
+                  <div :title="ite.showName + ite.actDate" class="text">
+                    <span style="margin-right: 4px;">{{ ite.showName }}</span>
+                    <span>{{ ite.actDate ? ite.actDate.substring(0, 11) : '' }}</span>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div v-else>暂无数据</div>
+      </a-spin>
+    </a-modal>
+
+</template>
+<script lang="ts" setup>
+import { ref, onMounted } from 'vue'
+import {
+    projectQueryList, QueryActivitiesList, QueryListStatus, workFlowSetUnPublishRelease,
+    workFlowSetUnEnable, workFlowSaveAndEnable,GetShowTimeLine
+} from './api'
+import { useMessage } from '/@/hooks/web/useMessage'
+const { createMessage } = useMessage()
+const visible = ref(false)
+const confirmLoading = ref(false)
+const addActiveForm = ref({}) as any
+const form = ref({
+    serviceProject: {}
+}) as any
+const labelCol = {
+    xs: { span: 24 },
+    sm: { span: 7 }
+}
+const wrapperCol = {
+    xs: { span: 24 },
+    sm: { span: 17 }
+}
+const statusList = ref([]) as any
+const addItemFlag = ref(false)
+const formRule = {
+    belongTenantId: [{ required: true, message: '请选择租户', trigger: 'change' }],
+    serviceWorkflowCode: [{ required: true, message: '请输入服务代码', trigger: 'blur' }],
+    serviceWorkflowName: [{ required: true, message: '请输入服务名称', trigger: 'blur' }]
+}
+const addRules = {
+    statusSKUId: [{ required: true, message: '请选择状态名称', trigger: 'change' }],
+    showName: [{ required: true, message: '请输入活动名称', trigger: 'blur' }]
+}
+const activeRules = {
+    valType: [{ required: true, message: '请选择值类型', trigger: 'change' }],
+    sortNo: [{ required: true, message: '请输入顺序号', trigger: 'blur' }],
+    pkId: [{ required: true, message: '请选择流程活动', trigger: 'change' }]
+}
+const serviceItem = ref('')
+const activeFlag = ref(false)
+const type = ref('')
+const activeForm = ref({}) as any
+const addActiveFlag = ref(false)
+const activeList = ref([]) as any
+function activeSearch(data) {
+    QueryActivitiesList({ queryItem: data }).then(res => {
+        activeList.value = res.data.ext
+    })
+}
+const SysTenantData = ref([]) as any
+function handleSubmit() {
+    confirmLoading.value = true
+    form.value.statusSkuList.forEach(item => {
+        if (item.isContainsSubs) {
+            item.isContainsSub = 1
+        } else {
+            item.isContainsSub = 0
+        }
+    })
+    SysTenantData.value.forEach(item => {
+        if (item.id === form.value.belongTenantId) {
+            form.value.belongTenantName = item.name
+        }
+    })
+    workFlowSaveAndEnable(form.value).then((res) => {
+        confirmLoading.value = false
+        if (res.data.succ) {
+            if (form.value.pkId) {
+                createMessage.success('修改成功')
+            } else {
+                createMessage.success('新增成功')
+            }
+            handleCancel()
+        } else {
+            createMessage.error(res.data.msg)
+        }
+    }).finally((res) => {
+        confirmLoading.value = false
+    })
+}
+function handlePub() {
+    workFlowSetUnPublishRelease([form.value.pkId]).then(res => {
+        if (res.data.ext[0].succ) {
+            createMessage.success('发布成功')
+            visible.value = false
+        } else {
+            createMessage.error(res.data.ext[0].msg)
+        }
+    })
+}
+function handleUnable() {
+    workFlowSetUnEnable([form.value.pkId]).then(res => {
+        if (res.data.ext[0].succ) {
+            createMessage.success('取消启用成功')
+            visible.value = false
+        } else {
+            createMessage.error(res.data.ext[0].msg)
+        }
+    })
+}
+const statusSKUCode = ref('')
+function handleChangeStatus(val) {
+    statusList.value.forEach(item => {
+        if (item.pkId === val) {
+            statusSKUCode.value = item.statusSKUCode
+        }
+    })
+}
+function handleAddStatus() {
+    activeFlag.value = true
+    type.value = 'add'
+    activeForm.value = {
+        sortNo: 1,
+        subList: [],
+        isContainsSubs: false,
+        statusTriggerList: []
+    }
+}
+function handleInto() {
+    if (!serviceItem.value) {
+        createMessage.warning('请先选择')
+        return false
+    } else {
+        projectList.value.forEach(item => {
+            if (item.pkId === serviceItem.value) {
+                form.value.serviceProject.serviceProjectCode = item.serviceProjectCode
+                form.value.serviceProject.serviceProjectName = item.serviceProjectName
+                form.value.serviceProject.pkId = item.pkId
+                addItemFlag.value = false
+            }
+        })
+    }
+}
+const projectList = ref([]) as any
+onMounted(() => {
+    projectSearch('')
+})
+function projectSearch(data) {
+    projectQueryList({ queryItem: data }).then(res => {
+        projectList.value = res.data.ext
+    })
+}
+
+function statusSearch(data) {
+    QueryListStatus({ queryItem: data }).then(res => {
+        statusList.value = res.data.ext
+    })
+}
+
+function handleDelSub(index) {
+    activeForm.value.subList.splice(index, 1)
+}
+
+
+function handleDelStatus(index) {
+    form.value.statusSkuList.splice(index, 1)
+}
+const subActiveFlag = ref(false)
+const subType = ref('')
+function handlePushSub() {
+    subActiveFlag.value = true
+    subType.value = 'add'
+}
+function handleEditStatus(item, index) {
+    const arr = []
+    activeList.value.forEach(ite => {
+        if (item == item.pkId) {
+            arr.push(1)
+        }
+    })
+    if (arr.length == 0) {
+        activeList.value.push({
+            pkId: item.pkId,
+            showName: item.showName
+        })
+    }
+    activeForm.value = JSON.parse(JSON.stringify(item))
+    type.value = 'edit'
+    activeFlag.value = true
+    index.value = index
+}
+const subActiveForm = ref({})
+const subIndex = ref(0)
+function handleEditSub(item, index) {
+    subActiveForm.value = JSON.parse(JSON.stringify(item))
+    subType.value = 'edit'
+    subActiveFlag.value = true
+    subIndex.value = index
+}
+function init() {
+    visible.value = true
+}
+const timeFlag = ref(false)
+const timeLoading = ref(false)
+const timeForm = ref({}) as any
+function handleTime() {
+      timeFlag.value = true
+      timeLoading.value = true
+      GetShowTimeLine({ pkId: form.value.pkId }).then(res => {
+        if (res.data.succ) {
+          timeForm.value = res.data.ext
+        } else {
+            createMessage.error(res.data.msg)
+        }
+        timeLoading.value = false
+      })
+    }
+defineExpose({ init })
+function handleCancel() {
+    visible.value = false
+}
+</script>
+<style scoped lang="less">
+.title {
+    border-bottom: 1px solid rgb(139, 137, 137);
+    padding-bottom: 5px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-top: 15px;
+    font-size: 15px;
+    font-weight: bold;
+}
+
+.statBox {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    margin-top: 20px;
+
+    .status {
+        border: 1px solid black;
+        margin-right: 15px;
+        margin-bottom: 10px;
+
+        .sort {
+            padding: 0 15px;
+            text-align: center;
+        }
+
+        .action {
+            padding: 0 5px;
+        }
+
+        .name {
+            display: inline-block;
+            padding: 5px 15px;
+            text-align: center;
+            background: rgb(184, 53, 137);
+            margin-right: 5px;
+            color: white;
+        }
+    }
+}
+
+.time {
+    display: flex;
+    align-items: flex-start;
+    padding-top: 10px;
+
+    .time-title {
+        padding: 10px;
+        background: rgb(215, 215, 215);
+        border-radius: 5px;
+        margin-top: -12px;
+    }
+
+    .active {
+        background: rgb(2, 167, 240) !important;
+    }
+
+    .item {
+        min-width: 120px;
+        margin-right: -3px;
+
+        .top {
+            display: flex;
+            align-items: center;
+
+            .line {
+                width: 45%;
+                height: 2px;
+                background: rgb(215, 215, 215);
+            }
+
+            .point {
+                width: 11px;
+                height: 11px;
+                border-radius: 50%;
+                background: rgb(215, 215, 215);
+                margin: 0 3px;
+            }
+        }
+
+        .bottom {
+            text-align: center;
+            margin-top: 10px;
+        }
+
+        .subList {
+            margin-top: 10px;
+            padding-left: 10px;
+        }
+
+        .sub {
+            margin-top: 4px;
+            display: flex;
+            align-items: center;
+
+            .subPoint {
+                width: 10px;
+                height: 10px;
+                border-radius: 50%;
+                background: rgb(215, 215, 215);
+                margin-right: 3px;
+            }
+
+            .text {}
+        }
+    }
+
+}
+
+.conditRow {
+    display: flex;
+    align-items: center;
+    margin-top: 20px;
+}
+
+.blur {
+    margin: 0 20px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/system/serviceFlow/index.vue b/src/views/system/serviceFlow/index.vue
new file mode 100644
index 00000000..9b65bfe9
--- /dev/null
+++ b/src/views/system/serviceFlow/index.vue
@@ -0,0 +1,243 @@
+<template>
+    <div>
+        <BasicTable class="ds-table" @register="registerTable" @row-dbClick="(e) => { GoDetailed(true, e) }
+            ">
+            <template #tableTitle>
+                <div class="buttonGroup ">
+                    <div class="ds-h-aciton-btns-fee">
+                        <a-tooltip placement="top" :mouseEnterDelay="0.5">
+                            <template #title>
+                                <span>新建</span>
+                            </template>
+                            <span class="ds-action-svg-btn" @click="GoDetailed(false)">
+                                <img src="../../../assets/svg/infoclient/xinjian.svg" class="SvgImg" />
+                            </span>
+                        </a-tooltip>
+                        <a-tooltip placement="top" :mouseEnterDelay="0.5">
+                            <template #title>
+                                <span>删除</span>
+                            </template>
+                            <span class="ds-action-svg-btn">
+                                <a-popconfirm title="确定删除当前选中数据？" @confirm="FnDel" ok-text="是" cancel-text="否">
+                                    <img src="../../../assets/svg/infoclient/shanchu.svg" class="SvgImg" />
+                                </a-popconfirm>
+                            </span>
+                        </a-tooltip>
+                        <a-tooltip placement="top" :mouseEnterDelay="0.5">
+                            <template #title>
+                                <span>启用</span>
+                            </template>
+                            <span class="ds-action-svg-btn" @click="handleApply">
+                                <img src="../../../assets/svg/infoclient/tijiao.svg" class="SvgImg" />
+                            </span>
+                        </a-tooltip>
+                        <a-tooltip placement="top" :mouseEnterDelay="0.5">
+                            <template #title>
+                                <span>取消启用</span>
+                            </template>
+                            <span class="ds-action-svg-btn" @click="handleWithdraw">
+                                <img src="../../../assets/svg/infoclient/chexiaotijiao.svg" class="SvgImg" />
+                            </span>
+                        </a-tooltip>
+                    </div>
+                </div>
+            </template>
+            <template v-slot:bodyCell="{ column, record }">
+                <template v-if="column.key === 'action'">
+                    <TableAction :actions="[
+                        {
+                            icon: 'clarity:note-edit-line',
+                            tooltip: '编辑',
+                            onClick: () => {
+                                GoDetailed(true, record)
+                            },
+                        },
+                    ]" />
+                </template>
+                <template v-if="column.key === 'isEnable'">
+                    <span v-if="record.isEnable == 1">是</span>
+                    <span v-if="record.isEnable == 0">否</span>
+                </template>
+            </template>
+        </BasicTable>
+        <editForm ref="editFormRef" ></editForm>
+    </div>
+</template>
+<script lang="ts" setup>
+import { ref } from 'vue'
+import { GetList, Save, SaveAndEnable, SetUnEnable, SetEnable, Delete } from './api.js'
+import { BasicTable, useTable, TableAction } from '/@/components/Table'
+import { BasicForm, useForm } from '/@/components/Form/index'
+import { columns, searchFormSchema, detailForm } from './columns'
+import { useMessage } from '/@/hooks/web/useMessage'
+import editForm  from './detail.vue'
+const { createMessage } = useMessage()
+import { useGo } from '/@/hooks/web/usePage'
+const go = useGo()
+import { formatParams } from '/@/hooks/web/common'
+const [registerTable, { reload, clearSelectedRowKeys, getSelectRows, getRawDataSource }] = useTable({
+    api: async (p) => {
+        const res: API.DataResult = await GetList(p)
+        return new Promise((resolve) => {
+            resolve({ data: [...res.data], total: res.count })
+        })
+    },
+    beforeFetch: (p) => {
+        return formatParams(p)
+    },
+    columns,
+    formConfig: {
+        labelWidth: 120,
+        schemas: searchFormSchema,
+        useAdvancedSearch: true,
+    },
+    pagination: true,
+    striped: true,
+    useSearchForm: true,
+    resizeHeightOffset: 15,
+    showTableSetting: true,
+    bordered: true,
+    showIndexColumn: true,
+    indexColumnProps: {
+        width: 60,
+    },
+    canResize: true,
+    immediate: true,
+    actionColumn: {
+        width: 80,
+        title: '操作',
+        dataIndex: 'action',
+        fixed: 'right',
+    },
+})
+const editFormRef = ref()
+const [registerForm, { resetFields, setFieldsValue, validate, getFieldsValue, }] = useForm({
+    labelWidth: 100,
+    schemas: detailForm,
+    showActionButtonGroup: false,
+})
+function GoDetailed(type, row) {
+    if (!type) {
+        editFormRef.value.init()
+    } else {
+        // open.value = true
+        // const newRow = JSON.parse(JSON.stringify(row))
+        // setTimeout(() => {
+        //     setFieldsValue(newRow)
+        // }, 10)
+    }
+}
+
+const loading = ref(false)
+
+function FnDel() {
+    let ids = []
+    ids = getSelectRows().map((item) => {
+        return item.pkId
+    })
+    if (ids.length == 0) {
+        createMessage.error('请选择数据')
+        return false
+    }
+    Delete(ids).then(res => {
+        if (res.succeeded) {
+            createMessage.success('操作成功')
+            clearSelectedRowKeys()
+            reload()
+        }
+    })
+}
+function handleWithdraw() {
+    let ids = []
+    ids = getSelectRows().map((item) => {
+        return item.pkId
+    })
+    if (ids.length == 0) {
+        createMessage.error('请选择数据')
+        return false
+    }
+    SetUnEnable(ids).then(res => {
+        if (res.succeeded) {
+            createMessage.success('操作成功')
+            clearSelectedRowKeys()
+            reload()
+        }
+    })
+}
+function handleApply() {
+    let ids = []
+    ids = getSelectRows().map((item) => {
+        return item.pkId
+    })
+    if (ids.length == 0) {
+        createMessage.error('请选择数据')
+        return false
+    }
+    SetEnable(ids).then(res => {
+        if (res.succeeded) {
+            createMessage.success('操作成功')
+            clearSelectedRowKeys()
+            reload()
+        }
+    })
+}
+</script>
+<style lang="less" scoped>
+.topTable {
+    height: calc(100vh - 145px);
+}
+
+
+
+.tableTitleBox {
+    .ant-btn-link {
+        border-radius: 2px;
+        background: rgba(245, 249, 252, 1);
+        margin-left: 13px;
+        color: #000;
+        font-size: 16px;
+    }
+}
+
+.SvgImg {
+    width: 18px;
+    height: 18px;
+    margin: 6.8px;
+}
+
+.buttonGroup {
+    display: flex;
+    align-items: center;
+}
+
+
+
+.ds-h-aciton-btns-fee {
+    display: flex;
+    align-items: center;
+    height: 38px;
+    padding-right: 10px;
+    border-right: 1px solid rgb(194, 188, 188);
+
+    .ds-action-svg-btn {
+        display: inline-block;
+        width: 32px;
+        height: 32px;
+        border-radius: 2px;
+        margin-right: 8px;
+        cursor: pointer;
+
+        .next {
+            transform: rotate(180deg);
+        }
+    }
+
+    .ds-action-svg-btn:hover {
+        box-shadow: 0px 2px 4px #cad1db;
+    }
+
+    .vben-svg-icon {
+        margin: 6.8px;
+    }
+}
+</style>
\ No newline at end of file

From 8d9793527ee063dd1f7d748faed313c396cc659d Mon Sep 17 00:00:00 2001
From: sunzehua <sunzehua@jchshipping.net>
Date: Wed, 20 Nov 2024 18:16:01 +0800
Subject: [PATCH 4/6] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.development                         |   2 +-
 src/views/system/serviceFlow/columns.tsx | 129 +++++++++++------------
 src/views/system/serviceFlow/detail.vue  |  15 +--
 3 files changed, 74 insertions(+), 72 deletions(-)

diff --git a/.env.development b/.env.development
index 57d32870..cbb55fe5 100644
--- a/.env.development
+++ b/.env.development
@@ -14,7 +14,7 @@ VITE_PUBLIC_PATH = /
 # Please note that no line breaks
 # VITE_PROXY = [["/basic-api","http://60.209.125.238"],["/upload","http://localhost:3300/upload"]]
 # VITE_PROXY=[["/api","http://60.209.125.238:3008"],["/stage-api","https://www.666cxf.com/stage-api"]]  # 开发 测试环境
-VITE_PROXY=[["/api","http://60.209.125.238:3008"],["/stage-api","https://www.666cxf.com/stage-api"]]  # 开发 测试环境
+VITE_PROXY=[["/api","http://118.190.144.189:3008"],["/stage-api","https://www.666cxf.com/stage-api"]]  # 开发 测试环境
 
 # Delete console
 VITE_DROP_CONSOLE = false
diff --git a/src/views/system/serviceFlow/columns.tsx b/src/views/system/serviceFlow/columns.tsx
index 23b0c8cd..3731299b 100644
--- a/src/views/system/serviceFlow/columns.tsx
+++ b/src/views/system/serviceFlow/columns.tsx
@@ -1,8 +1,8 @@
 import { BasicColumn, FormSchema } from '/@/components/Table'
 export const searchFormSchema: FormSchema[] = [
   {
-    field: 'statusSKUName',
-    label: '状态名称',
+    field: 'serviceWorkflowName',
+    label: '服务流程名称',
     component: 'Input',
     colProps: { span: 4 },
   },
@@ -33,8 +33,8 @@ export const searchFormSchema: FormSchema[] = [
     colProps: { span: 4 },
   },
   {
-    field: 'statusSKUNote',
-    label: '状态说明',
+    field: 'serviceWorkflowNote',
+    label: '说明',
     component: 'Input',
     colProps: { span: 4 },
   },
@@ -59,67 +59,66 @@ export const searchFormSchema: FormSchema[] = [
 ]
 
 //列表
-export const columns: BasicColumn[] = [
-  {
-    title: '状态名称',
-    dataIndex: 'statusSKUName',
-    width: 120,
-    align: 'left',
-  },
-  {
-    title: '状态代码',
-    dataIndex: 'statusSKUCode',
-    width: 120,
-    align: 'left',
-  },
-  {
-    title: '顺序号',
-    dataIndex: 'sortNo',
-    width: 120,
-    align: 'left',
-  },
-  {
-    title: '说明',
-    dataIndex: 'statusSKUNote',
-    width: 120,
-    align: 'left',
-  },
-  {
-    title: '显示颜色',
-    dataIndex: 'backgroundColor',
-    width: 120,
-    align: 'left',
-  },
-  {
-    title: '是否启用',
-    dataIndex: 'isEnable',
-    width: 120,
-    align: 'left',
-  },
-  {
-    title: '创建日期',
-    dataIndex: 'createdTime',
-    width: 120,
-    align: 'left',
-  },
-  {
-    title: '创建人',
-    dataIndex: 'createdUserName',
-    width: 120,
-    align: 'left',
-  },
-  {
-    title: '更新日期',
-    dataIndex: 'updatedTime',
-    width: 120,
-    align: 'left',
-  },
-  {
-    title: '更新人',
-    dataIndex: 'updatedUserName',
-    width: 120,
-    align: 'left',
-  },
+export const columns: BasicColumn[] = [{
+  title: '服务流程名称',
+  dataIndex: 'serviceWorkflowName',
+  width: '160px'
+},
+{
+  title: '服务流程代码',
+  dataIndex: 'serviceWorkflowCode',
+  width: '200px'
+},
+{
+  title: '状态数量',
+  dataIndex: 'statusNum',
+  width: 100
+},
+{
+  title: '版本号',
+  dataIndex: 'releaseVersion',
+  width: 100
+},
+{
+  title: '说明',
+  dataIndex: 'serviceWorkflowNote',
+  width: 100
+},
+{
+  title: '是否启用',
+  dataIndex: 'isEnable',
+  width: 100,
+},
+{
+  title: '所属租户',
+  dataIndex: 'belongTenantName',
+  width: 200
+},
+{
+  title: '发布日期',
+  dataIndex: 'publishDate',
+  width: 160
+},
+{
+  title: '创建日期',
+  dataIndex: 'createdTime',
+  width: 160
+},
+{
+  title: '创建人',
+  dataIndex: 'createdUserName',
+  width: 150
+},
+{
+  title: '更新日期',
+  dataIndex: 'updatedTime',
+  width: 160
+},
+{
+  title: '更新人',
+  dataIndex: 'updatedUserName',
+  width: 150
+},
 ]
 
 export const detailForm: FormSchema[] = [
diff --git a/src/views/system/serviceFlow/detail.vue b/src/views/system/serviceFlow/detail.vue
index 97d00937..d46c40bd 100644
--- a/src/views/system/serviceFlow/detail.vue
+++ b/src/views/system/serviceFlow/detail.vue
@@ -1,7 +1,7 @@
 <template>
     <a-modal class="addModel" title="服务流程编辑" :width="1200" :visible="visible" @cancel="handleCancel">
         <a-spin :spinning="confirmLoading">
-            <a-form ref="form" :rules="formRule" class="main" :model="form">
+            <a-form ref="formRef" :rules="formRule" class="main" :model="form">
                 <a-row>
                     <a-col :span="8">
                         <a-form-item name="serviceWorkflowName" label="服务流程名称" :wrapperCol="wrapperCol"
@@ -88,7 +88,7 @@
                 </div>
             </a-form>
         </a-spin>
-        <template slot="footer">
+        <template  #footer>
             <a-button @click="handleCancel">
                 关闭
             </a-button>
@@ -118,7 +118,7 @@
             </a-select>
             <a @click="handleInto">引入</a>
         </div>
-        <template slot="footer">
+        <template  #footer>
             <a-button @click="addItemFlag = false">
                 关闭
             </a-button>
@@ -167,7 +167,7 @@
                 </div>
             </a-form>
         </div>
-        <template slot="footer">
+        <template  #footer>
             <a-button type="primary" @click="handleSaveActive">
                 确定
             </a-button>
@@ -198,7 +198,7 @@
                 </a-form-item>
             </a-form>
         </div>
-        <template slot="footer">
+        <template  #footer>
             <a-button type="primary" @click="handleSaveAddActive">
                 确定
             </a-button>
@@ -249,8 +249,10 @@ const { createMessage } = useMessage()
 const visible = ref(false)
 const confirmLoading = ref(false)
 const addActiveForm = ref({}) as any
+const formRef = ref()
 const form = ref({
-    serviceProject: {}
+    serviceProject: {},
+    statusSkuList:[]
 }) as any
 const labelCol = {
     xs: { span: 24 },
@@ -290,6 +292,7 @@ function activeSearch(data) {
 const SysTenantData = ref([]) as any
 function handleSubmit() {
     confirmLoading.value = true
+    console.log(form.value)
     form.value.statusSkuList.forEach(item => {
         if (item.isContainsSubs) {
             item.isContainsSub = 1

From 5a6b43c66106112654b979103ed6c21de9e5d64c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E5=90=8C=E6=B5=B7?=
 <14166000+zhangtonghai@user.noreply.gitee.com>
Date: Thu, 21 Nov 2024 11:37:48 +0800
Subject: [PATCH 5/6] =?UTF-8?q?=E7=AE=B1=E7=AE=A1=20=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../CurrentState/columns.tsx                  |  1 -
 .../CurrentState/index.vue                    |  2 +-
 .../OfflineAudit/columns.tsx                  | 52 +++++++++----------
 .../OfflineAudit/index.vue                    |  2 +-
 4 files changed, 28 insertions(+), 29 deletions(-)

diff --git a/src/views/ContainerManagement/CurrentState/columns.tsx b/src/views/ContainerManagement/CurrentState/columns.tsx
index 1b477b82..8a01daf2 100644
--- a/src/views/ContainerManagement/CurrentState/columns.tsx
+++ b/src/views/ContainerManagement/CurrentState/columns.tsx
@@ -263,7 +263,6 @@ export const searchFormSchema: FormSchema[] = [
     label: '是否上线',
     component: 'ApiSelect',
     colProps: { span: 4 },
-    defaultValue: '1',
     componentProps: () => {
       return {
         api: () => {
diff --git a/src/views/ContainerManagement/CurrentState/index.vue b/src/views/ContainerManagement/CurrentState/index.vue
index d8226ef8..9d66d4aa 100644
--- a/src/views/ContainerManagement/CurrentState/index.vue
+++ b/src/views/ContainerManagement/CurrentState/index.vue
@@ -2,7 +2,7 @@
   <div>
     <BasicTable class="ds-table" @register="registerTable">
       <template #tableTitle>
-        <a-button type="link" class="pl0" @click="derivedExcel">
+        <a-button type="link" @click="derivedExcel">
           <span class="iconfont icon-Excel"></span>
           导出待上线
         </a-button>
diff --git a/src/views/ContainerManagement/OfflineAudit/columns.tsx b/src/views/ContainerManagement/OfflineAudit/columns.tsx
index 4c9d9531..fc1e7786 100644
--- a/src/views/ContainerManagement/OfflineAudit/columns.tsx
+++ b/src/views/ContainerManagement/OfflineAudit/columns.tsx
@@ -2,11 +2,16 @@ import { BasicColumn, FormSchema } from '/@/components/Table'
 import { Tag } from 'ant-design-vue'
 export const columns: BasicColumn[] = [
   {
-    title: '系统业务号',
-    dataIndex: 'billno',
+    title: '全部箱号',
+    dataIndex: 'cntrnoAll',
     sorter: true,
-    width: 150,
-    align: 'center',
+    width: 200,
+  },
+  {
+    title: '箱型',
+    dataIndex: 'ctntotal',
+    sorter: true,
+    width: 200,
   },
   {
     title: '执行状态',
@@ -27,24 +32,6 @@ export const columns: BasicColumn[] = [
       }
     },
   },
-  {
-    title: '业务日期',
-    dataIndex: 'bsdate',
-    sorter: true,
-    width: 200,
-  },
-  {
-    title: '租买箱客户',
-    dataIndex: 'rentCustomerName',
-    sorter: true,
-    width: 200,
-  },
-  // {
-  //   title: '原箱主',
-  //   dataIndex: 'OldContainerOwner',
-  //   sorter: true,
-  //   width: 200,
-  // },
   {
     title: '箱业务',
     dataIndex: 'ctnBizStateId',
@@ -63,17 +50,30 @@ export const columns: BasicColumn[] = [
     },
   },
   {
-    title: '全部箱号',
-    dataIndex: 'cntrnoAll',
+    title: '系统业务号',
+    dataIndex: 'billno',
+    sorter: true,
+    width: 150,
+    align: 'center',
+  },
+  {
+    title: '业务日期',
+    dataIndex: 'bsdate',
     sorter: true,
     width: 200,
   },
   {
-    title: '箱型',
-    dataIndex: 'ctntotal',
+    title: '租买箱客户',
+    dataIndex: 'rentCustomerName',
     sorter: true,
     width: 200,
   },
+  // {
+  //   title: '原箱主',
+  //   dataIndex: 'OldContainerOwner',
+  //   sorter: true,
+  //   width: 200,
+  // },
 ]
 
 export const searchFormSchema: FormSchema[] = [
diff --git a/src/views/ContainerManagement/OfflineAudit/index.vue b/src/views/ContainerManagement/OfflineAudit/index.vue
index 83fc13d5..29d31790 100644
--- a/src/views/ContainerManagement/OfflineAudit/index.vue
+++ b/src/views/ContainerManagement/OfflineAudit/index.vue
@@ -106,7 +106,7 @@
       pagination: true,
       striped: true,
       useSearchForm: true,
-      showTableSetting: false,
+      showTableSetting: true,
       bordered: true,
       showIndexColumn: true,
       indexColumnProps: {

From 27ec1fec46e79bfec7aa7dd272f216e3343a6bda Mon Sep 17 00:00:00 2001
From: sunzehua <sunzehua@jchshipping.net>
Date: Thu, 21 Nov 2024 11:38:21 +0800
Subject: [PATCH 6/6] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/system/serviceFlow/api.js     |  14 ++-
 src/views/system/serviceFlow/detail.vue | 111 +++++++++++++-----------
 2 files changed, 73 insertions(+), 52 deletions(-)

diff --git a/src/views/system/serviceFlow/api.js b/src/views/system/serviceFlow/api.js
index 7cdeff05..38f43291 100644
--- a/src/views/system/serviceFlow/api.js
+++ b/src/views/system/serviceFlow/api.js
@@ -51,7 +51,7 @@ export function Delete(parameter) {
 
 export function projectQueryList(parameter) {
   return request({
-    url: '/opApi/ServiceWorkFlowBase/GetEnableProjectList',
+    url: '/opApi/ServiceProject/QueryList',
     method: 'get',
     params: parameter,
   })
@@ -67,7 +67,7 @@ export function QueryActivitiesList(parameter) {
 
 export function QueryListStatus(parameter) {
   return request({
-    url: '/opApi/StatusSkuBase/QueryList',
+    url: '/opApi/StatusSkuBaseManage/QueryList',
     method: 'get',
     params: parameter,
   })
@@ -75,7 +75,7 @@ export function QueryListStatus(parameter) {
 
 export function workFlowSetUnEnable(parameter) {
   return request({
-    url: '/opApi/StatusSkuBase/SetUnEnable',
+    url: '/opApi/StatusSkuBaseManage/SetUnEnable',
     method: 'post',
     data: parameter,
   })
@@ -103,4 +103,12 @@ export function GetShowTimeLine(parameter) {
     method: 'get',
     params: parameter,
   })
+}
+
+export function SaveWFActivities(parameter) {
+  return request({
+    url: '/opApi/ServiceWorkFlowBase/SaveWFActivities',
+    method: 'post',
+    data: parameter,
+  })
 }
\ No newline at end of file
diff --git a/src/views/system/serviceFlow/detail.vue b/src/views/system/serviceFlow/detail.vue
index d46c40bd..dcc2c8ac 100644
--- a/src/views/system/serviceFlow/detail.vue
+++ b/src/views/system/serviceFlow/detail.vue
@@ -88,7 +88,7 @@
                 </div>
             </a-form>
         </a-spin>
-        <template  #footer>
+        <template #footer>
             <a-button @click="handleCancel">
                 关闭
             </a-button>
@@ -110,15 +110,14 @@
         <div>
             <span>服务项目：</span>
             <a-select show-search placeholder="请选择服务项目" v-model:value="serviceItem"
-                style="width: 300px;margin-right: 20px;" @search="projectSearch" :default-active-first-option="false"
-                :show-arrow="false" :filter-option="false" :not-found-content="null">
+                style="width: 300px;margin-right: 20px;" @search="projectSearch">
                 <a-select-option v-for="item in projectList" :key="item.pkId" :value="item.pkId">
                     {{ item.serviceProjectName }}
                 </a-select-option>
             </a-select>
             <a @click="handleInto">引入</a>
         </div>
-        <template  #footer>
+        <template #footer>
             <a-button @click="addItemFlag = false">
                 关闭
             </a-button>
@@ -130,9 +129,7 @@
                 :model="activeForm">
                 <a-form-item name="pkId" style="margin-bottom: 10px;" label="流程活动">
                     <a-select show-search placeholder="请选择流程活动" v-model:value="activeForm.pkId"
-                        style="width: 300px;margin-right: 20px;" @search="activeSearch"
-                        :default-active-first-option="false" :show-arrow="false" :filter-option="false"
-                        :not-found-content="null">
+                        style="width: 300px;margin-right: 20px;" @search="activeSearch">
                         <a-select-option v-for="item in activeList" :key="item.pkId" :value="item.pkId">
                             {{ item.showName }}
                         </a-select-option>
@@ -167,7 +164,7 @@
                 </div>
             </a-form>
         </div>
-        <template  #footer>
+        <template #footer>
             <a-button type="primary" @click="handleSaveActive">
                 确定
             </a-button>
@@ -178,13 +175,11 @@
     </a-modal>
     <a-modal title="服务活动新增" :width="800" :visible="addActiveFlag" @cancel="addActiveFlag = false">
         <div>
-            <a-form ref="addActiveForm" :rules="addRules" :labelCol="{ span: 3 }" :wrapperCol="{ span: 21 }"
+            <a-form ref="addActiveFormRef" :rules="addRules" :labelCol="{ span: 3 }" :wrapperCol="{ span: 21 }"
                 :model="addActiveForm">
                 <a-form-item name="statusSKUId" style="margin-bottom: 10px;" label="状态名称">
                     <a-select show-search placeholder="请选择状态名称" v-model:value="addActiveForm.statusSKUId"
-                        style="width: 300px;margin-right: 20px;" @search="statusSearch" @change="handleChangeStatus"
-                        :default-active-first-option="false" :show-arrow="false" :filter-option="false"
-                        :not-found-content="null">
+                        style="width: 300px;margin-right: 20px;" @search="statusSearch" @change="handleChangeStatus">
                         <a-select-option v-for="item in statusList" :key="item.pkId" :value="item.pkId">
                             {{ item.statusSKUName }}
                         </a-select-option>
@@ -198,7 +193,7 @@
                 </a-form-item>
             </a-form>
         </div>
-        <template  #footer>
+        <template #footer>
             <a-button type="primary" @click="handleSaveAddActive">
                 确定
             </a-button>
@@ -208,33 +203,34 @@
         </template>
     </a-modal>
     <a-modal title="流程展示" :width="1400" :visible="timeFlag" @cancel="timeFlag = false">
-      <a-spin :spinning="timeLoading">
-        <div v-if="timeForm.activitiesList && timeForm.activitiesList.length > 0" class="time">
-          <div class="time-title">{{ timeForm.serviceProjectName }}</div>
-          <div class="item" v-for="(item, index) in timeForm.activitiesList" :key="item.actId">
-            <div class="top">
-              <div class="line" :class="{ active: item.isYield == 1 }"></div>
-              <div class="point" :class="{ active: item.isYield == 1 }"></div>
-              <div class="line" v-if="index != timeForm.activitiesList.length - 1" :class="{ active: item.isYield == 1 }">
-              </div>
-            </div>
-            <div class="bottom">
-              <div :title="item.showName + item.actDate">{{ item.showName }}</div>
-              <div v-if="item.isYield == 1">{{ item.actDate ? item.actDate.substring(0, 11) : '' }}</div>
-              <div class="subList">
-                <div class="sub" v-for="ite in item.subList" :key="ite.actId">
-                  <div :class="{ active: ite.isYield == 1 }" class="subPoint"></div>
-                  <div :title="ite.showName + ite.actDate" class="text">
-                    <span style="margin-right: 4px;">{{ ite.showName }}</span>
-                    <span>{{ ite.actDate ? ite.actDate.substring(0, 11) : '' }}</span>
-                  </div>
+        <a-spin :spinning="timeLoading">
+            <div v-if="timeForm.activitiesList && timeForm.activitiesList.length > 0" class="time">
+                <div class="time-title">{{ timeForm.serviceProjectName }}</div>
+                <div class="item" v-for="(item, index) in timeForm.activitiesList" :key="item.actId">
+                    <div class="top">
+                        <div class="line" :class="{ active: item.isYield == 1 }"></div>
+                        <div class="point" :class="{ active: item.isYield == 1 }"></div>
+                        <div class="line" v-if="index != timeForm.activitiesList.length - 1"
+                            :class="{ active: item.isYield == 1 }">
+                        </div>
+                    </div>
+                    <div class="bottom">
+                        <div :title="item.showName + item.actDate">{{ item.showName }}</div>
+                        <div v-if="item.isYield == 1">{{ item.actDate ? item.actDate.substring(0, 11) : '' }}</div>
+                        <div class="subList">
+                            <div class="sub" v-for="ite in item.subList" :key="ite.actId">
+                                <div :class="{ active: ite.isYield == 1 }" class="subPoint"></div>
+                                <div :title="ite.showName + ite.actDate" class="text">
+                                    <span style="margin-right: 4px;">{{ ite.showName }}</span>
+                                    <span>{{ ite.actDate ? ite.actDate.substring(0, 11) : '' }}</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
                 </div>
-              </div>
             </div>
-          </div>
-        </div>
-        <div v-else>暂无数据</div>
-      </a-spin>
+            <div v-else>暂无数据</div>
+        </a-spin>
     </a-modal>
 
 </template>
@@ -242,7 +238,7 @@
 import { ref, onMounted } from 'vue'
 import {
     projectQueryList, QueryActivitiesList, QueryListStatus, workFlowSetUnPublishRelease,
-    workFlowSetUnEnable, workFlowSaveAndEnable,GetShowTimeLine
+    workFlowSetUnEnable, workFlowSaveAndEnable, GetShowTimeLine,SaveWFActivities
 } from './api'
 import { useMessage } from '/@/hooks/web/useMessage'
 const { createMessage } = useMessage()
@@ -252,7 +248,7 @@ const addActiveForm = ref({}) as any
 const formRef = ref()
 const form = ref({
     serviceProject: {},
-    statusSkuList:[]
+    statusSkuList: []
 }) as any
 const labelCol = {
     xs: { span: 24 },
@@ -262,6 +258,7 @@ const wrapperCol = {
     xs: { span: 24 },
     sm: { span: 17 }
 }
+const addActiveFormRef = ref('') as any
 const statusList = ref([]) as any
 const addItemFlag = ref(false)
 const formRule = {
@@ -286,7 +283,7 @@ const addActiveFlag = ref(false)
 const activeList = ref([]) as any
 function activeSearch(data) {
     QueryActivitiesList({ queryItem: data }).then(res => {
-        activeList.value = res.data.ext
+        activeList.value = res.data
     })
 }
 const SysTenantData = ref([]) as any
@@ -331,6 +328,20 @@ function handlePub() {
         }
     })
 }
+function handleSaveAddActive() {
+    addActiveFormRef.value.validate().then(() => {
+        SaveWFActivities(addActiveForm.value).then(res => {
+            if (res.data.succ) {
+                createMessage.success('添加成功')
+                addActiveFlag.value = false
+                QueryActivitiesList().then(res => {
+                    activeList.value = res.data.ext
+                })
+                // this.$refs.addActiveForm.resetFields()
+            } 
+        })
+    })
+}
 function handleUnable() {
     workFlowSetUnEnable([form.value.pkId]).then(res => {
         if (res.data.ext[0].succ) {
@@ -377,16 +388,18 @@ function handleInto() {
 const projectList = ref([]) as any
 onMounted(() => {
     projectSearch('')
+    statusSearch('')
+    activeSearch('')
 })
 function projectSearch(data) {
     projectQueryList({ queryItem: data }).then(res => {
-        projectList.value = res.data.ext
+        projectList.value = res.data
     })
 }
 
 function statusSearch(data) {
     QueryListStatus({ queryItem: data }).then(res => {
-        statusList.value = res.data.ext
+        statusList.value = res.data
     })
 }
 
@@ -437,17 +450,17 @@ const timeFlag = ref(false)
 const timeLoading = ref(false)
 const timeForm = ref({}) as any
 function handleTime() {
-      timeFlag.value = true
-      timeLoading.value = true
-      GetShowTimeLine({ pkId: form.value.pkId }).then(res => {
+    timeFlag.value = true
+    timeLoading.value = true
+    GetShowTimeLine({ pkId: form.value.pkId }).then(res => {
         if (res.data.succ) {
-          timeForm.value = res.data.ext
+            timeForm.value = res.data.ext
         } else {
             createMessage.error(res.data.msg)
         }
         timeLoading.value = false
-      })
-    }
+    })
+}
 defineExpose({ init })
 function handleCancel() {
     visible.value = false