Merge branch 'master' of http://121.41.2.71:3000/wyw/mh_jy_safe_web
This commit is contained in:
commit
e007f8651f
151
package-lock.json
generated
151
package-lock.json
generated
@ -5,6 +5,9 @@
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "mh_jy_safe_web",
|
||||
"version": "1.0.0",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@ant-design/icons": "^5.2.6",
|
||||
"@antv/data-set": "0.9.6",
|
||||
@ -15,6 +18,7 @@
|
||||
"autobind-decorator": "2.3.1",
|
||||
"babel-plugin-import": "1.11.0",
|
||||
"bizcharts": "3.4.1",
|
||||
"braft-editor": "^2.3.9",
|
||||
"buffer": "^6.0.3",
|
||||
"canvg": "^3.0.6",
|
||||
"core-js": "^3.44.0",
|
||||
@ -4188,6 +4192,82 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/braft-editor": {
|
||||
"version": "2.3.9",
|
||||
"resolved": "https://registry.npmmirror.com/braft-editor/-/braft-editor-2.3.9.tgz",
|
||||
"integrity": "sha512-mqdPk/zI2dhFK8tW/A4Qj/AkkARLh5L/niNw+iif5wFqb6zh15rMlrShgz1nWO/QXyAKr8XtDgxiBbR0zWwtRg==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.0.0",
|
||||
"braft-convert": "^2.3.0",
|
||||
"braft-finder": "^0.0.19",
|
||||
"braft-utils": "^3.0.8",
|
||||
"draft-convert": "^2.0.0",
|
||||
"draft-js": "^0.10.3",
|
||||
"draft-js-multidecorators": "^1.0.0",
|
||||
"draftjs-utils": "^0.9.4",
|
||||
"immutable": "~3.7.4"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^15.0.2|| ^16.0.0-rc || ^16.0.0",
|
||||
"react-dom": "^15.0.2|| ^16.0.0-rc || ^16.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/braft-editor/node_modules/braft-convert": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/braft-convert/-/braft-convert-2.3.0.tgz",
|
||||
"integrity": "sha512-5km+dLHk8iYDv2iEYDrDQ2ld/ZoUx66QLql0qdm5PqZEcNXc8dBHGLORfzeu3iMw1jLeAiHxtdY5+ypuIhczVg==",
|
||||
"dependencies": {
|
||||
"draft-convert": "^2.0.0",
|
||||
"draft-js": "^0.10.3"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/braft-editor/node_modules/braft-finder": {
|
||||
"version": "0.0.19",
|
||||
"resolved": "https://registry.npmmirror.com/braft-finder/-/braft-finder-0.0.19.tgz",
|
||||
"integrity": "sha512-0kzI6/KbomJJhYX1hpjn4edCKhblyUyWdUrsgBmOrwy0vrj+pPkm69+Uf8Uj6KGAULM6LF0ooC++p7fqUGgFHw==",
|
||||
"peerDependencies": {
|
||||
"react": "^16.4.1",
|
||||
"react-dom": "^16.4.1"
|
||||
}
|
||||
},
|
||||
"node_modules/braft-editor/node_modules/braft-utils": {
|
||||
"version": "3.0.13",
|
||||
"resolved": "https://registry.npmmirror.com/braft-utils/-/braft-utils-3.0.13.tgz",
|
||||
"integrity": "sha512-92YNlc5RW3mNMo0zbWhnqz8PWr21AAPPhnfn3ZUoXM9+wBIuJQe6UyvOas+MEG9UOGFrvTDPbq60P3fdEhyMQQ==",
|
||||
"peerDependencies": {
|
||||
"braft-convert": "^2.1.4",
|
||||
"draft-js": "^0.10.5",
|
||||
"draftjs-utils": "^0.9.4",
|
||||
"immutable": "~3.7.4"
|
||||
}
|
||||
},
|
||||
"node_modules/braft-editor/node_modules/draft-convert": {
|
||||
"version": "2.1.13",
|
||||
"resolved": "https://registry.npmmirror.com/draft-convert/-/draft-convert-2.1.13.tgz",
|
||||
"integrity": "sha512-/h/n4JCfyO8aWby7wKBkccHdsuVbbDyHWXi/B3Zf2pN++lN1lDOIVt5ulXCcbH2Y5YJEFzMJw/YGfN+R0axxxg==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.5.5",
|
||||
"immutable": "~3.7.4",
|
||||
"invariant": "^2.2.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"draft-js": ">=0.7.0",
|
||||
"react": "^15.0.2 || ^16.0.0-rc || ^16.0.0 || ^17.0.0 || ^18.0.0",
|
||||
"react-dom": "^15.0.2 || ^16.0.0-rc || ^16.0.0 || ^17.0.0 || ^18.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/braft-editor/node_modules/draftjs-utils": {
|
||||
"version": "0.9.4",
|
||||
"resolved": "https://registry.npmmirror.com/draftjs-utils/-/draftjs-utils-0.9.4.tgz",
|
||||
"integrity": "sha512-KYjABSbGpJrwrwmxVj5UhfV37MF/p0QRxKIyL+/+QOaJ8J9z1FBKxkblThbpR0nJi9lxPQWGg+gh+v0dAsSCCg==",
|
||||
"peerDependencies": {
|
||||
"draft-js": "^0.10.x",
|
||||
"immutable": "3.x.x || 4.x.x"
|
||||
}
|
||||
},
|
||||
"node_modules/brorand": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/brorand/-/brorand-1.1.0.tgz",
|
||||
@ -7242,6 +7322,14 @@
|
||||
"react-dom": "^0.14.0 || ^15.0.0-rc || ^16.0.0-rc || ^16.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/draft-js-multidecorators": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/draft-js-multidecorators/-/draft-js-multidecorators-1.0.0.tgz",
|
||||
"integrity": "sha512-7qdy+YQol5iq38AoEerhgSJWhCzxvZLn1x5ODfUlGfWlg0SrZ9AXJbaxHVIjdSIZNrbVIm+WANujNxMqCmDSZQ==",
|
||||
"dependencies": {
|
||||
"immutable": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/duck": {
|
||||
"version": "0.1.12",
|
||||
"resolved": "https://registry.npmmirror.com/duck/-/duck-0.1.12.tgz",
|
||||
@ -29824,6 +29912,61 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"braft-editor": {
|
||||
"version": "2.3.9",
|
||||
"resolved": "https://registry.npmmirror.com/braft-editor/-/braft-editor-2.3.9.tgz",
|
||||
"integrity": "sha512-mqdPk/zI2dhFK8tW/A4Qj/AkkARLh5L/niNw+iif5wFqb6zh15rMlrShgz1nWO/QXyAKr8XtDgxiBbR0zWwtRg==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.0.0",
|
||||
"braft-convert": "^2.3.0",
|
||||
"braft-finder": "^0.0.19",
|
||||
"braft-utils": "^3.0.8",
|
||||
"draft-convert": "^2.0.0",
|
||||
"draft-js": "^0.10.3",
|
||||
"draft-js-multidecorators": "^1.0.0",
|
||||
"draftjs-utils": "^0.9.4",
|
||||
"immutable": "~3.7.4"
|
||||
},
|
||||
"dependencies": {
|
||||
"braft-convert": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/braft-convert/-/braft-convert-2.3.0.tgz",
|
||||
"integrity": "sha512-5km+dLHk8iYDv2iEYDrDQ2ld/ZoUx66QLql0qdm5PqZEcNXc8dBHGLORfzeu3iMw1jLeAiHxtdY5+ypuIhczVg==",
|
||||
"requires": {
|
||||
"draft-convert": "^2.0.0",
|
||||
"draft-js": "^0.10.3"
|
||||
}
|
||||
},
|
||||
"braft-finder": {
|
||||
"version": "0.0.19",
|
||||
"resolved": "https://registry.npmmirror.com/braft-finder/-/braft-finder-0.0.19.tgz",
|
||||
"integrity": "sha512-0kzI6/KbomJJhYX1hpjn4edCKhblyUyWdUrsgBmOrwy0vrj+pPkm69+Uf8Uj6KGAULM6LF0ooC++p7fqUGgFHw==",
|
||||
"requires": {}
|
||||
},
|
||||
"braft-utils": {
|
||||
"version": "3.0.13",
|
||||
"resolved": "https://registry.npmmirror.com/braft-utils/-/braft-utils-3.0.13.tgz",
|
||||
"integrity": "sha512-92YNlc5RW3mNMo0zbWhnqz8PWr21AAPPhnfn3ZUoXM9+wBIuJQe6UyvOas+MEG9UOGFrvTDPbq60P3fdEhyMQQ==",
|
||||
"requires": {}
|
||||
},
|
||||
"draft-convert": {
|
||||
"version": "2.1.13",
|
||||
"resolved": "https://registry.npmmirror.com/draft-convert/-/draft-convert-2.1.13.tgz",
|
||||
"integrity": "sha512-/h/n4JCfyO8aWby7wKBkccHdsuVbbDyHWXi/B3Zf2pN++lN1lDOIVt5ulXCcbH2Y5YJEFzMJw/YGfN+R0axxxg==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.5.5",
|
||||
"immutable": "~3.7.4",
|
||||
"invariant": "^2.2.1"
|
||||
}
|
||||
},
|
||||
"draftjs-utils": {
|
||||
"version": "0.9.4",
|
||||
"resolved": "https://registry.npmmirror.com/draftjs-utils/-/draftjs-utils-0.9.4.tgz",
|
||||
"integrity": "sha512-KYjABSbGpJrwrwmxVj5UhfV37MF/p0QRxKIyL+/+QOaJ8J9z1FBKxkblThbpR0nJi9lxPQWGg+gh+v0dAsSCCg==",
|
||||
"requires": {}
|
||||
}
|
||||
}
|
||||
},
|
||||
"brorand": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/brorand/-/brorand-1.1.0.tgz",
|
||||
@ -32170,6 +32313,14 @@
|
||||
"object-assign": "^4.1.0"
|
||||
}
|
||||
},
|
||||
"draft-js-multidecorators": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/draft-js-multidecorators/-/draft-js-multidecorators-1.0.0.tgz",
|
||||
"integrity": "sha512-7qdy+YQol5iq38AoEerhgSJWhCzxvZLn1x5ODfUlGfWlg0SrZ9AXJbaxHVIjdSIZNrbVIm+WANujNxMqCmDSZQ==",
|
||||
"requires": {
|
||||
"immutable": "*"
|
||||
}
|
||||
},
|
||||
"duck": {
|
||||
"version": "0.1.12",
|
||||
"resolved": "https://registry.npmmirror.com/duck/-/duck-0.1.12.tgz",
|
||||
|
||||
@ -19,6 +19,7 @@
|
||||
"autobind-decorator": "2.3.1",
|
||||
"babel-plugin-import": "1.11.0",
|
||||
"bizcharts": "3.4.1",
|
||||
"braft-editor": "^2.3.9",
|
||||
"buffer": "^6.0.3",
|
||||
"canvg": "^3.0.6",
|
||||
"core-js": "^3.44.0",
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -60,7 +60,6 @@ class ListPage extends React.Component {
|
||||
|
||||
loadData = (params) => {
|
||||
if (this.state.loadDataFunc) {
|
||||
console.log('调用查询中间过程', 5)
|
||||
if (!this.state.loadDataFunc.length) {
|
||||
this.directSearchStop = true
|
||||
this.directSearchParams = params
|
||||
@ -88,7 +87,6 @@ class ListPage extends React.Component {
|
||||
loadDataFunc: data
|
||||
}, () => {
|
||||
if (!this.props.preventDefaultSearch || this.directSearchStop) {
|
||||
console.log('调用查询中间过程', 4)
|
||||
this.refOfSearch && this.refOfSearch.handleSearch()
|
||||
}
|
||||
})
|
||||
|
||||
@ -19,7 +19,7 @@ const config = {
|
||||
local: {
|
||||
serviceHost: api => {
|
||||
const apis = getServiceHost(api)
|
||||
return `http://localhost:${apis}`
|
||||
return `http://121.41.2.71:${apis}`
|
||||
},
|
||||
cookieDomain: "",
|
||||
flowServiceHost: "http://124.117.209.78:3188/",
|
||||
|
||||
@ -79,7 +79,6 @@ class AdvanceSearch extends Component {
|
||||
const { search, dispatch } = this.props
|
||||
let stopSelfChangeSearch = false
|
||||
let stopSelfExtraSearch = false
|
||||
console.log('共享搜索条件', this.shareKey)
|
||||
if (this.shareKey) {
|
||||
const instances = search.shareIns[this.shareKey] || []
|
||||
// 同一 filterList 组里面的 Search 组件不共享搜索条件
|
||||
|
||||
@ -161,7 +161,6 @@ class Search extends React.Component {
|
||||
if (errorLabel) return
|
||||
|
||||
const { onSearch } = this.props
|
||||
console.log('调用查询中间过程', 2)
|
||||
onSearch instanceof Function && onSearch(rule)
|
||||
return rule
|
||||
}
|
||||
|
||||
50
src/files/edit/PF153.js
Normal file
50
src/files/edit/PF153.js
Normal file
@ -0,0 +1,50 @@
|
||||
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, setFieldValue, stateData, setFieldVisible }) => {
|
||||
if (stateData.ORG_ID != "00300000-0000-0000-0000-000000000000") {
|
||||
setFieldVisible('Nav_Orgs', false)
|
||||
}
|
||||
if (isNew) {
|
||||
setFieldValue('START', moment(new Date()).format("YYYY-MM-DD"))
|
||||
}
|
||||
},
|
||||
|
||||
handleRenderHeadControl(params) {
|
||||
if (params.colConfig.field == 'CONTENT') {
|
||||
const initialEditorState = BraftEditor.createEditorState(params.record.CONTENT || '');
|
||||
const formItemLayout = {
|
||||
labelCol: { span: 24 },
|
||||
wrapperCol: { span: 24 }
|
||||
};
|
||||
const customOrResponse = {
|
||||
lg: 24, xxl: 24
|
||||
}
|
||||
return <>
|
||||
<Col key={params.colConfig.field} {...customOrResponse}>
|
||||
<Form.Item {...formItemLayout} label="正文" >
|
||||
<BraftEditor style={{ border: "1px solid #d9d9d9", width: "98%" }}
|
||||
contentStyle={{ zIndex: 'auto' }}
|
||||
value={initialEditorState}
|
||||
onBlur={(editorState) => {
|
||||
const htmlContent = editorState.toHTML();
|
||||
if (params.record.CONTENT != htmlContent) {
|
||||
params.setFieldValue('CONTENT', htmlContent);
|
||||
}
|
||||
}}
|
||||
placeholder="请输入正文..."
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</>
|
||||
}
|
||||
},
|
||||
};
|
||||
716
src/layout/FullOther/HomeContent.js
Normal file
716
src/layout/FullOther/HomeContent.js
Normal file
@ -0,0 +1,716 @@
|
||||
// HomeContent.js
|
||||
import React, { useEffect, useRef } from 'react';
|
||||
import { Row, Col, Icon, Carousel } from 'antd';
|
||||
import styles from './../fullinter.less';
|
||||
import echarts from 'echarts';
|
||||
|
||||
class HomeContent extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.carouselRef = React.createRef();
|
||||
this.echartsInstances = {
|
||||
riskLevel: null,
|
||||
safeCheckChart: null,
|
||||
dangerOperation: null,
|
||||
backLogChart: null,
|
||||
};
|
||||
this.chartResizeHandlers = {};
|
||||
this.isUnmounted = false;
|
||||
}
|
||||
|
||||
waitForElement = (elementId, maxRetries = 10) => {
|
||||
return new Promise((resolve) => {
|
||||
let retries = 0;
|
||||
const checkInterval = setInterval(() => {
|
||||
const element = document.getElementById(elementId);
|
||||
if (element || retries >= maxRetries) {
|
||||
clearInterval(checkInterval);
|
||||
resolve(!!element);
|
||||
}
|
||||
retries++;
|
||||
}, 50);
|
||||
});
|
||||
};
|
||||
|
||||
riskLevel = async () => {
|
||||
if (this.isUnmounted) return;
|
||||
const elementExists = await this.waitForElement('riskLevelFull');
|
||||
if (!elementExists || this.isUnmounted) return;
|
||||
|
||||
if (this.echartsInstances.riskLevel) {
|
||||
this.echartsInstances.riskLevel.dispose();
|
||||
this.echartsInstances.riskLevel = null;
|
||||
}
|
||||
|
||||
const riskLevels = document.getElementById('riskLevelFull');
|
||||
if (!riskLevels) return;
|
||||
|
||||
this.echartsInstances.riskLevel = echarts.init(riskLevels);
|
||||
const data = this.props.riskTypeRate || [];
|
||||
|
||||
const option = {
|
||||
color: ['#c92a2a', '#ffa94d', '#ffe066', '#4285F4'],
|
||||
title: [
|
||||
{
|
||||
text: '风险分级占比',
|
||||
x: 'center',
|
||||
y: '5%',
|
||||
textStyle: { fontSize: 16, color: '#000' },
|
||||
},
|
||||
],
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
formatter: function (params) {
|
||||
const color = params.color;
|
||||
return `<div style="display: flex; align-items: center;">
|
||||
<span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background-color: ${color}; margin-right: 8px;"></span>
|
||||
<span>${params.name}:</span>
|
||||
<span style="font-weight: bold; margin-left: 8px; font-size: 16px;">${params.value}</span>
|
||||
</div>`;
|
||||
},
|
||||
backgroundColor: 'rgba(255, 255, 255, 0.5)',
|
||||
borderColor: '#FFFFFF',
|
||||
borderWidth: 2,
|
||||
textStyle: { color: '#000', fontSize: 14 },
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '访问来源',
|
||||
type: 'pie',
|
||||
minAngle: 20,
|
||||
radius: ['55%', '80%'],
|
||||
center: ['50%', '50%'],
|
||||
clockwise: true,
|
||||
avoidLabelOverlap: true,
|
||||
hoverOffset: 15,
|
||||
label: {
|
||||
show: true,
|
||||
position: 'inside',
|
||||
formatter: '{a|{b}:{c}}{e|({d}%)}\n',
|
||||
color: '#000',
|
||||
textBorderWidth: 0,
|
||||
rich: {
|
||||
a: { padding: [-15, 0, 0, 0], fontSize: 15, color: '#000', textBorderWidth: 0 },
|
||||
e: { fontSize: 14, color: '#000', padding: [-15, 0, 0, 5], textBorderWidth: 0 },
|
||||
},
|
||||
},
|
||||
labelLine: { normal: { show: false } },
|
||||
data: data.map((item) => ({ name: item.riskType, value: item.count })),
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
this.echartsInstances.riskLevel.setOption(option);
|
||||
|
||||
const resizeHandler = () => {
|
||||
if (this.echartsInstances.riskLevel && !this.isUnmounted) {
|
||||
this.echartsInstances.riskLevel.resize();
|
||||
}
|
||||
};
|
||||
this.chartResizeHandlers.riskLevel = resizeHandler;
|
||||
window.addEventListener('resize', resizeHandler);
|
||||
};
|
||||
|
||||
transformDat = (originalData, barTopColor, num) => {
|
||||
if (!originalData || !Array.isArray(originalData) || originalData.length === 0) {
|
||||
return { companyNames: [], series: [], legendData: [] };
|
||||
}
|
||||
|
||||
let allTypes = [];
|
||||
if (num == 1) {
|
||||
allTypes = [...new Set(originalData.flatMap((item) => item.details?.map((detail) => detail.jobName)))];
|
||||
} else {
|
||||
allTypes = [...new Set(originalData.flatMap((item) => item.details?.map((detail) => detail.name)))];
|
||||
}
|
||||
|
||||
allTypes = allTypes.filter(Boolean);
|
||||
const companyNames = originalData?.map((item) => item.company);
|
||||
const series = allTypes?.map((typeName, index) => ({
|
||||
name: typeName,
|
||||
type: 'bar',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: function (params) {
|
||||
if (num == 1) {
|
||||
return barTopColor[index];
|
||||
} else {
|
||||
return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{ offset: 0, color: barTopColor[index][0] },
|
||||
{ offset: 1, color: barTopColor[index][1] },
|
||||
]);
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
data: originalData?.map((company) => {
|
||||
const detail = company.details?.find((d) => (num == 1 ? d.jobName : d.name) === typeName);
|
||||
return detail ? detail.qty : 0;
|
||||
}),
|
||||
}));
|
||||
|
||||
return { companyNames, series, legendData: allTypes };
|
||||
};
|
||||
|
||||
safeCheckChart = async () => {
|
||||
if (this.isUnmounted) return;
|
||||
const elementExists = await this.waitForElement('safeCheckChart');
|
||||
if (!elementExists || this.isUnmounted) return;
|
||||
|
||||
if (this.echartsInstances.safeCheckChart) {
|
||||
this.echartsInstances.safeCheckChart.dispose();
|
||||
this.echartsInstances.safeCheckChart = null;
|
||||
}
|
||||
|
||||
let safeCheckCharts = document.getElementById('safeCheckChart');
|
||||
if (!safeCheckCharts) return;
|
||||
|
||||
const barTopColor = ['#02c3f1', '#53e568', '#a154e9'];
|
||||
const jobData = this.props.jobTodayTop3 || [];
|
||||
|
||||
if (jobData.length === 0) return;
|
||||
|
||||
this.echartsInstances.safeCheckChart = echarts.init(safeCheckCharts);
|
||||
let xdata = this.transformDat(jobData, barTopColor, 1);
|
||||
|
||||
this.echartsInstances.safeCheckChart.setOption({
|
||||
title: {
|
||||
text: '当日工作票排名前三家的数据',
|
||||
textStyle: { fontSize: 16, color: '#fff' },
|
||||
},
|
||||
tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } },
|
||||
legend: {
|
||||
data: xdata.legendData,
|
||||
align: 'right',
|
||||
right: 10,
|
||||
itemGap: 16,
|
||||
itemWidth: 18,
|
||||
itemHeight: 10,
|
||||
textStyle: { color: '#fff', fontSize: 14 },
|
||||
},
|
||||
color: barTopColor,
|
||||
grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true },
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: xdata.companyNames,
|
||||
axisLine: { lineStyle: { color: '#3eb2e8' } },
|
||||
axisLabel: { textStyle: { color: '#fff' } },
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
axisLine: { show: false },
|
||||
axisLabel: { textStyle: { color: '#fff' } },
|
||||
splitLine: { lineStyle: { color: '#4784e8' } },
|
||||
},
|
||||
],
|
||||
series: xdata.series,
|
||||
});
|
||||
|
||||
const resizeHandler = () => {
|
||||
if (this.echartsInstances.safeCheckChart && !this.isUnmounted) {
|
||||
this.echartsInstances.safeCheckChart.resize();
|
||||
}
|
||||
};
|
||||
this.chartResizeHandlers.safeCheckChart = resizeHandler;
|
||||
window.addEventListener('resize', resizeHandler);
|
||||
};
|
||||
|
||||
dangerOperation = async () => {
|
||||
if (this.isUnmounted) return;
|
||||
const elementExists = await this.waitForElement('dangerOperationChart');
|
||||
if (!elementExists || this.isUnmounted) return;
|
||||
|
||||
if (this.echartsInstances.dangerOperation) {
|
||||
this.echartsInstances.dangerOperation.dispose();
|
||||
this.echartsInstances.dangerOperation = null;
|
||||
}
|
||||
|
||||
const dangerOperationCharts = document.getElementById('dangerOperationChart');
|
||||
if (!dangerOperationCharts) return;
|
||||
|
||||
const linkData = this.props.linkSum || [];
|
||||
if (linkData.length === 0) return;
|
||||
|
||||
this.echartsInstances.dangerOperation = echarts.init(dangerOperationCharts);
|
||||
const xAxisData = linkData.map((item) => item.name);
|
||||
const seriesData = linkData.map((item) => item.qty);
|
||||
|
||||
const option = {
|
||||
color: ['#4285F4'],
|
||||
title: [
|
||||
{
|
||||
text: '当日工作票的统计数量',
|
||||
x: 'center',
|
||||
y: '5%',
|
||||
textStyle: { fontSize: 16, color: '#000' },
|
||||
},
|
||||
],
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: { type: 'shadow' },
|
||||
formatter: function (params) {
|
||||
const color = params[0].color;
|
||||
return `<div style="display: flex; align-items: center;">
|
||||
<span style="display: inline-block; width: 12px; height: 12px; background-color: ${color}; margin-right: 8px;"></span>
|
||||
<span>${params[0].name}:</span>
|
||||
<span style="font-weight: bold; margin-left: 8px; font-size: 16px;">${params[0].value}</span>
|
||||
</div>`;
|
||||
},
|
||||
backgroundColor: 'rgba(255, 255, 255, 0.5)',
|
||||
borderColor: '#FFFFFF',
|
||||
borderWidth: 2,
|
||||
textStyle: { color: '#000', fontSize: 14 },
|
||||
},
|
||||
grid: { left: '10%', right: '5%', top: '15%', bottom: '10%', containLabel: true },
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: xAxisData,
|
||||
axisLine: { lineStyle: { color: '#000' } },
|
||||
axisTick: { show: false },
|
||||
axisLabel: { textStyle: { color: '#000' }, rotate: 30, interval: 0 },
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: '',
|
||||
nameTextStyle: { color: '#000' },
|
||||
axisLine: { show: false },
|
||||
axisTick: { show: false },
|
||||
axisLabel: { textStyle: { color: '#000' } },
|
||||
splitLine: { show: false },
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '危险作业数量',
|
||||
type: 'bar',
|
||||
data: seriesData,
|
||||
itemStyle: {
|
||||
normal: { color: '#4285F4', barBorderRadius: 12 },
|
||||
emphasis: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' },
|
||||
},
|
||||
label: { show: true, position: 'top', textStyle: { color: '#000', fontSize: 12 }, formatter: '{c}' },
|
||||
barWidth: '60%',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
this.echartsInstances.dangerOperation.setOption(option);
|
||||
|
||||
const resizeHandler = () => {
|
||||
if (this.echartsInstances.dangerOperation && !this.isUnmounted) {
|
||||
this.echartsInstances.dangerOperation.resize();
|
||||
}
|
||||
};
|
||||
this.chartResizeHandlers.dangerOperation = resizeHandler;
|
||||
window.addEventListener('resize', resizeHandler);
|
||||
};
|
||||
|
||||
backLog = async () => {
|
||||
if (this.isUnmounted) return;
|
||||
const elementExists = await this.waitForElement('backLogChart');
|
||||
if (!elementExists || this.isUnmounted) return;
|
||||
|
||||
if (this.echartsInstances.backLogChart) {
|
||||
this.echartsInstances.backLogChart.dispose();
|
||||
this.echartsInstances.backLogChart = null;
|
||||
}
|
||||
|
||||
let backLogCharts = document.getElementById('backLogChart');
|
||||
if (!backLogCharts) return;
|
||||
|
||||
// 使用培训数据
|
||||
const { trainingData } = this.props;
|
||||
const listNAME = trainingData?.listNAME || [];
|
||||
const monthRecordCount = trainingData?.MonthRecordCount || []; // 培训场次
|
||||
const monthPersonCount = trainingData?.MonthPersonCount || []; // 培训人次
|
||||
|
||||
if (listNAME.length === 0) {
|
||||
this.echartsInstances.backLogChart = echarts.init(backLogCharts);
|
||||
this.echartsInstances.backLogChart.setOption({
|
||||
title: {
|
||||
text: '当月工作培训统计数量',
|
||||
x: 'center',
|
||||
y: 'center',
|
||||
textStyle: { fontSize: 16, color: '#999' },
|
||||
},
|
||||
graphic: {
|
||||
type: 'text',
|
||||
left: 'center',
|
||||
top: 'middle',
|
||||
style: {
|
||||
text: '暂无培训数据',
|
||||
fill: '#999',
|
||||
fontSize: 14,
|
||||
},
|
||||
},
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
this.echartsInstances.backLogChart = echarts.init(backLogCharts);
|
||||
|
||||
const option = {
|
||||
title: {
|
||||
text: '当月工作培训统计数量',
|
||||
x: 'center',
|
||||
y: '5%',
|
||||
textStyle: { fontSize: 16, color: '#000' },
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: { type: 'shadow' },
|
||||
formatter: function (params) {
|
||||
let result = `${params[0].axisValue}<br/>`;
|
||||
params.forEach((param) => {
|
||||
result += `${param.marker}${param.seriesName}: ${param.value}<br/>`;
|
||||
});
|
||||
return result;
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
data: ['培训人次', '培训场次'],
|
||||
orient: 'vertical', // 垂直排列
|
||||
right: 0, // 水平居中
|
||||
top: 'middle', // 垂直居中
|
||||
itemGap: 16, // 图例项间隔
|
||||
itemWidth: 18,
|
||||
itemHeight: 12,
|
||||
textStyle: { color: '#000', fontSize: 14 },
|
||||
},
|
||||
grid: {
|
||||
left: '5%',
|
||||
right: '5%', // 为右侧垂直图例留出空间
|
||||
top: '18%',
|
||||
bottom: '5%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: listNAME,
|
||||
axisLine: { show: false }, // 隐藏x轴线
|
||||
axisTick: { show: false }, // 隐藏x轴刻度线
|
||||
axisLabel: {
|
||||
textStyle: { color: '#000' },
|
||||
rotate: listNAME.length > 4 ? 15 : 0,
|
||||
interval: 0,
|
||||
},
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
show: true, // 显示y轴
|
||||
axisLine: { show: false }, // 隐藏y轴线
|
||||
axisTick: { show: false }, // 隐藏y轴刻度线
|
||||
axisLabel: {
|
||||
show: true, // 显示数值标签
|
||||
textStyle: { color: '#000' },
|
||||
},
|
||||
splitLine: { show: false }, // 隐藏横向网格线
|
||||
name: '', // 不显示单位名称
|
||||
nameTextStyle: { show: false }, // 隐藏单位文字
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '培训人次',
|
||||
type: 'bar',
|
||||
data: monthPersonCount,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#4285F4', // 蓝色
|
||||
barBorderRadius: 12, // 柱体圆角
|
||||
},
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
textStyle: { color: '#4285F4', fontSize: 12 },
|
||||
formatter: '{c}',
|
||||
},
|
||||
barWidth: '35%',
|
||||
},
|
||||
{
|
||||
name: '培训场次',
|
||||
type: 'bar',
|
||||
data: monthRecordCount,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#ffe066', // 黄色
|
||||
barBorderRadius: 12, // 柱体圆角(上左、上右、下右、下左)
|
||||
},
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
textStyle: { color: '#ffe066', fontSize: 12 },
|
||||
formatter: '{c}',
|
||||
},
|
||||
barWidth: '35%',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
this.echartsInstances.backLogChart.setOption(option);
|
||||
|
||||
const resizeHandler = () => {
|
||||
if (this.echartsInstances.backLogChart && !this.isUnmounted) {
|
||||
this.echartsInstances.backLogChart.resize();
|
||||
}
|
||||
};
|
||||
this.chartResizeHandlers.backLogChart = resizeHandler;
|
||||
window.addEventListener('resize', resizeHandler);
|
||||
};
|
||||
|
||||
initAllCharts = () => {
|
||||
if (this.isUnmounted) return;
|
||||
setTimeout(() => {
|
||||
if (this.isUnmounted) return;
|
||||
this.riskLevel();
|
||||
this.safeCheckChart();
|
||||
this.dangerOperation();
|
||||
this.backLog();
|
||||
}, 100);
|
||||
};
|
||||
|
||||
disposeAllCharts = () => {
|
||||
Object.keys(this.echartsInstances).forEach((key) => {
|
||||
if (this.echartsInstances[key]) {
|
||||
try {
|
||||
this.echartsInstances[key].dispose();
|
||||
} catch (e) {
|
||||
console.warn(`Dispose chart ${key} error:`, e);
|
||||
}
|
||||
this.echartsInstances[key] = null;
|
||||
}
|
||||
});
|
||||
|
||||
Object.keys(this.chartResizeHandlers).forEach((key) => {
|
||||
if (this.chartResizeHandlers[key]) {
|
||||
window.removeEventListener('resize', this.chartResizeHandlers[key]);
|
||||
}
|
||||
});
|
||||
this.chartResizeHandlers = {};
|
||||
};
|
||||
|
||||
handlePrev = () => {
|
||||
if (this.carouselRef.current) {
|
||||
this.carouselRef.current.prev();
|
||||
}
|
||||
};
|
||||
|
||||
handleNext = () => {
|
||||
if (this.carouselRef.current) {
|
||||
this.carouselRef.current.next();
|
||||
}
|
||||
};
|
||||
|
||||
handleCarouselChange = (current) => {
|
||||
this.props.onCarouselChange?.(current);
|
||||
};
|
||||
|
||||
handleDotClick = (index) => {
|
||||
this.props.onDotClick?.(index);
|
||||
if (this.carouselRef.current) {
|
||||
this.carouselRef.current.goTo(index);
|
||||
}
|
||||
};
|
||||
|
||||
componentDidMount() {
|
||||
this.isUnmounted = false;
|
||||
this.initAllCharts();
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
if (
|
||||
prevProps.riskTypeRate !== this.props.riskTypeRate ||
|
||||
prevProps.jobTodayTop3 !== this.props.jobTodayTop3 ||
|
||||
prevProps.linkSum !== this.props.linkSum ||
|
||||
prevProps.taskTop3 !== this.props.taskTop3 ||
|
||||
prevProps.trainingData !== this.props.trainingData // 新增
|
||||
) {
|
||||
this.disposeAllCharts();
|
||||
this.initAllCharts();
|
||||
}
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
this.isUnmounted = true;
|
||||
this.disposeAllCharts();
|
||||
}
|
||||
|
||||
render() {
|
||||
const {
|
||||
riskTypeRate = [],
|
||||
riskTotal = [],
|
||||
mediaList = [],
|
||||
announcementList = [],
|
||||
currentMediaIndex = 0,
|
||||
} = this.props;
|
||||
|
||||
return (
|
||||
<div className={styles.homeContentWrapper}>
|
||||
<Row className={styles.homeContentRow} gutter={0}>
|
||||
{/* 左侧区域 */}
|
||||
<Col span={7} className={styles.leftCol}>
|
||||
<div className={styles.riskCard}>
|
||||
<Row className={styles.riskRow}>
|
||||
<Col span={8} className={styles.riskStatsCol}>
|
||||
{riskTypeRate.map((item, index) => (
|
||||
<div key={index} className={`${styles.riskStatItem} ${styles['riskLevel' + item.riskType]}`}>
|
||||
<div className={styles.riskStatName}>{item.riskType}</div>
|
||||
<div className={styles.riskStatValue}>{item.count}</div>
|
||||
</div>
|
||||
))}
|
||||
</Col>
|
||||
<Col span={16} className={styles.chartCol}>
|
||||
<div id="riskLevelFull" className={styles.chartContainer}></div>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
|
||||
<div className={styles.spacer}></div>
|
||||
|
||||
<div className={styles.hiddenCard}>
|
||||
<Row className={styles.riskRow}>
|
||||
<Col span={8} className={styles.hiddenStatsCol}>
|
||||
<div className={styles.hiddenTitle}>年度隐患数据</div>
|
||||
{riskTotal.map((item, index) => (
|
||||
<div key={index} className={styles.hiddenStatItem}>
|
||||
<div className={styles.hiddenStatName}>{item.name}</div>
|
||||
<div className={styles.hiddenStatValue}>{item.value}</div>
|
||||
</div>
|
||||
))}
|
||||
</Col>
|
||||
<Col span={16} className={styles.chartCol}>
|
||||
<div id="safeCheckChart" className={styles.chartContainer}></div>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
</Col>
|
||||
|
||||
{/* 中间区域 */}
|
||||
<Col span={10} className={styles.middleCol}>
|
||||
<div className={styles.sloganCard}>
|
||||
<div className={styles.sloganText}>安全方针:以人为本、关注健康、依法治企、安全发展。</div>
|
||||
<div className={styles.sloganSubText}>安全理念:一切风险皆可控,一切事故皆可防!</div>
|
||||
</div>
|
||||
|
||||
<div className={styles.carouselCard}>
|
||||
<div className={styles.carouselWrapper}>
|
||||
<Carousel
|
||||
ref={this.carouselRef}
|
||||
autoplay
|
||||
autoplaySpeed={5000}
|
||||
effect="fade"
|
||||
dots={false}
|
||||
pauseOnHover={true}
|
||||
afterChange={this.handleCarouselChange}
|
||||
className={styles.carousel}
|
||||
>
|
||||
{mediaList.map((item, index) => (
|
||||
<div key={index} className={styles.carouselItem}>
|
||||
{item.type === 'video' ? (
|
||||
<video src={item.url} className={styles.mediaVideo} autoPlay muted loop playsInline />
|
||||
) : (
|
||||
<img src={item.url} alt={`轮播图 ${index + 1}`} className={styles.mediaImage} />
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</Carousel>
|
||||
<div className={styles.customArrowLeft} onClick={this.handlePrev}>
|
||||
<Icon type="left" style={{ fontSize: '24px', color: 'rgba(0, 0, 0, 0.5)' }} />
|
||||
</div>
|
||||
<div className={styles.customArrowRight} onClick={this.handleNext}>
|
||||
<Icon type="right" style={{ fontSize: '24px', color: 'rgba(0, 0, 0, 0.5)' }} />
|
||||
</div>
|
||||
<div className={styles.customDots}>
|
||||
{mediaList.map((_, index) => (
|
||||
<span
|
||||
key={index}
|
||||
className={`${styles.dot} ${currentMediaIndex === index ? styles.activeDot : ''}`}
|
||||
onClick={() => this.handleDotClick(index)}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={styles.announcementCard}>
|
||||
<div className={styles.announcementHeader}>
|
||||
<div className={styles.announcementTitle}>
|
||||
<Icon type="sound" className={styles.announcementIcon} />
|
||||
<span>公司公告</span>
|
||||
</div>
|
||||
<span className={styles.announcementCount}>共 {announcementList.length} 条公告</span>
|
||||
</div>
|
||||
<div className={styles.announcementList}>
|
||||
{announcementList.length > 0 ? (
|
||||
<ul className={styles.announcementUl}>
|
||||
{announcementList.map((item, index) => (
|
||||
<li
|
||||
key={item.id || index}
|
||||
className={styles.announcementItem}
|
||||
onClick={() => item.url && window.open(item.url)}
|
||||
>
|
||||
<span className={styles.announcementItemTitle} title={item.title}>
|
||||
{item.title}
|
||||
</span>
|
||||
<span className={styles.announcementItemTime}>
|
||||
{item.publishTime || item.createTime || item.date}
|
||||
</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
) : (
|
||||
<div className={styles.emptyAnnouncement}>
|
||||
<Icon type="inbox" className={styles.emptyIcon} />
|
||||
<span>暂无公告</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</Col>
|
||||
|
||||
{/* 右侧区域 */}
|
||||
<Col span={7} className={styles.rightCol}>
|
||||
<div className={styles.riskCard}>
|
||||
<Row className={styles.riskRow}>
|
||||
<Col span={8} className={styles.trainingStatsCol}>
|
||||
<div className={styles.trainingTitle}>年度培训数据</div>
|
||||
{this.props.trainingData?.listNAME?.map((name, index) => (
|
||||
<div key={index} className={styles.trainingStatItem}>
|
||||
<div className={styles.trainingStatName}>{name}</div>
|
||||
<div className={styles.trainingStatValue}>{this.props.trainingData?.YearCount?.[index] || 0}</div>
|
||||
</div>
|
||||
))}
|
||||
{/* 如果 listNAME 为空,显示默认提示 */}
|
||||
{(!this.props.trainingData?.listNAME || this.props.trainingData.listNAME.length === 0) && (
|
||||
<div style={{ textAlign: 'center', color: '#999', padding: '20px 0' }}>暂无培训数据</div>
|
||||
)}
|
||||
</Col>
|
||||
<Col span={16} className={styles.chartCol}>
|
||||
<div id="backLogChart" className={styles.chartContainer}></div>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
|
||||
<div className={styles.spacer}></div>
|
||||
|
||||
<div className={styles.dangerCard}>
|
||||
<div id="dangerOperationChart" className={styles.fullChartContainer}></div>
|
||||
</div>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default HomeContent;
|
||||
623
src/layout/FullOther/TrainingContent.js
Normal file
623
src/layout/FullOther/TrainingContent.js
Normal file
@ -0,0 +1,623 @@
|
||||
// TrainingContent.js - 安全培训页面组件
|
||||
import React from 'react';
|
||||
import { Row, Col, Select } from 'antd';
|
||||
import styles from './../fullinter.less';
|
||||
import echarts from 'echarts';
|
||||
const { Option } = Select;
|
||||
|
||||
class TrainingContent extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.echartsInstances = {
|
||||
chart1: null, // 各部门培训统计(柱状图)
|
||||
chart2: null, // 各部门培训完成率
|
||||
chart3: null, // 培训类型分布
|
||||
chart4: null, // 月度培训对比
|
||||
};
|
||||
this.chartResizeHandlers = {};
|
||||
this.isUnmounted = false;
|
||||
}
|
||||
|
||||
waitForElement = (elementId, maxRetries = 10) => {
|
||||
return new Promise((resolve) => {
|
||||
let retries = 0;
|
||||
const checkInterval = setInterval(() => {
|
||||
const element = document.getElementById(elementId);
|
||||
if (element || retries >= maxRetries) {
|
||||
clearInterval(checkInterval);
|
||||
resolve(!!element);
|
||||
}
|
||||
retries++;
|
||||
}, 50);
|
||||
});
|
||||
};
|
||||
|
||||
// 图表1: 各部门培训统计(柱状图)- 使用 trainingSubData 数据
|
||||
renderChart1 = async () => {
|
||||
if (this.isUnmounted) return;
|
||||
const elementExists = await this.waitForElement('trainingChart1');
|
||||
if (!elementExists || this.isUnmounted) return;
|
||||
|
||||
if (this.echartsInstances.chart1) {
|
||||
this.echartsInstances.chart1.dispose();
|
||||
this.echartsInstances.chart1 = null;
|
||||
}
|
||||
|
||||
const chartDom = document.getElementById('trainingChart1');
|
||||
if (!chartDom) return;
|
||||
|
||||
this.echartsInstances.chart1 = echarts.init(chartDom);
|
||||
|
||||
// 使用 props 传入的 trainingSubData 数据(来自 getHomeSESubYear 接口)
|
||||
const { trainingSubData } = this.props;
|
||||
const companyNames = trainingSubData?.listNAME || []; // CName 数组
|
||||
const personCounts = trainingSubData?.MonthPersonCount || []; // PCount 数组(培训人次)
|
||||
const recordCounts = trainingSubData?.MonthRecordCount || []; // RCount 数组(培训场次)
|
||||
|
||||
// 如果没有数据,显示暂无数据提示
|
||||
if (companyNames.length === 0) {
|
||||
this.echartsInstances.chart1.setOption({
|
||||
title: {
|
||||
text: '本年度各公司培训分析',
|
||||
x: 'center',
|
||||
y: 'center',
|
||||
textStyle: { fontSize: 16, color: '#999' },
|
||||
},
|
||||
graphic: {
|
||||
type: 'text',
|
||||
left: 'center',
|
||||
top: 'middle',
|
||||
style: {
|
||||
text: '暂无培训数据',
|
||||
fill: '#999',
|
||||
fontSize: 14,
|
||||
},
|
||||
},
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const option = {
|
||||
title: {
|
||||
text: '本年度各公司培训分析',
|
||||
x: 'center',
|
||||
y: '5%',
|
||||
textStyle: { fontSize: 16, color: '#000', fontWeight: 'bold' },
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: { type: 'shadow' },
|
||||
formatter: function (params) {
|
||||
let result = `${params[0].axisValue}<br/>`;
|
||||
params.forEach((param) => {
|
||||
const unit = param.seriesName === '培训人次' ? '人次' : '场次';
|
||||
result += `${param.marker}${param.seriesName}: ${param.value}${unit}<br/>`;
|
||||
});
|
||||
return result;
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
data: ['培训人次', '培训场次'],
|
||||
right: '3%', // 靠右
|
||||
top: '5%', // 垂直居中
|
||||
itemGap: 16,
|
||||
itemWidth: 18,
|
||||
itemHeight: 12,
|
||||
textStyle: { color: '#000', fontSize: 14 },
|
||||
},
|
||||
grid: {
|
||||
left: '5%',
|
||||
right: '5%', // 为右侧垂直图例留出空间
|
||||
top: '18%',
|
||||
bottom: '8%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: companyNames,
|
||||
axisLine: { show: false },
|
||||
axisTick: { show: false },
|
||||
axisLabel: {
|
||||
textStyle: { color: '#000' },
|
||||
rotate: companyNames.length > 4 ? 15 : 0,
|
||||
interval: 0,
|
||||
},
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
show: true,
|
||||
axisLine: { show: false },
|
||||
axisTick: { show: false },
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: { color: '#000' },
|
||||
},
|
||||
splitLine: { show: false },
|
||||
name: '',
|
||||
nameTextStyle: { show: false },
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '培训人次',
|
||||
type: 'bar',
|
||||
data: personCounts,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#4285F4', // 蓝色
|
||||
},
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
textStyle: { color: '#4285F4', fontSize: 12 },
|
||||
formatter: (params) => `${params.value}`,
|
||||
},
|
||||
barWidth: '35%',
|
||||
},
|
||||
{
|
||||
name: '培训场次',
|
||||
type: 'bar',
|
||||
data: recordCounts,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#ffe066', // 黄色
|
||||
},
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
textStyle: { color: '#d4a000', fontSize: 12 },
|
||||
formatter: (params) => `${params.value}`,
|
||||
},
|
||||
barWidth: '35%',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
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月'];
|
||||
return months.map((month, index) => (
|
||||
<Option key={index + 1} value={index + 1}>
|
||||
{month}
|
||||
</Option>
|
||||
));
|
||||
};
|
||||
|
||||
// 图表2: 各部门培训完成率(横向柱状图)
|
||||
renderChart2 = async () => {
|
||||
if (this.isUnmounted) return;
|
||||
const elementExists = await this.waitForElement('trainingChart2');
|
||||
if (!elementExists || this.isUnmounted) return;
|
||||
|
||||
if (this.echartsInstances.chart2) {
|
||||
this.echartsInstances.chart2.dispose();
|
||||
this.echartsInstances.chart2 = null;
|
||||
}
|
||||
|
||||
const chartDom = document.getElementById('trainingChart2');
|
||||
if (!chartDom) return;
|
||||
|
||||
this.echartsInstances.chart2 = echarts.init(chartDom);
|
||||
|
||||
// 使用 props 传入的 trainingSubData 数据(来自 getHomeSESubYear 接口)
|
||||
const { trainingSubDataMonth } = this.props;
|
||||
const companyNames = trainingSubDataMonth?.listNAME || []; // CName 数组
|
||||
const personCounts = trainingSubDataMonth?.MonthPersonCount || []; // PCount 数组(培训人次)
|
||||
const recordCounts = trainingSubDataMonth?.MonthRecordCount || []; // RCount 数组(培训场次)
|
||||
|
||||
// 如果没有数据,显示暂无数据提示
|
||||
if (companyNames.length === 0) {
|
||||
this.echartsInstances.chart2.setOption({
|
||||
title: {
|
||||
text: '本年度各公司培训分析',
|
||||
x: 'center',
|
||||
y: 'center',
|
||||
textStyle: { fontSize: 16, color: '#999' },
|
||||
},
|
||||
graphic: {
|
||||
type: 'text',
|
||||
left: 'center',
|
||||
top: 'middle',
|
||||
style: {
|
||||
text: '暂无培训数据',
|
||||
fill: '#999',
|
||||
fontSize: 14,
|
||||
},
|
||||
},
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const option = {
|
||||
title: {
|
||||
text: '本年度各公司培训分析',
|
||||
x: 'center',
|
||||
y: '5%',
|
||||
textStyle: { fontSize: 16, color: '#000', fontWeight: 'bold' },
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: { type: 'shadow' },
|
||||
formatter: function (params) {
|
||||
let result = `${params[0].axisValue}<br/>`;
|
||||
params.forEach((param) => {
|
||||
const unit = param.seriesName === '培训人次' ? '人次' : '场次';
|
||||
result += `${param.marker}${param.seriesName}: ${param.value}${unit}<br/>`;
|
||||
});
|
||||
return result;
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
data: ['培训人次', '培训场次'],
|
||||
right: '3%', // 靠右
|
||||
top: '5%', // 垂直居中
|
||||
itemGap: 16,
|
||||
itemWidth: 18,
|
||||
itemHeight: 12,
|
||||
textStyle: { color: '#000', fontSize: 14 },
|
||||
},
|
||||
grid: {
|
||||
left: '5%',
|
||||
right: '5%', // 为右侧垂直图例留出空间
|
||||
top: '18%',
|
||||
bottom: '8%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: companyNames,
|
||||
axisLine: { show: false },
|
||||
axisTick: { show: false },
|
||||
axisLabel: {
|
||||
textStyle: { color: '#000' },
|
||||
rotate: companyNames.length > 4 ? 15 : 0,
|
||||
interval: 0,
|
||||
},
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
show: true,
|
||||
axisLine: { show: false },
|
||||
axisTick: { show: false },
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: { color: '#000' },
|
||||
},
|
||||
splitLine: { show: false },
|
||||
name: '',
|
||||
nameTextStyle: { show: false },
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '培训人次',
|
||||
type: 'bar',
|
||||
data: personCounts,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#4285F4', // 蓝色
|
||||
},
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
textStyle: { color: '#4285F4', fontSize: 12 },
|
||||
formatter: (params) => `${params.value}`,
|
||||
},
|
||||
barWidth: '35%',
|
||||
},
|
||||
{
|
||||
name: '培训场次',
|
||||
type: 'bar',
|
||||
data: recordCounts,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#ffe066', // 黄色
|
||||
},
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
textStyle: { color: '#d4a000', fontSize: 12 },
|
||||
formatter: (params) => `${params.value}`,
|
||||
},
|
||||
barWidth: '35%',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
this.echartsInstances.chart2.setOption(option);
|
||||
this.setupResizeHandler('chart2', this.renderChart2);
|
||||
};
|
||||
|
||||
// 图表3: 培训类型分布(饼图)
|
||||
renderChart3 = async () => {
|
||||
if (this.isUnmounted) return;
|
||||
const elementExists = await this.waitForElement('trainingChart3');
|
||||
if (!elementExists || this.isUnmounted) return;
|
||||
|
||||
if (this.echartsInstances.chart3) {
|
||||
this.echartsInstances.chart3.dispose();
|
||||
this.echartsInstances.chart3 = null;
|
||||
}
|
||||
|
||||
const chartDom = document.getElementById('trainingChart3');
|
||||
if (!chartDom) return;
|
||||
|
||||
this.echartsInstances.chart3 = echarts.init(chartDom);
|
||||
|
||||
// 培训类型分布数据
|
||||
const trainingTypes = [
|
||||
{ name: '安全法规培训', value: 35 },
|
||||
{ name: '操作规程培训', value: 28 },
|
||||
{ name: '应急演练培训', value: 20 },
|
||||
{ name: '职业健康培训', value: 12 },
|
||||
{ name: '其他培训', value: 5 },
|
||||
];
|
||||
|
||||
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}%)`;
|
||||
},
|
||||
},
|
||||
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' },
|
||||
},
|
||||
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;
|
||||
}
|
||||
|
||||
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: '各部门月度培训场次对比',
|
||||
x: 'center',
|
||||
y: '5%',
|
||||
textStyle: { fontSize: 16, color: '#000', fontWeight: 'bold' },
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: { type: 'shadow' },
|
||||
formatter: function (params) {
|
||||
let result = `${params[0].axisValue}<br/>`;
|
||||
params.forEach((param) => {
|
||||
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,
|
||||
itemWidth: 18,
|
||||
itemHeight: 12,
|
||||
textStyle: { color: '#333', fontSize: 12 },
|
||||
},
|
||||
grid: {
|
||||
left: '8%',
|
||||
right: '5%',
|
||||
top: '25%',
|
||||
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],
|
||||
},
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
textStyle: { fontSize: 10 },
|
||||
formatter: '{c}',
|
||||
},
|
||||
barWidth: '25%',
|
||||
})),
|
||||
};
|
||||
|
||||
this.echartsInstances.chart4.setOption(option);
|
||||
this.setupResizeHandler('chart4', this.renderChart4);
|
||||
};
|
||||
|
||||
setupResizeHandler = (chartName, renderMethod) => {
|
||||
const resizeHandler = () => {
|
||||
if (this.echartsInstances[chartName] && !this.isUnmounted) {
|
||||
this.echartsInstances[chartName].resize();
|
||||
}
|
||||
};
|
||||
this.chartResizeHandlers[chartName] = resizeHandler;
|
||||
window.addEventListener('resize', resizeHandler);
|
||||
};
|
||||
|
||||
initAllCharts = () => {
|
||||
if (this.isUnmounted) return;
|
||||
setTimeout(() => {
|
||||
if (this.isUnmounted) return;
|
||||
this.renderChart1();
|
||||
this.renderChart2();
|
||||
this.renderChart3();
|
||||
this.renderChart4();
|
||||
}, 100);
|
||||
};
|
||||
|
||||
disposeAllCharts = () => {
|
||||
Object.keys(this.echartsInstances).forEach((key) => {
|
||||
if (this.echartsInstances[key]) {
|
||||
try {
|
||||
this.echartsInstances[key].dispose();
|
||||
} catch (e) {
|
||||
console.warn(`Dispose chart ${key} error:`, e);
|
||||
}
|
||||
this.echartsInstances[key] = null;
|
||||
}
|
||||
});
|
||||
|
||||
Object.keys(this.chartResizeHandlers).forEach((key) => {
|
||||
if (this.chartResizeHandlers[key]) {
|
||||
window.removeEventListener('resize', this.chartResizeHandlers[key]);
|
||||
}
|
||||
});
|
||||
this.chartResizeHandlers = {};
|
||||
};
|
||||
|
||||
componentDidMount() {
|
||||
this.isUnmounted = false;
|
||||
this.initAllCharts();
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
// 当 trainingSubData 或 trainingSubDataMonth 变化时重新渲染图表
|
||||
if (
|
||||
prevProps.trainingSubData !== this.props.trainingSubData ||
|
||||
prevProps.trainingSubDataMonth !== this.props.trainingSubDataMonth ||
|
||||
prevProps.selectedMonth !== this.props.selectedMonth
|
||||
) {
|
||||
// this.renderChart1();
|
||||
this.renderChart2();
|
||||
}
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
this.isUnmounted = true;
|
||||
this.disposeAllCharts();
|
||||
}
|
||||
|
||||
render() {
|
||||
const { selectedMonth = 1, onMonthChange } = this.props;
|
||||
return (
|
||||
<div className={styles.trainingContentWrapper}>
|
||||
<div className={styles.trainingGrid}>
|
||||
{/* 第一行 - 图表1和图表2 */}
|
||||
<div className={styles.trainingRow}>
|
||||
<div className={styles.trainingCard}>
|
||||
<div id="trainingChart1" className={styles.trainingChartContainer}></div>
|
||||
</div>
|
||||
<div className={styles.trainingCard}>
|
||||
{/* 添加月份选择器 */}
|
||||
<div className={styles.monthSelectorWrapper}>
|
||||
<span className={styles.monthSelectorLabel}>选择月份:</span>
|
||||
<Select
|
||||
value={selectedMonth}
|
||||
onChange={onMonthChange}
|
||||
style={{ width: 120 }}
|
||||
className={styles.monthSelect}
|
||||
>
|
||||
{this.getMonthOptions()}
|
||||
</Select>
|
||||
</div>
|
||||
<div id="trainingChart2" className={styles.trainingChartContainer}></div>
|
||||
</div>
|
||||
</div>
|
||||
{/* 第二行 - 图表3和图表4 */}
|
||||
<div className={styles.trainingRow}>
|
||||
<div className={styles.trainingCard}>
|
||||
<div id="trainingChart3" className={styles.trainingChartContainer}></div>
|
||||
</div>
|
||||
<div className={styles.trainingCard}>
|
||||
<div id="trainingChart4" className={styles.trainingChartContainer}></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default TrainingContent;
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -22,8 +22,11 @@ export default {
|
||||
return ret
|
||||
},
|
||||
*getTableData ({ payload, url, onComplete }, { call, put }) {
|
||||
console.log('执行前',appService.getTableData)
|
||||
const ret = yield call(appService.getTableData, { payload, url })
|
||||
console.log('执行后')
|
||||
if (typeof onComplete === 'function') {
|
||||
console.log('执行后',ret)
|
||||
onComplete(ret)
|
||||
}
|
||||
return ret
|
||||
|
||||
@ -116,27 +116,27 @@ 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 BI001HomeDetail = createLoadableComponent(() => import('../components/CustomPages/BI/BI001HomeDetail'))
|
||||
// const BI002HomeDetail = createLoadableComponent(() => import('../components/CustomPages/BI/BI002HomeDetail'))
|
||||
@ -321,27 +321,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} />,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user