commission--yt-commit

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'
+        });
+      }
+    });
   },
 
   /**

pages/course/homepage/homepage.wxml

@@ -10,21 +10,21 @@
     <swiper class="swiper" autoplay="true" circular="true"></swiper>
   </view>
   <view class="flex-row equal-division">
-    <view class="flex-col items-center group_2 group_1">
+    <view class="flex-col items-center group_2 group_1" bind:tap="gotoCourseList" data-type="{{ '考公考研' }}">
       <image
         class="image_3"
         src="./image/kgky.png"
       />
       <text class="font text_1 mt-12">考公考研</text>
     </view>
-    <view class="flex-col items-center group_2 group_3">
+    <view class="flex-col items-center group_2 group_3" bind:tap="gotoCourseList" data-type="{{ '自媒体' }}">
       <image
         class="image_3"
         src="./image/zmt.png"
       />
       <text class="font text_3 mt-12">自媒体</text>
     </view>
-    <view class="flex-col items-center group_2 group_4">
+    <view class="flex-col items-center group_2 group_4" bind:tap="gotoCourseList" data-type="{{ '财经' }}">
       <image
         class="image_3"
         src="./image/cj.png"
@@ -34,17 +34,27 @@
   </view>
   <text class="self-start text_2">热门课程</text>
   <view class="flex-col self-stretch list">
-    <view class="flex-row relative group_5" wx:for="{{items}}" wx:for-item="item" wx:for-index="index" wx:key="index">
-      <view class="list-divider pos_3"></view>
-      <image
-        class="image_4 pos"
-        src="https://ide.code.fun/api/image?token=6854f3c94ae84d0012332367&name=9c2a22f14e2bd768cbd40d939693e4a8.png"
-      />
-      <view class="flex-col group_6 pos_2">
-        <text class="font_2">区块链和加密数字货币（随报随学认证班）</text>
-        <view class="flex-row justify-between items-baseline mt-17">
-          <text class="font_3">券后99元起</text>
-          <text class="font_4">18523人学习</text>
+    <!-- items 数组循环 -->
+    <view
+      class="flex-row relative group_5"
+      wx:for="{{courseList}}"
+      wx:for-item="item"
+      wx:for-index="index"
+      wx:key="item.id"
+    >
+      <view bind:tap="gotoCourseDetail" data-id="{{item.id}}">
+        <view class="list-divider pos_3"></view>
+        <!-- 绑定课程封面图 -->
+        <image class="image_4 pos" src="{{ globalImgUrl + item.image}}" />
+        <view class="flex-col group_6 pos_2">
+          <!-- 绑定课程名称 -->
+          <text class="font_2">{{item.name}}</text>
+          <view class="flex-row justify-between items-baseline mt-17">
+            <!-- 绑定卷后价格 -->
+            <text class="font_3">券后{{item.discountPrice}}元起</text>
+            <!-- 绑定下单/学习人数 -->
+            <text class="font_4">{{item.orderCount}}人学习</text>
+          </view>
         </view>
       </view>
     </view>