fix: 将 admin 改为普通目录
This commit is contained in:
hajimi
@@ -0,0 +1,203 @@
|
||||
<template>
|
||||
<div class="vip-level">
|
||||
<el-card class="!border-none" shadow="never">
|
||||
<el-form ref="formRef" class="mb-[-16px]" :model="queryParams" :inline="true">
|
||||
<el-form-item class="w-[280px]" label="等级名称">
|
||||
<el-input v-model="queryParams.name" placeholder="输入等级名称" clearable @keyup.enter="resetPage" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="resetPage">查询</el-button>
|
||||
<el-button @click="resetParams">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-card class="!border-none mt-4" shadow="never">
|
||||
<div>
|
||||
<el-button v-perms="['vip.vipLevel/add']" type="primary" class="mb-4" @click="handleAdd">
|
||||
<template #icon>
|
||||
<icon name="el-icon-Plus" />
|
||||
</template>
|
||||
新增VIP等级
|
||||
</el-button>
|
||||
</div>
|
||||
<el-table size="large" v-loading="pager.loading" :data="pager.lists">
|
||||
<el-table-column label="ID" prop="id" min-width="60" />
|
||||
<el-table-column label="等级图标" min-width="80">
|
||||
<template #default="{ row }">
|
||||
<el-image v-if="row.image" :src="row.image" class="w-[40px] h-[40px] rounded" fit="cover" />
|
||||
<span v-else class="text-muted">无</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="等级名称" prop="name" min-width="120" />
|
||||
<el-table-column label="等级序号" prop="level" min-width="80" />
|
||||
<el-table-column label="价格(元)" prop="price" min-width="100" />
|
||||
<el-table-column label="有效天数" prop="duration" min-width="100" />
|
||||
<el-table-column label="推荐" min-width="80">
|
||||
<template #default="{ row }">
|
||||
<el-tag v-if="row.is_recommend === 1" type="warning">推荐</el-tag>
|
||||
<el-tag v-else type="info">否</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="排序" prop="sort" min-width="80" />
|
||||
<el-table-column label="状态" min-width="80">
|
||||
<template #default="{ row }">
|
||||
<el-tag v-if="row.status === 1" type="success">启用</el-tag>
|
||||
<el-tag v-else type="danger">禁用</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="150" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button v-perms="['vip.vipLevel/edit']" type="primary" link @click="handleEdit(row)">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button v-perms="['vip.vipLevel/delete']" type="danger" link @click="handleDelete(row.id)">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="flex justify-end mt-4">
|
||||
<pagination v-model="pager" @change="getLists" />
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<el-dialog v-model="showEdit" :title="editData.id ? '编辑VIP等级' : '新增VIP等级'" width="700px" destroy-on-close>
|
||||
<el-form ref="editFormRef" :model="editData" :rules="editRules" label-width="100px">
|
||||
<el-form-item label="等级名称" prop="name">
|
||||
<el-input v-model="editData.name" placeholder="请输入等级名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="等级序号" prop="level">
|
||||
<el-input-number v-model="editData.level" :min="1" :max="99" />
|
||||
</el-form-item>
|
||||
<el-form-item label="等级图标">
|
||||
<material-picker v-model="editData.image" :limit="1" />
|
||||
</el-form-item>
|
||||
<el-form-item label="价格(元)" prop="price">
|
||||
<el-input-number v-model="editData.price" :min="0.01" :precision="2" :step="1" />
|
||||
</el-form-item>
|
||||
<el-form-item label="有效天数" prop="duration">
|
||||
<el-input-number v-model="editData.duration" :min="1" :max="9999" />
|
||||
</el-form-item>
|
||||
<el-form-item label="翻译免费">
|
||||
<el-switch v-model="editData.translate_free" :active-value="1" :inactive-value="0" />
|
||||
<span style="margin-left:8px;color:#999;font-size:12px">该等级VIP翻译帖子免扣积分</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="解锁免费">
|
||||
<el-switch v-model="editData.unlock_free" :active-value="1" :inactive-value="0" />
|
||||
<span style="margin-left:8px;color:#999;font-size:12px">该等级VIP解锁付费帖子免扣积分</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否推荐">
|
||||
<el-switch v-model="editData.is_recommend" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序">
|
||||
<el-input-number v-model="editData.sort" :min="0" :max="9999" />
|
||||
</el-form-item>
|
||||
<el-form-item label="状态">
|
||||
<el-switch v-model="editData.status" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="权益描述">
|
||||
<editor v-model="editData.description" :height="300" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="showEdit = false">取消</el-button>
|
||||
<el-button type="primary" @click="handleSubmit">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup name="vipLevel">
|
||||
import { vipLevelLists, vipLevelAdd, vipLevelEdit, vipLevelDelete } from '@/api/vip'
|
||||
import { usePaging } from '@/hooks/usePaging'
|
||||
import feedback from '@/utils/feedback'
|
||||
import type { FormInstance } from 'element-plus'
|
||||
import Editor from '@/components/editor/index.vue'
|
||||
|
||||
const queryParams = reactive({
|
||||
name: ''
|
||||
})
|
||||
|
||||
const { pager, getLists, resetPage, resetParams } = usePaging({
|
||||
fetchFun: vipLevelLists,
|
||||
params: queryParams
|
||||
})
|
||||
|
||||
const showEdit = ref(false)
|
||||
const editFormRef = ref<FormInstance>()
|
||||
const editData = reactive({
|
||||
id: 0,
|
||||
name: '',
|
||||
level: 1,
|
||||
image: '',
|
||||
price: 28,
|
||||
duration: 30,
|
||||
description: '',
|
||||
translate_free: 0,
|
||||
unlock_free: 0,
|
||||
is_recommend: 0,
|
||||
sort: 0,
|
||||
status: 1
|
||||
})
|
||||
|
||||
const editRules = {
|
||||
name: [{ required: true, message: '请输入等级名称', trigger: 'blur' }],
|
||||
level: [{ required: true, message: '请输入等级序号', trigger: 'blur' }],
|
||||
price: [{ required: true, message: '请输入价格', trigger: 'blur' }],
|
||||
duration: [{ required: true, message: '请输入有效天数', trigger: 'blur' }]
|
||||
}
|
||||
|
||||
const handleAdd = () => {
|
||||
Object.assign(editData, {
|
||||
id: 0,
|
||||
name: '',
|
||||
level: 1,
|
||||
image: '',
|
||||
price: 28,
|
||||
duration: 30,
|
||||
description: '',
|
||||
translate_free: 0,
|
||||
unlock_free: 0,
|
||||
is_recommend: 0,
|
||||
sort: 0,
|
||||
status: 1
|
||||
})
|
||||
showEdit.value = true
|
||||
}
|
||||
|
||||
const handleEdit = (row: any) => {
|
||||
Object.assign(editData, {
|
||||
id: row.id,
|
||||
name: row.name,
|
||||
level: row.level,
|
||||
image: row.image,
|
||||
price: Number(row.price),
|
||||
duration: row.duration,
|
||||
description: row.description || '',
|
||||
translate_free: row.translate_free ?? 0,
|
||||
unlock_free: row.unlock_free ?? 0,
|
||||
is_recommend: row.is_recommend,
|
||||
sort: row.sort,
|
||||
status: row.status
|
||||
})
|
||||
showEdit.value = true
|
||||
}
|
||||
|
||||
const handleSubmit = async () => {
|
||||
await editFormRef.value?.validate()
|
||||
if (editData.id) {
|
||||
await vipLevelEdit(editData)
|
||||
} else {
|
||||
await vipLevelAdd(editData)
|
||||
}
|
||||
showEdit.value = false
|
||||
getLists()
|
||||
}
|
||||
|
||||
const handleDelete = async (id: number) => {
|
||||
await feedback.confirm('确定要删除该VIP等级？')
|
||||
await vipLevelDelete({ id })
|
||||
getLists()
|
||||
}
|
||||
|
||||
getLists()
|
||||
</script>
|
||||
Reference in New Issue
Block a user