From 9b8d5f687ff4f0820763b383ea61796dc352f5ce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E5=90=8C=E6=B5=B7?=
 <14166000+zhangtonghai@user.noreply.gitee.com>
Date: Wed, 4 Sep 2024 16:31:52 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BE=80=E6=9D=A5=E5=8D=95=E4=BD=8D=20?=
 =?UTF-8?q?=E8=87=AA=E5=8A=A8=E8=B4=B9=E7=94=A8=E6=A8=A1=E6=9D=BF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Form/src/components/AdvancedSearch.vue    | 362 +++++---
 .../FeeCustTemplate/TenantAuditStepModal.vue  | 130 +++
 .../infoclient/FeeCustTemplate/api.ts         |  60 ++
 .../infoclient/FeeCustTemplate/columns.tsx    | 159 ++++
 .../infoclient/FeeCustTemplate/feeField.vue   | 878 ++++++++++++++++++
 .../infoclient/FeeCustTemplate/index.vue      | 147 +++
 .../infoclient/TenantAuditStepModal.vue       |   5 +
 .../fee/template/components/feeField.vue      |   5 +-
 8 files changed, 1601 insertions(+), 145 deletions(-)
 create mode 100644 src/views/baseinfo/infoclient/FeeCustTemplate/TenantAuditStepModal.vue
 create mode 100644 src/views/baseinfo/infoclient/FeeCustTemplate/api.ts
 create mode 100644 src/views/baseinfo/infoclient/FeeCustTemplate/columns.tsx
 create mode 100644 src/views/baseinfo/infoclient/FeeCustTemplate/feeField.vue
 create mode 100644 src/views/baseinfo/infoclient/FeeCustTemplate/index.vue

diff --git a/src/components/Form/src/components/AdvancedSearch.vue b/src/components/Form/src/components/AdvancedSearch.vue
index e9fc5082..11268ad3 100644
--- a/src/components/Form/src/components/AdvancedSearch.vue
+++ b/src/components/Form/src/components/AdvancedSearch.vue
@@ -7,12 +7,12 @@
   <!-- 高级查询 -->
   <Modal
     class="ds-modal-small ds-advanced-search-modal"
-    title="高级查询"
+    :title="props.title"
     :maskClosable="false"
     width="670px"
     :visible="modalFlag"
     @cancel="modalFlag = false"
-  > 
+  >
     <a-spin :spinning="loading">
       <div class="flex ant-form-small">
         <a-switch
@@ -24,9 +24,21 @@
           un-checked-children="且"
         />
         <div style="flex: 1">
-          <div v-for="(item, index) in queryData.conditions" class="ds-advanced-search-item flex" :key="`f-${index}`">
-            <data :style="{left: index == 0 ? '-30px' : '-15px'}" class="v-line" style="top: 21px;"></data>
-            <data v-if="index != queryData.conditions.length - 1" class="r-line r-height" style="left: -15px; top: 21px;"></data>
+          <div
+            v-for="(item, index) in queryData.conditions"
+            class="ds-advanced-search-item flex"
+            :key="`f-${index}`"
+          >
+            <data
+              :style="{ left: index == 0 ? '-30px' : '-15px' }"
+              class="v-line"
+              style="top: 21px"
+            ></data>
+            <data
+              v-if="index != queryData.conditions.length - 1"
+              class="r-line r-height"
+              style="left: -15px; top: 21px"
+            ></data>
             <a-switch
               v-model:checked="item.logicalOperator"
               checked-value="1"
@@ -36,12 +48,16 @@
               un-checked-children="且"
             />
             <div style="flex: 1; margin-left: 30px">
-              <div v-for="(row, key) in item.conditions" :key="`c-${key}`" style="margin-bottom: 6px; position: relative;">
-                <div v-if="(key != item.conditions.length - 1)" class="r-line"></div>
+              <div
+                v-for="(row, key) in item.conditions"
+                :key="`c-${key}`"
+                style="margin-bottom: 6px; position: relative"
+              >
+                <div v-if="key != item.conditions.length - 1" class="r-line"></div>
                 <div :style="{ left: key == 0 ? '-29px' : '-16px' }" class="v-line"></div>
                 <a-select
                   v-model:value="row.field"
-                  style="width: 150px; margin-right: 6px;"
+                  style="width: 150px; margin-right: 6px"
                   placeholder="查询字段"
                   @change="changeHandle($event, row)"
                 >
@@ -51,23 +67,45 @@
                 </a-select>
                 <a-select
                   v-model:value="row.operator"
-                  style="width: 90px; margin-right: 6px;"
+                  style="width: 90px; margin-right: 6px"
                   placeholder="筛选符"
                 >
-                  <a-select-option v-for="item in operatorOptions" :key="item.value" :value="item.value">
+                  <a-select-option
+                    v-for="item in operatorOptions"
+                    :key="item.value"
+                    :value="item.value"
+                  >
                     {{ item.label }}
                   </a-select-option>
                 </a-select>
-                <a-date-picker v-if="row.component == 'RangePicker'" placeholder="请选择" style="width: 150px" v-model:value="row.value" />
-                <a-input v-else v-model:value="row.value" placeholder="请输入" style="width: 150px"></a-input>
-                <span v-if="item.conditions.length != 1" @click="deleteItem(index, key)" class="iconfont icon-shanchu21"></span>
+                <a-date-picker
+                  v-if="row.component == 'RangePicker'"
+                  placeholder="请选择"
+                  style="width: 150px"
+                  v-model:value="row.value"
+                />
+                <a-input
+                  v-else
+                  v-model:value="row.value"
+                  placeholder="请输入"
+                  style="width: 150px"
+                ></a-input>
+                <span
+                  v-if="item.conditions.length != 1"
+                  @click="deleteItem(index, key)"
+                  class="iconfont icon-shanchu21"
+                ></span>
               </div>
               <div class="item-btns">
                 <a-button type="link" @click="addRow(index)">
                   <span class="iconfont icon-new_document"></span>
                   添加条件
                 </a-button>
-                <a-button v-if="queryData.conditions.length != 1" type="link" @click="deleteGroup(index)">
+                <a-button
+                  v-if="queryData.conditions.length != 1"
+                  type="link"
+                  @click="deleteGroup(index)"
+                >
                   <span class="iconfont icon-shanchuzu"></span>
                   删除整组
                 </a-button>
@@ -82,16 +120,33 @@
       添加条件组
     </a-button>
     <template #footer>
-      <a-button key="back" @click="reset">重 置</a-button>
-      <a-button key="submit" type="primary" :loading="loading" @click="search">查 询</a-button>
+      <a-button key="back" @click="cancel" v-if="!props.IsApi">取 消</a-button>
+      <a-button key="back" type="primary" ghost @click="reset">重 置</a-button>
+      <a-button key="submit" type="primary" :loading="loading" @click="search">
+        {{ props.IsApi ? '查 询' : '保 存' }}
+      </a-button>
     </template>
   </Modal>
 </template>
 <script lang="ts" setup name="AdvancedSearch">
-  import { defineComponent, PropType, ref, watchEffect, defineProps, defineEmits, defineExpose, unref, watch, reactive } from 'vue'
+  import {
+    defineComponent,
+    PropType,
+    ref,
+    watchEffect,
+    defineProps,
+    defineEmits,
+    defineExpose,
+    unref,
+    watch,
+    reactive,
+  } from 'vue'
   // 引入表格权限信息（包含id和name）
   import { permissionsInfo } from '/@/hooks/web/usePermission'
-  import { GetUserQuerySet, UpdateUserQuerySet } from '/@/views/operation/seaexport/api/BookingLedger.js'
+  import {
+    GetUserQuerySet,
+    UpdateUserQuerySet,
+  } from '/@/views/operation/seaexport/api/BookingLedger.js'
   import { Modal } from 'ant-design-vue'
   import { get, omit } from 'lodash-es'
   // 预留，后期补双语
@@ -99,15 +154,23 @@
   const props = defineProps({
     schemas: {
       type: Array,
-      default: () => ([])
-    }
+      default: () => [],
+    },
+    title: {
+      type: String,
+      default: '高级查询',
+    },
+    IsApi: {
+      type: Boolean,
+      default: true,
+    },
   })
   const emit = defineEmits(['toSearch'])
   // 弹窗开关
   const modalFlag = ref(false)
   const queryData = reactive({
-    logicalOperator: "0",
-    conditions: []
+    logicalOperator: '0',
+    conditions: [],
   })
   // 默认模版数据
   const queryOldData = reactive({
@@ -120,58 +183,58 @@
             field: null,
             operator: null,
             value: null,
-            component: ''
+            component: '',
           },
           {
             field: null,
             operator: null,
             value: null,
-            component: ''
+            component: '',
           },
           {
             field: null,
             operator: null,
             value: null,
-            component: ''
+            component: '',
           },
           {
             field: null,
             operator: null,
             value: null,
-            component: ''
-          }
-        ]
+            component: '',
+          },
+        ],
       },
       {
         logicalOperator: '1',
         conditions: [
-        {
+          {
             field: null,
             operator: null,
             value: null,
-            component: ''
+            component: '',
           },
           {
             field: null,
             operator: null,
             value: null,
-            component: ''
+            component: '',
           },
           {
             field: null,
             operator: null,
             value: null,
-            component: ''
+            component: '',
           },
           {
             field: null,
             operator: null,
             value: null,
-            component: ''
-          }
-        ]
-      }
-    ]
+            component: '',
+          },
+        ],
+      },
+    ],
   })
   // 筛选符options
   const operatorOptions = [
@@ -205,39 +268,51 @@
     },
     {
       label: '不包含',
-      value: 13
+      value: 13,
     },
   ]
   // 存储接口返回的查询条件
   const sourceData = {
     logicalOperator: '',
-    conditions: ''
+    conditions: '',
   }
   const loading = ref(false)
   // 初始化弹窗，请求高级查询数据
-  const init = () => {
+  const init = (IsApiData) => {
     modalFlag.value = true
-    loading.value = true
-    const permissionId = permissionsInfo().permissionId
-    GetUserQuerySet({ permissionId }).then(res => {
-      loading.value = false
-      const { data } = res
-      const content = JSON.parse(data?.content || '{}')
-      const source = JSON.parse(JSON.stringify(queryOldData))
-      if (content && content?.conditions?.length) {
-        // sourceData.logicalOperator = JSON.stringify(JSON.parse(content.logicalOperator))
-        // sourceData.conditions = JSON.stringify(JSON.parse(content.conditions))
-        queryData.logicalOperator = content.logicalOperator
-        queryData.conditions = content.conditions
-        // queryData.logicalOperator = source.logicalOperator
-        // queryData.conditions = source.conditions
-      } else {
-        queryData.logicalOperator = source.logicalOperator
-        queryData.conditions = source.conditions
+    if (props.IsApi) {
+      loading.value = true
+      const permissionId = permissionsInfo().permissionId
+      GetUserQuerySet({ permissionId })
+        .then((res) => {
+          loading.value = false
+          const { data } = res
+          const content = JSON.parse(data?.content || '{}')
+          const source = JSON.parse(JSON.stringify(queryOldData))
+          if (content && content?.conditions?.length) {
+            // sourceData.logicalOperator = JSON.stringify(JSON.parse(content.logicalOperator))
+            // sourceData.conditions = JSON.stringify(JSON.parse(content.conditions))
+            queryData.logicalOperator = content.logicalOperator
+            queryData.conditions = content.conditions
+            // queryData.logicalOperator = source.logicalOperator
+            // queryData.conditions = source.conditions
+          } else {
+            queryData.logicalOperator = source.logicalOperator
+            queryData.conditions = source.conditions
+          }
+        })
+        .catch(() => {
+          loading.value = false
+        })
+    } else {
+      let source = JSON.parse(JSON.stringify(queryOldData))
+      if (IsApiData) {
+        source = JSON.parse(IsApiData)
       }
-    }).catch(() => {
-      loading.value = false
-    })
+      // const source = JSON.parse(JSON.stringify(queryOldData))
+      queryData.logicalOperator = source.logicalOperator
+      queryData.conditions = source.conditions
+    }
   }
   const reset = () => {
     const source = JSON.parse(JSON.stringify(queryOldData))
@@ -248,7 +323,7 @@
   const search = () => {
     // 如果条件有变化则保存新查询条件，否则不调用接口
     // if (JSON.stringify(sourceData) != JSON.stringify(queryData)) {
-      
+
     // }
     modalFlag.value = false
     emit('toSearch', queryData)
@@ -256,11 +331,16 @@
       permissionId: permissionsInfo().permissionId,
       content: JSON.stringify(queryData),
     }
-    UpdateUserQuerySet(propsData).then(res => {})
+    if (props.IsApi) {
+      UpdateUserQuerySet(propsData).then((res) => {})
+    }
+  }
+  const cancel = () => {
+    modalFlag.value = false
   }
   const changeHandle = (e, row) => {
     row.value = null
-    props.schemas.forEach(item => {
+    props.schemas.forEach((item) => {
       if (item.field == e) {
         row.component = item.component
       }
@@ -276,7 +356,7 @@
       field: null,
       operator: null,
       value: '',
-      component: ''
+      component: '',
     })
   }
   // 删除组
@@ -285,92 +365,90 @@
   }
   // 添加组
   const addGroup = () => {
-    queryData.conditions.push(
-      {
-        logicalOperator: 'and',
-        conditions: [
-          {
-            field: null,
-            operator: null,
-            value: null,
-            component: ''
-          }
-        ]
-      }
-    )
+    queryData.conditions.push({
+      logicalOperator: 'and',
+      conditions: [
+        {
+          field: null,
+          operator: null,
+          value: null,
+          component: '',
+        },
+      ],
+    })
   }
   defineExpose({
-    init
+    init,
   })
 </script>
 
 <style lang="less">
-.ds-advanced-search-modal {
-  .ant-form-small {
-    margin-top: 15px;
-    min-height: 400px;
-  }
-  .ds-advanced-search-item {
-    position: relative;
-    margin-left: 30px;
-    padding: 10px 15px;
-    border-left: 1px solid #257AFA;
-    background: #F5F9FC;
-    margin-bottom: 20px;
-    border-radius: 2px;
-    .icon-shanchu21 {
-      margin-left: 6px;
-      color: #257AFA;
-      cursor: pointer;
+  .ds-advanced-search-modal {
+    .ant-form-small {
+      margin-top: 15px;
+      min-height: 400px;
     }
-    .item-btns {
-      text-align: right;
-      color: #257AFA;
-      .iconfont {
+    .ds-advanced-search-item {
+      position: relative;
+      margin-left: 30px;
+      padding: 10px 15px;
+      border-left: 1px solid #257afa;
+      background: #f5f9fc;
+      margin-bottom: 20px;
+      border-radius: 2px;
+      .icon-shanchu21 {
+        margin-left: 6px;
+        color: #257afa;
         cursor: pointer;
       }
-      padding-right: 18px;
+      .item-btns {
+        text-align: right;
+        color: #257afa;
+        .iconfont {
+          cursor: pointer;
+        }
+        padding-right: 18px;
+      }
+    }
+    .ds-advanced-search-item:last-child {
+      margin-bottom: 0;
+    }
+    .add-group {
+      position: absolute;
+      bottom: 16px;
+      margin-left: 65px;
+    }
+    .ant-switch {
+      background: #257afa;
+      font-weight: 600;
+    }
+    .ant-switch-checked {
+      background: #17a6a3;
+      font-weight: 600;
+    }
+    .r-line {
+      width: 0.8px;
+      height: 35px;
+      background: #cccccc;
+      display: inline-block;
+      position: absolute;
+      left: -16px;
+      top: 13px;
+    }
+    .r-line:last-child {
+      height: 10px;
+    }
+    .r-height {
+      height: calc(100% + 20px);
+    }
+    .v-line {
+      width: 30px;
+      height: 0.8px;
+      background: #cccccc;
+      display: inline-block;
+      position: absolute;
+      left: -16px;
+      top: 13px;
     }
   }
-  .ds-advanced-search-item:last-child {
-    margin-bottom: 0;
-  }
-  .add-group {
-    position: absolute;
-    bottom: 16px;
-    margin-left: 65px;
-  }
-  .ant-switch {
-    background: #257AFA;
-    font-weight: 600;
-  }
-  .ant-switch-checked {
-    background: #17A6A3;
-    font-weight: 600;
-  }
-  .r-line {
-    width: 0.8px;
-    height: 35px;
-    background: #CCCCCC;
-    display: inline-block;
-    position: absolute;
-    left: -16px;
-    top: 13px;
-  }
-  .r-line:last-child {
-    height: 10px;
-  }
-  .r-height {
-    height: calc(100% + 20px);
-  }
-  .v-line {
-    width: 30px;
-    height: 0.8px;
-    background: #CCCCCC;
-    display: inline-block;
-    position: absolute;
-    left: -16px;
-    top: 13px;
-  }
-}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/baseinfo/infoclient/FeeCustTemplate/TenantAuditStepModal.vue b/src/views/baseinfo/infoclient/FeeCustTemplate/TenantAuditStepModal.vue
new file mode 100644
index 00000000..1da08530
--- /dev/null
+++ b/src/views/baseinfo/infoclient/FeeCustTemplate/TenantAuditStepModal.vue
@@ -0,0 +1,130 @@
+<template>
+  <BasicModal
+    v-bind="$attrs"
+    :use-wrapper="true"
+    :title="getTitle"
+    width="80%"
+    @register="registerModal"
+    @ok="handleSave"
+  >
+    <!-- 费用模版表单 -->
+    <BasicForm @register="registerForm" />
+    <!-- 费用字段表格 -->
+    <FeeField ref="feeField"></FeeField>
+    <!--右下角按钮-->
+    <template #footer>
+      <a-button
+        pre-icon="ant-design:close-outlined"
+        type="warning"
+        :loading="loading"
+        ghost
+        style="margin-right: 0.8rem"
+        @click="closeModal"
+      >
+        取消
+      </a-button>
+      <a-button
+        type="success"
+        :loading="loading"
+        pre-icon="ant-design:check-outlined"
+        style="margin-right: 0.8rem"
+        @click="handleSave(false)"
+      >
+        仅保存
+      </a-button>
+      <a-button
+        pre-icon="ant-design:check-circle-outlined"
+        type="primary"
+        :loading="loading"
+        @click="handleSave(true)"
+      >
+        保存并关闭
+      </a-button>
+    </template>
+  </BasicModal>
+</template>
+<script lang="ts" setup>
+  import { ref, computed, unref } from 'vue'
+  // 弹窗组件
+  import { BasicModal, useModalInner } from '/@/components/Modal'
+  import { BasicForm, useForm } from '/@/components/Form/index'
+  import FeeField from './feeField.vue'
+  // 字段数据
+  import { formSchema } from './columns'
+  // 相关接口
+  import { ApiEdit, ApiInfo } from './api'
+  // 提升消息混入
+  import { useMessage } from '/@/hooks/web/useMessage'
+  const props = defineProps({
+    customerName: { type: String },
+    customerId: { type: String },
+  })
+  // 声明Emits
+  const emit = defineEmits(['success', 'register'])
+  const isUpdate = ref(true)
+  const detailId = ref()
+  // 按钮loading
+  const loading = ref(false)
+  const rowId = ref('')
+  const { createMessage } = useMessage()
+  const [registerForm, { resetFields, setFieldsValue, getFieldsValue, validate, updateSchema }] =
+    useForm({
+      labelWidth: 100,
+      schemas: formSchema,
+      showActionButtonGroup: false,
+    })
+  const [registerModal, { setModalProps, closeModal, updateFormField }] = useModalInner(
+    async (data) => {
+      resetFields()
+      setModalProps({ confirmLoading: false, loading: true })
+      isUpdate.value = !!data?.isUpdate
+      if (unref(isUpdate)) {
+        setModalProps({ confirmLoading: true })
+        rowId.value = data.record.id
+        const res: API.DataResult = await ApiInfo({ id: unref(rowId) })
+        if (res.succeeded) {
+          setFieldsValue({
+            ...res.data,
+          })
+          feeField.value.SetData(res.data.details)
+          feeField.value.condition = res.data.condition
+          detailId.value = res.data.id
+        }
+      } else {
+        detailId.value = ''
+        setFieldsValue({
+          customerName: props.customerName,
+          customerId: props.customerId,
+        })
+        feeField.value.SetData([])
+        feeField.value.condition = ''
+      }
+      setModalProps({ loading: false })
+    },
+  )
+  const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'))
+  // 费用表格
+  const feeField = ref()
+  async function handleSave(exit) {
+    try {
+      const values = await validate()
+      const feeList = feeField.value.validate()
+      values['details'] = feeList
+      values['condition'] = feeField.value.condition
+      loading.value = true
+      setModalProps({ confirmLoading: true, loading: true })
+      const res: API.DataResult = await ApiEdit(values)
+      loading.value = false
+      if (res.succeeded) {
+        createMessage.success(res.message)
+        emit('success')
+      } else {
+        createMessage.error(res.message)
+      }
+      exit && closeModal()
+    } finally {
+      loading.value = false
+      setModalProps({ confirmLoading: false, loading: false })
+    }
+  }
+</script>
diff --git a/src/views/baseinfo/infoclient/FeeCustTemplate/api.ts b/src/views/baseinfo/infoclient/FeeCustTemplate/api.ts
new file mode 100644
index 00000000..0b2f7833
--- /dev/null
+++ b/src/views/baseinfo/infoclient/FeeCustTemplate/api.ts
@@ -0,0 +1,60 @@
+// @ts-ignore
+import { request } from '/@/utils/request'
+import { DataResult, PageRequest } from '/@/api/model/baseModel'
+enum Api {
+  list = '/feeApi/FeeCustTemplate/GetList',
+  edit = '/feeApi/FeeCustTemplate/Edit',
+  info = '/feeApi/FeeCustTemplate/Edit',
+  delete = '/feeApi/FeeCustTemplate/Delete',
+  GenerateFees = '/feeApi/FeeCustTemplate/GenerateFees',
+  GetColumns = '/mainApi/Common/GetColumnsByClient',
+}
+// 根据表明 查询数据
+export function getColumns(query: { id: string }) {
+  return request<DataResult>({
+    url: Api.GetColumns,
+    method: 'get',
+    params: query,
+  })
+}
+// 列表 (Auth)
+export function ApiList(data: PageRequest) {
+  return request<DataResult>({
+    url: Api.list,
+    method: 'post',
+    data,
+  })
+}
+// 编辑 (Auth)
+export function ApiEdit(data: PageRequest) {
+  return request<DataResult>({
+    url: Api.edit,
+    method: 'post',
+    data,
+  })
+}
+// 详情 (Auth)
+export function ApiInfo(query) {
+  return request<DataResult>({
+    url: Api.info,
+    method: 'get',
+    params: query,
+  })
+}
+// 删除 (Auth)
+export function ApiDel(data: PageRequest) {
+  return request<DataResult>({
+    url: Api.delete,
+    method: 'post',
+    data
+  })
+}
+
+// 生成订单费用 (Auth)
+export function ApiGenerateFees(data: PageRequest) {
+  return request<DataResult>({
+    url: Api.GenerateFees,
+    method: 'post',
+    data
+  })
+}
\ No newline at end of file
diff --git a/src/views/baseinfo/infoclient/FeeCustTemplate/columns.tsx b/src/views/baseinfo/infoclient/FeeCustTemplate/columns.tsx
new file mode 100644
index 00000000..7d599a96
--- /dev/null
+++ b/src/views/baseinfo/infoclient/FeeCustTemplate/columns.tsx
@@ -0,0 +1,159 @@
+import { ref } from 'vue'
+import { BasicColumn, FormSchema } from '/@/components/Table'
+// 引入字典数据
+import { getDictOption } from '/@/utils/dictUtil'
+// 下拉框数据接口
+import { GetClientListByCode } from '/@/api/common'
+// 往来单位下拉框数据
+const companyDict = ref([])
+let businessType: any = [
+  { value: 1, label: '海运出口' },
+  { value: 2, label: '海运进口' },
+]
+export const columns: BasicColumn[] = [
+  {
+    title: '模板名称',
+    dataIndex: 'name',
+    width: 200,
+  },
+  {
+    title: '业务类型',
+    dataIndex: 'businessTypeText',
+    width: 200,
+  },
+  {
+    title: '结算对象',
+    dataIndex: 'customerName',
+    width: 200,
+  },
+  {
+    title: '说明',
+    dataIndex: 'description',
+    width: 200,
+  },
+  {
+    title: '录入日期',
+    dataIndex: 'createTime',
+    width: 200,
+  },
+  {
+    title: '备注',
+    dataIndex: 'note',
+    width: 200,
+  },
+]
+
+export const searchFormSchema: FormSchema[] = [
+  {
+    field: 'name',
+    label: '模板名称',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
+]
+export const formSchema: FormSchema[] = [
+  {
+    label: '主键Id',
+    field: 'id',
+    component: 'Input',
+    defaultValue: '',
+    show: false,
+  },
+  {
+    field: 'name',
+    label: '模板名称',
+    component: 'Input',
+    required: true,
+    colProps: { span: 8 },
+  },
+  {
+    field: 'businessType',
+    label: '业务类型',
+    component: 'Select',
+    required: true,
+    colProps: { span: 8 },
+    componentProps: () => {
+      return {
+        options: businessType,
+      }
+    },
+  },
+  // {
+  //   field: 'customerType',
+  //   label: '客户类别',
+  //   defaultValue: '',
+  //   component: 'ApiSelect',
+  //   colProps: { span: 5 },
+  //   componentProps: ({ formModel }) => {
+  //     return {
+  //       api: () => {
+  //         return new Promise((resolve) => {
+  //           getDictOption('djy_cust_prop').then((res) => {
+  //             console.log(res, 111111111111111)
+
+  //             resolve(res)
+  //           })
+  //         })
+  //       },
+  //       labelField: 'label',
+  //       valueField: 'value',
+  //       resultField: 'data',
+  //       filterOption: (input: string, option: any) => {
+  //         return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+  //       },
+  //       onChange: (v: string, obj) => {
+  //         GetClientListByCode({ code: v }).then((res) => {
+  //           const { data } = res
+  //           data.forEach((item) => {
+  //             item['label'] = item.shortName
+  //             item['value'] = item.codeName
+  //           })
+  //           companyDict.value = data
+  //         })
+  //       },
+  //     }
+  //   },
+  // },
+  {
+    field: 'customerId',
+    label: '结算对象',
+    defaultValue: '',
+    component: 'Input',
+    show: false,
+    colProps: { span: 8 },
+  },
+  {
+    field: 'customerName',
+    label: '结算对象',
+    component: 'Input',
+    defaultValue: '',
+    dynamicDisabled: true,
+    colProps: { span: 8 },
+  },
+  // {
+  //   label: '',
+  //   field: 'customerId',
+  //   component: 'Input',
+  //   defaultValue: '',
+  //   show: false,
+  // },
+  // {
+  //   label: '',
+  //   field: 'customerType',
+  //   component: 'Input',
+  //   defaultValue: '',
+  //   show: false,
+  // },
+  {
+    field: 'description',
+    label: '模板说明',
+    component: 'Input',
+    colProps: { span: 8 },
+  },
+  {
+    field: 'note',
+    label: '备注',
+    component: 'Input',
+    colProps: { span: 16 },
+  },
+]
diff --git a/src/views/baseinfo/infoclient/FeeCustTemplate/feeField.vue b/src/views/baseinfo/infoclient/FeeCustTemplate/feeField.vue
new file mode 100644
index 00000000..2a7c4746
--- /dev/null
+++ b/src/views/baseinfo/infoclient/FeeCustTemplate/feeField.vue
@@ -0,0 +1,878 @@
+<template>
+  <div class="fee-field">
+    <div class="flex">
+      <h2>费用字段</h2>
+      <div>
+        <a-button type="link" @click="OpenSetCondition">
+          <span class="iconfont icon-new_document"></span>
+          设置方案条件
+        </a-button>
+        <a-button type="link" @click="addRow">
+          <span class="iconfont icon-new_document"></span>
+          添加
+        </a-button>
+        <a-popconfirm
+          title="确定删除当前选中数据？"
+          ok-text="是"
+          cancel-text="否"
+          @confirm="deleteRow"
+        >
+          <a-button type="link">
+            <span class="iconfont icon-shanchu21"></span>
+            删除
+          </a-button>
+        </a-popconfirm>
+      </div>
+    </div>
+    <a-spin :spinning="loading">
+      <div style="position: relative">
+        <input class="ds-tb-check" type="checkbox" v-model="allCheck" :indeterminate="someCheck" />
+        <hot-table ref="hotTb" :data="list" :settings="settings">
+          <img v-show="!list.length" src="../../../../assets/images/nodata.png" alt="" />
+        </hot-table>
+      </div>
+    </a-spin>
+    <AdvancedSearch
+      ref="advanceSearch"
+      :schemas="SetConditionSchemas"
+      @toSearch="toSearch"
+      title="方案条件"
+      :IsApi="false"
+      :IsApiData="Rcondition"
+    />
+  </div>
+</template>
+<script lang="ts" setup>
+  import {
+    ref,
+    onMounted,
+    defineProps,
+    watch,
+    nextTick,
+    defineComponent,
+    defineExpose,
+    watchEffect,
+    inject,
+  } from 'vue'
+  // 下拉框数据接口
+  import {
+    GetFeeCodeSelectList,
+    GetClientListByCode,
+    GetFeeCurrencySelectList,
+    GetClientSelectInfoByCode,
+    GetUnitSelectInfo,
+  } from '/@/api/common'
+  import { getColumns } from './api'
+  // import { GetFeeTemplateDetailList, BatchDelFeeTemplateDetail } from '../api'
+  // 引入计费标准字典
+  import { feeUnitDict } from '/@/hooks/dict/index'
+  // 引入字典数据
+  // import { getDictOption } from '/@/utils/dictUtil'
+  import AdvancedSearch from '../../../../components/Form/src/components/AdvancedSearch.vue'
+  import { useMessage } from '/@/hooks/web/useMessage'
+  import { HotTable, HotColumn } from '@handsontable/vue3'
+  import { registerAllModules } from 'handsontable/registry'
+  import 'handsontable/dist/handsontable.full.min.css'
+  defineComponent({
+    HotTable,
+    HotColumn,
+  })
+  registerAllModules()
+  const { createMessage, notification } = useMessage()
+  const props = defineProps({})
+
+  // ---------------------设置方案条件--------------------
+  let Arr = ref([
+    {
+      value: '0',
+      label: 'Equal',
+    },
+    {
+      value: '1',
+      label: 'Like',
+    },
+    {
+      value: '2',
+      label: 'GreaterThan',
+    },
+    {
+      value: '3',
+      label: 'GreaterThanOrEqual',
+    },
+    {
+      value: '4',
+      label: 'LessThan',
+    },
+    {
+      value: '5',
+      label: 'LessThanOrEqual',
+    },
+    {
+      value: '6',
+      label: 'In',
+    },
+    {
+      value: '7',
+      label: 'NotIn',
+    },
+    {
+      value: '8',
+      label: 'LikeLeft',
+    },
+    {
+      value: '9',
+      label: 'LikeRight',
+    },
+    {
+      value: '10',
+      label: 'NoEqual',
+    },
+    {
+      value: '11',
+      label: 'IsNullOrEmpty',
+    },
+    {
+      value: '12',
+      label: 'IsNot',
+    },
+    {
+      value: '13',
+      label: 'NoLike',
+    },
+    {
+      value: '14',
+      label: 'EqualNull',
+    },
+    {
+      value: '15',
+      label: 'InLike',
+    },
+  ])
+  const SetConditionSchemas = ref<any>([])
+  const advanceSearch = ref()
+  // 打开
+  function OpenSetCondition() {
+    advanceSearch.value.init(ReverseCondition(condition.value))
+  }
+  let condition = ref('')
+  let Rcondition = ref()
+  const toSearch = (params) => {
+    let RData = JSON.stringify(params)
+    RData = RData.replaceAll('"logicalOperator":"0"', '"logicalOperator":"and"')
+    RData = RData.replaceAll('"logicalOperator":"1"', '"logicalOperator":"or"')
+    Arr.value.forEach((item) => {
+      RData = RData.replaceAll(`"operator":${item.value},`, `"operator":"${item.label}",`)
+    })
+    condition.value = RData
+    // props.fetch({ advanced: params })
+  }
+  const ReverseCondition = (params) => {
+    let RData = ''
+    if (params) {
+      params = JSON.parse(params)
+      RData = JSON.stringify(params)
+      RData = RData.replaceAll('"logicalOperator":"and"', '"logicalOperator":"0"')
+      RData = RData.replaceAll('"logicalOperator":"or"', '"logicalOperator":"1"')
+      Arr.value.forEach((item) => {
+        RData = RData.replaceAll(`"operator":"${item.label}",`, `"operator":${item.value},`)
+      })
+    }
+    return RData
+    // props.fetch({ advanced: params })
+  }
+  // -----------------------------------------
+  // 币别字典
+  const currencyDict = ref([])
+  // 费用结算类型字典
+  let customerTypeDict = []
+  // 全部勾选
+  const allCheck = ref(false)
+  // 部分勾选
+  const someCheck = ref(false)
+  // 费用分组字典
+  let grouping = []
+  // 标准字典
+  let unitDict = []
+  // 表格数据
+  const list = ref([])
+  // 费用名称字典
+  const feeDict = ref([])
+  // 结算对象下拉数据
+  const companyDict = ref([])
+  // tableDom
+  const hotTb = ref(null)
+  // 校验成功返回数据
+  const validate = () => {
+    return list.value
+  }
+  const SetData = (data) => {
+    list.value.splice(0)
+    data.forEach((item) => {
+      list.value.push(item)
+    })
+  }
+  const loading = ref(false)
+  // 添加行
+  const addRow = () => {
+    list.value.push({})
+  }
+
+  // 定义表格所有列
+  const columns = [
+    {
+      data: 'selected',
+      type: 'checkbox',
+      title: ' ',
+      width: 32,
+      className: 'htCenter',
+      readOnly: false,
+    },
+    // {
+    //   title: '结算对象',
+    //   width: 130,
+    //   data: 'customerName',
+    //   type: 'dropdown',
+    //   source: async (query, process) => {
+    //     // 获取当前选中行
+    //     const rowIndex = hotTb.value.hotInstance.getActiveEditor().row
+    //     const code = list.value[rowIndex]?.customerType || null
+    //     GetClientListByCode({ code }).then((res) => {
+    //       const { data } = res
+    //       data.forEach((item) => {
+    //         item['label'] = item.shortName
+    //         item['value'] = item.codeName
+    //       })
+    //       companyDict.value = data
+    //       const dict = data.map((item) => {
+    //         return item.codeName + '-' + item.shortName
+    //       })
+    //       process(dict)
+    //     })
+    //   },
+    // },
+    {
+      title: '费用名称',
+      width: 130,
+      data: 'feeName',
+      type: 'dropdown',
+      // 下拉框数据，可以同步或者异步返回(异步需要process返回)
+      source: async (query, process) => {
+        const res = feeDict.value.length ? feeDict.value : (await GetFeeCodeSelectList())?.data
+        if (!feeDict.value.length) feeDict.value = res
+        const dict = res.map((res) => {
+          return res.code + '-' + res.name
+        })
+        process(dict)
+      },
+    },
+    {
+      title: '单位标准',
+      width: 130,
+      data: 'unit',
+      type: 'dropdown',
+      source: async (query, process) => {
+        if (unitDict.value && unitDict.value.length) {
+          const dict = unitDict.value.map((item) => {
+            return item.value + '-' + item.name
+          })
+          process(dict)
+        } else {
+          const results = await feeUnitDict()
+          unitDict.value = results
+          const dict = results.map((item) => {
+            return item.value + '-' + item.name
+          })
+          process(dict)
+        }
+      },
+    },
+    {
+      title: '费用类型',
+      width: 80,
+      data: 'feeTypeName',
+      type: 'dropdown',
+      source: async (query, process) => {
+        if (currencyDict.value.length) {
+          process(currencyDict.value)
+        } else {
+          const results = [
+            { label: '应收', value: 1 },
+            { label: '应付', value: 2 },
+          ]
+          const dict = results.map((res) => {
+            return res.label
+          })
+          process(dict)
+        }
+      },
+    },
+    {
+      title: '是否箱型',
+      width: 100,
+      data: 'isCtn',
+      type: 'checkbox',
+    },
+    {
+      title: '币别',
+      width: 80,
+      data: 'currency',
+      type: 'dropdown',
+      source: async (query, process) => {
+        if (currencyDict.value.length) {
+          process(currencyDict.value)
+        } else {
+          const results = await GetFeeCurrencySelectList()
+          const dict = results.data?.map((res) => {
+            return res.codeName
+          })
+          currencyDict.value = dict
+          process(dict)
+        }
+      },
+    },
+    {
+      title: '单价',
+      width: 120,
+      data: 'unitPrice',
+      type: 'numeric',
+      format: '0.00',
+    },
+    {
+      title: '汇率',
+      width: 120,
+      data: 'exchangeRate',
+      type: 'numeric',
+    },
+    {
+      title: '税率',
+      width: 120,
+      data: 'taxRate',
+      type: 'numeric',
+    },
+    {
+      title: '财务税率',
+      width: 100,
+      data: 'accTaxRate',
+      type: 'numeric',
+    },
+    {
+      title: '税额',
+      width: 120,
+      data: 'tax',
+      type: 'numeric',
+    },
+    {
+      title: '含税单价',
+      width: 120,
+      data: 'taxUnitPrice',
+      type: 'numeric',
+    },
+    {
+      title: '是否开票',
+      width: 120,
+      data: 'isInvoice',
+      type: 'checkbox',
+    },
+    {
+      title: '是否垫付',
+      width: 100,
+      data: 'isAdvancedPay',
+      type: 'checkbox',
+    },
+    // {
+    //   title: '费用英文名称',
+    //   width: 130,
+    //   data: 'feeEnName',
+    //   type: 'dropdown',
+    //   source: async (query, process) => {
+    //     const res = feeDict.value.length ? feeDict.value : (await GetFeeCodeSelectList())?.data
+    //     if (!feeDict.value.length) feeDict.value = res
+    //     const dict = res.map((res) => {
+    //       return res.enName
+    //     })
+    //     process(dict)
+    //   },
+    // },
+    // {
+    //   title: '客户类别',
+    //   width: 130,
+    //   data: 'customerTypeText',
+    //   type: 'dropdown',
+    //   source: async (query, process) => {
+    //     const results = await getDictOption('djy_cust_prop')
+    //     const dict = results.map((item) => {
+    //       return item.value + '-' + item.name
+    //     })
+    //     process(dict)
+    //   },
+    // },
+
+    // {
+    //   title: '数量',
+    //   width: 120,
+    //   data: 'quantity',
+    //   type: 'numeric',
+    //   format: '0',
+    // },
+    // {
+    //   title: '不含税单价',
+    //   width: 120,
+    //   data: 'noTaxPrice',
+    //   type: 'numeric',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '不含税金额',
+    //   width: 120,
+    //   data: 'noTaxAmount',
+    //   type: 'numeric',
+    //   format: '0.00',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '金额',
+    //   width: 120,
+    //   data: 'amount',
+    //   type: 'numeric',
+    // },
+
+    // {
+    //   title: '备注',
+    //   width: 120,
+    //   data: 'note',
+    // },
+
+    // {
+    //   title: '销项税额',
+    //   width: 100,
+    //   data: 'accTaxAmount',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '销项金额',
+    //   width: 100,
+    //   data: 'accAmount',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '是否机密',
+    //   width: 100,
+    //   data: 'isOpen',
+    //   type: 'checkbox',
+    // },
+
+    // {
+    //   title: 'FRT',
+    //   width: 120,
+    //   data: 'feeFrt',
+    //   type: 'dropdown',
+    //   source: ['PP', 'CC'],
+    // },
+    // {
+    //   title: '录入人',
+    //   width: 100,
+    //   data: 'createByName',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '录入日期',
+    //   width: 100,
+    //   data: 'createTime',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '结算金额',
+    //   width: 100,
+    //   data: 'settlementAmount',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '已开票金额',
+    //   width: 100,
+    //   data: 'invoiceAmount',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '对账编号',
+    //   width: 100,
+    //   data: 'debitNo',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '修改人',
+    //   width: 100,
+    //   data: 'updateByName',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '修改日期',
+    //   width: 100,
+    //   data: 'updateTime',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '发票申请金额',
+    //   width: 100,
+    //   data: 'orderInvoiceAmount',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '未开票金额',
+    //   width: 100,
+    //   data: 'debitNo',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '审核人',
+    //   width: 100,
+    //   data: 'auditOperator',
+    //   readOnly: true,
+    // },
+    // {
+    //   title: '审核日期',
+    //   width: 100,
+    //   data: 'auditDate',
+    //   readOnly: true,
+    // },
+  ]
+  // 表格配置项
+  const settings = {
+    height: 300,
+    width: '100%',
+    autoWrapRow: true,
+    autoWrapCol: true,
+    // 每行的高度
+    rowHeights: 32,
+    fixedColumnsLeft: 1,
+    // 控制回车移动
+    enterMoves: 'row',
+    columnSorting: true,
+    // 设置排序的列和方向
+    // columnSorting: {
+    //   column: 2, // 根据第三列排序
+    //   sortOrder: ['asc', 'desc'] // 允许升序和降序排序
+    // },
+    // 如果通过复制或者填写校验出现错误，清空输入框
+    afterValidate: function (isValid, value, row, prop, source) {
+      if (!isValid) {
+        hotTb.value.hotInstance.setDataAtRowProp(row, prop, '')
+        // if (/^noTaxPrice|unitPrice|noTaxAmount|taxRate|exchangeRate$/.test(prop)) {
+        //   if (!isNaN(value)) {
+        //     hotTb.value.hotInstance.setDataAtRowProp(row, prop, value.toFixed(2))
+        //   }
+        // }
+      }
+    },
+    columns: columns,
+    // 此行直接复制，必须(非商用)
+    licenseKey: 'non-commercial-and-evaluation',
+    // 定义所有单元格发生变化的回调处理
+    afterChange(changes, source) {
+      // 这里定义了编辑，自动填充和拷贝数据的处理逻辑
+      if (source === 'edit' || source === 'Autofill.fill' || source === 'CopyPaste.paste') {
+        let dict = {}
+        changes.forEach((res) => {
+          // 费用类型
+          if (changes[0][1] === 'feeTypeName') {
+            const res = [
+              { label: '应收', value: 1 },
+              { label: '应付', value: 2 },
+            ]
+            const item = res.filter((item) => {
+              return item.label === changes[0][3]
+            })
+            if (item) dict = item[0]
+            list.value[changes[0][0]]['feeType'] = dict?.value
+            list.value[changes[0][0]]['feeTypeName'] = dict?.label
+          }
+          // 修改费用对象
+          if (changes[0][1] === 'customerName') {
+            const item = companyDict.value.filter((item) => {
+              return changes[0][3].includes(item.label)
+            })
+            if (item) dict = item[0]
+            list.value[changes[0][0]]['customerId'] = dict.id
+            list.value[changes[0][0]]['customerName'] = changes[0][3].split('-')[1]
+          }
+          // 修改费用名称
+          if (res[1] === 'feeName') {
+            // 获取当前选中的字典对象数据
+            const item = feeDict.value.filter((item) => {
+              return changes[0][3].includes(item.name)
+            })
+            if (item) dict = item[0]
+            // feeType
+            list.value[res[0]]['feeName'] = changes[0][3].split('-')[1]
+            list.value[res[0]]['feeCode'] = dict['code']
+            list.value[res[0]]['feeId'] = dict['id']
+            list.value[res[0]]['unit'] = dict['defaultUnit']
+            list.value[res[0]]['currency'] = dict['defaultCurrency']
+            list.value[res[0]]['taxRate'] = dict['taxRate']
+            list.value[res[0]]['isInvoice'] = dict['isInvoice']
+            list.value[res[0]]['isAdvancedPay'] = dict['isAdvancedPay']
+            // list.value[res[0]]['feeEnName'] = dict['enName']
+            // list.value[res[0]]['unitText'] = dict['defaultUnitName']
+            // list.value[res[0]]['customerTypeText'] = dict['defaultDebitName']
+            // list.value[res[0]]['customerType'] = dict['defaultDebit']
+            // list.value[res[0]]['isOpen'] = dict['isOpen']
+
+            // list.value[res[0]]['feeFrt'] = dict['feeFrt']
+          }
+        })
+        // 修改单位
+        if (changes[0][1] === 'unit') {
+          const item = unitDict.value.filter((item) => {
+            return changes[0][3].includes(item.name)
+          })
+          if (item) dict = item[0]
+          list.value[changes[0][0]]['unit'] = dict?.value
+          // list.value[changes[0][0]]['unitText'] = changes[0][3].split('-')[1]
+          // 业务数据有件数，修改单位，带出件数
+          // const text = list.value[changes[0][0]]['unitText']
+          // if (text == '单票') {
+          //   list.value[changes[0][0]]['quantity'] = 1
+          // } else if (text == '件数') {
+          //   list.value[changes[0][0]]['quantity'] = props.details.pkgs
+          // } else if (text == '重量') {
+          //   list.value[changes[0][0]]['quantity'] = props.details.kgs
+          // } else if (text == '尺码') {
+          //   list.value[changes[0][0]]['quantity'] = props.details.cbm
+          // } else if (text == '计费吨') {
+          //   let r = props.details.kgs
+          //   const k = (props.details.pkgs || 0) / 1000
+          //   if (k > r) {
+          //     r = k
+          //   }
+          //   list.value[changes[0][0]]['quantity'] = r
+        }
+        // // 修改币别
+        // if (changes[0][1] === 'currencyName') {
+        //   const item = currencyDict.value.filter((item) => {
+        //     return item.name === changes[0][3]
+        //   })
+        //   if (item) dict = item[0]
+        //   list.value[changes[0][0]]['currency'] = dict?.codeName
+        // }
+        // ============================
+        // // 修改费用英文名称
+        // if (changes[0][1] === 'feeEnName') {
+        // }
+
+        // // 修改客户类别
+        // if (changes[0][1] === 'customerTypeText') {
+        //   getDictOption('djy_cust_prop').then((res) => {
+        //     const item = res.filter((item) => {
+        //       return changes[0][3].includes(item.name)
+        //     })
+        //     if (item) dict = item[0]
+        //     list.value[changes[0][0]]['customerType'] = dict?.value
+        //     list.value[changes[0][0]]['customerTypeText'] = changes[0][3].split('-')[1]
+        //   })
+        // }
+
+        // // 当前操作的行
+        // const index = changes[0][0]
+        // // 修改不含税单价计算
+        // if (changes[0][1] === 'noTaxPrice') {
+        //   // 单价
+        //   list.value[index].unitPrice = Number(
+        //     (changes[0][3] || 0) * ((list.value[index].taxRate || 0) / 100 + 1),
+        //   ).toFixed(6)
+        //   // 金额
+        //   list.value[index].amount = Number(
+        //     (list.value[index].unitPrice || 0) * (list.value[index].quantity || 0),
+        //   ).toFixed(6)
+        //   // 不含税金额
+        //   list.value[index].noTaxAmount = Number(
+        //     (changes[0][3] || 0) * (list.value[index].quantity || 0),
+        //   ).toFixed(6)
+        // }
+        // // 修改单价计算
+        // if (changes[0][1] === 'unitPrice') {
+        //   // 不含税单价
+        //   list.value[index].noTaxPrice = Number(
+        //     (changes[0][3] || 0) / ((list.value[index].taxRate || 0) / 100 + 1),
+        //   ).toFixed(6)
+        //   // 金额
+        //   list.value[index].amount = Number(
+        //     (changes[0][3] || 0) * (list.value[index].quantity || 0),
+        //   ).toFixed(6)
+        //   // 不含税金额
+        //   list.value[index].noTaxAmount = Number(
+        //     (list.value[index].noTaxPrice || 0) * (list.value[index].quantity || 0),
+        //   ).toFixed(6)
+        // }
+        // // 修改数量
+        // if (changes[0][1] === 'quantity') {
+        //   // 金额
+        //   list.value[index].amount = Number(
+        //     (changes[0][3] || 0) * (list.value[index].unitPrice || 0),
+        //   ).toFixed(6)
+        //   // 不含税金额
+        //   list.value[index].noTaxAmount = Number(
+        //     (changes[0][3] || 0) * (list.value[index].noTaxPrice || 0),
+        //   ).toFixed(6)
+        // }
+        // // 修改税率
+        // if (changes[0][1] === 'taxRate') {
+        //   // 不含税单价
+        //   list.value[index].noTaxPrice = Number(
+        //     (list.value[index].unitPrice || 0) / ((changes[0][3] || 0) / 100 + 1),
+        //   ).toFixed(6)
+        //   // 不含税金额
+        //   list.value[index].noTaxAmount = Number(
+        //     (list.value[index].noTaxPrice || 0) * (list.value[index].quantity || 0),
+        //   ).toFixed(6)
+        // }
+      }
+    },
+  }
+  defineExpose({
+    validate,
+    SetData,
+    condition,
+  })
+  // 需要定义新增的行数据（后台需要）
+  const row = {
+    selected: false,
+    feeStatus: '1',
+    feeStatusText: '录入状态',
+    id: '',
+    businessId: '',
+    feeCode: '',
+    feeName: '',
+    feeEnName: '',
+    quantity: 1,
+    exchangeRate: 1,
+    feeType: props.tbType == 'receive' ? 1 : 2,
+  }
+  onMounted(() => {
+    const hot = hotTb.value.hotInstance
+    hot.addHook('afterOnCellMouseDown', function (event, coords, TD) {})
+    // 定义表格按键处理逻辑
+    hot.addHook('beforeKeyDown', function (event) {
+      // 检查按下的是否是特定的键（例如 'Enter'）
+      if (event.key === 'ArrowDown') {
+        if (hot.getSelected()[0][0] == list.value.length - 1 && !hot.getActiveEditor()?._opened) {
+          list.value.push(JSON.parse(JSON.stringify(row)))
+          nextTick(() => {
+            hot.selectCell(list.value.length - 1, 4)
+          })
+          return false
+        }
+      }
+    })
+    SetConditionSchemas.value.splice(0)
+    getColumns({ tableViewName: 'op_sea_export' }).then((res) => {
+      res.data.forEach((item) => {
+        SetConditionSchemas.value.push({
+          field: item.dbColumnName,
+          label: item.columnDescription,
+        })
+      })
+    })
+  })
+  watch(
+    list.value,
+    (val) => {
+      let a = 0
+      let b = 0
+      val.forEach((item) => {
+        if (item.selected) {
+          a += 1
+        } else {
+          b += 1
+        }
+      })
+      if (a == 0) {
+        allCheck.value = false
+      }
+      if (b == 0) {
+        allCheck.value = true
+      }
+      if (a != 0 && b != 0) {
+        someCheck.value = true
+      } else {
+        someCheck.value = false
+      }
+    },
+    {
+      deep: true,
+    },
+  )
+  // 删除行
+  const deleteRow = async () => {
+    // const ids = []
+    // list.value.forEach((item) => {
+    //   if (item.selected && item.id) ids.push(item.id)
+    // })
+    // if (ids.length) {
+    //   loading.value = true
+    //   const data = await BatchDelFeeTemplateDetail({ ids })
+    //   loading.value = false
+    //   createMessage.success(data.message)
+    // }
+    // const res = list.value.filter((item) => {
+    //   return !item.selected
+    // })
+    // list.value = res
+    // hotTb.value.hotInstance.loadData(res)
+  }
+  // 如果有id通过id查询表格
+  // watch(
+  //   () => props.id,
+  //   (v) => {
+  //     // list.value.splice(0)
+  //     // const postData = {
+  //     //   pageCondition: {
+  //     //     pageIndex: 1,
+  //     //     pageSize: 1000,
+  //     //     sortConditions: [],
+  //     //   },
+  //     //   queryCondition: JSON.stringify([
+  //     //     { FieldName: 'TemplateId', FieldValue: v, ConditionalType: 1 },
+  //     //   ]),
+  //     // }
+  //     // if (v) {
+  //     //   const res = await GetFeeTemplateDetailList(postData)
+  //     //   list.value = res.data
+  //     //   hotTb.value.hotInstance.loadData(res.data)
+  //     // }
+  //   },
+  // )
+  watchEffect(() => {
+    // 全选
+    if (allCheck.value) {
+      list.value.forEach((item) => {
+        item.selected = true
+      })
+    } else {
+      // 取消全选
+      list.value.forEach((item) => {
+        item.selected = false
+      })
+    }
+  })
+</script>
+
+<style lang="scss">
+  .fee-field {
+    .flex {
+      margin-top: 10px;
+      margin-block: 8px;
+      padding: 15px 6px 0 6px;
+      border-top: 0.7px solid #d9d9d9;
+      justify-content: space-between;
+    }
+    .ant-select {
+      width: 100%;
+      text-align: left;
+    }
+    .active-td {
+      border: 1px solid blue;
+    }
+  }
+  .handsontableInput {
+    line-height: 30px;
+  }
+</style>
diff --git a/src/views/baseinfo/infoclient/FeeCustTemplate/index.vue b/src/views/baseinfo/infoclient/FeeCustTemplate/index.vue
new file mode 100644
index 00000000..d5bc6c40
--- /dev/null
+++ b/src/views/baseinfo/infoclient/FeeCustTemplate/index.vue
@@ -0,0 +1,147 @@
+<template>
+  <div>
+    <BasicTable class="ds-table-detail" @register="registerTable" @row-dbClick="handleAudit">
+      <template #tableTitle>
+        <span class="title">自动费用模板</span>
+        <a-button type="link" @click="handleCreate">
+          <span class="iconfont icon-new_document"></span>
+          添加
+        </a-button>
+        <a-popconfirm
+          title="确定删除当前选中数据？"
+          ok-text="是"
+          cancel-text="否"
+          @confirm="handleDelete"
+        >
+          <a-button type="link">
+            <span class="iconfont icon-shanchu21"></span>
+            删除
+          </a-button>
+        </a-popconfirm>
+      </template>
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              {
+                icon: 'clarity:note-edit-line',
+                tooltip: '编辑',
+                onClick: handleAudit.bind(null, record),
+              },
+            ]"
+          />
+        </template>
+      </template>
+    </BasicTable>
+    <TenantAuditStepModal
+      @register="registerModal"
+      @success="handleSuccess"
+      :customerName="props.customerName"
+      :customerId="props.clientId"
+    />
+  </div>
+</template>
+<script lang="ts" setup>
+  import { defineComponent, onMounted, ref } from 'vue'
+  import { BasicTable, useTable, TableAction, SorterResult } from '/@/components/Table'
+  import { ApiList, ApiDel } from './api'
+  import { useModal } from '/@/components/Modal'
+  import TenantAuditStepModal from './TenantAuditStepModal.vue'
+  import { columns, searchFormSchema } from './columns'
+  import { formatParams } from '/@/hooks/web/common'
+  import { useMessage } from '/@/hooks/web/useMessage'
+  const { notification } = useMessage()
+  const props = defineProps({
+    clientId: { type: String },
+    customerName: { type: String },
+  })
+  const [registerModal, { openModal }] = useModal()
+  const [registerTable, { reload, getSelectRows, getForm, getPaginationRef }] = useTable({
+    title: '',
+    api: async (p) => {
+      const res: API.DataResult = await ApiList(p)
+      return new Promise((resolve) => {
+        resolve({ data: [...res.data], total: res.count })
+      })
+    },
+    beforeFetch: (p) => {
+      p['customerId'] = props.clientId
+      return formatParams(p)
+    },
+    columns,
+    pagination: true,
+    bordered: true,
+    showTableSetting: false,
+    canResize: true,
+    resizeHeightOffset: 35,
+    immediate: true,
+    rowSelection: { type: 'checkbox' },
+    clickToRowSelect: false,
+    actionColumn: {
+      width: 80,
+      title: '操作',
+      dataIndex: 'action',
+      fixed: 'right',
+    },
+  })
+  function handleCreate() {
+    openModal(true, {
+      customerId: props.clientId,
+      isUpdate: false,
+    })
+  }
+  function handleAudit(record: Recordable) {
+    openModal(true, {
+      record,
+      // record: { clientId: props.clientId, ...record },
+      isUpdate: true,
+    })
+  }
+  // 删除
+  async function handleDelete(record: Recordable) {
+    const select = getSelectRows()
+    let ApiData: any = {
+      ids: [],
+    }
+    if (select.length === 0) {
+      notification.warning({ message: '请至少选择一条数据', duration: 3 })
+      return false
+    } else {
+      ApiData.ids = select.map((item) => {
+        return item.id
+      })
+    }
+
+    ApiDel(ApiData).then((res) => {
+      console.log(res)
+      notification.success({ message: res.message, duration: 3 })
+      reload()
+    })
+    // const res: API.DataResult = await ApiDel({
+    //   id: '',
+    //   ids: [record.id],
+    // })
+    // if (res.succeeded) {
+    //   notification.success({ message: res.message, duration: 3 })
+    //   reload()
+    // } else {
+    //   notification.error({ message: res.message, duration: 3 })
+    // }
+  }
+  function handleSuccess() {
+    reload()
+  }
+</script>
+<style lang="less" scoped>
+  .ds-table-detail {
+    margin-top: -16px;
+    .title {
+      font-size: 12px;
+      font-weight: 700;
+      letter-spacing: 1px;
+      line-height: 15.84px;
+      color: rgba(51, 56, 61, 1);
+      text-align: left;
+    }
+  }
+</style>
diff --git a/src/views/baseinfo/infoclient/TenantAuditStepModal.vue b/src/views/baseinfo/infoclient/TenantAuditStepModal.vue
index d87935b1..ff3ef210 100644
--- a/src/views/baseinfo/infoclient/TenantAuditStepModal.vue
+++ b/src/views/baseinfo/infoclient/TenantAuditStepModal.vue
@@ -138,6 +138,10 @@
               <Tabs3 :client-id="clientId" :saleId="saleId" :sourceId="sourceId" />
             </div>
           </a-tab-pane>
+          <!-- 自动费用模板 -->
+          <a-tab-pane key="3" tab="自动费用模板">
+            <FeeCustTemplate :client-id="clientId" :customer-name="customerName" class="RUnit" />
+          </a-tab-pane>
           <!-- 联系人信息 -->
           <a-tab-pane key="4" tab="联系人信息">
             <Menus2 :client-id="clientId" class="RUnit" />
@@ -189,6 +193,7 @@
   import Menus2 from './menu2/index.vue'
   import Menus3 from './menu3/index.vue'
   import CustTemplateDetail from './custTemplateDetail/index.vue'
+  import FeeCustTemplate from './FeeCustTemplate/index.vue'
   import { useModal } from '/@/components/Modal'
   import CustomerParams from './customerParams/index.vue'
   import ReleaseType from './ReleaseType/index.vue'
diff --git a/src/views/fee/template/components/feeField.vue b/src/views/fee/template/components/feeField.vue
index 9498a0bb..1c4565b3 100644
--- a/src/views/fee/template/components/feeField.vue
+++ b/src/views/fee/template/components/feeField.vue
@@ -29,7 +29,7 @@
       <div style="position: relative">
         <input class="ds-tb-check" type="checkbox" v-model="allCheck" :indeterminate="someCheck" />
         <hot-table ref="hotTb" :data="list" :settings="settings">
-          <img v-show="!list.length" src="../../../../assets/images/nodata.png" alt="">
+          <img v-show="!list.length" src="../../../../assets/images/nodata.png" alt="" />
         </hot-table>
       </div>
     </a-spin>
@@ -53,7 +53,7 @@
     GetClientListByCode,
     GetFeeCurrencySelectList,
     GetClientSelectInfoByCode,
-    GetUnitSelectInfo
+    GetUnitSelectInfo,
   } from '/@/api/common'
   import { GetFeeTemplateDetailList, BatchDelFeeTemplateDetail } from '../api'
   // 引入计费标准字典
@@ -499,7 +499,6 @@
           //     r = k
           //   }
           //   list.value[changes[0][0]]['quantity'] = r
-          
         }
         // 修改币别
         if (changes[0][1] === 'currencyName') {