(+)巡检记录筛选

web/client/src/sections/patrolManage/containers/patrolRecord.js

@@ -3,14 +3,14 @@
 
 import React, { useEffect, useState } from 'react';
 import { connect } from 'react-redux';
-import { Form, Input, Select, Button, Table, Modal, DatePicker } from 'antd';
+import { Form, Input, Select, Button, Table, Modal, DatePicker, Checkbox, Row, Col } from 'antd';
 import moment from "moment";
 
 const PatrolRecord = (props) => {
     const { dispatch, actions, } = props
     const { patrolManage } = actions
     const [tableList, settableList] = useState([])
-    const [addModel, setAddModel] = useState(false)
+    const [showDetailModal, setShowDetail] = useState(false)
     const [modelData, setModelData] = useState({})
     const [query, setQuery] = useState({ limit: 10, page: 0 })
     const [limits, setLimits] = useState()
@@ -22,80 +22,82 @@ const PatrolRecord = (props) => {
     }, [])
 
     const record = (params) => {
-        dispatch(patrolManage.records(`patrolRecord/all/${params.time[0]}/${params.time[1]}/${params.state}/1`)).then(res => {
+        dispatch(patrolManage.records(`patrolRecord/all/${params.time[0]}/${params.time[1]}/${params.state}/null`)).then(res => {
             if (res.success) {
-                settableList(res.payload.data?.map(v => ({ ...v, key: v.id })))
+                settableList(params.name != null ? res.payload.data?.filter(v =>
+                    (v.points.user.name.indexOf(params.name) != -1 || v.points.project.name.indexOf(params.name) != -1))
+                    .map(v => ({ ...v, key: v.id })) : res.payload.data?.map(v => ({ ...v, key: v.id })))
                 setLimits(res.payload.data?.length)
             }
         })
     }
 
     const columns = [{
-            title: '结构物名称',
-            dataIndex: 'name',
-            key: 'name',
-            render: (text, record, index) => {
-                return !record.points?.project? '':<div style={{ width: 100 }}>{record.points.project.name}</div>
-            }
-        }, {
-            title: '巡检人',
-            dataIndex: 'type',
-            key: 'type',
-            render: (text, record, index) => {
-                return !record.points?.user? '':<div style={{ width: 100 }}>{record.points.user.name}</div>
-            }
-        }, {
-            title: '巡检点位',
-            dataIndex: 'type',
-            key: 'type',
-            render: (text, record, index) => {
-                return !record.points?.user? '':<div style={{ width: 100 }}>{record.points.itemData.name}</div>
-            }
-        }, {
-            title: '巡检单位',
-            dataIndex: 'type',
-            key: 'type',
-            render: (text, record, index) => {
-                return !record.points?.user? '':<div style={{ width: 100 }}>{record.points.user.department.name}</div>
-            }
-        }, {
-            title: '巡检频次',
-            dataIndex: 'describe',
-            key: 'describe',
-            render: (text, record, index) => {
-                return !record.points? '':<div style={{ width: 100 }}>{record.points.frequency}</div>
-            }
-        }, {
-            title: '上次巡检日期',
-            dataIndex: 'describe',
-            key: 'describe',
-            render: (text, record, index) => moment(record.lastInspectionTime).format('YYYY-MM-DD HH:mm') || '--'
-        }, {
-            title: '本次巡检日期',
-            dataIndex: 'describe',
-            key: 'describe',
-            render: (text, record, index) => moment(record.inspectionTime).format('YYYY-MM-DD HH:mm') || '--'
-        }, {
-            title: '巡检结果',
-            dataIndex: 'describe',
-            key: 'describe',
-            render: (text, record, index) => !record.alarm? '正常':'异常'
-        }, {
-            title: '操作',
-            dataIndex: 'operation',
-            key: 'operation',
-            render: (text, record, index) => {
-                return (
-                    <div style={{ width: 190 }}>
-                        <Button type="link" onClick={() => {
-                            setAddModel(true)
-                            setModelData(record)
-                        }}>
-                            查看详情</Button>
-                    </div>
-                )
-            }
+        title: '结构物名称',
+        dataIndex: 'name',
+        key: 'name',
+        render: (text, record, index) => {
+            return !record.points?.project ? '' : <div style={{ width: 100 }}>{record.points.project.name}</div>
         }
+    }, {
+        title: '巡检人',
+        dataIndex: 'type',
+        key: 'type',
+        render: (text, record, index) => {
+            return !record.points?.user ? '' : <div style={{ width: 100 }}>{record.points.user.name}</div>
+        }
+    }, {
+        title: '巡检点位',
+        dataIndex: 'type',
+        key: 'type',
+        render: (text, record, index) => {
+            return !record.points?.user ? '' : <div style={{ width: 100 }}>{record.points.itemData.name}</div>
+        }
+    }, {
+        title: '巡检单位',
+        dataIndex: 'type',
+        key: 'type',
+        render: (text, record, index) => {
+            return !record.points?.user ? '' : <div style={{ width: 100 }}>{record.points.user.department.name}</div>
+        }
+    }, {
+        title: '巡检频次',
+        dataIndex: 'describe',
+        key: 'describe',
+        render: (text, record, index) => {
+            return !record.points ? '' : <div style={{ width: 100 }}>{record.points.frequency}</div>
+        }
+    }, {
+        title: '上次巡检日期',
+        dataIndex: 'describe',
+        key: 'describe',
+        render: (text, record, index) => moment(record.lastInspectionTime).format('YYYY-MM-DD HH:mm') || '--'
+    }, {
+        title: '本次巡检日期',
+        dataIndex: 'describe',
+        key: 'describe',
+        render: (text, record, index) => moment(record.inspectionTime).format('YYYY-MM-DD HH:mm') || '--'
+    }, {
+        title: '巡检结果',
+        dataIndex: 'describe',
+        key: 'describe',
+        render: (text, record, index) => !record.alarm ? '正常' : '异常'
+    }, {
+        title: '操作',
+        dataIndex: 'operation',
+        key: 'operation',
+        render: (text, record, index) => {
+            return (
+                <div style={{ width: 190 }}>
+                    <Button type="link" onClick={() => {
+                        setShowDetail(true)
+                        setModelData(record)
+                    }}>
+                        查看详情</Button>
+                </div>
+            )
+        }
+    }
     ]
 
     return (
@@ -122,7 +124,7 @@ const PatrolRecord = (props) => {
                         style={{ marginRight: 16, }}
                         initialValue={[moment(search.time[0], format), moment(search.time[1], format)]}
                     >
-                        <DatePicker.RangePicker style={{ marginRight: 16, }}/>
+                        <DatePicker.RangePicker showTime style={{ marginRight: 16, }} />
                     </Form.Item>
                     <Form.Item
                         name="state"
@@ -160,6 +162,29 @@ const PatrolRecord = (props) => {
                     }
                 }}
             />
+            <Modal
+                title='巡检记录详情'
+                open={showDetailModal}
+                onCancel={() => setShowDetail(false)}
+                footer={[<Button onClick={() => setShowDetail(false)}>关闭</Button>]}
+            >
+                <Row align='middle' justify='center' style={{ marginBottom: 10 }}>
+                    当前点位：{modelData?.points?.itemData?.name}
+                </Row>
+                <Row align='middle' justify='center' style={{ marginBottom: 10 }}>
+                    当前位置：{modelData?.points?.itemData?.name}
+                </Row>
+                <Row align='middle' justify='center'>
+                    <Checkbox.Group
+                        options={[
+                            { label: '正常', value: 'Apple', disabled: false },
+                            { label: '异常', value: 'Orange', disabled: false },
+                        ]}
+                        disabled
+                        defaultValue={['Apple']}
+                    />
+                </Row>
+            </Modal>
         </>
     )
 }