wenlele
2 years ago
12 changed files with 297 additions and 310 deletions
@ -1,160 +0,0 @@ |
|||||
import React, { useState } from 'react'; |
|
||||
import { Button, Form, Input } from 'antd'; |
|
||||
import { |
|
||||
ModalForm, |
|
||||
ProFormText, |
|
||||
ProFormSelect, |
|
||||
ProFormTextArea |
|
||||
} from '@ant-design/pro-form'; |
|
||||
import Uploads from '$components/Uploads'; |
|
||||
import { EMERGENCY_DEGREE } from '../contants/risk-coordinate'; |
|
||||
import { useEffect } from 'react'; |
|
||||
import moment from 'moment'; |
|
||||
|
|
||||
const FormItem = Form.Item; |
|
||||
|
|
||||
export default (props) => { |
|
||||
const { title, triggerRender, editData, onFinish, isView } = props; |
|
||||
const [editUrlMap, setEditUrlMap] = useState({ type1: [], type2: [] }); |
|
||||
let formItemLayout = { labelCol: { span: 4 }, wrapperCol: { span: 14 } }; |
|
||||
const initialValues = editData ? { |
|
||||
...editData, |
|
||||
} : null |
|
||||
|
|
||||
useEffect(() => { |
|
||||
if (editData && editData.problemReportFiles) { |
|
||||
let fileList = (editData?.problemReportFiles || []).map(item => { |
|
||||
return { |
|
||||
storageUrl: item.filePath, |
|
||||
} |
|
||||
}); |
|
||||
setEditUrlMap({ type1: fileList, type2: [] }) |
|
||||
} |
|
||||
}, [editData]) |
|
||||
|
|
||||
// useEffect(() => {
|
|
||||
// if (key == 'view') {
|
|
||||
// formItemLayout.modalProps.footer = { null };
|
|
||||
// }
|
|
||||
// }, [key])
|
|
||||
|
|
||||
const vsjunct = (params, type) => { |
|
||||
let temp = editUrlMap |
|
||||
if (params.length) { |
|
||||
let appendix = [] |
|
||||
for (let p of params) { |
|
||||
appendix.push({ |
|
||||
fName: p.name, |
|
||||
size: p.size, |
|
||||
fileSize: p.size, |
|
||||
storageUrl: p.storageUrl,//必须有storageUrl
|
|
||||
}) |
|
||||
} |
|
||||
temp[type] = appendix |
|
||||
setEditUrlMap(temp) |
|
||||
} else { |
|
||||
temp[type] = [] |
|
||||
setEditUrlMap(temp) |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
return ( |
|
||||
<ModalForm |
|
||||
title={title || ''} |
|
||||
initialValues={initialValues} |
|
||||
trigger={ |
|
||||
triggerRender ? triggerRender : <Button type="primary" > |
|
||||
{title || ''} |
|
||||
</Button> |
|
||||
} |
|
||||
layout="horizontal" |
|
||||
{...formItemLayout} |
|
||||
modalProps={{ |
|
||||
destroyOnClose: true, |
|
||||
onCancel: () => { }, |
|
||||
}} |
|
||||
|
|
||||
onFinish={async (values) => { |
|
||||
if (isView) { |
|
||||
return true; |
|
||||
} |
|
||||
onFinish && await onFinish(values, editData) |
|
||||
return true; |
|
||||
}} |
|
||||
> |
|
||||
<ProFormText |
|
||||
width="md" |
|
||||
name="title" |
|
||||
label="上报问题标题" |
|
||||
disabled={isView ? true : false} |
|
||||
rules={[{ |
|
||||
required: true, message: '上报问题标题不能为空', |
|
||||
}, { |
|
||||
max: 26, message: '标题长度不能大于26个字' |
|
||||
}, { |
|
||||
whitespace: true, message: '请勿输入空格' |
|
||||
}]} |
|
||||
placeholder="请输入上报问题标题,不超过26个字" |
|
||||
/> |
|
||||
|
|
||||
|
|
||||
<ProFormTextArea |
|
||||
width="md" |
|
||||
name="describe" |
|
||||
label="问题描述" |
|
||||
disabled={isView ? true : false} |
|
||||
placeholder="请输入问题描述,不超过200个字" |
|
||||
rules={[{ |
|
||||
required: true, message: '上报问题标题不能为空', |
|
||||
}, { |
|
||||
max: 200, message: '描述长度不能大于200个字' |
|
||||
}, { |
|
||||
whitespace: true, message: '请勿输入空格' |
|
||||
}]} |
|
||||
/> |
|
||||
|
|
||||
<ProFormSelect |
|
||||
width="md" |
|
||||
rules={[{ required: true, message: '请选择紧急程度!' }]} |
|
||||
options={EMERGENCY_DEGREE.map(s => s)} |
|
||||
name="urgencyDegree" |
|
||||
label="紧急程度" |
|
||||
disabled={isView ? true : false} |
|
||||
/> |
|
||||
|
|
||||
<FormItem name='accessory' label='问题附件'> |
|
||||
<Uploads |
|
||||
disabled={isView ? true : false} |
|
||||
className='upload' |
|
||||
listType='text' |
|
||||
uploadType='project' |
|
||||
maxFilesNum={10} |
|
||||
maxFileSize={20} |
|
||||
isQiniu={true} |
|
||||
onChange={(params) => vsjunct(params, 'type1')} |
|
||||
fileTypes={["jpeg", "png", "jpg", "pdf", "doc", "docx"]} |
|
||||
value={editUrlMap.type1} |
|
||||
defaultValue={editUrlMap.type1} |
|
||||
/> |
|
||||
|
|
||||
</FormItem> |
|
||||
|
|
||||
{ |
|
||||
isView ? <FormItem label='上报人员'> |
|
||||
<Input value={editData.user.userName} disabled={true} /> |
|
||||
</FormItem> : '' |
|
||||
} |
|
||||
|
|
||||
{ |
|
||||
isView ? <FormItem label='上报时间'> |
|
||||
<Input value={moment(editData.reportTime).format('YYYY-MM-DD HH:mm:ss')} disabled={true} /> |
|
||||
</FormItem> : '' |
|
||||
} |
|
||||
|
|
||||
{/* <FormItem > |
|
||||
<div style={{ color: '#999' }}>说明:附件格式为png、jpeg、jpg、docx、doc、pdf,大小不超过20MB</div> |
|
||||
</FormItem> */} |
|
||||
|
|
||||
</ModalForm> |
|
||||
); |
|
||||
}; |
|
@ -1,7 +1,8 @@ |
|||||
'use strict'; |
'use strict'; |
||||
|
|
||||
|
|
||||
import ProjectSituation from './projectSituation' |
import QrCode from './qrCode' |
||||
|
import Information from './information' |
||||
|
|
||||
|
|
||||
export { ProjectSituation }; |
export { QrCode, Information }; |
||||
|
@ -0,0 +1,229 @@ |
|||||
|
import React, { useEffect, useState } from 'react'; |
||||
|
import { connect } from 'react-redux'; |
||||
|
import { Spin, Card, Form, Input, Select, Button, Table, Modal, Popconfirm, Tooltip } from 'antd'; |
||||
|
import moment from "moment"; |
||||
|
import '../style.less'; |
||||
|
import ProjectAddModel from '../components/projectAddModel' |
||||
|
import { Model } from 'echarts'; |
||||
|
|
||||
|
const Information = (props) => { |
||||
|
const { dispatch, actions, user, loading } = props |
||||
|
const { projectRegime } = actions |
||||
|
const [firmList, setFirmList] = useState([]) |
||||
|
const [tableList, settableList] = useState([]) |
||||
|
const [addModel, setAddModel] = useState(false) |
||||
|
const [modelData, setModelData] = useState({}) |
||||
|
const [query, setQuery] = useState({ limit: 10, page: 0 }) |
||||
|
const [limits, setLimits] = useState() |
||||
|
const [search, setSearch] = useState({}) |
||||
|
const [isPicture, setIsPicture] = useState(false) |
||||
|
const [pictureUrl, setPictureUrl] = useState() |
||||
|
const [companyID, setCompanyId] = useState('') |
||||
|
|
||||
|
|
||||
|
|
||||
|
useEffect(() => { |
||||
|
dispatch(projectRegime.getFirmList()).then(res => { |
||||
|
if (res.success) { |
||||
|
let data = res.payload.data?.map(r => ({ value: r.id, label: r.name })) |
||||
|
if (user?.role?.type == 1) { |
||||
|
setFirmList(data) |
||||
|
projectList(query) |
||||
|
} else if (user?.role?.type == 2) { |
||||
|
let dataId = user?.userDepartments[0]?.department?.company?.id |
||||
|
setFirmList(data?.filter(v => v.value == dataId)) |
||||
|
projectList({ ...query, companyId: dataId }) |
||||
|
setSearch({ companyId: dataId }) |
||||
|
setCompanyId(dataId) |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
}, []) |
||||
|
|
||||
|
const projectList = (obj) => { |
||||
|
const { limit, page, companyId, name, type } = obj |
||||
|
dispatch(projectRegime.getProjectList({ limit, page, companyId, name, type })).then(res => { |
||||
|
// console.log(res)
|
||||
|
if (res.success) { |
||||
|
settableList(res.payload.data?.rows?.map(v => ({ ...v, key: v.id }))) |
||||
|
setLimits(res.payload.data?.count) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
const columns = [ |
||||
|
{ |
||||
|
title: '序号', |
||||
|
dataIndex: 'index', |
||||
|
key: 'index', |
||||
|
render: (text, record, index) => index + 1 |
||||
|
}, { |
||||
|
title: '结构物名称', |
||||
|
dataIndex: 'name', |
||||
|
key: 'name', |
||||
|
}, { |
||||
|
title: '所在地区', |
||||
|
dataIndex: 'type', |
||||
|
key: 'type', |
||||
|
}, { |
||||
|
title: '结构物类型', |
||||
|
dataIndex: 'scale', |
||||
|
key: 'scale', |
||||
|
render: (text, record, index) => record?.scale?.scale + record?.scale?.scaleSuffix |
||||
|
}, { |
||||
|
title: '描述', |
||||
|
dataIndex: 'amount', |
||||
|
key: 'amount', |
||||
|
render: (text, record, index) => record?.amount?.amount + record?.amount?.amountSuffix |
||||
|
}, { |
||||
|
title: '操作', |
||||
|
dataIndex: 'operation', |
||||
|
key: 'operation', |
||||
|
render: (text, record, index) => { |
||||
|
return ( |
||||
|
<div style={{ width: 180 }}> |
||||
|
{(user?.isSuper || user.id == record.userId) ? |
||||
|
<> |
||||
|
<Button type="link" onClick={() => { |
||||
|
setAddModel(true) |
||||
|
setModelData(record) |
||||
|
}} |
||||
|
|
||||
|
>编辑</Button> |
||||
|
<Popconfirm |
||||
|
title='确认删除工程信息?' |
||||
|
position='topLeft' |
||||
|
onConfirm={() => { |
||||
|
dispatch(projectRegime.delProject(record.id)).then(res => { |
||||
|
if (res.success) { |
||||
|
if ((limits > 11 && tableList.length > 1) || limits < 11) { |
||||
|
projectList({ ...query, ...search }) |
||||
|
} else { |
||||
|
projectList({ limit: query?.limit, page: query?.page - 1, ...search }) |
||||
|
setQuery({ limit: query?.limit, page: query?.page - 1 }); |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
}) |
||||
|
}} |
||||
|
> |
||||
|
<Button type="link" danger >删除</Button> |
||||
|
</Popconfirm> |
||||
|
|
||||
|
</> |
||||
|
: <> |
||||
|
<Tooltip title='请联系工程创建者'> |
||||
|
<Button type="link" >编辑</Button> |
||||
|
</Tooltip> |
||||
|
<Tooltip title='请联系工程创建者'> |
||||
|
<Button type="link" danger >删除</Button> |
||||
|
</Tooltip> |
||||
|
</> |
||||
|
} |
||||
|
|
||||
|
</div> |
||||
|
) |
||||
|
} |
||||
|
} |
||||
|
] |
||||
|
|
||||
|
return ( |
||||
|
<> |
||||
|
<div style={{ display: 'flex', justifyContent: 'space-between', padding: '0 10px' }}> |
||||
|
<Form |
||||
|
style={{ display: 'flex', }} |
||||
|
onFinish={r => { |
||||
|
projectList({ limit: 10, page: 0, ...r, companyId: companyID || r?.companyId }) |
||||
|
setQuery({ limit: 10, page: 0 }); |
||||
|
setSearch(r) |
||||
|
}} |
||||
|
> |
||||
|
<Form.Item |
||||
|
label='项目名称' |
||||
|
name="name" |
||||
|
style={{ marginRight: 16, minWidth: 180 }} |
||||
|
> |
||||
|
<Input placeholder="请输入项目名称" allowClear /> |
||||
|
</Form.Item> |
||||
|
<Form.Item wrapperCol={{}}> |
||||
|
<Button type="primary" htmlType="submit"> |
||||
|
搜索 |
||||
|
</Button> |
||||
|
</Form.Item> |
||||
|
</Form> |
||||
|
<div style={{ display: 'flex' }}> |
||||
|
<Button type="primary" onClick={() => { |
||||
|
console.log(45513); |
||||
|
setAddModel(true) |
||||
|
}}>新建结构物</Button> |
||||
|
<Button type="primary" style={{ marginLeft: 20 }} onClick={() => { |
||||
|
console.log(45513); |
||||
|
setAddModel(true) |
||||
|
}}>一键生成二维码</Button> |
||||
|
</div> |
||||
|
|
||||
|
</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 }); |
||||
|
projectList({ limit: pageSize, page: page - 1, ...search, companyId: companyID || search?.companyId }) |
||||
|
} |
||||
|
}} |
||||
|
/> |
||||
|
{ |
||||
|
<Modal |
||||
|
// title={ }
|
||||
|
width={570} |
||||
|
open={isPicture} |
||||
|
onOk={() => { }} |
||||
|
footer={null} |
||||
|
onCancel={() => { |
||||
|
setIsPicture(false) |
||||
|
setPictureUrl('') |
||||
|
}} |
||||
|
> |
||||
|
{pictureUrl && pictureUrl[0] ? <img src={`/_file-server/${pictureUrl}`} width={500} /> : "暂无图片"} |
||||
|
</Modal> |
||||
|
} |
||||
|
{ |
||||
|
addModel ? |
||||
|
<ProjectAddModel |
||||
|
firmList={firmList} |
||||
|
modelData={modelData} |
||||
|
close={() => { |
||||
|
setAddModel(false) |
||||
|
setModelData({}) |
||||
|
}} |
||||
|
success={() => { |
||||
|
setAddModel(false) |
||||
|
setModelData({}) |
||||
|
setQuery({ limit: 10, page: 0 }); |
||||
|
projectList({ limit: 10, page: 0, ...search, companyId: companyID || search?.companyId }) |
||||
|
}} |
||||
|
/> : "" |
||||
|
} |
||||
|
</> |
||||
|
) |
||||
|
} |
||||
|
|
||||
|
function mapStateToProps (state) { |
||||
|
const { auth, global } = state; |
||||
|
return { |
||||
|
user: auth.user, |
||||
|
actions: global.actions, |
||||
|
}; |
||||
|
} |
||||
|
|
||||
|
export default connect(mapStateToProps)(Information); |
@ -1,19 +1,24 @@ |
|||||
'use strict'; |
'use strict'; |
||||
import { RiskReport, ProjectSituation, Coordinate, ProblemReport } from './containers'; |
import { Information,QrCode } from './containers'; |
||||
|
|
||||
export default [{ |
export default [{ |
||||
type: 'inner', |
type: 'inner', |
||||
route: { |
route: { |
||||
path: '/projectRegime', |
path: '/projectRegime', |
||||
key: 'projectRegime', |
key: 'projectRegime', |
||||
breadcrumb: '项目管理', |
breadcrumb: '结构物管理', |
||||
// 不设置 component 则面包屑禁止跳转
|
// 不设置 component 则面包屑禁止跳转
|
||||
childRoutes: [{ |
childRoutes: [{ |
||||
path: '/projectSituation', |
path: '/information', |
||||
key: 'projectSituation', |
key: 'information', |
||||
component: ProjectSituation, |
component: Information, |
||||
breadcrumb: '工程概况', |
breadcrumb: '结构物基础信息管理', |
||||
}, |
}, { |
||||
] |
path: '/qrCode', |
||||
} |
key: 'qrCode', |
||||
|
component: QrCode, |
||||
|
breadcrumb: '结构物二维码管理', |
||||
|
}, |
||||
|
] |
||||
|
} |
||||
}]; |
}]; |
Loading…
Reference in new issue