|
@@ -4,6 +4,7 @@ import Map from '@/components/map';
|
|
|
import TopNavigator from '@/components/topNavigator';
|
|
|
import RunNavRight from './components/topNavRight';
|
|
|
import { FormattedMessage, history, useModel } from 'umi';
|
|
|
+import { Spin } from 'antd';
|
|
|
import { Popover } from 'antd';
|
|
|
import styles from './index.less';
|
|
|
import mapstyles from '@/assets/css/map.less';
|
|
@@ -23,7 +24,7 @@ type runtimeNavType = {
|
|
|
const Runtime: React.FC = () => {
|
|
|
// const { maptemp6 } = equipImageMap;
|
|
|
const { getSpaceFunc } = useModel('spaceFunc');
|
|
|
-
|
|
|
+ const [loading, setLoading] = useState<boolean>(true);
|
|
|
const [searchText, setSearchText] = useState<{ text: any }>();
|
|
|
const [runtimeNav, setRuntimeNav] = useState<runtimeNavType>({});
|
|
|
const [mapList, setMapList] = useState<API.MapInfo[]>([]);
|
|
@@ -63,46 +64,50 @@ const Runtime: React.FC = () => {
|
|
|
//获取时间列表 spaceTimeList
|
|
|
useEffect(() => {
|
|
|
if (selFloorId && selTime) {
|
|
|
- //debugger;
|
|
|
+ setLoading(true);
|
|
|
queryDeviceTimeManage({
|
|
|
//floorId: selFloorId,
|
|
|
floorId: 'Fl11010802593241ec348ecb4148806b9034c8957454',
|
|
|
//date: selTime,
|
|
|
date: 20220212,
|
|
|
- }).then(function (res) {
|
|
|
- //debugger;
|
|
|
- var resdata = res || {};
|
|
|
- setRuntimeNav({
|
|
|
- normalRun: resdata.workTimeNum,
|
|
|
- overtimeWork: resdata.overTimeNum,
|
|
|
- overtimeBook: resdata.meetTimeNum,
|
|
|
- });
|
|
|
- var resList = res.content || [];
|
|
|
- resList.forEach((ritem) => {
|
|
|
- ritem.runTimeStatus = 'normalRun';
|
|
|
- var timeList = [];
|
|
|
- if (ritem.hasOwnProperty('workTimeStartTime')) {
|
|
|
- var timeStrArr = [ritem.workTimeStartTime, ritem.workTimeEndTime];
|
|
|
- timeList.push(timeStrArr);
|
|
|
- }
|
|
|
- if (ritem.hasOwnProperty('meetTime')) {
|
|
|
- ritem.runTimeStatus = 'overtimeBook';
|
|
|
- ritem.meetTime.forEach((meetitem) => {
|
|
|
- var timeStrArr = [meetitem.meetTimeStartTime, meetitem.meetTimeEndTime];
|
|
|
+ })
|
|
|
+ .then(function (res) {
|
|
|
+ setLoading(false);
|
|
|
+ var resdata = res || {};
|
|
|
+ setRuntimeNav({
|
|
|
+ normalRun: resdata.workTimeNum,
|
|
|
+ overtimeWork: resdata.overTimeNum,
|
|
|
+ overtimeBook: resdata.meetTimeNum,
|
|
|
+ });
|
|
|
+ var resList = res.content || [];
|
|
|
+ resList.forEach((ritem) => {
|
|
|
+ ritem.runTimeStatus = 'normalRun';
|
|
|
+ var timeList = [];
|
|
|
+ if (ritem.hasOwnProperty('workTimeStartTime')) {
|
|
|
+ var timeStrArr = [ritem.workTimeStartTime, ritem.workTimeEndTime];
|
|
|
+ timeList.push(timeStrArr);
|
|
|
+ }
|
|
|
+ if (ritem.hasOwnProperty('meetTime')) {
|
|
|
+ ritem.runTimeStatus = 'overtimeBook';
|
|
|
+ ritem.meetTime.forEach((meetitem) => {
|
|
|
+ var timeStrArr = [meetitem.meetTimeStartTime, meetitem.meetTimeEndTime];
|
|
|
+ timeList.push(timeStrArr);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ if (ritem.hasOwnProperty('overTimeStartTime')) {
|
|
|
+ var timeStrArr = [ritem.overTimeStartTime, ritem.overTimeEndTime];
|
|
|
timeList.push(timeStrArr);
|
|
|
- });
|
|
|
- }
|
|
|
- if (ritem.hasOwnProperty('overTimeStartTime')) {
|
|
|
- var timeStrArr = [ritem.overTimeStartTime, ritem.overTimeEndTime];
|
|
|
- timeList.push(timeStrArr);
|
|
|
- ritem.runTimeStatus = 'overtimeWork';
|
|
|
- }
|
|
|
- ritem.showTimeList = timeList;
|
|
|
- ritem.showTimeStr =
|
|
|
- timeList.length > 0 ? timeList[0][0] + '-' + timeList[timeList.length - 1][1] : '';
|
|
|
+ ritem.runTimeStatus = 'overtimeWork';
|
|
|
+ }
|
|
|
+ ritem.showTimeList = timeList;
|
|
|
+ ritem.showTimeStr =
|
|
|
+ timeList.length > 0 ? timeList[0][0] + '-' + timeList[timeList.length - 1][1] : '';
|
|
|
+ });
|
|
|
+ setSpaceTimeList(resList);
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ setLoading(false);
|
|
|
});
|
|
|
- setSpaceTimeList(resList);
|
|
|
- });
|
|
|
}
|
|
|
}, [selFloorId, selTime]);
|
|
|
|
|
@@ -111,7 +116,7 @@ const Runtime: React.FC = () => {
|
|
|
console.log('dfsd-------', mapList, spaceTimeList);
|
|
|
// if (mapList && mapList.length > 0 && spaceTimeList && spaceTimeList.length > 0) {
|
|
|
|
|
|
- var combineList = [];
|
|
|
+ var combineList: any = [];
|
|
|
mapList.map(function (mitem) {
|
|
|
var spaceId = mitem.spaceId;
|
|
|
var filterSpace = spaceTimeList.filter((ele) => {
|
|
@@ -169,72 +174,74 @@ const Runtime: React.FC = () => {
|
|
|
<div className={mapstyles.name}>Jozy Zone</div>
|
|
|
</div>
|
|
|
</div> */}
|
|
|
- <Map
|
|
|
- searchText={searchText}
|
|
|
- selFloorId={selFloorId}
|
|
|
- mapList={mapCombineList}
|
|
|
- type={'runtime'}
|
|
|
- render={(item, index) => {
|
|
|
- return (
|
|
|
- <div
|
|
|
- key={index + 'house'}
|
|
|
- className={mapstyles.house}
|
|
|
- style={{
|
|
|
- left: item.left,
|
|
|
- top: item.top,
|
|
|
- width: item.width,
|
|
|
- height: item.height,
|
|
|
- background: item.roomFuncType
|
|
|
- ? item.runTimeStatus == 'overtimeBook'
|
|
|
- ? 'rgba(0, 220, 35, 0.2)'
|
|
|
- : item.runTimeStatus == 'overtimeWork'
|
|
|
- ? 'rgba(94, 139, 207, 0.2)'
|
|
|
- : 'rgba(196, 196, 196, 0.2)'
|
|
|
- : 'repeating-linear-gradient(45deg, rgb(226 226 226), #ffffff 8px)',
|
|
|
- }}
|
|
|
- >
|
|
|
- <div className={mapstyles.allTime}>
|
|
|
- {/* {(item.timeList || []).map(function (titem: string, tindex: number) {
|
|
|
+ <Spin spinning={loading}>
|
|
|
+ <Map
|
|
|
+ searchText={searchText}
|
|
|
+ selFloorId={selFloorId}
|
|
|
+ mapList={mapCombineList}
|
|
|
+ type={'runtime'}
|
|
|
+ render={(item, index) => {
|
|
|
+ return (
|
|
|
+ <div
|
|
|
+ key={index + 'house'}
|
|
|
+ className={mapstyles.house}
|
|
|
+ style={{
|
|
|
+ left: item.left,
|
|
|
+ top: item.top,
|
|
|
+ width: item.width,
|
|
|
+ height: item.height,
|
|
|
+ background: item.roomFuncType
|
|
|
+ ? item.runTimeStatus == 'overtimeBook'
|
|
|
+ ? 'rgba(0, 220, 35, 0.2)'
|
|
|
+ : item.runTimeStatus == 'overtimeWork'
|
|
|
+ ? 'rgba(94, 139, 207, 0.2)'
|
|
|
+ : 'rgba(196, 196, 196, 0.2)'
|
|
|
+ : 'repeating-linear-gradient(45deg, rgb(226 226 226), #ffffff 8px)',
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ <div className={mapstyles.allTime}>
|
|
|
+ {/* {(item.timeList || []).map(function (titem: string, tindex: number) {
|
|
|
return <span key={tindex + 'time'}>{titem},</span>;
|
|
|
})} */}
|
|
|
- {item.showTimeList && item.showTimeList.length > 1 && (
|
|
|
- <Popover
|
|
|
- content={(item.showTimeList || []).map((timeItem, index) => {
|
|
|
- return (
|
|
|
- <div key={'time' + index}>
|
|
|
- {timeItem[0]}-{timeItem[1]}
|
|
|
- </div>
|
|
|
- );
|
|
|
- })}
|
|
|
- trigger="hover"
|
|
|
- style={{ color: 'none' }}
|
|
|
- >
|
|
|
- <span
|
|
|
- className={cx({
|
|
|
- [mapstyles.overworkTime]: item.runTimeStatus == 'overtimeWork',
|
|
|
- [mapstyles.meetTime]: item.runTimeStatus == 'overtimeBook',
|
|
|
+ {item.showTimeList && item.showTimeList.length > 1 && (
|
|
|
+ <Popover
|
|
|
+ content={(item.showTimeList || []).map((timeItem, index) => {
|
|
|
+ return (
|
|
|
+ <div key={'time' + index}>
|
|
|
+ {timeItem[0]}-{timeItem[1]}
|
|
|
+ </div>
|
|
|
+ );
|
|
|
})}
|
|
|
+ trigger="hover"
|
|
|
+ style={{ color: 'none' }}
|
|
|
>
|
|
|
- {item.showTimeStr}
|
|
|
- </span>
|
|
|
- </Popover>
|
|
|
- )}
|
|
|
- {item.showTimeList && item.showTimeList.length == 1 && (
|
|
|
- <span>{item.showTimeStr}</span>
|
|
|
- )}
|
|
|
- </div>
|
|
|
- <div className={mapstyles.content}>
|
|
|
- <Icon
|
|
|
- className=""
|
|
|
- type={getSpaceFunc(item.roomFuncType)}
|
|
|
- style={{ fontSize: 20 }}
|
|
|
- ></Icon>
|
|
|
- <div className={mapstyles.name}>{item.localName}</div>
|
|
|
+ <span
|
|
|
+ className={cx({
|
|
|
+ [mapstyles.overworkTime]: item.runTimeStatus == 'overtimeWork',
|
|
|
+ [mapstyles.meetTime]: item.runTimeStatus == 'overtimeBook',
|
|
|
+ })}
|
|
|
+ >
|
|
|
+ {item.showTimeStr}
|
|
|
+ </span>
|
|
|
+ </Popover>
|
|
|
+ )}
|
|
|
+ {item.showTimeList && item.showTimeList.length == 1 && (
|
|
|
+ <span>{item.showTimeStr}</span>
|
|
|
+ )}
|
|
|
+ </div>
|
|
|
+ <div className={mapstyles.content}>
|
|
|
+ <Icon
|
|
|
+ className=""
|
|
|
+ type={getSpaceFunc(item.roomFuncType)}
|
|
|
+ style={{ fontSize: 20 }}
|
|
|
+ ></Icon>
|
|
|
+ <div className={mapstyles.name}>{item.localName}</div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- );
|
|
|
- }}
|
|
|
- ></Map>
|
|
|
+ );
|
|
|
+ }}
|
|
|
+ ></Map>
|
|
|
+ </Spin>
|
|
|
</>
|
|
|
);
|
|
|
};
|