update

src/app.scss

@@ -127,7 +127,7 @@ page {
     color: transparent;
 }
 
-.box_header{
+.box_header {
     display: flex;
     flex-direction: row;
     height: 48px;
@@ -138,18 +138,18 @@ page {
     margin-bottom: 12px;
 }
 
-.box_title{
+.box_title {
     display: flex;
     // background-color: red;
     height: 48px;
     font-weight: bold;
     font-size: 48px;
     line-height: 48px;
-    flex:1;
+    flex: 1;
     color: #fff;
 }
 
-.box_subtitle{
+.box_subtitle {
     font-size: 32px;
     line-height: 32px;
     // font-weight: 400px;
@@ -159,7 +159,7 @@ page {
     // background-color: pink;
 }
 
-.flex-expand{
+.flex-expand {
     position: absolute;
     left: 0;
     top: 0;
@@ -168,7 +168,7 @@ page {
     width: calc(100vw + 12px);
 }
 
-.modal_content{
+.modal_content {
     padding-bottom: 120px;
     display: flex;
     flex-direction: column;
@@ -182,7 +182,7 @@ page {
     text-align: center;
 }
 
-.add_more{
+.add_more {
     width: 320px;
     height: 314px;
     display: flex;
@@ -200,7 +200,7 @@ page {
     margin-bottom: 20px;
 }
 
-.add_more_text{
+.add_more_text {
     margin-top: 32px;
     color: #fff;
     font-weight: bold;
@@ -209,6 +209,93 @@ page {
     opacity: 0.8;
 }
 
+.cell_header {
+    color: #fff;
+    opacity: 0.6;
+    margin-left: 86px;
+    font-size: 28px;
+    line-height: 28px;
+    margin-bottom: 20px;
+}
+
+.cell_footer {
+    color: #fff;
+    opacity: 0.2;
+    margin-left: 86px;
+    line-height: 32px;
+    font-size: 24px;
+    margin-top: 20px;
+}
+
+.cell_full {
+    background-color: #1C1C1C;
+    display: flex;
+    flex-direction: row;
+    height: 96px;
+    margin-left: 46px;
+    margin-right: 46px;
+    padding-left: 40px;
+    padding-right: 40px;
+    align-items: center;
+    border-radius: 24px;
+}
+
+.cell_top {
+    background-color: #1C1C1C;
+    display: flex;
+    flex-direction: row;
+    height: 96px;
+    margin-left: 46px;
+    margin-right: 46px;
+    padding-left: 40px;
+    padding-right: 40px;
+    align-items: center;
+    border-top-left-radius: 24px;
+    border-top-right-radius: 24px;
+    position: relative;
+}
+
+.cell_line{
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    left: 40px;
+    
+    background-color: #323232;
+}
+
+.cell_bottom {
+    background-color: #1C1C1C;
+    display: flex;
+    flex-direction: row;
+    height: 96px;
+    margin-left: 46px;
+    margin-right: 46px;
+    padding-left: 40px;
+    padding-right: 40px;
+    align-items: center;
+    border-bottom-left-radius: 24px;
+    border-bottom-right-radius: 24px;
+}
+
+.cell_title {
+    font-size: 28px;
+    color: #fff;
+    flex: 1;
+}
+
+.cell_value {
+    font-size: 28px;
+}
+
+.cell_arrow {
+
+    width: 40px;
+    height: 40px;
+    opacity: 0.2;
+
+}
+
 
 // @media only screen and (-webkit-min-device-pixel-ratio: 2.0) {
 //     .px1Width::after {

src/components/input/PickerViews.tsx

@@ -52,6 +52,7 @@ const Component = forwardRef((props: {
     return <View className='modal_content' catchMove>
         <Text className='modal_title' style={{ color: color }}>{props.title ? props.title : '测试标题 '}</Text>
         <PickerView value={v}
+            // color='#fff'
             style={{color:'#fff'}}
             onChange={onPickerChange}
             indicatorStyle='height: 50px;'
@@ -61,7 +62,7 @@ const Component = forwardRef((props: {
         >
             {
                 props.items.map(item => {
-                    return <PickerViewColumn>
+                    return <PickerViewColumn style={{color:'red'}} >
                         {item.map(obj => {
                             return (
                                 <Text style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', color: '#fff'}}>{obj}</Text>

src/features/common/SpecBtns.tsx

@@ -140,6 +140,31 @@ export const SetScheduleBtn = (props: { onClick: Function, title: string, isFast
 }
 
 export const ChooseScenarioBtn = (props: { onClick: Function, title: string, background: string, disable?: boolean,longClick?:Function }) => {
+    if (process.env.TARO_ENV == 'rn'){
+        return (
+            <Buttons title={props.title} type={ButtonType.elevated}
+                onClick={() => { props.onClick() }}
+                longClick={props.longClick}
+                disabled={props.disable}
+                btnStyle={{
+                    height: 50,
+                    width: 300,
+                    boxSizing: 'border-box',
+                    borderRadius: 25,
+                    backgroundColor: props.background,
+                    paddingLeft: 40,
+                    paddingRight: 40,
+                    color: 'black',
+                    fontSize: 20,
+                    fontWeight: 'bold',
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                }}
+            />
+        )
+    }
+    
     return (
         <Buttons title={props.title} type={ButtonType.elevated}
             onClick={() => { props.onClick() }}
@@ -150,7 +175,7 @@ export const ChooseScenarioBtn = (props: { onClick: Function, title: string, bac
                 width: 300,
                 boxSizing: 'border-box',
                 borderRadius: 25,
-                backgroundColor: props.background,
+                background: props.background,
                 paddingLeft: 40,
                 paddingRight: 40,
                 color: 'black',

src/features/trackTimeDuration/components/ChooseScenario.scss

@@ -34,9 +34,7 @@
     box-sizing: border-box;
 }
 
-.linear_badge_bg{
-    background: linear-gradient(90deg, $fastColor 0%, $sleepColor 100%);
-}
+
 
 .badge1 {
     font-size: 20px;
@@ -49,9 +47,29 @@
     font-weight: 500;
 }
 
+/* #ifdef weapp */
 .fast_sleep_text {
     background: linear-gradient(90deg, $fastColor 0%, $sleepColor 100%);
     -webkit-background-clip: text;
     background-clip: text;
     color: transparent;
-}
+}
+
+.linear_badge_bg{
+    background: linear-gradient(90deg, $fastColor 0%, $sleepColor 100%);
+}
+
+/* #endif */
+
+/* #ifdef rn */
+.fast_sleep_text {
+    // background: linear-gradient(90deg, $fastColor 0%, $sleepColor 100%);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+}
+
+.linear_badge_bg{
+    // background: linear-gradient(90deg, $fastColor 0%, $sleepColor 100%);
+}
+/* #endif */

src/features/trackTimeDuration/components/ChooseScenario.tsx

@@ -2,14 +2,14 @@ import { View, Text } from "@tarojs/components";
 import Buttons from '@/components/basic/Buttons';
 import Texts from '@/components/basic/Texts';
 import Rings from '@components/view/Rings';
-import Rings2, { BgRing, RingCommon, TargetRing } from './Rings.weapp';
+import Rings2, { BgRing, RingCommon, TargetRing } from './Rings';
 import Footer from '@/components/layout/Footer';
 import SingleSelect from '../../../components/input/SingleSelect';
 import { ComponentStatus, NaviBarTitleShowType, TemplateType, TextType } from "@utils/types";
 import { useTranslation } from 'react-i18next'
 
 import './ChooseScenario.scss'
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { useDidShow, useReady } from "@tarojs/taro";
 import Taro from "@tarojs/taro";
 import { useDispatch, useSelector } from "react-redux";
@@ -21,7 +21,10 @@ import { ColorType } from "@/context/themes/color";
 import TitleView from "./TitleView";
 import { jumpPage } from "../hooks/Common";
 
-
+let useNavigation;
+if (process.env.TARO_ENV == 'rn') {
+  useNavigation = require("@react-navigation/native").useNavigation
+}
 export default function Component() {
     const isFastFirst = true;
     const { t } = useTranslation()
@@ -31,11 +34,16 @@ export default function Component() {
     const selScenario = useSelector((state: any) => state.scenario);
     const [count, setCount] = useState(0)
 
+    let navigation;
+    if (useNavigation) {
+      navigation = useNavigation()
+    }
+
     useDidShow(() => {
         setCount(count + 1)
     })
 
-    useReady(() => {
+    useEffect(()=>{
         if (selScenario) {
             if (selScenario.name == 'FAST_SLEEP') {
                 dispatch(setStep(isFastFirst ? 'fast' : 'sleep'))
@@ -60,6 +68,10 @@ export default function Component() {
             Taro.setStorage({ key: 'scenarios', data: JSON.stringify(data.scenarios as any) })
             setScenarios(data.scenarios)
         })
+    },[])
+
+    useReady(() => {
+        
     })
 
     function next() {
@@ -80,7 +92,7 @@ export default function Component() {
                     dispatch(setStep(isFastFirst ? 'fast' : 'sleep'))
                 }
         }
-        jumpPage('/pages/clock/SetSchedule')
+        jumpPage('/pages/clock/SetSchedule','SetSchedule',navigation)
     }
 
     function footerContent() {
@@ -102,7 +114,6 @@ export default function Component() {
                 background = 'linear-gradient(to right, ' + (global.fastColor ? global.fastColor : ColorType.fast) + ', ' + (global.sleepColor ? global.sleepColor : ColorType.sleep) + ')'
                 break;
         }
-        console.log(background)
         return <View>
             <ChooseScenarioBtn title={t('feature.common.btn_next')} onClick={next} background={background} />
             {/* <Buttons title='Next' onClick={next} btnStyle={{ ...style, width: 320 }} /> */}
@@ -125,37 +136,6 @@ export default function Component() {
         return (end - start) / 1440 * 2 * Math.PI
     }
 
-    // function getScheduleTarget(isFast: boolean) {
-    //     for (var i = 0; i < scenarios.length; i++) {
-    //         if (isFast && scenarios[i].name == 'FAST') {
-    //             if (global.schedule_fast){
-    //                 return global.schedule_fast
-    //             }
-    //             return scenarios[i].schedule.fast
-    //         }
-    //         else if (!isFast && scenarios[i].name == 'SLEEP') {
-    //             if (global.schedule_sleep){
-    //                 return global.schedule_sleep
-    //             }
-    //             return scenarios[i].schedule.sleep
-    //         }
-    //         else {
-    //             if (isFast){
-    //                 if (global.schedule_fast){
-    //                     return global.schedule_fast
-    //                 }
-    //                 return scenarios[i].schedule.fast
-    //             }
-    //             if (global.schedule_sleep){
-    //                 return global.schedule_sleep
-    //             }
-    //             return scenarios[i].schedule.sleep
-    //         }
-
-    //     }
-
-    // }
-
     function getScheduleTarget(isFast: boolean) {
         for (var i = 0; i < scenarios.length; i++) {
             if (isFast && scenarios[i].name == 'FAST') {
@@ -280,7 +260,6 @@ export default function Component() {
         else {
             dispatch(setStep(isFastFirst ? 'fast' : 'sleep'))
         }
-        // dispatch(setScenarioName(scenarios[index].scenario) as any)
     }
 
     return <Layout title={t('page.choose_scenario.title')}
@@ -289,15 +268,16 @@ export default function Component() {
             <TitleView title={t('page.choose_scenario.title')}
                 subTitle={t('page.choose_scenario.sub_title')}
             />
-            {/* <Texts text={t('page.choose_scenario.title')} type={TextType.primary}></Texts> */}
-            {/* <Texts text={t('page.choose_scenario.sub_title')} type={TextType.secondary}></Texts> */}
-            {/* <View style={{ height: 20 }} /> */}
             {
                 scenarios.length > 0 && <View style={{ position: 'relative', zIndex: 1 }}>
                     <SingleSelect items={items()} itemSelect={handleItemSelect} selIndex={selIndex} />
                 </View>
             }
 
+            {
+                process.env.TARO_ENV =='rn'  &&  <View style={{height:30}}/>
+            }
+
 
             <Footer children={footerContent()} />
         </View>

src/features/trackTimeDuration/components/SetSchedule.rn.tsx

@@ -0,0 +1,438 @@
+import Buttons from "@/components/basic/Buttons";
+import { setPlan } from "@/services/trackTimeDuration";
+import { setScenario, setStep } from "@/store/scenario";
+import { View, Text, PageContainer, Image } from "@tarojs/components";
+import "./SetSchedule.scss";
+import Taro, { useDidShow, useReady } from "@tarojs/taro";
+import { useEffect, useRef, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import Footer from "@/components/layout/Footer";
+import PickerViews from "@/components/input/PickerViews";
+import { durationDatas, durationIndex, durationTime, pickerDurations } from "../hooks/Console";
+import { TimeFormatter } from "@/utils/time_format";
+import Modal from "@/components/layout/Modal";
+import TimePicker from "@/features/common/TimePicker";
+import { SetScheduleBtn } from "@/features/common/SpecBtns";
+import Layout from "@/components/layout/layout";
+import { NaviBarTitleShowType, TemplateType } from "@/utils/types";
+import { useTranslation } from "react-i18next";
+import { ColorType } from "@/context/themes/color";
+import TitleView from "./TitleView";
+import { jumpPage } from "../hooks/Common";
+import { rpxToPx } from "@/utils/tools";
+import { PixelRatio } from "react-native";
+
+let useNavigation;
+if (process.env.TARO_ENV == 'rn') {
+    useNavigation = require("@react-navigation/native").useNavigation
+}
+export default function Component() {
+    const isFastFirst = true;
+    const { t } = useTranslation()
+    const dispatch = useDispatch();
+    const canvasRef = useRef(null);
+    const [scenario] = useState(useSelector((state: any) => state.scenario))
+    // const scenario = useSelector((state: any) => state.scenario);
+    const common = useSelector((state: any) => state.common);
+
+    const [isOpen, setIsOpen] = useState(false)
+    const [isTimeOpen, setIsTimeOpen] = useState(false)
+    const [btnDisable, setBtnDisable] = useState(false)
+
+    const pickerRef = useRef<any>(null);
+    // const [count,setCount] = useState(0)
+    const [beginChange, setBeginChange] = useState(true)
+    const [operateType, setOperateType] = useState(0)
+    const [isModalTimePicker, setIsModalTimePicker] = useState(false)
+
+    let navigation;
+    if (useNavigation) {
+        navigation = useNavigation()
+    }
+
+
+
+    var scheduleObj: { start_time: any; end_time: any; };
+    if (scenario.name == 'FAST') {
+        scheduleObj = scenario.schedule.fast
+    }
+    else if (scenario.name == 'SLEEP') {
+        scheduleObj = scenario.schedule.sleep
+    }
+    else {
+        if (scenario.step == 'fast') {
+            scheduleObj = scenario.schedule.fast
+        }
+        else {
+            scheduleObj = scenario.schedule.sleep
+        }
+    }
+
+
+
+    const [startTime, setStartTime] = useState(scheduleObj.start_time)
+    const [endTime, setEndTime] = useState(scheduleObj.end_time)
+
+    global.startTime = startTime
+    global.endTime = endTime
+    const [pickerValue, setPickerValue] = useState(durationIndex(scheduleObj.start_time, scheduleObj.end_time, common))
+
+    const [hours, setHours] = useState(durationTime(scheduleObj.start_time, scheduleObj.end_time)[0])
+    const [minutes, setMinutes] = useState(durationTime(scheduleObj.start_time, scheduleObj.end_time)[1])
+    const [chooseStart, setChooseStart] = useState(true)
+    const [count, setCount] = useState(0)
+
+
+    useEffect(() => {
+        if (global.schedule_fast && scenario.step == 'fast') {
+            scheduleObj = global.schedule_fast
+        }
+        if (global.schedule_sleep && scenario.step == 'sleep') {
+            scheduleObj = global.schedule_sleep
+        }
+        setStartTime(scheduleObj.start_time)
+        setEndTime(scheduleObj.end_time)
+        setPickerValue(durationIndex(scheduleObj.start_time, scheduleObj.end_time, common))
+        setHours(durationTime(scheduleObj.start_time, scheduleObj.end_time)[0])
+        setMinutes(durationTime(scheduleObj.start_time, scheduleObj.end_time)[1])
+    }, [])
+
+    useEffect(() => {
+        if (isOpen || isTimeOpen) {
+            global.disableCanvasGesture = true
+        }
+        else {
+            global.disableCanvasGesture = false
+        }
+    }, [isOpen, isTimeOpen])
+
+
+    useDidShow(() => {
+        setCount(count + 1)
+    })
+
+
+    function start() {
+        if (scenario.name == 'FAST' || scenario.name == 'SLEEP') {
+            setBtnDisable(true)
+            setPlan({
+                scenario: scenario.name,
+                schedule: scenario.name == 'FAST' ? {
+                    fast: {
+                        start_time: startTime,
+                        end_time: endTime,
+                    }
+                } : {
+                    sleep: {
+                        start_time: startTime,
+                        end_time: endTime,
+                    }
+                }
+            }).then(res => {
+                setBtnDisable(false)
+                global.checkData()
+                if (process.env.TARO_ENV == 'weapp') {
+                    Taro.navigateBack({ delta: 3 })
+                }
+                else {
+                    navigation.popToTop()
+                }
+            }).catch(e => {
+                setBtnDisable(false)
+            })
+        }
+        else {
+            if ((scenario.step == 'fast' && isFastFirst) || (scenario.step == 'sleep' && !isFastFirst)) {
+                var obj = JSON.parse(JSON.stringify(scenario))
+                if (isFastFirst) {
+                    obj.schedule.fast = {
+                        start_time: startTime,
+                        end_time: endTime,
+                    }
+                    dispatch(setStep('sleep'))
+                    dispatch(setScenario(obj))
+                }
+                else {
+                    obj.schedule.sleep = {
+                        start_time: startTime,
+                        end_time: endTime,
+                    }
+                    dispatch(setStep('fast'))
+                    dispatch(setScenario(obj))
+                }
+
+                saveTempCache(startTime, endTime)
+
+                jumpPage('/pages/clock/SetSchedule', 'SetSchedule', navigation)
+            }
+            else {
+                commit()
+            }
+        }
+    }
+
+    function saveTempCache(strStart, strEnd) {
+        if (scenario.step == 'fast') {
+            global.schedule_fast = {
+                start_time: strStart,
+                end_time: strEnd,
+            }
+        }
+        if (scenario.step == 'sleep') {
+            global.schedule_sleep = {
+                start_time: strStart,
+                end_time: strEnd,
+            }
+        }
+
+    }
+
+    function commit() {
+        setBtnDisable(true)
+        setPlan({
+            scenario: scenario.name,
+            schedule: {
+                fast: {
+                    start_time: isFastFirst ? scenario.schedule.fast.start_time : startTime,
+                    end_time: isFastFirst ? scenario.schedule.fast.end_time : endTime,
+                }, sleep: {
+                    start_time: !isFastFirst ? scenario.schedule.sleep.start_time : startTime,
+                    end_time: !isFastFirst ? scenario.schedule.sleep.end_time : endTime,
+                }
+            }
+        }).then(res => {
+            setBtnDisable(false)
+            dispatch(setStep('fast'))
+            global.checkData()
+
+            if (process.env.TARO_ENV == 'weapp') {
+                Taro.navigateBack({ delta: 4 })
+            }
+            else {
+                navigation.popToTop()
+            }
+
+        }).catch(e => {
+            setBtnDisable(false)
+        })
+    }
+
+    function onStartTimeChange(e: string) {
+        setIsTimeOpen(false)
+        setBeginChange(true)
+        setStartTime(e)
+
+        setPickerValue(durationIndex(e, endTime, common))
+        setHours(durationTime(e, endTime)[0])
+        setMinutes(durationTime(e, endTime)[1])
+        saveTempCache(e, endTime);
+        console.log(e)
+
+        global.updateDial(e, endTime)
+    }
+
+    function onEndTimeChange(e: string) {
+        setIsTimeOpen(false)
+        setBeginChange(false)
+        setEndTime(e)
+        setPickerValue(durationIndex(startTime, e, common))
+        setHours(durationTime(startTime, e)[0])
+        setMinutes(durationTime(startTime, e)[1])
+        saveTempCache(startTime, e);
+        if (global.updateDial)
+            global.updateDial(startTime, e)
+    }
+
+
+
+    function showPicker() {
+        setIsOpen(true)
+    }
+
+    function durationChange(e) {
+        var count = (e[0] + common.duration.min) * 60 + e[1] * common.duration.step
+
+        var h = parseInt(count / 60)
+        var m = count % 60
+        setHours(h)
+        setMinutes(m)
+        setPickerValue(e)
+        setIsOpen(false)
+        if (beginChange) {
+            var strEnd = TimeFormatter.calculateTimeByTimeRange(count, startTime, true)
+
+            setEndTime(strEnd);
+            saveTempCache(startTime, strEnd)
+            if (global.updateDial)
+                global.updateDial(startTime, strEnd)
+        }
+        else {
+            var strStart = TimeFormatter.calculateTimeByTimeRange(count, endTime, false)
+
+            setStartTime(strStart);
+            saveTempCache(strStart, endTime)
+            if (global.updateDial)
+                global.updateDial(strStart, endTime)
+        }
+
+    }
+
+    global.startDuration = (type) => {
+        setOperateType(type)
+    }
+
+    global.updateDuration = (start, end) => {
+        var startCount = parseInt(start.split(':')[0]) * 60 + parseInt(start.split(':')[1])
+        var endCount = parseInt(end.split(':')[0]) * 60 + parseInt(end.split(':')[1])
+        if (operateType == 1 && startCount % 30 == 0) {
+            Taro.vibrateShort({
+                type: 'medium',
+            })
+        }
+        else if (operateType == 2 && endCount % 30 == 0) {
+            Taro.vibrateShort({
+                type: 'medium',
+            })
+        }
+        else if (operateType == 3 && (startCount % 30 == 0 || endCount % 30 == 0)) {
+            Taro.vibrateShort({
+                type: 'medium',
+            })
+        }
+
+        setStartTime(start)
+        setEndTime(end)
+        setPickerValue(durationIndex(start, end, common))
+        setHours(durationTime(start, end)[0])
+        setMinutes(durationTime(start, end)[1])
+        saveTempCache(start, end)
+    }
+
+
+    global.endDuration = () => {
+        setOperateType(0)
+    }
+
+    function layoutContent() {
+        return <PickerViews ref={pickerRef}
+            onChange={durationChange}
+            items={durationDatas(common)}
+            value={pickerValue} height={200}
+            title={scenario.step == 'fast' ?
+                t('feature.track_time_duration.dial.picker_fast_schedule_duration') :
+                t('feature.track_time_duration.dial.picker_sleep_schedule_duration')}
+            themeColor={scenario.step == 'fast' ? global.fastColor ? global.fastColor : ColorType.fast : global.sleepColor ? global.sleepColor : ColorType.sleep}
+            showBtns={true} onCancel={() => { setIsOpen(false) }} />
+    }
+
+    function pickerTitle() {
+        if (scenario.step == 'fast') {
+            if (chooseStart) {
+                return t('feature.track_time_duration.dial.picker_fast_schedule_start_time');
+            }
+            return t('feature.track_time_duration.dial.picker_fast_schedule_end_time');
+        }
+        else {
+            if (chooseStart) {
+                return t('feature.track_time_duration.dial.picker_sleep_schedule_start_time');
+            }
+            return t('feature.track_time_duration.dial.picker_sleep_schedule_end_time');
+        }
+    }
+
+
+    function timeContent() {
+        return <TimePicker time={chooseStart ? startTime : endTime}
+            color={scenario.step == 'fast' ? global.fastColor ? global.fastColor : ColorType.fast : global.sleepColor ? global.sleepColor : ColorType.sleep}
+            title={pickerTitle()}
+            confirm={chooseStart ? onStartTimeChange : onEndTimeChange}
+            cancel={() => { setIsTimeOpen(false) }} />
+    }
+
+    function detail() {
+
+        return <View style={{ height: Taro.getSystemInfoSync().screenHeight - 200, flexDirection: 'column', display: 'flex' }}>
+            {/* <Text className="subtitle">{t('page.set_schedule.fast_subtitle')}</Text> */}
+            <TitleView title={scenario.step == 'fast' ? t('page.set_schedule.fast_title') : t('page.set_schedule.sleep_title')}
+                subTitle={t('page.set_schedule.fast_subtitle')}
+                titleColor={scenario.step == 'fast' ? global.fastColor ? global.fastColor : ColorType.fast : global.sleepColor ? global.sleepColor : ColorType.sleep}
+            />
+
+            <View style={{ color: '#fff', marginTop: rpxToPx(64) }}>
+                <Text className="cell_header">{scenario.step == 'fast' ? '断食目标' : '睡眠目标'}</Text>
+                <View className="cell_full" onClick={() => { setIsModalTimePicker(false); setIsOpen(true) }}>
+                    <Text className="cell_title">时长</Text>
+                    <Text className="cell_value" style={{ color: scenario.step == 'fast' ? ColorType.fast : ColorType.sleep }}>{hours > 0 ? hours + '小时' : ''}{minutes > 0 ? minutes + '分钟' : ''}</Text>
+                    <Image className="cell_arrow" src={require('@/assets/images/arrow3.png')} />
+                </View>
+                <Text className="cell_footer">计划每日断食16小时45分钟，其余7小时15分钟进食。</Text>
+
+                <View style={{ height: rpxToPx(60) }} />
+                <Text className="cell_header">{scenario.step == 'fast' ? '断食日程' : '睡眠目标'}</Text>
+                <View className="cell_top" onClick={() => {
+                    setIsModalTimePicker(true)
+                    setChooseStart(true)
+                    setIsTimeOpen(true)
+                }}>
+                    <Text className="cell_title">开始时间</Text>
+                    <Text className="cell_value" style={{ color: scenario.step == 'fast' ? ColorType.fast : ColorType.sleep }}>{startTime}</Text>
+                    <Image className="cell_arrow" src={require('@/assets/images/arrow3.png')} />
+                    <View className="cell_line" style={{height:1/PixelRatio.get()}}/>
+                </View>
+                <View className="cell_bottom" onClick={() => {
+                    setIsModalTimePicker(true)
+                    setChooseStart(false)
+                    setIsTimeOpen(true)
+                }}>
+                    <Text className="cell_title">结束时间</Text>
+                    <Text className="cell_value" style={{ color: scenario.step == 'fast' ? ColorType.fast : ColorType.sleep }}>{endTime}</Text>
+                    <Image className="cell_arrow" src={require('@/assets/images/arrow3.png')} />
+                </View>
+                <Text className="cell_footer">计划每日18:00开始断食，次日10:00结束断食。</Text>
+            </View>
+
+            <View style={{ flex: 1 }} />
+
+            <Footer>
+                <SetScheduleBtn title={(scenario.step == 'fast' && scenario.name == 'FAST_SLEEP') ? t('feature.common.btn_set_and_next') : t('feature.common.btn_set_and_done')}
+                    lowLight={operateType != 0}
+                    isFast={scenario.step == 'fast'}
+                    disable={btnDisable}
+                    onClick={() => start()} />
+            </Footer>
+
+            {/* <PageContainer style={{ backgroundColor: '#1c1c1c' }}
+        overlayStyle='background-color:rgba(0,0,0,0.9)'
+        custom-style='background-color:#1c1c1c'
+        closeOnSlideDown={false}
+        onAfterLeave={() => { setIsOpen(false); setIsTimeOpen(false) }}
+        show={isOpen || isTimeOpen} round={true} overlay={true} position='bottom'
+      >
+        {
+          isModalTimePicker?timeContent():layoutContent()
+        }
+      </PageContainer> */}
+            {
+                isOpen && <Modal children={layoutContent()} dismiss={() => setIsOpen(false)} confirm={() => {
+                    setIsOpen(false)
+                    durationChange(pickerRef.current.getConfirmData())
+                }} />
+            }
+            {
+                isTimeOpen && <Modal children={timeContent()} dismiss={() => setIsTimeOpen(false)} confirm={() => {
+                    setIsTimeOpen(false)
+                }} />
+            }
+
+        </View>
+    }
+
+    return <Layout
+        titleColor={scenario.step == 'fast' ? global.fastColor ? global.fastColor : ColorType.fast : global.sleepColor ? global.sleepColor : ColorType.sleep}
+        title={scenario.step == 'fast' ? t('page.set_schedule.fast_title') : t('page.set_schedule.sleep_title')}
+        titleShowStyle={NaviBarTitleShowType.scrollToShow} type={TemplateType.customHeader}>
+        {
+            detail()
+        }
+    </Layout>;
+}

src/features/trackTimeDuration/components/TimelineStage.rn.tsx

@@ -31,9 +31,9 @@ export default function Component(props: { data: any, title?: string, subTitle?:
     useEffect(() => {
         AppState.addEventListener('change', handleAppStateChange);
 
-        return () => {
-            AppState.removeEventListener('change', handleAppStateChange);
-        };
+        // return () => {
+        //     AppState.removeEventListener('change', handleAppStateChange);
+        // };
     }, []);
 
     // useReady(() => {
@@ -58,7 +58,7 @@ export default function Component(props: { data: any, title?: string, subTitle?:
     }
 
     function goSetting(){
-        Linking.openSettings()
+        Linking.openURL('app-settings://notification/myapp')
     }
 
 

src/features/trackTimeDuration/components/TitleView.tsx

@@ -7,6 +7,12 @@ import { useTranslation } from 'react-i18next';
 import { jumpPage } from '../hooks/Common';
 import { useEffect, useState } from 'react';
 
+let useNavigation;
+if (process.env.TARO_ENV == 'rn') {
+    useNavigation = require("@react-navigation/native").useNavigation
+}
+
+
 export default function Component(props: {
     children?: any,
     subTitle?: string,
@@ -18,14 +24,20 @@ export default function Component(props: {
 }) {
     const time = useSelector((state: any) => state.time);
     const user = useSelector((state: any) => state.user);
-    const  [count,setCount]  = useState(0)
+    const [count, setCount] = useState(0)
     const { t } = useTranslation()
     const dispatch = useDispatch();
     const isFastFirst = true
 
-    useEffect(()=>{
-        setCount(count+1)
-    },[global.isDebug])
+    let navigation;
+    if (useNavigation) {
+        navigation = useNavigation()
+    }
+
+
+    useEffect(() => {
+        setCount(count + 1)
+    }, [global.isDebug])
 
 
 
@@ -58,7 +70,7 @@ export default function Component(props: {
                     else {
                         dispatch(setStep('fast'))
                     }
-                    jumpPage('/pages/clock/SetSchedule')
+                    jumpPage('/pages/clock/SetSchedule', 'SetSchedule', navigation)
                     break;
                 case 0:
                     if (time.status != 'WAIT_FOR_START') {
@@ -68,7 +80,7 @@ export default function Component(props: {
                         })
                         return;
                     }
-                    jumpPage('/pages/clock/ChooseScenario')
+                    jumpPage('/pages/clock/ChooseScenario', 'ChooseScenario', navigation)
                     break;
             }
         })
@@ -79,8 +91,8 @@ export default function Component(props: {
 
     var showAddIcon = user.isLogin && props.showAddBtn
 
-    return <View className={(props.children||props.subTitle) ? 'title_view' : 'title_view no_sub_element'} 
-    style={{backgroundColor:global.isDebug?'red':'transparent'}}>
+    return <View className={(props.children || props.subTitle) ? 'title_view' : 'title_view no_sub_element'}
+        style={{ backgroundColor: global.isDebug ? 'red' : 'transparent' }}>
         <View className='title_bg'>
             <Text className='title' style={{
                 color: props.titleColor ? props.titleColor : '#fff',

src/features/trackTimeDuration/hooks/Common.tsx

@@ -18,10 +18,6 @@ export const getThemeColor = (time: any) => {
 
 export const jumpPage = (url?: string, pageName?: string, navigation?: any, params?: any) => {
     if (process.env.TARO_ENV == 'rn') {
-        if (params){
-            console.log(params)
-        }
-        console.log(pageName)
         navigation.push(pageName,params);
     }
     else {

src/pages/clock/Clock.weapp.tsx

@@ -480,6 +480,7 @@ export default function IndexPage() {
           onBeforeLeave={() => {
             Taro.showTabBar();
           }}
+          onClickOverlay={() => { alert('a') }}
           onAfterLeave={() => { setShowModal(false); setShowModal2(false) }}
           show={showModal || showModal2} round={true} overlay={true} position='bottom'
         >
@@ -526,7 +527,10 @@ export default function IndexPage() {
                 checkData && (checkData as any).latest_record &&
                 <SectionHeader top={48} bottom={24} title={t('feature.track_time_duration.record_fast_sleep.header.latest_record')}>
                   <Header title='' action={() => {
-                    jumpPage('/pages/common/RecordsHistory?type=time&title=time')
+                    jumpPage('/pages/common/RecordsHistory?type=time&title=time','RecordsHistory',navigation,{
+                      type:'time',
+                      title:'time'
+                    })
                   }} />
                 </SectionHeader>
               }

src/pages/clock/SetSchedule.tsx

@@ -1,7 +1,7 @@
 import { View } from "@tarojs/components";
 import { useRouter } from "@tarojs/taro";
 import { useEffect } from "react";
-import SetSchedule from '@features/trackTimeDuration/components/SetSchedule'
+import SetSchedule from '@/features/trackTimeDuration/components/SetSchedule'
 
 export default function Page() {
   // const router = useRouter();

src/pages/common/RecordsHistory.tsx

@@ -18,8 +18,19 @@ import './RecordsHistory.scss'
 import { clearWorkoutRecords, workoutRecords } from "@/services/workout";
 import WorkoutHistory from "@/features/workout/WorkoutHistory";
 
+let useRoute;
+if (process.env.TARO_ENV == 'rn') {
+    useRoute = require("@react-navigation/native").useRoute
+}
+
 export default function Page() {
-    const router = useRouter();
+    let router
+    if (process.env.TARO_ENV == 'rn') {
+        router = useRoute()
+    }
+    else {
+        router = useRouter()
+    }
     const pageSize = 10
     const [pageIndex, setPageIndex] = useState(1)
     const [records, setRecords] = useState<any[]>([])
@@ -43,6 +54,10 @@ export default function Page() {
         setModalDetail(detail)
     }
 
+    useEffect(()=>{
+        refresh()
+    },[])
+
     useEffect(() => {
         startTimer();
         return () => {
@@ -120,15 +135,20 @@ export default function Page() {
     }
 
     function getHistory(page = pageIndex) {
+        console.log('current type',router.params.type)
+        debugger
         if (page == 1)
             setTriggered(true)
+        
         if (router.params.type == 'time') {
+            console.log('9527')
             getClockRecords({
                 page: page,
                 limit: pageSize,
                 // completed: true,
                 part_completed: true
             }).then(res => {
+                console.log('time  list',res)
                 Taro.stopPullDownRefresh()
                 setTriggered(false)
                 setLoaded(true)
@@ -219,7 +239,10 @@ export default function Page() {
             content: t('feature.common.modal.delete_all_content'),
             success: (res) => {
                 if (res.confirm) {
+
                     doClear()
+
+
                 }
             }
         })

src/pages/rn/RNMain.tsx

@@ -10,6 +10,9 @@ import Profile from '../account/Profile'
 import ChooseAuth from '@/pages/account/ChooseAuth'
 import Auth from '@/pages/account/Auth'
 import Setting from '@/pages/account/Setting'
+import SetSchedule  from '@/pages/clock/SetSchedule'
+import ChooseScenario from '@/pages/clock/ChooseScenario'
+import RecordsHistory from '@/pages/common/RecordsHistory'
 import Food from '@/pages/food/Food'
 import DemoA from '../clock/demoA';
 import { View } from '@tarojs/components';
@@ -107,6 +110,9 @@ export default function RNMain() {
         <Stack.Screen name='ChooseAuth' component={ChooseAuth} />
         <Stack.Screen name='Auth' component={Auth} />
         <Stack.Screen name='Setting' component={Setting} />
+        <Stack.Screen name='ChooseScenario' component={ChooseScenario} />
+        <Stack.Screen name='RecordsHistory' component={RecordsHistory} />
+        <Stack.Screen name='SetSchedule' component={SetSchedule} />
       </Stack.Navigator>
     </NavigationContainer>
   )

src/services/http/request.ts

@@ -130,7 +130,7 @@ export async function request<T>(param: RequestParam): Promise<T> {
                 }
             },
             fail: err => {
-                if ((err as any).statusCode == 204){
+                if ((err as any).statusCode >= 200 && (err as any).statusCode < 300){
                     resolve()
                     return;
                 }