refactor(admin): Rework content governance and video review workspace
This commit is contained in:
@@ -4,29 +4,78 @@
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span>分类管理</span>
|
||||
<el-button type="primary" @click="handleAdd">
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="handleAdd"
|
||||
>
|
||||
<el-icon><Plus /></el-icon>添加分类
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" :data="categories" row-key="id" default-expand-all>
|
||||
<el-table-column prop="name" label="分类名称" />
|
||||
<el-table-column prop="sort" label="排序" width="100" />
|
||||
<el-table-column label="操作" width="200">
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="categories"
|
||||
row-key="id"
|
||||
default-expand-all
|
||||
>
|
||||
<el-table-column
|
||||
prop="name"
|
||||
label="分类名称"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="sort"
|
||||
label="排序"
|
||||
width="100"
|
||||
/>
|
||||
<el-table-column
|
||||
label="操作"
|
||||
width="200"
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<el-button type="primary" text @click="handleEdit(row)">编辑</el-button>
|
||||
<el-button type="primary" text @click="handleAddChild(row)">添加子分类</el-button>
|
||||
<el-button type="danger" text @click="handleDelete(row)">删除</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
text
|
||||
@click="handleEdit(row)"
|
||||
>
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
text
|
||||
@click="handleAddChild(row)"
|
||||
>
|
||||
添加子分类
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
text
|
||||
@click="handleDelete(row)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
|
||||
<el-dialog v-model="dialogVisible" :title="dialogTitle" width="400px">
|
||||
<el-form :model="form" label-width="80px">
|
||||
<el-form-item label="分类名称" required>
|
||||
<el-input v-model="form.name" placeholder="请输入分类名称" />
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
:title="dialogTitle"
|
||||
width="400px"
|
||||
>
|
||||
<el-form
|
||||
:model="form"
|
||||
label-width="80px"
|
||||
>
|
||||
<el-form-item
|
||||
label="分类名称"
|
||||
required
|
||||
>
|
||||
<el-input
|
||||
v-model="form.name"
|
||||
placeholder="请输入分类名称"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="父级分类">
|
||||
<el-tree-select
|
||||
@@ -40,15 +89,29 @@
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序">
|
||||
<el-input-number v-model="form.sort" :min="0" />
|
||||
<el-input-number
|
||||
v-model="form.sort"
|
||||
:min="0"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="图标">
|
||||
<el-input v-model="form.icon" placeholder="图标URL" />
|
||||
<el-input
|
||||
v-model="form.icon"
|
||||
placeholder="图标URL"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" :loading="submitting" @click="handleSubmit">确定</el-button>
|
||||
<el-button @click="dialogVisible = false">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
:loading="submitting"
|
||||
@click="handleSubmit"
|
||||
>
|
||||
确定
|
||||
</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
@@ -68,11 +131,25 @@ const submitting = ref(false)
|
||||
const form = reactive({
|
||||
id: undefined as number | undefined,
|
||||
name: '',
|
||||
code: '',
|
||||
parentId: 0,
|
||||
level: 1,
|
||||
sort: 0,
|
||||
icon: ''
|
||||
icon: '',
|
||||
status: 1
|
||||
})
|
||||
|
||||
const createCategoryCode = (name: string) => {
|
||||
const slug = name
|
||||
.trim()
|
||||
.toLowerCase()
|
||||
.replace(/[^a-z0-9\u4e00-\u9fa5]+/g, '-')
|
||||
.replace(/^-+|-+$/g, '')
|
||||
.slice(0, 20)
|
||||
|
||||
return `cat-${slug || 'item'}-${Date.now().toString().slice(-6)}`
|
||||
}
|
||||
|
||||
const categoryTree = computed(() => {
|
||||
const buildTree = (list: Category[], parentId: number = 0): Category[] => {
|
||||
return list.filter(item => item.parentId === parentId).map(item => ({
|
||||
@@ -97,9 +174,12 @@ const loadCategories = async () => {
|
||||
const resetForm = () => {
|
||||
form.id = undefined
|
||||
form.name = ''
|
||||
form.code = ''
|
||||
form.parentId = 0
|
||||
form.level = 1
|
||||
form.sort = 0
|
||||
form.icon = ''
|
||||
form.status = 1
|
||||
}
|
||||
|
||||
const handleAdd = () => {
|
||||
@@ -118,9 +198,12 @@ const handleAddChild = (row: Category) => {
|
||||
const handleEdit = (row: Category) => {
|
||||
form.id = row.id
|
||||
form.name = row.name
|
||||
form.code = row.code || ''
|
||||
form.parentId = row.parentId
|
||||
form.level = row.level || 1
|
||||
form.sort = row.sort
|
||||
form.icon = row.icon || ''
|
||||
form.status = row.status ?? 1
|
||||
dialogTitle.value = '编辑分类'
|
||||
dialogVisible.value = true
|
||||
}
|
||||
@@ -142,10 +225,27 @@ const handleSubmit = async () => {
|
||||
submitting.value = true
|
||||
try {
|
||||
if (form.id) {
|
||||
await categoryApi.update({ id: form.id, name: form.name, parentId: form.parentId, sort: form.sort, icon: form.icon })
|
||||
await categoryApi.update({
|
||||
id: form.id,
|
||||
name: form.name,
|
||||
code: form.code || createCategoryCode(form.name),
|
||||
parentId: form.parentId,
|
||||
level: form.level,
|
||||
sort: form.sort,
|
||||
icon: form.icon,
|
||||
status: form.status
|
||||
})
|
||||
ElMessage.success('更新成功')
|
||||
} else {
|
||||
await categoryApi.create({ name: form.name, parentId: form.parentId, sort: form.sort, icon: form.icon })
|
||||
await categoryApi.create({
|
||||
name: form.name,
|
||||
code: createCategoryCode(form.name),
|
||||
parentId: form.parentId,
|
||||
level: form.parentId === 0 ? 1 : undefined,
|
||||
sort: form.sort,
|
||||
icon: form.icon,
|
||||
status: 1
|
||||
})
|
||||
ElMessage.success('添加成功')
|
||||
}
|
||||
dialogVisible.value = false
|
||||
|
||||
Reference in New Issue
Block a user