diff --git a/config/router_elecEvaluation.ts b/config/router_elecEvaluation.ts index 9f3ac01..f5f8f5c 100644 --- a/config/router_elecEvaluation.ts +++ b/config/router_elecEvaluation.ts @@ -1,22 +1,22 @@ export const monitorScreen = [ //监控大屏 - { - path: '/ElecMonitorScreen', - routes: [ - {//监控大屏-首页 - path: '/ElecMonitorScreen/Home', - component: './ElecEvaluation/MonitorScreen/Home', - }, - {//监控大屏-评标室列表页 - path: '/ElecMonitorScreen/MonitorRoom', - component: './ElecEvaluation/MonitorScreen/MonitorRoom', - }, - {//监控大屏-评标室详情 - path: '/ElecMonitorScreen/ProjectMonitorRoom', - component: './ElecEvaluation/MonitorScreen/ProjectMonitorRoom', - }, - ], - }, + // { + // path: '/ElecMonitorScreen', + // routes: [ + // {//监控大屏-首页 + // path: '/ElecMonitorScreen/Home', + // component: './ElecEvaluation/MonitorScreen/Home', + // }, + // {//监控大屏-评标室列表页 + // path: '/ElecMonitorScreen/MonitorRoom', + // component: './ElecEvaluation/MonitorScreen/MonitorRoom', + // }, + // {//监控大屏-评标室详情 + // path: '/ElecMonitorScreen/ProjectMonitorRoom', + // component: './ElecEvaluation/MonitorScreen/ProjectMonitorRoom', + // }, + // ], + // }, ] export const monitor = [ @@ -44,6 +44,14 @@ export const monitor = [ path: '/ElecMonitor/OpenToday', component: './ElecEvaluation/Monitor/OpenToday', }, + {//评标室监控-列表 + path: '/ElecMonitor/Room', + component: './ElecEvaluation/Monitor/Room', + }, + {//评标室监控-详情 + path: '/ElecMonitor/RoomDetail', + component: './ElecEvaluation/Monitor/RoomDetail', + }, ], }, ] diff --git a/src/assets/monitor/arrow-left-circle-fill.png b/src/assets/monitor/arrow-left-circle-fill.png new file mode 100644 index 0000000..a5424c0 Binary files /dev/null and b/src/assets/monitor/arrow-left-circle-fill.png differ diff --git a/src/assets/monitor/arrow-right-circle-fill.png b/src/assets/monitor/arrow-right-circle-fill.png new file mode 100644 index 0000000..3125cfb Binary files /dev/null and b/src/assets/monitor/arrow-right-circle-fill.png differ diff --git a/src/assets/monitor/error-icon.png b/src/assets/monitor/error-icon.png new file mode 100644 index 0000000..f7b0945 Binary files /dev/null and b/src/assets/monitor/error-icon.png differ diff --git a/src/assets/monitor/number-icon.png b/src/assets/monitor/number-icon.png new file mode 100644 index 0000000..4d6a165 Binary files /dev/null and b/src/assets/monitor/number-icon.png differ diff --git a/src/assets/monitor/options-back.png b/src/assets/monitor/options-back.png new file mode 100644 index 0000000..26dafa4 Binary files /dev/null and b/src/assets/monitor/options-back.png differ diff --git a/src/assets/monitor/options-back2.png b/src/assets/monitor/options-back2.png new file mode 100644 index 0000000..9e3677d Binary files /dev/null and b/src/assets/monitor/options-back2.png differ diff --git a/src/assets/monitor/options-home.png b/src/assets/monitor/options-home.png new file mode 100644 index 0000000..ee8a00c Binary files /dev/null and b/src/assets/monitor/options-home.png differ diff --git a/src/assets/monitor/options-home2.png b/src/assets/monitor/options-home2.png new file mode 100644 index 0000000..50e2fdc Binary files /dev/null and b/src/assets/monitor/options-home2.png differ diff --git a/src/assets/monitor/select-first.png b/src/assets/monitor/select-first.png new file mode 100644 index 0000000..a70f248 Binary files /dev/null and b/src/assets/monitor/select-first.png differ diff --git a/src/assets/monitor/select-first2.png b/src/assets/monitor/select-first2.png new file mode 100644 index 0000000..ebf4ac1 Binary files /dev/null and b/src/assets/monitor/select-first2.png differ diff --git a/src/assets/monitor/select-second.png b/src/assets/monitor/select-second.png new file mode 100644 index 0000000..c0b0bac Binary files /dev/null and b/src/assets/monitor/select-second.png differ diff --git a/src/assets/monitor/select-second2.png b/src/assets/monitor/select-second2.png new file mode 100644 index 0000000..0ed7dce Binary files /dev/null and b/src/assets/monitor/select-second2.png differ diff --git a/src/assets/monitor/select-third.png b/src/assets/monitor/select-third.png new file mode 100644 index 0000000..ba3b4b4 Binary files /dev/null and b/src/assets/monitor/select-third.png differ diff --git a/src/assets/monitor/select-third2.png b/src/assets/monitor/select-third2.png new file mode 100644 index 0000000..90655a9 Binary files /dev/null and b/src/assets/monitor/select-third2.png differ diff --git a/src/assets/monitor/stranger-icon.png b/src/assets/monitor/stranger-icon.png new file mode 100644 index 0000000..30336c1 Binary files /dev/null and b/src/assets/monitor/stranger-icon.png differ diff --git a/src/assets/screen/content_title.png b/src/assets/screen/content_title.png index dfe3252..e2e3c85 100644 Binary files a/src/assets/screen/content_title.png and b/src/assets/screen/content_title.png differ diff --git a/src/components/ElecBidEvaluation/ScreenVideoPlay.tsx b/src/components/ElecBidEvaluation/ScreenVideoPlay.tsx index 22a9450..3105720 100644 --- a/src/components/ElecBidEvaluation/ScreenVideoPlay.tsx +++ b/src/components/ElecBidEvaluation/ScreenVideoPlay.tsx @@ -15,6 +15,7 @@ const ScreenVideoPlay: React.FC = (props) => { const { videoRef, cameraParams, status } = props; const playWnd = useRef(null); let oWebControl: any = null; + let scale = window.innerHeight / 1080; let initCount = 0; let pubKey = ''; @@ -42,7 +43,7 @@ const ScreenVideoPlay: React.FC = (props) => { // cbIntegrationCallBack: cbIntegrationCallBack // }); - oWebControl.JS_CreateWnd("playWnd", playWnd.current.clientWidth, playWnd.current.clientHeight).then(function () { //JS_CreateWnd创建视频播放窗口,宽高可设定 + oWebControl.JS_CreateWnd("playWnd", playWnd.current.clientWidth * scale, playWnd.current.clientHeight * scale).then(function () { //JS_CreateWnd创建视频播放窗口,宽高可设定 init(); // 创建播放实例成功后初始化 }); }, function () { // 启动插件服务失败 @@ -108,7 +109,7 @@ const ScreenVideoPlay: React.FC = (props) => { buttonIDs: buttonIDs //自定义工具条按钮 }) }).then(function (oData: any) { - oWebControl.JS_Resize(playWnd.current.clientWidth, playWnd.current.clientHeight); // 初始化后resize一次,规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题 + oWebControl.JS_Resize(playWnd.current.clientWidth * scale, playWnd.current.clientHeight * scale); // 初始化后resize一次,规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题 }); }); } @@ -140,6 +141,7 @@ const ScreenVideoPlay: React.FC = (props) => { function setWndCover() { var iWidth = window.innerWidth; var iHeight = window.innerHeight; + let scale = window.innerHeight / 1080; var oDivRect = playWnd.current.getBoundingClientRect(); var iCoverLeft = (oDivRect.left < 0) ? Math.abs(oDivRect.left) : 0; @@ -147,23 +149,23 @@ const ScreenVideoPlay: React.FC = (props) => { var iCoverRight = (oDivRect.right - iWidth > 0) ? Math.round(oDivRect.right - iWidth) : 0; var iCoverBottom = (oDivRect.bottom - iHeight > 0) ? Math.round(oDivRect.bottom - iHeight) : 0; - iCoverLeft = (iCoverLeft > playWnd.current.clientWidth) ? playWnd.current.clientWidth : iCoverLeft; - iCoverTop = (iCoverTop > playWnd.current.clientHeight) ? playWnd.current.clientHeight : iCoverTop; - iCoverRight = (iCoverRight > playWnd.current.clientWidth) ? playWnd.current.clientWidth : iCoverRight; - iCoverBottom = (iCoverBottom > playWnd.current.clientHeight) ? playWnd.current.clientHeight : iCoverBottom; + iCoverLeft = (iCoverLeft > playWnd.current.clientWidth * scale) ? playWnd.current.clientWidth * scale : iCoverLeft; + iCoverTop = (iCoverTop > playWnd.current.clientHeight * scale) ? playWnd.current.clientHeight * scale : iCoverTop; + iCoverRight = (iCoverRight > playWnd.current.clientWidth * scale) ? playWnd.current.clientWidth * scale : iCoverRight; + iCoverBottom = (iCoverBottom > playWnd.current.clientHeight * scale) ? playWnd.current.clientHeight * scale : iCoverBottom; - oWebControl.JS_RepairPartWindow(0, 0, playWnd.current.clientWidth + 1, playWnd.current.clientHeight); // 多1个像素点防止还原后边界缺失一个像素条 + oWebControl.JS_RepairPartWindow(0, 0, playWnd.current.clientWidth * scale + 1, playWnd.current.clientHeight * scale); // 多1个像素点防止还原后边界缺失一个像素条 if (iCoverLeft != 0) { - oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, playWnd.current.clientHeight); + oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, playWnd.current.clientHeight * scale); } if (iCoverTop != 0) { - oWebControl.JS_CuttingPartWindow(0, 0, playWnd.current.clientWidth + 1, iCoverTop); // 多剪掉一个像素条,防止出现剪掉一部分窗口后出现一个像素条 + oWebControl.JS_CuttingPartWindow(0, 0, playWnd.current.clientWidth * scale + 1, iCoverTop); // 多剪掉一个像素条,防止出现剪掉一部分窗口后出现一个像素条 } if (iCoverRight != 0) { - oWebControl.JS_CuttingPartWindow(playWnd.current.clientWidth - iCoverRight, 0, iCoverRight, playWnd.current.clientHeight); + oWebControl.JS_CuttingPartWindow(playWnd.current.clientWidth * scale - iCoverRight, 0, iCoverRight, playWnd.current.clientHeight * scale); } if (iCoverBottom != 0) { - oWebControl.JS_CuttingPartWindow(0, playWnd.current.clientHeight - iCoverBottom, playWnd.current.clientWidth, iCoverBottom); + oWebControl.JS_CuttingPartWindow(0, playWnd.current.clientHeight * scale - iCoverBottom, playWnd.current.clientWidth * scale, iCoverBottom); } } @@ -175,8 +177,8 @@ const ScreenVideoPlay: React.FC = (props) => { var gpuMode = 0; //是否启用GPU硬解,0-不启用,1-启用 var wndId = -1; //播放窗口序号(在2x2以上布局下可指定播放窗口) - cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, ""); - cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, ""); + cameraIndexCode = cameraIndexCode?.replace(/(^\s*)/g, ""); + cameraIndexCode = cameraIndexCode?.replace(/(\s*$)/g, ""); if (oWebControl != null) { oWebControl?.JS_RequestInterface({ funcName: "startPreview", @@ -221,15 +223,16 @@ const ScreenVideoPlay: React.FC = (props) => { // 监听滚动条scroll事件,使插件窗口跟随浏览器滚动而移动 const resize = () => { if (oWebControl != null) { - oWebControl.JS_Resize(playWnd.current.clientWidth, playWnd.current.clientHeight); + let scale = window.innerHeight / 1080; + oWebControl.JS_Resize(playWnd.current.clientWidth * scale, playWnd.current.clientHeight * scale); setWndCover(); } }; - window.addEventListener("resize", debounce(() => resize(), 100)); - window.addEventListener("scroll", debounce(() => resize(), 100)); + window.addEventListener("resize", debounce(() => resize(), 1000)); + window.addEventListener("scroll", debounce(() => resize(), 1000)); return () => { - window.removeEventListener("resize", debounce(() => resize(), 100)); - window.removeEventListener("scroll", debounce(() => resize(), 100)); + window.removeEventListener("resize", debounce(() => resize(), 1000)); + window.removeEventListener("scroll", debounce(() => resize(), 1000)); if (oWebControl != null) { oWebControl.JS_HideWnd(); // 先让窗口隐藏,规避可能的插件窗口滞后于浏览器消失问题 oWebControl.JS_Disconnect().then(function () { // 断开与插件服务连接成功 diff --git a/src/pages/ElecEvaluation/Monitor/Exception/index.tsx b/src/pages/ElecEvaluation/Monitor/Exception/index.tsx index 809b763..70ae7d8 100644 --- a/src/pages/ElecEvaluation/Monitor/Exception/index.tsx +++ b/src/pages/ElecEvaluation/Monitor/Exception/index.tsx @@ -3,38 +3,42 @@ import React, { useEffect, useRef, useState } from 'react'; import '../style.less' import { authCheck, ModalList, onCell, onHeaderCell, OverviewItem, ScreenLabel, ScreenTitle, ScrollTable } from '../Home'; import Circle3199 from '@/assets/monitor/circle-3199.png'; -import { getDecryptDataAPI, getNoOpenAssessListAPI, getNoOpenAssessNumberAPI, getNoOpenListAPI, getNoOpenNumberAPI, getThreeDayNoEndAPI, getThreeDayNoEndCountAPI, getThreeDaysUnSendAnnoCountAPI, getThreeDaysUnSendAnnoListAPI } from '../service'; +import { getMacSameListAPI, getDecryptExceptionListAPI, getNoOpenAssessListAPI, getNoOpenAssessNumberAPI, getNoOpenListAPI, getNoOpenNumberAPI, getThreeDayNoEndAPI, getThreeDayNoEndCountAPI, getThreeDaysUnSendAnnoCountAPI, getThreeDaysUnSendAnnoListAPI } from '../service'; import { isNotEmpty } from '@/utils/CommonUtils'; const MonitorException: React.FC<{}> = () => { //超过1小时未开标数量 const [noOpenNumberData, setNoOpenNumberData] = useState(""); //开启评审后3日未结束评标-列表 - const [threeDayNoEndData, setThreeDayNoEndData] = useState([]); + const [threeDayNoEndData, setThreeDayNoEndData] = useState(); //开启评审后3日未结束评标-数量 const [threeDayNoEndCount, setThreeDayNoEndCount] = useState(0); //超过1小时未开标数量-列表 - const [noOpenListData, setNoOpenListData] = useState([]); + const [noOpenListData, setNoOpenListData] = useState(); //开标后超过6小时未开启评审室-列表 - const [noOpenAssessListData, setNoOpenAssessListData] = useState([]); + const [noOpenAssessListData, setNoOpenAssessListData] = useState(); //开标后超过6小时未开启评审室-数量 const [noOpenAssessNumber, setNoOpenAssessNumber] = useState(0); - //异常监控-解密异常、mac地址相同及相关项目列表 - const [decryptData, setDecryptData] = useState(); + //异常监控-解密异常 + const [decryptExceptionList, setDecryptExceptionList] = useState(); + //异常监控-mac地址相同 + const [macSameList, setMacSameList] = useState(); //评审室关闭3日内未发布公示数 const [threeDaysUnSendAnnoCount, setThreeDaysUnSendAnnoCount] = useState(""); //评审室关闭3日内未发布公示列表 - const [threeDaysUnSendAnnoList, setThreeDaysUnSendAnnoList] = useState([]); + const [threeDaysUnSendAnnoList, setThreeDaysUnSendAnnoList] = useState(); //ModalList visible const [modalListVisible, setModalListVisible] = useState(false); //ModalList Data - const [modalListData, setModalListData] = useState([]); + const [modalListData, setModalListData] = useState(); //ModalList Type const [exceptionType, setExceptionType] = useState(); //selectKey - const [selectKey, setSelectKey] = useState(-1); + // const [selectKey, setSelectKey] = useState(-1); + //modal弹窗数据类型 + const dataType = useRef(""); //权限校验 - const auth = useRef(authCheck()); + const auth = useRef(authCheck(["ebtp-watcher"])); //超过1小时未开标数量 const getNoOpenNumber = () => { getNoOpenNumberAPI({ "timeLimit": "1", "dayNumber": "30" }).then(res => { @@ -44,26 +48,38 @@ const MonitorException: React.FC<{}> = () => { }) } //开启评审后3日未结束评标 - const getThreeDayNoEnd = () => { - getThreeDayNoEndAPI().then(res => { + const getThreeDayNoEnd = (params: any, type: number) => { + getThreeDayNoEndAPI({ ...params }).then(res => { if (res?.code == 200) { - setThreeDayNoEndData(res?.data); + if (type == 0) { + setThreeDayNoEndData(res?.data); + } else { + setModalListData(res?.data); + } } }) } //超过1小时未开标数量-列表 - const getNoOpenList = () => { - getNoOpenListAPI({ "timeLimit": "1", "dayNumber": "30" }).then(res => { + const getNoOpenList = (params: any, type: number) => { + getNoOpenListAPI({ "timeLimit": "1", "dayNumber": "30", ...params }).then(res => { if (res?.code == 200) { - setNoOpenListData(res?.data?.records); + if (type == 0) { + setNoOpenListData(res?.data); + } else { + setModalListData(res?.data); + } } }) } //开标后超过6小时未开启评审室-列表 - const getNoOpenAssessList = () => { - getNoOpenAssessListAPI({ "timeLimit": "6", "dayNumber": "30" }).then(res => { + const getNoOpenAssessList = (params: any, type: number) => { + getNoOpenAssessListAPI({ "timeLimit": "6", "dayNumber": "30", ...params }).then(res => { if (res?.code == 200) { - setNoOpenAssessListData(res?.data); + if (type == 0) { + setNoOpenAssessListData(res?.data); + } else { + setModalListData(res?.data); + } } }) } @@ -76,37 +92,54 @@ const MonitorException: React.FC<{}> = () => { } }) } - //异常监控-解密异常、mac地址相同及相关项目列表jectRecord? - const getDecryptData = () => { - getDecryptDataAPI().then(res => { + //异常监控-解密异常 + const getDecryptExceptionList = (params: any, type: number) => { + getDecryptExceptionListAPI({ ...params }).then(res => { if (res?.code == 200) { const data = res?.data; - if (data?.decryptExceptionList?.length > 0) { - for (let i = 0, length = data.decryptExceptionList.length; i < length; i++) { - data.decryptExceptionList[i]["regionDictName"] = data.decryptExceptionList[i].projectRecord?.regionDictName; - data.decryptExceptionList[i]["projectName"] = data.decryptExceptionList[i].projectRecord?.projectName; - data.decryptExceptionList[i]["ownerContactName"] = data.decryptExceptionList[i].projectRecord?.ownerContactName; - data.decryptExceptionList[i]["ownerContactTel"] = data.decryptExceptionList[i].projectRecord?.ownerContactTel; - data.decryptExceptionList[i]["appManagerName"] = data.decryptExceptionList[i].projectRecord?.appManagerName; - data.decryptExceptionList[i]["appManagerTel"] = data.decryptExceptionList[i].projectRecord?.appManagerTel; - data.decryptExceptionList[i]["recruitStartTime"] = data.decryptExceptionList[i].projectRecord?.recruitStartTime; - data.decryptExceptionList[i]["bidMethodDict"] = data.decryptExceptionList[i].projectRecord?.bidMethodDict; + if (data?.decryptExceptionList?.records?.length > 0) { + for (let i = 0, length = data.decryptExceptionList.records.length; i < length; i++) { + data.decryptExceptionList.records[i]["regionDictName"] = data.decryptExceptionList.records[i].projectRecord?.regionDictName; + data.decryptExceptionList.records[i]["projectName"] = data.decryptExceptionList.records[i].projectRecord?.projectName; + data.decryptExceptionList.records[i]["ownerContactName"] = data.decryptExceptionList.records[i].projectRecord?.ownerContactName; + data.decryptExceptionList.records[i]["ownerContactTel"] = data.decryptExceptionList.records[i].projectRecord?.ownerContactTel; + data.decryptExceptionList.records[i]["appManagerName"] = data.decryptExceptionList.records[i].projectRecord?.appManagerName; + data.decryptExceptionList.records[i]["appManagerTel"] = data.decryptExceptionList.records[i].projectRecord?.appManagerTel; + data.decryptExceptionList.records[i]["recruitStartTime"] = data.decryptExceptionList.records[i].projectRecord?.recruitStartTime; + data.decryptExceptionList.records[i]["bidMethodDict"] = data.decryptExceptionList.records[i].projectRecord?.bidMethodDict; } } - if (data?.macSameList?.length > 0) { - for (let i = 0, length = data.macSameList.length; i < length; i++) { - data.macSameList[i]["regionDictName"] = data.macSameList[i].projectRecord?.regionDictName; - data.macSameList[i]["projectName"] = data.macSameList[i].projectRecord?.projectName; - data.macSameList[i]["ownerContactName"] = data.macSameList[i].projectRecord?.ownerContactName; - data.macSameList[i]["ownerContactTel"] = data.macSameList[i].projectRecord?.ownerContactTel; - data.macSameList[i]["appManagerName"] = data.macSameList[i].projectRecord?.appManagerName; - data.macSameList[i]["appManagerTel"] = data.macSameList[i].projectRecord?.appManagerTel; - data.macSameList[i]["recruitStartTime"] = data.macSameList[i].projectRecord?.recruitStartTime; - data.macSameList[i]["bidMethodDict"] = data.macSameList[i].projectRecord?.bidMethodDict; + if (type == 0) { + setDecryptExceptionList(data); + } else { + setModalListData(data?.decryptExceptionList); + } + } + }) + } + //异常监控-mac地址相同 + const getMacSameList = (params: any, type: number) => { + getMacSameListAPI({ ...params }).then(res => { + if (res?.code == 200) { + const data = res?.data; + if (data?.macSameList?.records?.length > 0) { + for (let i = 0, length = data.macSameList.records.length; i < length; i++) { + data.macSameList.records[i]["regionDictName"] = data.macSameList.records[i].projectRecord?.regionDictName; + data.macSameList.records[i]["projectName"] = data.macSameList.records[i].projectRecord?.projectName; + data.macSameList.records[i]["ownerContactName"] = data.macSameList.records[i].projectRecord?.ownerContactName; + data.macSameList.records[i]["ownerContactTel"] = data.macSameList.records[i].projectRecord?.ownerContactTel; + data.macSameList.records[i]["appManagerName"] = data.macSameList.records[i].projectRecord?.appManagerName; + data.macSameList.records[i]["appManagerTel"] = data.macSameList.records[i].projectRecord?.appManagerTel; + data.macSameList.records[i]["recruitStartTime"] = data.macSameList.records[i].projectRecord?.recruitStartTime; + data.macSameList.records[i]["bidMethodDict"] = data.macSameList.records[i].projectRecord?.bidMethodDict; } } - setDecryptData(data); + if (type == 0) { + setMacSameList(data); + } else { + setModalListData(data?.macSameList); + } } }) } @@ -121,10 +154,14 @@ const MonitorException: React.FC<{}> = () => { } //异常监控-评审室关闭3日内未发布公示列表 - const getThreeDaysUnSendAnnoList = () => { - getThreeDaysUnSendAnnoListAPI().then(res => { + const getThreeDaysUnSendAnnoList = (params: any, type: number) => { + getThreeDaysUnSendAnnoListAPI({ ...params }).then(res => { if (res?.code == 200) { - setThreeDaysUnSendAnnoList(res?.data); + if (type == 0) { + setThreeDaysUnSendAnnoList(res?.data); + } else { + setModalListData(res?.data); + } } }) } @@ -139,47 +176,49 @@ const MonitorException: React.FC<{}> = () => { } useEffect(() => { if (auth.current) { + const params = { pageNo: 1, pageSize: 10 }; getNoOpenNumber(); - getThreeDayNoEnd(); - getNoOpenList(); - getNoOpenAssessList(); + getThreeDayNoEnd(params, 0); + getNoOpenList(params, 0); + getNoOpenAssessList(params, 0); getNoOpenAssessNumber(); - getDecryptData(); + getDecryptExceptionList(params, 0); + getMacSameList(params, 0); getThreeDaysUnSendAnnoCount(); - getThreeDaysUnSendAnnoList(); + getThreeDaysUnSendAnnoList(params, 0); getThreeDayNoEndCount(); } }, []) - useEffect(() => { - let interval: any = null; - let count = 0; - let lengthMap = [noOpenListData.length, noOpenAssessListData.length, isNotEmpty(decryptData?.decryptExceptionList) ? decryptData?.decryptExceptionList.length : 0, threeDayNoEndData.length, isNotEmpty(decryptData?.macSameList) ? decryptData?.macSameList.length : 0, threeDaysUnSendAnnoList.length].sort((a, b) => b - a); - if (lengthMap[0] > 1) {//至少2条才能滚动 - interval = setInterval(() => { - if (count < lengthMap[0]) { - setSelectKey(count); - const v0 = document.getElementsByClassName("scroll-select-bg")[0]; - const v1 = document.getElementsByClassName("scroll-select-bg")[1]; - const v2 = document.getElementsByClassName("scroll-select-bg")[2]; - const v3 = document.getElementsByClassName("scroll-select-bg")[3]; - const v4 = document.getElementsByClassName("scroll-select-bg")[4]; - const v5 = document.getElementsByClassName("scroll-select-bg")[5]; - v0?.scrollIntoView(false); - v1?.scrollIntoView(false); - v2?.scrollIntoView(false); - v3?.scrollIntoView(false); - v4?.scrollIntoView(false); - v5?.scrollIntoView(false); - count++; - } else { - count = 0; - } - }, 3000) - } - return () => { - clearInterval(interval); - } - }, [noOpenListData, noOpenAssessListData, decryptData?.decryptExceptionList, threeDayNoEndData, decryptData?.macSameList, threeDaysUnSendAnnoList]) + // useEffect(() => { + // let interval: any = null; + // let count = 0; + // let lengthMap = [noOpenListData.length, noOpenAssessListData.length, isNotEmpty(decryptData?.decryptExceptionList) ? decryptData?.decryptExceptionList.length : 0, threeDayNoEndData.length, isNotEmpty(decryptData?.macSameList) ? decryptData?.macSameList.length : 0, threeDaysUnSendAnnoList.length].sort((a, b) => b - a); + // if (lengthMap[0] > 1) {//至少2条才能滚动 + // interval = setInterval(() => { + // if (count < lengthMap[0]) { + // setSelectKey(count); + // const v0 = document.getElementsByClassName("scroll-select-bg")[0]; + // const v1 = document.getElementsByClassName("scroll-select-bg")[1]; + // const v2 = document.getElementsByClassName("scroll-select-bg")[2]; + // const v3 = document.getElementsByClassName("scroll-select-bg")[3]; + // const v4 = document.getElementsByClassName("scroll-select-bg")[4]; + // const v5 = document.getElementsByClassName("scroll-select-bg")[5]; + // v0?.scrollIntoView(false); + // v1?.scrollIntoView(false); + // v2?.scrollIntoView(false); + // v3?.scrollIntoView(false); + // v4?.scrollIntoView(false); + // v5?.scrollIntoView(false); + // count++; + // } else { + // count = 0; + // } + // }, 3000) + // } + // return () => { + // clearInterval(interval); + // } + // }, [noOpenListData, noOpenAssessListData, decryptData?.decryptExceptionList, threeDayNoEndData, decryptData?.macSameList, threeDaysUnSendAnnoList]) const columns: any[] = [ { @@ -238,7 +277,7 @@ const MonitorException: React.FC<{}> = () => { onHeaderCell, render: (_: any, record: any) => { return ( - { setExceptionType(null); setModalListData([record]); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#1b7ef2" }}>查看 + { setExceptionType(null); setModalListData({ records: [record] }); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#1b7ef2" }}>查看 ) }, }, @@ -301,7 +340,7 @@ const MonitorException: React.FC<{}> = () => { onHeaderCell, render: (_: any, record: any) => { return ( - { setExceptionType("解密异常"); setModalListData([record]); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#1b7ef2" }}>查看 + { setExceptionType("解密异常"); setModalListData({ records: [record] }); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#1b7ef2" }}>查看 ) }, }, @@ -364,7 +403,7 @@ const MonitorException: React.FC<{}> = () => { onHeaderCell, render: (_: any, record: any) => { return ( - { setExceptionType("评标结束后3日内未发布公示"); setModalListData([record]); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#1b7ef2" }}>查看 + { setExceptionType("评标结束后3日内未发布公示"); setModalListData({ records: [record] }); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#1b7ef2" }}>查看 ) }, }, @@ -427,7 +466,7 @@ const MonitorException: React.FC<{}> = () => { onHeaderCell, render: (_: any, record: any) => { return ( - { setExceptionType("开启评审后3日未结束评标"); setModalListData([record]); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#1b7ef2" }}>查看 + { setExceptionType("开启评审后3日未结束评标"); setModalListData({ records: [record] }); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#1b7ef2" }}>查看 ) }, }, @@ -490,7 +529,7 @@ const MonitorException: React.FC<{}> = () => { onHeaderCell, render: (_: any, record: any) => { return ( - { setExceptionType("MAC地址重复"); setModalListData([record]); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#1b7ef2" }}>查看 + { setExceptionType("MAC地址重复"); setModalListData({ records: [record] }); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#1b7ef2" }}>查看 ) }, }, @@ -500,8 +539,8 @@ const MonitorException: React.FC<{}> = () => {
- - + + @@ -511,42 +550,62 @@ const MonitorException: React.FC<{}> = () => {
- { setExceptionType(null); setModalListData(noOpenListData); setModalListVisible(true); }}>more} /> + { setExceptionType(null); setModalListData(noOpenListData); dataType.current = "1"; setModalListVisible(true); }}>more} />
- +
- { setExceptionType(null); setModalListData(noOpenAssessListData); setModalListVisible(true); }}>more} /> + { setExceptionType(null); setModalListData(noOpenAssessListData); dataType.current = "4"; setModalListVisible(true); }}>more} />
- +
- { setExceptionType("解密异常"); setModalListData(decryptData?.decryptExceptionList ? decryptData?.decryptExceptionList : []); setModalListVisible(true); }}>more} /> + { setExceptionType("解密异常"); setModalListData(decryptExceptionList?.decryptExceptionList); dataType.current = "2"; setModalListVisible(true); }}>more} />
- +
- { setExceptionType("开启评审后3日未结束评标"); setModalListData(threeDayNoEndData); setModalListVisible(true); }}>more} /> + { setExceptionType("开启评审后3日未结束评标"); setModalListData(threeDayNoEndData); dataType.current = "5"; setModalListVisible(true); }}>more} />
- +
- { setExceptionType("MAC地址重复"); setModalListData(decryptData?.macSameList ? decryptData?.macSameList : []); setModalListVisible(true); }}>more} /> + { setExceptionType("MAC地址重复"); setModalListData(macSameList?.macSameList); dataType.current = "3"; setModalListVisible(true); }}>more} />
- +
- { setExceptionType("评标结束后3日内未发布公示"); setModalListData(threeDaysUnSendAnnoList); setModalListVisible(true); }}>more} /> + { setExceptionType("评标结束后3日内未发布公示"); setModalListData(threeDaysUnSendAnnoList); dataType.current = "6"; setModalListVisible(true); }}>more} />
- +
- { setModalListVisible(false); setModalListData([]); }} exceptionData={modalListData} exceptionType={exceptionType} /> + { setModalListVisible(false); setModalListData({}); }} exceptionData={modalListData} exceptionType={exceptionType} onCallBack={(current, projectName, ownerContactName) => { + const params = { + pageNo: current, + pageSize: 10, + } + projectName != "" ? params["projectName"] = projectName : null; + ownerContactName != "" ? params["ownerContactName"] = ownerContactName : null; + if (dataType.current == "1") { + getNoOpenList(params, 1); + } else if (dataType.current == "2") { + getDecryptExceptionList(params, 1); + } else if (dataType.current == "3") { + getMacSameList(params, 1); + } else if (dataType.current == "4") { + getNoOpenAssessList(params, 1); + } else if (dataType.current == "5") { + getThreeDayNoEnd(params, 1); + } else if (dataType.current == "6") { + getThreeDaysUnSendAnnoList(params, 1); + } + }} /> ); }; diff --git a/src/pages/ElecEvaluation/Monitor/Home/index.tsx b/src/pages/ElecEvaluation/Monitor/Home/index.tsx index 34dcbad..ae89a3d 100644 --- a/src/pages/ElecEvaluation/Monitor/Home/index.tsx +++ b/src/pages/ElecEvaluation/Monitor/Home/index.tsx @@ -1,4 +1,4 @@ -import { Button, Col, Descriptions, Divider, Dropdown, Empty, Input, Menu, MenuProps, message, Modal, Progress, Row, Space, Table, Typography } from 'antd'; +import { Button, Col, Descriptions, Divider, Dropdown, Empty, Input, Menu, MenuProps, message, Modal, Pagination, PaginationProps, Progress, Row, Space, Table, Typography } from 'antd'; import { debounce } from 'lodash'; import React, { useEffect, useMemo, useRef, useState } from 'react'; import '../style.less' @@ -12,7 +12,9 @@ import Frame10121 from '@/assets/monitor/Frame-10121.png'; import titleIcon from '@/assets/monitor/title-icon.png'; import left from '@/assets/monitor/left.png'; import right from '@/assets/monitor/right.png'; -import { CaretRightOutlined, DownOutlined } from '@ant-design/icons'; +import arrowLeftCircleFill from '@/assets/monitor/arrow-left-circle-fill.png' +import arrowRightCircleFill from '@/assets/monitor/arrow-right-circle-fill.png' +import { CaretRightOutlined, DownOutlined, LeftOutlined, RightOutlined } from '@ant-design/icons'; import './china'; import * as echarts from 'echarts'; import { getActiveSupplierAPI, getAnnoCountAPI, getAnnualAndTenderAgentAPI, getExpertNumberAPI, getMonitorListAPI, getOpeningListAPI, getReviewDistributionAPI, getSupplierCountAPI, getTodayInfoAPI, getTodayOpeningAPI } from '../service'; @@ -58,6 +60,7 @@ export const proviceEnum = { "0065": "新疆", "001000": "集团" } +const weekMap = { 1: "星期一", 2: "星期二", 3: "星期三", 4: "星期四", 5: "星期五", 6: "星期六", 7: "星期日", } function getYearMap() { const year: number = moment().year();//当前年份 const data: { label: string, value: string }[] = []; @@ -460,10 +463,59 @@ export const StageCard = (props: { percentage: string | number, total: string | ) } //滚动列表 -export const ScrollTable = (props: { dataSource: any[], columns: any[], ynum?: number, rowKey?: string, selectKey?: number, onDoubleClick?: (record: any) => void }) => { - const { dataSource, columns, ynum = 300, rowKey = "id", selectKey = -1, onDoubleClick = () => { } } = props; +export const ScrollTable = (props: { dataSource: any[], columns: any[], ynum?: number, rowKey?: string, rowClassName?: string, tableKey?: number, rollNum?: number, isScroll?: boolean, onDoubleClick?: (record: any) => void }) => { + const { dataSource, columns, ynum = 300, rowKey = "id", rowClassName = "scroll-select-bg0", rollNum = 10, tableKey = 0, isScroll = false, onDoubleClick = () => { } } = props; + //selectKey + // const [selectKey, setSelectKey] = useState(-1); + const timer = useRef(); + const initScroll = (data: any[]) => { + // let count = selectKey != -1 ? selectKey : 0; + const length = isNotEmpty(data) ? data.length : 0; + // if (length > 1) {//至少2条才能滚动 + // timer.current = setInterval(() => { + // if (count < length) { + // setSelectKey(count); + // const v0 = document.getElementsByClassName(rowClassName)[0]; + // v0?.scrollIntoView({ block: 'center', behavior: 'smooth' }); + // count++; + // } else { + // count = 0; + // } + // }, 3000) + // } + if (isScroll && (length > rollNum)) { + // 只有当大于10条数据的时候 才会看起滚动 + const v = document.getElementsByClassName("ant-table-body")[tableKey]; + timer.current = setInterval(() => { + v.scrollTop += 0.5; + if ( + Math.ceil(v.scrollTop) >= parseFloat((v.scrollHeight - v.clientHeight).toString()) + ) { + setTimeout(() => { + v.scrollTop = 0; + }, 500); + } + }, 20); + } + } + useEffect(() => { + initScroll(dataSource); + return () => { + clearInterval(timer.current); + } + }, [dataSource]) + return ( -
+
{ + timer.current && clearInterval(timer.current); + }} + onMouseLeave={() => { + timer.current && clearInterval(timer.current); + initScroll(dataSource); + }} + > { - if (index == selectKey) { - return "scroll-select-bg"; //highlight样式需要自己定义 - } - return "scroll-select-default"; - }} + // rowClassName={(record, index) => { + // if (index == selectKey) { + // return rowClassName; //highlight样式需要自己定义 + // } + // return "scroll-select-default"; + // }} dataSource={dataSource} columns={columns} onRow={record => { @@ -534,6 +586,43 @@ export const ScreenLabel = (props: { title: string, extra?: JSX.Element | string ) } +/** + * 当前年月日 星期 时分秒 + * @returns + */ +export const LocalTimer = () => { + const [timeData, setTimeData] = useState<{ date: string, week: string }>(); + const [time, setTime] = useState(""); + useEffect(() => { + const interval = setInterval(function () { + setTimeData(() => ({ date: moment().format("YYYY-MM-DD"), week: weekMap[moment().format("E")] })); + setTime(() => moment().format("HH:mm:ss")); + }, 1000); + return () => { + clearInterval(interval) + }; + }, []) + return ( +
+ {timeData?.date} + {timeData?.week} + {time} +
+ ) +} + +//异常预警 +export const EarlyWarnItem = ({ img, name, num }: { img: string, name: string, num: string | number }) => { + return ( +
+ +
+
{num}
+
{name}
+
+
+ ) +} //大标题和布局 export const ScreenTitle = (props: { title: string, children: any }) => { @@ -563,7 +652,13 @@ export const ScreenTitle = (props: { title: string, children: any }) => {
- {title} +
+
+ {title} +
+
+ +
{children} @@ -582,9 +677,9 @@ export const ScreenTitle = (props: { title: string, children: any }) => { } //modal大弹窗 -export const ModalList = (props: { modalVisible: boolean, onCancel: () => void, exceptionType?: string, exceptionData: any[], title?: string | null }) => { - const { modalVisible, onCancel, exceptionType, exceptionData, title } = props; - const modalHeight = window.innerHeight * 96 / 100; +export const ModalList = (props: { modalVisible: boolean, onCancel: () => void, exceptionType?: string, exceptionData: any, title?: string | null, onCallBack?: (current: number, projectName: string, ownerContactName: string) => void }) => { + const { modalVisible, onCancel, exceptionType, exceptionData, title, onCallBack = () => { } } = props; + // const modalHeight = window.innerHeight * 96 / 100; const labelStyle = { color: "#29F0F9", fontWeight: "bold", width: "100px" }; const contentStyle = { color: "#fff", paddingLeft: "14px" }; const titleStyle = { color: "#01C2FF", fontWeight: 700, marginBottom: 0 }; @@ -592,50 +687,108 @@ export const ModalList = (props: { modalVisible: boolean, onCancel: () => void, //初始化字典 let dic: any = getDicData(); let dicData: any = JSON.parse(dic); + const [current, setCurrent] = useState(1); + const [total, setTotal] = useState(0); + const project = useRef(""); + const owner = useRef(""); + const onChange: PaginationProps['onChange'] = page => { + setCurrent(page); + onCallBack(page, project.current, owner.current); + }; + const itemRender: PaginationProps['itemRender'] = (_, type, originalElement) => { + // if (type === 'prev') { + // return ; + // } + // if (type === 'next') { + // return ; + // } + if (type === 'prev') { + return ; + } + if (type === 'next') { + return ; + } + return originalElement; + }; + const onProjectChange = (e: any) => { + project.current = e.target.value; + } + const onOwnerChange = (e: any) => { + owner.current = e.target.value; + } + const onSearchClick = () => { + setCurrent(1); + onCallBack(1, project.current, owner.current); + } + + useEffect(() => { + setTotal(exceptionData?.total || 0); + setCurrent(exceptionData?.currnet || 1); + }, [exceptionData]) return ( onCancel()} + onCancel={() => { + project.current = ""; + owner.current = ""; + onCancel() + }} width={"60%"} - style={{ maxHeight: modalHeight }} - bodyStyle={{ maxHeight: modalHeight - 107, overflowY: 'auto', padding: "20px 24px 24px" }} + // style={{ maxHeight: modalHeight }} + // bodyStyle={{ maxHeight: modalHeight - 107, overflowY: 'auto', padding: "20px 24px 24px" }} + bodyStyle={{ padding: "20px 24px 24px" }} centered footer={null} >

{isNotEmpty(title) ? title : "重点监测异常明细单"}

- {exceptionData.length > 0 ? exceptionData.map((item, index) => { - return ( -
1 ? 'modal-list-block' : 'modal-list-block modal-list-block-border0'}> -
-
- {item?.projectName} -
{item?.bidSectName || item?.sectionName}
-
- {isEmpty(title) &&
-
- {/* 采购方式:{changeDict(dicData['procurement_mode=entrust'], item?.bidMethodDict)} */} - 采购方式:单一来源简化流程 + {exceptionData?.total != undefined &&
+
+ 项目名称: +
+
+ 采购经理: +
+
+ +
+
} +
+ {exceptionData?.records?.length > 0 ? exceptionData?.records?.map((item: any, index: any) => { + return ( +
1 ? 'modal-list-block' : 'modal-list-block modal-list-block-border0'}> +
+
+ {item?.projectName} +
{item?.bidSectName || item?.sectionName}
-
} + {isEmpty(title) &&
+
+ 采购方式:{changeDict(dicData['procurement_mode=entrust'], item?.bidMethodDict)} +
+
} +
+
+ + {isNotEmpty(title) ? changeDict(dicData['procurement_mode=entrust'], item?.bidMethodDict) : isNotEmpty(exceptionType) ? exceptionType : item?.exType} + {item?.openTime || item?.recruitStartTime || item?.openingTime} + {isNotEmpty(item?.budgetAmount) ? Number(item?.budgetAmount).toFixed(2) : isNotEmpty(item?.bidSectContractPrice) ? typeof item?.bidSectContractPrice == "number" ? Number(item?.bidSectContractPrice).toFixed(2) : item?.bidSectContractPrice : "0"}元 + {item?.provinceName || item?.regionDictName || item?.province} + {item?.ownerContactName} + {item?.ownerContactTel} + {(item?.sectionState || item?.sectionStatus || item?.state) == 9 ? "异常处理" : changeDict(item?.bidMethodDict ? dicData[`business_module=${item?.bidMethodDict}`] : [], item?.businessModule)} + {item?.appManagerName} + {item?.appManagerTel} + +
-
- - {isNotEmpty(title) ? changeDict(dicData['procurement_mode=entrust'], item?.bidMethodDict) : isNotEmpty(exceptionType) ? exceptionType : item?.exType} - {item?.openTime || item?.recruitStartTime || item?.openingTime} - {isNotEmpty(item?.budgetAmount) ? Number(item?.budgetAmount).toFixed(2) : isNotEmpty(item?.bidSectContractPrice) ? typeof item?.bidSectContractPrice == "number" ? Number(item?.bidSectContractPrice).toFixed(2) : item?.bidSectContractPrice : "0"}元 - {item?.provinceName || item?.regionDictName || item?.province} - {item?.ownerContactName} - {item?.ownerContactTel} - {(item?.sectionState || item?.sectionStatus || item?.state) == 9 ? "异常处理" : changeDict(item?.bidMethodDict ? dicData[`business_module=${item?.bidMethodDict}`] : [], item?.businessModule)} - {item?.appManagerName} - {item?.appManagerTel} - -
-
- ) - }) : } + ) + }) : } +
+ {exceptionData?.total != undefined &&
+ `共 ${total} 条`} /> +
} {/*
onCancel()}> 确 定 @@ -1402,14 +1555,15 @@ export const GraphChart = (props: { type: string, chartData: any[], chartColor?: ) } //角色校验 -export const authCheck = () => { +export const authCheck = (authority: string[]) => { //获取角色列表 const authorityList: any[] | undefined = getSessionUserData()?.authorityList; if (isEmpty(authorityList)) { history.replace({ pathname: "/404" }); return false; } - if (authorityList?.findIndex(item => item.roleCode == "ebtp-watcher") == -1) {//监看人员校验 + // if (authorityList?.findIndex(item => authority.includes(item.roleCode)item.roleCode == "ebtp-watcher") == -1) {//监看人员校验 + if (authority.findIndex(item => authorityList?.findIndex(ite => ite.roleCode == item) != -1) == -1) {//角色权限校验 history.replace({ pathname: "/401", query: { code: "405" } }); return false; } @@ -1438,7 +1592,7 @@ const MonitorHome: React.FC<{}> = () => { //今日开标-评标阶段,评标及时率 const [todayInfoData, setTodayInfoData] = useState(); //权限校验 - const auth = useRef(authCheck()); + const auth = useRef(authCheck(["ebtp-watcher"])); //定时器秒数 const _time = 20000; const bidStatusMap = ["准备评标", "正在评标", "评标结束", ""]; @@ -1555,7 +1709,7 @@ const MonitorHome: React.FC<{}> = () => { return; } history.push({ - pathname: "/ElecMonitorScreen/ProjectMonitorRoom", + pathname: "/ElecMonitor/RoomDetail", state: { monitorId: item.id }, }) } @@ -1636,7 +1790,7 @@ const MonitorHome: React.FC<{}> = () => {
{mapChart}
-
{ window.open("/ElecMonitorScreen/MonitorRoom") }}> +
{ window.open("/ElecMonitor/Room") }}>
diff --git a/src/pages/ElecEvaluation/Monitor/OpenToday/index.tsx b/src/pages/ElecEvaluation/Monitor/OpenToday/index.tsx index cfbf2bc..de62804 100644 --- a/src/pages/ElecEvaluation/Monitor/OpenToday/index.tsx +++ b/src/pages/ElecEvaluation/Monitor/OpenToday/index.tsx @@ -16,21 +16,21 @@ const OpenToday: React.FC<{}> = () => { //今日开标-首页开标数据 const [todayOpeningData, setTodayOpeningData] = useState(); //今日开标-评标阶段10小时未评标 - const [unopenTenData, setUnopenTenData] = useState([]); + const [unopenTenData, setUnopenTenData] = useState(); //今日开标-评标阶段6小时未评标 - const [unopenSixData, setUnopenSixData] = useState([]); + const [unopenSixData, setUnopenSixData] = useState(); //超过2小时未开标数量 const [noOpenNumberTwo, setNoOpenNumberTwo] = useState("0"); //超过5小时未开标数量 const [noOpenNumberFive, setNoOpenNumberFive] = useState("0"); //超过2小时未开标列表 - const [noOpenListTwo, setNoOpenListTwo] = useState([]); + const [noOpenListTwo, setNoOpenListTwo] = useState(); //超过5小时未开标列表 - const [noOpenListFive, setNoOpenListFive] = useState([]); + const [noOpenListFive, setNoOpenListFive] = useState(); //ModalList visible const [modalListVisible, setModalListVisible] = useState(false); //ModalList Data - const [modalListData, setModalListData] = useState([]); + const [modalListData, setModalListData] = useState(); //ModalList Type const [exceptionType, setExceptionType] = useState(); //selectKey @@ -38,9 +38,13 @@ const OpenToday: React.FC<{}> = () => { //modal title const [modalTitle, setModalTitle] = useState(null); //权限校验 - const auth = useRef(authCheck()); + const auth = useRef(authCheck(["ebtp-watcher"])); //定时器描述 const _time = 60000; + //modal弹窗数据类型 + const dataType = useRef(""); + // + const isInterval = useRef(true); //初始化字典 let dic: any = getDicData(); let dicData: any = JSON.parse(dic); @@ -157,23 +161,27 @@ const OpenToday: React.FC<{}> = () => { }) } //今日开标-解密成功率 - const getDecryptSuccessRateToday = () => { - getDecryptSuccessRateTodayAPI().then(res => { + const getDecryptSuccessRateToday = (params: any, type: number) => { + getDecryptSuccessRateTodayAPI({ ...params }).then(res => { if (res?.code == 200) { const data = res?.data; - if (data?.decryptFailProjectList?.length > 0) { - for (let i = 0, length = data.decryptFailProjectList.length; i < length; i++) { - data.decryptFailProjectList[i]["regionDictName"] = data.decryptFailProjectList[i].projectRecord?.regionDictName; - data.decryptFailProjectList[i]["projectName"] = data.decryptFailProjectList[i].projectRecord?.projectName; - data.decryptFailProjectList[i]["ownerContactName"] = data.decryptFailProjectList[i].projectRecord?.ownerContactName; - data.decryptFailProjectList[i]["ownerContactTel"] = data.decryptFailProjectList[i].projectRecord?.ownerContactTel; - data.decryptFailProjectList[i]["appManagerName"] = data.decryptFailProjectList[i].projectRecord?.appManagerName; - data.decryptFailProjectList[i]["appManagerTel"] = data.decryptFailProjectList[i].projectRecord?.appManagerTel; - data.decryptFailProjectList[i]["recruitStartTime"] = data.decryptFailProjectList[i].projectRecord?.recruitStartTime; - data.decryptFailProjectList[i]["bidMethodDict"] = data.decryptFailProjectList[i].projectRecord?.bidMethodDict; + if (data?.decryptFailProjectList?.records?.length > 0) { + for (let i = 0, length = data.decryptFailProjectList.records.length; i < length; i++) { + data.decryptFailProjectList.records[i]["regionDictName"] = data.decryptFailProjectList.records[i].projectRecord?.regionDictName; + data.decryptFailProjectList.records[i]["projectName"] = data.decryptFailProjectList.records[i].projectRecord?.projectName; + data.decryptFailProjectList.records[i]["ownerContactName"] = data.decryptFailProjectList.records[i].projectRecord?.ownerContactName; + data.decryptFailProjectList.records[i]["ownerContactTel"] = data.decryptFailProjectList.records[i].projectRecord?.ownerContactTel; + data.decryptFailProjectList.records[i]["appManagerName"] = data.decryptFailProjectList.records[i].projectRecord?.appManagerName; + data.decryptFailProjectList.records[i]["appManagerTel"] = data.decryptFailProjectList.records[i].projectRecord?.appManagerTel; + data.decryptFailProjectList.records[i]["recruitStartTime"] = data.decryptFailProjectList.records[i].projectRecord?.recruitStartTime; + data.decryptFailProjectList.records[i]["bidMethodDict"] = data.decryptFailProjectList.records[i].projectRecord?.bidMethodDict; } } - setDecryptSuccessRateTodayData(data); + if (type == 0) { + setDecryptSuccessRateTodayData(data); + } else { + setModalListData(data?.decryptFailProjectList); + } } }) } @@ -186,18 +194,26 @@ const OpenToday: React.FC<{}> = () => { }) } //评标阶段6小时未评标 - const getUnopenSix = () => { - getUnopenSixAPI().then(res => { + const getUnopenSix = (params: any, type: number) => { + getUnopenSixAPI({ ...params }).then(res => { if (res?.code == 200) { - setUnopenSixData(res?.data); + if (type == 0) { + setUnopenSixData(res?.data); + } else { + setModalListData(res?.data); + } } }) } //评标阶段10小时未评标 - const getUnopenTen = () => { - getUnopenTenAPI().then(res => { + const getUnopenTen = (params: any, type: number) => { + getUnopenTenAPI({ ...params }).then(res => { if (res?.code == 200) { - setUnopenTenData(res?.data); + if (type == 0) { + setUnopenTenData(res?.data); + } else { + setModalListData(res?.data); + } } }) } @@ -215,63 +231,87 @@ const OpenToday: React.FC<{}> = () => { }) } //超n小时未开标列表 - const getNoOpenList = () => { - getNoOpenListAPI({ "timeLimit": "2", "dayNumber": "1" }).then(res => { + const getNoOpenListTwo = (params: any, type: number) => { + getNoOpenListAPI({ "timeLimit": "2", "dayNumber": "1", ...params }).then(res => { if (res?.code == 200) { - setNoOpenListTwo(res?.data?.records); + if (type == 0) { + setNoOpenListTwo(res?.data); + } else { + setModalListData(res?.data); + } + } }) - getNoOpenListAPI({ "timeLimit": "5", "dayNumber": "1" }).then(res => { + } + //超n小时未开标列表 + const getNoOpenListFive = (params: any, type: number) => { + getNoOpenListAPI({ "timeLimit": "5", "dayNumber": "1", ...params }).then(res => { if (res?.code == 200) { - setNoOpenListFive(res?.data?.records); + if (type == 0) { + setNoOpenListFive(res?.data); + } else { + setModalListData(res?.data); + } + } }) } //页面数据获取 const getPageData = () => { getTodayInfo(); - getDecryptSuccessRateToday(); getTodayOpening(); - getUnopenSix(); - getUnopenTen(); + getNoOpenNumber(); - getNoOpenList(); + + } + //分页数据 + const getCurrentData = () => { + const params = { pageSize: 10, pageNo: 1 }; + getDecryptSuccessRateToday(params, 0); + getNoOpenListTwo(params, 0); + getNoOpenListFive(params, 0); + getUnopenSix(params, 0); + getUnopenTen(params, 0); } useEffect(() => { let interval: any; if (auth.current) { getPageData(); + getCurrentData(); interval = setInterval(() => { - getPageData(); + if (isInterval.current) { + getPageData(); + getCurrentData(); + } }, _time); } return () => { clearInterval(interval); } }, []) - useEffect(() => { - let interval: any = null; - let count = 0; - let lengthMap = [isNotEmpty(todayOpeningData?.todayList) ? todayOpeningData?.todayList.length : 0, isNotEmpty(todayOpeningData?.importantList) ? todayOpeningData?.importantList.length : 0].sort((a, b) => b - a); - if (lengthMap[0] > 1) {//至少2条才能滚动 - interval = setInterval(() => { - if (count < lengthMap[0]) { - setSelectKey(count); - const v0 = document.getElementsByClassName("scroll-select-bg")[0]; - const v1 = document.getElementsByClassName("scroll-select-bg")[1]; - v0?.scrollIntoView(false); - v1?.scrollIntoView(false); - count++; - } else { - count = 0; - } - }, 3000) - } - return () => { - clearInterval(interval); - } - }, [todayOpeningData?.todayList, todayOpeningData?.importantList]) + // useEffect(() => { + // let interval: any = null; + // let count = 0; + // let lengthMap = [isNotEmpty(todayOpeningData?.todayList) ? todayOpeningData?.todayList.length : 0, isNotEmpty(todayOpeningData?.importantList) ? todayOpeningData?.importantList.length : 0].sort((a, b) => b - a); + // if (lengthMap[0] > 1) {//至少2条才能滚动 + // interval = setInterval(() => { + // if (count < lengthMap[0]) { + // setSelectKey(count); + // const v0 = document.getElementsByClassName("scroll-select-bg")[0]; + // const v1 = document.getElementsByClassName("scroll-select-bg")[1]; + // v0?.scrollIntoView(false); + // v1?.scrollIntoView(false); + // count++; + // } else { + // count = 0; + // } + // }, 3000) + // } + // return () => { + // clearInterval(interval); + // } + // }, [todayOpeningData?.todayList, todayOpeningData?.importantList]) return (
@@ -296,9 +336,9 @@ const OpenToday: React.FC<{}> = () => {
- { }} rightClick={() => { setExceptionType("解密异常"); setModalTitle(null); setModalListData(isNotEmpty(decryptSuccessRateTodayData?.decryptFailProjectList) ? decryptSuccessRateTodayData?.decryptFailProjectList : []); setModalListVisible(true); }} /> - { setExceptionType("2小时未开标"); setModalTitle(null); setModalListData(noOpenListTwo); setModalListVisible(true); }} rightClick={() => { setExceptionType("5小时未开标"); setModalTitle(null); setModalListData(noOpenListFive); setModalListVisible(true); }} /> - { setExceptionType("6小时未评标"); setModalTitle(null); setModalListData(unopenSixData); setModalListVisible(true); }} rightClick={() => { setExceptionType("10小时未评标"); setModalTitle(null); setModalListData(unopenTenData); setModalListVisible(true); }} /> + { }} rightClick={() => { setExceptionType("解密异常"); setModalTitle(null); setModalListData(decryptSuccessRateTodayData?.decryptFailProjectList); dataType.current = "1"; isInterval.current = false; setModalListVisible(true); }} /> + { setExceptionType("2小时未开标"); setModalTitle(null); setModalListData(noOpenListTwo); dataType.current = "2"; isInterval.current = false; setModalListVisible(true); }} rightClick={() => { setExceptionType("5小时未开标"); setModalTitle(null); setModalListData(noOpenListFive); dataType.current = "3"; isInterval.current = false; setModalListVisible(true); }} /> + { setExceptionType("6小时未评标"); setModalTitle(null); setModalListData(unopenSixData); dataType.current = "4"; isInterval.current = false; setModalListVisible(true); }} rightClick={() => { setExceptionType("10小时未评标"); setModalTitle(null); setModalListData(unopenTenData); dataType.current = "5"; isInterval.current = false; setModalListVisible(true); }} />
@@ -315,17 +355,35 @@ const OpenToday: React.FC<{}> = () => {
- { setModalTitle("今日开标明细"); setModalListData([record]); setModalListVisible(true); }} /> + { setModalTitle("今日开标明细"); setModalListData({ records: [record] }); setModalListVisible(true); }} />
- { setModalTitle("重保项目明细"); setModalListData([record]); setModalListVisible(true); }} /> + { setModalTitle("重保项目明细"); setModalListData({ records: [record] }); setModalListVisible(true); }} />
- { setModalListVisible(false); setModalListData([]); }} exceptionData={modalListData} exceptionType={exceptionType} title={modalTitle} /> + { setModalListVisible(false); setModalListData({}); isInterval.current = true; }} exceptionData={modalListData} exceptionType={exceptionType} title={modalTitle} onCallBack={(current, projectName, ownerContactName) => { + const params = { + pageNo: current, + pageSize: 10, + } + projectName != "" ? params["projectName"] = projectName : null; + ownerContactName != "" ? params["ownerContactName"] = ownerContactName : null; + if (dataType.current == "1") { + getDecryptSuccessRateToday(params, 1); + } else if (dataType.current == "2") { + getNoOpenListTwo(params, 1); + } else if (dataType.current == "3") { + getNoOpenListFive(params, 1); + } else if (dataType.current == "4") { + getUnopenSix(params, 1); + } else if (dataType.current == "5") { + getUnopenTen(params, 1); + } + }} /> ); }; diff --git a/src/pages/ElecEvaluation/Monitor/Room/index.tsx b/src/pages/ElecEvaluation/Monitor/Room/index.tsx new file mode 100644 index 0000000..a24d0bf --- /dev/null +++ b/src/pages/ElecEvaluation/Monitor/Room/index.tsx @@ -0,0 +1,368 @@ +import { Button, Col, Input, List, message, PaginationProps, Row, Tag, Tooltip } from 'antd'; +import React, { useEffect, useRef, useState } from 'react'; +import '../style.less' +import { authCheck, proviceEnum, ScreenTitle } from '../Home'; +import { isNotEmpty } from '@/utils/CommonUtils'; +import { history } from "umi"; +import { getMonitorList } from '../service'; +import content_title from '@/assets/screen/content_title.png' +import errorIcon from '@/assets/monitor/error-icon.png' +import arrowLeftCircleFill from '@/assets/monitor/arrow-left-circle-fill.png' +import arrowRightCircleFill from '@/assets/monitor/arrow-right-circle-fill.png' +import { LeftOutlined, RightOutlined } from '@ant-design/icons'; +export const bidStatusMap = ["准备评标", "正在评标", "评标结束"]; +const statusColorMap = ["bidding-text-order", "bidding-text-going", "bidding-text-ending"]; +const provinceList = [{ + "provincesRemark": "集团", + "provincesNumber": "001000", +}, { + "provincesNumber": "0011", + "provincesRemark": "北京", +}, +{ + "provincesNumber": "0022", + "provincesRemark": "吉林", +}, +{ + "provincesNumber": "0021", + "provincesRemark": "辽宁", +}, +{ + "provincesNumber": "0015", + "provincesRemark": "内蒙古", +}, +{ + "provincesNumber": "0012", + "provincesRemark": "天津", +}, +{ + "provincesNumber": "0013", + "provincesRemark": "河北", +}, +{ + "provincesNumber": "0014", + "provincesRemark": "山西", +}, +{ + "provincesNumber": "0023", + "provincesRemark": "黑龙江", +}, +{ + "provincesNumber": "0031", + "provincesRemark": "上海", +}, +{ + "provincesNumber": "0032", + "provincesRemark": "江苏", +}, +{ + "provincesNumber": "0033", + "provincesRemark": "浙江", +}, +{ + "provincesNumber": "0034", + "provincesRemark": "安徽", +}, +{ + "provincesNumber": "0035", + "provincesRemark": "福建", +}, +{ + "provincesNumber": "0036", + "provincesRemark": "江西", +}, +{ + "provincesNumber": "0037", + "provincesRemark": "山东", +}, +{ + "provincesNumber": "0041", + "provincesRemark": "河南", +}, +{ + "provincesNumber": "0042", + "provincesRemark": "湖北", +}, +{ + "provincesNumber": "0043", + "provincesRemark": "湖南", +}, +{ + "provincesNumber": "0044", + "provincesRemark": "广东", +}, +{ + "provincesNumber": "0045", + "provincesRemark": "广西", +}, +{ + "provincesNumber": "0046", + "provincesRemark": "海南", +}, +{ + "provincesNumber": "0050", + "provincesRemark": "重庆", +}, +{ + "provincesNumber": "0051", + "provincesRemark": "四川", +}, +{ + "provincesNumber": "0052", + "provincesRemark": "贵州", +}, +{ + "provincesNumber": "0053", + "provincesRemark": "云南", +}, +{ + "provincesNumber": "0054", + "provincesRemark": "西藏", +}, +{ + "provincesNumber": "0061", + "provincesRemark": "陕西", +}, +{ + "provincesNumber": "0062", + "provincesRemark": "甘肃", +}, +{ + "provincesNumber": "0063", + "provincesRemark": "青海", +}, +{ + "provincesNumber": "0064", + "provincesRemark": "宁夏", +}, +{ + "provincesNumber": "0065", + "provincesRemark": "新疆", +},]; + +export const homeClick = () => { + history.push("/ElecMonitor/Home"); +} +export const previousClick = () => { + history.goBack(); +} + +const MonitorRoom: React.FC<{}> = () => { + //状态选择 + const [selectBtn, setSelectBtn] = useState(""); + const selectStatus = useRef(""); + //当前选中的省分 + const [selectedTag, setSelectedTag] = useState(""); + const selectProvince = useRef(""); + //当前页码 + const pageNo = useRef(1); + //总数 + const [totalItem, setTotalItem] = useState(0); + //当前页数据 + const [listData, setListData] = useState([]); + //关键字搜索条件 + const search = useRef(""); + //权限校验 + const auth = useRef(authCheck(["ebtp-watcher"])); + //定时刷新间隔 + const _time = 60000; + const { CheckableTag } = Tag; + const handleChange = (tag: string, checked: boolean) => { + const nextSelectedTag = checked ? tag : ''; + setSelectedTag(nextSelectedTag); + selectProvince.current = nextSelectedTag; + pageNo.current = 1; + getMonitorRoom(); + }; + const onPageChange = (page: number) => { + pageNo.current = page; + getMonitorRoom(); + } + const onSearchChange = (e: any) => { + search.current = e.target.value; + } + const onSearchClick = () => { + pageNo.current = 1; + getMonitorRoom(); + } + const onBtnSelect = (btnName: string, status: string) => { + if (btnName == selectBtn) { + setSelectBtn(""); + selectStatus.current = ""; + } else { + setSelectBtn(btnName); + selectStatus.current = status; + } + pageNo.current = 1; + getMonitorRoom(); + } + const onCardClick = (item: any) => { + if (item.status == "0") { + message.info("当前评标室未开启,请等待开启后查看"); + return; + } + history.push({ + // pathname: "/ElecMonitorScreen/ProjectMonitorRoom", + pathname: "/ElecMonitor/RoomDetail", + state: { monitorId: item.id }, + }) + } + const onProvinceMap = (tag: any, index: any) => ( +
+ handleChange(tag.provincesNumber, checked)} + > + {tag.provincesRemark} + + + ) + const itemRender: PaginationProps['itemRender'] = (_, type, originalElement) => { + if (type === 'prev') { + return ; + } + if (type === 'next') { + return ; + } + return originalElement; + }; + //获取监控列表数据 + const getMonitorRoom = () => { + const params = { + pageNo: pageNo.current, + pageSize: 6, + } + isNotEmpty(selectProvince.current) && (params["provinceDictId"] = selectProvince.current); + isNotEmpty(selectStatus.current) && (params["status"] = selectStatus.current); + isNotEmpty(search.current) && (params["keyword"] = search.current); + getMonitorList(params).then(res => { + if (res?.code == 200) { + setTotalItem(res?.data.total); + setListData(res?.data.records); + } + }) + } + + //定时器 + useEffect(() => { + let interval: any; + if (auth) { + getMonitorRoom(); + interval = setInterval(function () { + getMonitorRoom(); + }, _time); + } + return () => { + clearInterval(interval) + }; + }, []) + return ( + +
+
+
+
+
+ +
+
+
+ +
+ {/*
+ + {provinceList.slice(0, 16).map(onProvinceMap)} + + {allExpand ? + {provinceList.slice(16, 32).map(onProvinceMap)} + : null} +
+ { setAllExpand(ite => !ite) }}>{allExpand ? "收起" : "展开"}{allExpand ? : } +
+
*/} +
+
+ 省分: +
+ + {provinceList.map(onProvinceMap)} + + } > + + {provinceList.slice(0, 11).map(onProvinceMap)} +
+ 全部 + + + + + + +
+
+
onBtnSelect("order", "0")}> +
+ 已预约 +
+
onBtnSelect("going", "1")}> +
+ 开标中 +
+
onBtnSelect("ending", "2")}> +
+ 已结束 +
+
+
+ + + + + + `当前第 ${range[0]}-${range[1]} 条,共计 ${total} 条`, + itemRender, + hideOnSinglePage: true, + }} + className="monitor-list-global" + dataSource={listData} + renderItem={item => ( + +
onCardClick(item)}> +
+
+ + {item.areaName} +
+ {item.isAbnormal == "1" && 异常预警} +
+
+

项目名称:{item.projectName}

+

标段名称:{item.sectionName}

+

评标时间:{item.startDate} — {item.endDate}

+

专家数量:{item.expertNumber}

+

评标状态:{bidStatusMap[item.status]}所属省份:{proviceEnum[item.provinceDictId]}

+
+
+
+ )} + /> + + ); +}; + +export default MonitorRoom; diff --git a/src/pages/ElecEvaluation/Monitor/RoomDetail/index.tsx b/src/pages/ElecEvaluation/Monitor/RoomDetail/index.tsx new file mode 100644 index 0000000..5771c97 --- /dev/null +++ b/src/pages/ElecEvaluation/Monitor/RoomDetail/index.tsx @@ -0,0 +1,495 @@ +import { Image, Col, Row, Empty, Drawer } from 'antd'; +import React, { useEffect, useRef, useState } from 'react'; +import '../style.less' +import { authCheck, EarlyWarnItem, onCell, onHeaderCell, ScreenLabel, ScreenTitle, ScrollTable } from '../Home'; +import { history } from "umi"; +import { getAllStranger, getBidRoomData, getCameraList, getExpertReports, getLookBackList, getWarnData } from "../service"; +import ScreenVideoPlay from "@/components/ElecBidEvaluation/ScreenVideoPlay"; +import { pictureDisplayPath } from "@/utils/DownloadUtils"; +import { getURLInformation } from "@/utils/CommonUtils"; +import { getDicData, getSessionRoleData } from "@/utils/session"; +import strangerIcon from '@/assets/monitor/stranger-icon.png'; +import numberIcon from '@/assets/monitor/number-icon.png'; +import { bidStatusMap } from '../Room'; +const statusMap = ["未报道", "已报道"]; +const peopleNumColumns: any[] = [ + { + title: '时间', + dataIndex: 'eventTime', + key: 'eventTime', + align: 'center', + width: "40%", + onCell, + onHeaderCell, + }, + { + title: '阈值', + dataIndex: 'thresholdOfPeople', + key: 'thresholdOfPeople', + align: 'center', + ellipsis: true, + onCell, + onHeaderCell, + render: (_: any, record: any) => `${_}人`, + }, + { + title: '实际人数', + dataIndex: 'realOfPeople', + key: 'realOfPeople', + align: 'center', + onCell, + onHeaderCell, + render: (_: any, record: any) => `${_}人`, + }, +]; + +const backPeopleNumColumns: any[] = [ + { + title: '时间', + dataIndex: 'createDate', + key: 'createDate', + align: 'center', + width: "40%", + onCell, + onHeaderCell, + }, + { + title: '阈值', + dataIndex: 'thresholdOfPeople', + key: 'thresholdOfPeople', + align: 'center', + ellipsis: true, + onCell, + onHeaderCell, + render: (_: any, record: any) => `${record.details?.[0].thresholdOfPeople}人`, + }, + { + title: '实际人数', + dataIndex: 'realOfPeople', + key: 'realOfPeople', + align: 'center', + onCell, + onHeaderCell, + render: (_: any, record: any) => `${record.details?.[0].realOfPeople}人`, + }, +]; + +const staffReportColumns: any[] = [ + { + title: '人员', + dataIndex: 'userName', + key: 'userName', + align: 'center', + ellipsis: true, + onCell, + onHeaderCell, + }, + { + title: '报道状态', + dataIndex: 'status', + key: 'status', + align: 'center', + onCell, + onHeaderCell, + render: (_: any, record: any) => statusMap[_], + }, + { + title: '报道时间', + dataIndex: 'signDate', + key: 'signDate', + align: 'center', + width: "40%", + onCell, + onHeaderCell, + render: (_: any, record: any) => record.signDate || '-', + }, +]; + +export const homeClick = () => { + history.push("/ElecMonitor/Home"); +} +export const previousClick = () => { + history.goBack(); +} + +const MonitorRoomDetail: React.FC<{}> = (props: any) => { + //tooltip visible + // const [visible, setVisible] = useState(false); + //camera select + const [cameraSelect, setCameraSelect] = useState("1"); + //选中的设备参数 + const [cameraParams, setCameraParams] = useState(); + //right btn select + const [btnSelect, setBtnSelect] = useState("0"); + //props state + const monitorId = props.location.state?.monitorId ? props.location.state?.monitorId : getURLInformation("monitorId"); + //基本信息数据 + const [basicInfo, setBasicInfo] = useState({}); + //异常预警数据 + const [earlyWarnData, setEarlyWarnData] = useState(); + //设备列表 + const [caremaList, setCaremaList] = useState([]); + //报道列表 + const [expertList, setExpertList] = useState([]); + //陌生人预警-进行中 + const [strangerList, setStrangerList] = useState([]); + //陌生人预警-回看 + const [backStrangerList, setBackStrangerList] = useState([]); + //人数预警-回看 + const [backNumberList, setBackNumberList] = useState([]); + //采购方式字典 + const [bidMethodObj, setBidMethodObj] = useState(); + //图片查看抽屉显隐 + const [drawerVisible, setDrawerVisible] = useState(false); + //图片查看URL + const [drawerUrl, setDrawerUrl] = useState(''); + //监控视频Ref + const videoRef = useRef(); + //图片展示ref + const zoomImg = useRef(null); + //定时刷新间隔 + const _time = 10000; + //当前登录人角色 + const roleCode = getSessionRoleData()?.roleCode; + //权限校验 + const auth = useRef(authCheck(["ebtp-watcher", "ebtp-site-supervision", "ebtp-after-supervision"])); + + const onCaremaPlay = (item: any) => { + setCameraSelect(item.id); + setCameraParams(item.platform); + if (basicInfo?.status == "2") {//回看 + videoRef.current?.back(item.deviceCode, basicInfo?.startDate, basicInfo?.endDate); + } else { + videoRef.current?.play(item.deviceCode); + } + } + //获取基本信息数据 + const getRoomData = () => { + getBidRoomData(monitorId).then(res => {//获取基本信息 + if (res?.code == 200) { + const data = res?.data; + for (const ite of data.userNumberList) { + if (ite.userType == "manager") {//项目经理 + data["manager"] = ite.userNumber; + } else if (ite.userType == "purchaseExpert") {//专家-招标人代表 + data["purchaseExpert"] = ite.userNumber; + } else if (ite.userType == "expert") {//专家 + data["expert"] = ite.userNumber; + } + } + if (data.sectionPayerList?.length > 0) { + let length = 0 + for (const ite of data.sectionPayerList) { + length += Number(ite.payerNumber); + } + data["supplierLength"] = length; + } else { + data["supplierLength"] = 0; + } + setBasicInfo(data); + getCaremaData(data);//获取监控点列表 + if (data.status == "2") {//评标结束-回看 + getBackList("2");//数量预警 + ((roleCode != "ebtp-site-supervision") && (roleCode != "ebtp-after-supervision")) && getBackList("3");//陌生人预警 + } + } + }) + } + //获取异常预警数据 + const getWarnInfo = () => { + getWarnData({ reserveId: monitorId }).then(res => { + if (res?.code == 200) { + const data = res?.data; + setEarlyWarnData(data); + (((roleCode != "ebtp-site-supervision") && (roleCode != "ebtp-after-supervision")) && data?.strangerDetails) && setStrangerList(data.strangerDetails.slice(0, 5)); + } + }) + } + //获取设备 + const getCaremaData = (baseData: any) => { + getCameraList({ areaId: baseData.placeId }).then(res => { + if (res?.code == 200) { + const data = res?.data; + setCaremaList(data); + if (data?.length > 0) { + setCameraSelect(data[0].id); + setCameraParams(data[0].platform); + setTimeout(() => { + if (baseData.status == "2") {//回看 + videoRef.current?.back(data[0].deviceCode, baseData.startDate, baseData.endDate); + } else { + videoRef.current?.play(data[0].deviceCode); + } + }, 4000); + } + } + }) + } + //获取专家报道列表 + const getExpertList = () => { + getExpertReports({ reserveId: monitorId, pageNo: 1, pageSize: 20 }).then(res => { + if (res?.code == 200) { + const data = res?.data.records; + setExpertList(data); + } + }) + } + //获取告警-回看数据 + const getBackList = (type: string) => { + getLookBackList({ reserveId: monitorId, type, pageNo: 1, pageSize: type == "3" ? 1 : 5 }).then(res => { + if (res?.code == 200) { + const data = res?.data.records; + if (type == "2") {//2-人数预警 + setBackNumberList(data); + } else if (type == "3") {//3-陌生人预警 + data.length > 0 && setBackStrangerList(data[0].details.slice(0, 5)); + } + } + }) + } + //获取陌生人告警-全部告警 + const getAllStrangerList = () => { + getAllStranger({ reserveId: monitorId }).then(res => { + if (res?.code == 200) { + const data = res?.data; + if (data && data.length > 0) { + setStrangerList(data); + setBackStrangerList(data); + } + } + }) + } + //初始化字典 + const initDict = () => { + //采购方式字典 + const getDict: any = getDicData(); + const dictData = JSON.parse(getDict); + const bidMethodArray = dictData["procurement_mode=entrust"] as any[]; + let obj = {}; + for (let i = 0, length = bidMethodArray.length; i < length; i++) { + obj[bidMethodArray[i].code] = bidMethodArray[i].dicName; + } + setBidMethodObj(obj); + } + //图片放大抽屉显示 + const drawerClick = (filePath: string) => { + setDrawerUrl(filePath); + setDrawerVisible(true); + } + //图片放大抽屉关闭 + const drawerClose = () => { + setDrawerVisible(false); + setDrawerUrl(""); + } + const handleImgZoom = (e: { nativeEvent: { deltaY: number; }; }) => { + const { clientWidth, clientHeight, style, height, width } = zoomImg.current + const value = height / width + const num = 50 + const bool = height > width ? clientWidth < 2000 : clientHeight < 1500 + if (e.nativeEvent.deltaY <= 0 && bool) { + style.maxWidth = "none" + style.maxHeight = "none" + style.width = width + num + "px" + style.height = height + (num * value) + "px" + style.left = style.left - 1 % +"px" + style.top = style.top - 1 % +"px" + } else if (e.nativeEvent.deltaY > 0) { + if (width > 200 && height > 100) { + style.width = width - num + "px" + style.height = height - (num * value) + "px" + style.left = style.left + 1 % + "px" + style.top = style.top + 1 % + "px" + } + } + } + + useEffect(() => { + if (auth) { + initDict(); + getRoomData(); + getWarnInfo(); + getExpertList(); + if (roleCode == "ebtp-site-supervision" || roleCode == "ebtp-after-supervision") { getAllStrangerList(); } + } + }, []) + //定时器 + useEffect(() => { + let interval: any + if (auth) { + if (basicInfo?.status && basicInfo?.status != "2") { + interval = setInterval(function () { + getWarnInfo(); + getExpertList(); + if (roleCode == "ebtp-site-supervision" || roleCode == "ebtp-after-supervision") { getAllStrangerList(); } + }, _time); + } + } + return () => { + clearInterval(interval) + }; + }, [basicInfo]) + + return ( + +
+ +
+
+ + {/*
*/} +
+

项目名称:{basicInfo?.projectName}

+

项目编号:{basicInfo?.projectNum}

+

标段名称:{basicInfo?.sectionName}

+

评标时间:{basicInfo?.startDate} — {basicInfo?.endDate}

+

代理机构业务经理:{basicInfo?.appManagerName}

+

评标室人数:{basicInfo?.peopleNumber}人  业务经理:{basicInfo?.manager}人  招标人代表:{basicInfo?.purchaseExpert}人  专家:{basicInfo?.expert}

+
+
+ +
+ {/*
*/} +
+
+
+
+
+
+ {basicInfo?.areaName} +
+
+
+
+
+ {basicInfo?.status && {bidStatusMap[basicInfo?.status]}} +
+
+
+ + +
+ + {/*
*/} +
+ + +
+
+ + +
+ + +
+
+
+
监控画面
+
+ {caremaList.map((item, index) =>
onCaremaPlay(item)} key={index}>{item.deviceName}
)} +
+
+
+ {cameraParams && } +
+
+
+ + +
+
{ setBtnSelect("0") }}> + 陌生人预警 +
+
{ setBtnSelect("1") }}> + 人数预警 +
+
{ setBtnSelect("2") }}> + 人员报道信息 +
+ {basicInfo?.status == "2" ? ( +
{ setBtnSelect("3") }}> + 供应商信息 +
+ ) : null} +
+
+ {btnSelect == "0" ? ( +
+ {basicInfo?.status == "2" + ? backStrangerList.length > 0 ? backStrangerList.map((item: any, index: any) => ( +
+
+

时间:{item.eventTime}

+
+
+ drawerClick(item.filePath)} /> +
+
+ )) : ( +
+ +
+ ) + : strangerList.length > 0 ? strangerList.map((item: any, index: any) => ( +
+
+

时间:{item.eventTime}

+

描述:{item.describeStranger}

+
+
+ drawerClick(item.filePath)} /> +
+
+ )) : ( +
+ +
+ )} +
+ ) : btnSelect == "1" ? ( + + ) : btnSelect == "2" ? ( + + ) : ( +
+
+ {basicInfo?.sectionPayerList?.[0]?.sectionName}({basicInfo?.sectionPayerList?.[0]?.payerNumber}) +
+
+ + {basicInfo?.sectionPayerList?.[0]?.payerNames.map((item: any) => ( +
+
+ {item} +
+ + ))} + {basicInfo?.sectionPayerList?.[0]?.payerNames.length % 2 != 0 ? ( + +
+
+ + ) : null} + + + + )} + {drawerVisible && +
+ (localYear); diff --git a/src/pages/ElecEvaluation/Monitor/TenderAgent/index.tsx b/src/pages/ElecEvaluation/Monitor/TenderAgent/index.tsx index 260f1f8..7ee2d24 100644 --- a/src/pages/ElecEvaluation/Monitor/TenderAgent/index.tsx +++ b/src/pages/ElecEvaluation/Monitor/TenderAgent/index.tsx @@ -78,7 +78,7 @@ const TenderAgent: React.FC<{}> = () => { //存一份 const selectAgency = useRef(""); //权限校验 - const auth = useRef(authCheck()); + const auth = useRef(authCheck(["ebtp-watcher"])); // const gaugeChartData = [{ value: 20 }] // const gaugeGreenChart = useMemo(() => { // return gaugeChartData && diff --git a/src/pages/ElecEvaluation/Monitor/service.ts b/src/pages/ElecEvaluation/Monitor/service.ts index 55c6499..195e617 100644 --- a/src/pages/ElecEvaluation/Monitor/service.ts +++ b/src/pages/ElecEvaluation/Monitor/service.ts @@ -93,9 +93,10 @@ export async function getNoOpenNumberAPI(data: any) { /** * 异常监控-开启评审后3日未结束评标 */ -export async function getThreeDayNoEndAPI() { +export async function getThreeDayNoEndAPI(data: any) { return request('/api/biz-service-ebtp-statistics/api/evaluation/exception/threedaynoend', { - method: 'GET', + method: 'POST', + data: { ...data }, }); } @@ -142,11 +143,22 @@ export async function getNoOpenAssessNumberAPI(data: any) { } /** - * 异常监控-解密异常、mac地址相同及相关项目列表 + * 异常监控-解密异常列表、解密异常数量 */ -export async function getDecryptDataAPI() { - return request('/api/biz-service-ebtp-statistics/exceptionMonitor/getDecryptDataNow', { - method: 'GET', +export async function getDecryptExceptionListAPI(data: any) { + return request('/api/biz-service-ebtp-statistics/exceptionMonitor/getDecryptExceptionList', { + method: 'POST', + data: { ...data } + }); +} + +/** + * 异常监控-mac地址相同列表,mac地址相同数量 + */ +export async function getMacSameListAPI(data: any) { + return request('/api/biz-service-ebtp-statistics/exceptionMonitor/getMacSameList', { + method: 'POST', + data: { ...data } }); } @@ -162,9 +174,10 @@ export async function getThreeDaysUnSendAnnoCountAPI() { /** * 异常监控-评审室关闭3日内未发布公示列表 */ -export async function getThreeDaysUnSendAnnoListAPI() { +export async function getThreeDaysUnSendAnnoListAPI(data: any) { return request('/api/biz-service-ebtp-statistics/exceptionMonitor/threeDaysUnSendAnnoList', { - method: 'GET', + method: 'POST', + data: { ...data } }); } @@ -180,25 +193,28 @@ export async function getTodayInfoAPI() { /** * 今日开标-评标阶段10小时未评标 */ -export async function getUnopenTenAPI() { +export async function getUnopenTenAPI(data: any) { return request('/api/biz-service-ebtp-statistics/api/evaluation/today/unopen/ten', { - method: 'GET', + method: 'POST', + data: { ...data }, }); } /** * 今日开标-评标阶段6小时未评标 */ -export async function getUnopenSixAPI() { +export async function getUnopenSixAPI(data: any) { return request('/api/biz-service-ebtp-statistics/api/evaluation/today/unopen/six', { - method: 'GET', + method: 'POST', + data: { ...data }, }); } /** * 今日开标-解密成功率 */ -export async function getDecryptSuccessRateTodayAPI() { +export async function getDecryptSuccessRateTodayAPI(data: any) { return request('/api/biz-service-ebtp-statistics/exceptionMonitor/getDecryptSuccessRateToday', { - method: 'GET', + method: 'POST', + data: { ...data } }); } @@ -255,4 +271,95 @@ export async function getMonitorListAPI(data: any) { method: 'POST', data: data, }); +} +/** + * 评标室监控列表-获取评标室监控列表 + * @param data + * @returns + */ +export async function getMonitorList(data: any) { + return request('/api/biz-service-ebtp-evaluation/v1/screen/getReviewRoomList', { + method: 'POST', + data: data, + }); +} +/** + * 评标室监控详情-获取评标室内容数据 + * @param id + * @returns + */ +export async function getBidRoomData(id: any) { + return request('/api/biz-service-ebtp-evaluation/v1/screen/getReviewRoom/' + id, { + method: 'GET', + }); +} + +/** + * 评标室监控详情-设备列表 + * @param params + * @returns + */ +export async function getCameraList(params: any) { + return request('/api/biz-service-ebtp-evaluation/v1/screen/queryAreaCamera', { + method: 'GET', + params: params, + }); +} + +/** + * 评标室监控详情-专家报道列表 + * @param data + * @returns + */ +export async function getExpertReports(data: any) { + return request('/api/biz-service-ebtp-evaluation/v1/screen/queryReportUser', { + method: 'POST', + data: data, + }); +} + +/** + * 评标室监控详情-回看列表 + * @param params + * @returns + */ +export async function getLookBackList(params: any) { + return request('/api/biz-service-ebtp-evaluation/v1/eval/room/alarm/screamOfAlarm/back', { + method: 'POST', + params: params + }); +} + +// /** +// * 评标室监控详情-设备列表(回看) +// * @param id +// * @returns +// */ +// export async function getCaremaBackList(id: any) { +// return request('/api/biz-service-ebtp-evaluation/v1/eval/room/reserve/' + id, { +// method: 'GET', +// }); +// } + +/** + * 评标室监控详情-陌生人预警-查询全部 + * @param params + * @returns + */ +export async function getAllStranger(params: any) { + return request('/api/biz-service-ebtp-evaluation/v1/eval/room/alarm/screamOfAlarm/strangerImg', { + method: 'GET', + params: params + }); +} +/** + * 评标室监控详情-异常预警 + * @param params + * @returns + */ +export async function getWarnData(params?: any) { + return request('/api/biz-service-ebtp-evaluation/v1/eval/room/alarm/screamOfAlarm', { + method: 'GET', + params: { ...params }, + }); } \ No newline at end of file diff --git a/src/pages/ElecEvaluation/Monitor/style.less b/src/pages/ElecEvaluation/Monitor/style.less index e99cbca..054a985 100644 --- a/src/pages/ElecEvaluation/Monitor/style.less +++ b/src/pages/ElecEvaluation/Monitor/style.less @@ -32,6 +32,25 @@ // left: 50%; } + .screen-global-timep { + margin: 16px 84px 0 0; + text-align: right; + + &>span { + font-size: 22px; + font-weight: normal; + line-height: 34px; + letter-spacing: 0px; + color: #45A2FF; + z-index: 0; + margin-left: 16px; + } + + &>span:last-child { + color: #FFFFFF; + } + } + } @@ -60,8 +79,13 @@ height: 114px; width: 100%; text-align: center; + display: flex; - &>span { + &>div { + flex: 1; + } + + &>div>span { font-size: 38px; font-weight: bold; line-height: 72px; @@ -141,6 +165,391 @@ .monitor-top-flex-space { justify-content: space-around; } + + .monitor-detail-proj-d { + padding: 14px 20px 8px 20px; + + &>p { + margin-bottom: 5px; + color: #FFFFFF; + width: 100%; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } + } + + .monitor-detail-room-d { + padding: 14px 20px 8px 20px; + margin-top: 8px; + + &>p { + margin-bottom: 5px; + color: #FFFFFF; + } + } + + .monitor-detail-exception { + height: 184px; + display: flex; + justify-content: space-evenly; + align-items: center; + + .screen-warn-content-item { + display: flex; + justify-content: flex-start; + align-items: flex-end; + color: #fff; + position: relative; + top: -8px; + + .screen-warn-img { + height: 58px; + width: 58px; + } + + .screen-warn-content { + display: flex; + flex-direction: column; + justify-content: space-between; + margin-left: 16px; + } + + .screen-warn-num { + font-size: 36px; + font-weight: normal; + line-height: 44px; + letter-spacing: 0px; + color: #FFD502; + } + + .screen-warn-name { + font-size: 16px; + font-weight: normal; + line-height: 22px; + letter-spacing: 0.8px; + color: #FFFFFF; + } + } + } + + .monitor-detail-bluec { + color: #45a2ff; + } + + .monitor-detail-yellowc { + color: #ffd502; + } + + .monitor-center-global { + height: 100%; + position: relative; + background: rgba(27, 126, 242, 0.12); + + .monitor-center-absolute-center { + width: 100%; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + } + } + + .monitor-detail-bg-card { + background: rgba(27, 126, 242, 0.12); + } + + .monitor-detail-title-bg .screen-label-main .right-rect-2 { + background: rgba(27, 126, 242, 0.12); + } + + .monitor-warning-list { + height: 670px; + + .stranger-list { + // height: calc(100% - 76px); + height: 100%; + overflow-y: auto; + overflow-x: hidden; + + .stranger-list-card { + margin-top: 20px; + padding: 16px; + height: calc(20% - 16px); + background: rgba(27, 126, 242, 0.12); + color: #FFFFFF; + display: flex; + justify-content: space-between; + text-align: left; + + &>div>p { + margin-bottom: 0; + } + + &>div>p>span { + font-size: 16px; + font-weight: normal; + line-height: 40px; + letter-spacing: 0px; + color: #FFFFFF; + } + } + + .stranger-list-card:first-child { + margin-top: 0; + } + + /*设置宽度,轨道颜色*/ + &::-webkit-scrollbar { + width: 6px; + height: 6px; + // padding-right: 3px; + } + + /*滚动条*/ + &::-webkit-scrollbar-thumb { + background: #b9bfd7; + border-radius: 10px; + } + + /*增加悬停样式*/ + &::-webkit-scrollbar-thumb:hover { + background: #dcdfeb; + } + + /*滚动轨道样式*/ + &::-webkit-scrollbar-track-piece { + background: #505e9a; + border-radius: 3px; + } + } + + .ant-drawer-close { + color: #fff; + + &:focus, + &:hover { + color: #fff; + } + } + + .ant-drawer-content { + background-color: rgba(0, 0, 0, 0.35); + } + + .ant-drawer-body { + text-align: center; + padding: 0; + + &>div { + height: 100%; + } + + &>div>img { + position: relative; + top: 50%; + transform: translateY(-50%); + -moz-user-select: 'none'; + /* Firefox私有属性 */ + -webkit-user-select: 'none'; + /* WebKit内核私有属性 */ + -ms-user-select: 'none'; + /* IE私有属性(IE10及以后) */ + user-select: 'none'; + /* CSS3属性 */ + } + } + + .ant-empty-normal { + color: #FFFFFF; + } + + .monitor-supplier-title-global { + height: 54px; + width: 100%; + padding: 10px 0 10px 20px; + overflow-y: auto; + overflow-x: hidden; + + &>span { + font-size: 16px; + font-weight: normal; + line-height: 34px; + letter-spacing: 0px; + color: #29f0f9; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } + + .orange-color { + color: #ffd502; + } + + /*设置宽度,轨道颜色*/ + &::-webkit-scrollbar { + width: 6px; + height: 6px; + // padding-right: 3px; + } + + /*滚动条*/ + &::-webkit-scrollbar-thumb { + background: #b9bfd7; + border-radius: 10px; + } + + /*增加悬停样式*/ + &::-webkit-scrollbar-thumb:hover { + background: #dcdfeb; + } + + /*滚动轨道样式*/ + &::-webkit-scrollbar-track-piece { + background: #505e9a; + border-radius: 3px; + } + } + + .monitor-supplier-list-global { + margin-top: 16px; + height: 600px; + + .monitor-supplier-list { + height: 40px; + padding: 4px 4px 4px 20px; + border-bottom: 1px solid #2384DD; + width: 100%; + + &>span { + font-size: 14px; + font-weight: normal; + line-height: 32px; + letter-spacing: 0px; + color: #FFFFFF; + z-index: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } + } + } + } + + .monitor-btn-global { + height: 36px; + display: flex; + justify-content: flex-start; + align-items: center; + + &>div { + background: #1b7ff224; + line-height: 1.5715; + position: relative; + display: inline-block; + font-weight: 400; + white-space: nowrap; + text-align: center; + border: 1px solid transparent; + cursor: pointer; + transition: all .3s cubic-bezier(.645, .045, .355, 1); + user-select: none; + touch-action: manipulation; + height: 36px; + padding: 0px 14px; + margin-left: 2px; + + // border-radius: 2px; + &>span { + font-size: 18px; + font-weight: normal; + line-height: 34px; + letter-spacing: 0px; + /* text/1 */ + color: rgba(255, 255, 255, 0.87); + text-shadow: 0px 2px 24px 0px rgba(27, 126, 242, 0.91); + } + + &:not(.monitor-btn-selected):hover { + background: #1b7ff236; + } + } + + &>div:first-child { + margin-left: 0; + } + + .monitor-btn-selected { + background: #1B7EF2; + } + } + + .monitor-video-global { + // margin-right: 20px; + height: 726px; + + .left-monitor-content { + padding: 12px 12px 12px 20px; + display: flex; + justify-content: flex-start; + height: 100%; + + .left-menu { + width: 12%; + + .left-menu-content { + .left-menu-btn { + height: 44px; + width: 100%; + text-align: center; + cursor: pointer; + background: rgba(27, 126, 242, 0.17); + border: none; + margin-bottom: 16px; + transition: color 0.3s, background 0.3s, border-color 0.3s, box-shadow 0.3s; + font-size: 16px; + font-weight: bold; + line-height: 44px; + letter-spacing: 0px; + color: #29F0F9; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + padding: 0 2px; + } + + .left-menu-btn:not(.left-menu-btn-select):hover { + background: rgba(27, 126, 242, 0.26); + } + + .left-menu-btn-select { + background: #1B7EF2; + color: #fff; + } + } + + .left-monitor-title { + margin-bottom: 16px; + + &>span { + font-size: 20px; + font-weight: normal; + line-height: 34px; + letter-spacing: 0px; + color: rgba(255, 255, 255, 0.87); + } + } + } + + .right-content-c { + width: 100%; + height: 100%; + position: relative; + left: -1px; + top: -1px; + } + } } .top-main-bottom { @@ -502,6 +911,449 @@ .monitor-extra-pointer-select { color: #1B7EF2; } + + .monitor-center-menu { + .flex-center; + justify-content: space-around; + + .monitor-center-menu-options { + width: 72px; + height: 72px; + cursor: pointer; + background-size: cover; + } + + .monitor-center-menu-home { + background: url("~@/assets/monitor/options-home.png") left top no-repeat; + + &:hover { + background: url("~@/assets/monitor/options-home2.png") left top no-repeat; + } + } + + .monitor-center-menu-back { + background: url("~@/assets/monitor/options-back.png") left top no-repeat; + + &:hover { + background: url("~@/assets/monitor/options-back2.png") left top no-repeat; + } + } + + .monitor-center-menu-select { + width: 121.29px; + height: 75px; + opacity: 1; + background: #00000A; + box-sizing: border-box; + border: 1px solid #1B7EF2; + box-shadow: inset 0px 0px 87px 0px rgba(27, 126, 242, 0.4); + text-align: center; + padding-top: 8px; + cursor: pointer; + + &>div { + height: 32px; + width: 32px; + background-size: cover; + display: inline-block; + } + + .monitor-center-menu-select-first { + background: url("~@/assets/monitor/select-first.png") left top no-repeat; + } + + .monitor-center-menu-select-second { + background: url("~@/assets/monitor/select-second.png") left top no-repeat; + } + + .monitor-center-menu-select-third { + background: url("~@/assets/monitor/select-third.png") left top no-repeat; + } + + &>span { + font-size: 18px; + font-weight: normal; + line-height: 18px; + text-align: center; + letter-spacing: 0px; + color: #29F1FA; + display: block; + } + } + + .monitor-center-menu-select:hover, + .monitor-center-menu-checked { + background: #1B7EF2; + box-sizing: border-box; + border: 1px solid #1B7EF2; + + &>span { + color: #FFFFFF; + } + + .monitor-center-menu-select-first { + background: url("~@/assets/monitor/select-first2.png") left top no-repeat; + } + + .monitor-center-menu-select-second { + background: url("~@/assets/monitor/select-second2.png") left top no-repeat; + } + + .monitor-center-menu-select-third { + background: url("~@/assets/monitor/select-third2.png") left top no-repeat; + } + } + + .monitor-center-room-title { + text-align: center; + width: 388px; + + &>div>span { + font-size: 32px; + font-weight: bold; + line-height: 40px; + letter-spacing: 3.2px; + color: #29F1FA; + } + } + } + + .monitor-center-status { + text-align: center; + margin-top: 12px; + + &>span { + font-size: 18px; + font-weight: normal; + line-height: 26px; + letter-spacing: 0px; + display: inline-block; + padding: 2px 16px; + } + + .blue-status { + color: #0AA7FF; + border: 1px solid #0AA7FF; + background: #0aa7ff2b; + } + + .red-status { + color: #ee6766; + border: 1px solid #ee6766; + background: #ee67661a; + } + } + + .monitor-top-search { + position: absolute; + top: 16px; + left: 84px; + display: flex; + justify-content: flex-end; + + &>div:last-child { + padding-left: 8px; + } + + .ant-input { + width: 200px; + color: #FFFFFF; + background-color: transparent; + border: 1px solid #1B7DF2; + + &:hover { + border-color: #1B7DF2; + } + + &:focus { + border-color: #1B7DF2; + box-shadow: 0 0 0 2px #1B7DF2; + } + + &::-webkit-input-placeholder { + color: #29F1FA; + } + + &:-ms-input-placeholder { + color: #29F1FA; + } + } + + .ant-btn-primary { + background: #1B7EF2; + border-color: #1B7EF2; + + &:hover &:focus &:active { + background: #1B7EF2; + border-color: #1B7EF2; + } + } + } + + .monitor-list-global { + + .ant-list-item { + margin-bottom: 24px !important; + } + + .list-card { + background: rgba(27, 126, 242, 0.14); + border-radius: 4px; + border: 1px solid #1b7ef2; + cursor: pointer; + height: 368px; + padding: 36px 32px; + position: relative; + transition: all .3s; + + &:hover { + background: rgba(27, 127, 242, 0.281); + } + + .list-card-title { + color: #29F0F9; + font-size: 20px; + font-weight: normal; + line-height: 34px; + letter-spacing: 0px; + color: #29F0F9; + margin-bottom: 38px; + + &>img { + vertical-align: bottom; + height: 24px; + width: 23px; + } + + &>span { + margin-left: 0.625rem; + } + } + + .list-error-text { + margin-top: 2px; + + &>img { + height: 22px; + width: 22px; + vertical-align: baseline; + } + + &>span { + font-size: 16px; + font-weight: normal; + letter-spacing: 0em; + color: #FF473E; + margin-left: 8px; + } + } + + .space-between { + display: flex; + justify-content: space-between; + } + + &>div>p { + margin-bottom: 26px; + color: #fff; + width: 100%; + font-size: 14px; + font-weight: normal; + line-height: 17px; + letter-spacing: 0.6px; + z-index: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + + &:last-child { + margin-bottom: 0; + } + + .blue-text { + color: #45A2FF; + } + + .yellow-text { + color: #ffd502; + } + + .bidding-text-going { + color: #29F0F9; + } + + .bidding-text-ending { + color: #ee6766; + } + + .bidding-text-order { + color: #72c1dd; + } + } + } + + .ant-list-pagination { + margin-top: 0; + text-align: center; + } + + .ant-pagination-item { + // border: none; + background: none; + border: 0; + // margin-right: 0.5rem; + margin: 0 0.5rem 0 0; + + &>a { + color: #45a2ff; + } + + &:hover>a { + color: #ffd502; + } + + + } + + .ant-pagination-item:hover { + border-color: #ffd502; + } + + .ant-pagination-item:focus-visible { + border-color: #ffd502; + } + + .ant-pagination-item-active { + border-color: #ffd502; + + a { + color: #ffd502; + } + + &:hover &:focus-visible { + border-color: #ffd502; + } + } + + .ant-pagination-prev:focus-visible .ant-pagination-item-link, + .ant-pagination-next:focus-visible .ant-pagination-item-link, + .ant-pagination-prev:hover .ant-pagination-item-link, + .ant-pagination-next:hover .ant-pagination-item-link { + border-color: #45a2ff; + color: #45a2ff; + } + + .ant-pagination-prev .ant-pagination-item-link, + .ant-pagination-next .ant-pagination-item-link { + background: none; + border-color: #45a2ff; + color: #45a2ff; + } + + .pagination-icon { + font-size: 20px; + vertical-align: middle; + color: #45a2ff; + height: 24px; + } + + .ant-pagination-total-text { + color: #45a2ff; + } + + .ant-pagination-prev { + margin-right: 0.5rem; + + &>a>img { + position: relative; + top: -2px; + } + } + + .ant-pagination-next { + &>a>img { + position: relative; + top: -2px; + } + } + + .ant-pagination-item-ellipsis { + color: #45a2ff; + } + + .ant-pagination-jump-prev .ant-pagination-item-container .ant-pagination-item-link-icon, + .ant-pagination-jump-next .ant-pagination-item-container .ant-pagination-item-link-icon { + color: #45a2ff; + } + + .ant-pagination-jump-prev .ant-pagination-item-container, + .ant-pagination-jump-next .ant-pagination-item-container { + position: relative; + top: -2px; + } + + .ant-empty-image { + color: #FFFFFF; + } + + .ant-empty-description { + color: #FFFFFF; + } + + .ant-empty-normal { + margin: 100px 0; + } + } + + + + .top-province-label-h { + height: 26px; + } + + .list-content-col { + display: flex; + align-items: center; + padding: 0 16px; + + .top-province { + display: flex; + align-items: baseline; + justify-content: flex-start; + } + + .top-province-label { + width: 5.625rem; + + &>span { + font-size: 0.875rem; + color: #fff; + } + } + + .top-province-all { + font-size: 0.875rem; + color: #29F1FA; + padding-left: 10px; + } + + .top-province-col { + display: flex; + align-items: center; + } + + .top-province-tag { + font-size: 0.875rem; + padding: 0 0.5625rem; + line-height: 1.6875rem; + margin-right: 0; + color: #fff; + } + + .monitor-screen-tag-color; + + } + } } @@ -725,7 +1577,12 @@ height: var(--monitor-table-height); } - .scroll-select-bg { + .scroll-select-bg0, + .scroll-select-bg1, + .scroll-select-bg2, + .scroll-select-bg3, + .scroll-select-bg4, + .scroll-select-bg5 { background: #66666666; } } @@ -1130,6 +1987,163 @@ justify-content: flex-end; } + .modal-list-content-g { + max-height: calc(84vh - 130px); + overflow-y: auto; + + &::-webkit-scrollbar { + display: none; + } + } + + .modal-list-search { + display: flex; + justify-content: flex-start; + margin-top: 16px; + + &>div { + color: #FFFFFF; + } + + &>div:not(:last-child) { + padding-right: 16px; + } + + .ant-input { + width: 200px; + color: #FFFFFF; + background-color: transparent; + border: 1px solid #01C2FF; + + &:hover { + border-color: #01C2FF; + } + + &:focus { + border-color: #01C2FF; + box-shadow: 0 0 0 2px #01C2FF; + } + + &::-webkit-input-placeholder { + color: #29F1FA; + } + + &:-ms-input-placeholder { + color: #29F1FA; + } + } + + .ant-btn-primary { + background: #01C2FF; + border-color: #01C2FF; + + &:hover &:focus &:active { + background: #01C2FF; + border-color: #01C2FF; + } + } + } + + .modal-list-pagination { + text-align: right; + margin-top: 16px; + + .ant-pagination-item { + // border: none; + background: none; + border: 0; + // margin-right: 0.5rem; + margin: 0 0.5rem 0 0; + + &>a { + color: #FFFFFF; + } + + &:hover>a { + color: #45a2ff; + } + + + } + + .ant-pagination-item:hover { + border-color: #45a2ff; + } + + .ant-pagination-item:focus-visible { + border-color: #45a2ff; + } + + .ant-pagination-item-active { + border-color: #45a2ff; + + a { + color: #45a2ff; + } + + &:hover &:focus-visible { + border-color: #45a2ff; + } + } + + .ant-pagination-prev:focus-visible .ant-pagination-item-link, + .ant-pagination-next:focus-visible .ant-pagination-item-link, + .ant-pagination-prev:hover .ant-pagination-item-link, + .ant-pagination-next:hover .ant-pagination-item-link { + border-color: #FFFFFF; + color: #FFFFFF; + } + + .ant-pagination-prev .ant-pagination-item-link, + .ant-pagination-next .ant-pagination-item-link { + background: none; + border-color: #FFFFFF; + color: #FFFFFF; + } + + .pagination-icon { + font-size: 20px; + vertical-align: middle; + color: #FFFFFF; + height: 24px; + } + + .ant-pagination-total-text { + color: #FFFFFF; + } + + .ant-pagination-prev { + margin-right: 0.5rem; + + &>a>img { + position: relative; + top: -2px; + } + } + + .ant-pagination-next { + &>a>img { + position: relative; + top: -2px; + } + } + + .ant-pagination-item-ellipsis { + color: #FFFFFF; + } + + .ant-pagination-jump-prev .ant-pagination-item-container .ant-pagination-item-link-icon, + .ant-pagination-jump-next .ant-pagination-item-container .ant-pagination-item-link-icon { + color: #FFFFFF; + } + + .ant-pagination-jump-prev .ant-pagination-item-container, + .ant-pagination-jump-next .ant-pagination-item-container { + position: relative; + top: -2px; + } + } + .modal-list-block { padding: 20px 0 16px; box-sizing: border-box; @@ -1154,7 +2168,7 @@ line-height: 38px; letter-spacing: 0px; color: #FFFFFF; - width: calc(60vw - 294px); + width: calc(60vw - 300px); } &>img { @@ -1202,4 +2216,39 @@ .ant-empty-description { color: #fff; } +} + +.monitor-screen-tag-color { + .ant-tag-checkable:not(.ant-tag-checkable-checked):hover { + color: #1b7ef2; + } + + .ant-tag-checkable:active { + background-color: transparent; + } + + .ant-tag-checkable-checked { + background-color: #1b7ef2; + } +} + +.monitor-screen-tag { + .monitor-screen-tag-color; + padding-top: 0; + + .ant-tooltip-arrow { + display: none; + } + + &>.ant-tooltip-content>.ant-tooltip-inner>p { + margin-bottom: 0; + } +} + +.monitor-top-province-tag { + font-size: 0.875rem; + padding: 0 0.5625rem; + line-height: 1.6875rem; + margin-right: 0; + color: #fff; } \ No newline at end of file diff --git a/src/pages/ElecEvaluation/VideoMonitor/Online/components/OnlineSupervision.tsx b/src/pages/ElecEvaluation/VideoMonitor/Online/components/OnlineSupervision.tsx index 210d64b..0c4430e 100644 --- a/src/pages/ElecEvaluation/VideoMonitor/Online/components/OnlineSupervision.tsx +++ b/src/pages/ElecEvaluation/VideoMonitor/Online/components/OnlineSupervision.tsx @@ -33,7 +33,7 @@ const OnlineSupervision: React.FC<{}> = () => { //在线监督 function supervision(record: any): void { - window.open("/ElecMonitorScreen/ProjectMonitorRoom?monitorId=" + record.id); + window.open("/ElecMonitor/RoomDetail?monitorId=" + record.id); } const columns: ProColumns[] = [ diff --git a/src/pages/ElecEvaluation/VideoMonitor/Post/index.tsx b/src/pages/ElecEvaluation/VideoMonitor/Post/index.tsx index f114adb..7ec7f08 100644 --- a/src/pages/ElecEvaluation/VideoMonitor/Post/index.tsx +++ b/src/pages/ElecEvaluation/VideoMonitor/Post/index.tsx @@ -35,7 +35,7 @@ const PostSupervision: React.FC<{}> = () => { //评标监控回看 function reviewMonitor(record: any): void { - window.open("/ElecMonitorScreen/ProjectMonitorRoom?monitorId=" + record.id); + window.open("/ElecMonitor/RoomDetail?monitorId=" + record.id); } const columns: ProColumns[] = [