From 11887bf3d5804f4330d7bc5421e423d27301734b Mon Sep 17 00:00:00 2001
From: Cxx0822 <1556464090@qq.com>
Date: Sun, 15 Mar 2026 23:14:35 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E6=9B=B4=E6=96=B0=E8=BF=90=E5=8A=A8?=
 =?UTF-8?q?=E5=81=A5=E5=BA=B7=E6=A8=A1=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Health/HealthChart.vue | 15 ++++----
 src/components/Health/HealthForm.vue  | 49 ++++++++++++++++++++-------
 src/components/Health/HealthStats.vue |  9 +++--
 3 files changed, 52 insertions(+), 21 deletions(-)

diff --git a/src/components/Health/HealthChart.vue b/src/components/Health/HealthChart.vue
index a4b039d..095a7e2 100644
--- a/src/components/Health/HealthChart.vue
+++ b/src/components/Health/HealthChart.vue
@@ -78,12 +78,15 @@ const updateChart = () => {
   const sortedRecordList = weightRecordList.sort((a, b) => a.weight - b.weight)
 
   weightDailyChart.setOption(lineChartOptions('日期', weightXAxis, '体重（千克）', weightYAxis))
-  weightDailyChart.setOption({
-    yAxis: {
-      min: Math.floor(sortedRecordList[0].weight),
-      max: Math.ceil(sortedRecordList[sortedRecordList.length - 1].weight)
-    }
-  })
+
+  if (sortedRecordList.length > 0) {
+    weightDailyChart.setOption({
+      yAxis: {
+        min: Math.floor(sortedRecordList[0].weight),
+        max: Math.ceil(sortedRecordList[sortedRecordList.length - 1].weight)
+      }
+    })
+  }
 
   // 睡眠时长统计图
   const sleepRecordList = healthStore.healthRecordList
diff --git a/src/components/Health/HealthForm.vue b/src/components/Health/HealthForm.vue
index e4f7385..4bc1014 100644
--- a/src/components/Health/HealthForm.vue
+++ b/src/components/Health/HealthForm.vue
@@ -55,13 +55,13 @@
         <span>睡眠开始时间</span>
       </template>
 
-      <el-date-picker
+      <el-time-picker
           v-model="healthStore.currentHealth.sleepStartTime"
-          type="datetime" clearable :editable="false"
-          placeholder="选择时间"
+          clearable :editable="false"
+          placeholder="请选择睡眠开始时间"
           style="width: 180px"
-          format="YYYY-MM-DD HH:mm"
-          value-format="YYYY-MM-DD HH:mm:ss"
+          format="HH:mm"
+          value-format="HH:mm"
           @clear="healthStore.currentHealth.sleepStartTime = ''"
       />
     </el-form-item>
@@ -72,17 +72,27 @@
         <span>睡眠结束时间</span>
       </template>
 
-      <el-date-picker
+      <el-time-picker
           v-model="healthStore.currentHealth.sleepEndTime"
-          type="datetime" clearable :editable="false"
-          placeholder="选择时间"
+          clearable :editable="false"
+          placeholder="请选择睡眠结束时间"
           style="width: 180px"
-          format="YYYY-MM-DD HH:mm"
-          value-format="YYYY-MM-DD HH:mm:ss"
+          format="HH:mm"
+          value-format="HH:mm"
           @clear="healthStore.currentHealth.sleepEndTime = ''"
       />
     </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-button type="primary" @click="onSubmit"
                  :disabled="isBeforeDate(formatDate(new Date()), healthStore.selectDate)">
@@ -96,6 +106,7 @@
 import { useHealthStore } from '@/store/health'
 import { formatDate, isBeforeDate } from 'vue3-common/utils/dateUtil'
 import { ElMessage } from 'element-plus'
+import dayjs from 'dayjs'
 
 const healthStore = useHealthStore()
 
@@ -116,14 +127,26 @@ const onSubmit = async () => {
     }
   }
 
-  if (sleepStartTime && sleepEndTime && !sleepStartTime && sleepEndTime) {
-    ElMessage.error('睡眠结束时间应大于睡眠开始时间')
-    return
+  if (sleepStartTime && sleepEndTime) {
+    healthStore.currentHealth.sleepDuration = calculateSleepDuration(sleepStartTime, sleepEndTime)
   }
 
   await healthStore.updateHealthDay()
   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>
 
 <style lang="scss">
diff --git a/src/components/Health/HealthStats.vue b/src/components/Health/HealthStats.vue
index f442cfb..417673d 100644
--- a/src/components/Health/HealthStats.vue
+++ b/src/components/Health/HealthStats.vue
@@ -15,6 +15,8 @@ import StatsCard from '@/components/StatsCard.vue'
 import { useHealthStore } from '@/store/health'
 import { ref, watch } from 'vue'
 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()
 
@@ -30,7 +32,10 @@ const healthStats = ref({
 const updateStats = () => {
   const recordList = healthStore.healthRecordList
   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>