diff --git a/src/components/Basic/src/BasicTitle.vue b/src/components/Basic/src/BasicTitle.vue
index c943ea9d..a91877db 100644
--- a/src/components/Basic/src/BasicTitle.vue
+++ b/src/components/Basic/src/BasicTitle.vue
@@ -50,7 +50,8 @@
   .@{prefix-cls} {
     position: relative;
     display: flex;
-    font-size: 16px;
+    font-size: 12px;
+    padding-left: 10px;
     font-family: 'PingFang SC';
     font-weight: 600;
     line-height: 24px;
diff --git a/src/design/ant/form.less b/src/design/ant/form.less
index 7f07e02d..e5c9160d 100644
--- a/src/design/ant/form.less
+++ b/src/design/ant/form.less
@@ -8,4 +8,73 @@
       width: 100%;
     }
   }
+}
+
+// 自定义最小输入框
+.ant-form-small {
+  .ant-input-affix-wrapper-sm,
+  .ant-select-selector,
+  .ant-input-disabled,
+  .ant-input-number {
+    height: 26px !important;
+    .ant-select-selection-item {
+      line-height: 26px !important;
+    }
+  }
+  .ant-select-selection-search-input, .ant-input-affix-wrapper, .ant-input-number-input {
+    height: 26px!important;
+  }
+  .ant-picker-small {
+    height: 26px;
+    width: 100%;
+  }
+  .ant-form-item {
+    margin-bottom: 2px!important;
+  }
+  .ant-input-number-input-wrap {
+    height: 26px;
+    line-height: 24px;
+  }
+  .ant-form-item-label {
+    height: 22px;
+  }
+  .ant-select-selection-item,
+  .ant-select-selection-placeholder,
+  .ant-input-affix-wrapper-placeholder {
+    line-height: 26px !important;
+    font-size: 12px;
+  }
+  .ant-picker, .ant-input {
+    height: 26px!important;
+    width: 100%;
+    font-size: 12px!important;
+  }
+  .ant-btn {
+    height: 26px;
+  }
+}
+
+// 表单详情样式
+.ds-form-detail {
+  .ant-form-item {
+    margin-bottom: 10px;
+  }
+  .ant-form-item-control-input-content {
+    white-space: nowrap;
+    width: 100%;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    font-size: 12px;
+  }
+  .ant-form-item-control-input {
+    min-height: 28px;
+  }
+  .ant-form-item-label {
+    padding: 0 !important;
+    label {
+      font-family: PingFang SC-Semibold, PingFang SC;
+      font-size: 12px;
+      color: #7A8798;
+    }
+  }
 }
\ No newline at end of file
diff --git a/src/design/ant/modal.less b/src/design/ant/modal.less
index 2981f5e6..43cdc0b7 100644
--- a/src/design/ant/modal.less
+++ b/src/design/ant/modal.less
@@ -1,6 +1,6 @@
 // 小弹窗
 .ant-modal-header {
-  border-bottom: none;
+  border-bottom: none!important;
   padding: 16px 16px 0px 16px;
   .ant-modal-title {
     font-size: 12px;
@@ -11,6 +11,7 @@
 }
 .ant-modal-body {
   padding: 15px 30px;
+  margin-top: 5px;
   .ant-form {
     background-color: #F5F9FC;
     border-radius: 2px;
@@ -39,4 +40,35 @@
       top: -1px;
     }
   }
+}
+.ant-modal-confirm-btns {
+  .ant-btn {
+    height: 26px;
+    width: 100px;
+    padding: 0;
+    line-height: 27px;
+    span {
+      position: relative;
+      top: -1px;
+    }
+  }
+}
+.anticon-exclamation-circle {
+  svg {
+    display: none;
+  }
+}
+.ant-modal-confirm-title, .ant-modal-confirm-content {
+  font-size: 14px!important;
+}
+.ant-modal-confirm-title {
+  font-weight: 600!important;
+}
+.ant-modal-confirm-content {
+  margin-left: 0!important;
+}
+
+.ant-modal-close-x {
+  text-align: right !important;
+  padding-right: 15px;
 }
\ No newline at end of file
diff --git a/src/design/public.less b/src/design/public.less
index b6d9a72b..952a864e 100644
--- a/src/design/public.less
+++ b/src/design/public.less
@@ -50,61 +50,6 @@
   }
 }
 
-.ant-modal {
-  // top: 30px!important;
-}
-
-// 自定义最小输入框
-.ant-form-small {
-  .ant-input-affix-wrapper-sm,
-  .ant-select-selector,
-  .ant-input-disabled,
-  .ant-input-number {
-    height: 26px !important;
-    .ant-select-selection-item {
-      line-height: 26px !important;
-    }
-  }
-  .ant-input-disabled {
-    // height: 16px !important;
-  }
-  // .ant-select-selection-search-input {
-  //   height: 26px !important;
-  //   font-size: 12px!important;
-  // }
-  .ant-select-selection-search-input, .ant-input-affix-wrapper, .ant-input-number-input {
-    height: 26px!important;
-  }
-  .ant-picker-small {
-    height: 26px;
-    width: 100%;
-  }
-  .ant-form-item {
-    margin-bottom: 2px!important;
-  }
-  .ant-input-number-input-wrap {
-    height: 26px;
-    line-height: 24px;
-  }
-  .ant-form-item-label {
-    height: 22px;
-  }
-  .ant-select-selection-item,
-  .ant-select-selection-placeholder,
-  .ant-input-affix-wrapper-placeholder {
-    line-height: 26px !important;
-    font-size: 12px;
-  }
-  .ant-picker {
-    height: 26px!important;
-    width: 100%;
-    font-size: 12px!important;
-  }
-  .ant-btn {
-    height: 26px;
-  }
-}
-
 .ant-col-5 {
   max-width: 20% !important;
   flex: 0;
@@ -114,23 +59,12 @@
   border-color: rgba(0, 0, 0, 0.16);
 }
 
-.ant-modal-close-x {
-  text-align: right !important;
-  padding-right: 15px;
-}
-
 .ant-tabs-card {
   .ant-tabs-tab {
     padding: 5px 15px !important;
   }
 }
 // 定义所有表单组件高度为26
-// .ant-select-selector,
-// .ant-input-number-input-wrap {
-//   height: 26px !important;
-//   min-height: 26px!important;
-//   font-size: 12px!important;
-// }
 input::placeholder {
   font-size: 12px!important;
 }
@@ -191,31 +125,6 @@ h5 {
 .ml10 {
   margin-left: 10px;
 }
-// 表单详情样式
-.ds-form-detail {
-  .ant-form-item {
-    margin-bottom: 10px;
-  }
-  .ant-form-item-control-input-content {
-    white-space: nowrap;
-    width: 100%;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    font-size: 12px;
-  }
-  .ant-form-item-control-input {
-    min-height: 28px;
-  }
-  .ant-form-item-label {
-    padding: 0 !important;
-    label {
-      font-family: PingFang SC-Semibold, PingFang SC;
-      font-size: 12px;
-      color: #7A8798;
-    }
-  }
-}
-
 
 .ds-tb-check {
   position: absolute;
diff --git a/src/directives/repeatClick.ts b/src/directives/repeatClick.ts
index e191a0f7..f2e2f891 100644
--- a/src/directives/repeatClick.ts
+++ b/src/directives/repeatClick.ts
@@ -7,24 +7,18 @@ import type { App, Directive, DirectiveBinding } from 'vue'
 
 const repeatDirective: Directive = {
   beforeMount(el: Element, binding: DirectiveBinding<any>) {
-    let interval: Nullable<IntervalHandle> = null
-    let startTime = 0
-    console.log(binding)
-    const handler = (): void => binding?.value()
-    const clear = (): void => {
-      if (Date.now() - startTime < 100) {
-        handler()
+    on(el, 'click', (e: MouseEvent): void => {
+      if (!el.disabled) {
+        el.disabled = true
+        el.style.cursor = 'not-allowed'
+        el.style.color = 'rgba(0, 0, 0, 0.25)'
+        const timer = setTimeout(() => {
+          el.disabled = false
+          el.style.color = '#257AFA'
+          el.style.cursor = 'pointer'
+          clearInterval(timer)
+        }, binding.value || 1500)
       }
-      interval && clearInterval(interval)
-      interval = null
-    }
-
-    on(el, 'mousedown', (e: MouseEvent): void => {
-      if ((e as any).button !== 0) return
-      startTime = Date.now()
-      once(document as any, 'mouseup', clear)
-      interval && clearInterval(interval)
-      interval = setInterval(handler, 1000)
     })
   },
 }
diff --git a/src/views/operation/seaexport/detail/index.vue b/src/views/operation/seaexport/detail/index.vue
index 273f77d2..3ef6f421 100644
--- a/src/views/operation/seaexport/detail/index.vue
+++ b/src/views/operation/seaexport/detail/index.vue
@@ -127,7 +127,7 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref, computed } from 'vue'
+  import { ref, computed, watch } from 'vue'
   import { useAppStore } from '/@/store/modules/app'
   import { useMessage } from '/@/hooks/web/useMessage'
   import rules from './rules'
@@ -204,6 +204,15 @@
     const height = window.innerHeight
     return 300
   })
+  watch(
+    () => bookingDetails.value,
+    (val) => {
+      console.log(val)
+    },
+    {
+      deep: true
+    }
+  )
   // // =========
   // watch(
   //   () => mainOrderActiveKey,
diff --git a/src/views/operation/seaexport/detail/modules/Letter/OpBusinessTruckDetails.vue b/src/views/operation/seaexport/detail/modules/Letter/OpBusinessTruckDetails.vue
index c6b7f4fa..e2e3acc8 100644
--- a/src/views/operation/seaexport/detail/modules/Letter/OpBusinessTruckDetails.vue
+++ b/src/views/operation/seaexport/detail/modules/Letter/OpBusinessTruckDetails.vue
@@ -142,6 +142,6 @@
   @import url('/@/styles/buttonGroup.scss');
   .OPCol {
     height: 60vh;
-    overflow-y: auto;
+    overflow-y: hidden;
   }
 </style>
diff --git a/src/views/operation/seaexport/detail/modules/Letter/OpBusinessYardDetails.vue b/src/views/operation/seaexport/detail/modules/Letter/OpBusinessYardDetails.vue
index 1bdc3cae..a1dbb591 100644
--- a/src/views/operation/seaexport/detail/modules/Letter/OpBusinessYardDetails.vue
+++ b/src/views/operation/seaexport/detail/modules/Letter/OpBusinessYardDetails.vue
@@ -11,16 +11,20 @@
         <BasicTable @register="registerOpBusinessYardTable">
           <template #tableTitle>
             <div class="buttonGroup">
-              <div class="nav" @click="FnClickAdd">
-                <i class="iconfont icon-jiahao2fill"></i>新建
-              </div>
+              <a-button type="link" @click="FnClickAdd">
+                <span class="iconfont icon-new_document"></span>
+                新建
+              </a-button>
               <a-popconfirm
                 title="确定要删除所选数据?"
                 ok-text="确定"
                 cancel-text="取消"
                 @confirm="FnClickDel"
               >
-                <div class="nav"> <i class="iconfont icon-shanchu"></i>删除 </div>
+                <a-button type="link">
+                  <span class="iconfont icon-shanchu21"></span>
+                  删除
+                </a-button>
               </a-popconfirm>
             </div>
           </template>
@@ -137,9 +141,8 @@
   }
 </script>
 <style lang="less">
-  @import url('/@/styles/buttonGroup.scss');
   .OPCol {
     height: 60vh;
-    overflow-y: auto;
+    overflow-y: hidden;
   }
 </style>
diff --git a/src/views/operation/seaexport/detail/modules/Letter/OpBusinessYardEdit.vue b/src/views/operation/seaexport/detail/modules/Letter/OpBusinessYardEdit.vue
index cf1cfd4d..af4f2ba7 100644
--- a/src/views/operation/seaexport/detail/modules/Letter/OpBusinessYardEdit.vue
+++ b/src/views/operation/seaexport/detail/modules/Letter/OpBusinessYardEdit.vue
@@ -1,7 +1,10 @@
 <template>
   <div class="MainBox">
     <div class="buttonGroup">
-      <div class="nav" @click="handleSave"> <i class="iconfont icon-jiahao2fill"></i>保存 </div>
+      <a-button type="link" @click="handleSave">
+        <span class="iconfont icon-baocun"></span>
+        保存
+      </a-button>
     </div>
     <BasicForm class="Content" @register="registerForm" />
   </div>
@@ -14,7 +17,9 @@
   import { useMessage } from '/@/hooks/web/useMessage'
   import { propTypes } from '/@/utils/propTypes'
   const props = defineProps({
-    businessId: propTypes.object,
+    businessId: {
+      type: String
+    },
     selectId: propTypes.string,
   })
   watch(
@@ -69,8 +74,6 @@
   .MainBox {
     height: 100%;
     position: relative;
-    .buttonGroup {
-    }
     .Content {
       height: calc(100% - 28px);
       overflow-y: auto;
diff --git a/src/views/operation/seaexport/detail/modules/operationArea.vue b/src/views/operation/seaexport/detail/modules/operationArea.vue
index 4acf1f74..70177479 100644
--- a/src/views/operation/seaexport/detail/modules/operationArea.vue
+++ b/src/views/operation/seaexport/detail/modules/operationArea.vue
@@ -30,18 +30,22 @@
       派车信息
     </a-button>
     <Divider type="vertical" />
-    <a-button type="link" @click="FnTxxpLink">
+    <a-button type="link" v-repeat @click="FnTxxpLink">
       <span class="iconfont icon-a-xiaopiaofapiao-01"></span>
       提箱小票
     </a-button>
-    <a-button type="link" @click="ShowOCR">
+    <a-button type="link" v-repeat @click="ShowOCR">
       <span class="iconfont icon-OCR"></span>
       OCR
     </a-button>
-    <a-button type="link" @click="handleSubmitTelex">
+    <a-button type="link" v-repeat @click="handleSubmitTelex">
       <span class="iconfont icon-lunchuan"></span>
       船司电放
     </a-button>
+    <!-- 场站入货 -->
+    <OpBusinessYardDetails :businessId="details.id" @register="OYregisterModal" />
+    <!-- 派车信息 -->
+    <OpBusinessTruckDetails :businessId="details.id" @register="OTregisterModal" />
     <!-- <a-card
       :bordered="false"
       :bodyStyle="{
@@ -234,25 +238,20 @@
       @cancel="handleModelCancel"
     >
       <template v-if="['bookingSpace', 'cutOff'].includes(modelType)">
-        <a-form>
-          <a-row :gutter="16">
-            <a-col :span="24">
-              <a-form-item
-                label="文件功能"
-                :labelCol="{ xs: { span: 24 }, sm: { span: 6 } }"
-                :wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
-                has-feedback
-                layout="vertical"
-                class="ant-form-file"
-              >
-                <a-radio-group v-model:value="bookingModelFrom.fileRole">
-                  <a-radio :style="radioStyle" :value="9"> 原始 </a-radio>
-                  <a-radio :disabled="forwarderFlag" :style="radioStyle" :value="1"> 更新 </a-radio>
-                  <a-radio :disabled="forwarderFlag" :style="radioStyle" :value="5"> 退舱 </a-radio>
-                </a-radio-group>
-              </a-form-item>
-            </a-col>
-          </a-row>
+        <a-form
+          layout="vertical"
+          class="ds-form-detail"
+        >
+          <a-form-item
+            label="文件功能"
+            has-feedback
+          >
+            <a-radio-group v-model:value="bookingModelFrom.fileRole">
+              <a-radio :value="9"> 原始 </a-radio>
+              <a-radio :disabled="forwarderFlag" :value="1"> 更新 </a-radio>
+              <a-radio :disabled="forwarderFlag" :value="5"> 退舱 </a-radio>
+            </a-radio-group>
+          </a-form-item>
         </a-form>
       </template>
       <template v-else-if="['initCabin', 'ladingBill', 'vgmlink'].includes(modelType)">
@@ -878,48 +877,47 @@
         }}</li>
       </ul>
     </a-drawer>
-    <!-- OCR抽屉 end -->
-    <!-- 运踪弹窗 start -->
+    <!-- 运踪弹窗 -->
     <a-modal
-      width="50vw"
+      width="500px"
+      class="ds-modal-small"
       :maskClosable="false"
       v-model:visible="traceModalVisible"
       title="运踪订阅"
     >
-      <div class="trace-box">
-        <a-form>
-          <a-row :gutter="16">
-            <a-col :span="24" class="book-model-box">
-              <a-form-item
-                label="请选择订阅内容"
-                :labelCol="{ xs: { span: 24 }, sm: { span: 6 } }"
-                :wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
-                has-feedback
-              >
-                <a-checkbox-group
-                  class="trace-check"
-                  v-model:value="traceValue"
-                  name="checkboxgroup"
-                  :options="traceOptions"
-                  @change="onTraceChange"
-                />
-              </a-form-item>
-            </a-col>
-          </a-row>
-        </a-form>
-      </div>
+      <a-form
+        ref=traceRef
+        class="ds-detail-form"
+        layout="vertical"
+        :model="traceForm"
+        :rules="rules"
+      >
+        <a-form-item
+          label="请选择订阅内容"
+          name="traceValue"
+        >
+          <a-checkbox-group
+            class="trace-check"
+            v-model:value="traceForm.traceValue"
+            :options="traceOptions"
+          />
+        </a-form-item>
+      </a-form>
       <template #footer>
-        <a-button type="primary" @click="traceSend">订阅</a-button>
+        <a-button @click="traceModalVisible = false">关闭</a-button>
+        <a-button :loading="tloading" type="primary" @click="traceSend">订阅</a-button>
       </template>
     </a-modal>
-    <!-- 运踪弹窗 end -->
+    <!-- 预配舱单 -->
     <pre-order ref="RefpreOrder" :details="details" @frompre="frompre" />
   </div>
 </template>
 <script lang="ts" setup>
   import preOrder from './preOrder.vue'
-
-
+  // 场站入货组件
+  import OpBusinessYardDetails from './Letter/OpBusinessYardDetails.vue'
+  // 派车信息组件
+  import OpBusinessTruckDetails from './Letter/OpBusinessTruckDetails.vue'
   import {
     GetOpenPrintModuleList,
     GetOpenPrintTemplateList,
@@ -951,7 +949,7 @@
   const router = useRouter()
   const route = useRoute()
   import { useMessage } from '/@/hooks/web/useMessage'
-  const { notification } = useMessage()
+  const { notification, createMessage } = useMessage()
   import { columns, searchFormSchema } from './operationAreaColumns'
   import { BasicTable, useTable, TableAction } from '/@/components/Table'
   const emit = defineEmits([
@@ -984,13 +982,22 @@
   // =============
   const id = ref(route.query.id)
   const spinning = ref(false)
-  const templateType = ref<any>([])
   const PrintModalVisible = ref(false)
   const forwarderFlag = ref(false)
   const modelType = ref('')
   const bookingModelvisible = ref(false)
   const bookingModelconfirm = ref(false)
-
+  // 表单校验规则
+  const rules = {
+    traceValue: [
+      {
+        type: 'array',
+        required: true,
+        message: '请选择订阅内容',
+        trigger: 'change'
+      }
+    ]
+  }
   const initCabinFrom = ref({
     toName: '',
     attn: '',
@@ -1286,9 +1293,11 @@
         bookingModelFrom.orderNo = props.details.mblno
         bookingModelFrom.id = route.query.id
         if (type == 'save') {
+          // 保存EDI文件
           EDISloading.value = true
           downloadBookingOrEDI(type)
         } else {
+          // 上传EDI
           EDIUloading.value = true
           sendBookingOrEDI(type)
         }
@@ -1300,23 +1309,11 @@
       .then((res) => {
         EDISloading.value = false
         EDIUloading.value = false
+        console.log(res)
         // 未完成
         if (res.succeeded) {
-          notification.success({ message: '发送成功', duration: 3 })
+          createMessage.success('发送成功！')
           handleModelCancel()
-        } else {
-          notification.error({
-            content: () =>
-              h(
-                'p',
-                {
-                  style: {
-                    whiteSpace: 'pre-wrap',
-                  },
-                },
-                res.message,
-              ),
-          })
         }
       })
       .catch(() => {
@@ -1365,54 +1362,54 @@
   }
 
   const traceModalVisible = ref(false)
-  const traceValue = ref([])
-  const traceOptions = reactive([
+  // 运踪弹窗部分
+  const traceForm = reactive({
+    traceValue: []
+  })
+  const traceOptions = [
     { label: '起运港', value: '1' },
-    { label: '目的港', value: '2' },
-  ])
-  // 运踪选择 Change
-  function onTraceChange() {
-    console.log(traceValue.value)
-  }
+    { label: '目的港', value: '2' }
+  ]
+  const traceRef = ref(null)
+  const tloading = ref(false)
   // 订阅运踪
   function traceSend() {
-    if (!traceValue.value) {
-      notification.error({ message: '请选择订阅内容', duration: 3 })
-      return false
-    }
-    if (traceValue.value.includes('1') && (!props.details.yard || !props.details.yardId)) {
-      notification.error({ message: '请选择场站', duration: 3 })
-      return false
-    }
-    if (traceValue.value.includes('2') && (!props.details.carrierId || !props.details.carrier)) {
-      notification.error({ message: '请选择船公司', duration: 3 })
-      return false
-    }
-    const query = {
-      businessId: route.query.id,
-      mblno: props.details.mblno,
-      yard: traceValue.value.includes('1') ? props.details.yard : '',
-      yardCode: traceValue.value.includes('1') ? props.details.yardid : '',
-      carrierid: traceValue.value.includes('2') ? props.details.carrierid : '',
-      carrier: traceValue.value.includes('2') ? props.details.carrier : '',
-      isBook: !!traceValue.value.includes('2'),
-    }
-    SendTrace([query])
-      .then((res) => {
+    traceRef.value.validate().then(() => {
+      console.log(props.details.yardId)
+      if (traceForm.traceValue.includes('1') && !props.details.yardId) {
+        return createMessage.warning('请选择场站！')
+      }
+      if (traceForm.traceValue.includes('2') && !props.details.carrierId) {
+        return createMessage.warning('请选择船公司！')
+      }
+      const query = {
+        businessId: route.query.id,
+        mblno: props.details.mblno,
+        yard: traceForm.traceValue.includes('1') ? props.details.yard : '',
+        yardCode: traceForm.traceValue.includes('1') ? props.details.yardId : '',
+        carrierId: traceForm.traceValue.includes('2') ? props.details.carrierId : '',
+        carrier: traceForm.traceValue.includes('2') ? props.details.carrier : '',
+        isBook: !!traceForm.traceValue.includes('2')
+      }
+      tloading.value = true
+      SendTrace([query]).then((res) => {
+        tloading.value = false
         if (res.succeeded) {
-          const tip = `订阅成功`
-          notification.success({ message: tip, duration: 3 })
+          createMessage.success('订阅成功！')
           traceModalVisible.value = false
-          traceValue.value = []
+          traceForm.traceValue = []
         } else {
-          notification.warning({ message: res.message, duration: 3 })
           traceModalVisible.value = false
-          traceValue.value = []
+          traceForm.traceValue = []
         }
       })
       .catch((err) => {
+        tloading.value = false
         console.log(err)
       })
+    }).catch(error => {
+      console.log('error', error)
+    })
   }
   // 打开对话框 VGM
   function openDialog(type) {
@@ -1425,6 +1422,7 @@
     Modal.confirm({
       title: '温馨提示',
       content: content,
+      class: 'ds-modal-small',
       onOk() {
         if (type === 'vgm') {
           vgmSend()
@@ -1432,19 +1430,15 @@
           FnsendXHZ()
         }
       },
-      onCancel() {},
-      class: 'test',
+      onCancel() {}
     })
   }
   // 发送 VGM
   function vgmSend() {
     VgmSend(id.value)
       .then((res) => {
-        // notification.open({ message: '发送中..' })
         if (res.succeeded) {
-          notification.success({ message: 'VGM发送成功', duration: 3 })
-        } else {
-          notification.error({ message: res.message, duration: 3 })
+          createMessage.success('VGM发送成功！')
         }
       })
       .catch((err) => {
@@ -1454,11 +1448,8 @@
   function FnsendXHZ() {
     SendXHZ({ id: id.value })
       .then((res) => {
-        // notification.loading({ message: '发送中..' })
         if (res.succeeded) {
-          notification.success({ message: '下货纸发送成功', duration: 3 })
-        } else {
-          notification.error({ message: res.message, duration: 3 })
+          createMessage.success('下货纸发送成功！')
         }
       })
       .catch((err) => {
@@ -1547,8 +1538,6 @@
       .then((res) => {
         if (res.succeeded) {
           copyFun(res.data)
-        } else {
-          notification.error({ message: res.message, duration: 3 })
         }
       })
       .catch((err) => {
@@ -1695,7 +1684,7 @@
     copyInput.setAttribute('value', data)
     copyInput.select()
     document.execCommand('Copy', false, null)
-    notification.success({ message: '复制成功', duration: 3 })
+    createMessage.success('复制成功！')
     copyInput.remove()
   }
   function beforeUpload(file) {
@@ -1868,8 +1857,7 @@
   const RefpreOrder = ref()
   function openPreOrderFun() {
     if (!id.value) {
-      notification.error({ message: '请先保存主单', duration: 3 })
-      return false
+      return createMessage.warning('请先保存主单！')
     }
     RefpreOrder.value.init()
   }
diff --git a/src/views/operation/seaexport/detail/modules/preOrder.tsx b/src/views/operation/seaexport/detail/modules/preOrder.tsx
new file mode 100644
index 00000000..baf6c642
--- /dev/null
+++ b/src/views/operation/seaexport/detail/modules/preOrder.tsx
@@ -0,0 +1,25 @@
+import { ref } from 'vue'
+import { BasicColumn, FormSchema } from '/@/components/Table'
+import { getDictOption } from '/@/utils/dictUtil'
+import { getOptions } from '/@/hooks/dict'
+
+// 基础信息表单
+export const formSchema1: FormSchema[] = [
+  {
+    field: 'id',
+    show: false,
+    component: 'Input'
+  },
+  {
+    field: 'isHBL',
+    show: false,
+    component: 'Input'
+  },
+  {
+    label: '主题单号',
+    field: 'mblno',
+    component: 'Input',
+    required: true,
+    colProps: { span: 4 },
+  },
+]
\ No newline at end of file
diff --git a/src/views/operation/seaexport/detail/modules/preOrder.vue b/src/views/operation/seaexport/detail/modules/preOrder.vue
index 195d4ffc..094bc9ce 100644
--- a/src/views/operation/seaexport/detail/modules/preOrder.vue
+++ b/src/views/operation/seaexport/detail/modules/preOrder.vue
@@ -1,26 +1,31 @@
 <template>
   <a-modal
+    class="ds-pre-order"
     width="90vw"
     :maskClosable="false"
     v-model:visible="openPreOrderShow"
-    title="预配舱单"
     @cancel="close"
   >
     <template #footer>
-      <a-button type="primary" @click="close">取消</a-button>
     </template>
     <div class="pre-order">
-      <a-row :gutter="24" class="show-content" style="margin-left: 0">
-        <a-col :span="5">
-          <div class="sed-order-list">
-            <div class="sed-order-title">
-              <i class="iconfont icon-liebiao"></i><span class="tit">预配舱单列表</span>
-            </div>
-            <div class="order-btn-list">
-              <a-button class="order-btn" size="small" type="primary" @click="addOrder">
-                添加分单
-              </a-button>
-              <a-button class="order-btn" size="small" type="primary" @click="saveOrder">
+      <div class="flex">
+        <div class="ds-card" style="width: 251px;">
+          <h4>
+            预配舱单列表
+          </h4>
+          <div>
+            <a-button type="link" @click="addOrder" class="pl0 pb0">
+              <span class="iconfont icon-new_document"></span>
+              添加分单
+            </a-button>
+            <a-button type="link" @click="sendOrderFun" class="pb0">
+              <span class="iconfont icon-tijiao1"></span>
+              发送
+            </a-button>
+            <div style="white-space: nowrap;">
+              <a-button type="link" @click="saveOrder" class="pl0 pt0">
+                <span class="iconfont icon-baocun"></span>
                 保存
               </a-button>
               <a-popconfirm
@@ -29,938 +34,650 @@
                 cancel-text="否"
                 @confirm="removeOrder()"
               >
-                <a-button class="order-btn" size="small">删除</a-button>
+                <a-button type="link" class="pt0">
+                  <span class="iconfont icon-shanchu21"></span>
+                  删除
+                </a-button>
               </a-popconfirm>
-              <a-button class="order-btn" size="small" @click="sendOrderFun()">发送</a-button>
               <a-popconfirm
                 title="会覆盖当前数据，确认刷新吗？"
                 ok-text="是"
                 cancel-text="否"
-                @confirm="handleRef()"
+                @confirm="handleRef"
               >
-                <a-button class="order-btn" style="margin-right: 0px !important" size="small">
+                <a-button type="link" class="pt0">
+                  <span class="iconfont icon-shuaxin"></span>
                   刷新
                 </a-button>
               </a-popconfirm>
             </div>
-            <div class="sec-order">
-              <template v-for="(sedDetail, sindex) in orderList" :key="sindex">
-                <div class="order-box">
-                  <a-checkbox class="check-btn" v-model:checked="sedDetail.checked" />
-                  <span
-                    class="order-label"
-                    :class="{ active: sindex == editIndex }"
-                    @click.stop="changeOrder(sindex)"
+          </div>
+          <div class="sec-order">
+            <template v-for="(sedDetail, sindex) in orderList" :key="sindex">
+              <div class="order-box">
+                <a-checkbox class="check-btn" v-model:checked="sedDetail.checked" />
+                <span
+                  class="order-label"
+                  :class="{ active: sindex == editIndex }"
+                  @click.stop="changeOrder(sindex)"
+                >
+                  <a-tag
+                    class="tag"
+                    v-if="sedDetail.state"
+                    :color="sedDetail.state === '已直发' ? '#00CC00' : ''"
+                    >{{ sedDetail.state }}</a-tag
+                  >>
+                  <template v-if="!sedDetail.isHBL">
+                    主提单号：{{ sedDetail.mblno || '请填写主提单号' }}
+                  </template>
+                  <template v-else>
+                    分提单号{{ sindex + 1 }}: {{ sedDetail.hblno || '请填写分单号' }}
+                  </template>
+                </span>
+              </div>
+            </template>
+          </div>
+        </div>
+        <div class="pre-details">
+          <a-form
+            class="ds-detail-form"
+            layout="vertical"
+            ref="basicFrom"
+            :selfUpdate="true"
+            size="small"
+            :model="formState"
+            autocomplete="off"
+          >
+            <div class="ds-card">
+              <h4>基本信息</h4>
+              <a-row :gutter="15">
+                <a-col :span="4" v-if="!formState.isHBL">
+                  <a-form-item
+                    label="主提单号"
+                    name="mblno"
+                  >
+                    <a-input v-model:value="formState.mblno" />
+                  </a-form-item>
+                </a-col>
+                <a-col v-else :span="4">
+                  <a-form-item
+                    class="pre-from-label"
+                    label="分提单号"
+                    name="hblno"
+                  >
+                    <a-input v-model:value="formState.hblno" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    class="pre-from-label"
+                    label="船名"
+                    name="vesselId"
+                  >
+                    <a-select v-model:value="formState.vesselId">
+                      <a-select-option :value="item.id" v-for="item in vesselList" :key="item.id">
+                        {{ item.vesselName }}
+                      </a-select-option>
+                    </a-select>
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    class="pre-from-label"
+                    label="航次"
+                    name="voyno"
+                  >
+                    <a-input v-model:value="formState.voyno" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    class="pre-from-label"
+                    label="船公司"
+                    name="carrierId"
+                  >
+                    <a-select v-model:value="formState.carrierId">
+                      <a-select-option
+                        :value="item.id"
+                        v-for="item in carrierList"
+                        :key="item.id"
+                      >
+                        {{ item.shortName }} / {{ item.codeName }}
+                      </a-select-option>
+                    </a-select>
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    class="pre-from-label"
+                    label="开船日期"
+                    name="etd"
+                  >
+                    <div class="date-box">
+                      <a-date-picker
+                        class="date-picker"
+                        v-model:value="formState.etd"
+                        value-format="YYYY-MM-DD"
+                      />
+                    </div>
+                  </a-form-item>
+                </a-col>
+              </a-row>
+            </div>
+            <div class="ds-card mt15">
+              <h4>收发通信息</h4>
+              <a-row :gutter="15">
+                <a-col :span="8">
+                  <a-form-item
+                    label="发货人"
+                    name="shipperName"
                   >
-                    <a-tag
-                      class="tag"
-                      v-if="sedDetail.state"
-                      :color="sedDetail.state === '已直发' ? '#00CC00' : ''"
-                      >{{ sedDetail.state }}</a-tag
+                    <a-select
+                      class="sft-select"
+                      placeholder="模版"
+                      v-model:value="formState.shipperId"
+                      @change="
+                        (e) => {
+                          ChangeSFT(e, 'shipper')
+                        }
+                      "
                     >
-                    <!-- <a-tag class="tag" v-if="sedDetail.state">{{ sedDetail.state }}</a-tag> -->
-                    <template v-if="!sedDetail.isHBL">
-                      主提单号：{{ sedDetail.mblno || '请填写主提单号' }}
-                    </template>
-                    <template v-else>
-                      分提单号{{ sindex + 1 }}: {{ sedDetail.hblno || '请填写分单号' }}
-                    </template>
-                  </span>
-                </div>
-              </template>
+                      <a-select-option
+                        :value="item.id"
+                        v-for="item in SFTList.shipperList"
+                        :key="item.id"
+                      >
+                        {{ item.name }}
+                      </a-select-option>
+                    </a-select>
+                    <a-button type="link" class="sft-save-btn">
+                      <span class="iconfont icon-baocun"></span>
+                      保存发货人
+                    </a-button>
+                    <a-input placeholder="请输入" v-model:value="formState.shipperName" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="8">
+                  <a-form-item
+                    label="收货人"
+                    name="consigneeName"
+                  >
+                    <a-select
+                      class="sft-select"
+                      placeholder="模版"
+                      v-model:value="formState.consigneeId"
+                      @change="
+                        (e) => {
+                          ChangeSFT(e, 'consignee')
+                        }
+                      "
+                    >
+                      <a-select-option
+                        :value="item.id"
+                        v-for="item in SFTList.consigneeList"
+                        :key="item.id"
+                      >
+                        {{ item.name }}
+                      </a-select-option>
+                    </a-select>
+                    <a-button type="link" class="sft-save-btn">
+                      <span class="iconfont icon-baocun"></span>
+                      保存收货人
+                    </a-button>
+                    <a-input placeholder="请输入" v-model:value="formState.consigneeName" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="8">
+                  <a-form-item
+                    label="通知人"
+                    name="notifyPartyName"
+                  >
+                    <a-select
+                      class="sft-select"
+                      placeholder="模版"
+                      v-model:value="formState.notifyPartyId"
+                      @change="
+                        (e) => {
+                          ChangeSFT(e, 'notifyParty')
+                        }
+                      "
+                    >
+                      <a-select-option
+                        :value="item.id"
+                        v-for="item in SFTList.notifyPartyList"
+                        :key="item.id"
+                      >
+                        {{ item.name }}
+                      </a-select-option>
+                    </a-select>
+                    <a-button type="link" class="sft-save-btn">
+                      <span class="iconfont icon-baocun"></span>
+                      保存通知人
+                    </a-button>
+                    <a-input placeholder="请输入" v-model:value="formState.notifyPartyName" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="8">
+                  <a-form-item
+                    label="发货人地址"
+                    name="shipperAddress"
+                  >
+                    <a-input v-model:value="formState.shipperAddress" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="8">
+                  <a-form-item
+                    label="收货人地址"
+                    name="consigneeAddress"
+                  >
+                    <a-input v-model:value="formState.consigneeAddress" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="8">
+                  <a-form-item
+                    label="通知人地址"
+                    name="notifyPartyAddress"
+                  >
+                    <a-input v-model:value="formState.notifyPartyAddress" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    label="发货人国家"
+                    name="shipperCountry"
+                  >
+                    <a-select v-model:value="formState.shipperCountry">
+                      <a-select-option
+                        :value="item.id"
+                        v-for="item in countryList"
+                        :key="item.id"
+                      >
+                        {{ item.countryName }}
+                      </a-select-option>
+                    </a-select>
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    label="发货人电话"
+                    name="shipperCountryTel"
+                  >
+                    <a-input v-model:value="formState.shipperCountryTel" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    label="收货人国家"
+                    name="consigneeCountry"
+                  >
+                    <a-select v-model:value="formState.consigneeCountry">
+                      <a-select-option
+                        :value="item.id"
+                        v-for="item in countryList"
+                        :key="item.id"
+                      >
+                        {{ item.countryName }}
+                      </a-select-option>
+                    </a-select>
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    label="收货人电话"
+                    name="consigneeCountryTel"
+                  >
+                    <a-input v-model:value="formState.consigneeCountryTel" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    label="通知人国家"
+                    name="notifyPartyCountry"
+                  >
+                    <a-select v-model:value="formState.notifyPartyCountry">
+                      <a-select-option
+                        :value="item.id"
+                        v-for="item in countryList"
+                        :key="item.id"
+                      >
+                        {{ item.countryName }}
+                      </a-select-option>
+                    </a-select>
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    label="通知人电话"
+                    name="notifyPartyCountryTel"
+                  >
+                    <a-input v-model:value="formState.notifyPartyCountryTel" />
+                  </a-form-item>
+                </a-col>
+              </a-row>
             </div>
-          </div>
-        </a-col>
-        <a-col :span="19">
-          <div class="pre-details">
-            <!-- :rules="rules" -->
-            <a-form
-              style="margin-bottom: 10px"
-              size="small"
-              ref="basicFrom"
-              :selfUpdate="true"
-              :model="formState"
-              :label-col="{ span: 8 }"
-              :wrapper-col="{ span: 16 }"
-              autocomplete="off"
-            >
-              <div class="top">
-                <a-row class="from-box" :gutter="10">
-                  <template v-if="!formState.isHBL">
-                    <a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
+            <div class="ds-card mt15">
+              <h4>港口信息</h4>
+              <a-row :gutter="15">
+                <a-col :span="4">
+                  <a-form-item
+                    label="装货港代码"
+                    name="loadPortId"
+                  >
+                    <a-select
+                      v-model:value="formState.loadPortId"
+                      @change="
+                        (e) => {
+                          PortChange(e, 'loadPort')
+                        }
+                      "
+                    >
+                      <a-select-option
+                        :value="item.id"
+                        v-for="item in portList"
+                        :key="item.id"
+                      >
+                        {{ item.portName }}/{{ item.ediCode }}
+                      </a-select-option>
+                    </a-select>
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    label="装货港"
+                    name="loadPort"
+                  >
+                    <a-input v-model:value="formState.loadPort" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    label="卸货港代码"
+                    name="dischargePortId"
+                  >
+                    <a-select
+                      v-model:value="formState.dischargePortId"
+                      @change="
+                        (e) => {
+                          PortChange(e, 'dischargePort')
+                        }
+                      "
+                    >
+                      <a-select-option
+                        :value="item.id"
+                        v-for="item in portList"
+                        :key="item.id"
+                      >
+                        {{ item.portName }}/{{ item.ediCode }}
+                      </a-select-option>
+                    </a-select>
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    label="卸货港"
+                    name="dischargePort"
+                  >
+                    <a-input v-model:value="formState.dischargePort" />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    label="收货地代码"
+                    name="deliveryPlaceId"
+                  >
+                    <a-select
+                      v-model:value="formState.deliveryPlaceId"
+                      @change="
+                        (e) => {
+                          PortChange(e, 'deliveryPlace')
+                        }
+                      "
+                    >
+                      <a-select-option
+                        :value="item.id"
+                        v-for="item in portList"
+                        :key="item.id"
+                      >
+                        {{ item.portName }}/{{ item.ediCode }}
+                      </a-select-option>
+                    </a-select>
+                  </a-form-item>
+                </a-col>
+                <a-col :span="4">
+                  <a-form-item
+                    label="收货地"
+                    name="deliveryPlace"
+                  >
+                    <a-input v-model:value="formState.deliveryPlace" />
+                  </a-form-item>
+                </a-col>
+              </a-row>
+            </div>
+            <div class="ds-card mt15">
+              <h4>货物信息</h4>
+              <a-row :gutter="15">
+                <a-col :span="8">
+                  <a-form-item
+                    name="marks"
+                    label="唛头"
+                  >
+                    <a-textarea
+                      class="input-box"
+                      v-model:value="formState.marks"
+                      :auto-size="{ minRows: 7, maxRows: 7 }"
+                    />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="8">
+                  <a-form-item
+                    name="description"
+                    label="货物描述"
+                  >
+                    <a-textarea
+                      v-model:value="formState.description"
+                      :auto-size="{ minRows: 7, maxRows: 7 }"
+                    />
+                  </a-form-item>
+                </a-col>
+                <a-col :span="8">
+                  <a-row :gutter="15">
+                    <a-col :span="24">
                       <a-form-item
-                        class="pre-from-label"
-                        label="主提单号"
-                        name="mblno"
-                        :labelCol="labelCol2"
-                        :wrapperCol="wrapperCol2"
-                        has-feedback
+                        label="货物标识"
+                        name="cargoid"
                       >
-                        <a-input v-model:value="formState.mblno" />
+                        <a-select v-model:value="formState.cargoid">
+                          <a-select-option value="S">S 普通货</a-select-option>
+                          <a-select-option value="R">R 冻柜</a-select-option>
+                          <a-select-option value="D">D 危险品</a-select-option>
+                          <a-select-option value="O">O 超限箱</a-select-option>
+                        </a-select>
                       </a-form-item>
                     </a-col>
-                  </template>
-                  <template v-if="formState.isHBL">
-                    <a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
+                    <a-col :span="12">
                       <a-form-item
-                        class="pre-from-label"
-                        label="分提单号"
-                        name="hblno"
-                        :labelCol="labelCol2"
-                        :wrapperCol="wrapperCol2"
-                        has-feedback
+                        label="包装"
+                        name="kindPkgs"
                       >
-                        <a-input v-model:value="formState.hblno" />
+                        <a-select v-model:value="formState.kindPkgs">
+                          <a-select-option
+                            v-for="item in kindPkgsList"
+                            :key="item.id"
+                            :value="item.id"
+                          >
+                            {{ item.packageName }}
+                          </a-select-option>
+                        </a-select>
                       </a-form-item>
                     </a-col>
-                  </template>
-                </a-row>
-                <a-row class="from-box" :gutter="10" style="padding-left: 17px">
-                  <a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="5">
-                    <a-form-item
-                      class="pre-from-label"
-                      label="船名"
-                      name="vesselId"
-                      :labelCol="labelCol2"
-                      :wrapperCol="wrapperCol2"
-                      has-feedback
-                    >
-                      <a-select v-model:value="formState.vesselId">
-                        <a-select-option :value="item.id" v-for="item in vesselList" :key="item.id">
-                          {{ item.vesselName }}
-                        </a-select-option>
-                      </a-select>
-                    </a-form-item>
-                  </a-col>
-                  <a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="5">
-                    <a-form-item
-                      class="pre-from-label"
-                      label="航次"
-                      name="voyno"
-                      :labelCol="labelCol2"
-                      :wrapperCol="wrapperCol2"
-                      has-feedback
-                    >
-                      <a-input v-model:value="formState.voyno" />
-                    </a-form-item>
-                  </a-col>
-                  <!-- <a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="4">
-                    <a-form-item
-                      class="pre-from-label"
-                      label="船代"
-                      name="forwarder"
-                      :labelCol="labelCol2"
-                      :wrapperCol="wrapperCol2"
-                      has-feedback
-                    >
-                      <a-select v-model:value="formState.forwarder">
-                        <a-select-option value="china">China</a-select-option>
-                        <a-select-option value="usa">U.S.A</a-select-option>
-                      </a-select>
-                    </a-form-item>
-                  </a-col> -->
-                  <a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="5">
-                    <a-form-item
-                      class="pre-from-label"
-                      label="船公司"
-                      name="carrierId"
-                      :labelCol="labelCol2"
-                      :wrapperCol="wrapperCol2"
-                      has-feedback
-                    >
-                      <a-select v-model:value="formState.carrierId">
-                        <a-select-option
-                          :value="item.id"
-                          v-for="item in carrierList"
-                          :key="item.id"
-                        >
-                          {{ item.shortName }} / {{ item.codeName }}
-                        </a-select-option>
-                      </a-select>
-                    </a-form-item>
-                  </a-col>
-                  <a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="5">
-                    <a-form-item
-                      class="pre-from-label"
-                      label="开船日期"
-                      name="etd"
-                      :labelCol="labelCol2"
-                      :wrapperCol="wrapperCol2"
-                      has-feedback
-                    >
-                      <div class="date-box">
-                        <a-date-picker
-                          class="date-picker"
-                          v-model:value="formState.etd"
-                          value-format="YYYY-MM-DD"
-                        />
-                      </div>
-                    </a-form-item>
-                  </a-col>
-                </a-row>
-              </div>
-              <div class="pre-mail-info">
-                <a-row>
-                  <a-col :span="8">
-                    <div class="mail-box">
-                      <div class="title">
-                        <span>发货人信息</span>
-                        <div class="Template">
-                          <a-select
-                            v-model:value="formState.shipperId"
-                            @change="
-                              (e) => {
-                                ChangeSFT(e, 'shipper')
-                              }
-                            "
-                          >
-                            <a-select-option
-                              :value="item.id"
-                              v-for="item in SFTList.shipperList"
-                              :key="item.id"
-                            >
-                              {{ item.name }}
-                            </a-select-option>
-                          </a-select>
-                          <!-- @click="saveModel('shipper')" -->
-                          <a-button
-                            class="save-btn"
-                            type="link"
-                            size="small"
-                            pre-icon="ant-design:save-outlined"
-                          >
-                            保存
-                          </a-button>
-                        </div>
-                        <div></div>
-                      </div>
-                      <div class="mail-bottom">
-                        <a-row>
-                          <a-col :span="24">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="发货人"
-                              name="shipperName"
-                              :labelCol="labelCol"
-                              :wrapperCol="wrapperCol"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.shipperName" />
-                            </a-form-item>
-                          </a-col>
-                          <a-col :span="24">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="地址"
-                              name="shipperAddress"
-                              :labelCol="labelCol"
-                              :wrapperCol="wrapperCol"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.shipperAddress" />
-                            </a-form-item>
-                          </a-col>
-                          <!-- shipperCountryName -->
-                          <a-col :span="12">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="国家"
-                              name="shipperCountry"
-                              :labelCol="labelCol2"
-                              :wrapperCol="wrapperCol2"
-                              has-feedback
-                            >
-                              <a-select v-model:value="formState.shipperCountry">
-                                <a-select-option
-                                  :value="item.id"
-                                  v-for="item in countryList"
-                                  :key="item.id"
-                                >
-                                  {{ item.countryName }}
-                                </a-select-option>
-                              </a-select>
-                            </a-form-item>
-                          </a-col>
-                          <a-col :span="12">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="电话"
-                              name="shipperCountryTel"
-                              :labelCol="labelCol2"
-                              :wrapperCol="wrapperCol2"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.shipperCountryTel" />
-                            </a-form-item>
-                          </a-col>
-                        </a-row>
-                      </div>
-                    </div>
-                  </a-col>
-                  <a-col :span="8">
-                    <div class="mail-box">
-                      <div class="title">
-                        <span>收货人信息</span>
-                        <div class="Template">
-                          <a-select
-                            v-model:value="formState.consigneeId"
-                            @change="
-                              (e) => {
-                                ChangeSFT(e, 'consignee')
-                              }
-                            "
-                          >
-                            <a-select-option
-                              :value="item.id"
-                              v-for="item in SFTList.consigneeList"
-                              :key="item.id"
-                            >
-                              {{ item.name }}
-                            </a-select-option>
-                          </a-select>
-                          <!-- @click="saveModel('consignee')" -->
-                          <a-button
-                            class="save-btn"
-                            type="link"
-                            size="small"
-                            pre-icon="ant-design:save-outlined"
-                          >
-                            保存
-                          </a-button>
-                        </div>
-                        <a-button
-                          class="order-btn"
-                          size="small"
-                          type="primary"
-                          @click="CopySFT('consignee', 'notifyParty')"
-                        >
-                          复制通知人
-                        </a-button>
-                      </div>
-                      <div class="mail-bottom">
-                        <a-row>
-                          <a-col :span="24">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="收货人"
-                              name="consigneeName"
-                              :labelCol="labelCol"
-                              :wrapperCol="wrapperCol"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.consigneeName" />
-                            </a-form-item>
-                          </a-col>
-                          <a-col :span="24">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="地址"
-                              name="consigneeAddress"
-                              :labelCol="labelCol"
-                              :wrapperCol="wrapperCol"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.consigneeAddress" />
-                            </a-form-item>
-                          </a-col>
-                          <a-col :span="12">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="国家"
-                              name="consigneeCountry"
-                              :labelCol="labelCol2"
-                              :wrapperCol="wrapperCol2"
-                              has-feedback
-                            >
-                              <a-select v-model:value="formState.consigneeCountry">
-                                <a-select-option
-                                  :value="item.id"
-                                  v-for="item in countryList"
-                                  :key="item.id"
-                                >
-                                  {{ item.countryName }}
-                                </a-select-option>
-                              </a-select>
-                            </a-form-item>
-                          </a-col>
-                          <a-col :span="12">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="电话"
-                              name="consigneeCountryTel"
-                              :labelCol="labelCol2"
-                              :wrapperCol="wrapperCol2"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.consigneeCountryTel" />
-                            </a-form-item>
-                          </a-col>
-                        </a-row>
-                      </div>
-                    </div>
-                  </a-col>
-                  <a-col :span="8">
-                    <div class="mail-box">
-                      <div class="title">
-                        <span>通知人信息</span>
-                        <div class="Template">
-                          <a-select
-                            v-model:value="formState.notifyPartyId"
-                            @change="
-                              (e) => {
-                                ChangeSFT(e, 'notifyParty')
-                              }
-                            "
-                          >
-                            <a-select-option
-                              :value="item.id"
-                              v-for="item in SFTList.notifyPartyList"
-                              :key="item.id"
-                            >
-                              {{ item.name }}
-                            </a-select-option>
-                          </a-select>
-                          <!-- @click="saveModel('notifyparty')" -->
-                          <a-button
-                            class="save-btn"
-                            type="link"
-                            size="small"
-                            pre-icon="ant-design:save-outlined"
-                          >
-                            保存
-                          </a-button>
+                    <a-col :span="12">
+                      <a-form-item
+                        label="温度"
+                        name="temperatureSet"
+                      >
+                        <div class="line-box">
+                          <a-input
+                            v-model:value="formState.temperatureSet"
+                            :disabled="formState.cargoid !== 'R'"
+                          />
                         </div>
-                        <a-button
-                          class="order-btn"
+                      </a-form-item>
+                    </a-col>
+                    <a-col :span="12">
+                      <a-form-item
+                        label="温度单位"
+                        name="temperatureUnit"
+                      >
+                        <a-select
                           size="small"
-                          type="primary"
-                          @click="CopySFT('notifyParty', 'consignee')"
+                          :disabled="formState.cargoid !== 'R'"
+                          :default-value="formState.temperatureUnit || 'C摄氏'"
+                          v-model:value="formState.temperatureUnit"
                         >
-                          复制收货人
-                        </a-button>
-                      </div>
-                      <div class="mail-bottom">
-                        <a-row>
-                          <a-col :span="24">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="通知人"
-                              name="notifyPartyName"
-                              :labelCol="labelCol"
-                              :wrapperCol="wrapperCol"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.notifyPartyName" />
-                            </a-form-item>
-                          </a-col>
-                          <a-col :span="24">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="地址"
-                              name="notifyPartyAddress"
-                              :labelCol="labelCol"
-                              :wrapperCol="wrapperCol"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.notifyPartyAddress" />
-                            </a-form-item>
-                          </a-col>
-                          <a-col :span="12">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="国家"
-                              name="notifyPartyCountry"
-                              :labelCol="labelCol2"
-                              :wrapperCol="wrapperCol2"
-                              has-feedback
-                            >
-                              <a-select v-model:value="formState.notifyPartyCountry">
-                                <a-select-option
-                                  :value="item.id"
-                                  v-for="item in countryList"
-                                  :key="item.id"
-                                >
-                                  {{ item.countryName }}
-                                </a-select-option>
-                              </a-select>
-                            </a-form-item>
-                          </a-col>
-                          <a-col :span="12">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="电话"
-                              name="notifyPartyCountryTel"
-                              :labelCol="labelCol2"
-                              :wrapperCol="wrapperCol2"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.notifyPartyCountryTel" />
-                            </a-form-item>
-                          </a-col>
-                        </a-row>
-                      </div>
-                    </div>
-                  </a-col>
-                  <a-col :span="24">
-                    <div class="mail-box">
-                      <div class="title">港口信息</div>
-                      <div class="mail-bottom">
-                        <a-row>
-                          <a-col :span="6">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="装货港代码"
-                              name="loadPortId"
-                              :labelCol="labelCol2"
-                              :wrapperCol="wrapperCol2"
-                              has-feedback
-                            >
-                              <a-select
-                                v-model:value="formState.loadPortId"
-                                @change="
-                                  (e) => {
-                                    PortChange(e, 'loadPort')
-                                  }
-                                "
-                              >
-                                <a-select-option
-                                  :value="item.id"
-                                  v-for="item in portList"
-                                  :key="item.id"
-                                >
-                                  {{ item.portName }}/{{ item.ediCode }}
-                                </a-select-option>
-                              </a-select>
-                            </a-form-item>
-                          </a-col>
-                          <a-col :span="6">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="装货港"
-                              name="loadPort"
-                              :labelCol="labelCol3"
-                              :wrapperCol="wrapperCol3"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.loadPort" />
-                            </a-form-item>
-                          </a-col>
-
-                          <a-col :span="6">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="卸货港代码"
-                              name="dischargePortId"
-                              :labelCol="labelCol2"
-                              :wrapperCol="wrapperCol2"
-                              has-feedback
-                            >
-                              <a-select
-                                v-model:value="formState.dischargePortId"
-                                @change="
-                                  (e) => {
-                                    PortChange(e, 'dischargePort')
-                                  }
-                                "
-                              >
-                                <a-select-option
-                                  :value="item.id"
-                                  v-for="item in portList"
-                                  :key="item.id"
-                                >
-                                  {{ item.portName }}/{{ item.ediCode }}
-                                </a-select-option>
-                              </a-select>
-                            </a-form-item>
-                          </a-col>
-                          <a-col :span="6">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="卸货港"
-                              name="dischargePort"
-                              :labelCol="labelCol3"
-                              :wrapperCol="wrapperCol3"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.dischargePort" />
-                            </a-form-item>
-                          </a-col>
-
-                          <a-col :span="6">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="收货地代码"
-                              name="deliveryPlaceId"
-                              :labelCol="labelCol2"
-                              :wrapperCol="wrapperCol2"
-                              has-feedback
-                            >
-                              <a-select
-                                v-model:value="formState.deliveryPlaceId"
-                                @change="
-                                  (e) => {
-                                    PortChange(e, 'deliveryPlace')
-                                  }
-                                "
-                              >
-                                <a-select-option
-                                  :value="item.id"
-                                  v-for="item in portList"
-                                  :key="item.id"
-                                >
-                                  {{ item.portName }}/{{ item.ediCode }}
-                                </a-select-option>
-                              </a-select>
-                            </a-form-item>
-                          </a-col>
-                          <a-col :span="6">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="收货地"
-                              name="deliveryPlace"
-                              :labelCol="labelCol3"
-                              :wrapperCol="wrapperCol3"
-                              has-feedback
-                            >
-                              <a-input v-model:value="formState.deliveryPlace" />
-                            </a-form-item>
-                          </a-col>
-                        </a-row>
-                      </div>
-                    </div>
-                  </a-col>
-                  <a-col :span="24">
-                    <div class="mail-box">
-                      <div class="title">货物信息</div>
-                      <div class="cargo-info-bottm">
-                        <div class="marks">
-                          <a-form-item
-                            class="pre-from-label"
-                            name="marks"
-                            :labelCol="{
-                              xs: { span: 24 },
-                              sm: { span: 24 },
-                              md: { span: 24 },
-                            }"
-                            :wrapperCol="{
-                              xs: { span: 24 },
-                              sm: { span: 24 },
-                              md: { span: 24 },
-                            }"
-                            has-feedback
-                          >
-                            <template #label>
-                              <span>
-                                唛头&nbsp;
-                                <!-- @click="handleOpen(1)" -->
-                                <span
-                                  style="cursor: pointer"
-                                  class="copy-btn iconfont icon-bianji"
-                                ></span>
-                              </span>
-                            </template>
-                            <a-textarea
-                              class="input-box"
-                              v-model:value="formState.marks"
-                              :auto-size="{ minRows: 7, maxRows: 7 }"
-                            />
-                          </a-form-item>
-                        </div>
-                        <div class="description">
-                          <a-form-item
-                            class="pre-from-label"
-                            name="description"
-                            :labelCol="{
-                              xs: { span: 24 },
-                              sm: { span: 24 },
-                              md: { span: 24 },
-                            }"
-                            :wrapperCol="{
-                              xs: { span: 24 },
-                              sm: { span: 24 },
-                              md: { span: 24 },
-                            }"
-                            has-feedback
-                          >
-                            <template #label>
-                              <span>
-                                货物描述&nbsp;
-                                <!-- @click="handleOpen(2)" -->
-                                <span
-                                  style="cursor: pointer"
-                                  class="copy-btn iconfont icon-bianji"
-                                ></span>
-                              </span>
-                            </template>
-                            <a-textarea
-                              class="input-box"
-                              v-model:value="formState.description"
-                              :auto-size="{ minRows: 7, maxRows: 7 }"
-                            />
-                          </a-form-item>
-                        </div>
-                        <div class="right">
-                          <a-row>
-                            <a-col :span="12">
-                              <a-form-item
-                                class="pre-from-label"
-                                label="货物标识"
-                                :labelCol="labelCol2"
-                                :wrapperCol="wrapperCol2"
-                                has-feedback
-                                name="cargoid"
-                              >
-                                <a-select v-model:value="formState.cargoid">
-                                  <a-select-option value="S">S 普通货</a-select-option>
-                                  <a-select-option value="R">R 冻柜</a-select-option>
-                                  <a-select-option value="D">D 危险品</a-select-option>
-                                  <a-select-option value="O">O 超限箱</a-select-option>
-                                </a-select>
-                              </a-form-item>
-                            </a-col>
-                          </a-row>
-                          <a-row>
-                            <a-col :span="12">
-                              <a-form-item
-                                class="pre-from-label"
-                                label="包装"
-                                :labelCol="labelCol2"
-                                :wrapperCol="wrapperCol2"
-                                has-feedback
-                                name="kindPkgs"
-                              >
-                                <a-select v-model:value="formState.kindPkgs">
-                                  <a-select-option
-                                    v-for="item in kindPkgsList"
-                                    :key="item.id"
-                                    :value="item.id"
-                                  >
-                                    {{ item.packageName }}
-                                  </a-select-option>
-                                </a-select>
-                              </a-form-item>
-                            </a-col>
-                            <a-col :span="12">
-                              <a-form-item
-                                class="pre-from-label"
-                                label="温度"
-                                :labelCol="labelCol2"
-                                :wrapperCol="wrapperCol2"
-                                has-feedback
-                                name="temperatureSet"
-                              >
-                                <div class="line-box">
-                                  <a-input
-                                    v-model:value="formState.temperatureSet"
-                                    :disabled="formState.cargoid !== 'R'"
-                                  />
-                                </div>
-                              </a-form-item>
-                            </a-col>
-                            <a-col :span="12">
-                              <a-form-item
-                                class="pre-from-label"
-                                label="温度单位"
-                                :labelCol="labelCol2"
-                                :wrapperCol="wrapperCol2"
-                                has-feedback
-                                name="temperatureUnit"
-                              >
-                                <a-select
-                                  size="small"
-                                  :disabled="formState.cargoid !== 'R'"
-                                  :default-value="formState.temperatureUnit || 'C摄氏'"
-                                  v-model:value="formState.temperatureUnit"
-                                >
-                                  <a-select-option value="C"> C摄氏 </a-select-option>
-                                  <a-select-option value="F"> F华氏 </a-select-option>
-                                </a-select>
-                              </a-form-item>
-                            </a-col>
-                            <a-col :span="12">
-                              <a-form-item
-                                class="pre-from-label"
-                                label="通风"
-                                :labelCol="labelCol2"
-                                :wrapperCol="wrapperCol2"
-                                has-feedback
-                                name="reeferQuantity"
-                              >
-                                <div class="line-box">
-                                  <a-input
-                                    v-model:value="formState.reeferQuantity"
-                                    :disabled="formState.cargoid !== 'R'"
-                                  />
-                                </div>
-                              </a-form-item>
-                            </a-col>
-                            <a-col :span="12">
-                              <a-form-item
-                                class="pre-from-label"
-                                label="CLASS"
-                                :labelCol="labelCol2"
-                                :wrapperCol="wrapperCol2"
-                                has-feedback
-                                name="dangerClass"
-                              >
-                                <div class="line-box">
-                                  <a-input
-                                    v-model:value="formState.dangerClass"
-                                    :disabled="formState.cargoid !== 'D'"
-                                  />
-                                </div>
-                              </a-form-item>
-                            </a-col>
-                            <a-col :span="12">
-                              <a-form-item
-                                class="pre-from-label"
-                                label="UN NO"
-                                :labelCol="labelCol2"
-                                :wrapperCol="wrapperCol2"
-                                has-feedback
-                                name="dangerNo"
-                              >
-                                <div class="line-box">
-                                  <a-input
-                                    v-model:value="formState.dangerNo"
-                                    :disabled="formState.cargoid !== 'D'"
-                                  />
-                                </div>
-                              </a-form-item>
-                            </a-col>
-                            <a-col :span="12">
-                              <a-form-item
-                                class="pre-from-label"
-                                label="联系人"
-                                :labelCol="labelCol2"
-                                :wrapperCol="wrapperCol2"
-                                has-feedback
-                                name="dangerAttn"
-                              >
-                                <div class="line-box">
-                                  <a-input
-                                    v-model:value="formState.dangerAttn"
-                                    :disabled="formState.cargoid !== 'D'"
-                                  />
-                                </div>
-                              </a-form-item>
-                            </a-col>
-                            <a-col :span="12">
-                              <a-form-item
-                                class="pre-from-label"
-                                label="联系电话"
-                                :labelCol="labelCol2"
-                                :wrapperCol="wrapperCol2"
-                                has-feedback
-                                name="dangerTel"
-                              >
-                                <div class="line-box">
-                                  <a-input
-                                    v-model:value="formState.dangerTel"
-                                    :disabled="formState.cargoid !== 'D'"
-                                  />
-                                </div>
-                              </a-form-item>
-                            </a-col>
-                          </a-row>
-                        </div>
-                      </div>
-                    </div>
-                  </a-col>
-                  <a-col :span="24">
-                    <div class="mail-box">
-                      <div class="title">备注信息</div>
-                      <div class="remarks-bottom">
-                        <a-row>
-                          <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
-                            <a-form-item
-                              class="pre-from-label"
-                              label="备注"
-                              :labelCol="{
-                                xs: { span: 24 },
-                                sm: { span: 8 },
-                                md: { span: 1 },
-                              }"
-                              :wrapperCol="{
-                                xs: { span: 24 },
-                                sm: { span: 15 },
-                                md: { span: 23 },
-                              }"
-                              has-feedback
-                              name="remark"
-                            >
-                              <!-- <inputView
-                                type="remarks"
-                                :parentVal="orderDetails.remarks"
-                                @getInputChange="inputChange"
-                              /> -->
-                              <a-input v-model:value="formState.remark" />
-                            </a-form-item>
-                          </a-col>
-                        </a-row>
-                      </div>
-                    </div>
-                  </a-col>
-                  <a-col :span="24">
-                    <div class="mail-box">
-                      <div class="title">集装箱信息</div>
-                      <div class="ctn-btn">
-                        <div class="btn" @click="addCtn">
-                          <i class="iconfont icon-icon_tianjia"></i><span>新建</span>
-                        </div>
-                        <!-- @click="copyCtn" -->
-                        <div class="btn" @click="CopyAddCtn">
-                          <i class="iconfont icon-fuzhi2"></i><span>复制新建</span>
+                          <a-select-option value="C"> C摄氏 </a-select-option>
+                          <a-select-option value="F"> F华氏 </a-select-option>
+                        </a-select>
+                      </a-form-item>
+                    </a-col>
+                    <a-col :span="12">
+                      <a-form-item
+                        label="通风"
+                        name="reeferQuantity"
+                      >
+                        <div class="line-box">
+                          <a-input
+                            v-model:value="formState.reeferQuantity"
+                            :disabled="formState.cargoid !== 'R'"
+                          />
                         </div>
-                        <!-- @click="removeCtn" -->
-                        <div class="btn" @click="DelCtn">
-                          <i class="iconfont icon-shanchu1"></i><span>删除</span>
+                      </a-form-item>
+                    </a-col>
+                    <a-col :span="12">
+                      <a-form-item
+                        label="CLASS"
+                        name="dangerClass"
+                      >
+                        <div class="line-box">
+                          <a-input
+                            v-model:value="formState.dangerClass"
+                            :disabled="formState.cargoid !== 'D'"
+                          />
                         </div>
-                        <div class="import">
-                          <a-form-item
-                            class="pre-from-label"
-                            label="场站"
-                            name="yardId"
-                            :labelCol="labelCol"
-                            :wrapperCol="wrapperCol"
-                            has-feedback
-                          >
-                            <a-select v-model:value="formState.yardId" style="width: 200px">
-                              <a-select-option
-                                v-for="item in yardList"
-                                :key="item.id"
-                                :value="item.id"
-                              >
-                                {{ item.codeName }}
-                              </a-select-option>
-                            </a-select>
-                          </a-form-item>
+                      </a-form-item>
+                    </a-col>
+                    <a-col :span="12">
+                      <a-form-item
+                        label="UN NO"
+                        name="dangerNo"
+                      >
+                        <div class="line-box">
+                          <a-input
+                            v-model:value="formState.dangerNo"
+                            :disabled="formState.cargoid !== 'D'"
+                          />
                         </div>
-                        <div :style="{ textAlign: 'right' }">
-                          <span>
-                            <!-- 件数: {{ total('pkgs') }} 重量: {{ total('kgs') }} 尺码：{{total('cbm')}} -->
-                          </span>
+                      </a-form-item>
+                    </a-col>
+                    <a-col :span="12">
+                      <a-form-item
+                        label="联系人"
+                        name="dangerAttn"
+                      >
+                        <div class="line-box">
+                          <a-input
+                            v-model:value="formState.dangerAttn"
+                            :disabled="formState.cargoid !== 'D'"
+                          />
                         </div>
-                      </div>
-                      <!-- v-if="preOrderLoad" -->
-                      <div class="table-box">
-                        <hot-table ref="hotTb" :data="list" :settings="settings">
-                          <img
-                            v-show="!list.length"
-                            class="hot-tb-no-data"
-                            src="../../../../../assets/images/nodata.png"
-                            alt=""
+                      </a-form-item>
+                    </a-col>
+                    <a-col :span="12">
+                      <a-form-item
+                        label="联系电话"
+                        name="dangerTel"
+                      >
+                        <div class="line-box">
+                          <a-input
+                            v-model:value="formState.dangerTel"
+                            :disabled="formState.cargoid !== 'D'"
                           />
-                        </hot-table>
+                        </div>
+                      </a-form-item>
+                    </a-col>
+                  </a-row>
+                </a-col>
+              </a-row>
+            </div>
+            <div class="ds-card mt15">
+              <h4>备注信息</h4>
+              <a-row :gutter="15">
+                <a-col :span="24">
+                  <a-form-item
+                    label="备注"
+                    name="remark"
+                  >
+                    <a-input placeholder="请输入" v-model:value="formState.remark" />
+                  </a-form-item>
+                </a-col>
+              </a-row>
+            </div>
+            <div class="ds-card mt15">
+              <h4>集装箱信息</h4>
+              <div class="flex" style="justify-content: space-between;">
+                <a-form-item
+                  label="场站"
+                  name="yardId"
+                >
+                  <a-select v-model:value="formState.yardId" style="width: 200px">
+                    <a-select-option
+                      v-for="item in yardList"
+                      :key="item.id"
+                      :value="item.id"
+                    >
+                      {{ item.codeName }}
+                    </a-select-option>
+                  </a-select>
+                </a-form-item>
+                <div>
+                  <a-button type="link" @click="addCtn" class="pl0">
+                    <span class="iconfont icon-new_document"></span>
+                    新建
+                  </a-button>
+                  <a-button type="link" @click="CopyAddCtn">
+                    <span class="iconfont icon-fuzhi3"></span>
+                    复制新建
+                  </a-button>
+                  <a-button type="link" @click="DelCtn">
+                    <span class="iconfont icon-shanchu21"></span>
+                    删除
+                  </a-button>
+                </div>
+              </div>
+            </div>
+            <div>
+                <a-col :span="24">
+                  <div class="mail-box">
+                    <div class="ctn-btn">
+                      <div class="import">
+                        
                       </div>
                     </div>
-                  </a-col>
-                </a-row>
-              </div>
-            </a-form>
-          </div>
-        </a-col>
-      </a-row>
+                    <div class="table-box">
+                      <hot-table ref="hotTb" :data="list" :settings="settings">
+                        <img
+                          v-show="!list.length"
+                          class="hot-tb-no-data"
+                          src="../../../../../assets/images/nodata.png"
+                          alt=""
+                        />
+                      </hot-table>
+                    </div>
+                  </div>
+                </a-col>
+            </div>
+          </a-form>
+        </div>
+      </div>
       <a-modal
         width="50vw"
         :maskClosable="false"
@@ -1039,9 +756,9 @@
   const openPreOrderShow = ref(false)
   const id = ref()
   const labelCol = {
-    xs: { span: 24 },
-    sm: { span: 8 },
-    md: { span: 4 },
+    xs: { span: 12 },
+    sm: { span: 4 },
+    md: { span: 4 }
   }
   const wrapperCol = {
     xs: { span: 24 },
@@ -1564,491 +1281,39 @@
     init,
   })
 </script>
-<style lang="less" scoped>
-  /deep/ .ant-form-explain {
-    display: none !important;
-  }
-
-  /deep/ .ant-form-item-children-icon .anticon-check-circle {
-    display: none;
-  }
-  :deep(.right) {
-    .ant-col {
-      height: 40px;
-    }
-  }
-  :deep(.mail-bottom) {
-    .ant-col {
-      height: 40px;
-    }
-  }
-  :deep(.ant-input) {
-    width: 100%;
-    height: 24px;
-    line-height: 24px;
-  }
-  :deep(.ant-select-selector) {
-    height: 24px !important;
-  }
-  :deep(.from-box) {
-    height: 40px;
-    .ant-form-item-control-input-content {
-      position: relative;
-      overflow: hidden;
-      width: 100%;
-      height: 100%;
-      .ant-input {
-        width: 100%;
-        height: 24px;
-        line-height: 24px;
-      }
-      .input-icon {
-        position: absolute;
-        top: 50%;
-        z-index: 2;
-        display: -webkit-box;
-        display: -ms-flexbox;
-        display: flex;
-        -webkit-box-align: center;
-        -ms-flex-align: center;
-        align-items: center;
-        color: rgba(0, 0, 0, 0.25);
-        line-height: 0;
-        -webkit-transform: translateY(-50%);
-        transform: translateY(-50%);
-        opacity: 0;
-        right: 10px;
-      }
-      &:hover {
-        .input-icon {
-          opacity: 1;
-        }
-      }
-    }
-    .date-picker {
-      height: 24px;
-    }
-  }
-</style>
-<style lang="less" scoped>
-  .pre-order {
-    padding: 20px;
-    margin-left: -15px;
-    margin-right: -3px;
-    margin-top: -8px;
-  }
-
-  .order-btn-list {
-    // margin: 0 0 10px 0;
-    .order-btn {
-      min-width: 40px;
-      height: 26px;
-      line-height: 26px;
-      padding: 0 8px;
-      font-size: 12px;
-      margin-right: 4px;
-      margin-bottom: 10px;
-      border-radius: 4px;
-    }
-  }
-
-  .top {
-    margin-top: 10px;
-    margin-bottom: 10px;
-  }
-
-  .sed-order-list {
-    background: #fff;
-    box-shadow: 0 0 10px #eee;
-    padding: 10px 20px 10px 20px;
-    // height: 100%;
-    height: calc(100vh - 340px);
-    display: flex;
-    flex-direction: column;
-    padding-top: 0px;
-    transition: 0.5s all;
-    border-radius: 4px;
-
-    .remove-btn {
-      float: right;
-      color: #f6826b;
-      display: block;
-      width: 30px;
-      text-align: center;
-      cursor: pointer;
-    }
-
-    &.show-nav {
-      width: 100%;
-      animation-name: showNav 0.6s;
-      animation-fill-mode: forwards;
-
-      .tit {
-        display: inline-block;
-        animation-name: showText 0.6s;
-        animation-fill-mode: forwards;
-      }
-
-      .sec-order {
-        display: block;
-        animation-name: showText 0.6s;
-        animation-fill-mode: forwards;
-      }
-
-      @keyframes showNav {
-        0% {
-          width: 58%;
-        }
-
-        100% {
-          width: 100%;
-        }
-      }
-
-      @keyframes showText {
-        0% {
-          opacity: 0;
-        }
-
-        75% {
-          opacity: 0;
-        }
-
-        100% {
-          opacity: 1;
-        }
-      }
-    }
-
-    &.hide-nav {
-      width: 58px;
-      animation-name: hideNav 0.6s;
-      animation-fill-mode: forwards;
-
-      .tit {
-        display: none;
-        animation-name: hideText 0.6s;
-        animation-fill-mode: forwards;
-      }
-
-      .sec-order {
-        display: none;
-        animation-name: hideText 0.6s;
-        animation-fill-mode: forwards;
-      }
-
-      @keyframes hideNav {
-        0% {
-          width: 100%;
-        }
-
-        100% {
-          width: 58px;
-        }
-      }
-
-      @keyframes hideText {
-        0% {
-          opacity: 1;
-        }
-
-        100% {
-          opacity: 0;
-        }
-      }
-    }
-
-    .sed-order-title {
-      height: 50px;
-      line-height: 50px;
-      font-weight: 600;
-      font-size: 14px;
-      color: #333;
-      border-bottom: 1px solid #eee;
-      margin-bottom: 10px;
-
-      i {
-        color: #43c673;
-        font-size: 18px;
-        line-height: 50px;
-        display: inline-block;
-        vertical-align: top;
-        margin-right: 6px;
-      }
-
-      .right {
-        float: right;
-        font-weight: 500;
-        color: #999;
-        cursor: pointer;
-      }
-    }
-
-    .order-box {
-      margin: 6px 0;
-      overflow: hidden;
-      width: 360px;
-
-      .check-btn {
-        display: inline-block;
-        vertical-align: top;
-        margin-right: 10px;
-        margin-top: 3px;
-      }
-    }
-
-    .order-label {
-      color: #999;
-      font-size: 14px;
-      text-align: left;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      cursor: pointer;
-      display: flex;
-      padding-left: 10px;
-      height: 28px;
-      line-height: 28px;
-      display: inline-block;
-      vertical-align: top;
-
-      .left {
-        flex: 1;
-
-        // float: left;
-        i.iconfont {
-          margin-right: 8px;
-        }
-
-        .tag {
-          display: inline-block;
-        }
-      }
-    }
-
-    .active {
-      color: @primary-color;
-      font-weight: 600;
-      // background: #f5f9fe;
-      // position: relative;
-      padding-right: 30px;
-
-      // &::after {
-      //   content: '';
-      //   position: absolute;
-      //   top: 0;
-      //   left: 0;
-      //   width: 100%;
-      //   height: 100%;
-      //   z-index: 0;
-      //   background: @primary-color;
-      //   opacity: 0.04;
-      // }
-      .remove-btn {
-        display: none;
-      }
-    }
-
-    .sed-order-btn {
-      margin: 20px auto;
-      width: 80%;
-      height: 40px;
-      line-height: 40px;
-      border-radius: 4px;
-      border: 1px solid @primary-color;
-      color: @primary-color;
-      text-align: center;
-      cursor: pointer;
-
-      i {
-        margin-right: 10px;
-        font-size: 16px;
-      }
-
-      &:hover {
-        background: @primary-color;
-        color: #fff;
-        -webkit-box-shadow: 0 3px 10px 3px rgba(0, 0, 0, 0.1);
-        box-shadow: 0 3px 10px 3px rgba(0, 0, 0, 0.1);
-        -webkit-user-select: 0 3px 10px 3px rgba(0, 0, 0, 0.1);
-      }
-    }
-  }
-
-  .sec-order {
-    flex: 1;
-    overflow: auto;
-
-    &::-webkit-scrollbar {
-      display: none;
-    }
-  }
-
-  /deep/ .ant-checkbox + span {
-    display: inline-block;
-  }
-
-  /deep/ .ant-checkbox-wrapper + .ant-checkbox-wrapper {
-    margin-left: 0 !important;
+<style lang="less">
+.ds-pre-order {
+  .pl0 {
+    padding-left: 0!important;
   }
-
-  .sed-order-label {
+  .pb0 {
+    padding-bottom: 0!important;
   }
-
-  .mail-box {
-    border: 1px solid #eee;
-    border-radius: 4px;
-    background: #fff;
-    box-shadow: 0 0 10px #eee;
-    padding: 0 15px 10px;
-    margin: 0 4px;
-    margin-top: 10px;
-
-    .title {
-      border-bottom: 1px solid #eee;
-      height: 36px;
-      line-height: 36px;
-      font-size: 14px;
-      font-weight: 600;
-      margin-bottom: 8px;
-      display: flex;
-      align-items: center;
-
-      > div {
-        flex: 1;
-      }
-
-      .Template {
-        flex: 3;
-        display: flex;
-        align-items: center;
-        justify-content: space-around;
-        :deep(.ant-select) {
-          flex: 1;
-        }
-      }
-
-      span {
-        flex: 1;
-      }
-    }
+  .pt0 {
+    padding-top: 0!important;
   }
-
-  .cargo-info-bottm {
-    display: flex;
-
-    .marks {
-      flex: 1;
-      padding-right: 10px;
-      :deep(.ant-form-horizontal) {
-        flex: auto;
-      }
-      :deep(.pre-from-label) {
-        display: flex;
-        flex-direction: column;
-        .ant-form-item-label {
-          text-align: left;
-          height: 30px;
-          line-height: 30px;
-        }
-        .ant-form-item-control {
-          flex: auto;
-        }
-      }
-    }
-
-    .description {
-      flex: 1;
-      padding-right: 10px;
-      :deep(.ant-form-horizontal) {
-        flex: auto;
-      }
-      :deep(.pre-from-label) {
-        display: flex;
-        flex-direction: column;
-        .ant-form-item-label {
-          text-align: left;
-          height: 30px;
-          line-height: 30px;
-        }
-        .ant-form-item-control {
-          flex: auto;
-        }
-      }
-    }
-
-    .right {
-      width: 450px;
-      padding-left: 13px;
-      margin-top: 15px;
-    }
+  .ant-modal-body .ant-form {
+    background: #ffffff;
+    padding: 0 15px;
   }
-
-  .pre-from-label {
-    margin-bottom: 0;
+  .sft-save-btn {
+    position: absolute;
+    right: -10px;
+    top: -26px;
   }
-
-  .ctn-btn {
-    vertical-align: top;
-    .import {
-      padding-top: 10px;
-    }
-    .btn {
-      display: inline-block;
-      height: 40px;
-      line-height: 40px;
-      vertical-align: top;
-      margin-right: 10px;
-      min-width: 60px;
-      text-align: center;
-      cursor: pointer;
-
-      i {
-        margin-right: 4px;
-        height: 40px;
-        line-height: 40px;
-      }
-
-      &:nth-of-type(1) {
-        color: #ff9933;
-      }
-
-      &:nth-of-type(2) {
-        color: #00cccc;
-      }
-
-      &:nth-of-type(3) {
-        color: #f6826b;
-      }
-
-      &:nth-of-type(4) {
-        color: #009966;
+  .sft-select {
+    position: absolute;
+    left: 40px;
+    top: -18px;
+    width: 90px;
+    .ant-select-selector {
+      height: 16px!important;
+      .ant-select-selection-item {
+        height: 20px;
+        position: relative;
+        top: -5px;
       }
     }
-
-    .import {
-      display: inline-block;
-      width: 254px;
-      vertical-align: top;
-    }
-  }
-
-  .line-box {
-    display: flex;
-    overflow: hidden;
-
-    span.unit {
-      font-size: 12px;
-      color: #999;
-      display: inline-block;
-      text-align: center;
-      padding-left: 5px;
-    }
-  }
-
-  .text-bold {
-    text-align: center;
-    width: 100%;
-    display: block;
   }
+}
 </style>
diff --git a/src/views/system/print/api.ts b/src/views/system/print/api.ts
index febd71cf..2e5bdf4f 100644
--- a/src/views/system/print/api.ts
+++ b/src/views/system/print/api.ts
@@ -17,10 +17,11 @@ enum Api {
   GetTenantParamDataSelectList = '/mainApi/ClientParam/GetTenantParamDataSelectList'
 }
 // 列表 (Auth)
-export function GetSysPrintTemplateList() {
+export function GetSysPrintTemplateList(data) {
   return request<DataResult>({
     url: Api.list,
-    method: 'get'
+    method: 'post',
+    data
   })
 }
 // 模块列表
diff --git a/src/views/system/print/index.vue b/src/views/system/print/index.vue
index 5fbfc65f..62e1c2b5 100644
--- a/src/views/system/print/index.vue
+++ b/src/views/system/print/index.vue
@@ -11,8 +11,8 @@
         </a-button>
         <a-spin :spinning="mloading">
           <div class="list-box">
-            <div v-for="item in modelList" :key="item.id" class="item" @click="toggleTable(item)">
-              <span class="count">{{ item.templateCount }}</span><span>{{ item.moduleName }}</span>
+            <div v-for="item in modelList" :key="item.id" class="item">
+              <span @click="toggleTable(item)"><span class="count">{{ item.templateCount }}</span><span>{{ item.moduleName }}</span></span>
               <span style="float: right" class="iconfont icon-bianji1" @click="handleEdit(item)"></span>
             </div>
             <img v-if="modelList.length == 0" src="../../../assets/images/nodata1.png" alt="">
@@ -78,10 +78,22 @@
   const [registerModal, { openModal: openModal1 }] = useModal()
   // 模版弹窗
   const [registerTemModal, { openModal: openModal2 }] = useModal()
+  const mloading = ref(false)
+  // 初始化模块数据
+  const initModel = () => {
+    mloading.value = true
+    GetPrintModuleList().then(res => {
+      modelList.value = res.data
+      mloading.value = false
+    }).catch(() => {
+      mloading.value = false
+    })
+  }
+  initModel()
   // 模块列表
   const modelList = ref([])
-  const mloading = ref(false)
   const [registerTable, { reload, getForm, getPaginationRef }] = useTable({
+    title: "打印模版列表",
     api: async (p) => {
       const res: API.DataResult = await GetSysPrintTemplateList(p)
       return new Promise((resolve) => {
@@ -90,9 +102,13 @@
     },
     beforeFetch: (p) => {
       if (modalId) {
-        p['id'] = modalId
+        const condition = {
+          FieldName: 'modalId',
+          FieldValue: modalId,
+          ConditionalType: 1
+        }
+        p['queryCondition'] = JSON.stringify(condition)
       }
-      initModel()
       return formatParams(p)
     },
     columns,
@@ -115,16 +131,6 @@
       fixed: 'right',
     },
   })
-  // 初始化模块数据
-  const initModel = () => {
-    mloading.value = true
-    GetPrintModuleList().then(res => {
-      modelList.value = res.data
-      mloading.value = false
-    }).catch(() => {
-      mloading.value = false
-    })
-  }
   // 添加模块
   function handleCreate() {
     openModal1(true, {
@@ -180,6 +186,9 @@
   .opt {
     padding: 10px;
   }
+  .vben-basic-table-title {
+    justify-content: space-between;
+  }
   .list-box {
     border: 1px solid #E8EBED;
     border-radius: 2px;