|
@@ -114,7 +114,7 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
|
|
|
|
|
function target3BigRing() {
|
|
function target3BigRing() {
|
|
|
const { fast, sleep, status } = props.data
|
|
const { fast, sleep, status } = props.data
|
|
|
- if (status == 'OG2_NO1') {
|
|
|
|
|
|
|
+ if (status == 'OG2_NO1'||sleep.status == 'WFS') {
|
|
|
var time1 = fast.period.end_time
|
|
var time1 = fast.period.end_time
|
|
|
var time2 = sleep.period.end_time
|
|
var time2 = sleep.period.end_time
|
|
|
var duration = 0
|
|
var duration = 0
|
|
@@ -180,7 +180,18 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
|
|
|
|
|
function real1BigRing() {
|
|
function real1BigRing() {
|
|
|
const { fast, sleep, status } = props.data
|
|
const { fast, sleep, status } = props.data
|
|
|
|
|
+ if (status == 'WFS') {
|
|
|
|
|
+ if (fast.target.start_timestamp <= new Date().getTime() && new Date().getTime() < sleep.target.start_timestamp) {
|
|
|
|
|
+ return {
|
|
|
|
|
+ color: MainColorType.fast,
|
|
|
|
|
+ startArc: getStartArc(fast.target.start_timestamp),
|
|
|
|
|
+ durationArc: getDurationArc(fast.target.start_timestamp, new Date().getTime())
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ return null
|
|
|
|
|
+ }
|
|
|
if (fast.real) {
|
|
if (fast.real) {
|
|
|
|
|
+
|
|
|
if (status == 'OG1') {
|
|
if (status == 'OG1') {
|
|
|
return {
|
|
return {
|
|
|
color: MainColorType.fast,
|
|
color: MainColorType.fast,
|
|
@@ -199,6 +210,13 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
function real2BigRing() {
|
|
function real2BigRing() {
|
|
|
const { sleep } = props.data
|
|
const { sleep } = props.data
|
|
|
if (!sleep.real) {
|
|
if (!sleep.real) {
|
|
|
|
|
+ if (sleep.target.start_timestamp <= new Date().getTime() && new Date().getTime() < sleep.target.end_timestamp) {
|
|
|
|
|
+ return {
|
|
|
|
|
+ color: MainColorType.sleep,
|
|
|
|
|
+ startArc: getStartArc(sleep.target.start_timestamp),
|
|
|
|
|
+ durationArc: getDurationArc(sleep.target.start_timestamp, new Date().getTime())
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
return null;
|
|
return null;
|
|
|
}
|
|
}
|
|
|
return {
|
|
return {
|
|
@@ -208,7 +226,18 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
function real3BigRing() {
|
|
function real3BigRing() {
|
|
|
- const { fast, sleep } = props.data
|
|
|
|
|
|
|
+ const { fast, sleep,status } = props.data
|
|
|
|
|
+ if (status == 'WFS') {
|
|
|
|
|
+ if (sleep.target.end_timestamp <= new Date().getTime() && new Date().getTime() < fast.target.end_timestamp) {
|
|
|
|
|
+ return {
|
|
|
|
|
+ color: MainColorType.fast,
|
|
|
|
|
+ startArc: getStartArc(sleep.target.end_timestamp),
|
|
|
|
|
+ durationArc: getDurationArc(sleep.target.end_timestamp, new Date().getTime())
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ return null
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
if (!sleep.real || !sleep.real.end_timestamp) {
|
|
if (!sleep.real || !sleep.real.end_timestamp) {
|
|
|
return null;
|
|
return null;
|
|
|
}
|
|
}
|
|
@@ -222,6 +251,7 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
function currentDot(mode, outRange?: boolean) {
|
|
function currentDot(mode, outRange?: boolean) {
|
|
|
return {
|
|
return {
|
|
|
color: outRange ? '#B2B2B2' : getThemeColor(mode),
|
|
color: outRange ? '#B2B2B2' : getThemeColor(mode),
|
|
|
|
|
+ fillColor:outRange ?MainColorType.g03:'#ffffff00',
|
|
|
lineWidth: 4,
|
|
lineWidth: 4,
|
|
|
borderColor: '#ffffff',
|
|
borderColor: '#ffffff',
|
|
|
offset: 0
|
|
offset: 0
|
|
@@ -278,7 +308,7 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
targetRing={target0SmallRing()}
|
|
targetRing={target0SmallRing()}
|
|
|
realRing={real0SmallRing()}
|
|
realRing={real0SmallRing()}
|
|
|
canvasId={'circle0_small'}
|
|
canvasId={'circle0_small'}
|
|
|
- currentDot={sleep.status=='DONE'?null:currentDot('SLEEP', outRange2)}
|
|
|
|
|
|
|
+ currentDot={sleep.status == 'DONE' ? null : currentDot('SLEEP', outRange2)}
|
|
|
/>
|
|
/>
|
|
|
</View>
|
|
</View>
|
|
|
</View>
|
|
</View>
|
|
@@ -299,7 +329,7 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
targetRing={target1BigRing()}
|
|
targetRing={target1BigRing()}
|
|
|
realRing={real1BigRing()}
|
|
realRing={real1BigRing()}
|
|
|
canvasId={'circle1_big'}
|
|
canvasId={'circle1_big'}
|
|
|
- currentDot={status=='OG2'||status=='OG3'?null:currentDot('FAST', outRange)}
|
|
|
|
|
|
|
+ currentDot={status == 'OG2' || status == 'OG3' ? null : currentDot('FAST', outRange)}
|
|
|
/></View>
|
|
/></View>
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -317,7 +347,7 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
targetRing={target2BigRing()}
|
|
targetRing={target2BigRing()}
|
|
|
realRing={real2BigRing()}
|
|
realRing={real2BigRing()}
|
|
|
canvasId={'circle2_big'}
|
|
canvasId={'circle2_big'}
|
|
|
- currentDot={sleep.status=='DONE'?null:currentDot('SLEEP', outRange)}
|
|
|
|
|
|
|
+ currentDot={sleep.status == 'DONE' ? null : currentDot('SLEEP', outRange)}
|
|
|
|
|
|
|
|
/></View>
|
|
/></View>
|
|
|
}
|
|
}
|
|
@@ -337,7 +367,7 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
targetRing={target3BigRing()}
|
|
targetRing={target3BigRing()}
|
|
|
realRing={real3BigRing()}
|
|
realRing={real3BigRing()}
|
|
|
canvasId={'circle3_big'}
|
|
canvasId={'circle3_big'}
|
|
|
- currentDot={currentDot('FAST',outRange)}
|
|
|
|
|
|
|
+ currentDot={currentDot('FAST', outRange)}
|
|
|
|
|
|
|
|
/></View>
|
|
/></View>
|
|
|
}
|
|
}
|
|
@@ -356,18 +386,18 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
function statusBar() {
|
|
function statusBar() {
|
|
|
- var title = ''
|
|
|
|
|
|
|
+ var title = t('health.overview')
|
|
|
var hide = false;
|
|
var hide = false;
|
|
|
const { status } = props.data
|
|
const { status } = props.data
|
|
|
switch (props.step) {
|
|
switch (props.step) {
|
|
|
case 0:
|
|
case 0:
|
|
|
{
|
|
{
|
|
|
- if (status == 'WFS') {
|
|
|
|
|
- title = t('health.ready_for_logging')
|
|
|
|
|
- }
|
|
|
|
|
- else {
|
|
|
|
|
- title = t('health.logging_progress')
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ // if (status == 'WFS') {
|
|
|
|
|
+ // title = t('health.ready_for_logging')
|
|
|
|
|
+ // }
|
|
|
|
|
+ // else {
|
|
|
|
|
+ // title = t('health.logging_progress')
|
|
|
|
|
+ // }
|
|
|
|
|
|
|
|
return <View style={{
|
|
return <View style={{
|
|
|
position: 'absolute',
|
|
position: 'absolute',
|
|
@@ -378,7 +408,7 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
top: rpxToPx(20),
|
|
top: rpxToPx(20),
|
|
|
opacity: hide ? 0 : 1
|
|
opacity: hide ? 0 : 1
|
|
|
}}>
|
|
}}>
|
|
|
- <StatusIndicator type={status == 'WFS' ? StatusType.normal : StatusType.ing}
|
|
|
|
|
|
|
+ <StatusIndicator type={StatusType.normal}//type={status == 'WFS' ? StatusType.normal : StatusType.ing}
|
|
|
color={status == 'OG2_NO1' || status == 'OG2' ? MainColorType.sleep : MainColorType.fast}
|
|
color={status == 'OG2_NO1' || status == 'OG2' ? MainColorType.sleep : MainColorType.fast}
|
|
|
text={title}
|
|
text={title}
|
|
|
fontColor={MainColorType.g01}
|
|
fontColor={MainColorType.g01}
|
|
@@ -403,12 +433,12 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
var color: any = MainColorType.fast
|
|
var color: any = MainColorType.fast
|
|
|
var img: any = null
|
|
var img: any = null
|
|
|
if (status == 'WFS') {
|
|
if (status == 'WFS') {
|
|
|
- type = StatusType.img
|
|
|
|
|
|
|
+ type = StatusType.normal
|
|
|
color = 'transparent'
|
|
color = 'transparent'
|
|
|
img = <IconCircle width={rpxToPx(26)} color={MainColorType.fast} />
|
|
img = <IconCircle width={rpxToPx(26)} color={MainColorType.fast} />
|
|
|
}
|
|
}
|
|
|
else if (status == 'OG1') {
|
|
else if (status == 'OG1') {
|
|
|
- type = StatusType.ing
|
|
|
|
|
|
|
+ type = StatusType.normal
|
|
|
}
|
|
}
|
|
|
else if (status == 'OG2_NO1') {
|
|
else if (status == 'OG2_NO1') {
|
|
|
type = StatusType.img
|
|
type = StatusType.img
|
|
@@ -459,22 +489,24 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
var img: any = null
|
|
var img: any = null
|
|
|
var color: any = MainColorType.sleep
|
|
var color: any = MainColorType.sleep
|
|
|
if (status == 'WFS' || status == 'OG1') {
|
|
if (status == 'WFS' || status == 'OG1') {
|
|
|
- type = StatusType.img
|
|
|
|
|
- img = <IconCircle width={rpxToPx(26)} color={MainColorType.sleep} />
|
|
|
|
|
- color = 'transparent'
|
|
|
|
|
|
|
+ type = StatusType.normal
|
|
|
|
|
+ // img = <IconCircle width={rpxToPx(26)} color={MainColorType.sleep} />
|
|
|
|
|
+ // color = 'transparent'
|
|
|
}
|
|
}
|
|
|
else if (status == 'OG2') {
|
|
else if (status == 'OG2') {
|
|
|
- type = StatusType.ing
|
|
|
|
|
|
|
+ type = StatusType.normal
|
|
|
}
|
|
}
|
|
|
else if (status == 'OG2_NO1') {
|
|
else if (status == 'OG2_NO1') {
|
|
|
- type = StatusType.ing
|
|
|
|
|
- img = <IconMiss width={rpxToPx(26)} color='#fff' />
|
|
|
|
|
|
|
+ type = StatusType.normal
|
|
|
|
|
+ // img = <IconMiss width={rpxToPx(26)} color='#fff' />
|
|
|
}
|
|
}
|
|
|
else {
|
|
else {
|
|
|
type = StatusType.img
|
|
type = StatusType.img
|
|
|
img = <IconCheck width={rpxToPx(26)} height={rpxToPx(26)} color='#fff' />
|
|
img = <IconCheck width={rpxToPx(26)} height={rpxToPx(26)} color='#fff' />
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+ // debugger
|
|
|
|
|
+
|
|
|
return <View style={{
|
|
return <View style={{
|
|
|
position: 'absolute',
|
|
position: 'absolute',
|
|
|
display: 'flex',
|
|
display: 'flex',
|
|
@@ -502,15 +534,15 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
var type = StatusType.normal
|
|
var type = StatusType.normal
|
|
|
var img: any = null
|
|
var img: any = null
|
|
|
if (status == 'OG3') {
|
|
if (status == 'OG3') {
|
|
|
- type = StatusType.ing
|
|
|
|
|
|
|
+ type = StatusType.normal
|
|
|
}
|
|
}
|
|
|
else if (status == 'OG2_NO1') {
|
|
else if (status == 'OG2_NO1') {
|
|
|
- type = StatusType.img
|
|
|
|
|
- img = <IconCircle width={rpxToPx(26)} color={MainColorType.fast} />
|
|
|
|
|
|
|
+ type = StatusType.normal
|
|
|
|
|
+ // img = <IconCircle width={rpxToPx(26)} color={MainColorType.fast} />
|
|
|
}
|
|
}
|
|
|
else {
|
|
else {
|
|
|
- type = StatusType.img
|
|
|
|
|
- img = <IconCircle width={rpxToPx(26)} color={MainColorType.fast} />
|
|
|
|
|
|
|
+ type = StatusType.normal
|
|
|
|
|
+ // img = <IconCircle width={rpxToPx(26)} color={MainColorType.fast} />
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
return <View style={{
|
|
return <View style={{
|
|
@@ -523,7 +555,8 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
opacity: hide ? 0 : 1
|
|
opacity: hide ? 0 : 1
|
|
|
}}>
|
|
}}>
|
|
|
<StatusIndicator type={type}
|
|
<StatusIndicator type={type}
|
|
|
- color={status == 'OG3' ? MainColorType.fast : 'transparent'}
|
|
|
|
|
|
|
+ // color={status == 'OG3' ? MainColorType.fast : 'transparent'}
|
|
|
|
|
+ color={MainColorType.fast}
|
|
|
text={title}
|
|
text={title}
|
|
|
fontColor={MainColorType.g01}
|
|
fontColor={MainColorType.g01}
|
|
|
fontSize={rpxToPx(20)}
|
|
fontSize={rpxToPx(20)}
|
|
@@ -651,32 +684,68 @@ export default function FastSleepCard(props: { step: number, data: any }) {
|
|
|
|
|
|
|
|
|
|
|
|
|
function statusDetail() {
|
|
function statusDetail() {
|
|
|
|
|
+ const { fast, sleep, status } = props.data
|
|
|
switch (props.step) {
|
|
switch (props.step) {
|
|
|
case 0:
|
|
case 0:
|
|
|
return <View className='right_content'>
|
|
return <View className='right_content'>
|
|
|
<View className='h34 ' style={{ lineHeight: rpxToPx(42) + 'px' }}>{t('health.fasting')}</View>
|
|
<View className='h34 ' style={{ lineHeight: rpxToPx(42) + 'px' }}>{t('health.fasting')}</View>
|
|
|
- <View className='h36 bold' style={{ color: MainColorType.fast, lineHeight: rpxToPx(52) + 'px' }}>{fastTime()}</View>
|
|
|
|
|
|
|
+ <View style={{ display: 'flex', flexDirection: 'row' }}>
|
|
|
|
|
+ {
|
|
|
|
|
+ status == 'WFS' ? <View className='h36 bold' style={{ color: MainColorType.fast, lineHeight: rpxToPx(52) + 'px' }}>{fastTime()}</View> :
|
|
|
|
|
+ status == 'OG2_NO1' ? <View className='time_count h30 bold' style={{ backgroundColor: MainColorType.error }}>00:00:00</View> :
|
|
|
|
|
+ <View className='time_count h30 bold' style={{ backgroundColor: MainColorType.fast }}>{fastTime()}</View>
|
|
|
|
|
+ }
|
|
|
|
|
+ </View>
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
<View style={{ height: rpxToPx(24) }} />
|
|
<View style={{ height: rpxToPx(24) }} />
|
|
|
<View className='h34 ' style={{ lineHeight: rpxToPx(42) + 'px' }}>{t('health.sleep')}</View>
|
|
<View className='h34 ' style={{ lineHeight: rpxToPx(42) + 'px' }}>{t('health.sleep')}</View>
|
|
|
- <View className='h36 bold' style={{ color: MainColorType.sleep, lineHeight: rpxToPx(52) + 'px' }}>{sleepTime()}</View>
|
|
|
|
|
|
|
+ <View style={{ display: 'flex', flexDirection: 'row' }}>
|
|
|
|
|
+ {
|
|
|
|
|
+ status == 'WFS' || sleep.status == 'DONE' ? <View className='h36 bold' style={{ color: MainColorType.sleep, lineHeight: rpxToPx(52) + 'px' }}>{sleepTime()}</View> :
|
|
|
|
|
+ sleep.status == 'OG' ? <View className='time_count h30 bold' style={{ backgroundColor: MainColorType.sleep }}>{sleepTime()}</View> :
|
|
|
|
|
+ <View className='time_count h30 bold' style={{ backgroundColor: MainColorType.g03 }}>00:00:00</View>
|
|
|
|
|
+ }
|
|
|
|
|
+ </View>
|
|
|
|
|
+
|
|
|
</View>
|
|
</View>
|
|
|
case 1:
|
|
case 1:
|
|
|
return <View className='right_content'>
|
|
return <View className='right_content'>
|
|
|
<View className='h34 ' style={{ lineHeight: rpxToPx(42) + 'px' }}>{t('health.fast_before_bed')}</View>
|
|
<View className='h34 ' style={{ lineHeight: rpxToPx(42) + 'px' }}>{t('health.fast_before_bed')}</View>
|
|
|
<View style={{ height: rpxToPx(12) }} />
|
|
<View style={{ height: rpxToPx(12) }} />
|
|
|
- <View className='h36 bold' style={{ color: MainColorType.fast, lineHeight: rpxToPx(52) + 'px' }}>{step1()}</View>
|
|
|
|
|
|
|
+ <View style={{ display: 'flex', flexDirection: 'row' }}>
|
|
|
|
|
+ {
|
|
|
|
|
+ status == 'OG1' ? <View className='time_count h30 bold' style={{ backgroundColor: MainColorType.fast }}>{step1()}</View> :
|
|
|
|
|
+ status == 'OG2_NO1' ? <View className='time_count h30 bold' style={{ backgroundColor: MainColorType.error }}>00:00:00</View> :
|
|
|
|
|
+ <View className='h36 bold' style={{ color: MainColorType.fast, lineHeight: rpxToPx(52) + 'px' }}>{step1()}</View>
|
|
|
|
|
+ }
|
|
|
|
|
+ </View>
|
|
|
|
|
+
|
|
|
</View>
|
|
</View>
|
|
|
case 2:
|
|
case 2:
|
|
|
return <View className='right_content'>
|
|
return <View className='right_content'>
|
|
|
<View className='h34 ' style={{ lineHeight: rpxToPx(42) + 'px' }}>{t('health.fast_while_sleep')}</View>
|
|
<View className='h34 ' style={{ lineHeight: rpxToPx(42) + 'px' }}>{t('health.fast_while_sleep')}</View>
|
|
|
<View style={{ height: rpxToPx(12) }} />
|
|
<View style={{ height: rpxToPx(12) }} />
|
|
|
- <View className='h36 bold' style={{ color: MainColorType.sleep, lineHeight: rpxToPx(52) + 'px' }}>{step2()}</View>
|
|
|
|
|
|
|
+ <View style={{ display: 'flex', flexDirection: 'row' }}>
|
|
|
|
|
+ {
|
|
|
|
|
+ status == 'OG2' || status == 'OG2_NO1' ? <View className='time_count h30 bold' style={{ backgroundColor: MainColorType.sleep }}>{step2()}</View> :
|
|
|
|
|
+ status == 'OG3' || status == 'WFS' ? <View className='h36 bold' style={{ color: MainColorType.sleep, lineHeight: rpxToPx(52) + 'px' }}>{step2()}</View> :
|
|
|
|
|
+ <View className='time_count h30 bold' style={{ backgroundColor: MainColorType.g03 }}>00:00:00</View>
|
|
|
|
|
+ }
|
|
|
|
|
+ </View>
|
|
|
</View>
|
|
</View>
|
|
|
case 3:
|
|
case 3:
|
|
|
return <View className='right_content'>
|
|
return <View className='right_content'>
|
|
|
<View className='h34 ' style={{ lineHeight: rpxToPx(42) + 'px' }}>{t('health.fast_after_sleep')}</View>
|
|
<View className='h34 ' style={{ lineHeight: rpxToPx(42) + 'px' }}>{t('health.fast_after_sleep')}</View>
|
|
|
<View style={{ height: rpxToPx(12) }} />
|
|
<View style={{ height: rpxToPx(12) }} />
|
|
|
- <View className='h36 bold' style={{ color: MainColorType.fast, lineHeight: rpxToPx(52) + 'px' }}>{step3()}</View>
|
|
|
|
|
|
|
+ <View style={{ display: 'flex', flexDirection: 'row' }}>
|
|
|
|
|
+ {
|
|
|
|
|
+ status == 'WFS' ? <View className='h36 bold' style={{ color: MainColorType.fast, lineHeight: rpxToPx(52) + 'px' }}>{step3()}</View> :
|
|
|
|
|
+ status == 'OG3' ? <View className='time_count h30 bold' style={{ backgroundColor: MainColorType.fast }}>{step3()}</View> :
|
|
|
|
|
+ <View className='time_count h30 bold' style={{ backgroundColor: MainColorType.g03 }}>00:00:00</View>
|
|
|
|
|
+ }
|
|
|
|
|
+ </View>
|
|
|
|
|
+
|
|
|
</View>
|
|
</View>
|
|
|
}
|
|
}
|
|
|
return <View className='right_content'></View>
|
|
return <View className='right_content'></View>
|