153 lines
3.1 KiB
TypeScript
153 lines
3.1 KiB
TypeScript
import { h, ref } from 'vue';
|
|
import { cloneDeep } from 'lodash-es';
|
|
import { FormSchema } from '@/components/Form';
|
|
import { defRangeShortcuts } from '@/utils/dateUtil';
|
|
import { renderOptionTag } from '@/utils';
|
|
import { useDictStore } from '@/store/modules/dict';
|
|
|
|
const dict = useDictStore();
|
|
|
|
export class State {
|
|
public id = 0; // 分类ID
|
|
public name = ''; // 分类名称
|
|
public shortName = ''; // 简称
|
|
public description = ''; // 描述
|
|
public sort = 0; // 排序
|
|
public status = 1; // 状态
|
|
public remark = ''; // 备注
|
|
public createdAt = ''; // 创建时间
|
|
public updatedAt = ''; // 修改时间
|
|
public deletedAt = ''; // 删除时间
|
|
|
|
constructor(state?: Partial<State>) {
|
|
if (state) {
|
|
Object.assign(this, state);
|
|
}
|
|
}
|
|
}
|
|
|
|
export function newState(state: State | Record<string, any> | null): State {
|
|
if (state !== null) {
|
|
if (state instanceof State) {
|
|
return cloneDeep(state);
|
|
}
|
|
return new State(state);
|
|
}
|
|
return new State();
|
|
}
|
|
|
|
// 表单验证规则
|
|
export const rules = {
|
|
name: {
|
|
required: true,
|
|
trigger: ['blur', 'input'],
|
|
type: 'string',
|
|
message: '请输入分类名称',
|
|
},
|
|
sort: {
|
|
required: true,
|
|
trigger: ['blur', 'input'],
|
|
type: 'number',
|
|
message: '请输入排序',
|
|
},
|
|
};
|
|
|
|
// 表格搜索表单
|
|
export const schemas = ref<FormSchema[]>([
|
|
{
|
|
field: 'id',
|
|
component: 'NInputNumber',
|
|
label: '分类ID',
|
|
componentProps: {
|
|
placeholder: '请输入分类ID',
|
|
onUpdateValue: (e: any) => {
|
|
console.log(e);
|
|
},
|
|
},
|
|
},
|
|
{
|
|
field: 'name',
|
|
component: 'NInput',
|
|
label: '分类名称',
|
|
componentProps: {
|
|
placeholder: '请输入分类名称',
|
|
onUpdateValue: (e: any) => {
|
|
console.log(e);
|
|
},
|
|
},
|
|
},
|
|
{
|
|
field: 'status',
|
|
component: 'NSelect',
|
|
label: '状态',
|
|
defaultValue: null,
|
|
componentProps: {
|
|
placeholder: '请选择状态',
|
|
options: dict.getOption('sys_normal_disable'),
|
|
onUpdateValue: (e: any) => {
|
|
console.log(e);
|
|
},
|
|
},
|
|
},
|
|
{
|
|
field: 'createdAt',
|
|
component: 'NDatePicker',
|
|
label: '创建时间',
|
|
componentProps: {
|
|
type: 'datetimerange',
|
|
clearable: true,
|
|
shortcuts: defRangeShortcuts(),
|
|
onUpdateValue: (e: any) => {
|
|
console.log(e);
|
|
},
|
|
},
|
|
},
|
|
]);
|
|
|
|
// 表格列
|
|
export const columns = [
|
|
{
|
|
title: '分类ID',
|
|
key: 'id',
|
|
align: 'left',
|
|
width: 80,
|
|
},
|
|
{
|
|
title: '分类名称',
|
|
key: 'name',
|
|
align: 'left',
|
|
width: -1,
|
|
},
|
|
{
|
|
title: '简称',
|
|
key: 'shortName',
|
|
align: 'left',
|
|
width: 80,
|
|
},
|
|
{
|
|
title: '描述',
|
|
key: 'description',
|
|
align: 'left',
|
|
width: 300,
|
|
},
|
|
{
|
|
title: '状态',
|
|
key: 'status',
|
|
align: 'left',
|
|
width: -1,
|
|
render(row: State) {
|
|
return renderOptionTag('sys_normal_disable', row.status);
|
|
},
|
|
},
|
|
{
|
|
title: '创建时间',
|
|
key: 'createdAt',
|
|
align: 'left',
|
|
width: 180,
|
|
},
|
|
];
|
|
|
|
// 加载字典数据选项
|
|
export function loadOptions() {
|
|
dict.loadOptions(['sys_normal_disable']);
|
|
} |