在线监督、事后监督静态页面开发完成

src/pages/VideoMonitor/Online/components/OnlineSupervision.tsx

@@ -43,7 +43,7 @@ const OnlineSupervision: React.FC<{}> = () => {
 
     //在线监督
     function supervision(record: any): void {
-        message.
+        message.warn('功能开发中....');
     }
 
     const columns: ProColumns<any>[] = [

src/pages/VideoMonitor/Post/index.tsx

@@ -1,6 +1,6 @@
 import { isNotEmpty } from '@/utils/CommonUtils';
 import ProTable, { ActionType, ProColumns } from '@ant-design/pro-table';
-import { Button, Spin } from 'antd';
+import { Button, Spin, message } from 'antd';
 import React, { useRef, useState } from 'react';
 import { useHistory } from 'umi';
 import ViewModal from '../ViewModal';
@@ -43,7 +43,7 @@ const PostSupervision: React.FC<{}> = () => {
 
     //评标监控回看
     function reviewMonitor(record: any): void {
-        throw new Error('Function not implemented.');
+        message.warn('功能开发中....');
     }
 
     const columns: ProColumns<any>[] = [

src/pages/VideoMonitor/ViewModal.tsx

@@ -1,12 +1,42 @@
-import { Spin, Modal } from 'antd';
+import { Spin, Modal, Descriptions, Table } from 'antd';
+import type { ColumnsType } from 'antd/es/table';
 import React, { useState } from 'react';
-import JgtzsModal from '../ZYuShen/Calibration/ProjectManager/ResultNotice/components/JgtzsModal';
 
 interface ViewDetailsProps {
     modalVisible: boolean; //开启关闭控制
     onCancel: () => void; //关闭方法传入
     data: any //数据传入
-  }
+}
+
+interface DataType {
+    key: string;
+    userName: string;
+    reportStatus: string;
+    reportTime: string;
+}
+
+const columns: ColumnsType<DataType> = [
+    {
+        title: '序号',
+        dataIndex: 'key',
+        key: 'key',
+    },
+    {
+      title: '人员',
+      dataIndex: 'userName',
+      key: 'userName',
+    },
+    {
+      title: '报到状态',
+      dataIndex: 'reportStatus',
+      key: 'reportStatus',
+    },
+    {
+      title: '报到时间',
+      dataIndex: 'reportTime',
+      key: 'reportTime',
+    },
+  ];
 
 /**
  * 详情弹出层
@@ -15,6 +45,53 @@ interface ViewDetailsProps {
  const ViewDetails: React.FC<ViewDetailsProps> = (props) => {
         const {modalVisible, onCancel, data} = props;
         const [spin, spinSet] = useState<boolean>(false);
+        const repostData :DataType[] = [
+            {
+            key: '1',
+            userName: '1(0001)',
+            reportStatus: '已报道',
+            reportTime: '2022-07-02 15:22',
+            },
+            {
+                key: '2',
+                userName: '2(0002)',
+                reportStatus: '已报道',
+                reportTime: '2022-07-02 15:22',
+            },
+            {
+                key: '3',
+                userName: '3(0003)',
+                reportStatus: '已报道',
+                reportTime: '2022-07-02 15:22',
+            },
+            {
+                key: '4',
+                userName: '4(0004)',
+                reportStatus: '未报道',
+                reportTime: '2022-07-02 15:22',
+            },
+            {
+                key: '5',
+                userName: '5(0005)',
+                reportStatus: '已报道',
+                reportTime: '2022-07-02 15:22',
+            },
+        ];
+        const getStateName = (state:any) => {
+            let result = null;
+            switch(state){
+                case 0:
+                    result = '未开始';
+                    break;
+                case 1:
+                    result = '评标中';
+                    break;
+                case 2:
+                    result = '已结束';
+                    break;
+            }
+            return result;
+        }
         return (<Modal
                     destroyOnClose = {true}
                     visible = {modalVisible}
@@ -27,12 +104,23 @@ interface ViewDetailsProps {
                     width={1000}
                 >
                     
-                    <Spin spinning={spin}></Spin>
+                    <Spin spinning={spin}>
-                    <p>Some contents...</p>
+                        <Descriptions>
-                    <p>Some contents...</p>
+                            <Descriptions.Item label="项目编号">{data?.projectNumber}</Descriptions.Item>
-                    <p>Some contents...</p>
+                            <Descriptions.Item label="标段名称">{data?.sectionName}</Descriptions.Item>
-                    <p>Some contents...</p>
+                            <Descriptions.Item label="评标室名称">{data?.reviewRoomName}</Descriptions.Item>
-                    <p>Some contents...</p>
+                            <Descriptions.Item label="评标状态">{getStateName(data?.state)}</Descriptions.Item>
+                            <Descriptions.Item label="预计开始时间">{data?.startTime}</Descriptions.Item>
+                            <Descriptions.Item label="预计结束时间">{data?.endTime}</Descriptions.Item>
+                            <Descriptions.Item label="开启评标室时间">2022-07-13 12:30</Descriptions.Item>
+                            <Descriptions.Item label="关闭评标室时间" span={2}>2022-07-15 15:00</Descriptions.Item>
+                            <Descriptions.Item label="专家人数">5人</Descriptions.Item>
+                            <Descriptions.Item label="采购人代表">2人</Descriptions.Item>
+                            <Descriptions.Item label="招标代理机构">1人</Descriptions.Item>
+                        </Descriptions>
+                        <h3>报道信息</h3>
+                        <Table columns={columns} dataSource={repostData} />
+                    </Spin>
             </Modal>)
 }
 export default ViewDetails;