main
qsh
2 weeks ago
parent
9e9c7b27b0
commit
1ddbf4b6bb
@ -0,0 +1,46 @@ |
|||||||
|
import request from '@/config/axios' |
||||||
|
|
||||||
|
// 分页
|
||||||
|
export const getUserPage = (params) => { |
||||||
|
return request.get({ url: 'admin-api/applet/sinology/sys/user/page', params }) |
||||||
|
} |
||||||
|
|
||||||
|
export const getVipTypeList = async (params) => { |
||||||
|
return await request.get({ |
||||||
|
url: '/admin-api/applet/sinology/sys/member/page', |
||||||
|
params: params |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export const addVipType = async (data) => { |
||||||
|
return await request.post({ |
||||||
|
url: '/admin-api/applet/sinology/sys/member/create', |
||||||
|
data |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export const updateVipType = async (data) => { |
||||||
|
return await request.put({ |
||||||
|
url: '/admin-api/applet/sinology/sys/member/update', |
||||||
|
data |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export const deleteVipType = async (id) => { |
||||||
|
return await request.delete({ |
||||||
|
url: '/admin-api/applet/sinology/sys/member/delete?memberId=' + id |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export const getVipType = async (id) => { |
||||||
|
return await request.get({ |
||||||
|
url: '/admin-api/applet/sinology/sys/member/get?id=' + id |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export const addUserMember = async (data) => { |
||||||
|
return await request.post({ |
||||||
|
url: '/admin-api/applet/sinology/sys/user-member/add', |
||||||
|
data |
||||||
|
}) |
||||||
|
} |
||||||
@ -0,0 +1,25 @@ |
|||||||
|
import request from '@/config/axios' |
||||||
|
|
||||||
|
// 创建
|
||||||
|
export const createChapter = (data) => { |
||||||
|
return request.post({ |
||||||
|
url: '/admin-api/applet/sinology/chapter/create', |
||||||
|
data, |
||||||
|
isSubmitForm: true |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
// 修改
|
||||||
|
export const updateChapter = (data) => { |
||||||
|
return request.put({ url: '/admin-api/applet/sinology/chapter/update', data }) |
||||||
|
} |
||||||
|
|
||||||
|
// 分页
|
||||||
|
export const getChapterPage = (params) => { |
||||||
|
return request.get({ url: '/admin-api/applet/sinology/chapter/page', params }) |
||||||
|
} |
||||||
|
|
||||||
|
// 删除
|
||||||
|
export const deleteChapter = (id) => { |
||||||
|
return request.delete({ url: '/admin-api/applet/sinology/chapter/delete', params: { id } }) |
||||||
|
} |
||||||
@ -0,0 +1,168 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<el-form :model="searchForm" inline @submit.prevent> |
||||||
|
<el-form-item> |
||||||
|
<el-input |
||||||
|
v-model="searchForm.phone" |
||||||
|
placeholder="请输入手机号" |
||||||
|
clearable |
||||||
|
@keyup.enter="handleQuery" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-date-picker |
||||||
|
v-model="searchForm.createDate" |
||||||
|
type="daterange" |
||||||
|
range-separator="-" |
||||||
|
value-format="YYYY-MM-DD" |
||||||
|
format="YYYY-MM-DD" |
||||||
|
start-placeholder="注册日期" |
||||||
|
end-placeholder="注册日期" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button @click="handleQuery">搜索</el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
|
||||||
|
<el-table v-loading="loading" :data="tableList" border stripe> |
||||||
|
<el-table-column type="index" width="50" /> |
||||||
|
<el-table-column label="头像" width="80"> |
||||||
|
<template #default="scope"> |
||||||
|
<img :src="scope.row.avatar" width="50" height="50" /> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="昵称" prop="userName" min-width="120" /> |
||||||
|
<el-table-column label="手机号码" prop="phone" width="120" /> |
||||||
|
<el-table-column label="生日" prop="birthday" min-width="120" /> |
||||||
|
<el-table-column |
||||||
|
label="性别" |
||||||
|
prop="sex" |
||||||
|
width="100" |
||||||
|
:formatter="(row) => (row.sex === 1 ? '男' : '女')" |
||||||
|
/> |
||||||
|
<el-table-column label="注册日期" prop="createTime" min-width="120" /> |
||||||
|
<el-table-column label="会员类型" prop="createTime" min-width="120" /> |
||||||
|
<el-table-column label="会员截止日期" prop="createTime" min-width="120" /> |
||||||
|
<!-- 操作 --> |
||||||
|
<el-table-column label="操作" width="120"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-button type="primary" link @click="handleAddVip(row)">赠送会员</el-button> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
<Pagination |
||||||
|
:total="total" |
||||||
|
v-model:page="searchForm.pageNo" |
||||||
|
v-model:limit="searchForm.pageSize" |
||||||
|
@pagination="getList" |
||||||
|
/> |
||||||
|
|
||||||
|
<el-dialog title="赠送会员" v-model="showDialog" width="500px" :close-on-click-modal="false"> |
||||||
|
<el-form :model="form" ref="formRef" :rules="rules" label-width="80px"> |
||||||
|
<el-form-item label="会员类型" prop="memberId"> |
||||||
|
<el-select v-model="form.memberId" clearable filterable style="width: 100%"> |
||||||
|
<el-option |
||||||
|
v-for="item in vipOptions" |
||||||
|
:key="item.memberId" |
||||||
|
:label="item.memberName" |
||||||
|
:value="item.memberId" |
||||||
|
> |
||||||
|
<span style="float: left">{{ item.memberName }}</span> |
||||||
|
<span style="float: right; color: #aaa">{{ item.carName }}</span> |
||||||
|
</el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
|
||||||
|
<template #footer> |
||||||
|
<span> |
||||||
|
<el-button @click="showDialog = false">取消</el-button> |
||||||
|
<el-button type="primary" @click="sureAddVip">确定</el-button> |
||||||
|
</span> |
||||||
|
</template> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script name="AppletUser" setup> |
||||||
|
import { removeNullField } from '@/utils' |
||||||
|
import * as UserApi from '@/api/gds/appletUser.js' |
||||||
|
import { getVipTypeList } from '@/api/gds/appletUser' |
||||||
|
|
||||||
|
const message = useMessage() |
||||||
|
|
||||||
|
const searchForm = ref({ |
||||||
|
distributionld: undefined, |
||||||
|
phone: '', |
||||||
|
createDate: [], |
||||||
|
pageNo: 1, |
||||||
|
pageSize: 20 |
||||||
|
}) |
||||||
|
|
||||||
|
onMounted(() => { |
||||||
|
handleQuery() |
||||||
|
}) |
||||||
|
|
||||||
|
/** 搜索按钮操作 */ |
||||||
|
const handleQuery = () => { |
||||||
|
searchForm.value.pageNo = 1 |
||||||
|
getList() |
||||||
|
} |
||||||
|
|
||||||
|
const loading = ref(false) |
||||||
|
const tableList = ref([]) |
||||||
|
const total = ref(0) |
||||||
|
/** 查询列表 */ |
||||||
|
const getList = async () => { |
||||||
|
loading.value = true |
||||||
|
try { |
||||||
|
if (searchForm.value.createDate && searchForm.value.createDate.length > 0) { |
||||||
|
searchForm.value.createTimeBegin = searchForm.value.createDate[0] + ' 00:00:00' |
||||||
|
searchForm.value.createTimeEnd = searchForm.value.createDate[1] + ' 23:59:59' |
||||||
|
} else { |
||||||
|
searchForm.value.createTimeBegin = undefined |
||||||
|
searchForm.value.createTimeEnd = undefined |
||||||
|
} |
||||||
|
const data = await UserApi.getUserPage(removeNullField(searchForm.value)) |
||||||
|
tableList.value = data.list |
||||||
|
total.value = data.total |
||||||
|
} finally { |
||||||
|
loading.value = false |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
const showDialog = ref(false) |
||||||
|
const form = ref({ |
||||||
|
phone: '', |
||||||
|
memberId: '' |
||||||
|
}) |
||||||
|
|
||||||
|
const vipOptions = ref([]) |
||||||
|
const rules = { |
||||||
|
memberId: [{ required: true, message: '请选择会员类型', trigger: 'change' }] |
||||||
|
} |
||||||
|
const formRef = ref() |
||||||
|
|
||||||
|
function handleAddVip(row) { |
||||||
|
getVipTypeList({ pageNo: 1, pageSize: -1 }).then((response) => { |
||||||
|
vipOptions.value = response.list |
||||||
|
}) |
||||||
|
form.value.phone = row.phone |
||||||
|
showDialog.value = true |
||||||
|
} |
||||||
|
|
||||||
|
function sureAddVip() { |
||||||
|
if (!formRef.value) return |
||||||
|
formRef.value.validate((valid) => { |
||||||
|
if (!valid) return |
||||||
|
UserApi.addUserMember(form.value).then(() => { |
||||||
|
showDialog.value = false |
||||||
|
getList() |
||||||
|
message.success('操作成功') |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped></style> |
||||||
@ -0,0 +1,188 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<el-form :model="searchForm" inline @submit.prevent> |
||||||
|
<el-form-item> |
||||||
|
<el-input v-model="searchForm.memberName" placeholder="会员名称" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button @click="searchList">查询</el-button> |
||||||
|
<el-button type="primary" @click="addVip">新增会员类型</el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<el-table v-loading="loading" :data="tableList" height="calc(100vh - 260px)"> |
||||||
|
<el-table-column type="index" width="55" align="center" /> |
||||||
|
<el-table-column label="会员名" align="center" prop="memberName" min-width="140" /> |
||||||
|
<el-table-column label="原价" align="center" prop="price" /> |
||||||
|
<el-table-column label="折扣价" align="center" prop="discount" /> |
||||||
|
<el-table-column label="有效期" align="center" prop="duration" /> |
||||||
|
<el-table-column label="单位" align="center"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-tag v-if="row.unit == 1">天</el-tag> |
||||||
|
<el-tag v-else type="danger">年</el-tag> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="使用方式" align="center" prop="useTypeName" /> |
||||||
|
<el-table-column label="操作" width="160"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-button type="primary" link @click="editVip(row)">修改</el-button> |
||||||
|
<el-button type="primary" link @click="handleDelete(row.memberId)">删除</el-button> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
<pagination |
||||||
|
v-show="total > 0" |
||||||
|
:total="total" |
||||||
|
v-model:page="searchForm.pageNo" |
||||||
|
v-model:limit="searchForm.pageSize" |
||||||
|
@pagination="getList" |
||||||
|
/> |
||||||
|
|
||||||
|
<el-dialog title="会员详情" v-model="showDialog" width="500px" :close-on-click-modal="false"> |
||||||
|
<el-form :model="form" ref="formRef" :rules="rules" label-width="80px"> |
||||||
|
<el-form-item label="会员名称" prop="memberName"> |
||||||
|
<el-input v-model="form.memberName" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="原价" prop="price"> |
||||||
|
<el-input v-model="form.price" type="number" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="折扣价" prop="discount"> |
||||||
|
<el-input v-model="form.discount" type="number" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="有效期" prop="duration"> |
||||||
|
<el-input v-model="form.duration" type="number" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="单位" prop="unit"> |
||||||
|
<el-radio-group v-model="form.unit"> |
||||||
|
<el-radio :label="1">天</el-radio> |
||||||
|
<el-radio :label="3">年</el-radio> |
||||||
|
</el-radio-group> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="使用方式" prop="useTypes"> |
||||||
|
<el-checkbox-group v-model="form.useTypes"> |
||||||
|
<el-checkbox :label="1"> 用户购买 </el-checkbox> |
||||||
|
<el-checkbox :label="2"> 客服赠送 </el-checkbox> |
||||||
|
</el-checkbox-group> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
|
||||||
|
<template #footer> |
||||||
|
<span> |
||||||
|
<el-button @click="showDialog = false">取消</el-button> |
||||||
|
<el-button type="primary" @click="sureAdd">确定</el-button> |
||||||
|
</span> |
||||||
|
</template> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup name="VipType"> |
||||||
|
import { |
||||||
|
getVipTypeList, |
||||||
|
addVipType, |
||||||
|
updateVipType, |
||||||
|
deleteVipType, |
||||||
|
getVipType |
||||||
|
} from '@/api/gds/appletUser' |
||||||
|
const message = useMessage() |
||||||
|
const searchForm = ref({ |
||||||
|
memberName: undefined, |
||||||
|
pageNo: 1, |
||||||
|
pageSize: 50 |
||||||
|
}) |
||||||
|
|
||||||
|
const loading = ref(false) |
||||||
|
const tableList = ref([]) |
||||||
|
const total = ref(0) |
||||||
|
|
||||||
|
onMounted(() => { |
||||||
|
searchList() |
||||||
|
}) |
||||||
|
function searchList() { |
||||||
|
searchForm.value.pageNo = 1 |
||||||
|
getList() |
||||||
|
} |
||||||
|
|
||||||
|
function getList() { |
||||||
|
loading.value = true |
||||||
|
getVipTypeList(searchForm.value).then((response) => { |
||||||
|
tableList.value = response.list |
||||||
|
total.value = response.total |
||||||
|
loading.value = false |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
const showDialog = ref(false) |
||||||
|
const form = ref({ |
||||||
|
memberName: '', |
||||||
|
price: '', |
||||||
|
discount: '', |
||||||
|
duration: '', |
||||||
|
unit: 1, |
||||||
|
useTypes: [1] |
||||||
|
}) |
||||||
|
const rules = ref({ |
||||||
|
memberName: [{ required: true, message: '请输入会员名称', trigger: 'blur' }], |
||||||
|
price: [{ required: true, message: '请输入价格', trigger: 'blur' }], |
||||||
|
discount: [{ required: true, message: '请输入折扣价', trigger: 'blur' }], |
||||||
|
duration: [{ required: true, message: '请输入有效期', trigger: 'blur' }] |
||||||
|
}) |
||||||
|
|
||||||
|
function addVip() { |
||||||
|
showDialog.value = true |
||||||
|
|
||||||
|
form.value = { |
||||||
|
memberName: '', |
||||||
|
price: '', |
||||||
|
discount: '', |
||||||
|
duration: '', |
||||||
|
unit: 1, |
||||||
|
useTypes: [1] |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
function editVip(row) { |
||||||
|
try { |
||||||
|
getVipType(row.memberId).then((res) => { |
||||||
|
form.value = { |
||||||
|
...res, |
||||||
|
useTypes: res.useType.split(',').map((item) => Number(item)), |
||||||
|
unit: Number(res.unit) |
||||||
|
} |
||||||
|
showDialog.value = true |
||||||
|
}) |
||||||
|
} catch (error) {} |
||||||
|
} |
||||||
|
|
||||||
|
const formRef = ref(null) |
||||||
|
async function sureAdd() { |
||||||
|
if (!formRef.value) return |
||||||
|
const valid = await formRef.value.validate() |
||||||
|
if (!valid) return |
||||||
|
|
||||||
|
// 调用接口 |
||||||
|
if (form.value.memberId) { |
||||||
|
updateVipType(form.value).then(() => { |
||||||
|
message.success('修改成功') |
||||||
|
showDialog.value = false |
||||||
|
searchList() |
||||||
|
}) |
||||||
|
} else { |
||||||
|
addVipType(form.value).then(() => { |
||||||
|
message.success('添加成功') |
||||||
|
showDialog.value = false |
||||||
|
searchList() |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
function handleDelete(id) { |
||||||
|
message.confirm('是否确认删除该会员？').then(() => { |
||||||
|
deleteVipType(id).then(() => { |
||||||
|
message.success('删除成功') |
||||||
|
searchList() |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped></style> |
||||||
@ -0,0 +1,81 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<el-form :model="searchForm" inline @submit.prevent> |
||||||
|
<el-form-item> |
||||||
|
<el-input v-model="searchForm.phone" placeholder="学员手机号" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-select v-model="searchForm.memberId" placeholder="选择会员类型" clearable filterable> |
||||||
|
<el-option |
||||||
|
v-for="item in vipOptions" |
||||||
|
:key="item.memberId" |
||||||
|
:label="item.memberName" |
||||||
|
:value="item.memberId" |
||||||
|
/> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button @click="searchList">查询</el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<el-table v-loading="loading" :data="tableList" height="calc(100vh - 260px)"> |
||||||
|
<el-table-column type="index" width="55" align="center" /> |
||||||
|
<el-table-column label="手机号" align="left" prop="phone" min-width="140" /> |
||||||
|
<el-table-column label="会员名" align="left" prop="memberName" min-width="140" /> |
||||||
|
<el-table-column label="来源" align="left" prop="useTypeName" min-width="100" /> |
||||||
|
<el-table-column label="截止日期" align="left" prop="endDate" min-width="120" /> |
||||||
|
<el-table-column label="操作人" align="left" prop="operUser" min-width="100" /> |
||||||
|
<el-table-column label="操作时间" align="left" prop="createTime" min-width="120" /> |
||||||
|
</el-table> |
||||||
|
<pagination |
||||||
|
v-show="total > 0" |
||||||
|
:total="total" |
||||||
|
v-model:page="searchForm.pageNo" |
||||||
|
v-model:limit="searchForm.pageSize" |
||||||
|
@pagination="getList" |
||||||
|
/> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup name="VipUser"> |
||||||
|
import { getVipTypeList } from '@/api/gds/appletUser' |
||||||
|
const searchForm = ref({ |
||||||
|
memberId: undefined, |
||||||
|
phone: undefined, |
||||||
|
pageNo: 1, |
||||||
|
pageSize: 50 |
||||||
|
}) |
||||||
|
|
||||||
|
const loading = ref(false) |
||||||
|
const tableList = ref([]) |
||||||
|
const total = ref(0) |
||||||
|
|
||||||
|
const vipOptions = ref([]) |
||||||
|
|
||||||
|
onMounted(() => { |
||||||
|
changeCarType() |
||||||
|
}) |
||||||
|
|
||||||
|
function changeCarType() { |
||||||
|
getVipTypeList({ pageNo: 1, pageSize: -1 }).then((response) => { |
||||||
|
vipOptions.value = response.list |
||||||
|
}) |
||||||
|
searchList() |
||||||
|
} |
||||||
|
|
||||||
|
function searchList() { |
||||||
|
searchForm.value.pageNo = 1 |
||||||
|
getList() |
||||||
|
} |
||||||
|
|
||||||
|
function getList() { |
||||||
|
// loading.value = true |
||||||
|
// getUserMemberList(searchForm.value).then((response) => { |
||||||
|
// tableList.value = response.list |
||||||
|
// total.value = response.total |
||||||
|
// loading.value = false |
||||||
|
// }) |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped></style> |
||||||
@ -0,0 +1,25 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<el-tabs v-model="tabIndex"> |
||||||
|
<el-tab-pane label="小程序用户" :name="1"> |
||||||
|
<GdsUser v-if="tabIndex == 1" /> |
||||||
|
</el-tab-pane> |
||||||
|
<el-tab-pane label="会员类型" :name="2"> |
||||||
|
<VipType v-if="tabIndex == 2" /> |
||||||
|
</el-tab-pane> |
||||||
|
<el-tab-pane label="VIP操作记录" :name="5"> |
||||||
|
<VipRecord v-if="tabIndex == 5" /> |
||||||
|
</el-tab-pane> |
||||||
|
</el-tabs> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup> |
||||||
|
import VipType from './components/gdsVip.vue' |
||||||
|
import GdsUser from './components/gdsUsers.vue' |
||||||
|
import VipRecord from './components/gdsVipRecord.vue' |
||||||
|
|
||||||
|
const tabIndex = ref(1) |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped></style> |
||||||
@ -0,0 +1,211 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<el-form :inline="true" label-width="0" @submit.prevent> |
||||||
|
<el-form-item> |
||||||
|
<el-input |
||||||
|
v-model="queryParams.lessonName" |
||||||
|
placeholder="请输入章节名" |
||||||
|
clearable |
||||||
|
@keyup.enter="handleQuery" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-select v-model="queryParams.status" placeholder="发布状态" clearable filterable> |
||||||
|
<el-option label="已发布" :value="1" /> |
||||||
|
<el-option label="已下架" :value="2" /> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button type="primary" @click="handleQuery"> 搜索 </el-button> |
||||||
|
<el-button type="primary" @click="handleAdd"> 新增 </el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<el-table |
||||||
|
v-loading="loading" |
||||||
|
:data="tableList" |
||||||
|
highlight-current-row |
||||||
|
max-height="calc(100vh - 320px)" |
||||||
|
> |
||||||
|
<el-table-column type="index" width="55" align="center" /> |
||||||
|
<el-table-column label="章节序号" align="left" prop="chapterIndex" width="80" /> |
||||||
|
<el-table-column label="章节名" align="left" prop="chapterName" min-width="140" /> |
||||||
|
<el-table-column label="作者" align="center" prop="author" min-width="100" /> |
||||||
|
<el-table-column label="是否付费" align="center" width="100"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-tag type="success" v-if="row.isFree">免费</el-tag> |
||||||
|
<el-tag type="danger" v-else>付费</el-tag> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="章节内容" :width="90"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-popover placement="right" width="500px" trigger="click" v-if="row.content"> |
||||||
|
<template #reference> |
||||||
|
<el-button type="primary" style="padding: 0" text>点击查看</el-button> |
||||||
|
</template> |
||||||
|
<div v-dompurify-html="row.content" style="max-height: 800px; overflow-y: auto"></div> |
||||||
|
</el-popover> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
|
||||||
|
<el-table-column label="发布时间" align="center" prop="publicTime" min-width="100" /> |
||||||
|
<el-table-column label="浏览数" align="center" prop="browseCount" width="100" /> |
||||||
|
<el-table-column label="点赞数" align="center" prop="goodCount" width="100" /> |
||||||
|
<el-table-column label="收藏数" align="center" prop="likeCount" width="100" /> |
||||||
|
<el-table-column label="操作" align="center" width="140"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-button type="primary" link @click.stop="handleEdit(row)"> 修改 </el-button> |
||||||
|
<el-button type="primary" link @click="handleDelete(row)"> 删除 </el-button> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
|
||||||
|
<pagination |
||||||
|
style="margin-bottom: 0" |
||||||
|
v-show="total > 0" |
||||||
|
:total="total" |
||||||
|
v-model:page="queryParams.pageNo" |
||||||
|
v-model:limit="queryParams.pageSize" |
||||||
|
@pagination="getList" |
||||||
|
/> |
||||||
|
|
||||||
|
<el-dialog |
||||||
|
:title="dialogTitle" |
||||||
|
v-model="showDialog" |
||||||
|
width="600px" |
||||||
|
:close-on-click-modal="false" |
||||||
|
> |
||||||
|
<el-form :model="form" ref="formRef" :rules="rules" label-width="80px" :inline="false"> |
||||||
|
<el-form-item label="章节序号" prop="chapterIndex"> |
||||||
|
<el-input v-model="form.chapterIndex" placeholder="请输入" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="章节名" prop="chapterName"> |
||||||
|
<el-input v-model="form.chapterName" placeholder="请输入" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="作者"> |
||||||
|
<el-input v-model="form.author" placeholder="请输入" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="发布状态"> |
||||||
|
<el-radio-group v-model="form.status"> |
||||||
|
<el-radio :label="1">发布</el-radio> |
||||||
|
<el-radio :label="2">不发布</el-radio> |
||||||
|
</el-radio-group> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="章节内容" prop="content"> |
||||||
|
<Editor v-model="form.content" /> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
|
||||||
|
<template #footer> |
||||||
|
<span> |
||||||
|
<el-button @click="showDialog = false">取 消</el-button> |
||||||
|
<el-button type="primary" @click="handleSave">确 认</el-button> |
||||||
|
</span> |
||||||
|
</template> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup> |
||||||
|
import * as ChapterApi from '@/api/gds/chapter' |
||||||
|
|
||||||
|
const route = useRoute() |
||||||
|
const message = useMessage() |
||||||
|
|
||||||
|
const tableList = ref([]) |
||||||
|
const total = ref(0) |
||||||
|
const loading = ref(false) |
||||||
|
|
||||||
|
const queryParams = ref({ |
||||||
|
pageNo: 1, |
||||||
|
pageSize: 20, |
||||||
|
lessonName: undefined, |
||||||
|
author: undefined |
||||||
|
}) |
||||||
|
|
||||||
|
function handleQuery() { |
||||||
|
queryParams.value.pageNo = 1 |
||||||
|
getList() |
||||||
|
} |
||||||
|
|
||||||
|
async function getList() { |
||||||
|
try { |
||||||
|
loading.value = true |
||||||
|
const params = { ...queryParams.value, lessonId: route.query.lessonId } |
||||||
|
const data = await ChapterApi.getChapterPage(params) |
||||||
|
tableList.value = data.list |
||||||
|
total.value = data.total |
||||||
|
loading.value = false |
||||||
|
} finally { |
||||||
|
loading.value = false |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
const showDialog = ref(false) |
||||||
|
const dialogTitle = ref('') |
||||||
|
const form = ref({}) |
||||||
|
const formRef = ref() |
||||||
|
const rules = { |
||||||
|
chapterName: [{ required: true, message: '请输入章节名称', trigger: 'blur' }], |
||||||
|
chapterIndex: [{ required: true, message: '请输入章节序号', trigger: 'blur' }], |
||||||
|
content: [{ required: true, message: '请输入章节内容', trigger: 'blur' }] |
||||||
|
} |
||||||
|
function handleAdd() { |
||||||
|
resetForm() |
||||||
|
dialogTitle.value = '新增章节' |
||||||
|
showDialog.value = true |
||||||
|
} |
||||||
|
|
||||||
|
function handleEdit(row) { |
||||||
|
resetForm() |
||||||
|
dialogTitle.value = '修改章节' |
||||||
|
showDialog.value = true |
||||||
|
form.value = { ...row } |
||||||
|
} |
||||||
|
|
||||||
|
function resetForm() { |
||||||
|
form.value = { |
||||||
|
lessonName: '', |
||||||
|
image: '', |
||||||
|
introduction: '', |
||||||
|
author: '', |
||||||
|
status: 2 |
||||||
|
} |
||||||
|
formRef.value && formRef.value.resetFields() |
||||||
|
} |
||||||
|
|
||||||
|
function handleDelete(row) { |
||||||
|
message |
||||||
|
.confirm('是否确认删除该章节？', '警告', { |
||||||
|
type: 'warning' |
||||||
|
}) |
||||||
|
.then(async () => { |
||||||
|
try { |
||||||
|
await ChapterApi.deleteChapter(row.chapterId) |
||||||
|
message.success('删除成功') |
||||||
|
getList() |
||||||
|
} catch (error) {} |
||||||
|
}) |
||||||
|
.catch(() => {}) |
||||||
|
} |
||||||
|
|
||||||
|
function handleSave() { |
||||||
|
formRef.value.validate(async (valid) => { |
||||||
|
if (!valid) return |
||||||
|
try { |
||||||
|
if (form.value.chapterId) { |
||||||
|
await ChapterApi.updateChapter(form.value) |
||||||
|
} else { |
||||||
|
await ChapterApi.addChapter(form.value) |
||||||
|
} |
||||||
|
showDialog.value = false |
||||||
|
getList() |
||||||
|
} catch (error) {} |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
onMounted(() => { |
||||||
|
getList() |
||||||
|
}) |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped></style> |
||||||
Loading…
Reference in new issue