|
|
import Taro, { setStorageSync } from "@tarojs/taro";
|
|
|
import classnames from "classnames";
|
|
|
import { Component, PropsWithChildren, useEffect, useState } from "react";
|
|
|
|
|
|
import {
|
|
|
Block,
|
|
|
View,
|
|
|
Text,
|
|
|
Image,
|
|
|
Input,
|
|
|
Button,
|
|
|
ScrollView,
|
|
|
Picker,
|
|
|
Textarea,
|
|
|
} from "@tarojs/components";
|
|
|
import { go } from "@/utils/traoAPI";
|
|
|
import { Tab, Tabs, Dialog, Popup } from "@antmjs/vantui";
|
|
|
|
|
|
/** 自定义组件 **/
|
|
|
import Navbar from "@/components/navbar/navbar";
|
|
|
import PopupClock from "@/components/popup/popup-clock";
|
|
|
/** 自定义组件 **/
|
|
|
import { InstrumentInfo } from "@/utils/Interface";
|
|
|
import { date, getdates, previewImage } from "@/utils/util";
|
|
|
import { showModal } from "@/utils/traoAPI.js";
|
|
|
|
|
|
import "./recording.less";
|
|
|
|
|
|
export default class Recording extends Component<any, any> {
|
|
|
constructor(props) {
|
|
|
super(props);
|
|
|
this.state = {
|
|
|
name: "护理历程",
|
|
|
current: 0,
|
|
|
ViewAddInstrument: false, //用来记录有没有添加设备
|
|
|
array: [1, 2, 3, 4, 5],
|
|
|
recordList: [],
|
|
|
bindingInstrumentList: [],
|
|
|
clockShow: false,
|
|
|
curIndex: null,
|
|
|
clockStatistics: [],
|
|
|
statistics: [],
|
|
|
year: new Date().getFullYear(),
|
|
|
today: new Date(),
|
|
|
monthTime: [
|
|
|
{ month: 1, time: 0 },
|
|
|
{ month: 2, time: 0 },
|
|
|
{ month: 3, time: 0 },
|
|
|
{ month: 4, time: 0 },
|
|
|
{ month: 5, time: 0 },
|
|
|
{ month: 6, time: 0 },
|
|
|
{ month: 7, time: 0 },
|
|
|
{ month: 8, time: 0 },
|
|
|
{ month: 9, time: 0 },
|
|
|
{ month: 10, time: 0 },
|
|
|
{ month: 11, time: 0 },
|
|
|
{ month: 12, time: 0 },
|
|
|
],
|
|
|
show: false,
|
|
|
punchInInfo: {
|
|
|
clockImageList: [],
|
|
|
clockContent: "",
|
|
|
},
|
|
|
navigationBarHeight: "",
|
|
|
statusBarHeight: "",
|
|
|
};
|
|
|
}
|
|
|
|
|
|
componentDidMount() {}
|
|
|
|
|
|
componentWillUnmount() {}
|
|
|
// 格式化时间
|
|
|
getTime(time) {
|
|
|
const hour = time.slice(0, 2);
|
|
|
const minute = time.slice(3, 5);
|
|
|
const second = time.slice(6, 8);
|
|
|
|
|
|
if (hour > 0) {
|
|
|
return hour + "时" + minute + "分" + second + "秒";
|
|
|
} else {
|
|
|
return minute + "分" + second + "秒";
|
|
|
}
|
|
|
}
|
|
|
// 获取仪器列表
|
|
|
async getBindingInstrumentList() {
|
|
|
let res = await InstrumentInfo.bindingInstrumentList();
|
|
|
if (res.data.code === 200) {
|
|
|
this.setState({ bindingInstrumentList: res.data.data });
|
|
|
}
|
|
|
}
|
|
|
// 获取护理历程
|
|
|
async getRecord(id) {
|
|
|
let data = {};
|
|
|
if (id != null) {
|
|
|
data["instrumentId"] = id;
|
|
|
}
|
|
|
let res = await InstrumentInfo.apiNursingLog.getRecord(data);
|
|
|
console.log(res, "查看你获取护理历程");
|
|
|
|
|
|
if (res.data.code === 200) {
|
|
|
res.data.rows.map((item) => {
|
|
|
item.nursingTime = this.getTime(item.nursingTime);
|
|
|
let createTime = getdates(item.createTime);
|
|
|
|
|
|
item.createTime = createTime && createTime.replace(/-/g, ".");
|
|
|
});
|
|
|
this.setState({ recordList: res.data.rows });
|
|
|
}
|
|
|
}
|
|
|
// 查询用户当天最新的一条打卡记录
|
|
|
async getLatestClockRecord() {
|
|
|
let res = await InstrumentInfo.apiClock.getLatestClockRecord();
|
|
|
if (res.data.code === 200) {
|
|
|
if (!res.data.data) {
|
|
|
// this.setShow(true);
|
|
|
} else {
|
|
|
let punchInInfo = {
|
|
|
clockImageList: res.data.data.clockImg,
|
|
|
clockContent: res.data.data.clockContent,
|
|
|
};
|
|
|
this.setState({ punchInInfo });
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
// 添加打卡记录(测试用)
|
|
|
async addLog() {
|
|
|
let data = {
|
|
|
instrumentId: 57,
|
|
|
instrumentName: "0130验收FR100",
|
|
|
online: 1,
|
|
|
modeId: 100,
|
|
|
modeName: "护理记录测试",
|
|
|
nursingTime: "00:15:00",
|
|
|
};
|
|
|
|
|
|
let res = await InstrumentInfo.apiNursingLog.addLog(data);
|
|
|
if (res.data.code === 200) {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**分页获取用户的打卡记录 page size*/
|
|
|
async getClockStatistics(year = this.state.year) {
|
|
|
let res = await InstrumentInfo.apiClock.getClockStatistics({ year });
|
|
|
|
|
|
if (res.data.code === 200) {
|
|
|
res.data.data.reverse();
|
|
|
if (res.data.data.length > 0) {
|
|
|
res.data.data.map((item, index) => {
|
|
|
item.isMore = false;
|
|
|
item.detail = [];
|
|
|
if (index === 0) {
|
|
|
item.isMore = true;
|
|
|
this.getList(item.id, item.year, item.month);
|
|
|
}
|
|
|
this.state.monthTime.map((monthItem) => {
|
|
|
if (monthItem.month == item.month) {
|
|
|
monthItem.time = item.clockNum;
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
this.setState({ monthTime: this.state.monthTime });
|
|
|
} else {
|
|
|
let monthTime = [
|
|
|
{ month: 1, time: 0 },
|
|
|
{ month: 2, time: 0 },
|
|
|
{ month: 3, time: 0 },
|
|
|
{ month: 4, time: 0 },
|
|
|
{ month: 5, time: 0 },
|
|
|
{ month: 6, time: 0 },
|
|
|
{ month: 7, time: 0 },
|
|
|
{ month: 8, time: 0 },
|
|
|
{ month: 9, time: 0 },
|
|
|
{ month: 10, time: 0 },
|
|
|
{ month: 11, time: 0 },
|
|
|
{ month: 12, time: 0 },
|
|
|
];
|
|
|
this.setState({ monthTime });
|
|
|
}
|
|
|
this.setState({ clockStatistics: res.data.data });
|
|
|
}
|
|
|
}
|
|
|
// 文本框输入文字
|
|
|
handleTextareaInput = (e) => {
|
|
|
const punchInInfo = this.state.punchInInfo;
|
|
|
this.setState({
|
|
|
punchInInfo: { ...punchInInfo, clockContent: e.detail.value },
|
|
|
});
|
|
|
};
|
|
|
// 打开/关闭弹窗
|
|
|
setShow(show: boolean) {
|
|
|
this.setState({ show });
|
|
|
}
|
|
|
// 选择仪器
|
|
|
onChangeProduct(id) {
|
|
|
this.setState({ curIndex: id });
|
|
|
this.getRecord(id);
|
|
|
// this.addLog();
|
|
|
}
|
|
|
// 展开收起
|
|
|
onChangeMore(id, year, month) {
|
|
|
this.state.clockStatistics.map((item) => {
|
|
|
if (item.id === id) {
|
|
|
item.isMore = !item.isMore;
|
|
|
if (item.isMore && item.detail.length === 0) {
|
|
|
this.getList(id, year, month);
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
this.setState({ clockStatistics: this.state.clockStatistics });
|
|
|
}
|
|
|
|
|
|
// 获取当月打卡记录
|
|
|
async getList(id, year, month) {
|
|
|
let data = {
|
|
|
year,
|
|
|
month,
|
|
|
};
|
|
|
let res = await InstrumentInfo.apiClock.getList(data);
|
|
|
if (res.data.code === 200) {
|
|
|
console.log(res, 88888, this.state.clockStatistics, id);
|
|
|
|
|
|
this.state.clockStatistics.map((item) => {
|
|
|
if (item.id === id) {
|
|
|
item.detail = res.data.data;
|
|
|
item.detail.map((obj) => {
|
|
|
let updateTime = obj.updateTime
|
|
|
? getdates(obj.updateTime)
|
|
|
: getdates(obj.createTime);
|
|
|
|
|
|
obj.updateTime = updateTime && updateTime.replace(/-/g, ".");
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
this.setState({ clockStatistics: this.state.clockStatistics });
|
|
|
}
|
|
|
}
|
|
|
async DayTime() {
|
|
|
let storedData = Taro.getStorageSync("DayTime");
|
|
|
const day = new Date();
|
|
|
if (storedData === undefined || storedData === "") {
|
|
|
this.setState({
|
|
|
clockShow: false,
|
|
|
});
|
|
|
} else {
|
|
|
const storedDate = new Date(storedData);
|
|
|
const currentDate = new Date(day.toISOString());
|
|
|
|
|
|
const isSameDate =
|
|
|
storedDate.toDateString() === currentDate.toDateString();
|
|
|
if (isSameDate) {
|
|
|
this.setState({
|
|
|
clockShow: true,
|
|
|
});
|
|
|
} else {
|
|
|
this.setState({
|
|
|
clockShow: false,
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
async onLoad(options) {
|
|
|
const ViewAddInstrument = options.param;
|
|
|
this.setState({
|
|
|
ViewAddInstrument: ViewAddInstrument,
|
|
|
});
|
|
|
|
|
|
this.getRecord(null);
|
|
|
this.getBindingInstrumentList();
|
|
|
this.getLatestClockRecord();
|
|
|
this.getClockStatistics();
|
|
|
this.DayTime();
|
|
|
this.setStatusBar();
|
|
|
}
|
|
|
|
|
|
componentDidShow() {}
|
|
|
|
|
|
componentDidHide() {}
|
|
|
|
|
|
async initData() {}
|
|
|
// 选择年份
|
|
|
onChangeYear(event) {
|
|
|
this.setState({ year: event.detail.value });
|
|
|
this.getClockStatistics(event.detail.value);
|
|
|
}
|
|
|
// 点击tab栏
|
|
|
onTab = async (event) => {
|
|
|
const { current } = event.currentTarget.dataset;
|
|
|
this.setState({ current });
|
|
|
if (current === 1) {
|
|
|
this.getClockStatistics();
|
|
|
}
|
|
|
};
|
|
|
// 跳转到护理报告
|
|
|
toReport(id, recordId, item) {
|
|
|
this.state.bindingInstrumentList.map((instrument) => {
|
|
|
if (instrument.id == id) {
|
|
|
setStorageSync("instrument_detail", instrument);
|
|
|
}
|
|
|
});
|
|
|
console.log(item, "查看");
|
|
|
|
|
|
if ([1, 2, 3, 4, 5].includes(item.jumpType)) {
|
|
|
this.One(item);
|
|
|
} else if (item.jumpType === 0) {
|
|
|
this.two(item);
|
|
|
} else if (item.jumpType === 6) {
|
|
|
this.three(item);
|
|
|
} else {
|
|
|
this.AllDevice(item);
|
|
|
}
|
|
|
|
|
|
// let report =false
|
|
|
// go("/recording/pages/face_report/face_report?id=" + id + "&recordId=" + recordId+ "&report=" + report );
|
|
|
}
|
|
|
// 打开第一种类型
|
|
|
One = async (item) => {
|
|
|
let ids = Number(item.id);
|
|
|
// 获取echarts数据 这个是获取接口更新echarts页面
|
|
|
let res2 = await InstrumentInfo.apiNursingLog.getStatiCDE(ids);
|
|
|
let nursingData = JSON.parse(res2.data.data.nursingData);
|
|
|
let obj = {
|
|
|
modeName: res2.data.data.modeName,
|
|
|
data: nursingData,
|
|
|
};
|
|
|
let report = false;
|
|
|
|
|
|
go(
|
|
|
"/recoding/pages/face_report_one/face_report_one?id=" +
|
|
|
item.id +
|
|
|
"&report=" +
|
|
|
report +
|
|
|
"&obj=" +
|
|
|
JSON.stringify(obj)
|
|
|
);
|
|
|
};
|
|
|
// 打开第二种类型
|
|
|
two = async (item) => {
|
|
|
console.log("打开第二种类型", item);
|
|
|
let report = false;
|
|
|
go(
|
|
|
"/recoding/pages/face_report/face_report?id=" +
|
|
|
item.id +
|
|
|
"&recordId=" +
|
|
|
item.instrumentId +
|
|
|
"&report=" +
|
|
|
report
|
|
|
);
|
|
|
};
|
|
|
// 打开第三种类型
|
|
|
three = async (item) => {
|
|
|
this.moistureTest(item);
|
|
|
};
|
|
|
|
|
|
async moistureTest(allData) {
|
|
|
let data = {
|
|
|
queryDate: allData.createTime,
|
|
|
instrumentId: allData.instrumentId,
|
|
|
};
|
|
|
let res = await InstrumentInfo.fr200.moistureTest(data);
|
|
|
let echartsData = res.data.rows;
|
|
|
for (let i = 0; i < echartsData.length; i++) {
|
|
|
for (let j = i + 1; j < echartsData.length; j++) {
|
|
|
if (
|
|
|
echartsData[i].createTime.split(" ")[0] ==
|
|
|
echartsData[j].createTime.split(" ")[0]
|
|
|
) {
|
|
|
let result =
|
|
|
Date.parse(echartsData[i].createTime) -
|
|
|
Date.parse(echartsData[j].createTime);
|
|
|
if (result < 0) {
|
|
|
echartsData.splice(i, 1);
|
|
|
} else {
|
|
|
echartsData.splice(j, 1);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
let gears: any = [];
|
|
|
let eDate: any = [];
|
|
|
echartsData.map((item) => {
|
|
|
const result = item.createTime.split(" ")[0].substring(5);
|
|
|
eDate.push(result);
|
|
|
item.nursingData = JSON.parse(item.nursingData);
|
|
|
let level: any = 0;
|
|
|
item.nursingData?.GearData?.map((gear) => {
|
|
|
level = level + gear.forehead;
|
|
|
});
|
|
|
level = Math.floor(level / 3);
|
|
|
gears.push(level);
|
|
|
});
|
|
|
echartsData = {
|
|
|
gears, eDate
|
|
|
}
|
|
|
setStorageSync('moistureEachtsData', JSON.stringify(echartsData))
|
|
|
let report =false
|
|
|
go(`/recoding/pages/moisture_test_report/moisture_test_report?data=${allData.nursingData}&date=${allData.createTime}&modeId=${allData.modeId}&id=${allData.instrumentId}&echartsData=${JSON.stringify(echartsData)}&report=${report }`);
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
// 打开其他类型
|
|
|
AllDevice = async (item) => {
|
|
|
console.log("打开其他类型", item);
|
|
|
go("/pages/face_report_AllDevice/face_report_AllDevice");
|
|
|
};
|
|
|
// 上传图片
|
|
|
handleChooseImage() {
|
|
|
Taro.chooseMedia({
|
|
|
count: 1,
|
|
|
mediaType: ["image"],
|
|
|
sourceType: ["album", "camera"],
|
|
|
success: (res) => {
|
|
|
const tempFilePaths = res.tempFiles.map((item) => item.tempFilePath);
|
|
|
tempFilePaths?.forEach((item) => {
|
|
|
// eslint-disable-next-line @typescript-eslint/no-shadow
|
|
|
InstrumentInfo.apiClock
|
|
|
.clockFileUpload({ clockImg: item })
|
|
|
.then((res) => {
|
|
|
const currentImage = res.data.url;
|
|
|
const newImageList =
|
|
|
this.state.punchInInfo.clockImageList.length >= 3
|
|
|
? this.state.punchInInfo.clockImageList
|
|
|
: [...this.state.punchInInfo.clockImageList, currentImage];
|
|
|
const punchInInfo = this.state.punchInInfo;
|
|
|
punchInInfo.clockImageList = newImageList;
|
|
|
this.setState({ punchInInfo });
|
|
|
});
|
|
|
});
|
|
|
},
|
|
|
fail: (err) => {
|
|
|
console.info("err", err);
|
|
|
},
|
|
|
});
|
|
|
}
|
|
|
// 删除打卡图片
|
|
|
delImg(i) {
|
|
|
const punchInInfo = this.state.punchInInfo;
|
|
|
punchInInfo.clockImageList.splice(i, 1);
|
|
|
this.setState({ punchInInfo });
|
|
|
}
|
|
|
async submit() {
|
|
|
let punchInInfo = this.state.punchInInfo || {};
|
|
|
if (!punchInInfo.clockImageList.length) {
|
|
|
Taro.showToast({
|
|
|
title: "请上传图片",
|
|
|
icon: "none",
|
|
|
});
|
|
|
return;
|
|
|
}
|
|
|
if (!punchInInfo.clockContent) {
|
|
|
Taro.showToast({
|
|
|
title: "请输入打卡心得",
|
|
|
icon: "none",
|
|
|
});
|
|
|
return;
|
|
|
}
|
|
|
InstrumentInfo.apiClock.postInsertClockLog(punchInInfo).then((res) => {
|
|
|
showModal({
|
|
|
t2: "您已完成今日打卡",
|
|
|
btn1show: false,
|
|
|
}).then(() => {
|
|
|
let data = new Date();
|
|
|
Taro.setStorageSync("DayTime", data.toISOString());
|
|
|
this.setState({
|
|
|
clockShow: true,
|
|
|
});
|
|
|
this.getClockStatistics();
|
|
|
this.setShow(false);
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
back() {
|
|
|
Taro.navigateBack({
|
|
|
delta: 1,
|
|
|
});
|
|
|
}
|
|
|
|
|
|
setStatusBar() {
|
|
|
Taro.getSystemInfoAsync({
|
|
|
success: (res) => {
|
|
|
const statusBarHeight = res.statusBarHeight || 0;
|
|
|
// 获取微信胶囊的位置信息 width,height,top,right,left,bottom
|
|
|
const custom = Taro.getMenuButtonBoundingClientRect();
|
|
|
// 导航栏高度(标题栏高度) = 胶囊高度 + (顶部距离 - 状态栏高度) * 2
|
|
|
const navigationBarHeight =
|
|
|
custom.height + (custom.top - statusBarHeight) * 2;
|
|
|
this.setState({
|
|
|
statusBarHeight,
|
|
|
navigationBarHeight,
|
|
|
});
|
|
|
},
|
|
|
});
|
|
|
}
|
|
|
|
|
|
render() {
|
|
|
let {
|
|
|
current,
|
|
|
array,
|
|
|
name,
|
|
|
recordList,
|
|
|
ViewAddInstrument,
|
|
|
bindingInstrumentList,
|
|
|
clockShow,
|
|
|
curIndex,
|
|
|
clockStatistics,
|
|
|
statistics,
|
|
|
year,
|
|
|
today,
|
|
|
monthTime,
|
|
|
show,
|
|
|
punchInInfo,
|
|
|
navigationBarHeight,
|
|
|
statusBarHeight,
|
|
|
} = this.state;
|
|
|
const statusBarHeightRpx = statusBarHeight * 2;
|
|
|
const navigationBarHeightRpx = navigationBarHeight * 2;
|
|
|
const height = statusBarHeightRpx + navigationBarHeightRpx;
|
|
|
return (
|
|
|
<Block>
|
|
|
<Navbar isBack titleSlot="护理记录"></Navbar>
|
|
|
<View
|
|
|
className="tabs"
|
|
|
style={{
|
|
|
top: height + "rpx",
|
|
|
position: "sticky",
|
|
|
}}
|
|
|
>
|
|
|
<View
|
|
|
className={classnames("tab", {
|
|
|
tab_active: current === 0,
|
|
|
})}
|
|
|
data-current={0}
|
|
|
onClick={this.onTab}
|
|
|
>
|
|
|
护理历程
|
|
|
</View>
|
|
|
<View
|
|
|
className={classnames("tab", {
|
|
|
tab_active: current === 1,
|
|
|
})}
|
|
|
data-current={1}
|
|
|
onClick={this.onTab}
|
|
|
>
|
|
|
打卡统计
|
|
|
</View>
|
|
|
</View>
|
|
|
{current === 0 && (
|
|
|
<ScrollView
|
|
|
className="products_list"
|
|
|
scroll-x="true"
|
|
|
style={{
|
|
|
top: height + 110 + "rpx",
|
|
|
position: "sticky",
|
|
|
}}
|
|
|
>
|
|
|
<View
|
|
|
className={classnames("all", {
|
|
|
products_item_active: !curIndex,
|
|
|
})}
|
|
|
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
|
|
|
className="products_cover"
|
|
|
src={item.logo}
|
|
|
mode="aspectFill"
|
|
|
></Image>
|
|
|
<View className="products_title">{item.name}</View>
|
|
|
</View>
|
|
|
))}
|
|
|
</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'>护理时间:15分00秒</View>
|
|
|
</View>
|
|
|
</View>
|
|
|
</View>
|
|
|
</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
|
|
|
className={classnames("tip", {
|
|
|
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>
|
|
|
)}
|
|
|
{current === 1 && (
|
|
|
<View style="padding-bottom:200px">
|
|
|
{/* <View className='nodata'>
|
|
|
<Image
|
|
|
className='nodata_img'
|
|
|
src={require("../../img/nodata.png")}
|
|
|
></Image>
|
|
|
<View className='nodata_text'>暂无数据</View>
|
|
|
</View> */}
|
|
|
<View style="height: 30rpx; background: #F8F8F8"></View>
|
|
|
<View className="clock_in_statistics m-x-30 flex sb">
|
|
|
<View className="flex sb ab">
|
|
|
<View className="clock_in_statistics_title">年度打卡统计</View>
|
|
|
<Picker
|
|
|
mode="date"
|
|
|
fields="year"
|
|
|
onChange={this.onChangeYear.bind(this)}
|
|
|
value="{{year}}"
|
|
|
end="{{today}}"
|
|
|
>
|
|
|
<View className="clock_in_statistics_date flex aitems">
|
|
|
<View>{year}年</View>
|
|
|
<Image
|
|
|
className="more_icon"
|
|
|
src={require("@/img/arrow-down.png")}
|
|
|
mode="widthFix"
|
|
|
></Image>
|
|
|
</View>
|
|
|
</Picker>
|
|
|
</View>
|
|
|
<View className="chart flex sb">
|
|
|
{monthTime.map((item) => (
|
|
|
<View className="flex fc aitems" key={item.month}>
|
|
|
{item.time > 0 && (
|
|
|
<View className="buoy">{item.time}天</View>
|
|
|
)}
|
|
|
<View
|
|
|
className="column"
|
|
|
style={{ height: `calc(186/31*${item.time}rpx)` }}
|
|
|
></View>
|
|
|
<View className="month">{item.month}</View>
|
|
|
</View>
|
|
|
))}
|
|
|
</View>
|
|
|
</View>
|
|
|
<View style="padding-bottom: env(safe-area-inset-bottom)">
|
|
|
<View className="month_box m-x-30">
|
|
|
{clockStatistics.map((item) => (
|
|
|
<View className="month_statistics" key={item.id}>
|
|
|
<View className="flex aitems sb">
|
|
|
<View className="month_item_date">
|
|
|
{item.year}年{item.month}月
|
|
|
</View>
|
|
|
<View
|
|
|
className="more_box flex aitems"
|
|
|
onClick={this.onChangeMore.bind(
|
|
|
this,
|
|
|
item.id,
|
|
|
item.year,
|
|
|
item.month
|
|
|
)}
|
|
|
>
|
|
|
<View className="more_text">
|
|
|
{" "}
|
|
|
{!item.isMore ? "展开更多" : "收起更多"}
|
|
|
</View>
|
|
|
<Image
|
|
|
style={{
|
|
|
transform: item.isMore
|
|
|
? "rotate(180deg)"
|
|
|
: "rotate(0deg)",
|
|
|
}}
|
|
|
className="more_icon"
|
|
|
src={require("@/img/arrow-down.png")}
|
|
|
mode="widthFix"
|
|
|
></Image>
|
|
|
</View>
|
|
|
</View>
|
|
|
<View style="height: 59rpx"></View>
|
|
|
<View className="statistic">
|
|
|
<View className="statistic_item">
|
|
|
<View className="statistic_num">{item.clockNum}</View>
|
|
|
<View className="statistic_desc">本月打卡天数</View>
|
|
|
</View>
|
|
|
<View className="statistic_item">
|
|
|
<View className="statistic_num">
|
|
|
{(item.percentage * 100).toFixed(2)}%
|
|
|
</View>
|
|
|
<View className="statistic_desc">超越花至用户</View>
|
|
|
</View>
|
|
|
<View className="border"></View>
|
|
|
</View>
|
|
|
{item.isMore && item.detail && (
|
|
|
<View>
|
|
|
{item.detail.map((obj) => (
|
|
|
<View key={obj.id}>
|
|
|
<View style="height: 57rpx"></View>
|
|
|
<View className="month_item">
|
|
|
<View className="month_item_date">
|
|
|
{obj.updateTime}
|
|
|
</View>
|
|
|
<View className="month_image_box flex sb">
|
|
|
{obj.clockImg.map((img) => (
|
|
|
<Image
|
|
|
key={img}
|
|
|
className="month_item_cover"
|
|
|
src={img}
|
|
|
></Image>
|
|
|
))}
|
|
|
</View>
|
|
|
<View className="month_item_date">
|
|
|
{/* 小紫弹智能射频仪、花至抗老射频仪PRO{" "} */}
|
|
|
{obj.instrumentName === null
|
|
|
? ""
|
|
|
: obj.instrumentName}
|
|
|
</View>
|
|
|
<View className="month_item_note">
|
|
|
{obj.clockContent}
|
|
|
</View>
|
|
|
</View>
|
|
|
</View>
|
|
|
))}
|
|
|
</View>
|
|
|
)}
|
|
|
</View>
|
|
|
))}
|
|
|
</View>
|
|
|
</View>
|
|
|
</View>
|
|
|
)}
|
|
|
{!clockShow && ViewAddInstrument === "true" && (
|
|
|
<View className="footer flex aitems">
|
|
|
<View className="btn" onClick={this.setShow.bind(this, true)}>
|
|
|
前往打卡
|
|
|
</View>
|
|
|
{/* <View className="text" onClick={this.back}>
|
|
|
跳过 >
|
|
|
</View> */}
|
|
|
</View>
|
|
|
)}
|
|
|
|
|
|
<Popup show={show} onClose={() => this.setState({ show: false })}>
|
|
|
<View className="popBox">
|
|
|
<Image
|
|
|
className="close_icon"
|
|
|
src={require("@/img/close.png")}
|
|
|
mode="widthFix"
|
|
|
onClick={this.setShow.bind(this, false)}
|
|
|
></Image>
|
|
|
<View className="popTitle">今日打卡</View>
|
|
|
<View className="popSubtitle">
|
|
|
本月您已打卡
|
|
|
<View className="bold">{clockStatistics[0]?.clockNum}</View>{" "}
|
|
|
天,超越
|
|
|
<View className="bold">
|
|
|
{(clockStatistics[0]?.percentage * 100).toFixed(1)}%
|
|
|
</View>
|
|
|
花至用户
|
|
|
</View>
|
|
|
<View className="img_box">
|
|
|
{punchInInfo.clockImageList.map((item, index) => (
|
|
|
<View key={item} className="img">
|
|
|
<Image className="showImg" src={item} mode="widthFix"></Image>
|
|
|
<Image
|
|
|
className="closeImg"
|
|
|
src={require("@/img/close1.png")}
|
|
|
mode="widthFix"
|
|
|
onClick={this.delImg.bind(this, index)}
|
|
|
></Image>
|
|
|
</View>
|
|
|
))}
|
|
|
{punchInInfo.clockImageList.length < 3 && (
|
|
|
<View
|
|
|
className="addBox"
|
|
|
onClick={this.handleChooseImage.bind(this)}
|
|
|
>
|
|
|
<Image
|
|
|
className="showImg"
|
|
|
src={require("@/img/clock_in_upload/add-image.png")}
|
|
|
mode="widthFix"
|
|
|
></Image>
|
|
|
</View>
|
|
|
)}
|
|
|
</View>
|
|
|
<View className="info4">
|
|
|
<View className="content">
|
|
|
<Textarea
|
|
|
placeholderStyle="color: #ccc; font-size: 26rpx;font-weight: 400;font-family: PingFang SC;"
|
|
|
placeholder="请记录一下今天的护理心得吧"
|
|
|
maxlength={120}
|
|
|
onInput={this.handleTextareaInput.bind(this)}
|
|
|
value={punchInInfo.clockContent}
|
|
|
></Textarea>
|
|
|
</View>
|
|
|
<View className="tip">
|
|
|
{"(" + (punchInInfo.clockContent.length || 0) + "/120)"}
|
|
|
</View>
|
|
|
</View>
|
|
|
<View className="popbtnbox flex aitems jcenter">
|
|
|
<View className="btn1" onClick={this.submit.bind(this)}>
|
|
|
确认提交
|
|
|
</View>
|
|
|
</View>
|
|
|
</View>
|
|
|
</Popup>
|
|
|
</Block>
|
|
|
);
|
|
|
}
|
|
|
}
|