314637581
/
flossom-miniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

引入echarts

Browse Source
master
rongweikang 2 years ago
parent ef441b00f0
commit ab7a90ce81
3 changed files with 113 additions and 44 deletions
Show Stats Download Patch File Download Diff File

6
package.json
Unescape Escape View File

@ -53,15 +53,17 @@
"@tarojs/plugin-platform-weapp": "3.6.19",
"@tarojs/react": "3.6.19",
"@tarojs/runtime": "3.6.19",
"@tarojs/shared": "3.6.19",
"@tarojs/shared": "3.6.19",
"@tarojs/taro": "3.6.19",
"@visactor/taro-vchart": "^1.9.0",
"dayjs": "^1.11.10",
"echarts": "^5.5.0",
"lodash": "^4.17.15",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-redux": "^9.0.3",
"taro-ui": "^3.2.0"
"taro-ui": "^3.2.0",
"taro-react-echarts": "^1.2.2"
},
"devDependencies": {
"@babel/core": "^7.8.0",

5
src/pages/iotCarePlan/iotCarePlan.less
Unescape Escape View File

@ -206,3 +206,8 @@
.v3 {
background: linear-gradient(0deg, #ff4646, #ff6b6b, #f86f6f, #ff9494);
}
#chart {
width: 690rpx;
height: 320rpx;
}

146
src/pages/iotCarePlan/iotCarePlan.tsx
Unescape Escape View File

@ -1,8 +1,10 @@
import Taro from "@tarojs/taro";
import dayjs from "dayjs";
import classnames from "classnames";
// eslint-disable-next-line import/no-named-as-default
import React, { Component, PropsWithChildren, useEffect, useState } from "react";
import { Component, PropsWithChildren, useEffect, useState } from "react";
import Echarts from "./components/Echart/index"
import {
Block,
View,
@ -46,6 +48,8 @@ import {
deviceCommandSamples,
bleCommandSamples,
} from "@/components/bluetoot/connection/test";
import { Progress } from '@antmjs/vantui'
import {
s_to_s,
s_to_m,
@ -55,6 +59,8 @@ import {
} from "@/utils/util";
import { DeviceToolKit as DeviceToolKitWE100 } from "@flossom-npm/iot-translater-we100";
import commandMap from "@/utils/commandMap";
const deviceToolKitInstanceWE100 = new DeviceToolKitWE100("WE100", "M01");
const deviceToolKitInstanceWL200 = new DeviceToolKitWE100("WE100", "WL200");
@ -134,6 +140,8 @@ let DeviceSyncData = {
};
let deviceToolKitInstance = deviceToolKitInstanceWE100; // we100
class IotCarePlan extends Component<any, any> {
constructor(props) {
super(props);
@ -181,7 +189,7 @@ class IotCarePlan extends Component<any, any> {
errorTips: "", // 错误提示
// 模式列表
isSwitchActiveMode: false, // 是否显示弹窗切换模式
isSwitchActiveMode: true, // 是否显示弹窗切换模式
ModeList: [],
ModeType: "all", // all visor面罩 cabin舱体 yimeish医美
modeClass: "", // 1面罩 2舱体 3医美
@ -225,13 +233,13 @@ class IotCarePlan extends Component<any, any> {
});
}
componentWillUnmount() {}
componentWillUnmount() { }
componentDidShow() {
this.initData();
}
componentDidHide() {}
componentDidHide() { }
async initData() {
let objStr = getStorageSync("instrument_detail");
@ -263,8 +271,50 @@ class IotCarePlan extends Component<any, any> {
// 初始化蓝牙
// this.init();
}
getOption() {
const option = {
grid: { top: 8, right: 8, bottom: 24, left: 36 },
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
},
yAxis: {
type: 'value',
},
series: [
{
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'line',
smooth: true,
},
],
tooltip: {
trigger: 'axis',
},
// title: {
// text: 'ECharts 示例'
// },
// tooltip: {},
// xAxis: {
// data: ['A', 'B', 'C', 'D', 'E']
// },
// yAxis: {},
// series: [{
// name: '数量',
// type: 'bar',
// data: [5, 20, 36, 10, 10]
// }]
};
return option;
}
async init() {
// 查询自定义设备指令
const queryInstructionParams = {
@ -435,6 +485,7 @@ class IotCarePlan extends Component<any, any> {
};
/** 开始护理按钮：点击开始，页面进行到下一步 */
onStartNurse = async () => {
this.drawProwerPicture()
this.stepNext();
return;
let { isConnectionBlutoot } = this.state;
@ -444,6 +495,12 @@ class IotCarePlan extends Component<any, any> {
// todo 提示未连接蓝牙
}
};
// 绘制能量图
drawProwerPicture() {
}
/** 切换光照 */
onSwitchChange = async () => {
// todo
@ -949,7 +1006,7 @@ class IotCarePlan extends Component<any, any> {
this.setState({
isShowCountdown: false,
hadShowBreakTips: false,
hadShowBreakTips: false
});
},
pause: () => {
@ -1199,8 +1256,8 @@ class IotCarePlan extends Component<any, any> {
console.log("isStandStatus:" + isStandStatus);
console.log(
workStatus !== MODE_WORKING_ENUM.WORKING &&
workStatus !== MODE_WORKING_ENUM.STANDBY &&
workStatus !== MODE_WORKING_ENUM.PAUSE
workStatus !== MODE_WORKING_ENUM.STANDBY &&
workStatus !== MODE_WORKING_ENUM.PAUSE
);
if (facialMaskConnectStatus != 1) {
@ -1227,7 +1284,7 @@ class IotCarePlan extends Component<any, any> {
}
// 开始执行护理
this.handleWorkStatus(true, MODE_WORKING_ENUM.WORKING);
this.showCountdownFun(3, () => {}); // 倒计时弹窗
this.showCountdownFun(3, () => { }); // 倒计时弹窗
}
// 结束护理？
@ -1280,7 +1337,7 @@ class IotCarePlan extends Component<any, any> {
}
// 删除WL200护理历史
rmWL200NursingHistory(WL200NursingHistory, hard = false) {}
rmWL200NursingHistory(WL200NursingHistory, hard = false) { }
//蓝牙断开连接处理
bluetoothDisconnectProcessing() {
@ -1490,34 +1547,35 @@ class IotCarePlan extends Component<any, any> {
currentTime,
facialMaskConnectStatus,
} = this.state;
return (
<Block>
<Navbar titleSlot={title} isBack={true} />
<Navbar titleSlot={title} isBack />
<View catchMove>
<PopupCountdown isShow={isShowCountdown} countdown={countdown} />
<PopupConfirm
isLarge={true}
isLarge
isShow={isEndCarePlan}
isClose={true}
title="提示"
content="是否结束护理"
textAlgin="center"
cancelButtonText="取消"
confirmButtonText="确定"
isClose
title='提示'
content='是否结束护理'
textAlgin='center'
cancelButtonText='取消'
confirmButtonText='确定'
close={this.cancelEndBtn}
confirm={this.confirmEndBtn}
/>
<PopupConfirm
isLarge={true}
isLarge
isShow={isSwitchActiveMode}
isClose={true}
title="护理模式切换"
isClose
title='护理模式切换'
content={
<ModeListView
ModeID={ModeID}
activeModeID={activeModeID}
isPop={true}
isPop
isShowNurse={isShowNurse}
ModeList={ModeList}
ModeType={ModeType}
@ -1526,9 +1584,9 @@ class IotCarePlan extends Component<any, any> {
onEmitShowAll={this.openModeSwitch}
/>
}
textAlgin="center"
cancelButtonText="取消"
confirmButtonText="确定"
textAlgin='center'
cancelButtonText='取消'
confirmButtonText='确定'
close={this.cancelModeSwitchBtn}
confirm={this.confirmModeSwitchBtn}
/>
@ -1536,9 +1594,9 @@ class IotCarePlan extends Component<any, any> {
{ActiveModeItem.openSourceData && (
<PopupStepTips
isShow={isShowStepTips}
isLarge={true}
isLarge
title={"" + "准备中"}
confirmButtonText="开始护理"
confirmButtonText='开始护理'
data={ActiveModeItem.openSourceData}
close={this.closeStepTips}
/>
@ -1546,12 +1604,12 @@ class IotCarePlan extends Component<any, any> {
</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}
/>
)}
@ -1560,39 +1618,38 @@ class IotCarePlan 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}
/>
)}
</Block>
)}
{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}
@ -1619,6 +1676,8 @@ class IotCarePlan extends Component<any, any> {
isShowNurse={isShowNurse}
ActiveModeItem={ActiveModeItem}
/>
<Echarts></Echarts>
</View>
<Footer
@ -1630,7 +1689,10 @@ class IotCarePlan extends Component<any, any> {
onEmitEndPlan={this.onEndPlan}
/>
</View>
</Block>
<Block id='ccccc' style={{ width: '300px', height: '300px' }}>66666666666666666666</Block>
<Block id='myBox' style={{ width: '300px', height: '300px' }}></Block>
</Block >
);
}
}
@ -1643,4 +1705,4 @@ const mapDispatchToProps = (dispatch) => ({
// dispatch(userRefresh(data));
// },
});
export default connect(mapStateToProps, mapDispatchToProps)(IotCarePlan);
export default connect(mapStateToProps, mapDispatchToProps)(IotCarePlan);
Write Preview
Loading…
Cancel
Save