fix: 调整睡眠阶段图表的宽度和边距，优化标签显示逻辑

components/sleep/SleepStageTimeline.tsx

@@ -24,7 +24,9 @@ export const SleepStageTimeline = ({
   const colorTokens = Colors[theme];
 
   // 图表尺寸参数
-  const chartWidth = 320;
+  const containerWidth = 320;
+  const chartPadding = 25; // 左右边距，为时间标签预留空间
+  const chartWidth = containerWidth - chartPadding * 2;
   const chartHeight = 80;
   const timelineHeight = 32;
   const timelineY = 24;
@@ -53,7 +55,7 @@ export const SleepStageTimeline = ({
       const startOffset = sampleStart.diff(startTime, 'minute');
       const duration = sampleEnd.diff(sampleStart, 'minute');
       
-      const x = Math.max(0, (startOffset / totalMinutes) * chartWidth);
+      const x = Math.max(0, (startOffset / totalMinutes) * chartWidth) + chartPadding;
       const width = Math.max(2, (duration / totalMinutes) * chartWidth);
       
       return {
@@ -71,7 +73,7 @@ export const SleepStageTimeline = ({
     // 总是显示起始时间
     labels.push({
       time: startTime.format('HH:mm'),
-      x: 0
+      x: chartPadding
     });
 
     // 根据睡眠总时长动态调整时间间隔
@@ -92,11 +94,11 @@ export const SleepStageTimeline = ({
     
     while (currentTime.add(timeStepMinutes * stepCount, 'minute').isBefore(endTime)) {
       const stepTime = currentTime.add(timeStepMinutes * stepCount, 'minute');
-      const x = (stepTime.diff(startTime, 'minute') / totalMinutes) * chartWidth;
+      const x = (stepTime.diff(startTime, 'minute') / totalMinutes) * chartWidth + chartPadding;
       
       // 检查与前一个标签的间距
       const lastLabel = labels[labels.length - 1];
-      if (x - lastLabel.x >= minLabelSpacing && x <= chartWidth - 30) {
+      if (x - lastLabel.x >= minLabelSpacing && x <= containerWidth - chartPadding) {
         labels.push({
           time: stepTime.format('HH:mm'),
           x: x
@@ -107,7 +109,7 @@ export const SleepStageTimeline = ({
     }
 
     // 总是显示结束时间，但要确保与前一个标签有足够间距
-    const endX = chartWidth - 25;
+    const endX = containerWidth - chartPadding;
     const lastLabel = labels[labels.length - 1];
     if (endX - lastLabel.x >= minLabelSpacing) {
       labels.push({
@@ -176,7 +178,7 @@ export const SleepStageTimeline = ({
 
       {/* SVG 图表 */}
       <View style={styles.chartContainer}>
-        <Svg width={chartWidth} height={chartHeight}>
+        <Svg width={containerWidth} height={chartHeight}>
           {/* 绘制睡眠阶段条形图 */}
           {timelineData.map((segment, index) => (
             <Rect
@@ -195,7 +197,7 @@ export const SleepStageTimeline = ({
             <React.Fragment key={index}>
               {/* 刻度线 */}
               <Rect
-                x={label.x}
+                x={label.x - 0.5}
                 y={timelineY + timelineHeight}
                 width={1}
                 height={6}