From 927b200cf226cae1d57e3ba02bf60f6e3586d3da Mon Sep 17 00:00:00 2001 From: ranranran12123 Date: Wed, 25 Jun 2025 13:16:06 +0800 Subject: [PATCH] =?UTF-8?q?=E7=AB=A0=E8=8A=82=E6=A8=A1=E5=9D=97=EF=BC=88?= =?UTF-8?q?=E5=A2=9E=E5=88=A0=E6=94=B9=E6=9F=A5=20=E6=89=B9=E9=87=8F?= =?UTF-8?q?=E5=88=A0=E9=99=A4=EF=BC=89+=E8=AF=BE=E7=A8=8B=E8=AE=A2?= =?UTF-8?q?=E5=8D=95=EF=BC=88=E5=88=A0=E6=9F=A5=E8=AF=A2=E5=8D=95=E6=9F=A5?= =?UTF-8?q?=E8=AF=A2=E6=89=B9=E9=87=8F=E5=88=A0=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/layout/manage/ManageSidebar.vue | 1 + src/router/routes.ts | 5 + src/view/course/chapterDetail.vue | 908 ++++++++++++++++++++++++++- src/view/course/courseManagement.vue | 323 +++++----- src/view/course/courseOrder.vue | 461 ++++++++++++++ 5 files changed, 1520 insertions(+), 178 deletions(-) create mode 100644 src/view/course/courseOrder.vue diff --git a/src/layout/manage/ManageSidebar.vue b/src/layout/manage/ManageSidebar.vue index 51c8063..86bbebe 100644 --- a/src/layout/manage/ManageSidebar.vue +++ b/src/layout/manage/ManageSidebar.vue @@ -41,6 +41,7 @@ 课程管理 + 课程订单 + + + + + + + @@ -97,18 +136,22 @@ import {downLoadImage} from "../../api/ImageUrl.ts"; import router from "../../router"; const loading = ref(false); -const total = ref(0); const selectedRowKeys = ref([]); // 存储选中的行ID -const searchCourseName = ref(""); // 改为项目名称搜索参数 +// 搜索参数 +const searchCourseName = ref(""); +const searchCourseType = ref(""); +const searchIsShelves = ref(""); + +// 分页查询参数 const searchParams = ref({ current: 1, pageSize: 10, sortField: "id", sortOrder: "ascend", - userRole: null, name: "", - type:"" + type: "", + isShelves: "" }); // 行选择配置 @@ -119,9 +162,8 @@ const rowSelection = ref({ } }); -//用户表 +// 课程表格列定义 const columns = [ - { title: '课程ID', dataIndex: 'id', @@ -129,10 +171,9 @@ const columns = [ key: 'id', fixed: 'left', align: 'center', - sorter: true, // 添加排序功能 - sortDirections: ['ascend', 'descend'] // 允许升序降序 + sorter: true, + sortDirections: ['ascend', 'descend'] }, - { title: '课程图片', dataIndex: 'image', @@ -162,8 +203,8 @@ const columns = [ width: 55, key: 'originPrice', align: 'center', - sorter: true, // 添加排序功能 - sortDirections: ['ascend', 'descend'] // 允许升序降序 + sorter: true, + sortDirections: ['ascend', 'descend'] }, { title: '折扣价格', @@ -171,8 +212,8 @@ const columns = [ key: 'discountPrice', width: 55, align: 'center', - sorter: true, // 添加排序功能 - sortDirections: ['ascend', 'descend'] // 允许升序降序 + sorter: true, + sortDirections: ['ascend', 'descend'] }, { title: '已下单人数', @@ -180,8 +221,8 @@ const columns = [ key: 'orderCount', width: 55, align: 'center', - sorter: true, // 添加排序功能 - sortDirections: ['ascend', 'descend'] // 允许升序降序 + sorter: true, + sortDirections: ['ascend', 'descend'] }, { title: '一级佣金比例', @@ -189,8 +230,8 @@ const columns = [ key: 'firstLevelRate', width: 65, align: 'center', - sorter: true, // 添加排序功能 - sortDirections: ['ascend', 'descend'] // 允许升序降序 + sorter: true, + sortDirections: ['ascend', 'descend'] }, { title: '二级佣金比例', @@ -198,8 +239,15 @@ const columns = [ key: 'secondLevelRate', width: 65, align: 'center', - sorter: true, // 添加排序功能 - sortDirections: ['ascend', 'descend'] // 允许升序降序 + sorter: true, + sortDirections: ['ascend', 'descend'] + }, + { + title: '是否上架', + dataIndex: 'isShelves', + key: 'isShelves', + width: 65, + align: 'center' }, { title: '操作', @@ -210,42 +258,30 @@ const columns = [ } ]; -interface ProjectRecord { - // 这里根据实际数据结构定义属性 - superHostList?: string[]; - // 其他属性... -} -// 项目名称搜索方法 +// 课程名称搜索方法 const handleCourseSearch = async () => { - // 将搜索参数同步到分页查询参数 searchParams.value.name = searchCourseName.value; + searchParams.value.type = searchCourseType.value; + searchParams.value.isShelves = searchIsShelves.value; searchParams.value.current = 1; // 重置到第一页 await getCourseList(); }; -//用户分页查询 + +// 课程分页查询 const getCourseList = async () => { loading.value = true; try { const storedToken = localStorage.getItem('token'); if (!storedToken) throw new Error('未找到登录信息'); - const res:any = await myAxios.post("/course/page", - { - ...searchParams.value, - projectName: searchParams.value.projectName - }, + const res: any = await myAxios.post("/course/page", searchParams.value, { headers: { Authorization: storedToken } } ); - console.log(res) + if (res.code === 1 && res.data && Array.isArray(res.data.records)) { - tableData.value = res.data.records.map((item: ProjectRecord) => ({ - ...item, - superUserList: item.superHostList? item.superHostList.join(', ') : '无' - })); + tableData.value = res.data.records; // 同步总条数到分页组件 - total.value = res.data.total; - pagination.value.total = res.data.total; // 新增此行 - pagination.value.current = searchParams.value.current; // 同步当前页 + pagination.value.total = res.data.total; } else { message.error(res.message || '请求失败'); } @@ -258,7 +294,6 @@ const getCourseList = async () => { }; onMounted(getCourseList); -//分页 // 分页配置 const pagination = ref({ @@ -270,49 +305,55 @@ const pagination = ref({ showTotal: (total: number) => `共 ${total} 条`, pageSizeOptions: ['10', '20', '50', '100'] }); -const handleTableChange = (pag: any, _: any, sorter: any) => { - // 处理排序参数 - let sortField = "id"; // 默认排序字段 - let sortOrder = "ascend"; // 默认排序方式 - if (sorter.field) { - sortField = sorter.field; - sortOrder = sorter.order; + +// 处理分页和排序变化 +const handleTableChange = (pag: any, _filters: any, sorter: any) => { + searchParams.value.current = pag.current; + searchParams.value.pageSize = pag.pageSize; + + // 处理排序 + if (sorter && sorter.field) { + // 获取排序字段（使用列的key而不是dataIndex） + const sortField = sorter.field; + + // 获取排序方向（ascend/descend） + const sortOrder = sorter.order ? sorter.order : ''; + + // 更新搜索参数中的排序字段和排序方向 + searchParams.value.sortField = sortField; + searchParams.value.sortOrder = sortOrder; + } else { + // 如果没有排序信息，重置为默认排序 + searchParams.value.sortField = "id"; + searchParams.value.sortOrder = "ascend"; } - searchParams.value = { - ...searchParams.value, - current: pag.current, - pageSize: pag.pageSize, - sortField: sortField, // 设置排序字段 - sortOrder: sortOrder - }; // 同步到分页组件 - pagination.value = { - ...pagination.value, - current: pag.current, - pageSize: pag.pageSize - }; + pagination.value.current = pag.current; + pagination.value.pageSize = pag.pageSize; getCourseList(); }; -// ID查询方法 -interface Project { +// 课程接口定义 +interface Course { id: number; - projectName: string; - projectImage: string; - projectSettlementCycle: number; - maxPromoterCount: number; - projectStatus: string; - projectDescription: string; - settlementDesc: string; - // 其他可能存在的属性根据实际情况补充 + name: string; + type: string; + detail: string; + promoCodeDesc: string; + image: string; + originPrice: number; + discountPrice: number; + orderCount: number; + firstLevelRate: number; + secondLevelRate: number; + isShelves: boolean; } -const tableData = ref([]); +const tableData = ref([]); - -// 删除项目 - 添加确认弹窗 +// 删除课程 const deleteCourse = (id: number) => { Modal.confirm({ title: '确认删除', @@ -322,15 +363,10 @@ const deleteCourse = (id: number) => { onOk: async () => { try { const storedToken = localStorage.getItem('token'); - const res:any = await myAxios.post( + const res: any = await myAxios.post( "/course/delete", { id }, - { - headers: { - Authorization: storedToken, - 'AfterScript': 'required-script' - } - } + { headers: { Authorization: storedToken } } ); if (res.code === 1) { @@ -343,10 +379,7 @@ const deleteCourse = (id: number) => { console.error('删除失败:', error); message.error('删除操作失败'); } - }, - onCancel() { - // 用户点击取消，不做操作 - }, + } }); }; @@ -362,12 +395,7 @@ const showDeleteConfirm = () => { content: `确定要删除选中的 ${selectedRowKeys.value.length} 门课程吗？删除后数据将无法恢复！`, okText: '确认', cancelText: '取消', - onOk: async () => { - await deleteBatchCourses(); - }, - onCancel() { - // 用户点击取消，不做操作 - }, + onOk: deleteBatchCourses }); }; @@ -378,12 +406,7 @@ const deleteBatchCourses = async () => { const res: any = await myAxios.post( "/course/delBatch", { ids: selectedRowKeys.value }, - { - headers: { - Authorization: storedToken, - 'Content-Type': 'application/json' - } - } + { headers: { Authorization: storedToken } } ); if (res.code === 1) { @@ -399,97 +422,65 @@ const deleteBatchCourses = async () => { } }; -// 重置按钮 +// 重置搜索条件 const reset = () => { searchCourseName.value = ""; + searchCourseType.value = ""; + searchIsShelves.value = ""; selectedRowKeys.value = []; + searchParams.value = { current: 1, pageSize: 10, sortField: "id", sortOrder: "ascend", - userRole: null, name: "", - type:"" + type: "", + isShelves: "" }; + getCourseList(); }; -//去新增项目 -const goAddCourse=()=>{ +// 跳转到新增课程页面 +const goAddCourse = () => { router.push('/addcourse') } -const showDetails=(id:string)=>{ +// 查看课程详情 +const showDetails = (id: string) => { router.push({ - path:'/courseDetail', - query:{ - id:String(id) - } + path: '/courseDetail', + query: { id: String(id) } }) } -const chapterDetails=(id:string)=>{ + +// 查看章节详情 +const chapterDetails = (id: string) => { router.push({ - path:'/chapterDetail', - query:{ - id:String(id) - } + path: '/chapterDetail', + query: { id: String(id) } }) } \ No newline at end of file diff --git a/src/view/course/courseOrder.vue b/src/view/course/courseOrder.vue new file mode 100644 index 0000000..0bddc8e --- /dev/null +++ b/src/view/course/courseOrder.vue @@ -0,0 +1,461 @@ + + + + + \ No newline at end of file