From 3c44f8f7c07b475ded9af6539a2abc076be68105 Mon Sep 17 00:00:00 2001
From: liutong <836164388@qq.com>
Date: Tue, 25 Mar 2025 19:51:04 +0800
Subject: [PATCH] =?UTF-8?q?feat(student):=20=E5=AD=A6=E5=91=98=E7=AB=AF?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E4=BD=9C=E4=B8=9A=E6=8F=90=E4=BA=A4=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新增作业列表和待完成作业接口
- 实现作业提交逻辑，支持图片和视频上传
- 优化作业展示界面，显示教练信息和提交时间
- 添加错误处理和用户提示
---
 api/member.js                 |  16 +++
 pages/student/index/index.vue | 254 +++++++++++++++++++++++++++++++---
 2 files changed, 249 insertions(+), 21 deletions(-)

diff --git a/api/member.js b/api/member.js
index 66a6815..72cff36 100644
--- a/api/member.js
+++ b/api/member.js
@@ -75,6 +75,22 @@ export default {
 		})
 	},
 
+	//作业列表
+	assignmentsList(data) {
+		let url = '/member/assignments_list'
+		return http.get(url, data).then(res => {
+			return res;
+		})
+	},
+
+	//提交作业
+	assignmentsSubmit(data) {
+		let url = '/member/assignments_submit'
+		return http.post(url, data).then(res => {
+			return res;
+		})
+	},
+
 
 
 }
\ No newline at end of file
diff --git a/pages/student/index/index.vue b/pages/student/index/index.vue
index 5844b9f..27b8997 100644
--- a/pages/student/index/index.vue
+++ b/pages/student/index/index.vue
@@ -47,6 +47,7 @@
 				</view>
 				<view class="more" @click="physical_examination">更多</view>
 			</view>
+
 			<view class="upcomin-classes">
 				<view class="upcomin-classes-div">
 					<view class="upcomin-classes-div-con">
@@ -63,12 +64,14 @@
 					</view>
 				</view>
 			</view>
+
 			<view class="after-class">
 				<view class="after-class-title">
 					<view class="after-class-title-left">课后作业</view>
 					<view class="after-class-title-right" @click="jobList">全部</view>
 				</view>
-				<view class="after-class-con">
+
+				<view class="after-class-con" v-for="(v,k) in jobAssignmentsInfo" :key="k">
 					<view class="after-class-con-txt">
 						<view style="width: 25%;margin-top: 5%;">
 							<view style="font-size: 55rpx;color: #fff;"><span style="color: #29d3b4;">12</span>/23
@@ -78,31 +81,38 @@
 						<view style="width: 70%;">
 							<view style="color: #fff;display: flex;justify-content: space-between;align-items: center;">
 								<view style="display: flex;align-items: center;">
-									<image src="@/static/images/index/dian.png" style="width: 50rpx;height: 50rpx;">
+									<image :src="$util.img(v.coach_pic)" style="width: 50rpx;height: 50rpx;">
 									</image>
-									<span style="padding-left: 10rpx;font-size: 35rpx;">包子皮</span>
+									<span style="padding-left: 10rpx;font-size: 35rpx;">{{v.coach_name}}</span>
 								</view>
 								<view>
 									<fui-button background="#404045" color="#F59A23" borderColor="#F59A23"
-										btnSize="mini">上传</fui-button>
+										btnSize="mini" @click="submitJob(v)">上传</fui-button>
 								</view>
 							</view>
-							<view style="color: #fff;padding: 10rpx;">时间：2020.05:25 15:30 - 17:30</view>
-							<view class="multi-line-ellipsis">
-								作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述</view>
+							<view style="color: #fff;padding: 10rpx;">时间：{{v.submit_time}}</view>
+							<view class="multi-line-ellipsis" v-html="v.content_text">
+
+              </view>
 						</view>
 					</view>
 				</view>
-				<view class="multi-line-ellipsis text-style">
-					作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述</view>
-				<view style="width: 92%;margin: auto;border-radius: 15rpx;">
-					<video style="width: 100%;border-radius: 15rpx;"></video>
-				</view>
-				<view class="multi-line-ellipsis text-style">
-					作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述</view>
-				<view style="width: 92%;margin: auto;border-radius: 15rpx;">
-					<video style="width: 100%;border-radius: 15rpx;"></video>
-				</view>
+
+				<view class="item" v-for="(v,k) in assignmentsList" :key="k">
+          <view class="multi-line-ellipsis text-style" v-html="v.content_text"></view>
+          <view style="width: 92%;margin: auto;border-radius: 15rpx;">
+            <video v-if="v.student_file_type == 2" style="width: 100%;border-radius: 15rpx;"  :src="$util.img(v.student_file)"></video>
+            <image v-else style="width: 100%;border-radius: 15rpx;" :src="$util.img(v.student_file)" mode="aspectFit"></image>
+          </view>
+        </view>
+
+<!--				<view class="multi-line-ellipsis text-style">-->
+<!--					作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述</view>-->
+<!--				<view style="width: 92%;margin: auto;border-radius: 15rpx;">-->
+<!--					<video style="width: 100%;border-radius: 15rpx;"></video>-->
+<!--				</view>-->
+
+
 			</view>
 			<view style="height: 180rpx;width: 100%;"></view>
 		</view>
@@ -111,7 +121,8 @@
 </template>
 
 <script>
-	import member from '@/api/member.js';
+  import {Api_url} from "@/common/config";
+	import memberApi from '@/api/member.js';
 	import AQTabber from "@/components/AQ/AQTabber.vue"
 	export default {
 		components: {
@@ -119,16 +130,70 @@
 		},
 		data() {
 			return {
+        //上传接口地址
+        uploadApiUrl: ``,
+        uploadImageApiUrl: `${Api_url}/file/image`,
+        uploadVideoApiUrl: `${Api_url}/file/video`,
+
 				member_info: [],
+        assignmentsList: [],//作业列表
+        jobAssignmentsInfo: [],//待完成的作业
 			}
 		},
 		onLoad() {
 			this.member_init()
 		},
+    onShow(){
+		  this.init()
+    },
 		methods: {
+		  //初始化
+      async init(){
+        this.getList()
+        this.getJobAssignmentsInfo()
+      },
+
+      //获取作业列表
+      async getList(){
+        let data = {
+          page: 1,
+          limit: 10,
+          status: '2',//1=未提交,2=已提交,3=已批改
+        }
+        let res = await memberApi.assignmentsList(data)
+        if(res.code != 1){
+          uni.showToast({
+            title: res.msg,
+            icon: 'none'
+          })
+          return
+        }
+        this.assignmentsList = res.data.data
+      },
+
+      //获取待提交的作业列表
+      async getJobAssignmentsInfo(){
+        let data = {
+          page: 1,
+          limit: 1,
+          status: '1',//1=未提交,2=已提交,3=已批改
+        }
+        let res = await memberApi.assignmentsList(data)
+        if(res.code != 1){
+          uni.showToast({
+            title: res.msg,
+            icon: 'none'
+          })
+          return
+        }
+        this.jobAssignmentsInfo = res.data.data
+
+        console.log('待提交的作业',this.jobAssignmentsInfo)
+      },
+
 			//获取学员信息
 			member_init() {
-				member.member().then(res => {
+				memberApi.member().then(res => {
 					if(res.code == 1){
 						this.member_info = res.data
 					}else{
@@ -150,8 +215,155 @@
 				uni.navigateTo({
 					url: '/pages/student/index/job_list'
 				})
-			}
-		}
+			},
+
+      // 上传作业
+      async submitJob(item) {
+        let type = item.content_type // 作业类型1图片2视频
+
+        try {
+          // 等待上传文件的返回结果
+          let uploadRes = await this.uploadFile(type)
+          console.log('上传结果', uploadRes)
+
+          // 检查上传结果
+          if (!uploadRes.data.path) {
+            return
+          }
+
+          // 构建提交作业的数据
+          let data = {
+            id: item.id, // 作业列表id
+            student_file: uploadRes.data.path, // 附件
+            student_file_type: type, // 作业类型1图片2视频
+            student_content: '', // 内容
+          }
+
+          // 提交作业
+          await this.assignmentsSubmit(data)
+        } catch (error) {
+          console.error('上传或提交作业失败:', error)
+          alert('上传或提交作业失败')
+        }
+      },
+
+// 上传单文件(视频/图片) type=作业类型1图片2视频
+      async uploadFile(type) {
+        return new Promise((resolve, reject) => {
+          if (type == 1) {
+            this.uploadApiUrl = this.uploadImageApiUrl
+            uni.chooseImage({
+              count: 1,
+              sizeType: ['compressed'],
+              sourceType: ['album', 'camera'],
+              success: async (res) => {
+                const tempFilePath = res.tempFilePaths[0]
+                // 这里可以调用上传接口
+                try {
+                  let data = await this.uploadFilePromise(tempFilePath)
+                  resolve(data)
+                } catch (error) {
+                  reject(error)
+                }
+              },
+              fail: (error) => {
+                reject(error)
+              }
+            })
+          } else {
+            this.uploadApiUrl = this.uploadVideoApiUrl
+            uni.chooseVideo({
+              count: 1,
+              // sizeType: ['compressed'],
+              sourceType: ['album', 'camera'],
+              success: async (res) => {
+                console.log('文件选择结果:', res); // 打印 res 检查是否有 tempFilePaths
+                const tempFilePath = res.tempFilePath; // 直接获取视频文件路径
+                // console.log('上传的文件',tempFilePath)
+
+                // 这里可以调用上传接口
+                try {
+                  let data = await this.uploadFilePromise(tempFilePath)
+                  resolve(data)
+                } catch (error) {
+                  reject(error)
+                }
+              },
+              fail: (error) => {
+                reject(error)
+              }
+            })
+          }
+        })
+      },
+
+      // 执行文件上传
+      uploadFilePromise(url) {
+        return new Promise((resolve, reject) => {
+          let token = uni.getStorageSync('token') || ''
+          uni.uploadFile({
+            url: this.uploadApiUrl, // 仅为示例，非真实的接口地址
+            filePath: url,
+            name: 'file',
+            header: {
+              'token': `${token}`, // 请求头设置token
+            },
+            success: (e) => {
+              let res = JSON.parse(e.data.replace(/\ufeff/g, "") || "{}")
+              console.log('上传成功2', res)
+              if (res.code == 1) {
+                resolve({
+                  code: 1,
+                  data: res.data,
+                  msg: '上传成功'
+                })
+              } else {
+                uni.showToast({
+                  title: res.msg,
+                  icon: 'none'
+                })
+                reject({
+                  code: 0,
+                  data: {},
+                  msg: '上传失败'
+                })
+              }
+            },
+            fail: (error) => {
+              reject(error)
+            }
+          })
+        })
+      },
+
+      // 提交作业接口
+      async assignmentsSubmit(item) {
+        let data = {
+          id: item.id, // 作业列表id
+          student_file: item.student_file, // 附件
+          student_file_type: item.student_file_type, // 作业类型1图片2视频
+          student_content: item.student_content, // 内容
+        }
+        let res = await memberApi.assignmentsSubmit(data)
+        if (res.code != 1) {
+          uni.showToast({
+            title: res.msg,
+            icon: 'none'
+          })
+          return
+        }
+        uni.showToast({
+          title: res.msg,
+          icon: 'success'
+        })
+        // 延迟1s执行
+        setTimeout(() => {
+          this.init()
+        }, 1000)
+      }
+
+
+   }
 	}
 </script>