Merge branch 'master' of http://121.41.2.71:3000/wyw/mh_jy_safe_web
This commit is contained in:
何美荣
commit
234eca9818
@ -33,33 +33,35 @@ class BI00FullScreen extends React.Component {
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {}
|
||||
componentDidMount() {
|
||||
window.open('#/popup', '_blank', 'noreferrer');
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
backgroundColor: 'white',
|
||||
width: '1200px',
|
||||
top: '0',
|
||||
bottom: '0',
|
||||
left: '0',
|
||||
right: '0',
|
||||
margin: 'auto',
|
||||
borderStyle: 'solid',
|
||||
borderColor: '#ccc',
|
||||
borderWidth: '1px',
|
||||
height: '100%',
|
||||
}}
|
||||
// style={{
|
||||
// backgroundColor: 'white',
|
||||
// width: '1200px',
|
||||
// top: '0',
|
||||
// bottom: '0',
|
||||
// left: '0',
|
||||
// right: '0',
|
||||
// margin: 'auto',
|
||||
// borderStyle: 'solid',
|
||||
// borderColor: '#ccc',
|
||||
// borderWidth: '1px',
|
||||
// height: '100%',
|
||||
// }}
|
||||
>
|
||||
<h1 style={{ textAlign: 'center', marginTop: '30px' }}>金源公司生产安全管控平台</h1>
|
||||
{/* <h1 style={{ textAlign: 'center', marginTop: '30px' }}>金源公司生产安全管控平台</h1>
|
||||
<Button
|
||||
type={this.state.filterType == 1 ? 'primary' : 'default'}
|
||||
onClick={() => window.open('#/popup', '_blank', 'noreferrer')}
|
||||
style={{ marginRight: '5px', alignItems: 'center', margin: 'auto' }}
|
||||
>
|
||||
管控平台入口
|
||||
</Button>
|
||||
</Button> */}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
51
src/files/edit/PF155.js
Normal file
51
src/files/edit/PF155.js
Normal file
@ -0,0 +1,51 @@
|
||||
import React, { useState } from 'react';
|
||||
import { Form, Col } from 'antd'
|
||||
import { extendInclude, extendRule, initFilter } from "../../utils/common";
|
||||
import moment from 'moment'
|
||||
import BraftEditor from 'braft-editor';
|
||||
import 'braft-editor/dist/index.css';
|
||||
/**
|
||||
* @return {string}
|
||||
*/
|
||||
|
||||
export default {
|
||||
onBeforeEdit: ({ isNew, login, stateData }) => {
|
||||
if (isNew) {
|
||||
stateData.STATUS = 0
|
||||
}
|
||||
},
|
||||
onBeforeSaveHandleRecord(params) {
|
||||
params.record.STATUS = params.customParams
|
||||
},
|
||||
|
||||
handleRenderHeadControl(params) {
|
||||
if (params.colConfig.field == 'TITLE') {
|
||||
const initialEditorState = BraftEditor.createEditorState(params.record.TITLE || '');
|
||||
const formItemLayout = {
|
||||
labelCol: { span: 24 },
|
||||
wrapperCol: { span: 24 }
|
||||
};
|
||||
const customOrResponse = {
|
||||
lg: 24, xxl: 24
|
||||
}
|
||||
const placeholder = '请输入' + params.colConfig.label + '...'
|
||||
return <>
|
||||
<Col key={params.colConfig.field} {...customOrResponse}>
|
||||
<Form.Item {...formItemLayout} label={params.colConfig.label} >
|
||||
<BraftEditor style={{ border: "1px solid #d9d9d9", width: "98%", height: "300px" }}
|
||||
contentStyle={{ zIndex: 'auto' }}
|
||||
value={initialEditorState}
|
||||
onBlur={(editorState) => {
|
||||
const htmlContent = editorState.toHTML();
|
||||
if (params.record.TITLE != htmlContent) {
|
||||
params.setFieldValue('TITLE', htmlContent);
|
||||
}
|
||||
}}
|
||||
placeholder={placeholder}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</>
|
||||
}
|
||||
},
|
||||
};
|
||||
20
src/files/edit/PF159.js
Normal file
20
src/files/edit/PF159.js
Normal file
@ -0,0 +1,20 @@
|
||||
import React, { useState } from 'react';
|
||||
import { Form, Col } from 'antd'
|
||||
import { extendInclude, extendRule, initFilter } from "../../utils/common";
|
||||
import moment from 'moment'
|
||||
import BraftEditor from 'braft-editor';
|
||||
import 'braft-editor/dist/index.css';
|
||||
/**
|
||||
* @return {string}
|
||||
*/
|
||||
|
||||
export default {
|
||||
onBeforeEdit: ({ isNew, login, stateData }) => {
|
||||
if (isNew) {
|
||||
stateData.STATUS = 0
|
||||
}
|
||||
},
|
||||
onBeforeSaveHandleRecord(params) {
|
||||
params.record.STATUS = params.customParams
|
||||
}
|
||||
};
|
||||
@ -335,7 +335,7 @@ class HomeContent extends React.Component {
|
||||
title: {
|
||||
text: '当月工作培训统计数量',
|
||||
x: 'center',
|
||||
y: 'center',
|
||||
y: '25%',
|
||||
textStyle: { fontSize: 16, color: '#999' },
|
||||
},
|
||||
graphic: {
|
||||
@ -343,7 +343,7 @@ class HomeContent extends React.Component {
|
||||
left: 'center',
|
||||
top: 'middle',
|
||||
style: {
|
||||
text: '暂无培训数据',
|
||||
text: '暂无数据',
|
||||
fill: '#999',
|
||||
fontSize: 14,
|
||||
},
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
// TrainingContent.js - 安全培训页面组件
|
||||
import React from 'react';
|
||||
import { Row, Col, Select } from 'antd';
|
||||
import { Row, Col, Select, Table } from 'antd';
|
||||
import styles from './../fullinter.less';
|
||||
import echarts from 'echarts';
|
||||
const { Option } = Select;
|
||||
@ -12,7 +12,6 @@ class TrainingContent extends React.Component {
|
||||
chart1: null, // 各部门培训统计（柱状图）
|
||||
chart2: null, // 各部门培训完成率
|
||||
chart3: null, // 培训类型分布
|
||||
chart4: null, // 月度培训对比
|
||||
};
|
||||
this.chartResizeHandlers = {};
|
||||
this.isUnmounted = false;
|
||||
@ -60,7 +59,7 @@ class TrainingContent extends React.Component {
|
||||
title: {
|
||||
text: '本年度各公司培训分析',
|
||||
x: 'center',
|
||||
y: 'center',
|
||||
y: '25%',
|
||||
textStyle: { fontSize: 16, color: '#999' },
|
||||
},
|
||||
graphic: {
|
||||
@ -68,7 +67,7 @@ class TrainingContent extends React.Component {
|
||||
left: 'center',
|
||||
top: 'middle',
|
||||
style: {
|
||||
text: '暂无培训数据',
|
||||
text: '暂无数据',
|
||||
fill: '#999',
|
||||
fontSize: 14,
|
||||
},
|
||||
@ -181,6 +180,7 @@ class TrainingContent extends React.Component {
|
||||
this.echartsInstances.chart1.setOption(option);
|
||||
this.setupResizeHandler('chart1', this.renderChart1);
|
||||
};
|
||||
|
||||
// 生成月份选项（1-12月）
|
||||
getMonthOptions = () => {
|
||||
const months = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'];
|
||||
@ -191,6 +191,15 @@ class TrainingContent extends React.Component {
|
||||
));
|
||||
};
|
||||
|
||||
getCompanyOptions = () => {
|
||||
const { companyData } = this.props;
|
||||
return companyData.map((company, index) => (
|
||||
<Option key={index + 1} value={company.ID}>
|
||||
{company.NAME}
|
||||
</Option>
|
||||
));
|
||||
};
|
||||
|
||||
// 图表2: 各部门培训完成率（横向柱状图）
|
||||
renderChart2 = async () => {
|
||||
if (this.isUnmounted) return;
|
||||
@ -219,7 +228,7 @@ class TrainingContent extends React.Component {
|
||||
title: {
|
||||
text: '本年度各公司培训分析',
|
||||
x: 'center',
|
||||
y: 'center',
|
||||
y: '25%',
|
||||
textStyle: { fontSize: 16, color: '#999' },
|
||||
},
|
||||
graphic: {
|
||||
@ -227,7 +236,7 @@ class TrainingContent extends React.Component {
|
||||
left: 'center',
|
||||
top: 'middle',
|
||||
style: {
|
||||
text: '暂无培训数据',
|
||||
text: '暂无数据',
|
||||
fill: '#999',
|
||||
fontSize: 14,
|
||||
},
|
||||
@ -357,97 +366,38 @@ class TrainingContent extends React.Component {
|
||||
|
||||
this.echartsInstances.chart3 = echarts.init(chartDom);
|
||||
|
||||
// 培训类型分布数据
|
||||
const trainingTypes = [
|
||||
{ name: '安全法规培训', value: 35 },
|
||||
{ name: '操作规程培训', value: 28 },
|
||||
{ name: '应急演练培训', value: 20 },
|
||||
{ name: '职业健康培训', value: 12 },
|
||||
{ name: '其他培训', value: 5 },
|
||||
];
|
||||
// 使用 props 传入的 trainingSubData 数据（来自 getHomeSESubYear 接口）
|
||||
const { trainingSubBSType } = this.props;
|
||||
const listNAME = trainingSubBSType?.listNAME || [];
|
||||
const monthRecordCount = trainingSubBSType?.MonthRecordCount || []; // 培训场次
|
||||
const monthPersonCount = trainingSubBSType?.MonthPersonCount || []; // 培训人次
|
||||
|
||||
const option = {
|
||||
title: {
|
||||
text: '培训类型分布',
|
||||
x: 'center',
|
||||
y: '5%',
|
||||
textStyle: { fontSize: 16, color: '#000', fontWeight: 'bold' },
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
formatter: function (params) {
|
||||
return `${params.name}: ${params.value}场 (${params.percent}%)`;
|
||||
// 如果没有数据，显示暂无数据提示
|
||||
if (listNAME.length === 0) {
|
||||
this.echartsInstances.chart3.setOption({
|
||||
title: {
|
||||
text: '当月公司的培训类型情况',
|
||||
x: 'center',
|
||||
y: '25%',
|
||||
textStyle: { fontSize: 16, color: '#999' },
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
orient: 'vertical',
|
||||
right: '5%',
|
||||
top: 'middle',
|
||||
itemGap: 12,
|
||||
itemWidth: 14,
|
||||
itemHeight: 10,
|
||||
textStyle: { color: '#333', fontSize: 11 },
|
||||
formatter: function (name) {
|
||||
const item = trainingTypes.find((t) => t.name === name);
|
||||
return `${name} ${item?.value || 0}场`;
|
||||
},
|
||||
},
|
||||
color: ['#4285F4', '#66bb6a', '#ffa94d', '#ab47bc', '#ef5350'],
|
||||
series: [
|
||||
{
|
||||
name: '培训场次',
|
||||
type: 'pie',
|
||||
radius: ['45%', '70%'],
|
||||
center: ['40%', '55%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: true,
|
||||
position: 'outside',
|
||||
formatter: '{b}: {d}%',
|
||||
textStyle: { fontSize: 11, color: '#333' },
|
||||
graphic: {
|
||||
type: 'text',
|
||||
left: 'center',
|
||||
top: 'middle',
|
||||
style: {
|
||||
text: '暂无数据',
|
||||
fill: '#999',
|
||||
fontSize: 14,
|
||||
},
|
||||
emphasis: {
|
||||
label: { show: true, fontSize: 14, fontWeight: 'bold' },
|
||||
},
|
||||
labelLine: { length: 8, length2: 8, smooth: true },
|
||||
data: trainingTypes,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
this.echartsInstances.chart3.setOption(option);
|
||||
this.setupResizeHandler('chart3', this.renderChart3);
|
||||
};
|
||||
|
||||
// 图表4: 月度培训对比（分组柱状图）
|
||||
renderChart4 = async () => {
|
||||
if (this.isUnmounted) return;
|
||||
const elementExists = await this.waitForElement('trainingChart4');
|
||||
if (!elementExists || this.isUnmounted) return;
|
||||
|
||||
if (this.echartsInstances.chart4) {
|
||||
this.echartsInstances.chart4.dispose();
|
||||
this.echartsInstances.chart4 = null;
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const chartDom = document.getElementById('trainingChart4');
|
||||
if (!chartDom) return;
|
||||
|
||||
this.echartsInstances.chart4 = echarts.init(chartDom);
|
||||
|
||||
// 近6个月各部门培训场次对比
|
||||
const months = ['1月', '2月', '3月', '4月', '5月', '6月'];
|
||||
const departments = ['安全部', '生产部', '技术部'];
|
||||
|
||||
const seriesData = [
|
||||
{ name: '安全部', data: [5, 6, 7, 8, 7, 9], color: '#4285F4' },
|
||||
{ name: '生产部', data: [8, 9, 10, 11, 12, 13], color: '#66bb6a' },
|
||||
{ name: '技术部', data: [4, 5, 6, 6, 7, 8], color: '#ffa94d' },
|
||||
];
|
||||
|
||||
const option = {
|
||||
title: {
|
||||
text: '各部门月度培训场次对比',
|
||||
text: '当月公司的培训类型情况',
|
||||
x: 'center',
|
||||
y: '5%',
|
||||
textStyle: { fontSize: 16, color: '#000', fontWeight: 'bold' },
|
||||
@ -458,62 +408,166 @@ class TrainingContent extends React.Component {
|
||||
formatter: function (params) {
|
||||
let result = `${params[0].axisValue}<br/>`;
|
||||
params.forEach((param) => {
|
||||
result += `${param.marker}${param.seriesName}: ${param.value}场<br/>`;
|
||||
result += `${param.marker}${param.seriesName}: ${param.value}<br/>`;
|
||||
});
|
||||
return result;
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
data: seriesData.map((s) => s.name),
|
||||
orient: 'horizontal',
|
||||
left: 'center',
|
||||
top: '15%',
|
||||
itemGap: 20,
|
||||
data: ['培训人次', '培训场次'],
|
||||
right: '3%', // 靠右
|
||||
top: '5%', // 垂直居中
|
||||
itemGap: 16,
|
||||
itemWidth: 18,
|
||||
itemHeight: 12,
|
||||
textStyle: { color: '#333', fontSize: 12 },
|
||||
textStyle: { color: '#000', fontSize: 14 },
|
||||
},
|
||||
grid: {
|
||||
left: '8%',
|
||||
right: '5%',
|
||||
top: '25%',
|
||||
left: '5%',
|
||||
right: '5%', // 为右侧垂直图例留出空间
|
||||
top: '18%',
|
||||
bottom: '8%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: months,
|
||||
axisLine: { lineStyle: { color: '#666' } },
|
||||
axisLabel: { textStyle: { color: '#333' } },
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '培训场次',
|
||||
axisLabel: { textStyle: { color: '#666' } },
|
||||
splitLine: { lineStyle: { color: '#e0e0e0' } },
|
||||
},
|
||||
series: seriesData.map((s) => ({
|
||||
name: s.name,
|
||||
type: 'bar',
|
||||
data: s.data,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: s.color,
|
||||
barBorderRadius: [4, 4, 0, 0],
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: listNAME,
|
||||
axisLine: { show: false },
|
||||
axisTick: { show: false },
|
||||
axisLabel: {
|
||||
textStyle: { color: '#000' },
|
||||
rotate: listNAME.length > 4 ? 15 : 0,
|
||||
interval: 0,
|
||||
},
|
||||
},
|
||||
label: {
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
show: true,
|
||||
position: 'top',
|
||||
textStyle: { fontSize: 10 },
|
||||
formatter: '{c}',
|
||||
axisLine: { show: false },
|
||||
axisTick: { show: false },
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: { color: '#000' },
|
||||
},
|
||||
splitLine: { show: false },
|
||||
name: '',
|
||||
nameTextStyle: { show: false },
|
||||
},
|
||||
barWidth: '25%',
|
||||
})),
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '培训人次',
|
||||
type: 'bar',
|
||||
data: monthPersonCount,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#4285F4', // 蓝色
|
||||
},
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
textStyle: { color: '#4285F4', fontSize: 12 },
|
||||
formatter: (params) => `${params.value}`,
|
||||
},
|
||||
barWidth: '35%',
|
||||
},
|
||||
{
|
||||
name: '培训场次',
|
||||
type: 'bar',
|
||||
data: monthRecordCount,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#ffe066', // 黄色
|
||||
},
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
textStyle: { color: '#d4a000', fontSize: 12 },
|
||||
formatter: (params) => `${params.value}`,
|
||||
},
|
||||
barWidth: '35%',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
this.echartsInstances.chart4.setOption(option);
|
||||
this.setupResizeHandler('chart4', this.renderChart4);
|
||||
this.echartsInstances.chart3.setOption(option);
|
||||
this.setupResizeHandler('chart3', this.renderChart3);
|
||||
};
|
||||
|
||||
// 表格4: 特种作业操作证统计表格
|
||||
renderCertificateTable = () => {
|
||||
const { trainingSubIDCard } = this.props;
|
||||
|
||||
// 如果没有数据，返回空
|
||||
if (!trainingSubIDCard || trainingSubIDCard.length === 0) {
|
||||
return <div style={{ textAlign: 'center', padding: '50px', color: '#999' }}>暂无证书数据</div>;
|
||||
}
|
||||
|
||||
// 第一行是表头
|
||||
const headers = trainingSubIDCard[0] || [];
|
||||
// 数据行（从第二行开始）
|
||||
const dataRows = trainingSubIDCard.slice(1);
|
||||
// 计算每列的最小宽度（根据表头文字长度）
|
||||
const getColumnWidth = (header) => {
|
||||
const chineseCharWidth = 14; // 中文字符宽度(px)
|
||||
const paddingWidth = 32; // 单元格内边距
|
||||
const minWidth = 100; // 最小宽度
|
||||
const maxWidth = 300; // 最大宽度
|
||||
const textLength = header.length;
|
||||
const calculatedWidth = textLength * chineseCharWidth + paddingWidth;
|
||||
return Math.max(calculatedWidth, minWidth);
|
||||
};
|
||||
|
||||
// 生成表格列配置
|
||||
const columns = headers.map((header, index) => ({
|
||||
title: header,
|
||||
dataIndex: `col${index}`,
|
||||
key: `col${index}`,
|
||||
align: 'center',
|
||||
width: getColumnWidth(header),
|
||||
fixed: index === 0 ? 'left' : index === headers.length - 1 ? 'right' : undefined,
|
||||
render: (text) => {
|
||||
if (header === '小计') {
|
||||
return <strong style={{ color: '#4285f4' }}>{text}</strong>;
|
||||
}
|
||||
// 如果是公司列，加粗显示
|
||||
if (header === '公司') {
|
||||
return <strong>{text}</strong>;
|
||||
}
|
||||
return text;
|
||||
},
|
||||
}));
|
||||
|
||||
// 转换数据格式为表格所需格式
|
||||
const tableData = dataRows.map((row, rowIndex) => {
|
||||
const rowData = { key: rowIndex };
|
||||
row.forEach((cell, colIndex) => {
|
||||
rowData[`col${colIndex}`] = cell;
|
||||
});
|
||||
return rowData;
|
||||
});
|
||||
|
||||
// 横向滚动配置（当列数过多时）
|
||||
const scrollConfig = columns.length > 10 ? { x: columns.length * 100, y: 380 } : {};
|
||||
|
||||
return (
|
||||
<div style={{ height: '100%', overflow: 'hidden', padding: '10px' }}>
|
||||
<Table
|
||||
columns={columns}
|
||||
dataSource={tableData}
|
||||
pagination={false}
|
||||
scroll={scrollConfig}
|
||||
size="small"
|
||||
bordered
|
||||
className={styles.certificateTable}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
setupResizeHandler = (chartName, renderMethod) => {
|
||||
@ -533,7 +587,6 @@ class TrainingContent extends React.Component {
|
||||
this.renderChart1();
|
||||
this.renderChart2();
|
||||
this.renderChart3();
|
||||
this.renderChart4();
|
||||
}, 100);
|
||||
};
|
||||
|
||||
@ -565,13 +618,18 @@ class TrainingContent extends React.Component {
|
||||
componentDidUpdate(prevProps) {
|
||||
// 当 trainingSubData 或 trainingSubDataMonth 变化时重新渲染图表
|
||||
if (
|
||||
prevProps.trainingSubData !== this.props.trainingSubData ||
|
||||
prevProps.trainingSubDataMonth !== this.props.trainingSubDataMonth ||
|
||||
prevProps.selectedMonth !== this.props.selectedMonth
|
||||
) {
|
||||
// this.renderChart1();
|
||||
this.renderChart2();
|
||||
}
|
||||
if (
|
||||
prevProps.trainingSubBSType !== this.props.trainingSubBSType ||
|
||||
prevProps.selectedCompany !== this.props.selectedCompany
|
||||
) {
|
||||
this.renderChart3();
|
||||
}
|
||||
// 当 trainingSubIDCard 变化时，表格会自动更新，不需要额外处理
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
@ -580,7 +638,7 @@ class TrainingContent extends React.Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
const { selectedMonth = 1, onMonthChange } = this.props;
|
||||
const { selectedMonth = 1, onMonthChange, onCompanyChange, selectedCompany } = this.props;
|
||||
return (
|
||||
<div className={styles.trainingContentWrapper}>
|
||||
<div className={styles.trainingGrid}>
|
||||
@ -605,13 +663,40 @@ class TrainingContent extends React.Component {
|
||||
<div id="trainingChart2" className={styles.trainingChartContainer}></div>
|
||||
</div>
|
||||
</div>
|
||||
{/* 第二行 - 图表3和图表4 */}
|
||||
{/* 第二行 - 图表3和表格4 */}
|
||||
<div className={styles.trainingRow}>
|
||||
<div className={styles.trainingCard}>
|
||||
{/* 添加公司选择器 */}
|
||||
<div className={styles.monthSelectorWrapper}>
|
||||
<span className={styles.monthSelectorLabel}>选择公司：</span>
|
||||
<Select
|
||||
value={selectedCompany}
|
||||
onChange={onCompanyChange}
|
||||
style={{ width: 120 }}
|
||||
className={styles.monthSelect}
|
||||
allowClear
|
||||
placeholder="请选择公司"
|
||||
>
|
||||
{this.getCompanyOptions()}
|
||||
</Select>
|
||||
</div>
|
||||
<div id="trainingChart3" className={styles.trainingChartContainer}></div>
|
||||
</div>
|
||||
<div className={styles.trainingCard}>
|
||||
<div id="trainingChart4" className={styles.trainingChartContainer}></div>
|
||||
<div style={{ height: '100%', display: 'flex', flexDirection: 'column' }}>
|
||||
<div
|
||||
style={{
|
||||
textAlign: 'center',
|
||||
padding: '20px 0 0 0',
|
||||
fontWeight: 'bold',
|
||||
fontSize: '17px',
|
||||
color: '#000',
|
||||
}}
|
||||
>
|
||||
特种作业操作证统计
|
||||
</div>
|
||||
<div style={{ flex: 1, overflow: 'auto' }}>{this.renderCertificateTable()}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -59,8 +59,12 @@ class FullScreen extends React.Component {
|
||||
MonthRecordCount: [],
|
||||
MonthPersonCount: [],
|
||||
},
|
||||
trainingSubIDCard: [],
|
||||
trainingSubBSType: {},
|
||||
companyData: [],
|
||||
// 新增：当前选择的月份
|
||||
selectedMonth: new Date().getMonth() + 1, // 默认当前月份，1-12
|
||||
selectedCompany: '',
|
||||
};
|
||||
this.isUnmounted = false;
|
||||
}
|
||||
@ -81,7 +85,7 @@ class FullScreen extends React.Component {
|
||||
componentDidMount() {
|
||||
this.isUnmounted = false;
|
||||
window.addEventListener('resize', this.setScale);
|
||||
// this.getHomeDataArray();
|
||||
this.getHomeDataArray();
|
||||
this.getYearPXData();
|
||||
this.loadMediaFiles();
|
||||
this.getAnnouncementData();
|
||||
@ -124,10 +128,18 @@ class FullScreen extends React.Component {
|
||||
|
||||
handleTabClick = (name) => {
|
||||
this.setState({ activeTab: name });
|
||||
if (name === '首页') {
|
||||
this.getYearPXData();
|
||||
this.loadMediaFiles();
|
||||
this.getAnnouncementData();
|
||||
}
|
||||
// 当点击安全培训tab时，获取对应数据
|
||||
if (name === '安全培训') {
|
||||
this.getHomeSESubYearData();
|
||||
this.getHomeSESubYearMonthData();
|
||||
this.getHomeSESubIDCardData();
|
||||
// this.getBSTypeMonthData();
|
||||
this.getCompanyData();
|
||||
}
|
||||
};
|
||||
|
||||
@ -234,6 +246,13 @@ class FullScreen extends React.Component {
|
||||
this.getHomeSESubYearMonthData();
|
||||
});
|
||||
};
|
||||
handleCompanyChange = (company) => {
|
||||
console.log(company, '11111');
|
||||
this.setState({ selectedCompany: company }, () => {
|
||||
// 重新获取月份数据
|
||||
this.getBSTypeMonthData();
|
||||
});
|
||||
};
|
||||
// 获取安全培训页面数据
|
||||
getHomeSESubYearMonthData = () => {
|
||||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||||
@ -266,18 +285,107 @@ class FullScreen extends React.Component {
|
||||
},
|
||||
});
|
||||
};
|
||||
getHomeSESubIDCardData = () => {
|
||||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||||
const json = initFilter(orgId);
|
||||
const currentDate = new Date();
|
||||
const year = currentDate.getFullYear();
|
||||
const month = String(currentDate.getMonth() + 1).padStart(2, '0');
|
||||
const day = String(currentDate.getDate()).padStart(2, '0');
|
||||
const currentDateStr = `${year}-${month}-${day}`; // 例如：2024-06-15
|
||||
|
||||
json.Parameter1 = currentDateStr; // 设置为当前日期
|
||||
this.props.dispatch({
|
||||
type: 'app/getDataByPost',
|
||||
payload: json,
|
||||
url: 'BI/BIHeadSE/SubCertificateType',
|
||||
onComplete: (ret) => {
|
||||
if (ret && !this.isUnmounted) {
|
||||
this.setState({
|
||||
trainingSubIDCard: ret,
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
getBSTypeMonthData = () => {
|
||||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||||
const json = initFilter(orgId);
|
||||
const currentDate = new Date();
|
||||
const year = currentDate.getFullYear();
|
||||
const month = String(currentDate.getMonth() + 1).padStart(2, '0');
|
||||
const day = String(currentDate.getDate()).padStart(2, '0');
|
||||
const currentDateStr = `${year}-${month}-${day}`; // 例如：2024-06-15
|
||||
|
||||
json.Parameter1 = currentDateStr; // 设置为当前日期
|
||||
if (this.state.selectedCompany) {
|
||||
json.Parameter2 = this.state.selectedCompany;
|
||||
}
|
||||
this.props.dispatch({
|
||||
type: 'app/getDataByPost',
|
||||
payload: json,
|
||||
url: 'BI/BIHeadSE/SubTypeMonth',
|
||||
onComplete: (ret) => {
|
||||
if (ret && !this.isUnmounted) {
|
||||
this.setState({
|
||||
trainingSubBSType: ret,
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
getCompanyData = () => {
|
||||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||||
const json = initFilter(orgId);
|
||||
this.props.dispatch({
|
||||
type: 'app/getDataByPost',
|
||||
payload: json,
|
||||
url: 'FM/Organization/OrderPaged',
|
||||
onComplete: (ret) => {
|
||||
if (ret && !this.isUnmounted) {
|
||||
//加载页面默认为绑泰
|
||||
const defaultCompany = ret.find((company) => company.ID === '00500000-0000-0000-0000-000000000000');
|
||||
this.setState({
|
||||
companyData: ret,
|
||||
});
|
||||
// 如果找到了默认公司，设置 selectedCompany
|
||||
if (defaultCompany && !this.state.selectedCompany) {
|
||||
this.setState({
|
||||
selectedCompany: defaultCompany.ID,
|
||||
});
|
||||
}
|
||||
this.getBSTypeMonthData();
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
renderOtherTabContent = () => {
|
||||
const { activeTab, trainingData, trainingSubData, trainingSubDataMonth, selectedMonth } = this.state;
|
||||
const {
|
||||
activeTab,
|
||||
trainingData,
|
||||
trainingSubData,
|
||||
trainingSubDataMonth,
|
||||
selectedMonth,
|
||||
selectedCompany,
|
||||
trainingSubBSType,
|
||||
companyData,
|
||||
trainingSubIDCard,
|
||||
} = this.state;
|
||||
// 如果是安全培训，显示专门的培训页面
|
||||
if (activeTab === '安全培训') {
|
||||
return (
|
||||
<TrainingContent
|
||||
trainingData={trainingData}
|
||||
trainingSubData={trainingSubData}
|
||||
trainingSubBSType={trainingSubBSType}
|
||||
companyData={companyData}
|
||||
trainingSubDataMonth={trainingSubDataMonth}
|
||||
selectedMonth={selectedMonth}
|
||||
selectedCompany={selectedCompany}
|
||||
onMonthChange={this.handleMonthChange}
|
||||
onCompanyChange={this.handleCompanyChange}
|
||||
trainingSubIDCard={trainingSubIDCard}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
@ -652,8 +652,8 @@
|
||||
align-items: center;
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
padding: 4px 12px;
|
||||
border-radius: 20px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
// border-radius: 20px;
|
||||
// box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.monthSelectorLabel {
|
||||
@ -673,3 +673,37 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
// 证书表格样式
|
||||
// 证书表格样式
|
||||
.certificateTable {
|
||||
margin-bottom: 20px;
|
||||
:global {
|
||||
.ant-table {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
// 表头样式
|
||||
.ant-table-thead > tr > th {
|
||||
background-color: #4285f4 !important;
|
||||
color: #ffffff !important;
|
||||
font-weight: bold;
|
||||
padding: 8px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
// 奇数行背景色
|
||||
.ant-table-tbody > tr:nth-child(odd) > td {
|
||||
background-color: #d4d5e3;
|
||||
}
|
||||
|
||||
// 偶数行背景色
|
||||
.ant-table-tbody > tr:nth-child(even) > td {
|
||||
background-color: #d0cedc;
|
||||
}
|
||||
|
||||
// hover 效果
|
||||
.ant-table-tbody > tr:hover > td {
|
||||
background-color: #e6f7ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -116,27 +116,29 @@ const SC052ShowPrint = createLoadableComponent(() => import('../components/Custo
|
||||
// const CM043ShowPrint = createLoadableComponent(() => import('../components/CustomPages/CM/CM043ShowPrint'))
|
||||
// const CM045ShowPrint = createLoadableComponent(() => import('../components/CustomPages/CM/CM045ShowPrint'))
|
||||
|
||||
// const SE001EditPage = createLoadableComponent(() => import('../components/CustomPages/SE/SE001EditPage'))
|
||||
// const SEConfigPage = createLoadableComponent(() => import('../components/CustomPages/SE/SEConfigPage'))
|
||||
// const SE005ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE005ShowPrint'))
|
||||
// const SESafeSurveyTest = createLoadableComponent(() => import('../components/CustomPages/SE/SESafeSurveyTest'))
|
||||
// const SE005ReportEdit = createLoadableComponent(() => import('../components/CustomPages/SE/SE005ReportEdit'))
|
||||
// const SE007AllView = createLoadableComponent(() => import('../components/CustomPages/SE/SE007AllView'))
|
||||
// const SE009ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE009ShowPrint'))
|
||||
// const SE011ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE011ShowPrint'))
|
||||
// const SE013ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE013ShowPrint'))
|
||||
// const SE015ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE015ShowPrint'))
|
||||
// const SE018EditPage = createLoadableComponent(() => import('../components/CustomPages/SE/SE018EditPage'))
|
||||
// const SE018PaperPage = createLoadableComponent(() => import('../components/CustomPages/SE/SE018PaperPage'))
|
||||
// const SE019ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE019ShowPrint'))
|
||||
// const SE021ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE021ShowPrint'))
|
||||
// const SE061ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE061ShowPrint'))
|
||||
// const SE071ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE071ShowPrint'))
|
||||
// const SE061PaperPage = createLoadableComponent(() => import('../components/CustomPages/SE/SE061PaperPage'))
|
||||
// const SE062ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE062ShowPrint'))
|
||||
// const SE063ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE063ShowPrint'))
|
||||
// const SE051ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE051ShowPrint'))
|
||||
// const SE007ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE007ShowPrint'))
|
||||
const SE001EditPage = createLoadableComponent(() => import('../components/CustomPages/SE/SE001EditPage'))
|
||||
const SEConfigPage = createLoadableComponent(() => import('../components/CustomPages/SE/SEConfigPage'))
|
||||
const SE005ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE005ShowPrint'))
|
||||
const SESafeSurveyTest = createLoadableComponent(() => import('../components/CustomPages/SE/SESafeSurveyTest'))
|
||||
const SE005ReportEdit = createLoadableComponent(() => import('../components/CustomPages/SE/SE005ReportEdit'))
|
||||
const SE007AllView = createLoadableComponent(() => import('../components/CustomPages/SE/SE007AllView'))
|
||||
const SE009ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE009ShowPrint'))
|
||||
const SE011ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE011ShowPrint'))
|
||||
const SE013ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE013ShowPrint'))
|
||||
const SE015ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE015ShowPrint'))
|
||||
const SE018EditPage = createLoadableComponent(() => import('../components/CustomPages/SE/SE018EditPage'))
|
||||
const SE018PaperPage = createLoadableComponent(() => import('../components/CustomPages/SE/SE018PaperPage'))
|
||||
const SE019ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE019ShowPrint'))
|
||||
const SE021ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE021ShowPrint'))
|
||||
const SE061ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE061ShowPrint'))
|
||||
const SE071ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE071ShowPrint'))
|
||||
const SE061PaperPage = createLoadableComponent(() => import('../components/CustomPages/SE/SE061PaperPage'))
|
||||
const SE062ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE062ShowPrint'))
|
||||
const SE063ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE063ShowPrint'))
|
||||
const SE051ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE051ShowPrint'))
|
||||
const SE007ShowPrint = createLoadableComponent(() => import('../components/CustomPages/SE/SE007ShowPrint'))
|
||||
const BI00FullScreen = createLoadableComponent(() => import('../components/CustomPages/BI/BI00FullScreen'));
|
||||
const BI064FormRunAnalysis = createLoadableComponent(() => import('../components/CustomPages/BI/BI064FormRunAnalysis'));
|
||||
|
||||
// const BI001HomeDetail = createLoadableComponent(() => import('../components/CustomPages/BI/BI001HomeDetail'))
|
||||
// const BI002HomeDetail = createLoadableComponent(() => import('../components/CustomPages/BI/BI002HomeDetail'))
|
||||
@ -321,27 +323,27 @@ export default function (componentName, formId, formParam, data, formCode, formD
|
||||
RiskSubmit: <RiskSubmit formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
CrucialLicenseJob: <CrucialLicenseJob formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
|
||||
// SE001EditPage: <SE001EditPage formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SEConfigPage: <SEConfigPage formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE005ShowPrint: <SE005ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SESafeSurveyTest: <SESafeSurveyTest formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE005ReportEdit: <SE005ReportEdit formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE007ShowPrint: <SE007ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE007AllView: <SE007AllView formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE009ShowPrint: <SE009ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE011ShowPrint: <SE011ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE013ShowPrint: <SE013ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE015ShowPrint: <SE015ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE018EditPage: <SE018EditPage formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE018PaperPage: <SE018PaperPage formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE019ShowPrint: <SE019ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE021ShowPrint: <SE021ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE061PaperPage: <SE061PaperPage formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE061ShowPrint: <SE061ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE071ShowPrint: <SE071ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE062ShowPrint: <SE062ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE063ShowPrint: <SE063ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SE051ShowPrint: <SE051ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE001EditPage: <SE001EditPage formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SEConfigPage: <SEConfigPage formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE005ShowPrint: <SE005ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SESafeSurveyTest: <SESafeSurveyTest formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE005ReportEdit: <SE005ReportEdit formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE007ShowPrint: <SE007ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE007AllView: <SE007AllView formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE009ShowPrint: <SE009ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE011ShowPrint: <SE011ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE013ShowPrint: <SE013ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE015ShowPrint: <SE015ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE018EditPage: <SE018EditPage formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE018PaperPage: <SE018PaperPage formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE019ShowPrint: <SE019ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE021ShowPrint: <SE021ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE061PaperPage: <SE061PaperPage formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE061ShowPrint: <SE061ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE071ShowPrint: <SE071ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE062ShowPrint: <SE062ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE063ShowPrint: <SE063ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SE051ShowPrint: <SE051ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
SCShowPrint: <SCShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
|
||||
PF136FormRunAnalysis: <PF136FormRunAnalysis formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
@ -438,6 +440,10 @@ export default function (componentName, formId, formParam, data, formCode, formD
|
||||
// SK041ShowPrint: <SK041ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SK043ShowPrint: <SK043ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
// SK045ShowPrint: <SK045ShowPrint formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
BI00FullScreen: <BI00FullScreen formId={formId} formParam={formParam} data={data} formCode={formCode} />,
|
||||
BI064FormRunAnalysis: (
|
||||
<BI064FormRunAnalysis formId={formId} formParam={formParam} data={data} formCode={formCode} />
|
||||
),
|
||||
|
||||
}[componentName]
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user