admin-vben/apps/web-antd/src/views/member/user/data.ts

453 lines
9.6 KiB
TypeScript

import type { VbenFormSchema } from '#/adapter/form';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import { h } from 'vue';
import { Tag } from 'ant-design-vue';
import { z } from '#/adapter/form';
import { getSimpleGroupList } from '#/api/member/group';
import { getSimpleLevelList } from '#/api/member/level';
import { getSimpleTagList } from '#/api/member/tag';
import { getAreaTree } from '#/api/system/area';
import {
CommonStatusEnum,
convertToInteger,
DICT_TYPE,
formatToFraction,
getDictOptions,
getRangePickerDefaultProps,
} from '#/utils';
/** 修改的表单 */
export function useFormSchema(): VbenFormSchema[] {
return [
{
component: 'Input',
fieldName: 'id',
dependencies: {
triggerFields: [''],
show: () => false,
},
},
{
component: 'Input',
fieldName: 'mobile',
label: '手机号',
rules: 'required',
},
{
fieldName: 'status',
label: '状态',
component: 'RadioGroup',
componentProps: {
options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
buttonStyle: 'solid',
optionType: 'button',
},
rules: z.number().default(CommonStatusEnum.ENABLE).optional(),
},
{
component: 'Input',
fieldName: 'nickname',
label: '用户昵称',
},
{
component: 'ImageUpload',
fieldName: 'avatar',
label: '头像',
componentProps: {
maxSize: 1,
},
},
{
component: 'Input',
fieldName: 'name',
label: '真实名字',
},
{
fieldName: 'sex',
label: '用户性别',
component: 'RadioGroup',
componentProps: {
options: getDictOptions(DICT_TYPE.SYSTEM_USER_SEX, 'number'),
buttonStyle: 'solid',
optionType: 'button',
},
},
{
component: 'DatePicker',
fieldName: 'birthday',
label: '出生日期',
componentProps: {
format: 'YYYY-MM-DD',
},
},
{
component: 'ApiTreeSelect',
fieldName: 'areaId',
label: '所在地',
componentProps: {
api: () => getAreaTree(),
fieldNames: { label: 'name', value: 'id', children: 'children' },
},
},
{
component: 'ApiSelect',
fieldName: 'tagIds',
label: '用户标签',
componentProps: {
api: () => getSimpleTagList(),
fieldNames: { label: 'name', value: 'id' },
mode: 'multiple',
},
},
{
component: 'ApiSelect',
fieldName: 'groupId',
label: '用户分组',
componentProps: {
api: () => getSimpleGroupList(),
fieldNames: { label: 'name', value: 'id' },
},
},
{
component: 'Textarea',
fieldName: 'mark',
label: '会员备注',
},
];
}
/** 列表的搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
return [
{
fieldName: 'nickname',
label: '用户昵称',
component: 'Input',
},
{
fieldName: 'mobile',
label: '手机号',
component: 'Input',
},
{
fieldName: 'loginDate',
label: '登录时间',
component: 'RangePicker',
componentProps: {
...getRangePickerDefaultProps(),
},
},
{
fieldName: 'createTime',
label: '注册时间',
component: 'RangePicker',
componentProps: {
...getRangePickerDefaultProps(),
},
},
{
fieldName: 'tagIds',
label: '用户标签',
component: 'ApiSelect',
componentProps: {
api: () => getSimpleTagList(),
fieldNames: { label: 'name', value: 'id' },
mode: 'multiple',
},
},
{
fieldName: 'levelId',
label: '用户等级',
component: 'ApiSelect',
componentProps: {
api: () => getSimpleLevelList(),
fieldNames: { label: 'name', value: 'id' },
},
},
{
fieldName: 'groupId',
label: '用户分组',
component: 'ApiSelect',
componentProps: {
api: () => getSimpleGroupList(),
fieldNames: { label: 'name', value: 'id' },
},
},
];
}
/** 列表的字段 */
export function useGridColumns(): VxeTableGridOptions['columns'] {
return [
{
type: 'checkbox',
width: 50,
},
{
field: 'id',
title: '用户编号',
},
{
field: 'avatar',
title: '头像',
slots: {
default: ({ row }) => {
return h('img', {
src: row.avatar,
style: { width: '40px' },
});
},
},
},
{
field: 'mobile',
title: '手机号',
},
{
field: 'nickname',
title: '昵称',
},
{
field: 'levelName',
title: '等级',
},
{
field: 'groupName',
title: '分组',
},
{
field: 'tagNames',
title: '用户标签',
slots: {
default: ({ row }) => {
return row.tagNames?.map((tagName: string, index: number) => {
return h(
Tag,
{
key: index,
class: 'mr-5px',
color: 'blue',
},
() => tagName,
);
});
},
},
},
{
field: 'point',
title: '积分',
},
{
field: 'status',
title: '状态',
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.COMMON_STATUS },
},
},
{
field: 'loginDate',
title: '登录时间',
formatter: 'formatDateTime',
},
{
field: 'createTime',
title: '注册时间',
formatter: 'formatDateTime',
},
{
title: '操作',
width: 200,
fixed: 'right',
slots: { default: 'actions' },
},
];
}
/** 修改用户等级 */
export function useLeavelFormSchema(): VbenFormSchema[] {
return [
{
component: 'Input',
fieldName: 'id',
label: '用户编号',
componentProps: {
disabled: true,
},
},
{
component: 'Input',
fieldName: 'nickname',
label: '用户昵称',
componentProps: {
disabled: true,
},
},
{
fieldName: 'point',
label: '用户等级',
component: 'ApiSelect',
componentProps: {
api: () => getSimpleLevelList(),
fieldNames: { label: 'name', value: 'id' },
},
},
{
component: 'Textarea',
fieldName: 'reason',
label: '修改原因',
rules: 'required',
},
];
}
/** 修改用户余额 */
export function useBalanceFormSchema(): VbenFormSchema[] {
return [
{
component: 'Input',
fieldName: 'id',
label: '用户编号',
componentProps: {
disabled: true,
},
},
{
component: 'Input',
fieldName: 'nickname',
label: '用户昵称',
componentProps: {
disabled: true,
},
},
{
component: 'Input',
fieldName: 'balance',
label: '变动前余额(元)',
componentProps: {
disabled: true,
},
},
{
component: 'RadioGroup',
fieldName: 'changeType',
label: '变动类型',
componentProps: {
options: [
{ label: '增加', value: 1 },
{ label: '减少', value: -1 },
],
buttonStyle: 'solid',
optionType: 'button',
},
defaultValue: 1,
},
{
component: 'InputNumber',
fieldName: 'changeBalance',
label: '变动余额(元)',
rules: 'required',
componentProps: {
min: 0,
precision: 2,
step: 0.1,
},
defaultValue: 0,
},
{
component: 'Input',
fieldName: 'balanceResult',
label: '变动后余额(元)',
dependencies: {
triggerFields: ['changeBalance', 'changeType'],
disabled: true,
trigger(values, form) {
form.setFieldValue(
'balanceResult',
formatToFraction(
convertToInteger(values.balance) +
convertToInteger(values.changeBalance) * values.changeType,
),
);
},
},
},
];
}
/** 修改用户积分 */
export function usePointFormSchema(): VbenFormSchema[] {
return [
{
component: 'Input',
fieldName: 'id',
label: '用户编号',
componentProps: {
disabled: true,
},
},
{
component: 'Input',
fieldName: 'nickname',
label: '用户昵称',
componentProps: {
disabled: true,
},
},
{
component: 'Input',
fieldName: 'point',
label: '变动前积分',
componentProps: {
disabled: true,
},
},
{
component: 'RadioGroup',
fieldName: 'changeType',
label: '变动类型',
componentProps: {
options: [
{ label: '增加', value: 1 },
{ label: '减少', value: -1 },
],
buttonStyle: 'solid',
optionType: 'button',
},
defaultValue: 1,
},
{
component: 'InputNumber',
fieldName: 'changePoint',
label: '变动积分',
rules: 'required',
componentProps: {
min: 0,
precision: 0,
},
defaultValue: 0,
},
{
component: 'Input',
fieldName: 'pointResult',
label: '变动后积分',
dependencies: {
triggerFields: ['changePoint', 'changeType'],
disabled: true,
trigger(values, form) {
form.setFieldValue(
'pointResult',
values.point + values.changePoint * values.changeType ||
values.point,
);
},
},
rules: z.number().min(0),
},
];
}