提交

2026-03-19 18:55:37 +08:00 · 2026-03-19 18:55:37 +08:00 · 5410afabd2
parent 8491bc3427
commit 5410afabd2
13 changed files with 539 additions and 35 deletions
--- a/package.json
+++ b/package.json
@ -25,14 +25,18 @@
    "crypto-js": "^4.2.0",
    "dayjs": "^1.11.20",
    "element-plus": "^2.13.2",
+    "file-saver": "^2.0.5",
    "pinia": "^3.0.4",
    "vue": "^3.5.29",
-    "vue-router": "^5.0.3"
+    "vue-router": "^5.0.3",
+    "xlsx": "^0.18.5"
  },
  "devDependencies": {
    "@tsconfig/node24": "^24.0.4",
    "@types/crypto-js": "^4.2.2",
+    "@types/file-saver": "^2.0.7",
    "@types/node": "^24.10.13",
+    "@types/xlsx": "^0.0.36",
    "@vitejs/plugin-vue": "^6.0.4",
    "@vue/eslint-config-typescript": "^14.7.0",
    "@vue/tsconfig": "^0.8.1",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -38,6 +38,9 @@ importers:
      element-plus:
        specifier: ^2.13.2
        version: 2.13.2(vue@3.5.29(typescript@5.9.3))
+      file-saver:
+        specifier: ^2.0.5
+        version: 2.0.5
      pinia:
        specifier: ^3.0.4
        version: 3.0.4(typescript@5.9.3)(vue@3.5.29(typescript@5.9.3))
@ -47,6 +50,9 @@ importers:
      vue-router:
        specifier: ^5.0.3
        version: 5.0.3(@vue/compiler-sfc@3.5.29)(pinia@3.0.4(typescript@5.9.3)(vue@3.5.29(typescript@5.9.3)))(vue@3.5.29(typescript@5.9.3))
+      xlsx:
+        specifier: ^0.18.5
+        version: 0.18.5
    devDependencies:
      '@tsconfig/node24':
        specifier: ^24.0.4
@ -54,9 +60,15 @@ importers:
      '@types/crypto-js':
        specifier: ^4.2.2
        version: 4.2.2
+      '@types/file-saver':
+        specifier: ^2.0.7
+        version: 2.0.7
      '@types/node':
        specifier: ^24.10.13
        version: 24.10.15
+      '@types/xlsx':
+        specifier: ^0.0.36
+        version: 0.0.36
      '@vitejs/plugin-vue':
        specifier: ^6.0.4
        version: 6.0.4(vite@7.3.1(@types/node@24.10.15)(jiti@2.6.1)(sass@1.97.3)(yaml@2.8.2))(vue@3.5.29(typescript@5.9.3))
@ -890,6 +902,9 @@ packages:
  '@types/event-emitter@0.3.5':
    resolution: {integrity: sha512-zx2/Gg0Eg7gwEiOIIh5w9TrhKKTeQh7CPCOPNc0el4pLSwzebA8SmnHwZs2dWlLONvyulykSwGSQxQHLhjGLvQ==}

+  '@types/file-saver@2.0.7':
+    resolution: {integrity: sha512-dNKVfHd/jk0SkR/exKGj2ggkB45MAkzvWCaqLUUgkyjITkGNzH8H+yUwr+BLJUBjZOe9w8X3wgmXhZDRg1ED6A==}
+
  '@types/json-schema@7.0.15':
    resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}

@ -908,6 +923,10 @@ packages:
  '@types/web-bluetooth@0.0.21':
    resolution: {integrity: sha512-oIQLCGWtcFZy2JW77j9k8nHzAOpqMHLQejDA48XXMWH6tjCQHz5RCFz1bzsmROyL6PUm+LLnUiI4BCn221inxA==}

+  '@types/xlsx@0.0.36':
+    resolution: {integrity: sha512-mvfrKiKKMErQzLMF8ElYEH21qxWCZtN59pHhWGmWCWFJStYdMWjkDSAy6mGowFxHXaXZWe5/TW7pBUiWclIVOw==}
+    deprecated: This is a stub types definition for xlsx (https://github.com/sheetjs/js-xlsx). xlsx provides its own type definitions, so you don't need @types/xlsx installed!
+
  '@typescript-eslint/eslint-plugin@8.56.1':
    resolution: {integrity: sha512-Jz9ZztpB37dNC+HU2HI28Bs9QXpzCz+y/twHOwhyrIRdbuVDxSytJNDl6z/aAKlaRIwC7y8wJdkBv7FxYGgi0A==}
    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
@ -1233,6 +1252,10 @@ packages:
    engines: {node: '>=0.4.0'}
    hasBin: true

+  adler-32@1.3.1:
+    resolution: {integrity: sha512-ynZ4w/nUUv5rrsR8UUGoe1VC9hZj6V5hU9Qw1HlMDJGEJw5S7TfTErWTjMys6M7vr0YWcPqs3qAr4ss0nDfP+A==}
+    engines: {node: '>=0.8'}
+
  ajv@6.14.0:
    resolution: {integrity: sha512-IWrosm/yrn43eiKqkfkHis7QioDleaXQHdDVPKg0FSwwd/DuvyX79TZnFOnYpB7dcsFAMmtFztZuXPDvSePkFw==}

@ -1303,6 +1326,10 @@ packages:
  caniuse-lite@1.0.30001774:
    resolution: {integrity: sha512-DDdwPGz99nmIEv216hKSgLD+D4ikHQHjBC/seF98N9CPqRX4M5mSxT9eTV6oyisnJcuzxtZy4n17yKKQYmYQOA==}

+  cfb@1.2.2:
+    resolution: {integrity: sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA==}
+    engines: {node: '>=0.8'}
+
  chokidar@4.0.3:
    resolution: {integrity: sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==}
    engines: {node: '>= 14.16.0'}
@ -1311,6 +1338,10 @@ packages:
    resolution: {integrity: sha512-TQMmc3w+5AxjpL8iIiwebF73dRDF4fBIieAqGn9RGCWaEVwQ6Fb2cGe31Yns0RRIzii5goJ1Y7xbMwo1TxMplw==}
    engines: {node: '>= 20.19.0'}

+  codepage@1.15.0:
+    resolution: {integrity: sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA==}
+    engines: {node: '>=0.8'}
+
  combined-stream@1.0.8:
    resolution: {integrity: sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==}
    engines: {node: '>= 0.8'}
@ -1331,6 +1362,11 @@ packages:
    resolution: {integrity: sha512-7Vv6asjS4gMOuILabD3l739tsaxFQmC+a7pLZm02zyvs8p977bL3zEgq3yDk5rn9B0PbYgIv++jmHcuUab4RhA==}
    engines: {node: '>=18'}

+  crc-32@1.2.2:
+    resolution: {integrity: sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ==}
+    engines: {node: '>=0.8'}
+    hasBin: true
+
  cross-spawn@7.0.6:
    resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==}
    engines: {node: '>= 8'}
@ -1564,6 +1600,9 @@ packages:
    resolution: {integrity: sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==}
    engines: {node: '>=16.0.0'}

+  file-saver@2.0.5:
+    resolution: {integrity: sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==}
+
  fill-range@7.1.1:
    resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==}
    engines: {node: '>=8'}
@ -1592,6 +1631,10 @@ packages:
    resolution: {integrity: sha512-8RipRLol37bNs2bhoV67fiTEvdTrbMUYcFTiy3+wuuOnUog2QBHCZWXDRijWQfAkhBj2Uf5UnVaiWwA5vdd82w==}
    engines: {node: '>= 6'}

+  frac@1.1.2:
+    resolution: {integrity: sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA==}
+    engines: {node: '>=0.8'}
+
  fsevents@2.3.3:
    resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
@ -2106,6 +2149,10 @@ packages:
    resolution: {integrity: sha512-1POYv7uv2gXoyGFpBCmpDVSNV74IfsWlDW216UPjbWufNf+bSU6GdbDsxdcxtfwb4xlI3yxzOTKClUosxARYrQ==}
    engines: {node: '>=0.10.0'}

+  ssf@0.11.2:
+    resolution: {integrity: sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==}
+    engines: {node: '>=0.8'}
+
  ssr-window@3.0.0:
    resolution: {integrity: sha512-q+8UfWDg9Itrg0yWK7oe5p/XRCJpJF9OBtXfOPgSJl+u3Xd5KI328RUEvUqSMVM9CiQUEf1QdBzJMkYGErj9QA==}

@ -2348,14 +2395,27 @@ packages:
  wildcard@1.1.2:
    resolution: {integrity: sha512-DXukZJxpHA8LuotRwL0pP1+rS6CS7FF2qStDDE1C7DDg2rLud2PXRMuEDYIPhgEezwnlHNL4c+N6MfMTjCGTng==}

+  wmf@1.0.2:
+    resolution: {integrity: sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw==}
+    engines: {node: '>=0.8'}
+
  word-wrap@1.2.5:
    resolution: {integrity: sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==}
    engines: {node: '>=0.10.0'}

+  word@0.3.0:
+    resolution: {integrity: sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA==}
+    engines: {node: '>=0.8'}
+
  wsl-utils@0.1.0:
    resolution: {integrity: sha512-h3Fbisa2nKGPxCpm89Hk33lBLsnaGBvctQopaBSOW/uIs6FTe1ATyAnKFJrzVs9vpGdsTe73WF3V4lIsk4Gacw==}
    engines: {node: '>=18'}

+  xlsx@0.18.5:
+    resolution: {integrity: sha512-dmg3LCjBPHZnQp5/F/+nnTa+miPJxUXB6vtk42YjBBKayDNagxGEeIdWApkYPOf3Z3pm3k62Knjzp7lMeTEtFQ==}
+    engines: {node: '>=0.8'}
+    hasBin: true
+
  xml-name-validator@4.0.0:
    resolution: {integrity: sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==}
    engines: {node: '>=12'}
@ -2954,6 +3014,8 @@ snapshots:

  '@types/event-emitter@0.3.5': {}

+  '@types/file-saver@2.0.7': {}
+
  '@types/json-schema@7.0.15': {}

  '@types/lodash-es@4.17.12':
@ -2970,6 +3032,10 @@ snapshots:

  '@types/web-bluetooth@0.0.21': {}

+  '@types/xlsx@0.0.36':
+    dependencies:
+      xlsx: 0.18.5
+
  '@typescript-eslint/eslint-plugin@8.56.1(@typescript-eslint/parser@8.56.1(eslint@10.0.2(jiti@2.6.1))(typescript@5.9.3))(eslint@10.0.2(jiti@2.6.1))(typescript@5.9.3)':
    dependencies:
      '@eslint-community/regexpp': 4.12.2
@ -3439,6 +3505,8 @@ snapshots:

  acorn@8.16.0: {}

+  adler-32@1.3.1: {}
+
  ajv@6.14.0:
    dependencies:
      fast-deep-equal: 3.1.3
@ -3509,6 +3577,11 @@ snapshots:

  caniuse-lite@1.0.30001774: {}

+  cfb@1.2.2:
+    dependencies:
+      adler-32: 1.3.1
+      crc-32: 1.2.2
+
  chokidar@4.0.3:
    dependencies:
      readdirp: 4.1.2
@ -3517,6 +3590,8 @@ snapshots:
    dependencies:
      readdirp: 5.0.0

+  codepage@1.15.0: {}
+
  combined-stream@1.0.8:
    dependencies:
      delayed-stream: 1.0.0
@ -3533,6 +3608,8 @@ snapshots:
    dependencies:
      is-what: 5.5.0

+  crc-32@1.2.2: {}
+
  cross-spawn@7.0.6:
    dependencies:
      path-key: 3.1.1
@ -3813,6 +3890,8 @@ snapshots:
    dependencies:
      flat-cache: 4.0.1

+  file-saver@2.0.5: {}
+
  fill-range@7.1.1:
    dependencies:
      to-regex-range: 5.0.1
@ -3839,6 +3918,8 @@ snapshots:
      hasown: 2.0.2
      mime-types: 2.1.35

+  frac@1.1.2: {}
+
  fsevents@2.3.3:
    optional: true

@ -4300,6 +4381,10 @@ snapshots:

  speakingurl@14.0.1: {}

+  ssf@0.11.2:
+    dependencies:
+      frac: 1.1.2
+
  ssr-window@3.0.0: {}

  strip-literal@3.1.0:
@ -4560,12 +4645,26 @@ snapshots:

  wildcard@1.1.2: {}

+  wmf@1.0.2: {}
+
  word-wrap@1.2.5: {}

+  word@0.3.0: {}
+
  wsl-utils@0.1.0:
    dependencies:
      is-wsl: 3.1.1

+  xlsx@0.18.5:
+    dependencies:
+      adler-32: 1.3.1
+      cfb: 1.2.2
+      codepage: 1.15.0
+      crc-32: 1.2.2
+      ssf: 0.11.2
+      wmf: 1.0.2
+      word: 0.3.0
+
  xml-name-validator@4.0.0: {}

  yallist@3.1.1: {}
--- a/src/api/modules/funding/transferDetail.ts
+++ b/src/api/modules/funding/transferDetail.ts
@ -0,0 +1,6 @@
+import { request } from '@/api';
+
+//获取转账明细列表
+export const getTransferDetailListApi = (params: any) => {
+    return request.get('/user/transferList', {...params})
+}
--- a/src/components/layout/Sidebar.vue
+++ b/src/components/layout/Sidebar.vue
@ -161,46 +161,46 @@ const staticMenuList = ref<ElMenuItem[]>(
            path: '6', // index="6"
            icon: 'GoodsFilled', // 对应 <GoodsFilled /> 图标
            children: [
-                {
-                    id: 61,
-                    label: '存款审核',
-                    path: '/funding/deposit', // index="6-1"
-                    icon: ''
-                },
-                {
-                    id: 62,
-                    label: '取款审核',
-                    path: '/funding/withdrawal', // index="6-2"
-                    icon: ''
-                },
-                {
-                    id: 63,
-                    label: '取款明细',
-                    path: '/funding/withdrawalDetail', // index="6-3"
-                    icon: ''
-                },
-                {
-                    id: 64,
-                    label: '存款明细',
-                    path: '/funding/depositDetail', // index="6-4"
-                    icon: ''
-                },
+                // {
+                //     id: 61,
+                //     label: '存款审核',
+                //     path: '/funding/deposit', // index="6-1"
+                //     icon: ''
+                // },
+                // {
+                //     id: 62,
+                //     label: '取款审核',
+                //     path: '/funding/withdrawal', // index="6-2"
+                //     icon: ''
+                // },
+                // {
+                //     id: 63,
+                //     label: '取款明细',
+                //     path: '/funding/withdrawalDetail', // index="6-3"
+                //     icon: ''
+                // },
+                // {
+                //     id: 64,
+                //     label: '存款明细',
+                //     path: '/funding/depositDetail', // index="6-4"
+                //     icon: ''
+                // },
                {
                    id: 65,
                    label: '转账明细',
                    path: '/funding/transferDetail', // index="6-5"
                    icon: ''
                },
-                {
-                    id: 66,
-                    label: '资金流水',
-                    path: '/funding/flowDetail', // index="6-6"
-                    icon: ''
-                },
+                // {
+                //     id: 66,
+                //     label: '资金流水',
+                //     path: '/funding/flowDetail', // index="6-6"
+                //     icon: ''
+                // },
                {
                    id: 67,
                    label: '收款账户列表',
-                    path: '/funding/receiverAccountList', // index="6-7"
+                    path: '/funding/receiverAccount', // index="6-7"
                    icon: ''
                },
                {
--- a/src/views/funding/deposit/options.ts
+++ b/src/views/funding/deposit/options.ts
@ -0,0 +1,39 @@
+/**
+ * @description: 搜索配置
+ */
+export const search = [
+    //存款账户
+    {
+        label: '存款账户',
+        prop: 'depositAccount',
+        type: 'input',
+        placeholder: '请输入存款账户'
+    },
+    //级别
+    {
+        label: '级别',
+        prop: 'level',
+        type: 'select',
+        placeholder: '请选择级别',
+    }
+]
+
+/**
+ * @description: 表格配置
+ */
+export const tableColumns = [
+    {label: '序号', prop: 'index'},
+    {label: '账户', prop: 'depositAccount'},
+    {label: '所属代理', prop: 'agentName'},
+    {label: '流水编号', prop: 'serialNumber'},
+    {label: '钱包地址', prop: 'walletAddress'},
+    {label: '钱包类型', prop: 'walletType'},
+    {label: '账户持有人姓名', prop: 'accountHolderName'},
+    {label: '银行名称', prop: 'bankName'},
+    {label: '银行识别代码', prop: 'bankCode'},
+]
+
+/**
+ * @description: dialog表格配置
+ */
+export const dialogTableColumns = {}
--- a/src/views/funding/deposit/rules.ts
+++ b/src/views/funding/deposit/rules.ts
--- a/src/views/funding/depositChannel/index.vue
+++ b/src/views/funding/depositChannel/index.vue
@ -1,3 +1,35 @@
 <template>
-    <h1>存款渠道</h1>
+    <div class="deposit-channel">
+        <div class="bar">
+            <el-button type="primary" @click="handleAdd">添加</el-button>
+            <el-button type="danger" @click="handleEnable">启用</el-button>
+            <el-button type="danger" @click="handleDisable">禁用</el-button>
+        </div>
+         <DepositChannelTable :table-data="tableTree" :columns="tableColumnsOptions" row-key="id" ref="tableRef"></DepositChannelTable>
+    </div>
 </template>
+<script setup lang="ts">
+//组件
+import DepositChannelTable from '@/components/common/Table.vue'
+import { tableColumns } from './options'
+
+
+//表格数据
+const tableRef = ref()
+const tableColumnsOptions = ref(tableColumns)
+const tableTree = ref([])
+</script>
+<style scoped>
+.deposit-channel {
+    .bar {
+        margin-bottom: 10px;
+        display: flex;
+        align-items: center;
+
+        span {
+            margin-right: 10px;
+        }
+    }
+
+}
+</style>
--- a/src/views/funding/depositChannel/options.ts
+++ b/src/views/funding/depositChannel/options.ts
@ -0,0 +1,9 @@
+export const tableColumns = [
+    //序号
+    { label: '序号', prop: 'index' },
+    //存款渠道名称
+    { label: '存款渠道名称', prop: 'depositChannelName' },
+    //状态
+    { label: '状态', slotName: 'status' },
+    
+]
--- a/src/views/funding/receiverAccount/index.vue
+++ b/src/views/funding/receiverAccount/index.vue
@ -1,3 +1,37 @@
 <template>
-    <h1>收款账户列表</h1>
+    <div class="receiver-account">
+        <div class="bar">
+            <el-button type="primary" @click="handleAdd">添加</el-button>
+            <el-button type="primary" @click="handleModify">编辑</el-button>
+            <el-button type="danger" @click="handleEnable">启用</el-button>
+            <el-button type="danger" @click="handleDisable">禁用</el-button>
+            <el-button type="primary" @click="handleExport">导出</el-button>
+        </div>
+         <ReceiverAccountTable :table-data="tableTree" :columns="tableColumnsOptions" row-key="id" ref="tableRef"></ReceiverAccountTable>
+    </div>
 </template>
+<script setup lang="ts">
+//组件
+import ReceiverAccountTable from '@/components/common/Table.vue'
+import { tableColumns } from './options'
+
+
+//表格数据
+const tableRef = ref()
+const tableColumnsOptions = ref(tableColumns)
+const tableTree = ref([])
+</script>
+<style scoped>
+.receiver-account {
+    .bar {
+        margin-bottom: 10px;
+        display: flex;
+        align-items: center;
+
+        span {
+            margin-right: 10px;
+        }
+    }
+
+}
+</style>
--- a/src/views/funding/receiverAccount/options.ts
+++ b/src/views/funding/receiverAccount/options.ts
@ -0,0 +1,17 @@
+export const tableColumns = [
+    //序号
+    { label: '序号', prop: 'index' },
+    //账户持有人姓名
+    { label: '账户持有人姓名', prop: 'accountHolderName' },
+    //银行名称
+    { label: '银行名称', prop: 'bankName' },
+    //银行卡号
+    { label: '银行卡号', prop: 'bankAccount' },
+    //银行识别代码
+    { label: '银行识别代码', prop: 'bankCode' },
+    //银行地址
+    { label: '银行地址', prop: 'bankAddress' },
+    //状态
+    { label: '状态', slotName: 'status' },
+    
+]
--- a/src/views/funding/transferDetail/index.vue
+++ b/src/views/funding/transferDetail/index.vue
@ -1,3 +1,215 @@
 <template>
-    <h1>转账明细</h1>
+    <div>
+        <!-- 搜索 -->
+        <TransferSearch :search-form="searchForm" :search-options="searchOptions" @search="handleSearch"
+            @reset="handleReset">
+            <template #button="{ form }">
+                <el-button type="primary" @click="handlePass()">
+                    通过
+                </el-button>
+                <el-button type="primary" @click="handleReject()">
+                    驳回
+                </el-button>
+                <el-button type="primary" @click="handleExport()">
+                    导出
+                </el-button>
+            </template>
+        </TransferSearch>
+        <!-- 表格 -->
+        <TransferTable :table-data="tableTree" :columns="tableColumnsOptions" row-key="id" ref="tableRef">
+        </TransferTable>
+        <!-- 分页 -->
+        <TransferPagination v-model="currentPage" v-model:pageSizeValue="pageSize" :total="total"
+            @pagination-change="handlePaginationChange" />
+    </div>
 </template>
+
+<script setup lang="ts">
+// 组件
+import TransferSearch from '@/components/common/Search.vue'
+import TransferTable from '@/components/common/Table.vue'
+import TransferPagination from '@/components/common/Pagination.vue'
+// 配置以及表单验证
+import { search, tableColumns } from './options'
+import { rules } from './rules'
+
+// 接口
+import { getTransferDetailListApi } from '@/api/modules/funding/transferDetail'
+
+// 导出表格
+import * as XLSX from 'xlsx'
+import { saveAs } from 'file-saver'
+/**
+ * @description: 定义搜索数据
+ */
+const searchForm = ref({
+    transferAccount: '',
+    level: '',
+})
+const searchOptions = ref(search)
+/**
+ * @description: 定义表格数据
+ */
+const tableTree = ref<any[]>([])
+const tableColumnsOptions = ref(tableColumns)
+const tableRef = ref()
+/**
+ * @description: 定义分页数据
+ */
+const currentPage = ref(1)
+const pageSize = ref(10)
+const total = ref(0)
+/**
+ * @description: 定义公共数据处理方法
+ */
+/**
+ * @description: 定义公共请求数据方法
+ */
+const getTransferDetailList = async () => {
+    const params = {
+        page: currentPage.value,
+        page_size: pageSize.value,
+        type: '',
+        start_time: '2026-02-26 02:25:08',
+        end_time: '2026-03-26 02:25:08',
+        user_name: '',
+        order_id: '',
+    }
+    const data: any = await getTransferDetailListApi(params)
+    // 表格数据
+    tableTree.value = data.data.map((item: any) => ({
+        //序号
+        index: item.id,
+        // 转出账户
+        transferAccount: item.user.username,
+        // 所属代理
+        agentName: '',
+        // 转入账号
+        transferAccountName: item.to_user_id,
+        // 转账类型
+        transferType: '',
+        // 转账金额
+        transferAmount: item.amount,
+        // 转账币种
+        transferCurrency: '',
+        // 到账金额
+        arrivalAmount: item.amount,
+        // 到账币种
+        arrivalCurrency: '',
+        // 类型
+        type: '',
+        // 状态
+        status: '',
+
+    }))
+    // 分页数据
+    total.value = data.total
+    currentPage.value = data.current_page
+    pageSize.value = Number(data.per_page)
+}
+/**
+ * @description: 页面加载完成需要请求的数据
+ */
+onMounted(() => {
+    getTransferDetailList()
+})
+/**
+ * @description: 定义搜索方法
+ */
+const handleSearch = async () => {
+    getTransferDetailList()
+}
+const handleReset = async () => {
+    getTransferDetailList()
+}
+const handlePass = async () => {
+    getTransferDetailList()
+}
+const handleReject = async () => {
+    getTransferDetailList()
+}
+/**
+ * @description: 导出表格（带表头+自定义文件名）
+ */
+const handleExport = async () => {
+    try {
+        // 1. 弹出输入框让用户输入文件名
+        const fileName = await ElMessageBox.prompt(
+            '请输入导出文件名称', // 弹窗提示语
+            '导出表格', // 弹窗标题
+            {
+                confirmButtonText: '确定',
+                cancelButtonText: '取消',
+                inputComponent: ElInput,
+                // 默认文件名（带时间戳）
+                inputValue: `转账明细_${new Date().getTime()}`,
+                // 输入框校验
+                inputValidator: (value) => {
+                    if (!value.trim()) {
+                        return '文件名不能为空！'
+                    }
+                    return true
+                },
+                inputErrorMessage: '文件名不能为空！'
+            }
+        )
+
+        // 2. 校验文件名（兜底处理）
+        const finalFileName = fileName.trim() || `转账明细_${new Date().getTime()}`
+
+        // 3. 校验表格数据
+        if (tableTree.value.length === 0) {
+            ElMessage.warning('暂无表格数据可导出！')
+            return
+        }
+
+        // 4. 构建带表头的Excel数据
+        // 4.1 处理数据：将prop映射为中文表头
+        const exportData = tableTree.value.map(item => {
+            const row: Record<string, any> = {}
+            tableColumnsOptions.value.forEach(header => {
+                row[header.label] = item[header.prop] || ''
+            })
+            return row
+        })
+
+        // 4.2 创建工作表（包含表头）
+        const ws = XLSX.utils.json_to_sheet(exportData, {
+            header: tableColumnsOptions.value.map(h => h.label), // 指定表头顺序
+            skipHeader: false // 不跳过表头（关键！保证表头显示）
+        })
+
+        // 4.3 创建工作簿并添加工作表
+        const wb = XLSX.utils.book_new()
+        XLSX.utils.book_append_sheet(wb, ws, '转账明细')
+
+        // 5. 生成Excel二进制数据
+        const wbout = XLSX.write(wb, {
+            bookType: 'xlsx',
+            bookSST: false,
+            type: 'array'
+        })
+
+        // 6. 触发下载（拼接.xlsx后缀）
+        saveAs(
+            new Blob([wbout], { type: 'application/octet-stream' }),
+            `${finalFileName}.xlsx`
+        )
+
+        ElMessage.success(`文件「${finalFileName}.xlsx」导出成功！`)
+    } catch (e: any) {
+        // 取消导出时不提示错误
+        if (e !== 'cancel') {
+            ElMessage.error('导出失败，请重试！')
+            console.error('导出表格失败：', e)
+        }
+    }
+}
+
+/**
+ * @description: 定义分页方法
+ */
+const handlePaginationChange = async () => {
+    getTransferDetailList()
+}
+</script>
--- a/src/views/funding/transferDetail/options.ts
+++ b/src/views/funding/transferDetail/options.ts
@ -0,0 +1,52 @@
+/**
+ * @description: 搜索配置
+ */
+export const search = [
+    //存款账户
+    {
+        label: '转账账户',
+        prop: 'transferAccount',
+        type: 'input' as const,
+        placeholder: '请输入转账账户'
+    },
+    //级别
+    {
+        label: '级别',
+        prop: 'level',
+        type: 'select' as const,
+        placeholder: '请选择级别',
+    },
+    //全部
+    {
+        label: '级别',
+        prop: 'level',
+        type: 'select' as const,
+        placeholder: '全部',
+    }
+]
+
+// 表格配置
+export const tableColumns = [
+    //序号
+    { label: '序号', prop: 'index' },
+    //转出账户
+    { label: '转出账户', prop: 'transferAccount' },
+    //所属代理
+    { label: '所属代理', prop: 'agentName' },
+    //转入账号
+    { label: '转入账号', prop: 'transferAccountName' },
+    //转账类型
+    { label: '转账类型', prop: 'transferType' },
+    //转账金额
+    { label: '转账金额', prop: 'transferAmount' },
+    //转账币种
+    { label: '转账币种', prop: 'transferCurrency' },
+    // 到账金额
+    { label: '到账金额', prop: 'arrivalAmount' },
+    //到账币种
+    { label: '到账币种', prop: 'arrivalCurrency' },
+    //类型
+    { label: '类型', prop: 'type' },
+    //状态
+    { label: '状态', slotName: 'status' },
+]
--- a/src/views/funding/transferDetail/rules.ts
+++ b/src/views/funding/transferDetail/rules.ts