fix:修复横向滚动条切换item,页面数据刷新导致横向滚动闪动回初始位置问题

master
blak-kong 2 years ago
parent 722482e8dd
commit 30b227b892

@ -71,9 +71,11 @@ export default defineAppConfig({
navigationBarBackgroundColor: "#fff", navigationBarBackgroundColor: "#fff",
navigationBarTitleText: "WeChat", navigationBarTitleText: "WeChat",
navigationBarTextStyle: "black", navigationBarTextStyle: "black",
// pageOrientation: "auto",
// enablePullDownRefresh: true // enablePullDownRefresh: true
}, },
requiredPrivateInfos: ["getLocation"], requiredPrivateInfos: ["getLocation"],
subPackages: [ subPackages: [
{ {
root: "moduleIOT", root: "moduleIOT",

@ -204,7 +204,7 @@ export default class InstrumentManage extends Component<any, any> {
<Block> <Block>
<View className="title"></View> <View className="title"></View>
<View className="scroll"> <View className="scroll">
<ScrollView scroll-x="true" className="un_bind_list"> <ScrollView scrollX={true} className="un_bind_list">
{unBindList.map((item, index) => { {unBindList.map((item, index) => {
if (item.status === 0) { if (item.status === 0) {
return ( return (

@ -508,7 +508,8 @@ class IotCarePlanFR200 extends Component<any, any> {
currentWorkModeType = 3; currentWorkModeType = 3;
} else if ( } else if (
data.modeType === "maskPenetration" || data.modeType === "maskPenetration" ||
data.modeType === "essence" data.modeType === "essence" ||
data.modeType === "led"
) { ) {
currentWorkModeType = 2; currentWorkModeType = 2;
} }
@ -949,9 +950,9 @@ class IotCarePlanFR200 extends Component<any, any> {
} else { } else {
let waterStepList = this.state.waterStepList; let waterStepList = this.state.waterStepList;
let waterStepIndex = this.state.waterStepIndex; let waterStepIndex = this.state.waterStepIndex;
// 5秒后获取的结果 // 5秒后获取的结果
if (waterStepList[waterStepIndex].finish) { if (waterStepList[waterStepIndex].finish) {
// 获取失败后把进度条清理0 // 获取失败后把进度条清理0
waterStepList[waterStepIndex].schedule = 0; waterStepList[waterStepIndex].schedule = 0;
waterStepList[waterStepIndex].finish = false; waterStepList[waterStepIndex].finish = false;
this.setState({ this.setState({
@ -1598,14 +1599,13 @@ class IotCarePlanFR200 extends Component<any, any> {
executePromises = async () => { executePromises = async () => {
let waterStepList = this.state.waterStepList; let waterStepList = this.state.waterStepList;
let waterStepIndex = this.state.waterStepIndex; let waterStepIndex = this.state.waterStepIndex;
let that =this let that = this;
await new Promise<void>((resolve) => { await new Promise<void>((resolve) => {
setTimeout(() => { setTimeout(() => {
waterStepList[waterStepIndex].schedule = 100; waterStepList[waterStepIndex].schedule = 100;
that.setState({ that.setState({
waterStepList,
waterStepList, });
});
resolve(); resolve();
}, 3000); }, 3000);
@ -1614,19 +1614,14 @@ class IotCarePlanFR200 extends Component<any, any> {
setTimeout(() => { setTimeout(() => {
waterStepList[waterStepIndex].finish = true; waterStepList[waterStepIndex].finish = true;
that.setState({ that.setState({
waterStepList, waterStepList,
}); });
resolve(); resolve();
}, 2000); }, 2000);
}); });
}); });
}; };
// 检测并控制工作状态 // 检测并控制工作状态
handleWorkStatus = async (isBtnClick: boolean, workStatus) => { handleWorkStatus = async (isBtnClick: boolean, workStatus) => {
const { DeviceConnectStatus, ActiveModeItem } = this.state; const { DeviceConnectStatus, ActiveModeItem } = this.state;
@ -1656,20 +1651,22 @@ class IotCarePlanFR200 extends Component<any, any> {
sendParams.testStatus = "standby"; // 切换为准备 sendParams.testStatus = "standby"; // 切换为准备
// 3秒定时器逻辑3秒把进度条弄成100再加2秒获取最后结果 // 3秒定时器逻辑3秒把进度条弄成100再加2秒获取最后结果
if (isBtnClick) { if (isBtnClick) {
that.setState({ that.setState({
isRuningTest: 2, isRuningTest: 2,
}); });
this.executePromises() this.executePromises();
sendParams.testStatus = "start"; // 点击开始再开始 sendParams.testStatus = "start"; // 点击开始再开始
console.log("点击开始", isBtnClick); console.log("点击开始", isBtnClick);
} }
} }
if (ActiveModeItem.modeType === "maskPenetration") { // 面膜促渗和精华促渗
if (
ActiveModeItem.modeType === "maskPenetration" ||
ActiveModeItem.modeType === "essence"
) {
sendParams.gear = this.state.currentGear; // 点击开始再开始 sendParams.gear = this.state.currentGear; // 点击开始再开始
} }
@ -2120,7 +2117,12 @@ class IotCarePlanFR200 extends Component<any, any> {
return nursingData; return nursingData;
} }
return { nursingData: JSON.stringify({ workMode: nowFR200NursingHistory.workMode, }), showFace: true } return {
nursingData: JSON.stringify({
workMode: nowFR200NursingHistory.workMode,
}),
showFace: true,
};
}; };
// 计算挡位 // 计算挡位
@ -2669,7 +2671,7 @@ class IotCarePlanFR200 extends Component<any, any> {
showFullscreenBtn={false} showFullscreenBtn={false}
onLoadedMetaData={this.GetVideosTime} onLoadedMetaData={this.GetVideosTime}
/> />
<button onClick={this.executePromises}></button> {/* <Button onClick={this.executePromises}>点击按钮</Button> */}
{errorTips && ( {errorTips && (
<Block> <Block>
<View className="msg-tips"> <View className="msg-tips">
@ -2683,22 +2685,28 @@ class IotCarePlanFR200 extends Component<any, any> {
)} )}
</View> </View>
<View className="fr200-iot-device"> {ActiveModeItem.modeType !== "moistureTest" && (
<View className="item"> <View className="fr200-iot-device">
<Text className="device-time"> <View className="item">
<Text className="time">{currentTime}</Text> <Text className="device-time">
</Text> <Text className="time">{currentTime}</Text>
</View> </Text>
<View className="line" /> </View>
<View className="item"> <View className="line" />
<Text className="gear">{currentGear}</Text> <View className="item">
<Text className="gear">
{ActiveModeItem.modeType === "led" ? "-" : currentGear}
</Text>
</View>
<View className="line" />
<ElectricityView
Electricity={Electricity}
DeviceConnectStatus={DeviceConnectStatus}
/>
</View> </View>
<View className="line" /> )}
<ElectricityView
Electricity={Electricity}
DeviceConnectStatus={DeviceConnectStatus}
/>
</View>
</View> </View>
{ModeList.length > 0 && ( {ModeList.length > 0 && (
@ -2714,8 +2722,8 @@ class IotCarePlanFR200 extends Component<any, any> {
onModeLockOpen={this.onModeLockOpen} onModeLockOpen={this.onModeLockOpen}
/> />
)} )}
<button onClick={this.look.bind(this)}>echarts </button> {/* <button onClick={this.look.bind(this)}>echarts </button>
<button onClick={this.updata.bind(this)}> </button> <button onClick={this.updata.bind(this)}> </button> */}
<View className={classnames({ show: showEcharts })}> <View className={classnames({ show: showEcharts })}>
<Echarts data={echartsData}></Echarts> <Echarts data={echartsData}></Echarts>

@ -9,7 +9,7 @@ interface Props {
onEmitStartNurse: Function; // 每次点击item回调事件和数据给父组件 onEmitStartNurse: Function; // 每次点击item回调事件和数据给父组件
onEmitSwitchChange: Function; onEmitSwitchChange: Function;
onEmitEndPlan: Function; onEmitEndPlan: Function;
onsuccess:Function onsuccess: Function;
} }
function Index({ function Index({
currentWorkModeType, currentWorkModeType,
@ -18,7 +18,7 @@ function Index({
onEmitStartNurse, onEmitStartNurse,
onEmitSwitchChange, onEmitSwitchChange,
onEmitEndPlan, onEmitEndPlan,
onsuccess onsuccess,
}: Props) { }: Props) {
const onStartNurse = () => { const onStartNurse = () => {
onEmitStartNurse(); onEmitStartNurse();
@ -31,24 +31,31 @@ function Index({
const onEndPlan = () => { const onEndPlan = () => {
onEmitEndPlan(); onEmitEndPlan();
}; };
const onSuccessNurse = () => {
onsuccess();
};
return ( return (
<Block> <Block>
<View className="iot-footer"> <View className="iot-footer">
{currentWorkModeType === 3 && ( {currentWorkModeType === 3 && (
<Block> <Block>
{isRuningTest === 1 ? ( {isRuningTest === 1 ? (
<View className="btn" onClick={onStartNurse}> <View className="btn" onClick={onStartNurse}>
</View> </View>
) : isRuningTest === 2 ? ( ) : isRuningTest === 2 ? (
<View className="btn">...</View> <View className="btn">...</View>
) : isRuningTest === 3 ? ( ) : isRuningTest === 3 ? (
<View className="btn" onClick={onStartNurse}></View> <View className="btn" onClick={onStartNurse}>
) : (
<View className="btn" onClick={onsuccess}></View> </View>
)} ) : (
</Block> <View className="btn" onClick={onSuccessNurse}>
</View>
)}
</Block>
)} )}
{currentWorkModeType === 2 && ( {currentWorkModeType === 2 && (

@ -85,7 +85,9 @@ function Index({
<View className="mode-info"> <View className="mode-info">
<View className="mode-info-title">{item.modeName}</View> <View className="mode-info-title">{item.modeName}</View>
<View className="mode-info-time"> <View className="mode-info-time">
{item.modeTimeStr} {item.modeTimeStr === "00:00"
? "--:--"
: item.modeTimeStr}
</View> </View>
<View <View
className={classnames("mode-info-select", { className={classnames("mode-info-select", {

@ -1,4 +1,5 @@
export default definePageConfig({ export default definePageConfig({
navigationBarTitleText: '首页', navigationBarTitleText: '首页',
enablePullDownRefresh: false, enablePullDownRefresh: false,
enablePageMeta: true
}) })

@ -11,6 +11,7 @@ import {
Swiper, Swiper,
SwiperItem, SwiperItem,
RichText, RichText,
PageMeta,
} from "@tarojs/components"; } from "@tarojs/components";
import { Popup } from "@antmjs/vantui"; import { Popup } from "@antmjs/vantui";
/*** redux ***/ /*** redux ***/
@ -943,6 +944,10 @@ class Index extends Component<any, any> {
// return; // return;
} }
goTest() {
go("/pages/consultant/consultant");
}
//连接完成时数据的回调 //连接完成时数据的回调
offlineChange = async (e) => { offlineChange = async (e) => {
console.log("offlineChange", e); console.log("offlineChange", e);
@ -1122,6 +1127,7 @@ class Index extends Component<any, any> {
return ( return (
<Block> <Block>
{/* <PageMeta pageOrientation="landscape"> */}
<View catchMove> <View catchMove>
<PopupAlert <PopupAlert
isShow={isCommonError} isShow={isCommonError}
@ -1446,6 +1452,13 @@ class Index extends Component<any, any> {
<Popup show={show} className="custom-popup" overlay={false}> <Popup show={show} className="custom-popup" overlay={false}>
<View className="popBox"></View> <View className="popBox"></View>
</Popup> </Popup>
{/* </PageMeta> */}
{/* <View
style="position:fixed;width:100vw;height:100vh"
onClick={this.goTest}
>
</View> */}
</Block> </Block>
); );
} }

@ -1,5 +1,6 @@
import Taro, { setStorageSync } from "@tarojs/taro"; import Taro, { setStorageSync } from "@tarojs/taro";
import classnames from "classnames"; import classnames from "classnames";
import dayjs from "dayjs";
import { Component, PropsWithChildren, useEffect, useState } from "react"; import { Component, PropsWithChildren, useEffect, useState } from "react";
import { import {
@ -40,8 +41,11 @@ export default class Recording extends Component<any, any> {
curIndex: null, curIndex: null,
clockStatistics: [], clockStatistics: [],
statistics: [], statistics: [],
yearValue: dayjs().format("YYYY-MM-DD"),
year: new Date().getFullYear(), year: new Date().getFullYear(),
today: new Date(),
startYear: "2000-01-01",
endYear: dayjs().format("YYYY-MM-DD"),
monthTime: [ monthTime: [
{ month: 1, time: 0 }, { month: 1, time: 0 },
{ month: 2, time: 0 }, { month: 2, time: 0 },
@ -264,21 +268,31 @@ export default class Recording extends Component<any, any> {
ViewAddInstrument: ViewAddInstrument, ViewAddInstrument: ViewAddInstrument,
}); });
this.getRecord(null); this.initData();
this.getBindingInstrumentList();
this.getLatestClockRecord();
this.getClockStatistics();
this.DayTime();
this.setStatusBar();
} }
componentDidShow() {} componentDidShow() {}
componentDidHide() {} componentDidHide() {}
async initData() {} initData = async () => {
this.getRecord(null);
Taro.showLoading({
title: "请求中...",
mask: true,
});
await Promise.all([
this.getBindingInstrumentList(),
this.getLatestClockRecord(),
this.getClockStatistics(),
this.DayTime(),
this.setStatusBar(),
]);
Taro.hideLoading();
};
// 选择年份 // 选择年份
onChangeYear(event) { onChangeYear(event) {
console.log("event", event);
this.setState({ year: event.detail.value }); this.setState({ year: event.detail.value });
this.getClockStatistics(event.detail.value); this.getClockStatistics(event.detail.value);
} }
@ -510,12 +524,13 @@ export default class Recording extends Component<any, any> {
clockStatistics, clockStatistics,
statistics, statistics,
year, year,
today,
monthTime, monthTime,
show, show,
punchInInfo, punchInInfo,
navigationBarHeight, navigationBarHeight,
statusBarHeight, statusBarHeight,
startYear,
endYear,
} = this.state; } = this.state;
const statusBarHeightRpx = statusBarHeight * 2; const statusBarHeightRpx = statusBarHeight * 2;
const navigationBarHeightRpx = navigationBarHeight * 2; const navigationBarHeightRpx = navigationBarHeight * 2;
@ -549,136 +564,128 @@ export default class Recording extends Component<any, any> {
</View> </View>
</View> </View>
{current === 0 && ( <View>
<ScrollView {current === 0 && (
className="products_list" <Block>
scroll-x="true" <ScrollView
style={{ className="products_list"
top: height + 110 + "rpx", scrollX={true}
position: "sticky", enhanced={true}
}} bounces={false}
> // scrollIntoView={"products_item_" + curIndex}
<View style={{
className={classnames("all", { top: height + 110 + "rpx",
products_item_active: !curIndex, position: "sticky",
})} }}
onClick={this.onChangeProduct.bind(this, null)}
>
</View>
{bindingInstrumentList.map((item: any, index: any) => (
<View
key={item.id}
className={classnames("products_item", {
products_item_active: curIndex === item.id,
})}
onClick={this.onChangeProduct.bind(this, item.id)}
> >
<Image <View>
className="products_cover" <View
src={item.logo} id={"products_item_0"}
mode="aspectFill" className={classnames("all", {
></Image> products_item_active: !curIndex,
<View className="products_title">{item.name}</View> })}
</View> onClick={this.onChangeProduct.bind(this, null)}
))} >
</ScrollView>
)}
{current === 0 && recordList.length === 0 && (
<View>
<View className="nodata">
<Image
className="nodata_img"
src={require("@/img/nodata.png")}
></Image>
<View className="nodata_text"></View>
</View>
</View>
)}
{current === 0 && (
<View style="padding-bottom:200px">
{/* <View className='instrument_item' >
<View className='instrument_top flex sb aitems'>
<View className='time_box flex aitems'>
<View className='time'>2024.1.23</View>
<View className={classnames("tag", {
tag_active: current === 1,
})}
> 线</View>
</View>
<View className='report_btn flex'>
<View></View>
<Image className='arrow_icon' src={require("../../img/index/right.png")} mode='aspectFill'></Image>
</View>
</View>
<View className='instrument_middle flex'>
<Image className='instrument_cover' src={require("../../img/test/1706667011027.jpg")}></Image>
<View className='instrument_content'>
<View className='instrument_title'></View>
<View className='instrument_desc_box flex fc sb'>
<View className='instrument_desc'></View>
<View className='instrument_desc'>1500</View>
</View> </View>
</View> {bindingInstrumentList.map((item: any, index: any) => {
</View> return (
</View> */}
<View className="instrument_list ">
{recordList.map((item: any, index: any) => (
<View className="recording-box" key={item.id}>
<View className="box-top">
<View className="top-left">
<View className="date">{item.createTime}</View>
<View <View
className={classnames("tip", { key={item.id}
tag_active: item.online === 2, id={"products_item_" + item.id}
className={classnames("products_item", {
products_item_active: curIndex === item.id,
})} })}
onClick={this.onChangeProduct.bind(this, item.id)}
> >
{item.online === 1 ? "在线" : "离线"}
</View>
</View>
{item.instrumentType === 2 && (
<View
className="top-right"
onClick={this.toReport.bind(
this,
item.instrumentId,
item.id,
item
)}
>
<Image <Image
className="arrow_icon" className="products_cover"
src={require("@/img/index/right.png")} src={item.logo}
mode="aspectFill" mode="aspectFill"
></Image> ></Image>
<View className="products_title">{item.name}</View>
</View> </View>
)} );
})}
</View>
</ScrollView>
<View>
{recordList.length === 0 && (
<View>
<View className="nodata">
<Image
className="nodata_img"
src={require("@/img/nodata.png")}
></Image>
<View className="nodata_text"></View>
</View>
</View> </View>
<View className="box-bottom"> )}
<Image {recordList.length > 0 && (
className="recording_img" <View style="padding-bottom:200px">
src={item.modeImage} <View className="instrument_list ">
></Image> {recordList.map((item: any, index: any) => (
<View className="bottom-right"> <View className="recording-box" key={item.id}>
<View className="title">{item.instrumentName}</View> <View className="box-top">
<View className="subtitle-box"> <View className="top-left">
<View className="subtitle">{item.modeName}</View> <View className="date">{item.createTime}</View>
<View className="subtitle"> <View
{item.instrumentType === 2 && ( className={classnames("tip", {
<Text>{item.nursingTime}</Text> tag_active: item.online === 2,
)} })}
>
{item.online === 1 ? "在线" : "离线"}
</View>
</View>
{item.instrumentType === 2 && (
<View
className="top-right"
onClick={this.toReport.bind(
this,
item.instrumentId,
item.id,
item
)}
>
<Image
className="arrow_icon"
src={require("@/img/index/right.png")}
mode="aspectFill"
></Image>
</View>
)}
</View>
<View className="box-bottom">
<Image
className="recording_img"
src={item.modeImage}
></Image>
<View className="bottom-right">
<View className="title">
{item.instrumentName}
</View>
<View className="subtitle-box">
<View className="subtitle">
{item.modeName}
</View>
<View className="subtitle">
{item.instrumentType === 2 && (
<Text>{item.nursingTime}</Text>
)}
</View>
</View>
</View>
</View>
</View> </View>
</View> ))}
</View> </View>
</View> </View>
</View> )}
))} </View>
</View> </Block>
</View> )}
)} </View>
{current === 1 && ( {current === 1 && (
<View style="padding-bottom:200px"> <View style="padding-bottom:200px">
{/* <View className='nodata'> {/* <View className='nodata'>
@ -693,11 +700,13 @@ export default class Recording extends Component<any, any> {
<View className="flex sb ab"> <View className="flex sb ab">
<View className="clock_in_statistics_title"></View> <View className="clock_in_statistics_title"></View>
<Picker <Picker
style="color:#000"
mode="date" mode="date"
fields="year" fields="year"
onChange={this.onChangeYear.bind(this)} onChange={this.onChangeYear.bind(this)}
value="{{year}}" value={this.state.yearValue}
end="{{today}}" start={startYear}
end={endYear}
> >
<View className="clock_in_statistics_date flex aitems"> <View className="clock_in_statistics_date flex aitems">
<View>{year}</View> <View>{year}</View>

Loading…
Cancel
Save