feat: 更新表格组件,添加发行期管理功能;优化表单验证逻辑,调整字段名称和状态处理

This commit is contained in:
2025-12-22 20:28:20 +07:00
parent 3b8c416c05
commit 1144df10bb
11 changed files with 453 additions and 24 deletions

View File

@@ -15,6 +15,7 @@ export type TableBaseExpandColumn<T = InternalRowData> = {
operations?: (row: T) => Array<TableActionButtonProps>;
key: string;
title: string;
editComponent?: Component | VNode | string;
};
type TableBaseColumn<T = InternalRowData> = DataTableColumn<T> & TableBaseExpandColumn<T>;

View File

@@ -13,11 +13,6 @@ import {
} from '.';
import type { TableColumnCheck } from '~/packages/hooks/src';
const route = useRoute();
const { t } = useI18n();
const loading = ref(false);
const title = t(route.meta.i18nKey as string);
const props = withDefaults(
defineProps<{
fetchData: TableFetchData;
@@ -30,8 +25,10 @@ const props = withDefaults(
columns?: boolean;
};
filterColumns?: TableFilterColumns;
title?: string;
}>(),
{
title: '',
showHeaderOperation: true,
filterColumns: () => [],
headerOperations: () => ({
@@ -47,6 +44,11 @@ const emit = defineEmits<{
(e: 'delete'): void;
}>();
const route = useRoute();
const { t } = useI18n();
const loading = ref(false);
const title = ref(props.title || t(route.meta.i18nKey as string));
const tableData = ref<any[]>([]);
const dataTableColumns = ref<DataTableColumns>(transformColumns(props.columns));
const headerTableColumns = ref<NaiveUI.TableColumnCheck[]>(transformHeaderColumns(props.columns));

View File

@@ -12,9 +12,18 @@ export enum DepositTypeEnum {
}
export enum RwaStatusEnum {
pending = '待审核',
approved = '已通过',
rejected = '已拒绝'
draft = '草稿',
under_review = '待审核',
approved = '审核通过',
rejected = '审核拒绝'
}
export enum RwaEditionStatusEnum {
draft = '草稿',
scheduled = '已排期',
allocation_pending = '申购结束,待分配中签',
allocated = '已分配',
cancelled = '已取消'
}
export enum WithdrawMethodEnum {

View File

@@ -64,9 +64,7 @@ export function safeClient<T, E>(
if (res.error) {
if (res.status === 418) {
if (!options.silent) {
const msg = $t((res.error as any).value.code, {
...(res.error as any).value.context
});
const msg = (res.error as any).value.message;
window.$message?.create(msg, {
type: 'error'
});

View File

@@ -48,6 +48,7 @@ declare module 'vue' {
NCheckbox: typeof import('naive-ui')['NCheckbox']
NColorPicker: typeof import('naive-ui')['NColorPicker']
NDataTable: typeof import('naive-ui')['NDataTable']
NDatePicker: typeof import('naive-ui')['NDatePicker']
NDescriptions: typeof import('naive-ui')['NDescriptions']
NDescriptionsItem: typeof import('naive-ui')['NDescriptionsItem']
NDialogProvider: typeof import('naive-ui')['NDialogProvider']
@@ -136,6 +137,7 @@ declare global {
const NCheckbox: typeof import('naive-ui')['NCheckbox']
const NColorPicker: typeof import('naive-ui')['NColorPicker']
const NDataTable: typeof import('naive-ui')['NDataTable']
const NDatePicker: typeof import('naive-ui')['NDatePicker']
const NDescriptions: typeof import('naive-ui')['NDescriptions']
const NDescriptionsItem: typeof import('naive-ui')['NDescriptionsItem']
const NDialogProvider: typeof import('naive-ui')['NDialogProvider']

View File

@@ -0,0 +1,195 @@
<script lang="ts" setup>
import { ref, useTemplateRef } from 'vue';
import type { FormInst, FormRules } from 'naive-ui';
import dayjs from 'dayjs';
import { client, safeClient } from '@/service/api';
defineOptions({ name: 'RwaEditionAdd' });
const emit = defineEmits<{
(e: 'close'): void;
}>();
const props = defineProps<{
productId: string;
}>();
type Body = CommonType.TreatyBody<typeof client.api.admin.rwa.issuance.editions.post>;
const formInst = useTemplateRef<FormInst>('formInst');
const form = ref({
productId: props.productId,
editionName: '',
perUserLimit: '1',
totalSupply: '1',
unitPrice: '1',
dividendRate: '0.01',
launchDate: dayjs().add(1, 'day').valueOf() as number | null,
subscriptionStartDate: null as number | null,
subscriptionEndDate: null as number | null
});
const rules: FormRules = {
editionName: [{ required: true, message: '请输入发行期名称', trigger: ['blur', 'input'] }],
perUserLimit: [{ required: true, message: '请输入个人申购上限', trigger: ['blur', 'input'] }],
totalSupply: [{ required: true, message: '请输入发行总量', trigger: ['blur', 'input'] }],
unitPrice: [{ required: true, message: '请输入单价', trigger: ['blur', 'input'] }],
dividendRate: [{ required: true, message: '请输入分红率', trigger: ['blur', 'input'] }],
launchDate: [{ required: true, type: 'number', message: '请选择预热时间', trigger: ['blur', 'change'] }],
subscriptionStartDate: [
{ required: true, type: 'number', message: '请选择申购开始时间', trigger: ['blur', 'change'] }
],
subscriptionEndDate: [{ required: true, type: 'number', message: '请选择申购结束时间', trigger: ['blur', 'change'] }]
};
// 手动验证时间逻辑
function validateTimes() {
const now = dayjs();
if (form.value.launchDate && dayjs(form.value.launchDate).isBefore(now)) {
return '预热时间必须在当前时间之后';
}
if (form.value.subscriptionStartDate && form.value.launchDate) {
if (dayjs(form.value.subscriptionStartDate).isBefore(dayjs(form.value.launchDate))) {
return '申购开始时间必须在预热时间之后';
}
}
if (form.value.subscriptionEndDate && form.value.subscriptionStartDate) {
if (dayjs(form.value.subscriptionEndDate).isBefore(dayjs(form.value.subscriptionStartDate))) {
return '申购结束时间必须在开始时间之后';
}
}
return null;
}
function handleCreateDraft() {
formInst.value?.validate(async errors => {
if (!errors) {
const timeError = validateTimes();
if (timeError) {
window.$message?.error(timeError);
return;
}
await safeClient(
client.api.admin.rwa.issuance.editions.post({
...form.value,
launchDate: new Date(form.value.launchDate!),
subscriptionStartDate: new Date(form.value.subscriptionStartDate!),
subscriptionEndDate: new Date(form.value.subscriptionEndDate!)
} as Body)
);
emit('close');
}
});
}
function handleCreateDraftAndSubmit() {
formInst.value?.validate(async errors => {
if (!errors) {
const timeError = validateTimes();
if (timeError) {
window.$message?.error(timeError);
return;
}
// await safeClient(
// client.api.admin.rwa.issuance.editions.post({
// ...form.value,
// launchDate: form.value.launchDate ? new Date(form.value.launchDate) : undefined,
// subscriptionStartDate: form.value.subscriptionStartDate ? new Date(form.value.subscriptionStartDate) : undefined,
// subscriptionEndDate: form.value.subscriptionEndDate ? new Date(form.value.subscriptionEndDate) : undefined,
// submitForReview: true
// })
// );
emit('close');
}
});
}
</script>
<template>
<div class="my-10">
<NForm
ref="formInst"
:model="form"
label-width="150"
label-placement="left"
label-align="left"
:rules="rules"
require-mark-placement="left"
>
<NFormItem path="editionName" label="发行期名称">
<NInput v-model:value="form.editionName" />
</NFormItem>
<NFormItem path="perUserLimit" label="个人申购上限(份)">
<NInputNumber
:min="1"
:step="10"
:value="Number(form.perUserLimit)"
@update:value="val => (form.perUserLimit = String(val))"
/>
</NFormItem>
<NFormItem path="totalSupply" label="发行总量(份)">
<NInputNumber
:min="1"
:step="100"
:value="Number(form.totalSupply)"
@update:value="val => (form.totalSupply = String(val))"
/>
</NFormItem>
<NFormItem path="unitPrice" label="单价($)">
<NInputNumber :min="0" :value="Number(form.unitPrice)" @update:value="val => (form.unitPrice = String(val))" />
</NFormItem>
<NFormItem path="dividendRate" label="分红率(0.01 = 1%)">
<NInputNumber
:max="1"
:min="0"
:step="0.01"
:value="Number(form.dividendRate)"
@update:value="val => (form.dividendRate = String(val))"
/>
</NFormItem>
<NFormItem path="launchDate" label="预热时间">
<NDatePicker
v-model:value="form.launchDate"
type="datetime"
format="yyyy-MM-dd HH:mm"
:is-date-disabled="(ts: number) => ts < Date.now()"
value-format="x"
/>
</NFormItem>
<NFormItem>
<NSpace vertical class="w-full">
<NFormItem path="subscriptionStartDate" label="申购开始时间" label-width="150">
<NDatePicker
v-model:value="form.subscriptionStartDate"
type="datetime"
format="yyyy-MM-dd HH:mm"
:is-date-disabled="(ts: number) => (form.launchDate ? ts < Number(form.launchDate) : false)"
value-format="x"
class="w-full"
/>
</NFormItem>
<NFormItem path="subscriptionEndDate" label="申购结束时间" label-width="150">
<NDatePicker
v-model:value="form.subscriptionEndDate"
type="datetime"
format="yyyy-MM-dd HH:mm"
:is-date-disabled="
(ts: number) => (form.subscriptionStartDate ? ts < Number(form.subscriptionStartDate) : false)
"
value-format="x"
class="w-full"
/>
</NFormItem>
</NSpace>
</NFormItem>
<NSpace justify="end" class="mt-5">
<NButton type="primary" ghost @click="handleCreateDraftAndSubmit">创建草稿并发布</NButton>
<NButton type="primary" @click="handleCreateDraft">创建草稿</NButton>
</NSpace>
</NForm>
</div>
</template>
<style lang="css" scoped></style>

View File

@@ -38,7 +38,7 @@ const rules: FormRules = {
totalSupplyLimit: [{ required: true, message: '请输入总发行量', trigger: ['blur', 'input'] }]
};
function handleSubmit() {
function handleCreateDraft() {
formInst.value?.validate(async errors => {
if (!errors) {
await safeClient(
@@ -50,6 +50,19 @@ function handleSubmit() {
}
});
}
function handleCreateDraftAndSubmit() {
formInst.value?.validate(async errors => {
if (!errors) {
// await safeClient(
// client.api.admin.rwa.issuance.products.post({
// ...form.value,
// submitForReview: true
// })
// );
emit('close');
}
});
}
</script>
<template>
@@ -96,8 +109,8 @@ function handleSubmit() {
</NUpload>
</NFormItem>
<NSpace justify="end">
<NButton @click="$emit('close')"> </NButton>
<NButton type="primary" @click="handleSubmit"> </NButton>
<NButton type="primary" @click="handleCreateDraftAndSubmit">创建草稿并提交审核</NButton>
<NButton type="primary" @click="handleCreateDraft">创建草稿</NButton>
</NSpace>
</NForm>
</div>

View File

@@ -20,7 +20,7 @@ const { data: categories } = safeClient(
client.api.admin.rwa.category.categories.get({
query: {
pageIndex: 1,
pageSize: 9999
pageSize: 200
}
})
);

View File

@@ -0,0 +1,156 @@
<script lang="ts" setup>
import { h, useTemplateRef } from 'vue';
import { useDateFormat } from '@vueuse/core';
import { useDialog } from 'naive-ui';
import type { Treaty } from '@elysiajs/eden';
import { client, safeClient } from '@/service/api';
import type { TableBaseColumns, TableFetchData, TableInst } from '@/components/table';
import { RwaEditionStatusEnum } from '@/enum';
import AddEdition from './add-edition.vue';
defineOptions({ name: 'RwaProductEditions' });
const props = defineProps<{
data: Treaty.Data<typeof client.api.admin.rwa.issuance.products.get>['data'][number];
}>();
const tableInst = useTemplateRef<TableInst>('tableInst');
const dialog = useDialog();
const fetchData: TableFetchData = ({ pagination, filter }) => {
return safeClient(() =>
client.api.admin.rwa.issuance.editions.get({
query: {
productId: props.data.id,
...pagination,
...filter
}
})
);
};
const columns: TableBaseColumns = [
{
title: '发行期名称',
key: 'editionName',
editComponent: 'NInput'
},
{
title: '个人申购上限',
key: 'perUserLimit',
render: (row: any) => {
return Number(row.perUserLimit).toFixed(2);
}
},
{
title: '发行总量',
key: 'totalSupply',
render: (row: any) => {
return Number(row.totalSupply).toFixed(2);
}
},
{
title: '单价',
key: 'unitPrice',
render: (row: any) => {
return Number(row.unitPrice).toFixed(2);
}
},
{
title: '分红率',
key: 'editionName'
},
{
title: '预热时间',
key: 'launchDate',
render: (row: any) => {
return useDateFormat(row.launchDate, 'YYYY-MM-DD HH:mm').value;
}
},
{
title: '订阅开始时间',
key: 'subscriptionStartDate',
render: (row: any) => {
return useDateFormat(row.subscriptionStartDate, 'YYYY-MM-DD HH:mm').value;
}
},
{
title: '认购截止时间',
key: 'subscriptionEndDate',
render: (row: any) => {
return useDateFormat(row.subscriptionEndDate, 'YYYY-MM-DD HH:mm').value;
}
},
{
title: '状态',
key: 'status',
render: row => {
return RwaEditionStatusEnum[row.status as keyof typeof RwaEditionStatusEnum];
}
},
{
title: '操作',
fixed: 'right',
key: 'operation',
width: 'auto',
operations: (row: any) => [
{
contentText: '发布',
type: 'primary',
ghost: true,
size: 'small',
visible: row.status === 'draft',
onClick: () => {
console.log(row);
}
},
{
contentText: '取消',
type: 'primary',
ghost: true,
size: 'small',
visible: row.status === 'draft',
onClick: () => {
console.log(row);
}
},
{
contentText: '编辑',
type: 'primary',
ghost: true,
size: 'small',
visible: row.status === 'draft',
onClick: () => {
console.log(row);
}
},
{
contentText: '删除',
type: 'error',
ghost: true,
size: 'small',
onClick: () => {
tableInst.value?.reload();
}
}
]
}
];
function handleAdd() {
const dialogInstance = dialog.create({
title: '发行期列表',
content: () => h(AddEdition, { productId: props.data.id }),
style: { width: '600px' },
showIcon: false,
onPositiveClick: () => {
tableInst.value?.reload();
}
});
}
</script>
<template>
<TableBase ref="tableInst" title="RWA发行期" :columns="columns" :fetch-data="fetchData" @add="handleAdd" />
</template>
<style lang="css" scoped></style>

View File

@@ -7,6 +7,7 @@ import type { TableBaseColumns, TableFetchData, TableFilterColumns, TableInst }
import { RwaStatusEnum } from '@/enum';
import Add from './components/add.vue';
import Edit from './components/edit.vue';
import Editions from './components/editions.vue';
const dialog = useDialog();
const message = useMessage();
@@ -40,7 +41,10 @@ const columns: TableBaseColumns = [
},
{
title: '产品估值',
key: 'estimatedValue'
key: 'estimatedValue',
render: (row: any) => {
return Number(row.estimatedValue).toFixed(2);
}
},
{
title: '产品分类',
@@ -72,12 +76,28 @@ const columns: TableBaseColumns = [
title: '操作',
fixed: 'right',
key: 'operation',
width: 140,
width: 300,
operations: (row: any) => [
{
contentText: '批准',
contentText: '提交到流程',
ghost: true,
visible: row.status === 'draft',
size: 'small',
onClick: async () => {
// await safeClient(() =>
// client.api.admin.rwa.issuance.approve.post({
// productId: row.id as string,
// publishFirstEdition: true
// })
// );
tableInst.value?.reload();
}
},
{
contentText: '批准',
ghost: true,
visible: row.status === 'under_review',
size: 'small',
onClick: async () => {
await safeClient(() =>
client.api.admin.rwa.issuance.approve.post({
@@ -90,8 +110,9 @@ const columns: TableBaseColumns = [
},
{
contentText: '拒绝',
size: 'small',
ghost: true,
visible: row.status === 'under_review',
size: 'small',
onClick: async () => {
await safeClient(() =>
client.api.admin.rwa.issuance.reject.post({
@@ -104,10 +125,22 @@ const columns: TableBaseColumns = [
},
{
contentText: '编辑',
type: 'tertiary',
ghost: true,
size: 'small',
visible: row.status === 'draft' || row.status === 'rejected',
onClick: () => {
handleEdit(row);
}
},
{
contentText: '发行期',
type: 'tertiary',
ghost: true,
size: 'small',
onClick: () => {
handleViewEditions(row);
}
}
]
}
@@ -115,12 +148,12 @@ const columns: TableBaseColumns = [
const filterColumns: TableFilterColumns = [
{
title: '产品名称',
key: 'name'
title: '产品代码',
key: 'Code'
},
{
title: '产品Code',
key: 'Code'
title: '产品名称',
key: 'name'
},
{
title: '创建时间',
@@ -167,6 +200,25 @@ function handleEdit(row: any) {
}
});
}
function handleViewEditions(row: any) {
const dialogInstance = dialog.create({
title: '发行期列表',
content: () =>
h(Editions, {
data: row,
onClose: () => {
dialogInstance.destroy();
tableInst.value?.reload();
}
}),
style: { width: '1200px' },
showIcon: false,
onPositiveClick: () => {
message.success('添加成功');
tableInst.value?.reload();
}
});
}
</script>
<template>