update

src/pages/clock/ClockIndex.tsx

@@ -402,6 +402,32 @@ export default function ClockIndex() {
             end={{ x: 0, y: 1 }} pointerEvents="none" />
     }
 
+    function daynightIcon() {
+        var isDay = true
+        var now = new Date().getTime()
+        if (!user.isLogin || (home && !home.daylight.choose_location)) {
+            isDay = new Date().getHours() >= 6 && new Date().getHours() < 18
+        }
+        else if (home && home.daylight.choose_location) {
+            var array = home.daylight.events.filter((item) => {
+                return item.sub_type != 'SUN_SOLAR_MIDNIGHT' && item.sub_type != 'SUN_SOLAR_NOON'
+            })
+
+            for (var i = 0; i < array.length - 1; i++) {
+                if (array[i].time.start_timestamp <= now && array[i + 1].time.start_timestamp > now) {
+                    if (array[i].sub_type == 'SUN_SET') {
+                        isDay = false
+                    }
+                    else {
+                        isDay = true
+                    }
+                    
+                }
+            }
+        }
+        return <Image style={{ width: rpxToPx(40), height: rpxToPx(40) }} src={isDay ? BASE_IMG_URL + 'sun-line.svg' : BASE_IMG_URL + 'moon-line.svg'} />
+    }
+
     function navibar() {
         return <View style={{ position: 'absolute', left: 0, top: 0, right: 0, height: navigationBarHeight }}>
             <View style={{
@@ -429,7 +455,10 @@ export default function ClockIndex() {
                         }
                         setShowDayNight(true)
                     }}>
-                    <IconClose color={"#000"} width={rpxToPx(64)} height={rpxToPx(64)} />
+                    {
+                        daynightIcon()
+                    }
+                    {/* <IconClose color={"#000"} width={rpxToPx(40)} height={rpxToPx(40)} /> */}
                 </View>
             </View>
         </View>

src/pages/clock/components/day_night.scss

@@ -46,4 +46,10 @@
     font-size: 26px;
     font-weight: bold;
     margin-right: 12px;
+}
+
+.sun_rise_icon{
+    width: 48px;
+    height: 48px;
+    margin-top: 40px;
 }

src/pages/clock/components/day_night.tsx

@@ -1,4 +1,4 @@
-import { View } from "@tarojs/components";
+import { View,Image } from "@tarojs/components";
 import './day_night.scss'
 import { useSelector } from "react-redux";
 import Taro from "@tarojs/taro";
@@ -13,6 +13,7 @@ import { systemLocation } from "@/services/common";
 import { useTranslation } from "react-i18next";
 import dayjs from "dayjs";
 import { clearLocation } from "@/services/user";
+import { BASE_IMG_URL } from "@/services/http/api";
 
 export default function DayNight(props: { onClose: any, data: any }) {
     const record = useSelector((state: any) => state.record);
@@ -120,62 +121,48 @@ export default function DayNight(props: { onClose: any, data: any }) {
         for (var i = 0; i < events.length - 1; i++) {
             if (events[i].time.start_timestamp <= now && events[i + 1].time.start_timestamp > now) {
                 if (events[i].sub_type == 'SUN_SET') {
-                    return '夜晚'
+                    return t('health.nighttime')//'夜晚'
                 }
-                return '白天'
+                return t('health.daytime')//'白天'
             }
         }
         return ''
     }
 
+    function formateTime(timestamp){
+        if (TimeFormatter.isToday(timestamp)) {
+            return dayjs(timestamp).format('HH:mm')
+        }
+        if (TimeFormatter.isYesterday(timestamp)) {
+            return (global.language == 'en' ? 'Yesterday ' : '昨天 ') + dayjs(timestamp).format('HH:mm')
+        }
+        if (TimeFormatter.isTomorrowday(timestamp)) {
+            return (global.language == 'en' ? 'Tomorrow ' : '明天 ') + dayjs(timestamp).format('HH:mm')
+        }
+        return dayjs(timestamp).format('MM-DD HH:mm')
+    }
+
     function durationView() {
         var start: any;
         var end: any;
         var now = new Date().getTime()
         for (var i = 0; i < events.length - 1; i++) {
             if (events[i].time.start_timestamp <= now && events[i + 1].time.start_timestamp > now) {
-                if (events[i].sub_type == 'SUN_SET') {
-                    start = events[i]
-                }
+                // if (events[i].sub_type == 'SUN_SET') {
+                start = events[i]
+                // }
                 end = events[i + 1]
             }
         }
-        var str1 = dayjs(start.time.start_timestamp).format('MM-DD HH:mm')
-        var str2 = dayjs(end.time.start_timestamp).format('MM-DD HH:mm')
-        if (TimeFormatter.isToday(start.time.start_timestamp)) {
-            str1 = dayjs(start.time.start_timestamp).format('HH:mm')
-        }
-        if (TimeFormatter.isToday(end.time.start_timestamp)) {
-            str2 = dayjs(end.time.start_timestamp).format('HH:mm')
-        }
-
-        if (TimeFormatter.isYesterday(start.time.start_timestamp)) {
-            str1 = (global.language == 'en' ? 'Yesterday ' : '昨天 ') + dayjs(start.time.start_timestamp).format('HH:mm')
-        }
-        if (TimeFormatter.isYesterday(end.time.start_timestamp)) {
-            str2 = (global.language == 'en' ? 'Yesterday ' : '昨天 ') + dayjs(end.time.start_timestamp).format('HH:mm')
-        }
-
-        if (TimeFormatter.isTomorrowday(start.time.start_timestamp)) {
-            str1 = (global.language == 'en' ? 'Tomorrow ' : '明天 ') + dayjs(start.time.start_timestamp).format('HH:mm')
-        }
-        if (TimeFormatter.isTomorrowday(end.time.start_timestamp)) {
-            str2 = (global.language == 'en' ? 'Tomorrow ' : '明天 ') + dayjs(end.time.start_timestamp).format('HH:mm')
-        }
-
-        if (TimeFormatter.isToday(start.time.start_timestamp)) {
-            str1 = dayjs(start.time.start_timestamp).format('HH:mm')
-        }
-        if (TimeFormatter.isToday(end.time.start_timestamp)) {
-            str2 = dayjs(end.time.start_timestamp).format('HH:mm')
-        }
+        var str1 = formateTime(start.time.start_timestamp)
+        var str2 = formateTime(end.time.start_timestamp)
 
         return <View style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', marginTop: rpxToPx(12), marginBottom: rpxToPx(52) }}>
             {
-                info.is_polar_night && <View className="polar_tag">极夜</View>
+                info.is_polar_night && <View className="polar_tag">{t('feature.day_night.polar_night')}</View>
             }
             {
-                info.is_polar_day && <View className="polar_tag">极昼</View>
+                info.is_polar_day && <View className="polar_tag">{t('feature.day_night.polar_day')}</View>
             }
             <View className="h36 g01">{str1} - {str2}</View>
         </View>
@@ -187,21 +174,24 @@ export default function DayNight(props: { onClose: any, data: any }) {
         var now = new Date().getTime()
         for (var i = 0; i < events.length - 1; i++) {
             if (events[i].time.start_timestamp <= now && events[i + 1].time.start_timestamp > now) {
-                if (events[i].sub_type == 'SUN_SET') {
-                    start = events[i]
-                }
+                // if (events[i].sub_type == 'SUN_SET') {
+                start = events[i]
+                // }
                 end = events[i + 1]
             }
         }
         return <View style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
             <View className="location_card" style={{ marginRight: rpxToPx(30) }}>
                 <View className="h36 bold">{start.title}</View>
-                <View className="h36 g01" style={{ marginTop: rpxToPx(8) }}>{dayjs(start.time.start_timestamp).format('HH:mm')}</View>
+                <View className="h36 g01" style={{ marginTop: rpxToPx(8) }}>{formateTime(start.time.start_timestamp)}</View>
+                <Image className="sun_rise_icon" src={start.sub_type=='SUN_RISE'?BASE_IMG_URL+'sunrise.svg':BASE_IMG_URL+'sunset.svg'}/>
             </View>
             <View className="location_card">
                 <View className="h36 bold">{end.title}</View>
-                <View className="h36 g01" style={{ marginTop: rpxToPx(8) }}>{dayjs(end.time.start_timestamp).format('HH:mm')}</View>
+                <View className="h36 g01" style={{ marginTop: rpxToPx(8) }}>{formateTime(end.time.start_timestamp)}</View>
+                <Image className="sun_rise_icon" src={end.sub_type=='SUN_SET'?BASE_IMG_URL+'sunset.svg':BASE_IMG_URL+'sunrise.svg'}/>
             </View>
+            
         </View>
     }
 
@@ -247,7 +237,7 @@ export default function DayNight(props: { onClose: any, data: any }) {
                             width={rpxToPx(374)}
                             height={rpxToPx(96)}
                             color={MainColorType.orange}
-                            title="选择位置"
+                            title={t('health.choose_location')}
                             onClick={() => {
                                 chooseLocation()
                             }}
@@ -264,8 +254,9 @@ export default function DayNight(props: { onClose: any, data: any }) {
                             pointCard()
                         }
                         <View style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'center', marginTop: rpxToPx(26), position: 'relative', width: rpxToPx(750) }}>
+                            <Image style={{width:rpxToPx(26),height:rpxToPx(26),marginRight:rpxToPx(12)}} src={BASE_IMG_URL+'map_pin.svg'}/>
                             <View className="h26">{info.location.name}</View>
-                            <View className="h26" style={{ color: MainColorType.link, marginLeft: rpxToPx(12) }} onClick={chooseLocation}>更改位置</View>
+                            <View className="h26" style={{ color: MainColorType.link, marginLeft: rpxToPx(12) }} onClick={chooseLocation}>{t('health.change_location')}</View>
                             {
                                 user.test_user && <View style={{ position: 'absolute', right: 50 }} onClick={tapClearLocation}>清除位置</View>
                             }