🎨 优化用户列表页,优化vip管理页

This commit is contained in:
2025-09-03 22:32:56 +08:00
parent 96ca2facc3
commit c03ce23371
3 changed files with 34 additions and 8 deletions

View File

@@ -326,11 +326,11 @@ export const USER_TABLE_CONFIG = {
slot: 'status' slot: 'status'
},{ },{
attrs: { attrs: {
label: '创建时间', label: 'VIP到期时间',
prop: 'CreatedAt', prop: 'vip_expire_time',
align: 'center' align: 'center'
}, },
slot: 'CreatedAt' slot: 'vip_expire_time'
},{ },{
attrs: { attrs: {
label: '用户类别', label: '用户类别',

View File

@@ -102,8 +102,15 @@
<el-select v-model="formData.level" placeholder="请选择等级"> <el-select v-model="formData.level" placeholder="请选择等级">
<el-option :value="1" label="Vip" /> <el-option :value="1" label="Vip" />
<el-option :value="2" label="Svip" /> <el-option :value="2" label="Svip" />
<el-option :value="3" label="讲师会员" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-if="formData.level === 3" label="讲师" prop="teacher_name">
<div style="display:flex;gap:8px;align-items:center;width:100%">
<el-input v-model="formData.teacher_name" placeholder="请选择讲师" readonly />
<el-button type="primary" @click="openTeacherDialog">选择讲师</el-button>
</div>
</el-form-item>
<el-form-item label="价格(元)" prop="price"> <el-form-item label="价格(元)" prop="price">
<el-input v-model.number="formData.price" placeholder="请输入价格(数字)" /> <el-input v-model.number="formData.price" placeholder="请输入价格(数字)" />
</el-form-item> </el-form-item>
@@ -115,6 +122,7 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
</el-drawer> </el-drawer>
<user-choose ref="userChooseRef" title="讲师" @getRecipientInfo="onChooseTeacher" />
</div> </div>
</template> </template>
@@ -124,10 +132,14 @@ import { ElMessage, ElMessageBox } from 'element-plus'
import { ref, reactive } from 'vue' import { ref, reactive } from 'vue'
import { useAppStore } from '@/pinia' import { useAppStore } from '@/pinia'
import { formatDate } from '@/utils/format' import { formatDate } from '@/utils/format'
import UserChoose from '@/components/userChoose/index.vue'
defineOptions({ defineOptions({
name: 'VipList' name: 'VipList'
}) })
// 讲师选择组件注册
const userChooseRef = ref()
const appStore = useAppStore() const appStore = useAppStore()
const btnLoading = ref(false) const btnLoading = ref(false)
@@ -143,7 +155,9 @@ const formData = ref({
level: undefined, level: undefined,
price: undefined, price: undefined,
expiration: undefined, expiration: undefined,
des: '' des: '',
teacher_id: undefined,
teacher_name: ''
}) })
const rule = reactive({ const rule = reactive({
@@ -151,9 +165,10 @@ const rule = reactive({
{ required: true, message: '请输入名称', trigger: ['blur','input'] }, { required: true, message: '请输入名称', trigger: ['blur','input'] },
{ whitespace: true, message: '不能只输入空格', trigger: ['blur','input'] } { whitespace: true, message: '不能只输入空格', trigger: ['blur','input'] }
], ],
level: [ { required: true, message: '请输入等级', trigger: ['blur','input'] } ], level: [ { required: true, message: '请输入等级', trigger: ['blur','input','change'] } ],
price: [ { required: true, message: '请输入价格', trigger: ['blur','input'] } ], price: [ { required: true, message: '请输入价格', trigger: ['blur','input'] } ],
expiration: [ { required: true, message: '请输入有效期', trigger: ['blur','input'] } ] expiration: [ { required: true, message: '请输入有效期', trigger: ['blur','input'] } ],
teacher_name: [ { validator: (r,v,cb)=>{ if(formData.value.level===3 && !v){ cb(new Error('请选择讲师')); } else { cb(); } }, trigger:['change','blur'] } ]
}) })
const searchRule = reactive({ const searchRule = reactive({
@@ -236,6 +251,7 @@ const type = ref('')
const formatLevel = (level) => { const formatLevel = (level) => {
if (level === 1) return 'Vip' if (level === 1) return 'Vip'
if (level === 2) return 'Svip' if (level === 2) return 'Svip'
if (level === 3) return '讲师会员'
return level return level
} }
@@ -322,6 +338,16 @@ const enterDialog = async () => {
} }
}) })
} }
// 选择讲师
const openTeacherDialog = () => {
userChooseRef.value?.open()
}
const onChooseTeacher = (teacher) => {
if (!teacher) return
formData.value.teacher_id = teacher.ID
formData.value.teacher_name = teacher.nick_name
}
</script> </script>
<style> <style>

View File

@@ -42,8 +42,8 @@
:before-change="() => statusChangeBefore(row)" /> :before-change="() => statusChangeBefore(row)" />
</template> </template>
<template #CreatedAt="{ row }"> <template #vip_expire_time="{ row }">
{{ formatDate(row.CreatedAt) }} {{ row.vip_expire_time }}
</template> </template>
<!--user_type 1: 普通用户 2: 讲师--> <!--user_type 1: 普通用户 2: 讲师-->