update

src/_health/base/cell.scss

@@ -6,5 +6,5 @@
 }
 
 .cell_hover{
-    background-color: #E5E5E5;
+    background-color: #f0f0f0;
 }

src/_health/base/cell_footer.tsx

@@ -0,0 +1,23 @@
+import { rpxToPx } from "@/utils/tools";
+import { View } from "@tarojs/components";
+
+export enum CellFooterType {
+    left = 'left',
+    center = 'center'
+}
+
+export default function CellFooter(props: { type: CellFooterType, children: any }) {
+    return <View style={{
+        paddingLeft: rpxToPx(52),
+        paddingRight: rpxToPx(52),
+        paddingTop: rpxToPx(24),
+        paddingBottom: rpxToPx(24),
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: props.type == CellFooterType.left ? 'flex-start' : 'center'
+    }}>
+        {
+            props.children
+        }
+    </View>
+}

src/_health/base/cell_footer_text.tsx

@@ -0,0 +1,6 @@
+import { MainColorType } from "@/context/themes/color";
+import { View } from "@tarojs/components";
+
+export default function CellFooterText(props: { text: string, isBold?: boolean }) {
+    return <View className="h24" style={{ color: MainColorType.g02, lineHeight: '18px', fontWeight: props.isBold ? 'bold' : 'normal' }}>{props.text}</View>
+}   

src/_health/base/new_button.tsx

@@ -88,7 +88,7 @@ export default function NewButton(props: {
                 backgroundColor: isTouched ? hexToHSL(props.color) : props.disable ? '#B2B2B2' : props.color,
                 color: '#fff',
                 fontSize: props.fontSize ?? rpxToPx(30),
-                fontWeight: props.bold ? 'bold' : 'normal',
+                fontWeight: 'bold',//props.bold ? 'bold' : 'normal',
                 display: 'flex',
                 alignItems: 'center',
                 justifyContent: 'center',
@@ -104,7 +104,7 @@ export default function NewButton(props: {
                 backgroundColor: isTouched ? props.color + '40' : props.disable ? '#B2B2B240' : props.color + '1A',
                 color: props.disable ? '#b2b2b2' : props.color,
                 fontSize: props.fontSize ?? rpxToPx(30),
-                fontWeight: props.bold ? 'bold' : 'normal',
+                fontWeight: 'bold',//props.bold ? 'bold' : 'normal',
                 display: 'flex',
                 alignItems: 'center',
                 justifyContent: 'center',
@@ -122,7 +122,7 @@ export default function NewButton(props: {
                 backgroundColor: isTouched ? props.color + '26' : 'transparent',
                 color: props.disable ? '#b2b2b2' : props.color,
                 fontSize: props.fontSize ?? rpxToPx(30),
-                fontWeight: props.bold ? 'bold' : 'normal',
+                fontWeight: 'bold',//props.bold ? 'bold' : 'normal',
                 display: 'flex',
                 alignItems: 'center',
                 justifyContent: 'center',
@@ -140,7 +140,7 @@ export default function NewButton(props: {
                 backgroundColor: isTouched ? '#b2b2b240' : '#b2b2b210',
                 color: props.disable ? '#b2b2b2' : '#000000',
                 fontSize: props.fontSize ?? rpxToPx(30),
-                fontWeight: props.bold ? 'bold' : 'normal',
+                fontWeight: 'bold',//props.bold ? 'bold' : 'normal',
                 display: 'flex',
                 alignItems: 'center',
                 justifyContent: 'center',
@@ -268,7 +268,7 @@ export default function NewButton(props: {
     }
 
     return <View
-        style={{ ...style, ...props.btnStyle, fontWeight: props.bold ? 'bold' : 'normal', display: 'flex', flexDirection: 'row', alignItems: 'center' }}
+        style={{ ...style, ...props.btnStyle, fontWeight: props.type==NewButtonType.link ?  'normal':'bold' , display: 'flex', flexDirection: 'row', alignItems: 'center' }}
         catchMove
         onClick={(e) => {
             if (process.env.TARO_ENV == 'weapp') {

src/_health/base/new_durationpicker.tsx

@@ -148,7 +148,7 @@ export default function NewDurationPicker(props: { value?: any, onChange?: any,
     const bgStyle = `background-color: ${props.color}1A !important;`
     return <PickerView
         value={values}
-        style={{ color: '#000', height: rpxToPx(340), width: rpxToPx(670) }}
+        style={{ color: '#000', height: rpxToPx(340), width: rpxToPx(618) }}
         onChange={onPickerChange}
         indicatorClass="pick_sel_item"
         indicatorStyle={bgStyle}//""

src/_health/base/new_modal.scss

@@ -29,12 +29,12 @@
 @keyframes modalBgAnim {
 
     100% {
-        background-color: rgba($color: #000000, $alpha: 0.15);
+        background-color: rgba($color: #000000, $alpha: 0.5);
     }
 }
 
 .modal_dismiss {
-    background-color: rgba($color: #000000, $alpha: 0.15);
+    background-color: rgba($color: #000000, $alpha: 0.5);
     animation: modalBgHideAnim 0.2s linear forwards;
 }
 

src/_health/base/new_modal.tsx

@@ -3,8 +3,10 @@ import './new_modal.scss'
 import React, { useEffect, useRef, useState } from 'react';
 import { ModalType } from '@/utils/types';
 import Taro from '@tarojs/taro';
-import { vibrate } from '@/utils/tools';
+import { rpxToPx, vibrate } from '@/utils/tools';
 import { MainColorType } from '@/context/themes/color';
+import NewButton, { NewButtonType } from './new_button';
+import { IconClose } from '@/components/basic/Icons';
 
 
 let ModalRN, Animated
@@ -102,7 +104,7 @@ export default function NewModal(props: {
         // animationType="slide"
         // style={{backgroundColor:'red'}}
         >
-            <View style={{ flex: 1, backgroundColor: props.themeIsWhite ? '#ffffff90' : '#000000cc' }}>
+            <View style={{ flex: 1, backgroundColor: props.themeIsWhite ? '#00000080' : '#00000080' }}>
                 <View style={{ flex: 1, backgroundColor: 'transparent' }} onClick={(e) => {
                     rndismiss()
                 }}></View>
@@ -125,8 +127,25 @@ export default function NewModal(props: {
             }; dismiss()
         }}>
         </View>
-        <View className={isDismiss ? 'modal_bottom_content modal_bottom_dismiss' : 'modal_bottom_content'} style={{ flexShrink: 0 }} onClick={onClick}>
-            <View className='modal_title'>{props.title}</View>
+        <View className={isDismiss ? 'modal_bottom_content modal_bottom_dismiss' : 'modal_bottom_content'} style={{ flexShrink: 0,position:'relative' }} onClick={onClick}>
+            <View className='modal_title'>{props.title}
+                <View style={{
+                    display:'flex',
+                    width: rpxToPx(60),
+                    height: rpxToPx(60),
+                    alignItems:'center',
+                    justifyContent:'center',
+                    position:'absolute',
+                    right:rpxToPx(24),
+                    top:rpxToPx(24)
+                }}>
+                    <NewButton
+                        onClick={dismiss}
+                        type={NewButtonType.img}>
+                        <IconClose color={MainColorType.g02} width={rpxToPx(40)} height={rpxToPx(40)} />
+                    </NewButton>
+                </View>
+            </View>
             {
                 props.children
             }

src/_health/components/fast_sleep_console.tsx

@@ -7,7 +7,7 @@ import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
 import dayjs from "dayjs";
 import { MainColorType } from "@/context/themes/color";
 import showAlert from "@/components/basic/Alert";
-import { IconCellArrow, IconNotification, IconNotificationOff } from "@/components/basic/Icons";
+import { IconArrow, IconCellArrow, IconNotification, IconNotificationOff } from "@/components/basic/Icons";
 import { useSelector } from "react-redux";
 import { delRecord } from "@/services/health";
 import { TimeFormatter } from "@/utils/time_format";
@@ -247,7 +247,6 @@ export default function FastSleepConsole(props: { step: number, data: any, del:
         }
         return <View key={index}
             className="timeline_item"
-            // hoverClass='cell_hover' hoverStayTime={50}
             onClick={() => {
                 goDetail(index)
             }}>
@@ -328,7 +327,7 @@ export default function FastSleepConsole(props: { step: number, data: any, del:
                 </View>
             }
             {
-                !isError && item.action == 'POST_MOMENT' && item.timeline.real && <IconCellArrow color='#B2B2B2' width={rpxToPx(34)} />
+                !isError && item.action == 'POST_MOMENT' && item.timeline.real && <IconArrow color={MainColorType.g03} width={rpxToPx(34)} />
             }
             <View className="seperate_line" style={{ left: count - 1 == index ? -rpxToPx(52) : rpxToPx(52) }} />
         </View>

src/_health/components/no_data.tsx

@@ -5,7 +5,7 @@ import { MainColorType } from "@/context/themes/color";
 
 export default function NoData(){
     return <View className="no_more_bg">
-        <Image style={{width:160,height:160}} src={require('@assets/_health/null.png')}/>
+        <Image style={{width:rpxToPx(160),height:rpxToPx(160)}} src={require('@assets/_health/null.png')}/>
         <View style={{height:rpxToPx(40)}}/>
         <View className="h26" style={{color:MainColorType.g02}}>暂无数据</View>
     </View>

src/_health/components/onboard.scss

@@ -1,18 +1,26 @@
+.onboard_bg{
+    height: 344px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    position: relative;
+}
+
 .onboard_title{
     width: 590px;
     color: #000;
     font-size: 34px;
     text-align: center;
-    margin-top: 72px;
+    margin-top: 65px;
 }
 
 .onboard_desc{
     width: 590px;
     font-size: 26px;
-    line-height: 39px;
+    line-height: 40px;
     color: #B2B2B2;
     text-align: center;
     margin-bottom: 40px;
-    margin-top: 10px;
+    margin-top: 6px;
     
 }

src/_health/components/onboard.tsx

@@ -3,30 +3,22 @@ import { rpxToPx } from "@/utils/tools";
 import { View, Text } from "@tarojs/components";
 import { useSelector } from "react-redux";
 import './onboard.scss'
+import NewButton, { NewButtonType } from "../base/new_button";
 
 export default function OnBoard(props: { title: string, desc: string, btnTitle: string, onClick: any, color?: string }) {
     const health = useSelector((state: any) => state.health);
-    return <View style={{
-        display: 'flex',
-        flexDirection: 'column',
-        alignItems: 'center',
-        justifyContent: 'center',
-        position: 'relative'
-    }}>
+    return <View className="onboard_bg">
         <Text className="onboard_title">{props.title}</Text>
-        <Text className="onboard_desc">{props.desc}</Text>
-        <View onClick={props.onClick} style={{
-            display: 'flex',
-            flexDirection: 'column',
-            alignItems: 'center',
-            justifyContent: 'center',
-            color: '#fff',
-            backgroundColor: props.color ? props.color : getThemeColor(health.mode),
-            width: rpxToPx(374),
-            height: rpxToPx(72),
-            borderRadius: 9,
-            marginBottom: rpxToPx(72)
-        }}>{props.btnTitle}</View>
+        <Text className={health.mode=='ACTIVE'?"onboard_desc g01":"onboard_desc"} 
+        style={{fontSize:health.mode=='ACTIVE'?rpxToPx(24):rpxToPx(26)}}>{props.desc}</Text>
+        <NewButton
+            type={NewButtonType.fill}
+            color={props.color ? props.color : getThemeColor(health.mode)}
+            onClick={props.onClick}
+            title={props.btnTitle}
+            width={rpxToPx(374)}
+            height={rpxToPx(72)}
+        />
         <View className="border_footer_line" />
     </View>
 }

src/_health/components/post_moment_time.scss

@@ -2,14 +2,14 @@
     background-color: #fff;
     border-radius: 32px;
     overflow: hidden;
-    width: 670px;
+    width: 698px;
     display: flex;
     flex-direction: column;
     align-items: center;
 }
 
 .picker_time_card_header {
-    width: 670px;
+    width: 698px;
     height: 128px;
     display: flex;
     align-items: center;
@@ -19,7 +19,7 @@
 }
 
 .picker_time_card_footer {
-    width: 670px;
+    width: 698px;
     height: 128px;
     display: flex;
     align-items: center;

src/_health/components/post_moment_time.tsx

@@ -11,6 +11,8 @@ import NewDurationPicker from '../base/new_durationpicker';
 import NewButton, { NewButtonType } from '../base/new_button';
 import dayjs from 'dayjs';
 import Card from './card';
+import CellFooter, { CellFooterType } from '../base/cell_footer';
+import CellFooterText from '../base/cell_footer_text';
 
 let isYesterdayTarget = false
 export default function PostMomentTime(props: {
@@ -74,39 +76,43 @@ export default function PostMomentTime(props: {
     }
 
     function durationContent() {
-        return <Card>
-            <View style={{display:'flex',flexDirection:'column',alignItems:'center'}}>
-                <View className='picker_time_card_header'>
-                    <View style={{ width: rpxToPx(52) }} />
-                    <Text>Duration</Text>
-                    <View style={{ flex: 1 }} />
-                    <NewButton
-                        type={showDurationPicker ? NewButtonType.alpha : NewButtonType.gray}
-                        color={getThemeColor(health.mode)}
-                        title={durationTime()}
-                        height={rpxToPx(84)}
-                        onClick={() => {
-                            setShowDurationPicker(true)
-                        }}
-                    />
-                    <View style={{ width: rpxToPx(40) }} />
-                </View>
-                {
-                    showDurationPicker && <NewDurationPicker
-                        value={minutes}
-                        color={getThemeColor(health.mode)}
-                        onChange={(v) => {
-                            setMinutes(v)
-                        }} />
-                }
+        return <View style={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
+            <Card>
+                <View style={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
+                    <View className='picker_time_card_header'>
+                        <View style={{ width: rpxToPx(40) }} />
+                        <Text>Duration</Text>
+                        <View style={{ flex: 1 }} />
+                        <NewButton
+                            type={showDurationPicker ? NewButtonType.alpha : NewButtonType.gray}
+                            color={getThemeColor(health.mode)}
+                            title={durationTime()}
+                            height={rpxToPx(84)}
+                            onClick={() => {
+                                setShowDurationPicker(true)
+                            }}
+                        />
+                        <View style={{ width: rpxToPx(28) }} />
+                        <View className='border_footer_line' style={{ left: rpxToPx(40) }} />
+                    </View>
+                    {
+                        showDurationPicker && <NewDurationPicker
+                            value={minutes}
+                            color={getThemeColor(health.mode)}
+                            onChange={(v) => {
+                                setMinutes(v)
+                            }} />
+                    }
 
-                <View className='picker_time_card_footer'>
-                    <IconTarget width={rpxToPx(24)} color='#5C7099' />
-                    <Text style={{ color: '#5C7099', marginLeft: rpxToPx(12), fontSize: rpxToPx(26) }}>Expect to finish at {endTime()}</Text>
 
                 </View>
-            </View>
-        </Card>
+            </Card>
+            <CellFooter 
+                type={CellFooterType.center}
+            >
+                <CellFooterText text={`Expect to finish at ${endTime()}`}/>
+            </CellFooter>
+        </View>
     }
 
     function scheduleTime() {
@@ -166,7 +172,10 @@ export default function PostMomentTime(props: {
                         />
                         <View style={{ flex: 1 }} />
                         {
-                            !showDurationPicker && <View className='border_footer_line' />
+                            !showDurationPicker && <View className='border_footer_line' style={{
+                                left: rpxToPx(40),
+                                right: rpxToPx(40)
+                            }} />
                         }
                     </View>
                     {
@@ -196,22 +205,14 @@ export default function PostMomentTime(props: {
             </View>
 
         </Card>
-        <View style={{ marginTop: rpxToPx(36), display: 'flex', flexDirection: 'column', alignItems: showMore?'flex-start':'center' }}>
+        <View style={{ marginTop: rpxToPx(36), display: 'flex', flexDirection: 'column', alignItems: showMore ? 'flex-start' : 'center' }}>
             {
                 showMore ? durationContent() :
-                    <View
+                    <NewButton
                         onClick={() => setShowMore(true)}
-                        style={{
-                            flexDirection: 'row',
-                            width: rpxToPx(142),
-                            height: rpxToPx(72),
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center'
-                        }}>
-                        <Image style={{ width: rpxToPx(26), height: rpxToPx(26) }} src={require('@assets/_health/setting.png')} />
-                        <Text style={{ color: '#5C7099', marginLeft: rpxToPx(10) }}>More</Text>
-                    </View>
+                        type={NewButtonType.link}
+                        title='Show More'
+                    />
             }
 
         </View>

src/_health/components/schedule_item.tsx

@@ -94,7 +94,7 @@ export default function ScheduleItem(props: {
         ><View className='schedule_item' style={{
             width: rpxToPx(700),
             boxSizing: 'border-box',
-            backgroundColor: props.highlight ? getThemeColor(props.obj.window) + '08' : '#fff'
+            backgroundColor: props.highlight ? getThemeColor(props.obj.window) + '0D' : '#fff'
 
         }}>
                 <View className='item_left2'>

src/_health/pages/add_moment.scss

@@ -4,6 +4,10 @@
     height: 225px;
     font-size: 50px;
     margin-top: 16px;
+    width: 670px;
+    margin-bottom: 40px;
+    margin-left: -12px;
+    margin-right: -12px;
 }
 
 .save{

src/_health/pages/add_moment.tsx

@@ -46,7 +46,7 @@ export default function AddMoment() {
     const [timestamp, setTimestamp] = useState(new Date().getTime())
     const [showTimePicker, setShowTimePicker] = useState(false)
     const [showTitlePicker, setShowTitlePicker] = useState(false)
-    const [isYesterday,setIsYesterday] = useState(false)
+    const [isYesterday, setIsYesterday] = useState(false)
     const [labels, setLabels] = useState<any>([])
 
 
@@ -135,8 +135,8 @@ export default function AddMoment() {
         date.setHours(hour)
         date.setMinutes(minute)
         var timestamp1 = date.getTime()
-        if (isYesterday){
-            timestamp1 -=24*3600*1000
+        if (isYesterday) {
+            timestamp1 -= 24 * 3600 * 1000
         }
         debugger
 
@@ -333,7 +333,7 @@ export default function AddMoment() {
             <View className="addmoment_header">
                 <Text onClick={() => {
                     setShowTimePicker(true)
-                }} style={{ marginRight: 20, color: '#5C7099' }}>{time}</Text>
+                }} style={{ marginRight: rpxToPx(24), color: '#5C7099' }}>{time}</Text>
                 <Text
                     onClick={() => {
                         setShowTitlePicker(true)
@@ -366,16 +366,16 @@ export default function AddMoment() {
         </View>
 
 
-        <View className="save">
-            <NewButton
-                type={NewButtonType.fill}
-                color={getThemeColor(health.mode)}
-                width={rpxToPx(670)}
-                height={rpxToPx(96)}
-                title="发布"
-                onClick={save}
-            />
-        </View>
+        <View style={{flex:1}}/>
+
+        <View className="main_footer"><NewButton
+            type={NewButtonType.fill}
+            color={getThemeColor(health.mode)}
+            width={rpxToPx(646)}
+            height={rpxToPx(96)}
+            title="发布"
+            onClick={save}
+        /></View>
 
 
         {/* <View className="save" style={{ backgroundColor: getThemeColor(health.mode) }} onClick={save}>Save</View> */}
@@ -388,7 +388,7 @@ export default function AddMoment() {
                 isTemp={is_temp}
                 moment={moment}
                 onChange={(e) => {
-                    const { duration, time,isYesterday } = e;
+                    const { duration, time, isYesterday } = e;
                     setTime(time)
                     setIsYesterday(isYesterday)
                     setDurationT(duration)

src/_health/pages/archive.tsx

@@ -72,7 +72,7 @@ export default function Archive() {
         {
             list.map((item, index) => {
                 return <View ref={refDemo} id="demo1" key={index}>
-                    <HistoryItem data={item} index={index} isArchived={true} onClick={() => {
+                    <HistoryItem data={item} preData={index==0?null:list[index-1]} index={index} isArchived={true} mode={health.mode} onClick={() => {
                         jumpPage('/_health/pages/moment_detail')
                     }} refresh={refresh}/>
                     {/* {

src/_health/pages/guide_active.tsx

@@ -20,6 +20,8 @@ import ScheduleItem from "../components/schedule_item";
 import { useTranslation } from "react-i18next";
 import OnBoard from "../components/onboard";
 import showAlert from "@/components/basic/Alert";
+import CellFooter, { CellFooterType } from "../base/cell_footer";
+import CellFooterText from "../base/cell_footer_text";
 
 let useRoute;
 let useNavigation;
@@ -144,7 +146,7 @@ export default function GuideActive() {
                     return <ScheduleItem
                         key={i * 100}
                         obj={obj}
-                        highlight={highlight}
+                        highlight={highlight?obj.window=='ACTIVE':false}
                         showLine={i < items.length - 1}
                         errors={errors}
                         selMode={selMode}
@@ -206,7 +208,7 @@ export default function GuideActive() {
                     return <ScheduleItem
                         key={i * 100}
                         obj={obj}
-                        highlight={highlight}
+                        highlight={false}
                         showLine={i < items.length - 1}
                         errors={errors}
                         selMode={selMode}
@@ -257,8 +259,12 @@ export default function GuideActive() {
         {
             items()
         }
-        <View className="cell_footer_title bold h24" style={{ color: MainColorType.g02 }}>{footerTitle()}</View>
-        <View className="cell_footer_desc h24" style={{ color: MainColorType.g02 }}>{footerDesc()}</View>
+        <CellFooter type={CellFooterType.left}>
+            <View style={{display:'flex',flexDirection:'column'}}>
+                <CellFooterText text={footerTitle()} isBold/>
+                <CellFooterText text={footerDesc()} />
+            </View>
+        </CellFooter>
         <View style={{ height: 20, flexShrink: 0 }} />
         {
             fastSleepItems()

src/_health/pages/guide_eat.tsx

@@ -19,6 +19,8 @@ import AddLabel from "../components/add_label";
 import ScheduleItem from "../components/schedule_item";
 import { useTranslation } from "react-i18next";
 import showAlert from "@/components/basic/Alert";
+import CellFooter, { CellFooterType } from "../base/cell_footer";
+import CellFooterText from "../base/cell_footer_text";
 
 let useRoute;
 let useNavigation;
@@ -134,7 +136,7 @@ export default function GuideEat() {
                     return <ScheduleItem
                         key={i * 100}
                         obj={obj}
-                        highlight={highlight}
+                        highlight={highlight?obj.window=='EAT':false}
                         showLine={i < items.length - 1}
                         errors={errors}
                         selMode={selMode}
@@ -196,7 +198,7 @@ export default function GuideEat() {
                     return <ScheduleItem
                         key={i * 100}
                         obj={obj}
-                        highlight={highlight}
+                        highlight={false}
                         showLine={i < items.length - 1}
                         errors={errors}
                         selMode={selMode}
@@ -236,8 +238,12 @@ export default function GuideEat() {
         {
             items()
         }
-        <View className="cell_footer_title bold h24" style={{ color: MainColorType.g02 }}>{footerTitle()}</View>
-        <View className="cell_footer_desc h24" style={{ color: MainColorType.g02 }}>{footerDesc()}</View>
+        <CellFooter type={CellFooterType.left}>
+            <View style={{display:'flex',flexDirection:'column'}}>
+                <CellFooterText text={footerTitle()} isBold/>
+                <CellFooterText text={footerDesc()} />
+            </View>
+        </CellFooter>
         <View style={{ height: 20, flexShrink: 0 }} />
         {
             fastSleepItems()

src/_health/pages/guide_fast.tsx

@@ -16,6 +16,8 @@ import { MainColorType } from "@/context/themes/color";
 import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
 import ScheduleItem from "../components/schedule_item";
 import { useTranslation } from "react-i18next";
+import CellFooter, { CellFooterType } from "../base/cell_footer";
+import CellFooterText from "../base/cell_footer_text";
 
 export default function GuideFast() {
     const [loaded, setLoaded] = useState(false)
@@ -146,8 +148,12 @@ export default function GuideFast() {
         {
             items()
         }
-        <View className="cell_footer_title bold h24" style={{ color: MainColorType.g02 }}>{footerTitle()}</View>
-        <View className="cell_footer_desc h24" style={{ color: MainColorType.g02 }}>{footerDesc()}</View>
+        <CellFooter type={CellFooterType.left}>
+            <View style={{display:'flex',flexDirection:'column'}}>
+                <CellFooterText text={footerTitle()} isBold/>
+                <CellFooterText text={footerDesc()} />
+            </View>
+        </CellFooter>
         <View style={{ flex: 1 }} />
         <View className="main_footer">
             <NewButton

src/_health/pages/guide_full.tsx

@@ -16,6 +16,8 @@ import { MainColorType } from "@/context/themes/color";
 import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
 import ScheduleItem from "../components/schedule_item";
 import { useTranslation } from "react-i18next";
+import CellFooter, { CellFooterType } from "../base/cell_footer";
+import CellFooterText from "../base/cell_footer_text";
 
 export default function GuideFull() {
     const health = useSelector((state: any) => state.health);
@@ -81,7 +83,11 @@ export default function GuideFull() {
         {
             items()
         }
-        <View className="cell_footer_desc h24" style={{ color: MainColorType.g02 }}>{footerDesc()}</View>
+        <CellFooter type={CellFooterType.left}>
+            <View style={{display:'flex',flexDirection:'column'}}>
+                <CellFooterText text={footerDesc()} />
+            </View>
+        </CellFooter>
         <View style={{height:300,flexShrink:0}}/>
         <View style={{flex:1}}/>
         <View className="main_footer">

src/_health/pages/guide_sleep.tsx

@@ -16,6 +16,8 @@ import { MainColorType } from "@/context/themes/color";
 import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
 import ScheduleItem from "../components/schedule_item";
 import { useTranslation } from "react-i18next";
+import CellFooter, { CellFooterType } from "../base/cell_footer";
+import CellFooterText from "../base/cell_footer_text";
 
 export default function GuideSleep() {
     const health = useSelector((state: any) => state.health);
@@ -90,7 +92,7 @@ export default function GuideSleep() {
                     return <ScheduleItem
                         key={i * 100}
                         obj={obj}
-                        highlight={highlight}
+                        highlight={highlight?obj.window=='SLEEP':false}
                         showLine={i < items.length - 1}
                         errors={errors}
                         selMode={selMode}
@@ -119,8 +121,12 @@ export default function GuideSleep() {
         {
             items()
         }
-        <View className="cell_footer_title bold h24" style={{ color: MainColorType.g02 }}>{footerTitle()}</View>
-        <View className="cell_footer_desc h24" style={{ color: MainColorType.g02 }}>{footerDesc()}</View>
+        <CellFooter type={CellFooterType.left}>
+            <View style={{display:'flex',flexDirection:'column'}}>
+                <CellFooterText text={footerTitle()} isBold/>
+                <CellFooterText text={footerDesc()} />
+            </View>
+        </CellFooter>
         <View style={{ flex: 1 }} />
         <View className="main_footer">
             <NewButton

src/_health/pages/log_time.tsx

@@ -399,6 +399,8 @@ export default function LogTime() {
                 setConflicts([])
                 if (!onlyCheck) {
                     global.refreshWindow()
+                    if (global.refreshHistory)
+                        global.refreshHistory()
                     if (global.refreshFastSleep)
                         global.refreshFastSleep()
                     Taro.redirectTo({
@@ -560,7 +562,7 @@ export default function LogTime() {
         return <View style={{ position: 'relative' }}>
             <View className="card_header">
                 {
-                    showError && <View className="error_icon_bg">
+                    showError && !isSingle && <View className="error_icon_bg">
                         <Image src={require('@assets/_health/tip_error.png')} style={{ width: rpxToPx(26), height: rpxToPx(26) }} />
                     </View>
 

src/_health/pages/long_fast.tsx

@@ -215,15 +215,19 @@ export default function LongFast() {
     function moment() {
         if (long_fast.timeline[0].moment) {
             const moment = long_fast.timeline[0].moment
-            return <View style={{ marginTop: rpxToPx(22), display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'center' }}>
+            return <View style={{
+                marginTop: rpxToPx(22), display: 'flex',
+                flexDirection: 'row', alignItems: 'center',
+                justifyContent: 'center',
+            }}>
                 {
                     moment.media && moment.media.length > 0 && <Image
                         src={moment.media[0].url}
                         mode="aspectFill"
                         style={{ width: rpxToPx(28), height: rpxToPx(28), borderRadius: rpxToPx(4) }} />
                 }
-                <Text className="h20" style={{ marginLeft: rpxToPx(12), marginRight: 10, color: MainColorType.g02 }}>{moment.description} · {TimeFormatter.dateDescription(moment.time.timestamp, true)}</Text>
-                <Text className="h20" style={{ marginLeft: rpxToPx(12), color: MainColorType.g02 }}></Text>
+                <Text className="h20" style={{ marginLeft: rpxToPx(12),  color: MainColorType.g02 }}>{moment.description} · {TimeFormatter.dateDescription(moment.time.timestamp, true)}</Text>
+                {/* <Text className="h20" style={{ marginLeft: rpxToPx(12), color: MainColorType.g02 }}></Text> */}
             </View>
         }
         return <View />

src/_health/pages/long_fast_setting.tsx

@@ -68,7 +68,7 @@ export default function LongFastSetting() {
     }
     return <View className="page_container">
         <Card>
-            <View style={{ position: 'relative',display:'flex',flexDirection:'column',alignItems:'center' }}>
+            <View >
                 <View className="long_fast_card_header">
                     <View className="h34">Goal</View>
                     <View style={{ flex: 1 }} />
@@ -83,15 +83,18 @@ export default function LongFastSetting() {
                         }}
                     />
                 </View>
-                {
-                    showGoal && <NewDurationPicker color={MainColorType.fast}
-                        type={DurationPickerType.long}
-                        value={duration}
-                        onChange={(e) => {
-                            setDuration(e)
-                        }}
-                    />
-                }
+                <View style={{display:'flex',alignItems:'center',justifyContent:'center'}}>
+                    {
+                        showGoal && <NewDurationPicker color={MainColorType.fast}
+                            type={DurationPickerType.long}
+                            value={duration}
+                            onChange={(e) => {
+                                setDuration(e)
+                            }}
+                        />
+                    }
+                </View>
+
                 <View className="long_fast_card_footer">
                     <View className="h26" style={{ color: MainColorType.g02 }}>Expect to break fast at 10:00 tomorrow</View>
                 </View>
@@ -101,7 +104,7 @@ export default function LongFastSetting() {
         </Card>
         <View style={{ height: rpxToPx(36) }} />
         <Card>
-            <View style={{ display:'flex',flexDirection:'column',alignItems:'center' }}>
+            <View >
                 <View className="long_fast_card_header">
                     <View className="h34">Starts</View>
                     <View style={{ flex: 1 }} />
@@ -133,8 +136,8 @@ export default function LongFastSetting() {
                 }
             </View>
         </Card>
-        <View style={{ flex: 1 }} />
-        <View style={{ marginBottom: rpxToPx(128), alignItems: 'center', justifyContent: 'center' }}>
+        {/* <View style={{ flex: 1 }} /> */}
+        <View className="main_footer">
             <NewButton type={NewButtonType.fill}
                 color={MainColorType.fast}
                 width={rpxToPx(670)}

src/_health/pages/move.scss

@@ -198,7 +198,7 @@
 .history_header {
     display: flex;
     height: 108px;
-    margin-left: 52px;
+    padding-left: 52px;
     position: relative;
     flex-direction: row;
     align-items: center;

src/_health/pages/move.tsx

@@ -364,13 +364,6 @@ export default function Move() {
         return <View className="summary">
             <View className="summary_header">
                 <Text className="h34 bold">Last {hours.length} Hour{hours.length == 1 ? '' : 's'}</Text>
-                {/* <Image className="arrow_hide"
-                    onClick={() => {
-                        setHideCurrentRecent(!hideCurrentRecent)
-                    }}
-                    src={hideCurrentRecent ? require('@assets/_health/arrow_down.png') : require('@assets/_health/arrow_up.png')} />
-                <View style={{ flex: 1 }} />
-                <Text style={{ color: getThemeColor(health.mode) }}>{process()}</Text> */}
                 <View className="border_footer_line" />
             </View>
             {
@@ -387,9 +380,6 @@ export default function Move() {
                     }
                     {
                         hours.length > 3 && <View className="recent_btn_bg">
-                            {/* {
-                                moreActive ? <View className="recent_btn" onClick={() => setMoreActive(false)}>收起</View> : <View className="recent_btn" onClick={() => setMoreActive(true)}>展开剩余{hours.length - 3}条</View>
-                            } */}
                             <View style={{ height: rpxToPx(68), minWidth: rpxToPx(200), display: 'flex' }}>
                                 <NewButton
                                     onClick={() => {
@@ -737,7 +727,7 @@ export default function Move() {
                                 <Image className="history_item_detail_icon" src={require('@assets/_health/walk.png')} />
                                 <Text style={{ fontSize: rpxToPx(26) }}> Hours Active {item.active_hours} · Total Steps {item.stat.real_steps}</Text>
                             </View>
-                            <View className="border_footer_line" />
+                            {/* <View className="border_footer_line" /> */}
                         </View>
                     })
                 }

src/_health/pages/schedules.tsx

@@ -371,7 +371,7 @@ export default function Schedules() {
                         return <ScheduleItem
                             key={i * 100}
                             obj={obj}
-                            highlight={highlight}
+                            highlight={false}
                             showLine={i < list.length - 1}
                             errors={errors}
                             selMode={selMode}

src/_health/pages/timeline_detail.scss

@@ -74,6 +74,8 @@
     margin-left:-72px;
     margin-right:-72px;
     box-sizing: border-box;
+    // margin-bottom: constant(safe-area-inset-bottom);
+    // margin-bottom: env(safe-area-inset-bottom);
 }
 
 .album{
@@ -107,6 +109,8 @@
 .myTextarea{
     line-height: 72px;
     font-size: 48px;
-    width: 606px;
+    // width: 606px;
+    width: 630px;
+    // background-color: red;
     color: #fff;
 }

src/_health/pages/timeline_detail.tsx

@@ -32,7 +32,7 @@ export default function TimelineDetail() {
     const [btnDisable, setBtnDisable] = useState(true)
     const [showPop, setShowPop] = useState(false)
     const [publish, setPublish] = useState<any>(null)
-    const [bottom, setBottom] = useState(0)
+    const [bottom, setBottom] = useState(20)
     const [loaded, setLoaded] = useState(false)
     let router
     let navigation;
@@ -58,7 +58,7 @@ export default function TimelineDetail() {
 
     useEffect(() => {
         Taro.onKeyboardHeightChange(res => {
-            setBottom(res.height)
+            setBottom(res.height>0?res.height:20)
         })
 
         getDatas()

src/app.scss

@@ -389,23 +389,13 @@ page {
     bottom: 0;
 }
 
-//历史记录 首页、
-.seperate_light_line {
-    height: 2px;
-    transform: scaleY(0.5);
-    background-color: #B2B2B2;
-    opacity: 0.2;
-    position: absolute;
-    left: 0;
-    right: 0;
-    bottom: 0;
-}
 
 .border_footer_line {
     height: 2px;
     transform: scaleY(0.5);
-    background-color: #B2B2B2;
-    opacity: 0.4;
+    // background-color: red;
+    background-color: #000;
+    opacity: 0.1;
     position: absolute;
     left: 0;
     right: 0;
@@ -541,4 +531,24 @@ page {
 
 .cell_footer_desc {
     margin-left: 52px;
+}
+
+.g01 {
+    color: #595959
+}
+
+.g02 {
+    color: #b2b2b2
+}
+
+.g03 {
+    color: #d9d9d9
+}
+
+.g04 {
+    color: #f0f0f0
+}
+
+.g05 {
+    color: #f5f5f5
 }

src/components/navigation/TabBar.scss

@@ -9,15 +9,15 @@
     height: 103px;
     flex-direction: row;
     justify-content: space-around;
-    background-color: #fff;
+    background-color: #f5f5f5;
     // background-color: #000;
     // background-color: red;
     padding-bottom: constant(safe-area-inset-bottom);
     /* 兼容 iOS < 11.2 */
     padding-bottom: env(safe-area-inset-bottom);
-    border-top-color: rgba(178,178,178,0.2);
-    border-top-width: 1px;
-    border-top-style: solid;
+    // border-top-color: rgba(178,178,178,0.2);
+    // border-top-width: 1px;
+    // border-top-style: solid;
     z-index: 100;
 }
 

src/components/navigation/TabBar.tsx

@@ -4,6 +4,7 @@ import Taro from '@tarojs/taro';
 import { useState } from 'react';
 import { useSelector } from 'react-redux';
 import { ColorType } from '@/context/themes/color';
+import { rpxToPx } from '@/utils/tools';
 
 export default function Component(props: { index: number }) {
     const common = useSelector((state: any) => state.common);
@@ -47,6 +48,9 @@ export default function Component(props: { index: number }) {
     }
 
     return <View className='tabbar'>
+        <View style={{position:'absolute',left:0,top:0,width:rpxToPx(750)}}>
+            <View className='border_footer_line'/>
+        </View>
         <View className={selIndex == 0 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(0)}>
             <Image className='tabbar-icon' src={selIndex == 0 ?require('@assets/_health/home_sel.png'):require('@assets/_health/home.png')}/>
         </View>

src/context/themes/color.tsx

@@ -39,10 +39,10 @@ export enum MainColorType {
     white = '#ffffff',
 
     //gray
-    g01 = '#959595',
+    g01 = '#595959',
     g02 = '#b2b2b2',
     g03 = '#d9d9d9',
-    g04 = '#e5e5e5',
+    g04 = '#f0f0f0',
     g05 = '#f5f5f5',
 
 

src/features/health/History.scss

@@ -7,6 +7,7 @@
     box-sizing: border-box;
     position: relative;
     background-color: #fff;
+    flex-shrink: 0;
 }
 
 .history_ring {
@@ -23,6 +24,7 @@
     margin-right: 24px;
     width: 74px;
     height: 68px;
+    flex-shrink: 0;
     align-items: center;
     justify-content: center;
     display: flex;
@@ -103,7 +105,7 @@
     background-color: #F5F5F5;
     height: 68px;
     padding-left: 20px;
-    width: 572px;
+    // width: 572px;
 }
 
 .archive{

src/features/health/HistoryItem.tsx

@@ -127,13 +127,13 @@ export default function HistoryItem(props: {
 
     function historyDate() {
         if (!props.preData) {
-            return dayjs(props.data.window_range.start_timestamp).format('D')
+            return dayjs(props.data.window_range.start_timestamp).format('DD')
         }
-        if (dayjs(props.data.window_range.start_timestamp).format('D') ==
-            dayjs(props.preData.window_range.start_timestamp).format('D')) {
+        if (dayjs(props.data.window_range.start_timestamp).format('MM-DD') ==
+            dayjs(props.preData.window_range.start_timestamp).format('MM-DD')) {
             return ''
         }
-        return dayjs(props.data.window_range.start_timestamp).format('D')
+        return dayjs(props.data.window_range.start_timestamp).format('DD')
     }
 
     function tapDel() {
@@ -180,10 +180,10 @@ export default function HistoryItem(props: {
     }
 
     return <View className="history_item2">
-        <View className="history_date">{historyDate()}</View>
-        <View className="history_content">
+        <View className="history_date" >{historyDate()}</View>
+        <View className="history_content" >
 
-            <View style={{ display: 'flex', flexDirection: 'column', marginBottom: rpxToPx(12), width: rpxToPx(600) }}>
+            <View style={{ display: 'flex', flexDirection: 'column', marginBottom: rpxToPx(12), flex:1 }}>
                 {
                     props.data.events.map((item, index) => {
                         return <Text key={index}>
@@ -276,6 +276,6 @@ export default function HistoryItem(props: {
             </View>
         </View>
 
-        <View className="seperate_light_line" />
+        <View className="border_footer_line" />
     </View>
 }

src/features/health/MainCard.scss

@@ -129,7 +129,6 @@
 
 .window_name {
     margin-top: 16px;
-    color: #B2B2B2;
     font-weight: bold;
     font-size: 28px;
     line-height: 42px;
@@ -155,7 +154,6 @@
 .main_date{
     margin-top: 12px;
     margin-bottom: 60px;
-    color: #B2B2B2;
     font-size: 30px;
 }
 

src/features/health/MainConsole.scss

@@ -1,11 +1,14 @@
 .timeline_item {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    padding-right: 40px;
-    position: relative;
-    padding-left: 52px;
-    background-color: #fff;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding-right: 40px;
+  position: relative;
+  padding-left: 52px;
+  background-color: #fff;
+  width: 750px;
+  box-sizing: border-box;
+  height: 172px;
 }
 
 .cell_hover {
@@ -13,208 +16,217 @@
 }
 
 .timeline_left {
-    display: flex;
-    flex-direction: column;
-    width: 300px;
+  display: flex;
+  flex-direction: column;
+  // width: 300px;
+  flex:1;
+  overflow: hidden;
 }
 
 .timeline_time {
-    font-size: 24px;
-    line-height: 36px;
-    color: #999999;
-    overflow: hidden;
-    width: 500px;
-    white-space: nowrap;
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    overflow: hidden;
-    -webkit-line-clamp: 1; // 限制为一行
-    text-overflow: ellipsis; // 超出部分显示省略号
+  font-size: 24px;
+  line-height: 36px;
+  overflow: hidden;
+  width: 500px;
+  white-space: nowrap;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  -webkit-line-clamp: 1; // 限制为一行
+  text-overflow: ellipsis; // 超出部分显示省略号
 }
 
 .timeline_title {
   font-size: 34px;
-  color: #999;
+  color: #000;
   line-height: 46px;
-  
+
 }
 
 .timeline_desc {
-    font-size: 24px;
-    line-height: 34px;
-    width: 500px;
-    color: #B2B2B2;
-    white-space: nowrap;
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    overflow: hidden;
-    -webkit-line-clamp: 1; // 限制为一行
-    text-overflow: ellipsis; // 超出部分显示省略号
+  font-size: 24px;
+  line-height: 34px;
+  // width: 500px;
+  flex:1;
+  color: #B2B2B2;
+  // white-space: nowrap;
+  // display: -webkit-box;
+  // -webkit-box-orient: vertical;
+  // overflow: hidden;
+  // -webkit-line-clamp: 1; // 限制为一行
+  // text-overflow: ellipsis; // 超出部分显示省略号
+  white-space: nowrap;
+  /* 不换行 */
+  overflow: hidden;
+  /* 隐藏超出部分 */
+  text-overflow: ellipsis;
+  /* 显示省略号 */
 }
 
 .timeline_thirdspace {
-    height: 12px;
-    margin-top: 5px;
+  height: 12px;
+  margin-top: 5px;
 }
 
 
 
 .timeline_operate {
-    height: 72px;
-    border-radius: 18px;
-    font-size: 30px;
-    font-weight: bold;
-    width: 128px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-shrink: 0;
+  height: 72px;
+  border-radius: 18px;
+  font-size: 30px;
+  font-weight: bold;
+  width: 128px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
 }
 
 .main-console-bg {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
 }
 
 .main_arrow {
-    width: 228px;
-    height: 36px;
+  width: 228px;
+  height: 36px;
 }
 
 .main_summary {
-    display: flex;
-    width: 750px;
-    background-color: #fff;
-    position: relative;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
+  display: flex;
+  width: 750px;
+  background-color: #fff;
+  position: relative;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
 }
 
 .main_summary_time {
-    font-size: 36px;
-    color: #000;
-    height: 48px;
-    line-height: 48px;
-    min-width: 150px;
-    align-items: center;
-    justify-content: center;
-    display: flex;
-    position: relative;
+  font-size: 36px;
+  color: #000;
+  height: 48px;
+  line-height: 48px;
+  min-width: 150px;
+  align-items: center;
+  justify-content: center;
+  display: flex;
+  position: relative;
 }
 
 .time_point {
-    width: 12px;
-    height: 12px;
-    position: absolute;
-    border-radius: 6px;
-    background-color: blue;
-    position: absolute;
-    left: -12px;
-    top: 18px;
+  width: 12px;
+  height: 12px;
+  position: absolute;
+  border-radius: 6px;
+  background-color: blue;
+  position: absolute;
+  left: -12px;
+  top: 18px;
 }
 
 .time_point_animation {
-    animation: scaleFade 2s infinite;
+  animation: scaleFade 2s infinite;
 }
 
 @keyframes scaleFade {
-    0% {
-        transform: scale(1);
-        opacity: 1;
-    }
-
-    50% {
-        transform: scale(0.7);
-        opacity: 0.7;
-    }
-
-    100% {
-        transform: scale(1);
-        opacity: 1;
-    }
+  0% {
+    transform: scale(1);
+    opacity: 1;
+  }
+
+  50% {
+    transform: scale(0.7);
+    opacity: 0.7;
+  }
+
+  100% {
+    transform: scale(1);
+    opacity: 1;
+  }
 }
 
 .main_summary_duration {
-    color: #B2B2B2;
-    font-size: 24px;
-    line-height: 36px;
-    height: 36px;
+  color: #B2B2B2;
+  font-size: 24px;
+  line-height: 36px;
+  height: 36px;
 }
 
 .main_summary_status {
-    display: flex;
-    position: absolute;
-    left: 64px;
-    top: 0;
-    bottom: 0;
-    flex-direction: row;
-    align-items: center;
+  display: flex;
+  position: absolute;
+  left: 64px;
+  top: 0;
+  bottom: 0;
+  flex-direction: row;
+  align-items: center;
 }
 
 .main_footer2 {
-    height: 128px;
-    width: 750px;
-    background-color: #fff;
-    align-items: center;
-    justify-content: center;
-    display: flex;
-    position: relative;
+  height: 128px;
+  width: 750px;
+  background-color: #fff;
+  align-items: center;
+  justify-content: center;
+  display: flex;
+  position: relative;
 }
 
 .main_footer_more {
-    position: absolute;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    top: 0;
-    height: 108px;
-    right: 0;
-    width: 114px;
+  position: absolute;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  top: 0;
+  height: 108px;
+  right: 0;
+  width: 114px;
 }
 
 .main_footer_text {
-    color: #B2B2B2;
-    font-size: 24px;
+  color: #B2B2B2;
+  font-size: 24px;
 }
 
 .console_item_img {
-    width: 76px;
-    height: 76px;
-    border-radius: 12px;
+  width: 76px;
+  height: 76px;
+  border-radius: 12px;
+  margin-left: 40px;
 }
 
 .notification_icon {
-    width: 34px;
-    height: 34px;
-    margin-right: 12px;
-    flex-shrink: 0;
+  width: 34px;
+  height: 34px;
+  margin-right: 12px;
+  flex-shrink: 0;
 }
 
 .console_active {
-    background-color: #fff;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    height: 128px;
-    width: 750px;
-    padding-left: 40px;
-    padding-right: 40px;
-    box-sizing: border-box;
-    position: relative;
+  background-color: #fff;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  height: 128px;
+  width: 750px;
+  padding-left: 40px;
+  padding-right: 40px;
+  box-sizing: border-box;
+  position: relative;
 }
 
 .active_icon {
-    width: 48px;
-    height: 48px;
-    margin-right: 12px;
+  width: 48px;
+  height: 48px;
+  margin-right: 12px;
 }
 
 .active_text {
-    color: #000000;
-    font-size: 34px;
-    flex: 1;
+  color: #000000;
+  font-size: 34px;
+  flex: 1;
 }
 
 /*

src/features/health/MainConsole.tsx

@@ -24,6 +24,7 @@ import OnBoard from "@/_health/components/onboard";
 import NewButton, { NewButtonType } from "@/_health/base/new_button";
 import showAlert from "@/components/basic/Alert";
 import { useTranslation } from "react-i18next";
+import Cell from "@/_health/base/cell";
 
 let useNavigation;
 let min = 0
@@ -191,8 +192,6 @@ export default function MainConsole(props: { type: WindowType }) {
                     height={rpxToPx(72)}
                     bold={true}
                     onClick={() => record(item)} />
-                // return <View className="timeline_operate" style={{ color: themeColor, backgroundColor: '#fff', borderColor: themeColor, borderWidth: 1, borderStyle: 'solid' }} 
-                // onClick={() => record(item)}>{operateTitle(item)}</View>
             }
             return <NewButton
                 color={themeColor}
@@ -205,14 +204,33 @@ export default function MainConsole(props: { type: WindowType }) {
         }
 
         if (item.action && item.action == 'NA') {
-            if (health.mode == 'FAST' || health.mode == 'SLEEP') {
+            // if (health.mode == 'FAST' || health.mode == 'SLEEP') {
+            if (item.moment && item.moment.media && item.moment.media.length > 0) {
+
+            }
+            else {
                 return <IconArrow width={rpxToPx(34)} color={MainColorType.g03} />
             }
+
+            // }
         }
 
         return <View />
     }
 
+    function canTap(item) {
+        if (health.mode == 'DAY' || health.mode == 'NIGHT') {
+            return false;
+        }
+        if (!user.isLogin) {
+            return false
+        }
+        if (!item.event_id) {
+            return false
+        }
+        return true
+    }
+
     function tapTimeline(item, inex) {
         if (health.mode == 'DAY' || health.mode == 'NIGHT') {
             return;
@@ -260,63 +278,61 @@ export default function MainConsole(props: { type: WindowType }) {
 
     function timelineItem(item: any, index: number, count: number) {
         var hasDescription = item.moment && item.moment.description
-        return <View key={index}
-            className="timeline_item"
-            // hoverClass='cell_hover' hoverStayTime={50}
-            onClick={() => tapTimeline(item, index)}>
-            <View className="timeline_left">
-                {/* space */}
-                <View style={{
-
-                    height: hasDescription ? rpxToPx(28) : rpxToPx(36), flexShrink: 0
-                }} />
-                <View style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
+        return <Cell onClick={() => tapTimeline(item, index)} disable={!canTap(item)}>
+            <View key={index}
+                className="timeline_item"
+                style={{ backgroundColor: 'transparent' }}>
+                <View className="timeline_left">
                     <View style={{
-                        flexShrink: 0,
-                        width: rpxToPx(26),
-                        height: rpxToPx(26),
-                        borderRadius: rpxToPx(13),
-                        marginRight: rpxToPx(8),
-                        display: 'flex',
-                        alignItems: 'center',
-                        justifyContent: 'center',
-                        backgroundColor: getIconColor(index)
-                    }}>
-                        {
-                            processIcon(index)
-                        }
-                        {/* <Image style={{ width: rpxToPx(20), height: rpxToPx(20) }} src={finish ? require('@assets/_health/checked.png') : require('@assets/_health/ring.png')} /> */}
+
+                        height: hasDescription ? rpxToPx(28) : rpxToPx(36), flexShrink: 0
+                    }} />
+                    <View style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
+                        <View style={{
+                            flexShrink: 0,
+                            width: rpxToPx(26),
+                            height: rpxToPx(26),
+                            borderRadius: rpxToPx(13),
+                            marginRight: rpxToPx(8),
+                            display: 'flex',
+                            alignItems: 'center',
+                            justifyContent: 'center',
+                            backgroundColor: getIconColor(index)
+                        }}>
+                            {
+                                processIcon(index)
+                            }
+                        </View>
+                        <Text className="timeline_time" style={{ color: MainColorType.g01 }}>{itemTitle(item)}</Text>
                     </View>
-                    <Text className="timeline_time">{itemTitle(item)}</Text>
-                </View>
 
 
-                <Text className="timeline_title"
-                    onClick={() => edit(item)}>{(item.moment && item.moment.title) ? item.moment.title : item.title}</Text>
+                    <Text className="timeline_title"
+                        onClick={() => edit(item)}>{(item.moment && item.moment.title) ? item.moment.title : item.title}</Text>
 
-                {
-                    hasDescription && <Text className="timeline_desc">{item.moment.description}</Text>
-                }
-                {/* space */}
-                <View style={{
-                    height: hasDescription ? rpxToPx(28) : rpxToPx(54), flexShrink: 0,
+                    {
+                        hasDescription && <Text className="timeline_desc" style={{ color: MainColorType.g02 }}>{item.moment.description}</Text>
+                    }
+                    {/* space */}
+                    <View style={{
+                        height: hasDescription ? rpxToPx(28) : rpxToPx(54), flexShrink: 0,
 
-                }} />
+                    }} />
 
-            </View>
-            <View style={{ flex: 1 }} />
+                </View>
 
-            {
-                item.moment && item.moment.media && item.moment.media.length > 0 && <Image
-                    src={item.moment.media[0].url}
-                    mode="aspectFill"
-                    className="console_item_img" />
-            }
-            {
-                itemValue(item)
-            }
-            <View className="seperate_line" style={{ left: count - 1 == index ? -rpxToPx(52) : rpxToPx(52) }} />
-        </View>
+                {
+                    item.moment && item.moment.media && item.moment.media.length > 0 && <Image
+                        src={item.moment.media[0].url}
+                        mode="aspectFill"
+                        className="console_item_img" />
+                }
+                {
+                    itemValue(item)
+                }
+                <View className="border_footer_line" style={{ left: count - 1 == index ? -rpxToPx(52) : rpxToPx(52) }} />
+            </View>
+        </Cell>
     }
 
     function timeContent() {
@@ -620,36 +636,36 @@ export default function MainConsole(props: { type: WindowType }) {
                 if (active.onboard == false) {
                     var seconds = new Date().getSeconds()
 
-                    return <Swiper autoplay>
-                        {
-                            list.map((item, index) => {
-                                return <SwiperItem key={index}>
-                                    <OnBoard title={item.title}
-                                        desc={item.time_label}
-                                        btnTitle="Action"
-                                        onClick={() => {
-                                            if (!user.isLogin) {
-                                                jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
-                                                return
-                                            }
-                                            jumpPage('/_health/pages/active_plan?schedule=' + JSON.stringify(item))
-                                        }}
-                                    />
-                                </SwiperItem>
-                            })
-                        }
-                    </Swiper>
-                    // return <OnBoard title={list[0].title}
-                    //     desc="Subtitle"
-                    //     btnTitle="Action"
-                    //     onClick={() => {
-                    //         if (!user.isLogin) {
-                    //             jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
-                    //             return
-                    //         }
-                    //         jumpPage('/_health/pages/active_plan?schedule=' + JSON.stringify(list.length > 0 ? list[0] : '{}'))
-                    //     }}
-                    // />
+                    // return <Swiper autoplay>
+                    //     {
+                    //         list.map((item, index) => {
+                    //             return <SwiperItem key={index}>
+                    //                 <OnBoard title={item.title}
+                    //                     desc={item.time_label}
+                    //                     btnTitle="Action"
+                    //                     onClick={() => {
+                    //                         if (!user.isLogin) {
+                    //                             jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
+                    //                             return
+                    //                         }
+                    //                         jumpPage('/_health/pages/active_plan?schedule=' + JSON.stringify(item))
+                    //                     }}
+                    //                 />
+                    //             </SwiperItem>
+                    //         })
+                    //     }
+                    // </Swiper>
+                    return <OnBoard title={list[0].title}
+                        desc={list[0].time_label}
+                        btnTitle="Action"
+                        onClick={() => {
+                            if (!user.isLogin) {
+                                jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
+                                return
+                            }
+                            jumpPage('/_health/pages/active_plan?schedule=' + JSON.stringify(list.length > 0 ? list[0] : '{}'))
+                        }}
+                    />
                 }
                 break;
         }
@@ -732,7 +748,6 @@ export default function MainConsole(props: { type: WindowType }) {
             return
         }
         var scenario = getScenario(health.windows, health.mode)
-        debugger
         Taro.chooseLocation({
             latitude: scenario.extra.choose_location ? parseFloat(scenario.extra.lat + '') : undefined,
             longitude: scenario.extra.choose_location ? parseFloat(scenario.extra.lng + '') : undefined,
@@ -831,7 +846,7 @@ export default function MainConsole(props: { type: WindowType }) {
             {/* <View className="main_summary_status" style={{ color: getThemeColor(health.mode) }}>{windowStatus()}</View> */}
             <View className="main_summary_time bold" style={{
                 marginTop: rpxToPx(14),
-                color: getWindowStatus(health.windows, health.mode) == WindowStatusType.upcoming ? '#B2B2B2' : '#000'
+                color: getWindowStatus(health.windows, health.mode) == WindowStatusType.upcoming ? '#000' : '#000'
             }} >{getCountownTime(health.windows, health.mode)}
                 <View className={timePointClass()}
                     style={{ backgroundColor: getWindowStatus(health.windows, health.mode) == WindowStatusType.upcoming ? '#B2B2B2' : getThemeColor(health.mode) }} />
@@ -876,24 +891,26 @@ export default function MainConsole(props: { type: WindowType }) {
         {
             health.mode == 'ACTIVE' && <View>
                 <View className="main_column_space" />
-                <View className="console_active" onClick={() => {
+                <Cell onClick={() => {
                     if (!user.isLogin) {
                         jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
                         return
                     }
                     jumpPage('/_health/pages/move')
                 }}>
-                    <Image className="active_icon" src={require('@assets/_health/walk.png')} />
-                    <Text className="active_text">Move More</Text>
-                    <IconArrow width={rpxToPx(34)} color={MainColorType.g03} />
-                </View>
-
+                    <View className="console_active" style={{ backgroundColor: 'transparent' }}>
+                        <Image className="active_icon" src={require('@assets/_health/walk.png')} />
+                        <Text className="active_text">Move More</Text>
+                        <IconArrow width={rpxToPx(34)} color={MainColorType.g03} />
+                    </View>
+                </Cell>
             </View>
+
         }
         {
             (health.mode == 'FAST' || health.mode == 'SLEEP') && <View >
                 <View className="main_column_space" />
-                <View className="console_active" onClick={() => {
+                <Cell onClick={() => {
                     if (!user.isLogin) {
                         jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
                         return
@@ -916,51 +933,54 @@ export default function MainConsole(props: { type: WindowType }) {
                     }
                     jumpPage('/_health/pages/fast_sleep')
                 }}>
-                    <Image className="active_icon" src={require('@assets/_health/fast.png')} />
-                    <Text className="h34">Fast with sleep</Text>
-                    <View style={{ flex: 1 }} />
-                    {
-                        fastWithSleepStatus()
-                    }
-                    {
-                        health.fast_with_sleep.status == 'OG2_MISALIGNED' && <View style={{
-                            backgroundColor: MainColorType.error,
-                            width: rpxToPx(12),
-                            height: rpxToPx(12),
-                            borderRadius: rpxToPx(6),
-                            marginLeft: rpxToPx(12),
-                            marginRight: rpxToPx(12)
-                        }} />
-                    }
-                    <View style={{ width: rpxToPx(12) }} />
-                    <IconArrow width={rpxToPx(34)} color={MainColorType.g03} />
-                    {
-                        health.mode == 'FAST' && <View className="border_footer_line" style={{ left: rpxToPx(100) }} />
-                    }
-                </View>
+                    <View className="console_active" style={{ backgroundColor: 'transparent' }}>
+                        <Image className="active_icon" src={require('@assets/_health/fast.png')} />
+                        <Text className="h34">Fast with sleep</Text>
+                        <View style={{ flex: 1 }} />
+                        {
+                            fastWithSleepStatus()
+                        }
+                        {
+                            health.fast_with_sleep.status == 'OG2_MISALIGNED' && <View style={{
+                                backgroundColor: MainColorType.error,
+                                width: rpxToPx(12),
+                                height: rpxToPx(12),
+                                borderRadius: rpxToPx(6),
+                                marginLeft: rpxToPx(12),
+                                marginRight: rpxToPx(12)
+                            }} />
+                        }
+                        <View style={{ width: rpxToPx(12) }} />
+                        <IconArrow width={rpxToPx(34)} color={MainColorType.g03} />
+                        {
+                            health.mode == 'FAST' && <View className="border_footer_line" style={{ left: rpxToPx(100) }} />
+                        }
+                    </View>
+                </Cell>
 
             </View>
         }
         {
-            health.mode == 'FAST' && <View>
-                <View className="console_active" onClick={() => {
-                    if (!user.isLogin) {
-                        jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
-                        return
-                    }
-                    jumpPage('/_health/pages/long_fast')
-                }}>
-                    <Image className="active_icon" src={require('@assets/_health/fast.png')} />
-                    <Text className="h34">Long fast</Text>
-                    <View style={{ flex: 1 }} />
-                    {
-                        longFastStatus()
-                    }
-                    <View style={{ width: rpxToPx(12) }} />
-                    <IconArrow width={rpxToPx(34)} color={MainColorType.g03} />
-                </View>
+            health.mode == 'FAST' && <Cell onClick={() => {
+                if (!user.isLogin) {
+                    jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
+                    return
+                }
+                jumpPage('/_health/pages/long_fast')
+            }}><View>
+                    <View className="console_active" style={{ backgroundColor: 'transparent' }}>
+                        <Image className="active_icon" src={require('@assets/_health/fast.png')} />
+                        <Text className="h34">Long fast</Text>
+                        <View style={{ flex: 1 }} />
+                        {
+                            longFastStatus()
+                        }
+                        <View style={{ width: rpxToPx(12) }} />
+                        <IconArrow width={rpxToPx(34)} color={MainColorType.g03} />
+                    </View>
 
-            </View>
+                </View>
+            </Cell>
         }
         <View className="circle" />
         {
@@ -975,5 +995,5 @@ export default function MainConsole(props: { type: WindowType }) {
                     setDurationPicker(false)
                 }} time={getScenario(health.windows, health.mode).target.duration} />
         }
-    </View>
+    </View >
 }

src/features/health/MainDayNightCard.tsx

@@ -190,7 +190,7 @@ export default function MainDayNightCard(props: {
             {
                 ring()
             }
-            <View className={health.selTab == 0 ? 'window_name window_name_sel' : 'window_name'}>{isDayMode ? t('health.window_day') : t('health.night')}</View>
+            <View className={health.selTab == 0 ? 'window_name window_name_sel' : 'window_name g01'}>{isDayMode ? t('health.window_day') : t('health.night')}</View>
         </View>
     </View>
 }

src/features/health/MainFastEatCard.tsx

@@ -389,7 +389,7 @@ export default function MainFastEatCard(props: {
             {
                 ring()
             }
-            <View className={health.selTab == 1 ? 'window_name window_name_sel' : 'window_name'}>{isFastMode ? t('health.fast') : t('health.eat')}</View>
+            <View className={health.selTab == 1 ? 'window_name window_name_sel' : 'window_name g01'}>{isFastMode ? t('health.fast') : t('health.eat')}</View>
         </View>
         {
             showModal && <Modal dismiss={() => setShowModal(false)}>

src/features/health/MainHistory.tsx

@@ -106,16 +106,16 @@ export default function MainHistory(props: { type?: string, fast_type?: string }
         var showDate = false;
         var dateStr = ''
         if (index == 0) {
-            var currentDate = dayjs(list[index].window_range.start_timestamp).format('YYYY-MM')
-            var now = dayjs().format('YYYY-MM')
+            var currentDate = dayjs(list[index].window_range.start_timestamp).format('YYYY年M月')
+            var now = dayjs().format('YYYY年M月')
             if (currentDate != now) {
                 showDate = true
                 dateStr = currentDate
             }
         }
         else {
-            var currentDate = dayjs(list[index].window_range.start_timestamp).format('YYYY-MM')
-            var now = dayjs(list[index - 1].window_range.start_timestamp).format('YYYY-MM')
+            var currentDate = dayjs(list[index].window_range.start_timestamp).format('YYYY年M月')
+            var now = dayjs(list[index - 1].window_range.start_timestamp).format('YYYY年M月')
             if (currentDate != now) {
                 showDate = true
                 dateStr = currentDate

src/features/health/MainSleepActiveCard.tsx

@@ -173,7 +173,7 @@ export default function MainSleepActiveCard(props: {
                     ring()
                 }
             </View>
-            <View className={health.selTab == 2 ? 'window_name window_name_sel' : 'window_name'}>{isSleepMode ? t('health.sleep') : t('health.active')}</View>
+            <View className={health.selTab == 2 ? 'window_name window_name_sel' : 'window_name g01'}>{isSleepMode ? t('health.sleep') : t('health.active')}</View>
         </View>
     </View>
 }

src/features/health/MainSwiper.tsx

@@ -187,7 +187,7 @@ export default function MainSwiper(props: { count: number, pageChanged: Function
 
     return <View style={{ flexDirection: 'column', display: 'flex', alignItems: 'center' }}>
         <Text className="today">{t('health.today')}</Text>
-        <Text className="main_date">{global.language == 'en' ? dayjs().format('dddd, MMM D') : dayjs().format('MMMD日, dddd')}</Text>
+        <Text className="main_date g01" >{global.language == 'en' ? dayjs().format('dddd, MMM D') : dayjs().format('MMMD日 dddd')}</Text>
         {/* <View className="tabs">
             <View className="tab_item" style={{ backgroundColor: current != 0 ? '#B2B2B2' : isDay() ? MainColorType.day : MainColorType.night }} onClick={() => tapScroll(0)}></View>
             <View style={{ width: rpxToPx(40) }} />

src/features/health/calendar.scss

@@ -12,6 +12,7 @@
     justify-content: center;
     color: #000;
     font-size: 28px;
+    height: 36px;
 }
 
 .calendar_body {

src/features/health/calendar.tsx

@@ -10,7 +10,7 @@ import NewButton, { NewButtonType } from "@/_health/base/new_button";
 import { MainColorType } from "@/context/themes/color";
 import { useTranslation } from "react-i18next";
 
-export default function Calendar(props: { year: number, month: number,mode:string }) {
+export default function Calendar(props: { year: number, month: number, mode: string }) {
     const weeks = ['日', '一', '二', '三', '四', '五', '六']
     const indexBeginWeek = 0;
     const [spaces, setSpaces] = useState<any>([])
@@ -26,7 +26,7 @@ export default function Calendar(props: { year: number, month: number,mode:strin
         console.log('------------------')
         console.log(props.mode)
         loadData()
-    }, [month,props.mode])
+    }, [month, props.mode])
 
     // useEffect(()=>{
     //     setYear(props.year)
@@ -227,24 +227,29 @@ export default function Calendar(props: { year: number, month: number,mode:strin
         return <View className="calendar_main2">
             <View className="calendar_header">
 
-                <NewButton type={NewButtonType.img} onClick={() => {
-                    const date = new Date(year, month - 1); // month - 1 因为月份是从 0 开始
-                    date.setMonth(date.getMonth() - 1);
-                    setYear(date.getFullYear())
-                    setMonth(date.getMonth() + 1)
-                }}>
-                    <Image src={require('@assets/_health/pre.png')} style={{ width: rpxToPx(36), height: rpxToPx(36) }} />
-                </NewButton>
+                <View style={{ width: rpxToPx(36), height: rpxToPx(36) }}>
+                    <NewButton type={NewButtonType.img} onClick={() => {
+                        const date = new Date(year, month - 1); // month - 1 因为月份是从 0 开始
+                        date.setMonth(date.getMonth() - 1);
+                        setYear(date.getFullYear())
+                        setMonth(date.getMonth() + 1)
+                    }}>
+                        <Image src={require('@assets/_health/pre.png')} style={{ width: rpxToPx(36), height: rpxToPx(36) }} />
+                    </NewButton>
+                </View>
+
                 <Text style={{ width: rpxToPx(236), textAlign: 'center', fontSize: rpxToPx(28) }}>{getYearMonth()}</Text>
+                <View style={{ width: rpxToPx(36), height: rpxToPx(36) }}>
+                    <NewButton type={NewButtonType.img} onClick={() => {
+                        const date = new Date(year, month + 1); // month - 1 因为月份是从 0 开始
+                        date.setMonth(date.getMonth() - 1);
+                        setYear(date.getFullYear())
+                        setMonth(date.getMonth() + 1)
+                    }}>
+                        <Image src={require('@assets/_health/next.png')} style={{ width: rpxToPx(36), height: rpxToPx(36) }} />
+                    </NewButton>
+                </View>
 
-                <NewButton type={NewButtonType.img} onClick={() => {
-                    const date = new Date(year, month + 1); // month - 1 因为月份是从 0 开始
-                    date.setMonth(date.getMonth() - 1);
-                    setYear(date.getFullYear())
-                    setMonth(date.getMonth() + 1)
-                }}>
-                    <Image src={require('@assets/_health/next.png')} style={{ width: rpxToPx(36), height: rpxToPx(36) }} />
-                </NewButton>
             </View>
             <View className="calendar_body">
                 <View className="calendar_weekly">
@@ -264,9 +269,9 @@ export default function Calendar(props: { year: number, month: number,mode:strin
                         days.map((item, index) => {
                             if (item.isToday && item.right) {
                                 return <View key={index} className="calendar_item" style={{ width: rpxToPx(94), position: 'relative' }}>
-                                    <View className="full_right_today" style={{backgroundColor: getThemeColor(props.mode) + '33'}}/>
+                                    <View className="full_right_today" style={{ backgroundColor: getThemeColor(props.mode) + '33' }} />
                                     <View className="fullToday">
-                                        <View className="today3"/>
+                                        <View className="today3" />
                                     </View>
                                     <Text >{item.day}</Text>
                                 </View>
@@ -353,7 +358,7 @@ export default function Calendar(props: { year: number, month: number,mode:strin
     }
 
     function currentContent() {
-        return <View style={{ display: 'flex', flexDirection: 'row', height: rpxToPx(208) }}>
+        return <View style={{ display: 'flex', flexDirection: 'row', height: (current && current.days == 0 && !current.prev_reset) ? rpxToPx(164) : rpxToPx(208) }}>
             {
                 loaded && <View style={{ display: 'flex', flexDirection: 'row' }}>
                     <View className="streak_days" style={{
@@ -363,9 +368,9 @@ export default function Calendar(props: { year: number, month: number,mode:strin
                         marginTop: rpxToPx(24)
                     }}>{current ? current.days : '0'}</View>
                     <View style={{ display: 'flex', flexDirection: 'column', marginTop: rpxToPx(36) }}>
-                        <View className="h44 bold" style={{ color: getThemeColor(props.mode) }}>{current.days == 1 ? t('health.day') : t('health.days')}</View>
-                        <View className="h24">{current.days == 0 ? logTitle() : streakTitle()}</View>
-                        <View className="h20" style={{ color: todayExpire() ? MainColorType.error : MainColorType.g02, marginTop: rpxToPx(12) }}>{streakDesc()}</View>
+                        <View className="h44 bold" style={{ color: getThemeColor(props.mode), lineHeight: rpxToPx(56) + 'px' }}>{current.days == 1 ? t('health.day') : t('health.days')}</View>
+                        <View className="h24" style={{ lineHeight: rpxToPx(36) + 'px' }}>{current.days == 0 ? logTitle() : streakTitle()}</View>
+                        <View className="h20" style={{ color: todayExpire() ? MainColorType.error : MainColorType.g02, marginTop: rpxToPx(12), lineHeight: rpxToPx(32) + 'px' }}>{streakDesc()}</View>
                     </View>
                 </View>
             }

src/features/trackTimeDuration/components/Rings.weapp.tsx

@@ -53,7 +53,6 @@ export type BgRing = {
 let arrowImg;
 let startTime;
 let dotScale = 0.8;
-let dotAlpha = 0.8;
 let direction = 1;
 let frameAnimation: any = null;
 let laterTime;
@@ -89,9 +88,6 @@ export default function Rings(props: {
 
     const [scale, setScale] = useState(props.scale ?? 1.0)
 
-    const scaleRef = useRef(1);
-    const alphaRef = useRef(1);
-    const directionRef = useRef(1); // 1 for scaling down, -1 for scaling up
     const animationFrameRef = useRef<number | null>(null);
 
     const animationDuration = 150; // 动画时长（毫秒
@@ -131,10 +127,7 @@ export default function Rings(props: {
         }
 
         // 更新 scale 和 alpha
-        // scaleRef.current += directionRef.current * 0.01;
-        // alphaRef.current += directionRef.current * 0.01;
         dotScale += direction * 0.005;
-        dotAlpha += direction * 0.005;
 
         // 反转方向
         if (dotScale <= 0.7 || dotScale >= 1) {
@@ -153,22 +146,6 @@ export default function Rings(props: {
         animationFrameRef.current = requestAnimationFrame(animate2);
     };
 
-    // useEffect(() => {
-    //     // if (props.showCurrentDotAnimation) {
-    //     //     animate2()
-    //     // }
-    //     // else {
-    //     //     if (animationFrameRef.current) {
-    //     //         cancelAnimationFrame(animationFrameRef.current as any)
-    //     //         animationFrameRef.current = null
-    //     //     }
-    //     //     dotScale = 1;
-    //     //     dotAlpha = 1;
-    //     // }
-    // }, [
-    //     props.showCurrentDotAnimation
-    // ])
-
     useReady(() => {
         drawCircle()
     })
@@ -356,9 +333,6 @@ export default function Rings(props: {
                 ctx.beginPath();
                 // ctx.translate(xPrime, yPrime)
                 ctx.arc(xPrime, yPrime, lineWidth / 2 * dotScale, 0, 2 * Math.PI, false);
-                // ctx.globalAlpha = dotAlpha//alphaRef.current
-                // ctx.scale(scaleRef.current,scaleRef.current)
-                // ctx.translate(-xPrime, -yPrime)
                 ctx.fillStyle = props.currentDot.color;
                 ctx.fill();
             }
@@ -436,7 +410,6 @@ export default function Rings(props: {
                 ctx.lineWidth = lineWidth;
                 ctx.strokeStyle = item.color;
                 ctx.lineCap = 'round'; // 设置为圆角
-                // ctx.globalAlpha = global.breathAlpha
                 ctx.stroke();
                 ctx.restore()
             })

src/pages/account/Album.tsx

@@ -10,6 +10,7 @@ import NewButton, { NewButtonType } from "@/_health/base/new_button";
 import { MainColorType } from "@/context/themes/color";
 import { getThemeColor } from "@/features/health/hooks/health_hooks";
 import dayjs from "dayjs";
+import Taro from "@tarojs/taro";
 
 export default function Album() {
 
@@ -43,7 +44,7 @@ export default function Album() {
             var now = dayjs().format('YYYYMM')
             if (currentDate != now) {
                 showDate = true
-                dateStr = currentDate
+                dateStr = currentDate.substring(0,4)+'年'+currentDate.substring(4,6)+'月'
             }
         }
         else {
@@ -51,7 +52,8 @@ export default function Album() {
             var now = (medias[index - 1].date + '').substring(0, 6)
             if (currentDate != now) {
                 showDate = true
-                dateStr = currentDate
+                // dateStr = currentDate
+                dateStr = currentDate.substring(0,4)+'年'+currentDate.substring(4,6)+'月'
             }
         }
         if (showDate) {
@@ -123,16 +125,21 @@ export default function Album() {
                     <View className="history_item2" >
 
                         <Text className="history_date">{(item.date + '').substring(6, 9)}</Text>
-                        <View className="history_content">
+                        <View className="border_footer_line">
                             <View className="media" style={{ marginRight: item.images.length == 4 ? 80 : 0 }}>
                                 {
                                     item.images.map((photo, i) => {
-                                        return <Image mode="aspectFill" src={photo} key={i * 900} className="media_item" />
+                                        return <Image onClick={()=>{
+                                            Taro.previewImage({
+                                                current:photo,
+                                                urls:item.images
+                                            })
+                                        }} mode="aspectFill" src={photo} key={i * 900} className="media_item" />
                                     })
                                 }
                             </View>
                         </View>
-                        <View className="seperate_light_line" />
+                        <View className="border_footer_line" />
                     </View>
                 </View>
             })

src/pages/account/Journal.tsx

@@ -88,7 +88,7 @@ export default function Journal() {
                         }
 
                     </View>
-                    <View className="seperate_light_line" />
+                    <View className="border_footer_line" />
                 </View>
             })
         }

src/pages/clock/Clock.tsx

@@ -165,9 +165,9 @@ export default function Clock() {
                 }}
                 style={{ height: 44, marginTop: systemInfo.statusBarHeight, }}>
                 <View style={{ width: rpxToPx(16) }} />
-                <IconStreak color={getThemeColor(health.mode)} width={20} full="transparent" />
+                <IconStreak color='#000' width={20} full="transparent" />
                 <View style={{ width: rpxToPx(4) }} />
-                <Text className="h34 bold" style={{ color: getThemeColor(health.mode) }}>{getStreakCount()}</Text>
+                <Text className="h34 bold" style={{ color: '#000' }}>{getStreakCount()}</Text>
             </View>
         }
     }
@@ -224,7 +224,9 @@ export default function Clock() {
                 marginTop: systemInfo.statusBarHeight,
                 alignItems: 'center',
                 justifyContent: 'center',
-                paddingLeft: 0
+                paddingLeft: 0,
+                fontWeight:'bold',
+                fontSize:17
             }} >{health.title}</View>
 
             {

src/pages/clock/ClockNew.tsx

@@ -21,6 +21,7 @@ import { MainColorType } from "@/context/themes/color";
 import NewButton, { NewButtonType } from "@/_health/base/new_button";
 import { getThemeColor } from "@/features/health/hooks/health_hooks";
 import StatusIndicator, { StatusType } from "@/_health/base/status_indicator";
+import { useTranslation } from "react-i18next";
 
 export default function ClockNew() {
     const [count, setCount] = useState(0)
@@ -33,6 +34,7 @@ export default function ClockNew() {
     const [isPulling, setIsPulling] = useState(false)
     const healthRef = useRef(health)
     const dispatch = useDispatch();
+    const { t } = useTranslation()
     global.dispatch = dispatch;
 
     useEffect(() => {
@@ -160,6 +162,23 @@ export default function ClockNew() {
 
     }
 
+    function pageTitle() {
+        switch (health.mode) {
+            case 'DAY':
+                return t('health.window_day')
+            case 'NIGHT':
+                return t('health.night')
+            case 'FAST':
+                return t('health.fast')
+            case 'EAT':
+                return t('health.eat')
+            case 'SLEEP':
+                return t('health.sleep')
+            case 'ACTIVE':
+                return t('health.active')
+        }
+    }
+
     function detail() {
         // return <View>11111</View>
         if (!health.windows) {
@@ -175,7 +194,7 @@ export default function ClockNew() {
             refresherTriggered={isPulling}
             scrollY onScroll={e => {
                 if (e.detail.scrollTop > 240) {
-                    dispatch(setTitle(health.mode))
+                    dispatch(setTitle(pageTitle()))
                 }
                 else {
                     dispatch(setTitle(''))
@@ -196,6 +215,9 @@ export default function ClockNew() {
 
             <MainHistory />
             <View style={{ height: 200 }} />
+            {
+                (health.mode == 'DAY' || health.mode == 'NIGHT') && <View style={{ height: 150, flexShrink: 0 }} />
+            }
         </ScrollView>
     }
     //https://blog.csdn.net/weixin_43525284/article/details/130182218
@@ -212,6 +234,7 @@ export default function ClockNew() {
                 {
                     detail()
                 }
+
             </ScrollView>
         }
         <View className="h26" style={{

src/utils/time_format.ts

@@ -769,13 +769,23 @@ export class TimeFormatter {
     const tomorrow = today.subtract(-1, 'day');
 
     if (dt.isSame(today, 'day')) {
-      return showToday ? strTime + 'Today' : strTime;
+      if (showToday) {
+        if (global.languange == 'en') return 'Today ' + strTime;
+        return '今天 ' + strTime
+      }
+      return strTime;
     } else if (dt.isSame(yesterday, 'day')) {
-      return strTime + 'Yesterday';
+      if (global.languange == 'en') return 'Yesterday ' + strTime;
+      return '昨天 ' + strTime;
+
     } else if (dt.isSame(tomorrow, 'day')) {
-      return strTime + 'Tomorrow';
+      if (global.languange == 'cn') return 'Tomorrow ' + strTime;
+      return '明天 ' + strTime;
+
     } else {
-      return strTime + dt.format('MM-DD');
+      if (global.languange == 'cn') return dt.format('MMM DD ') + strTime;
+      return dt.format('MMMDD日 ') + strTime;
+
     }
   }