diff --git a/apps/web-antd/src/views/mall/promotion/coupon/components/coupon-select.vue b/apps/web-antd/src/views/mall/promotion/coupon/components/coupon-select.vue new file mode 100644 index 000000000..e43e3319b --- /dev/null +++ b/apps/web-antd/src/views/mall/promotion/coupon/components/coupon-select.vue @@ -0,0 +1,116 @@ + + + diff --git a/apps/web-antd/src/views/mall/promotion/coupon/components/data.ts b/apps/web-antd/src/views/mall/promotion/coupon/components/data.ts index 35a823b79..2b45327bd 100644 --- a/apps/web-antd/src/views/mall/promotion/coupon/components/data.ts +++ b/apps/web-antd/src/views/mall/promotion/coupon/components/data.ts @@ -1,13 +1,42 @@ import type { VbenFormSchema } from '#/adapter/form'; import type { VxeGridProps } from '#/adapter/vxe-table'; +import { DICT_TYPE } from '@vben/constants'; +import { getDictOptions } from '@vben/hooks'; + import { discountFormat, remainedCountFormat, + takeLimitCountFormat, usePriceFormat, validityTypeFormat, } from '../formatter'; +/** 优惠券选择弹窗的搜索表单 schema */ +export function useCouponSelectFormSchema(): VbenFormSchema[] { + return [ + { + component: 'Input', + fieldName: 'name', + label: '优惠券名称', + componentProps: { + placeholder: '请输入优惠券名称', + allowClear: true, + }, + }, + { + component: 'Select', + fieldName: 'discountType', + label: '优惠类型', + componentProps: { + options: getDictOptions(DICT_TYPE.PROMOTION_DISCOUNT_TYPE, 'number'), + placeholder: '请选择优惠类型', + allowClear: true, + }, + }, + ]; +} + /** 搜索表单的 schema */ export function useFormSchema(): VbenFormSchema[] { return [ @@ -23,6 +52,78 @@ export function useFormSchema(): VbenFormSchema[] { ]; } +/** 优惠券选择弹窗的表格列配置 */ +export function useCouponSelectGridColumns(): VxeGridProps['columns'] { + return [ + { type: 'checkbox', width: 55 }, + { + title: '优惠券名称', + field: 'name', + minWidth: 140, + }, + { + title: '类型', + field: 'productScope', + minWidth: 80, + cellRender: { + name: 'CellDict', + props: { type: DICT_TYPE.PROMOTION_PRODUCT_SCOPE }, + }, + }, + { + title: '优惠', + field: 'discount', + minWidth: 100, + slots: { default: 'discount' }, + }, + { + title: '领取方式', + field: 'takeType', + minWidth: 100, + cellRender: { + name: 'CellDict', + props: { type: DICT_TYPE.PROMOTION_COUPON_TAKE_TYPE }, + }, + }, + { + title: '使用时间', + field: 'validityType', + minWidth: 185, + align: 'center', + formatter: ({ row }) => validityTypeFormat(row), + }, + { + title: '发放数量', + field: 'totalCount', + align: 'center', + minWidth: 100, + }, + { + title: '剩余数量', + minWidth: 100, + align: 'center', + formatter: ({ row }) => remainedCountFormat(row), + }, + { + title: '领取上限', + field: 'takeLimitCount', + minWidth: 100, + align: 'center', + formatter: ({ row }) => takeLimitCountFormat(row), + }, + { + title: '状态', + field: 'status', + align: 'center', + minWidth: 80, + cellRender: { + name: 'CellDict', + props: { type: DICT_TYPE.COMMON_STATUS }, + }, + }, + ]; +} + /** 表格列配置 */ export function useGridColumns(): VxeGridProps['columns'] { return [ diff --git a/apps/web-antd/src/views/mall/promotion/coupon/components/index.ts b/apps/web-antd/src/views/mall/promotion/coupon/components/index.ts index 00a6c3f32..99fca49f3 100644 --- a/apps/web-antd/src/views/mall/promotion/coupon/components/index.ts +++ b/apps/web-antd/src/views/mall/promotion/coupon/components/index.ts @@ -1,2 +1,3 @@ +export { default as CouponSelect } from './coupon-select.vue'; export * from './data'; export { default as CouponSendForm } from './send-form.vue';