update

src/_health/base/new_button.tsx

@@ -8,6 +8,7 @@ import { MainColorType } from '@/context/themes/color';
 export enum NewButtonType {
     fill = 'fill', //主题实色
     alpha = 'alpha', //主题半透明
+    alpha2 = 'alpha2',
     border = 'border', //主题边框
     gray = 'gray', //灰色半透明
     text = 'text', //纯文本
@@ -73,7 +74,7 @@ export default function NewButton(props: {
     height?: number,
     fontSize?: number,
     bold?: boolean,
-    fontNormal?:boolean,
+    fontNormal?: boolean,
     labelBorder?: boolean,
     btnStyle?: any,
 }) {
@@ -89,7 +90,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.fontNormal?'normal':'bold',//props.bold ? 'bold' : 'normal',
+                fontWeight: props.fontNormal ? 'normal' : 'bold',//props.bold ? 'bold' : 'normal',
                 display: 'flex',
                 alignItems: 'center',
                 justifyContent: 'center',
@@ -105,7 +106,23 @@ 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.fontNormal?'normal':'bold',//props.bold ? 'bold' : 'normal',
+                fontWeight: props.fontNormal ? 'normal' : 'bold',//props.bold ? 'bold' : 'normal',
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                opacity: props.disable ? 0.6 : 1,
+            }
+            break;
+        case NewButtonType.alpha2:
+
+            style = {
+                height: props.height ?? rpxToPx(72),
+                width: props.width ?? rpxToPx(198),
+                borderRadius: props.height ? props.height / 4 : rpxToPx(72 / 4),
+                backgroundColor: isTouched ? MainColorType.g02+'4d' : MainColorType.g02+'1a',
+                color: props.disable ? '#b2b2b2' : props.color,
+                fontSize: props.fontSize ?? rpxToPx(30),
+                fontWeight: props.fontNormal ? 'normal' : 'bold',//props.bold ? 'bold' : 'normal',
                 display: 'flex',
                 alignItems: 'center',
                 justifyContent: 'center',
@@ -123,7 +140,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.fontNormal?'normal':'bold',//props.bold ? 'bold' : 'normal',
+                fontWeight: props.fontNormal ? 'normal' : 'bold',//props.bold ? 'bold' : 'normal',
                 display: 'flex',
                 alignItems: 'center',
                 justifyContent: 'center',
@@ -141,7 +158,7 @@ export default function NewButton(props: {
                 backgroundColor: isTouched ? '#b2b2b240' : '#b2b2b210',
                 color: props.disable ? '#b2b2b2' : '#000000',
                 fontSize: props.fontSize ?? rpxToPx(30),
-                fontWeight: props.fontNormal?'normal':'bold',//props.bold ? 'bold' : 'normal',
+                fontWeight: props.fontNormal ? 'normal' : 'bold',//props.bold ? 'bold' : 'normal',
                 display: 'flex',
                 alignItems: 'center',
                 justifyContent: 'center',
@@ -169,7 +186,7 @@ export default function NewButton(props: {
                 backgroundColor: props.disable ? '#B2B2B240' : isTouched ? '#B2B2B240' : '#B2B2B21A',
                 color: props.disable ? '#b2b2b2' : '#000',
                 fontSize: props.fontSize ?? rpxToPx(30),
-                fontWeight: props.fontNormal?'normal':'bold',
+                fontWeight: props.fontNormal ? 'normal' : 'bold',
                 display: 'flex',
                 alignItems: 'center',
                 justifyContent: 'center',
@@ -197,7 +214,7 @@ export default function NewButton(props: {
                 alignItems: 'center',
                 justifyContent: 'center',
                 fontSize: rpxToPx(28),
-                fontWeight: props.fontNormal?'normal':'bold',
+                fontWeight: props.fontNormal ? 'normal' : 'bold',
                 paddingLeft: rpxToPx(24),
                 paddingRight: rpxToPx(24),
                 boxSizing: 'border-box',
@@ -217,7 +234,7 @@ export default function NewButton(props: {
                 alignItems: 'center',
                 justifyContent: 'center',
                 borderRadius: rpxToPx(11),
-                backgroundColor: isTouched ? MainColorType.g03+'4d' : MainColorType.g03+'1a'
+                backgroundColor: isTouched ? MainColorType.g02 + '4d' : MainColorType.g02 + '1a'
             }}
                 catchMove
                 onClick={(e) => {
@@ -277,7 +294,7 @@ export default function NewButton(props: {
     }
 
     return <View
-        style={{ ...style, ...props.btnStyle,  display: 'flex', flexDirection: 'row', alignItems: 'center' }}
+        style={{ ...style, ...props.btnStyle, display: 'flex', flexDirection: 'row', alignItems: 'center' }}
         catchMove
         onClick={(e) => {
             if (process.env.TARO_ENV == 'weapp') {

src/_health/components/choose_date_time.tsx

@@ -56,60 +56,60 @@ export default function ChooseDateTime(props: {
                     <View style={{ flex: 1 }} />
             }
 
-            <View style={{
+            {/* <View style={{
                 borderColor: props.showError ? 'red' : (props.expand && chooseDate) ?props.color:'transparent',
                 borderWidth: rpxToPx(2),
                 borderRadius: rpxToPx(88 / 4),
                 borderStyle: 'solid'
-            }}>
-                <NewButton
-                    // type={(props.expand && chooseDate) ? NewButtonType.alpha : NewButtonType.gray}
-                    type={NewButtonType.gray}
-                    color={props.color}
-                    title={dateTitle()}
-                    fontSize={rpxToPx(34)}
-                    width={rpxToPx(196)}
-                    height={rpxToPx(84)}
-                    disable={props.disable}
-                    fontNormal
-                    onClick={() => {
-                        setChooseDate(true)
-                        if (props.choose) {
-                            props.choose()
-                        }
-                        // setExpandIndex(index)
-                        // var list = JSON.parse(JSON.stringify(array))
-                        // list[index].today = !list[index].today
-                        // list[index].extra.confirm_time = new Date().getTime()
-                        // setArray(list)
-                    }}
-                />
-            </View>
+            }}> */}
+            <NewButton
+                type={(props.expand && chooseDate) ? NewButtonType.alpha : NewButtonType.gray}
+                // type={NewButtonType.gray}
+                color={props.color}
+                title={dateTitle()}
+                fontSize={rpxToPx(34)}
+                width={rpxToPx(196)}
+                height={rpxToPx(84)}
+                disable={props.disable}
+                fontNormal
+                onClick={() => {
+                    setChooseDate(true)
+                    if (props.choose) {
+                        props.choose()
+                    }
+                    // setExpandIndex(index)
+                    // var list = JSON.parse(JSON.stringify(array))
+                    // list[index].today = !list[index].today
+                    // list[index].extra.confirm_time = new Date().getTime()
+                    // setArray(list)
+                }}
+            />
+            {/* </View> */}
             <View style={{ width: rpxToPx(12) }} />
-            <View style={{
+            {/* <View style={{
                 borderColor: props.showError ? 'red' : (props.expand && !chooseDate) ? props.color : 'transparent',
                 borderWidth: rpxToPx(2),
                 borderRadius: rpxToPx(88 / 4),
                 borderStyle: 'solid'
-            }}>
-                <NewButton
-                    // type={(props.expand && !chooseDate) ? NewButtonType.alpha : NewButtonType.gray}
-                    type={NewButtonType.gray}
-                    color={props.color}
-                    title={props.time}
-                    fontSize={rpxToPx(34)}
-                    width={rpxToPx(136)}
-                    height={rpxToPx(84)}
-                    disable={props.disable}
-                    fontNormal
-                    onClick={() => {
-                        setChooseDate(false)
-                        if (props.choose) {
-                            props.choose()
-                        }
-                    }}
-                />
-            </View>
+            }}> */}
+            <NewButton
+                type={(props.expand && !chooseDate) ? NewButtonType.alpha : NewButtonType.gray}
+                // type={NewButtonType.gray}
+                color={props.color}
+                title={props.time}
+                fontSize={rpxToPx(34)}
+                width={rpxToPx(136)}
+                height={rpxToPx(84)}
+                disable={props.disable}
+                fontNormal
+                onClick={() => {
+                    setChooseDate(false)
+                    if (props.choose) {
+                        props.choose()
+                    }
+                }}
+            />
+            {/* </View> */}
             {
                 !props.title && <View style={{ flex: 1 }} />
             }

src/_health/components/fast_sleep_console.tsx

@@ -91,7 +91,7 @@ export default function FastSleepConsole(props: { step: number, data: any, del:
 
     }
 
-    function itemDisableStatus(index){
+    function itemDisableStatus(index) {
         if (index == 0 && props.data.fast.status == 'OG') {
             return false
         }
@@ -126,6 +126,32 @@ export default function FastSleepConsole(props: { step: number, data: any, del:
     }
 
     function getIconColor(index: number, finish: boolean) {
+        const { fast, sleep } = props.data
+        // if (new Date().getTime() <= fast.target.start_timestamp && health.fast_with_sleep.status == 'WFS') {
+        //     return MainColorType.g03
+        // }
+        switch (index) {
+            case 0:
+                if (new Date().getTime() <= fast.target.start_timestamp) {
+                    return MainColorType.g02
+                }
+                break
+            case 1:
+                if (new Date().getTime() <= sleep.target.start_timestamp) {
+                    return MainColorType.g02
+                }
+                break
+            case 2:
+                if (new Date().getTime() <= sleep.target.end_timestamp) {
+                    return MainColorType.g02
+                }
+                break
+            case 3:
+                if (new Date().getTime() <= fast.target.end_timestamp) {
+                    return MainColorType.g02
+                }
+                break
+        }
         var color = MainColorType.g03
         if (index == 1 || index == 2) {
             color = MainColorType.sleep
@@ -133,9 +159,6 @@ export default function FastSleepConsole(props: { step: number, data: any, del:
         else {
             color = MainColorType.fast
         }
-        if (finish) {
-            color = MainColorType.g03
-        }
         return color;
     }
 
@@ -146,10 +169,11 @@ export default function FastSleepConsole(props: { step: number, data: any, del:
         if (finish) {
             return <Image style={{ width: rpxToPx(24), height: rpxToPx(24) }} src={require('@assets/_health/checked.png')} />
         }
-        if (item.timeline.reminder) {
-            return <IconNotification color="#fff" width={rpxToPx(24)} />
-        }
-        return <IconNotificationOff color="#fff" width={rpxToPx(24)} />
+        return <View style={{ width: rpxToPx(26), height: rpxToPx(26), borderRadius: rpxToPx(13), backgroundColor: '#fff' }} />
+        // if (item.timeline.reminder) {
+        //     return <IconNotification color="#fff" width={rpxToPx(24)} />
+        // }
+        // return <IconNotificationOff color="#fff" width={rpxToPx(24)} />
     }
 
     function actionList() {
@@ -278,17 +302,18 @@ export default function FastSleepConsole(props: { step: number, data: any, del:
                 </View>
             }
             else {
-                if (item.action == 'POST_MOMENT' && item.timeline.real)
-                    return <IconArrow color={MainColorType.g03} width={rpxToPx(34)} />
-                if (item.moment && item.moment.media && item.moment.media.length > 0)
-                    return <Image
-                        src={item.moment.media[0].url}
-                        mode="aspectFill"
-                        className="console_item_img" />
-                if (showBtn)
+                // let themeColor: any = getThemeColor(health.mode)
+                // if (item.target.timestamp >= new Date().getTime()) {
+                //     themeColor = MainColorType.g02
+                // }
+                if (item.timeline.action && item.timeline.action != 'NA') {
+
+                    if (item.timeline.action == 'POST_MOMENT') {
+                        return <IconArrow width={rpxToPx(34)} color={MainColorType.g03} />
+                    }
                     return <NewButton
-                        color={getThemeColor(item.mode)}
-                        type={NewButtonType.alpha}
+                        color={item.timeline.target.timestamp >= new Date().getTime() ? MainColorType.g02 : getThemeColor(item.mode)}
+                        type={item.timeline.target.timestamp >= new Date().getTime() ? NewButtonType.alpha2 : NewButtonType.alpha}
                         title={'Log'}
                         width={rpxToPx(128)}
                         height={rpxToPx(72)}
@@ -296,37 +321,57 @@ export default function FastSleepConsole(props: { step: number, data: any, del:
                         onClick={() => {
                             tapLogBtn(index)
                         }} />
+                }
+
+                if (item.timeline.action && item.timeline.action == 'NA') {
+                    // if (health.mode == 'FAST' || health.mode == 'SLEEP') {
+                    if (item.moment && item.moment.media && item.moment.media.length > 0) {
+                        return <Image
+                            src={item.moment.media[0].url}
+                            mode="aspectFill"
+                            className="console_item_img" />
+                    }
+                    else {
+                        return <IconArrow width={rpxToPx(34)} color={MainColorType.g03} />
+                    }
+
+                    // }
+                }
+
+                return <View />
+                // if (item.timeline.action == 'POST_MOMENT'){
+                //     return <IconArrow color={MainColorType.g03} width={rpxToPx(34)} />
+                // }
+
+                // if (item.moment && item.moment.media && item.moment.media.length > 0)
+                //     return <Image
+                //         src={item.moment.media[0].url}
+                //         mode="aspectFill"
+                //         className="console_item_img" />
+                // if (showBtn)
+                //     return <NewButton
+                //         color={item.timeline.target.timestamp >= new Date().getTime() ? MainColorType.link : getThemeColor(item.mode)}
+                //         type={item.timeline.target.timestamp >= new Date().getTime() ? NewButtonType.alpha2 : NewButtonType.alpha}
+                //         title={'Log'}
+                //         width={rpxToPx(128)}
+                //         height={rpxToPx(72)}
+                //         bold={true}
+                //         onClick={() => {
+                //             tapLogBtn(index)
+                //         }} />
             }
         }
 
         return <ConsoleCell
             status={
-            <StatusIndicator type={StatusType.console}
-            color={isError ? MainColorType.error : getIconColor(index, finish)}
-            fontColor={ isError ? MainColorType.error : MainColorType.g01 }
-            fontSize={rpxToPx(24)}
-            text={time}
-            >{
-                processIcon(item, finish, isError)
-            }</StatusIndicator>
-            // <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: isError ? MainColorType.error : getIconColor(index, finish)
-            //     }}>
-            //         {
-            //             processIcon(item, finish, isError)
-            //         }
-            //     </View>
-            //     <Text className="timeline_time" style={{ color: isError ? MainColorType.error : MainColorType.g01 }}>{time}</Text>
-            // </View>
+                <StatusIndicator type={StatusType.console}
+                    color={isError ? MainColorType.error : getIconColor(index, finish)}
+                    fontColor={isError ? MainColorType.error : MainColorType.g01}
+                    fontSize={rpxToPx(24)}
+                    text={time}
+                >{
+                        processIcon(item, finish, isError)
+                    }</StatusIndicator>
             }
             title={(item.moment && item.moment.title) ? item.moment.title : item.title}
             description={hasDescription ? item.moment.description : null}
@@ -338,92 +383,6 @@ export default function FastSleepConsole(props: { step: number, data: any, del:
             showLine={true}
             fullLine={count - 1 == index}
         />
-        return <View key={index}
-            className="timeline_item"
-            onClick={() => {
-                goDetail(index)
-            }}>
-            <View className="timeline_left">
-                <View style={{
-
-                    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: isError ? MainColorType.error : getIconColor(index, finish)
-                    }}>
-                        {
-                            processIcon(item, finish, isError)
-                        }
-                    </View>
-                    <Text className="timeline_time" style={{ color: isError ? MainColorType.error : MainColorType.g01 }}>{time}</Text>
-                </View>
-
-
-                <Text className="timeline_title"
-                    onClick={() => { }}>{(item.moment && item.moment.title) ? item.moment.title : item.title}</Text>
-
-                {
-                    hasDescription && <Text className="timeline_desc">{item.moment.description}</Text>
-                }
-                <View style={{
-                    height: hasDescription ? rpxToPx(28) : rpxToPx(54), flexShrink: 0,
-
-                }} />
-
-            </View>
-            <View style={{ flex: 1 }} />
-
-            {
-                !isError && item.moment && item.moment.media && item.moment.media.length > 0 && <Image
-                    src={item.moment.media[0].url}
-                    mode="aspectFill"
-                    className="console_item_img" />
-            }
-            {
-                !isError && showBtn && <NewButton
-                    color={getThemeColor(item.mode)}
-                    type={NewButtonType.alpha}
-                    title={'Log'}
-                    width={rpxToPx(128)}
-                    height={rpxToPx(72)}
-                    bold={true}
-                    onClick={() => {
-                        tapLogBtn(index)
-                    }} />
-            }
-            {
-                isError && <View style={{
-                    borderColor: MainColorType.error,
-                    borderWidth: rpxToPx(2),
-                    borderRadius: rpxToPx(76 / 4),
-                    borderStyle: 'solid'
-                }}>
-                    <NewButton
-                        type={NewButtonType.gray}
-                        title='Correct'
-                        fontSize={rpxToPx(34)}
-                        width={rpxToPx(128)}
-                        height={rpxToPx(72)}
-                        onClick={() => {
-                            jumpPage(`/_health/pages/log_time?is_fast_with_sleep=1&index=${1}&single=0&initCheck=1&initIndex=${index}`)
-                        }}
-                    />
-                </View>
-            }
-            {
-                !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>
     }
 
     return <View style={{ backgroundColor: '#fff' }}>

src/_health/components/schedule_item.scss

@@ -5,4 +5,10 @@
     align-items: center;
     justify-content: center;
     font-size: 50px;
+}
+
+.ss{
+    -webkit-backface-visibility: hidden;
+    -webkit-mask-image: -webkit-radial-gradient(white,black);
+    overflow: hidden;
 }

src/_health/components/schedule_item.tsx

@@ -24,19 +24,22 @@ export default function ScheduleItem(props: {
     selMode: any,
     hideReminderIcon?: boolean,
     onDelete?: Function,
-    onChange?: Function
+    onChange?: Function,
+    index: number,
+    count: number
 }) {
     const [showTimePicker, setShowTimePicker] = useState(false)
     const [time, setTime] = useState(props.obj.time)
 
     function itemStyle(obj) {
+        const borderWidth = 1
         if (obj.is_conflict) {
             return {
                 // backgroundColor: '#FF00001A',
                 // color: '#FF0000'
                 backgroundColor: '#B2B2B21A',
                 color: '#000',
-                borderWidth: 2,
+                borderWidth: borderWidth,
                 borderColor: '#FF0000',
                 borderStyle: 'solid'
             }
@@ -48,95 +51,108 @@ export default function ScheduleItem(props: {
             }
         }
         return {
-            backgroundColor: obj.window == props.selMode ? getThemeColor(props.selMode) + '1A' : '#B2B2B21A',
-            color: obj.window == props.selMode ? getThemeColor(props.selMode) : '#000'
+            backgroundColor: '#B2B2B21A',
+            color: '#000',
+            borderWidth: borderWidth,
+            borderColor: obj.window == props.selMode ? getThemeColor(props.selMode) : 'transparent',
+            borderStyle: 'solid'
         }
+        // return {
+        //     backgroundColor: obj.window == props.selMode ? getThemeColor(props.selMode) + '1A' : '#B2B2B21A',
+        //     color: obj.window == props.selMode ? getThemeColor(props.selMode) : '#000'
+        // }
     }
     return <View key={props.key}>
-        <AtSwipeAction
-            isOpened={false}
-            autoClose
-            disabled={(props.obj.window != 'EAT' && props.obj.window != 'ACTIVE' && !props.disable) || props.obj.window == 'FAST' || props.obj.window == 'SLEEP'}
-            options={[
-                {
-                    text: '删除',
-                    style: {
-                        backgroundColor: '#FF4949'
-                    }
-                }
-            ]}
-            onClick={() => {
-                if (props.obj.window == 'ACTIVE' || props.obj.window == 'EAT') {
-                    // if (item.list.length == 1) {
-                    //     Taro.showToast({
-                    //         title: '至少保留一项',
-                    //         icon: 'none'
-                    //     })
-                    //     return;
-                    // }
-                }
-                showAlert({
-                    title: '删除',
-                    content: '确认删除此计划',
-                    showCancel: true,
-                    cancel: () => {
-                        console.log('cancel')
-                    },
-                    confirm: () => {
-                        if (props.onDelete) {
-                            props.onDelete()
+        <View className="ss" style={{
+            borderTopLeftRadius: props.index == 0 ? rpxToPx(26) : 0,
+            borderTopRightRadius: props.index == 0 ? rpxToPx(26) : 0,
+            borderBottomLeftRadius: props.index == props.count - 1 ? rpxToPx(26) : 0,
+            borderBottomRightRadius: props.index == props.count - 1 ? rpxToPx(26) : 0,
+        }}>
+            <AtSwipeAction
+                isOpened={false}
+                autoClose
+                disabled={(props.obj.window != 'EAT' && props.obj.window != 'ACTIVE' && !props.disable) || props.obj.window == 'FAST' || props.obj.window == 'SLEEP'}
+                options={[
+                    {
+                        text: '删除',
+                        style: {
+                            backgroundColor: '#FF4949'
                         }
-                        // delItem(index, i)
                     }
-                })
-            }}
-        ><View className='schedule_item' style={{
-            width: rpxToPx(700),
-            boxSizing: 'border-box',
-            backgroundColor: props.highlight ? getThemeColor(props.obj.window) + '0D' : '#fff'
+                ]}
+                onClick={() => {
+                    if (props.obj.window == 'ACTIVE' || props.obj.window == 'EAT') {
+                        // if (item.list.length == 1) {
+                        //     Taro.showToast({
+                        //         title: '至少保留一项',
+                        //         icon: 'none'
+                        //     })
+                        //     return;
+                        // }
+                    }
+                    showAlert({
+                        title: '删除',
+                        content: '确认删除此计划',
+                        showCancel: true,
+                        cancel: () => {
+                            console.log('cancel')
+                        },
+                        confirm: () => {
+                            if (props.onDelete) {
+                                props.onDelete()
+                            }
+                            // delItem(index, i)
+                        }
+                    })
+                }}
+            ><View className='schedule_item' style={{
+                width: rpxToPx(700),
+                boxSizing: 'border-box',
+                backgroundColor: props.highlight ? getThemeColor(props.obj.window) + '0D' : '#fff',
+            }}>
+                    <View className='item_left2'>
+                        <StatusIndicator
+                            type={props.obj.is_conflict ? StatusType.img : StatusType.normal}
+                            text={props.obj.title}
+                            fontSize={rpxToPx(34)}
+                            fontColor="#000"
+                            color={props.obj.is_conflict ? MainColorType.error : props.errors.length == 0 ? getThemeColor(props.obj.window) : 'transparent'} >
+                            {
+                                props.obj.is_conflict && <IconError color="#fff" width={rpxToPx(26)} />
+                            }
 
-        }}>
-                <View className='item_left2'>
-                    <StatusIndicator
-                        type={props.obj.is_conflict ? StatusType.img : StatusType.normal}
-                        text={props.obj.title}
-                        fontSize={rpxToPx(34)}
-                        fontColor="#000"
-                        color={props.obj.is_conflict ? MainColorType.error : props.errors.length == 0 ? getThemeColor(props.obj.window) : 'transparent'} >
+                        </StatusIndicator>
+                        <View style={{ flex: 1 }} />
+                        {
+                            props.days && <View className="h30" style={{ color: MainColorType.g02 }}>+{props.days} day</View>
+                        }
                         {
-                            props.obj.is_conflict && <IconError color="#fff" width={rpxToPx(26)} />
+                            !props.hideReminderIcon && props.obj.specific_time && !props.obj.reminder && <IconNotificationOff color={MainColorType.g03} width={rpxToPx(28)} />
+                        }
+                        <View style={{ width: rpxToPx(12) }} />
+                        {
+                            !props.disable && props.obj.specific_time && <View className='edit_item_time' onClick={() => {
+                                // setSelIndex(i)
+                                // setSelItem(obj)
+                                setTime(props.obj.time)
+                                setShowTimePicker(true)
+                                // if (props.onClick)
+                                //     props.onClick()
+                            }} style={itemStyle(props.obj)}>{props.obj.time}</View>
+                        }
+                        {
+                            props.disable && <View className="edit_item_time" style={{ backgroundColor: 'transparent', color: props.gray ? MainColorType.g02 : '#000' }}>{props.obj.time}</View>
                         }
 
-                    </StatusIndicator>
-                    <View style={{ flex: 1 }} />
-                    {
-                        props.days && <View className="h30" style={{ color: MainColorType.g02 }}>+{props.days} day</View>
-                    }
-                    {
-                        !props.hideReminderIcon && props.obj.specific_time && !props.obj.reminder && <IconNotificationOff color={MainColorType.g03} width={rpxToPx(28)} />
-                    }
-                    <View style={{ width: rpxToPx(12) }} />
-                    {
-                        !props.disable && props.obj.specific_time && <View className='edit_item_time' onClick={() => {
-                            // setSelIndex(i)
-                            // setSelItem(obj)
-                            setTime(props.obj.time)
-                            setShowTimePicker(true)
-                            // if (props.onClick)
-                            //     props.onClick()
-                        }} style={itemStyle(props.obj)}>{props.obj.time}</View>
-                    }
+
+                    </View>
                     {
-                        props.disable && <View className="edit_item_time" style={{ backgroundColor: 'transparent', color: props.gray ? MainColorType.g02 : '#000' }}>{props.obj.time}</View>
+                        props.showLine && <View className='border_footer_line' style={{ left: rpxToPx(66) }} />
                     }
-
-
                 </View>
-                {
-                    props.showLine && <View className='border_footer_line' style={{ left: rpxToPx(66) }} />
-                }
-            </View>
-        </AtSwipeAction>
+            </AtSwipeAction>
+        </View>
         {
             showTimePicker && <NewModal title={props.obj.title}
                 dismiss={() => { setShowTimePicker(false) }}

src/_health/pages/guide.scss

@@ -0,0 +1,19 @@
+/* #ifdef weapp */
+.navi-bar {
+    position: fixed;
+    left: 0;
+    right: 0;
+    top: 0;
+}
+
+/* #endif */
+
+/* #ifdef rn */
+.navi-bar {
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: 0;
+}
+
+/* #endif */

src/_health/pages/guide_active.config.ts

@@ -3,6 +3,7 @@ export default definePageConfig({
         // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
         // 'demo':'../../components/demo'
     },
+    "navigationStyle":'custom',
     "navigationBarTitleText": "",
     "navigationBarBackgroundColor": "#f5f5f5"
 })

src/_health/pages/guide_active.tsx

@@ -23,6 +23,7 @@ import showAlert from "@/components/basic/Alert";
 import CellFooter, { CellFooterType } from "../base/cell_footer";
 import CellFooterText from "../base/cell_footer_text";
 import StatusIndicator, { StatusType } from "../base/status_indicator";
+import Taro from "@tarojs/taro";
 
 let useRoute;
 let useNavigation;
@@ -32,6 +33,9 @@ if (process.env.TARO_ENV == 'rn') {
     useNavigation = require("@react-navigation/native").useNavigation
 }
 export default function GuideActive() {
+    const systemInfo: any = Taro.getSystemInfoSync();
+    const navigationBarHeight = systemInfo.statusBarHeight + 44;
+    const user = useSelector((state: any) => state.user);
     const health = useSelector((state: any) => state.health);
     const [list, setList] = useState<any>(health.schedules)
     const [errors, setErrors] = useState<any>([])
@@ -146,6 +150,8 @@ export default function GuideActive() {
             {
                 items.map((obj, i) => {
                     return <ScheduleItem
+                        index={i}
+                        count={items.length}
                         key={i * 100}
                         obj={obj}
                         highlight={highlight ? obj.window == 'ACTIVE' : false}
@@ -210,6 +216,8 @@ export default function GuideActive() {
             {
                 items.map((obj, i) => {
                     return <ScheduleItem
+                        index={i}
+                        count={items.length}
                         key={i * 100}
                         obj={obj}
                         highlight={false}
@@ -260,6 +268,40 @@ export default function GuideActive() {
         </Card>
     }
     return <View style={{ flex: 1, display: 'flex', flexDirection: 'column', height: '100vh' }}>
+        <View style={{ height: navigationBarHeight, backgroundColor: MainColorType.g05 }} />
+        <View className="navi-bar" style={{ height: navigationBarHeight, zIndex: 1000, backgroundColor: MainColorType.g05 }}>
+
+            <View style={{
+                position: 'absolute',
+                left: 0,
+                right: 0,
+                bottom: 0,
+                height: 44,
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center'
+            }}>
+                <Image src={require('@assets/_health/navi_back.png')} style={{
+                    position: 'absolute',
+                    width: rpxToPx(92),
+                    height: rpxToPx(64),
+                    left: 0,
+                    top: 22 - rpxToPx(32)
+                }}
+                    onClick={() => {
+                        Taro.navigateBack()
+                    }}
+                />
+                <Image src={user.avatar} mode="aspectFill" style={{
+                    background: user.isLogin ? 'transparent' : '#fff',
+                    width: rpxToPx(64),
+                    height: rpxToPx(64),
+                    borderRadius: rpxToPx(32)
+                }} />
+            </View>
+
+
+        </View>
         <NewHeader type={NewHeaderType.center_subtitle} title={t('health.guide_3_title')} subtitle={t('health.guide_3_desc')} />
         {
             items()

src/_health/pages/guide_eat.config.ts

@@ -3,6 +3,7 @@ export default definePageConfig({
         // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
         // 'demo':'../../components/demo'
     },
+    "navigationStyle":'custom',
     "navigationBarTitleText": "",
     "navigationBarBackgroundColor": "#f5f5f5"
 })

src/_health/pages/guide_eat.tsx

@@ -22,6 +22,7 @@ import showAlert from "@/components/basic/Alert";
 import CellFooter, { CellFooterType } from "../base/cell_footer";
 import CellFooterText from "../base/cell_footer_text";
 import StatusIndicator, { StatusType } from "../base/status_indicator";
+import Taro from "@tarojs/taro";
 
 let useRoute;
 let useNavigation;
@@ -32,6 +33,9 @@ if (process.env.TARO_ENV == 'rn') {
 }
 
 export default function GuideEat() {
+    const systemInfo: any = Taro.getSystemInfoSync();
+    const navigationBarHeight = systemInfo.statusBarHeight + 44;
+    const user = useSelector((state: any) => state.user);
     const health = useSelector((state: any) => state.health);
     const [list, setList] = useState<any>(health.schedules)
     const [errors, setErrors] = useState<any>([])
@@ -124,7 +128,7 @@ export default function GuideEat() {
         return ''
     }
 
-    
+
 
     function items() {
         var items = list.filter(item => item.window == 'EAT')
@@ -137,6 +141,8 @@ export default function GuideEat() {
             {
                 items.map((obj, i) => {
                     return <ScheduleItem
+                        index={i}
+                        count={items.length}
                         key={i * 100}
                         obj={obj}
                         highlight={highlight ? obj.window == 'EAT' : false}
@@ -201,6 +207,8 @@ export default function GuideEat() {
             {
                 items.map((obj, i) => {
                     return <ScheduleItem
+                        index={i}
+                        count={items.length}
                         key={i * 100}
                         obj={obj}
                         highlight={false}
@@ -240,6 +248,40 @@ export default function GuideEat() {
         </Card>
     }
     return <View style={{ flex: 1, display: 'flex', flexDirection: 'column', height: '100vh' }}>
+        <View style={{ height: navigationBarHeight, backgroundColor: MainColorType.g05 }} />
+        <View className="navi-bar" style={{ height: navigationBarHeight, zIndex: 1000, backgroundColor: MainColorType.g05 }}>
+
+            <View style={{
+                position: 'absolute',
+                left: 0,
+                right: 0,
+                bottom: 0,
+                height: 44,
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center'
+            }}>
+                <Image src={require('@assets/_health/navi_back.png')} style={{
+                    position: 'absolute',
+                    width: rpxToPx(92),
+                    height: rpxToPx(64),
+                    left: 0,
+                    top: 22 - rpxToPx(32)
+                }}
+                    onClick={() => {
+                        Taro.navigateBack()
+                    }}
+                />
+                <Image src={user.avatar} mode="aspectFill" style={{
+                    background: user.isLogin ? 'transparent' : '#fff',
+                    width: rpxToPx(64),
+                    height: rpxToPx(64),
+                    borderRadius: rpxToPx(32)
+                }} />
+            </View>
+
+
+        </View>
         <NewHeader type={NewHeaderType.center_subtitle} title={t('health.guide_2_title')} subtitle={t('health.guide_2_desc')} />
         {
             items()
@@ -257,7 +299,7 @@ export default function GuideEat() {
         <View style={{ height: 300, flexShrink: 0 }} />
         <View style={{ flex: 1 }} />
         <View className="main_footer">
-            
+
             <NewButton
                 type={NewButtonType.fill}
                 title="下一步"

src/_health/pages/guide_fast.config.ts

@@ -3,6 +3,7 @@ export default definePageConfig({
         // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
         // 'demo':'../../components/demo'
     },
+    "navigationStyle":'custom',
     "navigationBarTitleText": "",
     "navigationBarBackgroundColor": "#f5f5f5"
 })

src/_health/pages/guide_fast.tsx

@@ -18,10 +18,16 @@ 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";
+import Taro from "@tarojs/taro";
 
 export default function GuideFast() {
+    const systemInfo: any = Taro.getSystemInfoSync();
+    const navigationBarHeight = systemInfo.statusBarHeight + 44;
+    const user = useSelector((state: any) => state.user);
+
     const [loaded, setLoaded] = useState(false)
     const health = useSelector((state: any) => state.health);
+
     const [errors, setErrors] = useState<any>([])
     const [highlight, setHighlight] = useState(true)
 
@@ -117,6 +123,8 @@ export default function GuideFast() {
             {
                 items.map((obj, i) => {
                     return <ScheduleItem
+                        index={i}
+                        count={items.length}
                         key={i * 100}
                         obj={obj}
                         highlight={highlight}
@@ -145,13 +153,47 @@ export default function GuideFast() {
     }
     if (!loaded) return <View />
     return <View style={{ flex: 1, display: 'flex', flexDirection: 'column', height: '100vh' }}>
+        <View style={{ height: navigationBarHeight, backgroundColor: MainColorType.g05 }} />
+        <View className="navi-bar" style={{ height: navigationBarHeight, zIndex: 1000, backgroundColor: MainColorType.g05 }}>
+
+            <View style={{
+                position: 'absolute',
+                left: 0,
+                right: 0,
+                bottom: 0,
+                height: 44,
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center'
+            }}>
+                <Image src={require('@assets/_health/navi_back.png')} style={{
+                    position: 'absolute',
+                    width: rpxToPx(92),
+                    height: rpxToPx(64),
+                    left: 0,
+                    top: 22 - rpxToPx(32)
+                }}
+                    onClick={() => {
+                        Taro.navigateBack()
+                    }}
+                />
+                <Image src={user.avatar} mode="aspectFill" style={{
+                    background: user.isLogin ? 'transparent' : '#fff',
+                    width: rpxToPx(64),
+                    height: rpxToPx(64),
+                    borderRadius: rpxToPx(32)
+                }} />
+            </View>
+
+
+        </View>
         <NewHeader type={NewHeaderType.center_subtitle} title={t('health.guide_0_title')} subtitle={t('health.guide_0_desc')} />
         {
             items()
         }
         <CellFooter type={CellFooterType.left}>
-            <View style={{display:'flex',flexDirection:'column'}}>
-                <CellFooterText text={footerTitle()} isBold/>
+            <View style={{ display: 'flex', flexDirection: 'column' }}>
+                <CellFooterText text={footerTitle()} isBold />
                 <CellFooterText text={footerDesc()} />
             </View>
         </CellFooter>

src/_health/pages/guide_full.config.ts

@@ -3,6 +3,7 @@ export default definePageConfig({
         // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
         // 'demo':'../../components/demo'
     },
+    "navigationStyle":'custom',
     "navigationBarTitleText": "",
     "navigationBarBackgroundColor": "#f5f5f5"
 })

src/_health/pages/guide_full.tsx

@@ -18,35 +18,40 @@ 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";
+import Taro from "@tarojs/taro";
 
 export default function GuideFull() {
+    const systemInfo: any = Taro.getSystemInfoSync();
+    const navigationBarHeight = systemInfo.statusBarHeight + 44;
+    const user = useSelector((state: any) => state.user);
+
     const health = useSelector((state: any) => state.health);
     const [errors, setErrors] = useState<any>([])
 
     const [selItem, setSelItem] = useState<any>(null)
-    const {t} = useTranslation()
+    const { t } = useTranslation()
 
     const dispatch = useDispatch()
     const selMode = 'SLEEP'
     useEffect(() => {
     }, [])
 
-    function commit(){
+    function commit() {
         createSchedule({
             schedules: health.schedules,
-            op_page:'SCHEDULE_FINISH_SETUP'
+            op_page: 'SCHEDULE_FINISH_SETUP'
             // only_check: true
         }).then(res => {
-            const data={
-                title:t('health.guide_done_title'),
-                description:t('health.guide_done_desc'),
-                current_window:(res as any).current_window
+            const data = {
+                title: t('health.guide_done_title'),
+                description: t('health.guide_done_desc'),
+                current_window: (res as any).current_window
             }
-            jumpPage('./post_result?type=schedule&data='+JSON.stringify(data))
+            jumpPage('./post_result?type=schedule&data=' + JSON.stringify(data))
             global.refreshWindow()
         })
-        
-        
+
+
     }
 
     function footerDesc() {
@@ -57,7 +62,7 @@ export default function GuideFull() {
     }
 
     function items() {
-        
+
 
         var array = JSON.parse(JSON.stringify(health.schedules))
         array.sort((a, b) => {
@@ -67,6 +72,8 @@ export default function GuideFull() {
             {
                 array.map((obj, i) => {
                     return <ScheduleItem
+                        index={i}
+                        count={array.length}
                         key={i * 100}
                         obj={obj}
                         disable
@@ -79,17 +86,51 @@ export default function GuideFull() {
         </Card>
     }
     return <View style={{ flex: 1, display: 'flex', flexDirection: 'column', height: '100vh' }}>
+        <View style={{ height: navigationBarHeight, backgroundColor: MainColorType.g05 }} />
+        <View className="navi-bar" style={{ height: navigationBarHeight, zIndex: 1000, backgroundColor: MainColorType.g05 }}>
+
+            <View style={{
+                position: 'absolute',
+                left: 0,
+                right: 0,
+                bottom: 0,
+                height: 44,
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center'
+            }}>
+                <Image src={require('@assets/_health/navi_back.png')} style={{
+                    position: 'absolute',
+                    width: rpxToPx(92),
+                    height: rpxToPx(64),
+                    left: 0,
+                    top: 22 - rpxToPx(32)
+                }}
+                    onClick={() => {
+                        Taro.navigateBack()
+                    }}
+                />
+                <Image src={user.avatar} mode="aspectFill" style={{
+                    background: user.isLogin ? 'transparent' : '#fff',
+                    width: rpxToPx(64),
+                    height: rpxToPx(64),
+                    borderRadius: rpxToPx(32)
+                }} />
+            </View>
+
+
+        </View>
         <NewHeader type={NewHeaderType.center_subtitle} title={t('health.guide_end_title')} subtitle={t('health.guide_end_desc')} />
         {
             items()
         }
         <CellFooter type={CellFooterType.left}>
-            <View style={{display:'flex',flexDirection:'column'}}>
+            <View style={{ display: 'flex', flexDirection: 'column' }}>
                 <CellFooterText text={footerDesc()} />
             </View>
         </CellFooter>
-        <View style={{height:200,flexShrink:0}}/>
-        <View style={{flex:1}}/>
+        <View style={{ height: 200, flexShrink: 0 }} />
+        <View style={{ flex: 1 }} />
         <View className="main_footer">
             <NewButton
                 type={NewButtonType.fill}

src/_health/pages/guide_sleep.config.ts

@@ -3,6 +3,7 @@ export default definePageConfig({
         // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
         // 'demo':'../../components/demo'
     },
+    "navigationStyle":'custom',
     "navigationBarTitleText": "",
     "navigationBarBackgroundColor": "#f5f5f5"
 })

src/_health/pages/guide_sleep.tsx

@@ -20,8 +20,12 @@ import CellFooter, { CellFooterType } from "../base/cell_footer";
 import CellFooterText from "../base/cell_footer_text";
 import FastSleepPopupContent from "../components/fast_sleep_popup_content";
 import { StatusType } from "../base/status_indicator";
+import Taro from "@tarojs/taro";
 
 export default function GuideSleep() {
+    const systemInfo: any = Taro.getSystemInfoSync();
+    const navigationBarHeight = systemInfo.statusBarHeight + 44;
+    const user = useSelector((state: any) => state.user);
     const health = useSelector((state: any) => state.health);
     const [errors, setErrors] = useState<any>([])
     const [highlight, setHighlight] = useState(true)
@@ -97,6 +101,8 @@ export default function GuideSleep() {
             {
                 items.map((obj, i) => {
                     return <ScheduleItem
+                        index={i}
+                        count={items.length}
                         key={i * 100}
                         obj={obj}
                         highlight={highlight ? obj.window == 'SLEEP' : false}
@@ -125,10 +131,10 @@ export default function GuideSleep() {
         </Card>
     }
 
-    function getTime(event){
+    function getTime(event) {
         var t = ''
         list.forEach(item => {
-            if (item.event==event){
+            if (item.event == event) {
                 t = item.time
             }
         });
@@ -139,32 +145,65 @@ export default function GuideSleep() {
         // 将时间字符串转换为小时和分钟
         const [startHours, startMinutes] = startTime.split(':').map(Number);
         const [endHours, endMinutes] = endTime.split(':').map(Number);
-      
+
         // 将起始时间和结束时间转换为分钟
         const startTotalMinutes = startHours * 60 + startMinutes;
         let endTotalMinutes = endHours * 60 + endMinutes;
-      
+
         // 如果结束时间小于起始时间，表示跨天
         if (endTotalMinutes < startTotalMinutes) {
-          endTotalMinutes += 24 * 60; // 加24小时
+            endTotalMinutes += 24 * 60; // 加24小时
         }
-      
+
         // 计算时间差
         const diffMinutes = endTotalMinutes - startTotalMinutes;
         const hours = Math.floor(diffMinutes / 60);
         const minutes = diffMinutes % 60;
-      
+
         // 格式化返回结果
         if (hours > 0 && minutes > 0) {
-          return `${hours}小时${minutes}分钟`;
+            return `${hours}小时${minutes}分钟`;
         } else if (hours > 0) {
-          return `${hours}小时`;
+            return `${hours}小时`;
         } else {
-          return `${minutes}分钟`;
+            return `${minutes}分钟`;
         }
-      }
+    }
 
     return <View style={{ flex: 1, display: 'flex', flexDirection: 'column', height: '100vh' }}>
+        <View style={{ height: navigationBarHeight, backgroundColor: MainColorType.g05 }} />
+        <View className="navi-bar" style={{ height: navigationBarHeight, zIndex: 1000, backgroundColor: MainColorType.g05 }}>
+            <View style={{
+                position: 'absolute',
+                left: 0,
+                right: 0,
+                bottom: 0,
+                height: 44,
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center'
+            }}>
+                <Image src={require('@assets/_health/navi_back.png')} style={{
+                    position: 'absolute',
+                    width: rpxToPx(92),
+                    height: rpxToPx(64),
+                    left: 0,
+                    top: 22 - rpxToPx(32)
+                }}
+                    onClick={() => {
+                        Taro.navigateBack()
+                    }}
+                />
+                <Image src={user.avatar} mode="aspectFill" style={{
+                    background: user.isLogin ? 'transparent' : '#fff',
+                    width: rpxToPx(64),
+                    height: rpxToPx(64),
+                    borderRadius: rpxToPx(32)
+                }} />
+            </View>
+
+
+        </View>
         <NewHeader type={NewHeaderType.center_subtitle} title={t('health.guide_1_title')} subtitle={t('health.guide_1_desc')} />
         {
             items()
@@ -203,10 +242,10 @@ export default function GuideSleep() {
                 beforeStatus={StatusType.normal}
                 sleepStatus={StatusType.normal}
                 afterStatus={StatusType.normal}
-                total={calculateTimeDifference(getTime('FAST_START'),getTime('FAST_END'))}
-                total1={calculateTimeDifference(getTime('FAST_START'),getTime('SLEEP_BEDTIME'))}
-                total2={calculateTimeDifference(getTime('SLEEP_BEDTIME'),getTime('SLEEP_WAKE_UP'))}
-                total3={calculateTimeDifference(getTime('SLEEP_WAKE_UP'),getTime('FAST_END'))}
+                total={calculateTimeDifference(getTime('FAST_START'), getTime('FAST_END'))}
+                total1={calculateTimeDifference(getTime('FAST_START'), getTime('SLEEP_BEDTIME'))}
+                total2={calculateTimeDifference(getTime('SLEEP_BEDTIME'), getTime('SLEEP_WAKE_UP'))}
+                total3={calculateTimeDifference(getTime('SLEEP_WAKE_UP'), getTime('FAST_END'))}
                 showStep={false}
             />
         }

src/_health/pages/log_time.tsx

@@ -732,20 +732,21 @@ export default function LogTime() {
                 <View style={{ position: 'relative' }}>
                     <View className="card_header" style={{ justifyContent: 'space-between' }}>
                         <View className="h34" style={{ marginLeft: rpxToPx(12) }}>{isFast ? 'Fast Goal' : 'Sleep Goal'}</View>
-                        <View style={{
+                        {/* <View style={{
                             borderColor: expandIndex == -1 ? isFast ? MainColorType.fast : MainColorType.sleep : 'transparent',
                             borderWidth: rpxToPx(2),
                             borderRadius: rpxToPx(88 / 4),
                             borderStyle: 'solid'
-                        }}>
-                            <NewButton
-                                type={NewButtonType.gray}
-                                height={rpxToPx(84)}
-                                title={durationTime()}
-                                fontNormal
-                                onClick={() => { setExpandIndex(-1) }}
-                            />
-                        </View>
+                        }}> */}
+                        <NewButton
+                            type={expandIndex == -1 ? NewButtonType.alpha : NewButtonType.gray}
+                            color={isFast ? MainColorType.fast : MainColorType.sleep}
+                            height={rpxToPx(84)}
+                            title={durationTime()}
+                            fontNormal
+                            onClick={() => { setExpandIndex(-1) }}
+                        />
+                        {/* </View> */}
                     </View>
                     {
                         expandIndex == -1 && <View style={{

src/_health/pages/schedules.scss

@@ -160,4 +160,10 @@
     padding-right: 40px;
     box-sizing: border-box;
     position: relative;
+}
+
+.aaaa{
+    // transform: rotate(0deg);
+    // -webkit-backface-visibility: hidden;
+    // -webkit-mask-image: -webkit-radial-gradient(white,black);
 }

src/_health/pages/schedules.tsx

@@ -400,6 +400,8 @@ export default function Schedules() {
                     {
                         list.map((obj, i) => {
                             return <ScheduleItem
+                                index={i}
+                                count={list.length}
                                 key={i * 100}
                                 obj={obj}
                                 highlight={false}

src/components/basic/Icons.tsx

@@ -586,4 +586,17 @@ export const IconMiss = (props: { width: number, color: string }) => {
     </g>
 </svg>`
     return Icon(props.width, props.width, icon);
+}
+
+export const IconCircle = (props: { width: number, color: string }) => {
+    const icon = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none"
+    version="1.1" width="32" height="32" viewBox="0 0 32 32">
+    <g>
+        <g>
+            <ellipse cx="16" cy="15.999999046325684" rx="14.5" ry="14.499999046325684"
+                fill-opacity="0" stroke-opacity="1" stroke="${props.color}" fill="none" stroke-width="3" />
+        </g>
+    </g>
+</svg>`
+    return Icon(props.width, props.width, icon);
 }

src/context/locales/en.js

@@ -938,5 +938,7 @@ export default {
         my_fast_duration:'Total {{time}}',
 
         ok:'OK',
+
+        logging:'logging',
     }
 }

src/context/locales/zh.js

@@ -938,5 +938,7 @@ export default {
         my_fast_duration:'全长 {{time}}',
 
         ok:'我知道了',
+
+        logging:'记录中'
     }
 }

src/context/themes/color.tsx

@@ -40,7 +40,7 @@ export enum MainColorType {
 
     //gray
     g01 = '#595959',
-    g02 = '#b2b2b2',
+    g02 = '#999999',//'#b2b2b2',
     g03 = '#d9d9d9',
     g04 = '#f0f0f0',
     g05 = '#f5f5f5',

src/features/health/MainCard.scss

@@ -131,16 +131,16 @@
     margin-top: 16px;
     font-weight: bold;
     font-size: 28px;
-    line-height: 42px;
+    height: 42px;
     display: flex;
-    align-items: center;
+    align-items: flex-end;
     justify-content: center;
 }
 
 .window_name_sel {
     font-size: 34px;
     color: #000;
-    line-height: 42px;
+    height: 42px;
 }
 
 .main_date{

src/features/health/MainConsole.tsx

@@ -173,9 +173,12 @@ export default function MainConsole(props: { type: WindowType }) {
 
     function itemValue(item: any) {
         let themeColor: any = getThemeColor(health.mode)
-        const scenario = getScenario(health.windows, health.mode)
-        if (item.action == 'END' && !scenario.real) {
-            themeColor = MainColorType.g03
+        // const scenario = getScenario(health.windows, health.mode)
+        // if (item.action == 'END' && !scenario.real) {
+        //     themeColor = MainColorType.g01
+        // }
+        if (item.target.timestamp>=new Date().getTime()){
+            themeColor = MainColorType.g02
         }
         if (health.mode == 'DAY' || health.mode == 'NIGHT') {
             return null
@@ -187,19 +190,19 @@ export default function MainConsole(props: { type: WindowType }) {
                 }
 
             }
-            else if (health.mode == 'ACTIVE' && item.action == 'POST_MOMENT') {
-                return <NewButton
-                    color={themeColor}
-                    type={NewButtonType.border}
-                    title={operateTitle(item)}
-                    width={rpxToPx(128)}
-                    height={rpxToPx(72)}
-                    bold={true}
-                    onClick={() => record(item)} />
-            }
+            // else if (health.mode == 'ACTIVE' && item.action == 'POST_MOMENT') {
+            //     return <NewButton
+            //         color={themeColor}
+            //         type={NewButtonType.border}
+            //         title={operateTitle(item)}
+            //         width={rpxToPx(128)}
+            //         height={rpxToPx(72)}
+            //         bold={true}
+            //         onClick={() => record(item)} />
+            // }
             return <NewButton
                 color={themeColor}
-                type={NewButtonType.alpha}
+                type={item.target.timestamp>=new Date().getTime()?NewButtonType.alpha2:NewButtonType.alpha}
                 title={operateTitle(item)}
                 width={rpxToPx(128)}
                 height={rpxToPx(72)}
@@ -279,20 +282,23 @@ export default function MainConsole(props: { type: WindowType }) {
             if (time > timeline.target.timestamp) {
                 return <Image style={{ width: rpxToPx(24), height: rpxToPx(24) }} src={require('@assets/_health/checked.png')} />
             }
+            return <View style={{width:rpxToPx(26),height:rpxToPx(26),borderRadius:rpxToPx(13),backgroundColor:'#fff'}}/>
         }
-        if (timeline.target.timestamp < new Date().getTime()) {
-            return <IconMiss color="#fff" width={rpxToPx(24)} />
-        }
+        // if (timeline.target.timestamp < new Date().getTime()) {
+        //     return <IconMiss color="#fff" width={rpxToPx(24)} />
+        // }
         if (timeline.real) {
             return <Image style={{ width: rpxToPx(24), height: rpxToPx(24) }} src={require('@assets/_health/checked.png')} />
         }
-        return timeline.reminder ? <IconNotification color="#fff" width={rpxToPx(24)} /> : <IconNotificationOff color="#fff" width={rpxToPx(24)} />
+        return <View style={{width:rpxToPx(26),height:rpxToPx(26),borderRadius:rpxToPx(13),backgroundColor:'#fff'}}/>
+        // return timeline.reminder ? <IconNotification color="#fff" width={rpxToPx(24)} /> : <IconNotificationOff color="#fff" width={rpxToPx(24)} />
     }
 
     function timelineItem(item: any, index: number, count: number) {
         function statusView() {
             return <StatusIndicator type={StatusType.console}
-                color={getThemeColor(health.mode)}
+                color={item.real?getThemeColor(health.mode):MainColorType.g02 }
+                // color={new Date().getTime()<item.target.timestamp?MainColorType.g02:getThemeColor(health.mode)}
                 text={itemTitle(item)}
                 fontSize={rpxToPx(24)}
             >{
@@ -823,18 +829,33 @@ export default function MainConsole(props: { type: WindowType }) {
         return true;
     }
 
+    function getTitleColor() {
+        if (getWindowStatus(health.windows, health.mode) == WindowStatusType.upcoming) {
+            return MainColorType.g01
+        }
+        const scenario = getScenario(health.windows, health.mode)
+        if (scenario.status == 'OG') {
+            return getThemeColor(health.mode)
+        }
+        return '#000'
+    }
+
     return <View className="main-console-bg">
         <Image className="main_arrow" src={require('@assets/images/center_arrow.png')} />
         <View className="main_summary">
             {/* <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 ? '#000' : '#000'
+                color: getTitleColor()
             }} >{getCountownTime(health.windows, health.mode)}
-                <View className={timePointClass()}
-                    style={{ backgroundColor: getWindowStatus(health.windows, health.mode) == WindowStatusType.upcoming ? '#B2B2B2' : getThemeColor(health.mode) }} />
+                {/* <View className={timePointClass()}
+                    style={{ backgroundColor: getWindowStatus(health.windows, health.mode) == WindowStatusType.upcoming ? '#B2B2B2' : getThemeColor(health.mode) }} /> */}
             </View>
-            <Text className="main_summary_duration" style={{ color: MainColorType.g01, marginBottom: rpxToPx(30) }}>{getDuration(health.windows, health.mode)}</Text>
+            <Text className="main_summary_duration"
+                style={{
+                    color: getWindowStatus(health.windows, health.mode) == WindowStatusType.upcoming ? MainColorType.g02 : MainColorType.g01,
+                    marginBottom: rpxToPx(30)
+                }}>{getDuration(health.windows, health.mode)}{getScenario(health.windows,health.mode).status=='OG'?' ('+t('health.logging')+')':''}</Text>
             <View className="border_footer_line" />
         </View>
         <View style={{ backgroundColor: '#fff', width: rpxToPx(750) }}>