|
@@ -18,10 +18,8 @@
|
|
|
<n-card :bordered="false" size="small">
|
|
|
<template #cover>
|
|
|
<!-- <div style="width: 100%;height: 50px;overflow: hidden;"> -->
|
|
|
- <n-image
|
|
|
- preview-disabled :src="child.cover" object-fit="scale-down"
|
|
|
- style="width: 100%;height: 50px;overflow: hidden;"
|
|
|
- />
|
|
|
+ <n-image preview-disabled :src="child.cover" object-fit="scale-down"
|
|
|
+ style="width: 100%;height: 50px;overflow: hidden;" />
|
|
|
<!-- </div> -->
|
|
|
</template>
|
|
|
<div class="text-center text-12">
|
|
@@ -38,10 +36,8 @@
|
|
|
</template>
|
|
|
</div>
|
|
|
<template #header-extra>
|
|
|
- <n-dropdown
|
|
|
- trigger="click" :options="options" :show-arrow="true"
|
|
|
- @select="(key) => handleSelect(key, item)"
|
|
|
- >
|
|
|
+ <n-dropdown class="menu_dropdown" trigger="click" :options="options" :show-arrow="true"
|
|
|
+ @select="(key) => handleSelect(key, item)">
|
|
|
<n-button text>
|
|
|
<i class="i-material-symbols:more-horiz text-24" />
|
|
|
</n-button>
|
|
@@ -53,58 +49,47 @@
|
|
|
|
|
|
<MeModal ref="modalRef" width="520px">
|
|
|
<n-form ref="modalFormRef" label-placement="left" label-align="left" :label-width="80" :model="modalForm">
|
|
|
- <n-form-item
|
|
|
- label="名称" path="title" :rule="{
|
|
|
- required: true,
|
|
|
- message: '请输入名称',
|
|
|
- trigger: ['input', 'blur'],
|
|
|
- }"
|
|
|
- >
|
|
|
+ <n-form-item label="名称" path="title" :rule="{
|
|
|
+ required: true,
|
|
|
+ message: '请输入名称',
|
|
|
+ trigger: ['input', 'blur'],
|
|
|
+ }">
|
|
|
<n-input v-model:value="modalForm.title" />
|
|
|
</n-form-item>
|
|
|
|
|
|
- <n-form-item
|
|
|
- label="描述" path="description" :rule="{
|
|
|
- required: false,
|
|
|
- message: '请输入描述',
|
|
|
- trigger: ['input', 'blur'],
|
|
|
- }"
|
|
|
- >
|
|
|
+ <n-form-item label="描述" path="description" :rule="{
|
|
|
+ required: false,
|
|
|
+ message: '请输入描述',
|
|
|
+ trigger: ['input', 'blur'],
|
|
|
+ }">
|
|
|
<n-input v-model:value="modalForm.description" type="textarea" />
|
|
|
</n-form-item>
|
|
|
- <n-form-item
|
|
|
- label="样式类型" path="styleType" :rule="{
|
|
|
- required: true,
|
|
|
- type: 'number',
|
|
|
- message: '请输入样式类型',
|
|
|
- trigger: ['input', 'blur'],
|
|
|
- }"
|
|
|
- >
|
|
|
- <n-select
|
|
|
- v-model:value="modalForm.styleType" :options="styleEnum" clearable filterable tag
|
|
|
- />
|
|
|
+ <n-form-item label="样式类型" path="styleType" :rule="{
|
|
|
+ required: true,
|
|
|
+ type: 'number',
|
|
|
+ message: '请输入样式类型',
|
|
|
+ trigger: ['input', 'blur'],
|
|
|
+ }">
|
|
|
+ <n-select v-model:value="modalForm.styleType" :options="styleEnum" clearable filterable tag />
|
|
|
</n-form-item>
|
|
|
<n-tabs v-if="modalForm.translations.length > 0" type="line" animated>
|
|
|
<template v-for="(lang, index) in langs" :key="lang">
|
|
|
<n-tab-pane :name="lang" :tab="langLabel[lang]" :index="index">
|
|
|
- <n-form-item
|
|
|
- label="名称" path="title" :rule="{
|
|
|
- required: true,
|
|
|
- message: '请输入名称',
|
|
|
- trigger: ['input', 'blur'],
|
|
|
- }"
|
|
|
- >
|
|
|
+ <n-form-item label="名称" path="title" :rule="{
|
|
|
+ required: true,
|
|
|
+ message: '请输入名称',
|
|
|
+ trigger: ['input', 'blur'],
|
|
|
+ }">
|
|
|
<n-input v-model:value="modalForm.translations.find(i => i.locale === lang).title" />
|
|
|
</n-form-item>
|
|
|
|
|
|
- <n-form-item
|
|
|
- label="描述" path="description" :rule="{
|
|
|
- required: false,
|
|
|
- message: '请输入描述',
|
|
|
- trigger: ['input', 'blur'],
|
|
|
- }"
|
|
|
- >
|
|
|
- <n-input v-model:value="modalForm.translations.find(i => i.locale === lang).description" type="textarea" />
|
|
|
+ <n-form-item label="描述" path="description" :rule="{
|
|
|
+ required: false,
|
|
|
+ message: '请输入描述',
|
|
|
+ trigger: ['input', 'blur'],
|
|
|
+ }">
|
|
|
+ <n-input v-model:value="modalForm.translations.find(i => i.locale === lang).description"
|
|
|
+ type="textarea" />
|
|
|
</n-form-item>
|
|
|
</n-tab-pane>
|
|
|
</template>
|
|
@@ -162,7 +147,8 @@ const { modalRef, modalFormRef, modalAction, modalForm, handleAdd, handleDelete,
|
|
|
doCreate: MenuApi.create,
|
|
|
doDelete: MenuApi.delete,
|
|
|
doUpdate: MenuApi.update,
|
|
|
- initForm: { enable: true, isPublish: true, translations: initTranslations({}, ['title', 'remark']).translations,
|
|
|
+ initForm: {
|
|
|
+ enable: true, isPublish: true, translations: initTranslations({}, ['title', 'remark']).translations,
|
|
|
},
|
|
|
refresh: (_, keepCurrentPage) => $table.value?.handleSearch(keepCurrentPage),
|
|
|
})
|
|
@@ -223,3 +209,10 @@ function handleAddMenu() {
|
|
|
})
|
|
|
}
|
|
|
</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+.menu_dropdown .n-dropdown-option:nth-child(2) .n-dropdown-option-body__label {
|
|
|
+ color: red;
|
|
|
+ /* display: none; */
|
|
|
+}
|
|
|
+</style>
|