diff --git a/src/assets/monitor/background-2.jpg b/src/assets/monitor/background-2.jpg
new file mode 100644
index 0000000..2522a8c
Binary files /dev/null and b/src/assets/monitor/background-2.jpg differ
diff --git a/src/assets/monitor/background-3.gif b/src/assets/monitor/background-3.gif
new file mode 100644
index 0000000..c63bf6f
Binary files /dev/null and b/src/assets/monitor/background-3.gif differ
diff --git a/src/pages/ElecEvaluation/Monitor/Exception/index.tsx b/src/pages/ElecEvaluation/Monitor/Exception/index.tsx
index 356e943..1422af5 100644
--- a/src/pages/ElecEvaluation/Monitor/Exception/index.tsx
+++ b/src/pages/ElecEvaluation/Monitor/Exception/index.tsx
@@ -1,131 +1,20 @@
 import { Col, Row } from 'antd';
 import React, { useEffect, useRef, useState } from 'react';
 import '../style.less'
-import { authCheck, onCell, onHeaderCell, OverviewItem, ScreenLabel, ScreenTitle, ScrollTable } from '../Home';
+import { authCheck, ModalList, onCell, onHeaderCell, OverviewItem, ScreenLabel, ScreenTitle, ScrollTable } from '../Home';
 import Circle3199 from '@/assets/monitor/circle-3199.png';
-import { getDecryptDataAPI, getNoOpenAssessListAPI, getNoOpenListAPI, getNoOpenNumberAPI, getThreeDayNoEndAPI, getThreeDaysUnSendAnnoCountAPI, getThreeDaysUnSendAnnoListAPI } from '../service';
-
-const columns: any[] = [
-    {
-        title: '序号',
-        align: 'center',
-        width: '10%',
-        onCell,
-        onHeaderCell,
-        render: (_: any, record: any, index: any) => index + 1,
-    },
-    {
-        title: '省分',
-        dataIndex: 'provinceName',
-        key: 'provinceName',
-        width: '15%',
-        ellipsis: true,
-        onCell,
-        onHeaderCell,
-        // render: (_: any, record: any) => proviceEnum[record.provinceDictId],
-    },
-    {
-        title: '项目名称',
-        dataIndex: 'projectName',
-        key: 'projectName',
-        ellipsis: true,
-        width: '20%',
-        onCell,
-        onHeaderCell,
-    },
-    {
-        title: '预算金额',
-        dataIndex: 'budgetAmount',
-        key: 'budgetAmount',
-        width: '20%',
-        onCell,
-        onHeaderCell,
-    },
-    {
-        title: '采购经理',
-        dataIndex: 'ownerContactName',
-        key: 'ownerContactName',
-        width: '15%',
-        onCell,
-        onHeaderCell,
-    },
-    {
-        title: '查看',
-        width: '20%',
-        onCell,
-        onHeaderCell,
-        render: (_: any, record: any) => {
-            return (
-                <a onClick={() => { }} style={{ color: "#fff" }}>查看</a>
-            )
-        },
-    },
-];
-
-const columnsSecond: any[] = [
-    {
-        title: '序号',
-        align: 'center',
-        width: '10%',
-        onCell,
-        onHeaderCell,
-        render: (_: any, record: any, index: any) => index + 1,
-    },
-    {
-        title: '省分',
-        dataIndex: 'regionDictName',
-        key: 'regionDictName',
-        width: '15%',
-        ellipsis: true,
-        onCell,
-        onHeaderCell,
-        // render: (_: any, record: any) => proviceEnum[record.provinceDictId],
-    },
-    {
-        title: '项目名称',
-        dataIndex: 'projectName',
-        key: 'projectName',
-        ellipsis: true,
-        width: '20%',
-        onCell,
-        onHeaderCell,
-    },
-    {
-        title: '预算金额',
-        dataIndex: 'budgetAmount',
-        key: 'budgetAmount',
-        width: '20%',
-        onCell,
-        onHeaderCell,
-    },
-    {
-        title: '采购经理',
-        dataIndex: 'ownerContactName',
-        key: 'ownerContactName',
-        width: '15%',
-        onCell,
-        onHeaderCell,
-    },
-    {
-        title: '查看',
-        width: '20%',
-        onCell,
-        onHeaderCell,
-        render: (_: any, record: any) => {
-            return (
-                <a onClick={() => { }} style={{ color: "#fff" }}>查看</a>
-            )
-        },
-    },
-];
+import { getDecryptDataAPI, getNoOpenAssessListAPI, getNoOpenListAPI, getNoOpenNumberAPI, getThreeDayNoEndAPI, getThreeDayNoEndCountAPI, getThreeDaysUnSendAnnoCountAPI, getThreeDaysUnSendAnnoListAPI } from '../service';
+import { isNotEmpty } from '@/utils/CommonUtils';
 
 const MonitorException: React.FC<{}> = () => {
     //超过1小时未开标数量
     const [noOpenNumberData, setNoOpenNumberData] = useState<string>("");
     //开启评审后3日未结束评标-列表
     const [threeDayNoEndData, setThreeDayNoEndData] = useState<any[]>([]);
+    //开启评审后3日未结束评标-数量
+    const [threeDayNoEndCount, setThreeDayNoEndCount] = useState<any>(0);
     //超过1小时未开标数量-列表
-    const [noOpenListData, setNoOpenListData] = useState<any>();
+    const [noOpenListData, setNoOpenListData] = useState<any[]>([]);
     //开标后超过6小时未开启评审室-列表
     const [noOpenAssessListData, setNoOpenAssessListData] = useState<any>();
     //异常监控-解密异常、mac地址相同及相关项目列表
@@ -134,11 +23,17 @@ const MonitorException: React.FC<{}> = () => {
     const [threeDaysUnSendAnnoCount, setThreeDaysUnSendAnnoCount] = useState<string>("");
     //评审室关闭3日内未发布公示列表
     const [threeDaysUnSendAnnoList, setThreeDaysUnSendAnnoList] = useState<any[]>([]);
+    //ModalList visible
+    const [modalListVisible, setModalListVisible] = useState<boolean>(false);
+    //ModalList Data
+    const [modalListData, setModalListData] = useState<any[]>([]);
+    //ModalList Type
+    const [exceptionType, setExceptionType] = useState<any>();
     //权限校验
     const auth = useRef<boolean>(authCheck());
     //超过1小时未开标数量
     const getNoOpenNumber = () => {
-        getNoOpenNumberAPI().then(res => {
+        getNoOpenNumberAPI({ "timeLimit": "1", "dayNumber": "30" }).then(res => {
             if (res?.code == 200) {
                 setNoOpenNumberData(res?.data);
             }
@@ -152,17 +47,17 @@ const MonitorException: React.FC<{}> = () => {
             }
         })
     }
-    //开启评审后3日未结束评标
+    //超过1小时未开标数量-列表
     const getNoOpenList = () => {
-        getNoOpenListAPI({ pageNo: 1, pageSize: 10 }).then(res => {
+        getNoOpenListAPI({ "timeLimit": "1", "dayNumber": "30" }).then(res => {
             if (res?.code == 200) {
-                setNoOpenListData(res?.data);
+                setNoOpenListData(res?.data?.records);
             }
         })
     }
     //开标后超过6小时未开启评审室-列表
     const getNoOpenAssessList = () => {
-        getNoOpenAssessListAPI({ pageNo: 1, pageSize: 10 }).then(res => {
+        getNoOpenAssessListAPI({ pageNo: 1, pageSize: 100 }).then(res => {
             if (res?.code == 200) {
                 setNoOpenAssessListData(res?.data);
             }
@@ -194,6 +89,15 @@ const MonitorException: React.FC<{}> = () => {
             }
         })
     }
+
+    //异常监控-评审室关闭3日内未发布公示列表
+    const getThreeDayNoEndCount = () => {
+        getThreeDayNoEndCountAPI().then(res => {
+            if (res?.code == 200) {
+                setThreeDayNoEndCount(res?.data);
+            }
+        })
+    }
     useEffect(() => {
         if (auth.current) {
             getNoOpenNumber();
@@ -203,8 +107,324 @@ const MonitorException: React.FC<{}> = () => {
             getDecryptData();
             getThreeDaysUnSendAnnoCount();
             getThreeDaysUnSendAnnoList();
+            getThreeDayNoEndCount();
         }
     }, [])
+
+    const columns: any[] = [
+        {
+            title: '序号',
+            align: 'center',
+            width: '10%',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any, index: any) => index + 1,
+        },
+        {
+            title: '省分',
+            dataIndex: 'provinceName',
+            key: 'provinceName',
+            align: 'center',
+            width: '15%',
+            ellipsis: true,
+            onCell,
+            onHeaderCell,
+            // render: (_: any, record: any) => proviceEnum[record.provinceDictId],
+        },
+        {
+            title: '项目名称',
+            dataIndex: 'projectName',
+            key: 'projectName',
+            align: 'center',
+            ellipsis: true,
+            width: '30%',
+            onCell,
+            onHeaderCell,
+        },
+        {
+            title: '预算金额',
+            dataIndex: 'budgetAmount',
+            key: 'budgetAmount',
+            align: 'center',
+            width: '20%',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any) => isNotEmpty(record.budgetAmount) ? Number(record.budgetAmount).toFixed(2) : 0,
+        },
+        {
+            title: '采购经理',
+            dataIndex: 'ownerContactName',
+            key: 'ownerContactName',
+            align: 'center',
+            width: '15%',
+            onCell,
+            onHeaderCell,
+        },
+        {
+            title: '查看',
+            width: '10%',
+            align: 'center',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any) => {
+                return (
+                    <a onClick={() => { setExceptionType(null); setModalListData([record]); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#fff" }}>查看</a>
+                )
+            },
+        },
+    ];
+
+    const columnsSecond: any[] = [
+        {
+            title: '序号',
+            align: 'center',
+            width: '10%',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any, index: any) => index + 1,
+        },
+        {
+            title: '省分',
+            dataIndex: 'regionDictName',
+            key: 'regionDictName',
+            align: 'center',
+            width: '15%',
+            ellipsis: true,
+            onCell,
+            onHeaderCell,
+            // render: (_: any, record: any) => proviceEnum[record.provinceDictId],
+        },
+        {
+            title: '项目名称',
+            dataIndex: 'projectName',
+            key: 'projectName',
+            align: 'center',
+            ellipsis: true,
+            width: '30%',
+            onCell,
+            onHeaderCell,
+        },
+        {
+            title: '预算金额',
+            dataIndex: 'budgetAmount',
+            key: 'budgetAmount',
+            align: 'center',
+            width: '20%',
+            onCell,
+            onHeaderCell,
+            // render: (_: any, record: any) => isNotEmpty(record.budgetAmount) ? record.budgetAmount.toFixed(2) : 0,
+        },
+        {
+            title: '采购经理',
+            dataIndex: 'ownerContactName',
+            key: 'ownerContactName',
+            align: 'center',
+            width: '15%',
+            onCell,
+            onHeaderCell,
+        },
+        {
+            title: '查看',
+            width: '10%',
+            align: 'center',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any) => {
+                return (
+                    <a onClick={() => { setExceptionType("解密异常"); setModalListData([record]); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#fff" }}>查看</a>
+                )
+            },
+        },
+    ];
+
+    const columnsThird: any[] = [
+        {
+            title: '序号',
+            align: 'center',
+            width: '10%',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any, index: any) => index + 1,
+        },
+        {
+            title: '省分',
+            dataIndex: 'provinceName',
+            key: 'provinceName',
+            align: 'center',
+            width: '15%',
+            ellipsis: true,
+            onCell,
+            onHeaderCell,
+            // render: (_: any, record: any) => proviceEnum[record.provinceDictId],
+        },
+        {
+            title: '项目名称',
+            dataIndex: 'projectName',
+            key: 'projectName',
+            align: 'center',
+            ellipsis: true,
+            width: '30%',
+            onCell,
+            onHeaderCell,
+        },
+        {
+            title: '预算金额',
+            dataIndex: 'bidSectContractPrice',
+            key: 'bidSectContractPrice',
+            align: 'center',
+            width: '20%',
+            onCell,
+            onHeaderCell,
+            // render: (_: any, record: any) => isNotEmpty(record.bidSectContractPrice) ? record.bidSectContractPrice.toFixed(2) : 0,
+        },
+        {
+            title: '采购经理',
+            dataIndex: 'ownerContactName',
+            key: 'ownerContactName',
+            align: 'center',
+            width: '15%',
+            onCell,
+            onHeaderCell,
+        },
+        {
+            title: '查看',
+            width: '10%',
+            align: 'center',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any) => {
+                return (
+                    <a onClick={() => { setExceptionType("评标结束后3日内未发布公示"); setModalListData([record]); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#fff" }}>查看</a>
+                )
+            },
+        },
+    ];
+
+    const columnsForth: any[] = [
+        {
+            title: '序号',
+            align: 'center',
+            width: '10%',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any, index: any) => index + 1,
+        },
+        {
+            title: '省分',
+            dataIndex: 'provinceName',
+            key: 'provinceName',
+            align: 'center',
+            width: '15%',
+            ellipsis: true,
+            onCell,
+            onHeaderCell,
+            // render: (_: any, record: any) => proviceEnum[record.provinceDictId],
+        },
+        {
+            title: '项目名称',
+            dataIndex: 'projectName',
+            key: 'projectName',
+            align: 'center',
+            ellipsis: true,
+            width: '30%',
+            onCell,
+            onHeaderCell,
+        },
+        {
+            title: '预算金额',
+            dataIndex: 'budgetAmount',
+            key: 'budgetAmount',
+            align: 'center',
+            width: '20%',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any) => isNotEmpty(record.budgetAmount) ? Number(record.budgetAmount).toFixed(2) : 0,
+        },
+        {
+            title: '采购经理',
+            dataIndex: 'ownerContactName',
+            key: 'ownerContactName',
+            align: 'center',
+            width: '15%',
+            onCell,
+            onHeaderCell,
+        },
+        {
+            title: '查看',
+            width: '10%',
+            align: 'center',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any) => {
+                return (
+                    <a onClick={() => { setExceptionType("开启评审后3日未结束评标"); setModalListData([record]); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#fff" }}>查看</a>
+                )
+            },
+        },
+    ];
+
+    const columnsFifth: any[] = [
+        {
+            title: '序号',
+            align: 'center',
+            width: '10%',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any, index: any) => index + 1,
+        },
+        {
+            title: '省分',
+            dataIndex: 'regionDictName',
+            key: 'regionDictName',
+            align: 'center',
+            width: '15%',
+            ellipsis: true,
+            onCell,
+            onHeaderCell,
+            // render: (_: any, record: any) => proviceEnum[record.provinceDictId],
+        },
+        {
+            title: '项目名称',
+            dataIndex: 'projectName',
+            key: 'projectName',
+            align: 'center',
+            ellipsis: true,
+            width: '30%',
+            onCell,
+            onHeaderCell,
+        },
+        {
+            title: '预算金额',
+            dataIndex: 'budgetAmount',
+            key: 'budgetAmount',
+            align: 'center',
+            width: '20%',
+            onCell,
+            onHeaderCell,
+            // render: (_: any, record: any) => isNotEmpty(record.budgetAmount) ? record.budgetAmount.toFixed(2) : 0,
+        },
+        {
+            title: '采购经理',
+            dataIndex: 'ownerContactName',
+            key: 'ownerContactName',
+            align: 'center',
+            width: '15%',
+            onCell,
+            onHeaderCell,
+        },
+        {
+            title: '查看',
+            width: '10%',
+            align: 'center',
+            onCell,
+            onHeaderCell,
+            render: (_: any, record: any) => {
+                return (
+                    <a onClick={() => { setExceptionType("MAC地址重复"); setModalListData([record]); setModalListVisible(true); }} className='monitor-extra-pointer' style={{ color: "#fff" }}>查看</a>
+                )
+            },
+        },
+    ];
     return (
         <ScreenTitle title="异常监控">
             <div className="top-main">
@@ -213,19 +433,19 @@ const MonitorException: React.FC<{}> = () => {
                     <OverviewItem icon={Circle3199} title="解密异常" number={decryptData?.decryptExceptionCount} unit="次" />
                     <OverviewItem icon={Circle3199} title="MAC地址相同" number={decryptData?.macSameCount} unit="个" />
                     <OverviewItem icon={Circle3199} title="开标后6小时未开启评审" number={noOpenAssessListData?.length} unit="个" />
-                    <OverviewItem icon={Circle3199} title="开启评审后3日未结束评标" number={threeDayNoEndData?.length} unit="个" />
+                    <OverviewItem icon={Circle3199} title="开启评审后3日未结束评标" number={threeDayNoEndCount} unit="个" />
                     <OverviewItem icon={Circle3199} title="评标结束3日未公示" number={threeDaysUnSendAnnoCount} unit="个" />
-                    <OverviewItem icon={Circle3199} title="重新评标次数" number={62520} unit="次" />
+                    {/* <OverviewItem icon={Circle3199} title="重新评标次数" number={62520} unit="次" /> */}
                 </div>
             </div>
             <Row>
                 <Col span={8}>
                     <div className="monitor-left-main">
-                        <ScreenLabel title="1小时未开标项目列表" extra={<span>more</span>} />
+                        <ScreenLabel title="1小时未开标项目列表" extra={<span className='monitor-extra-pointer' onClick={() => { setExceptionType(null); setModalListData(noOpenListData); setModalListVisible(true); }}>more</span>} />
                         <div className="monitor-exception-card">
-                            <ScrollTable dataSource={noOpenListData?.records} columns={columns} ynum={266} />
+                            <ScrollTable dataSource={noOpenListData} columns={columns} ynum={266} />
                         </div>
-                        <ScreenLabel title="开标后六小时未开启评审" extra={<span>more</span>} />
+                        <ScreenLabel title="开标后六小时未开启评审" extra={<span className='monitor-extra-pointer' onClick={() => { setExceptionType(null); setModalListData(noOpenAssessListData); setModalListVisible(true); }}>more</span>} />
                         <div className="monitor-exception-card">
                             <ScrollTable dataSource={noOpenAssessListData} columns={columns} ynum={266} />
                         </div>
@@ -233,29 +453,30 @@ const MonitorException: React.FC<{}> = () => {
                 </Col>
                 <Col span={8}>
                     <div className="monitor-center-main">
-                        <ScreenLabel title="解密异常项目列表" extra={<span>more</span>} />
+                        <ScreenLabel title="解密异常项目列表" extra={<span className='monitor-extra-pointer' onClick={() => { setExceptionType("解密异常"); setModalListData(decryptData?.decryptExceptionList); setModalListVisible(true); }}>more</span>} />
                         <div className="monitor-exception-card">
                             <ScrollTable dataSource={decryptData?.decryptExceptionList} columns={columnsSecond} ynum={266} />
                         </div>
-                        <ScreenLabel title="开启评审后3日未结束评标" extra={<span>more</span>} />
+                        <ScreenLabel title="开启评审后3日未结束评标" extra={<span className='monitor-extra-pointer' onClick={() => { setExceptionType("开启评审后3日未结束评标"); setModalListData(threeDayNoEndData); setModalListVisible(true); }}>more</span>} />
                         <div className="monitor-exception-card">
-                            <ScrollTable dataSource={threeDayNoEndData} columns={columns} ynum={266} />
+                            <ScrollTable dataSource={threeDayNoEndData} columns={columnsForth} ynum={266} />
                         </div>
                     </div>
                 </Col>
                 <Col span={8}>
                     <div className="monitor-right-main">
-                        <ScreenLabel title="MAC地址重复项目列表" extra={<span>more</span>} />
+                        <ScreenLabel title="MAC地址重复项目列表" extra={<span className='monitor-extra-pointer' onClick={() => { setExceptionType("MAC地址重复"); setModalListData(decryptData?.macSameList); setModalListVisible(true); }}>more</span>} />
                         <div className="monitor-exception-card">
-                            <ScrollTable dataSource={decryptData?.macSameList} columns={columnsSecond} ynum={266} />
+                            <ScrollTable dataSource={decryptData?.macSameList} columns={columnsFifth} ynum={266} />
                         </div>
-                        <ScreenLabel title="评标结束后3日内未发布公示" extra={<span>more</span>} />
+                        <ScreenLabel title="评标结束后3日内未发布公示" extra={<span className='monitor-extra-pointer' onClick={() => { setExceptionType("评标结束后3日内未发布公示"); setModalListData(threeDaysUnSendAnnoList); setModalListVisible(true); }}>more</span>} />
                         <div className="monitor-exception-card">
-                            <ScrollTable dataSource={threeDaysUnSendAnnoList} columns={columnsSecond} ynum={266} />
+                            <ScrollTable dataSource={threeDaysUnSendAnnoList} columns={columnsThird} ynum={266} />
                         </div>
                     </div>
                 </Col>
             </Row>
+            <ModalList modalVisible={modalListVisible} onCancel={() => { setModalListVisible(false); setModalListData([]); }} exceptionData={modalListData} exceptionType={exceptionType} />
         </ScreenTitle>
     );
 };
diff --git a/src/pages/ElecEvaluation/Monitor/Home/index.tsx b/src/pages/ElecEvaluation/Monitor/Home/index.tsx
index a5a1ac8..0e9fc00 100644
--- a/src/pages/ElecEvaluation/Monitor/Home/index.tsx
+++ b/src/pages/ElecEvaluation/Monitor/Home/index.tsx
@@ -1,4 +1,4 @@
-import { Col, Dropdown, Menu, Progress, Row, Space, Table } from 'antd';
+import { Button, Col, Descriptions, Divider, Dropdown, Empty, Menu, message, Modal, Progress, Row, Space, Table } from 'antd';
 import { debounce } from 'lodash';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import '../style.less'
@@ -14,7 +14,7 @@ import right from '@/assets/monitor/right.png';
 import { CaretRightOutlined, DownOutlined } from '@ant-design/icons';
 import './china';
 import * as echarts from 'echarts';
-import { getActiveSupplierAPI, getAnnoCountAPI, getAnnualAndTenderAgentAPI, getExpertNumberAPI, getOpeningListAPI, getReviewDistributionAPI, getSupplierCountAPI, getTodayOpeningAPI } from '../service';
+import { getActiveSupplierAPI, getAnnoCountAPI, getAnnualAndTenderAgentAPI, getExpertNumberAPI, getMonitorListAPI, getOpeningListAPI, getReviewDistributionAPI, getSupplierCountAPI, getTodayOpeningAPI } from '../service';
 import moment from 'moment';
 import { isNotEmpty } from '@/utils/CommonUtils';
 import { getSessionUserData } from '@/utils/session';
@@ -58,55 +58,52 @@ export const proviceEnum = {
 }
 function dealWithData(mapd: any[]) {
     let geoCoordMap = {
-        长春: [125.35, 43.88],
-        沈阳: [123.38, 41.8],
-        集团: [116.26, 39.92],
+        吉林: [125.35, 43.88],
+        辽宁: [123.38, 41.8],
+        总部: [116.26, 39.92],
         北京: [116.46, 39.92],
-        哈尔滨: [126.63, 45.75],
-        石家庄: [114.48, 38.03],
+        黑龙江: [126.63, 45.75],
+        河北: [114.48, 38.03],
         天津: [117.2, 39.13],
         重庆: [106.54, 29.59],
-        拉萨: [91.11, 29.97],
+        西藏: [91.11, 29.97],
         上海: [121.48, 31.22],
-        福州: [119.3, 26.08],
-        南宁: [108.33, 22.84],
-        广州: [113.23, 23.16],
-        太原: [112.53, 37.87],
-        昆明: [102.73, 25.04],
-        海口: [110.35, 20.02],
-        银川: [106.27, 38.47],
-        西宁: [101.74, 36.56],
-        呼和浩特: [111.65, 40.82],
-        成都: [104.06, 30.67],
-        西安: [108.95, 34.27],
-        南京: [118.78, 32.04],
-        贵阳: [106.71, 26.57],
-        乌鲁木齐: [87.68, 43.77],
-        杭州: [120.19, 30.26],
-        济南: [117, 36.65],
-        兰州: [103.73, 36.03],
-        郑州: [113.65, 34.76],
-        长沙: [113, 28.21],
-        合肥: [117.27, 31.86],
-        武汉: [114.31, 30.52],
+        福建: [119.3, 26.08],
+        广西: [108.33, 22.84],
+        广东: [113.23, 23.16],
+        山西: [112.53, 37.87],
+        云南: [102.73, 25.04],
+        海南: [110.35, 20.02],
+        宁夏: [106.27, 38.47],
+        青海: [101.74, 36.56],
+        内蒙古: [111.65, 40.82],
+        四川: [104.06, 30.67],
+        陕西: [108.95, 34.27],
+        江苏: [118.78, 32.04],
+        贵州: [106.71, 26.57],
+        新疆: [87.68, 43.77],
+        浙江: [120.19, 30.26],
+        山东: [117, 36.65],
+        甘肃: [103.73, 36.03],
+        河南: [113.65, 34.76],
+        湖南: [113, 28.21],
+        安徽: [117.27, 31.86],
+        湖北: [114.31, 30.52],
+        江西: [115.864528, 28.687675]
     };
     let data = [];
     for (let key in geoCoordMap) {
-        // for (let i = 0, length = mapd.length; i < length; i++) {
-        //     const ele = mapd[i];
-        //     if (ele.provincesName == key) {
-        // geoCoordMap[key].push(Number(ele.allNumber));
-        // geoCoordMap[key].push(Number(ele.opeingNumber));
-        // geoCoordMap[key].push(Number(ele.assessNumber));
-        //         break;
-        //     }
-        // }
-        geoCoordMap[key].push(Number("0"));
-        geoCoordMap[key].push(Number("0"));
-        geoCoordMap[key].push(Number("0"));
+        for (let i = 0, length = mapd.length; i < length; i++) {
+            const ele = mapd[i];
+            if (ele.provincesName == key) {
+                geoCoordMap[key].push(Number(ele.allNumber));
+                geoCoordMap[key].push(Number(ele.opeingNumber));
+                geoCoordMap[key].push(Number(ele.assessNumber));
+                break;
+            }
+        }
         data.push({ name: key, value: geoCoordMap[key] });
     }
-    console.log('data', data)
     return data;
 }
 
@@ -123,16 +120,17 @@ const columns: any[] = [
         title: '省分',
         dataIndex: 'provinceName',
         key: 'provinceName',
+        align: "center",
         width: '15%',
         ellipsis: true,
         onCell,
         onHeaderCell,
-        // render: (_: any, record: any) => proviceEnum[record.province],
     },
     {
         title: '项目名称',
         dataIndex: 'projectName',
         key: 'projectName',
+        align: "center",
         ellipsis: true,
         width: '20%',
         onCell,
@@ -142,6 +140,7 @@ const columns: any[] = [
         title: '预算金额',
         dataIndex: 'bidSectContractPrice',
         key: 'bidSectContractPrice',
+        align: "center",
         width: '20%',
         onCell,
         onHeaderCell,
@@ -150,14 +149,17 @@ const columns: any[] = [
         title: '开标时间',
         dataIndex: 'openTime',
         key: 'openTime',
+        align: "center",
         width: '15%',
         onCell,
         onHeaderCell,
+        render: (_: any, record: any) => moment(record.openTime).format("HH:mm"),
     },
     {
         title: '是否重保',
         dataIndex: 'isImportant',
         key: 'isImportant',
+        align: "center",
         width: '20%',
         onCell,
         onHeaderCell,
@@ -177,6 +179,7 @@ const todayColumns: any[] = [
         title: '供应商',
         dataIndex: 'companyName',
         key: 'companyName',
+        align: "center",
         width: '25%',
         ellipsis: true,
         onCell,
@@ -186,6 +189,7 @@ const todayColumns: any[] = [
         title: '中标数量',
         dataIndex: 'selectCount',
         key: 'selectCount',
+        align: "center",
         ellipsis: true,
         width: '20%',
         onCell,
@@ -194,6 +198,7 @@ const todayColumns: any[] = [
     {
         dataIndex: 'progress',
         width: '23%',
+        align: "center",
         onCell,
         onHeaderCell,
         render: (_: any, record: any, index: any) => <Progress percent={Number((record.tenderCount / record.maxTenderCount * 100).toFixed())} strokeColor="#1B7EF2" trailColor="#124a8d" showInfo={false} />
@@ -202,6 +207,7 @@ const todayColumns: any[] = [
         title: '参加项目数量',
         dataIndex: 'tenderCount',
         key: 'tenderCount',
+        align: "center",
         width: '22%',
         onCell,
         onHeaderCell,
@@ -221,6 +227,7 @@ const tjColumns: any[] = [
         title: '招标代理',
         dataIndex: 'tender_agency_name',
         key: 'tender_agency_name',
+        align: "center",
         width: '25%',
         ellipsis: true,
         onCell,
@@ -230,6 +237,7 @@ const tjColumns: any[] = [
         title: '项目实施数',
         dataIndex: 'num',
         key: 'num',
+        align: "center",
         ellipsis: true,
         width: '20%',
         onCell,
@@ -238,6 +246,7 @@ const tjColumns: any[] = [
     {
         dataIndex: 'progress',
         width: '25%',
+        align: "center",
         onCell,
         onHeaderCell,
         render: (_: any, record: any, index: any) => <Progress percent={Number((record.num / record.maxNum * 100).toFixed())} strokeColor="#1B7EF2" trailColor="#124a8d" showInfo={false} />
@@ -246,6 +255,7 @@ const tjColumns: any[] = [
         title: '采购预算',
         dataIndex: 'ys',
         key: 'ys',
+        align: "center",
         width: '20%',
         onCell,
         onHeaderCell,
@@ -277,8 +287,8 @@ export const OverviewItem = (props: { title: string, number: string | number, un
     )
 }
 //进度项
-export const ProgressItem = (props: { title: string, progress: number, leftTitle: string, leftNumber: string | number, rightTitle: string, rightNumber: string | number }) => {
-    const { title, progress, leftTitle, leftNumber, rightTitle, rightNumber } = props;
+export const ProgressItem = (props: { title: string, progress: number, leftTitle: string, leftNumber: string | number, rightTitle: string, rightNumber: string | number, leftClick: () => void, rightClick: () => void, }) => {
+    const { title, progress, leftTitle, leftNumber, rightTitle, rightNumber, leftClick, rightClick } = props;
     return (
         <div className='line-progress-main'>
             <div className='line-progress-top'>
@@ -286,11 +296,11 @@ export const ProgressItem = (props: { title: string, progress: number, leftTitle
                 <div className='progress-title'><span>{title}</span></div>
             </div>
             <div className='line-progress-bottom'>
-                <div>
+                <div onClick={() => leftClick()} className="line-progress-pointer">
                     <div className='progress-bottom-title'><span>{leftTitle}</span></div>
                     <div className='progress-bottom-number'><span>{leftNumber}</span></div>
                 </div>
-                <div>
+                <div onClick={() => rightClick()} className="line-progress-pointer">
                     <div className='progress-bottom-title progress-bottom-right'><span>{rightTitle}</span></div>
                     <div className='progress-bottom-number progress-bottom-right'><span>{rightNumber}</span></div>
                 </div>
@@ -492,13 +502,60 @@ export const ScreenTitle = (props: { title: string, children: any }) => {
     )
 }
 
+//modal大弹窗
+export const ModalList = (props: { modalVisible: boolean, onCancel: () => void, exceptionType?: string, exceptionData: any[] }) => {
+    const { modalVisible, onCancel, exceptionType, exceptionData } = props;
+    const modalHeight = window.innerHeight * 96 / 100;
+    const labelStyle = { color: "#29F1FA", fontWeight: "bold" };
+    const contentStyle = { color: "#fff" };
+    const titleStyle = { color: "#1b7ef2", fontWeight: "bold", marginBottom: '24px' };
+    const dividerStyle = { borderColor: "#999", margin: "12px 0 24px" };
+    console.log("exceptionData", exceptionData)
+    return (
+        <Modal
+            destroyOnClose
+            visible={modalVisible}
+            wrapClassName="monitor-modal-list"
+            onCancel={() => onCancel()}
+            width={"60%"}
+            style={{ maxHeight: modalHeight }}
+            bodyStyle={{ maxHeight: modalHeight - 107, overflowY: 'auto', }}
+            centered
+            footer={null}
+        >
+            <h3 style={titleStyle}>重点监测异常明细单</h3>
+            {exceptionData.length > 0 ? exceptionData.map((item, index) => {
+                return <>
+                    {index == 0 ? null : <Divider style={dividerStyle} />}
+                    <Descriptions>
+                        <Descriptions.Item label="异常类型" labelStyle={labelStyle} contentStyle={contentStyle}>{isNotEmpty(exceptionType) ? exceptionType : item?.exType}</Descriptions.Item>
+                        <Descriptions.Item label="项目名称" labelStyle={labelStyle} contentStyle={contentStyle}>{item?.projectName}</Descriptions.Item>
+                        <Descriptions.Item label="省分" labelStyle={labelStyle} contentStyle={contentStyle}>{item?.provinceName || item?.regionDictName || item?.province}</Descriptions.Item>
+                        <Descriptions.Item label="采购经理" labelStyle={labelStyle} contentStyle={contentStyle}>{item?.ownerContactName}</Descriptions.Item>
+                        <Descriptions.Item label="采购经理电话" labelStyle={labelStyle} contentStyle={contentStyle}>{item?.ownerContactTel}</Descriptions.Item>
+                        <Descriptions.Item label="招标代理机构" labelStyle={labelStyle} contentStyle={contentStyle}>{item?.tenderAgencyName}</Descriptions.Item>
+                        <Descriptions.Item label="代理机构电话" labelStyle={labelStyle} contentStyle={contentStyle}>{item?.appManagerTel}</Descriptions.Item>
+                        <Descriptions.Item label="开标时间" labelStyle={labelStyle} contentStyle={contentStyle}>{item?.openTime || item?.recruitStartTime || item?.openingTime}</Descriptions.Item>
+                        <Descriptions.Item label="采购预算" labelStyle={labelStyle} contentStyle={contentStyle}>{isNotEmpty(item?.budgetAmount) ? Number(item?.budgetAmount).toFixed(2) : isNotEmpty(item?.bidSectContractPrice) ? Number(item?.bidSectContractPrice).toFixed(2) : "0"}</Descriptions.Item>
+                    </Descriptions>
+                </>
+            }) : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} className="monitor-modal-empty" />}
+            <div className='monitor-modal-btn'>
+                <div className='modal-list-btn' onClick={() => onCancel()}>
+                    <span>确  定</span>
+                </div>
+            </div>
+        </Modal>
+    )
+}
+
 /**
  * echarts图表
  * @param props 
  * @returns 
  */
-export const GraphChart = (props: { type: string, chartData: any[], chartColor?: string, bgColor?: string }) => {
-    const { type, chartData, chartColor, bgColor } = props;
+export const GraphChart = (props: { type: string, chartData: any[], chartColor?: string, bgColor?: string, onSelect?: (value: string) => void }) => {
+    const { type, chartData, chartColor, bgColor, onSelect = () => { } } = props;
     const random = Math.random().toString();
     useEffect(() => {
         type EChartsOption = echarts.EChartsOption;
@@ -935,28 +992,124 @@ export const GraphChart = (props: { type: string, chartData: any[], chartColor?:
                         borderColor: "#29F0F9",
                         borderWidth: 0.5
                     },
-                    data: [],
+                    data: chartData,
+                },
+            ]
+        };
+        const mapThirdOption: EChartsOption = {
+            tooltip: {
+                show: false,
+            },
+            geo: {
+                map: "china",
+                roam: false,// 一定要关闭拖拽
+                zoom: 1.2,
+                itemStyle: {
+                    areaColor: "rgba(128,128,128,0)",
+                    borderColor: "#29F0F9",
+                    borderWidth: 1, //设置外层边框
+                    shadowBlur: 10,
+                    shadowOffsetY: 10,
+                    shadowOffsetX: 0,
+                    shadowColor: "#0e6f7a"
+                }
+            },
+            visualMap: {
+                min: 0,
+                max: 50,
+                inRange: {
+                    color: [
+                        '#01417f',
+                        '#26c4ff',
+                        '#abd5fc',
+                        '#42p4b7',
+                        '#1a315a',
+                        '#cacdda',
+                        '#0d4697',
+                        '#01192d',
+                    ]
+                },
+                show: false
+            },
+            series: [
+                {
+                    type: "map",
+                    map: "china",
+                    roam: false,
+                    zoom: 1.2,
+                    showLegendSymbol: false, // 存在legend时显示
+                    tooltip: {
+                        formatter(value) {
+                            console.log("value", value);
+                            if (value.data?.name) {
+                                let list = "";
+                                if (value.data?.data) {
+                                    for (let i = 0, length = value.data.data.length; i < length; i++) {
+                                        const item = value.data.data[i];
+                                        list += "<br/>";
+                                        list += `${item.agencyName}：${item.dlxms}`;
+                                    }
+                                }
+                                return value.data.name + "<br/>" + "代理机构总数：" + value.data.value + list;
+                            }
+                            return "";
+                        },
+                        backgroundColor: "#0a0c11cc",
+                        textStyle: {
+                            color: '#fff'
+                        },
+                        show: true
+                    },
+                    emphasis: {
+                        label: {
+                            show: true,
+                            color: '#fff'
+                        },
+                        itemStyle: {
+                            areaColor: '#127dff'
+                        }
+                    },
+                    select: {
+                        disabled: true,
+                    },
+                    label: {
+                        show: true,
+                        color: "#fff"
+                    },
+                    itemStyle: {
+                        areaColor: "rgba(128,128,128,0)",
+                        borderColor: "#29F0F9",
+                        borderWidth: 0.5
+                    },
+                    data: chartData,
                 },
             ]
         };
-        const data = [];
-        for (let i = 0; i < 10; ++i) {
-            data.push(Math.round(Math.random() * 200));
-        }
         const transverseBarOption: EChartsOption = {
+            grid: {
+                left: '2%',
+                containLabel: true
+            },
             xAxis: {
                 max: 'dataMax',
+                name: chartData[2],
+                position: 'bottom',
                 axisLabel: { color: '#FFFFFF' },
                 splitLine: {
                     lineStyle: {
                         color: '#2c2d30',
                         type: 'dashed'
                     },
+                },
+                nameLocation: "middle",
+                nameGap: 30,
+                nameTextStyle: {
+                    color: "#fff"
                 }
             },
             yAxis: {
                 type: 'category',
-                data: ['华为', '中兴', 'BYD', '云网', '阿里', '京东', '百度', '阿里', '京东', '百度'],
+                data: chartData[0],
                 inverse: true,
                 axisLabel: { color: '#FFFFFF' },
                 axisTick: {
@@ -971,7 +1124,7 @@ export const GraphChart = (props: { type: string, chartData: any[], chartColor?:
                     itemStyle: {
                         color: '#129bff',
                     },
-                    data: data,
+                    data: chartData[1],
                     label: {
                         show: true,
                         position: 'right',
@@ -984,14 +1137,21 @@ export const GraphChart = (props: { type: string, chartData: any[], chartColor?:
             },
         };
         if (type == "mapTwice") {
-            myChart.on('selectchanged', function (params) {
+            myChart.on('selectchanged', function (params: any) {
                 console.log("params", params)
+                if (params.selected.length > 0) {
+                    onSelect(chartData[params.selected[0].dataIndex[0]].name);
+                } else {
+                    onSelect("");
+                }
+
             })
         }
         const optionsMap = {
             "map": mapOption,
             "gauge": gaugeOption,
             "mapTwice": mapTwiceOption,
+            "mapThird": mapThirdOption,
             "category": categoryOption,
             "transverseBar": transverseBarOption,
         }
@@ -1051,10 +1211,12 @@ const MonitorHome: React.FC<{}> = () => {
     const [expertNumber, setExpertNumber] = useState<string | number>("");
     //年度&月度 year-年度 month-月度
     const [ymChange, setYmChange] = useState<string>("year");
+    //评标室监控
+    const [monitorList, setMonitorList] = useState<any[]>([]);
     //权限校验
     const auth = useRef<boolean>(authCheck());
-    const randomData = () => Math.round(Math.random() * 100);
-    const centerMapData = { "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() }] }
+    const bidStatusMap = ["准备评标", "正在评标", "评标结束"];
+    const statusColorMap = ["card-text-orange", "card-text-green", "card-text-purple"];
     const mapChart = useMemo(() => {
         return reviewDistributionData.length > 0 && <GraphChart type="map" chartData={reviewDistributionData} />
     }, [reviewDistributionData])
@@ -1143,6 +1305,26 @@ const MonitorHome: React.FC<{}> = () => {
             }
         })
     }
+    //首页-评标室监控
+    const getMonitorList = () => {
+        getMonitorListAPI({ pageNo: 1, pageSize: 3 }).then(res => {
+            if (res?.code == 200) {
+                setMonitorList(res?.data.records);
+            }
+        })
+    }
+    //监控室点击事件
+    const onCardClick = (item: any) => {
+        if (item.status == "0") {
+            message.info("当前评标室未开启，请等待开启后查看");
+            return;
+        }
+        history.push({
+            pathname: "/ElecMonitorScreen/ProjectMonitorRoom",
+            state: { monitorId: item.id },
+        })
+    }
+
     useEffect(() => {
         if (auth.current) {
             getTodayOpening();
@@ -1150,6 +1332,7 @@ const MonitorHome: React.FC<{}> = () => {
             getOpeningList();
             getAnnualAndTenderAgent();
             getActiveSupplier();
+            getMonitorList();
         }
     }, [])
 
@@ -1180,7 +1363,7 @@ const MonitorHome: React.FC<{}> = () => {
                 <Col span={8}>
                     <div className="monitor-left-main">
                         <div className="monitor-label-pointer" onClick={() => { window.open("/ElecMonitor/OpenToday") }}>
-                            <ScreenLabel title="今日开标" extra={<span>标段总数&nbsp;&nbsp;{isNotEmpty(todayOpeningData?.sectionNumber) ? todayOpeningData?.sectionNumber : 0}&nbsp;&nbsp;已完成&nbsp;&nbsp;{isNotEmpty(todayOpeningData?.complete) ? todayOpeningData?.complete : 0}&nbsp;&nbsp;完成率&nbsp;&nbsp;{isNotEmpty(todayOpeningData?.rate) ? todayOpeningData?.rate : 0}</span>} />
+                            <ScreenLabel title="今日开标" extra={<span>标段总数&nbsp;&nbsp;{isNotEmpty(todayOpeningData?.sectionNumber) ? todayOpeningData?.sectionNumber : 0}&nbsp;&nbsp;已完成&nbsp;&nbsp;{isNotEmpty(todayOpeningData?.complete) ? Number(todayOpeningData?.complete).toFixed(0) : 0}&nbsp;&nbsp;完成率&nbsp;&nbsp;{isNotEmpty(todayOpeningData?.rate) ? todayOpeningData?.rate : 0}</span>} />
                         </div>
                         <div className="scroll-table">
                             <ScrollTable dataSource={todayOpeningData?.todayList} columns={columns} ynum={266} />
@@ -1201,19 +1384,21 @@ const MonitorHome: React.FC<{}> = () => {
                         <div className="review-distribution">
                             {mapChart}
                         </div>
-                        <ScreenLabel title="智能评标监控" />
+                        <div className="monitor-label-pointer" onClick={() => { window.open("/ElecMonitorScreen/MonitorRoom") }}>
+                            <ScreenLabel title="智能评标监控" />
+                        </div>
                         <div className="bid-evaluation">
                             {/* <div> */}
                             <Row gutter={16}>
-                                {[1, 2, 3].map((item, index) => (
+                                {monitorList.map((item, index) => (
                                     <Col span={8}>
                                         {/* <div> */}
-                                        <div className="card-default-01">
+                                        <div className="card-default-01" onClick={() => onCardClick(item)}>
                                             <img src={default_play}></img>
-                                            <div className={index == 0 ? "card-text-orange" : index == 1 ? "card-text-green" : "card-text-purple"}>{index == 0 ? "未开始" : index == 1 ? "评标中" : "已结束"}</div>
+                                            <div className={statusColorMap[item.status]}>{bidStatusMap[item.status]}</div>
                                         </div>
                                         <div className="evaluation-text">
-                                            <span>吉林省XXX项目</span>
+                                            <span>{item.projectName}</span>
                                         </div>
                                         {/* </div> */}
 
diff --git a/src/pages/ElecEvaluation/Monitor/OpenToday/index.tsx b/src/pages/ElecEvaluation/Monitor/OpenToday/index.tsx
index 9973747..6d96a9c 100644
--- a/src/pages/ElecEvaluation/Monitor/OpenToday/index.tsx
+++ b/src/pages/ElecEvaluation/Monitor/OpenToday/index.tsx
@@ -1,10 +1,11 @@
 import { Col, Row } from 'antd';
 import React, { useEffect, useRef, useState } from 'react';
 import '../style.less'
-import { authCheck, onCell, onHeaderCell, OverviewItem, ProgressItem, proviceEnum, ScreenLabel, ScreenTitle, ScrollTable, StageCard } from '../Home';
+import { authCheck, ModalList, onCell, onHeaderCell, OverviewItem, ProgressItem, proviceEnum, ScreenLabel, ScreenTitle, ScrollTable, StageCard } from '../Home';
 import Circle3199 from '@/assets/monitor/circle-3199.png';
-import { getDecryptSuccessRateTodayAPI, getTodayInfoAPI, getTodayOpeningAPI } from '../service';
+import { getDecryptSuccessRateTodayAPI, getNoOpenListAPI, getNoOpenNumberAPI, getTodayInfoAPI, getTodayOpeningAPI, getUnopenSixAPI, getUnopenTenAPI } from '../service';
 import { isNotEmpty } from '@/utils/CommonUtils';
+const statusMap = ["未开标", "开标", "唱标", "唱标结束", "取消开标", "", "", "", "", "异常处理"];
 
 const columns: any[] = [
     {
@@ -12,6 +13,48 @@ const columns: any[] = [
         dataIndex: 'provinceName',
         key: 'provinceName',
         width: '20%',
+        align: "center",
+        ellipsis: true,
+        onCell,
+        onHeaderCell,
+        // render: (_: any, record: any) => proviceEnum[record.provinceDictId],
+    },
+    {
+        title: '项目名称',
+        dataIndex: 'projectName',
+        key: 'projectName',
+        align: "center",
+        ellipsis: true,
+        width: '30%',
+        onCell,
+        onHeaderCell,
+    },
+    {
+        title: '采购预算',
+        dataIndex: 'bidSectContractPrice',
+        key: 'bidSectContractPrice',
+        align: "center",
+        width: '30%',
+        onCell,
+        onHeaderCell,
+    },
+    {
+        title: '开标时间',
+        dataIndex: 'openTime',
+        key: 'openTime',
+        align: "center",
+        width: '20%',
+        onCell,
+        onHeaderCell,
+    },
+];
+const reiColumns: any[] = [
+    {
+        title: '省分',
+        dataIndex: 'provinceName',
+        key: 'provinceName',
+        align: "center",
+        width: '20%',
         ellipsis: true,
         onCell,
         onHeaderCell,
@@ -21,8 +64,9 @@ const columns: any[] = [
         title: '项目名称',
         dataIndex: 'projectName',
         key: 'projectName',
+        align: "center",
         ellipsis: true,
-        width: '30%',
+        width: '20%',
         onCell,
         onHeaderCell,
     },
@@ -30,7 +74,8 @@ const columns: any[] = [
         title: '采购预算',
         dataIndex: 'bidSectContractPrice',
         key: 'bidSectContractPrice',
-        width: '30%',
+        align: "center",
+        width: '20%',
         onCell,
         onHeaderCell,
     },
@@ -38,143 +83,22 @@ const columns: any[] = [
         title: '开标时间',
         dataIndex: 'openTime',
         key: 'openTime',
-        width: '20%',
-        onCell,
-        onHeaderCell,
-    },
-];
-const reiColumns: any[] = [
-    {
-        title: '省分',
-        dataIndex: 'provinceDictId',
-        key: 'provinceDictId',
-        width: '20%',
-        ellipsis: true,
-        onCell,
-        onHeaderCell,
-        render: (_: any, record: any) => proviceEnum[record.provinceDictId],
-    },
-    {
-        title: '项目名称',
-        dataIndex: 'projectName',
-        key: 'projectName',
-        ellipsis: true,
-        width: '20%',
-        onCell,
-        onHeaderCell,
-    },
-    {
-        title: '采购预算',
-        dataIndex: 'number',
-        key: 'number',
-        width: '20%',
-        onCell,
-        onHeaderCell,
-    },
-    {
-        title: '开标时间',
-        dataIndex: 'time',
-        key: 'time',
+        align: "center",
         width: '20%',
         onCell,
         onHeaderCell,
     },
     {
         title: '状态',
-        dataIndex: 'time',
-        key: 'time',
+        dataIndex: 'state',
+        key: 'state',
+        align: "center",
         width: '20%',
         onCell,
         onHeaderCell,
+        render: (_: any, record: any) => statusMap[record.state],
     },
 ];
-const dataSource = [
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "9:30",
-        vital: "0",
-    },
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "9:30",
-        vital: "0",
-    },
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "9:30",
-        vital: "0",
-    },
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "9:30",
-        vital: "0",
-    },
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "9:30",
-        vital: "0",
-    },
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "10:30",
-        vital: "1",
-    },
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "10:30",
-        vital: "1",
-    },
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "10:30",
-        vital: "1",
-    },
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "10:30",
-        vital: "1",
-    },
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "9:30",
-        vital: "0",
-    },
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "9:30",
-        vital: "0",
-    },
-    {
-        provinceDictId: "0012",
-        projectName: "天津设备采购",
-        number: "320万",
-        time: "9:30",
-        vital: "0",
-    },
-]
-
 const OpenToday: React.FC<{}> = () => {
     //今日开标-评标阶段，评标及时率
     const [todayInfoData, setTodayInfoData] = useState<any>();
@@ -182,6 +106,24 @@ const OpenToday: React.FC<{}> = () => {
     const [decryptSuccessRateTodayData, setDecryptSuccessRateTodayData] = useState<any>();
     //今日开标-首页开标数据
     const [todayOpeningData, setTodayOpeningData] = useState<any>();
+    //今日开标-评标阶段10小时未评标
+    const [unopenTenData, setUnopenTenData] = useState<any[]>([]);
+    //今日开标-评标阶段6小时未评标
+    const [unopenSixData, setUnopenSixData] = useState<any[]>([]);
+    //超过2小时未开标数量
+    const [noOpenNumberTwo, setNoOpenNumberTwo] = useState<string>("0");
+    //超过5小时未开标数量
+    const [noOpenNumberFive, setNoOpenNumberFive] = useState<string>("0");
+    //超过2小时未开标列表
+    const [noOpenListTwo, setNoOpenListTwo] = useState<any[]>([]);
+    //超过5小时未开标列表
+    const [noOpenListFive, setNoOpenListFive] = useState<any[]>([]);
+    //ModalList visible
+    const [modalListVisible, setModalListVisible] = useState<boolean>(false);
+    //ModalList Data
+    const [modalListData, setModalListData] = useState<any[]>([]);
+    //ModalList Type
+    const [exceptionType, setExceptionType] = useState<any>();
     //权限校验
     const auth = useRef<boolean>(authCheck());
     //今日开标-评标阶段，评标及时率
@@ -208,35 +150,85 @@ const OpenToday: React.FC<{}> = () => {
             }
         })
     }
+    //评标阶段6小时未评标
+    const getUnopenSix = () => {
+        getUnopenSixAPI().then(res => {
+            if (res?.code == 200) {
+                setUnopenSixData(res?.data);
+            }
+        })
+    }
+    //评标阶段10小时未评标
+    const getUnopenTen = () => {
+        getUnopenTenAPI().then(res => {
+            if (res?.code == 200) {
+                setUnopenTenData(res?.data);
+            }
+        })
+    }
+    //超n小时未开标数量
+    const getNoOpenNumber = () => {
+        getNoOpenNumberAPI({ "timeLimit": "2", "dayNumber": "1" }).then(res => {
+            if (res?.code == 200) {
+                setNoOpenNumberTwo(res?.data);
+            }
+        })
+        getNoOpenNumberAPI({ "timeLimit": "5", "dayNumber": "1" }).then(res => {
+            if (res?.code == 200) {
+                setNoOpenNumberFive(res?.data);
+            }
+        })
+    }
+    //超n小时未开标列表
+    const getNoOpenList = () => {
+        getNoOpenListAPI({ "timeLimit": "2", "dayNumber": "1" }).then(res => {
+            if (res?.code == 200) {
+                setNoOpenListTwo(res?.data?.records);
+            }
+        })
+        getNoOpenListAPI({ "timeLimit": "5", "dayNumber": "1" }).then(res => {
+            if (res?.code == 200) {
+                setNoOpenListFive(res?.data?.records);
+            }
+        })
+    }
+
     useEffect(() => {
         if (auth.current) {
             getTodayInfo();
             getDecryptSuccessRateToday();
             getTodayOpening();
+            getUnopenSix();
+            getUnopenTen();
+            getNoOpenNumber();
+            getNoOpenList();
         }
     }, [])
     return (
         <ScreenTitle title="今日开标">
             <div className="top-main top-main-bottom">
+                <div className='monitor-top-exchange'>
+                    <span onClick={() => { window.open("/ElecMonitor/Exception") }}>异常监控</span>
+                </div>
                 <Row gutter={30}>
                     <Col span={7}>
                         <div className='monitor-tender-card'>
                             <ScreenLabel title="开标阶段" />
                             <div className='monitor-tender-card'>
-                                <StageCard percentage={60} total={130} firstTitle="已开标" firstNumber={`100个`} secondTitle="已解密" secondNumber={`80个`} thirdTitle="已唱标" thirdNumber={`65个`} />
+                                <StageCard percentage={isNotEmpty(todayOpeningData?.sectionNumber) && todayOpeningData?.sectionNumber != "0" ? Number(((Number(todayOpeningData?.banner) / todayOpeningData?.sectionNumber) * 100).toFixed(0)) : 0} total={isNotEmpty(todayOpeningData?.sectionNumber) ? todayOpeningData?.sectionNumber : 0} firstTitle="已开标" firstNumber={`${isNotEmpty(todayOpeningData?.openNumber) ? Number(todayOpeningData?.openNumber).toFixed(0) : 0}个`} secondTitle="已解密" secondNumber={`${isNotEmpty(todayOpeningData?.decrypt) ? Number(todayOpeningData?.decrypt).toFixed(0) : 0}个`} thirdTitle="已唱标" thirdNumber={`${isNotEmpty(todayOpeningData?.banner) ? Number(todayOpeningData?.banner).toFixed(0) : 0}个`} />
                             </div>
                         </div>
                     </Col>
                     <Col span={10}>
                         <div className="monitor-top-space-flex monitor-today-overview-width">
                             <OverviewItem icon={Circle3199} title="标段总数" number={isNotEmpty(todayOpeningData?.sectionNumber) ? todayOpeningData?.sectionNumber : 0} unit="个" />
-                            <OverviewItem icon={Circle3199} title="已完成" number={isNotEmpty(todayOpeningData?.complete) ? todayOpeningData?.complete : 0} unit="个" />
+                            <OverviewItem icon={Circle3199} title="已完成" number={isNotEmpty(todayOpeningData?.complete) ? Number(todayOpeningData?.complete).toFixed(0) : 0} unit="个" />
                             <OverviewItem icon={Circle3199} title="完成率" number={isNotEmpty(todayOpeningData?.rate) ? todayOpeningData?.rate.slice(0, todayOpeningData?.rate.length - 1) : 0} unit="%" />
                         </div>
-                        <div className="monitor-top-space-flex ">
-                            <ProgressItem progress={isNotEmpty(decryptSuccessRateTodayData?.successRate) ? Number(decryptSuccessRateTodayData?.successRate) : 0} title="解密成功率" leftTitle='解密成功' rightTitle='解密失败' leftNumber={isNotEmpty(decryptSuccessRateTodayData?.successNum) ? Number(decryptSuccessRateTodayData?.successNum) : 0} rightNumber={isNotEmpty(decryptSuccessRateTodayData?.failNum) ? Number(decryptSuccessRateTodayData?.failNum) : 0} />
-                            <ProgressItem progress={70} title="开标及时率" leftTitle='2小时未开标' rightTitle='5小时未开标' leftNumber={1223} rightNumber={1223} />
-                            <ProgressItem progress={90} title="评标及时率" leftTitle='6小时未评标' rightTitle='10小时未评标' leftNumber={todayInfoData?.sixTimelyRate} rightNumber={todayInfoData?.tenTimelyRate} />
+                        <div className="monitor-top-space-flex">
+                            <ProgressItem progress={isNotEmpty(decryptSuccessRateTodayData?.successRate) ? Number(Number(decryptSuccessRateTodayData?.successRate).toFixed(0)) : 100} title="解密成功率" leftTitle='解密成功' rightTitle='解密失败' leftNumber={isNotEmpty(decryptSuccessRateTodayData?.successNum) ? Number(decryptSuccessRateTodayData?.successNum) : 0} rightNumber={isNotEmpty(decryptSuccessRateTodayData?.failNum) ? Number(decryptSuccessRateTodayData?.failNum) : 0} leftClick={() => { }} rightClick={() => { setExceptionType("解密异常"); setModalListData(isNotEmpty(decryptSuccessRateTodayData?.decryptFailProjectList) ? decryptSuccessRateTodayData?.decryptFailProjectList : []); setModalListVisible(true); }} />
+                            <ProgressItem progress={isNotEmpty(todayOpeningData?.sectionNumber) ? todayOpeningData?.sectionNumber != 0 ? Number((((todayOpeningData?.sectionNumber - Number(noOpenNumberTwo) - Number(noOpenNumberFive)) / Number(todayOpeningData?.sectionNumber)) * 100).toFixed(0)) : 100 : 100} title="开标及时率" leftTitle='2小时未开标' rightTitle='5小时未开标' leftNumber={noOpenNumberTwo} rightNumber={noOpenNumberFive} leftClick={() => { setExceptionType(null); setModalListData(noOpenListTwo); setModalListVisible(true); }} rightClick={() => { setExceptionType(null); setModalListData(noOpenListFive); setModalListVisible(true); }} />
+                            <ProgressItem progress={isNotEmpty(todayInfoData?.sectionNumber) ? todayInfoData?.sectionNumber != 0 ? Number((((todayInfoData?.sectionNumber - Number(todayInfoData?.sixTimelyRate) - Number(todayInfoData?.tenTimelyRate)) / Number(todayInfoData?.sectionNumber)) * 100).toFixed(0)) : 100 : 100} title="评标及时率" leftTitle='6小时未评标' rightTitle='10小时未评标' leftNumber={todayInfoData?.sixTimelyRate} rightNumber={todayInfoData?.tenTimelyRate} leftClick={() => { setExceptionType(null); setModalListData(unopenSixData); setModalListVisible(true); }} rightClick={() => { setExceptionType(null); setModalListData(unopenTenData); setModalListVisible(true); }} />
                         </div>
                     </Col>
                     <Col span={7}>
@@ -259,10 +251,11 @@ const OpenToday: React.FC<{}> = () => {
                 <Col span={12}>
                     <ScreenLabel title="重保项目" />
                     <div className='monitor-tender-card'>
-                        <ScrollTable dataSource={dataSource} columns={reiColumns} ynum={530} />
+                        <ScrollTable dataSource={isNotEmpty(todayOpeningData?.importantList) ? todayOpeningData?.importantList : []} columns={reiColumns} ynum={530} />
                     </div>
                 </Col>
             </Row>
+            <ModalList modalVisible={modalListVisible} onCancel={() => { setModalListVisible(false); setModalListData([]); }} exceptionData={modalListData} exceptionType={exceptionType} />
         </ScreenTitle>
     );
 };
diff --git a/src/pages/ElecEvaluation/Monitor/Supplier/index.tsx b/src/pages/ElecEvaluation/Monitor/Supplier/index.tsx
index c9ef3b1..b267dcc 100644
--- a/src/pages/ElecEvaluation/Monitor/Supplier/index.tsx
+++ b/src/pages/ElecEvaluation/Monitor/Supplier/index.tsx
@@ -5,6 +5,7 @@ import { authCheck, GraphChart, MetricItems, onCell, onHeaderCell, ScreenLabel,
 import Frame10116 from '@/assets/monitor/Frame-10116.png';
 import Frame10121 from '@/assets/monitor/Frame-10121.png';
 import { getActiveSupplierRankAPI, getProvinceActiveSupplierInfoAPI, getSupplierInfoAPI } from '../service';
+import { isNotEmpty } from '@/utils/CommonUtils';
 
 const columns: any[] = [
     {
@@ -19,6 +20,7 @@ const columns: any[] = [
         title: '供应商',
         dataIndex: 'companyName',
         key: 'companyName',
+        align: 'center',
         width: '25%',
         ellipsis: true,
         onCell,
@@ -28,6 +30,7 @@ const columns: any[] = [
         title: '投标次数',
         dataIndex: 'tenderCount',
         key: 'tenderCount',
+        align: 'center',
         ellipsis: true,
         width: '20%',
         onCell,
@@ -36,6 +39,7 @@ const columns: any[] = [
     {
         dataIndex: 'progress',
         width: '25%',
+        align: 'center',
         onCell,
         onHeaderCell,
         render: (_: any, record: any, index: any) => <Progress percent={Number((record.tenderCount / record.maxTenderCount * 100).toFixed())} strokeColor="#1B7EF2" trailColor="#124a8d" showInfo={false} />
@@ -44,6 +48,7 @@ const columns: any[] = [
         title: '中选次数',
         dataIndex: 'selectCount',
         key: 'selectCount',
+        align: 'center',
         width: '20%',
         onCell,
         onHeaderCell,
@@ -58,17 +63,32 @@ const Supplier: React.FC<{}> = () => {
     //全国活跃供应商排名
     const [activeSupplierRankData, setActiveSupplierRankData] = useState<any[]>([]);
     //供应商概况-省份活跃供应商
-    const [provinceActiveSupplierInfoData, setProvinceActiveSupplierInfoData] = useState<any>();
+    const provinceActiveSupplierInfoData = useRef<any[]>([]);
+    //供应商概况-省份数据
+    const [provinceData, setProvinceData] = useState<any[]>([]);
+    //月度年度 yearData-年度 monthData-月度
+    const monthOrYear = useRef<string>("yearData");
+    //指标项 tenderCount-投标次数 selectCount-中选次数 bidCost-中选金额
+    const metric = useRef<string>("tenderCount");
+    const metricMap = { tenderCount: "投标次数", selectCount: "中选次数", bidCost: "中选金额" };
+    //省份
+    const province = useRef<string>("");
+    //图表数据
+    const [chartData, setChartData] = useState<any[]>([]);
     //权限校验
     const auth = useRef<boolean>(authCheck());
     const transverseBarChart = useMemo(() => {
-        return true && <GraphChart type="transverseBar" chartData={[]} />
-    }, [])
-    const randomData = () => Math.round(Math.random() * 100);
-    const centerMapData = { "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() }] }
+        return chartData.length > 0 && <GraphChart type="transverseBar" chartData={chartData} />
+    }, [chartData])
+    //选择省份
+    const onSelect = (value: string) => {
+        console.log("value", value);
+        province.current = value;
+        chartDataChange();
+    }
     const mapChart = useMemo(() => {
-        return centerMapData?.list && <GraphChart type="mapTwice" chartData={centerMapData?.list} />
-    }, [])
+        return provinceData.length > 0 && <GraphChart type="mapTwice" chartData={provinceData} onSelect={onSelect} />
+    }, [provinceData])
 
     //上面六个指标
     const getSupplierInfo = () => {
@@ -92,7 +112,8 @@ const Supplier: React.FC<{}> = () => {
     const getProvinceActiveSupplierInfo = () => {
         getProvinceActiveSupplierInfoAPI().then(res => {
             if (res?.code == 200) {
-                setProvinceActiveSupplierInfoData(res?.data);
+                provinceActiveSupplierInfoData.current = res?.data;
+                setProvinceData(res?.data.map((item: any) => ({ name: item.provinceName, value: 0 })))
             }
         })
     }
@@ -110,6 +131,34 @@ const Supplier: React.FC<{}> = () => {
 
         }
     }
+    //展示条形图
+    const chartDataChange = () => {
+        if (provinceActiveSupplierInfoData.current.length > 0) {
+            if (province.current != "") {//省份不为空
+                let count = 0;
+                for (const item of provinceActiveSupplierInfoData.current) {
+                    if (item.provinceName == province.current) {
+                        const initData: any[] = item[monthOrYear.current];
+                        const name: any[] = [];
+                        const value: any[] = [];
+                        for (const ite of initData) {
+                            name.push(ite.companyName);
+                            value.push(isNotEmpty(ite[metric.current]) ? Number(ite[metric.current].toFixed(0)) : 0);
+                        }
+                        setChartData([name, value, metricMap[metric.current]]);
+                        count++;
+                        break;
+                    }
+                }
+                if (count = 0) {
+                    setChartData([]);
+                }
+            } else {
+                setChartData([]);
+            }
+        }
+    }
+
     useEffect(() => {
         if (auth.current) {
             getSupplierInfo();
@@ -143,14 +192,14 @@ const Supplier: React.FC<{}> = () => {
                 </Col>
                 <Col span={16}>
                     <div className="monitor-right-main">
-                        <ScreenLabel title="省分活跃供应商排名" extra={<span>本年 | 本月&nbsp;&nbsp;&nbsp;&nbsp;投标次数 | 中选次数 | 中选金额&nbsp;&nbsp;&nbsp;&nbsp;辽宁</span>} />
-                        <Row gutter={80}>
-                            <Col span={15}>
+                        <ScreenLabel title="省分活跃供应商排名" extra={<span><span className='monitor-extra-pointer' onClick={() => { monthOrYear.current = "yearData"; chartDataChange(); }}>本年</span> | <span className='monitor-extra-pointer' onClick={() => { monthOrYear.current = "monthData"; chartDataChange(); }}>本月</span>&nbsp;&nbsp;&nbsp;&nbsp;<span className='monitor-extra-pointer' onClick={() => { metric.current = "tenderCount"; chartDataChange(); }}>投标次数</span> | <span className='monitor-extra-pointer' onClick={() => { metric.current = "selectCount"; chartDataChange(); }}>中选次数</span> | <span className='monitor-extra-pointer' onClick={() => { metric.current = "bidCost"; chartDataChange(); }}>中选金额</span>&nbsp;&nbsp;&nbsp;&nbsp;{province.current}</span>} />
+                        <Row>
+                            <Col span={14}>
                                 <div className="monitor-supplier-rank">
                                     {mapChart}
                                 </div>
                             </Col>
-                            <Col span={9}>
+                            <Col span={10}>
                                 <div className="monitor-supplier-rank">
                                     {transverseBarChart}
                                 </div>
diff --git a/src/pages/ElecEvaluation/Monitor/TenderAgent/index.tsx b/src/pages/ElecEvaluation/Monitor/TenderAgent/index.tsx
index 3d23f7b..9da3953 100644
--- a/src/pages/ElecEvaluation/Monitor/TenderAgent/index.tsx
+++ b/src/pages/ElecEvaluation/Monitor/TenderAgent/index.tsx
@@ -15,6 +15,7 @@ const columns: any[] = [
         title: '代理机构',
         dataIndex: 'agencyName',
         key: 'agencyName',
+        align: 'center',
         width: '20%',
         ellipsis: true,
         onCell,
@@ -24,6 +25,7 @@ const columns: any[] = [
         title: '项目数量总计（个）',
         dataIndex: 'dlxms',
         key: 'dlxms',
+        align: 'center',
         width: '20%',
         onCell,
         onHeaderCell,
@@ -32,6 +34,7 @@ const columns: any[] = [
         title: '项目金额总计（亿元）',
         dataIndex: 'dlxmys',
         key: 'dlxmys',
+        align: 'center',
         width: '20%',
         onCell,
         onHeaderCell,
@@ -41,6 +44,7 @@ const columns: any[] = [
         title: '平均完成率（%）',
         dataIndex: 'wcl',
         key: 'wcl',
+        align: 'center',
         width: '20%',
         onCell,
         onHeaderCell,
@@ -54,104 +58,6 @@ const columns: any[] = [
     //     onHeaderCell,
     // },
 ];
-const dataSource = [
-    {
-        key: '1',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-    {
-        key: '2',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-    {
-        key: '3',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-    {
-        key: '4',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-    {
-        key: '5',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-    {
-        key: '6',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-    {
-        key: '7',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-    {
-        key: '8',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-    {
-        key: '9',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-    {
-        key: '10',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-    {
-        key: '11',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-    {
-        key: '12',
-        dljg: "河南省信息咨询设计研究有限公司",
-        xmslzj: "325",
-        xmjezj: "565566",
-        pjwcl: "20",
-        pjmyd: "60",
-    },
-]
 
 const TenderAgent: React.FC<{}> = () => {
     //相关统计数据
@@ -162,11 +68,12 @@ const TenderAgent: React.FC<{}> = () => {
     const [selectData, setSelectData] = useState<any[]>([]);
     //代理分布省分
     const [provinceByAgencyData, setProvinceByAgencyData] = useState<any[]>([]);
+    //省分代理分布
+    const [provinceData, setProvinceData] = useState<any[]>([]);
     //btn select
     const [btnSelect, setBtnSelect] = useState<string>("0");
     //权限校验
     const auth = useRef<boolean>(authCheck());
-    const randomData = () => Math.round(Math.random() * 100);
     // const gaugeChartData = [{ value: 20 }]
     // const gaugeGreenChart = useMemo(() => {
     //     return gaugeChartData && <GraphChart type="gauge" chartData={gaugeChartData} bgColor="#15A5AC" chartColor="#29F1FA" />
@@ -180,10 +87,9 @@ const TenderAgent: React.FC<{}> = () => {
     const categoryChart = useMemo(() => {
         return <GraphChart type="category" chartData={monthData} />
     }, [monthData])
-    const centerMapData = { "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() }] }
     const mapChart = useMemo(() => {
-        return centerMapData?.list && <GraphChart type="mapTwice" chartData={centerMapData?.list} />
-    }, [centerMapData])
+        return provinceData.length > 0 && <GraphChart type="mapThird" chartData={provinceData} />
+    }, [provinceData])
 
     //相关统计数据
     const getTenderAgentData = () => {
@@ -203,8 +109,18 @@ const TenderAgent: React.FC<{}> = () => {
                 setMonthData(monthDataMap)
 
                 const selectData: any[] = res?.data.agencyList.map((item: any) => ({ label: item.agencyName, value: item.agencyId }));//右侧代理机构下拉
-                selectData.unshift({ label: "全部", value: "all" });
+                selectData.unshift({ label: "请选择", value: "all" });
                 setSelectData(selectData);
+
+                const province = res?.data.agencyListByProvince;//招标代理省份分布数据
+                const pdata: any[] = []
+                for (const key in province) {
+                    if (Object.prototype.hasOwnProperty.call(province, key)) {
+                        const item = province[key];
+                        pdata.push({ name: key, value: item.length, data: item.slice(0, 5) });
+                    }
+                }
+                setProvinceData(pdata.slice(0, -3));
             }
         })
     }
@@ -239,8 +155,7 @@ const TenderAgent: React.FC<{}> = () => {
                             <OverviewItem icon={Circle3197} title="代理机构数量" number={tenderAgentData?.agencyProjectCountYear.dljg} unit="个" />
                             <OverviewItem icon={Circle3198} title="代理机构人员数量" number={tenderAgentData?.agencyProjectCountYear.dljgry} unit="人" />
                             <OverviewItem icon={Circle3199} title="代理机构项目数量" number={tenderAgentData?.agencyProjectCountYear.dlxms} unit="个" />
-                            {/* tenderAgentData?.agencyProjectCountYear.dlxmys */}
-                            <OverviewItem icon={Circle3200} title="代理项目预算金额" number={6} unit="亿元" />
+                            <OverviewItem icon={Circle3200} title="代理项目预算金额" number={tenderAgentData?.agencyProjectCountYear.dlxmys} unit="亿元" />
                             <OverviewItem icon={Circle3199} title="代理项目完成率" number={isNotEmpty(tenderAgentData?.agencyProjectCountYear.wcl) ? (tenderAgentData?.agencyProjectCountYear.wcl * 100).toFixed(0) : 0} unit="%" />
                         </div>
                     </Col>
diff --git a/src/pages/ElecEvaluation/Monitor/service.ts b/src/pages/ElecEvaluation/Monitor/service.ts
index 21fa073..77e4d77 100644
--- a/src/pages/ElecEvaluation/Monitor/service.ts
+++ b/src/pages/ElecEvaluation/Monitor/service.ts
@@ -82,10 +82,12 @@ export async function getExpertNumberAPI(params: any) {
 
 /**
  * 异常监控-超过1小时未开标数量
+ * @param data
  */
-export async function getNoOpenNumberAPI() {
+export async function getNoOpenNumberAPI(data: any) {
     return request('/api/biz-service-ebtp-statistics/opening/noOpenNumber', {
         method: 'POST',
+        data: { ...data },
     });
 }
 
@@ -98,6 +100,15 @@ export async function getThreeDayNoEndAPI() {
     });
 }
 
+/**
+ * 异常监控-开启评审后3日未结束评标-数量
+ */
+export async function getThreeDayNoEndCountAPI() {
+    return request('/api/biz-service-ebtp-statistics/api/evaluation/exception/threedaynoend/count', {
+        method: 'GET',
+    });
+}
+
 /**
  * 异常监控-超过1小时未开标数量-列表
  * @param data
@@ -156,6 +167,22 @@ export async function getTodayInfoAPI() {
     });
 }
 
+/**
+ * 今日开标-评标阶段10小时未评标
+ */
+export async function getUnopenTenAPI() {
+    return request('/api/biz-service-ebtp-statistics/api/evaluation/today/unopen/ten', {
+        method: 'GET',
+    });
+}
+/**
+ * 今日开标-评标阶段6小时未评标
+ */
+export async function getUnopenSixAPI() {
+    return request('/api/biz-service-ebtp-statistics/api/evaluation/today/unopen/six', {
+        method: 'GET',
+    });
+}
 /**
  * 今日开标-解密成功率
  */
@@ -207,4 +234,15 @@ export async function getProvinceByAgencyAPI(agencyId: any) {
     return request(`/api/biz-service-ebtp-statistics/tenderAgent/getProvinceByAgency/${agencyId}`, {
         method: 'GET',
     });
+}
+/**
+ * 首页-获取评标室监控列表
+ * @param data 
+ * @returns 
+ */
+export async function getMonitorListAPI(data: any) {
+    return request('/api/biz-service-ebtp-evaluation/v1/screen/getReviewRoomList', {
+        method: 'POST',
+        data: data,
+    });
 }
\ No newline at end of file
diff --git a/src/pages/ElecEvaluation/Monitor/style.less b/src/pages/ElecEvaluation/Monitor/style.less
index 494cd08..b7497f8 100644
--- a/src/pages/ElecEvaluation/Monitor/style.less
+++ b/src/pages/ElecEvaluation/Monitor/style.less
@@ -252,8 +252,15 @@
                     background-repeat: no-repeat;
                     background-size: 100% 100%;
                     height: 120px;
-                    margin-top: 20px;
+                    margin-top: 14px;
                     position: relative;
+                    cursor: pointer;
+
+                    &:hover {
+                        -webkit-filter: brightness(108%);
+                        filter: brightness(108%);
+                    }
+
                     .flex-center;
 
                     &>img {
@@ -290,7 +297,7 @@
                     letter-spacing: 0px;
                     color: rgba(255, 255, 255, 0.87);
                     text-align: center;
-                    margin-top: 12px;
+                    margin-top: 4px;
                 }
             }
         }
@@ -470,6 +477,14 @@
                 background: rgba(255, 255, 255, 0.15);
             }
         }
+
+        .monitor-extra-pointer {
+            cursor: pointer;
+
+            &:hover {
+                text-decoration: underline;
+            }
+        }
     }
 }
 
@@ -590,6 +605,7 @@
         justify-content: space-around;
         margin-top: 10px;
 
+
         .progress-bottom-title {
             text-align: center;
 
@@ -620,6 +636,10 @@
                 color: #29F1FA;
             }
         }
+
+        .line-progress-pointer {
+            cursor: pointer;
+        }
     }
 }
 
@@ -1030,4 +1050,56 @@
     &:active {
         background-color: #12304ecc;
     }
+}
+
+.monitor-modal-list {
+    .ant-modal-body {
+        background: #12304ecc;
+
+        &::-webkit-scrollbar {
+            display: none;
+        }
+    }
+
+    .ant-modal-content {
+        background: #12304ecc;
+    }
+
+    .ant-modal-close-x {
+        color: #1B7EF2;
+    }
+
+    .monitor-modal-btn {
+        display: flex;
+        justify-content: center;
+        margin-top: 16px;
+    }
+
+    .modal-list-btn {
+        padding: 4px 15px;
+        background-color: #12304e;
+        border-radius: 20px;
+        cursor: pointer;
+        border: 1px solid #1b7ef2;
+        width: 64px;
+
+        &:hover {
+            background-color: #ffffffcc;
+        }
+
+        &>span {
+            color: #1b7ef2;
+            line-height: 16px;
+        }
+    }
+
+    .monitor-modal-empty {
+        .ant-empty-image {
+            color: #fff;
+        }
+
+        .ant-empty-description {
+            color: #fff;
+        }
+    }
 }
\ No newline at end of file
diff --git a/src/pages/ElecEvaluation/MonitorScreen/Home/style.less b/src/pages/ElecEvaluation/MonitorScreen/Home/style.less
index bd45d0d..01e6f69 100644
--- a/src/pages/ElecEvaluation/MonitorScreen/Home/style.less
+++ b/src/pages/ElecEvaluation/MonitorScreen/Home/style.less
@@ -4,7 +4,9 @@
 @screen-color: #041a6d;
 
 .screen-bg {
-    background: @screen-color;
+    // background: @screen-color;
+    background: url("~@/assets/monitor/background-2.jpg") left top no-repeat;
+    background-size: cover;
     width: 100%;
     height: 100%;
     margin: 0;
diff --git a/src/pages/userformal/login/index.tsx b/src/pages/userformal/login/index.tsx
index 4fbb8df..47eb909 100644
--- a/src/pages/userformal/login/index.tsx
+++ b/src/pages/userformal/login/index.tsx
@@ -37,7 +37,7 @@ const Index: React.FC<{}> = () => {
   const mediaStreamTrack = useRef<any>();
   const { TabPane } = Tabs;
   const [submitLoading, setSubmitLoading] = useState<boolean>(false);
-  const [faceLoginDisable, setFaceLoginDisable] = useState<boolean>(false);  
+  const [faceLoginDisable, setFaceLoginDisable] = useState<boolean>(false);
   const lv = useRef<LivingNotIE>();
   const [timerShow, setTimeShow] = useState<boolean>(false);
   const [itemShow, setItemShow] = useState<boolean>(false);
@@ -46,8 +46,8 @@ const Index: React.FC<{}> = () => {
   /**
    * 设置活体检测token
    */
-  const setLiveDetectToken = () =>{
-    let appKey= 'nkYy3g1yT0alE8pF6a1UTC4I'
+  const setLiveDetectToken = () => {
+    let appKey = 'nkYy3g1yT0alE8pF6a1UTC4I'
     let appSecrect = 'L30zHpTyAtTlY7tTCpbzdxxKCQgwWIQL'
     // Header
     var header = {
@@ -75,41 +75,41 @@ const Index: React.FC<{}> = () => {
    */
   const liveDetectStart = () => {
     liveDetectStop();
-     let _lv = new LivingNotIE(null, {
+    let _lv = new LivingNotIE(null, {
       timer: 10000,
-      action : [1,3,2],
+      action: [1, 3, 2],
       token: setLiveDetectToken(),
-      proxy:'/living/api',
-      getFacePicture:()=>{
+      proxy: '/living/api',
+      getFacePicture: () => {
         return getLiveDetectFile()
       },
       //开始活体检测，此时token已鉴权成功
-      onDetectStart:()=>{
+      onDetectStart: () => {
         setSubmitLoading(true);
       },
       //每轮检测开始
-      onDetectActionStart:(action:number)=>{
+      onDetectActionStart: (action: number) => {
         setAction(action);
         // this.drawCanvas()
       },
       //每轮检测计时
-      onDetectActionProgress:(action:number,timer:number)=>{
+      onDetectActionProgress: (action: number, timer: number) => {
         setTimer(timer);
       },
       //每轮检测结束
-      onDetectActionFinish:(action:number,data:any)=>{
+      onDetectActionFinish: (action: number, data: any) => {
         // this.clearCanvas()
         setTimer(10000);
         console.log(data)
       },
       //活体检测完成
-      onDetectFinish:(data:any)=>{
-        if(data.code == 1){
+      onDetectFinish: (data: any) => {
+        if (data.code == 1) {
           setAction(4);
           setTimeShow(false);
           //人脸比对
           hanleFaceSubmit(data.file.file, null);
-        }else{
+        } else {
           message.error('活体检测失败');
           setSubmitLoading(false);
         }
@@ -140,12 +140,12 @@ const Index: React.FC<{}> = () => {
     console.log(_imgURI);
     let _file = base64ToBlob(_imgURI);
     return {
-      file:_file//传给活体检测服务的文件
+      file: _file//传给活体检测服务的文件
     }
   }
-  const classColor = (action:any) => {
+  const classColor = (action: any) => {
     let color = '';
-    switch(action){
+    switch (action) {
       case 1:
         color = '#409eff';
         break;
@@ -161,17 +161,17 @@ const Index: React.FC<{}> = () => {
     }
     return color;
   }
-  const actionText = (action:number, timer:number) => {
+  const actionText = (action: number, timer: number) => {
     let text = '';
-    switch(action){
+    switch (action) {
       case 1:
-        text = '对准摄像头眨眨眼（'+ timer + 's）';
+        text = '对准摄像头眨眨眼（' + timer + 's）';
         break;
       case 2:
-        text = '对准摄像头张张嘴（'+ timer + 's）';
+        text = '对准摄像头张张嘴（' + timer + 's）';
         break;
       case 3:
-        text = '对准摄像头摇摇头（'+ timer + 's）';
+        text = '对准摄像头摇摇头（' + timer + 's）';
         break;
       case 4:
         text = '请稍候，正在验证中...';
@@ -428,7 +428,7 @@ const Index: React.FC<{}> = () => {
     return new Blob([uInt8Array], { type: contentType });
   };
 
-  const IELiveDetectFinish2 = async(data:any) => {
+  const IELiveDetectFinish2 = async (data: any) => {
     console.log(data);
     setAction(4);
     hanleFaceSubmit(data, null);
@@ -436,17 +436,17 @@ const Index: React.FC<{}> = () => {
 
   //IELiveDetectFinish
   const IELiveDetectFinish = async (data: any) => {
-    if(data.code != 0){
+    if (data.code != 0) {
       console.log(data);
       setAction(4);
       hanleFaceSubmit(data.file.file, null);
-    }else{
+    } else {
       message.error('活体检测失败');
       setSubmitLoading(false);
     }
   }
 
-  const UpdateDetectStatus = async(action:number, timer:number)=>{
+  const UpdateDetectStatus = async (action: number, timer: number) => {
     setSubmitLoading(true);
     setAction(action);
     setTimer(timer);
@@ -563,7 +563,7 @@ const Index: React.FC<{}> = () => {
                   </Form.Item>
                 </Form>
               </TabPane>
-              <TabPane tab="人脸识别登录" key="2" disabled={faceLoginDisable}>
+              {/* <TabPane tab="人脸识别登录" key="2" disabled={faceLoginDisable}>
                 <Form
                   name="basic2"
                   className="form-box"
@@ -585,25 +585,27 @@ const Index: React.FC<{}> = () => {
                       placeholder="请输入用户名"
                     />
                   </Form.Item>
-                  {/* 加载摄像头 */}
-                  {/* <Form.Item hidden={!itemShow}>
-                    <div>
-                      <span style={{color:classColor(action)}}>{actionText(action)}</span>
-                      <span hidden={!timerShow}>{Math.round(timer/1000)}</span>
-                    </div>
-                  </Form.Item> */}
+                  
                   <Form.Item>
                     {!whetherIE.current ? (<video ref={video} width="382" height="200"></video>) : (<FrameFaceLogin faceCompareEvent2={IELiveDetectFinish2} faceCompareEvent={IELiveDetectFinish} faceDetectStatusEvent = {UpdateDetectStatus}/>)}
-                    {/* <video ref={video} width="382" height="200"></video> */}
                   </Form.Item>
                   <Form.Item>
-                    {/* onClick={() => {hanleFaceSubmit(null, null);}} */}
+                    
                     <Button type="primary" className="w100" loading={submitLoading} htmlType="submit">
                       {submitLoading ? actionText(action, Math.round(timer/1000)) : '登 录'}
                     </Button>
                   </Form.Item>
                 </Form>
-              </TabPane>
+              </TabPane> */}
+              {/* 加载摄像头 */}
+              {/* <Form.Item hidden={!itemShow}>
+                    <div>
+                      <span style={{color:classColor(action)}}>{actionText(action)}</span>
+                      <span hidden={!timerShow}>{Math.round(timer/1000)}</span>
+                    </div>
+                  </Form.Item> */}
+              {/* <video ref={video} width="382" height="200"></video> */}
+              {/* onClick={() => {hanleFaceSubmit(null, null);}} */}
             </Tabs>
           </div>
         </div>