mh_jy_safe_web/src/components/CustomPages/SE/SE018EditPage.js

395 lines
18 KiB
JavaScript
Raw Normal View History

2025-08-25 10:08:30 +08:00
import { message } from "antd/lib/index";
import { Button, Popconfirm, Row, Col, Checkbox, Radio, Form, Input, Select, Table, Upload, Icon, PageHeader, Modal } from 'antd';
import React from 'react';
import { initFilter, extendRule, extendInclude, showUserSign, showFiles, GetFileModel } from "../../../utils/common";
import ReactToPrint from "react-to-print";
import styles from '../../CustomPages/HI/StepForm.css';
import XLSX from 'xlsx';
import { connect } from 'dva';
import moment from 'moment';
import config from "../../../config";
import FormPage from '../../FormPage'
class SE018EditPage extends React.Component {
constructor(props) {
super(props);
this.state = {
data: null,
missUsers: [],
leaveUsers: [],
isView: props.formCode === 'SE017_SHOWPRINT' || props.formCode === 'SE050_SHOWPRINT',
isApprove: false,
isExam: false,
isShow: "none",
//弹窗参数
detailForm: {
isShow: false,
formCode: "SE018_PAPERPAGE",
title: "培训记录答题",
ID: ''
},
passRate: 0,
isClisk: false,
fileForm: {
title: "",
visible: false,
},
};
};
componentDidMount() {
if (this.props.formCode == "SE050_SHOWPRINT") {
this.loadData(this.props.data.parentRecord.RECORD_ID);
} else {
this.loadData(this.props.data.id);
}
}
BtnClose = () => {
if (typeof this.props.data.onCancel != "undefined" && typeof this.props.data.onCancel == 'function')
this.props.data.onCancel();
}
loadData = (dataId) => {
let json = initFilter(this.props.login.OrgId, '', null, null, null);
extendRule(json, 'ID', 1, dataId);
extendInclude(json, 'Nav_Notify');
extendInclude(json, 'Nav_Notify.Nav_TrainContentList.Nav_Point');
extendInclude(json, 'Nav_Notify.Nav_LaunchDepartment');
extendInclude(json, 'Nav_Notify.Nav_LaunchUser');
extendInclude(json, 'Nav_Notify.Nav_TrainType');
2025-11-20 22:03:40 +08:00
// extendInclude(json, 'Nav_Notify.Nav_TrainCheckType');
2025-08-25 10:08:30 +08:00
extendInclude(json, 'Nav_Users.Nav_User');
extendInclude(json, 'Nav_Files.Nav_ImgFile');
extendInclude(json, 'Nav_Users.Nav_User');
extendInclude(json, 'Nav_Papers');
json.IgnoreDataRule = true;
this.props.dispatch({
type: 'app/getDataByPost',
payload: json,
url: 'SE/TrainRecord/Get',
onComplete: (ret) => {
if (!ret)
return;
this.updateData(ret);
}
});
}
updateData(data) {
let isApprove = false;
2025-11-20 22:03:40 +08:00
// if (data.Nav_Notify.Nav_TrainCheckType.NAME == "笔试") {
if (data.Nav_Notify.CHECKTYPE == 51) {
2025-08-25 10:08:30 +08:00
this.state.isExam = true;
this.state.isShow = "table-cell";
}
this.state.leaveUsers = data.Nav_Users.filter(item => item.STATUS == 1);
this.state.missUsers = data.Nav_Users.filter(item => item.STATUS == 2);
data.Nav_Users = data.Nav_Users.filter(item => item.STATUS == 0);
let uniqueUsers = data.Nav_Papers.reduce((acc, user) => {
// 如果累积数组中还没有这个 user_id则添加
if (!acc.some(item => item.USER_ID === user.USER_ID)) {
acc.push(user);
}
return acc;
}, []);
let temp = 0;
uniqueUsers.forEach(item => {
if (item.SCORE >= 80) {
temp++;
}
})
var passRateThis = 0
if (uniqueUsers && uniqueUsers.length > 0) {
passRateThis = (temp / uniqueUsers.length).toFixed(4) * 100;
}
//安环部负责人审阅中
if (data.STATUS >= 2 && this.props.formCode != "SE050_SHOWPRINT" && this.props.data.tableKey != undefined) {
isApprove = true;
}
this.setState({
data,
isApprove,
passRate: passRateThis
})
}
onApprove = () => {
let json = initFilter(this.props.login.OrgId);
json.Keyword = this.props.data.id;
json.Parameter1 = this.props.data.TaskID;
this.props.dispatch({
type: 'app/getDataByPost',
url: 'SE/SETrainRecord/Submit',
payload: json,
onComplete: (ret) => {
if (ret) {
message.success('提交成功!');
this.BtnClose();
}
}
})
}
onSignIn = () => {
if (!this.state.data || (this.state.data.STATUS !== 1) || !this.state.data.Nav_Users) {
return;
}
var ud = this.state.data.Nav_Users.find(it => it.USER_ID === this.props.login.user.ID)
if (!ud) {
return;
}
this.state.isClisk = true;
let json = initFilter(this.props.login.OrgId);
json.Keyword = this.props.data.id;
json.Parameter1 = this.props.data.TaskID;
this.props.dispatch({
type: 'app/getDataByPost',
url: 'SE/SETrainRecord/SignIn',
payload: json,
onComplete: (ret) => {
if (ret) {
message.success('签到成功');
this.BtnClose();
}
}
})
}
onTableBtnExport() {
let TableWrap = document.getElementById('tableId' + this.props.data.id);
let Table = TableWrap.getElementsByTagName('table')[0];
const wb = XLSX.utils.table_to_book(Table);
let name = '培训记录表';
name += '.xlsx';
XLSX.writeFile(wb, name)
}
returnModel(level) {
let str = '';
if (level == undefined) {
return str;
}
if (level.indexOf('1') >= 0) {
str += '讲授法 ';
}
if (level.indexOf('2') >= 0) {
str += '视听法 ';
}
if (level.indexOf('3') >= 0) {
str += '研讨法 ';
}
if (level.indexOf('4') >= 0) {
str += '演示法 ';
}
return str;
}
showDetailModal = (ID, USER_ID) => {
const newtmpData = {
data: {
id: ID,
USER_ID: USER_ID,
},
formCode: "SE018_PAPERPAGE",
};
this.setState({ tmpData: newtmpData }, () => {
var detailForm = {
isShow: true,
title: "查看成绩单",
};
this.setState({
detailForm: detailForm,
});
});
};
//详情弹窗关闭(隐藏)
detailFormClose = () => {
var detailForm = {
isShow: false,
};
this.setState({
detailForm: detailForm,
});
};
render() {
const { data, missUsers, leaveUsers } = this.state;
const signable = this.state.isView && data && data.STATUS == 1 && data.Nav_Users && data.Nav_Users.find(it => it.USER_ID === this.props.login.user.ID) && (this.props.data.tableKey == "1")
return <div>
<div>
{
this.state.isView && <>
<ReactToPrint
trigger={() => <Button type={'primary'} icon={'printer'} >打印</Button>}
content={() => this.componentRef}
/>
<Button style={{ marginLeft: '8px' }} onClick={() => this.onTableBtnExport()} icon="export" >导出</Button>
{
signable && (
<Button style={{ marginLeft: '8px' }} type="primary" onClick={() => { this.onSignIn(); }} disabled={this.state.isClisk}>
签到
</Button>
)
}
</>
}
{
this.state.isApprove && <>
<Button style={{ marginLeft: '8px' }} type="primary" onClick={() => { this.onApprove(); }}>
审阅
</Button>
</>
}
</div>
<div ref={el => (this.componentRef = el)} id={'tableId' + this.props.data.id} style={{ padding: '20px' }}>
{
this.state.isView && <h1 style={{ textAlign: 'center' }}>培训记录表</h1>
}
<table style={{ width: '100%', textAlign: 'center', border: '1px solid #888' }} className={styles.PrintForm}>
<tbody>
<tr>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>培训名称</td>
<td colSpan={20} rowSpan={1} className={styles.fontBold}>{data && data.Nav_Notify ? data.Nav_Notify.NAME : null}</td>
</tr>
<tr>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>培训类型</td>
<td colSpan={4} rowSpan={1} >{data && data.Nav_Notify.Nav_TrainType ? data.Nav_Notify.Nav_TrainType.NAME : null}</td>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>培训级别</td>
<td colSpan={4} rowSpan={1} >{data && this.props.app.enums.FMDepartmentType.enums[data.Nav_Notify.LEVEL]}</td>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>组织部门</td>
<td colSpan={4} rowSpan={1} >{data && data.Nav_Notify && data.Nav_Notify.Nav_LaunchDepartment ? data.Nav_Notify.Nav_LaunchDepartment.NAME : null}</td>
</tr>
<tr>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>培训时间</td>
<td colSpan={4} rowSpan={1} >{data && data.Nav_Notify ? `${data.Nav_Notify.TRAIN_START_TIME} - ${data.Nav_Notify.TRAIN_END_TIME}` : null}</td>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>培训地点</td>
<td colSpan={4} rowSpan={1} >{data && data.Nav_Notify ? data.Nav_Notify.TRAIN_ADDR : null}</td>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>培训学时</td>
<td colSpan={4} rowSpan={1} >{data && data.Nav_Notify ? data.Nav_Notify.HOURS : null}</td>
</tr>
<tr>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>培训老师</td>
<td colSpan={4} rowSpan={1} >{data && data.Nav_Notify ? data.Nav_Notify.TRAIN_TEACHER : null}</td>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>培训形式</td>
<td colSpan={4} rowSpan={1} >{data && this.returnModel(data.Nav_Notify.TRAIN_MODEL)}</td>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>考核方式</td>
2025-11-20 22:03:40 +08:00
{/* <td colSpan={4} rowSpan={1} >{data && data.Nav_Notify && data.Nav_Notify.Nav_TrainCheckType ? data.Nav_Notify.Nav_TrainCheckType.NAME : null}</td> */}
<td colSpan={4} rowSpan={1} >{data.Nav_Notify.CHECKTYPE && enums.PlanCheckType.enums[data.Nav_Notify.CHECKTYPE]}</td>
2025-08-25 10:08:30 +08:00
</tr>
<tr>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>培训内容</td>
<td colSpan={20} rowSpan={1} >{
data && data.Nav_Notify && data.Nav_Notify.Nav_TrainContentList && data.Nav_Notify.Nav_TrainContentList.map(it => {
return it.Nav_Point.NAME
}).join('、')
}</td>
</tr>
<tr>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>请假人员</td>
<td colSpan={20} rowSpan={1} >
{
leaveUsers && (leaveUsers.map(it => { return it.Nav_User.NAME }).join('、') || '无')
}
</td>
</tr>
<tr>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>缺席人员</td>
<td colSpan={20} rowSpan={1} >
{
missUsers && (missUsers.map(it => { return it.Nav_User.NAME }).join('、') || '无')
}
</td>
</tr>
<tr>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>培训人员</td>
<td colSpan={20} rowSpan={1} >
{
data && data.Nav_Users && (data.Nav_Users.map(it => {
if (it.OK) {
return it.Nav_User.NAME + " "
} else {
return <label style={{ color: 'red' }} title='未签到'> {it.Nav_User.NAME + " "}</label>
}
}) || '无')
}
</td>
</tr>
<tr>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>附件</td>
<td colSpan={20} rowSpan={1}>
{
showFiles(data?.Nav_Files, config.picServerHost, this)
}
</td>
</tr>
<tr>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>审阅意见</td>
<td colSpan={20} rowSpan={1} >
{
data && data.STATUS > 2 && '已阅'
}
</td>
</tr>
<tr>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>合格率</td>
<td colSpan={20} rowSpan={1} >
{this.state.passRate + '%'}
</td>
</tr>
</tbody>
</table>
{
this.state.isView && <>
<h1 style={{ textAlign: 'center', margin: '15px' }}>培训签到表</h1>
<table style={{ width: '100%', textAlign: 'center', border: '1px solid #888' }} className={styles.PrintForm}>
<tbody>
<tr>
<td colSpan={1} rowSpan={1} className={styles.fontBold}>序号</td>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>部门</td>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>工号</td>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>姓名</td>
<td colSpan={4} rowSpan={1} className={styles.fontBold}>岗位</td>
<td colSpan={8} rowSpan={1} className={styles.fontBold}>电子签名</td>
{this.state.isExam && <td colSpan={4} rowSpan={1} className={styles.fontBold}>分数</td>}
<td colSpan={2} rowSpan={1} className={styles.fontBold} style={{ display: this.state.isShow }}>查看试卷</td>
</tr>
{
this.state.isView && data && data.Nav_Users && data.Nav_Users.filter(it => it.OK).map((it, idx) => {
return <tr key={it.ID}>
<td colSpan={1} rowSpan={1}>{idx + 1}</td>
<td colSpan={4} rowSpan={1}>{it.DEPARTMENT_NAME}</td>
<td colSpan={4} rowSpan={1}>{it.Nav_User.CODE}</td>
<td colSpan={4} rowSpan={1}>{it.Nav_User.NAME}</td>
<td colSpan={4} rowSpan={1}>{it.POST_NAME}</td>
<td colSpan={8} rowSpan={1}>
{
showUserSign(it.Nav_User, config.picServerHost)
}
</td>
{this.state.isExam && <td colSpan={4} rowSpan={1}>{this.state.data.Nav_Papers.find(item => item.USER_ID == it.USER_ID)?.SCORE}</td>}
<td colSpan={2} rowSpan={1} style={{ display: this.state.isShow }}><div onClick={() => this.showDetailModal(it.RECORD_ID, it.USER_ID)}><Icon type="eye" style={{ color: "#005b9b", cursor: "pointer" }} /></div></td>
</tr>
})
}
</tbody>
</table>
</>
}
</div>
{
GetFileModel(Modal, FormPage, this, this.state.fileForm.visible)
}
<br />
<div style={{ display: "inline-block" }}>
<Modal
visible={this.state.detailForm.isShow}
title={this.state.detailForm.title}
maskClosable={false}
closeModal={this.detailFormClose}
onCancel={this.detailFormClose}
footer={null}
width="95%">
<FormPage {...this.state.tmpData} />
</Modal>
</div>
</div>
}
}
export default connect(({ login, app }) => ({ login, app }))(SE018EditPage)