|
@@ -14,30 +14,30 @@
|
|
|
|
|
|
<MeCrud ref="$table" v-model:query-items="queryItems" :scroll-x="1200" :columns="columns" :get-data="api.read">
|
|
<MeCrud ref="$table" v-model:query-items="queryItems" :scroll-x="1200" :columns="columns" :get-data="api.read">
|
|
<MeQueryItem label="标题" :label-width="50">
|
|
<MeQueryItem label="标题" :label-width="50">
|
|
- <n-input v-model:value="queryItems.title" type="text" placeholder="请输入标题名" clearable>
|
|
|
|
|
|
+ <n-input v-model:value="queryItems.title" type="text" placeholder="请输入标题" clearable>
|
|
<template #password-visible-icon />
|
|
<template #password-visible-icon />
|
|
</n-input>
|
|
</n-input>
|
|
</MeQueryItem>
|
|
</MeQueryItem>
|
|
<MeQueryItem label="状态" :label-width="50">
|
|
<MeQueryItem label="状态" :label-width="50">
|
|
- <n-select
|
|
|
|
|
|
+ <n-select
|
|
v-model:value="queryItems.enable" clearable :options="[
|
|
v-model:value="queryItems.enable" clearable :options="[
|
|
{ label: '启用', value: 1 },
|
|
{ label: '启用', value: 1 },
|
|
{ label: '停用', value: 0 },
|
|
{ label: '停用', value: 0 },
|
|
- ]"
|
|
|
|
|
|
+ ]"
|
|
/>
|
|
/>
|
|
</MeQueryItem>
|
|
</MeQueryItem>
|
|
</MeCrud>
|
|
</MeCrud>
|
|
|
|
|
|
<MeModal ref="modalRef" width="520px">
|
|
<MeModal ref="modalRef" width="520px">
|
|
<n-form ref="modalFormRef" label-placement="left" label-align="left" :label-width="95" :model="modalForm">
|
|
<n-form ref="modalFormRef" label-placement="left" label-align="left" :label-width="95" :model="modalForm">
|
|
- <n-form-item
|
|
|
|
|
|
+ <n-form-item
|
|
label="名称" path="title" :rule="{
|
|
label="名称" path="title" :rule="{
|
|
required: true,
|
|
required: true,
|
|
message: '请输入名称',
|
|
message: '请输入名称',
|
|
trigger: ['input', 'blur'],
|
|
trigger: ['input', 'blur'],
|
|
- }"
|
|
|
|
|
|
+ }"
|
|
>
|
|
>
|
|
- <n-input v-model:value="modalForm.title" />
|
|
|
|
|
|
+ <n-input :maxlength="200" show-count v-model:value="modalForm.title" />
|
|
</n-form-item>
|
|
</n-form-item>
|
|
|
|
|
|
<!-- <n-form-item label="描述" path="description" :rule="{
|
|
<!-- <n-form-item label="描述" path="description" :rule="{
|
|
@@ -48,56 +48,56 @@
|
|
<n-input v-model:value="modalForm.description" type="textarea" />
|
|
<n-input v-model:value="modalForm.description" type="textarea" />
|
|
</n-form-item> -->
|
|
</n-form-item> -->
|
|
<n-form-item v-if="modalForm.level !== 0" label="封面" path="cover">
|
|
<n-form-item v-if="modalForm.level !== 0" label="封面" path="cover">
|
|
- <n-upload
|
|
|
|
|
|
+ <n-upload
|
|
:multiple="false" :default-upload="true" list-type="image-card" :custom-request="uploadCover"
|
|
:multiple="false" :default-upload="true" list-type="image-card" :custom-request="uploadCover"
|
|
- :max="1" :default-file-list="previewFileList" @preview="handlePreview" @remove="handleCoverRemove"
|
|
|
|
|
|
+ :max="1" :default-file-list="previewFileList" @preview="handlePreview" @remove="handleCoverRemove"
|
|
/>
|
|
/>
|
|
<n-modal v-model:show="showModal" preset="card" style="width: 600px" title="">
|
|
<n-modal v-model:show="showModal" preset="card" style="width: 600px" title="">
|
|
<img :src="previewImageUrl" style="width: 100%">
|
|
<img :src="previewImageUrl" style="width: 100%">
|
|
</n-modal>
|
|
</n-modal>
|
|
</n-form-item>
|
|
</n-form-item>
|
|
- <n-form-item
|
|
|
|
|
|
+ <n-form-item
|
|
label="分类" path="categoryId" :rule="{
|
|
label="分类" path="categoryId" :rule="{
|
|
required: modalForm.level === 0 ? false : true,
|
|
required: modalForm.level === 0 ? false : true,
|
|
type: 'number',
|
|
type: 'number',
|
|
trigger: ['change', 'blur'],
|
|
trigger: ['change', 'blur'],
|
|
message: '请输入分类',
|
|
message: '请输入分类',
|
|
- }"
|
|
|
|
|
|
+ }"
|
|
>
|
|
>
|
|
- <n-tree-select
|
|
|
|
|
|
+ <n-tree-select
|
|
v-model:value="modalForm.categoryId" :options="allCategory" label-field="title" key-field="id"
|
|
v-model:value="modalForm.categoryId" :options="allCategory" label-field="title" key-field="id"
|
|
- placeholder="根分类" clearable
|
|
|
|
|
|
+ placeholder="根分类" clearable
|
|
/>
|
|
/>
|
|
</n-form-item>
|
|
</n-form-item>
|
|
|
|
|
|
- <n-form-item
|
|
|
|
|
|
+ <n-form-item
|
|
v-if="modalForm.level === 0" label="样式类型" path="styleType" :rule="{
|
|
v-if="modalForm.level === 0" label="样式类型" path="styleType" :rule="{
|
|
required: true,
|
|
required: true,
|
|
type: 'number',
|
|
type: 'number',
|
|
message: '请输入样式类型',
|
|
message: '请输入样式类型',
|
|
trigger: ['input', 'blur'],
|
|
trigger: ['input', 'blur'],
|
|
- }"
|
|
|
|
|
|
+ }"
|
|
>
|
|
>
|
|
<n-select v-model:value="modalForm.styleType" :options="styleEnum" clearable filterable tag />
|
|
<n-select v-model:value="modalForm.styleType" :options="styleEnum" clearable filterable tag />
|
|
</n-form-item>
|
|
</n-form-item>
|
|
|
|
|
|
- <n-form-item
|
|
|
|
|
|
+ <n-form-item
|
|
v-if="isShowOtherCol" label="其他类别" path="otherType" :rule="{
|
|
v-if="isShowOtherCol" label="其他类别" path="otherType" :rule="{
|
|
required: true,
|
|
required: true,
|
|
type: 'number',
|
|
type: 'number',
|
|
message: '请输入其他类别',
|
|
message: '请输入其他类别',
|
|
trigger: ['input', 'blur'],
|
|
trigger: ['input', 'blur'],
|
|
- }"
|
|
|
|
|
|
+ }"
|
|
>
|
|
>
|
|
<n-select v-model:value="modalForm.otherType" :options="otherstyleEnum" clearable />
|
|
<n-select v-model:value="modalForm.otherType" :options="otherstyleEnum" clearable />
|
|
</n-form-item>
|
|
</n-form-item>
|
|
- <n-form-item
|
|
|
|
|
|
+ <n-form-item
|
|
label="文章链接" path="articleId" :rule="{
|
|
label="文章链接" path="articleId" :rule="{
|
|
required: false,
|
|
required: false,
|
|
type: 'number',
|
|
type: 'number',
|
|
trigger: ['change', 'blur'],
|
|
trigger: ['change', 'blur'],
|
|
message: '请输入文章链接',
|
|
message: '请输入文章链接',
|
|
- }"
|
|
|
|
|
|
+ }"
|
|
>
|
|
>
|
|
<n-select v-model:value="modalForm.articleId" :options="allArticle" clearable filterable tag />
|
|
<n-select v-model:value="modalForm.articleId" :options="allArticle" clearable filterable tag />
|
|
</n-form-item>
|
|
</n-form-item>
|
|
@@ -106,13 +106,13 @@
|
|
<n-input-number v-model:value="modalForm.grid" style="width:100%" />
|
|
<n-input-number v-model:value="modalForm.grid" style="width:100%" />
|
|
</n-form-item>
|
|
</n-form-item>
|
|
|
|
|
|
- <n-form-item
|
|
|
|
|
|
+ <n-form-item
|
|
label="排序" path="order" :rule="{
|
|
label="排序" path="order" :rule="{
|
|
type: 'number',
|
|
type: 'number',
|
|
required: true,
|
|
required: true,
|
|
message: '此为必填项',
|
|
message: '此为必填项',
|
|
trigger: ['blur', 'change'],
|
|
trigger: ['blur', 'change'],
|
|
- }"
|
|
|
|
|
|
+ }"
|
|
>
|
|
>
|
|
<n-input-number v-model:value="modalForm.order" />
|
|
<n-input-number v-model:value="modalForm.order" />
|
|
</n-form-item>
|
|
</n-form-item>
|
|
@@ -120,28 +120,29 @@
|
|
<n-tabs v-if="modalForm.translations.length > 0" type="line" animated>
|
|
<n-tabs v-if="modalForm.translations.length > 0" type="line" animated>
|
|
<template v-for="(lang, index) in langs" :key="lang">
|
|
<template v-for="(lang, index) in langs" :key="lang">
|
|
<n-tab-pane :name="lang" :tab="langLabel[lang]" :index="index">
|
|
<n-tab-pane :name="lang" :tab="langLabel[lang]" :index="index">
|
|
- <n-form-item
|
|
|
|
|
|
+ <n-form-item
|
|
label="名称" path="title" :rule="{
|
|
label="名称" path="title" :rule="{
|
|
required: true,
|
|
required: true,
|
|
message: '请输入名称',
|
|
message: '请输入名称',
|
|
trigger: ['input', 'blur'],
|
|
trigger: ['input', 'blur'],
|
|
- }"
|
|
|
|
|
|
+ }"
|
|
>
|
|
>
|
|
- <n-input v-model:value="modalForm.translations.find(i => i.locale === lang).title">
|
|
|
|
|
|
+ <n-input :maxlength="200" show-count v-model:value="modalForm.translations.find(i => i.locale === lang).title">
|
|
<template #password-invisible-icon />
|
|
<template #password-invisible-icon />
|
|
</n-input>
|
|
</n-input>
|
|
</n-form-item>
|
|
</n-form-item>
|
|
|
|
|
|
- <n-form-item
|
|
|
|
|
|
+ <n-form-item
|
|
label="描述" path="description" :rule="{
|
|
label="描述" path="description" :rule="{
|
|
required: false,
|
|
required: false,
|
|
message: '请输入描述',
|
|
message: '请输入描述',
|
|
trigger: ['input', 'blur'],
|
|
trigger: ['input', 'blur'],
|
|
- }"
|
|
|
|
|
|
+ }"
|
|
>
|
|
>
|
|
- <n-input
|
|
|
|
|
|
+ <n-input
|
|
|
|
+ :maxlength="200" show-count
|
|
v-model:value="modalForm.translations.find(i => i.locale === lang).description"
|
|
v-model:value="modalForm.translations.find(i => i.locale === lang).description"
|
|
- type="textarea"
|
|
|
|
|
|
+ type="textarea"
|
|
/>
|
|
/>
|
|
</n-form-item>
|
|
</n-form-item>
|
|
</n-tab-pane>
|
|
</n-tab-pane>
|
|
@@ -248,7 +249,7 @@ async function getMenuDetail() {
|
|
}
|
|
}
|
|
|
|
|
|
const columns = [
|
|
const columns = [
|
|
- { title: '标题名', key: 'title', width: '200' },
|
|
|
|
|
|
+ { title: '标题', key: 'title', width: '200' },
|
|
{ title: '分类', key: 'category.title' },
|
|
{ title: '分类', key: 'category.title' },
|
|
{
|
|
{
|
|
title: '封面图',
|
|
title: '封面图',
|
|
@@ -261,6 +262,7 @@ const columns = [
|
|
})
|
|
})
|
|
: null,
|
|
: null,
|
|
},
|
|
},
|
|
|
|
+ { title: '创建人', key: 'user.username' },
|
|
{
|
|
{
|
|
title: '创建时间',
|
|
title: '创建时间',
|
|
key: 'createTime',
|
|
key: 'createTime',
|