update

src/_health/components/duration_picker.tsx

@@ -11,7 +11,7 @@ import { getThemeColor } from "@/features/health/hooks/health_hooks"
 import { durationDatas } from "@/features/trackTimeDuration/hooks/Console"
 import { TimeFormatter } from "@/utils/time_format"
 
-export default function DurationPicker(props: { time: any,dismiss:any,done:any }) {
+export default function DurationPicker(props: { time: any,dismiss:any,done:any,title?:string }) {
     const common = useSelector((state: any) => state.common);
     const health = useSelector((state: any) => state.health);
     const [values,setValues] = useState(itemValues())
@@ -23,7 +23,7 @@ export default function DurationPicker(props: { time: any,dismiss:any,done:any }
         var step: number = 5
     
         // if (common.duration) {
-            min = 1//common.duration.min
+            min = 0//common.duration.min
             max = 23//common.duration.max
             step = 5//common.duration.step
         // }
@@ -43,12 +43,15 @@ export default function DurationPicker(props: { time: any,dismiss:any,done:any }
         const hours = Math.floor(seconds/3600)
         const minutes = Math.floor((seconds%3600)/60)
 
-        return [hours-1,Math.floor(minutes/5)]
+        return [hours,Math.floor(minutes/5)]
     }
 
     function durationPickerContent() {
         var color = getThemeColor(health.mode)
         var title = health.mode == 'FAST'?'断食时长':'睡眠时长'
+        if (props.title){
+            title = props.title
+        }
         return <View style={{ color: '#fff', backgroundColor: 'transparent' }}>
 
 
@@ -70,7 +73,8 @@ export default function DurationPicker(props: { time: any,dismiss:any,done:any }
     }
 
     function done(e){
-        var time = e[0]*3600*1000+e[1]*60*1000
+        console.log(e)
+        var time = e[0]*3600*1000+e[1]*5*60*1000
         props.done(time)
     }
 

src/_health/pages/add_moment.tsx

@@ -15,6 +15,7 @@ import { createMoment } from "@/services/health";
 import { useDispatch, useSelector } from "react-redux";
 import { getThemeColor } from "@/features/health/hooks/health_hooks";
 import { setShowActionTip } from "@/store/health";
+import DurationPicker from "../components/duration_picker";
 
 
 let useRoute;
@@ -34,6 +35,7 @@ export default function AddMoment() {
     const [endTime, setEndTime] = useState(0)
     const [showPicker, setShowPicker] = useState(false)
     const [durationPicker, setDurationPicker] = useState(false)
+    const [durationT, setDurationT] = useState(0)
     const dispatch = useDispatch()
     const health = useSelector((state: any) => state.health);
 
@@ -55,6 +57,8 @@ export default function AddMoment() {
     const [moment, setMoment] = useState(JSON.parse(router.params.moment))
 
     useEffect(() => {
+        var obj = JSON.parse(router.params.moment)
+        setDurationT(obj.target.duration??0)
         // var obj = JSON.parse(router.params.moment)
         // var start = dayjs(obj.target.timestamp).format('HH:mm')
         // setStartTime(start)
@@ -83,7 +87,7 @@ export default function AddMoment() {
     }
 
     function duration() {
-        const seconds = moment.target.duration / 1000
+        const seconds = durationT / 1000
         var hours = Math.floor(seconds / 3600)
         var minutes = Math.floor((seconds % 3600) / 60)
         // const { hours, minutes } = getIntervalHoursAndMinutes(meal.schedule_end_time, meal.schedule_start_time)
@@ -91,9 +95,11 @@ export default function AddMoment() {
         if (hours > 0) {
             time = hours + '小时'
         }
+        console.log(time)
         if (minutes > 0) {
-            time = minutes + '分钟'
+            time += minutes + '分钟'
         }
+        console.log(time)
         return time
     }
 
@@ -157,7 +163,7 @@ export default function AddMoment() {
             params.event_id = moment.event_id
         }
         if (moment.target.duration) {
-            params.duration = moment.target.duration
+            params.duration = durationT//moment.target.duration
         }
         createMoment(params).then(res => {
             if (process.env.TARO_ENV == 'weapp') {
@@ -333,8 +339,19 @@ export default function AddMoment() {
         {
             showPicker && timeContent()
         }
+
         {
-            durationPicker && durationContent()
+            durationPicker && <DurationPicker
+                title='进食时长'
+                done={(time) => {
+                    setDurationT(time)
+                    console.log(time)
+                    setDurationPicker(false)
+                    // updateDuration(time)
+                }}
+                dismiss={() => {
+                    setDurationPicker(false)
+                }} time={durationT} />
         }
         {/* <Text> add eat detail</Text> */}
     </View>

src/app.config.ts

@@ -33,6 +33,7 @@ const appConfig = defineAppConfig({
     'pages/store/product_list',
     'pages/account/Album',
     'pages/account/Journal',
+    'pages/account/JournalDetail',
     'pages/account/PhotoWall'
   ],
   entryPagePath: 'pages/clock/Clock',

src/features/health/HistoryActiveItem.tsx

@@ -1,6 +0,0 @@
-import { View } from "@tarojs/components";
-import './History.scss'
-
-export default function HistoryActiveItem(props:{data:any,index:number}){
-    return <View></View>
-}

src/features/health/HistoryEatItem.tsx

@@ -1,6 +0,0 @@
-import { View } from "@tarojs/components";
-import './History.scss'
-
-export default function HistoryEatItem(props:{data:any,index:number}){
-    return <View></View>
-}

src/features/health/HistoryFastItem.tsx

@@ -1,44 +0,0 @@
-import { View,Text } from "@tarojs/components";
-import './History.scss'
-import { TimeFormatter } from "@/utils/time_format";
-import Rings,{RealRing} from "../trackTimeDuration/components/Rings";
-import { getBgRing, getCommon } from "../trackTimeDuration/hooks/RingData";
-import { MainColorType } from "@/context/themes/color";
-import { durationArc, startArc } from "@/utils/ring_utils";
-
-export default function HistoryFastItem(props:{data:any,index:number}){
-
-    function getDuration(obj) {
-        var start = obj.start_timestamp
-        var end = obj.end_timestamp
-        if (!end) {
-            end = (new Date()).getTime()
-        }
-        return TimeFormatter.durationFormate(start, end)
-        // return TimeFormatter.calculateTimeDifference(start, end)
-    }
-
-    function ring(){
-        var common = getCommon(null, true)
-        common.radius = 20;
-        common.lineWidth = 5;
-        var bgRing = getBgRing()
-
-        const {start_timestamp,end_timestamp} = props.data.events[0].real
-
-        const realRingBig: RealRing = {
-            color: MainColorType.fast,
-            startArc: startArc(start_timestamp),
-            durationArc: durationArc(start_timestamp,end_timestamp)
-        }
-        
-        return <Rings common={common} bgRing={bgRing} realRing={realRingBig} canvasId={'fast'+props.index}  />
-    }
-    
-    return <View className="history_item">
-        {
-            ring()
-        }
-        <Text style={{marginLeft:18,color:MainColorType.fast,fontSize:18,fontWeight:'bold'}}>{getDuration(props.data.events[0].real)}</Text>
-    </View>
-}

src/features/health/HistorySleepItem.tsx

@@ -1,6 +0,0 @@
-import { View } from "@tarojs/components";
-import './History.scss'
-
-export default function HistorySleepItem(props:{data:any,index:number}){
-    return <View></View>
-}

src/features/health/MainFastEatCard.tsx

@@ -142,12 +142,21 @@ export default function MainFastEatCard(props: {
 
         const durationArc = isFastMode ? fastCount / 1440 * 2 * Math.PI : eatCount / 1440 * 2 * Math.PI
 
-        if (isFastMode && getWindowStatus(health.windows,'FAST') == WindowStatusType.process){
-            const scenario = getScenario(health.windows,'FAST')
+        if (isFastMode && getWindowStatus(health.windows, 'FAST') == WindowStatusType.process) {
+            const scenario = getScenario(health.windows, 'FAST')
             return {
                 color,
-                startArc:getStartArc(scenario.target.start_timestamp),
-                durationArc:getDurationArc(scenario.target.start_timestamp,scenario.target.end_timestamp)
+                startArc: getStartArc(scenario.target.start_timestamp),
+                durationArc: getDurationArc(scenario.target.start_timestamp, scenario.target.end_timestamp)
+            }
+        }
+
+        if (!isFastMode && getScenario(health.windows, 'EAT').real) {
+            const scenario = getScenario(health.windows, 'EAT')
+            return {
+                color,
+                startArc: getStartArc(scenario.target.start_timestamp),
+                durationArc: getDurationArc(scenario.target.start_timestamp, scenario.target.end_timestamp)
             }
         }
 

src/features/health/MainHistory.tsx

@@ -13,6 +13,7 @@ import { rpxToPx } from "@/utils/tools";
 import { jumpPage } from "../trackTimeDuration/hooks/Common";
 import Taro from "@tarojs/taro";
 import { getThemeColor } from "./hooks/health_hooks";
+import { TimeFormatter } from "@/utils/time_format";
 
 let lastMode = ''
 export default function MainHistory(props: { type: string }) {
@@ -22,6 +23,7 @@ export default function MainHistory(props: { type: string }) {
     const [loaded, setLoaded] = useState(false)
     const refDemo = useRef()
     const health = useSelector((state: any) => state.health);
+    const healthRef = useRef(health)
 
 
     global.refreshHistory = () => {
@@ -98,7 +100,7 @@ export default function MainHistory(props: { type: string }) {
             zIndex: 100
         }} /> */}
         {
-            list.length > 0 && <View className="recent">
+            (list.length > 0 || health.mode == 'EAT') && <View className="recent">
                 <Text className="recent_text">Recent</Text>
                 {
                     health.mode == 'EAT' && <View onClick={() => {
@@ -116,7 +118,7 @@ export default function MainHistory(props: { type: string }) {
                 <View className="archived_bg" onClick={() => {
                     jumpPage('/_health/pages/archive')
                 }}>
-                    <Text className="archived_text" style={{ color: getThemeColor(health.mode) }}>[{health.eatArchived.real_count}/{health.eatArchived.target_count} Meals] Archived Yesterday</Text>
+                    <Text className="archived_text" style={{ color: getThemeColor(health.mode) }}>[{health.eatArchived.real_count}/{health.eatArchived.target_count} Meals] Archived {TimeFormatter.dateDescription(new Date(health.eatArchived.timestamp).getTime(), true, false)}</Text>
                     {
                         health.eatArchived.images.map((item, index) => {
                             return <Image src={item} key={index} className="archived_img" mode="aspectFill" />

src/features/journal/components/journal_cover.scss

@@ -1,7 +1,7 @@
 .single {
     width: 178px;
     height: 178px;
-    background-color: pink;
+    background-color: #f5f5f5;
 }
 
 .double {
@@ -12,7 +12,7 @@
 .half_img {
     width: 88px;
     height: 178px;
-    background-color: pink;
+    background-color: #f5f5f5;
 }
 
 .half_top_down {
@@ -25,31 +25,31 @@
 .quarter_img {
     height: 88px;
     width: 88px;
-    background-color: pink;
+    background-color: #f5f5f5;
 }
 
 .five_1 {
     width: 118px;
     height: 118px;
-    background-color: pink;
+    background-color: #f5f5f5;
 }
 
 .seven_1{
     width: 58px;
     height: 118px;
-    background-color: pink;
+    background-color: #f5f5f5;
 }
 
 .five_2 {
     width: 58px;
     height: 118px;
-    background-color: pink;
+    background-color: #f5f5f5;
 }
 
 .nine_img {
     width: 58px;
     height: 58px;
-    background-color: pink;
+    background-color: #f5f5f5;
 }
 
 .journal_space{

src/features/journal/components/journal_cover.tsx

@@ -1,159 +1,166 @@
-import { View } from '@tarojs/components'
+import { View, Image } from '@tarojs/components'
 import './journal_cover.scss'
 import { count } from 'console'
 import { rpxToPx } from '@/utils/tools'
 
 
-export default function JournalCover(props: { count: number }) {
+export default function JournalCover(props: { imgs: any }) {
 
-    switch (props.count) {
-        case 1:
-            return <View className='single'></View>
-        case 2:
-            return <View className='double'>
-                <View className='half_img' />
-                <View className='journal_space' />
-                <View className='half_img' />
-            </View>
-        case 3:
-            return <View className='double'>
-                <View className='half_img' />
-                <View className='journal_space' />
-                <View className='half_top_down'>
-                    <View className='quarter_img' />
-                    <View className='journal_space' />
-                    <View className='quarter_img' />
-                </View>
-            </View>
-        case 4:
-            return <View className='double'>
-                <View className='half_top_down' >
-                    <View className='quarter_img' />
-                    <View className='journal_space' />
-                    <View className='quarter_img' />
-                </View>
+    const scale = '?x-oss-process=image/resize,w_100,limit_0'
 
-                <View className='journal_space' />
-                <View className='half_top_down'>
-                    <View className='quarter_img' />
-                    <View className='journal_space' />
-                    <View className='quarter_img' />
-                </View>
-            </View>
-        case 5:
-            return <View style={{ display: 'flex', flexDirection: 'column' }}>
-                <View style={{ display: 'flex', flexDirection: 'row' }}>
-                    <View className='five_1' />
-                    <View className='journal_space' />
-                    <View className='five_2' />
+    function content() {
+        switch (props.imgs.length) {
+            case 1:
+                return <Image className='single' src={props.imgs[0] + scale} mode="aspectFill" />
+            case 2:
+                return <View className='double'>
+                    <Image className='half_img' src={props.imgs[0] + scale} mode="aspectFill" />
+                    <View className='journal_space' />
+                    <Image className='half_img' src={props.imgs[1] + scale} mode="aspectFill" />
                 </View>
-                <View className='journal_space' />
-                <View style={{ display: 'flex', flexDirection: 'row' }}>
-                    <View className='nine_img' />
+            case 3:
+                return <View className='double'>
+                    <Image className='half_img' src={props.imgs[0] + scale} mode="aspectFill" />
                     <View className='journal_space' />
-                    <View className='nine_img' />
-                    <View className='journal_space' />
-                    <View className='nine_img' />
+                    <View className='half_top_down'>
+                        <Image className='quarter_img' src={props.imgs[1] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='quarter_img' src={props.imgs[2] + scale} mode="aspectFill" />
+                    </View>
                 </View>
-            </View>
+            case 4:
+                return <View className='double'>
+                    <View className='half_top_down' >
+                        <Image className='quarter_img' src={props.imgs[0] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='quarter_img' src={props.imgs[1] + scale} mode="aspectFill" />
+                    </View>
 
-        case 6:
-            return <View style={{ display: 'flex', flexDirection: 'column' }}>
-                <View style={{ display: 'flex', flexDirection: 'row' }}>
-                    <View className='five_1' />
                     <View className='journal_space' />
-                    <View style={{ display: 'flex', flexDirection: 'column' }}>
-                        <View className='nine_img' />
+                    <View className='half_top_down'>
+                        <Image className='quarter_img' src={props.imgs[2] + scale} mode="aspectFill" />
                         <View className='journal_space' />
-                        <View className='nine_img' />
+                        <Image className='quarter_img' src={props.imgs[3] + scale} mode="aspectFill" />
                     </View>
                 </View>
-                <View className='journal_space' />
-                <View style={{ display: 'flex', flexDirection: 'row' }}>
-                    <View className='nine_img' />
-                    <View className='journal_space' />
-                    <View className='nine_img' />
-                    <View className='journal_space' />
-                    <View className='nine_img' />
-                </View>
-            </View>
-        case 7:
-            return <View style={{ display: 'flex', flexDirection: 'column' }}>
-                <View style={{ display: 'flex', flexDirection: 'row' }}>
-                    <View className='seven_1' />
-                    <View className='journal_space' />
-                    <View className='seven_1' />
-                    <View className='journal_space' />
-                    <View style={{ display: 'flex', flexDirection: 'column' }}>
-                        <View className='nine_img' />
+            case 5:
+                return <View style={{ display: 'flex', flexDirection: 'column' }}>
+                    <View style={{ display: 'flex', flexDirection: 'row' }}>
+                        <Image className='five_1' src={props.imgs[0] + scale} mode="aspectFill" />
                         <View className='journal_space' />
-                        <View className='nine_img' />
+                        <Image className='five_2' src={props.imgs[1] + scale} mode="aspectFill" />
                     </View>
-                </View>
-                <View className='journal_space' />
-                <View style={{ display: 'flex', flexDirection: 'row' }}>
-                    <View className='nine_img' />
-                    <View className='journal_space' />
-                    <View className='nine_img' />
                     <View className='journal_space' />
-                    <View className='nine_img' />
+                    <View style={{ display: 'flex', flexDirection: 'row' }}>
+                        <Image className='nine_img' src={props.imgs[2] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[3] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[4] + scale} mode="aspectFill" />
+                    </View>
                 </View>
-            </View>
-        case 8:
-            return <View style={{ display: 'flex', flexDirection: 'column' }}>
-                <View style={{ display: 'flex', flexDirection: 'row' }}>
-                    <View className='seven_1' />
-                    <View className='journal_space' />
-                    <View style={{ display: 'flex', flexDirection: 'column' }}>
-                        <View className='nine_img' />
+
+            case 6:
+                return <View style={{ display: 'flex', flexDirection: 'column' }}>
+                    <View style={{ display: 'flex', flexDirection: 'row' }}>
+                        <Image className='five_1' src={props.imgs[0] + scale} mode="aspectFill" />
                         <View className='journal_space' />
-                        <View className='nine_img' />
+                        <View style={{ display: 'flex', flexDirection: 'column' }}>
+                            <Image className='nine_img' src={props.imgs[1] + scale} mode="aspectFill" />
+                            <View className='journal_space' />
+                            <Image className='nine_img' src={props.imgs[2] + scale} mode="aspectFill" />
+                        </View>
                     </View>
                     <View className='journal_space' />
-                    <View style={{ display: 'flex', flexDirection: 'column' }}>
-                        <View className='nine_img' />
+                    <View style={{ display: 'flex', flexDirection: 'row' }}>
+                        <Image className='nine_img' src={props.imgs[3] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[4] + scale} mode="aspectFill" />
                         <View className='journal_space' />
-                        <View className='nine_img' />
+                        <Image className='nine_img' src={props.imgs[5] + scale} mode="aspectFill" />
                     </View>
                 </View>
-                <View className='journal_space' />
-                <View style={{ display: 'flex', flexDirection: 'row' }}>
-                    <View className='nine_img' />
-                    <View className='journal_space' />
-                    <View className='nine_img' />
-                    <View className='journal_space' />
-                    <View className='nine_img' />
-                </View>
-            </View>
-        case 9:
-            return <View style={{ display: 'flex', flexDirection: 'column' }}>
-                <View style={{ display: 'flex', flexDirection: 'row' }}>
-                    <View className='nine_img' />
-                    <View className='journal_space' />
-                    <View className='nine_img' />
+            case 7:
+                return <View style={{ display: 'flex', flexDirection: 'column' }}>
+                    <View style={{ display: 'flex', flexDirection: 'row' }}>
+                        <Image className='seven_1' src={props.imgs[0] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='seven_1' src={props.imgs[1] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <View style={{ display: 'flex', flexDirection: 'column' }}>
+                            <Image className='nine_img' src={props.imgs[2] + scale} mode="aspectFill" />
+                            <View className='journal_space' />
+                            <Image className='nine_img' src={props.imgs[3] + scale} mode="aspectFill" />
+                        </View>
+                    </View>
                     <View className='journal_space' />
-                    <View className='nine_img' />
+                    <View style={{ display: 'flex', flexDirection: 'row' }}>
+                        <Image className='nine_img' src={props.imgs[4] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[5] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[6] + scale} mode="aspectFill" />
+                    </View>
                 </View>
-                <View className='journal_space' />
-                <View style={{ display: 'flex', flexDirection: 'row' }}>
-                    <View className='nine_img' />
-                    <View className='journal_space' />
-                    <View className='nine_img' />
+            case 8:
+                return <View style={{ display: 'flex', flexDirection: 'column' }}>
+                    <View style={{ display: 'flex', flexDirection: 'row' }}>
+                        <Image className='seven_1' src={props.imgs[0] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <View style={{ display: 'flex', flexDirection: 'column' }}>
+                            <Image className='nine_img' src={props.imgs[1] + scale} mode="aspectFill" />
+                            <View className='journal_space' />
+                            <Image className='nine_img' src={props.imgs[2] + scale} mode="aspectFill" />
+                        </View>
+                        <View className='journal_space' />
+                        <View style={{ display: 'flex', flexDirection: 'column' }}>
+                            <Image className='nine_img' src={props.imgs[3] + scale} mode="aspectFill" />
+                            <View className='journal_space' />
+                            <Image className='nine_img' src={props.imgs[4] + scale} mode="aspectFill" />
+                        </View>
+                    </View>
                     <View className='journal_space' />
-                    <View className='nine_img' />
+                    <View style={{ display: 'flex', flexDirection: 'row' }}>
+                        <Image className='nine_img' src={props.imgs[5] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[6] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[7] + scale} mode="aspectFill" />
+                    </View>
                 </View>
-                <View className='journal_space' />
-                <View style={{ display: 'flex', flexDirection: 'row' }}>
-                    <View className='nine_img' />
+            case 9:
+            default:
+                return <View style={{ display: 'flex', flexDirection: 'column' }}>
+                    <View style={{ display: 'flex', flexDirection: 'row' }}>
+                        <Image className='nine_img' src={props.imgs[0] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[1] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[2] + scale} mode="aspectFill" />
+                    </View>
                     <View className='journal_space' />
-                    <View className='nine_img' />
+                    <View style={{ display: 'flex', flexDirection: 'row' }}>
+                        <Image className='nine_img' src={props.imgs[3] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[4] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[5] + scale} mode="aspectFill" />
+                    </View>
                     <View className='journal_space' />
-                    <View className='nine_img' />
+                    <View style={{ display: 'flex', flexDirection: 'row' }}>
+                        <Image className='nine_img' src={props.imgs[6] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[7] + scale} mode="aspectFill" />
+                        <View className='journal_space' />
+                        <Image className='nine_img' src={props.imgs[8] + scale} mode="aspectFill" />
+                    </View>
                 </View>
-            </View>
+        }
     }
 
-    return <View>
-
+    return <View style={{ marginRight: rpxToPx(24) }}>
+        {
+            content()
+        }
     </View>
 }

src/pages/account/Album.config.ts

@@ -0,0 +1,8 @@
+export default definePageConfig({
+    usingComponents:{
+      // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
+      // 'demo':'../../components/demo'
+    },
+    "navigationBarTitleText":"Album",
+    "navigationBarBackgroundColor":"#f5f5f5"
+  })

src/pages/account/Album.scss

@@ -0,0 +1,66 @@
+.photo_wall{
+    height: 108px;
+    background-color: #fff;
+    position: relative;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding-right: 42px;
+}
+
+.album_line{
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    height: 2px;
+    transform: scaleY(0.5);
+    background-color: #B2B2B2;
+    opacity: 0.2;
+}
+
+.photo_wall_text{
+    color: #5C7099;
+    font-size: 26px;
+    font-weight: bold;
+}
+
+.photo_wall_arrow{
+    width: 34px;
+    height: 34px;
+}
+
+.album_item{
+    display: flex;
+    flex-direction: row;
+    padding-top: 40px;
+    padding-bottom: 44px;
+    position: relative;
+    background-color: #fff;
+}
+
+.album_date{
+    margin-left: 40px;
+    margin-right: 30px;
+    width: 68px;
+    height: 68px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #000;
+    font-size: 50px;
+    font-weight: bold;
+}
+
+.album_container{
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+}
+
+.album_phone{
+    width: 155px;
+    height: 155px;
+    margin-left: 4px;
+    margin-bottom: 4px;
+}

src/pages/account/Album.tsx

@@ -1,10 +1,50 @@
 import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
-import { View } from "@tarojs/components";
+import { getAlbums } from "@/services/health";
+import { View, Text,Image } from "@tarojs/components";
+import { useEffect, useState } from "react";
+import './Album.scss'
 
-export default function Album(){
-    return <View>
-        <View onClick={()=>{
+export default function Album() {
+
+    const [medias, setMedias] = useState<any>([])
+
+    useEffect(() => {
+        getAlbumsData()
+    }, [])
+
+    function getAlbumsData() {
+        getAlbums({
+            page: 1,
+            limit: 50
+        }).then(res => {
+            setMedias((res as any).data)
+        })
+    }
+
+
+    return <View style={{ display: 'flex', flexDirection: 'column' }}>
+        <View className="photo_wall" onClick={() => {
             jumpPage('/pages/account/PhotoWall')
-        }}>Photo Wall</View>
+        }}>
+            <View style={{flex:1}}/>
+            <Text className="photo_wall_text">Photo Wall</Text>
+            <Image className="photo_wall_arrow" src={require('@assets/_health/arrow2.png')}/>
+            <View className="album_line" />
+        </View>
+        {
+            medias.map((item,index)=>{
+                return <View className="album_item" key={index}>
+                    <Text className="album_date">{(item.date+'').substring(6,9)}</Text>
+                    <View className="album_container">
+                        {
+                            item.images.map((photo,i)=>{
+                                return <Image mode="aspectFill" src={photo} key={i*900} className="album_phone"/>
+                            })
+                        }
+                    </View>
+                    <View className="album_line"/>
+                </View>
+            })
+        }
     </View>
 }

src/pages/account/Journal.config.ts

@@ -0,0 +1,8 @@
+export default definePageConfig({
+    usingComponents:{
+      // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
+      // 'demo':'../../components/demo'
+    },
+    "navigationBarTitleText":"Journals",
+    "navigationBarBackgroundColor":"#f5f5f5"
+  })

src/pages/account/Journal.scss

@@ -0,0 +1,66 @@
+.photo_wall{
+    height: 108px;
+    background-color: #fff;
+    position: relative;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding-right: 42px;
+}
+
+.album_line{
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    height: 2px;
+    transform: scaleY(0.5);
+    background-color: #B2B2B2;
+    opacity: 0.2;
+}
+
+.photo_wall_text{
+    color: #5C7099;
+    font-size: 26px;
+    font-weight: bold;
+}
+
+.photo_wall_arrow{
+    width: 34px;
+    height: 34px;
+}
+
+.album_item{
+    display: flex;
+    flex-direction: row;
+    padding-top: 40px;
+    padding-bottom: 44px;
+    position: relative;
+    background-color: #fff;
+}
+
+.album_date{
+    margin-left: 40px;
+    margin-right: 30px;
+    width: 68px;
+    height: 68px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #000;
+    font-size: 50px;
+    font-weight: bold;
+}
+
+.album_container{
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+}
+
+.album_phone{
+    width: 155px;
+    height: 155px;
+    margin-left: 4px;
+    margin-bottom: 4px;
+}

src/pages/account/Journal.tsx

@@ -1,25 +1,93 @@
 import JournalCover from "@/features/journal/components/journal_cover";
-import { View } from "@tarojs/components";
-
-export default function Journal(){
-    return <View style={{display:'flex',flexDirection:'row',flexWrap:'wrap'}}>
-        <JournalCover count={1} />
-        <View style={{height:120,width:10}}/>
-        <JournalCover count={2} />
-        <View style={{height:120,width:10}}/>
-        <JournalCover count={3} />
-        <View style={{height:120,width:10}}/>
-        <JournalCover count={4} />
-        <View style={{height:120,width:10}}/>
-        <JournalCover count={5} />
-        <View style={{height:120,width:10}}/>
-        <JournalCover count={6} />
-        <View style={{height:120,width:10}}/>
-        <JournalCover count={7} />
-        <View style={{height:120,width:10}}/>
-        <JournalCover count={8} />
-        <View style={{height:120,width:10}}/>
-        <JournalCover count={9} />
-        <View style={{height:10,width:10}}/>
+import { getJournals } from "@/services/health";
+import { View, Text, Image } from "@tarojs/components";
+import { useEffect, useState } from "react";
+import './Journal.scss'
+import dayjs from "dayjs";
+import { rpxToPx } from "@/utils/tools";
+import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
+
+export default function Journal() {
+    const [journals, setJournals] = useState<any>([])
+    useEffect(() => {
+        getJounalsData()
+    }, [])
+
+    function getJounalsData() {
+        getJournals({
+            page: 1,
+            limit: 50
+        }).then(res => {
+            let list = (res as any).data
+            list.forEach(element => {
+                let array: any = []
+                element.windows.map(item => {
+                    item.events.map(event => {
+                        if (event.moment && event.moment.media && event.moment.media.length > 0) {
+                            event.moment.media.map(media => {
+                                array.push(media.url)
+                            })
+                        }
+                    })
+                })
+                element.imgs = array
+            });
+            setJournals((res as any).data)
+        })
+    }
+
+    function getTitle(item) {
+        if (item.moment) {
+            return item.moment.title
+        }
+        if (item.window == 'FAST') {
+            return '开始断食'
+        }
+        else if (item.window == 'SLEEP') {
+            return '开始睡眠'
+        }
+        return ''
+    }
+
+
+    return <View style={{ display: 'flex', flexDirection: 'column' }}>
+        {
+            journals.map((item, index) => {
+                return <View className="album_item" key={index} onClick={()=>{
+                    jumpPage('/pages/account/JournalDetail?detail='+JSON.stringify(item))
+                }}>
+                    <Text className="album_date">{(item.date + '').substring(6, 9)}</Text>
+                    {
+                        item.imgs.length > 0 && <JournalCover imgs={item.imgs} />
+                    }
+
+                    <View style={{ display: 'flex', 
+                        flexDirection: 'column', 
+                        flex:1,
+                        backgroundColor: item.imgs.length == 0 ? '#f5f5f5' : 'transparent',
+                        padding:item.imgs.length == 0 ? rpxToPx(10) : 0,
+                        marginRight:rpxToPx(40)
+                        }}>
+                        {
+                            item.windows.map((window, i) => {
+                                return <View key={i * 400} style={{ display: 'flex', flexDirection: 'column' }}>{
+                                    window.events.map((item2, index2) => {
+                                        return <Text key={index2 * 1000}>
+                                            <Text className="history_item_title">{dayjs(item2.real.start_timestamp).format('HH:mm')} {getTitle(item2)} </Text>
+                                            {
+                                                item2.moment && item2.moment.description && <Text className="history_item_desc">{item2.moment.description}</Text>
+                                            }
+                                        </Text>
+                                    })
+                                }</View>
+
+                            })
+                        }
+
+                    </View>
+                    <View className="album_line" />
+                </View>
+            })
+        }
     </View>
 }

src/pages/account/JournalDetail.tsx

@@ -0,0 +1,34 @@
+import { View } from "@tarojs/components";
+import { useRouter } from "@tarojs/taro";
+import { useState } from "react";
+
+let useRoute;
+let useNavigation;
+let scenario = '';
+if (process.env.TARO_ENV == 'rn') {
+    useRoute = require("@react-navigation/native").useRoute
+    useNavigation = require("@react-navigation/native").useNavigation
+}
+
+export default function JournalDetail() {
+
+    let router
+    let navigation;
+    if (useNavigation) {
+        navigation = useNavigation()
+    }
+
+    if (process.env.TARO_ENV == 'rn') {
+        router = useRoute()
+    }
+    else {
+        router = useRouter()
+    }
+
+    const [detail,setDetail] = useState(JSON.parse(router.params.detail))
+
+
+    return <View>
+
+    </View>
+}

src/pages/clock/ClockNew.tsx

@@ -34,9 +34,9 @@ export default function ClockNew() {
         healthRef.current = health;
     }, [health])
 
-    useEffect(()=>{
+    useEffect(() => {
         archived()
-    },[health.mode])
+    }, [health.mode])
 
     useEffect(() => {
         setInterval(() => {
@@ -46,6 +46,12 @@ export default function ClockNew() {
                 const now = dayjs().format('YYYY-MM-DDTHH:mm:ss')
                 if (strTime == now) {
                     getWindows()
+                    // archived();
+                    getArchived('EAT').then(res => {
+                        dispatch(setEatArchived((res as any).latest))
+                    })
+
+                    global.refreshHistory()
                 }
             })
         }, 1000)
@@ -59,6 +65,7 @@ export default function ClockNew() {
 
     global.refreshWindow = () => {
         getWindows();
+        archived();
     }
 
     function getWindows() {
@@ -69,10 +76,10 @@ export default function ClockNew() {
         archived()
     }
 
-    function archived(){
-        if (health.mode == 'EAT'||health.mode == 'ACTIVE'){
-            getArchived(health.mode).then(res=>{
-                if (health.mode == 'EAT'){
+    function archived() {
+        if (health.mode == 'EAT' || health.mode == 'ACTIVE') {
+            getArchived(health.mode).then(res => {
+                if (health.mode == 'EAT') {
                     dispatch(setEatArchived((res as any).latest))
                 }
             })

src/services/health.tsx

@@ -1,4 +1,4 @@
-import { API_ACTIVE_MOVES, API_ACTIVE_MOVES_CURRENT, API_HEALTH_ARCHIVED, API_HEALTH_CLOCK, API_HEALTH_EVENTS, API_HEALTH_LABELS, API_HEALTH_MOMENT, API_HEALTH_RECORD, API_HEALTH_SCHEDULES, API_HEALTH_STREAKS, API_HEALTH_TARGET, API_HEALTH_WINDOWS } from "./http/api";
+import { API_ACTIVE_MOVES, API_ACTIVE_MOVES_CURRENT, API_HEALTH_ARCHIVED, API_HEALTH_CLOCK, API_HEALTH_EVENTS, API_HEALTH_LABELS, API_HEALTH_MOMENT, API_HEALTH_RECORD, API_HEALTH_SCHEDULES, API_HEALTH_STREAKS, API_HEALTH_TARGET, API_HEALTH_WINDOWS, API_ME_ALBUMS, API_ME_JOURNALS } from "./http/api";
 import { request } from "./http/request";
 
 export const getLabels = (params) => {
@@ -232,3 +232,25 @@ export const getActiveMoveDetail = (id)=>{
     })
 }
 
+
+export const getJournals = (params) =>{
+    return new Promise((resolve) => {
+        request({
+            url: API_ME_JOURNALS, method: 'GET', data: { ...params }
+        }).then(res => {
+            resolve(res);
+            // dispatch(loginSuccess(res));
+        })
+    })
+}
+
+export const getAlbums = (params) =>{
+    return new Promise((resolve) => {
+        request({
+            url: API_ME_ALBUMS, method: 'GET', data: { ...params }
+        }).then(res => {
+            resolve(res);
+            // dispatch(loginSuccess(res));
+        })
+    })
+}

src/services/http/api.js

@@ -107,4 +107,6 @@ export const API_HEALTH_EVENTS = `${baseUrl}/api/health/events`
 export const API_HEALTH_ARCHIVED = `${baseUrl}/api/health/archived`
 
 export const API_ACTIVE_MOVES_CURRENT = `${baseUrl}/api/health/active/moves/current`
-export const API_ACTIVE_MOVES= `${baseUrl}/api/health/active/moves`
+export const API_ACTIVE_MOVES= `${baseUrl}/api/health/active/moves`
+export const API_ME_JOURNALS = `${baseUrl}/api/health/wo/journals`
+export const API_ME_ALBUMS = `${baseUrl}/api/health/wo/albums`