diff --git a/app.json b/app.json index 5c7cbe7..dbe7696 100644 --- a/app.json +++ b/app.json @@ -1,7 +1,7 @@ { "pages": [ - "pages/loginModule/pwdLogin/pwdLogin", "pages/personCenter/mine/mine", + "pages/loginModule/pwdLogin/pwdLogin", "pages/loginModule/agreement/agreement", "pages/loginModule/privacyPolicy/privacyPolicy", "pages/personCenter/subCommissionSetting/subCommissionSetting", @@ -26,7 +26,15 @@ "pages/projectModule/settlement/settlement", "pages/projectModule/subSettlement/subSettlement", "pages/course/homepage/homepage", - "pages/course/searchCourses/searchCourses" + "pages/course/searchCourses/searchCourses", + "pages/course/courseList/courseList", + "pages/course/courseDetail/courseDetail", + "pages/course/createCourseOrder/createCourseOrder", + "pages/course/waitPayOrder/waitPayOrder", + "pages/course/applyPromotion/applyPromotion", + "pages/course/recommendUser/recommendUser", + "pages/course/courseOrderList/courseOrderList", + "pages/course/courseSettlementRecord/courseSettlementRecord" ], "window": { "navigationBarTextStyle": "black", @@ -52,8 +60,8 @@ { "pagePath": "pages/course/homepage/homepage", "text": "课程", - "iconPath": "/static/jd1.png", - "selectedIconPath": "/static/jd1.png" + "iconPath": "/static/course.png", + "selectedIconPath": "/static/courseselected.png" }, { "pagePath": "pages/personCenter/mine/mine", diff --git a/pages/course/courseDetail/courseDetail.js b/pages/course/courseDetail/courseDetail.js new file mode 100644 index 0000000..3beae69 --- /dev/null +++ b/pages/course/courseDetail/courseDetail.js @@ -0,0 +1,58 @@ +// pages/course/courseDetail/courseDetail.js +Page({ + data: { + items: [null, null, null,null, null, null], + activeTab: 'intro', // 默认选中“课程简介” + activeIndex: null, // 默认没有任何标题被选中 + }, + + /** 切换选项卡 */ + selectTab(e) { + const tab = e.currentTarget.dataset.tab; + this.setData({ activeTab: tab }); + }, + + /** 选择课程标题 */ + selectCourse(e) { + const index = e.currentTarget.dataset.index; + this.setData({ + activeIndex: index // 设置选中的课程标题索引 + }); + }, + + // 跳转课程订单创建页面 + gotoCourseOrder(e) { + const courseId = e.currentTarget.dataset.id; + wx.navigateTo({ + url: `/pages/course/createCourseOrder/createCourseOrder?id=${courseId}`, + }) + }, + + // 跳转申请推广页面 + gotoApplyPromotion(e) { + const courseId = e.currentTarget.dataset.id; + wx.navigateTo({ + url: `/pages/course/applyPromotion/applyPromotion?id=${courseId}`, + }) + }, + + + /** + * 生命周期函数--监听页面加载 + */ + onLoad(options) {}, + + onReady() {}, + + onShow() {}, + + onHide() {}, + + onUnload() {}, + + onPullDownRefresh() {}, + + onReachBottom() {}, + + onShareAppMessage() {} +}); diff --git a/pages/course/courseDetail/courseDetail.json b/pages/course/courseDetail/courseDetail.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/course/courseDetail/courseDetail.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/course/courseDetail/courseDetail.wxml b/pages/course/courseDetail/courseDetail.wxml new file mode 100644 index 0000000..16a6e1d --- /dev/null +++ b/pages/course/courseDetail/courseDetail.wxml @@ -0,0 +1,89 @@ + + + + + + + 券后支付 + 168元 + 即可观看所有视频 + + + + 立即购买 + + + + + + + + 课程简介 + 课程目录 + + + + + + + + 168 + 元券后价 + + + 268元 + + + + 【早鸟42折】掌握CAD技能+++++++实战工作训练营 + + + + + + + 课程概述 + + + + + + + + + + + 全集试看 + + + {{ index + 1}} + + 推荐片：带你透视中国基层干部的生态图景推荐片：带你透视中国基层干部的生态图景 + + + + 视频课·27分59秒 + + + + + + + + + + + + + 咨询 + + + + 申请推广 + + + 立即购买 + + + + \ No newline at end of file diff --git a/pages/course/courseDetail/courseDetail.wxss b/pages/course/courseDetail/courseDetail.wxss new file mode 100644 index 0000000..746fb9b --- /dev/null +++ b/pages/course/courseDetail/courseDetail.wxss @@ -0,0 +1,336 @@ +/* pages/course/courseDetail/courseDetail.wxss */ + +/* 通用间距 */ +.mt-9 { + margin-top: 16.88rpx; +} +/* .mt-35 { + margin-top: 65.63rpx; +} */ +.mt-15 { + margin-top: 28.13rpx; +} +.mt-7 { + margin-top: 13.13rpx; +} +.mt-1 { + margin-top: 1.88rpx; +} +.ml-15 { + margin-left: 28.13rpx; +} + +/* 页面容器 */ +.page { + background-color: #f6f7f9; + width: 100%; + overflow-y: auto; + overflow-x: hidden; + height: 100%; + padding-bottom: 100rpx; /* 为底部固定栏预留空间 */ +} + +/* 背景图 */ +.section { + background-image: url('https://ide.code.fun/api/image?token=6858ee4b4ae84d0012334127&name=1f211c9a259577e8af923158ce6e4ab6.png'); + background-size: 100% 100%; + background-repeat: no-repeat; +} + +/* 顶部遮罩 */ +.section_2 { + padding: 131.25rpx 176.25rpx 101.25rpx; + background-color: #00000063; + backdrop-filter: blur(9.38rpx); +} + +/* 宽度组 */ +.group { + width: 344.34rpx; +} + +/* 白色文字 */ +.font { + font-size: 26.25rpx; + font-family: SourceHanSansCN; + line-height: 31.88rpx; + color: #ffffff; +} + +/* 橙色按钮 */ +.text-wrapper { + padding: 15rpx 0; + background-color: #ff8d1a; + border-radius: 187.5rpx; + width: 208.13rpx; +} + +/* 橙色小字体 */ +.font_3 { + font-size: 26.25rpx; + font-family: SourceHanSansCN; + line-height: 24.6rpx; + color: #ff8d1a; +} +.text_3 { + color: #ffffff; +} + +/* 选项卡容器 */ +.section_3 { + padding: 0 135rpx 7.5rpx 142.5rpx; + background-color: #ffffff; + border-bottom: solid 1.88rpx #9c9c9c; +} +.group_2 { + padding: 22.5rpx 0 11.25rpx; + display: flex; + justify-content: center; /* 增加选项卡间隔 */ +} + +/* 标题+价格 */ +.section_4 { + padding: 37.5rpx 7.5rpx 30rpx 22.5rpx; + background-color: #ffffff; +} +.group_4 { + padding: 0 3.75rpx; +} +.group_5 { + line-height: 28.8rpx; + height: 30.58rpx; +} +.text_6 { + color: #f84947; + font-size: 37.5rpx; + font-family: SourceHanSansCN; + font-weight: 700; + line-height: 28.8rpx; +} +.text_7 { + color: #f84947; + line-height: 24.43rpx; +} +.group_6 { + margin-right: 453.75rpx; + width: 75.02rpx; +} +.divider { + background-color: #8c8c8c; + width: 75.02rpx; + height: 1.88rpx; +} +.pos { + position: absolute; + left: 0; + right: 0; + top: 50%; + transform: translateY(-50%); +} +.text_9 { + color: #000000; + font-size: 33.75rpx; + font-family: SourceHanSansCN; + line-height: 41.25rpx; +} + +/* 课程概述 */ +.section_5 { + margin-top: 28.13rpx; + padding: 0 30rpx 52.5rpx; + background-color: #ffffff; +} +.group_7 { + padding: 26.25rpx 0; +} +.image { + width: 39.38rpx; + height: 39.38rpx; +} + +/* 概述内容区 */ +.section_6 { + background-color: #ffffff00; + height: 791.25rpx; + border-left: solid 1.88rpx #000000; + border-right: solid 1.88rpx #000000; + border-top: solid 1.88rpx #000000; + border-bottom: solid 1.88rpx #000000; +} + +/* 目录列表 */ +.section_7 { + padding: 31.88rpx 0; + background-color: #ffffff; +} +.list { + margin: 0 22.5rpx; +} +.group_8 { + width: 590.81rpx; + display: flex; + align-items: center; /* 序号垂直居中 */ + margin-top: 3rpx !important; /* 视频标题与上方内容的间距 */ +} +.list-item { + padding-left: 37.5rpx; + padding-bottom: 18.75rpx; + background-color: #f6f7f9; + border-radius: 10.63rpx; +} +.list-item:first-child { + margin-top: 0; +} + +/* 全局试看按钮 */ +.text-wrapper_2 { + padding: 3.75rpx 0; + background-color: #ff8d1a; + border-radius: 0rpx 9.38rpx 0rpx 9.38rpx; +} +.font_4 { + font-size: 24rpx; /* 放大字体 */ + font-family: SourceHanSansCN; + line-height: 28rpx; /* 放大行高 */ + color: #ffffff; +} +.text_11 { + margin: 0 7.5rpx; + line-height: 28rpx; /* 放大行高 */ +} + +/* 列表文本 */ +.font_5 { + font-size: 26.25rpx; + font-family: SourceHanSansCN; + line-height: 19.24rpx; + color: #8f8f8f; +} +.text_12 { + margin-top: 0; /* 垂直居中序号 */ + align-self: center !important; +} +.font_2 { + font-size: 26.25rpx; + font-family: SourceHanSansCN; + line-height: 31.88rpx; + color: #000000; +} + +/* 其他文本 */ +.text { + word-break: break-all; +} +.text_8 { + color: #8c8c8c; +} +.text_2 { + color: #ff8d1a; +} +.group_9 { + padding-left: 41.25rpx; + padding-right: 20.63rpx; +} +.font_6 { + font-size: 22.5rpx; + font-family: SourceHanSansCN; + line-height: 19.24rpx; + color: #8f8f8f; +} +.text_13 { + line-height: 20.79rpx; +} +.image_2 { + width: 30rpx; + height: 30rpx; +} + +/* 底部原有按钮组 */ +.section_8 { + padding: 15rpx 26.25rpx; + background-color: #ffffff; +} +.image_3 { + width: 52.5rpx; + height: 52.5rpx; +} +.text_16 { + color: #000000; + line-height: 20.94rpx; +} +.text-wrapper_3 { + padding: 22.5rpx 0; + flex: 1 1 268.13rpx; + background-color: #a5d63f; + border-radius: 75rpx; + height: 71.25rpx; +} +.font_7 { + font-size: 30rpx; + font-family: SourceHanSansCN; + line-height: 28.8rpx; + color: #ffffff; +} +.text_14 { + line-height: 28.29rpx; +} +.text-wrapper_4 { + padding: 22.5rpx 0; + flex: 1 1 268.13rpx; + background-color: #ff8d1a; + border-radius: 75rpx; + height: 71.25rpx; +} +.text_15 { + line-height: 28.11rpx; +} + +/* 新增：选项卡文字基础样式 */ +.text-tab { + font-size: 32rpx; + font-family: SourceHanSansCN; + line-height: 38rpx; + padding-bottom: 8rpx; /* 文字与下划线之间留白 */ + margin: 0 80rpx; /* 增大间距 */ +} + +/* 新增：选中/未选中状态 */ +.tab-active { + color: #ff8d1a; + border-bottom: 2rpx solid #ff8d1a; +} +.tab-inactive { + color: #000000; + border-bottom: none; +} + +/* 覆盖：让 .group_2 居中其子元素，增强间距控制 */ +.group_2 { + justify-content: center !important; +} + +/* 新增：底部固定按钮栏 */ +.section_8_fixed { + position: fixed; + bottom: 0; + left: 0; + width: 100%; + z-index: 999; + background-color: #ffffff; +} +/* 禁止容器内元素换行 */ +.no-wrap { + flex-wrap: nowrap !important; +} +/* 强制所有 text 不换行 */ +.no-wrap text { + white-space: nowrap; +} +.mx-15 { + margin-left: 15rpx; + margin-right: 15rpx; +} +/* 课程目录的点击状态 */ +.active-title { + color: #ff8d1a; /* 点击后的颜色：橙色 */ +} diff --git a/pages/course/courseDetail/image/cal.png b/pages/course/courseDetail/image/cal.png new file mode 100644 index 0000000..8d3c572 Binary files /dev/null and b/pages/course/courseDetail/image/cal.png differ diff --git a/pages/course/courseDetail/image/lock.png b/pages/course/courseDetail/image/lock.png new file mode 100644 index 0000000..9b9a292 Binary files /dev/null and b/pages/course/courseDetail/image/lock.png differ diff --git a/pages/course/courseDetail/image/messge.png b/pages/course/courseDetail/image/messge.png new file mode 100644 index 0000000..8928a81 Binary files /dev/null and b/pages/course/courseDetail/image/messge.png differ diff --git a/pages/course/courseList/courseList.js b/pages/course/courseList/courseList.js new file mode 100644 index 0000000..053ef3a --- /dev/null +++ b/pages/course/courseList/courseList.js @@ -0,0 +1,80 @@ +// pages/course/courseList/courseList.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + items:[null,null,null,null,null,null,null,null,null], + courseType: '', // 课程类别 + }, + + // 跳转课程详情页面 + gotoCourseDetail(e) { + + const courseId = e.currentTarget.dataset.id; + + wx.navigateTo({ + url: `/pages/course/courseDetail/courseDetail?id=${courseId}` , + }) + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad(options) { + // console.log('option--->',options); + this.setData({ + courseType: options.type + }) + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady() { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow() { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide() { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload() { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh() { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom() { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage() { + + } +}) \ No newline at end of file diff --git a/pages/course/courseList/courseList.json b/pages/course/courseList/courseList.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/course/courseList/courseList.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/course/courseList/courseList.wxml b/pages/course/courseList/courseList.wxml new file mode 100644 index 0000000..d617040 --- /dev/null +++ b/pages/course/courseList/courseList.wxml @@ -0,0 +1,35 @@ + + + {{ courseType }} + + + + + + + + 区块链和加密数字货币（随报随学认证班） + + 券后99元起 + 18523人学习 + + + + + + \ No newline at end of file diff --git a/pages/course/courseList/courseList.wxss b/pages/course/courseList/courseList.wxss new file mode 100644 index 0000000..8269933 --- /dev/null +++ b/pages/course/courseList/courseList.wxss @@ -0,0 +1,63 @@ +/* pages/course/courseList/courseList.wxss */ +.mt-17 { + margin-top: 31.88rpx; +} +.page { + /* padding: 38.53rpx 0 ; */ + background-color: #ffffff; + height: 100%; + width: 100%; + overflow-y: auto; + overflow-x: hidden; +} +.text { + color: #000000; + font-size: 30rpx; + font-family: SourceHanSansCN; + line-height: 27.64rpx; +} +.image { + width: 255rpx; + height: 1.88rpx; +} +.image_2 { + margin-left: 40.78rpx; + margin-top: -14.7rpx; +} +.image_3 { + margin-right: 37.97rpx; +} +.list { + padding-top: 20.21rpx; +} +.list-item { + height: 178.13rpx; +} +.group { + margin: -18.24rpx 29.46rpx 0 35.63rpx; + padding: 57.19rpx 0 26.27rpx; + border-bottom: solid 1.88rpx #d6d6d6; +} +.image_4 { + border-radius: 9.38rpx; + width: 208.13rpx; + height: 133.13rpx; +} +.font { + font-size: 26.25rpx; + font-family: SourceHanSansCN; + line-height: 31.88rpx; + color: #000000; +} +.font_2 { + font-size: 26.25rpx; + font-family: AlibabaPuHuiTi; + line-height: 24.15rpx; + color: #ff5733; +} +.font_3 { + font-size: 22.5rpx; + font-family: AlibabaPuHuiTi; + line-height: 20.34rpx; + color: #a6a6a6; +} \ No newline at end of file diff --git a/pages/course/courseList/image/line.png b/pages/course/courseList/image/line.png new file mode 100644 index 0000000..bd760c4 Binary files /dev/null and b/pages/course/courseList/image/line.png differ diff --git a/pages/course/createCourseOrder/createCourseOrder.js b/pages/course/createCourseOrder/createCourseOrder.js new file mode 100644 index 0000000..564a65b --- /dev/null +++ b/pages/course/createCourseOrder/createCourseOrder.js @@ -0,0 +1,77 @@ +// pages/course/createCourseOrder/createCourseOrder.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + courseId: 0, // 课程id + }, + + // 创建订单方法 + createOrder(e) { + const courseId = e.currentTarget.dataset.id; + wx.navigateTo({ + url: `/pages/course/waitPayOrder/waitPayOrder?id=${courseId}`, + }) + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad(options) { + console.log('课程id--->',options.id); + this.setData({ + courseId: options.id, + }) + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady() { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow() { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide() { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload() { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh() { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom() { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage() { + + } +}) \ No newline at end of file diff --git a/pages/course/createCourseOrder/createCourseOrder.json b/pages/course/createCourseOrder/createCourseOrder.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/course/createCourseOrder/createCourseOrder.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/course/createCourseOrder/createCourseOrder.wxml b/pages/course/createCourseOrder/createCourseOrder.wxml new file mode 100644 index 0000000..ff1fdd3 --- /dev/null +++ b/pages/course/createCourseOrder/createCourseOrder.wxml @@ -0,0 +1,46 @@ + + + + + + + 区块链和加密数字货币(随报随学认证班)(随报随学认证班) + + ￥999 + + ￥999 + + + + + + + 商品价格 + ￥999 + + + + + 微信支付 + + + + + + + + + + 应付￥999 + + 立即支付 + + + + diff --git a/pages/course/createCourseOrder/createCourseOrder.wxss b/pages/course/createCourseOrder/createCourseOrder.wxss new file mode 100644 index 0000000..a890855 --- /dev/null +++ b/pages/course/createCourseOrder/createCourseOrder.wxss @@ -0,0 +1,118 @@ +.ml-11 { + margin-left: 20.63rpx; +} +.mt-15 { + margin-top: 28.13rpx; +} +.ml-1 { + margin-left: 1.88rpx; +} +.page { + background-color: #f7f7f7; + width: 100%; + height: 100vh; + display: flex; + flex-direction: column; +} +.content { + flex: 1; + overflow-y: auto; +} +.section { + padding: 20.63rpx 22.5rpx 27.58rpx; + background-color: #ffffff; + border-radius: 3.94rpx; +} +.image { + border-radius: 9.38rpx; + width: 208.13rpx; + height: 133.13rpx; +} +.text { + color: #000000; + font-size: 30rpx; + font-family: SourceHanSansCN; + line-height: 35.63rpx; + width: 429.38rpx; +} +.group { + padding: 0 4.29rpx; +} +.text_2 { + color: #f84947; + font-size: 30rpx; + font-family: SourceHanSansCN; + line-height: 22.76rpx; +} +.text_3 { + color: #8c8c8c; + font-size: 26.25rpx; + font-family: SourceHanSansCN; + line-height: 19.93rpx; +} +.divider { + background-color: #8c8c8c; + width: 69.56rpx; + height: 1.88rpx; +} +.pos { + position: absolute; + left: 0; + top: 50%; + transform: translateY(-50%); +} +.section_2 { + padding: 48.69rpx 29.21rpx 43.35rpx 44.96rpx; + background-color: #ffffff; +} +.font { + font-size: 30rpx; + font-family: SourceHanSansCN; + line-height: 27.96rpx; + color: #323232; +} +.text_4 { + line-height: 22.91rpx; +} +.section_3 { + padding: 39.38rpx 46.88rpx 897.38rpx 48.75rpx; + background-color: #ffffff; +} +.image_2 { + width: 52.5rpx; + height: 52.5rpx; +} +.image_3 { + width: 41.25rpx; + height: 41.25rpx; +} +.section_4 { + padding: 16.88rpx 24.38rpx 16.88rpx 31.09rpx; + background-color: #ffffff; +} +.text_5 { + color: #000000; + line-height: 28.05rpx; +} +.text-wrapper { + padding: 14.07rpx 0 19.07rpx; + background-color: #ff8d1a; + border-radius: 75rpx; + width: 268.13rpx; + height: 71.25rpx; + display: flex; + justify-content: center; /* 水平居中 */ + align-items: center; /* 垂直居中 */ +} + +.text_6 { + color: #ffffff; + line-height: 28.11rpx; +} +.footer { + margin-top: auto; + width: 100%; + position: fixed; + bottom: 0; + left: 0; +} diff --git a/pages/course/createCourseOrder/image/wxpay.png b/pages/course/createCourseOrder/image/wxpay.png new file mode 100644 index 0000000..be27f5f Binary files /dev/null and b/pages/course/createCourseOrder/image/wxpay.png differ diff --git a/pages/course/homepage/homepage.js b/pages/course/homepage/homepage.js index 6ee67d7..e6f8a5f 100644 --- a/pages/course/homepage/homepage.js +++ b/pages/course/homepage/homepage.js @@ -1,24 +1,67 @@ +import { baseUrl } from "../../../request"; + // pages/course/homepage/homepage.js Page({ - /** - * 页面的初始数据 - */ data: { - items: [null,null,null,null,null,null,null] + // 初始时置空，待接口返回后再渲染 + courseList: [] }, + // 跳转课程列表页 + gotoCourseList(e) { + const courseType = e.currentTarget.dataset.type; + wx.navigateTo({ + url: `/pages/course/courseList/courseList?type=${courseType}`, + }); + }, + + // 跳转课程详情 + gotoCourseDetail(e) { + const courseId = e.currentTarget.dataset.id; + wx.navigateTo({ + url: `/pages/course/courseDetail/courseDetail?id=${courseId}`, + }); + }, + + // 跳转课程搜索页面 gotoSearch() { wx.navigateTo({ url: '/pages/course/searchCourses/searchCourses', - }) + }); }, /** * 生命周期函数--监听页面加载 */ onLoad(options) { - + // 请求后端接口 + wx.request({ + url: baseUrl + '/course/query/hot', // ← 替换为真实接口 + method: 'POST', + header: { + Authorization: wx.getStorageSync('token') + }, + success: (res) => { + if (res.data.code === 1) { + // 将后端的 data 数组绑定到 items + this.setData({ + courseList: res.data.data + }); + } else { + wx.showToast({ + title: res.data.message || '获取课程数据失败', + icon: 'none' + }); + } + }, + fail: () => { + wx.showToast({ + title: '网络异常，请稍后重试', + icon: 'none' + }); + } + }); }, /** diff --git a/pages/course/homepage/homepage.wxml b/pages/course/homepage/homepage.wxml index 8da08ac..99ff8bb 100644 --- a/pages/course/homepage/homepage.wxml +++ b/pages/course/homepage/homepage.wxml @@ -10,21 +10,21 @@ - + 考公考研 - + 自媒体 - + 热门课程 - - - - - 区块链和加密数字货币（随报随学认证班） - - 券后99元起 - 18523人学习 + + + + + + + + + {{item.name}} + + + 券后{{item.discountPrice}}元起 + + {{item.orderCount}}人学习 + diff --git a/pages/course/waitPayOrder/waitPayOrder.js b/pages/course/waitPayOrder/waitPayOrder.js new file mode 100644 index 0000000..823d878 --- /dev/null +++ b/pages/course/waitPayOrder/waitPayOrder.js @@ -0,0 +1,38 @@ +Page({ + + data: { + // 初始倒计时字符串 + countdown: '30分00秒' + }, + + onLoad(options) { + // 启动倒计时（总秒数 = 29*60 + 17） + this.initCountdown(30 * 60 ); + }, + + /** + * 初始化倒计时 + * @param {number} totalSeconds 初始总秒数 + */ + initCountdown(totalSeconds) { + this.countdownTimer = setInterval(() => { + if (totalSeconds <= 0) { + clearInterval(this.countdownTimer); + this.setData({ countdown: '00分00秒' }); + return; + } + totalSeconds--; + const m = Math.floor(totalSeconds / 60); + const s = totalSeconds % 60; + const mm = m < 10 ? '0' + m : '' + m; + const ss = s < 10 ? '0' + s : '' + s; + this.setData({ countdown: `${mm}分${ss}秒` }); + }, 1000); + }, + + onUnload() { + // 页面卸载时清除定时器 + clearInterval(this.countdownTimer); + } + +}); diff --git a/pages/course/waitPayOrder/waitPayOrder.json b/pages/course/waitPayOrder/waitPayOrder.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/course/waitPayOrder/waitPayOrder.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/course/waitPayOrder/waitPayOrder.wxml b/pages/course/waitPayOrder/waitPayOrder.wxml new file mode 100644 index 0000000..a771208 --- /dev/null +++ b/pages/course/waitPayOrder/waitPayOrder.wxml @@ -0,0 +1,79 @@ + + + + + + 订单状态 + + 请在{{countdown}}内完成支付 + 待支付 + + + + + + + 区块链和加密数字货币(随报随学认证班)(随报随学认证班) + + + + ￥999.00 + + + + + + 订单编号： + 202506191307440406460485418 + + + 下单时间： + 2025-06-19 16:08:15 + + + + + + 支付方式： + 微信支付 + + + 交易号： + 4002506191307440406460485418 + + 交付时间： + + 2025-06-19 08:48:35 + + + + + + + 课程价格 + ￥1999.9 + + + 价格折扣 + -￥10 + + + 订单金额 + ￥999 + + + + + + + + 取消 + + + 立即支付 + + + diff --git a/pages/course/waitPayOrder/waitPayOrder.wxss b/pages/course/waitPayOrder/waitPayOrder.wxss new file mode 100644 index 0000000..ef70b2c --- /dev/null +++ b/pages/course/waitPayOrder/waitPayOrder.wxss @@ -0,0 +1,208 @@ +.ml-37 { + margin-left: 69.38rpx; +} +.ml-7 { + margin-left: 13.13rpx; +} +.mt-15 { + margin-top: 28.13rpx; +} +.ml-3 { + margin-left: 5.63rpx; +} +.ml-23 { + margin-left: 40.13rpx; +} +.mt-17 { + margin-top: 31.88rpx; +} +.mt-11 { + margin-top: 20.63rpx; +} +.mt-389 { + margin-top: 729.38rpx; +} + +/* 整体布局 */ +.page { + padding-top: 26.25rpx; + background-color: #f8f8f8; + width: 100%; + height: 100%; + overflow-y: auto; + overflow-x: hidden; +} +.group { + padding: 0 18.75rpx; +} + +/* 调整首屏 section 右边内边距，不让价格太贴边 */ +.section { + padding: 0 22.5rpx 33.75rpx 22.5rpx; + filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040); + background-color: #ffffff; + border-radius: 7.22rpx; +} + +/* 订单详情区 */ +.group_2 { + padding: 33.75rpx 0 26.25rpx; + border-bottom: solid 1.88rpx #e3e3e3; +} +.group_3 { + margin-right: 18.75rpx; +} +.font_2 { + font-size: 26.25rpx; + font-family: SourceHanSansCN; + line-height: 24.23rpx; + color: #f84947; +} +.text { + line-height: 24.56rpx; +} +.text_2 { + line-height: 24.17rpx; +} +.group_4 { + margin-right: 33.75rpx; +} +.image { + border-radius: 9.38rpx; + width: 208.13rpx; + height: 133.13rpx; +} +.font_3 { + font-size: 30rpx; + font-family: SourceHanSansCN; + line-height: 27.64rpx; +} +.text_3 { + color: #000000; + line-height: 35.63rpx; +} +.text_4 { + color: #3d3d3d; + line-height: 22.76rpx; +} + +/* 订单详情二级区 */ +.section_2 { + padding: 33.75rpx 22.5rpx 0; + background-color: #ffffff; + border-radius: 7.39rpx; + box-shadow: 0rpx 3.75rpx 7.5rpx #00000040; +} +.group_5 { + line-height: 24.28rpx; +} +.font_4 { + font-size: 26.25rpx; + font-family: SourceHanSansCN; + line-height: 19.93rpx; + color: #323232; +} +.group_6 { + margin-top: 30rpx; + width: 369.94rpx; +} +.font_5 { + font-size: 26.25rpx; + line-height: 31.88rpx; + color: #323232; +} +.group_7 { + margin-top: 11.25rpx; + padding-bottom: 26.25rpx; +} +.section_3 { + padding-top: 9.38rpx; + background-color: #ffffff; +} +.divider { + background-color: #cccccc; + height: 1.88rpx; +} +.group_8 { + padding: 0 3.75rpx; +} +.font { + font-size: 26.25rpx; + font-family: SourceHanSansCN; + line-height: 24.23rpx; + color: #696969; +} +.text_7 { + line-height: 24.36rpx; +} +.text_6 { + line-height: 31.88rpx; +} +.text_5 { + line-height: 24.28rpx; +} +.text_8 { + color: #323232; +} +.text_9 { + line-height: 24.52rpx; +} +.text_10 { + line-height: 24.43rpx; +} +.text_11 { + width: 270rpx; +} +.pos { + position: absolute; + left: 141.05rpx; + top: 142.92rpx; +} + +/* 调整价格明细区右边内边距 */ +.section_4 { + padding: 22.5rpx 22.5rpx 0 22.5rpx; + background-color: #ffffff; + border-radius: 4.01rpx; + box-shadow: 0rpx 3.75rpx 7.5rpx #00000040; +} +.text_12 { + line-height: 24.41rpx; +} +.text_13 { + line-height: 24.41rpx; +} +.text_14 { + margin-right: 15rpx; +} +.group_9 { + padding: 22.5rpx 0 18.75rpx; + border-top: solid 1.88rpx #e3e3e3; +} +.text_15 { + line-height: 24.49rpx; +} +.text_16 { + color: #f84947; +} + +/* 底部按钮 */ +.text-wrapper { + padding: 37.5rpx 0; + flex: 1 1 375rpx; + background-color: #ffffff; + height: 105rpx; +} +.text-wrapper_2 { + padding: 37.5rpx 0; + flex: 1 1 375rpx; + background-color: #ff8d1a; + height: 105rpx; +} +.text_17 { + color: #323232; +} +.text_18 { + color: #ffffff; + line-height: 27.81rpx; +} diff --git a/pages/personCenter/mine/mine.js b/pages/personCenter/mine/mine.js index e4ff0a0..735bc3a 100644 --- a/pages/personCenter/mine/mine.js +++ b/pages/personCenter/mine/mine.js @@ -21,6 +21,21 @@ Page({ showPopup: false, // 控制弹窗显示与否 qrcode: "https://img.picui.cn/free/2025/05/29/6837c53582068.gif", // 设置二维码图片的路径 }, + + // 跳转课程订单页面 + courseOrder() { + wx.navigateTo({ + url: '/pages/course/courseOrderList/courseOrderList', + }) + }, + + // 跳转结算记录页面 + gotoSettlementRecord() { + wx.navigateTo({ + url: '/pages/course/courseSettlementRecord/courseSettlementRecord', + }) + }, + // 点击二维码时，显示弹窗 showPromoPopup() { this.setData({ diff --git a/pages/personCenter/mine/mine.wxml b/pages/personCenter/mine/mine.wxml index a2a2a59..cf18308 100644 --- a/pages/personCenter/mine/mine.wxml +++ b/pages/personCenter/mine/mine.wxml @@ -90,6 +90,7 @@ 提现记录 + 联系上级 + + + + + 课程订单 + + + + 结算记录 + + + + 我的课程 + + + + 联系上级 + +