update

src/components/input/SlidngScale.tsx

@@ -10,30 +10,35 @@ var timerA = null
 var lastValue = 0
 export default function Component(props: {
     step: number, min: number,
-    max: number, default_value: number, changed: Function, unit: string
+    max: number, default_value: number,
+    scale:number,
+    changed: Function, unit: string
     themeColor: string,
     updateStatus: Function
 }) {
     const scrollViewRef = useRef<any>();
     const minNum: number = props.min;//props.step < 1 ?props.default_value-2:props.default_value-20//
     const maxNum: number = props.max;//props.step < 1 ?props.default_value+2:props.default_value+20//
+    const min = props.min//(props.default_value - props.step * 20) < props.min ? props.min : props.default_value - props.step * 20
+    const max = props.max//(props.default_value + props.step * 20) > props.max ? props.max : props.default_value + props.step * 20
+    // const [minNum, setMinNum] = useState(min)
+    // const [maxNum, setMaxNum] = useState(max)
 
     const stepNum: number = props.step * 10;
-    const jingdu: number = props.step < 1 ? 10 : 1;
+    const jingdu: number = props.step<0.1?100:props.step < 1 ? 10 : 1;
     const list: any[] = [];
+    // const [list, setList] = useState([])
 
     const slidngWidth = 10
 
     const [current, setCurrent] = useState(props.default_value)
-    const [left, setLeft] = useState((props.default_value - minNum) * slidngWidth / props.step);
+    const [left, setLeft] = useState((props.default_value - min) * slidngWidth / props.step);
     const [isDraging, setIsDraging] = useState(false)
     const [isEnd, setIsEnd] = useState(true)
     const [enableText, setEnableText] = useState(true)
 
-    // const [showScrollView, setShowScrollView] = useState(false)
-
     for (var i: number = minNum; i <= maxNum; i += props.step) {
-        var value: number = parseFloat(i.toFixed(1));
+        var value: number = parseFloat(i.toFixed(props.scale==0?1:props.scale));
         var isBig: boolean = Math.round((value - minNum) * jingdu) % Math.round(stepNum * jingdu) == 0;
         var isMiddle: boolean = (Math.round((value - minNum) * jingdu) * 2) % Math.round(stepNum * jingdu) == 0;
 
@@ -44,6 +49,47 @@ export default function Component(props: {
         })
 
     }
+    console.log(list)
+
+    // const [showScrollView, setShowScrollView] = useState(false)
+
+    useEffect(() => {
+        // var array: any = []
+        // for (var i: number = min; i <= max; i += props.step) {
+        //     var value: number = parseFloat(i.toFixed(props.scale));
+        //     var isBig: boolean = Math.round((value - min) * jingdu) % Math.round(stepNum * jingdu) == 0;
+        //     var isMiddle: boolean = (Math.round((value - min) * jingdu) * 2) % Math.round(stepNum * jingdu) == 0;
+
+        //     array.push({
+        //         value: props.step < 1 ? value : Math.round(value),
+        //         showBig: isBig && i >= min && i <= max,
+        //         showMiddle: isMiddle && !isBig && i >= min && i <= max
+        //     })
+        // }
+        // setList(array)
+
+        // setTimeout(() => {
+        //     var min2 = props.min
+        //     var max2 = props.max
+        //     setMinNum(min2)
+        //     setMaxNum(max2)
+        //     setLeft((props.default_value - min2) * slidngWidth / props.step)
+
+        //     var array2: any = []
+        //     for (var i: number = min2; i <= max2; i += props.step) {
+        //         var value: number = parseFloat(i.toFixed(1));
+        //         var isBig: boolean = Math.round((value - min2) * jingdu) % Math.round(stepNum * jingdu) == 0;
+        //         var isMiddle: boolean = (Math.round((value - min2) * jingdu) * 2) % Math.round(stepNum * jingdu) == 0;
+
+        //         array2.push({
+        //             value: props.step < 1 ? value : Math.round(value),
+        //             showBig: isBig && i >= min2 && i <= max2,
+        //             showMiddle: isMiddle && !isBig && i >= min2 && i <= max2
+        //         })
+        //     }
+        //     setList(array2)
+        // }, 50)
+    }, [])
 
     useEffect(() => {
         if (isEnd && !isDraging) {
@@ -110,7 +156,7 @@ export default function Component(props: {
         const { scrollLeft } = e.detail;
 
         var count = scrollLeft / slidngWidth;
-        var strValue = (minNum + Math.round(count) * props.step).toFixed(1);
+        var strValue = (minNum + Math.round(count) * props.step).toFixed(props.scale==0?1:props.scale);
         if ((strValue as any) < minNum) {
             strValue = minNum as any;
         }
@@ -122,7 +168,7 @@ export default function Component(props: {
         if (parseFloat(strValue) != current) {
             var data = strValue as any;
             if (props.step < 1) {
-                data = parseFloat(strValue).toFixed(1);
+                data = parseFloat(strValue).toFixed(props.scale==0?1:props.scale);
                 if (data.indexOf('.') > 0) {
                     const regexp = /(?:\.0*|(\.\d+?)0+)$/
                     data = data.replace(regexp, '$1')
@@ -145,17 +191,16 @@ export default function Component(props: {
         // setLeft(scrollLeft)
     }
 
-    function itemContent(data) {
-        var item = list[data.index]
-        var index = data.index
-        return <View className={item.showBig ? 'slidng_item_big' : item.showMiddle ? 'slidng_item_middle' : 'slidng_item'} style={{ width: 2, marginRight: 8, backgroundColor: props.themeColor, zIndex: 0 }} key={index}>
-            {
-                item.showBig ? <Text className="slidng_text">{item.value}</Text> : null
-            }
-        </View>
-    }
+    // function itemContent(data) {
+    //     var item = list[data.index]
+    //     var index = data.index
+    //     return <View className={item.showBig ? 'slidng_item_big' : item.showMiddle ? 'slidng_item_middle' : 'slidng_item'} style={{ width: 2, marginRight: 8, backgroundColor: props.themeColor, zIndex: 0 }} key={index}>
+    //         {
+    //             item.showBig ? <Text className="slidng_text">{item.value}</Text> : null
+    //         }
+    //     </View>
+    // }
 
-    console.log(isEnd, isDraging)
     return <View className="slidng">
         <View className="number_bg" style={{ opacity: enableText ? 1 : 0.4 }}>
             <Text className="number">{current}</Text>
@@ -181,14 +226,14 @@ export default function Component(props: {
                 enhanced
             >
                 <View className="scrollContent">
-                    <View className="scrollPadding" style={{width:rpxToPx(372)}}/>
+                    <View className="scrollPadding" style={{ width: rpxToPx(372) }} />
                     <View className="content">
                         {
                             list.map((item, index) => {
-                                return <View className={item.showBig ? 'slidng_item_big' : item.showMiddle ? 'slidng_item_middle' : 'slidng_item'}
-                                    style={{ width: 2, marginRight: list.length-1==index?0:8, backgroundColor: props.themeColor, zIndex: 0 }} key={index}>
+                                return <View className={(item as any).showBig ? 'slidng_item_big' : (item as any).showMiddle ? 'slidng_item_middle' : 'slidng_item'}
+                                    style={{ width: 2, marginRight: list.length - 1 == index ? 0 : 8, backgroundColor: props.themeColor, zIndex: 0 }} key={index}>
                                     {
-                                        item.showBig ? <Text className="slidng_text">{item.value}</Text> : null
+                                        (item as any).showBig ? <Text className="slidng_text">{(item as any).value}</Text> : null
                                     }
                                 </View>
                             })

src/components/input/SlidngScale_backup.tsx

@@ -1,17 +1,22 @@
 import { ScrollView, View, Text, Image } from "@tarojs/components";
+import VirtualList from '@tarojs/components/virtual-list';
 import './SlidngScale.scss'
 import { useEffect, useRef, useState } from "react";
 import Taro from "@tarojs/taro";
+import { rpxToPx } from "@/utils/tools";
+import { throttle } from 'lodash';
 
+var timerA = null
+var lastValue = 0
 export default function Component(props: {
     step: number, min: number,
     max: number, default_value: number, changed: Function, unit: string
-    themeColor: string
+    themeColor: string,
+    updateStatus: Function
 }) {
     const scrollViewRef = useRef<any>();
-    const minNum: number = props.min;
-    const maxNum: number = props.max;
-
+    const minNum: number = props.min;//props.step < 1 ?props.default_value-2:props.default_value-20//
+    const maxNum: number = props.max;//props.step < 1 ?props.default_value+2:props.default_value+20//
 
     const stepNum: number = props.step * 10;
     const jingdu: number = props.step < 1 ? 10 : 1;
@@ -20,8 +25,12 @@ export default function Component(props: {
     const slidngWidth = 10
 
     const [current, setCurrent] = useState(props.default_value)
-    const [left, setLeft] = useState((props.default_value - minNum) * slidngWidth / props.step + 1);
-    const [showScrollView, setShowScrollView] = useState(false)
+    const [left, setLeft] = useState((props.default_value - minNum) * slidngWidth / props.step);
+    const [isDraging, setIsDraging] = useState(false)
+    const [isEnd, setIsEnd] = useState(true)
+    const [enableText, setEnableText] = useState(true)
+
+    // const [showScrollView, setShowScrollView] = useState(false)
 
     for (var i: number = minNum; i <= maxNum; i += props.step) {
         var value: number = parseFloat(i.toFixed(1));
@@ -37,18 +46,67 @@ export default function Component(props: {
     }
 
     useEffect(() => {
-        // var  aa = current-props.min;
-        // var bb = aa/props.step*slidngWidth;
-        // setLeft(bb/ratio)
+        if (isEnd && !isDraging) {
+            props.updateStatus(true)
+            setEnableText(true)
+        }
+        else {
+            props.updateStatus(false)
+            setEnableText(false)
+        }
+
+    }, [isEnd, isDraging])
+
+    function scrollContent(e) {
+        lastValue = e.detail.scrollLeft;
+        if (timerA)
+            clearTimeout(timerA);
+
+        timerA = setTimeout(() => {
+
+            update(e)
+            setIsDraging(false)
+        }, 250) as any
+    }
+
+    const handleScroll = throttle((e) => {
+
+        console.log(e)
+
+        update(e)
+
+
+
+    }, 500);
+
+    function touchEnd() {
+        setIsEnd(true)
+        var temp = lastValue
         setTimeout(() => {
-            setShowScrollView(true)
-        }, 50)
-    }, [])
+            if (temp == lastValue) {
+                setIsDraging(false)
+            }
+        }, 250)
+    }
 
-    // const dpr = Taro.pxTransform//Taro.getSystemInfoSync().pixelRatio; 
+    function touchStart() {
+        props.updateStatus(false)
+        setEnableText(false)
+    }
 
+    function dragStart(e) {
+        lastValue = e.detail.scrollLeft;
+        setIsEnd(false)
+        setIsDraging(true)
+    }
+
+    function dragEnd(e) {
+        setIsEnd(true)
+        console.log('end')
+        // setIsDraging(false)
+    }
 
-    const handleScroll = (e) => {
+    function update(e) {
         const { scrollLeft } = e.detail;
 
         var count = scrollLeft / slidngWidth;
@@ -74,47 +132,83 @@ export default function Component(props: {
                 data = Math.round(data);
             }
 
-            setCurrent(data);
-            // setLeft((parseFloat(data+'') - props.min) * slidngWidth / props.step + 1);
 
+
+            setCurrent(data);
             props.changed(data);
         }
-    };
+    }
 
     const scrollEnd = (e) => {
-        const { scrollLeft } = e.detail;
-        setLeft(scrollLeft)
+        console.log(e, 'end')
+        // const { scrollLeft } = e.detail;
+        // setLeft(scrollLeft)
     }
 
+    function itemContent(data) {
+        var item = list[data.index]
+        var index = data.index
+        return <View className={item.showBig ? 'slidng_item_big' : item.showMiddle ? 'slidng_item_middle' : 'slidng_item'} style={{ width: 2, marginRight: 8, backgroundColor: props.themeColor, zIndex: 0 }} key={index}>
+            {
+                item.showBig ? <Text className="slidng_text">{item.value}</Text> : null
+            }
+        </View>
+    }
+
+    console.log(isEnd, isDraging)
     return <View className="slidng">
-        <View className="number_bg">
+        <View className="number_bg" style={{ opacity: enableText ? 1 : 0.4 }}>
             <Text className="number">{current}</Text>
             <Text className="unit">{props.unit}</Text>
         </View>
 
         <View className="scroll_bg">
-            <View className="top_line" style={{ backgroundColor: props.themeColor }} />}
-            <ScrollView style={{ zIndex: 0 }} ref={scrollViewRef} scrollX enhanced scrollLeft={left} className="scroll" onScroll={handleScroll} onDragEnd={scrollEnd}>
+            <View className="shadow_top" />
+            <View className="shadow_left" />
+            <View className="shadow_right" />
+            <View className="top_line" style={{ backgroundColor: props.themeColor }} />
+            <ScrollView
+                style={{ zIndex: 0, position: 'relative' }} ref={scrollViewRef}
+                scrollX scrollLeft={left} className="scroll"
+                enablePassive={true}
+                fastDeceleration={true}
+                onScrollEnd={scrollEnd}
+                onDragEnd={dragEnd}
+                onTouchStart={touchStart}
+                onTouchEnd={touchEnd}
+                onDragStart={dragStart}
+                onScroll={scrollContent}
+                enhanced
+            >
                 <View className="scrollContent">
-                    <View className="scrollPadding" />
+                    <View className="scrollPadding" style={{width:rpxToPx(372)}}/>
                     <View className="content">
                         {
                             list.map((item, index) => {
-                                return <View className={item.showBig ? 'slidng_item_big' : item.showMiddle ? 'slidng_item_middle' : 'slidng_item'} style={{ width: 2, marginRight: 8, backgroundColor: props.themeColor }} key={index}>
+                                return <View className={item.showBig ? 'slidng_item_big' : item.showMiddle ? 'slidng_item_middle' : 'slidng_item'}
+                                    style={{ width: 2, marginRight: list.length-1==index?0:8, backgroundColor: props.themeColor, zIndex: 0 }} key={index}>
                                     {
                                         item.showBig ? <Text className="slidng_text">{item.value}</Text> : null
                                     }
                                 </View>
                             })
                         }
+                        {/* <View style={{position:'fixed',right:0,top:0,width:100,bottom:0,backgroundColor:'red',zIndex:10}}/> */}
                     </View>
-
                     <View className="scrollPadding" />
+
                 </View>
+
             </ScrollView>
-            <View className="shadow_top" />
-            <View className="shadow_left" />
-            <View className="shadow_right" />
+
+            {/* <VirtualList height={rpxToPx(300)} width={rpxToPx(750)} onScroll={handleScroll} layout="horizontal"
+                initialScrollOffset={left}
+                itemCount={list.length}
+                item={itemContent}
+                itemSize={10}
+                itemData={list}
+            /> */}
+
             <Image className="center_line" src={require('@assets/images/scale_center.png')} />
             {/* <View className="center_line" /> */}
         </View>

src/components/navigation/TabBar.scss

@@ -1,13 +1,38 @@
-.tabbar {
-    background-color: #000000;
-    box-sizing: border-box;
-    filter: blur(10px);
-    height: 50px;
-    width: 375px;
-    // padding-bottom: constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
- 	// padding-bottom: env(safe-area-inset-bottom); /* 兼容 iOS >= 11.2 */
+
+.tabbar{
+    display: flex;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 103px;
+    flex-direction: row;
+    justify-content: space-around;
+    background-color: #000;
+    // background-color: #000;
+    // background-color: red;
+    padding-bottom: constant(safe-area-inset-bottom);
+    /* 兼容 iOS < 11.2 */
+    padding-bottom: env(safe-area-inset-bottom);
+    border-top-color: rgba($color: #ffffff, $alpha: 0.2);
+    border-top-width: 1px;
+    border-top-style: solid;
+    z-index: 100;
+}
+
+.tabbar-item{
+    color: rgba($color: #ffffff, $alpha: 0.4);
+    font-size: 36px;
+    // padding-top: 25px;
+    display: flex;
+    flex: 1;
+    align-items: center;
+    justify-content: center;
+    font-weight: bold;
 }
 
-.tabtext{
-    color: pink;
+.tabbar-item-sel{
+    color: #ffffff;
+    font-size: 40px;
+    font-weight: bold;
 }

src/components/navigation/TabBar.tsx

@@ -1,7 +1,49 @@
-import { View,Text } from "@tarojs/components";
+import { View,Text } from '@tarojs/components'
+import './Tabbar.scss'
+import Taro from '@tarojs/taro';
+import { useState } from 'react';
 
-export default function TabBar(){
-    return <View className="tabbar">
-        <Text className="tabtext">hi1</Text>
+export default function Component(props:{index:number}) {
+    const [selIndex] = useState(props.index)
+    function switchTab(index: number) {
+        switch (index) {
+            case 0:
+
+                Taro.switchTab({
+                    url: '/pages/clock/Clock'
+                })
+                break;
+            case 1:
+                Taro.switchTab({
+                    url: '/pages/metric/Metric'
+                })
+                break;
+            case 2:
+
+                Taro.switchTab({
+                    url: '/pages/activity/Activity'
+                })
+                break;
+            case 3:
+                Taro.switchTab({
+                    url: '/pages/account/Profile'
+                })
+                break;
+        }
+    }
+
+    return <View className='tabbar'>
+        <View className={selIndex == 0 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(0)}>
+            <Text>生物钟</Text>
+        </View>
+        <View className={selIndex == 1 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(1)}>
+            <Text>指标</Text>
+        </View>
+        <View className={selIndex == 2 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(2)}>
+            <Text>运动</Text>
+        </View>
+        <View className={selIndex == 3 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(3)}>
+            <Text>更多</Text>
+        </View>
     </View>
 }

src/custom-tab-bar/index.scss

@@ -1,24 +1,4 @@
 
-.tabbar{
-    display: flex;
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    height: 103px;
-    flex-direction: row;
-    justify-content: space-around;
-    background-color: #000;
-    // background-color: #000;
-    // background-color: red;
-    padding-bottom: constant(safe-area-inset-bottom);
-    /* 兼容 iOS < 11.2 */
-    padding-bottom: env(safe-area-inset-bottom);
-    border-top-color: rgba($color: #ffffff, $alpha: 0.2);
-    border-top-width: 1px;
-    border-top-style: solid;
-    z-index: 100;
-}
 
 //未选中 18 40%
 //选中 20 100%

src/custom-tab-bar/index.tsx

@@ -23,62 +23,6 @@ export default function TabBar() {
         setSelIndex(common.pageIndex)
     },[common.pageIndex])
 
-    function switchTab(index: number) {
-        // console.log(index,common.showTabbar)
-        if (!common.showTabbar){
-            return
-        }
-        // global.index = index;
-
-        // console.log(index,'apple')
-        // console.log(global.index)
-        dispatch(changeTabbar(index))
-        
-
-        switch (index) {
-            case 0:
-
-                Taro.switchTab({
-                    url: '/pages/clock/Clock'
-                })
-                break;
-            case 1:
-                Taro.switchTab({
-                    url: '/pages/metric/Metric'
-                })
-                break;
-            case 2:
-
-                Taro.switchTab({
-                    url: '/pages/activity/Activity'
-                })
-                break;
-            case 3:
-                Taro.switchTab({
-                    url: '/pages/account/Profile'
-                })
-                break;
-        }
-    }
-    return (
-        
-        <View className='tabbar'>
-            <View className={selIndex == 0 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(0)}>
-                {/* <Text>{t('tabbar.clock')}</Text> */}
-                <Text>生物钟</Text>
-            </View>
-            <View className={selIndex == 1 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(1)}>
-                <Text>指标</Text>
-                {/* <Text>{t('tabbar.metric')}</Text> */}
-            </View>
-            <View className={selIndex == 2 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(2)}>
-                <Text>运动</Text>
-                {/* <Text>{t('tabbar.activity')}</Text> */}
-            </View>
-            <View className={selIndex == 3 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(3)}>
-                {/* <Text>{t('tabbar.more')}</Text> */}
-                <Text>更多</Text>
-            </View>
-        </View>
-    )
+    
+    return <View style={{width:0,height:0,opacity:0}}/>
 }

src/custom-tab-bar2/index.scss

@@ -0,0 +1,41 @@
+
+.tabbar{
+    display: flex;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 103px;
+    flex-direction: row;
+    justify-content: space-around;
+    background-color: #000;
+    // background-color: #000;
+    // background-color: red;
+    padding-bottom: constant(safe-area-inset-bottom);
+    /* 兼容 iOS < 11.2 */
+    padding-bottom: env(safe-area-inset-bottom);
+    border-top-color: rgba($color: #ffffff, $alpha: 0.2);
+    border-top-width: 1px;
+    border-top-style: solid;
+    z-index: 100;
+}
+
+//未选中 18 40%
+//选中 20 100%
+
+.tabbar-item{
+    color: rgba($color: #ffffff, $alpha: 0.4);
+    font-size: 36px;
+    // padding-top: 25px;
+    display: flex;
+    flex: 1;
+    align-items: center;
+    justify-content: center;
+    font-weight: bold;
+}
+
+.tabbar-item-sel{
+    color: #ffffff;
+    font-size: 40px;
+    font-weight: bold;
+}

src/custom-tab-bar2/index.tsx

@@ -0,0 +1,84 @@
+import { View, Text } from '@tarojs/components'
+import './index.scss'
+import { useTranslation } from 'react-i18next'
+import Taro from '@tarojs/taro'
+import { useEffect, useState } from 'react'
+import { useDispatch, useSelector } from 'react-redux'
+import { changeTabbar } from '@/store/common'
+
+export default function TabBar() {
+    const { t } = useTranslation()
+    const common = useSelector((state: any) => state.common);
+    const [selIndex, setSelIndex] = useState(common.pageIndex)
+    const dispatch = useDispatch();
+    // useEffect(() => {
+    //     console.log('aaa',global.index)
+    //     setSelIndex(global.index?global.index:0)
+    //   }, [global.index])
+    // useEffect(()=>{
+    //     console.log('page 初始化')
+    // },[])
+
+    useEffect(()=>{
+        setSelIndex(common.pageIndex)
+    },[common.pageIndex])
+
+    function switchTab(index: number) {
+        // console.log(index,common.showTabbar)
+        if (!common.showTabbar){
+            return
+        }
+        // global.index = index;
+
+        // console.log(index,'apple')
+        // console.log(global.index)
+        dispatch(changeTabbar(index))
+        
+
+        switch (index) {
+            case 0:
+
+                Taro.switchTab({
+                    url: '/pages/clock/Clock'
+                })
+                break;
+            case 1:
+                Taro.switchTab({
+                    url: '/pages/metric/Metric'
+                })
+                break;
+            case 2:
+
+                Taro.switchTab({
+                    url: '/pages/activity/Activity'
+                })
+                break;
+            case 3:
+                Taro.switchTab({
+                    url: '/pages/account/Profile'
+                })
+                break;
+        }
+    }
+    return (
+        
+        <View className='tabbar'>
+            <View className={selIndex == 0 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(0)}>
+                {/* <Text>{t('tabbar.clock')}</Text> */}
+                <Text>生物钟</Text>
+            </View>
+            <View className={selIndex == 1 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(1)}>
+                <Text>指标</Text>
+                {/* <Text>{t('tabbar.metric')}</Text> */}
+            </View>
+            <View className={selIndex == 2 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(2)}>
+                <Text>运动</Text>
+                {/* <Text>{t('tabbar.activity')}</Text> */}
+            </View>
+            <View className={selIndex == 3 ? 'tabbar-item tabbar-item-sel' : 'tabbar-item'} onClick={() => switchTab(3)}>
+                {/* <Text>{t('tabbar.more')}</Text> */}
+                <Text>更多</Text>
+            </View>
+        </View>
+    )
+}

src/features/trackSomething/components/MetricModalAdd.tsx

@@ -7,15 +7,16 @@ import { useEffect, useState } from 'react'
 
 export default function Component(props: { item: any, strTime: string, showPicker: Function, cancel: Function, confirm: Function }) {
     const [metricItem, setMetricItem] = useState(props.item)
-    const [enable,setEnable] = useState(true)
+    const [enable, setEnable] = useState(true)
     // const [disableCode,setDisableCode] = useState(0)
     const { t } = useTranslation()
 
-    
+
 
     useEffect(() => {
         setMetricItem(props.item)
     }, [props.item])
+
     return <View>
         <View className='modal_content'>
             <Text className='modal_title' style={{ color: (metricItem as any).theme_color }}>{(metricItem as any).name ? (metricItem as any).name : ''}</Text>
@@ -30,11 +31,13 @@ export default function Component(props: { item: any, strTime: string, showPicke
                                     // opacity:item.code==disableCode?0.4:1
                                 }}>{item.name}</Text>
                             }
-                            <SlidngScale step={item.step} min={item.min} max={item.max} default_value={item.default_value}
+                            <SlidngScale step={item.step} min={item.min} max={item.max}
+                                default_value={item.default_value}
+                                scale={item.scale}
                                 unit={item.default_unit}
                                 themeColor={(metricItem as any).theme_color}
-                                changed={(e) => { item.tempValue = e }} 
-                                updateStatus={(isEnable)=>{
+                                changed={(e) => { item.tempValue = e }}
+                                updateStatus={(isEnable) => {
                                     setEnable(isEnable)
                                     // if (isEnable){
                                     //     setDisableCode(0)
@@ -43,7 +46,7 @@ export default function Component(props: { item: any, strTime: string, showPicke
                                     //     setDisableCode(item.code)
                                     //     console.log(item.code)
                                     // }
-                                }}/>
+                                }} />
                         </View>
                     })
                 }
@@ -61,8 +64,8 @@ export default function Component(props: { item: any, strTime: string, showPicke
                     }</Text>
                 </View>
                 <View className='btn_space' />
-                <View className='modal_btn' style={{ backgroundColor: (metricItem as any).theme_color,opacity:enable?1:0.4 }} onClick={() => {
-                    if (enable){
+                <View className='modal_btn' style={{ backgroundColor: (metricItem as any).theme_color, opacity: enable ? 1 : 0.4 }} onClick={() => {
+                    if (enable) {
                         props.confirm(metricItem)
                     }
                 }}>

src/pages/account/Profile.tsx

@@ -12,8 +12,9 @@ import { useTranslation } from "react-i18next";
 import TableCell from "@/components/layout/TableCell";
 import { useEffect, useState } from "react";
 import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
+import Tabbar from "@/components/navigation/Tabbar";
 let useNavigation;
-if (process.env.TARO_ENV=='rn'){
+if (process.env.TARO_ENV == 'rn') {
     useNavigation = require("@react-navigation/native").useNavigation
 }
 
@@ -24,7 +25,7 @@ export default function Page() {
     const [switchOn, setSwitchOn] = useState(false)
 
     let navigation;
-    if (useNavigation){
+    if (useNavigation) {
         navigation = useNavigation()
     }
 
@@ -87,7 +88,7 @@ export default function Page() {
             jumpPage('/pages/account/ProfileSetting')
         }
         else {
-            jumpPage('/pages/account/ChooseAuth','ChooseAuth',navigation)
+            jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
         }
     }
 
@@ -96,7 +97,7 @@ export default function Page() {
 
         }
         else {
-            jumpPage('/pages/account/ChooseAuth','ChooseAuth',navigation)
+            jumpPage('/pages/account/ChooseAuth', 'ChooseAuth', navigation)
             if (process.env.TARO_ENV == 'weapp') {
                 e.stopPropagation()
             }
@@ -165,7 +166,7 @@ export default function Page() {
                     <Switch checked={switchOn} onChange={switchChanged} />
                 </TableCell>
             }
-            <View  style={{height:40}}></View>
+            <View style={{ height: 40 }}></View>
 
             {/* <Text>未更改前的1px线</Text>
             <View style={{ marginLeft: 100 }}>
@@ -218,10 +219,13 @@ export default function Page() {
         </View>
     }
 
-    return <Layout title={t('page.more.title')}
-        titleShowStyle={NaviBarTitleShowType.scrollToShow} type={TemplateType.flex}>
-        {
-            detail()
-        }
-    </Layout>;
+    return <View>
+        <Layout title={t('page.more.title')}
+            titleShowStyle={NaviBarTitleShowType.scrollToShow} type={TemplateType.flex}>
+            {
+                detail()
+            }
+        </Layout>
+        <Tabbar index={3} />
+    </View>
 }

src/pages/account/Setting.tsx

@@ -34,7 +34,7 @@ export default function Page() {
 
     return <View style={{ color: '#fff',display:'flex',flexDirection:'column' }}>
         <View style={{height:20}}/>
-        <TableCell title={t('page.setting.version')} ><Text style={{ opacity: 0.8 }}>1.2.5</Text></TableCell>
+        <TableCell title={t('page.setting.version')} ><Text style={{ opacity: 0.8 }}>1.2.6</Text></TableCell>
         {/* <Text style={{color:'#9E9E9E',textAlign:'center',fontSize:14}}>v1.2.2</Text> */}
         
         <Footer>

src/pages/activity/Activity.tsx

@@ -2,6 +2,7 @@ import { View, Text } from "@tarojs/components";
 import Activity from '@/features/trackSomething/components/Activity'
 import { useDidShow, useReady, useShareAppMessage } from "@tarojs/taro";
 import { activityCards } from "@/services/trackSomething";
+import Tabbar from "@/components/navigation/Tabbar";
 import { useTranslation } from "react-i18next";
 
 export default function Page() {
@@ -31,6 +32,7 @@ export default function Page() {
     return (
         <View>
             <Activity />
+            <Tabbar index={2} />
         </View>
     )
 }

src/pages/clock/Clock.weapp.tsx

@@ -1,5 +1,6 @@
 import { Component, PropsWithChildren, useEffect, useRef, useState } from 'react'
 import { View, Text, Button, Input, Picker, Swiper, SwiperItem, Icon, PageContainer } from '@tarojs/components'
+import Tabbar from "@/components/navigation/Tabbar";
 import '../index/index.scss'
 import './Clock.scss'
 // import './context/locales/index'
@@ -80,7 +81,7 @@ export default function IndexPage() {
   const [showLogin, setShowLogin] = useState(false)
   const [showTip, setShowTip] = useState(false)
   const [isModal1, setIsModal1] = useState(false)
-  const [debugInfo,setDebugInfo] = useState(null)
+  const [debugInfo, setDebugInfo] = useState(null)
 
   let navigation;
   if (useNavigation) {
@@ -370,7 +371,7 @@ export default function IndexPage() {
     return isNeed
   }
 
-  global.showClockModal = (isShow: boolean, detail: any,debugNode?:any) => {
+  global.showClockModal = (isShow: boolean, detail: any, debugNode?: any) => {
     global.showModal = isShow
     setIsModal1(true)
     setDebugInfo(debugNode)
@@ -519,13 +520,13 @@ export default function IndexPage() {
           }
         </PageContainer> */}
         {
-          (showModal || showModal2) && <Modal 
-          testInfo={debugInfo}
-          dismiss={()=>{
-            setDebugInfo(null)
-            setShowModal(false); setShowModal2(false)
-          }} 
-          confirm={()=>{}}>
+          (showModal || showModal2) && <Modal
+            testInfo={debugInfo}
+            dismiss={() => {
+              setDebugInfo(null)
+              setShowModal(false); setShowModal2(false)
+            }}
+            confirm={() => { }}>
             {
               isModal1 ? modalDetail : modalDetail2
             }
@@ -547,5 +548,8 @@ export default function IndexPage() {
   if (process.env.TARO_ENV == 'rn')
     return <View />
 
-  return detail()
+  return <View>
+    {detail()}
+    <Tabbar index={0} />
+  </View>
 }

src/pages/metric/Metric.tsx

@@ -1,6 +1,7 @@
 import { View, Text } from "@tarojs/components";
 import Metric from "@/features/trackSomething/components/Metric";
 import { useDidShow, usePullDownRefresh, useShareAppMessage } from "@tarojs/taro";
+import Tabbar from "@/components/navigation/Tabbar";
 import { useTranslation } from "react-i18next";
 
 export default function Page() {
@@ -20,5 +21,6 @@ export default function Page() {
     })
     return <View className="container">
         <Metric />
+        <Tabbar index={1}/>
     </View>
 }

src/services/http/api.js

@@ -1,4 +1,4 @@
-let online = true;
+let online = false;
 export let baseUrl = online ? 'https://api.fast.liveplus.fun' : 'https://api.fast.dev.liveplus.fun';
 export let imgUrl = online
     ? 'https://api.fast.liveplus.fun/static/image/'