diff --git a/src/views/operation/CustomerReconciliation/columns.tsx b/src/views/operation/CustomerReconciliation/columns.tsx
new file mode 100644
index 00000000..976e4197
--- /dev/null
+++ b/src/views/operation/CustomerReconciliation/columns.tsx
@@ -0,0 +1,33 @@
+/*
+ * @Author: 张同海 14166000+zhangtonghai@user.noreply.gitee.com
+ * @Date: 2024-06-04 09:29:33
+ * @LastEditors: 张同海 14166000+zhangtonghai@user.noreply.gitee.com
+ * @LastEditTime: 2024-06-04 09:35:15
+ * @FilePath: \ds-wms-client-web\src\views\operation\CustomerReconciliation\columns.tsx
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+import { BasicColumn, FormSchema } from '/@/components/Table'
+export const searchFormSchema: FormSchema[] = [
+  {
+    field: 'mblno',
+    label: '主提单号',
+    component: 'Input',
+    // defaultValue: '',
+    colProps: { span: 4 },
+  },
+]
+//列表
+export const columns: BasicColumn[] = [
+  {
+    title: '单行文本',
+    dataIndex: 'testInput',
+    width: 230,
+    align: 'left',
+  },
+  {
+    title: '多行文本',
+    dataIndex: 'testTextarea',
+    width: 130,
+    align: 'left',
+  },
+]
diff --git a/src/views/operation/CustomerReconciliation/detail/index.vue b/src/views/operation/CustomerReconciliation/detail/index.vue
new file mode 100644
index 00000000..ece1683d
--- /dev/null
+++ b/src/views/operation/CustomerReconciliation/detail/index.vue
@@ -0,0 +1,34 @@
+<template>
+  <div class="p-4">
+    <BasicTable @register="registerTable"></BasicTable>
+  </div>
+</template>
+<script lang="ts" setup>
+  import { BasicTable, useTable } from '/@/components/Table'
+  import { columns, searchFormSchema } from './columns'
+  const [registerTable, { reload, getForm, getPaginationRef, getSelectRows }] = useTable({
+    title: '',
+    api: async (p) => {
+      const res: API.DataResult = await ApiList(p)
+      return new Promise((resolve) => {
+        resolve({ data: [...res.data], total: res.count })
+      })
+    },
+    columns,
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+    },
+    isTreeTable: false,
+    pagination: true,
+    striped: true,
+    useSearchForm: true,
+    showTableSetting: true,
+    bordered: true,
+    showIndexColumn: true,
+    canResize: false,
+    immediate: false,
+  })
+</script>
+
+<style lang="less"></style>
diff --git a/src/views/operation/CustomerReconciliation/index.vue b/src/views/operation/CustomerReconciliation/index.vue
index 6329e108..1f62493d 100644
--- a/src/views/operation/CustomerReconciliation/index.vue
+++ b/src/views/operation/CustomerReconciliation/index.vue
@@ -1,3 +1,44 @@
-<template> </template>
-<script lang="ts" setup></script>
+<template>
+  <div class="p-4">
+    <BasicTable @register="registerTable">
+      <template #toolbar>
+        <a-button type="primary" @click="addReconciliation"> 新建 </a-button>
+      </template>
+    </BasicTable>
+  </div>
+</template>
+<script lang="ts" setup>
+  import { BasicTable, useTable } from '/@/components/Table'
+  import { columns, searchFormSchema } from './columns'
+  import { useGo } from '/@/hooks/web/usePage'
+  const go = useGo()
+  //   表格
+  const [registerTable, { reload, getForm, getPaginationRef, getSelectRows }] = useTable({
+    title: '',
+    api: async (p) => {
+      const res: API.DataResult = await ApiList(p)
+      return new Promise((resolve) => {
+        resolve({ data: [...res.data], total: res.count })
+      })
+    },
+    columns,
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+    },
+    isTreeTable: false,
+    pagination: true,
+    striped: true,
+    useSearchForm: true,
+    showTableSetting: true,
+    bordered: true,
+    showIndexColumn: true,
+    canResize: false,
+    immediate: false,
+  })
+  function addReconciliation() {
+    go(`/CustomerReconciliationDetails?type=Add`)
+  }
+</script>
+
 <style lang="less"></style>