|
@@ -6,11 +6,16 @@ import SearchInput from '@/sagacare_components/SearchInput';
|
|
|
import TopNavigator from '@/sagacare_components/topNavigator';
|
|
|
import ChartModal from './components/chartModal';
|
|
|
import moment from 'moment';
|
|
|
-import { getMapList, queryEnvironmentParam } from '@/services/sagacare_service/environment';
|
|
|
+import {
|
|
|
+ getMapList,
|
|
|
+ queryEnvironmentParam,
|
|
|
+ getSeasonType,
|
|
|
+} from '@/services/sagacare_service/environment';
|
|
|
import { projectObj } from '@/config/api.js';
|
|
|
import { equipImageMap } from '@/config/sagacare/sagacare_image.js';
|
|
|
import { Spin } from 'antd';
|
|
|
import Icon from '@/tenants-ui/SgIcon';
|
|
|
+import { getMaxScale } from '@/hooks/useMap';
|
|
|
|
|
|
import cx from 'classnames';
|
|
|
import styles from './index.less';
|
|
@@ -99,6 +104,8 @@ const Environment: React.FC = () => {
|
|
|
const [selNavId, setSelNavId] = useState<string>(navigatorList[0].id);
|
|
|
const [mapList, setMapList] = useState<API.MapInfo[]>([]);
|
|
|
|
|
|
+ const [seasonType, setSeasonType] = useState<any>('Cooling');
|
|
|
+ const [scale, setScale] = useState<number>(0.8);
|
|
|
const [maxScale, setMaxScale] = useState<number>(1);
|
|
|
const [mapSize, setMapSize] = useState<any>({});
|
|
|
const mapListCopy = useRef<any[]>([]);
|
|
@@ -161,27 +168,7 @@ const Environment: React.FC = () => {
|
|
|
item.top = item.top * mscale;
|
|
|
});
|
|
|
|
|
|
- var maxScaleTemp = 1.1;
|
|
|
- if (data.length > 0) {
|
|
|
- //找到合适的最大缩放倍数
|
|
|
- for (var i = 1; i < 12; i++) {
|
|
|
- var num = 0;
|
|
|
- data.forEach((item, index) => {
|
|
|
- var mwidth = item.width * maxScaleTemp;
|
|
|
- if (mwidth > 65) {
|
|
|
- num = num + 1;
|
|
|
- }
|
|
|
- });
|
|
|
- console.log('width', num, data.length, i);
|
|
|
-
|
|
|
- if (num / data.length > 0.92) {
|
|
|
- break;
|
|
|
- } else {
|
|
|
- maxScaleTemp = maxScaleTemp + 0.1;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- console.log('maxScaleTemp', maxScaleTemp);
|
|
|
+ var maxScaleTemp = getMaxScale(data);
|
|
|
setMaxScale(maxScaleTemp);
|
|
|
|
|
|
setMapList(data);
|
|
@@ -197,6 +184,7 @@ const Environment: React.FC = () => {
|
|
|
|
|
|
const changeMapList = useCallback(
|
|
|
(mscale, moveWidth, moveHeight) => {
|
|
|
+ setScale(mscale);
|
|
|
var mapListTemp = JSON.parse(JSON.stringify(mapListCopy.current));
|
|
|
var mapListTemp2 = mapListTemp.map((item, index) => {
|
|
|
if (index == 0) {
|
|
@@ -217,30 +205,37 @@ const Environment: React.FC = () => {
|
|
|
useEffect(() => {
|
|
|
if (selNavId && selFloorId) {
|
|
|
//setLoading(true);
|
|
|
+
|
|
|
+ var p1 = getSeasonType({
|
|
|
+ projectId: projectObj.projectId,
|
|
|
+ date: moment().format('YYYYMMDD'),
|
|
|
+ });
|
|
|
var floorParams = [{ id: selFloorId, projectId: projectObj.projectId }];
|
|
|
var endTime = moment();
|
|
|
var startTime = moment().subtract(30, 'minutes');
|
|
|
var startStr = startTime.format('YYYYMMDDHHmmss');
|
|
|
var endStr = endTime.format('YYYYMMDDHHmmss');
|
|
|
|
|
|
- queryEnvironmentParam(floorParams, {
|
|
|
+ var p2 = queryEnvironmentParam(floorParams, {
|
|
|
endTime: endStr,
|
|
|
startTime: startStr,
|
|
|
param: selNavId,
|
|
|
- })
|
|
|
- .then((res) => {
|
|
|
- //setLoading(false);
|
|
|
- var avgValues = (res.data || {}).avgValues;
|
|
|
+ });
|
|
|
+
|
|
|
+ Promise.all([p1, p2])
|
|
|
+ .then(function (result) {
|
|
|
+ var season = (result[0] && result[0].data) || 'Cooling';
|
|
|
+ setSeasonType(season);
|
|
|
+ var environment = (result[1] && result[1].data) || {};
|
|
|
+ var avgValues = environment.avgValues;
|
|
|
avgValues = avgValues ? avgValues.toFixed(selNav.fixed) : avgValues;
|
|
|
var navTemp = { ...selNav, avgValues: avgValues };
|
|
|
setSelNav(navTemp);
|
|
|
//空间环境数据
|
|
|
- var dataSpaces = ((res.data || {}).floors[0] || {}).dataSpaces || [];
|
|
|
+ var dataSpaces = (environment.floors[0] || {}).dataSpaces || [];
|
|
|
setEnvirMapList(dataSpaces);
|
|
|
})
|
|
|
- .catch(() => {
|
|
|
- // setLoading(false);
|
|
|
- });
|
|
|
+ .catch(function (err) {});
|
|
|
}
|
|
|
}, [selNavId, selFloorId]);
|
|
|
//合并空间环境数据 和 空间数据
|
|
@@ -288,6 +283,7 @@ const Environment: React.FC = () => {
|
|
|
<TopNavigator
|
|
|
navigatorList={navigatorList}
|
|
|
type={'enviroment'}
|
|
|
+ seasonType={seasonType}
|
|
|
navigatorChange={navigatorChange}
|
|
|
changeFloorId={changeFloorId}
|
|
|
changeBuildId={changeBuildId}
|
|
@@ -363,32 +359,37 @@ const Environment: React.FC = () => {
|
|
|
}}
|
|
|
>
|
|
|
<div className={mapstyles.content}>
|
|
|
- <div className={mapstyles.contentDiv}>
|
|
|
- <Icon
|
|
|
- className=""
|
|
|
- type={getSpaceFunc(item.roomFuncType)}
|
|
|
- style={{
|
|
|
- fontSize: 18,
|
|
|
- display: item.width > 40 && item.height > 40 ? 'block' : 'none',
|
|
|
- }}
|
|
|
- ></Icon>
|
|
|
- <div
|
|
|
- className={mapstyles.name}
|
|
|
- style={{
|
|
|
- display:
|
|
|
- (item.width > 80 && item.height > 70) ||
|
|
|
- item.width > 100 ||
|
|
|
- item.height > 90
|
|
|
- ? 'block'
|
|
|
- : 'none',
|
|
|
- }}
|
|
|
- >
|
|
|
- {item.localName}
|
|
|
- </div>
|
|
|
- {getSpaceFunc(item.roomFuncType) &&
|
|
|
- ((item.width < 40 && item.height < 90) ||
|
|
|
- (item.height < 40 && item.width < 100)) && <div>.</div>}
|
|
|
+ <Icon
|
|
|
+ className=""
|
|
|
+ type={getSpaceFunc(item.roomFuncType)}
|
|
|
+ style={{
|
|
|
+ fontSize: 18,
|
|
|
+ display: item.width > 28 && item.height > 50 ? 'block' : 'none',
|
|
|
+ }}
|
|
|
+ ></Icon>
|
|
|
+ <div
|
|
|
+ className={mapstyles.name}
|
|
|
+ style={{
|
|
|
+ display:
|
|
|
+ (item.width > 64 && item.height > 80) ||
|
|
|
+ item.height > 140 ||
|
|
|
+ item.width > 120 ||
|
|
|
+ scale == maxScale
|
|
|
+ ? 'block'
|
|
|
+ : 'none',
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {item.localName}
|
|
|
</div>
|
|
|
+ {(getSpaceFunc(item.roomFuncType) || item.localName) &&
|
|
|
+ !(
|
|
|
+ (getSpaceFunc(item.roomFuncType) && item.width > 28 && item.height > 50) ||
|
|
|
+ (item.localName &&
|
|
|
+ ((item.width > 64 && item.height > 80) ||
|
|
|
+ item.height > 140 ||
|
|
|
+ item.width > 120 ||
|
|
|
+ scale == maxScale))
|
|
|
+ ) && <div className={mapstyles.pointer}>.</div>}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|