update

src/context/locales/en.js

@@ -697,6 +697,8 @@ export default {
                 title: 'Weekly',
                 fast_average: 'Average fast',
                 sleep_average: 'Average sleep',
+                eat_average:'Eating window',
+                wake_average:'Wake window'
             }
         },
         food: {

src/context/locales/zh.js

@@ -694,7 +694,8 @@ export default {
                 title: '每周趋势',
                 fast_average: '平均断食',
                 sleep_average: '平均睡眠',
-
+                eat_average:'平均进食',
+                wake_average:'平均活动'
             }
         },
         food: {

src/features/trackTimeDuration/components/WeekCalendar.tsx

@@ -24,7 +24,7 @@ if (process.env.TARO_ENV == 'rn') {
 }
 
 
-const WeekCalendar = memo(() => {
+const WeekCalendar = memo((props:{isFastSleep:boolean}) => {
     const [calendars, setCalendars] = useState<any>([])
     const [current, setCurrent] = useState(0)
     const [summary, setSummary] = useState<any>(null)
@@ -36,6 +36,8 @@ const WeekCalendar = memo(() => {
     const ref = useRef(null)
     const pageSize = 40
 
+    console.log('aaaaa')
+
     useEffect(() => {
         // pageIndex = -1
         getRecords()
@@ -212,30 +214,30 @@ const WeekCalendar = memo(() => {
         <View className="calendar_summary_top">
             <View style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', flex: 1 }}>
                 {
-                    !summary || summary.fast.avg == 0 ? <View className="calendar-empty-bg" style={{ borderColor: ColorType.fast }}>
-                        <View className="calendar-empty-line" style={{ backgroundColor: ColorType.fast }} />
+                    !summary || summary.fast.avg == 0 ? <View className="calendar-empty-bg" style={{ borderColor: props.isFastSleep?ColorType.fast:ColorType.food }}>
+                        <View className="calendar-empty-line" style={{ backgroundColor: props.isFastSleep?ColorType.fast:ColorType.food }} />
                     </View> :
-                        <View className={lastFastValue > summary.fast.avg ? 'calendar-arrow-bg-down' : 'calendar-arrow-bg'} style={{ backgroundColor: ColorType.fast }}>
+                        <View className={lastFastValue > summary.fast.avg ? 'calendar-arrow-bg-down' : 'calendar-arrow-bg'} style={{ backgroundColor: props.isFastSleep?ColorType.fast:ColorType.food }}>
                             <IconBigArrow color="#fff" width={rpxToPx(32)} />
                         </View>
                 }
                 <View className="calendar_summary_item">
-                    <Text className="calendar_summary_title">{t('feature.track_time_duration.weekly.fast_average')}</Text>
-                    <Text className="calendar_summary_value" style={{ color: ColorType.fast }}>{!summary || summary.fast.avg == 0 ? t('feature.track_time_duration.record_fast_sleep.none') : TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + summary.fast.avg)}</Text>
+                    <Text className="calendar_summary_title">{props.isFastSleep?t('feature.track_time_duration.weekly.fast_average'):t('feature.track_time_duration.weekly.eat_average')}</Text>
+                    <Text className="calendar_summary_value" style={{ color: props.isFastSleep?ColorType.fast:ColorType.food }}>{!summary || summary.fast.avg == 0 ? t('feature.track_time_duration.record_fast_sleep.none') : TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + summary.fast.avg)}</Text>
                 </View>
             </View>
             <View style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', flex: 1 }}>
                 {
-                    !summary || summary.sleep.avg == 0 ? <View className="calendar-empty-bg" style={{ borderColor: ColorType.sleep }}>
-                        <View className="calendar-empty-line" style={{ backgroundColor: ColorType.sleep }} />
+                    !summary || summary.sleep.avg == 0 ? <View className="calendar-empty-bg" style={{ borderColor: props.isFastSleep?ColorType.sleep:ColorType.activity }}>
+                        <View className="calendar-empty-line" style={{ backgroundColor: props.isFastSleep?ColorType.sleep:ColorType.activity }} />
                     </View> :
-                        <View className={lastSleepValue > summary.sleep.avg ? 'calendar-arrow-bg-down' : 'calendar-arrow-bg'} style={{ backgroundColor: ColorType.sleep }}>
+                        <View className={lastSleepValue > summary.sleep.avg ? 'calendar-arrow-bg-down' : 'calendar-arrow-bg'} style={{ backgroundColor: props.isFastSleep?ColorType.sleep:ColorType.activity }}>
                             <IconBigArrow color="#fff" width={rpxToPx(32)} />
                         </View>
                 }
                 <View className="calendar_summary_item">
-                    <Text className="calendar_summary_title">{t('feature.track_time_duration.weekly.sleep_average')}</Text>
-                    <Text className="calendar_summary_value" style={{ color: ColorType.sleep }}>{!summary || summary.sleep.avg == 0 ? t('feature.track_time_duration.record_fast_sleep.none') : TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + summary.sleep.avg)}</Text>
+                    <Text className="calendar_summary_title">{props.isFastSleep?t('feature.track_time_duration.weekly.sleep_average'):t('feature.track_time_duration.weekly.wake_average')}</Text>
+                    <Text className="calendar_summary_value" style={{ color: props.isFastSleep?ColorType.sleep:ColorType.activity }}>{!summary || summary.sleep.avg == 0 ? t('feature.track_time_duration.record_fast_sleep.none') : TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + summary.sleep.avg)}</Text>
                 </View>
             </View>
 
@@ -287,7 +289,7 @@ const WeekCalendar = memo(() => {
                                 return <SwiperItem key={index}>
                                     {
                                         showWeeklyItem(index) ?
-                                            <WeekCalendarItem data={item} isCurrentWeek={index == calendars.length - 1} /> :
+                                            <WeekCalendarItem data={item} isCurrentWeek={index == calendars.length - 1} isFastSleep={props.isFastSleep}/> :
                                             <View style={{ width: parseInt(rpxToPx(658) + ''), flexShrink: 0 }} />
                                     }
                                 </SwiperItem>
@@ -332,6 +334,7 @@ const WeekCalendar = memo(() => {
             </View>
 
         </View>
+        
     </View>
 })
 

src/features/trackTimeDuration/components/WeekCalendarItem.tsx

@@ -15,7 +15,7 @@ dayjs.extend(utc)
 dayjs.extend(timezone)
 
 let timer
-export default function WeekCalendarItem(props: { data: any, isCurrentWeek: boolean }) {
+export default function WeekCalendarItem(props: { data: any, isCurrentWeek: boolean,isFastSleep:boolean }) {
     const [charts, setCharts] = useState([])
     const [showCurrentTime, setShowCurrentTime] = useState(false)
     const [position, setPosition] = useState({ left: 0, top: 0 })
@@ -209,7 +209,7 @@ export default function WeekCalendarItem(props: { data: any, isCurrentWeek: bool
                                 {
                                     (item as any).fasts.map((obj, k) => {
                                         return <View key={k} className="detailLine" style={{
-                                            backgroundColor: ColorType.fast,
+                                            backgroundColor: props.isFastSleep?ColorType.fast:ColorType.food,
                                             top: rpxToPx(obj.begin * 400),
                                             height: rpxToPx(obj.height * 400)
                                         }} />
@@ -224,7 +224,7 @@ export default function WeekCalendarItem(props: { data: any, isCurrentWeek: bool
                                 {
                                     (item as any).sleeps.map((obj, j) => {
                                         return <View key={j} className="detailLine" style={{
-                                            backgroundColor: ColorType.sleep,
+                                            backgroundColor: props.isFastSleep?ColorType.sleep:ColorType.activity,
                                             top: rpxToPx(obj.begin * 400),
                                             height: rpxToPx(obj.height * 400)
                                         }} />

src/pages/clock/Clock.scss

@@ -77,4 +77,16 @@
     opacity: 0.6;
     font-size: 48px;
     font-weight: bold;
+}
+
+.vip_calendar{
+    margin-top: 40px;
+    margin-left: 46px;
+    width: 658px;
+    height: 104px;
+    background-color: #212121;
+    border-radius: 24px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
 }

src/pages/clock/ClockMain.tsx

@@ -17,7 +17,7 @@ import { ColorType } from "@/context/themes/color";
 import { bigRingRadius, getBgRing, getCommon, getDot, getSchedule, ringWidth, smallRingRadius } from "@/features/trackTimeDuration/hooks/RingData";
 import { RealRing, CurrentDot } from "@/features/trackTimeDuration/components/Rings";
 import IndexConsole from "@/features/trackTimeDuration/components/IndexConsole";
-import Modal from '@/components/layout/Modal'
+import Modal from '@/components/layout/Modal.weapp'
 import { compareVersion, getTimezone, getTimezoneId, getTimezoneName, kIsIOS, rpxToPx } from "@/utils/tools";
 import RecordFastSleep from "@/features/trackTimeDuration/components/RecordFastSleep";
 import WeekCalendar from "@/features/trackTimeDuration/components/WeekCalendar";
@@ -112,7 +112,7 @@ export default function Page() {
     const [needShowAddTip, setNeedShowAddTip] = useState(false)
     const [showTip, setShowTip] = useState(false)
     const [records, setRecords] = useState([])
-
+    const [showEatCalendar, setShowEatCalendar] = useState(false)
     const [schedules, setSchedules] = useState<any>(null)
 
     const permission = useSelector((state: any) => state.permission);
@@ -137,14 +137,14 @@ export default function Page() {
         pauseTimer = false;
         mainTimer()
 
-        if (process.env.TARO_ENV=='rn'){
+        if (process.env.TARO_ENV == 'rn') {
             NativeAppEventEmitter.addListener('openNotificationSetting', (data) => {
                 console.log('aaaa')
                 debugger
                 jumpPage('/pages/account/ChooseAuth', 'NotificationSetting', navigation)
             })
         }
-        
+
     }, [])
 
     function mainTimer() {
@@ -316,7 +316,7 @@ export default function Page() {
             checkTimeZone()
         }
         else {
-            if (!kIsIOS){
+            if (!kIsIOS) {
                 updateNotificationStatus()
             }
         }
@@ -810,19 +810,31 @@ export default function Page() {
 
     var timestamp = new Date().getTime()
 
-    function goSetting(){
-        if (process.env.TARO_ENV=='weapp'){
+    function goSetting() {
+        if (process.env.TARO_ENV == 'weapp') {
             Taro.navigateTo({
-                url:'/pages/notification/setting'
+                url: '/pages/notification/setting'
             })
         }
         else {
             jumpPage('/pages/account/ChooseAuth', 'NotificationSetting', navigation)
         }
-        
+
+    }
+
+    function eatCalendarContent() {
+        return <View style={{ display: 'flex', flexDirection: 'column' }}>
+            <View className="index_section">
+                <Text className="index_section_title">{t('feature.track_time_duration.weekly.title')}</Text>
+            </View>
+            <WeekCalendar isFastSleep={false}/>
+            <View className="vip_calendar" style={{marginBottom:40}} onClick={() => setShowEatCalendar(false)}>
+                <Text style={{ color: '#fff' }}>关闭</Text>
+            </View>
+        </View>
     }
 
-    
+
 
     function render() {
         var smallTitle = ''
@@ -859,7 +871,7 @@ export default function Page() {
 
                     </View>
                 </Box>
-{/* 
+                {/* 
                 <Text style={{color:'#fff',fontSize:30}} onClick={goSetting}>notification setting</Text> */}
                 {
                     user.isLogin && records && records.length > 0 && <View className="index_section" style={{ marginTop: -rpxToPx(25 - 12), marginBottom: -rpxToPx(20) }}>
@@ -869,7 +881,7 @@ export default function Page() {
                         }
                         {
                             process.env.TARO_ENV == 'rn' && <View onClick={more}>
-                                <GradientText style={{ fontSize: rpxToPx(32), fontWeight: 'bold',color:'black' }}>{t('feature.track_time_duration.record_fast_sleep.header.btn_show_all')}</GradientText>
+                                <GradientText style={{ fontSize: rpxToPx(32), fontWeight: 'bold', color: 'black' }}>{t('feature.track_time_duration.record_fast_sleep.header.btn_show_all')}</GradientText>
                             </View>
                         }
                     </View>
@@ -901,9 +913,24 @@ export default function Page() {
                         <View className="index_section">
                             <Text className="index_section_title">{t('feature.track_time_duration.weekly.title')}</Text>
                         </View>
-                        <WeekCalendar />
+                        <WeekCalendar isFastSleep={true}/>
+                        <View className="vip_calendar" onClick={() => setShowEatCalendar(true)}>
+                            <Text style={{ color: '#fff' }}>Show eating and wake windows</Text>
+                        </View>
                     </View>
                 }
+                {
+                    showEatCalendar && <Modal
+                        testInfo={null}
+                        dismiss={() => {
+                            setShowEatCalendar(false)
+                        }}
+                        confirm={() => { }}>
+                        {
+                            eatCalendarContent()
+                        }
+                    </Modal>
+                }
 
 
 
@@ -919,7 +946,7 @@ export default function Page() {
                         <Text className="index_section_title">{t('feature.day_night.group_title')}</Text>
                     </View>
                 }
-                
+
                 {
                     user.isLogin && !showErrorPage && <DayNightSwiper count={count} schedule={schedules} homeData={homeData} />
                 }