diff --git a/src/design/public.less b/src/design/public.less
index aec647b3..0727729e 100644
--- a/src/design/public.less
+++ b/src/design/public.less
@@ -135,7 +135,7 @@ h5 {
 }
 
 .ds-detail-box {
-  margin: 0 0 0 20px;
+  margin: 0 20px;
 }
 
 .flex {
diff --git a/src/views/baseinfo/formset/index.vue b/src/views/baseinfo/formset/index.vue
index 652798bf..211f7f7a 100644
--- a/src/views/baseinfo/formset/index.vue
+++ b/src/views/baseinfo/formset/index.vue
@@ -88,6 +88,7 @@
   // 任务状态字典
   const taskTypeDict = ref([])
   getDictOption('SeaTaskType').then((res) => {
+    res.unshift({ label: '默认', value: 'NORMAL' })
     taskTypeDict.value = res
   })
   const [registerModal, { openModal }] = useModal()
diff --git a/src/views/finance/paymentSettlement/api.ts b/src/views/finance/paymentSettlement/api.ts
index 2962b2dc..1296c0f0 100644
--- a/src/views/finance/paymentSettlement/api.ts
+++ b/src/views/finance/paymentSettlement/api.ts
@@ -9,8 +9,10 @@ import { DataResult, PageRequest } from '/@/api/model/baseModel'
 enum Api {
   list = '/feeApi/PaymentSettlement/GetList',
   edit = '/mainApi/MappingYard/EditMappingYard',
-  info = '/mainApi/MappingYard/GetMappingYardInfo',
-  delete = '/mainApi/MappingYard/BatchDelMappingYard'
+  info = '/feeApi/PaymentSettlement/Get',
+  delete = '/mainApi/MappingYard/BatchDelMappingYard',
+  GetApplicationList = '/feeApi/PaymentSettlement/GetApplicationList',
+  GetApplicationDetailsById = '/feeApi/PaymentSettlement/GetApplicationDetailsById'
 }
 // 列表 (Auth)
 export function GetList(data: PageRequest) {
@@ -29,11 +31,11 @@ export function EditMappingYard(data: PageRequest) {
   })
 }
 // 详情 (Auth)
-export function GetMappingYardInfo(query) {
+export function Get(params) {
   return request<DataResult>({
     url: Api.info,
     method: 'get',
-    params: query
+    params
   })
 }
 
@@ -44,4 +46,21 @@ export function BatchDelMappingYard(data: PageRequest) {
     method: 'post',
     data
   })
-}
\ No newline at end of file
+}
+
+// 付费申请通过列表
+export function GetApplicationList(data: PageRequest) {
+  return request<DataResult>({
+    url: Api.GetApplicationList,
+    method: 'post',
+    data
+  })
+}
+
+export function GetApplicationDetailsById(params) {
+  return request<DataResult>({
+    url: Api.GetApplicationDetailsById,
+    method: 'get',
+    params
+  })
+}
diff --git a/src/views/finance/paymentSettlement/detail/columns.tsx b/src/views/finance/paymentSettlement/detail/columns.tsx
new file mode 100644
index 00000000..b6c52c41
--- /dev/null
+++ b/src/views/finance/paymentSettlement/detail/columns.tsx
@@ -0,0 +1,528 @@
+/*
+ * @Description: 费用代码设置tsx
+ * @Author: lijj
+ * @Date: 2024-04-25 15:48:33
+ */
+import { ref, h, ComponentOptions, resolveComponent } from 'vue'
+import { BasicColumn, FormSchema } from '/@/components/Table'
+import { useOptionsStore } from '/@/store/modules/options'
+const optionsStore = useOptionsStore()
+import { useRoute } from 'vue-router'
+const route = useRoute()
+import { GetClientListByCode, getOrgList, GetClientBank, GetFeeCurrencySelectList } from '/@/api/common'
+// 引入字典数据
+import { getDictOption } from '/@/utils/dictUtil'
+import { placeholderSign } from 'element-plus/es/components/table-v2/src/private'
+
+// 业务表格列
+export const businessColumns: BasicColumn[] = [
+  {
+    title: '申请单号',
+    dataIndex: 'applicationNO',
+    width: 120,
+    align: 'left'
+  },
+  {
+    title: '状态',
+    dataIndex: 'statusText',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: '结算单位',
+    dataIndex: 'customerName',
+    width: 120,
+    align: 'left'
+  },
+  {
+    title: '客户银行',
+    dataIndex: 'customerBankName',
+    width: 120,
+    align: 'left'
+  },
+  {
+    title: '银行账号',
+    dataIndex: 'customerAccount',
+    width: 120,
+    align: 'left'
+  },
+  {
+    title: 'RMB申请金额',
+    dataIndex: 'amountRMB',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: 'RMB未结金额',
+    dataIndex: 'unSettledRMB',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: 'RMB本次结算',
+    dataIndex: 'settlementRMB',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: 'USD申请金额',
+    dataIndex: 'amountUSD',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: 'USD未结金额',
+    dataIndex: 'unSettledUSD',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: 'USD本次结算',
+    dataIndex: 'settlementUSD',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: '申请日期',
+    dataIndex: 'createTime',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: '申请人',
+    dataIndex: 'createByName',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: '申请支付日期',
+    dataIndex: 'paymentDate',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: '结算方式',
+    dataIndex: 'settlementTypeName',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: '审核实付金额',
+    dataIndex: 'payAmount',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: '审核时间',
+    dataIndex: 'auditTime',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: '审核人',
+    dataIndex: 'auditerName',
+    width: 100,
+    align: 'left'
+  },
+  {
+    title: '所属分部',
+    dataIndex: 'saleDeptName',
+    width: 120,
+    align: 'left'
+  }
+]
+
+// 费用表格
+export const feeColumns: BasicColumn[] = [
+
+]
+
+export const formSchema: FormSchema[] = [
+  {
+    field: 'id',
+    label: 'id',
+    component: 'Input',
+    show: false
+  },
+  {
+    field: 'customerName',
+    label: '结算单位',
+    component: 'ApiSelect',
+    required: false,
+    dynamicDisabled: ({ values }) => {
+      return !!values.id
+    },
+    colProps: { span: 4 },
+    componentProps: ({ formModel }) => {
+      return {
+        api: GetClientListByCode,
+        labelField: 'pinYinCode',
+        valueField: 'shortName',
+        showName: 'shortName',
+        resultField: 'data',
+        immediate: false,
+        onChange: (e, obj) => {
+          if (e && obj) {
+            formModel.customerId = obj.id
+          }
+          if (!e && !obj) {
+            formModel.customerId = ''
+          }
+        },
+      }
+    }
+  },
+  {
+    label: '',
+    field: 'customerId',
+    component: 'Input',
+    show: false
+  },
+  {
+    field: 'settlementDate',
+    label: '结算日期',
+    component: 'DatePicker',
+    required: false,
+    dynamicDisabled: false,
+    colProps: { span: 4 },
+    componentProps: {
+      allowClear: true
+    }
+  },
+  {
+    label: '结算人id',
+    field: 'settlerId',
+    component: 'Input',
+    show: false,
+  },
+  {
+    label: '结算人',
+    field: 'settlerName',
+    component: 'Input',
+    required: false,
+    colProps: { span: 4 },
+    dynamicDisabled: true
+  },
+  {
+    field: 'currency',
+    label: '币别/金额',
+    component: 'Input',
+    dynamicDisabled: true,
+    colProps: { span: 4 }
+  },
+  {
+    field: 'settlementTypeId',
+    label: '结算方式',
+    component: 'ApiSelect',
+    required: false,
+    dynamicDisabled: false,
+    colProps: { span: 4 },
+    componentProps: () => {
+      return {
+        option: optionsStore.getOptionsByCode('GetClientStlModeSelectList'),
+        labelField: 'stlName',
+        valueField: 'id',
+        resultField: 'data',
+        immediate: false,
+        filterOption: (input: string, option: any) => {
+          return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+        }
+      }
+    }
+  },
+  {
+    field: 'exchangeRate',
+    label: '汇率',
+    component: 'InputNumber',
+    dynamicDisabled: true,
+    colProps: { span: 4 },
+    componentProps: {
+      min: 0,
+      precision: 6
+    }
+  },
+  {
+    field: 'line1',
+    component: 'Divider',
+    colProps: {
+      span: 24
+    }
+  },
+  {
+    field: 'customerBankName',
+    label: '客户银行',
+    component: 'ApiSelect',
+    required: false,
+    dynamicDisabled: false,
+    colProps: { span: 4 },
+    componentProps: ({ formModel }) => {
+      return {
+        api: GetClientBank,
+        params: {
+          id: formModel.customerId
+        },
+        labelField: 'bankName',
+        valueField: 'id',
+        resultField: 'data',
+        immediate: false,
+        filterOption: (input: string, option: any) => {
+          return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+        },
+        onChange: (e, obj) => {
+          console.log(obj)
+          if (e && obj) {
+            formModel.customerBankId = obj.value
+            formModel.customerAccount = obj.bankAccountNo
+          }
+          if (!e && !obj) {
+            formModel.customerBankId = null
+            formModel.customerBankName = null
+            formModel.customerAccount = null
+          }
+        }
+      }
+    }
+  },
+  {
+    field: 'customerBankId',
+    label: '',
+    component: 'Input',
+    show: false
+  },
+  {
+    field: 'customerAccount',
+    label: '银行账号',
+    component: 'Input',
+    required: false,
+    dynamicDisabled: false,
+    colProps: { span: 4 }
+  },
+  {
+    field: 'relativeNO',
+    label: '相关号码',
+    component: 'InputNumber',
+    dynamicDisabled: true,
+    colProps: { span: 4 }
+  },
+  {
+    field: 'ledgerVoucherNO',
+    label: '总账凭证号',
+    component: 'InputNumber',
+    dynamicDisabled: true,
+    colProps: { span: 4 }
+  },
+  {
+    label: '所属分部',
+    field: 'saleOrgName',
+    component: 'ApiSelect',
+    required: false,
+    colProps: { span: 4 },
+    calssName: 'saleOrgId',
+    componentProps: ({ formModel }) => {
+      return {
+        api: getOrgList,
+        labelField: 'label',
+        valueField: 'id',
+        resultField: 'data',
+        immediate: false,
+        onChange: (e, obj) => {
+          if (e && obj) {
+            formModel.saleOrgName = obj.label
+            formModel.saleOrgId = obj.id
+          }
+          if (!e && !obj) {
+            formModel.saleOrgName = null
+            formModel.saleOrgId = null
+          }
+        }
+      }
+    },
+  },
+  {
+    field: 'saleDeptId',
+    label: '',
+    component: 'Input',
+    show: false,
+  },
+  {
+    field: 'invoiceNO',
+    label: '发票号',
+    component: 'InputNumber',
+    colProps: { span: 4 },
+    componentProps: {
+      min: 0,
+      precision: 2
+    }
+  },
+  {
+    field: 'invoiceDate',
+    label: '发票日期',
+    component: 'DatePicker',
+    dynamicDisabled: false,
+    colProps: { span: 4 },
+    componentProps: {
+      showTime: true,
+      allowClear: true,
+      format: 'YYYY-MM-DD',
+      valueFormat: 'YYYY-MM-DD'
+    }
+  },
+  {
+    field: 'invoiceAmount',
+    label: '发票金额',
+    component: 'InputNumber',
+    colProps: { span: 4 },
+    componentProps: {
+      min: 0,
+      precision: 2
+    }
+  },
+//   {
+//     field: 'currency',
+//     label: '币别',
+//     component: 'ApiSelect',
+//     required: false,
+//     dynamicDisabled: ({ values }) => {
+//       return !!values.id
+//     },
+//     defaultValue: null,
+//     colProps: { span: 4 },
+//     componentProps: () => {
+//       return {
+//         option: optionsStore.getOptionsByCode('GetFeeCurrencySelectList'),
+//         labelField: 'name',
+//         valueField: 'codeName',
+//         placeholder: '原币申请',
+//         resultField: 'data',
+//         immediate: false,
+//         filterOption: (input: string, option: any) => {
+//           return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+//         }
+//       }
+//     }
+//   },
+  {
+    field: 'line2',
+    component: 'Divider',
+    colProps: {
+      span: 24
+    }
+  },
+  {
+    field: 'note',
+    label: '备注',
+    component: 'InputTextArea',
+    required: false,
+    // defaultValue: '',
+    colProps: { span: 12 },
+    componentProps: {
+      autoSize: { minRows: 3, maxRows: 3 },
+    }
+  }
+]
+export const searchFormSchema: FormSchema[] = [
+  {
+    label: '费用对象',
+    field: 'customerId',
+    component: 'ApiSelect',
+    dynamicDisabled: false,
+    colProps: { span: 4 },
+    componentProps: () => {
+      return {
+        api: GetClientListByCode,
+        labelField: 'pinYinCode',
+        showName: 'shortName',
+        valueField: 'id',
+        resultField: 'data',
+        immediate: false
+      }
+    }
+  },
+  {
+    label: '编号查询',
+    field: 'mblno:hblno:debitNo:hblno:bookingNO:customerNo',
+    component: 'Input',
+    dynamicDisabled: false,
+    colProps: { span: 4 }
+  },
+  {
+    label: '编号查询',
+    field: 'mblno:hblno:debitNo',
+    component: 'Input',
+    dynamicDisabled: false,
+    colProps: { span: 4 }
+  },
+  {
+    field: 'accountDate',
+    label: '会计期间',
+    component: 'DatePicker',
+    colProps: { span: 4 },
+    componentProps: {
+      allowClear: true,
+      valueFormat: 'YYYY-MM'
+    }
+  },
+  {
+    field: 'isInvoice',
+    label: '是否开票',
+    component: 'Select',
+    colProps: { span: 4 },
+    componentProps: {
+      options: [
+        { label: '是', value: true },
+        { label: '否', value: false }
+      ]
+    }
+  },
+  {
+    field: 'isAdvancedPay',
+    label: '是否垫付',
+    component: 'Select',
+    colProps: { span: 4 },
+    componentProps: {
+      options: [
+        { label: '是', value: true },
+        { label: '否', value: false }
+      ]
+    }
+  },
+  {
+    label: '所属分部',
+    field: 'saleOrgId',
+    component: 'ApiSelect',
+    required: false,
+    colProps: { span: 4 },
+    componentProps: () => {
+      return {
+        api: getOrgList,
+        labelField: 'label',
+        valueField: 'id',
+        resultField: 'data',
+        immediate: false
+      }
+    }
+  }
+]
+
+export const currencyFormSchema: FormSchema[] = [
+  {
+    field: 'currency',
+    label: '结算币别:',
+    defaultValue: null,
+    component: 'ApiSelect',
+    colProps: { span: 5 },
+    placeholder: '原币结算',
+    componentProps: () => {
+      return {
+        allowClear: true,
+        showSearch: true,
+        option: optionsStore.getOptionsByCode('GetFeeCurrencySelectList'),
+        labelField: 'codeName',
+        valueField: 'codeName',
+        filterOption: (input: string, option: any) => {
+          return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+        }
+      }
+    }
+  }
+]
diff --git a/src/views/finance/paymentSettlement/detail/components/applyInfo.vue b/src/views/finance/paymentSettlement/detail/components/applyInfo.vue
new file mode 100644
index 00000000..11cf6380
--- /dev/null
+++ b/src/views/finance/paymentSettlement/detail/components/applyInfo.vue
@@ -0,0 +1,193 @@
+<!--
+ * @Description: 操作管理 -> 付费申请 -> 申请明细
+ * @Author: lijj
+ * @Date: 2024-06-20 11:54:04
+-->
+<template>
+  <div class="ds-settle-apply-detail-fee-info">
+    <BasicTable @register="registerTable">
+      <template #tableTitle>
+        <div class="flex">
+          <h4>结算明细</h4>
+          <div>
+            <a-button class="ml15" type="link" @click="add">
+              <span class="iconfont icon-zengjiatianjiajiajian" :style="{ fontSize: '12px' }"></span>
+              添加
+            </a-button>
+            <a-popconfirm
+              :visible="deleteFlag"
+              title="确定要删除勾选的数据?"
+              ok-text="确定"
+              cancel-text="取消"
+              @confirm="del"
+              @cancel="cancelDel"
+              @click="checkDel"
+            >
+              <a-button type="link" >
+                <span class="iconfont icon-shanchu1" :style="{ fontSize: '12px' }"></span>
+                删除
+              </a-button>
+            </a-popconfirm>
+            <!-- <a-button style="margin-left: 100px;" type="link" @click="exportExcel">
+              <span class="iconfont icon-fujian" :style="{ fontSize: '12px' }"></span>
+              导出
+            </a-button> -->
+          </div>
+        </div>
+      </template>
+      <template #right>
+        <Divider
+          type="vertical"
+        />
+        <div class="info">
+          <feeTable
+            style="width: 350px;"
+            :tHeight="364"
+            ref="feeTabel"
+          ></feeTable>
+        </div>
+      </template>
+    </BasicTable>
+    <!-- <a-tabs v-model:activeKey="activeKey">
+      <a-tab-pane key="2" tab="费用明细">
+        <div>
+          
+        </div>
+      </a-tab-pane>
+      <a-tab-pane key="3" tab="附件上传" force-render>
+        <div style="width: 400px;">
+          <DsFile
+            ref="dsFile"
+            :id='route?.query?.id'
+          />
+        </div>
+      </a-tab-pane>
+    </a-tabs> -->
+  </div>
+</template>
+<script lang="ts" setup>
+  import { onMounted, ref, defineEmits, defineProps, watch, defineExpose } from 'vue'
+  import { BasicTable, useTable } from '/@/components/Table'
+  import { columns } from './applyInfoColumns'
+  // 引入附近上传组件
+  import DsFile from "/@/components/File/index.vue"
+  import { BatchDelMappingYard } from '../../api'
+  import { exportExcelByData } from '/@/hooks/web/common'
+  import { useMessage } from '/@/hooks/web/useMessage'
+  import feeTable from '/@/components/CostEntry/components/feeTable.vue'
+  const { createMessage } = useMessage()
+  import { useRoute } from 'vue-router'
+  const route = useRoute()
+  const emit = defineEmits(['add', 'del'])
+  const activeKey = ref('2')
+  const props = defineProps({
+    feeData: {
+      type: Array
+    },
+    // 明细统计数据
+    additionalData: {
+      type: Object,
+      default: {}
+    },
+    // 业务id
+    id: {
+      type: String
+    },
+    // 申请状态
+    status: {
+      type: [String, Number]
+    }
+  })
+  const [registerTable, { reload, setTableData, getSelectRows, getColumns }] = useTable({
+    title: '',
+    columns,
+    isTreeTable: false,
+    pagination: false,
+    striped: false,
+    useSearchForm: false,
+    showTableSetting: true,
+    bordered: true,
+    showIndexColumn: true,
+    canResize: true,
+    resizeHeightOffset: 15,
+    rowSelection: { type: 'checkbox' },
+    immediate: false,
+    id: '1'
+  })
+  // 添加明细
+  const add = () => {
+    emit('add')
+  }
+  const deleteFlag = ref(false)
+  // 删除
+  const del = () => {
+    const ids = getSelectRows().map(res => {
+      return res.id
+    })
+    const postData = {
+      id: props.id,
+      ids
+    }
+    deleteFlag.value = false
+    BatchDelMappingYard(postData).then(res => {
+      if (res.succeeded) {
+        createMessage.success('删除成功！')
+        emit('del')
+      }
+    })
+  }
+  // 导出
+  const exportExcel = () => {
+    exportExcelByData(props.feeData, getColumns(), '费用明细')
+  }
+  // 取消删除
+  const cancelDel = () => {
+    deleteFlag.value = false
+  }
+  // 校验是否选中行
+  const checkDel = () => {
+    if (props.status != 0) {
+      return createMessage.warning('只能删除申请状态为[未提交]的数据，请重新选择！')
+    }
+    deleteFlag.value = true
+  }
+  watch(
+    () => props.feeData,
+    (list) => {
+      if (list && list.length) {
+        list.forEach(item => {
+          if (item.amount) item.amount = item.amount.toLocaleString()
+          if (item.originalAmount) item.originalAmount = item.originalAmount.toLocaleString()
+        })
+      }
+      setTableData([...list])
+    }
+  )
+  onMounted(() => {
+    //初始化
+    reload()
+  })
+  defineExpose({
+    reload
+  })
+</script>
+
+<style lang="less">
+.ds-settle-apply-detail-fee-info {
+  h4 {
+    margin-bottom: 0;
+  }
+  .flex {
+    align-items: center;
+  }
+  .items-center {
+    justify-content: space-between;
+  }
+  .vben-basic-table .ant-table-wrapper {
+    padding: 0;
+    .ant-table-title {
+      padding: 4px 0;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/finance/paymentSettlement/detail/components/applyInfoColumns.tsx b/src/views/finance/paymentSettlement/detail/components/applyInfoColumns.tsx
new file mode 100644
index 00000000..199e1925
--- /dev/null
+++ b/src/views/finance/paymentSettlement/detail/components/applyInfoColumns.tsx
@@ -0,0 +1,106 @@
+/*
+ * @Author: lijingjia lijj_xl@163.com
+ * @Date: 2024-06-21 16:59:01
+ * @Description: 
+ */
+import { commentProps } from 'ant-design-vue/lib/comment'
+import { BasicColumn, FormSchema } from '/@/components/Table'
+export const columns: BasicColumn[] = [
+  {
+    title: '委托编号',
+    dataIndex: 'customerNo',
+    width: 120,
+  },
+  {
+    title: '主提单号',
+    dataIndex: 'mblno',
+    width: 120,
+  },
+  {
+    title: '委托单位',
+    dataIndex: 'customerName',
+    width: 140,
+  },
+  {
+    title: '开船日期',
+    dataIndex: 'etd',
+    width: 90,
+  },
+  {
+    title: '业务来源',
+    dataIndex: 'sourceName',
+    width: 120,
+  },
+  {
+    title: '费用名称',
+    dataIndex: 'feeName',
+    width: 150,
+  },
+  {
+    title: '收付',
+    dataIndex: 'feeType',
+    width: 80,
+    customRender: ({ text }) => {
+      if (text === 1) {
+        return '应收'
+      } else if (text === 2) {
+        return '应付'
+      }
+      return text
+    },
+  },
+  {
+    title: '费用对象',
+    dataIndex: 'customerName',
+    width: 110,
+  },
+  {
+    title: '申请金额',
+    dataIndex: 'amount',
+    width: 100,
+  },
+  {
+    title: '原始币别',
+    dataIndex: 'originalCurrency',
+    width: 100,
+  },
+//   {
+//     title: '原始汇率',
+//     dataIndex: 'originalCurrency',
+//     width: 200,
+//   },
+  {
+    title: '折算汇率',
+    dataIndex: 'exchangeRate',
+    width: 100,
+  },
+  {
+    title: '原始金额',
+    dataIndex: 'originalAmount',
+    width: 100,
+  },
+//   {
+//     title: '进项/销项税率',
+//     dataIndex: 'originalCurrency',
+//     width: 200,
+//   },
+  {
+    title: '揽货人',
+    dataIndex: 'note',
+    width: 110,
+  },
+  {
+    title: '所属分部',
+    dataIndex: 'createTime',
+    width: 120,
+  },
+]
+
+export const searchFormSchema: FormSchema[] = [
+  {
+    field: 'CountryName',
+    label: '国家名称',
+    component: 'Input',
+    colProps: { span: 6 }
+  }
+]
diff --git a/src/views/finance/paymentSettlement/detail/components/businessTable.vue b/src/views/finance/paymentSettlement/detail/components/businessTable.vue
new file mode 100644
index 00000000..155e9ea7
--- /dev/null
+++ b/src/views/finance/paymentSettlement/detail/components/businessTable.vue
@@ -0,0 +1,388 @@
+<!--
+ * @Author: lijingjia lijj_xl@163.com
+ * @Date: 2024-06-24 10:08:36
+ * @Description: 
+-->
+<template>
+  <div id="ds-fee-info-table" class="ds-bus-table">
+    <a-spin :spinning="loading">
+      <BasicTable
+        class="ds-table-detail"
+        :canRowSelect="true"
+        :scroll="{ x: '100%', y: 400 }"
+        :row-selection="{ selectedRowKeys: state.historyRowKeys, onChange: historyChange }"
+        rowKey="idIndex"
+        @register="registerTable"
+        @row-click="onRowClick"
+      >
+        <template #toolbar>
+          <div class="flex" style="width: 100%;">
+            <h4 style="width: 80px;">结算明细</h4>
+            <a-button class="ml15" type="link" @click="addInfos">
+              <span class="iconfont icon-zengjiatianjiajiajian" :style="{ fontSize: '12px' }"></span>
+              添加到结算明细
+            </a-button>
+            <BasicForm
+              class="currency-form"
+              @register="registerForm"
+              :label-col="{ span: 7 }"
+              :wrapper-col="{ span: 17 }"
+            />
+          </div>
+        </template>
+        <template #right>
+          <Divider
+            type="vertical"
+          />
+          <feeTable
+            ref="feeTabel"
+          ></feeTable>
+        </template>
+      </BasicTable>
+      <!-- <div class="info">
+        <div>
+          <a-button @click="save" type="link">增加申请费用明细</a-button>
+        </div>
+        <feeTable
+          ref="feeTabel"
+        ></feeTable>
+      </div> -->
+    </a-spin>
+    <!-- 汇率换算组件 -->
+    <ExchangeRate
+      ref="exchangeRate"
+      @submit="saveExchangeRate"
+    ></ExchangeRate>
+  </div>
+</template>
+<script lang="ts" setup>
+  import { onMounted, ref, reactive, watch, defineExpose, defineProps, defineEmits, h } from 'vue'
+  import { BasicTable, useTable } from '/@/components/Table'
+  import { GetApplicationList } from '../../api'
+  import { businessColumns, searchFormSchema, currencyFormSchema } from '../columns'
+  import feeTable from './feeTable.vue'
+  import { BasicForm, useForm } from '/@/components/Form'
+  import ExchangeRate from '/@/views/operation/paidApply/detail/components/exchangeRate.vue'
+  // 引入提示信息
+  import { useMessage } from '/@/hooks/web/useMessage'
+  import { Divider } from 'ant-design-vue'
+  import { formatParams } from '/@/hooks/web/common'
+  const emit = defineEmits(['save', 'refresh'])
+  const { createMessage } = useMessage()
+  const props = defineProps({
+    // 表单数据
+    formData: {
+      type: Object,
+      default: {}
+    },
+    // 设置表单数据
+    setFieldsValue: {
+      type: Function
+    }
+  })
+  // 未收rmb
+  const rrmb = ref(0)
+  // 未付rmb
+  const prmb = ref(0)
+  // 未收usd
+  const rusd = ref(0)
+  // 未付usd
+  const pusd = ref(0)
+  // 未收其他
+  const rother = ref(0)
+  // 未付其他
+  const pother = ref(0)
+  const loading = ref(false)
+  const [registerTable, { reload, getForm, getSelectRowKeys, getPaginationRef, getSelectRows, setSelectedRows, getDataSource }] = useTable({
+    api: async (p) => {
+      const res = await GetApplicationList(p)
+      res.data.forEach((item, index) => {
+        item['idIndex'] = item.id + index
+      })
+      if (res?.data?.length) state.historyRowKeys = [res.data[0].id + 0]
+      setSelectedRows([res.data[0]])
+      return new Promise((resolve) => {
+        resolve({ data: [...res.data], total: res.count })
+      })
+    },
+    beforeFetch: (p) => {
+      return formatParams(p)
+    },
+    columns: businessColumns,
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+      // 是否显示高级查询(默认否)
+      useAdvancedSearch: true
+    },
+    isTreeTable: false,
+    pagination: true,
+    striped: false,
+    useSearchForm: true,
+    showTableSetting: false,
+    bordered: true,
+    showIndexColumn: false,
+    canResize: false,
+    immediate: false
+  })
+  const [registerForm, { updateSchema, getFieldsValue, setFieldsValue }] = useForm({
+    labelWidth: 150,
+    schemas: currencyFormSchema,
+    showActionButtonGroup: false
+  })
+  // 费用信息已选项
+  const state = reactive({
+    historyRowKeys: []
+  })
+  // 找出2个数组不同的元素
+  const findDifferentElements = (arr1, arr2) => {
+    return [
+      ...arr1.filter(item => !arr2.includes(item)),
+      ...arr2.filter(item => !arr1.includes(item))
+    ]
+  }
+  // 根据选择的业务id存储费用数据
+  const allFeeData = {}
+  const feeTabel = ref(null)
+  const historyChange = async (v) => {
+    console.log(v)
+    if (v.length > 1) {
+      const a = getDataSource().filter(item => {
+        return item.id == v[0]
+      })[0]
+      const b = getDataSource().filter(item => {
+        return item.id == v[v.length - 1]
+      })[0]
+      if (a.customerId != b.customerId) {
+        return createMessage.warning('请选择结算对象一致的数据！')
+      }
+    }
+    state.historyRowKeys = v
+  }
+  // 行点击事件
+  const onRowClick = (record) => {
+    state.historyRowKeys = [record?.idIndex]
+    setSelectedRows([record])
+  }
+  const feeData = () => {
+    return feeTabel.value.selectfeeData
+  }
+  // 保存费用表格数据
+  const feeTableData = ref([])
+  // 币别换算弹窗
+  const exchangeRate = ref(null)
+  // 添加申请费用明细
+  const save = () => {
+    // 费用表数据
+    // feeTableData.value = feeTabel.value.selectfeeData
+    // if (feeTableData.value.length == 0) {
+    //   return createMessage.warning('请选择要申请的费用明细！')
+    // }
+    // feeTableData.value.forEach((item: any) => {
+    //   item.id = 0
+    // })
+    // // 主单是否有结算单位
+    // const customer = props.formData?.customerId
+    // let cflag = true
+    // // 主单是否有币别
+    // const currency = getFieldsValue().currency
+    // // 业务主表数据
+    // const mData = getSelectRows()
+    // mData.forEach(item => {
+    //   if (item.customerId == customer) {
+    //     cflag = false
+    //   }
+    // })
+    // if (customer && cflag) {
+    //   // 主单有结算单位
+    //   return createMessage.warning('结算对象与付费申请客户不一致,不能添加此费用明细!')
+    // }
+    // if (currency) {
+    //   // 汇率换算申请
+    //   let currencyList = []
+    //   // 过滤出所有跟业务币别不一致的币别
+    //   feeTableData.value.forEach((item: any) => {
+    //     if (item.currency != currency) {
+    //       currencyList.push({
+    //         currency: item.currency,
+    //         feeType: item.feeType,
+    //         // 正向汇率
+    //         value: null,
+    //         // 逆向汇率
+    //         value1: null
+    //       })
+    //     }
+    //   })
+    //   currencyList = Array.from(new Set(currencyList.map(item => item.currency))).map(currency => {
+    //     return currencyList.find(item => item.currency === currency)
+    //   })
+    //   // 币别不同触发换算
+    //   exchangeRate.value.init(currency, currencyList)
+    // } else {
+    //   // 原币申请
+    //   emit('save', feeTableData.value)
+    // }
+  }
+  // 保存填写汇率并提交
+  const saveExchangeRate = (list) => {
+    feeTableData.value.forEach(row => {
+      list.forEach(item => {
+        if (row.currency == item.currency) {
+          row.exchangeRate = item.value
+        }
+      })
+    })
+    emit('save', feeTableData.value)
+  }
+  // 按业务添加费用申请
+  const addInfos = () => {
+    const selectRows = getSelectRows()
+    if (props.formData.customerId) {
+      let flag = false
+      selectRows.forEach(item => {
+        if (item.customerId == props.formData.customerId) {
+          flag = true
+        }
+      })
+      if (!flag) {
+        return createMessage.warning('没有选择要添加的业务!')
+      } 
+    } else {
+      if (state.historyRowKeys.length == 0 ) {
+        return createMessage.warning('没有选择要添加的业务!')
+      }
+    }
+    if (!props.formData.currency) {
+      // 原币申请
+      const postData = {
+        description: '按业务增加添加费用明细',
+        application: {
+          id: 0,
+          customerId: selectRows[0]?.customerId
+        },
+        items: [{
+          id: selectRows[0]?.id,
+          businessType: selectRows[0]?.businessType,
+          customerId: selectRows[0]?.customerId
+        }]
+      }
+      // loading.value = true
+      // BizSave(postData).then(res => {
+      //   loading.value = false
+      //   if (res.succeeded) {
+      //     createMessage.success('增加成功！')
+      //     emit('refresh')
+      //   }
+      // })
+    } else {
+      // 转换汇率申请
+      // 合并所有选择过的费用明细
+      let feeList = []
+      for(var key in allFeeData) {
+        feeList = [...feeList, ...allFeeData[key]]
+      }
+      // 汇率换算申请
+      let currencyList = []
+      // 过滤出所有跟业务币别不一致的币别
+      feeList.forEach((item, index) => {
+        if (item.currency != props.formData.currency) {
+          currencyList.push({
+            currency: item.currency,
+            feeType: item.feeType,
+            // 正向汇率
+            value: null,
+            // 逆向汇率
+            value1: null
+          })
+        }
+      })
+      currencyList = Array.from(new Set(currencyList.map(item => item.currency))).map(currency => {
+        return currencyList.find(item => item.currency === currency)
+      })
+      // 币别不同触发换算
+      feeTableData.value = feeList
+      exchangeRate.value.init(props.formData.currency, currencyList)
+    }
+  }
+  watch(
+    () => state.historyRowKeys, (v, old) => {
+    // 勾选前后同的id
+    const diffIds = findDifferentElements(v, old)
+  })
+
+  onMounted(async () => {
+    // 如果存在结算对象，则业务数据根据结算对象进行过滤
+    if (props.formData?.customerId) {
+      await getForm().setFieldsValue({ 'customerId': props.formData.customerId })
+      setFieldsValue({
+        currency: props.formData.currency
+      })
+      updateSchema({
+        field: 'currency',
+        dynamicDisabled: true
+      })
+      //初始化
+      reload()
+    } else {
+      //初始化
+      reload()
+    }
+  })
+  defineExpose({
+    feeData
+  })
+</script>
+
+<style lang="less">
+.ds-bus-table {
+  .ant-table-container {
+    height: 400px;
+  }
+  .ant-table-body {
+    height: 364px!important;
+  }
+  .flex {
+    align-items: center;
+    h4 {
+      margin-bottom: 0;
+    }
+  }
+  .ant-divider-vertical {
+    margin: 12px 20px;
+    height: auto;
+  }
+  .vben-basic-table-header__toolbar {
+    padding: 4px;
+    justify-content: space-between;
+  }
+  .vben-basic-table {
+    padding: 0;
+  }
+  .ant-form {
+    margin-bottom: 0;
+    padding-bottom: 0;
+  }
+  #ds-fee-info-table {
+    .vben-basic-table-header__toolbar {
+      >div {
+        width: 100%!important;
+      }
+    }
+  }
+  .currency-form {
+    position: relative;
+    margin-left: 20px;
+    top: -1px;
+    width: 200px;
+    background: #ffffff!important;
+    padding-left: 0!important;
+    .ant-row {
+      width: 100%;
+    }
+    .ant-form-item {
+      width: 200px;
+      flex-direction: row!important;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/finance/paymentSettlement/detail/components/feeTable.vue b/src/views/finance/paymentSettlement/detail/components/feeTable.vue
new file mode 100644
index 00000000..8053701b
--- /dev/null
+++ b/src/views/finance/paymentSettlement/detail/components/feeTable.vue
@@ -0,0 +1,88 @@
+<!--
+ * @Description: 引入抽屉组件
+ * @Author: lijj
+ * @Date: 2024-05-07 15:19:07
+-->
+<template>
+  <a-spin :spinning="loading">
+    <BasicTable
+      style="width: 440px;"
+      class="ds-table-detail"
+      :scroll="{ x: '100%', y: 400 }"
+      @register="registerTable"
+    >
+    </BasicTable>
+  </a-spin>
+</template>
+<script lang="ts" setup>
+  import { ref, reactive, defineExpose, watch, defineProps } from 'vue'
+  // 费用信息表格
+  import { feeColumns } from '../columns'
+  // 根据记录id查询费用
+  import { GetApplicationDetailsById } from '../../api'
+  // 模版id查询费用
+  import { GetFeeTemplateDetailList } from '/@/views/fee/template/api'
+  import { BasicTable, useTable } from '/@/components/Table'
+  // 付费申请id, 根据id查费用详细信息
+  const id = ref(null)
+  const [registerTable, { reload, getForm, getSelectRowKeys, getPaginationRef, getSelectRows, setSelectedRows, getDataSource }] = useTable({
+    api: async (p) => {
+      const res = await GetApplicationDetailsById(p)
+      res.data.forEach((item, index) => {
+        item['idIndex'] = item.id + index
+      })
+      return new Promise((resolve) => {
+        resolve({ data: [...res.data], total: res.count })
+      })
+    },
+    beforeFetch: () => {
+      return { id: id.value }
+    },
+    columns: feeColumns,
+    pagination: false,
+    striped: false,
+    useSearchForm: false,
+    showTableSetting: true,
+    bordered: true,
+    showIndexColumn: false,
+    canResize: false,
+    immediate: false
+  })
+  const init = (id) => {
+    id.value = id
+    reload()
+  }
+  const loading = ref(false)
+  defineExpose({
+    init
+  })
+</script>
+
+<style lang="scss">
+  .ds-fee-table {
+    padding: 0;
+    .ant-table-cell {
+      padding: 5px 12px;
+    }
+    .count-calc {
+      background: #ffffff;
+      font-size: 12px;
+      height: 34px;
+      display: flex;
+      align-items: center;
+      .title {
+        font-size: 14px;
+        font-weight: 600;
+      }
+      .count {
+        font-size: 14px;
+        font-weight: 600;
+        color: #257AFA;
+      }
+      .ml10 {
+        background: #F5F9FC;
+        padding: 0 5px;
+      }
+    }
+  }
+</style>
\ No newline at end of file
diff --git a/src/views/finance/paymentSettlement/detail/index.vue b/src/views/finance/paymentSettlement/detail/index.vue
index 5c84faa8..2b44aa05 100644
--- a/src/views/finance/paymentSettlement/detail/index.vue
+++ b/src/views/finance/paymentSettlement/detail/index.vue
@@ -11,8 +11,7 @@
         code="sea_freight_export"
         name="hyck"
         :save="save"
-        :submit="submit"
-        :delete="deleteItem"
+        :delete="deleteRow"
         :showBtns="['create', 'save', 'delete', 'print']"
         layout="horizontal"
       ></ActionBar>
@@ -42,55 +41,76 @@
         </a-button>
       </a-dropdown> -->
     </div>
+    <div class="ds-detail-box">
+      <!-- 表单区域 -->
+      <div class="form-area">
+        <BasicForm @register="registerForm" />
+      </div>
+      <!-- 申请明细 -->
+      <div>
+        <ApplyInfo
+          ref="applyInfo"
+          :id="id"
+          :status="status"
+          :feeData="feeData"
+          @del="init"
+          @add="add"
+        ></ApplyInfo>
+      </div>
+    </div>
+    <a-modal
+      class="fee-modal"
+      v-model:visible="visible"
+      title="添加支付结算明细"
+      width="90%"
+      @ok="handleOk"
+    >
+      <!-- 业务表格 -->
+      <BusinessTable
+        v-if="visible"
+        ref="busTable"
+        :formData="getFieldsValue()"
+        :setFieldsValue="setFieldsValue"
+        @save="save"
+        @refresh="refresh"
+      ></BusinessTable>
+      <template #footer>
+        <div class="main-statistic">
+          <span>合计：</span>
+        </div>
+      </template>
+    </a-modal>
   </div>
 </template>
 <script lang="ts" setup>
-  import { onMounted } from 'vue'
+  import { ref, onMounted } from 'vue'
   import { BasicTable, useTable, TableAction } from '/@/components/Table'
+  import ApplyInfo from './components/applyInfo.vue'
   import { Divider } from 'ant-design-vue'
-  import { GetList } from '../api'
+  import { Get } from '../api'
   import { formatParams } from '/@/hooks/web/common'
-  import { columns, searchFormSchema } from '../columns'
+  // 业务表格
+  import BusinessTable from './components/businessTable.vue'
+  import { BasicForm, useForm } from '/@/components/Form'
+  import { formSchema } from './columns'
   import { useMessage } from '/@/hooks/web/useMessage'
   const { createMessage } = useMessage()
-  const [registerTable, { reload, getForm, getPaginationRef }] = useTable({
-    title: '',
-    api: async (p) => {
-      const res: API.DataResult = await GetList(p)
-      return new Promise((resolve) => {
-        resolve({ data: [...res.data], total: res.count })
-      })
-    },
-    beforeFetch: (p) => {
-      return formatParams(p)
-    },
-    columns,
-    formConfig: {
-      labelWidth: 120,
-      schemas: searchFormSchema,
-      // 是否显示高级查询(默认否)
-      useAdvancedSearch: true
-    },
-    isTreeTable: false,
-    pagination: true,
-    striped: true,
-    useSearchForm: true,
-    showTableSetting: true,
-    bordered: true,
-    showIndexColumn: true,
-    indexColumnProps: {
-      width: 60,
-    },
-    canResize: true,
-    resizeHeightOffset: 15,
-    immediate: true,
-    actionColumn: {
-      width: 80,
-      title: '操作',
-      dataIndex: 'action',
-      fixed: 'right'
-    }
+  import { useRoute } from 'vue-router'
+  const route = useRoute()
+  const [registerForm, { validate, getFieldsValue, setFieldsValue }] = useForm({
+    labelWidth: 150,
+    schemas: formSchema,
+    // readonly: route.path != '/paid-apply/create',
+    showActionButtonGroup: false
   })
+  // 当前数据id
+  const id = ref(null)
+  // 添加明细弹窗
+  const visible = ref(false)
+  // 打开弹窗添加数据
+  const add = () => {
+    visible.value = true
+  }
   // 删除
   function deleteRow() {
   }
@@ -98,20 +118,23 @@
   function exportFile() {
     
   }
-  // 编辑
-  const handleEdit = () => {
+  // 保存
+  const save = () => {
     
   }
-  // 新建
-  const create = () => {
-    go(`/payment-settlement/create`)
+  // 初始化接口
+  const init = () => {
+    id.value = route.query.id || getFieldsValue().id
+    if (id.value) {
+      // 详情页
+    } else {
+      // 新建
+    }
   }
   onMounted(() => {
-    //初始化字典选项
+    //初始化
+    init()
   })
-  function handleSuccess() {
-    reload()
-  }
   const kfz = () => {
     createMessage.warning('开发中！')
   }
@@ -131,5 +154,10 @@
     margin-top: 12px;
     background: #cccccc;
   }
+  .ant-divider-horizontal {
+    position: relative;
+    top: -10px;
+    background: #E8EBED;
+  }
 }
 </style>
\ No newline at end of file
diff --git a/src/views/operation/paidApply/detail/columns.tsx b/src/views/operation/paidApply/detail/columns.tsx
index ed573a6a..34f62eb3 100644
--- a/src/views/operation/paidApply/detail/columns.tsx
+++ b/src/views/operation/paidApply/detail/columns.tsx
@@ -3,17 +3,12 @@
  * @Author: lijj
  * @Date: 2024-04-25 15:48:33
  */
-import { ref, h, ComponentOptions, resolveComponent } from 'vue'
 import { BasicColumn, FormSchema } from '/@/components/Table'
 import { useOptionsStore } from '/@/store/modules/options'
 const optionsStore = useOptionsStore()
 import { useRoute } from 'vue-router'
 const route = useRoute()
-import { GetClientListByCode, getOrgList, GetClientBank, GetFeeCurrencySelectList } from '/@/api/common'
-// 引入字典数据
-import { getDictOption } from '/@/utils/dictUtil'
-import { placeholderSign } from 'element-plus/es/components/table-v2/src/private'
-
+import { GetClientListByCode, getOrgList, GetClientBank } from '/@/api/common'
 // 业务表格列
 export const businessColumns: BasicColumn[] = [
   {
@@ -31,7 +26,7 @@ export const businessColumns: BasicColumn[] = [
   {
     title: '结算单位',
     dataIndex: 'customerName',
-    width: 150,
+    width: 120,
     align: 'left'
   },
   {
diff --git a/src/views/operation/seaexport/detail/index.vue b/src/views/operation/seaexport/detail/index.vue
index d72b4424..ec7c18b3 100644
--- a/src/views/operation/seaexport/detail/index.vue
+++ b/src/views/operation/seaexport/detail/index.vue
@@ -99,7 +99,7 @@
                   businessType="1"
                 >
                   <span>
-                    <a-button v-repeat v-if="route.query.status != 'WAIT_ORDER_AUDIT' && route.query.source != 'Complete'" @click="completeTask(null, null)" type="primary">
+                    <a-button v-repeat v-if="route.query.status != 'WAIT_ORDER_AUDIT' && route.query.source != 'Complete'" @click="save(true)" type="primary">
                       {{ completeText }}
                     </a-button>
                   </span>
@@ -293,7 +293,7 @@
   }
   // 获取表单设置数据
   const getFormSet = (v) => {
-    GetFormSetInfoByModule({ permissionId: permissionsInfo('/BookingDetail').permissionId, formNo: 10, taskStatus: route.query.status || v }).then(res => {
+    GetFormSetInfoByModule({ permissionId: permissionsInfo('/BookingDetail').permissionId, formNo: 10, taskStatus: route.query.status || v || 'NORMAL' }).then(res => {
       const { data } = res
       if (data && data.id) {
         const content = JSON.parse(data.content).columns
@@ -308,16 +308,6 @@
             })
           }
         }
-        // 状态为审单，订舱口必填
-        // if (status == 'WAIT_ORDER_AUDIT') {
-        //   if (content && content.length) {
-        //     content.forEach(item => {
-        //       if (item.field == 'forwarder') {
-        //         item.required = true
-        //       }
-        //     })
-        //   }
-        // }
         // 状态为审单后: 船公司、起运港、卸货港、约主（约号）、交货地锁死
         if (status && status != 'WAIT_ORDER_AUDIT' && status != 'ORDER_AUDIT_REJECTED') {
           if (content && content.length) {
@@ -333,12 +323,15 @@
         RefbasicInfo.value.updateSchema(content)
         RefmailingInfo.value.updateSchemaL(content)
         RefmailingInfo.value.updateSchemaR(content)
-        if (RefcargoInfo.value) {
-          RefcargoInfo.value.updateSchema(content)
-        }
-        if (RefNoteInfo.value) {
-          RefNoteInfo.value.updateSchema(content)
-        }
+        // 搞清楚异步组件渲染后回调后替换这里
+        setTimeout(() => {
+          if (RefcargoInfo.value) {
+            RefcargoInfo.value.updateSchema(content)
+          }
+          if (RefNoteInfo.value) {
+            RefNoteInfo.value.updateSchema(content)
+          }
+        }, 1500)
       }
     })
   }
@@ -422,8 +415,8 @@
         loading.value = false
       })
   }
-  //点击保存
-  const save = async () => {
+  // 点击保存
+  const save = async (task) => {
     // 基础信息表单数据
     const baseinfoForm = await RefbasicInfo.value.validate().catch((err) => {
       createMessage.warning(err?.errorFields[0]?.errors[0])
@@ -509,7 +502,11 @@
         loading.value = false
         if (res.succeeded) {
           if (postData.id) {
-            createMessage.success('保存成功!')
+            if (!task) {
+              createMessage.success('保存成功!')
+            } else {
+              completeTask(null, null)
+            }
           } else {
             createMessage.success('新增成功!')
             id.value = res.data
@@ -901,8 +898,6 @@
   const completeTask = async (type, b) => {
     const status = route.query.status
     const { fullPath } = route //获取当前路径
-    // 提交前先保存
-    await save()
     if (status == 'ORDER_AUDIT_REJECTED') {
       SubmitAudit({
         businessId: id.value,
diff --git a/src/views/operation/seaexport/detail/modules/baseInfo.tsx b/src/views/operation/seaexport/detail/modules/baseInfo.tsx
index e707bf70..d4f889cd 100644
--- a/src/views/operation/seaexport/detail/modules/baseInfo.tsx
+++ b/src/views/operation/seaexport/detail/modules/baseInfo.tsx
@@ -2857,26 +2857,33 @@ export const personFormSchema: FormSchema[] = [
   {
     field: 'customerName',
     label: '客户名称',
-    defaultValue: null,
     component: 'ApiSelect',
+    required: false,
+    dynamicDisabled: false,
     colProps: { span: 12 },
     componentProps: ({ formModel }) => {
       return {
         api: GetClientListByCode,
         params: { code: formModel.customerType },
         labelField: 'pinYinCode',
-        showName: 'shortName',
         valueField: 'shortName',
+        showName: 'shortName',
+        resultField: 'data',
         immediate: false,
-        onChange: (v, obj) => {
-          if (obj) {
-            formModel.name = null
+        onChange: (e, obj) => {
+          if (e && obj) {
             formModel.customerId = obj.id
+            formModel.name = null
             formModel.customerContactId = null
             formModel.email = ''
             formModel.tel = ''
+          }
+          if (!e && !obj) {
+            formModel.customerId = ''
+          }
+          if (e && formModel.customerId) {
             // 设置关系人下拉
-            GetOrderContactListByClientId({ id: obj.id }).then((res) => {
+            GetOrderContactListByClientId({ id: formModel.customerId }).then((res) => {
               personList.value = res.data.map((item) => {
                 return {
                   label: item.name,
@@ -2887,10 +2894,47 @@ export const personFormSchema: FormSchema[] = [
               })
             })
           }
-        }
+        },
       }
-    }
+    },
   },
+  // {
+  //   field: 'customerName',
+  //   label: '客户名称',
+  //   defaultValue: null,
+  //   component: 'ApiSelect',
+  //   colProps: { span: 12 },
+  //   componentProps: ({ formModel }) => {
+  //     return {
+  //       api: GetClientListByCode,
+  //       params: { code: formModel.customerType },
+  //       labelField: 'pinYinCode',
+  //       showName: 'shortName',
+  //       valueField: 'shortName',
+  //       immediate: false,
+  //       onChange: (v, obj) => {
+  //         if (obj) {
+  //           formModel.name = null
+  //           formModel.customerId = obj.id
+  //           formModel.customerContactId = null
+  //           formModel.email = ''
+  //           formModel.tel = ''
+  //           // 设置关系人下拉
+  //           GetOrderContactListByClientId({ id: obj.id }).then((res) => {
+  //             personList.value = res.data.map((item) => {
+  //               return {
+  //                 label: item.name,
+  //                 value: item.id,
+  //                 email: item.email,
+  //                 mobile: item.mobile,
+  //               }
+  //             })
+  //           })
+  //         }
+  //       }
+  //     }
+  //   }
+  // },
   {
     field: 'customerId',
     label: '',