feat: ele use desc comp

2025-10-21 15:33:32 +08:00
parent 18ef9031ca
commit d368582a90
32 changed files with 266 additions and 408 deletions
--- a/apps/web-ele/src/views/pay/order/data.ts
+++ b/apps/web-ele/src/views/pay/order/data.ts
@@ -1,6 +1,5 @@
 import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { PayOrderApi } from '#/api/pay/order';
 import type { DescriptionItemSchema } from '#/components/description';

 import { h } from 'vue';
@@ -184,53 +183,46 @@ export function useDetailSchema(): DescriptionItemSchema[] {
    {
      field: 'status',
      label: '支付状态',
-      content: (data: any) =>
+      render: (val) =>
        h(DictTag, {
          type: DICT_TYPE.PAY_ORDER_STATUS,
-          value: data?.status,
+          value: val,
        }),
    },
    {
      field: 'price',
      label: '支付金额',
-      content: (data: PayOrderApi.Order) =>
-        `￥${erpPriceInputFormatter(data?.price)}`,
+      render: (val) => `￥${erpPriceInputFormatter(val)}`,
    },
    {
      field: 'channelFeePrice',
      label: '手续费',
-      content: (data: PayOrderApi.Order) =>
-        `￥${erpPriceInputFormatter(data?.channelFeePrice)}`,
+      render: (val) => `￥${erpPriceInputFormatter(val)}`,
    },
    {
      field: 'channelFeeRate',
      label: '手续费比例',
-      content: (data: PayOrderApi.Order) =>
-        `${erpPriceInputFormatter(data?.channelFeeRate)}%`,
+      render: (val) => `${erpPriceInputFormatter(val)}%`,
    },
    {
      field: 'successTime',
      label: '支付时间',
-      content: (data: PayOrderApi.Order) =>
-        formatDateTime(data?.successTime) as string,
+      render: (val) => formatDateTime(val) as string,
    },
    {
      field: 'expireTime',
      label: '失效时间',
-      content: (data: PayOrderApi.Order) =>
-        formatDateTime(data?.expireTime) as string,
+      render: (val) => formatDateTime(val) as string,
    },
    {
      field: 'createTime',
      label: '创建时间',
-      content: (data: PayOrderApi.Order) =>
-        formatDateTime(data?.createTime) as string,
+      render: (val) => formatDateTime(val) as string,
    },
    {
      field: 'updateTime',
      label: '更新时间',
-      content: (data: PayOrderApi.Order) =>
-        formatDateTime(data?.updateTime) as string,
+      render: (val) => formatDateTime(val) as string,
    },
    {
      field: 'subject',
@@ -243,10 +235,10 @@ export function useDetailSchema(): DescriptionItemSchema[] {
    {
      field: 'channelCode',
      label: '支付渠道',
-      content: (data: PayOrderApi.Order) =>
+      render: (val) =>
        h(DictTag, {
          type: DICT_TYPE.PAY_CHANNEL_CODE,
-          value: data?.channelCode,
+          value: val,
        }),
    },
    {
@@ -256,10 +248,7 @@ export function useDetailSchema(): DescriptionItemSchema[] {
    {
      field: 'channelOrderNo',
      label: '渠道单号',
-      content: (data: PayOrderApi.Order) =>
-        data?.channelOrderNo
-          ? h(ElTag, { color: 'green' }, () => data.channelOrderNo)
-          : '',
+      render: (val) => (val ? h(ElTag, { color: 'green' }, () => val) : ''),
    },
    {
      field: 'channelUserId',
@@ -268,8 +257,7 @@ export function useDetailSchema(): DescriptionItemSchema[] {
    {
      field: 'refundPrice',
      label: '退款金额',
-      content: (data: PayOrderApi.Order) =>
-        `￥${erpPriceInputFormatter(data?.refundPrice)}`,
+      render: (val) => `￥${erpPriceInputFormatter(val)}`,
    },
    {
      field: 'notifyUrl',
--- a/apps/web-ele/src/views/pay/order/modules/detail.vue
+++ b/apps/web-ele/src/views/pay/order/modules/detail.vue
@@ -13,14 +13,8 @@ import { useDetailSchema } from '../data';
 const formData = ref<PayOrderApi.Order>();

 const [Descriptions] = useDescription({
-  componentProps: {
-    border: true,
-    column: 2,
-    direction: 'horizontal',
-    labelWidth: 140,
-    title: '',
-    extra: '',
-  },
+  column: 2,
+  labelWidth: 140,
  schema: useDetailSchema(),
 });

--- a/apps/web-ele/src/views/pay/refund/data.ts
+++ b/apps/web-ele/src/views/pay/refund/data.ts
@@ -1,6 +1,5 @@
 import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { PayRefundApi } from '#/api/pay/refund';
 import type { DescriptionItemSchema } from '#/components/description';

 import { h } from 'vue';
@@ -173,26 +172,22 @@ export function useDetailSchema(): DescriptionItemSchema[] {
    {
      field: 'merchantRefundId',
      label: '商户退款单号',
-      content: (data: PayRefundApi.Refund) =>
-        h(ElTag, {}, () => data?.merchantRefundId || '-'),
+      render: (val) => h(ElTag, {}, () => val || '-'),
    },
    {
      field: 'channelRefundNo',
      label: '渠道退款单号',
-      content: (data: PayRefundApi.Refund) =>
-        h(ElTag, { type: 'success' }, () => data?.channelRefundNo || '-'),
+      render: (val) => h(ElTag, { type: 'success' }, () => val || '-'),
    },
    {
      field: 'merchantOrderId',
      label: '商户支付单号',
-      content: (data: PayRefundApi.Refund) =>
-        h(ElTag, {}, () => data?.merchantOrderId || '-'),
+      render: (val) => h(ElTag, {}, () => val || '-'),
    },
    {
      field: 'channelOrderNo',
      label: '渠道支付单号',
-      content: (data: PayRefundApi.Refund) =>
-        h(ElTag, { type: 'success' }, () => data?.channelOrderNo || '-'),
+      render: (val) => h(ElTag, { type: 'success' }, () => val || '-'),
    },
    {
      field: 'appId',
@@ -205,58 +200,55 @@ export function useDetailSchema(): DescriptionItemSchema[] {
    {
      field: 'payPrice',
      label: '支付金额',
-      content: (data: PayRefundApi.Refund) =>
+      render: (val) =>
        h(
          ElTag,
          { type: 'success' },
-          () => `￥${erpPriceInputFormatter(data?.payPrice || 0)}`,
+          () => `￥${erpPriceInputFormatter(val || 0)}`,
        ),
    },
    {
      field: 'refundPrice',
      label: '退款金额',
-      content: (data: PayRefundApi.Refund) =>
+      render: (val) =>
        h(
          ElTag,
          { type: 'danger' },
-          () => `￥${erpPriceInputFormatter(data?.refundPrice || 0)}`,
+          () => `￥${erpPriceInputFormatter(val || 0)}`,
        ),
    },
    {
      field: 'status',
      label: '退款状态',
-      content: (data: any) =>
+      render: (val) =>
        h(DictTag, {
          type: DICT_TYPE.PAY_REFUND_STATUS,
-          value: data?.status,
+          value: val,
        }),
    },
    {
      field: 'successTime',
      label: '退款时间',
-      content: (data: PayRefundApi.Refund) =>
-        formatDateTime(data?.successTime) as string,
+      render: (val) => formatDateTime(val) as string,
    },
    {
      field: 'createTime',
      label: '创建时间',
-      content: (data: PayRefundApi.Refund) =>
-        formatDateTime(data?.createTime) as string,
+      render: (val) => formatDateTime(val) as string,
    },
    {
      field: 'updateTime',
      label: '更新时间',
-      content: (data: PayRefundApi.Refund) =>
-        formatDateTime(data?.updateTime) as string,
+      render: (val) => formatDateTime(val) as string,
    },
    // 渠道信息部分
    {
      field: 'channelCode',
      label: '退款渠道',
-      content: (data: PayRefundApi.Refund) =>
+      render: (val) =>
        h(DictTag, {
          type: DICT_TYPE.PAY_CHANNEL_CODE,
-          value: data?.channelCode,
+          value: val,
        }),
    },
    {
--- a/apps/web-ele/src/views/pay/refund/modules/detail.vue
+++ b/apps/web-ele/src/views/pay/refund/modules/detail.vue
@@ -13,14 +13,8 @@ import { useDetailSchema } from '../data';
 const formData = ref<PayRefundApi.Refund>();

 const [Descriptions] = useDescription({
-  componentProps: {
-    border: true,
-    column: 2,
-    direction: 'horizontal',
-    labelWidth: 140,
-    title: '',
-    extra: '',
-  },
+  column: 2,
+  labelWidth: 140,
  schema: useDetailSchema(),
 });

--- a/apps/web-ele/src/views/pay/transfer/data.ts
+++ b/apps/web-ele/src/views/pay/transfer/data.ts
@@ -1,6 +1,5 @@
 import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { PayTransferApi } from '#/api/pay/transfer';
 import type { DescriptionItemSchema } from '#/components/description';

 import { h } from 'vue';
@@ -191,14 +190,12 @@ export function useDetailSchema(): DescriptionItemSchema[] {
    {
      field: 'merchantTransferId',
      label: '商户单号',
-      content: (data: PayTransferApi.Transfer) =>
-        h(ElTag, {}, () => data?.merchantTransferId),
+      render: (val) => h(ElTag, {}, () => val),
    },
    {
      field: 'no',
      label: '转账单号',
-      content: (data: PayTransferApi.Transfer) =>
-        h(ElTag, { color: 'orange' }, () => data?.no),
+      render: (val) => h(ElTag, { color: 'orange' }, () => val),
    },
    {
      field: 'appId',
@@ -207,33 +204,31 @@ export function useDetailSchema(): DescriptionItemSchema[] {
    {
      field: 'status',
      label: '转账状态',
-      content: (data: any) =>
+      render: (val) =>
        h(DictTag, {
          type: DICT_TYPE.PAY_TRANSFER_STATUS,
-          value: data?.status,
+          value: val,
        }),
    },
    {
      field: 'price',
      label: '转账金额',
-      content: (data: PayTransferApi.Transfer) =>
+      render: (val) =>
        h(
          ElTag,
          { color: 'success' },
-          () => `￥${erpPriceInputFormatter(data?.price || 0)}`,
+          () => `￥${erpPriceInputFormatter(val || 0)}`,
        ),
    },
    {
      field: 'successTime',
      label: '转账时间',
-      content: (data: PayTransferApi.Transfer) =>
-        formatDateTime(data?.successTime) as string,
+      render: (val) => formatDateTime(val) as string,
    },
    {
      field: 'createTime',
      label: '创建时间',
-      content: (data: PayTransferApi.Transfer) =>
-        formatDateTime(data?.createTime) as string,
+      render: (val) => formatDateTime(val) as string,
    },
    {
      field: 'userName',
@@ -246,10 +241,10 @@ export function useDetailSchema(): DescriptionItemSchema[] {
    {
      field: 'channelCode',
      label: '支付渠道',
-      content: (data: PayTransferApi.Transfer) =>
+      render: (val) =>
        h(DictTag, {
          type: DICT_TYPE.PAY_CHANNEL_CODE,
-          value: data?.channelCode,
+          value: val,
        }),
    },
    {
@@ -259,10 +254,7 @@ export function useDetailSchema(): DescriptionItemSchema[] {
    {
      field: 'channelTransferNo',
      label: '渠道单号',
-      content: (data: PayTransferApi.Transfer) =>
-        data?.channelTransferNo
-          ? h(ElTag, { color: 'success' }, () => data.channelTransferNo)
-          : '',
+      render: (val) => (val ? h(ElTag, { color: 'success' }, () => val) : ''),
    },
    {
      field: 'notifyUrl',
--- a/apps/web-ele/src/views/pay/transfer/modules/detail.vue
+++ b/apps/web-ele/src/views/pay/transfer/modules/detail.vue
@@ -13,14 +13,8 @@ import { useDetailSchema } from '../data';
 const formData = ref<PayTransferApi.Transfer>();

 const [Descriptions] = useDescription({
-  componentProps: {
-    border: true,
-    column: 2,
-    direction: 'horizontal',
-    labelWidth: 140,
-    title: '',
-    extra: '',
-  },
+  column: 2,
+  labelWidth: 140,
  schema: useDetailSchema(),
 });