feat：【mall 商城】分销提现的迁移（ele 100%）

2025-10-11 13:47:28 +08:00
parent 2f0ba0458e
commit 5f88a54d60
4 changed files with 92 additions and 47 deletions
--- a/apps/web-antd/src/views/mall/trade/brokerage/withdraw/data.ts
+++ b/apps/web-antd/src/views/mall/trade/brokerage/withdraw/data.ts
@@ -73,7 +73,6 @@ export function useGridFormSchema(): VbenFormSchema[] {
      componentProps: {
        ...getRangePickerDefaultProps(),
        allowClear: true,
-        placeholder: ['开始时间', '结束时间'],
      },
    },
  ];
--- a/apps/web-antd/src/views/mall/trade/brokerage/withdraw/index.vue
+++ b/apps/web-antd/src/views/mall/trade/brokerage/withdraw/index.vue
@@ -65,7 +65,7 @@ function handleReject(row: MallBrokerageWithdrawApi.BrokerageWithdraw) {
  }).then(async (val) => {
    if (val) {
      await rejectBrokerageWithdraw({
-        id: row.id as number,
+        id: row.id!,
        auditReason: val,
      });
      handleRefresh();
@@ -189,7 +189,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
          :actions="[
            {
              label: '通过',
-              type: 'link' as const,
+              type: 'link',
              icon: ACTION_ICON.EDIT,
              auth: ['trade:brokerage-withdraw:audit'],
              ifShow:
@@ -199,7 +199,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
            },
            {
              label: '驳回',
-              type: 'link' as const,
+              type: 'link',
              danger: true,
              icon: ACTION_ICON.DELETE,
              auth: ['trade:brokerage-withdraw:audit'],
@@ -210,7 +210,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
            },
            {
              label: '重新转账',
-              type: 'link' as const,
+              type: 'link',
              icon: ACTION_ICON.REFRESH,
              auth: ['trade:brokerage-withdraw:audit'],
              ifShow:
--- a/apps/web-ele/src/views/mall/trade/brokerage/withdraw/data.ts
+++ b/apps/web-ele/src/views/mall/trade/brokerage/withdraw/data.ts
@@ -15,7 +15,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
      component: 'Input',
      componentProps: {
        placeholder: '请输入用户编号',
-        clearable: true,
+        allowClear: true,
      },
    },
    {
@@ -24,7 +24,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
      component: 'Select',
      componentProps: {
        placeholder: '请选择提现类型',
-        clearable: true,
+        allowClear: true,
        options: getDictOptions(DICT_TYPE.BROKERAGE_WITHDRAW_TYPE, 'number'),
      },
    },
@@ -34,16 +34,16 @@ export function useGridFormSchema(): VbenFormSchema[] {
      component: 'Input',
      componentProps: {
        placeholder: '请输入账号',
-        clearable: true,
+        allowClear: true,
      },
    },
    {
      fieldName: 'userName',
-      label: '真实名字',
+      label: '真实姓名',
      component: 'Input',
      componentProps: {
-        placeholder: '请输入真实名字',
-        clearable: true,
+        placeholder: '请输入真实姓名',
+        allowClear: true,
      },
    },
    {
@@ -52,7 +52,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
      component: 'Select',
      componentProps: {
        placeholder: '请选择提现银行',
-        clearable: true,
+        allowClear: true,
        options: getDictOptions(DICT_TYPE.BROKERAGE_BANK_NAME, 'string'),
      },
    },
@@ -62,7 +62,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
      component: 'Select',
      componentProps: {
        placeholder: '请选择状态',
-        clearable: true,
+        allowClear: true,
        options: getDictOptions(DICT_TYPE.BROKERAGE_WITHDRAW_STATUS, 'number'),
      },
    },
@@ -72,7 +72,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
      component: 'RangePicker',
      componentProps: {
        ...getRangePickerDefaultProps(),
-        clearable: true,
+        allowClear: true,
      },
    },
  ];
@@ -88,25 +88,25 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
    },
    {
      field: 'userId',
-      title: '用户编号：',
+      title: '用户编号',
      minWidth: 80,
    },
    {
      field: 'userNickname',
-      title: '用户昵称：',
+      title: '用户昵称',
      minWidth: 80,
    },
    {
      field: 'price',
      title: '提现金额',
      minWidth: 80,
-      formatter: 'formatFenToYuanAmount',
+      formatter: 'formatAmount2',
    },
    {
      field: 'feePrice',
      title: '提现手续费',
      minWidth: 80,
-      formatter: 'formatFenToYuanAmount',
+      formatter: 'formatAmount2',
    },
    {
      field: 'type',
--- a/apps/web-ele/src/views/mall/trade/brokerage/withdraw/index.vue
+++ b/apps/web-ele/src/views/mall/trade/brokerage/withdraw/index.vue
@@ -12,7 +12,7 @@ import {
 } from '@vben/constants';
 import { formatDateTime } from '@vben/utils';

-import { ElInput, ElMessage } from 'element-plus';
+import { ElInput, ElLoading, ElMessage } from 'element-plus';

 import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import {
@@ -29,16 +29,23 @@ import { useGridColumns, useGridFormSchema } from './data';
 defineOptions({ name: 'BrokerageWithdraw' });

 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
  gridApi.query();
 }

 /** 审核通过 */
 async function handleApprove(row: MallBrokerageWithdrawApi.BrokerageWithdraw) {
  await confirm('确定要审核通过吗？');
-  await approveBrokerageWithdraw(row.id);
-  ElMessage.success($t('ui.actionMessage.operationSuccess'));
-  onRefresh();
+  const loadingInstance = ElLoading.service({
+    text: '审核通过中...',
+  });
+  try {
+    await approveBrokerageWithdraw(row.id);
+    ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    handleRefresh();
+  } finally {
+    loadingInstance.close();
+  }
 }

 /** 审核驳回 */
@@ -56,11 +63,19 @@ function handleReject(row: MallBrokerageWithdrawApi.BrokerageWithdraw) {
    modelPropName: 'value',
  }).then(async (val) => {
    if (val) {
-      await rejectBrokerageWithdraw({
-        id: row.id as number,
-        auditReason: val,
+      const loadingInstance = ElLoading.service({
+        text: '审核驳回中...',
      });
-      onRefresh();
+      try {
+        await rejectBrokerageWithdraw({
+          id: row.id!,
+          auditReason: val,
+        });
+        ElMessage.success($t('ui.actionMessage.operationSuccess'));
+        handleRefresh();
+      } finally {
+        loadingInstance.close();
+      }
    }
  });
 }
@@ -70,9 +85,16 @@ async function handleRetryTransfer(
  row: MallBrokerageWithdrawApi.BrokerageWithdraw,
 ) {
  await confirm('确定要重新转账吗？');
-  await approveBrokerageWithdraw(row.id);
-  ElMessage.success($t('ui.actionMessage.operationSuccess'));
-  onRefresh();
+  const loadingInstance = ElLoading.service({
+    text: '重新转账中...',
+  });
+  try {
+    await approveBrokerageWithdraw(row.id);
+    ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    handleRefresh();
+  } finally {
+    loadingInstance.close();
+  }
 }

 const [Grid, gridApi] = useVbenVxeGrid({
@@ -84,7 +106,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
    height: 'auto',
    keepSource: true,
    cellConfig: {
-      height: 80,
+      height: 90,
    },
    proxyConfig: {
      ajax: {
@@ -99,6 +121,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
    },
    rowConfig: {
      keyField: 'id',
+      isHover: true,
    },
    toolbarConfig: {
      refresh: true,
@@ -112,45 +135,67 @@ const [Grid, gridApi] = useVbenVxeGrid({
  <Page auto-content-height>
    <Grid table-title="佣金提现列表">
      <template #withdraw-info="{ row }">
-        <div v-if="row.type === BrokerageWithdrawTypeEnum.WALLET.type">-</div>
-        <div v-else>
-          <div v-if="row.userAccount">账号：{{ row.userAccount }}</div>
-          <div v-if="row.userName">真实姓名：{{ row.userName }}</div>
+        <div
+          v-if="row.type === BrokerageWithdrawTypeEnum.WALLET.type"
+          class="text-left"
+        >
+          -
+        </div>
+        <div v-else class="text-left">
+          <div v-if="row.userAccount" class="text-left">
+            账号：{{ row.userAccount }}
+          </div>
+          <div v-if="row.userName" class="text-left">
+            真实姓名：{{ row.userName }}
+          </div>
          <template v-if="row.type === BrokerageWithdrawTypeEnum.BANK.type">
-            <div v-if="row.bankName">银行名称：{{ row.bankName }}</div>
-            <div v-if="row.bankAddress">开户地址：{{ row.bankAddress }}</div>
+            <div v-if="row.bankName" class="text-left">
+              银行名称：{{ row.bankName }}
+            </div>
+            <div v-if="row.bankAddress" class="text-left">
+              开户地址：{{ row.bankAddress }}
+            </div>
          </template>
-          <div v-if="row.qrCodeUrl" class="mt-2">
-            <div>收款码：</div>
-            <img :src="row.qrCodeUrl" class="mt-1 h-10 w-10" />
+          <div v-if="row.qrCodeUrl" class="mt-2 text-left">
+            <div class="flex items-start gap-2">
+              <span class="flex-shrink-0">收款码：</span>
+              <img :src="row.qrCodeUrl" class="h-10 w-10 flex-shrink-0" />
+            </div>
          </div>
        </div>
      </template>
-
      <template #status-info="{ row }">
-        <div>
+        <div class="text-left">
          <DictTag
            :value="row.status"
            :type="DICT_TYPE.BROKERAGE_WITHDRAW_STATUS"
          />
-          <div v-if="row.auditTime" class="mt-1 text-xs text-gray-500">
+          <div
+            v-if="row.auditTime"
+            class="mt-1 text-left text-xs text-gray-500"
+          >
            时间：{{ formatDateTime(row.auditTime) }}
          </div>
-          <div v-if="row.auditReason" class="mt-1 text-xs text-gray-500">
+          <div
+            v-if="row.auditReason"
+            class="mt-1 text-left text-xs text-gray-500"
+          >
            审核原因：{{ row.auditReason }}
          </div>
-          <div v-if="row.transferErrorMsg" class="mt-1 text-xs text-red-500">
+          <div
+            v-if="row.transferErrorMsg"
+            class="mt-1 text-left text-xs text-red-500"
+          >
            转账失败原因：{{ row.transferErrorMsg }}
          </div>
        </div>
      </template>
-
      <template #actions="{ row }">
        <TableAction
          :actions="[
-            // 审核中状态且没有支付转账编号，显示通过和驳回按钮
            {
              label: '通过',
+              type: 'primary',
              link: true,
              icon: ACTION_ICON.EDIT,
              auth: ['trade:brokerage-withdraw:audit'],
@@ -172,6 +217,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
            },
            {
              label: '重新转账',
+              type: 'primary',
              link: true,
              icon: ACTION_ICON.REFRESH,
              auth: ['trade:brokerage-withdraw:audit'],