123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121 |
- import React, { useState, useEffect, useCallback, useRef } from 'react';
- import { message } from 'antd';
- import styles from './index.less';
- import commonStyles from '../common.less';
- import { equipImageMap } from '@/config/image.js';
- import AnSwitch from '../anSwitch';
- import { getLampHttp, getStatusHttp, setallLampHttp } from '@/services/ant-design-pro/equipment';
- import { setallLamps } from '@/pages/Equipment/checLampStatus.js';
- const { lamp_open, lamp_close, expend_down, expend_up } = equipImageMap;
- export default ({ spaceId }) => {
- const [isMore, setIsMore] = useState(false);
- const [isOpen, setIsOpen] = useState(false); // 12 开, 10关
- const [lampArr, setLampArr] = useState([]);
- let startTime = null;
- let endTime = null;
- const startLightsStatusTimer = useRef(null);
- const getLamp = () => {
- getLampHttp(spaceId).then((res) => {
- if (res.result != 'success') return;
- const arr = res.content;
- if (arr.length > 1) {
- setIsMore(true);
- let totalIsOpen = false;
- arr.forEach((item) => {
- if (item.runStatus) {
- totalIsOpen = true;
- }
- });
- setIsOpen(totalIsOpen);
- } else {
- arr.forEach((item) => {
- if (item.runStatus) {
- setIsOpen(true);
- } else {
- setIsOpen(false);
- }
- });
- }
- setLampArr(arr);
- });
- };
- useEffect(() => {
- getLamp();
- // startLightsStatusTimer.current = setInterval(() => {
- // getLamp(); // 灯设备状态
- // }, 1000);
- // return () => {
- // clearInterval(startLightsStatusTimer.current);
- // };
- }, []);
- const [flagSvg, setFlagSvg] = useState(false);
- function handleExpend() {
- setFlagSvg(!flagSvg);
- }
- const changeSwitch = (val, type, id) => {
- let paramsArr = [];
- if (type == 'total') {
- lampArr.forEach((item) => {
- paramsArr.push({
- id: item.id,
- switch: val,
- });
- });
- } else {
- paramsArr.push({ id: id, switch: val });
- }
- setallLamps(paramsArr, getLamp);
- };
- return (
- <div className={commonStyles.box}>
- <div className={commonStyles.content}>
- <div className={commonStyles.env}>
- <div className={commonStyles.envLeft}>
- <span className={commonStyles.eqTitle}>{isMore ? '光照' : lampArr[0]?.localName}</span>
- <div className={`${commonStyles.eqStatus} ${commonStyles.pdt10}`}>
- <span>{isOpen ? '照明已开启' : '照明已关闭'}</span>
- </div>
- {isMore && (
- <div className={commonStyles.showAll} onClick={handleExpend}>
- <img className={commonStyles.showImg} src={flagSvg ? expend_up : expend_down}></img>
- <div className={commonStyles.showAllText}>显示全部</div>
- </div>
- )}
- </div>
- <div className={commonStyles.envRight}>
- <img className={commonStyles.roomEqImg} src={isOpen ? lamp_open : lamp_close} />
- </div>
- {!flagSvg && (
- <div
- className={commonStyles.eqBtn}
- onClick={() => {
- changeSwitch(!isOpen, 'total');
- }}
- >
- <AnSwitch isOpen={isOpen} />
- </div>
- )}
- </div>
- </div>
- {lampArr.map((item, idx) => {
- if (flagSvg) {
- return (
- <div className={`${styles.lampChild} ${commonStyles.flexBetween}`} key={item.id}>
- <div className={commonStyles.eqTitle}>{item.localName}</div>
- <div
- onClick={() => {
- changeSwitch(!item.runStatus, 'child', item.id);
- }}
- >
- <AnSwitch isOpen={item.runStatus}></AnSwitch>
- </div>
- </div>
- );
- }
- })}
- </div>
- );
- };
|