添加loading

src/components/BlockLossManage/index.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useRef } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
-import { Form, Input, Button, Table, Row, Col, Select, Modal, DatePicker, Space, message } from 'antd';
+import { Form, Input, Button, Table, Row, Col, Select, Modal, DatePicker, Space, message,Spin } from 'antd';
 import moment from "moment";
 import "moment/locale/zh-cn"
 import '@common/common.less';
@@ -12,12 +12,13 @@ import { getValueFromEvent, disabledDate, getDaysBetween } from '@utils/index'
 const { post, api, xPost } = apiObj;
 const { Option } = Select;
 function BlockLossManage() {
-    
+
     const [blockList, setBlockList] = useState([]);
     const [total, setTotal] = useState(0);
     const [title, setTitle] = useState(0);
     const [visible, setVisible] = useState(false);
     const [size, setSize] = useState(15);
+    const [loading, setLoading] = useState(false);
     const [current, setCurrent] = useState(1);
     const [type, setType] = useState(null);
     const [blockData, setBlockData] = useState({});
@@ -46,8 +47,8 @@ function BlockLossManage() {
         endDate: getCurrentData().split('/').join('-') + ' 23:59:59'
     }
     const { lossNum } = useSelector((state) => {
-		return state.userInfo;
-	});
+        return state.userInfo;
+    });
     useEffect(() => {
         form.resetFields();
         getBlockLossPage();
@@ -55,12 +56,18 @@ function BlockLossManage() {
     }, [lossNum]);
     //表格数据
     function getBlockLossPage(param) {
+        setLoading(true)
         post(api.getBlockLossPage, param || params).then((res) => {
             if (res.data.code === 200) {
                 const data = res.data.data;
+                setLoading(false)
                 setBlockList(data.records);
                 setTotal(data.total)
+            }else {
+                setLoading(false)
             }
+        }).catch((err) => {
+            setLoading(false)
         })
     }
     //丢失量分类汇总
@@ -367,22 +374,24 @@ function BlockLossManage() {
                         </Col>
                     </Row>
                 </div>
-                <Table
-                    columns={columns}
-                    scroll={{ y: 'calc(100vh - 520px)' }}
-                    dataSource={blockList}
-                    rowKey={record => record.id}
-                    pagination={{
-                        pageSize: size,
-                        size: 'small',
-                        current: current,
-                        showSizeChanger: true,
-                        pageSizeOptions: ['15', '30', '60', '120'],
-                        showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条数据`,
-                        onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize), // 改变每页数量时更新显示
-                        onChange: (page, pageSize) => changePage(page, pageSize),//点击页码事件
-                        total: total
-                    }} />
+                <Spin tip="加载中..." spinning={loading}>
+                    <Table
+                        columns={columns}
+                        scroll={{ y: 'calc(100vh - 520px)' }}
+                        dataSource={blockList}
+                        rowKey={record => record.id}
+                        pagination={{
+                            pageSize: size,
+                            size: 'small',
+                            current: current,
+                            showSizeChanger: true,
+                            pageSizeOptions: ['15', '30', '60', '120'],
+                            showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条数据`,
+                            onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize), // 改变每页数量时更新显示
+                            onChange: (page, pageSize) => changePage(page, pageSize),//点击页码事件
+                            total: total
+                        }} />
+                </Spin>
             </div>
             {visible && blockDetail ?
                 <Modal

src/components/FieldProblem/index.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useRef } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
-import { Form, Input, Button, Table, Row, Col, Select, Modal, DatePicker, Space, message } from 'antd';
+import { Form, Input, Button, Table, Row, Col, Select, Modal, DatePicker, Space, message, Spin } from 'antd';
 import '@common/common.less';
 import moment from "moment";
 import "moment/locale/zh-cn"
@@ -12,13 +12,14 @@ import { getValueFromEvent, disabledDate, getDaysBetween } from '@utils/index'
 const { post, api, xPost } = apiObj;
 const { Option } = Select;
 function FieldProblem() {
-    
+
     const [logList, setLogList] = useState([]);
     const [total, setTotal] = useState(0);
     const [type, setType] = useState(0);//1新增 2修改
     const [visible, setVisible] = useState(false);
     const [size, setSize] = useState(15);
     const [current, setCurrent] = useState(1);
+    const [loading, setLoading] = useState(false);
     const [probleData, setProbleData] = useState({});
     const [problemDetail, setProblemDetail] = useState(null);//详情数据
     const [title, setTitle] = useState();//正则式数据
@@ -47,8 +48,8 @@ function FieldProblem() {
         behospitalEndDate: getCurrentData().split('/').join('-') + ' 23:59:59'
     }
     const { problemNum } = useSelector((state) => {
-		return state.userInfo;
-	});
+        return state.userInfo;
+    });
     useEffect(() => {
         form.resetFields();
         getColumnResultPage();
@@ -57,12 +58,18 @@ function FieldProblem() {
     }, [problemNum]);
     //表格数据
     function getColumnResultPage(param) {
+        setLoading(true)
         post(api.getColumnResultPage, param || params).then((res) => {
             if (res.data.code === 200) {
                 const data = res.data.data;
                 setLogList(data.records);
                 setTotal(data.total)
+                setLoading(false)
+            } else {
+                setLoading(false)
             }
+        }).catch((err) => {
+            setLoading(false)
         })
     }
     function getColumnResultNumber(param) {
@@ -258,17 +265,15 @@ function FieldProblem() {
                                 <Input placeholder="请输入" autoComplete='off' allowClear maxLength='30' />
                             </Form.Item>
                         </Col>
-                        <Col span={5} key={4}>
-                            <Form.Item label="质控模块名称" name="modeName" >
-                                <Select showSearch allowClear onSearch={onSearch} placeholder="请选择">
-                                    {modeList.map((item, i) => {
-                                        return (
-                                            <Option value={item} key={i}>{item}</Option>
-                                        )
-                                    })}
-                                </Select>
-                            </Form.Item>
-                        </Col>
+                        <Form.Item label="质控模块名称" name="modeName" >
+                            <Select showSearch allowClear onSearch={onSearch} placeholder="请选择" style={{ width: '159px' }}>
+                                {modeList.map((item, i) => {
+                                    return (
+                                        <Option value={item} key={i}>{item}</Option>
+                                    )
+                                })}
+                            </Select>
+                        </Form.Item>
                         <Col span={4} key={5}>
                             <Form.Item label="问题类型" name="type">
                                 <Select
@@ -354,22 +359,24 @@ function FieldProblem() {
                         </Col>
                     </Row>
                 </div>
-                <Table
-                    columns={columns}
-                    scroll={{ y: 'calc(100vh - 570px)' }}
-                    dataSource={logList}
-                    rowKey={record => record.id}
-                    pagination={{
-                        pageSize: size,
-                        size: 'small',
-                        current: current,
-                        showSizeChanger: true,
-                        pageSizeOptions: ['15', '30', '60', '120'],
-                        showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条数据`,
-                        onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize), // 改变每页数量时更新显示
-                        onChange: (page, pageSize) => changePage(page, pageSize),//点击页码事件
-                        total: total
-                    }} />
+                <Spin tip="加载中..." spinning={loading}>
+                    <Table
+                        columns={columns}
+                        scroll={{ y: 'calc(100vh - 570px)' }}
+                        dataSource={logList}
+                        rowKey={record => record.id}
+                        pagination={{
+                            pageSize: size,
+                            size: 'small',
+                            current: current,
+                            showSizeChanger: true,
+                            pageSizeOptions: ['15', '30', '60', '120'],
+                            showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条数据`,
+                            onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize), // 改变每页数量时更新显示
+                            onChange: (page, pageSize) => changePage(page, pageSize),//点击页码事件
+                            total: total
+                        }} />
+                </Spin>
             </div>
 
             {visible && problemDetail ?

src/components/FieldRules/index.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useRef } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
-import { Form, Input, Button, Table, Row, Col, Select, Modal, DatePicker, Space, message } from 'antd';
+import { Form, Input, Button, Table, Row, Col, Select, Modal, Spin, Space, message } from 'antd';
 import { PlusOutlined } from '@ant-design/icons';
 import '@common/common.less';
 import apiObj from '@api/index';
@@ -18,6 +18,7 @@ function FieldRules() {
     const [visible, setVisible] = useState(false);
     const [size, setSize] = useState(15);
     const [current, setCurrent] = useState(1);
+    const [loading, setLoading] = useState(false);
     const [regularList, setRegularList] = useState([]);//正则式数据
     const [selectedRowKeys, setSelectedRowKeys] = useState([]);
     const [tableList, setTableList] = useState([]);//表名称
@@ -51,12 +52,18 @@ function FieldRules() {
     }, [rulerNum]);
     //表格数据
     function getColumnVerifyPage(param) {
+        setLoading(true)
         post(api.getColumnVerifyPage, param || params).then((res) => {
             if (res.data.code === 200) {
                 const data = res.data.data;
+                setLoading(false)
                 setLogList(data.records);
                 setTotal(data.total)
+            } else {
+                setLoading(false)
             }
+        }).catch((err) => {
+            setLoading(false)
         })
     }
     //获取正则式名称
@@ -466,24 +473,25 @@ function FieldRules() {
                     </Space>
 
                 </div>
-
-                <Table
-                    columns={columns}
-                    rowSelection={rowSelection}
-                    scroll={{ y: 'calc(100vh - 430px)' }}
-                    dataSource={logList}
-                    rowKey={record => record.columnId}
-                    pagination={{
-                        pageSize: size,
-                        size: 'small',
-                        current: current,
-                        showSizeChanger: true,
-                        pageSizeOptions: ['15', '30', '60', '120'],
-                        showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条数据`,
-                        onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize), // 改变每页数量时更新显示
-                        onChange: (page, pageSize) => changePage(page, pageSize),//点击页码事件
-                        total: total
-                    }} />
+                <Spin tip="加载中..." spinning={loading}>
+                    <Table
+                        columns={columns}
+                        rowSelection={rowSelection}
+                        scroll={{ y: 'calc(100vh - 430px)' }}
+                        dataSource={logList}
+                        rowKey={record => record.columnId}
+                        pagination={{
+                            pageSize: size,
+                            size: 'small',
+                            current: current,
+                            showSizeChanger: true,
+                            pageSizeOptions: ['15', '30', '60', '120'],
+                            showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条数据`,
+                            onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize), // 改变每页数量时更新显示
+                            onChange: (page, pageSize) => changePage(page, pageSize),//点击页码事件
+                            total: total
+                        }} />
+                </Spin>
             </div>
             <Modal
                 title="删除字段校验规则"

src/components/RegularManage/index.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useRef } from 'react';
 import { useSelector } from 'react-redux';
-import { Form, Input, Button, Table, Row, Col, Select, Modal, DatePicker, Space } from 'antd';
+import { Form, Input, Button, Table, Row, Col, Spin, Modal, Space } from 'antd';
 import { PlusOutlined } from '@ant-design/icons';
 import { getValueFromEvent } from '@utils/index'
 import '@common/common.less';
@@ -10,12 +10,13 @@ import RegularContext from './regular-context';
 import { message } from "antd/lib/index";
 const { post, api, xPost } = apiObj;
 function RegularManage() {
-    
+
     const [regularList, setRegularList] = useState([]);
     const [total, setTotal] = useState(0);
     const [title, setTitle] = useState();
     const [tip, setTip] = useState();
     const [flag, setFlag] = useState(0);
+    const [loading, setLoading] = useState(false);
     const [type, setType] = useState(0);//1新增 2修改
     const [visible, setVisible] = useState(false);
     const [delvisible, setDelVisible] = useState(false);
@@ -37,20 +38,26 @@ function RegularManage() {
         desc: ['dri.gmt_create']
     }
     const { regularNum } = useSelector((state) => {
-		return state.userInfo;
-	});
+        return state.userInfo;
+    });
     useEffect(() => {
         form.resetFields();
         getRegularPage();
     }, [regularNum]);
     //表格数据
     function getRegularPage(param) {
+        setLoading(true)
         post(api.getRegularPage, param || params).then((res) => {
             if (res.data.code === 200) {
                 const data = res.data.data;
+                setLoading(false)
                 setRegularList(data.records);
                 setTotal(data.total)
+            } else {
+                setLoading(false)
             }
+        }).catch((err) => {
+            setLoading(false)
         })
     }
     //判断正则是否关联
@@ -232,24 +239,25 @@ function RegularManage() {
                     </Space>
 
                 </div>
-
-                <Table
-                    columns={columns}
-                    rowSelection={rowSelection}
-                    scroll={{ y: 'calc(100vh - 380px)' }}
-                    dataSource={regularList}
-                    rowKey={record => record.id + '-' + record.relation}
-                    pagination={{
-                        pageSize: size,
-                        size: 'small',
-                        current: current,
-                        showSizeChanger: true,
-                        pageSizeOptions: ['15', '30', '60', '120'],
-                        showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条数据`,
-                        onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize), // 改变每页数量时更新显示
-                        onChange: (page, pageSize) => changePage(page, pageSize),//点击页码事件
-                        total: total
-                    }} />
+                <Spin tip="加载中..." spinning={loading}>
+                    <Table
+                        columns={columns}
+                        rowSelection={rowSelection}
+                        scroll={{ y: 'calc(100vh - 380px)' }}
+                        dataSource={regularList}
+                        rowKey={record => record.id + '-' + record.relation}
+                        pagination={{
+                            pageSize: size,
+                            size: 'small',
+                            current: current,
+                            showSizeChanger: true,
+                            pageSizeOptions: ['15', '30', '60', '120'],
+                            showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条数据`,
+                            onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize), // 改变每页数量时更新显示
+                            onChange: (page, pageSize) => changePage(page, pageSize),//点击页码事件
+                            total: total
+                        }} />
+                </Spin>
             </div>
 
             {visible && regularDetail ?