312 lines
8.8 KiB
JavaScript
312 lines
8.8 KiB
JavaScript
|
import React,{useEffect,useState,useMemo,useRef} from 'react';
|
|||
|
|
import { Form, Button, Input, Row,Table, Col, Popconfirm, InputNumber,Image,Modal,Typography, message} from 'antd';
|
|||
|
|
import { DeleteOutlined,FileWordOutlined,FilePdfOutlined,FileZipOutlined,FileExcelOutlined } from '@ant-design/icons';
|
|||
|
|
import { formItemLayout, btnItemLayout } from '../../../../components/crud/FormLayoutProps';
|
|||
|
|
import { httpget2, httppost2,xyt_httpget2 } from '../../../../utils/request';
|
|||
|
|
import apiurl from '../../../../service/apiurl';
|
|||
|
|
import NormalSelect from '../../../../components/Form/NormalSelect';
|
|||
|
|
import ZbForm from "./Zbform";
|
|||
|
|
import moment from 'moment';
|
|||
|
|
import {handleData} from "../../../../utils/tools"
|
|||
|
|
|
|||
|
|
|
|||
|
|
const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave }) => {
|
|||
|
|
|
|||
|
|
console.log("record",record);
|
|||
|
|
|
|||
|
|
const columns = [
|
|||
|
|
{
|
|||
|
|
title: "考核类目",
|
|||
|
|
dataIndex: "name",
|
|||
|
|
key:"name",
|
|||
|
|
width: 150,
|
|||
|
|
align: "center",
|
|||
|
|
onCell: (row) => ({ rowSpan: row.rowSpan || 0 })
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '指标名称',
|
|||
|
|
key: 'indicatorName',
|
|||
|
|
dataIndex: 'indicatorName',
|
|||
|
|
width: 250,
|
|||
|
|
align: "center",
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '标准分数',
|
|||
|
|
key: 'standardScore',
|
|||
|
|
dataIndex: 'standardScore',
|
|||
|
|
width: 100,
|
|||
|
|
align: "center",
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '操作', key: 'operation1', width: 240, fixed: 'right', align: 'center',
|
|||
|
|
render: (_, record) => {
|
|||
|
|
return (
|
|||
|
|
<div>
|
|||
|
|
<Popconfirm
|
|||
|
|
title="确定要删除?"
|
|||
|
|
onConfirm={() => handleDelete(record.id)}
|
|||
|
|
>
|
|||
|
|
<a>删除</a>
|
|||
|
|
</Popconfirm>
|
|||
|
|
</div>
|
|||
|
|
)
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
]
|
|||
|
|
|
|||
|
|
const templateFreqOptions = [
|
|||
|
|
{
|
|||
|
|
label: "年度",
|
|||
|
|
value:1
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
label: "季度",
|
|||
|
|
value:2
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
label: "月度",
|
|||
|
|
value:3
|
|||
|
|
},
|
|||
|
|
]
|
|||
|
|
const [form] = Form.useForm();
|
|||
|
|
const [standardScore1, setStandardScore] = useState('')
|
|||
|
|
const [zbOpen, setZbOpen] = useState(false)
|
|||
|
|
const [tableData, setTableData] = useState([])
|
|||
|
|
const [selectKeys, setSelectKeys] = useState([])
|
|||
|
|
const tableDataRef = useRef(null)
|
|||
|
|
tableDataRef.current = tableData;
|
|||
|
|
const newColumns = useMemo(() => {
|
|||
|
|
let data = columns;
|
|||
|
|
if (mode == "view") {
|
|||
|
|
data.pop();
|
|||
|
|
return data
|
|||
|
|
} else {
|
|||
|
|
return data;
|
|||
|
|
}
|
|||
|
|
}, [mode])
|
|||
|
|
const handleAddRow = () => {
|
|||
|
|
setZbOpen(true)
|
|||
|
|
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
|
|||
|
|
const handleDelete = (key) => {
|
|||
|
|
const newData = tableDataRef.current.filter((item) => item.id !== key);
|
|||
|
|
newData.forEach(item => {
|
|||
|
|
if (item.rowSpan) delete item.rowSpan;
|
|||
|
|
})
|
|||
|
|
const result = handleData(newData, "name")
|
|||
|
|
setTableData(result)
|
|||
|
|
setSelectKeys(newData.map(item => item.id))
|
|||
|
|
let total = newData.reduce((total,cur) => total + Number(cur.standardScore),0)
|
|||
|
|
setStandardScore(total)
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
|
|||
|
|
const onfinish = (values) => {
|
|||
|
|
// 校验等级划分
|
|||
|
|
if (values.excellentScore == undefined) {
|
|||
|
|
message.error("优秀分数不能为空")
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (values.goodScore == undefined) {
|
|||
|
|
message.error("良好分数不能为空")
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (values.passScore == undefined) {
|
|||
|
|
message.error("合格分数不能为空")
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
const userId = localStorage.getItem('userId')
|
|||
|
|
const userName = localStorage.getItem('userName')
|
|||
|
|
values.indicatorIds = selectKeys;
|
|||
|
|
values.standardScore = standardScore1;
|
|||
|
|
values.createUserId = userId
|
|||
|
|
values.createUserName = userName
|
|||
|
|
if (mode === 'edit') {
|
|||
|
|
onEdit(apiurl.rcgl.jdkh.khmbgl.edit,{...record,...values})
|
|||
|
|
}
|
|||
|
|
if (mode === 'save') {
|
|||
|
|
onSave(apiurl.rcgl.jdkh.khmbgl.save,values)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
const onSubmit = (data) => {
|
|||
|
|
setZbOpen(false)
|
|||
|
|
// 重新对数据做处理
|
|||
|
|
data.data.forEach(item => {
|
|||
|
|
if (item.rowSpan) delete item.rowSpan;
|
|||
|
|
})
|
|||
|
|
const result = handleData(data.data, "name")
|
|||
|
|
let total = data.data.reduce((total,cur) => total + Number(cur.standardScore),0)
|
|||
|
|
setStandardScore(total)
|
|||
|
|
setTableData(result)
|
|||
|
|
setSelectKeys(data.keys)
|
|||
|
|
// 自动填充等级划分
|
|||
|
|
form.setFieldValue("excellentScore",(total * 0.92).toFixed(2))
|
|||
|
|
form.setFieldValue("goodScore",(total * 0.85).toFixed(2))
|
|||
|
|
form.setFieldValue("passScore",(total * 0.70).toFixed(2))
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const getZbTableData = async(id) => {
|
|||
|
|
try {
|
|||
|
|
const res = await httpget2(apiurl.rcgl.jdkh.khmbgl.info + `/${id}`)
|
|||
|
|
if (res.code == 200) {
|
|||
|
|
let total = res.data.reduce((total,cur) => total + Number(cur.standardScore),0)
|
|||
|
|
setStandardScore(total)
|
|||
|
|
setSelectKeys(res.data.map(item => item.id))
|
|||
|
|
res.data.forEach(item => {
|
|||
|
|
if (item.rowSpan) delete item.rowSpan;
|
|||
|
|
})
|
|||
|
|
const result = handleData(res.data, "name")
|
|||
|
|
setTableData(result)
|
|||
|
|
}
|
|||
|
|
} catch (error) {
|
|||
|
|
console.log(error);
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
useEffect(() => {
|
|||
|
|
if (mode !== "save") {
|
|||
|
|
getZbTableData(record.id)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}, [record,mode])
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<>
|
|||
|
|
<Form
|
|||
|
|
form={form}
|
|||
|
|
{...formItemLayout}
|
|||
|
|
onFinish={onfinish}
|
|||
|
|
initialValues={record}
|
|||
|
|
>
|
|||
|
|
<Row>
|
|||
|
|
<Col span={12}>
|
|||
|
|
<Form.Item
|
|||
|
|
label="模板名称"
|
|||
|
|
name="templateName"
|
|||
|
|
rules={[
|
|||
|
|
{
|
|||
|
|
required: true,
|
|||
|
|
},
|
|||
|
|
]}
|
|||
|
|
>
|
|||
|
|
<Input disabled={mode==='view'} style={{width:'100%'}} allowClear />
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
<Col span={12}>
|
|||
|
|
<Form.Item
|
|||
|
|
label="考核频次"
|
|||
|
|
name="templateFreq"
|
|||
|
|
>
|
|||
|
|
<NormalSelect disabled={mode==='view'} style={{ width: '100%' }} allowClear options={templateFreqOptions} />
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
</Row>
|
|||
|
|
|
|||
|
|
<Row>
|
|||
|
|
<Col span={12}>
|
|||
|
|
<Form.Item
|
|||
|
|
label="考核内容"
|
|||
|
|
>
|
|||
|
|
<Button
|
|||
|
|
type="primary"
|
|||
|
|
disabled={mode == "view"}
|
|||
|
|
onClick={handleAddRow}
|
|||
|
|
style={{ width: '30%' }}>添加指标</Button>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
</Row>
|
|||
|
|
<div style={{display:"flex",justifyContent:"space-between"}}>
|
|||
|
|
<span style={{ marginLeft: "auto" }}>标准分数：{ standardScore1}</span>
|
|||
|
|
</div>
|
|||
|
|
<Table
|
|||
|
|
rowKey="id"
|
|||
|
|
columns={newColumns}
|
|||
|
|
dataSource={tableData}
|
|||
|
|
scroll={{ y: "calc( 100vh - 400px )"}}
|
|||
|
|
pagination={false}
|
|||
|
|
/>
|
|||
|
|
<Row style={{marginTop:20}}>
|
|||
|
|
<Col span={8}>
|
|||
|
|
<Form.Item label="等级划分" >
|
|||
|
|
<Form.Item label={<span style={{fontWeight:"bold"}}>优秀</span>} required colon={false}>
|
|||
|
|
<Form.Item name="excellentScore" noStyle>
|
|||
|
|
<InputNumber
|
|||
|
|
min={0}
|
|||
|
|
max={standardScore1}
|
|||
|
|
style={{ width: "45%" }}
|
|||
|
|
disabled={mode == "view"}
|
|||
|
|
/>
|
|||
|
|
</Form.Item>
|
|||
|
|
<span className="ant-form-text"> 分及以上</span>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
<Col span={8}>
|
|||
|
|
<Form.Item >
|
|||
|
|
<Form.Item label={<span style={{fontWeight:"bold"}}>良好</span>} required colon={false}>
|
|||
|
|
<Form.Item name="goodScore" noStyle >
|
|||
|
|
<InputNumber
|
|||
|
|
min={0}
|
|||
|
|
max={standardScore1}
|
|||
|
|
style={{ width: "45%" }}
|
|||
|
|
disabled={mode == "view"}
|
|||
|
|
/>
|
|||
|
|
</Form.Item>
|
|||
|
|
<span className="ant-form-text"> 分及以上</span>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
<Col span={8}>
|
|||
|
|
<Form.Item >
|
|||
|
|
<Form.Item label={<span style={{fontWeight:"bold"}}>合格</span>} required colon={false}>
|
|||
|
|
<Form.Item name="passScore" noStyle >
|
|||
|
|
<InputNumber
|
|||
|
|
min={0}
|
|||
|
|
max={standardScore1}
|
|||
|
|
style={{ width: "45%" }}
|
|||
|
|
disabled={mode == "view"}
|
|||
|
|
/>
|
|||
|
|
</Form.Item>
|
|||
|
|
<span className="ant-form-text"> 分及以上</span>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
</Row>
|
|||
|
|
{
|
|||
|
|
mode==='view'?null:(
|
|||
|
|
|
|||
|
|
<Form.Item wrapperCol={{span:2,offset:22}}>
|
|||
|
|
<Button type="primary" htmlType="submit" >
|
|||
|
|
{mode === 'save' ? '保存' :
|
|||
|
|
'修改'}
|
|||
|
|
</Button>
|
|||
|
|
</Form.Item>
|
|||
|
|
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
</Form>
|
|||
|
|
|
|||
|
|
<Modal
|
|||
|
|
open={zbOpen}
|
|||
|
|
width={1000}
|
|||
|
|
destroyOnClose
|
|||
|
|
footer={null}
|
|||
|
|
onCancel={() => {
|
|||
|
|
setZbOpen(false)
|
|||
|
|
}}
|
|||
|
|
title="选择指标"
|
|||
|
|
>
|
|||
|
|
<ZbForm onSubmit={onSubmit} selectKeys={selectKeys} />
|
|||
|
|
</Modal>
|
|||
|
|
</>
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export default ModalForm;
|