xincheng
2 years ago
16 changed files with 415 additions and 70 deletions
@ -1,7 +1,9 @@ |
|||||
'use strict'; |
'use strict'; |
||||
|
|
||||
import * as plan from './plan' |
import * as plan from './plan' |
||||
|
import * as record from './record' |
||||
|
|
||||
export default { |
export default { |
||||
...plan, |
...plan, |
||||
|
...record, |
||||
} |
} |
||||
@ -0,0 +1,17 @@ |
|||||
|
'use strict'; |
||||
|
|
||||
|
import { basicAction } from '@peace/utils' |
||||
|
|
||||
|
export const GET_PATROL_RECORD_LIST = 'GET_PATROL_RECORD_LIST'; |
||||
|
export const GET_PATROL_RECORD_LIST_SUCCESS = 'GET_PATROL_RECORD_LIST_SUCCESS'; |
||||
|
export const GET_PATROL_RECORD_LIST_ERROR = 'GET_PATROL_RECORD_LIST_ERROR'; |
||||
|
export function records(url) { |
||||
|
return (dispatch) => basicAction({ |
||||
|
type: 'get', |
||||
|
dispatch, |
||||
|
actionType: GET_PATROL_RECORD_LIST, |
||||
|
url: url, |
||||
|
msg: { error: '获取巡检记录失败', }, |
||||
|
reducer: { name: 'record' } |
||||
|
}); |
||||
|
} |
||||
@ -1,5 +1,6 @@ |
|||||
'use strict'; |
'use strict'; |
||||
|
|
||||
import PatrolPlan from './patrolPlan'; |
import PatrolPlan from './patrolPlan'; |
||||
|
import PatrolReocrd from './patrolRecord'; |
||||
|
|
||||
export { PatrolPlan }; |
export { PatrolPlan, PatrolReocrd }; |
||||
@ -0,0 +1,204 @@ |
|||||
|
|
||||
|
'use strict' |
||||
|
|
||||
|
import React, { useEffect, useState } from 'react'; |
||||
|
import { connect } from 'react-redux'; |
||||
|
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 [showDetailModal, setShowDetail] = useState(false) |
||||
|
const [modelData, setModelData] = useState({}) |
||||
|
const [query, setQuery] = useState({ limit: 10, page: 0 }) |
||||
|
const [limits, setLimits] = useState() |
||||
|
const format = 'YYYY-MM-DD' |
||||
|
const [search, setSearch] = useState({ name: null, time: [moment().add(-7, 'd').format(format), moment().format(format)], state: 'null' }) |
||||
|
|
||||
|
useEffect(() => { |
||||
|
record(search) |
||||
|
}, []) |
||||
|
|
||||
|
const record = (params) => { |
||||
|
dispatch(patrolManage.records(`patrolRecord/all/${params.time[0]}/${params.time[1]}/${params.state}/null`)).then(res => { |
||||
|
if (res.success) { |
||||
|
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={() => { |
||||
|
setShowDetail(true) |
||||
|
setModelData(record) |
||||
|
}}> |
||||
|
查看详情</Button> |
||||
|
</div> |
||||
|
) |
||||
|
} |
||||
|
} |
||||
|
] |
||||
|
|
||||
|
return ( |
||||
|
<> |
||||
|
<div style={{ display: 'flex', justifyContent: 'space-between', padding: '0 10px' }}> |
||||
|
<Form |
||||
|
style={{ display: 'flex', }} |
||||
|
onFinish={r => { |
||||
|
record({ |
||||
|
name: r.name, |
||||
|
time: [moment(r.time[0]).format(format), moment(r.time[1]).format(format)], |
||||
|
state: r.state |
||||
|
}) |
||||
|
}} |
||||
|
> |
||||
|
<Form.Item |
||||
|
name="name" |
||||
|
style={{ marginRight: 16, minWidth: 250 }} |
||||
|
> |
||||
|
<Input placeholder="请输入结构物名称或巡检人" allowClear /> |
||||
|
</Form.Item> |
||||
|
<Form.Item |
||||
|
name="time" |
||||
|
style={{ marginRight: 16, }} |
||||
|
initialValue={[moment(search.time[0], format), moment(search.time[1], format)]} |
||||
|
> |
||||
|
<DatePicker.RangePicker showTime style={{ marginRight: 16, }} /> |
||||
|
</Form.Item> |
||||
|
<Form.Item |
||||
|
name="state" |
||||
|
style={{ marginRight: 16, }} |
||||
|
initialValue={'null'} |
||||
|
> |
||||
|
<Select allowClear |
||||
|
options={[ |
||||
|
{ value: 'null', label: '全部' }, |
||||
|
{ value: false, label: '正常' }, |
||||
|
{ value: true, label: '异常' }]} /> |
||||
|
</Form.Item> |
||||
|
<Form.Item wrapperCol={{}}> |
||||
|
<Button type="primary" htmlType="submit"> |
||||
|
搜索 |
||||
|
</Button> |
||||
|
</Form.Item> |
||||
|
</Form> |
||||
|
</div> |
||||
|
<Table |
||||
|
columns={columns} |
||||
|
dataSource={tableList} |
||||
|
pagination={{ |
||||
|
current: query.page + 1, |
||||
|
total: limits, |
||||
|
showSizeChanger: true, |
||||
|
showQuickJumper: true, |
||||
|
pageSizeOptions: [10, 20, 50], |
||||
|
showTotal: (total) => { |
||||
|
return <span style={{ fontSize: 15 }}>{`共${Math.ceil(total / query?.limit)}页，${total}项`}</span> |
||||
|
}, |
||||
|
onChange: (page, pageSize) => { |
||||
|
setQuery({ limit: pageSize, page: page - 1 }); |
||||
|
record({ limit: pageSize, page: page - 1, ...search, companyId: companyID || search?.companyId }) |
||||
|
} |
||||
|
}} |
||||
|
/> |
||||
|
<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?.address} |
||||
|
</Row> |
||||
|
<Row align='middle' justify='center' style={{ marginBottom: 10 }}> |
||||
|
巡检结果：{modelData.alarm? '异常':'正常'} |
||||
|
</Row> |
||||
|
{ !modelData.alarm? '': |
||||
|
<Row align='middle' justify='center' style={{ marginBottom: 10 }}> |
||||
|
巡检详情：{modelData?.points?.msgInp} |
||||
|
</Row> } |
||||
|
{ !modelData.alarm? '': |
||||
|
<Row align='middle' justify='center' style={{ marginBottom: 10 }}> |
||||
|
异常等级：{modelData?.points?.changeThree} |
||||
|
</Row> } |
||||
|
{ !modelData.alarm? '':<Row align='middle' justify='center' style={{ marginBottom: 10 }}> |
||||
|
{ modelData?.points?.imgs?.map(rs => <img key={rs} src={`/_file-server/${rs}`} style={{ display: 'inline-block', width: 260, marginBottom: 10 }} />)} |
||||
|
</Row> } |
||||
|
</Modal> |
||||
|
</> |
||||
|
) |
||||
|
} |
||||
|
|
||||
|
function mapStateToProps(state) { |
||||
|
const { auth, global } = state; |
||||
|
return { |
||||
|
user: auth.user, |
||||
|
actions: global.actions, |
||||
|
}; |
||||
|
} |
||||
|
|
||||
|
export default connect(mapStateToProps)(PatrolRecord); |
||||
@ -0,0 +1,32 @@ |
|||||
|
'use strict'; |
||||
|
import * as actionTypes from '../actions/record'; |
||||
|
import Immutable from 'immutable'; |
||||
|
|
||||
|
const initState = { |
||||
|
data: {}, |
||||
|
isRequesting: false, |
||||
|
error: null |
||||
|
}; |
||||
|
|
||||
|
function record(state = initState, action) { |
||||
|
const payload = action.payload; |
||||
|
switch (action.type){ |
||||
|
case actionTypes.GET_PATROL_RECORD_LIST: |
||||
|
return Immutable.fromJS(state).set('data', |
||||
|
payload.data).toJS(); |
||||
|
case actionTypes.GET_PATROL_RECORD_LIST_SUCCESS: |
||||
|
return Immutable.fromJS(state).merge({ |
||||
|
isRequesting: false, |
||||
|
data: payload.data |
||||
|
}).toJS(); |
||||
|
case actionTypes.GET_PATROL_RECORD_LIST_ERROR: |
||||
|
return Immutable.fromJS(state).merge({ |
||||
|
isRequesting: false, |
||||
|
error: payload.error |
||||
|
}).toJS(); |
||||
|
default: |
||||
|
return state; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
export default record; |
||||
Loading…
Reference in new issue