update

src/app.scss

@@ -142,6 +142,12 @@ page {
     width: calc(100vw + 12px);
 }
 
+.modal_content{
+    padding-bottom: 120px;
+    display: flex;
+    flex-direction: column;
+}
+
 
 
 // @media only screen and (-webkit-min-device-pixel-ratio: 2.0) {

src/features/trackSomething/components/Metric.tsx

@@ -69,8 +69,6 @@ export default function Component(props: any) {
 
     const openModal = () => {
         setSetupTime(new Date().getTime())
-
-        dispatch(setTabbarStatus(false))
         setModalType(MetricModalType.add)
         setShowPageContainer(true)
     };
@@ -219,14 +217,12 @@ export default function Component(props: any) {
                     case 0:
                         global.metricAdd = true
                         setModalType(MetricModalType.choose)
-                        dispatch(setTabbarStatus(false))
                         setShowPageContainer(true)
 
                         break;
                     case 1:
                         global.metricAdd = false
                         setModalType(MetricModalType.order)
-                        dispatch(setTabbarStatus(false))
                         setShowPageContainer(true)
                         break;
                 }
@@ -295,7 +291,6 @@ export default function Component(props: any) {
     }
 
     function modalCancel() {
-        dispatch(setTabbarStatus(true))
         setShowPageContainer(false)
         onPageContainerCancel()
     }
@@ -310,7 +305,6 @@ export default function Component(props: any) {
             setModalType(MetricModalType.choose)
         }
         else {
-            dispatch(setTabbarStatus(true))
             setShowPageContainer(false)
             onPageContainerCancel()
         }
@@ -327,18 +321,15 @@ export default function Component(props: any) {
             setList((res as any).cards)
             setOrignalGroups(groups)
         })
-        dispatch(setTabbarStatus(true))
         setShowPageContainer(false)
     }
 
     function modalAddCancel() {
-        dispatch(setTabbarStatus(true))
         setShowPageContainer(false)
         onPageContainerCancel()
     }
 
     function modalAddConfirm(result) {
-        dispatch(setTabbarStatus(true))
         setShowPageContainer(false)
 
         var date = new Date(time)
@@ -420,6 +411,7 @@ export default function Component(props: any) {
             show={showPageContainer} round={true} overlay={true} position='bottom'
             onClickOverlay={onPageContainerCancel}
             onAfterLeave={() => { setShowPageContainer(false); setModalType(MetricModalType.none) }}
+            onBeforeEnter={() => { dispatch(setTabbarStatus(false)) }}
             onBeforeLeave={() => { dispatch(setTabbarStatus(true)) }}
         >
             {

src/features/trackTimeDuration/components/Console.tsx

@@ -109,20 +109,23 @@ export default function Component(props: { isNextStep?: boolean }) {
     }
 
     function updateNodeInfo() {
-        var node = (<Modal testInfo={testLayout()} children={layoutContent()} dismiss={() => {
-            global.showClockModal(false, null);
-            hidePicker()
-        }} confirm={() => {
-            hidePicker()
-            var picker = limitPickerRef.current;
-            pickerConfirm((picker as any).getConfirmData());
-            global.showClockModal(false, null);
-        }} />);
+        // var node = (<Modal testInfo={testLayout()} children={layoutContent()} dismiss={() => {
+        //     global.showClockModal(false, null);
+        //     hidePicker()
+        // }} confirm={() => {
+        //     hidePicker()
+        //     var picker = limitPickerRef.current;
+        //     pickerConfirm((picker as any).getConfirmData());
+        //     global.showClockModal(false, null);
+        // }} />);
+        // global.showClockModal(true, node);
+        var node = layoutContent()
         global.showClockModal(true, node);
     }
 
     function hidePicker() {
-        global.showClockModal(false, null);
+        var node = layoutContent()
+        global.showClockModal(false, node);
         if (global.testInfotimer) {
             clearInterval(global.testInfotimer)
             global.testInfotimer = null
@@ -209,13 +212,15 @@ export default function Component(props: { isNextStep?: boolean }) {
         }
 
 
-        return <LimitPickers ref={limitPickerRef} limit={limit} limitDay={8}
+        return <View className="modal_content">
+            <LimitPickers ref={limitPickerRef} limit={limit} limitDay={8}
             themeColor={color}
             title={title}
             onCancel={hidePicker} onChange={(e) => {
                 pickerConfirm(e)
                 hidePicker()
             }} />
+        </View>
     }
 
     function pickerConfirm(t: number) {
@@ -327,7 +332,8 @@ export default function Component(props: { isNextStep?: boolean }) {
         var count = (e[0] + common.duration.min) * 60 + e[1] * common.duration.step
         isFast ? setFastDuration(count * 60000) : setSleepDuration(count * 60000);
         isFast ? setFastPickerValue(e) : setSleepPickerValue(e)
-        global.showClockModal2(false, null)
+        var node = durationPickerContent()
+        global.showClockModal2(false, node)
     }
 
     function login() {
@@ -346,11 +352,12 @@ export default function Component(props: { isNextStep?: boolean }) {
         if (process.env.TARO_ENV == 'weapp') {
             e.stopPropagation()
         }
-        var node = <Modal children={durationPickerContent()} dismiss={() => global.showClockModal2(false, null)} confirm={() => {
-            var picker = durationPickerRef.current;
-            durationChange((picker as any).getConfirmData());
-            global.showClockModal2(false, null);
-        }} />
+        // var node = <Modal children={durationPickerContent()} dismiss={() => global.showClockModal2(false, null)} confirm={() => {
+        //     var picker = durationPickerRef.current;
+        //     durationChange((picker as any).getConfirmData());
+        //     global.showClockModal2(false, null);
+        // }} />
+        var node = durationPickerContent()
         global.showClockModal2(true, node);
     }
 
@@ -368,7 +375,7 @@ export default function Component(props: { isNextStep?: boolean }) {
                 value={isFast ? fastPickerValue : sleepPickerValue}
                 themeColor={color}
                 title={title}
-                showBtns={true} onCancel={() => { global.showClockModal2(false, null); }} />
+                showBtns={true} onCancel={() => { global.showClockModal2(false, durationPickerContent()); }} />
         </View>
     }
 
@@ -533,10 +540,6 @@ export default function Component(props: { isNextStep?: boolean }) {
                     TimeFormatter.countdown(time.fast.target_end_time) :
                     TimeFormatter.countdown(time.sleep.target_end_time)}</Text>
                 <Text className="console_time_duration" style={{ color: isFastData ? global.fastColor ? global.fastColor : ColorType.fast : global.sleepColor ? global.sleepColor : ColorType.sleep, opacity: 0.4 }}>{duration}</Text>
-
-
-
-
             </View>
         }
         return <View />

src/pages/clock/Clock.weapp.tsx

@@ -1,5 +1,5 @@
 import { Component, PropsWithChildren, useEffect, useRef, useState } from 'react'
-import { View, Text, Button, Input, Picker, Swiper, SwiperItem, Icon } from '@tarojs/components'
+import { View, Text, Button, Input, Picker, Swiper, SwiperItem, Icon, PageContainer } from '@tarojs/components'
 import '../index/index.scss'
 import './Clock.scss'
 // import './context/locales/index'
@@ -23,7 +23,7 @@ import trackTimeService from '@/store/trackTimeMachine';
 import { setWXFollow } from '@/store/permission';
 import Tooltip from '@/components/view/Tooltip'
 import RequestType, { thirdPartRequest } from '@/services/thirdPartRequest'
-import { setConfigs } from '@/store/common'
+import { setConfigs, setTabbarStatus } from '@/store/common'
 import RecordFastSleep from '@/features/trackTimeDuration/components/RecordFastSleep'
 import Box from '@/components/layout/Box'
 import Layout from '@/components/layout/layout'
@@ -70,14 +70,15 @@ export default function IndexPage() {
   const [autoPlay, setAutoPlay] = useState(false)
 
   const [showModal, setShowModal] = useState(false)
-  const [modalDetail, setModalDetail] = useState<any>({})
+  const [modalDetail, setModalDetail] = useState<any>(null)
 
   const [showModal2, setShowModal2] = useState(false)
-  const [modalDetail2, setModalDetail2] = useState<any>({})
+  const [modalDetail2, setModalDetail2] = useState<any>(null)
   const [showSingleFastEnd, setShowSingleFastEnd] = useState(false)
   const [consoleStatus, setConsoleStatus] = useState(consoleData.status)
   const [showLogin, setShowLogin] = useState(false)
-  const [showTip,setShowTip] = useState(false)
+  const [showTip, setShowTip] = useState(false)
+  const [isModal1,setIsModal1] = useState(false)
 
   let navigation;
   if (useNavigation) {
@@ -268,7 +269,7 @@ export default function IndexPage() {
     }
   }
 
-  function tapLogin(e){
+  function tapLogin(e) {
     jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
   }
 
@@ -369,12 +370,14 @@ export default function IndexPage() {
 
   global.showClockModal = (isShow: boolean, detail: any) => {
     global.showModal = isShow
+    setIsModal1(true)
     setShowModal(isShow)
     setModalDetail(detail)
   }
 
   global.showClockModal2 = (isShow: boolean, detail: any) => {
     global.showModal = isShow
+    setIsModal1(false)
     setShowModal2(isShow)
     setModalDetail2(detail)
   }
@@ -430,14 +433,14 @@ export default function IndexPage() {
   }
 
   usePageScroll((e) => {
-        if (e.scrollTop > 70) {
-          setShowTip(true)
-        }
-        else {
-          setShowTip(false)
-        }
-    
-})
+    if (e.scrollTop > 70) {
+      setShowTip(true)
+    }
+    else {
+      setShowTip(false)
+    }
+
+  })
 
 
   function detail() {
@@ -455,7 +458,7 @@ export default function IndexPage() {
             </View>
           </Box>
           {
-            !user.isLogin && showLogin && <View style={{ display: 'flex', alignItems: 'center', justifyContent: 'center',marginTop:rpxToPx(36) }}>
+            !user.isLogin && showLogin && <View style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', marginTop: rpxToPx(36) }}>
               <ChooseScenarioBtn title='登录体验' background={ColorType.fast} onClick={tapLogin} />
             </View>
           }
@@ -492,12 +495,30 @@ export default function IndexPage() {
           <View style={{ height: 100 }} />
         </View>
 
-        {
+        <PageContainer style={{ backgroundColor: '#1c1c1c' }}
+          overlayStyle='background-color:rgba(0,0,0,0.9)'
+          custom-style='background-color:#1c1c1c'
+          closeOnSlideDown={false}
+          onBeforeEnter={()=>{
+            dispatch(setTabbarStatus(false))
+          }}
+          onBeforeLeave={()=>{
+            dispatch(setTabbarStatus(true))
+          }}
+          onAfterLeave={() => { setShowModal(false); setShowModal2(false) }}
+          show={showModal || showModal2} round={true} overlay={true} position='bottom'
+        >
+          {
+            isModal1 ? modalDetail: modalDetail2
+          }
+        </PageContainer>
+
+        {/* {
           showModal && modalDetail
         }
         {
           showModal2 && modalDetail2
-        }
+        } */}
 
       </Layout>
     )

src/utils/common.scss

@@ -36,8 +36,3 @@ $historyItemMarginBottom:16px;
 }
 /* #endif */
 
-.modal_content{
-    padding-bottom: 120px;
-    display: flex;
-    flex-direction: column;
-}

src/utils/time_format.ts

@@ -314,7 +314,6 @@ export class TimeFormatter {
     time = time >= 24 * 60 ? time - 24 * 60 : time;
     var hour = Math.floor(time / 60);
     var minute = time % 60;
-    console.log(hour + ':' + minute)
     return `${TimeFormatter.padZero(hour)}:${TimeFormatter.padZero(minute)}`;
   }