feat: 课程状态切换按钮及报名满自动结束
This commit is contained in:
hyql
parent
7c1b021178
commit
6e96e1828a
6 changed files with 159 additions and 60 deletions
|
|
@ -1,24 +1,28 @@
|
|||
const list = [
|
||||
{"id":1,"name":"瑜伽入门","coachName":"铁娃","price":199,"duration":"60分钟","status":"进行中","remark":"适合零基础学员"},
|
||||
{"id":2,"name":"力量训练","coachName":"小明","price":299,"duration":"45分钟","status":"进行中","remark":"增肌塑形专用"},
|
||||
{"id":3,"name":"有氧舞蹈","coachName":"李娜","price":159,"duration":"50分钟","status":"进行中","remark":"燃脂效果好"},
|
||||
{"id":4,"name":"搏击操","coachName":"王强","price":259,"duration":"40分钟","status":"进行中","remark":"释放压力"},
|
||||
{"id":5,"name":"普拉提","coachName":"刘芳","price":229,"duration":"55分钟","status":"进行中","remark":"改善体态"},
|
||||
{"id":6,"name":"动感单车","coachName":"陈刚","price":179,"duration":"45分钟","status":"已结束","remark":"高强度有氧"},
|
||||
{"id":7,"name":"游泳训练","coachName":"赵敏","price":349,"duration":"60分钟","status":"进行中","remark":"全身运动"},
|
||||
{"id":8,"name":"拳击入门","coachName":"周涛","price":289,"duration":"50分钟","status":"进行中","remark":"防身健身两不误"},
|
||||
{"id":9,"name":"形体塑造","coachName":"吴雪","price":199,"duration":"45分钟","status":"进行中","remark":"塑造完美身材"},
|
||||
{"id":10,"name":"康复训练","coachName":"孙磊","price":399,"duration":"60分钟","status":"进行中","remark":"运动损伤恢复"},
|
||||
{"id":11,"name":"舞蹈培训","coachName":"朱婷","price":249,"duration":"50分钟","status":"已结束","remark":"多种舞种"},
|
||||
{"id":12,"name":"攀岩课程","coachName":"林浩","price":329,"duration":"90分钟","status":"进行中","remark":"挑战自我"},
|
||||
{"id":13,"name":"空手道","coachName":"杨丽","price":279,"duration":"55分钟","status":"进行中","remark":"防身技能"},
|
||||
{"id":14,"name":"肚皮舞","coachName":"黄勇","price":189,"duration":"45分钟","status":"进行中","remark":"女性专属"},
|
||||
{"id":15,"name":"CrossFit","coachName":"徐静","price":359,"duration":"60分钟","status":"进行中","remark":"综合训练"}
|
||||
{"id":1,"name":"瑜伽入门","coachName":"铁娃","price":199,"duration":"60分钟","status":"进行中","remark":"适合零基础学员","startTime":"2024-08-01 09:00","enrolled":25,"capacity":30,"type":"瑜伽"},
|
||||
{"id":2,"name":"力量训练","coachName":"小明","price":299,"duration":"45分钟","status":"进行中","remark":"增肌塑形专用","startTime":"2024-08-01 14:00","enrolled":18,"capacity":20,"type":"力量"},
|
||||
{"id":3,"name":"有氧舞蹈","coachName":"李娜","price":159,"duration":"50分钟","status":"进行中","remark":"燃脂效果好","startTime":"2024-08-02 10:00","enrolled":30,"capacity":35,"type":"有氧"},
|
||||
{"id":4,"name":"搏击操","coachName":"王强","price":259,"duration":"40分钟","status":"进行中","remark":"释放压力","startTime":"2024-08-02 16:00","enrolled":15,"capacity":20,"type":"搏击"},
|
||||
{"id":5,"name":"普拉提","coachName":"刘芳","price":229,"duration":"55分钟","status":"进行中","remark":"改善体态","startTime":"2024-08-03 09:30","enrolled":22,"capacity":25,"type":"瑜伽"},
|
||||
{"id":6,"name":"动感单车","coachName":"陈刚","price":179,"duration":"45分钟","status":"已结束","remark":"高强度有氧","startTime":"2024-07-01 18:00","enrolled":30,"capacity":30,"type":"有氧"},
|
||||
{"id":7,"name":"游泳训练","coachName":"赵敏","price":349,"duration":"60分钟","status":"进行中","remark":"全身运动","startTime":"2024-08-04 15:00","enrolled":12,"capacity":15,"type":"水上"},
|
||||
{"id":8,"name":"拳击入门","coachName":"周涛","price":289,"duration":"50分钟","status":"进行中","remark":"防身健身两不误","startTime":"2024-08-05 19:00","enrolled":20,"capacity":20,"type":"搏击"},
|
||||
{"id":9,"name":"形体塑造","coachName":"吴雪","price":199,"duration":"45分钟","status":"进行中","remark":"塑造完美身材","startTime":"2024-08-06 10:30","enrolled":28,"capacity":30,"type":"塑形"},
|
||||
{"id":10,"name":"康复训练","coachName":"孙磊","price":399,"duration":"60分钟","status":"进行中","remark":"运动损伤恢复","startTime":"2024-08-07 14:30","enrolled":8,"capacity":10,"type":"康复"},
|
||||
{"id":11,"name":"舞蹈培训","coachName":"朱婷","price":249,"duration":"50分钟","status":"已结束","remark":"多种舞种","startTime":"2024-06-15 11:00","enrolled":25,"capacity":30,"type":"舞蹈"},
|
||||
{"id":12,"name":"攀岩课程","coachName":"林浩","price":329,"duration":"90分钟","status":"进行中","remark":"挑战自我","startTime":"2024-08-08 16:30","enrolled":10,"capacity":12,"type":"户外"},
|
||||
{"id":13,"name":"空手道","coachName":"杨丽","price":279,"duration":"55分钟","status":"进行中","remark":"防身技能","startTime":"2024-08-09 18:30","enrolled":16,"capacity":20,"type":"搏击"},
|
||||
{"id":14,"name":"肚皮舞","coachName":"黄勇","price":189,"duration":"45分钟","status":"进行中","remark":"女性专属","startTime":"2024-08-10 13:00","enrolled":22,"capacity":25,"type":"舞蹈"},
|
||||
{"id":15,"name":"CrossFit","coachName":"徐静","price":359,"duration":"60分钟","status":"进行中","remark":"综合训练","startTime":"2024-08-11 07:30","enrolled":18,"capacity":20,"type":"综合"}
|
||||
]
|
||||
|
||||
export const getByPage = (query) => {
|
||||
const { name, status, page, limit } = query
|
||||
const result = list.filter(item => {
|
||||
// 自动结束：报名满且状态为进行中
|
||||
if (item.enrolled >= item.capacity && item.status === '进行中') {
|
||||
item.status = '已结束'
|
||||
}
|
||||
if (name && item.name.indexOf(name) === -1) return false
|
||||
if (status && item.status !== status) return false
|
||||
return true
|
||||
|
|
@ -35,12 +39,21 @@ export const remove = (id) => {
|
|||
}
|
||||
}
|
||||
|
||||
// 切换课程状态
|
||||
export const changeStatus = (id) => {
|
||||
const target = list.find(item => item.id === id)
|
||||
if (target) {
|
||||
target.status = target.status === '进行中' ? '已结束' : '进行中'
|
||||
}
|
||||
}
|
||||
|
||||
// 新增课程
|
||||
export const add = (course) => {
|
||||
const newCourse = {
|
||||
id: list.length === 0 ? 1 : list[list.length - 1].id + 1,
|
||||
...course,
|
||||
status: "进行中"
|
||||
status: "进行中",
|
||||
enrolled: 0
|
||||
}
|
||||
list.push(newCourse)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,24 +1,24 @@
|
|||
const list = [
|
||||
{"id":1,"name":"张三","sex":1,"avatar":"","phone":"13800138001","remark":"年卡会员，喜欢瑜伽","expireDate":"2025-12-31"},
|
||||
{"id":2,"name":"李四","sex":2,"avatar":"","phone":"13800138002","remark":"季卡会员，减脂塑形","expireDate":"2025-09-15"},
|
||||
{"id":3,"name":"王五","sex":1,"avatar":"","phone":"13800138003","remark":"月卡会员，增肌训练","expireDate":"2025-08-01"},
|
||||
{"id":4,"name":"赵六","sex":2,"avatar":"","phone":"13800138004","remark":"年卡会员，产后恢复","expireDate":null},
|
||||
{"id":5,"name":"钱七","sex":1,"avatar":"","phone":"13800138005","remark":"次卡会员，游泳爱好者","expireDate":"2025-07-20"},
|
||||
{"id":6,"name":"孙八","sex":2,"avatar":"","phone":"13800138006","remark":"年卡会员，搏击训练","expireDate":null},
|
||||
{"id":7,"name":"周九","sex":1,"avatar":"","phone":"13800138007","remark":"季卡会员，普拉提","expireDate":"2025-10-10"},
|
||||
{"id":8,"name":"吴十","sex":2,"avatar":"","phone":"13800138008","remark":"月卡会员，有氧舞蹈","expireDate":"2025-07-30"},
|
||||
{"id":9,"name":"郑十一","sex":1,"avatar":"","phone":"13800138009","remark":"年卡会员，自由重量","expireDate":"2026-01-15"},
|
||||
{"id":10,"name":"冯十二","sex":2,"avatar":"","phone":"13800138010","remark":"次卡会员，动感单车","expireDate":"2025-08-25"},
|
||||
{"id":11,"name":"陈十三","sex":1,"avatar":"","phone":"13800138011","remark":"年卡会员，拳击训练","expireDate":null},
|
||||
{"id":12,"name":"楚十四","sex":2,"avatar":"","phone":"13800138012","remark":"季卡会员，形体塑造","expireDate":"2025-11-30"},
|
||||
{"id":13,"name":"魏十五","sex":1,"avatar":"","phone":"13800138013","remark":"月卡会员，康复训练","expireDate":"2025-07-25"},
|
||||
{"id":14,"name":"蒋十六","sex":2,"avatar":"","phone":"13800138014","remark":"年卡会员，舞蹈培训","expireDate":"2026-02-28"},
|
||||
{"id":15,"name":"沈十七","sex":1,"avatar":"","phone":"13800138015","remark":"次卡会员，攀岩爱好者","expireDate":"2025-09-05"},
|
||||
{"id":16,"name":"韩十八","sex":2,"avatar":"","phone":"13800138016","remark":"季卡会员，有氧操","expireDate":"2025-12-01"},
|
||||
{"id":17,"name":"杨十九","sex":1,"avatar":"","phone":"13800138017","remark":"年卡会员，力量训练","expireDate":null},
|
||||
{"id":18,"name":"朱二十","sex":2,"avatar":"","phone":"13800138018","remark":"月卡会员，纤体瑜伽","expireDate":"2025-08-10"},
|
||||
{"id":19,"name":"秦廿一","sex":1,"avatar":"","phone":"13800138019","remark":"年卡会员，CrossFit","expireDate":"2026-03-20"},
|
||||
{"id":20,"name":"许廿二","sex":2,"avatar":"","phone":"13800138020","remark":"季卡会员，空中瑜伽","expireDate":"2025-10-25"}
|
||||
{"id":1,"name":"张三","sex":1,"avatar":"","phone":"13800138001","remark":"年卡会员，喜欢瑜伽","expireDate":"2025-12-31","joinDate":"2024-01-15","level":"金卡","remainCount":null,"totalSpend":5999},
|
||||
{"id":2,"name":"李四","sex":2,"avatar":"","phone":"13800138002","remark":"季卡会员，减脂塑形","expireDate":"2025-09-15","joinDate":"2024-06-20","level":"银卡","remainCount":null,"totalSpend":2999},
|
||||
{"id":3,"name":"王五","sex":1,"avatar":"","phone":"13800138003","remark":"月卡会员，增肌训练","expireDate":"2025-08-01","joinDate":"2024-09-10","level":"普通","remainCount":null,"totalSpend":999},
|
||||
{"id":4,"name":"赵六","sex":2,"avatar":"","phone":"13800138004","remark":"年卡会员，产后恢复","expireDate":null,"joinDate":"2023-12-01","level":"钻石","remainCount":null,"totalSpend":12999},
|
||||
{"id":5,"name":"钱七","sex":1,"avatar":"","phone":"13800138005","remark":"次卡会员，游泳爱好者","expireDate":"2025-07-20","joinDate":"2024-03-15","level":"普通","remainCount":5,"totalSpend":1500},
|
||||
{"id":6,"name":"孙八","sex":2,"avatar":"","phone":"13800138006","remark":"年卡会员，搏击训练","expireDate":null,"joinDate":"2024-02-28","level":"金卡","remainCount":null,"totalSpend":8999},
|
||||
{"id":7,"name":"周九","sex":1,"avatar":"","phone":"13800138007","remark":"季卡会员，普拉提","expireDate":"2025-10-10","joinDate":"2024-07-05","level":"银卡","remainCount":null,"totalSpend":3499},
|
||||
{"id":8,"name":"吴十","sex":2,"avatar":"","phone":"13800138008","remark":"月卡会员，有氧舞蹈","expireDate":"2025-07-30","joinDate":"2024-10-12","level":"普通","remainCount":null,"totalSpend":799},
|
||||
{"id":9,"name":"郑十一","sex":1,"avatar":"","phone":"13800138009","remark":"年卡会员，自由重量","expireDate":"2026-01-15","joinDate":"2024-01-20","level":"金卡","remainCount":null,"totalSpend":6999},
|
||||
{"id":10,"name":"冯十二","sex":2,"avatar":"","phone":"13800138010","remark":"次卡会员，动感单车","expireDate":"2025-08-25","joinDate":"2024-05-18","level":"普通","remainCount":8,"totalSpend":1200},
|
||||
{"id":11,"name":"陈十三","sex":1,"avatar":"","phone":"13800138011","remark":"年卡会员，拳击训练","expireDate":null,"joinDate":"2023-11-25","level":"钻石","remainCount":null,"totalSpend":15999},
|
||||
{"id":12,"name":"楚十四","sex":2,"avatar":"","phone":"13800138012","remark":"季卡会员，形体塑造","expireDate":"2025-11-30","joinDate":"2024-08-08","level":"银卡","remainCount":null,"totalSpend":2599},
|
||||
{"id":13,"name":"魏十五","sex":1,"avatar":"","phone":"13800138013","remark":"月卡会员，康复训练","expireDate":"2025-07-25","joinDate":"2024-10-01","level":"普通","remainCount":null,"totalSpend":599},
|
||||
{"id":14,"name":"蒋十六","sex":2,"avatar":"","phone":"13800138014","remark":"年卡会员，舞蹈培训","expireDate":"2026-02-28","joinDate":"2024-03-10","level":"金卡","remainCount":null,"totalSpend":7499},
|
||||
{"id":15,"name":"沈十七","sex":1,"avatar":"","phone":"13800138015","remark":"次卡会员，攀岩爱好者","expireDate":"2025-09-05","joinDate":"2024-06-15","level":"普通","remainCount":12,"totalSpend":1800},
|
||||
{"id":16,"name":"韩十八","sex":2,"avatar":"","phone":"13800138016","remark":"季卡会员，有氧操","expireDate":"2025-12-01","joinDate":"2024-09-20","level":"银卡","remainCount":null,"totalSpend":2799},
|
||||
{"id":17,"name":"杨十九","sex":1,"avatar":"","phone":"13800138017","remark":"年卡会员，力量训练","expireDate":null,"joinDate":"2024-01-05","level":"钻石","remainCount":null,"totalSpend":18999},
|
||||
{"id":18,"name":"朱二十","sex":2,"avatar":"","phone":"13800138018","remark":"月卡会员，纤体瑜伽","expireDate":"2025-08-10","joinDate":"2024-10-15","level":"普通","remainCount":null,"totalSpend":699},
|
||||
{"id":19,"name":"秦廿一","sex":1,"avatar":"","phone":"13800138019","remark":"年卡会员，CrossFit","expireDate":"2026-03-20","joinDate":"2024-02-14","level":"金卡","remainCount":null,"totalSpend":9499},
|
||||
{"id":20,"name":"许廿二","sex":2,"avatar":"","phone":"13800138020","remark":"季卡会员，空中瑜伽","expireDate":"2025-10-25","joinDate":"2024-07-22","level":"银卡","remainCount":null,"totalSpend":3199}
|
||||
]
|
||||
|
||||
export const getByPage = (query) => {
|
||||
|
|
@ -51,7 +51,10 @@ export const add = (member) => {
|
|||
const newMember = {
|
||||
id: list.length === 0 ? 1 : list[list.length - 1].id + 1,
|
||||
...member,
|
||||
expireDate: null
|
||||
expireDate: null,
|
||||
joinDate: new Date().toLocaleDateString(),
|
||||
remainCount: null,
|
||||
totalSpend: 0
|
||||
}
|
||||
list.push(newMember)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,6 +12,9 @@ const course = reactive({
|
|||
coachName: "",
|
||||
price: null,
|
||||
duration: "",
|
||||
type: "",
|
||||
startTime: "",
|
||||
capacity: null,
|
||||
remark: ""
|
||||
})
|
||||
const rules = {
|
||||
|
|
@ -27,6 +30,15 @@ const rules = {
|
|||
],
|
||||
duration: [
|
||||
{ required: true, message: "课程时长不能为空", trigger: "blur" }
|
||||
],
|
||||
type: [
|
||||
{ required: true, message: "课程类型不能为空", trigger: "change" }
|
||||
],
|
||||
startTime: [
|
||||
{ required: true, message: "开课时间不能为空", trigger: "blur" }
|
||||
],
|
||||
capacity: [
|
||||
{ required: true, message: "课程容量不能为空", trigger: "blur" }
|
||||
]
|
||||
}
|
||||
const addHandler = async () => {
|
||||
|
|
@ -43,6 +55,20 @@ const addHandler = async () => {
|
|||
<el-form-item label="课程名称" prop="name">
|
||||
<el-input placeholder="请输入课程名称" v-model.trim="course.name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="课程类型" prop="type">
|
||||
<el-select v-model="course.type" placeholder="请选择课程类型">
|
||||
<el-option label="瑜伽" value="瑜伽"></el-option>
|
||||
<el-option label="力量" value="力量"></el-option>
|
||||
<el-option label="有氧" value="有氧"></el-option>
|
||||
<el-option label="搏击" value="搏击"></el-option>
|
||||
<el-option label="舞蹈" value="舞蹈"></el-option>
|
||||
<el-option label="塑形" value="塑形"></el-option>
|
||||
<el-option label="康复" value="康复"></el-option>
|
||||
<el-option label="水上" value="水上"></el-option>
|
||||
<el-option label="户外" value="户外"></el-option>
|
||||
<el-option label="综合" value="综合"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="授课教练" prop="coachName">
|
||||
<el-input placeholder="请输入教练姓名" v-model.trim="course.coachName"></el-input>
|
||||
</el-form-item>
|
||||
|
|
@ -52,6 +78,12 @@ const addHandler = async () => {
|
|||
<el-form-item label="课程时长" prop="duration">
|
||||
<el-input placeholder="如：60分钟" v-model.trim="course.duration"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="开课时间" prop="startTime">
|
||||
<el-date-picker v-model="course.startTime" type="datetime" placeholder="选择开课时间" format="YYYY-MM-DD HH:mm" value-format="YYYY-MM-DD HH:mm" />
|
||||
</el-form-item>
|
||||
<el-form-item label="课程容量" prop="capacity">
|
||||
<el-input-number v-model="course.capacity" :min="1" :step="1"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model.trim="course.remark" type="textarea" :rows="5" placeholder="请输入课程备注..."></el-input>
|
||||
</el-form-item>
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ const member = reactive({
|
|||
sex: 1,
|
||||
avatar: "",
|
||||
phone: "",
|
||||
level: "普通",
|
||||
remark: ""
|
||||
})
|
||||
const rules = {
|
||||
|
|
@ -56,6 +57,14 @@ const uploadChangeHandler = (file, fileList) => {
|
|||
<el-form-item label="手机号" prop="phone">
|
||||
<el-input placeholder="请输入手机号.." v-model.trim="member.phone"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="会员等级">
|
||||
<el-select v-model="member.level" placeholder="请选择会员等级">
|
||||
<el-option label="普通" value="普通"></el-option>
|
||||
<el-option label="银卡" value="银卡"></el-option>
|
||||
<el-option label="金卡" value="金卡"></el-option>
|
||||
<el-option label="钻石" value="钻石"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="头像">
|
||||
<el-upload class="avatar-uploader" action="" :auto-upload="false" list-type="picture-card"
|
||||
:on-change="uploadChangeHandler">
|
||||
|
|
|
|||
|
|
@ -23,19 +23,37 @@
|
|||
<el-main>
|
||||
<el-table border :data="courseList">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" :index="indexMethod"></el-table-column>
|
||||
<el-table-column prop="name" label="课程名称" width="120" align="center"></el-table-column>
|
||||
<el-table-column prop="coachName" label="授课教练" width="100" align="center"></el-table-column>
|
||||
<el-table-column prop="price" label="价格(元)" width="100" align="center"></el-table-column>
|
||||
<el-table-column prop="duration" label="时长" width="80" align="center"></el-table-column>
|
||||
<el-table-column prop="name" label="课程名称" width="110" align="center"></el-table-column>
|
||||
<el-table-column prop="type" label="课程类型" width="80" align="center">
|
||||
<template #default="scope">
|
||||
<el-tag>{{ scope.row.type }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="coachName" label="授课教练" width="90" align="center"></el-table-column>
|
||||
<el-table-column prop="price" label="价格(元)" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<span style="color: #e6a23c;">¥{{ scope.row.price }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="duration" label="时长" width="70" align="center"></el-table-column>
|
||||
<el-table-column prop="startTime" label="开课时间" width="140" align="center"></el-table-column>
|
||||
|
||||
<el-table-column label="状态" width="100">
|
||||
<el-table-column label="报名情况" width="100" align="center">
|
||||
<template #default="scope">
|
||||
<span :style="{ color: scope.row.enrolled >= scope.row.capacity ? '#f56c6c' : '#67c23a' }">
|
||||
{{ scope.row.enrolled }}/{{ scope.row.capacity }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="状态" width="90">
|
||||
<template #default="scope">
|
||||
<el-tag type="success" v-if="scope.row.status === '进行中'">进行中</el-tag>
|
||||
<el-tag type="info" v-else>已结束</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="备注" width="200">
|
||||
<el-table-column label="备注" width="150">
|
||||
<template #default="scope">
|
||||
<el-popover placement="right-start" :title="scope.row.name" :width="200" trigger="hover"
|
||||
:content="scope.row.remark">
|
||||
|
|
@ -47,8 +65,11 @@
|
|||
</el-table-column>
|
||||
|
||||
<!-- 操作 -->
|
||||
<el-table-column label="操作" width="100">
|
||||
<el-table-column label="操作" width="150" fixed="right">
|
||||
<template #default="scope">
|
||||
<el-button :icon="Switch" type="warning" size="small" @click="toggleStatus(scope.row)">
|
||||
{{ scope.row.status === '进行中' ? '结束' : '重启' }}
|
||||
</el-button>
|
||||
<el-button :icon="Delete" type="danger" size="small" @click="deleteHandler(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
@ -63,8 +84,8 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { getByPage, remove } from '@/mock/course';
|
||||
import { Delete, Plus, Search } from '@element-plus/icons-vue';
|
||||
import { getByPage, remove, changeStatus } from '@/mock/course';
|
||||
import { Delete, Plus, Search, Switch } from '@element-plus/icons-vue';
|
||||
import { ElMessage, ElMessageBox } from 'element-plus';
|
||||
import { reactive, ref, onMounted, shallowRef } from 'vue';
|
||||
|
||||
|
|
@ -109,6 +130,18 @@ const deleteHandler = (course: any) => {
|
|||
})
|
||||
.catch(() => { })
|
||||
}
|
||||
|
||||
// 切换状态
|
||||
const toggleStatus = (course: any) => {
|
||||
const action = course.status === '进行中' ? '结束' : '重启'
|
||||
ElMessageBox.confirm(`你确认要${action}课程 "${course.name}" 吗?`, "提示", { type: "info" })
|
||||
.then(() => {
|
||||
changeStatus(course.id)
|
||||
ElMessage({ type: 'success', message: `课程 "${course.name}" 已${action}!` })
|
||||
query()
|
||||
})
|
||||
.catch(() => { })
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
|
|
|||
|
|
@ -30,34 +30,43 @@
|
|||
<el-main>
|
||||
<el-table border :data="memberList">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" :index="indexMethod"></el-table-column>
|
||||
<el-table-column prop="name" label="会员名字" width="100" align="center"></el-table-column>
|
||||
<el-table-column prop="sex" label="性别" width="80" align="center">
|
||||
<el-table-column prop="name" label="会员名字" width="90" align="center"></el-table-column>
|
||||
<el-table-column prop="sex" label="性别" width="60" align="center">
|
||||
<template #default="scope">
|
||||
<el-tag type="primary" v-if="scope.row.sex === 1">男</el-tag>
|
||||
<el-tag type="danger" v-else>女</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phone" label="手机号" width="130" align="center"></el-table-column>
|
||||
|
||||
<el-table-column label="备注" width="200">
|
||||
<el-table-column prop="phone" label="手机号" width="120" align="center"></el-table-column>
|
||||
<el-table-column prop="joinDate" label="入会日期" width="110" align="center"></el-table-column>
|
||||
<el-table-column prop="level" label="会员等级" width="80" align="center">
|
||||
<template #default="scope">
|
||||
<el-popover placement="right-start" :title="scope.row.name" :width="200" trigger="hover"
|
||||
:content="scope.row.remark">
|
||||
<template #reference>
|
||||
<span class="remark">{{ scope.row.remark }}</span>
|
||||
</template>
|
||||
</el-popover>
|
||||
<el-tag type="warning" v-if="scope.row.level === '钻石'">钻石</el-tag>
|
||||
<el-tag type="success" v-else-if="scope.row.level === '金卡'">金卡</el-tag>
|
||||
<el-tag type="primary" v-else-if="scope.row.level === '银卡'">银卡</el-tag>
|
||||
<el-tag type="info" v-else>普通</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remainCount" label="剩余次数" width="80" align="center">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.remainCount !== null">{{ scope.row.remainCount }}次</span>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="totalSpend" label="累计消费" width="100" align="center">
|
||||
<template #default="scope">
|
||||
<span style="color: #e6a23c;">¥{{ scope.row.totalSpend }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="状态" width="200">
|
||||
<el-table-column label="状态" width="140">
|
||||
<template #default="scope">
|
||||
<el-tag type="success" v-if="scope.row.expireDate === null">有效</el-tag>
|
||||
<el-tag type="info" v-else>过期:{{ scope.row.expireDate }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="头像" width="80">
|
||||
<el-table-column label="头像" width="70">
|
||||
<template #default="scope">
|
||||
<el-popover v-if="scope.row.avatar" placement="right-start" :title="scope.row.name" trigger="click">
|
||||
<el-image :src="scope.row.avatar"></el-image>
|
||||
|
|
@ -70,7 +79,7 @@
|
|||
</el-table-column>
|
||||
|
||||
<!-- 操作 -->
|
||||
<el-table-column label="操作" width="120">
|
||||
<el-table-column label="操作" width="120" fixed="right">
|
||||
<template #default="scope">
|
||||
<el-button :icon="Delete" type="danger" size="small" v-if="scope.row.expireDate"
|
||||
@click="renewHandler(scope.row)">续费</el-button>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue