学习统计

api/api.ts

@@ -216,5 +216,17 @@ export default {
 	// 退课列表
 	queryDropCourseList(params){
 		return request(`${cffpURL}/course/queryDropCourseList`, "POST", params)
+	},
+	// 学习统计
+	userStudyCount(params){
+		return request(`${cffpURL}/study/userStudyCount`, "POST", params)
+	},
+	// 课程包学习进度明细
+	userCoursePackBar(params){
+		return request(`${cffpURL}/study/userCoursePackBar`, "POST", params)
+	},
+	// 学习明细
+	userStudyTime(params){
+		return request(`${cffpURL}/study/userStudyTime`, "POST", params)
 	}
 }

pages.json

@@ -357,6 +357,15 @@
             }
             
         }
+        ,{
+            "path" : "pages/learningStatistics/learningStatistics",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "学习统计",
+                "enablePullDownRefresh": false
+            }
+            
+        }
     ],
 	// "tabBar": {
 	//         "color": "#7A7E83", // tab 上的文字默认颜色

pages/learningStatistics/learningStatistics.vue

+<template>
+	<view class="container">
+		<view class="dataCountBox">
+			<view class="leftBox">
+				<view>
+					<text class="count">{{userStudyCountList.studyTimeTotal}}</text>
+					<text>分钟</text>
+				</view>
+				<view style="margin-top: 16rpx;">累计学习时长</view>
+			</view>
+			<view class="rightBox">
+				<view>
+					<text class="count">{{userStudyCountList.fileTotal}}</text>
+					<text>节</text>
+				</view>
+				<view style="margin-top: 16rpx;">累计完成课程</view>
+			</view>
+		</view>
+		<!-- 总览学习进度 -->
+		<view class="studyProgressBox">
+			<h4>总览学习进度</h4>
+		</view>
+	</view>
+</template>
+
+<script>
+	import api from "@/api/api";
+	export default {
+		data() {
+			return {
+				userId:'1',
+				userStudyCountList:{},
+				userCoursePackBarList:{},
+				userStudyTimeList:{},
+				packFileId:'',
+				orderId:'',
+				month:''
+			};
+		},
+		methods:{
+			userStudyCount(){
+				api.userStudyCount({userId:this.userId}).then(res=>{
+					if(res['success']){
+						this.userStudyCountList = res['data'];
+					}
+				})
+			},
+			userCoursePackBar(){
+				api.userCoursePackBar({userId:this.userId,packFileId:this.packFileId,orderId:this.orderId}).then(res=>{
+					if(res['success']){
+						this.userCoursePackBarList = res['data'];
+					}
+				})
+			},
+			userStudyTime(){
+				api.userStudyTime({userId:this.userId,month:this.month}).then(res=>{
+					if(res['success']){
+						this.userStudyTimeList = res['data'];
+					}
+				})
+			}
+		},
+		mounted() {
+			this.userStudyCount()
+		}
+	}
+</script>
+
+<style lang="scss">
+	.container{
+		height: 100%;
+		.dataCountBox{
+			padding: 30rpx 0;
+			margin: 10rpx 20rpx;
+			display: flex;
+			background-color: #fff;
+			color: #666666;
+			.leftBox,.rightBox{
+				flex: 1;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				flex-direction: column;
+				.count{
+					color: #0A2F99;
+					font-size: 40rpx;
+				}
+			}
+			.leftBox{
+				border-right: 1px solid #F4F4F4;
+			}
+		}
+		.studyProgressBox{
+			h4{
+				position: relative;
+				font-size: 36rpx;
+				color: #333;
+				padding-left: 50rpx;
+				margin-top: 10rpx;
+				margin-bottom: 20rpx;
+				&:before{
+					content: '';
+					display: block;
+					position: absolute;
+					left: 30rpx;
+					top: 10%;
+					width: 6rpx;
+					height: 70%;
+					background-color: #FA882F;
+					border-radius: 4rpx;
+				}
+			}
+		}
+	}
+</style>

pages/myLearning/myLearning.vue

@@ -36,7 +36,7 @@
 		
 			</view>
 			<view class="learningStatisticsContainer" v-if="tabType===2">
-				
+				<learning-statistics></learning-statistics>
 			</view>
 		</view>
 	</view>
@@ -45,7 +45,9 @@
 <script>
 	import api from "@/api/api";
 	import dataHandling from "@/util/dataHandling";
+	import learningStatistics from "@/pages/learningStatistics/learningStatistics.vue";
 	export default {
+		components:{learningStatistics},
 		data() {
 			return {
 				tabType:1,