feat(member): 添加课程详情功能并优化课表页面

- 在 member.js 中新增 courseInfo 方法获取课程详情
- 修改 timetable/index.vue 中的课程列表展示和点击事件- 更新 timetable/info.vue 中的课程详情展示逻辑
- 优化课程详情页面样式

api/member.js

@@ -58,4 +58,15 @@ export default {
 			return res;
 		})
 	},
+
+	//课程详情
+	courseInfo(data) {
+		let url = '/member/course_info'
+		return http.get(url, data).then(res => {
+			return res;
+		})
+	},
+
+
+
 }

pages/student/timetable/index.vue

@@ -37,7 +37,7 @@
           style="height: 100vh;"
       >
         <view class="ul">
-          <view v-for="(v,k) in tableList" :key="k" class="li" @click="openViewCourseInfo({id:v.id})">
+          <view v-for="(v,k) in tableList" :key="k" class="li" @click="openViewCourseInfo(v)">
             <view class="top_box">
               <view class="center_box">
                 <view>班级：{{v.classes_name}}</view>
@@ -92,29 +92,29 @@ export default {
   },
   data() {
     return {
-      loading:false,//加载状态
+      loading: false,//加载状态
       lowerThreshold: 100,//距离底部多远触发
       isReachedBottom: false,//防止重复加载|true=不可加载|false=可加载
 
       //筛选条件
-      filteredData:{
-        page:1,//当前页码
-        limit:10,//每页返回数据条数
-        total:10,//数据总条数
-        schedule_date:'',//日期
-        venue_id:'',//场地id
+      filteredData: {
+        page: 1,//当前页码
+        limit: 10,//每页返回数据条数
+        total: 10,//数据总条数
+        schedule_date: '',//日期
+        venue_id: '',//场地id
       },
-      tableList:[],//表格数据
+      tableList: [],//表格数据
 
-      venuesInfo:{},//场地信息
+      venuesInfo: {},//场地信息
 
       //今日日期
       today: '',
-      dateList:[]//日期列表
+      dateList: []//日期列表
     }
   },
   onLoad(options) {
-    if(options.venue_id){
+    if (options.venue_id) {
       this.filteredData.venue_id = options.venue_id
     }
   },
@@ -132,17 +132,16 @@ export default {
 
   methods: {
     //初始化
-    async init(){
+    async init() {
       await this.getThisDate()
       await this.getHeadDate()
       await this.getList()
-      // await this.getDateList(); // 获取日期列表
     },
 
     //获取课程头日期
     async getHeadDate() {
       let res = await memberApi.getDate()
-      if (res.code != 1){
+      if (res.code != 1) {
         //提示
         uni.showToast({
           title: res.msg,
@@ -152,7 +151,7 @@ export default {
       }
 
       this.dateList = []
-      res.data.forEach((v,k)=>{
+      res.data.forEach((v, k) => {
         let today = v.date.split("-")[2]; // "09"
         this.dateList.push({
           date: v.date,
@@ -163,7 +162,7 @@ export default {
       })
 
 
-      console.log('xxx',res)
+      console.log('xxx', res)
 
     },
 
@@ -199,13 +198,13 @@ export default {
       this.filteredData.total = 10//数据总条数
     },
     //获取列表
-    async getList(){
+    async getList() {
       this.loading = true
 
       let data = {...this.filteredData}
 
       //判断是否还有数据
-      if(this.filteredData.page * this.filteredData.limit > this.filteredData.total || this.filteredData.limit > this.filteredData.total ){
+      if (this.filteredData.page * this.filteredData.limit > this.filteredData.total || this.filteredData.limit > this.filteredData.total) {
         this.loading = false
         uni.showToast({
           title: '暂无更多',
@@ -217,7 +216,7 @@ export default {
       let res = await memberApi.courseList(data)
       this.loading = false
       this.isReachedBottom = false;
-      if (res.code != 1){
+      if (res.code != 1) {
         uni.showToast({
           title: res.msg,
           icon: 'none'
@@ -234,27 +233,25 @@ export default {
     },
 
     //选择日期
-    async selectDate(date){
+    async selectDate(date) {
       this.loadData()
       this.filteredData.schedule_date = date
       this.getList()
     },
 
 
-
     //打开课表详情页
-    openViewTimetableInfo(item){
-      // courses_id=课程id
+    openViewCourseInfo(item) {
       uni.navigateTo({
-        url: `/pages/student/timetable/info?id=${item.courses_id}`
+        url: `/pages/student/timetable/info?id=${item.id}`
       })
     },
-	//体育馆列表
-	more(){
-		uni.navigateTo({
-		  url: '/pages/student/timetable/list'
-		})
-	}
+    //体育馆列表
+    more() {
+      uni.navigateTo({
+        url: '/pages/student/timetable/list'
+      })
+    }
   }
 }
 </script>

pages/student/timetable/info.vue

@@ -3,49 +3,46 @@
   <view class="main_box">
     <view class="main_section">
       <view class="section_1">
-        <view class="title_box">青少儿篮球课</view>
+        <view class="title_box">{{infoData.courses_name}}</view>
         <view class="ul">
           <view class="li">
             <view class="title">课程名称</view>
-            <view class="content">青少年篮球课</view>
+            <view class="content">{{infoData.courses_name}}</view>
           </view>
 
           <view class="li">
             <view class="title">班级</view>
-            <view class="content">班级名称</view>
+            <view class="content">{{infoData.classes_name}}</view>
           </view>
 
           <view class="li">
             <view class="title">上课时间</view>
-            <view class="content">2020.03.25 15:30-17:00</view>
+            <view class="content">{{infoData.date_time}} {{infoData.time_slot.replace(',', '-')}}</view>
           </view>
 
           <view class="li">
             <view class="title">上课地址</view>
-            <view class="content">xxxx体育馆302室</view>
+            <view class="content">{{infoData.address}}</view>
           </view>
 
-          <view class="li">
-            <view class="title">课程名称</view>
-            <view class="content">青少年篮球课</view>
-          </view>
+
 
           <view class="li">
             <view class="title">教练</view>
-            <view class="content">包子皮</view>
+            <view class="content">{{infoData.staff_name}}</view>
           </view>
 
           <view class="li">
             <view class="title">教练号码</view>
-            <view class="content">18888888888</view>
+            <view class="content">{{infoData.staff_phone}}</view>
           </view>
 
           <view class="li">
             <view class="title">扣除课时</view>
-            <view class="content">2个课时</view>
+            <view class="content">{{infoData.hour}}个课时</view>
           </view>
 
-          <view class="state_box">
+          <view class="state_box" v-if="infoData.status == 2">
             <view>已上</view>
           </view>
           </view>
@@ -56,6 +53,7 @@
 
 <script>
 // import user from '@/api/user.js';
+import memberApi from '@/api/member.js';
 import AQTabber from "@/components/AQ/AQTabber.vue"
 
 
@@ -65,7 +63,7 @@ export default {
   },
   data() {
     return {
-      formData:{},
+      infoData:{},//详情数据
       //筛选条件
       filteredData: {
         id: '',//课程id
@@ -81,7 +79,22 @@ export default {
   methods: {
     //初始化
     async init(){
+      await this.getInfo()
+    },
 
+    //获取课程详情
+    async getInfo(){
+      let res = await memberApi.courseInfo({
+        id: this.filteredData.id,
+      })
+      if(res.code != 1){
+        uni.showToast({
+          title: res.msg,
+          icon: 'none'
+        })
+        return
+      }
+      this.infoData = res.data
     },
 
 
@@ -126,7 +139,8 @@ export default {
   .section_1{
     border-radius: 22rpx;
     padding: 20rpx 40rpx;
-    background: #333333 100%;
+    background: #fff;
+    color: #333333;
     width: 100%;
     .title_box{
       padding: 10rpx;