You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
343 lines
20 KiB
343 lines
20 KiB
import React, { useState, useRef, useEffect } from "react";
|
|
import { connect } from "react-redux";
|
|
import { Modal, Form, Notification, Tooltip, Upload, Button, Checkbox, CheckboxGroup, Collapse } from "@douyinfe/semi-ui";
|
|
import { IconUpload } from '@douyinfe/semi-icons';
|
|
import moment from "moment";
|
|
|
|
|
|
const AutomaticModal = ({ actions, dispatch, apiRoot, qiniuUrl, visible, eidtData, close, success, projectList }) => {
|
|
|
|
const { service, problem } = actions;
|
|
const form = useRef();//表单
|
|
const [strucData, setStrucData] = useState([]) //结构物数据
|
|
|
|
const [projectId, setProjectId] = useState(); //项目id
|
|
const [structId, setStructId] = useState(); //结构物id
|
|
const [factorId, setFactorId] = useState([]); //监测因素id
|
|
const [factorList, setFactorList] = useState([]); //监测因素
|
|
const [factorChech, setFactorChech] = useState([]); //选中的监测因素
|
|
const [activeKey, setActiveKey] = useState([]); //
|
|
const [correlationId, setCorrelationId] = useState([]); //
|
|
|
|
|
|
useEffect(async () => {
|
|
if (eidtData?.id) {
|
|
console.log(eidtData);
|
|
setProjectId(eidtData?.projectId)
|
|
setStructId(eidtData?.structId)
|
|
setFactorId(eidtData?.factors?.map(s => s.codeName) || [])
|
|
|
|
let data = await getData(eidtData?.projectId)
|
|
let Factor = data?.find(s => s.strucId == eidtData?.structId)?.factor || []
|
|
setFactorList(Factor)
|
|
setFactorChech(Factor?.filter(s => eidtData?.factors?.map(s => s.codeName)?.includes(s.proto)))
|
|
// setActiveKey(eidtData?.factors?.map(s => s.codeName) || [])
|
|
}
|
|
}, [])
|
|
|
|
const getData = async (projectId) => {
|
|
let data = []
|
|
await dispatch(service.getFactorList({ pepProjectId: projectId })).then((res) => {
|
|
if (res.success) {
|
|
setStrucData(res.payload.data)
|
|
data = res.payload.data
|
|
}
|
|
})
|
|
return data
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Modal
|
|
title={eidtData.id ? "编辑生成规制" : '新增生成规制'}
|
|
okText="确定"
|
|
cancelText="取消"
|
|
visible={visible}
|
|
onOk={() => {
|
|
|
|
form.current.validate().then((v) => {
|
|
let data = {
|
|
id: eidtData?.id,
|
|
reportName: v.reportName,
|
|
projectId: v.projectId,
|
|
projectName: v.projectName,
|
|
reportType: v.reportType,
|
|
reportPicPath: v.reportPicPath[0]?.response?.url,
|
|
framer: v.framer,
|
|
auditor: v.auditor,
|
|
ratifier: v.ratifier,
|
|
structId: v.structId,
|
|
projectOverview: v.projectOverview,
|
|
reportStartTime: moment(v.reportTime[0]).format('YYYY-MM-DD HH:mm:ss'),
|
|
reportEndTime: moment(v.reportTime[1]).format('YYYY-MM-DD HH:mm:ss'),
|
|
time: eidtData?.time && moment(eidtData?.time).format('YYYY-MM-DD HH:mm:ss') || null,
|
|
factors: []
|
|
}
|
|
|
|
v.factorId?.forEach(d => {
|
|
let index = d.length
|
|
let factorData = {}
|
|
for (let key in v) {
|
|
factorData.codeName = d
|
|
factorData.tempName = factorData.tempName || []
|
|
if (key?.indexOf(d) != -1) {
|
|
if (key?.slice(index) == 'pointDescrip') factorData.pointDescrip = v[key]
|
|
if (key?.slice(index) == 'pointPicPath') factorData.pointPicPath = v[key] && v[key][0]?.response?.url
|
|
if (key?.slice(index) == 'factorDescrip') factorData.factorDescrip = v[key]
|
|
if (key?.slice(index) == 'sensorNames') factorData.sensorNames = factorChech?.find(p => p.proto == d)?.sensor?.filter(f => v[key]?.includes(f.id))?.map(c => ({ id: c.id, name: c.name })) || []
|
|
if (key?.slice(index) == 'startEndTime') {
|
|
factorData.startTime = v[key] && moment(v[key][0]).format('YYYY-MM-DD HH:mm:ss')
|
|
factorData.endTime = v[key] && moment(v[key][1]).format('YYYY-MM-DD HH:mm:ss')
|
|
}
|
|
if (key?.slice(index) == 'tempName1') {
|
|
factorData.tempName?.push({
|
|
index: 1,
|
|
id: v[key],
|
|
name: factorChech?.find(p => p.proto == d)?.sensor?.find(f => v[key] == f.id)?.name
|
|
})
|
|
}
|
|
if (key?.slice(index) == 'tempName2') {
|
|
factorData.tempName?.push({
|
|
index: 2,
|
|
id: v[key],
|
|
name: factorChech?.find(p => p.proto == 1004)?.sensor?.find(f => v[key] == f.id)?.name
|
|
})
|
|
}
|
|
if (key?.slice(index) == 'factorDescrip') factorData.factorDescrip = v[key]
|
|
// if (key?.slice(index) == 'glStaName') factorData.glStaName = v[key]
|
|
// if (key?.slice(index) == 'tempStaName') factorData.tempStaName = v[key]
|
|
if (key?.slice(index) == 'initialTime') factorData.initialTime = v[key] && moment(v[key]).format('YYYY-MM-DD HH:mm:ss')
|
|
if (key?.slice(index) == 'releTime') {
|
|
factorData.releStartTime = v[key] && moment(v[key][0]).format('YYYY-MM-DD HH:mm:ss')
|
|
factorData.releEndTime = v[key] && moment(v[key][1]).format('YYYY-MM-DD HH:mm:ss')
|
|
}
|
|
}
|
|
}
|
|
factorData.glStaName = factorData?.tempName?.find(s => s.index == 1)?.name
|
|
factorData.tempStaName = factorData?.tempName?.find(s => s.index == 2)?.name || factorData?.tempName?.find(s => s.index == 1)?.name
|
|
data.factors?.push(factorData)
|
|
})
|
|
|
|
dispatch(service.postAutomaticReport(data)).then((res) => {
|
|
if (res.success) {
|
|
close()
|
|
success()
|
|
}
|
|
})
|
|
|
|
})
|
|
}}
|
|
width={700}
|
|
onCancel={() => close()}
|
|
>
|
|
<Form
|
|
labelPosition="left"
|
|
labelAlign="right"
|
|
labelWidth="150px"
|
|
onValueChange={(values, field) => { }}
|
|
getFormApi={(formApi) => (form.current = formApi)}
|
|
>
|
|
<Form.Input field="reportName" label='报表名称' style={{ width: 300 }} placeholder="请输入报表名称" showClear
|
|
initValue={eidtData?.reportName || ""}
|
|
rules={[{ required: true, message: "请输入报表名称,15字以内", max: 15 }]}
|
|
/>
|
|
<Form.Select label="所属项目" field="projectId" placeholder="请选择项目" showClear style={{ width: 300 }} filter
|
|
initValue={eidtData?.projectId || ""}
|
|
rules={[{ required: true, message: "请选择项目" }]}
|
|
onChange={v => {
|
|
setProjectId(v)
|
|
getData(v)
|
|
form.current.setValue('structId', null)
|
|
setStructId("")
|
|
setFactorList([])
|
|
form.current.setValue('factorId', [])
|
|
setFactorChech([])
|
|
}} >
|
|
{projectList?.map((item) => {
|
|
return <Form.Select.Option value={item.id} label={item.name || item.pepProjectName}></Form.Select.Option>
|
|
|
|
})}
|
|
</Form.Select>
|
|
<Form.Input field="projectName" label='项目名称' style={{ width: 300 }} placeholder="请输入项目名称" showClear
|
|
initValue={eidtData?.projectName || ""}
|
|
rules={[{ required: true, message: "请输入项目名称,15字以内", max: 15 }]}
|
|
/>
|
|
<Form.Select label="报表类型" field="reportType" placeholder="请选择报表类型" showClear style={{ width: 300 }}
|
|
rules={[{ required: true, message: "请选择报表类型" }]}
|
|
initValue={eidtData?.reportType || ""}
|
|
optionList={[{ value: "月报表", label: "月报表" }, { value: "季报表", label: "季报表" }, { value: "年报表", label: "年报表" }]}
|
|
/>
|
|
<Form.Upload label="首页图片" field="reportPicPath" style={{ display: 'inline-block', }}
|
|
initValue={eidtData?.reportPicPath && [{ url: `/_file-server/${eidtData?.reportPicPath?.slice(qiniuUrl.length + 1)}`, name: eidtData.reportPicPath?.split('/')?.pop(), status: 'success', preview: ['png', 'jpg', 'jpeg'].includes(eidtData.reportPicPath?.split('.')?.pop()?.replace('.', '')) }] || null}
|
|
rules={[{ required: true, message: "请上传首页图片" }]}
|
|
action={`${apiRoot}/attachments/p`}
|
|
accept={'.txt, .doc, .docx, .xls, .xlsx, .pdf, .png, .jpg, .rar, .zip'}
|
|
limit={1} maxSize={5120}
|
|
>
|
|
<Button icon={<IconUpload />} theme="light">
|
|
文件上传
|
|
</Button>
|
|
</Form.Upload>
|
|
<Form.Input field="framer" label='制定者' style={{ width: 300 }} placeholder="请输入制定者" showClear
|
|
initValue={eidtData?.framer || ""}
|
|
rules={[{ required: true, message: "请输入制定者" }]}
|
|
/>
|
|
<Form.Input field="auditor" label='审核者' style={{ width: 300 }} placeholder="请输入审核者" showClear
|
|
initValue={eidtData?.auditor || ""}
|
|
rules={[{ required: true, message: "请输入审核者" }]}
|
|
/>
|
|
<Form.Input field="ratifier" label='批准者' style={{ width: 300 }} placeholder="请输入批准者" showClear
|
|
initValue={eidtData?.ratifier || ""}
|
|
rules={[{ required: true, message: "请输入批准者" }]}
|
|
/>
|
|
|
|
<Form.Select label="结构物" field="structId" placeholder="请选择结构物" showClear style={{ width: 300 }} filter
|
|
rules={[{ required: true, message: "请选择结构物" }]} disabled={projectId ? false : true}
|
|
initValue={eidtData?.structId || ""}
|
|
onChange={v => {
|
|
setFactorList(strucData?.find(s => s.strucId == v)?.factor || [])
|
|
setStructId(v)
|
|
form.current.setValue('factorId', [])
|
|
setFactorChech([])
|
|
}} >
|
|
{strucData?.map((item) => {
|
|
return <Form.Select.Option value={item.strucId} label={item.strucName}></Form.Select.Option>
|
|
|
|
})}
|
|
</Form.Select>
|
|
|
|
<Form.TextArea field="projectOverview" label='报表描述' style={{ width: 420 }} autosize={{ minRows: 2, maxRows: 10 }} placeholder="请输入报表描述" showClear
|
|
initValue={eidtData?.projectOverview || ""}
|
|
rules={[{ required: true, message: "请输入报表描述" }]}
|
|
/>
|
|
<Form.DatePicker field='reportTime' label='开始结束时间' type='dateTimeRange' showClear
|
|
initValue={eidtData?.reportStartTime && [moment(eidtData?.reportStartTime).format('YYYY-MM-DD HH:mm:ss'), moment(eidtData?.reportEndTime).format('YYYY-MM-DD HH:mm:ss')] || null}
|
|
rules={[{ required: true, message: "请选择开始结束时间" }]}
|
|
/>
|
|
<Form.Select label="包含的监测因素" field="factorId" placeholder="请选择监测因素" showClear style={{ width: 300 }} filter multiple={true}
|
|
initValue={eidtData?.factors?.map(s => s.codeName) || []}
|
|
rules={[{ required: true, message: "请选择监测因素" }]} disabled={structId ? false : true}
|
|
onChange={v => {
|
|
setFactorChech(factorList?.filter(s => v.includes(s.proto)))
|
|
// setActiveKey(v)
|
|
}} >
|
|
{factorList?.map((item) => {
|
|
return <Form.Select.Option value={item.proto} label={item.name}></Form.Select.Option>
|
|
})}
|
|
|
|
</Form.Select>
|
|
|
|
{factorChech?.length > 0 ? <Collapse style={{ margin: '20px 0 20px 30px', width: '90%', background: '#b7c9e624' }}
|
|
// activeKey={activeKey}
|
|
keepDOM={true}
|
|
onChange={v => {
|
|
// setActiveKey(v)
|
|
}}
|
|
>
|
|
{
|
|
factorChech?.map(s => {
|
|
return <Collapse.Panel header={s.proto + s.name} itemKey={s.proto} key={s.proto}>
|
|
<div style={{ background: "#FFF" }}>
|
|
<Form.TextArea field={s.proto + "pointDescrip"} label='布点描述' style={{ width: 400 }} autosize={{ minRows: 2, maxRows: 10 }} placeholder="请输入布点描述" showClear
|
|
initValue={eidtData?.factors?.find(c => c.codeName == s.proto)?.pointDescrip || ""}
|
|
rules={[{ required: true, message: "请输入布点描述" }]}
|
|
/>
|
|
<Form.Upload label="布点图片" field={s.proto + "pointPicPath"} style={{ display: 'inline-block', }}
|
|
initValue={eidtData?.factors?.find(c => c.codeName == s.proto)?.pointPicPath && [{ url: `/_file-server/${eidtData?.factors?.find(c => c.codeName == s.proto)?.pointPicPath?.slice(qiniuUrl.length + 1)}`, name: eidtData?.factors?.find(c => c.codeName == s.proto)?.pointPicPath?.split('/')?.pop(), status: 'success', preview: ['png', 'jpg', 'jpeg'].includes(eidtData?.factors?.find(c => c.codeName == s.proto)?.pointPicPath?.split('.')?.pop()?.replace('.', '')) }] || null}
|
|
rules={[{ required: true, message: "请上传布点图片" }]}
|
|
action={`${apiRoot}/attachments/p`}
|
|
accept={'.png, .jpg, .jpeg'}
|
|
limit={1} maxSize={5120}
|
|
>
|
|
<Button icon={<IconUpload />} theme="light">
|
|
文件上传
|
|
</Button>
|
|
</Form.Upload>
|
|
|
|
{s.proto == 2001 &&
|
|
<Form.TextArea field={s.proto + "factorDescrip"} label='索力监测描述' style={{ width: 400 }} autosize={{ minRows: 2, maxRows: 10 }} placeholder="请输入布点描述" showClear
|
|
initValue={eidtData?.factors?.find(c => c.codeName == s.proto)?.factorDescrip || ""}
|
|
/>
|
|
}
|
|
|
|
<Form.Select label="测点选择" field={s.proto + "sensorNames"} multiple={true} placeholder="请选择测点选择" style={{ width: 300 }} showClear filter
|
|
initValue={eidtData?.factors?.find(c => c.codeName == s.proto)?.sensorNames?.map(a => a.id) || []}
|
|
rules={[{ required: true, message: "请选择测点选择" }]}
|
|
>
|
|
{s.sensor?.map((item) => {
|
|
return <Form.Select.Option value={item.id} label={item.name}></Form.Select.Option>
|
|
})}
|
|
</Form.Select>
|
|
<Form.DatePicker field={s.proto + 'startEndTime'} label='开始结束时间' type='dateTimeRange' showClear style={{ width: 360 }}
|
|
initValue={eidtData?.factors?.find(c => c.codeName == s.proto)?.startTime && [moment(eidtData?.factors?.find(c => c.codeName == s.proto)?.startTime).format('YYYY-MM-DD HH:mm:ss'), moment(eidtData?.factors?.find(c => c.codeName == s.proto)?.endTime).format('YYYY-MM-DD HH:mm:ss')] || null}
|
|
rules={[{ required: true, message: "请选择开始结束时间" }]}
|
|
/>
|
|
{
|
|
['2001', '4004', '4007', '4008'].includes(s.proto) &&
|
|
<Form.DatePicker field={s.proto + 'initialTime'} label='数据初始时间' type='dateTime' showClear
|
|
rules={[{ required: true, message: "请选择数据初始时间" }]}
|
|
initValue={eidtData?.factors?.find(c => c.codeName == s.proto)?.initialTime && moment(eidtData?.factors?.find(c => c.codeName == s.proto)?.initialTime).format('YYYY-MM-DD HH:mm:ss')}
|
|
/>
|
|
}
|
|
{
|
|
['4009', '3001', '4004', '4001', '4007'].includes(s.proto) && <>
|
|
<Form.Select label="关联温度的测点" field={s.proto + "tempName1"} showClear placeholder="请选择关联的温度测点" style={{ width: 300 }} filter
|
|
initValue={eidtData?.factors?.find(c => c.codeName == s.proto)?.tempName?.find(c => c.index == 1)?.id || ""}
|
|
onChange={v => {
|
|
|
|
|
|
}}
|
|
>
|
|
{s.sensor?.map((item) => {
|
|
return <Form.Select.Option value={item.id} label={item.name}></Form.Select.Option>
|
|
|
|
})}
|
|
</Form.Select>
|
|
<Form.Select label="温度测点" field={s.proto + "tempName2"} placeholder="请选择温度测点" style={{ width: 300 }} filter showClear
|
|
initValue={eidtData?.factors?.find(c => c.codeName == s.proto)?.tempName?.find(c => c.index == 2)?.id || ""}
|
|
>
|
|
{factorList?.find(d => d.proto == 1004 || d.proto == 1002)?.sensor?.map((item) => {
|
|
return <Form.Select.Option value={item.name} label={item.name}></Form.Select.Option>
|
|
|
|
})}
|
|
</Form.Select>
|
|
<Form.DatePicker field={s.proto + 'releTime'} label='关联开始结束时间' type='dateTimeRange' showClear style={{ width: 360 }}
|
|
initValue={eidtData?.factors?.find(c => c.codeName == s.proto)?.releStartTime && [moment(eidtData?.factors?.find(c => c.codeName == s.proto)?.releStartTime).format('YYYY-MM-DD HH:mm:ss'), moment(eidtData?.factors?.find(c => c.codeName == s.proto)?.releEndTime).format('YYYY-MM-DD HH:mm:ss')] || null}
|
|
/>
|
|
</>
|
|
}
|
|
|
|
{/* <Form.Input field={s.proto + "glStaName"} label='关联温度的测点名称' style={{ width: 300 }} placeholder="请输入关联温度的测点名称" showClear
|
|
initValue={eidtData?.factors?.find(c => c.codeName == s.proto)?.glStaName || ""}
|
|
/>
|
|
<Form.Input field={s.proto + "tempStaName"} label='关联温度名称' style={{ width: 300 }} placeholder="请输入关联温度名称" showClear
|
|
initValue={eidtData?.factors?.find(c => c.codeName == s.proto)?.tempStaName || ""}
|
|
/> */}
|
|
|
|
|
|
</div>
|
|
</Collapse.Panel>
|
|
})
|
|
}
|
|
|
|
|
|
</Collapse> : ""}
|
|
|
|
</Form>
|
|
</Modal >
|
|
</>
|
|
);
|
|
}
|
|
function mapStateToProps (state) {
|
|
const { auth, global, members } = state;
|
|
|
|
return {
|
|
// loading: members.isRequesting,
|
|
user: auth.user,
|
|
actions: global.actions,
|
|
apiRoot: global.apiRoot,
|
|
qiniuUrl: global.qiniu?.domain
|
|
};
|
|
}
|
|
|
|
export default connect(mapStateToProps)(AutomaticModal);
|
|
|