feat: 更新新闻管理功能,新增摘要和排序顺序字段,优化上传组件逻辑

This commit is contained in:
2026-01-09 00:26:46 +07:00
parent 28d93217a3
commit 5308020003
7 changed files with 144 additions and 50 deletions

View File

@@ -96,6 +96,19 @@ const rules: FormRules = {
trigger: ['blur', 'input']
}
],
summary: [
{
required: true,
message: '请输入新闻摘要',
trigger: ['blur', 'input']
},
{
min: 10,
max: 200,
message: '摘要长度应在10-200个字符之间',
trigger: ['blur', 'input']
}
],
content: [
{
required: true,
@@ -144,24 +157,42 @@ async function handleSubmit() {
require-mark-placement="left"
>
<NFormItem label="新闻标题" path="title">
<NInput v-model:value="form.title" placeholder="请输入新闻标题" maxlength="200" show-count />
<NInput v-model:value="form.title" placeholder="请输入新闻标题" maxlength="50" show-count />
</NFormItem>
<NFormItem label="新闻分类" path="categoryId">
<NSelect v-model:value="form.categoryId" :options="categoryOptions" placeholder="请选择新闻分类" class="flex-1">
<template #action>
<div class="px-3 py-2">
<NButton size="small" type="primary" block @click.stop="handleAddCategory">
<template #icon>
<icon-ic-round-plus class="text-icon" />
</template>
新增分类
</NButton>
</div>
</template>
</NSelect>
<NFormItem label="缩略图" path="thumbnailId">
<UploadS3
:model-value="form.thumbnailId ? [form.thumbnailId] : undefined"
:max-size="20"
:max-files="1"
accept="image/*"
placeholder="上传图片"
:fetch-options="{ businessType: 'news_attachment' }"
@update:model-value="evt => (form.thumbnailId = evt.length > 0 ? evt[0] : undefined)"
/>
</NFormItem>
<NGrid :cols="2">
<NFormItemGi label="新闻分类" path="categoryId">
<NSelect v-model:value="form.categoryId" :options="categoryOptions" placeholder="请选择新闻分类" class="flex-1">
<template #action>
<div class="px-3 py-2">
<NButton size="small" type="primary" block @click.stop="handleAddCategory">
<template #icon>
<icon-ic-round-plus class="text-icon" />
</template>
新增分类
</NButton>
</div>
</template>
</NSelect>
</NFormItemGi>
<NFormItemGi label="新闻摘要" path="summary">
<NInput v-model:value="form.summary" placeholder="请输入新闻摘要" maxlength="100" show-count />
</NFormItemGi>
</NGrid>
<NFormItem label="新闻内容" path="content">
<MarkdownEditor v-model:value="form.content" placeholder="请输入新闻内容" :preview="false" />
</NFormItem>
@@ -178,12 +209,22 @@ async function handleSubmit() {
/>
</NFormItem>
<NFormItem label="置顶显示" path="isPinned">
<NSwitch v-model:value="form.isPinned">
<template #checked>是</template>
<template #unchecked>否</template>
</NSwitch>
</NFormItem>
<NGrid :cols="2">
<NFormItemGi label="置顶显示" path="isPinned">
<NSwitch v-model:value="form.isPinned">
<template #checked></template>
<template #unchecked></template>
</NSwitch>
</NFormItemGi>
<NFormItemGi label="排序顺序" path="sortOrder">
<NInputNumber v-model:value="form.sortOrder" :min="0" :step="1" placeholder="请输入排序顺序" class="w-full">
<template #suffix>
<span class="text-12px text-gray-400">数字越小越靠前</span>
</template>
</NInputNumber>
</NFormItemGi>
</NGrid>
<NSpace justify="end" class="mt-4">
<NButton @click="$emit('close')">取消</NButton>