diff --git a/src/assets/screen/content_title.png b/src/assets/screen/content_title.png index 8caea18..dfe3252 100644 Binary files a/src/assets/screen/content_title.png and b/src/assets/screen/content_title.png differ diff --git a/src/assets/screen/default_pic01.jpg b/src/assets/screen/default_pic01.jpg new file mode 100644 index 0000000..759cdc3 Binary files /dev/null and b/src/assets/screen/default_pic01.jpg differ diff --git a/src/assets/screen/default_pic02.jpg b/src/assets/screen/default_pic02.jpg new file mode 100644 index 0000000..414e755 Binary files /dev/null and b/src/assets/screen/default_pic02.jpg differ diff --git a/src/assets/screen/default_play.png b/src/assets/screen/default_play.png new file mode 100644 index 0000000..0611991 Binary files /dev/null and b/src/assets/screen/default_play.png differ diff --git a/src/components/ElecBidEvaluation/ScreenWarnBack.tsx b/src/components/ElecBidEvaluation/ScreenWarnBack.tsx new file mode 100644 index 0000000..ea75969 --- /dev/null +++ b/src/components/ElecBidEvaluation/ScreenWarnBack.tsx @@ -0,0 +1,165 @@ +import React, { useEffect, useRef, useState } from 'react'; +import { Card, List, Modal, Typography, Image, Radio, Table } from 'antd'; +import ProCard from '@ant-design/pro-card'; +import { getCameraList, getWarnDetailData } from './service'; +import ScreenVideoPlay from './ScreenVideoPlay'; +import { pictureDisplayPath } from '@/utils/DownloadUtils'; +import moment from 'moment'; + +interface ScreenWarnBackProps { + modalVisible: boolean; + onCancel: () => void; + warnId: string;//告警id +} +const modalHeight = window.innerHeight * 96 / 100; + +/** + * 异常告警详情回放 + * @param props + * @returns + */ +const ScreenWarnBack: React.FC = (props) => { + const { modalVisible, onCancel, warnId } = props; + const { Title } = Typography; + //详情信息 + const [detailData, setDetailData] = useState(); + //设备列表 + const [caremaList, setCaremaList] = useState([]); + //当前选择的设备 + const [cameraSelect, setCameraSelect] = useState("1"); + //当前播放的设备参数 + const [cameraParams, setCameraParams] = useState(); + //监控视频Ref + const videoRef = useRef(); + const peopleNumColumns: any[] = [ + { + title: '时间', + dataIndex: 'eventTime', + key: 'eventTime', + align: 'center', + width: "40%", + }, + { + title: '阈值', + dataIndex: 'thresholdOfPeople', + key: 'thresholdOfPeople', + align: 'center', + ellipsis: true, + render: (_: any, record: any) => `${_}人`, + }, + { + title: '实际人数', + dataIndex: 'realOfPeople', + key: 'realOfPeople', + align: 'center', + render: (_: any, record: any) => `${_}人`, + }, + ]; + //回放 + const videoBack = (deviceCode: any, data: any) => { + let backTime = 20; + if (data.type == "2") {//人数预警 + backTime = 10; + } + videoRef.current?.back(deviceCode, moment(data?.createDate).subtract(backTime, 'm').format('yyyy-MM-DD HH:mm:ss'), data?.createDate); + } + + //获取告警详情数据 + const getWarnDetail = () => { + getWarnDetailData({ id: warnId }).then(res => { + if (res?.code == 200) { + const data = res?.data; + setDetailData(data); + getCaremaData(data); + } + }) + } + + //获取设备 + 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].deviceCode); + setCameraParams(data[0].platform); + setTimeout(() => { + videoBack(data[0].deviceCode, baseData); + }, 4000); + } + } + }) + } + //切换设备 + const onCaremaChange = (e: any) => { + const caremaCode = e.target.value; + for (const ite of caremaList) { + if (ite.deviceCode == caremaCode) { + setCameraSelect(caremaCode); + setCameraParams(ite.platform); + videoBack(caremaCode, detailData); + } + } + } + + useEffect(() => { + warnId && getWarnDetail(); + }, [warnId]) + + return ( + onCancel()} + okButtonProps={{ hidden: true }} + width={"80%"} + maskClosable={false} + style={{ maxHeight: modalHeight }} + bodyStyle={{ height: modalHeight - 107, overflowY: 'auto', padding: 0 }} + centered + > + + + 告警信息：{detailData?.type == "3" ? "陌生人进入" : "人数异常"} + {detailData?.type == "3" ? ( + ( + + +
+ 时间：{item.eventTime} + +
+ + + )} + /> + ) : ( + + )} + + + + {caremaList.map(item => ({item.deviceName}))} + +
+ {cameraParams && } +
+ + + + ); +}; + +export default ScreenWarnBack; diff --git a/src/components/ElecBidEvaluation/service.ts b/src/components/ElecBidEvaluation/service.ts index 91472cd..01de1c0 100644 --- a/src/components/ElecBidEvaluation/service.ts +++ b/src/components/ElecBidEvaluation/service.ts @@ -51,4 +51,27 @@ export async function saveAppointmentEdit(data: any) { method: 'POST', data: { ...data, }, }); +} + +/** + * 根据告警id查询告警详情 + * @param params + */ +export async function getWarnDetailData(params: any) { + return request('/api/biz-service-ebtp-evaluation/v1/eval/room/alarm/get', { + method: 'POST', + params: params, + }); +} + +/** + * 设备列表 + * @param params + * @returns + */ +export async function getCameraList(params: any) { + return request('/api/biz-service-ebtp-evaluation/v1/screen/queryAreaCamera', { + method: 'GET', + params: params, + }); } \ No newline at end of file diff --git a/src/pages/ElecEvaluation/MonitorScreen/Home/index.tsx b/src/pages/ElecEvaluation/MonitorScreen/Home/index.tsx index 018b846..352aa99 100644 --- a/src/pages/ElecEvaluation/MonitorScreen/Home/index.tsx +++ b/src/pages/ElecEvaluation/MonitorScreen/Home/index.tsx @@ -1,13 +1,14 @@ -import { Col, Descriptions, Radio, Row, Table } from 'antd'; +import { Carousel, Col, Radio, Row, Table } from 'antd'; import React, { useEffect, useRef, useState, useMemo } from 'react'; import './style.less'; -import './china' +import './china'; import * as echarts from 'echarts'; -import warn_icon_01 from '@/assets/screen/warn_icon_01.png' -import warn_icon_02 from '@/assets/screen/warn_icon_02.png' -import crown_01 from '@/assets/screen/crown_01.png' -import crown_02 from '@/assets/screen/crown_02.png' -import crown_03 from '@/assets/screen/crown_03.png' +import warn_icon_01 from '@/assets/screen/warn_icon_01.png'; +import warn_icon_02 from '@/assets/screen/warn_icon_02.png'; +import crown_01 from '@/assets/screen/crown_01.png'; +import crown_02 from '@/assets/screen/crown_02.png'; +import crown_03 from '@/assets/screen/crown_03.png'; +import default_play from '@/assets/screen/default_play.png'; import moment from 'moment'; import { getApplicationData, getMonitorSample, getRoomProjectData, getTodayExpert, getTotalMapData, getWarnData } from './service'; import { debounce } from 'lodash'; @@ -54,6 +55,46 @@ export const proviceEnum = { "0065": "新疆", "001000": "集团" } +function dealWithData() { + var geoCoordMap = { + 长春: [125.35, 43.88, 20], + 沈阳: [123.38, 41.8, 19], + 集团: [116.26, 39.92, 18], + 北京: [116.46, 39.92, 17], + 哈尔滨: [126.63, 45.75, 16], + 石家庄: [114.48, 38.03, 15], + 天津: [117.2, 39.13, 14], + 重庆: [106.54, 29.59, 13], + 拉萨: [91.11, 29.97, 12], + 上海: [121.48, 31.22, 11], + 福州: [119.3, 26.08, 10], + 南宁: [108.33, 22.84, 10], + 广州: [113.23, 23.16, 10], + 太原: [112.53, 37.87, 10], + 昆明: [102.73, 25.04, 10], + 海口: [110.35, 20.02, 10], + 银川: [106.27, 38.47, 10], + 西宁: [101.74, 36.56, 10], + 呼和浩特: [111.65, 40.82, 10], + 成都: [104.06, 30.67, 10], + 西安: [108.95, 34.27, 10], + 南京: [118.78, 32.04, 10], + 贵阳: [106.71, 26.57, 10], + 乌鲁木齐: [87.68, 43.77, 10], + 杭州: [120.19, 30.26, 10], + 济南: [117, 36.65, 10], + 兰州: [103.73, 36.03, 10], + 郑州: [113.65, 34.76, 10], + 长沙: [113, 28.21, 10], + 合肥: [117.27, 31.86, 10], + 武汉: [114.31, 30.52, 10], + }; + var data = []; + for (var key in geoCoordMap) { + data.push({ name: key, value: geoCoordMap[key] }); + } + return data; +} const evalColumn: any[] = [ { @@ -135,6 +176,8 @@ const GraphChart = (props: { type: string, chartData: any[] }) => { // to a column of dataset.source by default. series: [{ type: 'bar' }, { type: 'bar' }] }; + var dataValue = dealWithData(); + var data1 = dataValue.splice(0, 3); const pieOption: EChartsOption = { legend: { orient: 'vertical', @@ -214,67 +257,116 @@ const GraphChart = (props: { type: string, chartData: any[] }) => { }; const mapOption: EChartsOption = { tooltip: { - trigger: 'item', - showDelay: 0, - transitionDuration: 0.2, - padding: [8, 12], - formatter: (params: any) => { - return `
-
${params.data?.name} -
-
- 评标室间数：${params.data?.placeNumber} -
-
- 正在评标：${params.data?.openingNumber} -
-
- 评标专家：${params.data?.expertNumber} -
-
- 累计评标次数：${params.data?.cumulativePlaceNumber} -
` - } + show: false }, - visualMap: { - show: false, - min: 0, - max: 1000, - inRange: { - color: [ - '#ECF3F4', - '#E3F4FF', - '#D1ECFD', - '#A0D6F8', - '#5DCAF2', - '#09A6F7', - '#0081C4', - '#26519E', - '#052D74', - '#001F53', - ] + geo: { + map: "china", + roam: false,// 一定要关闭拖拽 + zoom: 1.2, + label: { + show: false//不显示label }, + emphasis: { + disabled: true,//关闭hover高亮 + }, + itemStyle: { + areaColor: "#0d0059", + borderColor: "#389dff", + borderWidth: 1, //设置外层边框 + shadowBlur: 5, + shadowOffsetY: 8, + shadowOffsetX: 0, + shadowColor: "#01012a" + } }, series: [ { - name: '累计评标次数', - type: 'map', + type: "map", + map: "china", roam: false, zoom: 1.2, - left: "20%", - map: 'china', + showLegendSymbol: false, // 存在legend时显示 + label: { + show: false + }, + emphasis: { + disabled: true + }, + itemStyle: { + areaColor: "#0d0059", + borderColor: "#389dff", + borderWidth: 0.5 + } + }, + { + name: "", + type: "scatter", + coordinateSystem: "geo", + data: dataValue, + symbolSize: function (val) { + return Math.floor(val[2] / 1.2); + }, + symbol: "circle", + // symbolSize: 8, + tooltip: { + // formatter(value) { + // return value.data.name + "
" + "物流量：" + "22"; + // }, + show: true + }, + encode: { + value: 2 + }, + label: { + formatter: "{b}", + position: "right", + show: false + }, + itemStyle: { + color: "#f4e925" + }, emphasis: { label: { - show: false, - }, - itemStyle: { - areaColor: '#FFCC00' + show: false } + } + }, + { + name: "", + type: "effectScatter", + coordinateSystem: "geo", + data: data1, + symbolSize: 16, + // symbolSize: function (val) { + // return Math.floor(val[1] / 4); + // }, + tooltip: { + // formatter(value) { + // return value.data.name + "
" + "物流量：" + "22"; + // }, + show: true }, - select: { - disabled: true, + encode: { + value: 2 }, - data: chartData, + showEffectOn: "render", + rippleEffect: { + brushType: "stroke", + color: "#f4e925", + period: 9, + scale: 5 + }, + label: { + formatter: "{b}", + position: "right", + show: true + }, + itemStyle: { + color: "#f4e925", + shadowBlur: 2, + shadowColor: "#333" + }, + zlevel: 1 } ] }; @@ -307,6 +399,8 @@ export const EarlyWarn = ({ img, name, num }: { img: string, name: string, num: ) } +const randomData = () => Math.round(Math.random() * 100); + export default () => { //中心地图及周边数据 const [centerMapData, setCenterMapData] = useState(); @@ -347,7 +441,8 @@ export default () => { const getMapList = () => { getTotalMapData({ pageNo: 1, pageSize: 10 }).then(res => { if (res?.code == 200) { - const data = res?.data; + // const data = res?.data; + const data = { "number": 3060, "list": [{ "provinceDictId": "0022", "provinceDictName": "吉林", "placeNumber": 6, "openingNumber": 30, "expertNumber": 60, "cumulativePlaceNumber": 95 }, { "provinceDictId": "0011", "provinceDictName": "北京", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": 86 }, { "provinceDictId": "0012", "provinceDictName": "天津", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": 77 }, { "provinceDictId": "0013", "provinceDictName": "河北", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0014", "provinceDictName": "山西", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0015", "provinceDictName": "内蒙古", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0021", "provinceDictName": "辽宁", "placeNumber": 2, "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0023", "provinceDictName": "黑龙江", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0031", "provinceDictName": "上海", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0032", "provinceDictName": "江苏", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0033", "provinceDictName": "浙江", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0034", "provinceDictName": "安徽", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0035", "provinceDictName": "福建", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0036", "provinceDictName": "江西", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0037", "provinceDictName": "山东", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0041", "provinceDictName": "河南", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0042", "provinceDictName": "湖北", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0043", "provinceDictName": "湖南", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0044", "provinceDictName": "广东", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0045", "provinceDictName": "广西", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0046", "provinceDictName": "海南", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0050", "provinceDictName": "重庆", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0051", "provinceDictName": "四川", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0052", "provinceDictName": "贵州", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0053", "provinceDictName": "云南", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0054", "provinceDictName": "西藏", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0061", "provinceDictName": "陕西", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0062", "provinceDictName": "甘肃", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0063", "provinceDictName": "青海", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0064", "provinceDictName": "宁夏", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }, { "provinceDictId": "0065", "provinceDictName": "新疆", "placeNumber": randomData(), "openingNumber": randomData(), "expertNumber": randomData(), "cumulativePlaceNumber": randomData() }] } for (const ite of data.list) { ite["name"] = ite.provinceDictName; ite["value"] = ite.placeNumber; @@ -372,7 +467,8 @@ export default () => { const getEvaRoomData = () => { getRoomProjectData({ pageNo: 1, pageSize: 20 }).then(res => { if (res?.code == 200) { - const data = res?.data; + // const data = res?.data; + const data = [{ "id": "1565620867201146880", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "0", "userNumber": 5, "pageNo": null, "pageSize": null }, { "id": "1565620867201146881", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "0", "userNumber": 7, "pageNo": null, "pageSize": null }, { "id": "1565620867201146882", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "0", "userNumber": 5, "pageNo": null, "pageSize": null }, { "id": "1565620867201146883", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "0", "userNumber": 5, "pageNo": null, "pageSize": null }, { "id": "1565620867201146884", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "1", "userNumber": 5, "pageNo": null, "pageSize": null }, { "id": "1565620867201146885", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "1", "userNumber": 3, "pageNo": null, "pageSize": null }, { "id": "1565620867201146886", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "1", "userNumber": 5, "pageNo": null, "pageSize": null }, { "id": "1565620867201146887", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "1", "userNumber": 5, "pageNo": null, "pageSize": null }, { "id": "1565620867201146888", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "2", "userNumber": 5, "pageNo": null, "pageSize": null }, { "id": "1565620867201146889", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "2", "userNumber": 7, "pageNo": null, "pageSize": null }, { "id": "1565620867201146890", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "2", "userNumber": 5, "pageNo": null, "pageSize": null }, { "id": "1565620867201146891", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "2", "userNumber": 5, "pageNo": null, "pageSize": null }, { "id": "1565620867201146892", "placeId": "1523951236107988992", "projectName": "2022年中国联通活动策划执行及展览设计制作服务项目（勿动）", "realStartDate": null, "provinceDictId": "0022", "provinceDictName": "吉林省分公司", "placeName": "吉林联通评标中心", "status": "2", "userNumber": 5, "pageNo": null, "pageSize": null },]; setBidProjectData(data); } }) @@ -381,7 +477,8 @@ export default () => { const getExpertNumber = () => { getTodayExpert().then(res => { if (res?.code == 200) { - const data = res?.data; + // const data = res?.data; + const data = [{ "bidMethod": "公开招标", "number": randomData(), "signNumber": randomData() }, { "bidMethod": "邀请招标", "number": randomData(), "signNumber": randomData() }, { "bidMethod": "公开比选", "number": randomData(), "signNumber": randomData() }, { "bidMethod": "公开招募", "number": randomData(), "signNumber": randomData() }, { "bidMethod": "竞争性谈判", "number": randomData(), "signNumber": randomData() }, { "bidMethod": "单一来源", "number": randomData(), "signNumber": randomData() }, { "bidMethod": "公开询价", "number": randomData(), "signNumber": randomData() }, { "bidMethod": "竞拍", "number": randomData(), "signNumber": randomData() }, { "bidMethod": "单一来源简化流程", "number": randomData(), "signNumber": randomData() }] let formatData = [['product', '专家人数', '专家签到数量'], ['招标项目', data[0].number + data[1].number, data[0].signNumber + data[1].signNumber]]; for (const ite of data) { if (method.includes(ite.bidMethod)) { @@ -396,7 +493,8 @@ export default () => { const getEvalApplData = (type: string) => { getApplicationData({ type }).then(res => { if (res?.code == 200) { - const data = res?.data; + // const data = res?.data; + const data = { "type": null, "reserveNumber": [{ "bidMethod": "公开招标", "number": "3" }, { "bidMethod": "邀请招标", "number": randomData() }, { "bidMethod": "公开比选", "number": randomData() }, { "bidMethod": "公开招募", "number": randomData() }, { "bidMethod": "竞争性谈判", "number": randomData() }, { "bidMethod": "单一来源", "number": randomData() }, { "bidMethod": "公开询价", "number": randomData() }, { "bidMethod": "竞拍", "number": randomData() }, { "bidMethod": "单一来源简化流程", "number": randomData() }], "ingNumber": [{ "bidMethod": "公开招标", "number": "1" }, { "bidMethod": "邀请招标", "number": randomData() }, { "bidMethod": "公开比选", "number": randomData() }, { "bidMethod": "公开招募", "number": randomData() }, { "bidMethod": "竞争性谈判", "number": randomData() }, { "bidMethod": "单一来源", "number": randomData() }, { "bidMethod": "公开询价", "number": randomData() }, { "bidMethod": "竞拍", "number": randomData() }, { "bidMethod": "单一来源简化流程", "number": randomData() }], "endNumber": [{ "bidMethod": "公开招标", "number": "1" }, { "bidMethod": "邀请招标", "number": randomData() }, { "bidMethod": "公开比选", "number": randomData() }, { "bidMethod": "公开招募", "number": "1" }, { "bidMethod": "竞争性谈判", "number": "1" }, { "bidMethod": "单一来源", "number": randomData() }, { "bidMethod": "公开询价", "number": randomData() }, { "bidMethod": "竞拍", "number": randomData() }, { "bidMethod": "单一来源简化流程", "number": randomData() }] }; let formatData = [['product', 'reserve', 'ing', 'end'], ['招标项目', String(Number(data.reserveNumber[0].number) + Number(data.reserveNumber[1].number)), String(Number(data.ingNumber[0].number) + Number(data.ingNumber[1].number)), String(Number(data.endNumber[0].number) + Number(data.endNumber[1].number))]]; let comp = ['公开比选']; let inqu = ['公开询价']; @@ -524,17 +622,34 @@ export default () => { 评标室监控 { - sampleData && <> -
-

项目名称：{sampleData?.projectName}

-

标段名称：{sampleData?.sectionName}

-

监控设备名称：{sampleData?.devicePageVOList[0].deviceName}

-

评标室名称：{sampleData?.areaName}省分：北京

-
-
- {cameraParams && } -
- + sampleData ? ( + <> +
+

项目名称：{sampleData?.projectName}

+

标段名称：{sampleData?.sectionName}

+

监控设备名称：{sampleData?.devicePageVOList[0].deviceName}

+

评标室名称：{sampleData?.areaName}省分：{proviceEnum[sampleData?.provinceDictId]}

+
+
+ {cameraParams && } +
+ + ) : ( + <> + +
+
+ +
+
+
+
+ +
+
+ + + ) } @@ -613,7 +728,7 @@ export default () => { />} - - + + ); };; diff --git a/src/pages/ElecEvaluation/MonitorScreen/Home/style.less b/src/pages/ElecEvaluation/MonitorScreen/Home/style.less index b9b5ed9..4d1414b 100644 --- a/src/pages/ElecEvaluation/MonitorScreen/Home/style.less +++ b/src/pages/ElecEvaluation/MonitorScreen/Home/style.less @@ -180,6 +180,29 @@ } } + .card-project-default { + height: calc(~"(100vh - 177px - 3rem) / 3"); + background-repeat: no-repeat; + background-size: 100% 100%; + border-bottom-left-radius: 2px; + border-bottom-right-radius: 2px; + display: flex; + justify-content: center; + align-items: center; + + &>img { + height: 40%; + } + } + + .card-default-01 { + background-image: url('@{screen-img-url}/default_pic01.jpg'); + } + + .card-default-02 { + background-image: url('@{screen-img-url}/default_pic02.jpg'); + } + .card-carema-c { height: calc(~"100% - 110px - 0.5rem"); width: 100%; @@ -287,7 +310,7 @@ .map-grand { position: absolute; - right: 4rem; + right: 6%; bottom: 2rem; .map-grand-title { @@ -327,7 +350,7 @@ .screen-table { margin-top: 0.5rem; - height: calc(100% - 36px - 0.5rem); + height: calc(100% - 40px - 0.5rem); overflow: hidden; .ant-table-container table>thead>tr:first-child th:first-child { diff --git a/src/pages/ElecEvaluation/MonitorScreen/MonitorRoom/index.tsx b/src/pages/ElecEvaluation/MonitorScreen/MonitorRoom/index.tsx index d8644f9..9c9cdce 100644 --- a/src/pages/ElecEvaluation/MonitorScreen/MonitorRoom/index.tsx +++ b/src/pages/ElecEvaluation/MonitorScreen/MonitorRoom/index.tsx @@ -342,15 +342,17 @@ export default () => { renderItem={item => (
onCardClick(item)}> -

- - {item.meetingName} -

-

项目名称：{item.projectName}

-

标段名称：{item.sectionName}

-

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

-

专家数量：{item.expertNumber}所属省份：{proviceEnum[item.provinceDictId]}

-

评标状态：{bidStatusMap[item.status]}{item.isAbnormal == "1" && 异常预警}

+
+

+ + {item.areaName} +

+

项目名称：{item.projectName}

+

标段名称：{item.sectionName}

+

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

+

专家数量：{item.expertNumber}所属省份：{proviceEnum[item.provinceDictId]}

+

评标状态：{bidStatusMap[item.status]}{item.isAbnormal == "1" && 异常预警}

+
)} diff --git a/src/pages/ElecEvaluation/MonitorScreen/MonitorRoom/style.less b/src/pages/ElecEvaluation/MonitorScreen/MonitorRoom/style.less index 076c751..c18ba1d 100644 --- a/src/pages/ElecEvaluation/MonitorScreen/MonitorRoom/style.less +++ b/src/pages/ElecEvaluation/MonitorScreen/MonitorRoom/style.less @@ -36,6 +36,10 @@ .ant-tooltip-arrow { display: none; } + + &>.ant-tooltip-content>.ant-tooltip-inner>p { + margin-bottom: 0; + } } .top-province-tag { @@ -189,7 +193,7 @@ border-radius: 4px; border: 1px solid #5c69a1; cursor: pointer; - padding: 1rem; + padding: 0 0.5rem; &:hover { border-color: #fff; @@ -215,16 +219,24 @@ justify-content: space-between; } - &>p { - font-size: 1rem; + &>div { + position: relative; + top: 50%; + transform: translateY(-50%); + } + + &>div>p { margin-bottom: 0.5rem; + color: #fff; + width: 100%; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; &:last-child { - margin-bottom: 0.25rem; + margin-bottom: 0; } - color: #fff; - .project-text { color: #2bddf4; } @@ -254,46 +266,140 @@ } } - @media screen and (max-height:1080px) { + @media screen and (min-height:1440px) { .list-card { - height: 36vh; - max-height: 36vh; - padding: 1rem 1.2rem; + height: 41vh; + max-height: 41vh; + padding: 0 2rem; .list-card-title { - font-size: 1.4rem; - line-height: 1.4rem; + font-size: 1.8rem; + line-height: 1.9rem; &>img { - height: 1.4rem; + height: 1.8rem; } } - &>p { - font-size: 1.1rem; - margin-bottom: 1.625rem; + &>div>p { + font-size: 1.6rem; + line-height: 1.7rem; + margin-bottom: 3.3rem; } } } - @media screen and (max-height:900px) { + @media screen and (max-height:1440px) { .list-card { - height: 32vh; - max-height: 32vh; - padding: 1rem; + height: 40vh; + max-height: 40vh; + padding: 0 2rem; .list-card-title { - font-size: 1.2rem; - line-height: 1.2rem; + font-size: 1.8rem; + line-height: 1.9rem; &>img { - height: 1.2rem; + height: 1.8rem; } } - &>p { + &>div>p { + font-size: 1.6rem; + line-height: 1.7rem; + margin-bottom: 3.3rem; + } + } + } + + @media screen and (max-height:1260px) { + .list-card { + height: 38vh; + max-height: 38vh; + padding: 0 1.8rem; + + .list-card-title { + font-size: 1.6rem; + line-height: 1.7rem; + + &>img { + height: 1.6rem; + } + } + + &>div>p { + font-size: 1.4rem; + line-height: 1.5rem; + margin-bottom: 2.8rem; + } + } + } + + @media screen and (max-height:1080px) { + .list-card { + height: 36vh; + max-height: 36vh; + padding: 0 1.4rem; + + .list-card-title { + font-size: 1.4rem; + line-height: 1.45rem; + + &>img { + height: 1.3rem; + } + } + + &>div>p { + font-size: 1.2rem; + line-height: 1.3rem; + margin-bottom: 2.1rem; + } + } + } + + @media screen and (max-height:900px) and (min-height:720px) { + .list-card { + height: 32vh; + max-height: 32vh; + padding: 0 1rem; + + .list-card-title { + font-size: 1.1rem; + line-height: 1.15rem; + + &>img { + height: 1.1rem; + } + } + + &>div>p { font-size: 1rem; - margin-bottom: 0.5rem; + line-height: 1.05rem; + margin-bottom: 1.3rem; + } + } + } + + @media screen and (max-height:720px) { + .list-card { + height: 30vh; + max-height: 30vh; + padding: 0 0.8rem; + + .list-card-title { + font-size: 1rem; + line-height: 1.05rem; + + &>img { + height: 1rem; + } + } + + &>div>p { + font-size: 0.875rem; + line-height: 0.925rem; + margin-bottom: 0.8rem; } } } diff --git a/src/pages/ElecEvaluation/MonitorScreen/ProjectMonitorRoom/index.tsx b/src/pages/ElecEvaluation/MonitorScreen/ProjectMonitorRoom/index.tsx index 5aad2b2..8287c43 100644 --- a/src/pages/ElecEvaluation/MonitorScreen/ProjectMonitorRoom/index.tsx +++ b/src/pages/ElecEvaluation/MonitorScreen/ProjectMonitorRoom/index.tsx @@ -64,7 +64,7 @@ const backPeopleNumColumns: any[] = [ ellipsis: true, onCell, onHeaderCell, - render: (_: any, record: any) => `${record.details[0].thresholdOfPeople}人`, + render: (_: any, record: any) => `${record.details?.[0].thresholdOfPeople}人`, }, { title: '实际人数', @@ -73,7 +73,7 @@ const backPeopleNumColumns: any[] = [ align: 'center', onCell, onHeaderCell, - render: (_: any, record: any) => `${record.details[0].realOfPeople}人`, + render: (_: any, record: any) => `${record.details?.[0].realOfPeople}人`, }, ]; @@ -154,7 +154,7 @@ export default (props: any) => { for (const ite of data.userNumberList) { if (ite.userType == "manager") {//项目经理 data["manager"] = ite.userNumber; - } else if (ite.userType == "purchase_expert") {//专家-招标人代表 + } else if (ite.userType == "purchaseExpert") {//专家-招标人代表 data["purchaseExpert"] = ite.userNumber; } else if (ite.userType == "expert") {//专家 data["expert"] = ite.userNumber; @@ -313,7 +313,7 @@ export default (props: any) => {
供应商名称（{basicInfo?.supplierLength}）： - {basicInfo?.sectionPayerList?.map((item: any) =>

{item.sectionName}（{item.payerNumber}）：{item.payerNames.join("、")}

)}} visible={visible} color="rgba(4,20,47,0.85)" overlayInnerStyle={{ width: '250%' }} overlayClassName="screen-tag"> + {basicInfo?.sectionPayerList?.map((item: any) =>

{item.sectionName}（{item.payerNumber}）：{item.payerNames.join("、")}

)}} visible={visible} color="rgba(4,20,47,0.85)" overlayInnerStyle={{ width: '250%' }} overlayClassName="screen-tag"> {basicInfo?.sectionPayerList?.[0]?.payerNames.slice(0, 5).join("、")} setVisible(true)} onMouseLeave={() => setVisible(false)}>全部
@@ -350,7 +350,7 @@ export default (props: any) => {

时间：{item.createDate}

- +
)) @@ -361,7 +361,7 @@ export default (props: any) => {

描述：{item.describeStranger}

- +
))} @@ -372,7 +372,7 @@ export default (props: any) => { className="screen-table" rowKey="id" size="small" - dataSource={basicInfo?.status == "2" ? backNumberList?.[0].details : earlyWarnData?.numberDetails} + dataSource={basicInfo?.status == "2" ? backNumberList : earlyWarnData?.numberDetails} columns={basicInfo?.status == "2" ? backPeopleNumColumns : peopleNumColumns} /> ) : ( diff --git a/src/pages/ElecEvaluation/MonitorScreen/ProjectMonitorRoom/style.less b/src/pages/ElecEvaluation/MonitorScreen/ProjectMonitorRoom/style.less index 986f451..ead7d07 100644 --- a/src/pages/ElecEvaluation/MonitorScreen/ProjectMonitorRoom/style.less +++ b/src/pages/ElecEvaluation/MonitorScreen/ProjectMonitorRoom/style.less @@ -95,15 +95,39 @@ } } + @media screen and (min-height:1440px) { + + .left-monitor, + .right-warn-list { + height: 84vh; + } + } + + @media screen and (max-height:1440px) { + + .left-monitor, + .right-warn-list { + height: 83vh; + } + } + + @media screen and (max-height:1260px) { + + .left-monitor, + .right-warn-list { + height: 80.2vh; + } + } + @media screen and (max-height:1080px) { .left-monitor, .right-warn-list { - height: 77vh; + height: 76vh; } } - @media screen and (max-height:900px) { + @media screen and (max-height:900px) and (min-height:720px) { .left-monitor, .right-warn-list { @@ -111,6 +135,14 @@ } } + @media screen and (max-height:720px) { + + .left-monitor, + .right-warn-list { + height: 66vh; + } + } + .left-monitor { border: 1px solid #fff; margin-right: 4px; diff --git a/src/pages/Evaluation/BidControl/BidControlManager/components/ViewEvalAlarmUpdateModal.tsx b/src/pages/Evaluation/BidControl/BidControlManager/components/ViewEvalAlarmUpdateModal.tsx index 098a3f4..730559a 100644 --- a/src/pages/Evaluation/BidControl/BidControlManager/components/ViewEvalAlarmUpdateModal.tsx +++ b/src/pages/Evaluation/BidControl/BidControlManager/components/ViewEvalAlarmUpdateModal.tsx @@ -1,55 +1,57 @@ -import React, { useEffect,useState } from 'react'; -import { Tabs,Collapse,Form, Input, Modal,Col,Row,Divider, Table, Button, Empty ,message,Spin,Card,} from 'antd'; -import {saveUpdateEvalRoom} from '../service'; -import {} from '@/utils/CommonUtils' +import React, { useEffect, useState } from 'react'; +import { Tabs, Collapse, Form, Input, Modal, Col, Row, Divider, Table, Button, Empty, message, Spin, Card, } from 'antd'; +import { saveUpdateEvalRoom } from '../service'; +import { } from '@/utils/CommonUtils' import ProTable, { ProColumns } from "@ant-design/pro-table"; import { getProMethod, getRoomId, getSessionRoleData } from '@/utils/session'; import ExtendUpload from "@/utils/ExtendUpload"; +import ScreenWarnBack from '@/components/ElecBidEvaluation/ScreenWarnBack'; interface alarmDataObj { - tilte:string;//标题 - id:string;//告警id - reserveId:string;//预约id - tpName:string;//项目名称 - tpNumber:string;//项目编号 - bsName:string;//标段名称 - placeName:string; //评标室名称 - startDate:string; //开始时间 - endDate:string; //结束时间 - status:string;//处理状态：0未处理；1已处理', - roomStatus:string;//评标室状态 0-未开启 1-进行中 2-已结束 - pNumber:string;//人数信息 - remark:string;//处理说明 - attachment:string;//附件id + tilte: string;//标题 + id: string;//告警id + reserveId: string;//预约id + tpName: string;//项目名称 + tpNumber: string;//项目编号 + bsName: string;//标段名称 + placeName: string; //评标室名称 + startDate: string; //开始时间 + endDate: string; //结束时间 + status: string;//处理状态：0未处理；1已处理', + roomStatus: string;//评标室状态 0-未开启 1-进行中 2-已结束 + pNumber: string;//人数信息 + remark: string;//处理说明 + attachment: string;//附件id } interface ViewEvalAlarmUpdateModalProps { alarmData: alarmDataObj; - detail:boolean; - isLookType:boolean; - onCancel:any; - onOk:any; + detail: boolean; + isLookType: boolean; + onCancel: any; + onOk: any; } const ViewEvalAlarmUpdateModal: React.FC = (props) => { - - const {alarmData,detail,isLookType,onCancel,onOk}= props; - + + const { alarmData, detail, isLookType, onCancel, onOk } = props; + const { TextArea } = Input;//文本域 const [orderSpin, orderSpinSet] = useState(false);//订单页加载中 const [uploadProps, setUploadProps] = useState(false); + const [detailModalVisible, setDetailModalVisible] = useState(false);//详情弹窗 const [form] = Form.useForm(); var roleId = getSessionRoleData().roleCode; useEffect(() => { - setUploadProps(alarmData.status=="1"||isLookType); - },[]) + setUploadProps(alarmData.status == "1" || isLookType); + }, []) - const saveUpdate = async () =>{ + const saveUpdate = async () => { orderSpinSet(true); form.validateFields().then(res => { - console.log( form.getFieldValue("remark")); + console.log(form.getFieldValue("remark")); const fromData = { id: alarmData.id, remark: form.getFieldValue("remark"), @@ -70,15 +72,15 @@ const ViewEvalAlarmUpdateModal: React.FC = (props } //0-未开启 1-进行中 2-已结束 - function getStautsValue(key:any){ + function getStautsValue(key: any) { let val = ""; //setUploadProps(false); - if(key=="0"){ + if (key == "0") { val = "未开启" - }else if(key=="1"){ + } else if (key == "1") { val = "正在评标" //setUploadProps(true); - }else if(key=="2"){ + } else if (key == "2") { val = "已结束" } return val; @@ -90,9 +92,9 @@ const ViewEvalAlarmUpdateModal: React.FC = (props visible={detail} width={"1000px"} centered - title={"异常信息:"+alarmData.tilte}//+alarmData.tilte + title={"异常信息:" + alarmData.tilte}//+alarmData.tilte onCancel={() => { onCancel(); }} - onOk={() => {onOk();}} + onOk={() => { onOk(); }} bodyStyle={{ maxHeight: "500px", overflow: "auto", zIndex: 1 }} footer={[ {getStautsValue(alarmData.roomStatus)} - {(alarmData.pNumber)} - 详情 + setDetailModalVisible(true)}>详情 - {isLookType?alarmData.remark: -