update

src/components/LimitPickers.tsx

@@ -2,6 +2,7 @@ import { PickerView, PickerViewColumn, View, Text } from "@tarojs/components";
 import { useEffect, useState } from "react";
 
 export default function Component(props: { limit: number, onChange: Function, onCancel: Function }) {
+    console.log('oppsu')
     const days: string[] = [];
     const today = new Date();
     const [values, setValues] = useState([6, today.getHours(), today.getMinutes()])

src/components/PickerViews.tsx

@@ -1,7 +1,7 @@
 import { PickerView, PickerViewColumn, View } from "@tarojs/components";
 import { useEffect, useState } from "react";
 
-export default function Component(props: { value: number[], onChange: Function, items: any[] }) {
+export default function Component(props: { value: number[], onChange: Function, items: any[],height?:number }) {
     const [v,setV] = useState([0])
     useEffect(() => {
         setV(props.value)
@@ -13,7 +13,8 @@ export default function Component(props: { value: number[], onChange: Function,
     }
     return <PickerView value={v}
         onChange={onPickerChange}
-        indicatorStyle='height: 50px;' style='width: 100%; height: 100px;'>
+        indicatorStyle='height: 50px;' 
+        style={props.height?`width: 100%; height: ${props.height}px;`:`width: 100%; height: 100px;`}>
         {
             props.items.map(item => {
                 return <PickerViewColumn>

src/features/trackTimeDuration/actions/TrackTimeActions.tsx

@@ -4,8 +4,8 @@ import trackTimeService, { machine } from "@/store/trackTimeMachine"
 export const startFast = (start_time: number, duration: number) => {
     // const duration = fastValues[0] * 3600 * 1000 + fastValues[1] * 60 * 1000
     const extra = {
-        set_time: start_time - 20 * 1000,
-        confirm_time: start_time + 50 * 1000,
+        set_time: global.set_time,
+        confirm_time: new Date().getTime(),
     }
     recordCheck({
         action: 'FAST_START',
@@ -19,8 +19,8 @@ export const startFast = (start_time: number, duration: number) => {
 
 export const endFast = (start_time: number) => {
     const extra = {
-        set_time: start_time - 20 * 1000,
-        confirm_time: start_time + 50 * 1000,
+        set_time: global.set_time,
+        confirm_time: new Date().getTime(),
     }
     recordCheck({
         action: 'FAST_END',
@@ -37,8 +37,8 @@ export const endFast = (start_time: number) => {
 export const startSleep = (start_time: number, duration: number) => {
     // const duration = sleepValues[0] * 3600 * 1000 + sleepValues[1] * 60 * 1000
     const extra = {
-        set_time: start_time - 20 * 1000,
-        confirm_time: start_time + 50 * 1000,
+        set_time: global.set_time,
+        confirm_time: new Date().getTime(),
     }
     recordCheck({
         action: 'SLEEP_START',
@@ -52,8 +52,8 @@ export const startSleep = (start_time: number, duration: number) => {
 export const endSleep = (start_time: number) => {
     // const duration = 8 * 3600 * 1000;
     const extra = {
-        set_time: start_time - 20 * 1000,
-        confirm_time: start_time + 50 * 1000,
+        set_time: global.set_time,
+        confirm_time: new Date().getTime(),
     }
     recordCheck({
         action: 'SLEEP_END',

src/features/trackTimeDuration/components/Console.tsx

@@ -25,7 +25,7 @@ export default function Component() {
     const [fastStr, setFastStr] = useState('00:00');
     const [sleepStr, setSleepStr] = useState('00:00');
     const [isOpen, setIsOpen] = useState(false);
-    const [resetPicker, setResetPicker] = useState(false);
+    const [showModal, setShowModal] = useState(false);
     const [fastPickerValue, setFastPickerValue] = useState([0])
     const [sleepPickerValue, setSleepPickerValue] = useState([0])
 
@@ -114,16 +114,15 @@ export default function Component() {
 
 
     function showPicker() {
+        setShowModal(true)
         setIsOpen(true)
+        global.set_time = new Date().getTime()
     }
 
     function hidePicker() {
         setIsOpen(false)
         setTimeout(() => {
-            setResetPicker(true)
-        }, 500)
-        setTimeout(() => {
-            setResetPicker(false)
+            setShowModal(false)
         }, 1000)
     }
 
@@ -132,11 +131,8 @@ export default function Component() {
         var current_record = machine.context.checkData ? (machine.context.checkData as any).current_record : null;
         if (current_record && current_record.last_real_check_time)
             limit = current_record.last_real_check_time
-        if (resetPicker) {
-            return <View />
-        }
         return <View>
-            <LimitPickers limit={limit} onCancel={() => { setIsOpen(false) }} onChange={(e) => {
+            <LimitPickers limit={limit} onCancel={hidePicker} onChange={(e) => {
                 console.log(new Date(e))
                 pickerConfirm(e)
                 hidePicker()
@@ -228,7 +224,7 @@ export default function Component() {
         <View style={{ display: 'flex', flexDirection: 'column', width: '100%', alignItems: 'center' }}>
             {
                 machine.context.checkData && (machine.context.checkData as any).current_record.last_real_check_time &&
-                <Text style={{ width: '100%', textAlign: 'center',color:'red' }}>
+                <Text style={{ width: '100%', textAlign: 'center', color: 'red' }}>
                     {TimeFormatter.formateTime((machine.context.checkData as any).current_record.last_real_check_time)}
                 </Text>
             }
@@ -268,17 +264,20 @@ export default function Component() {
                 }
             </View>
 
-            
-            <AtFloatLayout
-                isOpened={isOpen}
-                onClose={() => {
-                    setIsOpen(false)
-                }}
-                title="">
-                {
-                    layoutContent()
-                }
-            </AtFloatLayout>
+            {
+                showModal && <AtFloatLayout
+                    isOpened={isOpen}
+                    onClose={() => {
+                        setIsOpen(false)
+                        setShowModal(false)
+                    }}
+                    title="">
+                    {
+                        layoutContent()
+                    }
+                </AtFloatLayout>
+            }
+
         </View>
     )
 }

src/features/trackTimeDuration/components/More.tsx

@@ -14,6 +14,7 @@ const Component = forwardRef((props, ref) => {
     const scenario = useSelector((state: any) => state.scenario);
     const user = useSelector((state: any) => state.user);
     const [isOpen, setIsOpen] = useState(false);
+    const [showModal, setShowModal] = useState(false);
 
     useEffect(() => {
         var value = trackTimeService.getSnapshot().value
@@ -31,10 +32,6 @@ const Component = forwardRef((props, ref) => {
         })
     }
 
-    function demo(){
-        console.log('demo')
-    }
-
     function waitActionSheet() {
         Taro.showActionSheet({
             itemList: [t('feature.track_time_duration.action_sheet.change_schedule'), t('feature.track_time_duration.action_sheet.switch_scenario')]
@@ -68,8 +65,9 @@ const Component = forwardRef((props, ref) => {
                 switch (res.tapIndex) {
                     case 0:
                         {
-
+                            setShowModal(true)
                             setIsOpen(true)
+                            global.set_time = new Date().getTime()
                         }
                         break;
                 }
@@ -111,7 +109,7 @@ const Component = forwardRef((props, ref) => {
         if (current_record && current_record.last_real_check_time)
             limit = current_record.last_real_check_time
         return <View>
-            <LimitPickers limit={limit} onCancel={() => { setIsOpen(false) }} onChange={(e) => {
+            <LimitPickers limit={limit} onCancel={() => { setIsOpen(false);setShowModal(false) }} onChange={(e) => {
                 console.log(new Date(e))
                 endFast(e)
                 setIsOpen(false)
@@ -120,20 +118,24 @@ const Component = forwardRef((props, ref) => {
     }
 
     return (
-        <View  ref={ref} style={{ width: '100%', marginTop: 20, marginBottom: 20, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+        <View ref={ref} style={{ width: '100%', marginTop: 20, marginBottom: 20, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
             <Text onClick={checkActionSheetData}>More Component</Text>
-            <AtFloatLayout
-                isOpened={isOpen}
-                onClose={() => {
-                    setIsOpen(false)
-                }}
-                title="">
-                {
-                    layoutContent()
-                }
+            {
+                showModal && <AtFloatLayout
+                    isOpened={isOpen}
+                    onClose={() => {
+                        setIsOpen(false)
+                        setShowModal(false)
+                    }}
+                    title="">
+                    {
+                        layoutContent()
+                    }
+
 
+                </AtFloatLayout>
+            }
 
-            </AtFloatLayout>
         </View>
     )
 }

src/features/trackTimeDuration/components/SetSchedule.scss

@@ -0,0 +1,28 @@
+.box{
+    margin-left: 32px;
+    margin-right: 32px;
+    background: #1C1C1C;
+    border-radius: 56px;
+    display: flex;
+    flex-direction: column;
+    height: 1000px;
+}
+
+.header{
+    margin-top: 40px;
+    display: flex;
+    flex-direction: row;
+}
+
+.item{
+    display: flex;
+    flex: 1;
+    align-items: center;
+    justify-content: center;
+}
+
+.duration{
+    font-size: 48px;
+    margin-bottom: 40px;
+    text-align: center;
+}

src/features/trackTimeDuration/components/SetSchedule.tsx

@@ -2,16 +2,23 @@ import Buttons from "@/components/Buttons";
 import { setPlan } from "@/services/trackTimeDuration";
 import { setScenario, setStep } from "@/store/scenario";
 import { View, Text } from "@tarojs/components";
-import { Picker } from '@tarojs/components'
-import Taro from "@tarojs/taro";
+import "./SetSchedule.scss";
+import Taro, { useReady } from "@tarojs/taro";
 import TimePickers from "@/components/TimePickers";
 // import { AtList, AtListItem } from 'taro-ui'
 import { useState } from "react";
 import { useDispatch, useSelector } from "react-redux";
+import Footer from "@/components/Footer";
+import PickerViews from "@/components/PickerViews";
+import { AtFloatLayout } from "taro-ui";
+import "taro-ui/dist/style/components/float-layout.scss";
+import { pickerDurations } from "../hooks/Console";
 
 export default function Component() {
   const dispatch = useDispatch();
   const scenario = useSelector((state: any) => state.scenario);
+  const [pickerValue, setPickerValue] = useState(0)
+  const [isOpen, setIsOpen] = useState(false)
   var scheduleObj: { start_time: any; end_time: any; };
   if (scenario.name == 'FAST') {
     scheduleObj = scenario.schedule.fast
@@ -92,11 +99,61 @@ export default function Component() {
     setEndTime(e)
   }
 
+  useReady(() => {
+    var title = scenario.step == 'fast' ? 'Fast schedule' : 'Sleep schedule'
+    Taro.setNavigationBarTitle({
+      title: title
+    })
+  })
+
+  function showPicker() {
+    setIsOpen(true)
+  }
+
+  function durationChange(e) {
+    var count = e[0] * 5 + 60;
+    setPickerValue(e[0])
+  }
+
+  function layoutContent() {
+    return <View style={{color:'#000'}}>
+      <Text>11111</Text>
+      <PickerViews onChange={durationChange} items={[pickerDurations()]} value={[pickerValue]} height={200}/>
+    </View>
+  }
+
   return <View >
-    <Text>场景名称{scenario.name}</Text>
-    <TimePickers time={startTime} content={'开始时间' + startTime} change={onStartTimeChange} />
-    <TimePickers time={endTime} content={'结束时间' + endTime} change={onEndTimeChange} />
+    {/* <Text>场景名称{scenario.name}</Text> */}
+
+    <View className="box">
+      <View className="header">
+        <View className="item">
+          <TimePickers time={startTime} content={scenario.step == 'fast' ? 'Fast starts\n' + startTime : 'Sleep starts\n' + startTime} change={onStartTimeChange} />
+        </View>
+        <View className="item">
+          <TimePickers time={endTime} content={scenario.step == 'fast' ? 'Fast ends\n' + endTime : 'Sleep ends\n' + endTime} change={onEndTimeChange} />
+        </View>
+
+
+      </View>
+      <View style={{ flex: 1 }} />
+      <Text className="duration" onClick={()=>{setIsOpen(true)}}>16 hours 00 mins</Text>
+    </View>
+
+    {/* <Footer child={
+      <Buttons title={scenario.step == 'fast' ? 'Set fast schedule' : 'Set sleep schedule'} style={{ backgroundColor: scenario.step == 'fast' ? '#AAFF00' : '#00ffff', width: 320 }} onClick={() => start()}></Buttons>
+    } /> */}
+
+    <AtFloatLayout
+      isOpened={isOpen}
+      onClose={() => {
+        setIsOpen(false)
+      }}
+      title="111">
+      {
+        layoutContent()
+      }
+    </AtFloatLayout>
 
-    <Buttons title="Start" onClick={() => start()}></Buttons>
   </View>;
 }

src/pages/clock.tsx

@@ -5,8 +5,7 @@ import './Clock.scss'
 import Taro, { useDidShow, useReady, useRouter } from '@tarojs/taro'
 // import ComponentA from './component'
 import Rings from '@components/Rings';
-import SingleSelect from '@components/SingleSelect';
-import LimitPickers from '@components/LimitPickers';
+
 import { useDispatch, useSelector } from 'react-redux';
 import { getInfoSuccess } from '@/store/user';
 import { wxPubFollow } from '@/services/permission';