feat:更新运动健康模块

This commit is contained in:
2026-03-15 23:14:35 +08:00
parent 1fb76fc220
commit 11887bf3d5
3 changed files with 52 additions and 21 deletions

View File

@@ -78,12 +78,15 @@ const updateChart = () => {
const sortedRecordList = weightRecordList.sort((a, b) => a.weight - b.weight) const sortedRecordList = weightRecordList.sort((a, b) => a.weight - b.weight)
weightDailyChart.setOption(lineChartOptions('日期', weightXAxis, '体重(千克)', weightYAxis)) weightDailyChart.setOption(lineChartOptions('日期', weightXAxis, '体重(千克)', weightYAxis))
weightDailyChart.setOption({
yAxis: { if (sortedRecordList.length > 0) {
min: Math.floor(sortedRecordList[0].weight), weightDailyChart.setOption({
max: Math.ceil(sortedRecordList[sortedRecordList.length - 1].weight) yAxis: {
} min: Math.floor(sortedRecordList[0].weight),
}) max: Math.ceil(sortedRecordList[sortedRecordList.length - 1].weight)
}
})
}
// 睡眠时长统计图 // 睡眠时长统计图
const sleepRecordList = healthStore.healthRecordList const sleepRecordList = healthStore.healthRecordList

View File

@@ -55,13 +55,13 @@
<span>睡眠开始时间</span> <span>睡眠开始时间</span>
</template> </template>
<el-date-picker <el-time-picker
v-model="healthStore.currentHealth.sleepStartTime" v-model="healthStore.currentHealth.sleepStartTime"
type="datetime" clearable :editable="false" clearable :editable="false"
placeholder="选择时间" placeholder="选择睡眠开始时间"
style="width: 180px" style="width: 180px"
format="YYYY-MM-DD HH:mm" format="HH:mm"
value-format="YYYY-MM-DD HH:mm:ss" value-format="HH:mm"
@clear="healthStore.currentHealth.sleepStartTime = ''" @clear="healthStore.currentHealth.sleepStartTime = ''"
/> />
</el-form-item> </el-form-item>
@@ -72,17 +72,27 @@
<span>睡眠结束时间</span> <span>睡眠结束时间</span>
</template> </template>
<el-date-picker <el-time-picker
v-model="healthStore.currentHealth.sleepEndTime" v-model="healthStore.currentHealth.sleepEndTime"
type="datetime" clearable :editable="false" clearable :editable="false"
placeholder="选择时间" placeholder="选择睡眠结束时间"
style="width: 180px" style="width: 180px"
format="YYYY-MM-DD HH:mm" format="HH:mm"
value-format="YYYY-MM-DD HH:mm:ss" value-format="HH:mm"
@clear="healthStore.currentHealth.sleepEndTime = ''" @clear="healthStore.currentHealth.sleepEndTime = ''"
/> />
</el-form-item> </el-form-item>
<el-form-item>
<template #label>
<i class="fa-solid fa-hourglass-start"></i>
<span>睡眠时长</span>
</template>
<span>{{ healthStore.currentHealth.sleepDuration }}</span>
<span style="margin-left: 5px;">小时</span>
</el-form-item>
<el-form-item style="align-self: center;"> <el-form-item style="align-self: center;">
<el-button type="primary" @click="onSubmit" <el-button type="primary" @click="onSubmit"
:disabled="isBeforeDate(formatDate(new Date()), healthStore.selectDate)"> :disabled="isBeforeDate(formatDate(new Date()), healthStore.selectDate)">
@@ -96,6 +106,7 @@
import { useHealthStore } from '@/store/health' import { useHealthStore } from '@/store/health'
import { formatDate, isBeforeDate } from 'vue3-common/utils/dateUtil' import { formatDate, isBeforeDate } from 'vue3-common/utils/dateUtil'
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import dayjs from 'dayjs'
const healthStore = useHealthStore() const healthStore = useHealthStore()
@@ -116,14 +127,26 @@ const onSubmit = async () => {
} }
} }
if (sleepStartTime && sleepEndTime && !sleepStartTime && sleepEndTime) { if (sleepStartTime && sleepEndTime) {
ElMessage.error('睡眠结束时间应大于睡眠开始时间') healthStore.currentHealth.sleepDuration = calculateSleepDuration(sleepStartTime, sleepEndTime)
return
} }
await healthStore.updateHealthDay() await healthStore.updateHealthDay()
healthStore.currentHealth = healthStore.getHealthDay(healthStore.selectDate) healthStore.currentHealth = healthStore.getHealthDay(healthStore.selectDate)
} }
const calculateSleepDuration = (startTime: string, endTime: string) => {
const start = dayjs(startTime, 'HH:mm')
let end = dayjs(endTime, 'HH:mm')
// 处理跨天
if (end.isSameOrBefore(start)) {
end = end.add(1, 'day')
}
// 计算时间差(小时)
return end.diff(start, 'hour', true)
}
</script> </script>
<style lang="scss"> <style lang="scss">

View File

@@ -15,6 +15,8 @@ import StatsCard from '@/components/StatsCard.vue'
import { useHealthStore } from '@/store/health' import { useHealthStore } from '@/store/health'
import { ref, watch } from 'vue' import { ref, watch } from 'vue'
import { formatAmount } from 'vue3-common/utils/numberUtil' import { formatAmount } from 'vue3-common/utils/numberUtil'
import record from '@/views/travel/record.vue'
import { max } from '@popperjs/core/lib/utils/math'
const healthStore = useHealthStore() const healthStore = useHealthStore()
@@ -30,7 +32,10 @@ const healthStats = ref({
const updateStats = () => { const updateStats = () => {
const recordList = healthStore.healthRecordList const recordList = healthStore.healthRecordList
const totalWeight = recordList.reduce((sum, item) => sum + item.weight, 0) const totalWeight = recordList.reduce((sum, item) => sum + item.weight, 0)
healthStats.value.averageWeight = totalWeight / recordList.length
healthStats.value.totalDuration = recordList.reduce((sum, item) => sum + item.sportDuration, 0) if (recordList.length > 0) {
healthStats.value.averageWeight = totalWeight / recordList.length
healthStats.value.totalDuration = recordList.reduce((sum, item) => sum + item.sportDuration, 0)
}
} }
</script> </script>