diff --git a/src/api/common/index.ts b/src/api/common/index.ts
index 159634aa..da6df7d9 100644
--- a/src/api/common/index.ts
+++ b/src/api/common/index.ts
@@ -432,6 +432,14 @@ export function GetMultiClientList() {
   })
 }
 
+// 客户参数类别下拉列表集合
+export function GetTenantParamSelectList() {
+  return request({
+    url: '/mainApi/ClientParam/GetTenantParamSelectList',
+    method: 'get'
+  })
+}
+
 /**
  * 上传api路径
  */
diff --git a/src/store/modules/configOptions.ts b/src/store/modules/configOptions.ts
index 9833738b..11ae8025 100644
--- a/src/store/modules/configOptions.ts
+++ b/src/store/modules/configOptions.ts
@@ -24,7 +24,7 @@ import {
   GetCodeCountryList
 } from '/@/views/operation/seaexport/api/BookingLedger'
 import { getList } from '/@/views/flowcenter/flowInstances/api'
-import { GetFeeCurrencySelectList, GetClientListByCode, GetCtnSelectList } from '/@/api/common/index'
+import { GetFeeCurrencySelectList, GetClientListByCode, GetCtnSelectList, GetTenantParamSelectList } from '/@/api/common/index'
 import { getClientBankList } from '/@/views/baseinfo/infoclient/api'
 export default {
   // 业务来源
@@ -164,5 +164,11 @@ export default {
     return GetCodeCountryList().then((res) => {
       return res.data
     })
+  },
+  // 客户参数类别
+  GetTenantParamSelectList: () => {
+    return GetTenantParamSelectList().then((res) => {
+      return res.data
+    })
   }
 }
diff --git a/src/store/modules/options.ts b/src/store/modules/options.ts
index 38214224..fcd60373 100644
--- a/src/store/modules/options.ts
+++ b/src/store/modules/options.ts
@@ -55,7 +55,9 @@ export const useOptionsStore = defineStore({
     // 工厂
     GetFactorySelectList: null,
     // 箱型
-    GetCtnSelectList: null
+    GetCtnSelectList: null,
+    // 客户参数类别
+    GetTenantParamSelectList: null
   }),
   getters: {
     // 通过code获取下拉字典（code)就是接口尾部单词
diff --git a/src/views/system/params/api.ts b/src/views/system/params/api.ts
new file mode 100644
index 00000000..f076ded1
--- /dev/null
+++ b/src/views/system/params/api.ts
@@ -0,0 +1,56 @@
+/*
+ * @Description: 
+ * @Author: lijj
+ * @Date: 2024-04-25 15:48:33
+ */
+
+import { request } from '/@/utils/request'
+import { DataResult, PageRequest } from '/@/api/model/baseModel'
+enum Api {
+  list = '/mainApi/ClientParam/GetClientParamList',
+  edit = '/mainApi/ClientParam//EditClientParam',
+  info = '/mainApi/ClientParam/GetClientParamInfo',
+  delete = '/mainApi/ClientParam/BatchDelClientParam',
+  GetTenantParamDataSelectList = '/mainApi/ClientParam/GetTenantParamDataSelectList'
+}
+// 列表 (Auth)
+export function GetClientParamList(data: PageRequest) {
+  return request<DataResult>({
+    url: Api.list,
+    method: 'post',
+    data
+  })
+}
+// 编辑 (Auth)
+export function EditClientParam(data: PageRequest) {
+  return request<DataResult>({
+    url: Api.edit,
+    method: 'post',
+    data
+  })
+}
+// 详情 (Auth)
+export function GetClientParamInfo(query) {
+  return request<DataResult>({
+    url: Api.info,
+    method: 'get',
+    params: query
+  })
+}
+
+// 删除 (Auth)
+export function BatchDelClientParam(data: PageRequest) {
+  return request<DataResult>({
+    url: Api.delete,
+    method: 'post',
+    data
+  })
+}
+
+export function GetTenantParamDataSelectList(query) {
+  return request<DataResult>({
+    url: Api.GetTenantParamDataSelectList,
+    method: 'get',
+    params: query
+  })
+}
\ No newline at end of file
diff --git a/src/views/system/params/columns.tsx b/src/views/system/params/columns.tsx
new file mode 100644
index 00000000..ee44550b
--- /dev/null
+++ b/src/views/system/params/columns.tsx
@@ -0,0 +1,190 @@
+/*
+ * @Description: 
+ * @Author: lijj
+ * @Date: 2024-04-25 15:48:33
+ */
+import { ref } from 'vue'
+import { BasicColumn, FormSchema } from '/@/components/Table'
+// 引入字典数据
+import { getDictOption } from '/@/utils/dictUtil'
+// 下拉数据
+import { getOptions } from '/@/hooks/dict'
+import { useOptionsStore } from '/@/store/modules/options'
+import { GetTenantParamDataSelectList } from './api'
+const optionsStore = useOptionsStore()
+const itemNameOption = ref([])
+// 模块字典
+const modulesDict = await getDictOption('modules')
+export const columns: BasicColumn[] = [
+  {
+    title: '客户名称',
+    dataIndex: 'customerName',
+    width: 150
+  },
+  {
+    title: '客户参数类型',
+    dataIndex: 'paramType',
+    width: 150
+  },
+  {
+    title: '客户参数名称',
+    dataIndex: 'paramName',
+    width: 200
+  },
+  {
+    title: '备注',
+    dataIndex: 'note',
+    width: 200
+  }
+]
+
+export const searchFormSchema: FormSchema[] = [
+  {
+    field: 'paramName',
+    label: '客户参数名称',
+    colProps: { span: 6 },
+    component: 'Input'
+  },
+]
+export const formSchema: FormSchema[] = [
+  {
+    label: '',
+    field: 'id',
+    component: 'Input',
+    defaultValue: '',
+    show: false
+  },
+  {
+    field: 'paramCode',
+    label: '客户参数类别',
+    required: true,
+    component: 'ApiSelect',
+    colProps: { span: 12 },
+    componentProps: ({ formModel }) => {
+      return {
+        option: optionsStore.getOptionsByCode('GetTenantParamSelectList'),
+        labelField: 'paramName',
+        valueField: 'paramCode',
+        filterOption: (input: string, option: any) => {
+          return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+        },
+        onChange: (e, obj) => {
+          GetTenantParamDataSelectList({ code: e }).then(res => {
+            itemNameOption.value = res.data
+          })
+          if (obj) {
+            formModel.paramName = obj.label
+            formModel.paramId = obj.id
+            formModel.paramType = obj.type
+          } else {
+            formModel.paramName = ''
+            formModel.paramId = ''
+            formModel.paramType = ''
+          }
+        }
+      }
+    }
+  },
+  {
+    field: 'itemCode',
+    label: '客户参数名称',
+    required: true,
+    component: 'ApiSelect',
+    colProps: { span: 12 },
+    componentProps: ({ formModel }) => {
+      return {
+        option: itemNameOption.value,
+        labelField: 'itemName',
+        valueField: 'itemCode',
+        filterOption: (input: string, option: any) => {
+          return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+        },
+        onChange: (e, obj) => {
+          if (obj) {
+            formModel.itemName = obj.label
+          } else {
+            formModel.itemName = ''
+          }
+        }
+      }
+    }
+  },
+  {
+    label: '',
+    field: 'itemName',
+    component: 'Input',
+    defaultValue: '',
+    show: false
+  },
+  {
+    label: '',
+    field: 'customerName',
+    component: 'Input',
+    defaultValue: '',
+    show: false
+  },
+  {
+    label: '',
+    field: 'paramId',
+    component: 'Input',
+    defaultValue: '',
+    show: false
+  },
+  {
+    label: '',
+    field: 'paramName',
+    component: 'Input',
+    defaultValue: '',
+    show: false
+  },
+  {
+    label: '',
+    field: 'paramType',
+    component: 'Input',
+    defaultValue: '',
+    show: false
+  },
+  {
+    field: 'customerId',
+    label: '客户名称',
+    required: true,
+    component: 'ApiSelect',
+    colProps: { span: 12 },
+    componentProps: ({ formModel }) => {
+      return {
+        api: () => {
+          return new Promise((resolve) => {
+            const arr = getOptions('custom')
+            resolve(arr)
+          })
+        },
+        labelField: 'shortName',
+        valueField: 'codeName',
+        resultField: 'data',
+        filterOption: (input: string, option: any) => {
+          return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+        },
+        onChange: (e, obj) => {
+          if (obj) {
+            formModel.customerName = obj.label
+          } else {
+            formModel.customerName = ''
+          }
+        }
+      }
+    }
+  },
+  {
+    field: 'orderNo',
+    label: '排序',
+    required: true,
+    component: 'Input',
+    colProps: { span: 12 }
+  },
+  {
+    field: 'note',
+    label: '备注',
+    component: 'InputTextArea',
+    colProps: { span: 24 }
+  }
+]
diff --git a/src/views/system/params/components/Modal.vue b/src/views/system/params/components/Modal.vue
new file mode 100644
index 00000000..0f306422
--- /dev/null
+++ b/src/views/system/params/components/Modal.vue
@@ -0,0 +1,110 @@
+<template>
+  <BasicModal
+    v-bind="$attrs"
+    :use-wrapper="true"
+    :title="getTitle"
+    :form-schema="formSchema"
+    width="50%"
+    @register="registerModal"
+    @ok="handleSave"
+  >
+    <!-- 包装表单 -->
+    <BasicForm @register="registerForm" />
+    <!--右下角按钮-->
+    <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 { formSchema } from '../columns'
+  // 相关接口
+  import { EditClientParam, GetClientParamInfo } from '../api'
+  // 提示消息混入
+  import { useMessage } from '/@/hooks/web/useMessage'
+  // 声明Emits
+  const emit = defineEmits(['success', 'register'])
+  const isUpdate = ref(true)
+  // 按钮loading
+  const loading = ref(false)
+  const rowId = ref('')
+  const { createMessage } = useMessage()
+  const [registerForm, { resetFields, setFieldsValue, 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 });
+      updateFormField(updateSchema)
+      rowId.value = data.record.id
+      const res: API.DataResult = await GetClientParamInfo({ id: unref(rowId) })
+      if (res.succeeded) {
+        setFieldsValue({
+          ...res.data,
+        })
+      }
+    } else {
+      setFieldsValue({ permissionIdentity: unref(2) })
+    }
+    setModalProps({ loading: false })
+  })
+
+  const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'))
+
+  async function handleSave(exit) {
+    try {
+      const values = await validate()
+      loading.value = true
+      setModalProps({ confirmLoading: true, loading: true })
+      const res: API.DataResult = await EditClientParam(values)
+      loading.value = false
+      if (res.succeeded) {
+        createMessage.success(res.message)
+        emit('success')
+      } else {
+        createMessage.error(res.message)
+      }
+      exit && closeModal()
+    } finally {
+      setModalProps({ confirmLoading: false, loading: false })
+    }
+  }
+</script>
diff --git a/src/views/system/params/index.vue b/src/views/system/params/index.vue
new file mode 100644
index 00000000..ac43e887
--- /dev/null
+++ b/src/views/system/params/index.vue
@@ -0,0 +1,115 @@
+<template>
+  <div>
+    <BasicTable
+      class="ds-table"
+      @register="registerTable"
+    >
+      <template #toolbar>
+        <a-button type="link" @click="handleCreate">
+          <span class="iconfont icon-tianjia"></span>
+          新建
+        </a-button>
+      </template>
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              {
+                icon: 'clarity:note-edit-line',
+                tooltip: '编辑',
+                onClick: handleEdit.bind(null, record),
+              },
+              {
+                icon: 'ant-design:delete-outlined',
+                tooltip: '删除',
+                color: 'error',
+                popConfirm: {
+                  title: '是否要删除此条数据？',
+                  okText: '是',
+                  cancelText: '否',
+                  confirm: handleDelete.bind(null, record)
+                }
+              }
+            ]"
+          />
+        </template>
+      </template>
+    </BasicTable>
+    <Modal @register="registerModal" @success="handleSuccess" />
+  </div>
+</template>
+<script lang="ts" setup>
+  import { onMounted } from 'vue'
+  import { BasicTable, useTable, TableAction } from '/@/components/Table'
+  import { formatParams } from '/@/hooks/web/common'
+  import { GetClientParamList, BatchDelClientParam } from './api'
+  import { useModal } from '/@/components/Modal'
+  import Modal from './components/Modal.vue'
+  import { columns, searchFormSchema } from './columns'
+  import { useMessage } from '/@/hooks/web/useMessage'
+  const { notification } = useMessage()
+  const [registerModal, { openModal }] = useModal()
+  const [registerTable, { reload, getForm, getPaginationRef }] = useTable({
+    api: async (p) => {
+      const res: API.DataResult = await GetClientParamList(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,
+    canResize: false,
+    actionColumn: {
+      width: 80,
+      title: '操作',
+      dataIndex: 'action',
+      fixed: 'right',
+    },
+  })
+
+  function handleCreate() {
+    openModal(true, {
+      isParent: false,
+      isUpdate: false,
+    })
+  }
+
+  function handleEdit(record: Recordable) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+    })
+  }
+  // 删除
+  async function handleDelete(record: Recordable) {
+    const res: API.DataResult = await BatchDelClientParam({
+      id: '',
+      ids: [record.id],
+    })
+    if (res.succeeded) {
+      notification.success({ message: res.message, duration: 3 })
+      reload()
+    } else {
+      notification.error({ message: res.message, duration: 3 })
+    }
+  }
+  onMounted(() => {
+    //初始化字典选项
+  })
+  function handleSuccess() {
+    reload()
+  }
+</script>