update

src/_health/components/new_header.tsx

@@ -10,11 +10,13 @@ export enum NewHeaderType {
     left_subtitle = 'left_subtitle'
 }
 export default function NewHeader(props: { type: NewHeaderType, title: string, subtitle?: string }) {
-    return <View className='new_header_bg'>
+    return <View className='new_header_bg' style={{
+        alignItems: (props.type == NewHeaderType.center || props.type == NewHeaderType.center_subtitle) ? 'center' : 'flex-start'
+    }}>
         <View className='h50 bold'>{props.title}</View>
         {
             (props.type == NewHeaderType.center_subtitle || props.type == NewHeaderType.left_subtitle) &&
-            <View className='h30' style={{ color: MainColorType.g01,marginTop:rpxToPx(12) ,lineHeight:rpxToPx(45)+'px'}}>{props.subtitle}</View>
+            <View className='h30' style={{ color: MainColorType.g01, marginTop: rpxToPx(12), lineHeight: rpxToPx(45) + 'px' }}>{props.subtitle}</View>
         }
     </View>
 }

src/_health/pages/guide_active.config.ts

@@ -0,0 +1,8 @@
+export default definePageConfig({
+    usingComponents: {
+        // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
+        // 'demo':'../../components/demo'
+    },
+    "navigationBarTitleText": "",
+    "navigationBarBackgroundColor": "#f5f5f5"
+})

src/_health/pages/guide_active.tsx

@@ -0,0 +1,252 @@
+import { View, Text, Image } from "@tarojs/components";
+import './guide.scss'
+import '@/_health/pages/schedules.scss'
+import NewHeader, { NewHeaderType } from "../components/new_header";
+import { useEffect, useState } from "react";
+import { createSchedule, getLabelsEvent, getSchedules } from "@/services/health";
+import { setSchedules } from "@/store/health";
+import { useDispatch, useSelector } from "react-redux";
+import Card from "../components/card";
+import { rpxToPx } from "@/utils/tools";
+import { getThemeColor } from "@/features/health/hooks/health_hooks";
+import Modal from "@/components/layout/Modal.weapp";
+import TimePicker from "@/features/common/TimePicker";
+import NewButton, { NewButtonType } from "../base/new_button";
+import { MainColorType } from "@/context/themes/color";
+import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
+import { IconAdd } from "@/components/basic/Icons";
+import AddLabel from "../components/add_label";
+
+export default function GuideActive() {
+    const health = useSelector((state: any) => state.health);
+    const [schedules, setSchedules1] = useState(health.schedules)
+    const [errors, setErrors] = useState<any>([])
+    const [highlight, setHighlight] = useState(true)
+
+    const [selItem, setSelItem] = useState<any>(null)
+    const [selIndex, setSelIndex] = useState(-1)
+    const [showTimePicker, setShowTimePicker] = useState(false)
+    const [showModal,setShowModal] = useState(false)
+    const [labels, setLabels] = useState<any>([])
+
+    const dispatch = useDispatch()
+    const selMode = 'ACTIVE'
+    useEffect(() => {
+        getLabelsEvent({ window: 'ACTIVE' }).then(res => {
+            setLabels((res as any).labels)
+        })
+
+        setTimeout(() => {
+            setHighlight(false)
+        }, 2000)
+    }, [])
+
+    function itemStyle(obj) {
+        if (obj.is_conflict) {
+            return {
+                backgroundColor: '#FF00001A',
+                color: '#FF0000'
+            }
+        }
+        if (errors.length > 0) {
+            return {
+                backgroundColor: '#B2B2B21A',
+                color: '#000'
+            }
+        }
+        return {
+            backgroundColor: obj.window == selMode ? getThemeColor(selMode) + '1A' : '#B2B2B21A',
+            color: obj.window == selMode ? getThemeColor(selMode) : '#000'
+        }
+    }
+
+    function modalContent() {
+        const strTime = selItem.time
+
+        var title = selItem.title
+        var color = getThemeColor(selItem.window)
+
+        return <TimePicker time={strTime}
+            color={color}
+            title={title}
+            confirm={(e) => {
+                // selItem.time = e
+                setSelItem(selItem)
+                setShowTimePicker(false)
+                var array = JSON.parse(JSON.stringify(health.schedules))
+                array.map(item => {
+                    if (item.id == selItem.id) {
+                        item.time = e
+                    }
+                })
+                dispatch(setSchedules(array))
+                check(array)
+                // var array = JSON.parse(JSON.stringify(list))
+                // array[selIndex].time = e
+                // setList(array)
+                // checkData(array)
+            }}
+            cancel={() => {
+                setShowTimePicker(false)
+            }} />
+    }
+
+    function check(array) {
+        createSchedule({
+            schedules: array,
+            only_check: true,
+            op_page: 'SCHEDULE_WALKTHROUGH_4'
+        }).then(res => {
+            dispatch(setSchedules((res as any).schedules))
+            if ((res as any).result) {
+                setErrors([])
+            }
+            else {
+                setErrors((res as any).error_messages ? (res as any).error_messages : [])
+            }
+        })
+    }
+
+    function add() {
+        setShowModal(true)
+    }
+
+    function items() {
+        var items = health.schedules.filter(item => item.window == 'ACTIVE')
+        return <Card>
+            {
+                errors.map((item1, index) => {
+                    return <View key={index} className='error_tip'>{item1}</View>
+                })
+            }
+            {
+                items.map((obj, i) => {
+                    return <View className='schedule_item' key={i} style={{
+                        width: rpxToPx(700),
+                        boxSizing: 'border-box',
+                        backgroundColor: (obj.window == selMode && highlight) ? getThemeColor(selMode) + '08' : '#fff'
+
+                    }}>
+                        <View className='item_left2'>
+                            <View className='item_index'>
+                                <View className="index_point" style={{ backgroundColor: getThemeColor(obj.window) }} />
+                            </View>
+                            <Text className='item_name'>{obj.title}</Text>
+                            <View style={{ flex: 1 }} />
+                            {
+                                obj.is_conflict && <Text className="conflict_tip">时间冲突，请调整</Text>
+                            }
+                            {
+                                !obj.is_all_day && !obj.reminder && <Image src={require('@assets/images/notification_off.png')} className='notification_icon' />
+                            }
+                            {
+                                !obj.is_all_day && <View className='edit_item_time' onClick={() => {
+                                    setSelIndex(i)
+                                    setSelItem(obj)
+                                    setShowTimePicker(true)
+                                }} style={itemStyle(obj)}>{obj.time}</View>
+                            }
+
+                            <View className='item_line' />
+                        </View>
+                    </View>
+                })
+            }
+            <View className='item_add'
+                onClick={() => add()}>
+                <IconAdd color={MainColorType.eat} width={rpxToPx(34)} />
+                <View className='toolbar_btn' style={{ color: MainColorType.eat }} >添加</View>
+                <View style={{ flex: 1 }} />
+            </View>
+        </Card>
+    }
+
+    function fastSleepItems() {
+        var items = health.schedules.filter(item => item.window == 'SLEEP')
+        return <Card>
+            {
+                items.map((obj, i) => {
+                    return <View className='schedule_item' key={i} style={{
+                        width: rpxToPx(700),
+                        boxSizing: 'border-box',
+                        backgroundColor: (obj.window == selMode && highlight) ? getThemeColor(selMode) + '08' : '#fff'
+
+                    }}>
+                        <View className='item_left2'>
+                            <View className='item_index'>
+                                <View className="index_point" style={{ backgroundColor: getThemeColor(obj.window) }} />
+                            </View>
+                            <Text className='item_name'>{obj.title}</Text>
+                            <View style={{ flex: 1 }} />
+                            {
+                                obj.is_conflict && <Text className="conflict_tip">时间冲突，请调整</Text>
+                            }
+                            {
+                                !obj.is_all_day && !obj.reminder && <Image src={require('@assets/images/notification_off.png')} className='notification_icon' />
+                            }
+                            {
+                                !obj.is_all_day && <View className='edit_item_time' onClick={() => {
+                                    setSelIndex(i)
+                                    setSelItem(obj)
+                                    setShowTimePicker(true)
+                                }} style={itemStyle(obj)}>{obj.time}</View>
+                            }
+
+                            {
+                                i < items.length - 1 && <View className='item_line' />
+                            }
+                        </View>
+                    </View>
+                })
+            }
+        </Card>
+    }
+    return <View style={{ flex: 1, display: 'flex', flexDirection: 'column', height: '100vh' }}>
+        <NewHeader type={NewHeaderType.center_subtitle} title="保持活跃" subtitle="我的活动日程" />
+        {
+            items()
+        }
+        <View style={{ height: 20 }} />
+        {
+            fastSleepItems()
+        }
+        <View style={{ flex: 1 }} />
+        <View style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', marginBottom: rpxToPx(128) }}>
+            <NewButton
+                type={NewButtonType.fill}
+                title="下一步"
+                disable={errors.length > 0}
+                color={MainColorType.active}
+                width={rpxToPx(646)}
+                height={rpxToPx(96)}
+                onClick={() => {
+                    jumpPage('./guide_full')
+                }}
+            />
+        </View>
+        {
+            showTimePicker && <Modal
+                testInfo={null}
+                dismiss={() => {
+                    setShowTimePicker(false)
+                }}
+                confirm={() => {
+
+                }}>
+                {
+                    modalContent()
+                }
+            </Modal>
+        }
+
+        {
+            showModal && <Modal testInfo={null}
+                dismiss={() => {
+                    setShowModal(false)
+                }}
+                confirm={() => { }}>
+                <AddLabel labels={labels} disMiss={() => setShowModal(false)} />
+            </Modal>
+        }
+    </View>
+}

src/_health/pages/guide_eat.config.ts

@@ -0,0 +1,8 @@
+export default definePageConfig({
+    usingComponents: {
+        // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
+        // 'demo':'../../components/demo'
+    },
+    "navigationBarTitleText": "",
+    "navigationBarBackgroundColor": "#f5f5f5"
+})

src/_health/pages/guide_eat.tsx

@@ -0,0 +1,251 @@
+import { View, Text, Image } from "@tarojs/components";
+import './guide.scss'
+import '@/_health/pages/schedules.scss'
+import NewHeader, { NewHeaderType } from "../components/new_header";
+import { useEffect, useState } from "react";
+import { createSchedule, getLabelsEvent, getSchedules } from "@/services/health";
+import { setSchedules } from "@/store/health";
+import { useDispatch, useSelector } from "react-redux";
+import Card from "../components/card";
+import { rpxToPx } from "@/utils/tools";
+import { getThemeColor } from "@/features/health/hooks/health_hooks";
+import Modal from "@/components/layout/Modal.weapp";
+import TimePicker from "@/features/common/TimePicker";
+import NewButton, { NewButtonType } from "../base/new_button";
+import { MainColorType } from "@/context/themes/color";
+import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
+import { IconAdd } from "@/components/basic/Icons";
+import AddLabel from "../components/add_label";
+
+export default function GuideEat() {
+    const health = useSelector((state: any) => state.health);
+    const [errors, setErrors] = useState<any>([])
+    const [highlight, setHighlight] = useState(true)
+
+    const [selItem, setSelItem] = useState<any>(null)
+    const [selIndex, setSelIndex] = useState(-1)
+    const [showTimePicker, setShowTimePicker] = useState(false)
+    const [showModal,setShowModal] = useState(false)
+    const [labels, setLabels] = useState<any>([])
+
+
+    const dispatch = useDispatch()
+    const selMode = 'EAT'
+    useEffect(() => {
+        getLabelsEvent({ window: 'EAT' }).then(res => {
+            setLabels((res as any).labels)
+        })
+        setTimeout(() => {
+            setHighlight(false)
+        }, 2000)
+
+    }, [])
+
+    function itemStyle(obj) {
+        if (obj.is_conflict) {
+            return {
+                backgroundColor: '#FF00001A',
+                color: '#FF0000'
+            }
+        }
+        if (errors.length > 0) {
+            return {
+                backgroundColor: '#B2B2B21A',
+                color: '#000'
+            }
+        }
+        return {
+            backgroundColor: obj.window == selMode ? getThemeColor(selMode) + '1A' : '#B2B2B21A',
+            color: obj.window == selMode ? getThemeColor(selMode) : '#000'
+        }
+    }
+
+    function modalContent() {
+        const strTime = selItem.time
+
+        var title = selItem.title
+        var color = getThemeColor(selItem.window)
+
+        return <TimePicker time={strTime}
+            color={color}
+            title={title}
+            confirm={(e) => {
+                // selItem.time = e
+                setSelItem(selItem)
+                setShowTimePicker(false)
+                var array = JSON.parse(JSON.stringify(health.schedules))
+                array.map(item => {
+                    if (item.id == selItem.id) {
+                        item.time = e
+                    }
+                })
+                dispatch(setSchedules(array))
+                check(array)
+                // var array = JSON.parse(JSON.stringify(list))
+                // array[selIndex].time = e
+                // setList(array)
+                // checkData(array)
+            }}
+            cancel={() => {
+                setShowTimePicker(false)
+            }} />
+    }
+
+    function check(array) {
+        createSchedule({
+            schedules: array,
+            only_check: true,
+            op_page:'SCHEDULE_WALKTHROUGH_3'
+        }).then(res => {
+            dispatch(setSchedules((res as any).schedules))
+            if ((res as any).result) {
+                setErrors([])
+            }
+            else {
+                setErrors((res as any).error_messages ? (res as any).error_messages : [])
+            }
+        })
+    }
+
+    function add() {
+        setShowModal(true)
+    }
+
+    function items() {
+        var items = health.schedules.filter(item => item.window == 'EAT')
+        return <Card>
+            {
+                errors.map((item1, index) => {
+                    return <View key={index} className='error_tip'>{item1}</View>
+                })
+            }
+            {
+                items.map((obj, i) => {
+                    return <View className='schedule_item' key={i} style={{
+                        width: rpxToPx(700),
+                        boxSizing: 'border-box',
+                        backgroundColor: (obj.window == selMode && highlight) ? getThemeColor(selMode) + '08' : '#fff'
+
+                    }}>
+                        <View className='item_left2'>
+                            <View className='item_index'>
+                                <View className="index_point" style={{ backgroundColor: getThemeColor(obj.window) }} />
+                            </View>
+                            <Text className='item_name'>{obj.title}</Text>
+                            <View style={{ flex: 1 }} />
+                            {
+                                obj.is_conflict && <Text className="conflict_tip">时间冲突，请调整</Text>
+                            }
+                            {
+                                !obj.is_all_day && !obj.reminder && <Image src={require('@assets/images/notification_off.png')} className='notification_icon' />
+                            }
+                            {
+                                !obj.is_all_day && <View className='edit_item_time' onClick={() => {
+                                    setSelIndex(i)
+                                    setSelItem(obj)
+                                    setShowTimePicker(true)
+                                }} style={itemStyle(obj)}>{obj.time}</View>
+                            }
+
+                            <View className='item_line' />
+                        </View>
+                    </View>
+                })
+            }
+            <View className='item_add'
+                onClick={() => add()}>
+                <IconAdd color={MainColorType.eat} width={rpxToPx(34)} />
+                <View className='toolbar_btn' style={{ color: MainColorType.eat }} >添加</View>
+                <View style={{ flex: 1 }} />
+            </View>
+        </Card>
+    }
+
+    function fastSleepItems() {
+        var items = health.schedules.filter(item => item.window == 'FAST' || item.window == 'SLEEP')
+        return <Card>
+            {
+                items.map((obj, i) => {
+                    return <View className='schedule_item' key={i} style={{
+                        width: rpxToPx(700),
+                        boxSizing: 'border-box',
+                        backgroundColor: (obj.window == selMode && highlight) ? getThemeColor(selMode) + '08' : '#fff'
+
+                    }}>
+                        <View className='item_left2'>
+                            <View className='item_index'>
+                                <View className="index_point" style={{ backgroundColor: getThemeColor(obj.window) }} />
+                            </View>
+                            <Text className='item_name'>{obj.title}</Text>
+                            <View style={{ flex: 1 }} />
+                            {
+                                obj.is_conflict && <Text className="conflict_tip">时间冲突，请调整</Text>
+                            }
+                            {
+                                !obj.is_all_day && !obj.reminder && <Image src={require('@assets/images/notification_off.png')} className='notification_icon' />
+                            }
+                            {
+                                !obj.is_all_day && <View className='edit_item_time' onClick={() => {
+                                    setSelIndex(i)
+                                    setSelItem(obj)
+                                    setShowTimePicker(true)
+                                }} style={itemStyle(obj)}>{obj.time}</View>
+                            }
+
+                            {
+                                i < items.length - 1 && <View className='item_line' />
+                            }
+                        </View>
+                    </View>
+                })
+            }
+        </Card>
+    }
+    return <View style={{ flex: 1, display: 'flex', flexDirection: 'column', height: '100vh' }}>
+        <NewHeader type={NewHeaderType.center_subtitle} title="断食结束后" subtitle="我的饮食日程" />
+        {
+            items()
+        }
+        <View style={{ height: 20, flexShrink: 0 }} />
+        {
+            fastSleepItems()
+        }
+        <View style={{ flex: 1 }} />
+        <View style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', marginBottom: rpxToPx(128) }}>
+            <NewButton
+                type={NewButtonType.fill}
+                title="下一步"
+                disable={errors.length>0}
+                color={MainColorType.eat}
+                width={rpxToPx(646)}
+                height={rpxToPx(96)}
+                onClick={() => {
+                    jumpPage('./guide_active')
+                }}
+            />
+        </View>
+        {
+            showTimePicker && <Modal
+                testInfo={null}
+                dismiss={() => {
+                    setShowTimePicker(false)
+                }}
+                confirm={() => {
+
+                }}>
+                {
+                    modalContent()
+                }
+            </Modal>
+        }
+        {
+            showModal && <Modal testInfo={null}
+                dismiss={() => {
+                    setShowModal(false)
+                }}
+                confirm={() => { }}>
+                <AddLabel labels={labels} disMiss={() => setShowModal(false)} />
+            </Modal>
+        }
+    </View>
+}

src/_health/pages/guide_fast.config.ts

@@ -0,0 +1,8 @@
+export default definePageConfig({
+    usingComponents: {
+        // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
+        // 'demo':'../../components/demo'
+    },
+    "navigationBarTitleText": "",
+    "navigationBarBackgroundColor": "#f5f5f5"
+})

src/_health/pages/guide_fast.tsx

@@ -0,0 +1,187 @@
+import { View, Text, Image } from "@tarojs/components";
+import './guide.scss'
+import '@/_health/pages/schedules.scss'
+import NewHeader, { NewHeaderType } from "../components/new_header";
+import { useEffect, useState } from "react";
+import { createSchedule, getSchedules } from "@/services/health";
+import { setSchedules } from "@/store/health";
+import { useDispatch, useSelector } from "react-redux";
+import Card from "../components/card";
+import { rpxToPx } from "@/utils/tools";
+import { getThemeColor } from "@/features/health/hooks/health_hooks";
+import Modal from "@/components/layout/Modal.weapp";
+import TimePicker from "@/features/common/TimePicker";
+import NewButton, { NewButtonType } from "../base/new_button";
+import { MainColorType } from "@/context/themes/color";
+import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
+
+export default function GuideFast() {
+    const [loaded, setLoaded] = useState(false)
+    const health = useSelector((state: any) => state.health);
+    const [errors, setErrors] = useState<any>([])
+    const [highlight, setHighlight] = useState(true)
+
+    const [selItem, setSelItem] = useState<any>(null)
+    const [selIndex, setSelIndex] = useState(-1)
+    const [showTimePicker, setShowTimePicker] = useState(false)
+
+    const dispatch = useDispatch()
+    const selMode = 'FAST'
+    useEffect(() => {
+        getSchedules({ window: '' }).then(res => {
+            dispatch(setSchedules((res as any).data))
+            setLoaded(true)
+            setTimeout(() => {
+                setHighlight(false)
+            }, 2000)
+        })
+    }, [])
+
+    function itemStyle(obj) {
+        if (obj.is_conflict) {
+            return {
+                backgroundColor: '#FF00001A',
+                color: '#FF0000'
+            }
+        }
+        if (errors.length > 0) {
+            return {
+                backgroundColor: '#B2B2B21A',
+                color: '#000'
+            }
+        }
+        return {
+            backgroundColor: obj.window == selMode ? getThemeColor(selMode) + '1A' : '#B2B2B21A',
+            color: obj.window == selMode ? getThemeColor(selMode) : '#000'
+        }
+    }
+
+    function modalContent() {
+        const strTime = selItem.time
+
+        var title = selItem.title
+        var color = getThemeColor(selItem.window)
+
+        return <TimePicker time={strTime}
+            color={color}
+            title={title}
+            confirm={(e) => {
+                // selItem.time = e
+                setSelItem(selItem)
+                setShowTimePicker(false)
+                var array = JSON.parse(JSON.stringify(health.schedules))
+                array.map(item => {
+                    if (item.id == selItem.id) {
+                        item.time = e
+                    }
+                })
+                dispatch(setSchedules(array))
+
+                check(array)
+                // var array = JSON.parse(JSON.stringify(list))
+                // array[selIndex].time = e
+                // setList(array)
+                // checkData(array)
+            }}
+            cancel={() => {
+                setShowTimePicker(false)
+            }} />
+    }
+
+    function check(array) {
+        createSchedule({
+            schedules: array,
+            only_check: true,
+            op_page:'SCHEDULE_WALKTHROUGH_1'
+        }).then(res => {
+            dispatch(setSchedules((res as any).schedules))
+            if ((res as any).result) {
+                setErrors([])
+            }
+            else {
+                setErrors((res as any).error_messages ? (res as any).error_messages : [])
+            }
+        })
+    }
+
+    function items() {
+        var items = health.schedules.filter(item => item.window == 'FAST')
+        return <Card>
+            {
+                errors.map((item1, index) => {
+                    return <View key={index} className='error_tip'>{item1}</View>
+                })
+            }
+            {
+                items.map((obj, i) => {
+                    return <View className='schedule_item' key={i} style={{
+                        width: rpxToPx(700),
+                        boxSizing: 'border-box',
+                        backgroundColor: (obj.window == selMode && highlight) ? getThemeColor(selMode) + '08' : '#fff'
+
+                    }}>
+                        <View className='item_left2'>
+                            <View className='item_index'>
+                                <View className="index_point" style={{ backgroundColor: getThemeColor(obj.window) }} />
+                            </View>
+                            <Text className='item_name'>{obj.title}</Text>
+                            <View style={{ flex: 1 }} />
+                            {
+                                obj.is_conflict && <Text className="conflict_tip">时间冲突，请调整</Text>
+                            }
+                            {
+                                !obj.is_all_day && !obj.reminder && <Image src={require('@assets/images/notification_off.png')} className='notification_icon' />
+                            }
+                            {
+                                !obj.is_all_day && <View className='edit_item_time' onClick={() => {
+                                    setSelIndex(i)
+                                    setSelItem(obj)
+                                    setShowTimePicker(true)
+                                }} style={itemStyle(obj)}>{obj.time}</View>
+                            }
+
+                            {
+                                i < items.length - 1 && <View className='item_line' />
+                            }
+                        </View>
+                    </View>
+                })
+            }
+        </Card>
+    }
+    if (!loaded) return <View />
+    return <View style={{ flex: 1, display: 'flex', flexDirection: 'column', height: '100vh' }}>
+        <NewHeader type={NewHeaderType.center_subtitle} title="我的断食日程" subtitle="每日间歇性断食" />
+        {
+            items()
+        }
+        <View style={{ flex: 1 }} />
+        <View style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', marginBottom: rpxToPx(128) }}>
+            <NewButton
+                type={NewButtonType.fill}
+                title="下一步"
+                disable={errors.length>0}
+                color={MainColorType.fast}
+                width={rpxToPx(646)}
+                height={rpxToPx(96)}
+                onClick={() => {
+                    jumpPage('./guide_sleep')
+                }}
+            />
+        </View>
+        {
+            showTimePicker && <Modal
+                testInfo={null}
+                dismiss={() => {
+                    setShowTimePicker(false)
+                }}
+                confirm={() => {
+
+                }}>
+                {
+                    modalContent()
+                }
+            </Modal>
+        }
+    </View>
+}

src/_health/pages/guide_full.config.ts

@@ -0,0 +1,8 @@
+export default definePageConfig({
+    usingComponents: {
+        // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
+        // 'demo':'../../components/demo'
+    },
+    "navigationBarTitleText": "",
+    "navigationBarBackgroundColor": "#f5f5f5"
+})

src/_health/pages/guide_full.tsx

@@ -0,0 +1,162 @@
+import { View, Text, Image } from "@tarojs/components";
+import './guide.scss'
+import '@/_health/pages/schedules.scss'
+import NewHeader, { NewHeaderType } from "../components/new_header";
+import { useEffect, useState } from "react";
+import { createSchedule, getSchedules } from "@/services/health";
+import { setSchedules } from "@/store/health";
+import { useDispatch, useSelector } from "react-redux";
+import Card from "../components/card";
+import { rpxToPx } from "@/utils/tools";
+import { getThemeColor } from "@/features/health/hooks/health_hooks";
+import Modal from "@/components/layout/Modal.weapp";
+import TimePicker from "@/features/common/TimePicker";
+import NewButton, { NewButtonType } from "../base/new_button";
+import { MainColorType } from "@/context/themes/color";
+import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
+
+export default function GuideFull() {
+    const health = useSelector((state: any) => state.health);
+    const [errors, setErrors] = useState<any>([])
+
+    const [selItem, setSelItem] = useState<any>(null)
+    const [selIndex, setSelIndex] = useState(-1)
+    const [showTimePicker, setShowTimePicker] = useState(false)
+
+    const dispatch = useDispatch()
+    const selMode = 'SLEEP'
+    useEffect(() => {
+    }, [])
+
+    function itemStyle(obj) {
+        if (obj.is_conflict) {
+            return {
+                backgroundColor: '#FF00001A',
+                color: '#FF0000'
+            }
+        }
+        if (errors.length > 0) {
+            return {
+                backgroundColor: '#B2B2B21A',
+                color: '#000'
+            }
+        }
+        return {
+            backgroundColor: obj.window == selMode ? getThemeColor(selMode) + '1A' : '#B2B2B21A',
+            color: obj.window == selMode ? getThemeColor(selMode) : '#000'
+        }
+    }
+
+    function modalContent() {
+        const strTime = selItem.time
+
+        var title = selItem.title
+        var color = getThemeColor(selItem.window)
+
+        return <TimePicker time={strTime}
+            color={color}
+            title={title}
+            confirm={(e) => {
+                // selItem.time = e
+                setSelItem(selItem)
+                setShowTimePicker(false)
+                var array = JSON.parse(JSON.stringify(health.schedules))
+                array.map(item => {
+                    if (item.id == selItem.id) {
+                        item.time = e
+                    }
+                })
+                dispatch(setSchedules(array))
+                // var array = JSON.parse(JSON.stringify(list))
+                // array[selIndex].time = e
+                // setList(array)
+                // checkData(array)
+            }}
+            cancel={() => {
+                setShowTimePicker(false)
+            }} />
+    }
+
+    function commit(){
+        createSchedule({
+            schedules: health.schedules
+            // only_check: true
+        }).then(res => {
+            const data={
+                title:'一切就绪!',
+                description:'你的日程已启动',
+                current_window:(res as any).current_window
+            }
+            jumpPage('./post_result?type=schedule&data='+JSON.stringify(data))
+        })
+        
+        
+    }
+
+    function items() {
+        return <Card>
+            {
+                health.schedules.map((obj, i) => {
+                    return <View className='schedule_item' key={i} style={{
+                        width: rpxToPx(700),
+                        boxSizing: 'border-box',
+                        backgroundColor:  '#fff'
+
+                    }}>
+                        <View className='item_left2'>
+                            <View className='item_index'>
+                                <View className="index_point" style={{ backgroundColor: getThemeColor(obj.window) }} />
+                            </View>
+                            <Text className='item_name'>{obj.title}</Text>
+                            <View style={{ flex: 1 }} />
+                            {
+                                obj.is_conflict && <Text className="conflict_tip">时间冲突，请调整</Text>
+                            }
+                            {/* {
+                                !obj.is_all_day && !obj.reminder && <Image src={require('@assets/images/notification_off.png')} className='notification_icon' />
+                            } */}
+                            {
+                                !obj.is_all_day && <View className='edit_item_time' style={{backgroundColor:'transparent'}}>{obj.time}</View>
+                            }
+
+                            {
+                                i < items.length - 1 && <View className='item_line' />
+                            }
+                        </View>
+                    </View>
+                })
+            }
+        </Card>
+    }
+    return <View style={{ flex: 1, display: 'flex', flexDirection: 'column', height: '100vh' }}>
+        <NewHeader type={NewHeaderType.center_subtitle} title="即将完成!" subtitle="查看我的日程" />
+        {
+            items()
+        }
+        <View style={{ flex: 1 }} />
+        <View style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', marginBottom: rpxToPx(128) }}>
+            <NewButton
+                type={NewButtonType.fill}
+                title="完成"
+                color={MainColorType.fast}
+                width={rpxToPx(646)}
+                height={rpxToPx(96)}
+                onClick={commit}
+            />
+        </View>
+        {
+            showTimePicker && <Modal
+                testInfo={null}
+                dismiss={() => {
+                    setShowTimePicker(false)
+                }}
+                confirm={() => {
+
+                }}>
+                {
+                    modalContent()
+                }
+            </Modal>
+        }
+    </View>
+}

src/_health/pages/guide_sleep.config.ts

@@ -0,0 +1,8 @@
+export default definePageConfig({
+    usingComponents: {
+        // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
+        // 'demo':'../../components/demo'
+    },
+    "navigationBarTitleText": "",
+    "navigationBarBackgroundColor": "#f5f5f5"
+})

src/_health/pages/guide_sleep.tsx

@@ -0,0 +1,180 @@
+import { View, Text, Image } from "@tarojs/components";
+import './guide.scss'
+import '@/_health/pages/schedules.scss'
+import NewHeader, { NewHeaderType } from "../components/new_header";
+import { useEffect, useState } from "react";
+import { createSchedule, getSchedules } from "@/services/health";
+import { setSchedules } from "@/store/health";
+import { useDispatch, useSelector } from "react-redux";
+import Card from "../components/card";
+import { rpxToPx } from "@/utils/tools";
+import { getThemeColor } from "@/features/health/hooks/health_hooks";
+import Modal from "@/components/layout/Modal.weapp";
+import TimePicker from "@/features/common/TimePicker";
+import NewButton, { NewButtonType } from "../base/new_button";
+import { MainColorType } from "@/context/themes/color";
+import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
+
+export default function GuideSleep() {
+    const health = useSelector((state: any) => state.health);
+    const [errors, setErrors] = useState<any>([])
+    const [highlight, setHighlight] = useState(true)
+
+    const [selItem, setSelItem] = useState<any>(null)
+    const [selIndex, setSelIndex] = useState(-1)
+    const [showTimePicker, setShowTimePicker] = useState(false)
+
+    const dispatch = useDispatch()
+    const selMode = 'SLEEP'
+    useEffect(() => {
+        setTimeout(() => {
+            setHighlight(false)
+        }, 2000)
+    }, [])
+
+    function itemStyle(obj) {
+        if (obj.is_conflict) {
+            return {
+                backgroundColor: '#FF00001A',
+                color: '#FF0000'
+            }
+        }
+        if (errors.length > 0) {
+            return {
+                backgroundColor: '#B2B2B21A',
+                color: '#000'
+            }
+        }
+        return {
+            backgroundColor: obj.window == selMode ? getThemeColor(selMode) + '1A' : '#B2B2B21A',
+            color: obj.window == selMode ? getThemeColor(selMode) : '#000'
+        }
+    }
+
+    function modalContent() {
+        const strTime = selItem.time
+
+        var title = selItem.title
+        var color = getThemeColor(selItem.window)
+
+        return <TimePicker time={strTime}
+            color={color}
+            title={title}
+            confirm={(e) => {
+                // selItem.time = e
+                setSelItem(selItem)
+                setShowTimePicker(false)
+                var array = JSON.parse(JSON.stringify(health.schedules))
+                array.map(item => {
+                    if (item.id == selItem.id) {
+                        item.time = e
+                    }
+                })
+                dispatch(setSchedules(array))
+                check(array)
+                // var array = JSON.parse(JSON.stringify(list))
+                // array[selIndex].time = e
+                // setList(array)
+                // checkData(array)
+            }}
+            cancel={() => {
+                setShowTimePicker(false)
+            }} />
+    }
+
+    function check(array) {
+        createSchedule({
+            schedules: array,
+            only_check: true,
+            op_page:'SCHEDULE_WALKTHROUGH_2'
+        }).then(res => {
+            dispatch(setSchedules((res as any).schedules))
+            if ((res as any).result) {
+                setErrors([])
+            }
+            else {
+                setErrors((res as any).error_messages ? (res as any).error_messages : [])
+            }
+        })
+    }
+
+    function items() {
+        var items = health.schedules.filter(item => item.window == 'FAST' || item.window == 'SLEEP')
+        return <Card>
+            {
+                errors.map((item1, index) => {
+                    return <View key={index} className='error_tip'>{item1}</View>
+                })
+            }
+            {
+                items.map((obj, i) => {
+                    return <View className='schedule_item' key={i} style={{
+                        width: rpxToPx(700),
+                        boxSizing: 'border-box',
+                        backgroundColor: (obj.window == selMode && highlight) ? getThemeColor(selMode) + '08' : '#fff'
+
+                    }}>
+                        <View className='item_left2'>
+                            <View className='item_index'>
+                                <View className="index_point" style={{ backgroundColor: getThemeColor(obj.window) }} />
+                            </View>
+                            <Text className='item_name'>{obj.title}</Text>
+                            <View style={{ flex: 1 }} />
+                            {
+                                obj.is_conflict && <Text className="conflict_tip">时间冲突，请调整</Text>
+                            }
+                            {
+                                !obj.is_all_day && !obj.reminder && <Image src={require('@assets/images/notification_off.png')} className='notification_icon' />
+                            }
+                            {
+                                !obj.is_all_day && <View className='edit_item_time' onClick={() => {
+                                    setSelIndex(i)
+                                    setSelItem(obj)
+                                    setShowTimePicker(true)
+                                }} style={itemStyle(obj)}>{obj.time}</View>
+                            }
+
+                            {
+                                i < items.length - 1 && <View className='item_line' />
+                            }
+                        </View>
+                    </View>
+                })
+            }
+        </Card>
+    }
+    return <View style={{ flex: 1, display: 'flex', flexDirection: 'column', height: '100vh' }}>
+        <NewHeader type={NewHeaderType.center_subtitle} title="断食期间" subtitle="我的睡眠日程" />
+        {
+            items()
+        }
+        <View style={{ flex: 1 }} />
+        <View style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', marginBottom: rpxToPx(128) }}>
+            <NewButton
+                type={NewButtonType.fill}
+                title="下一步"
+                disable={errors.length>0}
+                color={MainColorType.sleep}
+                width={rpxToPx(646)}
+                height={rpxToPx(96)}
+                onClick={() => {
+                    jumpPage('./guide_eat')
+                }}
+            />
+        </View>
+        {
+            showTimePicker && <Modal
+                testInfo={null}
+                dismiss={() => {
+                    setShowTimePicker(false)
+                }}
+                confirm={() => {
+
+                }}>
+                {
+                    modalContent()
+                }
+            </Modal>
+        }
+    </View>
+}

src/_health/pages/post_result.tsx

@@ -13,6 +13,7 @@ import { setMode } from "@/store/health";
 import NewModal from "../base/new_modal";
 import Card from "../components/card";
 import { updateReminder } from "@/services/health";
+import StatusIndicator, { StatusType } from "../base/status_indicator";
 
 let useRoute;
 let useNavigation;
@@ -37,13 +38,12 @@ export default function PostResult() {
     const [data, setData] = useState(JSON.parse(router.params.data))
     const [showSetting, setShowSetting] = useState(false)
     const dispatch = useDispatch()
-    console.log(JSON.parse(router.params.data))
 
     function getMainColor() {
         if (data.scenario == 'MOVE' && data.extra.move_status == 'SEDENTARY') {
             return MainColorType.g02
         }
-        return getThemeColor(data.window)
+        return getThemeColor(data.window ? data.window : 'FAST')
     }
 
     function nextTitle() {
@@ -73,8 +73,8 @@ export default function PostResult() {
         return data.schedule_completed
     }
 
-    function changeReminder(e){
-        updateReminder({reminder:e.detail.value},data.next.schedule_id).then((res)=>{
+    function changeReminder(e) {
+        updateReminder({ reminder: e.detail.value }, data.next.schedule_id).then((res) => {
             var detail = JSON.parse(JSON.stringify(data))
             detail.next.reminder = e.detail.value
             setData(detail)
@@ -143,6 +143,20 @@ export default function PostResult() {
         return data.description
     }
 
+    function statusText() {
+        switch (data.current_window) {
+            case 'FAST':
+                return '当前正处于断食日程内'
+            case 'EAT':
+                return '当前正处于进食日程内'
+            case 'SLEEP':
+                return '当前正处于睡眠日程内'
+            case 'ACTIVE':
+                return '当前正处于活动日程内'
+        }
+        return ''
+    }
+
     return <View className="post_result_container">
         {
             headerIcon()
@@ -170,6 +184,17 @@ export default function PostResult() {
                 </View>
             </View>
         }
+        {
+            data.current_window && <View className="result_next" style={{alignItems:'center'}}>
+                <View className="result_top_line" />
+                <StatusIndicator
+                    text={statusText()}
+                    type={StatusType.normal}
+                    color={getThemeColor(data.current_window)}
+                    fontColor={MainColorType.g01} />
+            </View>
+
+        }
 
         <View style={{ flex: 1 }} />
         <View className="result_footer">
@@ -180,7 +205,15 @@ export default function PostResult() {
                 title="Done"
                 bold
                 onClick={() => {
-                    Taro.navigateBack()
+                    if (data.current_window){
+                        Taro.navigateBack({
+                            delta:6
+                        })
+                    }
+                    else {
+                        Taro.navigateBack()
+                    }
+                    
                 }}
             />
             {
@@ -209,7 +242,7 @@ export default function PostResult() {
                                 <View className="h24" style={{ color: MainColorType.g01 }}>{data.next.time}</View>
                                 <View className="h34">{data.next.title}</View>
                             </View>
-                            <Switch color={getThemeColor(data.window)} checked={data.next.reminder} onChange={changeReminder}/>
+                            <Switch color={getThemeColor(data.window)} checked={data.next.reminder} onChange={changeReminder} />
                         </View>
                     </Card>
                 </View>

src/_health/pages/schedules.tsx

@@ -14,6 +14,7 @@ import { IconAdd } from "@/components/basic/Icons";
 import AddLabel from "../components/add_label";
 import NewButton, { NewButtonType } from "../base/new_button";
 import showActionSheet from "@/components/basic/ActionSheet";
+import Card from "../components/card";
 
 let useRoute;
 let useNavigation;
@@ -200,9 +201,10 @@ export default function Schedules() {
                 }
                 if (selMode != '' && showMore) {
                     showAlert({
-                        title: '弹窗标题',
-                        content: '冲突描述',
+                        title: '日程冲突',
+                        content: '我们在您的当前日程和另一个日程之间发现了个或多个时间冲突。',
                         showCancel: false,
+                        confirmTitle:'日程冲突',
                         confirm: () => {
                             // jumpPage(`./schedules?mode=&schedules=${JSON.stringify((res as any).schedules)}&errors=${JSON.stringify((res as any).error_messages)}`)
                         }
@@ -321,11 +323,11 @@ export default function Schedules() {
             {
                 showAutoSave && <View className='success_tip'>已自动保存</View>
             }
-            <View style={{ backgroundColor: '#fff' }}>
+            <Card>
                 {
                     list.map((obj, i) => {
                         return <View className='schedule_item' key={i} style={{
-                            width: rpxToPx(750),
+                            width: rpxToPx(700),
                             boxSizing: 'border-box',
                             backgroundColor: (obj.window == selMode && highlight) ? getThemeColor(selMode) + '08' : '#fff'
 
@@ -357,16 +359,15 @@ export default function Schedules() {
                         </View>
                     })
                 }
-            </View>
-
+            </Card>
+                <View style={{height:20,flexShrink:0}}/>
             {
-                selMode != '' && selMode != 'DAY' && selMode != 'NIGHT' && <View className='item_add'
-                    style={{ marginTop: 20 }}
+                selMode != '' && selMode != 'DAY' && selMode != 'NIGHT' && <Card><View className='item_add'
                     onClick={() => add()}>
                     <IconAdd color={getAddColor()} width={rpxToPx(34)} />
                     <View className='toolbar_btn' style={{ color: getAddColor() }} >添加</View>
                     <View style={{ flex: 1 }} />
-                </View>
+                </View></Card>
             }
 
             <View className="main_footer" style={{ backgroundColor: 'transparent' }}>

src/app.config.ts

@@ -75,7 +75,13 @@ const appConfig = defineAppConfig({
         'pages/long_fast_setting',
         'pages/post_result',
         'pages/streak_calendar',
-        'pages/streak_weekly'
+        'pages/streak_weekly',
+        'pages/guide_fast',
+        'pages/guide_eat',
+        'pages/guide_sleep',
+        'pages/guide_active',
+        'pages/guide_full',
+
       ]
     }
   ],

src/features/health/MainConsole.tsx

@@ -1086,6 +1086,9 @@ export default function MainConsole(props: { type: WindowType }) {
 
             </View>
         }
+        <View onClick={()=>{
+            jumpPage('/_health/pages/guide_fast')
+        }}>Guide</View>
         <View className="circle" />
 
         {

src/features/health/MainHistory.tsx

@@ -10,6 +10,8 @@ import { jumpPage } from "../trackTimeDuration/hooks/Common";
 import Taro from "@tarojs/taro";
 import { getThemeColor } from "./hooks/health_hooks";
 import { TimeFormatter } from "@/utils/time_format";
+import dayjs from "dayjs";
+import { MainColorType } from "@/context/themes/color";
 
 let lastMode = ''
 export default function MainHistory(props: { type?: string, fast_type?: string }) {
@@ -91,6 +93,39 @@ export default function MainHistory(props: { type?: string, fast_type?: string }
         })
     }
 
+    function historyMonth(index, preIndex) {
+        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')
+            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')
+            if (currentDate != now) {
+                showDate = true
+                dateStr = currentDate
+            }
+        }
+        if (showDate) {
+            return <View className="h26" style={{
+                height: rpxToPx(84),
+                paddingLeft: rpxToPx(40),
+                display: 'flex',
+                flexDirection: 'row',
+                alignItems: 'center',
+                backgroundColor:'#fff',
+                color:MainColorType.g01
+            }}>{dateStr}</View>
+        }
+        return <View />
+    }
+
     if (!loaded)
         return <View />
 
@@ -118,14 +153,14 @@ export default function MainHistory(props: { type?: string, fast_type?: string }
             </View>
         }
         {
-            health.mode == 'EAT' && health.eatArchived && health.eatArchived.archived && <View style={{ 
-                display:'flex',
-                flexDirection:'column',
-                alignItems:'center',
-                paddingTop:rpxToPx(52),
-                paddingBottom:rpxToPx(38),
-                backgroundColor:'#fff'
-             }}>
+            health.mode == 'EAT' && health.eatArchived && health.eatArchived.archived && <View style={{
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'center',
+                paddingTop: rpxToPx(52),
+                paddingBottom: rpxToPx(38),
+                backgroundColor: '#fff'
+            }}>
                 <View className="archived_bg" onClick={() => {
                     jumpPage('/_health/pages/archive')
                 }}>
@@ -136,17 +171,20 @@ export default function MainHistory(props: { type?: string, fast_type?: string }
                         })
                     }
                     <Image src={require('@assets/_health/cell_arrow.png')} style={{
-                        width:rpxToPx(24),
-                        height:rpxToPx(24),
-                        marginLeft:rpxToPx(4),
+                        width: rpxToPx(24),
+                        height: rpxToPx(24),
+                        marginLeft: rpxToPx(4),
 
-                    }}/>
+                    }} />
                 </View>
             </View>
         }
         {
             list.map((item, index) => {
                 return <View ref={refDemo} id={'history_id_0'} key={index}>
+                    {
+                        historyMonth(index, index - 1)
+                    }
                     <HistoryItem
                         data={item}
                         preData={index > 0 ? list[index - 1] : null}

src/pages/clock/ClockNew.tsx

@@ -1,4 +1,4 @@
-import { View, ScrollView, Swiper, SwiperItem,Image } from "@tarojs/components";
+import { View, ScrollView, Swiper, SwiperItem, Image } from "@tarojs/components";
 import './Clock.scss'
 import { useEffect, useRef, useState } from "react";
 import MainDayNightCard from "@/features/health/MainDayNightCard";
@@ -29,6 +29,7 @@ export default function ClockNew() {
     const health = useSelector((state: any) => state.health);
     const [type, setType] = useState(WindowType.day)
     const [showCalendar, setShowCalendar] = useState(false)
+    const [showSection, setShowSection] = useState(false)
     const [isPulling, setIsPulling] = useState(false)
     const healthRef = useRef(health)
     const dispatch = useDispatch();
@@ -194,7 +195,7 @@ export default function ClockNew() {
         </ScrollView>
     }
     //https://blog.csdn.net/weixin_43525284/article/details/130182218
-    return <View style={{ flex: 1 }}>
+    return <View style={{ flex: 1, position: 'relative' }}>
         {
             process.env.TARO_ENV == 'weapp' ? detail() : <ScrollView style={{ flex: 1, backgroundColor: MainColorType.bg }} onScroll={e => {
                 if (e.detail.scrollTop > 240) {
@@ -209,10 +210,25 @@ export default function ClockNew() {
                 }
             </ScrollView>
         }
+        <View className="h26" style={{
+            position: 'absolute',
+            left: 0,
+            top: 0,
+            right: 0,
+            height: rpxToPx(84),
+            backgroundColor: '#f5f5f5',
+            paddingLeft: rpxToPx(40),
+            display: 'flex',
+            boxSizing: 'border-box',
+            flexDirection: 'row',
+            alignItems: 'center',
+            opacity: showSection ? 1 : 0,
+            color: MainColorType.g01
+        }}>111</View>
         {
             process.env.TARO_ENV == 'weapp' && <TabBar index={0} />
         }
 
-        
+
     </View>
 }

src/store/health.tsx

@@ -1,5 +1,6 @@
 import { createSlice } from "@reduxjs/toolkit";
 
+
 interface HealthState {
     windows: any;
     fast_with_sleep: any;
@@ -11,6 +12,7 @@ interface HealthState {
     eatArchived: any;
     showActionCircadian: boolean;
     isCompleted: boolean;
+    schedules: any;
 }
 
 const initialState: HealthState = {
@@ -24,6 +26,7 @@ const initialState: HealthState = {
     eatArchived: null,
     showActionCircadian: false,
     isCompleted: false,
+    schedules: []
 }
 
 const healthSlice = createSlice({
@@ -59,6 +62,9 @@ const healthSlice = createSlice({
             const { isShow, isCompleted } = action.payload
             state.showActionCircadian = isShow
             state.isCompleted = isCompleted
+        },
+        setSchedules(state,action){
+            state.schedules = action.payload
         }
 
     }
@@ -67,5 +73,5 @@ const healthSlice = createSlice({
 
 
 
-export const { setWindows, setMode, setTab, setRefreshs, setTitle, setEatArchived, setShowActionTip, setFastWithSleep,setLongFast } = healthSlice.actions;
+export const { setWindows, setMode, setTab, setRefreshs, setTitle, setEatArchived, setShowActionTip, setFastWithSleep,setLongFast,setSchedules } = healthSlice.actions;
 export default healthSlice.reducer;