|
|
@@ -1,7 +1,7 @@
|
|
|
import { ColorType } from "@/context/themes/color";
|
|
|
import { ChooseScenarioBtn } from "@/features/common/SpecBtns";
|
|
|
import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
|
|
|
-import { View, Text, Picker } from "@tarojs/components";
|
|
|
+import { View, Text, Picker, ScrollView } from "@tarojs/components";
|
|
|
import { useDidShow, useRouter } from "@tarojs/taro";
|
|
|
import { useEffect, useState } from "react";
|
|
|
import './ChooseScenario.scss';
|
|
|
@@ -10,7 +10,7 @@ import { useDispatch, useSelector } from "react-redux";
|
|
|
import { rpxToPx } from "@/utils/tools";
|
|
|
import { updateFast, updateSleep, updateStep } from "@/store/set_target";
|
|
|
import { TimeFormatter } from "@/utils/time_format";
|
|
|
-import { set } from "lodash";
|
|
|
+import Footer from "@/components/layout/Footer";
|
|
|
|
|
|
export default function Suggest() {
|
|
|
let router: any = null
|
|
|
@@ -73,9 +73,20 @@ export default function Suggest() {
|
|
|
var array: any = []
|
|
|
for (var i = 0; i < sleep_cycle.numbers.length; i++) {
|
|
|
var count = sleep_cycle.numbers[i] * sleep_cycle.length + sleep_latency
|
|
|
+
|
|
|
+ var sleep = JSON.parse(JSON.stringify(target.sleep))
|
|
|
+ var startCount = sleep.schedule.sleep.end_time.split(':')[0] * 60 + sleep.schedule.sleep.end_time.split(':')[1] * 1 - count
|
|
|
+ if (startCount < 0) {
|
|
|
+ startCount += 24 * 60
|
|
|
+ }
|
|
|
+ var start = TimeFormatter.padZero(Math.floor(startCount / 60)) + ':' + TimeFormatter.padZero(startCount % 60)
|
|
|
+
|
|
|
+
|
|
|
array.push({
|
|
|
hours: Math.floor(count / 60),
|
|
|
- minutes: count % 60
|
|
|
+ minutes: count % 60,
|
|
|
+ number: sleep_cycle.numbers[i],
|
|
|
+ time: start
|
|
|
})
|
|
|
}
|
|
|
setSuggestItem(array)
|
|
|
@@ -100,7 +111,7 @@ export default function Suggest() {
|
|
|
fast.schedule.fast.start_time = start
|
|
|
dispatch(updateFast({ fast: fast }))
|
|
|
}
|
|
|
- else if (pageStep == 3){
|
|
|
+ else if (pageStep == 3) {
|
|
|
var item = suggestItems[suggestIndex]
|
|
|
var sleep = JSON.parse(JSON.stringify(target.sleep))
|
|
|
var startCount = sleep.schedule.sleep.end_time.split(':')[0] * 60 + sleep.schedule.sleep.end_time.split(':')[1] * 1 - (item.hours * 60 + item.minutes)
|
|
|
@@ -172,12 +183,6 @@ export default function Suggest() {
|
|
|
var min: number = 0
|
|
|
var max: number = 23
|
|
|
var step: number = 5
|
|
|
-
|
|
|
- // if (common.duration) {
|
|
|
- // min = common.duration.min
|
|
|
- // max = common.duration.max
|
|
|
- // step = common.duration.step
|
|
|
- // }
|
|
|
var minutes: string[] = []
|
|
|
for (let i = 0; i < 60; i += step) {
|
|
|
minutes.push(TimeFormatter.padZero(i))
|
|
|
@@ -275,16 +280,19 @@ export default function Suggest() {
|
|
|
}
|
|
|
|
|
|
function timePicker() {
|
|
|
- return <View style={{ marginTop: rpxToPx(56) }}>
|
|
|
- <PickerViews ref={null}
|
|
|
- onChange={timePickerChanged}
|
|
|
- items={durationDatas()}
|
|
|
- value={durationValues()} height={200}
|
|
|
- title=''
|
|
|
- themeColor={target.isMixed ? global.fastColor ? global.fastColor : ColorType.fast : global.sleepColor ? global.sleepColor : ColorType.sleep}
|
|
|
- showBtns={false}
|
|
|
- hideTitle={true}
|
|
|
- onCancel={() => { }} />
|
|
|
+ return <View>
|
|
|
+ <View style={{ marginTop: rpxToPx(56), marginLeft: rpxToPx(46), marginRight: rpxToPx(46), borderRadius: rpxToPx(20), overflow: 'hidden' }}>
|
|
|
+ <PickerViews ref={null}
|
|
|
+ onChange={timePickerChanged}
|
|
|
+ items={durationDatas()}
|
|
|
+ value={durationValues()} height={200}
|
|
|
+ title=''
|
|
|
+ themeColor={target.isMixed ? global.fastColor ? global.fastColor : ColorType.fast : global.sleepColor ? global.sleepColor : ColorType.sleep}
|
|
|
+ showBtns={false}
|
|
|
+ hideTitle={true}
|
|
|
+ onCancel={() => { }} />
|
|
|
+
|
|
|
+ </View>
|
|
|
<Text className="suggest_footer">If you plan to skip breakfast, pick a time for your first meal of the day.</Text>
|
|
|
</View>
|
|
|
}
|
|
|
@@ -298,47 +306,55 @@ export default function Suggest() {
|
|
|
}
|
|
|
|
|
|
function fallSleepPicker() {
|
|
|
- return <View style={{ marginTop: rpxToPx(56) }}>
|
|
|
- <PickerViews ref={null}
|
|
|
- onChange={fallSleepChanged}
|
|
|
- items={sleepLatency()}
|
|
|
- value={sleepLatencyValue()} height={200}
|
|
|
- title=''
|
|
|
- themeColor={target.isMixed ? global.fastColor ? global.fastColor : ColorType.fast : global.sleepColor ? global.sleepColor : ColorType.sleep}
|
|
|
- showBtns={false}
|
|
|
- hideTitle={true}
|
|
|
- onCancel={() => { }} />
|
|
|
+ return <View>
|
|
|
+ <View style={{ marginTop: rpxToPx(56), marginLeft: rpxToPx(46), marginRight: rpxToPx(46), borderRadius: rpxToPx(20), overflow: 'hidden' }}>
|
|
|
+ <PickerViews ref={null}
|
|
|
+ onChange={fallSleepChanged}
|
|
|
+ items={sleepLatency()}
|
|
|
+ value={sleepLatencyValue()} height={200}
|
|
|
+ title=''
|
|
|
+ themeColor={target.isMixed ? global.fastColor ? global.fastColor : ColorType.fast : global.sleepColor ? global.sleepColor : ColorType.sleep}
|
|
|
+ showBtns={false}
|
|
|
+ hideTitle={true}
|
|
|
+ onCancel={() => { }} />
|
|
|
+
|
|
|
+ </View>
|
|
|
<Text className="suggest_footer">It takes 10 to 30 minutes for most people to fall asleep once they're in bed.</Text>
|
|
|
</View>
|
|
|
}
|
|
|
|
|
|
-
|
|
|
-
|
|
|
function suggestList() {
|
|
|
if (pageStep == 1) {
|
|
|
- return <View>
|
|
|
- {
|
|
|
- suggestItems.map((item: any, index: number) => {
|
|
|
- return <View onClick={() => {
|
|
|
- setSuggestIndex(index)
|
|
|
- }} key={index} className={index == suggestIndex ? 'item_sel1' : 'item1'}>{item.hours} hours {item.minutes} minutes</View>
|
|
|
- })
|
|
|
- }
|
|
|
- </View>
|
|
|
+ return <ScrollView scrollY style={{ height: 400 }}>
|
|
|
+ <View style={{ flexDirection: 'column', display: 'flex' }}>
|
|
|
+ {
|
|
|
+ suggestItems.map((item: any, index: number) => {
|
|
|
+ return <View onClick={() => {
|
|
|
+ setSuggestIndex(index)
|
|
|
+ }} key={index} className={index == suggestIndex ? 'item_sel1' : 'item1'}>{item.hours} hours {item.minutes} minutes</View>
|
|
|
+ })
|
|
|
+ }
|
|
|
+ </View>
|
|
|
+ </ScrollView>
|
|
|
}
|
|
|
- return <View>
|
|
|
+ return <View style={{ flex: 1, overflow: 'scroll' }}>
|
|
|
{
|
|
|
suggestItems.map((item: any, index: number) => {
|
|
|
return <View onClick={() => {
|
|
|
setSuggestIndex(index)
|
|
|
- }} key={index} className={index == suggestIndex ? 'item_sel1' : 'item1'}>{item.hours} hours {item.minutes} minutes</View>
|
|
|
+ }} key={index} className={index == suggestIndex ? 'item_sel1' : 'item1'}>
|
|
|
+
|
|
|
+ <View>{item.hours} hours {item.minutes} minutes</View>
|
|
|
+ <View>{item.number} sleep cycles</View>
|
|
|
+ <View style={{ color: ColorType.sleep }}>Go to bed at {item.time}</View>
|
|
|
+ </View>
|
|
|
})
|
|
|
}
|
|
|
</View>
|
|
|
}
|
|
|
|
|
|
function content() {
|
|
|
- return <View >
|
|
|
+ return <View style={{ flex: 1, display: 'flex', flexDirection: 'column' }}>
|
|
|
{
|
|
|
(pageStep == 0 || pageStep == 2) && timePicker()
|
|
|
}
|
|
|
@@ -359,13 +375,17 @@ export default function Suggest() {
|
|
|
content()
|
|
|
}
|
|
|
|
|
|
- <View style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center' }}>
|
|
|
- <ChooseScenarioBtn
|
|
|
- onClick={next}
|
|
|
- title={pageStep == 0 || pageStep == 2 ? 'Suggest Plan' : 'Next'}
|
|
|
- background={ColorType.fast}
|
|
|
- />
|
|
|
- <Text style={{ color: '#fff', opacity: 0.4 }} onClick={myself}>Set It Myself</Text>
|
|
|
- </View>
|
|
|
+ <Footer>
|
|
|
+ <View style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center' }}>
|
|
|
+ <ChooseScenarioBtn
|
|
|
+ onClick={next}
|
|
|
+ title={pageStep == 0 || pageStep == 2 ? 'Suggest Plan' : 'Next'}
|
|
|
+ background={ColorType.fast}
|
|
|
+ />
|
|
|
+ <Text style={{ color: '#fff', opacity: 0.4 }} onClick={myself}>Set It Myself</Text>
|
|
|
+ </View>
|
|
|
+ </Footer>
|
|
|
+
|
|
|
+
|
|
|
</View>
|
|
|
}
|