import { View, Text, Image } from "@tarojs/components";
import './log_time.scss'
import './fast_sleep.scss'
import { useSelector } from "react-redux";
import { useEffect, useRef, useState } from "react";
import NewButton, { NewButtonType } from "../base/new_button";
import { rpxToPx } from "@/utils/tools";
import { getThemeColor } from "@/features/health/hooks/health_hooks";
import NewTimePicker from "../base/new_timepicker";
import { IconCalendar } from "@/components/basic/Icons";
import dayjs from "dayjs";
import { useRouter } from "@tarojs/taro";
import Card from "../components/card";
import { MainColorType } from "@/context/themes/color";
import Taro from "@tarojs/taro";
import { clockTimes, fastWithSleep } from "@/services/health";
import NewDurationPicker, { DurationPickerType } from "../base/new_durationpicker";
import showAlert from "@/components/basic/Alert";

let useRoute;
let useNavigation;
let scenario = '';
if (process.env.TARO_ENV == 'rn') {
    useRoute = require("@react-navigation/native").useRoute
    useNavigation = require("@react-navigation/native").useNavigation
}

export default function LogTime() {
    let router
    let navigation;
    if (useNavigation) {
        navigation = useNavigation()
    }

    if (process.env.TARO_ENV == 'rn') {
        router = useRoute()
    }
    else {
        router = useRouter()
    }
    const [enterTime, setEnterTime] = useState(new Date().getTime())

    const isSingle = router.params.single == '1'
    const isFast = router.params.window == 'FAST'
    const isStart = router.params.is_start == '1'
    const isFastWithSleep = router.params.is_fast_with_sleep == '1'
    const type = router.params.type
    const [data, setData] = useState<any>(null)
    const health = useSelector((state: any) => state.health);
    const [showGoal, setShowGoal] = useState(false)
    const tapIndex = router.params.index ?? 0

    const [expandIndex, setExpandIndex] = useState(router.params.initIndex ? router.params.initIndex : tapIndex)
    const [array, setArray] = useState<any>([])
    const [errors, setErrors] = useState<any>([])
    const [showSuccess, setShowSuccess] = useState(false)
    const [conflicts, setConflicts] = useState<any>([])
    const [loaded, setLoaded] = useState(false)
    const [autoCheck, setAutoCheck] = useState(false)
    const [initCheck, setInitCheck] = useState(router.params.initCheck == '1')

    const [ignoreCheck, setIgnoreCheck] = useState(false)


    useEffect(() => {
        if (isSingle) {
            if (isFast) {
                Taro.setNavigationBarTitle({
                    title: isStart ? '开始断食' : '结束断食'
                });
            }
            else {
                Taro.setNavigationBarTitle({
                    title: isStart ? '就寝' : '起床'
                });
            }
        }

        loadData()

        var now = new Date()
        var t = now.getTime()
        now.setHours(0)
        now.setMilliseconds(0)
        now.setSeconds(0)
        now.setMinutes(0)
        var t2 = now.getTime()
        t2 += 24 * 3600 * 1000
        var left = t2 - t + 500
        setTimeout(() => {
            setArray(array => {
                array.map((item) => {
                    item.today = false
                })
                return array;
            })
        }, left)

    }, [])

    useEffect(() => {
        if (autoCheck) {
            if (ignoreCheck) {
                setIgnoreCheck(false)
            }
            else {
                tapCommit(true)
            }

        }
        if (initCheck && array.length > 0) {
            tapCommit(true, true)
            setInitCheck(false)
        }
    }, [array])

    function loadData() {
        fastWithSleep().then(res => {
            setData(res)
            initDatas(res)
            setAutoCheck(true)
        })

    }

    function initDatas(res = data) {
        const { fast, sleep } = res
        var list: any = []
        if (isSingle) {
            var timeline: any;
            if (isFast) {
                timeline = isStart ? fast.timeline[0] : fast.timeline[1]
            }
            else {
                timeline = isStart ? sleep.timeline[0] : sleep.timeline[1]
            }
            list.push({
                event_id: timeline.event_id,
                schedule_id: timeline.schedule_id,
                time: dayjs().format('HH:mm'),
                today: true,
                extra: {
                    set_time: enterTime,
                    confirm_time: enterTime
                }
            })
            setExpandIndex(0)
        }
        else {
            for (var i = 0; i <= tapIndex; i++) {
                // if (type == 'home'){
                //     if (tapIndex == 2){
                //         if (i == 0 || i==3){
                //             continue;
                //         }
                //     }
                //     else if (tapIndex ==3){
                //         if (i==1||i==2){
                //             continue;
                //         }
                //     }
                // }
                var timeline: any;
                if (i == 0 || i == 3) {
                    timeline = i == 0 ? fast.timeline[0] : fast.timeline[1]
                }
                else {
                    timeline = i == 1 ? sleep.timeline[0] : sleep.timeline[1]
                }
                list.push({
                    event_id: timeline.event_id,
                    schedule_id: timeline.schedule_id,
                    time: dayjs().format('HH:mm'),
                    today: true,
                    extra: {
                        set_time: enterTime,
                        confirm_time: enterTime
                    }
                })
            }

            //逆推初始化时间
            var fastStartTime = new Date().getTime()
            var fastEndTime = new Date().getTime()
            var sleepStartTime = new Date().getTime()
            var sleepEndTime = new Date().getTime()

            fastStartTime = fastEndTime - fast.target.duration

            var fastEndtoWakeDuration = 0
            var time1 = fast.period.end_time
            var time2 = sleep.period.end_time

            var t1 = parseInt(time1.split(':')[0]) * 60 + parseInt(time1.split(':')[1])
            var t2 = parseInt(time2.split(':')[0]) * 60 + parseInt(time2.split(':')[1])
            fastEndtoWakeDuration = t1 - t2 > 0 ? (t1 - t2) * 60 * 1000 : (t1 - t2) * 60 * 1000 + 24 * 3600 * 1000

            sleepEndTime = fastEndTime - fastEndtoWakeDuration//(fast.target.end_timestamp-sleep.target.end_timestamp)
            sleepStartTime = sleepEndTime - sleep.target.duration

            var isConflict = false;
            if (fast.real && fast.real.start_timestamp && fast.real.start_timestamp > fastStartTime) {
                isConflict = true;
            }
            else if (sleep.real && sleep.real.start_timestamp && sleep.real.start_timestamp > sleepStartTime) {
                isConflict = true;
            }
            else if (sleep.real && sleep.real.end_timestamp && sleep.real.end_timestamp > sleepEndTime) {
                isConflict = true;
            }

            if (!isConflict) {
                var fastStartToday = new Date().getDate() == new Date(fastStartTime).getDate()
                list[0].today = fastStartToday
                list[0].time = dayjs(fastStartTime).format('HH:mm')

                var sleepStartToday = new Date().getDate() == new Date(sleepStartTime).getDate()
                list[1].today = sleepStartToday
                list[1].time = dayjs(sleepStartTime).format('HH:mm')

                if (list.length > 2) {
                    var sleepEndToday = new Date().getDate() == new Date(sleepEndTime).getDate()
                    list[2].today = sleepEndToday
                    list[2].time = dayjs(sleepEndTime).format('HH:mm')

                }

            }

            if (fast.real && fast.real.start_timestamp) {
                var fastStartToday = new Date().getDate() == new Date(fast.real.start_timestamp).getDate()
                list[0].today = fastStartToday
                list[0].disable = true
                list[0].time = dayjs(fast.real.start_timestamp).format('HH:mm')
            }

            if (sleep.real && sleep.real.start_timestamp) {
                var sleepStartToday = new Date().getDate() == new Date(sleep.real.start_timestamp).getDate()
                list[1].today = sleepStartToday
                list[1].disable = true
                list[1].time = dayjs(sleep.real.start_timestamp).format('HH:mm')
            }

            if (list.length > 2 && sleep.real && sleep.real.end_timestamp) {
                var sleepEndToday = new Date().getDate() == new Date(sleep.real.end_timestamp).getDate()
                list[2].today = sleepEndToday
                list[2].disable = true
                list[2].time = dayjs(sleep.real.end_timestamp).format('HH:mm')
            }
        }
        setArray(list)

        setLoaded(true)
    }

    function footerBtnColor() {
        if (isSingle) {
            return isFast ? MainColorType.fast : MainColorType.sleep
        }
        return MainColorType.fast
    }

    function getTimestamp(obj) {
        var time = obj.time
        var hour = parseInt(time.split(':')[0])
        var minute = parseInt(time.split(':')[1])
        var today = obj.today
        var now = new Date()
        now.setHours(hour)
        now.setMinutes(minute)
        now.setSeconds(0)
        now.setMilliseconds(0)
        var timestamp = now.getTime()
        if (!today) {
            timestamp -= 24 * 3600 * 1000
        }
        return timestamp
    }

    function tapCommit(onlyCheck, firstCheck = false) {
        var list: any = []
        if (isSingle) {
            var obj = array[0]
            var timestamp = getTimestamp(obj)
            var params: any = {
                schedule_id: obj.schedule_id,
                event_id: obj.event_id ? obj.event_id : null,
                extra: obj.extra,
                date: dayjs(timestamp).format('YYYYMMDD'),
                timestamp: timestamp,
            }
            if (isStart) {
                params.duration = isFast ? data.fast.target.duration : data.sleep.target.duration
            }
            list.push(params)
        }
        else {
            if (type == 'home') {
                if (parseInt(tapIndex + '') == 2) {
                    var obj = array[1]
                    var timestamp = getTimestamp(obj)
                    list.push({
                        schedule_id: obj.schedule_id,
                        event_id: obj.event_id ? obj.event_id : null,
                        extra: obj.extra,
                        date: dayjs(timestamp).format('YYYYMMDD'),
                        timestamp: timestamp,
                    })

                    var obj2 = array[2]
                    var timestamp2 = getTimestamp(obj2)
                    list.push({
                        schedule_id: obj2.schedule_id,
                        event_id: obj.event_id ? obj.event_id : null,
                        extra: obj2.extra,
                        date: dayjs(timestamp2).format('YYYYMMDD'),
                        timestamp: timestamp2,
                    })
                }
                if (parseInt(tapIndex + '') == 3) {
                    var obj = array[0]
                    var timestamp = getTimestamp(obj)
                    list.push({
                        schedule_id: obj.schedule_id,
                        event_id: obj.event_id ? obj.event_id : null,
                        extra: obj.extra,
                        date: dayjs(timestamp).format('YYYYMMDD'),
                        timestamp: timestamp,
                    })

                    var obj2 = array[3]
                    var timestamp2 = getTimestamp(obj2)
                    list.push({
                        schedule_id: obj2.schedule_id,
                        event_id: obj.event_id ? obj.event_id : null,
                        extra: obj2.extra,
                        date: dayjs(timestamp2).format('YYYYMMDD'),
                        timestamp: timestamp2,
                    })
                }
            }
            else {


                // const { status } = data
                for (var i = 0; i <= tapIndex; i++) {
                    if (firstCheck && i > 1) {

                    }
                    else {
                        var obj = array[i]
                        var timestamp = getTimestamp(obj)
                        list.push({
                            schedule_id: obj.schedule_id,
                            event_id: obj.event_id ? obj.event_id : null,
                            extra: obj.extra,
                            date: dayjs(timestamp).format('YYYYMMDD'),
                            timestamp: timestamp,
                        })
                    }
                }
            }
        }





        if (firstCheck && parseInt(router.params.initIndex) == 1) {
            var temps = [list[1], list[0]]
            commit(temps, onlyCheck)
        }
        else {
            commit(list, onlyCheck)
        }


    }

    function commit(list, onlyCheck) {
        console.log(list)
        const sortedData = list.sort((a, b) => {
            return b.extra.confirm_time - a.extra.confirm_time; // 降序
        });
        console.log(sortedData)
        clockTimes({
            check_items: sortedData,
            op_page: isFastWithSleep ? 'FAST_WITH_SLEEP' : null,
            only_check: onlyCheck,
            extra: {
                set_time: enterTime,
                confirm_time: new Date().getTime()
            }
        }).then(res => {
            if ((res as any).result) {
                setErrors([])
                setConflicts([])
                if (!onlyCheck) {
                    global.refreshWindow()
                    if (global.refreshFastSleep)
                        global.refreshFastSleep()
                    Taro.redirectTo({
                        url: './post_result?data=' + JSON.stringify(res)
                    })
                }



            }
            else {
                setErrors((res as any).error_messages)
                setConflicts((res as any).conflict_schedule_ids)
                setShowSuccess(true)
                setAutoCheck(true)
                var tempList = JSON.parse(JSON.stringify(array))
                tempList.map(item => {
                    if ((res as any).conflict_schedule_ids.includes(item.schedule_id)) {
                        item.disable = false
                    }
                })
                setIgnoreCheck(true)
                setArray(tempList)

            }

            // Taro.navigateBack({
            //     delta: 1
            // })
        })
    }

    function changeToScheduleTime(schedule_time, index) {
        var nowTime = parseInt(dayjs().format('HHmm'))
        var scheduleTime = parseInt(schedule_time.replace(':', ''))
        var isToday = true
        if (scheduleTime > nowTime) {
            isToday = false
        }
        var list = JSON.parse(JSON.stringify(array))
        list[index].today = isToday
        list[index].time = schedule_time
        list[index].extra.confirm_time = new Date().getTime()
        setArray(list)
    }

    function durationTime() {
        const { fast, sleep } = data
        var seconds = isFast ? fast.target.duration / 1000 : sleep.target.duration / 1000
        var hour = Math.floor(seconds / 3600)
        var minutes = Math.floor((seconds % 3600) / 60)
        var str = ''
        if (hour > 0) {
            str = hour + '小时'
        }
        if (minutes > 0) {
            str += minutes + '分钟'
        }
        return str
    }

    function changeTimeText(schedule_time, time) {
        if (time == schedule_time) {
            return `Check in:Today ${dayjs(enterTime).format('HH:mm')}`
        }
        return `Scheduled for ${schedule_time}`
    }

    function tapChangeTime(schedule_time, time, index) {
        if (time == schedule_time) {
            changeToScheduleTime(dayjs(enterTime).format('HH:mm'), index)
        }
        else {
            changeToScheduleTime(schedule_time, index)
        }

    }

    function logItem(index: number, iFast: boolean, iStart: boolean, showLine: boolean) {
        const { fast, sleep } = data
        var schedule_time = ''
        var title = ''

        var date = array[index].today ? "Today" : "Yesterday"
        var time = array[index].time

        const today = dayjs();
        var schedule_id = ''
        if (iFast) {
            schedule_time = iStart ? fast.period.start_time : fast.period.end_time
            schedule_id = iStart ? fast.timeline[0].schedule_id : fast.timeline[1].schedule_id
            if (!iStart && fast.status == 'OG') {
                schedule_time = dayjs(fast.target.end_timestamp).format('HH:mm')
            }
            title = iStart ? 'Fast starts' : 'Fast ends'



            if (array[index].disable) {
                var timestamp = iStart ? fast.real.start_timestamp : fast.real.end_timestamp
                const dt = dayjs(timestamp);
                const yesterday = today.subtract(1, 'day');
                time = dayjs(timestamp).format('HH:mm')

                if (dt.isSame(today, 'day')) {
                    date = 'Today';
                } else if (dt.isSame(yesterday, 'day')) {
                    date = 'Yesterday';
                } else {
                    date = dt.format('MM-DD');
                }
            }
        }
        else {
            schedule_time = iStart ? sleep.period.start_time : sleep.period.end_time
            schedule_id = iStart ? sleep.timeline[0].schedule_id : sleep.timeline[1].schedule_id
            if (!iStart && sleep.status == 'OG') {
                schedule_time = dayjs(sleep.target.end_timestamp).format('HH:mm')
            }
            title = iStart ? 'Bedtime' : 'Wake up'
            if (array[index].disable) {
                var timestamp = iStart ? sleep.real.start_timestamp : sleep.real.end_timestamp
                const dt = dayjs(timestamp);
                const yesterday = today.subtract(1, 'day');
                time = dayjs(timestamp).format('HH:mm')

                if (dt.isSame(today, 'day')) {
                    date = 'Today';
                } else if (dt.isSame(yesterday, 'day')) {
                    date = 'Yesterday';
                } else {
                    date = dt.format('MM-DD');
                }
            }
        }

        var showError = false;
        if (conflicts.includes(schedule_id)) {
            showError = true
        }



        return <View style={{ position: 'relative' }}>
            <View className="card_header">
                {
                    showError && <View className="error_icon_bg">
                        <Image src={require('@assets/_health/tip_error.png')} style={{ width: rpxToPx(26), height: rpxToPx(26) }} />
                    </View>

                }
                {
                    isSingle ? <View style={{ flex: 1 }} /> :
                        <View className="h34" style={{ flex: 1 }}>{title}</View>
                }

                <View style={{
                    borderColor: showError ? 'red' : 'transparent',
                    borderWidth: rpxToPx(2),
                    borderRadius: rpxToPx(88 / 4),
                    borderStyle: 'solid'
                }}>
                    <NewButton
                        type={NewButtonType.gray}
                        title={date}
                        fontSize={rpxToPx(34)}
                        width={rpxToPx(196)}
                        height={rpxToPx(84)}
                        disable={array[index].disable}
                        onClick={() => {
                            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={{
                    borderColor: showError ? 'red' : 'transparent',
                    borderWidth: rpxToPx(2),
                    borderRadius: rpxToPx(88 / 4),
                    borderStyle: 'solid'
                }}>
                    <NewButton
                        type={expandIndex == index ? NewButtonType.alpha : NewButtonType.gray}
                        color={iFast ? MainColorType.fast : MainColorType.sleep}
                        title={time}
                        fontSize={rpxToPx(34)}
                        width={rpxToPx(136)}
                        height={rpxToPx(84)}
                        disable={array[index].disable}
                        onClick={() => {
                            setExpandIndex(index)
                        }}
                    />
                </View>
                {
                    isSingle && <View style={{ flex: 1 }} />
                }
                <View className='border_footer_line' style={{ left: rpxToPx(66) }} />
            </View>
            {
                expandIndex == index && <View style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', width: rpxToPx(698) }}>
                    <NewTimePicker time={array[index].time} onChange={(e) => {
                        var list = JSON.parse(JSON.stringify(array))
                        list[index].time = e
                        list[index].extra.confirm_time = new Date().getTime()
                        debugger
                        setArray(list)
                    }} color={iFast ? MainColorType.fast : MainColorType.sleep} />
                </View>
            }

            {/* {
                expandIndex == index && <View className='card_footer' onClick={() => tapChangeTime(schedule_time, time, index)}>
                    
                    <Text style={{ color: '#5C7099', marginLeft: rpxToPx(12), fontSize: rpxToPx(26) }}>{changeTimeText(schedule_time, time)}</Text>
                </View>
            } */}
            {
                expandIndex == index && <View className='card_footer'>
                    <NewButton type={NewButtonType.link}
                        title={changeTimeText(schedule_time, time)}
                        onClick={() => tapChangeTime(schedule_time, time, index)}
                    >
                        <View style={{ marginRight: rpxToPx(12), display: 'flex' }}>
                            <IconCalendar width={rpxToPx(24)} color='#5C7099' />
                        </View>
                    </NewButton>
                </View>
            }
            {
                showLine && <View className="border_footer_line" style={{ left: rpxToPx(66) }} />
            }

        </View>
    }

    function multiContent() {
        if (type == 'home') {
            switch (parseInt(tapIndex + '')) {
                case 2:
                    return <View style={{ position: 'relative' }}>
                        {
                            logItem(1, false, true, false)
                        }
                        {
                            logItem(2, false, false, false)
                        }
                    </View>
                case 3:
                    return <View style={{ position: 'relative' }}>
                        {
                            logItem(0, true, true, false)
                        }
                        {
                            logItem(3, true, false, false)
                        }
                    </View>
            }

        }
        const { status } = data
        switch (parseInt(tapIndex + '')) {
            case 1:
                return <View style={{ position: 'relative' }}>
                    {
                        logItem(0, true, true, true)
                    }
                    {
                        logItem(1, false, true, false)
                    }
                </View>
            case 2:
                return <View style={{ position: 'relative' }}>
                    {
                        logItem(0, true, true, true)
                    }
                    {
                        logItem(1, false, true, true)
                    }
                    {
                        logItem(2, false, false, false)
                    }
                </View>
            case 3:
                return <View style={{ position: 'relative' }}>
                    {
                        logItem(0, true, true, true)
                    }
                    {
                        logItem(1, false, true, true)
                    }
                    {
                        logItem(2, false, false, true)
                    }
                    {
                        logItem(3, true, false, false)
                    }
                </View>
        }
        return <View style={{ position: 'relative' }}></View>
    }

    function tapFooterBtn(onlyCheck, firstCheck = false) {

        var list: any = []
        if (isSingle) {
            var obj = array[0]
            var timestamp = getTimestamp(obj)
            var params: any = {
                schedule_id: obj.schedule_id,
                event_id: obj.event_id ? obj.event_id : null,
                extra: obj.extra,
                date: dayjs(timestamp).format('YYYYMMDD'),
                timestamp: timestamp,
            }
            if (isStart) {
                params.duration = isFast ? data.fast.target.duration : data.sleep.target.duration
            }
            list.push(params)
        }
        else {
            if (type == 'home') {
                if (parseInt(tapIndex + '') == 2) {
                    var obj = array[1]
                    var timestamp = getTimestamp(obj)
                    list.push({
                        schedule_id: obj.schedule_id,
                        event_id: obj.event_id ? obj.event_id : null,
                        extra: obj.extra,
                        date: dayjs(timestamp).format('YYYYMMDD'),
                        timestamp: timestamp,
                    })

                    var obj2 = array[2]
                    var timestamp2 = getTimestamp(obj2)
                    list.push({
                        schedule_id: obj2.schedule_id,
                        event_id: obj.event_id ? obj.event_id : null,
                        extra: obj2.extra,
                        date: dayjs(timestamp2).format('YYYYMMDD'),
                        timestamp: timestamp2,
                    })
                }
                if (parseInt(tapIndex + '') == 3) {
                    var obj = array[0]
                    var timestamp = getTimestamp(obj)
                    list.push({
                        schedule_id: obj.schedule_id,
                        event_id: obj.event_id ? obj.event_id : null,
                        extra: obj.extra,
                        date: dayjs(timestamp).format('YYYYMMDD'),
                        timestamp: timestamp,
                    })

                    var obj2 = array[3]
                    var timestamp2 = getTimestamp(obj2)
                    list.push({
                        schedule_id: obj2.schedule_id,
                        event_id: obj.event_id ? obj.event_id : null,
                        extra: obj2.extra,
                        date: dayjs(timestamp2).format('YYYYMMDD'),
                        timestamp: timestamp2,
                    })
                }
            }
            else {


                // const { status } = data
                for (var i = 0; i <= tapIndex; i++) {
                    if (firstCheck && i > 1) {

                    }
                    else {
                        var obj = array[i]
                        var timestamp = getTimestamp(obj)
                        list.push({
                            schedule_id: obj.schedule_id,
                            event_id: obj.event_id ? obj.event_id : null,
                            extra: obj.extra,
                            date: dayjs(timestamp).format('YYYYMMDD'),
                            timestamp: timestamp,
                        })
                    }
                }
            }
        }

        //检查断食时间是否超过24小时
        const { fast } = data
        if (fast.real) {
            var t = fast.real.start_timestamp
            var schedule_id = fast.timeline[1].schedule_id
            if (list[list.length - 1].schedule_id == schedule_id && list[list.length - 1].timestamp - t > 24 * 3600 * 1000) {
                showAlert({
                    title: 'Saving as Long Fast',
                    content: 'Fasting that lasts more than 24 hours will be saved as Long Fast. ',
                    showCancel: true,
                    cancelText: '取消',
                    confirmText: '保存',
                    cancel: () => {
                    },
                    confirm: () => {
                        tapCommit(false)
                    }
                })
                return;
            }
        }

        tapCommit(false)
    }

    if (!loaded) return <View />

    return <View className="page_container">
        <View style={{ height: rpxToPx(36) }} />
        <Card>
            <View style={{ display: 'flex', flexDirection: 'column' }}>
                {
                    errors.map((item, index) => {
                        return <View className="error_bg" key={index}>
                            <View className="error_icon_bg">
                                <Image src={require('@assets/_health/tip_error.png')} style={{ width: rpxToPx(26), height: rpxToPx(26) }} />
                            </View>
                            <Text className="h24" style={{ lineHeight: rpxToPx(36) + 'px' }}>{item}</Text>
                        </View>
                    })
                }
                {
                    autoCheck && showSuccess && errors.length == 0 && <View className="error_bg" style={{ backgroundColor: MainColorType.success + '1A' }}>
                        <View className="error_icon_bg" style={{ backgroundColor: MainColorType.success }}>
                            <Image src={require('@assets/_health/tip_check.png')} style={{ width: rpxToPx(26), height: rpxToPx(26) }} />
                        </View>
                        <Text className="h24" style={{ lineHeight: rpxToPx(36) + 'px' }}>成功提示</Text>
                    </View>
                }
                {
                    isSingle ? <View style={{ position: 'relative' }}>
                        {
                            logItem(0, isFast, isStart, false)
                        }
                    </View> : multiContent()
                }
            </View>

        </Card>
        <View style={{ height: rpxToPx(36) }} />
        {
            isSingle && isStart && !showGoal && <View style={{ height: rpxToPx(72), marginTop: rpxToPx(18) }}>
                <NewButton
                    type={NewButtonType.link}
                    title="Show More"
                    onClick={() => {
                        setShowGoal(true)
                    }}
                />
            </View>
        }
        {
            isSingle && isStart && showGoal && <Card>
                <View style={{ position: 'relative' }}>
                    <View className="card_header" style={{ justifyContent: 'space-between' }}>
                        <View className="h34">{isFast ? 'Fast Goal' : 'Sleep Goal'}</View>
                        <NewButton
                            type={NewButtonType.gray}
                            height={rpxToPx(84)}
                            title={durationTime()}
                            onClick={() => { setExpandIndex(-1) }}
                        />
                    </View>
                    {
                        expandIndex == -1 && <NewDurationPicker
                            type={DurationPickerType.normal}
                            value={isFast ? data.fast.target.duration : data.sleep.target.duration}
                            onChange={e => {
                                var temp = JSON.parse(JSON.stringify(data))
                                if (isFast) {
                                    temp.fast.target.duration = e
                                }
                                else {
                                    temp.sleep.target.duration = e
                                }
                                setData(temp)
                            }}
                            color={isFast ? MainColorType.fast : MainColorType.sleep} />
                    }

                </View>
            </Card>
        }
        <View style={{ flex: 1 }} />
        <View style={{ marginBottom: rpxToPx(128), display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
            <NewButton
                color={footerBtnColor()}
                type={NewButtonType.fill}
                title={'Log'}
                width={rpxToPx(646)}
                height={rpxToPx(96)}
                bold={true}
                onClick={() => tapFooterBtn(false)} />
        </View>

    </View>
}