diff --git a/config/prod.ts b/config/prod.ts index e148666..5b660c8 100644 --- a/config/prod.ts +++ b/config/prod.ts @@ -4,7 +4,28 @@ module.exports = { }, defineConstants: { }, - mini: {}, + mini: { + debugReact: true, + webpackChain: (chain, webpack) => { + chain.merge({ + plugin: { + install: { + plugin: require('terser-webpack-plugin'), + args: [ + { + terserOptions: { + compress: true, // 默认使用terser压缩 + // mangle: false, + keep_classnames: true, // 不改变class名称 + keep_fnames: true, // 不改变函数名称 + }, + }, + ], + }, + }, + }) + }, + }, h5: { /** * WebpackChain 插件配置 diff --git a/package.json b/package.json index a6e080b..d08cd69 100644 --- a/package.json +++ b/package.json @@ -35,26 +35,25 @@ ], "author": "", "dependencies": { - "@antmjs/vantui": "^3.2.2", + "@antmjs/vantui": "^3.3.5", "@flossom-npm/iot-translater": "^1.0.8", "@flossom-npm/iot-translater-we100": "^1.1.1", "@reduxjs/toolkit": "^2.0.1", - "@taroify/core": "^0.1.1-alpha.8", - "@tarojs/components": "3.6.19", - "@tarojs/helper": "3.6.19", - "@tarojs/plugin-framework-react": "3.6.19", + "@tarojs/components": "~3.6.24", + "@tarojs/helper": "~3.6.24", + "@tarojs/plugin-framework-react": "~3.6.24", "@tarojs/plugin-html": "^3.6.20", - "@tarojs/plugin-platform-alipay": "3.6.19", - "@tarojs/plugin-platform-h5": "3.6.19", - "@tarojs/plugin-platform-jd": "3.6.19", - "@tarojs/plugin-platform-qq": "3.6.19", - "@tarojs/plugin-platform-swan": "3.6.19", - "@tarojs/plugin-platform-tt": "3.6.19", - "@tarojs/plugin-platform-weapp": "3.6.19", - "@tarojs/react": "3.6.19", - "@tarojs/runtime": "3.6.19", - "@tarojs/shared": "3.6.19", - "@tarojs/taro": "3.6.19", + "@tarojs/plugin-platform-alipay": "~3.6.24", + "@tarojs/plugin-platform-h5": "~3.6.24", + "@tarojs/plugin-platform-jd": "~3.6.24", + "@tarojs/plugin-platform-qq": "~3.6.24", + "@tarojs/plugin-platform-swan": "~3.6.24", + "@tarojs/plugin-platform-tt": "~3.6.24", + "@tarojs/plugin-platform-weapp": "~3.6.24", + "@tarojs/react": "~3.6.24", + "@tarojs/runtime": "~3.6.24", + "@tarojs/shared": "~3.6.24", + "@tarojs/taro": "~3.6.24", "dayjs": "^1.11.10", "echarts": "^5.5.0", "lodash": "^4.17.15", @@ -68,19 +67,19 @@ "@babel/core": "^7.8.0", "@babel/runtime": "^7.7.7", "@pmmmwh/react-refresh-webpack-plugin": "^0.5.5", - "@tarojs/cli": "3.6.19", - "@tarojs/taro-loader": "3.6.19", - "@tarojs/webpack5-runner": "3.6.19", + "@tarojs/cli": "~3.6.24", + "@tarojs/taro-loader": "~3.6.24", + "@tarojs/webpack5-runner": "~3.6.24", "@types/node": "^18.15.11", "@types/react": "^18.0.0", "@types/webpack-env": "^1.13.6", "@typescript-eslint/eslint-plugin": "^5.20.0", "@typescript-eslint/parser": "^5.20.0", "babel-plugin-import": "^1.13.8", - "babel-preset-taro": "3.6.19", + "babel-preset-taro": "3.6.24", "cache-loader": "^4.1.0", "eslint": "^8.12.0", - "eslint-config-taro": "3.6.19", + "eslint-config-taro": "~3.6.24", "eslint-plugin-import": "^2.12.0", "eslint-plugin-react": "^7.8.2", "eslint-plugin-react-hooks": "^4.2.0", diff --git a/src/app.config.ts b/src/app.config.ts index a3ad8a5..a4e9b69 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -17,7 +17,6 @@ export default defineAppConfig({ "pages/instrument_manage/index", "pages/instrument_detail/index", "pages/instrumentClickinUpload/index", - "pages/iotCarePlan/iotCarePlan", 'pages/privacyPolicy/privacyPolicy', 'pages/userPolicy/userPolicy', 'pages/about/about', @@ -82,5 +81,13 @@ export default defineAppConfig({ navigationBarTextStyle: 'black', // enablePullDownRefresh: true }, - requiredPrivateInfos: ["getLocation"] + requiredPrivateInfos: ["getLocation"], + subPackages: [ + { + root: 'moduleIOT', + pages: [ + "pages/iotCarePlan/iotCarePlan", + ] + } + ] }) diff --git a/src/components/bluetoot/connection/index.tsx b/src/components/bluetoot/connection/index.tsx index 6281810..91da10e 100644 --- a/src/components/bluetoot/connection/index.tsx +++ b/src/components/bluetoot/connection/index.tsx @@ -36,14 +36,12 @@ import { } from "@/utils/util"; // const log = require("@/utils/log"); import commandMap from "@/utils/commandMap"; -import { bleCommandSamples } from "./test"; +import { bleCommandSamples } from "./wl200"; import { DeviceToolKit as DeviceToolKitWE100 } from "@flossom-npm/iot-translater-we100"; const deviceToolKitInstanceWL200 = new DeviceToolKitWE100("WL200", "WL200"); deviceToolKitInstanceWL200.setDebug(true); -// const _deviceToolKitInstanceWL200 = new DeviceToolKitWE100("WE100", "WL200"); - const deviceToolKitInstanceM01 = new DeviceToolKitWE100("WE100", "M01"); deviceToolKitInstanceM01.setDebug(true); @@ -695,6 +693,7 @@ class ConnectionBluetoot extends Component { ? deviceToolKitInstanceWL200.toBleCommand(versionCommand as any) : deviceToolKitInstanceM01.toBleCommand(versionCommand as any); + console.log(otaDeviceType, " value", value); sendCommand({ value }); } } diff --git a/src/components/bluetoot/connection/test.js b/src/components/bluetoot/connection/wl200.js similarity index 100% rename from src/components/bluetoot/connection/test.js rename to src/components/bluetoot/connection/wl200.js diff --git a/src/components/bluetoot/device-connection-popup/device-connection-popup.less b/src/components/bluetoot/device-connection-popup/device-connection-popup.less index fdee03f..1be0996 100644 --- a/src/components/bluetoot/device-connection-popup/device-connection-popup.less +++ b/src/components/bluetoot/device-connection-popup/device-connection-popup.less @@ -99,6 +99,7 @@ // width: 100%; // height: 100%; overflow: hidden; + background-color: #eee; } .error-block { diff --git a/src/components/bluetoot/device-connection-popup/device-connection-popup.tsx b/src/components/bluetoot/device-connection-popup/device-connection-popup.tsx index 88cc794..a4cdf1b 100644 --- a/src/components/bluetoot/device-connection-popup/device-connection-popup.tsx +++ b/src/components/bluetoot/device-connection-popup/device-connection-popup.tsx @@ -102,6 +102,7 @@ export default class DeviceConnectPopup extends Component { onClick={this.onClose} > + {/* 非错误弹窗 */} {!error && ( { {data.bluetoothConnectingTitle} - {this.isImage(data.bluetoothConnecting) ? ( + {!this.isImage(data.bluetoothConnecting) ? ( )} + {/* 错误与失败弹窗 */} {error && ( { {data.bluetoothConnectFailTitle} - + + + + + + + 额头 + + + + + + 1档 + + + + + + + + 左脸颊 + + + + + + 1档 + + + + + + + + 右脸颊 + + + + + + 1档 + + + + + + + + + + + ); +} + +export default Index; diff --git a/src/pages/iotCarePlan/components/ElectricityView/index.tsx b/src/moduleIOT/pages/iotCarePlan/components/ElectricityView/index.tsx similarity index 100% rename from src/pages/iotCarePlan/components/ElectricityView/index.tsx rename to src/moduleIOT/pages/iotCarePlan/components/ElectricityView/index.tsx diff --git a/src/pages/iotCarePlan/components/Footer/index.less b/src/moduleIOT/pages/iotCarePlan/components/Footer/index.less similarity index 100% rename from src/pages/iotCarePlan/components/Footer/index.less rename to src/moduleIOT/pages/iotCarePlan/components/Footer/index.less diff --git a/src/pages/iotCarePlan/components/Footer/index.tsx b/src/moduleIOT/pages/iotCarePlan/components/Footer/index.tsx similarity index 90% rename from src/pages/iotCarePlan/components/Footer/index.tsx rename to src/moduleIOT/pages/iotCarePlan/components/Footer/index.tsx index bffa3e9..3f63092 100644 --- a/src/pages/iotCarePlan/components/Footer/index.tsx +++ b/src/moduleIOT/pages/iotCarePlan/components/Footer/index.tsx @@ -64,7 +64,7 @@ function Index({ 启动光照 @@ -73,7 +73,7 @@ function Index({ 暂停光照 @@ -91,7 +91,7 @@ function Index({ @@ -103,7 +103,7 @@ function Index({ @@ -117,7 +117,7 @@ function Index({ 结束护理 diff --git a/src/pages/iotCarePlan/components/ModeContent/index.less b/src/moduleIOT/pages/iotCarePlan/components/ModeContent/index.less similarity index 100% rename from src/pages/iotCarePlan/components/ModeContent/index.less rename to src/moduleIOT/pages/iotCarePlan/components/ModeContent/index.less diff --git a/src/pages/iotCarePlan/components/ModeContent/index.tsx b/src/moduleIOT/pages/iotCarePlan/components/ModeContent/index.tsx similarity index 100% rename from src/pages/iotCarePlan/components/ModeContent/index.tsx rename to src/moduleIOT/pages/iotCarePlan/components/ModeContent/index.tsx diff --git a/src/pages/iotCarePlan/components/ModeList/index.less b/src/moduleIOT/pages/iotCarePlan/components/ModeList/index.less similarity index 100% rename from src/pages/iotCarePlan/components/ModeList/index.less rename to src/moduleIOT/pages/iotCarePlan/components/ModeList/index.less diff --git a/src/pages/iotCarePlan/components/ModeList/index.tsx b/src/moduleIOT/pages/iotCarePlan/components/ModeList/index.tsx similarity index 99% rename from src/pages/iotCarePlan/components/ModeList/index.tsx rename to src/moduleIOT/pages/iotCarePlan/components/ModeList/index.tsx index 8a2ffdc..395d26e 100644 --- a/src/pages/iotCarePlan/components/ModeList/index.tsx +++ b/src/moduleIOT/pages/iotCarePlan/components/ModeList/index.tsx @@ -53,7 +53,7 @@ function Index({ 全部模式 )} diff --git a/src/pages/iotCarePlan/iotCarePlan.less b/src/moduleIOT/pages/iotCarePlan/iotCarePlan.less similarity index 100% rename from src/pages/iotCarePlan/iotCarePlan.less rename to src/moduleIOT/pages/iotCarePlan/iotCarePlan.less diff --git a/src/pages/iotCarePlan/iotCarePlan.tsx b/src/moduleIOT/pages/iotCarePlan/iotCarePlan.tsx similarity index 96% rename from src/pages/iotCarePlan/iotCarePlan.tsx rename to src/moduleIOT/pages/iotCarePlan/iotCarePlan.tsx index a6ccd63..c84de6d 100644 --- a/src/pages/iotCarePlan/iotCarePlan.tsx +++ b/src/moduleIOT/pages/iotCarePlan/iotCarePlan.tsx @@ -10,7 +10,7 @@ import React, { useState, } from "react"; -import Echarts from "./components/Echart/index"; +// import Echarts from "./components/Echart/index"; import { Block, View, @@ -54,7 +54,7 @@ import { import { deviceCommandSamples, bleCommandSamples, -} from "@/components/bluetoot/connection/test"; +} from "@/components/bluetoot/connection/wl200"; import { minSecToS, s_to_ms, s_to_hms, sleep } from "@/utils/util"; import { DeviceToolKit as DeviceToolKitWE100 } from "@flossom-npm/iot-translater-we100"; @@ -206,8 +206,8 @@ class IotCarePlan extends Component { // 上一次护理记录未生成,是否继续连接设备 isShowReReadRecordConnect: false, - // 按钮是否可运行 - isFooterBtnDisabled: false, + // 按钮是否不可运行 + isFooterBtnDisabled: true, isFirstEntryMode: false, // 模式首次打开 }; } @@ -373,9 +373,9 @@ class IotCarePlan extends Component { ModeList: res.data.data, }); - setTimeout(() => { - this.modeCurrentFun(res.data.data[0]); - }); + // setTimeout(() => { + // this.modeCurrentFun(res.data.data[0]); + // }, 100); } else { this.setState({ ModeList: res.data.data }); } @@ -418,6 +418,11 @@ class IotCarePlan extends Component { // isNotCheck为真时,不进行校验,直接切换 this.tempModeCurrent = data; + // 仅在未开始护理前,切换模式的时候提示模式弹窗 + if (!this.state.isShowNurse) { + this.openStepTips(); + } + // 如果按钮不可点击则报错,内部自带检查底部按钮函数 this.onEmitErrorTips(); if (!isNotCheck) { @@ -426,7 +431,6 @@ class IotCarePlan extends Component { } let { isShowNurse } = this.state; - let currentServiceData = { startSource: "", stopSource: "", @@ -460,11 +464,10 @@ class IotCarePlan extends Component { if (isShowNurse) { if (!this.footerIsDisabled()) { this.stepNext(); // 如果切换模式,则不执行开始逻辑 - return; + setTimeout(() => { + this.onNursingTap("switch"); + }, 800); } - setTimeout(() => { - this.onNursingTap("switch"); - }, 800); } }; /** 设备运行中切换模式 */ @@ -556,7 +559,14 @@ class IotCarePlan extends Component { // 如果检查通过,可运行,则执行下一步 if (!this.footerIsDisabled()) { this.stepNext(); - this.openStepTips(); // 仅在进入运行页的时候弹窗 + + setTimeout(() => { + this.onNursingTap(); + // 倒计时弹窗: 倒计时完成后,自动开始,并判断弹窗 + let downNum = CountDownTime[this.state.ActiveModeItem.modeType] || 3; + this.showCountdownFun(downNum, () => {}); + }, 500); + return; } // 如果检查失败,则报错 @@ -568,19 +578,21 @@ class IotCarePlan extends Component { * @description isCabinMode是否舱体模式。 0.检测面罩与舱体是否仍在连接中,需要分离 1.检测是否连接失败,需要重新连接 */ onEmitErrorTips = async () => { - let { ActiveModeItem } = this.state; + setTimeout(() => { + let { ActiveModeItem } = this.state; - // 按钮不可点击时,提示报错 - let isDisabled = this.footerIsDisabled(); - if (isDisabled) { - if (ActiveModeItem.isCabinMode === 0) { - this.showTips("检测到面罩与舱体仍在连接中,该模式需要分离面罩和舱体"); - } else { - this.showTips( - "检测到面罩与舱体未连接成功,请确认面罩是否和舱体连接并接通舱体电源" - ); + // 按钮不可点击时,提示报错 + let isDisabled = this.footerIsDisabled(); + if (isDisabled) { + if (ActiveModeItem.isCabinMode === 0) { + this.showTips("检测到面罩与舱体仍在连接中,该模式需要分离面罩和舱体"); + } else { + this.showTips( + "检测到面罩与舱体未连接成功,请确认面罩是否和舱体连接并接通舱体电源" + ); + } } - } + }); }; // 绘制能量图 @@ -697,6 +709,9 @@ class IotCarePlan extends Component { this.onEmitErrorTips(); }, 500); } + setTimeout(() => { + this.footerIsDisabled(); + }, 100); break; default: console.log("监听到到设备连接状态改变 this.footerIsDisabled()"); @@ -715,6 +730,9 @@ class IotCarePlan extends Component { this.setState({ isStandStatus: isStandDevice, }); + setTimeout(() => { + this.footerIsDisabled(); + }); // 连上面罩后, 获取仪器记录, 与缓存信息对比 if (!this.hadGotInstrumentHistoryData) { @@ -894,18 +912,18 @@ class IotCarePlan extends Component { }); /** - * 延迟500毫秒获取附属设备状态 + * 延迟600毫秒获取附属设备状态 */ const querySubDeviceArrayBuffer = deviceToolKitInstance.toBleCommand({ ...bleCommandSamples.querySubDevice, queryType: "WL200", } as any); setTimeout(() => { - console.log("发送查询指令"); + console.log("发送查询附属设备指令 querySubDeviceArrayBuffer"); sendCommand({ value: querySubDeviceArrayBuffer, }); - }, 500); + }, 600); /** * 延迟500毫秒获取设备电量 @@ -914,7 +932,7 @@ class IotCarePlan extends Component { bleCommandSamples.queryDeviceStatus as any ); setTimeout(() => { - console.log("发送查询设备指令"); + console.log("发送查询设备电量指令"); sendCommand({ value: queryDeviceArrayBuffer, }); @@ -1296,11 +1314,11 @@ class IotCarePlan extends Component { const { ActiveModeItem, isStandStatus, facialMaskConnectStatus } = this.state; - if (isStandStatus === 1 && ActiveModeItem.isCabinMode === 0) { + if (isStandStatus === true && ActiveModeItem.isCabinMode === 0) { console.log("已连接舱体,只可选择舱体模式"); return; } - if (isStandStatus === 0 && ActiveModeItem.isCabinMode === 1) { + if (isStandStatus === false && ActiveModeItem.isCabinMode === 1) { console.log("未连接舱体!"); return; } @@ -1450,7 +1468,7 @@ class IotCarePlan extends Component { // 仪器缓存模式,判断是否存在于现有模式中 let recordModeItem = ModeList.find((item) => { - return item.id == WL200NursingHistory.id; + return item.id == WL200NursingHistory.currentServiceData.id; }); if (!WL200NursingHistory || !recordModeItem) { console.log("仪器有数据, 但是缓存没有数据, 忽略"); @@ -1820,8 +1838,11 @@ class IotCarePlan extends Component { pairingChange = () => { this.setState({ isConnectShow: false, + isShowNurse: true, + }); + setTimeout(() => { + this.onNursingTap("switch"); }); - this.onNursingTap(); }; connectionClose = () => { this.setState({ @@ -1894,22 +1915,17 @@ class IotCarePlan extends Component { // 如果舱体状态和模式类型不相等,则禁用 let isFooterBtnDisabled = false; - if (isStandStatus) { - if (!isCanClick) { - isFooterBtnDisabled = true; - } - } else { - if (!isCanClick) { - isFooterBtnDisabled = true; - } + if (!isCanClick) { + isFooterBtnDisabled = true; } - + console.log("isCanClick", isCanClick); + console.log("isFooterBtnDisabled", isFooterBtnDisabled); // 仅在值变化时更新state - if (isFooterBtnDisabled !== this.state.isFooterBtnDisabled) { - this.setState({ - isFooterBtnDisabled: isFooterBtnDisabled, - }); - } + // if (isFooterBtnDisabled !== this.state.isFooterBtnDisabled) { + this.setState({ + isFooterBtnDisabled: isFooterBtnDisabled, + }); + // } return isFooterBtnDisabled; // 数据更新有延迟,返回用于判断 }; @@ -1967,6 +1983,8 @@ class IotCarePlan extends Component { { {errorTips} diff --git a/src/pages/index/index.tsx b/src/pages/index/index.tsx index c1274ce..7029db1 100644 --- a/src/pages/index/index.tsx +++ b/src/pages/index/index.tsx @@ -256,7 +256,7 @@ class Index extends Component { } // 页面初始化 - async initData() { + initData = async () => { let token = getStorageSync("token"); if (!token) { // 如果token过期,先登录,登录完成后自动初始化 @@ -265,7 +265,7 @@ class Index extends Component { // token没过期,直接请求数据 this.initPageData(); } - } + }; initPageData = async () => { const mobile = Taro.getStorageSync("mobile"); @@ -293,7 +293,9 @@ class Index extends Component { await this.unbindingInstrumentInfoList(); // 获取未绑定设备 await this.getInstrumentInfoBySerial(); // 扫码序列号查询:注册后才调用,因为扫码未注册直接跳转注册页 + console.log("this.props.isShowIndexFlag", this.props.isShowIndexFlag); if (!this.props.isShowIndexFlag) { + this.initDeviceNursingHistory(); this.GetSitePopupList(); // 全局内存缓存,仅初次进入首页运行 this.props.setIndexFlag(true); @@ -793,13 +795,13 @@ class Index extends Component { */ pairingChange = (e) => { console.log("===epairingChange===》", e); - go("/pages/iotCarePlan/iotCarePlan"); // 画页面直接跳转 + go("/moduleIOT/pages/iotCarePlan/iotCarePlan"); // 画页面直接跳转 this.connectionClose(); }; async goIot() { - go("/pages/iotCarePlan/iotCarePlan"); // 画页面直接跳转 + go("/moduleIOT/pages/iotCarePlan/iotCarePlan"); // 画页面直接跳转 // return; } @@ -905,7 +907,9 @@ class Index extends Component { isShowReConnectDeviceRecordWL200: false, }); - // this.goNursing() + let item = getStorageSync("instrument_detail"); + this.setState({ connectInstrument: item }); + setTimeout(() => this.bindBlockLeft()); }; // 扫码绑定必须先完成注册弹窗:确定以后删除扫码缓存,防止死循环 @@ -1005,8 +1009,8 @@ class Index extends Component { 是否重新读取 } - cancelButtonText="暂不绑定" - confirmButtonText="确认" + cancelButtonText="取消" + confirmButtonText="连接设备" textAlgin="center" close={this.closeReConnectDeviceRecordWL200} confirm={this.confirmReConnectDeviceRecordWL200} diff --git a/src/pages/instrument/instrument.tsx b/src/pages/instrument/instrument.tsx index ce70065..628db83 100644 --- a/src/pages/instrument/instrument.tsx +++ b/src/pages/instrument/instrument.tsx @@ -500,6 +500,7 @@ export default class Instrument extends Component { } - cancelButtonText="暂不绑定" - confirmButtonText="确认" + cancelButtonText="取消" + confirmButtonText="连接设备" textAlgin="center" close={this.closeReConnectDeviceRecordWL200} confirm={this.confirmReConnectDeviceRecordWL200} diff --git a/src/pages/iotCarePlan/components/Echart/index.tsx b/src/pages/iotCarePlan/components/Echart/index.tsx deleted file mode 100644 index cacfc80..0000000 --- a/src/pages/iotCarePlan/components/Echart/index.tsx +++ /dev/null @@ -1,569 +0,0 @@ -import Taro from '@tarojs/taro'; -import classnames from 'classnames'; -import { Block, View, Image, Text } from '@tarojs/components'; -import { Popup, Progress, Slider } from '@antmjs/vantui'; -import { useRef } from 'react' -import Echarts, { EChartOption, EchartsHandle } from 'taro-react-echarts' -import echarts from '@/utils/echarts.min.js' -import './index.less'; - -interface Props { - Electricity: any; - matrixElectricity: any; - facialMaskConnectStatus: any; -} - -function Index() { - const stepIndex = 0 - const testIndex = 1 - - const stepList = [ - { - value: 'Step1', - name: '额头', - finish: false, - }, - { - value: 'Step2', - name: '左脸颊', - finish: false, - }, - { - value: 'Step3', - name: '右脸颊', - finish: false, - }, - ] - - const gearLevel = { - currentGear: null, - //现在工作的档位 - currentGearMode: 'forehead', - //现在工作模式 - forehead: 5, - leftCheek: 5, - rightCheek: 5, - } - const echartsRef = useRef(null) - const option: EChartOption = { - grid: { // 让图表占满容器 - top: '28rpx', - left: '18rpx', - right: '28rpx', - bottom: '17rpx' - }, - xAxis: { - // name: '', - // nameGap: 5, - // nameTextStyle: { - // color: '#e4e4e4', - // fontSize:7 - // }, - type: 'category', - axisLine: { - //坐标轴轴线相关设置。数学上的x轴 - show: true, - lineStyle: { - color: '#cccccc' - } - }, - axisLabel: { - //坐标轴刻度标签的相关设置 - color: '#cccccc', - fontSize: 8 - }, - axisTick: { - show: false - }, - data: [ - '00:01', - '00:02', - '00:03', - '00:04', - '00:05', - '00:06', - '00:07', - '00:08', - '00:09', - '00:10' - ] - }, - yAxis: { - type: 'value', - min: 0, - max: 8, - splitNumber: 8, - splitLine: { - show: false, - lineStyle: { - color: '#cccccc', - type: [4, 2], - dashOffset: 4 - } - }, - axisLine: { - show: false - }, - axisLabel: { - show: false - }, - axisTick: { - show: false - } - }, - visualMap: { - z: 1, - top: 0, - right: 0, - seriesIndex: 0, - show: false, - pieces: [ - { - gt: 0, - lte: 1, - color: '#fff8c9' - }, - { - gt: 1, - lte: 2, - color: '#fff0c6' - }, - { - gt: 2, - lte: 3, - color: '#ffe5c3' - }, - { - gt: 3, - lte: 4, - color: '#ffdbbf' - }, - { - gt: 4, - lte: 5, - color: '#ffcfbb' - }, - { - gt: 5, - lte: 6, - color: '#ffbab5' - }, - { - gt: 6, - lte: 7, - color: '#ffb4b3' - }, - { - gt: 7, - lte: 8, - color: '#ffb4b3' - } - ], - outOfRange: { - color: '#ff8410' - } - }, - series: [ - { - data: [2, 3, 5, 3, 5, 6, 8, 5, 6, 4], - type: 'line', - smooth: true, - z: 1, - areaStyle: {}, - color: 'red' - }, - { - data: [2, 3, 5, 3, 5, 6, 8, 5, 6, 4], - type: 'line', - smooth: true, - symbolSize: 5, - lineStyle: { - color: '#ff8410', - width: 1 - }, - itemStyle: { - color: '#ff8410' - } - }, - { - name: 'a', - data: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1], - type: 'bar', - barWidth: 12, - z: 2, - stack: 'x', - visualMap: false, - itemStyle: { - color: '#ffcf56' - } - }, - { - name: 'b', - data: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1], - type: 'bar', - z: 2, - stack: 'x', - visualMap: false, - itemStyle: { - color: '#febb22' - } - }, - { - name: 'c', - data: [0, 1, 1, 1, 1, 1, 1, 1, 1, 1], - type: 'bar', - z: 2, - stack: 'x', - visualMap: false, - itemStyle: { - color: '#ffac28' - } - }, - { - name: 'd', - data: [0, 0, 1, 0, 1, 1, 1, 1, 1, 1], - type: 'bar', - z: 2, - stack: 'x', - visualMap: false, - itemStyle: { - color: '#ff8410' - } - }, - { - name: 'e', - data: [0, 0, 1, 0, 1, 1, 1, 1, 1, 0], - type: 'bar', - z: 2, - stack: 'x', - visualMap: false, - itemStyle: { - color: '#f85804' - } - }, - { - name: 'f', - data: [0, 0, 0, 0, 0, 1, 1, 0, 1, 0], - type: 'bar', - z: 2, - stack: 'x', - visualMap: false, - itemStyle: { - color: '#e02e14' - } - }, - { - name: 'h', - data: [0, 0, 0, 0, 0, 0, 1, 0, 0, 0], - type: 'bar', - z: 2, - stack: 'x', - visualMap: false, - itemStyle: { - color: '#b30016' - } - }, - { - name: 'i', - data: [0, 0, 0, 0, 0, 0, 1, 0, 0, 0], - type: 'bar', - z: 2, - stack: 'x', - visualMap: false, - itemStyle: { - color: '#750010' - } - } - ] - } - - const level = [8, 7, 6, 5, 4, 3, 2] - - return ( - - - - - - 实时能量 - { - level.map(item => ( - - {item}8 - ) - ) - } - - 1 - - 时间 - - - - - - - - - {stepList.map((item, index) => { - return ( - - - - - {item.value} - - {index != 2 && ( - - )} - - {item.name} - - ) - })} - - - 通过小紫弹的水分测试功能,对脸部的额头、左脸颊、右脸颊三个区域进行水分检测,并定制适合您的促渗档位方案 - - - - - - {stepList.map((item, index) => { - return ( - - {stepIndex > index && ( - - )} - {item.value} - {item.name} - - ) - })} - - - - - {stepList[stepIndex].name + '水分测试'} - - {/* */} - - {stepList[stepIndex].finish && 80 >= 99 ? ( - - ) : ( - - )} - {/* */} - - {/* */} - {/* 请参考视频指引,将仪器紧贴额头区域 */} - {/* */} - - - 请参考视频指引,将仪器紧贴 - {(testIndex == 1 || - testIndex == 2 || - testIndex == 4) && ( - - {stepList[stepIndex].name + '区域。'} - - )} - {testIndex == 1 && ( - ,并点击下方启动检测按钮进行测试 - )} - - - - - - - - - - 档位调节 - - - 额头 - - - - - {gearLevel.forehead + '档'} - - - - } - > - - - 左脸颊 - - - - - {gearLevel.leftCheek + '档'} - - - - } - > - - - 右脸颊 - - - - - {gearLevel.rightCheek + '档'} - - - - } - > - - {/* - {(10).map((item, index) => { - return ( - - {item + 1} - - ) - })} - */} - - - - - - - ); - - -} - - - -export default Index; diff --git a/src/pages/moisture_test_report/moisture_test_report.less b/src/pages/moisture_test_report/moisture_test_report.less new file mode 100644 index 0000000..9ce13f2 --- /dev/null +++ b/src/pages/moisture_test_report/moisture_test_report.less @@ -0,0 +1,571 @@ +page { + background: #F8F8F8; +} + +.moisture_test_report { + padding: 0 30rpx 190rpx; +} + +.moisture_test_report .time { + font-size: 36rpx; + font-weight: 500; + color: #000000; + line-height: 1; + padding: 38rpx 0; +} + +.report_data { + position: relative; + width: 100%; + height: 850rpx; + background: #FFFFFF; + border-radius: 30rpx; +} + +.report_data .moisture_block { + width: 160rpx; + height: 80rpx; + border-radius: 20rpx; + padding: 14rpx; + box-sizing: border-box; +} + +.report_data .moisture_img { + width: 50rpx; + height: 50rpx; + border-radius: 50%; +} + +.report_data .forehead { + position: absolute; + top: 52rpx; + left: 28rpx; + /*background: #FFEBDC;*/ +} + +.report_data .left_face { + position: absolute; + top: 172rpx; + left: 28rpx; + /*background: #FFE3E3;*/ +} + +.report_data .right_face { + position: absolute; + top: 172rpx; + right: 41rpx; + /*background: #F8F8F8;*/ +} + +.report_data .pos_info { + margin-left: 7rpx; +} + +.report_data .pos_info .top { + font-size: 20rpx; + font-weight: 500; + color: #000000; + line-height: 1; +} + +.report_data .pos_info .bottom { + font-size: 18rpx; + font-weight: 500; + color: #999999; + line-height: 1; + margin-top: 11rpx; +} + +.report_data .example_box { + position: relative; + width: 100%; + height: 309rpx; + /*background: #ff6700;*/ +} + +.report_data .example_box image { + position: absolute; + top: 79rpx; + left: 50%; + transform: translateX(-50%); + width: 230rpx; + height: 230rpx; + border-radius: 50%; +} + +.report_data .example_box .line1 { + position: absolute; + top: 120rpx; + left: 180rpx; + width: 170rpx; + height: 1rpx; + transform: rotate(17deg); + background: #D0D4DF; +} + +.report_data .example_box .line2 { + position: absolute; + top: 211rpx; + left: 185rpx; + width: 135rpx; + height: 1rpx; + background: #D0D4DF; +} + +.report_data .example_box .line3 { + position: absolute; + top: 209rpx; + right: 200rpx; + width: 106rpx; + height: 1rpx; + background: #D0D4DF; +} + +.moisture_level_info .level_info { + padding: 36rpx 38rpx 0 33rpx; +} + +.moisture_level_info .level_info .items { + padding: 8rpx 0; +} + +.level_info .pos_name { + min-width: 83rpx; + font-size: 28rpx; + font-weight: 500; + color: #000000; +} + +.level_info .progress { + overflow: hidden; + position: relative; + flex: 1; + height: 12rpx; + border-radius: 6rpx; + background: #F8F8F8; + margin: 0 51rpx 0 45rpx; +} + +.level_info .progress_width { + position: absolute; + top: 0; + left: 0; + height: 100%; +} + +.level_info .forehead_progress { + background: #FFC58C; + width: 30%; +} + +.level_info .left_face_progress { + background: #FF9393; + width: 20%; +} + +.level_info .right_face_progress { + background: #C2E5F3; + width: 70%; +} + +.level_info .level { + font-size: 26rpx; + font-weight: 500; + color: #666666; +} + +.moisture_level { + margin-top: 34rpx; +} + +.moisture_level .level_txt { + font-size: 26rpx; + font-weight: 500; + color: #000000; + line-height: 1; +} + +.moisture_level .level_txt .txt { + margin-left: 31rpx; +} + +.circle { + width: 14rpx; + height: 14rpx; + background: #C2E5F3; + border-radius: 50%; +} + +.serious { + background: #FF9393; +} + +.moderate { + background: #FFC58C; +} + +.slight { + background: #E5F3F9; +} + +.normal { + background: #C2E5F3; +} + +.sufficient { + background: #9FDBF3; +} + +.level_list { + padding: 0 33rpx; + flex-wrap: wrap; + margin-top: 40rpx; +} + +.level_list .txt { + font-size: 24rpx; + font-weight: 500; + color: #999999; + margin-left: 29rpx; +} + +.level_list .items { + width: 50%; + padding: 7rpx 0; +} + +.moisture_level .pour { + padding: 0 32rpx; + font-size: 24rpx; + font-weight: 500; + color: #999999; + line-height: 1; + margin-top: 36rpx; +} + +.report_chart { + width: 100%; + height: 500rpx; + background: #FFFFFF; + border-radius: 30rpx; + margin: 20rpx 0; +} + +.report_chart .chart_title { + padding: 41rpx 37rpx 0; +} + +.common_title { + font-size: 28rpx; + font-weight: bold; + color: #000000; +} + +.gear_recommend { + width: 100%; + height: 358rpx; + background: #FFFFFF; + border-radius: 30rpx; +} + +.container { + width: 100%; + /*height: 100%;*/ + height: 460rpx; +} + +ec-canvas { + width: 100%; + height: 100%; +} + +.gear_recommend { + padding: 0 39rpx; + box-sizing: border-box; +} + +.gear_recommend .gear_header { + padding: 29rpx 0rpx 38rpx; +} + +.gear_recommend .gear_header .gear_title { + padding-left: 2rpx; +} + +.gear_header .gear_btn { + height: 60rpx; + line-height: 60rpx; + background: #000000; + border-radius: 30rpx; + padding: 0 29rpx; + font-size: 26rpx; + font-weight: 500; + color: #FFFFFF; +} + +.gear_content .left_content { + text-align: center; +} + +.gear_content .left_content .banner_img { + width: 140rpx; + height: 140rpx; + border-radius: 20rpx; +} + +.gear_content .left_content .type { + font-size: 26rpx; + font-weight: 500; + color: #000000; + line-height: 1; + margin-top: 25rpx; +} + +.gear_content .right_content { + flex: 1; + height: 190rpx; + background: #f8f8f8; + border-radius: 30rpx; + margin-left: 34rpx; +} + +.right_content .gear_list { + width: 100%; +} + +.right_content .gear_list .items { + flex-direction: column; + flex: 1; +} + +.right_content .gear_list .items .gear_img { + width: 59rpx; + height: 57rpx; +} + +.right_content .gear_list .items .name { + font-size: 26rpx; + font-weight: 500; + color: #000000; + line-height: 1; + padding: 26rpx 0 12rpx; +} + +.right_content .gear_list .items .level { + font-size: 24rpx; + font-weight: 500; + color: #666666; + line-height: 1; +} + +.go_clock_in { + position: fixed; + bottom: 0; + left: 0; + width: 100%; + height: 153rpx; + background: #ffffff; + padding: 0 30rpx; + box-sizing: border-box; + box-shadow: 0rpx -3rpx 7rpx 1rpx rgba(173,191,207,0.21); + border-bottom: 21rpx solid #ffffff; +} + +.go_clock_in image { + width: 10rpx; + height: 20rpx; + margin-left: 15rpx; +} + +.go_clock_in .jump_box { + margin: 0 14rpx 0 49rpx; + /*box-sizing: border-box;*/ +} + +.go_clock_btn { + flex: 1; + height: 90rpx; + line-height: 90rpx; + background: #000000; + border-radius: 45rpx; + text-align: center; + font-size: 32rpx; + font-weight: bold; + color: #FFFFFF; +} + +.jump_box .txt { + font-size: 32rpx; + font-weight: bold; + color: #000000; +} + +.popbox { + position: relative; + width: 670rpx; + height: 840rpx; + border-radius: 30rpx; + background: #FFF; +} + +.popbox .title { + font-weight: bold; + text-align: center; + font-size: 36rpx; + color: #030000; + padding-top: 39rpx; +} + +.popbox_text { + font-size: 28rpx; + font-weight: 500; + color: #000; + text-align: center; + margin-top: 64rpx; +} + +.popbox_text text { + font-weight: bold; + font-size: 36rpx; +} + +.popbox .info1 { + border-bottom: 1rpx solid #D8D8D8; + padding: 16rpx 0; + margin: 0 24rpx; + text-align: center; +} + +.popbox .info1 .tip1 { + color: #000; + font-size: 26rpx; +} + +.popbox .info1 .tip2 { + color: #E9D3AE; + font-size: 32rpx; +} + +.popbox .info2 { + padding: 16rpx 0 0; +} + +.popbox .info2 .left {} + +.popbox .info2 .left .tip1 { + color: #000; + font-size: 26rpx; + font-weight: bold; +} + +.popbox .info2 .switch { + position: relative; + top: 4rpx; + margin-left: 12rpx; +} + +.popbox .info3 { + margin: 59rpx 30rpx 37rpx; +} + +.popbox .info3 .imgbox { +} + +.popbox .info3 .imgbox .img { + position: relative; + width: 180rpx; + height: 180rpx; + border: 1px solid #DDDDDD; + border-radius: 20rpx; + background: #FFF; + overflow: hidden; + margin-right: 18rpx; +} + +.popbox .info3 .imgbox .img .item_img { + width: 180rpx; + height: 180rpx; +} + +.popbox .info3 .imgbox .img:nth-child(n+3) { + margin-right: 0; +} + +.popbox .info3 .imgbox .img2 { + width: 180rpx; + height: 180rpx; + border: 1px solid #DDDDDD; + border-radius: 20rpx; + background: #FFF; +} + +.popbox .info3 .imgbox .img2 image { + width: 70rpx; +} + +.popbox .info3 .imgbox .img .close { + width: 28rpx; + height: 28rpx; + position: absolute; + z-index: 9; + right: 4rpx; + top: 4rpx; + border-radius: 50%; + background: rgba(0, 0, 0, .4); +} + +.popbox .info4 { + width: 610rpx; + height: 186rpx; + background: #FFFFFF; + border: 1px solid #DDDDDD; + border-radius: 3rpx; + position: relative; + margin: 0 30rpx; + overflow: hidden; + padding: 22rpx 30rpx 50rpx; + box-sizing: border-box; +} + +.popbox .info4 .content { + /*padding: 14rpx;*/ + width: 100%; + height: 100%; + font-size: 28rpx; + font-weight: 500; + color: #CCCCCC; +} + +.popbox .info4 .content textarea { + color: #CCCCCC; + font-size: 28rpx; + width: 100%; + height: 100%; +} + +.popbox .info4 .tip { + position: absolute; + right: 14rpx; + color: #CCCCCC; + font-size: 22rpx; + bottom: 24rpx; +} + +.popbox .popbtnbox { + position: absolute; + bottom: 54rpx; + left: 0; + right: 0; +} + +.popbox .popbtnbox .btn1 { + flex-shrink: 0; + line-height: 90rpx; + text-align: center; + font-size: 30rpx; + width: 270rpx; + height: 90rpx; + background: #000; + border-radius: 45rpx; + color: #fff; +} \ No newline at end of file diff --git a/src/pages/moisture_test_report/moisture_test_report.tsx b/src/pages/moisture_test_report/moisture_test_report.tsx new file mode 100644 index 0000000..a71d9e1 --- /dev/null +++ b/src/pages/moisture_test_report/moisture_test_report.tsx @@ -0,0 +1,216 @@ +import { Block, View, Text, Image, Input, Button } from "@tarojs/components"; +import { Component, PropsWithChildren, useEffect, useState } from "react"; + +import "taro-ui/dist/style/components/button.scss"; // 按需引入 +import Taro from "@tarojs/taro"; +// 引入 Swiper, SwiperItem 组件 + +/*** redux ***/ +import { connect } from "react-redux"; +import { setMobile } from "../../store/features/userInfo"; +/*** redux end ***/ + +import { WCUserLogin } from "../../utils/Interface"; + +import "./login.less"; + +class MoistureTestReport extends Component { + constructor(props) { + super(props); + this.state = { + name: "重新登录", + imgUrl: '', + reportData: { + curDate: '', + shuifenLevel: { + head: 2, + leftFace: 3, + rightFace: 7 + }, + shuifenList: [], + shuifenGear: { + head: 0, + leftFace: 0, + rightFace: 0 + } + }, + bgCssData: { + serious: 'background: #FFE3E3', + moderate: 'background: #FFEBDC', + slight: 'background: #F6FCFF', + normal: 'background: #F8F8F8', + sufficient: 'background: #F8F8F8' + }, + isClock: false, + xinde: '', + imglist: [], + id: 0, + show: false + }; + } + + async onLoad() { } + componentDidMount() { } + + componentWillUnmount() { } + + componentDidShow() { } + + componentDidHide() { } + + async initData() { } + + + render() { + let { name, imgUrl, reportData, bgCssData, isClock, xinde, imglist, id, show } = this.state + return ( + + + {reportData.curDate || ''} + + + + + + 额头 + {util.getStatusData(reportData.shuifenLevel.head).title} + + + + + + 左脸颊 + {util.getStatusData(reportData.shuifenLevel.leftFace).title} + + + + + + 右脸颊 + {util.getStatusData(reportData.shuifenLevel.rightFace).title} + + + + + + + + + + + + 额头 + + + + {reportData.shuifenLevel.head}级 + + + 左脸颊 + + + + {reportData.shuifenLevel.leftFace}级 + + + 右脸颊 + + + + {reportData.shuifenLevel.rightFace}级 + + + + + + 水分等级 + + + + + 严重缺水:1-2级 + + + + 中度缺水:3-4级 + + + + 轻微缺水:5-6级 + + + + 水分正常:7-8级 + + + + 水分充足:9-10级 + + + 注:各水分等级依据测量得出肌肤含水量划分 + + + + + + 肌肤整体 + + {/* */} + + + + + + 促渗档位推荐 + 前往护理 + + + + + 面膜促渗 + + + + + + 额头 + {reportData.shuifenGear.head}档 + + + + 左脸颊 + {reportData.shuifenGear.leftFace}档 + + + + 右脸颊 + {reportData.shuifenGear.rightFace}档 + + + + + + + + + 继续护理 + + 主页 + + + + + + ); + } +} + +const mapStateToProps = (state) => ({ + mobile: state.userInfo.mobile, +}); +const mapDispatchToProps = (dispatch) => ({ + setMobile(value) { + dispatch(setMobile(value)); + }, +}); +export default connect(mapStateToProps, mapDispatchToProps)(Login);