fix:设备管理和详情页还原UI设计稿

master
blak-kong 2 years ago
parent d467abfc6d
commit 7d399d95d1

@ -213,6 +213,8 @@ page {
display: inline-block;
height: 100%;
text-align: center;
padding-left: 10rpx;
padding-right: 20rpx;
.block1_1 {
height: 100%;
flex-direction: column;
@ -230,14 +232,14 @@ page {
height: 140rpx;
border-radius: 20rpx;
overflow: hidden;
margin-left: 6rpx;
// margin-left: 6rpx;
image {
width: 100%;
height: 100%;
}
}
.tip1 {
margin-top: 20rpx;
margin-top: 16rpx;
font-size: 26rpx;
font-weight: bold;
color: #000000;
@ -253,7 +255,7 @@ page {
border: 3rpx solid #f1f1f1;
width: 30rpx;
height: 30rpx;
margin-top: 15rpx;
margin-top: 10rpx;
&.is-select {
display: flex;
background-color: #fff;

@ -34,8 +34,7 @@ export default class InstrumentClickInUpload extends Component<any, any> {
year: new Date().getFullYear(),
month: String(new Date().getMonth() + 1).padStart(2, "0"),
day: String(new Date().getDate()).padStart(2, "0"),
zkmoshiindex: 0,
modeIndex: null,
modeIndex: 0,
stepIndex: null,
autoPlay: false,
scrollleft: 0,
@ -154,7 +153,7 @@ export default class InstrumentClickInUpload extends Component<any, any> {
this.onModeLockOpen(); // 点击了锁定模式
return;
}
this.setState({ zkmoshiindex: index, currentInfo });
this.setState({ modeIndex: index, currentInfo });
};
// 选择图片上传
@ -300,7 +299,6 @@ export default class InstrumentClickInUpload extends Component<any, any> {
duration,
showVideoPlayBtn,
scrollleft,
zkmoshiindex,
punchInInfo,
isTipShow,
currentInfo,
@ -319,119 +317,119 @@ export default class InstrumentClickInUpload extends Component<any, any> {
} = this.state;
return (
<Block>
<Navbar titleSlot='打卡上传' isBack />
<Navbar titleSlot="打卡上传" isBack />
<Canvas
style='position: fixed;left:-10000px;'
id='compressImage'
canvasId='compressImage'
type='2d'
style="position: fixed;left:-10000px;"
id="compressImage"
canvasId="compressImage"
type="2d"
></Canvas>
<View catchMove>
<PopupAlert
isShow={isModeLock}
title='提示'
content='该模式即将上线,敬请期待'
confirmButtonText='我知道了'
textAlgin='center'
title="提示"
content="该模式即将上线,敬请期待"
confirmButtonText="我知道了"
textAlgin="center"
isClose={false}
close={this.onModeLockClose}
confirm={this.onModeLockClose}
/>
<PopupInstrumentUploadTips
isShow={isTipShow}
title='打卡介绍'
title="打卡介绍"
data={nurseInfo}
close={this.onTipShowClose}
confirm={this.onTipShowClose}
/>
</View>
<View className='infobox1 flex aitems jcenter'>
<View className='img'>
<View className="infobox1 flex aitems jcenter">
<View className="img">
<Video
src={currentInfo.modeVideo}
id='myVideo'
id="myVideo"
enableProgressGesture={false}
controls
// autoplay={false}
direction={0}
loop={false}
showMuteBtn
referrerPolicy='origin'
referrerPolicy="origin"
onTimeUpdate={this.videoBindTimeUpdate}
onEnded={this.videoEnded}
onPause={this.videoPause}
onPlay={this.videoPlay}
showCenterPlayBtn={false}
onLoadedMetaData={this.videoLoadedMetaData}
style='width: 100%; height: 100%;border-radius: 30rpx;'
style="width: 100%; height: 100%;border-radius: 30rpx;"
/>
{showVideoPlayBtn && (
<View className='video-cover'>
<View className="video-cover">
<Image
className='video-cover-icon'
className="video-cover-icon"
src={require("@/img/fr200/play.png")}
onClick={this.onPlayTap}
></Image>
{duration && (
<View className='video-cover-time'>{duration}</View>
<View className="video-cover-time">{duration}</View>
)}
</View>
)}
</View>
</View>
<View className='infobox3'>
<View className="infobox3">
<ScrollView
style='white-space: nowrap; height: 100%;'
style="white-space: nowrap; height: 100%;"
scroll-x
scroll-left={scrollleft}
>
{modeInfo.map((item, index) => {
return (
<View
className='info1'
className="info1"
onClick={this.bindMoshi.bind(this, index)}
key={index}
>
<View
className='flex aitems modebox'
className="flex aitems modebox"
style={{
height: "100%",
background:
zkmoshiindex == index
modeIndex == index
? "linear-gradient(90deg, #EFDCC2, #FFF2DF)"
: "",
}}
>
<View className='block1'>
<View className='block1_1 flex aitems '>
<View className='tip1'>{item.modeName}</View>
<View className='tip2'>{item.modeDesc}</View>
<View className="block1">
<View className="block1_1 flex aitems ">
<View className="tip1">{item.modeName}</View>
<View className="tip2">{item.modeDesc}</View>
{!item.lock && zkmoshiindex !== index && (
<View className='quan1'></View>
{!item.lock && modeIndex !== index && (
<View className="quan1"></View>
)}
{!item.lock && zkmoshiindex == index && (
<View className='quan1 is-select flex aitems jcenter'>
<View className='quan2'></View>
{!item.lock && modeIndex == index && (
<View className="quan1 is-select flex aitems jcenter">
<View className="quan2"></View>
</View>
)}
{item.lock && (
<View className='icon'>
<View className="icon">
<Image
src={require("@/img/fr200/suo.png")}
mode='aspectFill'
mode="aspectFill"
></Image>
</View>
)}
</View>
</View>
{item.modeBanner && index == zkmoshiindex && (
<View className='info1_img'>
<Image src={item.modeBanner} mode='aspectFill' />
{item.modeBanner && index == modeIndex && (
<View className="info1_img">
<Image src={item.modeBanner} mode="aspectFill" />
</View>
)}
</View>
@ -441,32 +439,32 @@ export default class InstrumentClickInUpload extends Component<any, any> {
</ScrollView>
</View>
<View className='infobox2'>
<View className='infobox2_info'>
<View className='info4'>
<View className='upload_header flex aitems sb'>
<View className='upload_title'></View>
<View className='icon' onClick={this.onTipShowOpen}>
<View className="infobox2">
<View className="infobox2_info">
<View className="info4">
<View className="upload_header flex aitems sb">
<View className="upload_title"></View>
<View className="icon" onClick={this.onTipShowOpen}>
<Image
src={require("@/img/clock_in_upload/info.png")}
mode='aspectFill'
mode="aspectFill"
></Image>
</View>
</View>
<View className='imgbox flex aitems'>
<View className="imgbox flex aitems">
{punchInInfo.clockImageList.length > 0 &&
punchInInfo.clockImageList.map((item, index) => {
return (
<View className='img' key={"clickin_" + index}>
<View className="img" key={"clickin_" + index}>
<Image src={item}></Image>
<View
className='close flex aitems jcenter'
className="close flex aitems jcenter"
data-index={index}
onClick={this.handleDeleteImage}
>
<Image
src={require("@/img/fr200/close_white.png")}
mode='widthFix'
mode="widthFix"
></Image>
</View>
</View>
@ -475,23 +473,23 @@ export default class InstrumentClickInUpload extends Component<any, any> {
{punchInInfo.clockImageList.length < 3 && (
<View
className='img2 flex aitems jcenter'
className="img2 flex aitems jcenter"
onClick={this.handleChooseImage}
>
<Image
src={require("@/img/fr200/add-image.png")}
mode='aspectFill'
mode="aspectFill"
></Image>
</View>
)}
</View>
<View className='content'>
<View className="content">
<Textarea
placeholder-className="placeh和给g'holder"
maxlength={100}
onInput={this.handleTextareaInput}
value={punchInInfo.clockContent}
placeholder='请记录一下今天打卡的心得吧~'
placeholder="请记录一下今天打卡的心得吧~"
></Textarea>
{/* {tipshow && (
<View className="Textarea">
@ -500,7 +498,7 @@ export default class InstrumentClickInUpload extends Component<any, any> {
: "请记录一下今天打卡的心得吧~"}
</View>
)} */}
<View className='tips-num'>
<View className="tips-num">
{punchInInfo.clockContent.length}/100
{/* {punchInInfo.clockContent.length}/100 */}
</View>
@ -509,16 +507,16 @@ export default class InstrumentClickInUpload extends Component<any, any> {
</View>
</View>
<View style='height: 150rpx'></View>
<View style="height: 150rpx"></View>
{!isSubmit && (
<View className='confirm_btn flex aitems' onClick={this.handleSubmit}>
<View className='btn'></View>
<View className="confirm_btn flex aitems" onClick={this.handleSubmit}>
<View className="btn"></View>
</View>
)}
{isSubmit && (
<View className='confirm_btn flex aitems'>
<View className='btn'></View>
<View className="confirm_btn flex aitems">
<View className="btn"></View>
</View>
)}
</Block>

@ -3,17 +3,19 @@ page {
padding-bottom: calc(env(safe-area-inset-bottom));
}
.list {
margin: 26rpx 30rpx 0rpx;
margin: 38rpx 30rpx 0 30rpx;
border-radius: 50rpx;
padding-bottom: 0rpx;
overflow: hidden;
position: relative;
height: calc(166rpx * 2);
height: 368rpx;
}
.list > .instrument_img {
position: relative;
height: 100%;
/* top: -250rpx; */
image {
background: #eee;
}
}
.list > .instrument_img .bind_status {
position: absolute;

@ -63,11 +63,11 @@ export default class InstrumentDetail extends Component<any, any> {
<Image src={info.instrumentBanner} />
<View className="bind_status"></View>
<View className="titile">{info.instrumentName}</View>
{/* {info.iot == 2 && (
{info.instrumentIotVersion && (
<View className="iot_versions">
{info.iot_versions}
{info.instrumentIotVersion}
</View>
)} */}
)}
</View>
</View>
</Block>

@ -4,7 +4,7 @@ page {
}
.instrument_box {
.title {
margin: 35rpx 37rpx;
margin: 34rpx 48rpx;
font-size: 32rpx;
font-weight: bold;
color: #030000;
@ -24,7 +24,7 @@ page {
}
.bind_list {
height: 650rpx;
height: 630rpx;
.wrapper {
display: inline-block;
@ -37,7 +37,7 @@ page {
font-size: 24rpx;
left: 40rpx;
padding: 6rpx 40rpx;
background: linear-gradient(90deg, #fff0da, #ffe4c0);
background: linear-gradient(90deg, #ffe4c0, #ffedce);
border-radius: 30rpx;
}
}
@ -61,7 +61,7 @@ page {
color: #000000;
width: 100%;
line-height: 1;
margin: 30rpx 0;
margin: 30rpx 0 35rpx 0;
box-sizing: border-box;
}
.intro {
@ -100,10 +100,12 @@ page {
font-size: 36rpx;
font-weight: bold;
color: #000000;
margin-top: 60rpx;
}
.bindinfo {
/* display: block; */
margin: 0 auto;
margin-top: 43rpx;
width: 240rpx;
height: 60rpx;
line-height: 60rpx;

@ -54,18 +54,19 @@ export default class InstrumentManage extends Component<any, any> {
componentDidHide() {}
async initData() {
Taro.showLoading({
title: "请求中...",
mask: true,
});
this.bindingInstrumentList();
this.unbindingInstrumentInfoList();
Taro.hideLoading();
}
// 获取已绑定仪器列表
bindingInstrumentList = async () => {
Taro.showLoading({
title: "请求中...",
mask: true,
});
let { data: res } = await InstrumentInfo.bindingInstrumentList();
Taro.hideLoading();
if (res.code === 200) {
this.setState({ bindList: res.data });
} else {
@ -74,12 +75,7 @@ export default class InstrumentManage extends Component<any, any> {
};
// 获取未绑定仪器列表
unbindingInstrumentInfoList = async () => {
Taro.showLoading({
title: "请求中...",
mask: true,
});
let { data: res } = await InstrumentInfo.unbindingInstrumentInfoList();
Taro.hideLoading();
if (res.code === 200) {
this.setState({ unBindList: res.data });
} else {

@ -187,7 +187,7 @@ class IotCarePlanFR200 extends Component<any, any> {
ModeStepIndex: 0, // 当前护理功效步骤:每个步骤时间不定,所以时间另外计算,根据步骤显示
ModeStepTimeArray: [], // 护理功效时间步骤用于切换显示GIF
TestModeStepIndex: 0, // 水分测试步骤
// TestModeStepIndex: 0, // 水分测试步骤
EssenceStepIndex: 0, // 精华促渗步骤
MaskModeStepIndex: 0, // 面膜促渗步骤
@ -518,7 +518,7 @@ class IotCarePlanFR200 extends Component<any, any> {
activeModeID: data.id,
ModeID: "mode_" + data.id,
ModeStepIndex: 0,
TestModeStepIndex: 0, // 水分测试步骤
waterStepIndex: 0, // 水分测试步骤
EssenceStepIndex: 0, // 精华促渗步骤
MaskModeStepIndex: 0, // 面膜促渗步骤
ModeType: this.ModeTypeArray[data.modeClass],
@ -660,8 +660,8 @@ class IotCarePlanFR200 extends Component<any, any> {
});
// return;
let { currentDevice, ActiveModeItem } = this.state;
let params:any = {};
let params: any = {};
params = {
instrumentId: currentDevice.id,
instrumentName: currentDevice.name,
@ -670,28 +670,28 @@ class IotCarePlanFR200 extends Component<any, any> {
nursingTime: s_to_hms(this.elapsedTime),
nursingData: JSON.stringify({
GearData: [...waterStepList],
})
}),
};
// params = { ...params, ...nursingData };
let res: any = await InstrumentInfo.apiNursingLog.addLog(
JSON.stringify(
params
)
JSON.stringify(params)
);
setTimeout(async() => {
setTimeout(async () => {
this.setState({
isShowNursingSuccess: false,
});
let date = new Date();
let year = date.getFullYear();
let month = (date.getMonth() + 1).toString().padStart(2, '0');
let day = date.getDate().toString().padStart(2, '0');
let month = (date.getMonth() + 1).toString().padStart(2, "0");
let day = date.getDate().toString().padStart(2, "0");
let formattedDate = `${year}.${month}.${day}`;
go(`/recoding/pages/moisture_test_report/moisture_test_report?data=${params.nursingData}&date=${formattedDate}&modeId=${ActiveModeItem.id}&id=${currentDevice.id}`);
go(
`/recoding/pages/moisture_test_report/moisture_test_report?data=${params.nursingData}&date=${formattedDate}&modeId=${ActiveModeItem.id}&id=${currentDevice.id}`
);
}, 2000);
};
@ -878,7 +878,7 @@ class IotCarePlanFR200 extends Component<any, any> {
let num = waterStepIndex;
if (waterStepIndex < 2) {
num = waterStepIndex + 1;
this.waterTestNext(num)
this.waterTestNext(num);
}
this.setState({
timerIdSuccess: null,
@ -1298,7 +1298,7 @@ class IotCarePlanFR200 extends Component<any, any> {
clearInterval(currentTimeTimer);
this.setState({
currentTime: "00:00",
TestModeStepIndex: 0, // 水分测试步骤
waterStepIndex: 0, // 水分测试步骤
EssenceStepIndex: 0, // 精华促渗步骤
MaskModeStepIndex: 0, // 面膜促渗步骤
});
@ -1313,7 +1313,7 @@ class IotCarePlanFR200 extends Component<any, any> {
* @description +1
*/
waterTestNext(index) {
let ActiveModeItem =this.state.ActiveModeItem
let ActiveModeItem = this.state.ActiveModeItem;
if (index === 0 && ActiveModeItem.stepOneVideo) {
this.VideoSrcLoad(ActiveModeItem.stepOneVideo);
} else if (index === 1 && ActiveModeItem.stepTwoVideo) {
@ -1563,7 +1563,7 @@ class IotCarePlanFR200 extends Component<any, any> {
// 水分测试需要特殊处理
// 水分测试准备 水分测试工作 水分测试启动
if (ActiveModeItem.modeType === "moistureTest") {
let that =this
let that = this;
sendParams.testStatus = "standby"; // 切换为准备
let waterStepList = this.state.waterStepList;
let waterStepIndex = this.state.waterStepIndex;
@ -1970,8 +1970,8 @@ class IotCarePlanFR200 extends Component<any, any> {
// 脸部one
todoPromise = async () => {
const nowFR200NursingHistory = Taro.getStorageSync("FR200NursingHistory");
console.log(nowFR200NursingHistory,'nowFR200NursingHistory');
console.log(nowFR200NursingHistory, "nowFR200NursingHistory");
// 护理脸部
if (nowFR200NursingHistory.jsonStatus.workMode === "face") {
// 把working=工作中的状态数据筛选出来
@ -2036,7 +2036,7 @@ class IotCarePlanFR200 extends Component<any, any> {
};
return nursingData;
}
}
};
// 计算挡位
@ -2213,7 +2213,7 @@ class IotCarePlanFR200 extends Component<any, any> {
"/recoding/pages/face_report_one/face_report_one?id=" +
id +
"&report=" +
report
report
);
} else if ("moistureTest" === nursingData.workMode) {
console.log("水分测试");
@ -2221,7 +2221,7 @@ class IotCarePlanFR200 extends Component<any, any> {
let report = true;
go(
"/recoding/pages/face_report/face_report?id=" +
this.state.currentDevice.id+
this.state.currentDevice.id +
"&report=" +
report
);
@ -2388,7 +2388,6 @@ class IotCarePlanFR200 extends Component<any, any> {
isRuningTest,
isShowHistoryMsg,
isModeLock,
TestModeStepIndex,
currentVideoSrc,
currentGear,
showEcharts,
@ -2635,7 +2634,6 @@ class IotCarePlanFR200 extends Component<any, any> {
{ActiveModeItem.modeType === "moistureTest" && (
<WaterTest
isRuningTest={isRuningTest}
TestModeStepIndex={TestModeStepIndex}
stepList={waterStepList}
stepIndex={waterStepIndex}
></WaterTest>

@ -7,16 +7,11 @@ import "./index.less";
interface Props {
isRuningTest: boolean; // 是否已开始水分测试
TestModeStepIndex: number; // 当前测试步骤
stepList:any
stepIndex:any
stepList: any;
stepIndex: any;
}
function Index({
isRuningTest,
stepList,
stepIndex
}:Props) {
function Index({ isRuningTest, stepList, stepIndex }: Props) {
// const stepIndex = 0;
const testIndex = 1;
@ -106,7 +101,7 @@ function Index({
showPivot={false}
color={stepList[stepIndex].color}
></Progress>
{stepList[stepIndex].finish ? (
{stepList[stepIndex].finish ? (
<Image
className="finish_img"
src={require("@/img/finished.png")}

Loading…
Cancel
Save