update

src/context/locales/en.js

@@ -284,6 +284,7 @@ export default {
                 member_desc: 'Sunset and sunrise times are global average. For actual times at your location, join our Pro program.',
                 base_location_desc: 'Calculated based on your location.',
                 enter_location_desc: 'Sunset and sunrise times are global average. For actual times at your location, enter your location.',
+                update_my_location:'Update my location',
 
                 location: 'Location',
                 enter: 'Enter',

src/context/locales/zh.js

@@ -289,6 +289,7 @@ export default {
                 member_desc: "日出和日落时间为全球平均值。如需获取实际时间, 成为我们的 Pro 会员。",
                 enter_location_desc: "日出和日落时间为全球平均值。如需获取实际时间，请选择您的地点。",
                 base_location_desc: "根据您的地点计算。",
+                update_my_location:'更新我的位置',
 
                 location: '地点',
                 enter: '选择',

src/features/trackTimeDuration/components/AllDayRings.tsx

@@ -0,0 +1,535 @@
+import Box from '@/components/layout/Box'
+import './AllRings.scss'
+import { PageContainer, View, Text } from '@tarojs/components'
+import { useState } from 'react'
+import Modal from '@/components/layout/Modal.weapp'
+import { rpxToPx } from '@/utils/tools'
+import { ColorType } from '@/context/themes/color'
+import Rings from "@/features/trackTimeDuration/components/Rings";
+import { bigRingRadius, getBgRing, getCommon, getDot, ringWidth, smallRingRadius, thirdRingRadius } from '../hooks/RingData'
+import { RealRing } from './Rings'
+import { useSelector } from 'react-redux'
+import { useTranslation } from 'react-i18next'
+import { TimeFormatter } from '@/utils/time_format'
+import '@/utils/ring_card.scss';
+
+let sunriseA = new Date()
+sunriseA.setHours(6)
+sunriseA.setMinutes(0)
+sunriseA.setSeconds(0)
+sunriseA.setMilliseconds(0)
+const sunsetA = new Date()
+sunsetA.setHours(18)
+sunsetA.setMinutes(0)
+sunsetA.setSeconds(0)
+sunsetA.setMilliseconds(0)
+
+const sunriseB = new Date()
+sunriseB.setHours(6)
+sunriseB.setMinutes(0)
+sunriseB.setSeconds(0)
+sunriseB.setMilliseconds(0)
+
+export default function AllDayRings(props: { schedule: any }) {
+    const [authInfo, setAuthInfo] = useState(global.locationDetail ? global.locationDetail : null)
+    const [showRing, setShowRing] = useState(false)
+    const user = useSelector((state: any) => state.user);
+    const ring = useSelector((state: any) => state.ring);
+    const day = useSelector((state: any) => state.day);
+    const [schedule] = useState(props.schedule)
+    const { t } = useTranslation()
+
+    function tapShow() {
+        setShowRing(true)
+    }
+
+    function getFoodTime() {
+        if (ring.schedule) {
+            return [ring.schedule.fast.end_time, ring.schedule.fast.start_time]
+        }
+        var obj;
+        (schedule as any).map(item => {
+            if (item.name == 'FAST') {
+                obj = item
+            }
+        })
+        if (!obj) {
+            console.log('报错', schedule)
+            return ['16:00', '08:00'];
+        }
+        return [obj.schedule.fast.end_time, obj.schedule.fast.start_time]
+    }
+
+    function getActivityTime() {
+        if (ring.schedule) {
+            return [ring.schedule.sleep.end_time, ring.schedule.sleep.start_time]
+        }
+        var obj;
+        (schedule as any).map(item => {
+            if (item.name == 'SLEEP') {
+                obj = item
+            }
+        })
+        return [obj.schedule.sleep.end_time, obj.schedule.sleep.start_time]
+    }
+
+    function bigRing() {
+        var common = getCommon(null, true)
+        common.radius = bigRingRadius;
+        common.lineWidth = ringWidth;
+        var bgRing = getBgRing()
+        const targetRing: RealRing = {
+            color: (ring.current_record && ring.current_record.scenario == 'SLEEP') ? ColorType.activity + '66' : ColorType.food + '66',
+            startArc: 0,
+            durationArc: 2
+        }
+        var list = getFoodTime()
+        var start;
+        var end;
+
+        if (ring.current_record && ring.current_record.scenario == 'SLEEP') {
+            var list2 = getActivityTime()
+            start = parseInt(list2[0].split(':')[0]) * 60 + parseInt(list2[0].split(':')[1])
+            end = parseInt(list2[1].split(':')[0]) * 60 + parseInt(list2[1].split(':')[1])
+            if (ring.current_record.status != 'WAIT_FOR_START') {
+                var startDate = new Date(ring.current_record.sleep.target_start_time)
+                var endDate = new Date(ring.current_record.sleep.target_end_time)
+                end = startDate.getHours() * 60 + startDate.getMinutes()
+                start = endDate.getHours() * 60 + endDate.getMinutes()
+            }
+        }
+        else {
+            start = parseInt(list[0].split(':')[0]) * 60 + parseInt(list[0].split(':')[1])
+            end = parseInt(list[1].split(':')[0]) * 60 + parseInt(list[1].split(':')[1])
+            if (ring.current_record && ring.current_record.status != 'WAIT_FOR_START') {
+                var startDate = new Date(ring.current_record.fast.target_start_time)
+                var endDate = new Date(ring.current_record.fast.target_end_time)
+                end = startDate.getHours() * 60 + startDate.getMinutes()
+                start = endDate.getHours() * 60 + endDate.getMinutes()
+            }
+        }
+
+        if (end < start) {
+            end += 24 * 60
+        }
+        var duration = end - start
+        targetRing.startArc = (start * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
+        targetRing.durationArc = (duration * 60) / (24 * 3600) * 2 * Math.PI;
+
+        var currentDot = getDot(null, false)
+        var date = new Date()
+        var minutes = date.getHours() * 60 + date.getMinutes()
+        if (minutes < start) {
+            minutes += 1440
+        }
+
+        currentDot.color = ColorType.food
+
+
+        var now = new Date()
+        var t = now.getHours() * 60 + now.getMinutes()
+        var duration2 = t - start
+        if (duration2 < 0) {
+            duration2 += 24 * 60
+        }
+
+        let realRing: RealRing = {
+            color: ColorType.food,
+            startArc: (start * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0,
+            durationArc: (duration2 * 60) / (24 * 3600) * 2 * Math.PI
+        }
+
+        if (ring.current_record && ring.current_record.scenario == 'SLEEP') {
+            realRing.color = ColorType.activity
+            currentDot.color = ColorType.activity
+        }
+
+        if (!user.isLogin) {
+            currentDot = null
+            realRing = null
+        }
+
+        if (ring.current_record.status == 'ONGOING1') {
+            realRing = null
+        }
+
+        return <Rings common={common} bgRing={bgRing} targetRing={targetRing} realRing={duration2 <= duration ? realRing : null} currentDot={currentDot} canvasId={'pop_day_big'} />
+    }
+    function smallRing() {
+        var common = getCommon(null, false)
+        common.radius = smallRingRadius;
+        common.lineWidth = ringWidth;
+        var bgRing = getBgRing()
+        const realRingBig: RealRing = {
+            color: ColorType.activity + '66',
+            startArc: 0,
+            durationArc: 2
+        }
+        var list = getActivityTime()
+        var start = parseInt(list[0].split(':')[0]) * 60 + parseInt(list[0].split(':')[1])
+        var end = parseInt(list[1].split(':')[0]) * 60 + parseInt(list[1].split(':')[1])
+        if (ring.current_record) {
+            if (ring.current_record.scenario == 'SLEEP') {
+                if (ring.current_record.status == 'ONGOING') {
+                    var startDate = new Date(ring.current_record.sleep.target_start_time)
+                    var endDate = new Date(ring.current_record.sleep.target_end_time)
+                    end = startDate.getHours() * 60 + startDate.getMinutes()
+                    start = endDate.getHours() * 60 + endDate.getMinutes()
+                }
+            }
+            else {
+                if (ring.current_record.status == 'ONGOING2') {
+                    var startDate = new Date(ring.current_record.sleep.target_start_time)
+                    var endDate = new Date(ring.current_record.sleep.target_end_time)
+                    end = startDate.getHours() * 60 + startDate.getMinutes()
+                    start = endDate.getHours() * 60 + endDate.getMinutes()
+                }
+                else if (ring.current_record.status == 'ONGOING3') {
+                    //睡眠已完成时，睡眠小于24小时，使用真实的real_end_time-real_start_time
+                    //大于24小时，使用real_end_time+sleep_duration
+                    if (ring.current_record.sleep.real_end_time - ring.current_record.sleep.real_start_time < 24 * 3600 * 1000) {
+                        var startDate = new Date(ring.current_record.sleep.real_start_time)
+                        var endDate = new Date(ring.current_record.sleep.real_end_time)
+                        end = startDate.getHours() * 60 + startDate.getMinutes()
+                        start = endDate.getHours() * 60 + endDate.getMinutes()
+                    }
+                    else {
+                        var startDate = new Date(ring.current_record.sleep.real_end_time)
+                        var durationTemp = end - start//ring.current_record.sleep.target_end_time-ring.current_record.sleep.target_start_time
+                        if (durationTemp < 0) {
+                            durationTemp += 24 * 60
+                        }
+                        var endDate = new Date(startDate.getTime() + durationTemp * 60 * 1000)
+                        start = startDate.getHours() * 60 + startDate.getMinutes()
+                        end = endDate.getHours() * 60 + endDate.getMinutes()
+                    }
+                }
+            }
+
+        }
+        if (end < start) {
+            end += 24 * 60
+        }
+        var duration = end - start
+        realRingBig.startArc = (start * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
+        realRingBig.durationArc = (duration * 60) / (24 * 3600) * 2 * Math.PI;
+
+        var currentDot = getDot(null, false)
+        var date = new Date()
+        var minutes = date.getHours() * 60 + date.getMinutes()
+        if (minutes < start) {
+            minutes += 1440
+        }
+
+        currentDot.color = ColorType.activity
+
+
+        var now = new Date()
+        var t = now.getHours() * 60 + now.getMinutes()
+        var duration2 = t - start
+        if (duration2 < 0) {
+            duration2 += 24 * 60
+        }
+        let realRing: RealRing = {
+            color: ColorType.activity,
+            startArc: (start * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0,
+            durationArc: (duration2 * 60) / (24 * 3600) * 2 * Math.PI
+        }
+
+        if (!user.isLogin) {
+            currentDot = null
+            realRing = null
+        }
+
+        if (ring.current_record.status == 'ONGOING2') {
+            realRing = null
+        }
+
+        return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} realRing={duration2 <= duration ? realRing : null} currentDot={currentDot} canvasId={'pop_day_small'} />
+    }
+    function dayRing() {
+        var common = getCommon(null, true)
+        common.radius = thirdRingRadius;
+        common.lineWidth = ringWidth;
+        var bgRing = getBgRing()
+
+        const realRingBig: RealRing = {
+            color: ColorType.day + '66',
+            startArc: 0,
+            durationArc: 2
+        }
+
+        if (authInfo && authInfo.day_completed && new Date().getTime() > authInfo.day_completed.sunset_ts) {
+            realRingBig.color = ColorType.day
+            var duration = (authInfo.day_completed.sunset_ts - authInfo.day_completed.sunrise_ts) / 1000
+            // var start = new Date(authInfo.day_completed.sunrise_ts)
+            // var start = new Date(authInfo.night_completed.sunset_ts)
+            var newT = TimeFormatter.transferTimestamp(authInfo.day_completed.sunrise_ts,authInfo.timezone)
+            var start = new Date(newT)
+            realRingBig.startArc = (start.getHours() * 3600 + start.getMinutes() * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
+            realRingBig.durationArc = (duration) / (24 * 3600) * 2 * Math.PI;
+            return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} canvasId={'ddddsss_day1111' + 'index_day'} />
+
+        }
+
+
+        var sunRise = 6 * 60
+        var sunSet = 18 * 60
+
+        var sunRiseObj = day.dayRingSunrise
+        var sunSetObj = day.dayRingSunset
+        sunRise = parseInt(sunRiseObj.split(':')[0]) * 60 + parseInt(sunRiseObj.split(':')[1])
+        sunSet = parseInt(sunSetObj.split(':')[0]) * 60 + parseInt(sunSetObj.split(':')[1])
+
+
+        var duration = sunSet - sunRise
+
+        realRingBig.startArc = (sunRise * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
+        realRingBig.durationArc = (duration * 60) / (24 * 3600) * 2 * Math.PI;
+
+        var currentDot = getDot(null, false)
+        var date = new Date()
+        var minutes = date.getHours() * 60 + date.getMinutes()
+        if (minutes < sunRise) {
+            minutes += 1440
+        }
+
+        currentDot.color = ColorType.day
+
+
+        var now = new Date()
+        var t = now.getHours() * 60 + now.getMinutes()
+        var duration2 = t - sunRise
+        if (duration2 < 0) {
+            duration2 += 24 * 60
+        }
+        var realRing: RealRing = {
+            color: ColorType.day,
+            startArc: (sunRise * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0,
+            durationArc: (duration2 * 60) / (24 * 3600) * 2 * Math.PI
+        }
+        if (day.dayRingDate) {
+            if (new Date(day.dayRingDate).getDate() != new Date().getDate()) {
+                realRing = null;
+            }
+        }
+
+        if (!user.isLogin) {
+            currentDot = null
+            realRing = null
+        }
+
+        return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} realRing={duration2 <= duration ? realRing : null} currentDot={currentDot} canvasId={'day111_day2'} />
+    }
+
+
+    function rings() {
+        return <View style={{
+            position: 'relative', zIndex: 1,
+            marginLeft: -6,
+        }}>
+            {
+                bigRing()
+            }
+            {
+                ring.current_record && ring.current_record.scenario == 'FAST_SLEEP' &&
+                <View style={{ display: 'flex', position: 'absolute', left: 0, right: 0, top: 0, bottom: 0, alignItems: 'center', justifyContent: 'center' }}>
+                    {
+                        smallRing()
+                    }
+                </View>
+            }
+            {
+                <View style={{ display: 'flex', position: 'absolute', left: -14, top: -14, right: -14, bottom: -14 }}>
+                    {
+                        dayRing()
+                    }
+                </View>
+            }
+
+        </View>
+    }
+
+    function dayDuration() {
+        if (authInfo && authInfo.day_completed && new Date().getTime() > authInfo.day_completed.sunset_ts) {
+            return TimeFormatter.durationFormate(authInfo.day_completed.sunrise_ts, authInfo.day_completed.sunset_ts)
+        }
+
+
+        var now = new Date()
+        var sunriseDate = day.sunriseDate
+        if (sunriseDate) {
+            if (now.getTime() > sunriseDate.getTime()) {
+                return TimeFormatter.countdown(sunriseDate.getTime())
+            }
+        }
+
+
+        var sunRiseObj = day.dayRingSunrise
+        var sunSetObj = day.dayRingSunset
+        var sunRise = parseInt(sunRiseObj.split(':')[0]) * 60 + parseInt(sunRiseObj.split(':')[1])
+        var sunSet = parseInt(sunSetObj.split(':')[0]) * 60 + parseInt(sunSetObj.split(':')[1])
+        if (sunSetObj.indexOf('PM') != -1) {
+            sunSet += 12 * 60
+        }
+
+        var duration = (sunSet - sunRise) * 60 * 1000
+
+        return TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + duration);
+        // var sunRiseObj = day.dayRingSunrise
+        // var sunSetObj = day.dayRingSunset
+        // var sunRise = parseInt(sunRiseObj.split(':')[0]) * 60 + parseInt(sunRiseObj.split(':')[1])
+        // var sunSet = parseInt(sunSetObj.split(':')[0]) * 60 + parseInt(sunSetObj.split(':')[1])
+        // if (sunSetObj.indexOf('PM') != -1) {
+        //     sunSet += 12 * 60
+        // }
+
+        // var duration = (sunSet - sunRise) * 60 * 1000
+
+        // return TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + duration);
+    }
+
+    function eatDuration() {
+        var list = getFoodTime()
+        var start = parseInt(list[0].split(':')[0]) * 60 + parseInt(list[0].split(':')[1])
+        var end = parseInt(list[1].split(':')[0]) * 60 + parseInt(list[1].split(':')[1])
+        if (ring.current_record && ring.current_record.status != 'WAIT_FOR_START' && ring.current_record.scenario != 'SLEEP') {
+            var startDate = new Date(ring.current_record.fast.target_start_time)
+            var endDate = new Date(ring.current_record.fast.target_end_time)
+            end = startDate.getHours() * 60 + startDate.getMinutes()
+            start = endDate.getHours() * 60 + endDate.getMinutes()
+        }
+        if (end < start) {
+            end += 24 * 60
+        }
+        var duration = (end - start) * 60 * 1000
+        return TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + duration);
+    }
+
+    function activityDuration() {
+        var list = getActivityTime()
+        var start = parseInt(list[0].split(':')[0]) * 3600 + parseInt(list[0].split(':')[1]) * 60
+        var end = parseInt(list[1].split(':')[0]) * 3600 + parseInt(list[1].split(':')[1]) * 60
+        if (ring.current_record) {
+            if (ring.current_record.scenario == 'SLEEP') {
+                if (ring.current_record.status == 'ONGOING') {
+                    var startDate = new Date(ring.current_record.sleep.target_start_time)
+                    var endDate = new Date(ring.current_record.sleep.target_end_time)
+                    end = startDate.getHours() * 3600 + startDate.getMinutes() * 60 + startDate.getSeconds()
+                    start = endDate.getHours() * 3600 + endDate.getMinutes() * 60 + endDate.getSeconds()
+                }
+            }
+            else {
+                if (ring.current_record.status == 'ONGOING2') {
+                    var startDate = new Date(ring.current_record.sleep.target_start_time)
+                    var endDate = new Date(ring.current_record.sleep.target_end_time)
+                    end = startDate.getHours() * 3600 + startDate.getMinutes() * 60 + startDate.getSeconds()
+                    start = endDate.getHours() * 3600 + endDate.getMinutes() * 60 + endDate.getSeconds()
+                }
+                else if (ring.current_record.status == 'ONGOING3') {
+                    //睡眠已完成时，睡眠小于24小时，使用真实的real_end_time-real_start_time
+                    //大于24小时，使用real_end_time+sleep_duration
+                    if (ring.current_record.sleep.real_end_time - ring.current_record.sleep.real_start_time < 24 * 3600 * 1000) {
+                        var startDate = new Date(ring.current_record.sleep.real_start_time)
+                        var endDate = new Date(ring.current_record.sleep.real_end_time)
+                        end = startDate.getHours() * 3600 + startDate.getMinutes() * 60 + startDate.getSeconds()
+                        start = endDate.getHours() * 3600 + endDate.getMinutes() * 60 + endDate.getSeconds()
+                    }
+                    else {
+                        var startDate = new Date(ring.current_record.sleep.real_end_time)
+                        var durationTemp = start - end//ring.current_record.sleep.target_end_time-ring.current_record.sleep.target_start_time
+
+                        if (durationTemp < 0) {
+                            durationTemp += 24 * 3600
+                        }
+                        var endDate = new Date(startDate.getTime() + durationTemp * 1000)
+                        end = startDate.getHours() * 3600 + startDate.getMinutes() * 60 + startDate.getSeconds()
+                        start = endDate.getHours() * 3600 + endDate.getMinutes() * 60 + endDate.getSeconds()
+                        debugger
+                        console.log('active', end, start, durationTemp)
+                    }
+                }
+            }
+
+        }
+        if (end < start) {
+            end += 24 * 3600
+        }
+        var duration = (end - start) * 1000
+        return TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + duration);
+    }
+
+    function popDetail() {
+        return <Box>
+            <View className="ring_full_container">
+                <View className="time_operate_item1">
+                    <View className='fast_sleep_item three_ring_card_detail'>
+                        {
+                            rings()
+                        }
+                        <View className="duration_bg3"
+                            style={{ marginLeft: rpxToPx(68), height: bigRingRadius * 2, overflow: 'visible' }}>
+                            <Text className="duration_title2">{t('feature.common.day')}</Text>
+                            <Text className="duration_value2" style={{ color: ColorType.day }}>{dayDuration()}</Text>
+
+                            {
+                                ring.current_record && ring.current_record.scenario != 'SLEEP' && <Text className="duration_title2">进食</Text>
+                            }
+                            {
+                                ring.current_record && ring.current_record.scenario != 'SLEEP' && <Text className="duration_value2" style={{ color: ColorType.food }}>{eatDuration()}</Text>
+                            }
+                            {
+                                ring.current_record && ring.current_record.scenario != 'FAST' && <Text className="duration_title2">活动</Text>
+                            }
+                            {
+                                ring.current_record && ring.current_record.scenario != 'FAST' && <Text className="duration_value2" style={{ color: ColorType.activity, marginBottom: 0 }}>{activityDuration()}</Text>
+                            }
+                        </View>
+
+
+                    </View>
+                </View>
+            </View>
+        </Box>
+    }
+
+    function modalContent() {
+        if (process.env.TARO_ENV == 'weapp') {
+            return <Modal
+                testInfo={null}
+                dismiss={() => {
+                    setShowRing(false)
+                }}
+                confirm={() => { }}>
+                {popDetail()}
+            </Modal>
+        }
+        else if (process.env.TARO_ENV == 'rn') {
+            return <PageContainer style={{ backgroundColor: '#1c1c1c' }}
+                // overlayStyle='background-color:rgba(0,0,0,0.9)'
+                // custom-style='background-color:#1c1c1c'
+                overlayStyle={{ backgroundColor: 'rgba(0,0,0,0.9)' }}
+                customStyle={{ backgroundColor: '#1c1c1c' }}
+                closeOnSlideDown={false}
+                onBeforeEnter={() => {
+
+                }}
+                onBeforeLeave={() => {
+                }}
+                onClick={() => { alert('b') }}
+                onClickOverlay={() => { alert('a') }}
+                onAfterLeave={() => { setShowRing(false) }}
+                show={showRing} round={true} overlay={true} position='bottom'
+            >
+                {popDetail()}
+            </PageContainer>
+        }
+    }
+
+    return <Box onClick={tapShow}>
+        <View style={{ color: '#fff' }}>显示同步生物钟</View>
+        {
+            showRing && modalContent()
+        }
+    </Box>
+}

src/features/trackTimeDuration/components/AllRings.scss

@@ -0,0 +1,10 @@
+.fast_sleep_item {
+    // display: 'flex',position:'relative', flex-: 'row', alignItems: 'center'
+    display: flex;
+    position: relative;
+    flex-direction: row;
+    align-items: center;
+    width: 578px;
+    // padding-top: 20px;
+    // padding-bottom: 20px;
+}

src/features/trackTimeDuration/components/AllRings.tsx

@@ -12,11 +12,13 @@ import { TimeFormatter } from '@/utils/time_format'
 import { useSelector } from 'react-redux'
 import { RealRing } from '@/features/trackTimeDuration/components/Rings'
 
+
 export default function AllRings(props: { data?: any, time?: any }) {
     const [showRing, setShowRing] = useState(false)
     const [record, setRecord] = useState(props.data.current_record);
     const user = useSelector((state: any) => state.user);
-    const dayNight = useSelector((state: any) => state.night);
+    const nightStore = useSelector((state: any) => state.night);
+    const [authInfo, setAuthInfo] = useState(global.locationDetail ? global.locationDetail : null)
     const { t } = useTranslation()
 
     function tapShow() {
@@ -199,11 +201,25 @@ export default function AllRings(props: { data?: any, time?: any }) {
             startArc: 0,
             durationArc: 2
         }
+
+
+        if (authInfo && authInfo.night_completed && new Date().getTime() > authInfo.night_completed.sunrise_ts) {
+            realRingBig.color = ColorType.night
+            var duration = (authInfo.night_completed.sunrise_ts - authInfo.night_completed.sunset_ts) / 1000
+            // var start = new Date(authInfo.night_completed.sunset_ts)
+            var newT = TimeFormatter.transferTimestamp(authInfo.night_completed.sunset_ts, authInfo.timezone)
+            var start = new Date(newT)
+            realRingBig.startArc = (start.getHours() * 3600 + start.getMinutes() * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
+            realRingBig.durationArc = (duration) / (24 * 3600) * 2 * Math.PI;
+            return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} canvasId={'allday' + 'index_day'} />
+
+        }
+
         var sunRise = 24 * 60 + 6 * 60
         var sunSet = 18 * 60
 
-        var sunRiseObj = dayNight.nightRingSunrise
-        var sunSetObj = dayNight.nightRingSunset
+        var sunRiseObj = nightStore.nightRingSunrise
+        var sunSetObj = nightStore.nightRingSunset
         sunRise = 24 * 60 + parseInt(sunRiseObj.split(':')[0]) * 60 + parseInt(sunRiseObj.split(':')[1])
         sunSet = parseInt(sunSetObj.split(':')[0]) * 60 + parseInt(sunSetObj.split(':')[1])
         if (sunSetObj.indexOf('PM') != -1) {
@@ -214,7 +230,7 @@ export default function AllRings(props: { data?: any, time?: any }) {
         realRingBig.startArc = (sunSet * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
         realRingBig.durationArc = (duration * 60) / (24 * 3600) * 2 * Math.PI;
 
-        var currentDot = getDot(record, false)
+        var currentDot = getDot(null, false)
         currentDot.color = ColorType.night
 
         var now = new Date()
@@ -229,8 +245,8 @@ export default function AllRings(props: { data?: any, time?: any }) {
             durationArc: (duration2 * 60) / (24 * 3600) * 2 * Math.PI
         }
 
-        if (dayNight.nightRingDate) {
-            if (new Date(dayNight.nightRingDate).getDate() == new Date().getDate() && new Date().getHours() < 12) {
+        if (nightStore.nightRingDate) {
+            if (new Date(nightStore.nightRingDate).getDate() == new Date().getDate() && new Date().getHours() < 12) {
 
                 realRing = null;
             }
@@ -242,7 +258,8 @@ export default function AllRings(props: { data?: any, time?: any }) {
         }
 
 
-        return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} realRing={duration2 > duration ? null : realRing} currentDot={currentDot} canvasId={'full_index_day'} />
+        return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} realRing={duration2 > duration ? null : realRing} currentDot={currentDot} canvasId={'all_night' + 'index_day'} />
+
     }
 
     function rings() {
@@ -312,9 +329,22 @@ export default function AllRings(props: { data?: any, time?: any }) {
     }
 
     function nightDuration() {
+        if (authInfo && authInfo.night_completed && new Date().getTime() > authInfo.night_completed.sunrise_ts) {
+            return TimeFormatter.durationFormate(authInfo.night_completed.sunrise_ts, authInfo.night_completed.sunset_ts)
+        }
 
-        var sunRiseObj = dayNight.nightRingSunrise
-        var sunSetObj = dayNight.nightRingSunset
+        var now = new Date()
+        var sunsetDate = nightStore.sunsetDate
+        if (sunsetDate) {
+            if (now.getTime() > sunsetDate.getTime()) {
+                return TimeFormatter.countdown(sunsetDate.getTime())
+            }
+            // return TimeFormatter.countdown(sunsetDate.getTime())
+        }
+
+
+        var sunRiseObj = nightStore.nightRingSunrise
+        var sunSetObj = nightStore.nightRingSunset
         var sunRise = 24 * 60 + parseInt(sunRiseObj.split(':')[0]) * 60 + parseInt(sunRiseObj.split(':')[1])
         var sunSet = parseInt(sunSetObj.split(':')[0]) * 60 + parseInt(sunSetObj.split(':')[1])
         if (sunSetObj.indexOf('PM') != -1) {
@@ -324,6 +354,18 @@ export default function AllRings(props: { data?: any, time?: any }) {
         var duration = (sunRise - sunSet) * 60 * 1000
 
         return TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + duration);
+
+        // var sunRiseObj = nightStore.nightRingSunrise
+        // var sunSetObj = nightStore.nightRingSunset
+        // var sunRise = 24 * 60 + parseInt(sunRiseObj.split(':')[0]) * 60 + parseInt(sunRiseObj.split(':')[1])
+        // var sunSet = parseInt(sunSetObj.split(':')[0]) * 60 + parseInt(sunSetObj.split(':')[1])
+        // if (sunSetObj.indexOf('PM') != -1) {
+        //     sunSet += 12 * 60
+        // }
+
+        // var duration = (sunRise - sunSet) * 60 * 1000
+
+        // return TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + duration);
     }
 
 

src/features/trackTimeDuration/components/DayNightCard.tsx

@@ -253,6 +253,7 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
                     setSunriseTmrTime(data.daylights[1].sunrise)
                     setSunsetDate(yesterdayDate)
                     setSunriseTmrDate(todaySunriseDate)
+        
 
                 }
                 else {
@@ -260,6 +261,8 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
                     setSunsetTime(data.daylights[1].sunset)
                     setSunriseDate(todaySunriseDate)
                     setSunsetDate(todaySunsetDate)
+
+
                 }
                 updateNightStore(yesterdayDate, data.daylights[1].sunrise, data.daylights[0].sunset)
                 updateDayStore(today, data.daylights[1].sunrise, data.daylights[1].sunset)
@@ -273,12 +276,14 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
                     setSunriseTmrTime(data.daylights[2].sunrise)
                     setSunsetDate(todaySunsetDate)
                     setSunriseTmrDate(tomorrowSunriseDate)
+      
                 }
                 else {
                     setSunriseTime(data.daylights[1].sunrise)
                     setSunsetTime(data.daylights[1].sunset)
                     setSunsetDate(todaySunsetDate)
                     setSunriseDate(todaySunriseDate)
+   
                 }
                 updateNightStore(today, data.daylights[2].sunrise, data.daylights[1].sunset)
                 updateDayStore(today, data.daylights[1].sunrise, data.daylights[1].sunset)
@@ -292,14 +297,16 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
                     setSunriseTmrTime(data.daylights[2].sunrise)
                     setSunsetDate(todaySunsetDate)
                     setSunriseTmrDate(tomorrowSunriseDate)
+        
                 }
                 else {
                     setSunriseTime(data.daylights[2].sunrise)
                     setSunsetTime(data.daylights[2].sunset)
                     setSunriseDate(tomorrowSunriseDate)
                     setSunsetDate(tomorrowSunsetDate)
+    
                 }
-                updateNightStore(today, data.daylights[2].sunrise, data.daylights[1].sunset)
+                updateNightStore(todaySunsetDate, data.daylights[2].sunrise, data.daylights[1].sunset)
                 updateDayStore(tomorrowSunriseDate, data.daylights[2].sunrise, data.daylights[2].sunset)
             }
         }
@@ -313,12 +320,13 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
 
 
             dispatch(setDayRingData({
-                date: new Date().getTime(),
+                date: sunriseDate,
                 sunrise: '06:00',
                 sunset: '18:00'
             }))
+            debugger
             dispatch(setNightRingData({
-                date: new Date().getTime(),
+                date: sunsetDate,
                 sunrise: '06:00',
                 sunset: '18:00'
             }))
@@ -372,9 +380,9 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
             jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
             return
         }
-        if (!dayStore.showDayRing) {
-            return
-        }
+        // if (!dayStore.showDayRing) {
+        //     return
+        // }
         setShowDetailPopup(true)
     }
 
@@ -683,6 +691,7 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
                     authInfo={authInfo}
                     nightDate={nightDate}
                     dayDate={dayDate}
+                    updateLocation={auth}
                     onClose={() => { setShowDetailPopup(false) }}
                 />
             </Modal>
@@ -715,6 +724,7 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
                     authInfo={authInfo}
                     nightDate={nightDate}
                     dayDate={dayDate}
+                    updateLocation={auth}
                     onClose={() => { setShowDetailPopup(false) }}
                 />
             </PageContainer>
@@ -793,24 +803,26 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
         if (process.env.TARO_ENV == 'weapp') {
             e.stopPropagation()
         }
-        if (isMember && authInfo && authInfo.lat) {
-            tapCard(e)
-            return
-        }
-        Taro.showModal({
-            title: props.isNight ? t('feature.day_night.alert_required_night') : t('feature.day_night.alert_required_day'),
-            content: props.isNight ? t('feature.day_night.alert_night_content') : t('feature.day_night.alert_day_content'),
-            confirmText: t('feature.day_night.choose_location'),
-            cancelText: t('feature.day_night.view_more'),
-            success: function (res) {
-                if (res.confirm) {
-                    auth()
-                    // console.log('用户点击确定')
-                } else if (res.cancel) {
-                    setShowDetailPopup(true)
-                }
-            }
-        })
+        tapCard(e)
+        // if (isMember && authInfo && authInfo.lat) {
+        //     tapCard(e)
+        //     return
+        // }
+        // setShowDetailPopup(true)
+        // Taro.showModal({
+        //     title: props.isNight ? t('feature.day_night.alert_required_night') : t('feature.day_night.alert_required_day'),
+        //     content: props.isNight ? t('feature.day_night.alert_night_content') : t('feature.day_night.alert_day_content'),
+        //     confirmText: t('feature.day_night.choose_location'),
+        //     cancelText: t('feature.day_night.view_more'),
+        //     success: function (res) {
+        //         if (res.confirm) {
+        //             auth()
+        //             // console.log('用户点击确定')
+        //         } else if (res.cancel) {
+        //             setShowDetailPopup(true)
+        //         }
+        //     }
+        // })
     }
 
     function tapShow() {
@@ -946,13 +958,14 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
         if (authInfo && authInfo.night_completed && new Date().getTime() > authInfo.night_completed.sunrise_ts) {
             realRingBig.color = ColorType.night
             var duration = (authInfo.night_completed.sunrise_ts - authInfo.night_completed.sunset_ts) / 1000
-            var start = new Date(authInfo.night_completed.sunset_ts)
+            // var start = new Date(authInfo.night_completed.sunset_ts)
+            var newT = TimeFormatter.transferTimestamp(authInfo.night_completed.sunset_ts,authInfo.timezone)
+            var start = new Date(newT)
             realRingBig.startArc = (start.getHours() * 3600 + start.getMinutes() * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
             realRingBig.durationArc = (duration) / (24 * 3600) * 2 * Math.PI;
             return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} canvasId={'ddddsss' + 'index_day'} />
 
         }
-        debugger
 
         var sunRise = 24 * 60 + 6 * 60
         var sunSet = 18 * 60
@@ -1016,7 +1029,10 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
         if (authInfo && authInfo.day_completed && new Date().getTime() > authInfo.day_completed.sunset_ts) {
             realRingBig.color = ColorType.day
             var duration = (authInfo.day_completed.sunset_ts - authInfo.day_completed.sunrise_ts) / 1000
-            var start = new Date(authInfo.day_completed.sunrise_ts)
+            // var start = new Date(authInfo.day_completed.sunrise_ts)
+            // var start = new Date(authInfo.night_completed.sunset_ts)
+            var newT = TimeFormatter.transferTimestamp(authInfo.day_completed.sunrise_ts,authInfo.timezone)
+            var start = new Date(newT)
             realRingBig.startArc = (start.getHours() * 3600 + start.getMinutes() * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
             realRingBig.durationArc = (duration) / (24 * 3600) * 2 * Math.PI;
             return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} canvasId={'ddddsss_day' + 'index_day'} />
@@ -1126,6 +1142,7 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
         }
 
         var now = new Date()
+        debugger
         if (!props.isNight && sunriseDate) {
             if (now.getTime() > sunriseDate.getTime()) {
                 return TimeFormatter.countdown(sunriseDate.getTime())
@@ -1220,13 +1237,7 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
 
     return <Box><View style={{ position: 'relative' }}>
         {
-            !user.isLogin && <View style={{ color: '#fff' }} onClick={tapShow}>{props.isNight ? '显示当地夜晚时间' : '显示当地白天时间'}</View>
-        }
-        {
-            user.isLogin && !dayStore.showDayRing && <View style={{ color: '#fff' }} onClick={auth}>{props.isNight ? '显示当地夜晚时间' : '显示当地白天时间'}</View>
-        }
-        {
-            user.isLogin && dayStore.showDayRing && <View style={{ display: 'flex', flexDirection: 'column', zIndex: 1 }} onClick={showLocationAlert} onLongPress={longClick}>
+            <View style={{ display: 'flex', flexDirection: 'column', zIndex: 1 }} onClick={showLocationAlert} onLongPress={longClick}>
 
                 <View className="ring_full_container" style={{ paddingBottom: 0 }}>
 
@@ -1284,21 +1295,6 @@ export default function DayNightCard(props: { isNight: boolean, count: number })
                         </View>
                     </View>
                 </View>
-                {/* <View style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', marginTop: rpxToPx(36) }}>
-
-                    {
-                        authInfo && authInfo.lat ?
-                            <View style={{ display: 'flex', flexDirection: 'row' }} onClick={operate}>
-                                <View className={props.isNight ? 'night_location_btn' : 'day_location_btn'}>{getLocation()}</View>
-                            </View>
-                            :
-                            <View style={{ display: 'flex', flexDirection: 'row' }} onClick={operate}>
-                                <View className={props.isNight ? 'night_location_btn' : 'day_location_btn'} >
-                                    {props.isNight ? t('feature.day_night.get_local_time') : t('feature.day_night.get_local_time_sunrise')}
-                                </View>
-                            </View>
-                    }
-                </View> */}
             </View>
         }
         {

src/features/trackTimeDuration/components/DayNightCard_副本2.tsx

@@ -0,0 +1,1311 @@
+import { PageContainer, Switch, Text, View, Image } from '@tarojs/components'
+import './DayNightCard.scss'
+import { ColorType } from '@/context/themes/color'
+import { useEffect, useState } from 'react'
+import Box from '@/components/layout/Box'
+import Taro, { useDidShow } from '@tarojs/taro'
+import { clearLocation, getPerm, latestLocation, uploadPerm } from '@/services/user'
+import { useDispatch, useSelector } from 'react-redux'
+import { useTranslation } from 'react-i18next'
+import { TimeFormatter } from '@/utils/time_format'
+import { systemLocation } from '@/services/common'
+import { setDayRingData, showDay } from '@/store/day'
+import { setNightRingData, showNight, updateMember } from '@/store/night'
+import Modal from '@/components/layout/Modal.weapp'
+import { rpxToPx } from '@/utils/tools'
+import { jumpPage } from '@/features/trackTimeDuration/hooks/Common'
+import DayNightDetailPopup from './DayNightDetailPopup'
+import { RealRing, CurrentDot } from "@/features/trackTimeDuration/components/Rings";
+import Rings from "./Rings";
+import { bigRingRadius, getBgRing, getCommon, getDot, ringWidth } from '../hooks/RingData'
+import '@/utils/ring_card.scss';
+import { IconNight, IconSunrise, IconSunset } from '@/components/basic/Icons'
+
+let useNavigation;
+if (process.env.TARO_ENV == 'rn') {
+    useNavigation = require("@react-navigation/native").useNavigation
+}
+
+let locationDetail;
+
+let sunriseA = new Date()
+sunriseA.setHours(6)
+sunriseA.setMinutes(0)
+sunriseA.setSeconds(0)
+sunriseA.setMilliseconds(0)
+const sunsetA = new Date()
+sunsetA.setHours(18)
+sunsetA.setMinutes(0)
+sunsetA.setSeconds(0)
+sunsetA.setMilliseconds(0)
+
+const sunriseB = new Date()
+sunriseB.setHours(6)
+sunriseB.setMinutes(0)
+sunriseB.setSeconds(0)
+sunriseB.setMilliseconds(0)
+
+let lastDayInfo: any = null;
+let lastNightInfo: any = null;
+let joingMember = false
+export default function DayNightCard(props: { isNight: boolean, count: number }) {
+    const user = useSelector((state: any) => state.user);
+    const dayStore = useSelector((state: any) => state.day);
+    const nightStore = useSelector((state: any) => state.night);
+    const [authInfo, setAuthInfo] = useState(global.locationDetail ? global.locationDetail : null)
+    const [sunriseTime, setSunriseTime] = useState('06:00')
+    const [sunriseTmrTime, setSunriseTmrTime] = useState('06:00')
+    const [sunsetTime, setSunsetTime] = useState('18:00')
+
+    const [sunriseDate, setSunriseDate] = useState<any>(sunriseA)
+    const [sunriseTmrDate, setSunriseTmrDate] = useState<any>(new Date(sunriseB.getTime() + 24 * 3600 * 1000))
+    const [sunsetDate, setSunsetDate] = useState<any>(sunsetA)
+    const [status,setStatus] = useState('')
+
+
+    const [showDetailModal, setShowDetailModal] = useState(false)
+    const [showDetailPopup, setShowDetailPopup] = useState(false)
+    const [detail, setDetail] = useState(null)
+    // const [locationDetail, setLocationDetail] = useState(null)
+
+    const [nightDate, setNightDate] = useState(new Date())
+    const [dayDate, setDayDate] = useState(new Date())
+    const dispatch = useDispatch();
+    const { t } = useTranslation()
+    const isMember = true;
+    let navigation;
+    if (useNavigation) {
+        navigation = useNavigation()
+    }
+
+    useEffect(() => {
+
+
+        if (user.isLogin) {
+            if (global.locationDetail) {
+                locationDetail = global.locationDetail
+                setAuthInfo(locationDetail)
+            }
+
+            getLatestLocation()
+
+            if (props.isNight) {
+                global.refreshNight = () => {
+                    getLatestLocation()
+                }
+            }
+            else {
+                global.refreshDay = () => {
+                    getLatestLocation()
+                }
+            }
+
+        } else {
+            setSunriseTime('06:00');
+            setSunriseTmrTime('06:00')
+            setSunsetTime('18:00')
+            setSunriseDate(sunriseA)
+            setSunriseTmrDate(new Date(sunriseB.getTime() + 24 * 3600 * 1000))
+            setSunsetDate(sunsetA)
+        }
+    }, [user.isLogin])
+
+    useEffect(() => {
+        locationDetail = global.locationDetail
+        setAuthInfo(locationDetail)
+    }, [global.locationDetail])
+
+    useEffect(() => {
+        if (locationDetail)
+            updateDate(locationDetail)
+        if (props.isNight) {
+            global.clearNightLocation = () => {
+                clearCacheData()
+            }
+        }
+        else {
+            global.clearDayLocation = () => {
+                clearCacheData()
+            }
+        }
+    }, [])
+
+    useEffect(() => {
+        if (locationDetail) {
+            var detail: any = locationDetail
+            var now = new Date()
+            if (now.getHours() == 0 && now.getMinutes() == 0 && now.getSeconds() == 0) {
+                detail.daylights.splice(0, 1)
+            }
+            locationDetail = detail
+
+            // setLocationDetail(detail)
+            updateDate(detail)
+        }
+    }, [props.count])
+
+    useEffect(() => {
+        // if (user.test_user && joingMember) {
+        //     auth()
+        // }
+        if (!isMember) {
+            lastNightInfo = null
+            lastDayInfo = null
+            locationDetail = null
+            setAuthInfo(null)
+            setSunriseTime('06:00')
+            setSunriseTmrTime('06:00')
+            setSunsetTime('18:00')
+            dispatch(updateMember({ isMember: isMember, gpsInfo: null }))
+
+
+            dispatch(setDayRingData({
+                date: new Date().getTime(),
+                sunrise: '06:00',
+                sunset: '18:00'
+            }))
+            dispatch(setNightRingData({
+                date: new Date().getTime(),
+                sunrise: '06:00',
+                sunset: '18:00'
+            }))
+        }
+        else {
+            getGPSCache()
+        }
+    }, [user.test_user])
+
+    useDidShow(() => {
+        if (!user.isLogin) {
+            dispatch(showNight(false))
+            dispatch(showDay(false))
+            Taro.setStorage({
+                key: 'showNightRing',
+                data: false
+            })
+            Taro.setStorage({
+                key: 'showDayRing',
+                data: false
+            })
+        }
+    })
+
+    function getLatestLocation() {
+        var today = new Date()
+        var yesterday = new Date(today.getTime() - 24 * 3600 * 1000)
+        var tomorrow = new Date(today.getTime() + 24 * 3600 * 1000 * 3)
+        var strYesterday = `${yesterday.getFullYear()}-${TimeFormatter.padZero(yesterday.getMonth() + 1)}-${TimeFormatter.padZero(yesterday.getDate())}`
+        var strTomorrow = `${tomorrow.getFullYear()}-${TimeFormatter.padZero(tomorrow.getMonth() + 1)}-${TimeFormatter.padZero(tomorrow.getDate())}`
+        latestLocation({
+            date_start: strYesterday, date_end: strTomorrow
+        }).then(data => {
+            console.log(data)
+            setAuthInfo(data as any)
+            setDetail(data as any)
+            updateDate(data)
+            locationDetail = data
+            global.locationDetail = locationDetail
+            Taro.setStorage({
+                key: 'gps',
+                data: JSON.stringify(data as any)
+            })
+        })
+    }
+
+    async function getGPSCache() {
+        var gps = await getStorage('gps')
+        if (gps && gps.length > 0) {
+            locationDetail = JSON.parse(gps)
+            global.locationDetail = JSON.parse(gps)
+        }
+    }
+
+    async function getStorage(key: string) {
+        try {
+            const res = await Taro.getStorage({ key });
+            return res.data;
+        } catch {
+            return '';
+        }
+    }
+
+    function updateDate(data) {
+
+        var today = new Date()
+        // var yesterday = new Date(today.getTime() - 24 * 3600 * 1000)
+        var tomorrow = new Date(today.getTime() + 24 * 3600 * 1000)
+        // var strYesterday = `${yesterday.getFullYear()}-${TimeFormatter.padZero(yesterday.getMonth() + 1)}-${TimeFormatter.padZero(yesterday.getDate())}`
+        // var strTomorrow = `${tomorrow.getFullYear()}-${TimeFormatter.padZero(tomorrow.getMonth() + 1)}-${TimeFormatter.padZero(tomorrow.getDate())}`
+        if (isMember && data && data.daylights && data.daylights.length > 0) {
+            var yesterdayDate = new Date(data.daylights[0].date + 'T' + data.daylights[0].sunset)
+            var todaySunriseDate = new Date(data.daylights[1].date + 'T' + data.daylights[1].sunrise)
+            var todaySunsetDate = new Date(data.daylights[1].date + 'T' + data.daylights[1].sunset)
+            var tomorrowSunriseDate = new Date(data.daylights[2].date + 'T' + data.daylights[2].sunrise)
+            var tomorrowSunsetDate = new Date(data.daylights[2].date + 'T' + data.daylights[2].sunset)
+
+            // var tomorrowSunsetDate = new Date(data.daylights[2].date + 'T' + data.daylights[2].sunset)
+            //今天凌晨日出前
+            if (yesterdayDate.getTime() < today.getTime() && today.getTime() < todaySunriseDate.getTime()) {
+                setNightDate(yesterdayDate)
+                setDayDate(today)
+                if (props.isNight) {
+                    setSunsetTime(data.daylights[0].sunset)
+                    setSunriseTmrTime(data.daylights[1].sunrise)
+                    setSunsetDate(yesterdayDate)
+                    setSunriseTmrDate(todaySunriseDate)
+
+                }
+                else {
+                    setSunriseTime(data.daylights[1].sunrise)
+                    setSunsetTime(data.daylights[1].sunset)
+                    setSunriseDate(todaySunriseDate)
+                    setSunsetDate(todaySunsetDate)
+                }
+                updateNightStore(yesterdayDate, data.daylights[1].sunrise, data.daylights[0].sunset)
+                updateDayStore(today, data.daylights[1].sunrise, data.daylights[1].sunset)
+            }
+            //今天白天（今天出日后-日落前）
+            else if (todaySunriseDate.getTime() < today.getTime() && today.getTime() < todaySunsetDate.getTime()) {
+                setNightDate(todaySunsetDate)
+                setDayDate(todaySunriseDate)
+                if (props.isNight) {
+                    setSunsetTime(data.daylights[1].sunset)
+                    setSunriseTmrTime(data.daylights[2].sunrise)
+                    setSunsetDate(todaySunsetDate)
+                    setSunriseTmrDate(tomorrowSunriseDate)
+                }
+                else {
+                    setSunriseTime(data.daylights[1].sunrise)
+                    setSunsetTime(data.daylights[1].sunset)
+                    setSunsetDate(todaySunsetDate)
+                    setSunriseDate(todaySunriseDate)
+                }
+                updateNightStore(today, data.daylights[2].sunrise, data.daylights[1].sunset)
+                updateDayStore(today, data.daylights[1].sunrise, data.daylights[1].sunset)
+            }
+            //今天夜晚
+            else if (today.getTime() > todaySunsetDate.getTime() && today.getTime() < tomorrowSunriseDate.getTime()) {
+                setNightDate(todaySunsetDate)
+                setDayDate(tomorrowSunriseDate)
+                if (props.isNight) {
+                    setSunsetTime(data.daylights[1].sunset)
+                    setSunriseTmrTime(data.daylights[2].sunrise)
+                    setSunsetDate(todaySunsetDate)
+                    setSunriseTmrDate(tomorrowSunriseDate)
+                }
+                else {
+                    setSunriseTime(data.daylights[2].sunrise)
+                    setSunsetTime(data.daylights[2].sunset)
+                    setSunriseDate(tomorrowSunriseDate)
+                    setSunsetDate(tomorrowSunsetDate)
+                }
+                updateNightStore(today, data.daylights[2].sunrise, data.daylights[1].sunset)
+                updateDayStore(tomorrowSunriseDate, data.daylights[2].sunrise, data.daylights[2].sunset)
+            }
+        }
+        else {
+            locationDetail = null
+            setAuthInfo(null)
+            setSunriseTime('06:00')
+            setSunriseTmrTime('06:00')
+            setSunsetTime('18:00')
+            dispatch(updateMember({ isMember: isMember, gpsInfo: null }))
+
+
+            dispatch(setDayRingData({
+                date: new Date().getTime(),
+                sunrise: '06:00',
+                sunset: '18:00'
+            }))
+            dispatch(setNightRingData({
+                date: new Date().getTime(),
+                sunrise: '06:00',
+                sunset: '18:00'
+            }))
+        }
+
+    }
+
+    function updateNightStore(date, sunrise, sunset) {
+        if (lastNightInfo && lastNightInfo.date.getDate() == new Date(date).getDate() &&
+            lastNightInfo.sunrise == sunrise &&
+            lastNightInfo.sunset == sunset
+        ) {
+            return
+        }
+        lastNightInfo = {
+            date,
+            sunrise,
+            sunset
+        }
+        dispatch(setNightRingData({
+            date: date.getTime(),
+            sunrise: sunrise,
+            sunset: sunset
+        }))
+    }
+
+    function updateDayStore(date, sunrise, sunset) {
+        if (lastDayInfo && lastDayInfo.date.getDate() == new Date(date).getDate() &&
+            lastDayInfo.sunrise == sunrise &&
+            lastDayInfo.sunset == sunset
+        ) {
+            return
+        }
+        lastDayInfo = {
+            date,
+            sunrise,
+            sunset
+        }
+        dispatch(setDayRingData({
+            date: date.getTime(),
+            sunrise: sunrise,
+            sunset: sunset
+        }))
+    }
+
+    function tapCard(e) {
+        // if (process.env.TARO_ENV == 'weapp') {
+        //     e.stopPropagation()
+        // }
+        if (!user.isLogin) {
+            jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
+            return
+        }
+        if (!dayStore.showDayRing) {
+            return
+        }
+        setShowDetailPopup(true)
+    }
+
+    function auth(e?: any) {
+        if (e && process.env.TARO_ENV == 'weapp') {
+            e.stopPropagation()
+        }
+        var today = new Date()
+        var yesterday = new Date(today.getTime() - 24 * 3600 * 1000)
+        var tomorrow = new Date(today.getTime() + 24 * 3600 * 1000 * 3)
+        var strYesterday = `${yesterday.getFullYear()}-${TimeFormatter.padZero(yesterday.getMonth() + 1)}-${TimeFormatter.padZero(yesterday.getDate())}`
+        var strTomorrow = `${tomorrow.getFullYear()}-${TimeFormatter.padZero(tomorrow.getMonth() + 1)}-${TimeFormatter.padZero(tomorrow.getDate())}`
+        // systemLocation({
+        //     lat: 77,
+        //     lng: 20,
+        //     date_start: strYesterday,
+        //     date_end: strTomorrow,
+        //     coordinate_system_standard: 'GCJ-02'
+        // }).then(data => {
+        // })
+        // return
+
+        if (process.env.TARO_ENV == 'rn') {
+            Taro.getLocation({
+                success(res) {
+                    systemLocation({
+                        lat: res.latitude,
+                        lng: res.longitude,
+                        // name: 'app test',
+                        // address: 'app test',
+                        date_start: strYesterday,
+                        date_end: strTomorrow,
+                        // coordinate_system_standard: 'GCJ-02'
+                    }).then(data => {
+                        console.log('get Location', data)
+                        updateDate(data);
+                        locationDetail = data;
+                        global.locationDetail = locationDetail
+                        setAuthInfo(data as any)
+                        setSunriseTime((data as any).daylights[0].sunrise)
+                        setSunriseTmrTime((data as any).daylights[1].sunrise)
+                        setSunsetTime((data as any).daylights[0].sunset)
+                        Taro.setStorage({
+                            key: 'gps',
+                            data: JSON.stringify(data as any)
+                        })
+                        dispatch(updateMember({ isMember: isMember, gpsInfo: (data as any) }))
+                        showRing()
+                    })
+                },
+                fail(res) {
+                    if (res.errMsg == 'Permissions denied!') {
+                        alert('aaa')
+                    }
+                    console.log(res)
+                    showRing()
+                },
+                complete(res) {
+
+                }
+            })
+            return
+        }
+        joingMember = false;
+        Taro.chooseLocation({
+            latitude: authInfo && authInfo.lat ? authInfo.lat : undefined,
+            longitude: authInfo && authInfo.lat ? authInfo.lng : undefined,
+            success: function (res) {
+
+                systemLocation({
+                    lat: res.latitude,
+                    lng: res.longitude,
+                    name: res.name,
+                    address: res.address,
+                    date_start: strYesterday,
+                    date_end: strTomorrow,
+                    coordinate_system_standard: 'GCJ-02'
+                }).then(data => {
+                    updateDate(data);
+                    locationDetail = data;
+                    global.locationDetail = locationDetail
+                    setAuthInfo(data as any)
+                    setDetail(data as any)
+                    setSunriseTime((data as any).daylights[0].sunrise)
+                    setSunriseTmrTime((data as any).daylights[1].sunrise)
+                    setSunsetTime((data as any).daylights[0].sunset)
+                    Taro.setStorage({
+                        key: 'gps',
+                        data: JSON.stringify(data as any)
+                    })
+                    showRing()
+                    dispatch(updateMember({ isMember: isMember, gpsInfo: (data as any) }))
+                })
+
+            },
+            fail(res) {
+                Taro.showToast({
+                    title: '位置修改失败!\n请重新选择就近位置',
+                    icon: 'none'
+                })
+                showRing()
+            },
+            complete(res) {
+
+            }
+        })
+
+    }
+
+    function showRing() {
+        dispatch(showNight(true))
+        dispatch(showDay(true))
+        Taro.setStorage({
+            key: 'showNightRing',
+            data: true
+        })
+        Taro.setStorage({
+            key: 'showDayRing',
+            data: true
+        })
+    }
+
+    function getLocation() {
+        var city = ''
+        if ((authInfo as any).address) {
+            if ((authInfo as any).address.city.length > 0) {
+                city = (authInfo as any).address.city
+            }
+            else if ((authInfo as any).address.province.length > 0) {
+                city = (authInfo as any).address.province
+            }
+            else if ((authInfo as any).address.country.length > 0) {
+                city = (authInfo as any).address.country
+            }
+            else {
+                city = t('feature.track_time_duration.third_ring.unknown')
+            }
+        }
+        else {
+            city = t('feature.track_time_duration.third_ring.unknown')
+        }
+        // return city +' | '+parseInt(authInfo.lat)+'°'+ ' '+parseInt(authInfo.lng)
+        return `${city} | ${Math.abs(parseInt(authInfo.lat))}°${parseInt(authInfo.lat) < 0 ? 'S' : 'N'} ${Math.abs(parseInt(authInfo.lng))}°${parseInt(authInfo.lng) < 0 ? 'W' : 'E'}`
+    }
+
+    function clearData() {
+        Taro.showModal({
+            title: '提示',
+            content: '确认清除位置数据?',
+            success: function (res) {
+                if (res.confirm) {
+                    clearLocation().then(res => {
+                        if (global.clearNightLocation) {
+                            global.clearNightLocation()
+                        }
+                        if (global.clearDayLocation) {
+                            global.clearDayLocation()
+                        }
+                        lastNightInfo = null
+                        lastDayInfo = null
+                    })
+                } else if (res.cancel) {
+                    console.log('用户点击取消')
+                }
+            }
+        })
+    }
+
+
+
+
+
+    function clearCacheData() {
+        locationDetail = null
+        Taro.removeStorage({ key: 'gps' })
+        setAuthInfo(null)
+        setSunriseTime('06:00')
+        setSunriseTmrTime('06:00')
+        setSunsetTime('18:00')
+        dispatch(updateMember({ isMember: isMember, gpsInfo: null }))
+
+
+        dispatch(setDayRingData({
+            date: new Date().getTime(),
+            sunrise: '06:00',
+            sunset: '18:00'
+        }))
+        dispatch(setNightRingData({
+            date: new Date().getTime(),
+            sunrise: '06:00',
+            sunset: '18:00'
+        }))
+    }
+
+    function detailModalContent() {
+        var split = new Date().toString().split(' ');
+        var timezone = split[split.length - 2];
+        if (!authInfo || !(authInfo as any).lat) {
+            return <View style={{ height: 100, display: 'flex', alignItems: 'center', justifyContent: 'center', width: rpxToPx(750) }}>
+                <Text>暂无位置信息</Text>
+            </View>
+        }
+        return <View style={{ display: 'flex', flexDirection: 'column' }}>
+            {
+                <View className="cell_bg">
+                    {
+                        <View className="cell_full">
+                            <Text className="cell_title">{t('feature.track_time_duration.third_ring.location')}</Text>
+                            <Text className="cell_value">{authInfo ? getLocation() : t('feature.track_time_duration.third_ring.enter')}</Text>
+                        </View>
+                    }
+                    <View className="cell_line" style={{ height: 1 }} />
+
+
+                    {
+                        <View className="cell_full" >
+                            <Text className="cell_title">{t('feature.track_time_duration.third_ring.latitude')}</Text>
+
+                            <Text className="cell_value">{(authInfo as any).lat}</Text>
+
+
+                        </View>
+                    }
+                    <View className="cell_line" style={{ height: 1 }} />
+
+                    <View className="cell_full">
+                        <Text className="cell_title" >{t('feature.track_time_duration.third_ring.longitude')}</Text>
+
+                        <Text className="cell_value">{(authInfo as any).lng}</Text>
+
+                    </View>
+                    <View className="cell_line" style={{ height: 1 }} />
+                    <View className="cell_full">
+                        <Text className="cell_title">{t('feature.track_time_duration.third_ring.timezone')}</Text>
+
+                        <Text className="cell_value">{timezone}</Text>
+
+                    </View>
+
+
+
+                </View>
+
+            }
+
+            <Text onClick={() => {
+                clearData()
+                setShowDetailModal(false)
+            }} style={{ width: '100%', textAlign: 'center', marginBottom: 50, color: '#fff', marginTop: 20 }}>清除位置</Text>
+        </View>
+    }
+
+    function modalContent2() {
+        if (process.env.TARO_ENV == 'weapp') {
+            return <Modal
+                testInfo={null}
+                dismiss={() => {
+                    setShowDetailModal(false)
+                }}
+                confirm={() => { }}>
+                {
+                    detailModalContent()
+                }
+            </Modal>
+        }
+        else if (process.env.TARO_ENV == 'rn') {
+            return <PageContainer style={{ backgroundColor: '#1c1c1c' }}
+                // overlayStyle='background-color:rgba(0,0,0,0.9)'
+                // custom-style='background-color:#1c1c1c'
+                overlayStyle={{ backgroundColor: 'rgba(0,0,0,0.9)' }}
+                customStyle={{ backgroundColor: '#1c1c1c' }}
+                closeOnSlideDown={false}
+                onBeforeEnter={() => {
+
+                }}
+                onBeforeLeave={() => {
+                }}
+                onClick={() => { alert('b') }}
+                onClickOverlay={() => { alert('a') }}
+                onAfterLeave={() => { setShowDetailModal(false) }}
+                show={showDetailModal} round={true} overlay={true} position='bottom'
+            >
+                {
+                    detailModalContent()
+                }
+            </PageContainer>
+        }
+    }
+
+    function modalContent() {
+        if (process.env.TARO_ENV == 'weapp') {
+            return <Modal
+                testInfo={null}
+                dismiss={() => {
+                    setShowDetailPopup(false)
+                }}
+                confirm={() => { }}>
+                <DayNightDetailPopup
+                    sunsetDate={sunsetDate}
+                    sunriseDate={sunriseDate}
+                    sunriseTmrDate={sunriseTmrDate}
+                    sunsetTime={sunsetTime}
+                    sunriseTime={sunriseTime}
+                    sunriseTmrTime={sunriseTmrTime}
+                    isNight={props.isNight}
+                    authInfo={authInfo}
+                    nightDate={nightDate}
+                    dayDate={dayDate}
+                    onClose={() => { setShowDetailPopup(false) }}
+                />
+            </Modal>
+        }
+        else if (process.env.TARO_ENV == 'rn') {
+            return <PageContainer style={{ backgroundColor: '#1c1c1c' }}
+                // overlayStyle='background-color:rgba(0,0,0,0.9)'
+                // custom-style='background-color:#1c1c1c'
+                overlayStyle={{ backgroundColor: 'rgba(0,0,0,0.9)' }}
+                customStyle={{ backgroundColor: '#1c1c1c' }}
+                closeOnSlideDown={false}
+                onBeforeEnter={() => {
+
+                }}
+                onBeforeLeave={() => {
+                }}
+                onClick={() => { alert('b') }}
+                onClickOverlay={() => { alert('a') }}
+                onAfterLeave={() => { setShowDetailPopup(false) }}
+                show={showDetailModal} round={true} overlay={true} position='bottom'
+            >
+                <DayNightDetailPopup
+                    sunsetDate={sunsetDate}
+                    sunriseDate={sunriseDate}
+                    sunriseTmrDate={sunriseTmrDate}
+                    sunsetTime={sunsetTime}
+                    sunriseTime={sunriseTime}
+                    sunriseTmrTime={sunriseTmrTime}
+                    isNight={props.isNight}
+                    authInfo={authInfo}
+                    nightDate={nightDate}
+                    dayDate={dayDate}
+                    onClose={() => { setShowDetailPopup(false) }}
+                />
+            </PageContainer>
+        }
+    }
+
+
+    function getSunsetTime() {
+        if (props.isNight) {
+            if (!authInfo || !(authInfo as any).lat) {
+                if (new Date().getHours() >= 6) {
+                    return `${sunsetTime}`
+                }
+                return `${sunsetTime}`
+                // return `Yesterday ${sunsetTime} - Today ${sunriseTmrTime}`
+            }
+            if (nightDate.getDate() == new Date().getDate()) {
+                return `${sunsetTime.substring(0, 5)}`
+            }
+            return `${sunsetTime.substring(0, 5)}`
+        }
+        if (!authInfo || !(authInfo as any).lat) {
+            if (new Date().getHours() >= 18) {
+                return `${sunsetTime}`
+
+                // return `Tomorrow ${sunriseTime} - ${sunsetTime}`
+            }
+            return `${sunsetTime}`
+            // return `Today ${sunriseTime} - ${sunsetTime}`
+        }
+        if (dayDate.getDate() == new Date().getDate()) {
+            return `${sunsetTime.substring(0, 5)}`
+            // return `Today ${sunriseTime} - ${sunsetTime}`
+        }
+        return `${sunsetTime.substring(0, 5)}`
+
+    }
+
+    function getSunriseTime() {
+        if (props.isNight) {
+            if (!authInfo || !(authInfo as any).lat) {
+                if (new Date().getHours() >= 6) {
+                    return `${sunriseTmrTime}`
+                }
+                return `${sunriseTmrTime}`
+                // return `Yesterday ${sunsetTime} - Today ${sunriseTmrTime}`
+            }
+            if (nightDate.getDate() == new Date().getDate()) {
+                return `${sunriseTmrTime.substring(0, 5)}`
+            }
+            return `${sunriseTmrTime.substring(0, 5)}`
+        }
+        if (!authInfo || !(authInfo as any).lat) {
+            if (new Date().getHours() >= 18) {
+                return `${sunriseTime}`
+
+                // return `Tomorrow ${sunriseTime} - ${sunsetTime}`
+            }
+            return `${sunriseTime}`
+            // return `Today ${sunriseTime} - ${sunsetTime}`
+        }
+        if (dayDate.getDate() == new Date().getDate()) {
+            return `${sunriseTime.substring(0, 5)}`
+            // return `Today ${sunriseTime} - ${sunsetTime}`
+        }
+        return `${sunriseTime.substring(0, 5)}`
+    }
+
+
+    function longClick() {
+        if (user.isLogin && user.test_user && authInfo)
+            setShowDetailModal(true)
+    }
+
+    function showLocationAlert(e) {
+        if (process.env.TARO_ENV == 'weapp') {
+            e.stopPropagation()
+        }
+        if (isMember && authInfo && authInfo.lat) {
+            tapCard(e)
+            return
+        }
+        Taro.showModal({
+            title: props.isNight ? t('feature.day_night.alert_required_night') : t('feature.day_night.alert_required_day'),
+            content: props.isNight ? t('feature.day_night.alert_night_content') : t('feature.day_night.alert_day_content'),
+            confirmText: t('feature.day_night.choose_location'),
+            cancelText: t('feature.day_night.view_more'),
+            success: function (res) {
+                if (res.confirm) {
+                    auth()
+                    // console.log('用户点击确定')
+                } else if (res.cancel) {
+                    setShowDetailPopup(true)
+                }
+            }
+        })
+    }
+
+    function tapShow() {
+        dispatch(showNight(true))
+        dispatch(showDay(true))
+        Taro.showModal({
+            title: 'Login Required',
+            content: props.isNight ? 'Log in to see your daily local nighttime from sunset to sunrise.' : 'Log in to see your daily local daytime from sunrise to sunset.',
+            cancelText: 'Later',
+            confirmText: 'Login',
+            success: function (res) {
+                if (res.confirm) {
+                    Taro.setStorage({
+                        key: 'showNightRing',
+                        data: true
+                    })
+                    Taro.setStorage({
+                        key: 'showDayRing',
+                        data: true
+                    })
+                    if (!user.isLogin) {
+                        jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
+                        return
+                    }
+
+                } else if (res.cancel) {
+                    dispatch(showNight(false))
+                    dispatch(showDay(false))
+                    Taro.setStorage({
+                        key: 'showNightRing',
+                        data: false
+                    })
+                    Taro.setStorage({
+                        key: 'showDayRing',
+                        data: false
+                    })
+                }
+            }
+        })
+    }
+
+    function operate(e) {
+        if (process.env.TARO_ENV == 'weapp') {
+            e.stopPropagation()
+        }
+        Taro.showActionSheet({
+            itemList: ['选择位置', '重置'],
+            success: function (res) {
+                switch (res.tapIndex) {
+                    case 0:
+                        auth()
+                        break;
+                    case 1:
+                        reset()
+                        break;
+                }
+            },
+            fail: function (res) {
+                console.log(res.errMsg)
+            }
+        })
+    }
+
+    function reset() {
+        var content = ''
+        if (props.isNight) {
+            if (authInfo && authInfo.lat) {
+                content = 'Local times for sunset and sunrise, together with the nighttime ring will turn off, and your location data will be cleared. '
+            }
+            else {
+                content = 'Sunset and sunrise times, together with the nighttime ring will turn off.'
+            }
+        }
+        else {
+            if (authInfo && authInfo.lat) {
+                content = 'Local times for sunrise and sunset, together with the daytime ring will turn off, and your location data will be cleared. '
+            }
+            else {
+                content = 'Sunrise and sunset times, together with the daytime ring will turn off.'
+            }
+        }
+        Taro.showModal({
+            title: 'Reset Alert',
+            content: content,
+            success: function (res) {
+                if (res.confirm) {
+                    if (user.isLogin) {
+                        uploadPerm({ show_ring: false })
+                    }
+                    clearLocation().then(res => {
+                        if (global.clearNightLocation) {
+                            global.clearNightLocation()
+                        }
+                        if (global.clearDayLocation) {
+                            global.clearDayLocation()
+                        }
+                        lastNightInfo = null
+                        lastDayInfo = null
+
+                        dispatch(showNight(false))
+                        dispatch(showDay(false))
+                        Taro.setStorage({
+                            key: 'showNightRing',
+                            data: false
+                        })
+                        Taro.setStorage({
+                            key: 'showDayRing',
+                            data: false
+                        })
+                    })
+                } else if (res.cancel) {
+                    console.log('用户点击取消')
+                }
+            }
+
+        })
+
+    }
+
+    function nightRing() {
+        var common = getCommon(null, true)
+        common.radius = bigRingRadius;
+        common.lineWidth = ringWidth;
+        var bgRing = getBgRing()
+
+        let realRingBig: RealRing = {
+            color: ColorType.night + '66',
+            startArc: 0,
+            durationArc: 2
+        }
+
+        
+        if (authInfo && authInfo.night_completed && new Date().getTime() > authInfo.night_completed.sunrise_ts) {
+            realRingBig.color = ColorType.night
+            var duration = (authInfo.night_completed.sunrise_ts - authInfo.night_completed.sunset_ts) / 1000
+            var start = new Date(authInfo.night_completed.sunset_ts)
+            realRingBig.startArc = (start.getHours() * 3600 + start.getMinutes() * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
+            realRingBig.durationArc = (duration) / (24 * 3600) * 2 * Math.PI;
+            return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} canvasId={'ddddsss' + 'index_day'} />
+
+        }
+
+        var sunRise = 24 * 60 + 6 * 60
+        var sunSet = 18 * 60
+
+        var sunRiseObj = nightStore.nightRingSunrise
+        var sunSetObj = nightStore.nightRingSunset
+        sunRise = 24 * 60 + parseInt(sunRiseObj.split(':')[0]) * 60 + parseInt(sunRiseObj.split(':')[1])
+        sunSet = parseInt(sunSetObj.split(':')[0]) * 60 + parseInt(sunSetObj.split(':')[1])
+        if (sunSetObj.indexOf('PM') != -1) {
+            sunSet += 12 * 60
+        }
+        // }
+        var duration = sunRise - sunSet
+        realRingBig.startArc = (sunSet * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
+        realRingBig.durationArc = (duration * 60) / (24 * 3600) * 2 * Math.PI;
+
+        var currentDot = getDot(null, false)
+        currentDot.color = ColorType.night
+
+        var now = new Date()
+        var t = now.getHours() * 60 + now.getMinutes()
+        var duration2 = t - sunSet
+        if (duration2 < 0) {
+            duration2 += 24 * 60
+        }
+        let realRing: RealRing = {
+            color: ColorType.night,
+            startArc: (sunSet * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0,
+            durationArc: (duration2 * 60) / (24 * 3600) * 2 * Math.PI
+        }
+
+        if (nightStore.nightRingDate) {
+            if (new Date(nightStore.nightRingDate).getDate() == new Date().getDate() && new Date().getHours() < 12) {
+
+                realRing = null;
+            }
+        }
+
+        if (!user.isLogin) {
+            currentDot = null;
+            realRing = null;
+        }
+
+
+        return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} realRing={duration2 > duration ? null : realRing} currentDot={currentDot} canvasId={'dddd' + 'index_day'} />
+
+    }
+
+    function dayRing() {
+        var common = getCommon(null, true)
+        common.radius = bigRingRadius;
+        common.lineWidth = ringWidth;
+        var bgRing = getBgRing()
+
+        const realRingBig: RealRing = {
+            color: ColorType.day + '66',
+            startArc: 0,
+            durationArc: 2
+        }
+
+        if (authInfo && authInfo.day_completed && new Date().getTime() > authInfo.day_completed.sunset_ts) {
+            realRingBig.color = ColorType.day
+            var duration = (authInfo.day_completed.sunset_ts - authInfo.day_completed.sunrise_ts) / 1000
+            var start = new Date(authInfo.day_completed.sunrise_ts)
+            realRingBig.startArc = (start.getHours() * 3600 + start.getMinutes() * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
+            realRingBig.durationArc = (duration) / (24 * 3600) * 2 * Math.PI;
+            return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} canvasId={'ddddsss_day' + 'index_day'} />
+
+        }
+
+
+        var sunRise = 6 * 60
+        var sunSet = 18 * 60
+
+        var sunRiseObj = dayStore.dayRingSunrise
+        var sunSetObj = dayStore.dayRingSunset
+        sunRise = parseInt(sunRiseObj.split(':')[0]) * 60 + parseInt(sunRiseObj.split(':')[1])
+        sunSet = parseInt(sunSetObj.split(':')[0]) * 60 + parseInt(sunSetObj.split(':')[1])
+
+
+        var duration = sunSet - sunRise
+
+        realRingBig.startArc = (sunRise * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0;
+        realRingBig.durationArc = (duration * 60) / (24 * 3600) * 2 * Math.PI;
+
+        var currentDot = getDot(null, false)
+        var date = new Date()
+        var minutes = date.getHours() * 60 + date.getMinutes()
+        if (minutes < sunRise) {
+            minutes += 1440
+        }
+
+        currentDot.color = ColorType.day
+
+
+        var now = new Date()
+        var t = now.getHours() * 60 + now.getMinutes()
+        var duration2 = t - sunRise
+        if (duration2 < 0) {
+            duration2 += 24 * 60
+        }
+        var realRing: RealRing = {
+            color: ColorType.day,
+            startArc: (sunRise * 60) / (24 * 3600) * 2 * Math.PI - Math.PI / 2.0,
+            durationArc: (duration2 * 60) / (24 * 3600) * 2 * Math.PI
+        }
+        if (dayStore.dayRingDate) {
+            if (new Date(dayStore.dayRingDate).getDate() != new Date().getDate()) {
+                realRing = null;
+            }
+        }
+
+        if (!user.isLogin) {
+            currentDot = null
+            realRing = null
+        }
+
+        return <Rings common={common} bgRing={bgRing} targetRing={realRingBig} realRing={duration2 <= duration ? realRing : null} currentDot={currentDot} canvasId={'day_day2'} />
+
+    }
+
+    function getSunsetDuration() {
+        if (authInfo && authInfo.night_completed && new Date().getTime() > authInfo.night_completed.sunrise_ts) {
+            return TimeFormatter.durationFormate(authInfo.night_completed.sunrise_ts, authInfo.night_completed.sunset_ts)
+        }
+
+        var now = new Date()
+        if (props.isNight && sunsetDate) {
+            if (now.getTime() > sunsetDate.getTime()) {
+                return TimeFormatter.countdown(sunsetDate.getTime())
+            }
+            // return TimeFormatter.countdown(sunsetDate.getTime())
+        }
+
+
+        var sunRiseObj = nightStore.nightRingSunrise
+        var sunSetObj = nightStore.nightRingSunset
+        var sunRise = 24 * 60 + parseInt(sunRiseObj.split(':')[0]) * 60 + parseInt(sunRiseObj.split(':')[1])
+        var sunSet = parseInt(sunSetObj.split(':')[0]) * 60 + parseInt(sunSetObj.split(':')[1])
+        if (sunSetObj.indexOf('PM') != -1) {
+            sunSet += 12 * 60
+        }
+
+        var duration = (sunRise - sunSet) * 60 * 1000
+
+        return TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + duration);
+
+        // //COMPLETED
+        // if (time.last_real_check_time && time.status != 'WAIT_FOR_START' && time.status != 'COMPLETED') {
+        //     var target_end_time;
+        //     if (time.scenario == 'SLEEP') {
+        //         target_end_time = time.sleep.target_end_time
+        //     }
+        //     else {
+        //         target_end_time = time.fast.target_end_time
+        //     }
+
+        //     if (new Date().getTime > target_end_time) {
+        //         //超时
+        //     }
+        // }
+
+        // //WFS
+        // //ONGOING 显示正计时
+        // return ''
+    }
+
+    function getSunriseDuration() {
+        if (authInfo && authInfo.day_completed && new Date().getTime() > authInfo.day_completed.sunset_ts) {
+            return TimeFormatter.durationFormate(authInfo.day_completed.sunrise_ts, authInfo.day_completed.sunset_ts)
+        }
+
+        var now = new Date()
+        if (!props.isNight && sunriseDate) {
+            if (now.getTime() > sunriseDate.getTime()) {
+                return TimeFormatter.countdown(sunriseDate.getTime())
+            }
+        }
+
+
+        var sunRiseObj = dayStore.dayRingSunrise
+        var sunSetObj = dayStore.dayRingSunset
+        var sunRise = parseInt(sunRiseObj.split(':')[0]) * 60 + parseInt(sunRiseObj.split(':')[1])
+        var sunSet = parseInt(sunSetObj.split(':')[0]) * 60 + parseInt(sunSetObj.split(':')[1])
+        if (sunSetObj.indexOf('PM') != -1) {
+            sunSet += 12 * 60
+        }
+
+        var duration = (sunSet - sunRise) * 60 * 1000
+
+        return TimeFormatter.calculateTimeDifference(new Date().getTime(), new Date().getTime() + duration);
+    }
+
+    function completedDate() {
+        if (props.isNight) {
+            if (authInfo && authInfo.night_completed && new Date().getTime() > authInfo.night_completed.sunrise_ts) {
+                return TimeFormatter.dateDescription(authInfo.night_completed.sunset_ts)
+            }
+            return ''
+        }
+        if (authInfo && authInfo.day_completed && new Date().getTime() > authInfo.day_completed.sunset_ts) {
+            return TimeFormatter.dateDescription(authInfo.day_completed.sunrise_ts)
+        }
+        return ''
+    }
+
+    function showArrow() {
+        if (props.isNight) {
+            if (authInfo && authInfo.night_completed && new Date().getTime() > authInfo.night_completed.sunrise_ts) {
+                return true
+            }
+            return false
+        }
+        if (authInfo && authInfo.day_completed && new Date().getTime() > authInfo.day_completed.sunset_ts) {
+            return true
+        }
+        return false
+    }
+
+    function currentStatus(){
+        if (showArrow()){
+            return '过去'
+        }
+        var strTime = props.isNight?getSunsetDuration():getSunriseDuration()
+        return (strTime.indexOf('小时')!=-1||strTime.indexOf('分钟')!=-1)?'即将到来':'当前'
+    }
+
+    function footerDesc() {
+        var now = new Date()
+        if (props.isNight) {
+            if (now.getTime() < sunsetDate.getTime()) {
+                return '距日落' + TimeFormatter.countdown(sunsetDate.getTime())
+
+            }
+            return '距日出' + TimeFormatter.countdown(sunriseTmrDate.getTime())
+        }
+
+        if (now.getTime() > sunriseDate.getTime() && now.getTime() < sunsetDate.getTime()) {
+
+            return '距日落' + TimeFormatter.countdown(sunsetDate.getTime())
+        }
+        return '距日出' + TimeFormatter.countdown(sunriseDate.getTime())
+
+
+
+    }
+
+    function footerIcon() {
+        var now = new Date()
+        if (props.isNight) {
+            if (now.getTime() < sunsetDate.getTime()) {
+                return <IconSunset color={ColorType.night + '66'} width={14} />
+
+            }
+            return <IconSunrise color={ColorType.night + '66'} width={14} />
+        }
+
+        if (now.getTime() > sunriseDate.getTime() && now.getTime() < sunsetDate.getTime()) {
+
+            return <IconSunset color={ColorType.day + '66'} width={14} />
+        }
+        return <IconSunrise color={ColorType.day + '66'} width={14} />
+
+    }
+
+    return <Box><View style={{ position: 'relative' }}>
+        {
+            !user.isLogin && <View style={{ color: '#fff' }} onClick={tapShow}>{props.isNight ? '显示当地夜晚时间' : '显示当地白天时间'}</View>
+        }
+        {
+            user.isLogin && !dayStore.showDayRing && <View style={{ color: '#fff' }} onClick={auth}>{props.isNight ? '显示当地夜晚时间' : '显示当地白天时间'}</View>
+        }
+        {
+            user.isLogin && dayStore.showDayRing && <View style={{ display: 'flex', flexDirection: 'column', zIndex: 1 }} onClick={showLocationAlert} onLongPress={longClick}>
+
+                <View className="ring_full_container" style={{ paddingBottom: 0 }}>
+
+                    <View style={{
+                        display: 'flex',
+                        flexDirection: 'row',
+                        marginTop: 0,
+                        marginBottom: 0,
+                        padding: 0,
+                        alignItems: 'center'
+                    }}>
+                        {
+                            props.isNight ? nightRing() : dayRing()
+                        }
+                        <View style={{ display: 'flex', flexDirection: 'column', flexShrink: 0, flex: 1, marginLeft: rpxToPx(52) }}>
+                            <Text className='ring_card_duration_title'>{props.isNight ? t('feature.common.overnight') : t('feature.common.day')}</Text>
+                            <Text className='ring_card_duration_value' style={{ color: props.isNight ? ColorType.night : ColorType.day }}>{props.isNight ? getSunsetDuration() : getSunriseDuration()}</Text>
+                            {/* <Text className='duration_title2' style={{ marginTop: 4 }}>{!props.isNight ? t('feature.common.overnight') : t('feature.common.day')}</Text> */}
+                            {/* <Text className='duration_value22' style={{ color: !props.isNight ? ColorType.night : ColorType.day }}>{!props.isNight ? getSunsetTime() : getSunriseTime()}</Text> */}
+
+                        </View>
+                        {/* <View style={{ position: 'absolute', right: -rpxToPx(20), top: -rpxToPx(20) }}>
+                            {
+                                authInfo && authInfo.lat ?
+                                    <View style={{ display: 'flex', flexDirection: 'row' }} onClick={operate}>
+                                        <View className={props.isNight ? 'night_location_btn' : 'day_location_btn'}>{getLocation()}</View>
+                                    </View>
+                                    :
+                                    <View style={{ display: 'flex', flexDirection: 'row' }} onClick={operate}>
+                                        <View className={props.isNight ? 'night_location_btn' : 'day_location_btn'} >
+                                            {props.isNight ? t('feature.day_night.get_local_time') : t('feature.day_night.get_local_time_sunrise')}
+                                        </View>
+                                    </View>
+                            }
+                        </View> */}
+                        <View className='day_card_header'>
+                        <View className='free' style={{ backgroundColor: props.isNight ? ColorType.night : ColorType.day, color: props.isNight ? '#fff' : '#1C1C1C' }}>{currentStatus()}</View>
+                        </View>
+                        <View className='day_card_footer'>
+                            <Text className='day_card_footer_date'>
+                                {
+                                    completedDate()
+                                }
+                            </Text>
+                            {
+                                showArrow() && <Image className="card_arrow" src={require('@/assets/images/arrow3.png')} />
+                            }
+                            {
+                                !showArrow() && footerIcon()
+                            }
+
+                            {
+                                !showArrow() && <Text className='footer_desc_text' style={{ color: props.isNight?ColorType.night:ColorType.day,opacity:0.4 }}>{footerDesc()}</Text>
+                            }
+                        </View>
+                    </View>
+                </View>
+                {/* <View style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', marginTop: rpxToPx(36) }}>
+
+                    {
+                        authInfo && authInfo.lat ?
+                            <View style={{ display: 'flex', flexDirection: 'row' }} onClick={operate}>
+                                <View className={props.isNight ? 'night_location_btn' : 'day_location_btn'}>{getLocation()}</View>
+                            </View>
+                            :
+                            <View style={{ display: 'flex', flexDirection: 'row' }} onClick={operate}>
+                                <View className={props.isNight ? 'night_location_btn' : 'day_location_btn'} >
+                                    {props.isNight ? t('feature.day_night.get_local_time') : t('feature.day_night.get_local_time_sunrise')}
+                                </View>
+                            </View>
+                    }
+                </View> */}
+            </View>
+        }
+        {
+            showDetailPopup && modalContent()
+        }
+        {
+            showDetailModal && modalContent2()
+        }
+    </View>
+    </Box>
+}

src/features/trackTimeDuration/components/DayNightDetailPopup.tsx

@@ -20,6 +20,7 @@ export default function DayNightDetailPopup(props: {
     nightDate: any,
     dayDate: any,
     onClose: Function,
+    updateLocation: Function
 }) {
     const dayNight = useSelector((state: any) => state.night);
     const day = useSelector((state: any) => state.day);
@@ -36,15 +37,15 @@ export default function DayNightDetailPopup(props: {
         return props.isNight ? t('feature.day_night.night_popover') : t('feature.day_night.day_popover')
     }
 
-    function getCompletedTitle(){
-        if (props.isNight){
-            return TimeFormatter.getDayOfWeek(new Date(props.authInfo.night_completed.sunset_ts).getDay(),true)
+    function getCompletedTitle() {
+        if (props.isNight) {
+            return TimeFormatter.getDayOfWeek(new Date(props.authInfo.night_completed.sunset_ts).getDay(), true)
         }
-        return TimeFormatter.getDayOfWeek(new Date(props.authInfo.night_completed.sunrise_ts).getDay(),true)
+        return TimeFormatter.getDayOfWeek(new Date(props.authInfo.night_completed.sunrise_ts).getDay(), true)
     }
 
-    function getSubTitle(){
-        if (props.isNight){
+    function getSubTitle() {
+        if (props.isNight) {
             return TimeFormatter.getMonthAndDayByTimestamp(props.authInfo.night_completed.sunset_ts)
         }
         return TimeFormatter.getMonthAndDayByTimestamp(props.authInfo.night_completed.sunrise_ts)
@@ -273,21 +274,23 @@ export default function DayNightDetailPopup(props: {
 
         if (props.isNight) {
             if (isCompleted()) {
+                var newT = TimeFormatter.transferTimestamp(props.authInfo.night_completed.sunset_ts, props.authInfo.timezone)
+
                 timelineItems.push(
                     {
                         status: 'done',
                         title: '日落',//list[0],
-                        content: TimeFormatter.dateTimeFormate(props.authInfo.night_completed.sunset_ts, true),
+                        content: TimeFormatter.dateTimeFormate(newT, true),
                         date: '',
                         color: ColorType.night
                     }
                 )
-
+                var newT2 = TimeFormatter.transferTimestamp(props.authInfo.night_completed.sunrise_ts, props.authInfo.timezone)
                 timelineItems.push(
                     {
                         status: 'done',
                         title: '日出',//list[1],
-                        content: TimeFormatter.dateTimeFormate(props.authInfo.night_completed.sunrise_ts, true),
+                        content: TimeFormatter.dateTimeFormate(newT2, true),
                         date: '',
                         color: ColorType.night
                     }
@@ -321,23 +324,24 @@ export default function DayNightDetailPopup(props: {
         }
         else {
             if (isCompleted()) {
+                var newT = TimeFormatter.transferTimestamp(props.authInfo.day_completed.sunrise_ts, props.authInfo.timezone)
                 timelineItems.push(
                     {
                         status: 'done',
                         title: '日落',//list[0],
-                        content: TimeFormatter.dateTimeFormate(props.authInfo.day_completed.sunrise_ts, true),
+                        content: TimeFormatter.dateTimeFormate(newT, true),
                         date: '',
-                        color: ColorType.night
+                        color: ColorType.day
                     }
                 )
-
+                var newT2 = TimeFormatter.transferTimestamp(props.authInfo.day_completed.sunset_ts, props.authInfo.timezone)
                 timelineItems.push(
                     {
                         status: 'done',
                         title: '日出',//list[1],
-                        content: TimeFormatter.dateTimeFormate(props.authInfo.day_completed.sunset_ts, true),
+                        content: TimeFormatter.dateTimeFormate(newT2, true),
                         date: '',
-                        color: ColorType.night
+                        color: ColorType.day
                     }
                 )
             }
@@ -363,19 +367,53 @@ export default function DayNightDetailPopup(props: {
                 )
             }
         }
-        return <View style={{ display: 'flex', flexDirection: 'row' }}>
+        var split = new Date().toString().split(' ');
+        var timeZoneFormatted = split[split.length - 2];
+        return <View><View style={{ display: 'flex', flexDirection: 'row' }}>
             <Timeline items={timelineItems} title='' width={468} />
+
+        </View>
+            {
+                props.authInfo.timezone != timeZoneFormatted && <Text className="tz_note_desc">{t('feature.common.diff_tz_desc', { location: props.authInfo.timezone })}</Text>
+            }
         </View>
     }
 
+    function getLocation() {
+        var city = ''
+        if ((props.authInfo as any).address) {
+            if ((props.authInfo as any).address.city.length > 0) {
+                city = (props.authInfo as any).address.city
+            }
+            else if ((props.authInfo as any).address.province.length > 0) {
+                city = (props.authInfo as any).address.province
+            }
+            else if ((props.authInfo as any).address.country.length > 0) {
+                city = (props.authInfo as any).address.country
+            }
+            else {
+                city = t('feature.track_time_duration.third_ring.unknown')
+            }
+        }
+        else {
+            city = t('feature.track_time_duration.third_ring.unknown')
+        }
+        // return city +' | '+parseInt(authInfo.lat)+'°'+ ' '+parseInt(authInfo.lng)
+        return `${city} | ${Math.abs(parseInt(props.authInfo.lat))}°${parseInt(props.authInfo.lat) < 0 ? 'S' : 'N'} ${Math.abs(parseInt(props.authInfo.lng))}°${parseInt(props.authInfo.lng) < 0 ? 'W' : 'E'}`
+    }
+
+    function chooseLocation() {
+        props.updateLocation()
+    }
+
     return <View className='detail_container'>
         {
-            isCompleted()?<Text className='detail_popup_title'>{getCompletedTitle()}<Text className='detail_popup_subttitle'> {getSubTitle()}</Text></Text>:
-            <Text className='detail_popup_title'>{getTitle()}</Text>
-        
+            isCompleted() ? <Text className='detail_popup_title'>{getCompletedTitle()}<Text className='detail_popup_subttitle'> {getSubTitle()}</Text></Text> :
+                <Text className='detail_popup_title'>{getTitle()}</Text>
+
         }
-        
-        
+
+
         <View className='detail_tabbar'>
             <View onClick={() => { setTabIndex(0) }} className={tabIndex == 0 ? 'detail_tabitem_sel' : 'detail_tabitem_nor'}>{t('feature.day_night.overview')}</View>
             <View onClick={() => { setTabIndex(1) }} className={tabIndex == 1 ? 'detail_tabitem_sel' : 'detail_tabitem_nor'}>{t('feature.day_night.events')}</View>
@@ -386,13 +424,26 @@ export default function DayNightDetailPopup(props: {
                 tabIndex == 0 ? overview() : events()
             }
         </View>
-        <View className='detail_bottom'>
-            <View className='detail_bottom_btn' onClick={(e) => {
-                if (process.env.TARO_ENV == 'weapp') {
-                    e.stopPropagation()
-                }
-                props.onClose();
-            }}>{t('feature.track_time_duration.common.okay')}</View>
-        </View>
+
+        {
+            (props.authInfo && props.authInfo.lat) ?
+                <View style={{ display: 'flex', flexDirection: 'column' }}>
+                    <Text>{getLocation()}</Text>
+                    <View style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}>
+                        <Text>{t('feature.track_time_duration.third_ring.base_location_desc')}</Text>
+                        <View onClick={chooseLocation}>
+                            <Text>{t('feature.track_time_duration.third_ring.update_my_location')}</Text>
+                        </View>
+                    </View>
+                </View> :
+                <View className='detail_bottom'><View className='detail_bottom_btn' onClick={(e) => {
+                    if (process.env.TARO_ENV == 'weapp') {
+                        e.stopPropagation()
+                    }
+                    props.updateLocation();
+                }}>上报位置</View></View>
+        }
+
+
     </View>
 }

src/features/trackTimeDuration/components/Discovery.tsx

@@ -19,6 +19,7 @@ import { clearDayStore } from "@/store/day";
 import { AtActivityIndicator } from "taro-ui";
 import NoData from "@/components/view/NoData";
 import AllRings from "./AllRings";
+import AllDayRings from "./AllDayRings";
 // import AtActivityIndicator from "taro-ui/types/activity-indicator";
 
 
@@ -548,7 +549,7 @@ export default function Discovery() {
 
         <DayNightCard isNight={false} count={count} />
         {
-            // user.isLogin && <AllRings />
+            user.isLogin && <AllDayRings schedule={schedule} />
         }
         {
             showErrorPage && <NoData refresh={() => { getPlanData() }} />