update

src/_record/components/picker_card.scss

@@ -1,3 +1,4 @@
+/* #ifdef weapp */
 .picker_card_bg_1 {
     position: fixed;
     z-index: 1000;
@@ -11,6 +12,23 @@
     align-items: center;
     justify-content: center;
 }
+/* #endif */
+
+/* #ifdef rn */
+.picker_card_bg_1 {
+    position: absolute;
+    z-index: 1000;
+    left: 0;
+    top: 0;
+    width: 100vw;
+    height: 100vh;
+    background-color: rgba($color: #000000, $alpha: 0.9);
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+}
+/* #endif */
 
 .picker_card {
     width: 698px;

src/_record/components/ring_progress.tsx

@@ -2,6 +2,7 @@ import { MainColorType } from "@/context/themes/color";
 import { rpxToPx } from "@/utils/tools";
 // import { Canvas } from "@tarojs/components";
 import Taro, { useReady } from "@tarojs/taro";
+import { View } from "@tarojs/components";
 import { useEffect, useRef, useState } from "react";
 
 let Canvas
@@ -37,6 +38,8 @@ export default function RingProgress(props: {
     const canvasHeight = props.height ?? rpxToPx(720)
     const scale = props.scale ?? 1
 
+    if (process.env.TARO_ENV=='rn') return <View />
+
     useEffect(() => {
         if (ctx) {
             drawContent(ctx, canvas)

src/_record/pages/log_record.scss

@@ -4,12 +4,7 @@
 
 
 
-.navi_bar {
-    position: fixed;
-    left: 0;
-    right: 0;
-    top: 0;
-}
+
 
 .operate_bg {
     display: flex;
@@ -212,6 +207,13 @@
     align-items: center;
     justify-content: center;
 }
+
+.navi_bar {
+    position: fixed;
+    left: 0;
+    right: 0;
+    top: 0;
+}
 /* #endif */
 
 /* #ifdef rn */
@@ -227,6 +229,13 @@
     align-items: center;
     justify-content: center;
 }
+
+.navi_bar {
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: 0;
+}
 /* #endif */
 
 

src/_record/pages/log_record.tsx

@@ -26,13 +26,15 @@ import FollowInfo from "@/_moment/components/follow_info";
 
 let useRoute;
 let useNavigation;
+let LinearGradient;
 if (process.env.TARO_ENV == 'rn') {
     useRoute = require("@react-navigation/native").useRoute
     useNavigation = require("@react-navigation/native").useNavigation
+    LinearGradient = require('react-native-linear-gradient').default
 }
-export default function LogRecord() {
+export default function LogRecord({ route }) {
     const systemInfo: any = Taro.getWindowInfo ? Taro.getWindowInfo() : Taro.getSystemInfoSync();
-    const navigationBarHeight = systemInfo.statusBarHeight + 44;
+    const navigationBarHeight = systemInfo.statusBarHeight + 44 ;
     const screenHeight = systemInfo.screenHeight
 
     const scale = '?x-oss-process=image/format,jpg/resize,w_400'
@@ -502,7 +504,7 @@ export default function LogRecord() {
             if (global.refreshHistory) {
                 global.refreshHistory()
             }
-            Taro.navigateBack()
+            process.env.TARO_ENV == 'weapp' ? Taro.navigateBack() : navigation.goBack()
             // Taro.hideLoading()
             // Taro.reLaunch({
             //     url: '/pages/moment/moment'
@@ -547,8 +549,38 @@ export default function LogRecord() {
         // }} />
     }
 
-    return <View style={{ position: 'relative', overflow: showChoose ? 'hidden' : 'auto' }}>
-        <View className="main_bg" style={{ background: getBackground(), position: 'absolute' }} />
+    function bgView() {
+        if (process.env.TARO_ENV == 'weapp') {
+            return <View className="main_bg" style={{ background: getBackground() }} />
+        }
+        var time = record.time
+        if (!time) return <View />
+        const { background_colors } = time
+        if (!background_colors) {
+            return <View />
+        }
+        else if (background_colors.length == 1) {
+            return <View />
+        }
+        return <LinearGradient style={{
+            position: 'absolute',
+            left: 0,
+            top: 0,
+
+            width: rpxToPx(750),
+            height: screenHeight,
+            zIndex: 0,
+            pointerEvents: 'none'
+        }}
+            colors={[background_colors[0], background_colors[1]]}
+            start={{ x: 0, y: 0 }}
+            end={{ x: 0, y: 1 }} pointerEvents="none" />
+    }
+
+    return <View style={{ position: 'relative', overflow: showChoose ? 'hidden' : 'visible' }}>
+        {
+            bgView()
+        }
         <View className="navi_bar" style={{ height: navigationBarHeight, zIndex: 1000 }}>
             <View style={{
                 position: 'absolute',
@@ -569,7 +601,7 @@ export default function LogRecord() {
                 }}
                     onClick={() => {
                         if (showResult) {
-                            Taro.navigateBack()
+                            process.env.TARO_ENV == 'weapp' ? Taro.navigateBack() : navigation.goBack()
                             return
                         }
                         if (chooseTitle.length > 0 && step == 0) {
@@ -584,12 +616,12 @@ export default function LogRecord() {
                                 cancelText: t('health.cancel'),
                                 confirmText: t('health.exit'),
                                 confirm: () => {
-                                    Taro.navigateBack()
+                                    process.env.TARO_ENV == 'weapp' ? Taro.navigateBack() : navigation.goBack()
                                 }
                             })
                             return
                         }
-                        Taro.navigateBack()
+                        process.env.TARO_ENV == 'weapp' ? Taro.navigateBack() : navigation.goBack()
                     }}>
                     <IconClose color={showResult ? "#fff" : "#000"} width={rpxToPx(64)} height={rpxToPx(64)} />
                 </View>
@@ -597,7 +629,7 @@ export default function LogRecord() {
         </View>
         <View style={{ height: navigationBarHeight }} />
         {
-            step == 0 && <ScrollView style={{ flex: 1, position: 'relative', zIndex: 1000, height: screenHeight - navigationBarHeight }} scrollY>
+            step == 0 && <ScrollView style={{  position: 'relative', zIndex: 1000, height: screenHeight - navigationBarHeight }} scrollY>
                 {/* <Snapshot id="temp"> */}
                 <View className="cardShowAni" style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', marginTop: rpxToPx(26) }}>
                     <Image src={BASE_IMG_URL + 'tag.svg'} style={{ width: rpxToPx(96), height: rpxToPx(96), marginBottom: rpxToPx(24) }} />
@@ -685,7 +717,7 @@ export default function LogRecord() {
             </View>
         }
         {
-            step == 2 && <ScrollView style={{ flex: 1, position: 'relative', zIndex: 1000, height: screenHeight - navigationBarHeight - rpxToPx(276) }} scrollY>
+            step == 2 && <ScrollView style={{ position: 'relative', zIndex: 1000, height: screenHeight - navigationBarHeight - rpxToPx(276) }} scrollY>
                 <View className="cardShowAni" style={{ paddingTop: rpxToPx(26) }}>
 
                     <View className="content_card">
@@ -840,7 +872,7 @@ export default function LogRecord() {
                             top: 22 - rpxToPx(32)
                         }}
                             onClick={() => {
-                                Taro.navigateBack()
+                                process.env.TARO_ENV == 'weapp' ? Taro.navigateBack() : navigation.goBack()
                                 // setShowShare(false)
                             }}>
                             <IconClose color="#fff" width={rpxToPx(64)} height={rpxToPx(64)} />

src/pages/clock/ClockIndex.tsx

@@ -19,7 +19,7 @@ import { useTranslation } from "react-i18next";
 import NoData from "@/_health/components/no_data";
 
 var timer
-let useNavigation,LinearGradient;
+let useNavigation, LinearGradient;
 if (process.env.TARO_ENV == 'rn') {
     useNavigation = require("@react-navigation/native").useNavigation
     LinearGradient = require('react-native-linear-gradient').default
@@ -79,6 +79,10 @@ export default function ClockIndex() {
             Taro.eventCenter.off('refreshClockIndex')
         }
     }, [])
+
+    useEffect(() => {
+        Taro.eventCenter.trigger('hideTab', showChoose)
+    }, [showChoose])
     useEffect(() => {
         getTime()
     }, [count])
@@ -105,10 +109,14 @@ export default function ClockIndex() {
                 setSelScenario('ACTIVITY')
                 break;
             case 'FAST':
-                jumpPage(`/_record/pages/time_record?scenario=FAST`)
+                jumpPage(`/_record/pages/time_record?scenario=FAST`, 'TimeRecord', navigation, {
+                    scenario: 'FAST'
+                })
                 break
             case 'SLEEP':
-                jumpPage(`/_record/pages/time_record?scenario=SLEEP`)
+                jumpPage(`/_record/pages/time_record?scenario=SLEEP`, 'TimeRecord', navigation, {
+                    scenario: 'SLEEP'
+                })
                 break
             case 'METRIC':
                 jumpPage('/pages/metric/Metric')
@@ -217,7 +225,7 @@ export default function ClockIndex() {
                                 <View className="h36 bold">{item.title}</View>
                                 <View className="h50 bold">{itemTime(item)}</View>
                                 <View style={{ flex: 1 }} />
-                                <View style={{ display: 'flex',flexDirection:'row', justifyContent: 'space-between', alignItems: 'center', }}>
+                                <View style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', }}>
                                     <Image src={item.icon} style={{ width: rpxToPx(48), height: rpxToPx(48) }} />
                                     <Image src={item.action_icon} style={{ width: rpxToPx(36), height: rpxToPx(36) }} />
                                 </View>
@@ -237,13 +245,22 @@ export default function ClockIndex() {
                     setShowChoose(false)
                 }}
                 quick={() => {
-                    jumpPage(`/_record/pages/log_record?scenario=${selScenario}&quick=1`)
+                    jumpPage(`/_record/pages/log_record?scenario=${selScenario}&quick=1`,'LogRecord',navigation,{
+                        scenario:selScenario,
+                        quick:1
+                    })
                 }}
                 chooseImg={(array) => {
-                    jumpPage(`/_record/pages/log_record?scenario=${selScenario}&imgs=${JSON.stringify(array)}`)
+                    jumpPage(`/_record/pages/log_record?scenario=${selScenario}&imgs=${JSON.stringify(array)}`,'LogRecord',navigation,{
+                        scenario:selScenario,
+                        imgs:JSON.stringify(array)
+                    })
                 }}
                 chooseText={() => {
-                    jumpPage(`/_record/pages/log_record?scenario=${selScenario}&only_text=1`)
+                    jumpPage(`/_record/pages/log_record?scenario=${selScenario}&only_text=1`,'LogRecord',navigation,{
+                        scenario:selScenario,
+                        only_text:1
+                    })
                 }}
             />
         }

src/pages/clock/components/choose_actions.scss

@@ -1,6 +1,6 @@
 .actions_bg {
     z-index: 10000;
-    position: fixed;
+    // position: fixed;
     left: 0;
     top: 0;
     width: 100vw;

src/pages/clock/components/choose_actions.tsx

@@ -9,10 +9,12 @@ import { useTranslation } from 'react-i18next'
 import { jumpPage } from '@/features/trackTimeDuration/hooks/Common'
 import { MainColorType } from '@/context/themes/color'
 import { useEffect, useState } from 'react'
+import Modal from '@/components/layout/Modal.weapp'
 
 export default function ChooseActions(props: { close: any, quick: any, chooseText: any, chooseImg: any }) {
     const systemInfo: any = Taro.getWindowInfo ? Taro.getWindowInfo() : Taro.getSystemInfoSync();
     const navigationBarHeight = systemInfo.statusBarHeight + 44;
+    const screenHeight = systemInfo.screenHeight
     const [hideContent, setHideContent] = useState(false)
     const { t } = useTranslation()
 
@@ -157,65 +159,80 @@ export default function ChooseActions(props: { close: any, quick: any, chooseTex
         });
     };
 
-    return <View className="actions_bg" catchMove onClick={props.close}>
+    function content() {
 
-        <View className="navi_bar" style={{
-            position: 'fixed',
-            left: 0,
-            right: 0,
-            top: 0, height: navigationBarHeight, zIndex: 1000
-        }}>
-            <View style={{
-                position: 'absolute',
+        return <View className="actions_bg" style={{
+            position: process.env.TARO_ENV == 'weapp' ? 'fixed' : 'absolute'
+        }} catchMove onClick={props.close}>
+
+            <View className="navi_bar" style={{
+                position: process.env.TARO_ENV == 'weapp' ? 'fixed' : 'absolute',
                 left: 0,
                 right: 0,
-                bottom: 0,
-                height: 44,
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center'
+                top: 0, height: navigationBarHeight, zIndex: 1000,
             }}>
                 <View style={{
                     position: 'absolute',
-                    width: rpxToPx(92),
-                    height: rpxToPx(64),
-                    left: 22,
-                    top: 22 - rpxToPx(32)
-                }}
-                    onClick={() => {
-                        Taro.navigateBack()
-                    }}>
-                    <IconClose color="#fff" width={rpxToPx(64)} height={rpxToPx(64)} />
+                    left: 0,
+                    right: 0,
+                    bottom: 0,
+                    height: 44,
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center'
+                }}>
+                    <View style={{
+                        position: 'absolute',
+                        width: rpxToPx(92),
+                        height: rpxToPx(64),
+                        left: 22,
+                        top: 22 - rpxToPx(32)
+                    }}
+                        onClick={() => {
+                            props.close()
+                        }}>
+                        <IconClose color="#fff" width={rpxToPx(64)} height={rpxToPx(64)} />
+                    </View>
                 </View>
             </View>
-        </View>
-        <View style={{ opacity: hideContent ? 0 : 1 }}>
-            <NewButton type={NewButtonType.img} onClick={album}>
-                <View className='action_btn h30 bold cardShowAni'>{t('health.add_photos')}
-                    <Image className='action_btn_img' src={BASE_IMG_URL + 'image.svg'} />
-                </View>
-            </NewButton>
-            <NewButton type={NewButtonType.img} onClick={text}>
-                <View className='action_btn h30 bold cardShowAni'>{t('health.add_text')}
-                    <Image className='action_btn_img' src={BASE_IMG_URL + 'text.svg'} />
-                </View>
-            </NewButton>
-            <NewButton type={NewButtonType.img} onClick={camera}>
-                <View className='action_btn h30 bold cardShowAni'>{t('health.camera2')}
-                    <Image className='action_btn_img' src={BASE_IMG_URL + 'camera.svg'} />
-                </View>
-            </NewButton>
+            <View style={{ opacity: hideContent ? 0 : 1 }}>
+                <NewButton type={NewButtonType.img} onClick={album}>
+                    <View className='action_btn h30 bold cardShowAni'>{t('health.add_photos')}
+                        <View className='action_btn_img'>
+                            <Image className='action_btn_img' style={{ left: 0, top: 0 }} src={BASE_IMG_URL + 'image.svg'} />
+                        </View>
+                    </View>
+                </NewButton>
+                <NewButton type={NewButtonType.img} onClick={text}>
+                    <View className='action_btn h30 bold cardShowAni'>{t('health.add_text')}
+                        <View className='action_btn_img'>
+                            <Image className='action_btn_img' style={{ left: 0, top: 0 }} src={BASE_IMG_URL + 'text.svg'} />
+                        </View>
+                    </View>
+                </NewButton>
+                <NewButton type={NewButtonType.img} onClick={camera}>
+                    <View className='action_btn h30 bold cardShowAni'>{t('health.camera2')}
+                        <View className='action_btn_img'>
+                            <Image className='action_btn_img' style={{ left: 0, top: 0 }} src={BASE_IMG_URL + 'camera.svg'} />
+                        </View>
+                    </View>
+                </NewButton>
+                {
+                    process.env.TARO_ENV == 'weapp' && <NewButton type={NewButtonType.img} onClick={chat}>
+                        <View className='action_btn h30 bold cardShowAni'>{t('health.import_chat')}
 
-            <NewButton type={NewButtonType.img} onClick={chat}>
-                <View className='action_btn h30 bold cardShowAni'>{t('health.import_chat')}
-                    <Image className='action_btn_img' src={BASE_IMG_URL + 'wechat.svg'} />
-                </View>
-            </NewButton>
-            <View style={{ height: rpxToPx(120) }} />
-        </View>
+                            <View className='action_btn_img'>
+                                <Image className='action_btn_img' style={{ left: 0, top: 0 }} src={BASE_IMG_URL + 'wechat.svg'} />
+                            </View>
+                        </View>
+                    </NewButton>
+                }
+
+                <View style={{ height: rpxToPx(120) }} />
+            </View>
 
 
-        {/* <View className='cardShowAni' style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', height: rpxToPx(64), marginTop: rpxToPx(26) }}>
+            {/* <View className='cardShowAni' style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', height: rpxToPx(64), marginTop: rpxToPx(26) }}>
             <View className='or_line'/>
             <View className='white h30 bold' style={{marginLeft:rpxToPx(24),marginRight:rpxToPx(24)}}>OR</View>
             <View className='or_line'/>
@@ -227,8 +244,18 @@ export default function ChooseActions(props: { close: any, quick: any, chooseTex
         </NewButton> */}
 
 
-        {/* <View className='btnAni' style={{ marginBottom: rpxToPx(84), marginTop: rpxToPx(60) }} onClick={props.close}>
+            {/* <View className='btnAni' style={{ marginBottom: rpxToPx(84), marginTop: rpxToPx(60) }} onClick={props.close}>
             <IconClose color="#fff" width={rpxToPx(64)} height={rpxToPx(64)} />
         </View> */}
-    </View>
+        </View>
+    }
+    if (process.env.TARO_ENV == 'weapp')
+        return content()
+    return <Modal dismiss={props.close}>
+        <View style={{ width: rpxToPx(750), height: screenHeight }}>
+            {
+                content()
+            }
+        </View>
+    </Modal>
 }

src/pages/moment/moment_detail_share.tsx

@@ -16,7 +16,7 @@ export default function MomentDetailShare(props: { user: any, canvas_id?: string
     const info = Taro.getWindowInfo ? Taro.getWindowInfo() : Taro.getSystemInfoSync()
     const dpr = info.pixelRatio; // 获取设备的像素比
 
-
+    if (process.env.TARO_ENV=='rn') return <View />
     useEffect(() => {
         downCover()
 

src/pages/rn/RNMain.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { NavigationContainer } from '@react-navigation/native';
 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
 import { createStackNavigator } from '@react-navigation/stack';
@@ -31,6 +31,9 @@ import AddMoment from '@/_health/pages/add_moment';
 import Move from '@/_health/pages/move';
 import Archive from '@/_health/pages/archive';
 import MomentDetail from '@/_health/pages/moment_detail';
+import TimeRecord from '@/_record/pages/time_record';
+import LogRecord from '@/_record/pages/log_record';
+import Taro from '@tarojs/taro';
 
 // import { View,Image } from '@tarojs/components';
 
@@ -74,6 +77,7 @@ const App: React.FC = () => {
 */
 
 export default function RNMain() {
+  const [showTabbar, setShowTabbar] = useState(true)
   const ClockPage = () => <Clock />
   const MomentPage = () => <Moment />
   const MetricPage = () => <Metric />
@@ -81,6 +85,7 @@ export default function RNMain() {
   const ProfilePage = () => <Profile />
   // const FoodPage = ()=><Food/>
 
+
   if (kIsAndroid) {
     // return <IndexTimePage />
     return <NavigationContainer theme={{
@@ -125,6 +130,7 @@ export default function RNMain() {
       <Tab.Navigator
 
         screenOptions={({ route }) => ({
+
           headerStyle: {
             backgroundColor: '#f5f5f5',
             // borderBottomColor:'#ffffff33',
@@ -137,6 +143,7 @@ export default function RNMain() {
         })}>
         <Tab.Screen name="Home" component={ClockPage} options={{
           headerShown: false,
+          tabBarStyle: { display: showTabbar ? 'flex' : 'none' },
           tabBarIcon: ({ size, focused, color }) => {
             return (
               <Image
@@ -201,6 +208,12 @@ export default function RNMain() {
         <Stack.Screen name='ChooseAuth' component={ChooseAuth} options={{
           headerBackTitle: ' '
         }} />
+        <Stack.Screen name='TimeRecord' component={TimeRecord} options={{
+          headerShown: false
+        }} />
+        <Stack.Screen name='LogRecord' component={LogRecord} options={{
+          headerShown: false
+        }} />
         <Stack.Screen name='Auth' component={Auth} options={{
           headerBackTitle: ' '
         }} />