09/11

src/hooks/web/common.ts

@@ -127,14 +127,13 @@ export function updateFormItem(updateSchema, formNo) {
   getFormSetInfoByModule({ permissionId: permissionsInfo().permissionId, formNo }).then((res) => {
     if (res?.data?.content) {
       const content = JSON.parse(res.data.content)
-      console.log(content)
       updateSchema(content.columns)
     }
   })
 }
 
 // 返回表格查询的参数 multipleList(需要多选查询的字段名数组)
-export function formatParams(params = {}, equal: any = [], otherQuery: any = []) {
+export function formatParams(params = {}, equal: any = [], otherQuery: any = []) {  
   const postData:any = {
     queryCondition: '',
     pageCondition: {
@@ -147,6 +146,7 @@ export function formatParams(params = {}, equal: any = [], otherQuery: any = [])
   for (let key in params) {
     let IsContinue = true
     if (otherQuery.length) {
+      postData.otherQueryCondition={}
       otherQuery.forEach((item) => {
         if (key == item) {
           IsContinue = false

src/views/baseinfo/TaskMail/api.ts

@@ -5,6 +5,7 @@ enum Api {
   list = '/opApi/TaskMail/GetList',
   edit = '/opApi/TaskMail/Edit',
   info = '/opApi/TaskMail/Edit',
+  del = '/opApi/TaskMail/Delete',
 
   PrintTemplateList = '/mainApi/Print/GetOpenPrintTemplateList',
 }
@@ -32,7 +33,14 @@ export function ApiInfo(query) {
     params: query,
   })
 }
-
+// 批量删除 (Auth)
+export function ApiDel(data: PageRequest) {
+  return request<DataResult>({
+    url: Api.del,
+    method: 'post',
+    data,
+  })
+}
 // 印模块列表 (Auth)
 export function GetPrintTemplateList(data: PageRequest) {
   return request<DataResult>({

src/views/baseinfo/TaskMail/index.vue

@@ -6,10 +6,21 @@
       @row-dbClick="handleAudit"
     >
       <template #tableTitle>
-        <a-button type="link" @click="handleCreate" :disabled="checkPermissions('op:goods:add')">
+        <a-button type="link" @click="handleCreate">
           <span class="iconfont icon-new_document"></span>
           添加
         </a-button>
+        <a-popconfirm
+          title="确定删除当前选中数据？"
+          ok-text="是"
+          cancel-text="否"
+          @confirm="handleDel"
+        >
+          <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'">
@@ -19,7 +30,6 @@
                 icon: 'clarity:note-edit-line',
                 tooltip: '编辑',
                 onClick: handleAudit.bind(null, record),
-                disabled: checkPermissions('op:goods:edit'),
               },
             ]"
           />
@@ -31,9 +41,9 @@
 </template>
 <script lang="ts" setup>
   import { ref, defineProps } from 'vue'
-  import { checkPermissions } from '/@/hooks/Permissions/index'
+
   import { BasicTable, useTable, TableAction } from '/@/components/Table'
-  import { ApiList } from './api'
+  import { ApiList, ApiDel } from './api'
   import { useModal } from '/@/components/Modal'
   import TenantAuditStepModal from './TenantAuditStepModal.vue'
   import { columns, searchFormSchema } from './columns'
@@ -41,7 +51,7 @@
   import { useMessage } from '/@/hooks/web/useMessage'
   const { notification } = useMessage()
   const [registerModal, { openModal }] = useModal()
-  const [registerTable, { reload, getForm }] = useTable({
+  const [registerTable, { reload, getSelectRows }] = useTable({
     title: '',
     api: async (p) => {
       const res: API.DataResult = await ApiList(p)
@@ -78,6 +88,26 @@
       fixed: 'right',
     },
   })
+  function handleDel() {
+    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()
+    })
+  }
   function handleCreate() {
     openModal(true, {
       isParent: false,
@@ -86,12 +116,10 @@
   }
 
   function handleAudit(record: Recordable) {
-    if (!checkPermissions('op:goods:edit')) {
-      openModal(true, {
-        record,
-        isUpdate: true,
-      })
-    }
+    openModal(true, {
+      record,
+      isUpdate: true,
+    })
   }
   function handleSuccess() {
     reload()

src/views/baseinfo/infoclient/EditColumns.tsx

@@ -30,7 +30,7 @@ const res: API.DataResult = await getClientFrtSelectList()
 if (res.succeeded) {
   ClientFrtList = []
   res.data.forEach((e) => {
-    ClientFrtList.push({ label: e.cnName, value: e.id })
+    ClientFrtList.push({ label: e.frtName, value: e.id })
   })
 }
 let UserData = []

src/views/baseinfo/infoclient/columns.tsx

@@ -27,7 +27,7 @@ const res: API.DataResult = await getClientFrtSelectList()
 if (res.succeeded) {
   ClientFrtList = []
   res.data.forEach((e) => {
-    ClientFrtList.push({ label: e.cnName, value: e.id })
+    ClientFrtList.push({ label: e.frtName, value: e.id })
   })
 }
 let ClientSourceList = []

src/views/system/CodeDataRuleTemplate/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>

src/views/system/CodeDataRuleTemplate/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',
+  GetColumns = '/mainApi/Common/GetColumnsByClient',
+  DeleteDetails = '/feeApi/FeeCustTemplate/DeleteDetails',
+}
+// 根据表明 查询数据
+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
+  })
+}
+
+// 根据ID删除明细 (Auth)
+export function DeleteDetails(data: PageRequest) {
+  return request<DataResult>({
+    url: Api.DeleteDetails,
+    method: 'post',
+    data
+  })
+}

src/views/system/CodeDataRuleTemplate/asd.json

@@ -0,0 +1,59 @@
+/// <summary>
+/// 数据权限模板请求
+/// </summary>
+public class CodeDataRuleTemplateReq
+{
+    /// <summary>
+    /// 主键Id
+    /// </summary>
+    public long Id { get; set; }
+    /// <summary>
+    /// 权限模板类型
+    /// </summary>
+    public string TemplateName { get; set; }
+
+    /// <summary>
+    /// 权限类型 visible 可视范围 operate 操作范围
+    /// </summary>
+    public string RuleType { get; set; } = "visible";
+    /// <summary>
+    /// 权限模板范围
+    /// </summary>
+    public string RuleScope { get; set; }
+    /// <summary>
+    /// 权限模板范围名称
+    /// </summary>
+    public string RuleScopeName { get; set; }
+    /// <summary>
+    /// 资源标识（权限ID）
+    /// </summary>
+    public long PermissionId { get; set; }
+
+    /// <summary>
+    /// 权限实体
+    /// </summary>
+    public string PermissionEntity { get; set; }
+    /// <summary>
+    /// 中文视图名
+    /// </summary>
+    public string ColumnView { get; set; }
+
+    /// <summary>
+    /// 权限规则
+    /// </summary>
+    public string DataRules { get; set; }
+
+    /// <summary>
+    /// 数据权限描述
+    /// </summary>
+    public string Description { get; set; }
+    /// <summary>
+    /// 状态
+    /// </summary>
+    public StatusEnum? Status { get; set; } = StatusEnum.Enable;
+
+    /// <summary>
+    /// 排序号
+    /// </summary>
+    public int OrderNo { get; set; }
+}

src/views/system/CodeDataRuleTemplate/columns.tsx

@@ -0,0 +1,174 @@
+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: 'templateName',
+    width: 200,
+  },
+  {
+    title: '权限模板范围',
+    dataIndex: 'ruleScopeName',
+    width: 200,
+  },
+  {
+    title: '资源标识',
+    dataIndex: 'permissionId',
+    width: 200,
+  },
+  {
+    title: '中文视图名',
+    dataIndex: 'columnView',
+    width: 200,
+  },
+  {
+    title: '排序号',
+    dataIndex: 'orderNo',
+    // width: 200,
+  },
+  {
+    title: '可视/可操作???',
+    dataIndex: 'note',
+    // width: 200,
+  },
+  {
+    title: '是否启用',
+    dataIndex: 'note',
+    // width: 200,
+  },
+  {
+    title: '权限描述',
+    dataIndex: 'note',
+    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 },
+  },
+]

src/views/system/CodeDataRuleTemplate/feeField.vue

@@ -0,0 +1,887 @@
+<template>
+  <div class="fee-field">
+    <div class="flex">
+      <span class="title">费用字段</span>
+      <div>
+        <a-button type="link" @click="OpenSetCondition">
+          <span class="iconfont icon-jichupeizhi"></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, GetFeeCurrencySelectList } from '/@/api/common'
+  import { getColumns, DeleteDetails } 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 () => {
+    // list.value.forEach((item: any, index) => {
+    //   if (item.selected) {
+    //     list.value.splice(index, 1)
+    //   }
+    // })
+    const ids = []
+    list.value.forEach((item: any, index) => {
+      if (item.selected) {
+        ids.push(item.id)
+      }
+    })
+    if (ids.length) {
+      loading.value = true
+      const data = await DeleteDetails({ 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;
+      .title {
+        font-size: 12px;
+        font-weight: 700;
+        letter-spacing: 1px;
+        line-height: 30px;
+        color: rgba(51, 56, 61, 1);
+        text-align: left;
+      }
+      // justify-content: space-between;
+    }
+    .ant-select {
+      width: 100%;
+      text-align: left;
+    }
+    .active-td {
+      border: 1px solid blue;
+    }
+  }
+  .handsontableInput {
+    line-height: 30px;
+  }
+</style>

src/views/system/CodeDataRuleTemplate/index.vue

@@ -0,0 +1,192 @@
+<template>
+  <div>
+    <BasicTable class="ds-table" @register="registerTable" @row-dbClick="handleAudit">
+      <template #tableTitle>
+        <div class="tableTitleBox">
+          <a-tooltip placement="top" :mouseEnterDelay="0.5">
+            <template #title>
+              <span>新建</span>
+            </template>
+            <span class="ds-action-svg-btn">
+              <a-button v-repeat type="link" @click="handleCreate">
+                <img src="../../../assets/svg/infoclient/xinjian.svg" class="SvgImg" />
+              </a-button>
+            </span>
+          </a-tooltip>
+          <a-tooltip placement="top" :mouseEnterDelay="0.5">
+            <template #title>
+              <span>复制</span>
+            </template>
+            <a-button v-repeat type="link" @click="handleCreate">
+              <img src="../../../assets/svg/infoclient/fuzhi.svg" class="SvgImg" />
+            </a-button>
+          </a-tooltip>
+          <a-tooltip placement="top" :mouseEnterDelay="0.5">
+            <template #title>
+              <span>删除</span>
+            </template>
+            <span class="ds-action-svg-btn">
+              <a-popconfirm
+                title="确定删除当前选中数据？"
+                ok-text="是"
+                cancel-text="否"
+                @confirm="handleDelete"
+              >
+                <a-button v-repeat type="link">
+                  <img src="../../../assets/svg/infoclient/shanchu.svg" class="SvgImg" />
+                </a-button>
+              </a-popconfirm>
+            </span>
+          </a-tooltip>
+        </div>
+        <!-- <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" />
+  </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 [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) => {
+      return formatParams(p)
+    },
+    columns,
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+    },
+    isTreeTable: false,
+    pagination: true,
+    striped: true,
+    useSearchForm: true,
+    showTableSetting: true,
+    bordered: true,
+    showIndexColumn: true,
+    indexColumnProps: {
+      width: 60,
+    },
+    canResize: true,
+    resizeHeightOffset: 35,
+    immediate: true,
+    actionColumn: {
+      width: 80,
+      title: '操作',
+      dataIndex: 'action',
+      fixed: 'right',
+    },
+    // rowSelection: { type: 'checkbox' },
+    // clickToRowSelect: false,
+  })
+  function handleCreate() {
+    openModal(true, {
+      isUpdate: false,
+    })
+  }
+  function handleAudit(record: Recordable) {
+    openModal(true, {
+      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;
+    }
+  }
+  .SvgImg {
+    width: 16px;
+  }
+  .tableTitleBox {
+    .ant-btn-link {
+      border-radius: 2px;
+      color: #000;
+      font-size: 16px;
+    }
+  }
+</style>