优化

src/moduleIOT/pages/iotCarePlan/FR200.less

@@ -1 +1,5 @@
 @import url(./WL200.less);
+
+.show {
+  display: none;
+}

src/moduleIOT/pages/iotCarePlan/FR200.tsx

@@ -3,16 +3,15 @@ import dayjs from "dayjs";
 import classnames from "classnames";
 import { debounce } from "lodash";
 
-// eslint-disable-next-line import/no-named-as-default
 import React, {
   Component,
   PropsWithChildren,
   useEffect,
   useState,
 } from "react";
-
-import Echarts from "./components/Echart/index";
-import Gears from "./components/Gears/index";
+/*** redux ***/
+import { connect } from "react-redux";
+/*** redux end ***/
 import {
   Block,
   View,
@@ -23,9 +22,27 @@ import {
   Button,
 } from "@tarojs/components";
 
-/*** redux ***/
-import { connect } from "react-redux";
-/*** redux end ***/
+import {
+  notifyBLECharacteristicValueChange,
+  sendCommand,
+} from "@/utils/bluetoothWXAPI";
+import {
+  deviceCommandSamples,
+  bleCommandSamples,
+} from "@/components/bluetoot/connection/wl200";
+
+import { minSecToS, s_to_ms, s_to_hms, sleep, s_to_s } from "@/utils/util";
+// import { DeviceToolKit as DeviceToolKitWE100 } from "@flossom-npm/iot-translater-we100";
+import {
+  DeviceToolKit as DeviceToolKitWM,
+  TResponseFromDevice as TResponseFromDeviceWM,
+} from "@flossom-npm/iot-translater";
+import commandMap from "@/utils/commandMap";
+import { Popup } from "@antmjs/vantui";
+import { fr200BleCommand } from "@/components/bluetoot/connection/fr200";
+
+import { go, getStorageSync, setStorageSync, msg } from "@/utils/traoAPI";
+import { InstrumentInfo } from "@/utils/Interface";
 
 /* 公共组件 */
 import Navbar from "@/components/navbar/navbar";
@@ -45,28 +62,13 @@ import Footer from "./components/Footer/FR200";
 import WaterTest from "./components/WaterTest/index";
 /* 本页组件 END */
 
-import { go, getStorageSync, setStorageSync, msg } from "@/utils/traoAPI";
-import { InstrumentInfo } from "@/utils/Interface";
+import Echarts from "./components/Echart";
+import Gears from "./components/Gears";
+
+
 import "./FR200.less";
 
-import {
-  notifyBLECharacteristicValueChange,
-  sendCommand,
-} from "@/utils/bluetoothWXAPI";
-import {
-  deviceCommandSamples,
-  bleCommandSamples,
-} from "@/components/bluetoot/connection/wl200";
 
-import { minSecToS, s_to_ms, s_to_hms, sleep, s_to_s } from "@/utils/util";
-// import { DeviceToolKit as DeviceToolKitWE100 } from "@flossom-npm/iot-translater-we100";
-import {
-  DeviceToolKit as DeviceToolKitWM,
-  TResponseFromDevice as TResponseFromDeviceWM,
-} from "@flossom-npm/iot-translater";
-import commandMap from "@/utils/commandMap";
-import { Popup } from "@antmjs/vantui";
-import { fr200BleCommand } from "@/components/bluetoot/connection/fr200";
 
 const deviceToolKitInstanceFR200 = new DeviceToolKitWM("FR200");
 let deviceToolKitInstance = deviceToolKitInstanceFR200;
@@ -190,6 +192,7 @@ class IotCarePlanFR200 extends Component<any, any> {
       // isFirstEntryMode: false, // 模式首次打开
 
       isShowHistoryMsg: false, // 是否显示正在同步历史
+      showEcharts: false
     };
   }
 
@@ -231,10 +234,10 @@ class IotCarePlanFR200 extends Component<any, any> {
   BaseModeType: string[] = ["face", "eyes"];
 
   async onLoad(option) {
-    console.log(option,'跳转过来的数据');
+    console.log(option, '跳转过来的数据');
     if (option.modeId) {
       this.setState({ activeModeID: option.modeId })
-      
+
     }
     // 保持屏幕常亮
     Taro.setKeepScreenOn({
@@ -243,11 +246,11 @@ class IotCarePlanFR200 extends Component<any, any> {
     this.initData();
     this.getInstrumentClockSummary();
     this.getInstrumentClockDetail();
-    
+
   }
-  componentDidMount() {}
+  componentDidMount() { }
 
-  componentWillUnmount() {}
+  componentWillUnmount() { }
 
   componentDidShow() {
     console.log("页面显示了");
@@ -376,7 +379,7 @@ class IotCarePlanFR200 extends Component<any, any> {
       instrumentId: id,
     };
     let res = await InstrumentInfo.modeInfoList(params);
- 
+
     if (res.data.code === 200) {
       if (res.data.data.length > 0) {
         this.setState({
@@ -392,7 +395,7 @@ class IotCarePlanFR200 extends Component<any, any> {
             }
           })
         }
-      let res1=  res.data.data.find(e =>e.id == this.state.activeModeID)
+        let res1 = res.data.data.find(e => e.id == this.state.activeModeID)
         setTimeout(() => {
           this.modeCurrentFun(res1);
         }, 100);
@@ -436,7 +439,7 @@ class IotCarePlanFR200 extends Component<any, any> {
    * @name 选中/切换护理模式
    * */
   modeCurrentFun = async (data, isNotCheck = false) => {
-    let { isShowNurse,activeModeID } = this.state;
+    let { isShowNurse, activeModeID } = this.state;
     // 护理检查改变模式，是否提示切换护理模式
     // isNotCheck为真时，不进行校验，直接切换
     this.tempModeCurrent = data;
@@ -491,8 +494,8 @@ class IotCarePlanFR200 extends Component<any, any> {
       if (data.serviceData.length > 0) {
         this.setServiceTimeData();
       }
-    
-      
+
+
     });
 
     // 开发中，暂时允许直接切换
@@ -630,9 +633,15 @@ class IotCarePlanFR200 extends Component<any, any> {
       this.showTips("检测到您的设备没有紧贴肌肤，请紧贴肌肤后重新尝试");
     });
   };
+  look() {
+    this.setState({ showEcharts: !this.state.showEcharts });
+  }
+  updata() {
+   
+  }
 
   // 绘制能量图
-  drawProwerPicture() {}
+  drawProwerPicture() { }
 
   /** 切换光照 */
   onSwitchChange = async () => {
@@ -1945,11 +1954,11 @@ class IotCarePlanFR200 extends Component<any, any> {
       let report = true;
       go(
         "/recoding/pages/face_report_one/face_report_one?id=" +
-          id +
-          "&report=" +
-          report +
-          "&obj=" +
-          JSON.stringify(obj)
+        id +
+        "&report=" +
+        report +
+        "&obj=" +
+        JSON.stringify(obj)
       );
     } else if ("moistureTest" === nursingData.workMode) {
       console.log("水分测试");
@@ -2083,6 +2092,7 @@ class IotCarePlanFR200 extends Component<any, any> {
       isShowHistoryMsg,
       isModeLock,
       TestModeStepIndex,
+      showEcharts
     } = this.state;
 
     return (
@@ -2098,19 +2108,19 @@ class IotCarePlanFR200 extends Component<any, any> {
           <PopupAlert
             isShow={isModeLock}
             zIndex={10020}
-            myClassName="level-up"
-            title="提示"
-            content="该模式即将上线，敬请期待"
-            confirmButtonText="我知道了"
-            textAlgin="center"
+            myClassName='level-up'
+            title='提示'
+            content='该模式即将上线，敬请期待'
+            confirmButtonText='我知道了'
+            textAlgin='center'
             close={this.onModeLockClose}
             confirm={this.onModeLockClose}
           />
           <PopupInstrumentUploadTips
             isShow={isFirstTipShow}
             zIndex={10020}
-            myClassName="level-up"
-            title="打卡介绍"
+            myClassName='level-up'
+            title='打卡介绍'
             data={nurseInfo}
             close={this.onTipShowClose}
             confirm={this.onTipShowClose}
@@ -2122,11 +2132,11 @@ class IotCarePlanFR200 extends Component<any, any> {
             isLarge
             isClose
             isShow={isEndCarePlan}
-            title="提示"
-            content="是否结束护理"
-            textAlgin="center"
-            cancelButtonText="取消"
-            confirmButtonText="确定"
+            title='提示'
+            content='是否结束护理'
+            textAlgin='center'
+            cancelButtonText='取消'
+            confirmButtonText='确定'
             close={this.cancelEndBtn}
             confirm={this.confirmEndBtn}
           />
@@ -2134,7 +2144,7 @@ class IotCarePlanFR200 extends Component<any, any> {
             isLarge
             isClose
             isShow={isSwitchActiveMode}
-            title="护理模式切换"
+            title='护理模式切换'
             content={
               <ModeListView
                 ModeID={ModeID}
@@ -2148,9 +2158,9 @@ class IotCarePlanFR200 extends Component<any, any> {
                 onModeLockOpen={this.onModeLockOpen}
               />
             }
-            textAlgin="center"
-            cancelButtonText="取消"
-            confirmButtonText="确定"
+            textAlgin='center'
+            cancelButtonText='取消'
+            confirmButtonText='确定'
             close={this.cancelModeSwitchBtn}
             confirm={this.confirmModeSwitchBtn}
           />
@@ -2160,7 +2170,7 @@ class IotCarePlanFR200 extends Component<any, any> {
               isShow={isShowStepTips}
               isLarge
               isFirstEntry={false}
-              confirmButtonText="知道了"
+              confirmButtonText='知道了'
               data={ActiveModeItem.openSourceData}
               close={this.closeStepTips}
             />
@@ -2169,10 +2179,10 @@ class IotCarePlanFR200 extends Component<any, any> {
           <PopupAlert
             isShow={isNotEnoughTime}
             isClose
-            title="提示"
-            content="您的本次护理时间不足，请重新护理"
-            confirmButtonText="确认"
-            textAlgin="center"
+            title='提示'
+            content='您的本次护理时间不足，请重新护理'
+            confirmButtonText='确认'
+            textAlgin='center'
             close={this.closeNotEnoughTime}
             confirm={this.closeNotEnoughTime}
           />
@@ -2181,11 +2191,11 @@ class IotCarePlanFR200 extends Component<any, any> {
             isShow={isShowErrorTipsText}
             isClose
             zIndex={10020}
-            myClassName="level-up"
-            title="提示"
+            myClassName='level-up'
+            title='提示'
             content={errorTipsText}
-            confirmButtonText="知道了"
-            textAlgin="center"
+            confirmButtonText='知道了'
+            textAlgin='center'
             close={this.closeErrorTipsText}
             confirm={this.closeErrorTipsText}
           />
@@ -2194,17 +2204,17 @@ class IotCarePlanFR200 extends Component<any, any> {
             isShow={isShowTipsSave}
             isClose
             zIndex={10020}
-            myClassName="level-up"
-            title="提示"
+            myClassName='level-up'
+            title='提示'
             content={
               <Block>
                 <View>当前模式已护理部分时间</View>
                 <View>是否保存护理记录</View>
               </Block>
             }
-            cancelButtonText="取消"
-            confirmButtonText="确认"
-            textAlgin="center"
+            cancelButtonText='取消'
+            confirmButtonText='确认'
+            textAlgin='center'
             close={this.closeTipsSave}
             cancel={this.cancelTipsSave}
             confirm={this.confirmTipsSave}
@@ -2213,11 +2223,11 @@ class IotCarePlanFR200 extends Component<any, any> {
           <PopupStatus
             isShow={isShowNursingSuccess}
             isClose
-            title="您已结束本次护理"
-            type="success"
-            content="正在上传护理记录……"
-            confirmButtonText="知道了"
-            textAlgin="center"
+            title='您已结束本次护理'
+            type='success'
+            content='正在上传护理记录……'
+            confirmButtonText='知道了'
+            textAlgin='center'
             close={() => {
               /*不需要做处理*/
             }}
@@ -2228,28 +2238,28 @@ class IotCarePlanFR200 extends Component<any, any> {
               deviceInfo={currentDevice}
               close={this.connectionClose}
               isDisconnect={!isConnectionBlutoot}
-              offlineChange={() => {}}
+              offlineChange={() => { }}
               pairingChange={this.pairingChange}
-              upgradeFun={() => {}}
+              upgradeFun={() => { }}
             />
           )}
 
           <Popup
             show={isShowHistoryMsg}
-            className="custom-popup"
+            className='custom-popup'
             overlay={false}
           >
-            <View className="sync-history-msg">正在同步护理记录...</View>
+            <View className='sync-history-msg'>正在同步护理记录...</View>
           </Popup>
         </View>
 
         <View>
-          <View className="iot-main">
-            <View className="banner-box">
+          <View className='iot-main'>
+            <View className='banner-box'>
               <View>
                 {!isShowNurse && (
                   <Video
-                    className="video-or-image"
+                    className='video-or-image'
                     src={ActiveModeItem.modeVideo}
                     loop
                   />
@@ -2259,12 +2269,12 @@ class IotCarePlanFR200 extends Component<any, any> {
                   <Block>
                     {isStopNurse ? (
                       <Image
-                        className="video-or-image"
+                        className='video-or-image'
                         src={currentServiceData.stopSource}
                       />
                     ) : (
                       <Image
-                        className="video-or-image"
+                        className='video-or-image'
                         src={currentServiceData.startSource}
                       />
                     )}
@@ -2272,25 +2282,25 @@ class IotCarePlanFR200 extends Component<any, any> {
                 )}
                 {errorTips && (
                   <Block>
-                    <View className="msg-tips">
+                    <View className='msg-tips'>
                       <Image
-                        className="msg-tips-img"
+                        className='msg-tips-img'
                         src={require("@/img/tips.png")}
                       />
-                      <View className="msg-tips-content">{errorTips}</View>
+                      <View className='msg-tips-content'>{errorTips}</View>
                     </View>
                   </Block>
                 )}
               </View>
 
-              <View className="iot-device">
-                <View className="item">
-                  <Text className="device-time">
+              <View className='iot-device'>
+                <View className='item'>
+                  <Text className='device-time'>
                     护理时间：
-                    <Text className="time">{currentTime}</Text>
+                    <Text className='time'>{currentTime}</Text>
                   </Text>
                 </View>
-                <View className="line" />
+                <View className='line' />
                 <ElectricityView
                   Electricity={Electricity}
                   matrixElectricity={matrixElectricity}
@@ -2312,18 +2322,22 @@ class IotCarePlanFR200 extends Component<any, any> {
                 onModeLockOpen={this.onModeLockOpen}
               />
             )}
+            <button onClick={this.look.bind(this)} >显示echarts </button>
+            <button onClick={this.updata.bind(this)} >添加数据 </button>
+
 
-            {(ActiveModeItem.modeType === "face" ||
-              ActiveModeItem.modeType === "eyes") && <Echarts></Echarts>}
+            <View className={classnames({ 'show': showEcharts })}><Echarts></Echarts></View>
+            {/* {(ActiveModeItem.modeType === "face" ||
+              ActiveModeItem.modeType === "eyes") && <Echarts></Echarts>} */}
 
             {(ActiveModeItem.modeType === "maskPenetration" ||
               ActiveModeItem.modeType === "essence") && (
-              <Gears
-                onEmitMinus={this.handleMinus}
-                onEmitAdd={this.handleAdd}
-                GearData={GearData}
-              ></Gears>
-            )}
+                <Gears
+                  onEmitMinus={this.handleMinus}
+                  onEmitAdd={this.handleAdd}
+                  GearData={GearData}
+                ></Gears>
+              )}
 
             {ActiveModeItem.modeType === "moistureTest" && (
               <WaterTest

src/moduleIOT/pages/iotCarePlan/components/Echart/index.tsx

@@ -2,7 +2,7 @@ import Taro from "@tarojs/taro";
 import classnames from "classnames";
 import { Block, View, Image, Text, Input } from "@tarojs/components";
 import { Popup, Progress, Slider } from "@antmjs/vantui";
-import { useRef } from "react";
+import { useEffect, useRef, useState } from "react";
 import Echarts, { EChartOption, EchartsHandle } from "taro-react-echarts";
 import echarts from "@/utils/echarts.min.js";
 
@@ -19,8 +19,8 @@ interface Props {
 function Index() {
 
   const echartsRef = useRef<EchartsHandle>(null);
-  const option: EChartOption = {
-
+  const [options, setOptions] = useState({
+    animation:false,
     grid: {
       // 让图表占满容器
       top: "28rpx",
@@ -258,14 +258,51 @@ function Index() {
         },
       },
     ],
-  };
+  })
 
   const level = [8, 7, 6, 5, 4, 3, 2];
+  const [newOptions, setNewOptions] = useState(options)
   const full = () => {
-    let box = document.getElementById("box");
-    box?.classList.add('fullscreen')
+    // let box = document.getElementById("box");
+    // box?.classList.add('fullscreen')
+
+
+    let stop = 0
+    let time = setInterval(function () {
+      stop++
+      let option = JSON.parse(JSON.stringify(options))
+      let num = Math.floor(Math.random() * 9)
+      let count = 0
+      options.series.map(item => {
+        if (item.type === 'line') {
+          item.data.splice(0, 1)
+          item.data.push(num)
+        }
+        if (item.type === 'bar') {
+          count++
+          item.data.splice(0, 1)
+          if (count <= num) {
+            item.data.push(1)
+          } else {
+            item.data.push(0)
+          }
+        }
+      })
+      console.log(option);
+      
+      // 更新图表数据
+      setNewOptions(option)
+      if (stop > 10) {
+        clearInterval(time)
+      }
+    }, 1000)
+
   }
 
+
+  useEffect(() => {
+    setOptions(newOptions)
+  }, [newOptions]); // 当 someProp 变化时执行
   // const quanping = () => {
   //     T.setPageOrientation({
   //       orientation: "portrait",
@@ -284,7 +321,7 @@ function Index() {
         <Echarts
           force-use-old-canvas='false'
           echarts={echarts}
-          option={option}
+          option={options}
           ref={echartsRef}
           // isPage={false}
           // style自定义设置echarts宽高

src/recoding/pages/moisture_test_report/moisture_test_report.tsx

@@ -1,5 +1,6 @@
 import { Block, View, Text, Image, Input, Button } from "@tarojs/components";
 import { Component, PropsWithChildren, useEffect, useState } from "react";
+import { go } from "@/utils/traoAPI";
 
 import "taro-ui/dist/style/components/button.scss"; // 按需引入
 import Taro from "@tarojs/taro";
@@ -12,7 +13,6 @@ import { setMobile } from "@/store/features/userInfo";
 import Navbar from "@/components/navbar/navbar";
 import Echarts from "./Echarts/index";
 import "./moisture_test_report.less";
-import { go } from "@/utils/traoAPI";
 
 class MoistureTestReport extends Component<any, any> {
   constructor(props) {