71 lines
2.1 KiB
TypeScript
71 lines
2.1 KiB
TypeScript
import { reactive } from 'vue';
|
|
import { $t } from '@/plugins/i18n';
|
|
import type { FormRules } from 'element-plus';
|
|
import { ElText } from 'element-plus';
|
|
|
|
// 表格列
|
|
export const columns: TableColumnList = [
|
|
{ type: 'selection', align: 'left' },
|
|
{ type: 'index', index: (index: number) => index + 1, label: '序号', width: 60 },
|
|
// 完成状态
|
|
{ label: $t('statusType'), prop: 'statusType', slot: 'statusType' },
|
|
// 储值目标名称
|
|
{ label: $t('savingGoalName'), prop: 'savingGoalName' },
|
|
// 预算金额
|
|
{
|
|
label: $t('amount'),
|
|
prop: 'amount',
|
|
width: 150,
|
|
formatter({ amount }) {
|
|
return (
|
|
<ElText style={{ fontWeight: 800 }} type={'info'} size={'large'}>
|
|
{amount}￥
|
|
</ElText>
|
|
);
|
|
},
|
|
},
|
|
// 已存入金额
|
|
{
|
|
label: $t('amountDeposited'),
|
|
prop: 'amountDeposited',
|
|
width: 150,
|
|
formatter({ amountDeposited }) {
|
|
return (
|
|
<ElText style={{ fontWeight: 800 }} type={'info'} size={'large'}>
|
|
{amountDeposited}￥
|
|
</ElText>
|
|
);
|
|
},
|
|
},
|
|
// 目标时长
|
|
{
|
|
label: $t('duration'),
|
|
prop: 'duration',
|
|
formatter({ startDuration, endDuration }) {
|
|
return (
|
|
<ElText type={'success'} style={{ fontWeight: 800 }}>
|
|
{startDuration} ~ {endDuration}
|
|
</ElText>
|
|
);
|
|
},
|
|
width: 360,
|
|
},
|
|
{ label: $t('table.updateTime'), prop: 'updateTime', sortable: true, width: 160 },
|
|
{ label: $t('table.createTime'), prop: 'createTime', sortable: true, width: 160 },
|
|
{ label: $t('table.operation'), fixed: 'right', width: 160, slot: 'operation' },
|
|
];
|
|
|
|
// 添加规则
|
|
export const rules = reactive<FormRules>({
|
|
// 完成状态
|
|
statusType: [{ required: true, message: `${$t('input')}${$t('statusType')}`, trigger: 'blur' }],
|
|
// 储值目标名称
|
|
savingGoalName: [{ required: true, message: `${$t('input')}${$t('savingGoalName')}`, trigger: 'blur' }],
|
|
// 目标金额
|
|
amount: [{ required: true, message: `${$t('input')}${$t('amount')}`, trigger: 'blur' }],
|
|
// 已存入金额
|
|
amountDeposited: [{ required: true, message: `${$t('input')}${$t('amountDeposited')}`, trigger: 'blur' }],
|
|
// 目标时长
|
|
duration: [{ required: true, message: `${$t('input')}${$t('duration')}`, trigger: 'blur' }],
|
|
});
|