update

src/components/basic/Buttons.tsx

@@ -30,7 +30,8 @@ export default function Buttons(props: {
     lowLight?: boolean,
     openType?: string,
     btnStyle?: any,
-    showLoading?: boolean
+    showLoading?: boolean,
+    lightLoading?:boolean
 }) {
 
     function onClick() {
@@ -62,7 +63,7 @@ export default function Buttons(props: {
             <View className={mainClass} style={{ ...props.btnStyle, opacity: props.lowLight ? 0.4 : 1 }} onClick={onClick}>
                 {
                     props.showLoading && <View style={{ marginBottom: 2, marginRight: 5 }}>
-                        <AtActivityIndicator size={32} color="#000" />
+                        <AtActivityIndicator size={32} color={props.lightLoading?'#999':'#000'} />
                     </View>
                 }
                 <Text
@@ -84,7 +85,7 @@ export default function Buttons(props: {
         <View className={mainClass} style={{ ...props.btnStyle, opacity: props.lowLight ? 0.4 : 1 }} onClick={onClick}>
             {
                 props.showLoading && <View style={{ marginBottom: 2, marginRight: 5 }}>
-                    <AtActivityIndicator size={32} color="#000" />
+                    <AtActivityIndicator size={32}  color={props.lightLoading?'#999':'#000'} />
                 </View>
             }
             <Text

src/components/basic/Icons.scss

@@ -0,0 +1,31 @@
+.icon_bg{
+    width: 40px;
+    height: 40px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    position: relative;
+}
+
+.plus_bg{
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 40px;
+    height: 40px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.minus {
+    width: 24px;
+    height: 4px;
+    border-radius: 2px;
+}
+
+.plus{
+    height: 24px;
+    width: 4px;
+    border-radius: 2px;
+}

src/components/basic/Icons.tsx

@@ -0,0 +1,17 @@
+import { View } from '@tarojs/components'
+import './Icons.scss'
+
+export const IconMinus = (props: { color: string, disable?: boolean }) => {
+    return <View className='icon_bg'>
+        <View className='minus' style={{ backgroundColor: props.disable?'#000D1F':props.color }}></View>
+    </View>
+}
+
+export const IconPlus = (props: { color: string, disable?: boolean }) => {
+    return <View className='icon_bg'>
+        <View className='minus' style={{ backgroundColor: props.disable?'#000D1F':props.color }}></View>
+        <View className='plus_bg'>
+            <View className='plus' style={{ backgroundColor: props.disable?'#000D1F':props.color }}/>
+        </View>
+    </View>
+}

src/components/input/Stepper.tsx

@@ -4,8 +4,9 @@ import plus from '../../assets/svg/plus.svg'
 import './Stepper.scss'
 import { useEffect, useState } from "react";
 import Taro from "@tarojs/taro";
+import { IconMinus, IconPlus } from "../basic/Icons";
 
-export default function Component(props: { child: any, minus: Function, plus: Function, disableMinus?: boolean, disablePlus?: boolean }) {
+export default function Component(props: { child: any, minus: Function, plus: Function, disableMinus?: boolean, disablePlus?: boolean,themeColor:string }) {
     const [timer, setTimer] = useState<NodeJS.Timeout | null>(null);
     useEffect(()=>{
         if(props.disableMinus){
@@ -66,14 +67,16 @@ export default function Component(props: { child: any, minus: Function, plus: Fu
     }
     return <View className="stepper_bg">
         <View className="stepper_item" onClick={tapMinus} onLongPress={longMinus} onTouchEnd={longMinusEnd}>
-            <Image src={minus} className="stepper_icon" style={{opacity:props.disableMinus?0.2:1}}/>
+            <IconMinus color={props.themeColor} disable={props.disableMinus}/>
+            {/* <Image src={minus} className="stepper_icon" style={{opacity:props.disableMinus?0.2:1}}/> */}
         </View>
 
         {
             props.child
         }
         <View className="stepper_item" onClick={tapPlus} onLongPress={longPlus} onTouchEnd={longPlusEnd}>
-            <Image src={plus} className="stepper_icon"  style={{opacity:props.disablePlus?0.2:1}}/>
+            <IconPlus color={props.themeColor} disable={props.disablePlus}/>
+            {/* <Image src={plus} className="stepper_icon"  style={{opacity:props.disablePlus?0.2:1}}/> */}
         </View>
 
     </View>

src/components/layout/Box.scss

@@ -1,5 +1,6 @@
 .box-container {
     background-color: #1C1C1C;
+    // background-color: #fff;
     border-radius: 36px;
     padding: 40px;
     margin-left: 46px;

src/components/layout/layout.tsx

@@ -60,7 +60,7 @@ export default function Layout(props: {
                 refresherDefaultStyle="white"
                 onRefresherRefresh={() => { props.refresh!() }}
                 upperThreshold={50}
-                onScrollToLower={() => { props.more!() }}
+                onScrollToLower={() => { props.more?props.more():null }}
                 refresherTriggered={triggered}>
                 {
                     props.title && <View className="layout_title_view">
@@ -80,7 +80,7 @@ export default function Layout(props: {
                 refresherDefaultStyle="white"
                 onRefresherRefresh={() => { props.refresh!() }}
                 upperThreshold={50}
-                onScrollToLower={() => { props.more!() }}
+                onScrollToLower={() => { props.more?props.more():null }}
                 refresherTriggered={triggered}>
                 {
                     props.title && <View className="layout_title_view">

src/custom-tab-bar/index.tsx

@@ -46,18 +46,20 @@ export default function TabBar() {
     return (
         <View className='tabbar'>
             <View className={selIndex == 0 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(0)}>
-                <Text>{t('feature.tabbar.clock')}</Text>
+                {/* <Text>{t('feature.tabbar.clock')}</Text> */}
+                <Text>时钟</Text>
             </View>
             <View className={selIndex == 1 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(1)}>
-
-                <Text>{t('feature.tabbar.metric')}</Text>
+                <Text>指标</Text>
+                {/* <Text>{t('feature.tabbar.metric')}</Text> */}
             </View>
             <View className={selIndex == 2 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(2)}>
-
-                <Text>{t('feature.tabbar.activity')}</Text>
+                <Text>运动</Text>
+                {/* <Text>{t('feature.tabbar.activity')}</Text> */}
             </View>
             <View className={selIndex == 3 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(3)}>
-                <Text>{t('feature.tabbar.profile')}</Text>
+                {/* <Text>{t('feature.tabbar.profile')}</Text> */}
+                <Text>我</Text>
             </View>
         </View>
     )

src/features/common/CenterContentTitleModal.scss

@@ -0,0 +1,20 @@
+.center_content{
+    display: flex;
+    flex-direction: column;
+}
+
+.center_content_title{
+    color: #fff;
+    font-size: 36px;
+    font-weight: bold;
+    margin-bottom: 40px;
+}
+
+.center_content_detail{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+
+

src/features/common/CenterContentTitleModal.tsx

@@ -0,0 +1,13 @@
+import { View, Text } from '@tarojs/components'
+import './CenterContentTitleModal.scss'
+
+export default function Component(props: { children: React.ReactNode, title: string }) {
+    return <View className='center_content'>
+        <Text className='center_content_title'>{props.title}</Text>
+        <View className='center_content_detail'>
+            {
+                props.children
+            }
+        </View>
+    </View>
+}

src/features/common/PostBtn.tsx

@@ -8,24 +8,32 @@ export default function Component(props: {
     type?: ButtonType,
     lowLight?: boolean,
     title: string,
-    btnStyle: any
+    btnStyle: any,
+    lightLoading?: boolean
 }) {
     //idle normal abnormal
     const [btnStatus, setBtnStatus] = useState('idle')
-    const [timer,setTimer] = useState(null)
+    const [timer, setTimer] = useState(null)
 
     useEffect(() => {
         if (btnStatus == 'normal') {
-            var t = setTimeout(()=>{
+            var t = setTimeout(() => {
                 setBtnStatus('abnormal')
-            },500)
+            }, 500)
             setTimer(t as any)
         }
-        else if (btnStatus == 'idle'){
-            if (timer){
+        else if (btnStatus == 'idle') {
+            if (timer) {
                 clearTimeout(timer)
             }
         }
+        else if (btnStatus == 'abnormal') {
+            setTimeout(() => {
+                if (btnStatus == 'abnormal') {
+                    setBtnStatus('idle')
+                }
+            }, 10000)
+        }
     }, [btnStatus])
 
     function updateStatus(status) {
@@ -50,9 +58,10 @@ export default function Component(props: {
                 lowLight={props.lowLight ? props.lowLight : false}
                 onClick={click}
                 disabled={btnStatus != 'idle'}
-                showLoading={btnStatus=='abnormal'}
+                showLoading={btnStatus == 'abnormal'}
                 // lowLight={btnStatus != 'idle'}
                 btnStyle={props.btnStyle}
+                lightLoading={props.lightLoading}
             />
         </View>
     )

src/features/common/SpecBtns.tsx

@@ -3,17 +3,25 @@ import { ButtonType } from "@/utils/types"
 import { View, Text } from "@tarojs/components"
 import { useState } from "react"
 import PostBtn from "./PostBtn"
+import './SpecBtns.scss'
+import Taro from "@tarojs/taro"
+
+export const rpxToPx = (n:number) =>{
+    var rate = Taro.getSystemInfoSync().windowWidth/750;
+    return n*rate;
+}
 
 export const StartFastBtn = (props: { onClick: Function, isLoading?: boolean }) => {
 
+
     return (
         <PostBtn title="开始断食" type={ButtonType.elevated}
             onClick={() => { props.onClick() }}
             btnStyle={{
-                height: 50,
-                borderRadius: 25,
+                height: rpxToPx(100),
+                borderRadius: rpxToPx(50),
                 backgroundColor: '#AAFF00',
-                width:160,
+                width:rpxToPx(320),
                 // paddingLeft: 40,
                 // paddingRight: 40,
                 color: 'black',
@@ -33,10 +41,10 @@ export const StartSleepBtn = (props: { onClick: Function, lowLight?: boolean, is
             onClick={() => { props.onClick() }}
             lowLight={props.lowLight ? props.lowLight : false}
             btnStyle={{
-                height: 50,
-                borderRadius: 25,
+                height: rpxToPx(100),
+                borderRadius: rpxToPx(50),
                 backgroundColor: '#00FFFF',
-                width:160,
+                width:rpxToPx(320),
                 // paddingLeft: 40,
                 // paddingRight: 40,
                 color: 'black',
@@ -56,13 +64,14 @@ export const EndSleepBtn = (props: { onClick: Function, lowLight?: boolean, isLo
         <PostBtn title="结束睡眠" type={ButtonType.outline}
             onClick={() => { props.onClick() }}
             lowLight={props.lowLight ? props.lowLight : false}
+            lightLoading={true}
             btnStyle={{
-                height: 50,
-                borderRadius: 25,
+                height: rpxToPx(100),
+                borderRadius: rpxToPx(50),
                 borderColor: '#00FFFF',
                 borderWidth: 2,
                 borderStyle: 'solid',
-                width:160,
+                width:rpxToPx(320),
                 // paddingLeft: 40,
                 // paddingRight: 40,
                 color: '#00FFFF',
@@ -82,13 +91,14 @@ export const EndFastBtn = (props: { onClick: Function, lowLight?: boolean, isLoa
         <PostBtn title="结束断食" type={ButtonType.outline}
             onClick={() => { props.onClick() }}
             lowLight={props.lowLight ? props.lowLight : false}
+            lightLoading={true}
             btnStyle={{
-                height: 50,
-                borderRadius: 25,
+                height: rpxToPx(100),
+                borderRadius: rpxToPx(50),
                 borderColor: '#AAFF00',
                 borderWidth: 2,
                 borderStyle: 'solid',
-                width:160,
+                width:rpxToPx(320),
                 // paddingLeft: 40,
                 // paddingRight: 40,
                 color: '#AAFF00',
@@ -127,6 +137,29 @@ export const SetScheduleBtn = (props: { onClick: Function, title: string, isFast
     )
 }
 
+export const ChooseScenarioBtn = (props: { onClick: Function, title: string,background:string  }) => {
+    return (
+        <Buttons title={props.title} type={ButtonType.elevated}
+            onClick={() => { props.onClick() }}
+            btnStyle={{
+                height: 50,
+                width: 300,
+                boxSizing: 'border-box',
+                borderRadius: 25,
+                background: props.background,
+                paddingLeft: 40,
+                paddingRight: 40,
+                color: 'black',
+                fontSize: 20,
+                fontWeight:500,
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+            }}
+        />
+    )
+}
+
 export const RecordMetricBtn = (props: { onClick: Function, title: string,themeColor:string }) => {
     return (
         <PostBtn title={props.title} type={ButtonType.elevated}

src/features/trackSomething/components/Activity.tsx

@@ -321,7 +321,9 @@ export default function Component(props: any) {
                     var value = '0'
                     var desc = ''
                     var unit = ''
+                    var showDetail = false;
                     if (item.latest_record) {
+                        showDetail = true
                         value = item.latest_record.items[0].value
                         if (item.latest_record.timestamp == 0) {
                             desc = '今天待打卡'
@@ -348,6 +350,7 @@ export default function Component(props: any) {
                         }
                         else {
                             // unit = '步'
+                            showDetail = true
                             if (item.latest_record) {
                                 value = item.latest_record.items[0].value
                                 desc = TimeFormatter.formatTimestamp(item.latest_record.timestamp)
@@ -376,6 +379,7 @@ export default function Component(props: any) {
                         themeColor={item.theme_color}
                         onClickDetail={()=>{goDetail(item)}}
                         showBadge={showErrorBadge && checkResult.type == 'idle'}
+                        showDetail={showDetail}
                         onClick={() => {
                             tapBtn()
                             // checkout()

src/features/trackSomething/components/ActivityHistory.tsx

@@ -9,6 +9,7 @@ import { ModalType, TimelineType } from "@/utils/types";
 import Timeline from "@/components/view/Timeline";
 import { TimeFormatter } from "@/utils/time_format";
 import './ActivityHistory.scss'
+import CenterContentTitleModal from "@/features/common/CenterContentTitleModal";
 
 export default function Component(props: { records: any[] }) {
     const user = useSelector((state: any) => state.user);
@@ -69,12 +70,16 @@ export default function Component(props: { records: any[] }) {
                 }
             )
         }
-        return <View style={{ display: 'flex', width: '100%', flexDirection: 'column', alignItems: 'center' }}>
-            <View style={{display:'flex',flexDirection:'row',width:'100%'}}>
-                <Text className="modalTitle">{formateDate(item.date + '')}</Text>
-            </View>
+
+        return <CenterContentTitleModal title= {formateDate(item.date + '')}>
             <Timeline items={timelineItems} type={TimelineType.timeSecond} />
-        </View>
+        </CenterContentTitleModal>
+        // return <View style={{ display: 'flex', width: '100%', flexDirection: 'column', alignItems: 'center' }}>
+        //     <View style={{display:'flex',flexDirection:'row',width:'100%'}}>
+        //         <Text className="modalTitle">{formateDate(item.date + '')}</Text>
+        //     </View>
+        //     <Timeline items={timelineItems} type={TimelineType.timeSecond} />
+        // </View>
     }
 
     function showDetail(item) {

src/features/trackSomething/components/Metric.scss

@@ -3,6 +3,8 @@
     flex-direction: row;
     flex-wrap: wrap;
     justify-content: space-between;
+    margin-left: 46px;
+    margin-right: 46px;
 }
 
 .space_width{

src/features/trackSomething/components/Metric.tsx

@@ -64,10 +64,12 @@ export default function Component(props: any) {
         setTriggered(true)
         console.log('get Cards')
         metricCards().then(res => {
+            Taro.stopPullDownRefresh()
             setErrorPage(false)
             setList((res as any).cards)
             setTriggered(false)
         }).catch(e => {
+            Taro.stopPullDownRefresh()
             if (list.length == 0) {
                 setErrorPage(true)
             }
@@ -249,7 +251,7 @@ export default function Component(props: any) {
         (metricItem as any).schemas.map((item, index) => {
             array.push({
                 code: item.code,
-                value: item.tempValue && item.tempValue.length > 0 ? item.tempValue : item.default_value
+                value: item.tempValue && item.tempValue > 0 ? item.tempValue : item.default_value
             })
         })
         var params = {
@@ -272,7 +274,8 @@ export default function Component(props: any) {
 
             list.map((item, index) => {
                 if ((item as any).code == (res as any).code) {
-                    (item as any).latest_record = (res as any).latest_record
+                    (item as any).latest_record = (res as any).latest_record;
+                    (item as any).schemas = (res as any).schemas;
                 }
             })
             setList(JSON.parse(JSON.stringify(list)))
@@ -294,10 +297,12 @@ export default function Component(props: any) {
                         var unit = ''
                         var value = '无记录'
                         var desc = '记录解锁趋势'
+                        var showDetail = false;
                         if (item.latest_record) {
                             unit = item.schemas[0].default_unit
                             value = getValues(item.latest_record.items)
                             desc = TimeFormatter.formatTimestamp(item.latest_record.timestamp)
+                            showDetail = true
                         }
                         return <MetricItem title={item.name}
                             value={value}
@@ -305,6 +310,7 @@ export default function Component(props: any) {
                             desc={desc}
                             btnText={'记录'}
                             isDisabled={false}
+                            showDetail={showDetail}
                             themeColor={item.theme_color}
                             onClickDetail={() => { goDetail(item) }}
                             onClick={() => { record(item) }}
@@ -320,10 +326,10 @@ export default function Component(props: any) {
 
     // return showErrorPage ? <NoData refresh={() => { getCards() }} /> : detail()
 
-    return <View style={{ display: 'flex', flex: 1, height: '100%' }}>
+    return <View style={{ position:'relative' }}>
         <Layout children={showErrorPage ? <NoData refresh={() => { getCards() }} /> : detail()}
             title={t('page.metric.title')}
-            type={TemplateType.grid}
+            type={TemplateType.flex}
             refresh={() => { getCards() }}
             triggered={triggered}
             titleShowStyle={NaviBarTitleShowType.scrollToShow}
@@ -336,7 +342,7 @@ export default function Component(props: any) {
                     display: 'flex', flexDirection: 'column',
                     width: '100%', color: '#000'
                 }}>
-                    <Text className='modal_title' style={{ color: (metricItem as any).theme_color }}>{props.title ? props.title : '测试标题 '}</Text>
+                    <Text className='modal_title' style={{ color: (metricItem as any).theme_color }}>{(metricItem as any).name ? (metricItem as any).name : '测试标题 '}</Text>
                     <View style={{ position: 'relative' }}>
                         {
                             (metricItem as any).schemas.map((item, index) => {

src/features/trackSomething/components/MetricItem.tsx

@@ -1,4 +1,4 @@
-import { View, Text } from "@tarojs/components";
+import { View, Text,Image } from "@tarojs/components";
 import './MetricItem.scss'
 import { RecordMetricBtn } from "@/features/common/SpecBtns";
 
@@ -12,7 +12,8 @@ export default function Component(props: {
     isDisabled?: boolean,
     onClickDetail: Function,
     onClick: Function,
-    showBadge?: boolean
+    showBadge?: boolean,
+    showDetail?:boolean
 }) {
     
     function clickBtn() {
@@ -29,6 +30,10 @@ export default function Component(props: {
         </View>
         <View className="metric_desc_bg" onClick={() => props.onClickDetail()}>
             <Text className="mteric_desc">{props.desc}</Text>
+            {
+                props.showDetail && <Image src={require('@assets/images/arrow3.png')} style={{width:12,height:12}}/>
+            }
+            
         </View>
 
         {/* <View className="operate" style={{ backgroundColor: props.themeColor, opacity: props.isDisabled ? 0.5 : 1 }} onClick={clickBtn}>{props.btnText}

src/features/trackTimeDuration/components/ChooseScenario.tsx

@@ -15,6 +15,7 @@ import Taro from "@tarojs/taro";
 import { useDispatch, useSelector } from "react-redux";
 import { setScenario, setScenarioName, setStep } from "@/store/scenario";
 import { getPlans } from "@/services/trackTimeDuration";
+import { ChooseScenarioBtn } from "@/features/common/SpecBtns";
 
 
 export default function Component() {
@@ -65,21 +66,26 @@ export default function Component() {
 
     function footerContent() {
         var style = {}
+        var background;
         switch (selIndex) {
             case 0:
                 style = { backgroundColor: '#AAFF00' }
+                background = '#AAFF00'
                 break;
             case 1:
                 style = { backgroundColor: '#00FFFF' }
+                background = '#00FFFF'
                 break;
             case 2:
                 style = {
                     background: 'linear-gradient(to right, #AAFF00, #00FFFF)'
                 }
+                background = 'linear-gradient(to right, #AAFF00, #00FFFF)'
                 break;
         }
         return <View>
-            <Buttons title='Next' onClick={next} btnStyle={{ ...style, width: 320 }} />
+            <ChooseScenarioBtn title='Next' onClick={next} background={background}/>
+            {/* <Buttons title='Next' onClick={next} btnStyle={{ ...style, width: 320 }} /> */}
         </View>
     }
 

src/features/trackTimeDuration/components/Console.tsx

@@ -450,7 +450,8 @@ export default function Component(props: { isNextStep?: boolean }) {
                 {
                     (time.status == 'WAIT_FOR_START') && <Stepper child={
                         <Text className="stepper_text" style={{ color: '#00FFFF', opacity: textAlpha(time) }} onClick={showDurationPicker}>{durationFormate()}</Text>
-                    } minus={minus} plus={plus} disableMinus={disableMinus()} disablePlus={disablePlus()} />
+                    } minus={minus} plus={plus}
+                    themeColor={isFast?'#AAFF00':'#00FFFF'} disableMinus={disableMinus()} disablePlus={disablePlus()} />
                 }
                 {
                     time.status == 'ONGOING1' && <View>
@@ -488,7 +489,8 @@ export default function Component(props: { isNextStep?: boolean }) {
                 {
                     (time.status == 'ONGOING1' || time.status == 'WAIT_FOR_START') && <Stepper child={
                         <Text className="stepper_text" style={{ color: textColor, opacity: textAlpha(time) }} onClick={showDurationPicker}>{durationFormate()}</Text>
-                    } minus={minus} plus={plus} disableMinus={disableMinus()} disablePlus={disablePlus()} />
+                    } minus={minus} plus={plus}
+                    themeColor={isFast?'#AAFF00':'#00FFFF'} disableMinus={disableMinus()} disablePlus={disablePlus()} />
                 }
                 {
                     time.status == 'ONGOING2' && <View>

src/features/trackTimeDuration/components/RecordFastSleep.tsx

@@ -14,6 +14,7 @@ import { getBgRing, getCommon, getDot, getReal, getTarget } from "../hooks/RingD
 import Rings from "./Rings";
 import Segment from "@/components/navigation/Segment";
 import Stage from "./Stage";
+import CenterContentTitleModal from "@/features/common/CenterContentTitleModal";
 
 export default function RecordFastSleep(props: { data: any, type: string, delSuccess?: Function }) {
     const [showDetailModal, setShowDetailModal] = useState(false)
@@ -43,6 +44,11 @@ export default function RecordFastSleep(props: { data: any, type: string, delSuc
     }
 
     function schedules() {
+        if (props.data.scenario != 'FAST_SLEEP'){
+            return <CenterContentTitleModal title="Timeline">
+                <TimelineFastSleep data={props.data} />
+            </CenterContentTitleModal>
+        }
         return <View style={{ display: 'flex', flexDirection: 'column' }}>
 
             {

src/features/trackTimeDuration/components/Rings.tsx

@@ -67,7 +67,7 @@ export default function Rings(props: {
             // const ctx = Taro.createCanvasContext(canvasId);
 
 
-            const center = radius + lineWidth / 2; // 圆心坐标
+            const center = radius + lineWidth / 2+3; // 圆心坐标
             ctx.clearRect(0, 0, radius * 2, radius * 2); // 清除画布
 
             // 设置画布尺寸
@@ -134,7 +134,7 @@ export default function Rings(props: {
     useEffect(() => {
         drawCircle()
     }, [props.targetRing, props.currentDot,props.realRing]);
-    return <Canvas canvasId={canvasId} id={canvasId} className={canvasId} type="2d" style={{ width: (radius * 2 + lineWidth), height: (radius * 2 + lineWidth), zIndex: 0 }} ref={canvasRef} />
+    return <Canvas canvasId={canvasId} id={canvasId} className={canvasId} type="2d" style={{ width: (radius * 2 + lineWidth)+6, height: (radius * 2 + lineWidth)+6, zIndex: 0 }} ref={canvasRef} />
 
 }
 

src/features/trackTimeDuration/components/Schedule.tsx

@@ -15,6 +15,7 @@ import { setStep } from "@/store/scenario";
 import Segment from "@/components/navigation/Segment";
 import Modal from "@/components/layout/Modal";
 import Stage from "./Stage";
+import CenterContentTitleModal from "@/features/common/CenterContentTitleModal";
 
 
 export default function Component(props: { type?: string, data?: any, delSuccess?: Function }) {
@@ -84,7 +85,7 @@ export default function Component(props: { type?: string, data?: any, delSuccess
         }
         return <View style={{
             height: 18,
-            overflow:'hidden',
+            overflow: 'hidden',
             display: 'flex', flexDirection: 'row', width: '100%',
             justifyContent: 'space-between', alignItems: 'center',
             marginBottom: 10, paddingRight: 10, boxSizing: 'border-box'
@@ -195,12 +196,15 @@ export default function Component(props: { type?: string, data?: any, delSuccess
                 dismiss={() => {
                     setShowModal(false)
                 }}>
-                <View>
+                <CenterContentTitleModal title="Stage">
+                    <Stage data={time} />
+                </CenterContentTitleModal>
+                {/* <View>
                     <Text>Stage</Text>
                     <View style={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
                         <Stage data={time} />
                     </View>
-                </View>
+                </View> */}
             </Modal>
         }
     </Box>

src/pages/clock/Clock.scss

@@ -36,9 +36,9 @@
   }
 
   .console_bg{
-    height: 420px;
+    height: 400px;
     overflow: hidden;
-    // margin-bottom: 40px;
+    margin-bottom: 40px;
   }
 
   .swiperItem{

src/pages/common/RecordsHistory.tsx

@@ -99,7 +99,8 @@ export default function Page() {
             getClockRecords({
                 page: page,
                 limit: pageSize,
-                only_finished: true
+                // completed: true,
+                part_completed:true
             }).then(res => {
                 Taro.stopPullDownRefresh()
                 setTriggered(false)

src/pages/metric/Metric.config.ts

@@ -3,7 +3,8 @@ export default definePageConfig({
       // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
       // 'demo':'../../components/demo'
     },
-    "disableScroll": true,
+    // "disableScroll": true,
+    "enablePullDownRefresh":true,
     "navigationBarTitleText":""
   })
   

src/pages/metric/Metric.tsx

@@ -1,11 +1,16 @@
 import { View, Text } from "@tarojs/components";
 import Metric from "@/features/trackSomething/components/Metric";
-import { useDidShow } from "@tarojs/taro";
+import { useDidShow, usePullDownRefresh } from "@tarojs/taro";
 
 export default function Page() {
     useDidShow(() => {
         global.updateTab(1)
-      })
+    })
+
+    usePullDownRefresh(() => {
+        
+        global.refreshMetric()
+    })
     return <View className="container">
         <Metric />
     </View>