在线监督、事后监督开发基本完成

2022-08-23 17:32:56 +08:00
parent 8c7c3ea7d6
commit 2f5b0a3bb4
6 changed files with 165 additions and 95 deletions
--- a/src/pages/VideoMonitor/Online/components/OnlineSupervision.tsx
+++ b/src/pages/VideoMonitor/Online/components/OnlineSupervision.tsx
@ -1,18 +1,11 @@
 import { isNotEmpty } from '@/utils/CommonUtils';
-import ProTable, { ActionType, ProColumns } from '@ant-design/pro-table';
+import ProTable, { ProColumns } from '@ant-design/pro-table';
 import { Button, Spin, message } from 'antd';
 import React, { useRef, useState } from 'react';
 import { useHistory } from 'umi';
 import ViewModal from '../../ViewModal';
 import { getPage } from '../../service';

-interface ViewDetailsProps {
-    entity?: {
-        projectName?:string|null,
-        projectNumber?:string|null,
-    } | null,
-    visibleDefault?:boolean| false,
-}
 /**
 * 在线监督列表
 * @returns 
@ -20,21 +13,18 @@ interface ViewDetailsProps {
 const OnlineSupervision: React.FC<{}> = () => {
    const [spin, spinSet] = useState<boolean>(false);
    const [visible, setVisible] = useState<boolean>(false);
-    const [record, setRecord] = useState<any[]>([]);
    //查询分页数据
    const [pageData, pageDataSet] = useState<any>({
        pageNo: 1,
        pageSize: 10
    });
    const history = useHistory();
-    const ref = useRef<ActionType>();
-
+    const viewModalRef = useRef(null);
    //查看详情
    const viewDetails = (record: any) => {
        setVisible(true);
-        setRecord(record);
+        viewModalRef.current?.InitData(record.id);
    }
-
    //关闭
    const closeViewDetails = () => {
        setVisible(false);
@ -157,7 +147,6 @@ const OnlineSupervision: React.FC<{}> = () => {
                    options={false}
                    bordered={false}
                    size='small'
-                    actionRef={ref}
                    search={{ labelWidth: 'auto', span: 6 }}
                    loading={false}
                    request={async (params) => {
@ -195,7 +184,7 @@ const OnlineSupervision: React.FC<{}> = () => {
                    rowKey={"id"}
                />
            </div>
-            <ViewModal modalVisible = {visible} onCancel = {()=> closeViewDetails()} data = {record}/>
+            <ViewModal modalVisible = {visible} onCancel = {()=> closeViewDetails()} ref = {viewModalRef}/>
        </Spin>
    )
 }
--- a/src/pages/VideoMonitor/Online/components/ReservedItems.tsx
+++ b/src/pages/VideoMonitor/Online/components/ReservedItems.tsx
@ -1,6 +1,6 @@
 import { isNotEmpty } from '@/utils/CommonUtils';
-import ProTable, { ActionType, ProColumns } from '@ant-design/pro-table';
-import { Button, Spin, Modal } from 'antd';
+import ProTable, { ProColumns } from '@ant-design/pro-table';
+import { Button, Spin } from 'antd';
 import React, { useRef, useState } from 'react';
 import { useHistory } from 'umi';
 import ViewModal from '../../ViewModal';
@ -14,19 +14,18 @@ const ReservedItems: React.FC<{}> = () => {

    const [spin, spinSet] = useState<boolean>(false);
    const [visible, setVisible] = useState(false);
-    const [record, setRecord] = useState<any[]>([]);
    //查询分页数据
    const [pageData, pageDataSet] = useState<any>({
        pageNo: 1,
        pageSize: 10
    });
    const history = useHistory();
-    const ref = useRef<ActionType>();
+    const viewModalRef = useRef(null);
    
    //查看详情
    const viewDetails = (record: any) => {
        setVisible(true);
-        setRecord(record);
+        viewModalRef.current?.InitData(record.id);
    }

    //关闭
@ -137,7 +136,6 @@ const ReservedItems: React.FC<{}> = () => {
                    options={false}
                    bordered={false}
                    size='small'
-                    actionRef={ref}
                    search={{ labelWidth: 'auto', span: 6 }}
                    loading={false}
                    request={async (params) => {
@ -175,7 +173,7 @@ const ReservedItems: React.FC<{}> = () => {
                    rowKey={"id"}
                />
            </div>
-            <ViewModal modalVisible = {visible} onCancel = {()=> closeViewDetails()} data = {record}/>
+            <ViewModal modalVisible = {visible} onCancel = {()=> closeViewDetails()} ref = {viewModalRef}/>
        </Spin>
    )
 }
--- a/src/pages/VideoMonitor/Online/service.ts
+++ b/src/pages/VideoMonitor/Online/service.ts
@ -0,0 +1,11 @@
+import request from '@/utils/request';
+/**
+ * 查询数据并分页
+ * @param params 
+ */
+export async function getPage(params?: any) {
+  return request('/api/biz-service-ebtp-evaluation//v1/eval/room/reserve/supervise/list', {
+    method: 'POST',
+    data: params,
+  });
+}
--- a/src/pages/VideoMonitor/Post/index.tsx
+++ b/src/pages/VideoMonitor/Post/index.tsx
@ -1,5 +1,5 @@
 import { isNotEmpty } from '@/utils/CommonUtils';
-import ProTable, { ActionType, ProColumns } from '@ant-design/pro-table';
+import ProTable, { ProColumns } from '@ant-design/pro-table';
 import { Button, Spin, message } from 'antd';
 import React, { useRef, useState } from 'react';
 import { useHistory } from 'umi';
@ -13,19 +13,18 @@ import { getPage } from '../service';
 const PostSupervision: React.FC<{}> = () => {
    const [spin, spinSet] = useState<boolean>(false);
    const [visible, setVisible] = useState<boolean>(false);
-    const [record, setRecord] = useState<any[]>([]);
    //查询分页数据
    const [pageData, pageDataSet] = useState<any>({
        pageNo: 1,
        pageSize: 10
    });
    const history = useHistory();
-    const ref = useRef<ActionType>();
+    const viewModalRef = useRef(null);

    //查看详情
    const viewDetails = (record: any) => {
        setVisible(true);
-        setRecord(record);
+        viewModalRef.current?.InitData(record.id);
    }

    //关闭
@ -150,7 +149,6 @@ const PostSupervision: React.FC<{}> = () => {
                    options={false}
                    bordered={false}
                    size='small'
-                    actionRef={ref}
                    search={{ labelWidth: 'auto', span: 6 }}
                    loading={false}
                    request={async (params) => {
@ -188,7 +186,7 @@ const PostSupervision: React.FC<{}> = () => {
                    rowKey={"id"}
                />
            </div>
-            <ViewModal modalVisible = {visible} onCancel = {()=> closeViewDetails()} data = {record}/>
+            <ViewModal modalVisible = {visible} onCancel = {()=> closeViewDetails()} ref = {viewModalRef}/>
        </Spin>
    )
 }
--- a/src/pages/VideoMonitor/ViewModal.tsx
+++ b/src/pages/VideoMonitor/ViewModal.tsx
@ -1,18 +1,38 @@
-import { Spin, Modal, Descriptions, Table } from 'antd';
+import { Spin, Modal, Descriptions, Table, message } from 'antd';
 import type { ColumnsType } from 'antd/es/table';
-import React, { useState } from 'react';
+import React, { useState, useImperativeHandle, forwardRef } from 'react';
+import { getReservationInfo, getReportInfo } from './service';

 interface ViewDetailsProps {
    modalVisible: boolean; //开启关闭控制
    onCancel: () => void; //关闭方法传入
-    data: any //数据传入
+}
+
+interface ReportInfo {
+    expertAmount ?: string;
+    purchaseExpertAmount ?: string;
+    manageAmount ?: string;
+    userList ?: DataType[];
 }

 interface DataType {
-    key: string;
-    userName: string;
-    reportStatus: string;
-    reportTime: string;
+    key ?: string;
+    userName ?: string;
+    status: number;
+    reportStatus ?: string;
+    signDate ?: string;
+}
+
+interface ReservationInfo {
+    projectName ?: string;
+    projectNum ?: string;
+    packageNames ?: string;
+    areaName ?: string;
+    reserveStartDate ?: string;
+    reserveEndDate ?: string;
+    status: number;
+    realStartDate ?: string;
+    realEndDate ?: string;
 }

 const columns: ColumnsType<DataType> = [
@ -33,8 +53,8 @@ const columns: ColumnsType<DataType> = [
    },
    {
      title: '报到时间',
-      dataIndex: 'reportTime',
-      key: 'reportTime',
+      dataIndex: 'signDate',
+      key: 'signDate',
    },
  ];

@ -42,53 +62,87 @@ const columns: ColumnsType<DataType> = [
 * 详情弹出层
 * @returns 
 */
- 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;
+ const ViewDetails: React.FC<ViewDetailsProps> = forwardRef((props,ref) => {
+        const {modalVisible, onCancel} = props;
+        const [initReservationInfo, setInitReservationInfo] = useState<boolean>(false);
+        const [initReportInfo, setInitReportInfo] = useState<boolean>(false);
+        const [reservationInfo, setReservationInfo] = useState<ReservationInfo>();
+        const [reportInfo, setReportInfo] = useState<ReportInfo>();
+        const InitData = (id:string) => {
+            setInitReservationInfo(true);
+            setInitReportInfo(true);
+            //获取预约信息
+            getReservationInfo(id)
+            .then((res) => {
+                if (res.code == 200) {
+                    setReservationInfo(res.data);
+                }else{
+                    message.error(res.message);
+                }
+            })
+            .catch(res => {
+                message.error(res.message);
+            })
+            .finally(() => {
+                setInitReservationInfo(false);
+            });
+            //获取报道信息
+            getReportInfo(id)
+            .then((res) => {
+                if (res.code == 200) {
+                    let _data: DataType[] = res.data.userList;
+                    _data?.forEach((item, index) =>{
+                        item.key = (index + 1).toString();
+                        item.reportStatus = getReportStatus(item.status);
+                    })
+                    setReportInfo(res.data);
+                }else{
+                    message.error(res.message);
+                }
+            })
+            .catch(res => {
+                message.error(res.message);
+            })
+            .finally(() => {
+                setInitReportInfo(false);
+            })
+        }
+        useImperativeHandle(ref, () => ({
+            InitData,
+        }));
+        const getStatus = (state: number) => {
+            let result = '';
            switch(state){
+                case -1: 
+                    result = '待确认';
+                    break;
                case 0: 
-                    result = '未开始';
+                    result = '未开启';
                    break;
                case 1: 
-                    result = '评标中';
+                    result = '进行中';
                    break;
                case 2: 
                    result = '已结束';
                    break;
+                case 3: 
+                    result = '已取消';
+                    break;
+                case 4: 
+                    result = '结束为使用';
+                    break;   
+            }
+            return result;
+        }
+        const getReportStatus = (state:number) => {
+            let result = '';
+            switch(state){
+                case 0: 
+                    result = '未报道';
+                    break;
+                case 1: 
+                    result = '已报道';
+                    break;   
            }
            return result;
        }
@ -98,30 +152,30 @@ const columns: ColumnsType<DataType> = [
                    onCancel = {() => {onCancel()}}        
                    title={<div>
                        <span>详情</span>
-                        <span style={{textAlign: "center",width: "100%",position: "absolute",left: 0}}>{data?.projectName}</span>
+                        <span style={{textAlign: "center",width: "100%",position: "absolute",left: 0}}>{reservationInfo?.projectName}</span>
                        </div>}
                    footer={null}
                    width={1000}
                >
                    
-                    <Spin spinning={spin}>
+                    <Spin spinning={initReservationInfo || initReportInfo}>
                        <Descriptions>
-                            <Descriptions.Item label="项目编号">{data?.projectNumber}</Descriptions.Item>
-                            <Descriptions.Item label="标段名称">{data?.sectionName}</Descriptions.Item>
-                            <Descriptions.Item label="评标室名称">{data?.areaRoomName}</Descriptions.Item>
-                            <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.Item label="项目编号">{reservationInfo?.projectNum}</Descriptions.Item>
+                            <Descriptions.Item label="标段名称">{reservationInfo?.packageNames}</Descriptions.Item>
+                            <Descriptions.Item label="评标室名称">{reservationInfo?.areaName}</Descriptions.Item>
+                            <Descriptions.Item label="评标状态">{reservationInfo?getStatus(reservationInfo?.status):''}</Descriptions.Item>
+                            <Descriptions.Item label="预计开始时间">{reservationInfo?.reserveStartDate}</Descriptions.Item>
+                            <Descriptions.Item label="预计结束时间">{reservationInfo?.reserveEndDate}</Descriptions.Item>
+                            <Descriptions.Item label="开启评标室时间">{reservationInfo?.realStartDate}</Descriptions.Item>
+                            <Descriptions.Item label="关闭评标室时间" span={2}>{reservationInfo?.realEndDate}</Descriptions.Item>
+                            <Descriptions.Item label="专家人数">{reportInfo?.expertAmount}人</Descriptions.Item>
+                            <Descriptions.Item label="采购人代表">{reportInfo?.purchaseExpertAmount}人</Descriptions.Item>
+                            <Descriptions.Item label="招标代理机构">{reportInfo?.manageAmount}人</Descriptions.Item>
                        </Descriptions>
                        <h3>报道信息</h3>
-                        <Table columns={columns} dataSource={repostData} />
+                        <Table columns={columns} dataSource={reportInfo?.userList} />
                    </Spin>
            </Modal>)
-}
+})
 export default ViewDetails;

--- a/src/pages/VideoMonitor/service.ts
+++ b/src/pages/VideoMonitor/service.ts
@ -4,8 +4,28 @@ import request from '@/utils/request';
 * @param params 
 */
 export async function getPage(params?: any) {
-  return request('/api/biz-service-ebtp-evaluation//v1/eval/room/reserve/supervise/list', {
+  return request('/api/biz-service-ebtp-evaluation/v1/eval/room/reserve/supervise/list', {
    method: 'POST',
    data: params,
  });
 }
+
+/**
+ * 查询预约信息
+ * @param params 
+ */
+ export async function getReservationInfo(params?: string) {
+  return request('/api/biz-service-ebtp-evaluation/v1/eval/room/reserve/' + params, {
+    method: 'GET'
+  });
+}
+
+/**
+ * 查询报道信息
+ * @param params 
+ */
+ export async function getReportInfo(params?: string) {
+  return request('/api/biz-service-ebtp-evaluation/v1/eleceval/user/number/report/' + params, {
+    method: 'GET'
+  });
+}