跑步记录

teamwork/pages/my/main.vue

@@ -25,13 +25,13 @@
 		</view>
 		<view>
 			<view class="func">
-				<view class="my-post">
-					<view class="my-post-icon"></view>
-					<view>我的帖子</view>
+				<view class="my-walking-record">
+					<view class="my-walking-record-icon" @click="goToWalkingRecord()"></view>
+					<view>健走记录</view>
 				</view>
 				<view class="running-record">
 					<view class="running-record-icon" @click="goToRunningRecord()"></view>
-					<view>运动记录</view>
+					<view>跑步记录</view>
 				</view>
 				<view class="setting">
 					<view class="setting-icon" @click="goToSetting()"></view>
@@ -65,6 +65,12 @@
 					url: '/pages/my/my-modify'
 				})
 			},
+			goToMyPost() {
+				console.log('aaa');
+				uni.navigateTo({
+					url:  "/pages/post/post"
+				})
+			},
 			goToSetting() {
 				uni.navigateTo({
 					url: '/pages/my/my-setting'
@@ -80,19 +86,24 @@
 					url: '/pages/my/my-running-record'
 				})
 			},
+			goToWalkingRecord() {
+				uni.navigateTo({
+					url: '/pages/my/my-walking-record'
+				})
+			},
 			getData() {
 				uniCloud.callFunction({
 					name: 'fe-my-information',
 					data: {userId:'6450da43e1a35c371b3699cc'}
 				})
 				.then(res => {
-					this.headPortraitIcon=res.result.data.icon,
-					this.nickname=res.result.data.username,
-					this.schoolName=res.result.data.school,
-					this.teamName=res.result.data.team,
+					this.headPortraitIcon=res.result.data.icon;
+					this.nickname=res.result.data.username;
+					this.schoolName=res.result.data.school;
+					this.teamName=res.result.data.team;
 					
 					//this.activityList=res.result.data.activityList,
-					console.log(res);
+					//console.log(res);
 				});						
 			},
 		},
@@ -225,12 +236,12 @@
 		text-align: center;
 		font-size: 20rpx;
 	}
-	.my-post{
+	.my-walking-record{
 		
 		width:200rpx;
 		height: 250rpx;
 	}
-	.my-post-icon{
+	.my-walking-record-icon{
 		
 		width: 100rpx;
 		height: 100rpx;
@@ -238,7 +249,7 @@
 		margin-left: auto;
 		margin-right: auto;
 		background-size:100% 100%;
-		background-image:url("/static/my/main/my-post-icon.png");
+		background-image:url("/static/my/main/walking-record-icon.png");
 		background-repeat:no-repeat;
 	}
 	.running-record{

teamwork/pages/my/my-modify.vue

@@ -261,6 +261,7 @@
 			},
 		},
 		onLoad() {
+			console.log('d');
 			plus.navigator.setStatusBarBackground('#EDEEF0');
 			//this.getData();
 		}

teamwork/pages/my/my-running-record.vue

@@ -2,31 +2,32 @@
 	<view class="main">
 		<view class="top">
 			<image @click="goBack" class="back" :src="'/static/my/exit-icon.png'"></image>
-			<view class="title">运动记录</view>
+			<view class="title">跑步记录</view>
 			<span class="empty"></span>
 		</view>
-		<view class="record">
+		<view class="record" v-for="runningrecord in runningrecordList">
 			<view class="icon">
-				
+
 			</view>
 			<view class="content">
 				<view class="content1">
 					<view class="distance">
-						{{distance}}公里
+						{{runningrecord.distance.toFixed(2)}}公里
 					</view>
-					<image class="type-icon" :src="'/static/my/my-running-record/running.png/'"></image>
+					<image class="type-icon" :src="'/static/my/my-record/running.png/'"></image>
 				</view>
 				<view class="content2">
 					<view class="duration">
-						00:04:25
+						{{runningrecord.duration}}
 					</view>
-					<image class="duration-icon" :src="'/static/my/my-running-record/duration.png'"></image>
+					<image class="duration-icon" :src="'/static/my/my-record/duration.png'"></image>
 					<view class="pace">
-						04'35"
+						{{parseInt(runningrecord.pace/60).toString().padStart(2,0)}}'{{parseInt(runningrecord.pace%60).toString().padStart(2,0)}}''
+						<!-- {{runningrecord.pace}} -->
 					</view>
-					<image class="pace-icon" :src="'/static/my/my-running-record/pace.png'"></image>
+					<image class="pace-icon" :src="'/static/my/my-record/pace.png'"></image>
 					<view class="date">
-						2023.04.29
+						{{runningrecord.startDatetime}}
 					</view>
 				</view>
 			</view>
@@ -37,21 +38,96 @@
 <script>
 	export default {
 		data() {
-			return{
-				distance:'1.04',
-				duration:'00:04:25',
-				pace:'04\'35\"',
-				date:'2023.04.29',
+			return {
+				runningrecordList: [],
+
 			}
 		},
-		methods:{
+		methods: {
 			goBack() {
 				uni.navigateBack({
 					delta: 1, //返回层数，2则上上页
 				})
 			},
-			onload() {
+			getData() {
+
+				uniCloud.callFunction({
+						name: 'fe-my-runningList',
+						data: {
+							userId: '644a643a0c801ca878983559'
+						}
+					})
+					.then(res => {
+
+						console.log(res);
+						this.runningrecordList = res.result.data.runningList;
+						this.runningrecordList.forEach((item, index) => {
+							item.duration = this.formatSeconds(item.duration);
+							//item.pace = this.formatPace(item.pace);
+							item.startDatetime = this.formatDate(item.startDatetime);
+						});
+
+					});
+			},
+			formatSeconds(value) {
+				var secondTime = parseInt(value); // 秒
+				var minuteTime = 0; // 分
+				var hourTime = 0; // 小时
+				var result = "";
+				if (secondTime > 60) { //如果秒数大于60，将秒数转换成整数
+					//获取分钟，除以60取整数，得到整数分钟
+					minuteTime = parseInt(secondTime / 60);
+					//获取秒数，秒数取佘，得到整数秒数
+					secondTime = parseInt(secondTime % 60);
+					//如果分钟大于60，将分钟转换成小时
+					if (minuteTime > 60) {
+						//获取小时，获取分钟除以60，得到整数小时
+						hourTime = parseInt(minuteTime / 60);
+						//获取小时后取佘的分，获取分钟除以60取佘的分
+						minuteTime = parseInt(minuteTime % 60);
+					}
+				}
+				//var result = "" + parseInt(secondTime) + "";
+				if (secondTime >= 10) {
+					result = "" + parseInt(secondTime) + "";
+				} else {
+					result = "0" + parseInt(secondTime) + "";
+				}
+				if (minuteTime >= 10) {
+					result = "" + parseInt(minuteTime) + ":" + result;
+				} else {
+					result = "0" + parseInt(minuteTime) + ":" + result;
+				}
+				if (hourTime >= 10) {
+					result = "" + parseInt(hourTime) + ":" + result;
+				} else {
+					result = "0" + parseInt(hourTime) + ":" + result;
+				}
+
+				return result;
+			},
+			// formatPace(value){
+			// 	const str = value + '';  //转成字符串
+			// 	let arr = str.split('.');
+			// 	let temp1 = arr[0] + '';
+			// 	let temp2 = arr[1] + '';
+			// 	let result = '';
+			// 	temp1 = temp1.length == 1 ? '0' + temp1 : temp1; //小数点后只有一位的话，补0
+			// 	temp2 = temp2.length == 1 ? temp2 + '0' : temp2;
+			// 	result = "" + temp1 + "\'" + temp2 + "\"";
+			// 	return result;
+				
+			// },
+			formatDate(value){
+				const str = value + '';  //转成字符串
+				let arr = str.split(' ');
+				return arr[0];
+			},
+			onLoad() {
+				
+				//console.log(this.formatSeconds(10));
 				plus.navigator.setStatusBarBackground('#EDEEF0');
+				this.getData();
 			}
 		}
 	}
@@ -64,14 +140,14 @@
 		height: 100%;
 		/* background-color: #EDEEF0; */
 	}
-	
+
 	.top {
 		width: 100%;
 		height: 50px;
 		background-color: #EDEEF0;
 		text-align: center;
 	}
-	
+
 	.back {
 		width: 40px;
 		height: 30px;
@@ -80,7 +156,7 @@
 		float: left;
 		margin-left: 10px;
 	}
-	
+
 	.empty {
 		width: 40px;
 		height: 30px;
@@ -89,7 +165,7 @@
 		float: right;
 		margin-right: 10px;
 	}
-	
+
 	.title {
 		font-size: 20px;
 		margin-top: 10px;
@@ -97,15 +173,17 @@
 		color: #f1992d;
 		display: inline-block;
 	}
-	.record{
+
+	.record {
 		border-bottom: 2rpx solid #EDEEF0;
-		width:100%;
+		width: 100%;
 		height: 200rpx;
 		/* display: flex;
 		flex-direction: row; */
-		
+
 	}
-	.icon{
+
+	.icon {
 		border: 2rpx solid #EDEEF0;
 		width: 150rpx;
 		height: 150rpx;
@@ -113,58 +191,66 @@
 		margin-left: 30rpx;
 		float: left;
 	}
-	.content{
-		
+
+	.content {
+
 		width: 72%;
 		height: 100%;
 		/* margin: 10rpx 0 10rpx 30rpx; */
 		float: right;
 	}
-	.content1{
-		
+
+	.content1 {
+
 		height: 50%;
-		
+
 	}
-	.distance{
-		
-		
+
+	.distance {
+
+
 		width: 70%;
 		font-weight: bold;
 		font-size: 65rpx;
 		margin-top: 15rpx;
 		float: left;
-	}	
-	.type-icon{
-		
+	}
+
+	.type-icon {
+
 		float: right;
 		margin-top: 50rpx;
 		margin-right: 70rpx;
 		width: 50rpx;
 		height: 50rpx;
 	}
-	.content2{
+
+	.content2 {
 		margin-top: 20rpx;
 		display: flex;
 		flex-direction: row;
 		font-size: 25rpx;
 	}
-	.duration{
-		
-	}
-	.duration-icon{
+
+	.duration {}
+
+	.duration-icon {
 		width: 35rpx;
 		height: 35rpx;
 	}
-	.pace{
-		
+
+	.pace {
+
 		margin-left: 60rpx;
 	}
-	.pace-icon{
+
+	.pace-icon {
 		width: 35rpx;
 		height: 35rpx;
 	}
-	.date{
-		
-		margin-left:90rpx;
+
+	.date {
+
+		margin-left: 90rpx;
 	}
 </style>
\ No newline at end of file