823 lines
26 KiB
JavaScript
823 lines
26 KiB
JavaScript
// FullScreenInter.js - 主文件保持简洁
|
||
import React from 'react';
|
||
import { connect } from 'dva';
|
||
import { withRouter } from 'dva/router';
|
||
import { Icon, Row, Col, message } from 'antd';
|
||
import styles from './fullinter.less';
|
||
import logo from '../assets/layout/headerno-logo-new.png';
|
||
import debounce from 'lodash.debounce';
|
||
import storage from '../utils/storage';
|
||
import { initFilter, extendRule } from '../utils/common';
|
||
import HomeContent from './FullOther/HomeContent';
|
||
import TrainingContent from './FullOther/TrainingContent';
|
||
import RiskControl from './FullOther/RiskControl';
|
||
import ClassBuild from './FullOther/ClassBuild';
|
||
import DangerJob from './FullOther/DangerJob';
|
||
import HiddenSolve from './FullOther/HiddenSolve';
|
||
import moment from 'moment'; // 添加这一行
|
||
|
||
const getScale = () => {
|
||
const width = 1920,
|
||
height = 1080;
|
||
let ww = window.innerWidth / width;
|
||
let wh = window.innerHeight / height;
|
||
return ww < wh ? ww : wh;
|
||
};
|
||
|
||
class FullScreen extends React.Component {
|
||
constructor(props) {
|
||
super(props);
|
||
this.state = {
|
||
nowDate: '',
|
||
riskTypeRate: [],
|
||
riskTotal: [],
|
||
// jobTodayQty: [],
|
||
hiddenSummary: [],
|
||
taskTop3: [],
|
||
scale: getScale(),
|
||
configBanner: ['首页', '风险管控', '隐患治理', '班组建设', '危险作业', '安全培训'],
|
||
mediaList: [],
|
||
currentMediaIndex: 0,
|
||
announcementList: [],
|
||
activeTab: '首页',
|
||
// 安全培训相关数据
|
||
trainingData: {
|
||
listNAME: [],
|
||
YearCount: [],
|
||
MonthRecordCount: [],
|
||
MonthPersonCount: [],
|
||
listAnnourcement: [],
|
||
TITLE: '',
|
||
listVideoImg: [],
|
||
playSet: [],
|
||
},
|
||
trainingSubData: {
|
||
listNAME: [],
|
||
YearCount: [],
|
||
MonthRecordCount: [],
|
||
MonthPersonCount: [],
|
||
},
|
||
trainingSubDataMonth: {
|
||
listNAME: [],
|
||
YearCount: [],
|
||
MonthRecordCount: [],
|
||
MonthPersonCount: [],
|
||
},
|
||
trainingSubIDCard: [],
|
||
trainingSubBSType: {},
|
||
trainingCompanyData: [], // 安全培训专用公司数据
|
||
selectedTrainingMonth: new Date().getMonth() + 1,
|
||
selectedTrainingCompany: '',
|
||
|
||
// 隐患治理相关数据
|
||
hiddenSubData: {}, // 隐患治理数据
|
||
hiddenCompanyData: [], // 隐患治理专用公司数据
|
||
selectedHiddenCompany: '', // 隐患治理选中的公司
|
||
|
||
// 其他页面数据
|
||
riskSubData: {},
|
||
classSubData: [],
|
||
dangerSubData: {},
|
||
jobTodayQty: [],
|
||
dangerCompanyData: [],
|
||
selectedDangerCompany: '',
|
||
selectedStartDate: moment(),
|
||
selectedEndDate: moment(),
|
||
|
||
announcementDetail: null,
|
||
announcementDetailLoading: false,
|
||
announcementModalVisible: false,
|
||
currentAnnouncement: null,
|
||
};
|
||
this.isUnmounted = false;
|
||
this.dataTimer = null; // 新增：用于数据定时请求
|
||
}
|
||
|
||
setScale = debounce(() => {
|
||
if (this.isUnmounted) return;
|
||
this.setState({ scale: getScale() });
|
||
}, 500);
|
||
|
||
toggleFullscreen = () => {
|
||
if (!document.fullscreenElement) {
|
||
document.documentElement.requestFullscreen?.();
|
||
} else {
|
||
document.exitFullscreen?.();
|
||
}
|
||
};
|
||
startDataRefreshTimer = () => {
|
||
// 清除已有定时器
|
||
if (this.dataTimer) {
|
||
clearInterval(this.dataTimer);
|
||
}
|
||
|
||
// 设置新的定时器，每5分钟执行一次
|
||
this.dataTimer = setInterval(
|
||
() => {
|
||
if (!this.isUnmounted) {
|
||
if (this.state.activeTab === '首页') {
|
||
this.getHomeDataArray();
|
||
this.getYearPXData();
|
||
}
|
||
// 安全培训 - 参考原有逻辑
|
||
else if (this.state.activeTab === '安全培训') {
|
||
this.getTrainingCompanyData(); // 先获取公司列表
|
||
this.getHomeSESubYearData();
|
||
this.getHomeSESubYearMonthData();
|
||
this.getHomeSESubIDCardData();
|
||
}
|
||
// 隐患治理 - 参考安全培训的调用顺序
|
||
else if (this.state.activeTab === '隐患治理') {
|
||
this.getHiddenCompanyData(); // 先获取公司列表（与安全培训独立）
|
||
}
|
||
// 风险管控
|
||
else if (this.state.activeTab === '风险管控') {
|
||
this.getRiskSubData();
|
||
}
|
||
// 班组建设
|
||
else if (this.state.activeTab === '班组建设') {
|
||
this.getClassSubData();
|
||
}
|
||
// 危险作业
|
||
else if (this.state.activeTab === '危险作业') {
|
||
this.getDangerCompanyData();
|
||
}
|
||
}
|
||
},
|
||
5 * 60 * 1000
|
||
); // 5分钟 = 300000毫秒
|
||
};
|
||
|
||
componentDidMount() {
|
||
this.isUnmounted = false;
|
||
window.addEventListener('resize', this.setScale);
|
||
this.getHomeDataArray();
|
||
this.getYearPXData();
|
||
// 启动定时刷新
|
||
this.startDataRefreshTimer();
|
||
this.timer = setInterval(() => {
|
||
if (!this.isUnmounted) this.setState({ nowDate: this.getDate() });
|
||
}, 1000);
|
||
|
||
document.addEventListener('fullscreenchange', this.handleFullscreenChange);
|
||
}
|
||
|
||
getAnnouncementDetail = (announcement) => {
|
||
return new Promise((resolve, reject) => {
|
||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||
const json = initFilter(orgId);
|
||
extendRule(json, 'ID', 1, announcement.ID);
|
||
json.Include = ['Nav_Orgs', 'Nav_Orgs.Nav_OrgSub', 'Nav_Files.Nav_ImgFile'];
|
||
|
||
this.setState({ announcementDetailLoading: true, announcementDetail: null });
|
||
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'PF/PFAnnourcement/Get',
|
||
onComplete: (ret) => {
|
||
if (ret && !this.isUnmounted) {
|
||
this.setState({
|
||
announcementDetail: ret,
|
||
announcementDetailLoading: false,
|
||
});
|
||
resolve(ret);
|
||
} else {
|
||
message.error('暂无公告详情');
|
||
this.setState({ announcementDetailLoading: false });
|
||
reject(new Error('获取公告详情失败'));
|
||
}
|
||
},
|
||
onError: (error) => {
|
||
this.setState({ announcementDetailLoading: false });
|
||
reject(error);
|
||
},
|
||
});
|
||
});
|
||
};
|
||
|
||
handleAnnouncementClick = async (announcement) => {
|
||
try {
|
||
const detail = await this.getAnnouncementDetail(announcement);
|
||
this.setState({
|
||
currentAnnouncement: detail,
|
||
announcementModalVisible: true,
|
||
});
|
||
} catch (error) {
|
||
console.error('获取公告详情失败:', error);
|
||
}
|
||
};
|
||
|
||
handleAnnouncementModalClose = () => {
|
||
this.setState({
|
||
announcementModalVisible: false,
|
||
currentAnnouncement: null,
|
||
});
|
||
};
|
||
|
||
handleCarouselChange = (current) => {
|
||
this.setState({ currentMediaIndex: current });
|
||
};
|
||
|
||
handleDotClick = (index) => {
|
||
this.setState({ currentMediaIndex: index });
|
||
};
|
||
|
||
handleTabClick = (name) => {
|
||
this.setState({ activeTab: name });
|
||
if (name === '首页') {
|
||
this.getHomeDataArray();
|
||
this.getYearPXData();
|
||
}
|
||
// 安全培训 - 参考原有逻辑
|
||
if (name === '安全培训') {
|
||
this.getTrainingCompanyData(); // 先获取公司列表
|
||
this.getHomeSESubYearData();
|
||
this.getHomeSESubYearMonthData();
|
||
this.getHomeSESubIDCardData();
|
||
}
|
||
// 隐患治理 - 参考安全培训的调用顺序
|
||
if (name === '隐患治理') {
|
||
this.getHiddenCompanyData(); // 先获取公司列表（与安全培训独立）
|
||
}
|
||
// 风险管控
|
||
if (name === '风险管控') {
|
||
this.getRiskSubData();
|
||
}
|
||
// 班组建设
|
||
if (name === '班组建设') {
|
||
this.getClassSubData();
|
||
}
|
||
// 危险作业
|
||
if (name === '危险作业') {
|
||
this.getDangerCompanyData();
|
||
}
|
||
};
|
||
|
||
handleFullscreenChange = () => {
|
||
this.forceUpdate();
|
||
};
|
||
|
||
componentWillUnmount() {
|
||
this.isUnmounted = true;
|
||
window.removeEventListener('resize', this.setScale);
|
||
if (this.timer) clearInterval(this.timer);
|
||
// 清除数据刷新定时器
|
||
if (this.dataTimer) clearInterval(this.dataTimer);
|
||
|
||
document.removeEventListener('fullscreenchange', this.handleFullscreenChange);
|
||
}
|
||
|
||
getDate = () => {
|
||
const myDate = new Date();
|
||
const year = myDate.getFullYear();
|
||
const mon = myDate.getMonth() + 1;
|
||
const date = myDate.getDate();
|
||
let hours = myDate.getHours();
|
||
let minutes = myDate.getMinutes();
|
||
let seconds = myDate.getSeconds();
|
||
hours = hours < 10 ? '0' + hours : hours;
|
||
minutes = minutes < 10 ? '0' + minutes : minutes;
|
||
seconds = seconds < 10 ? '0' + seconds : seconds;
|
||
return `${year} 年 ${mon} 月 ${date} 日 \t\t\t${hours} : ${minutes} : ${seconds}`;
|
||
};
|
||
|
||
getHomeDataArray = () => {
|
||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||
const json = initFilter(orgId);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'BI/BIKanBanController/ReturnAllData',
|
||
onComplete: (ret) => {
|
||
if (ret && !this.isUnmounted) {
|
||
this.setState({
|
||
riskTypeRate: ret.riskTypeRate || [],
|
||
// jobTodayQty: ret.jobTodayQty || [],
|
||
hiddenSummary: ret.hiddenSummary || [],
|
||
taskTop3: ret.taskTop3 || [],
|
||
});
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
getYearPXData = () => {
|
||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||
const json = initFilter(orgId);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'BI/BIHeadSE/SEtrInfo',
|
||
onComplete: (ret) => {
|
||
if (ret && !this.isUnmounted) {
|
||
this.setState({
|
||
trainingData: ret,
|
||
});
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
// ==================== 安全培训相关方法 ====================
|
||
getTrainingCompanyData = () => {
|
||
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({
|
||
trainingCompanyData: ret,
|
||
});
|
||
if (defaultCompany && !this.state.selectedTrainingCompany) {
|
||
this.setState(
|
||
{
|
||
selectedTrainingCompany: defaultCompany.ID,
|
||
},
|
||
() => {
|
||
this.getBSTypeMonthData(); // 公司设置完成后获取培训类型数据
|
||
}
|
||
);
|
||
} else {
|
||
this.getBSTypeMonthData();
|
||
}
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
getHomeSESubYearData = () => {
|
||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||
const json = initFilter(orgId);
|
||
const currentYear = new Date().getFullYear();
|
||
json.Parameter1 = currentYear.toString();
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'BI/BIHeadSE/HomeSESubYear',
|
||
onComplete: (ret) => {
|
||
if (ret && !this.isUnmounted) {
|
||
const listNAME = ret.map((item) => item.CName);
|
||
const MonthPersonCount = ret.map((item) => item.PCount);
|
||
const MonthRecordCount = ret.map((item) => item.RCount);
|
||
const YearCount = ret.map((item) => item.PCount);
|
||
|
||
this.setState({
|
||
trainingSubData: {
|
||
listNAME: listNAME,
|
||
YearCount: YearCount,
|
||
MonthRecordCount: MonthRecordCount,
|
||
MonthPersonCount: MonthPersonCount,
|
||
},
|
||
});
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
handleTrainingMonthChange = (month) => {
|
||
this.setState({ selectedTrainingMonth: month }, () => {
|
||
this.getHomeSESubYearMonthData();
|
||
});
|
||
};
|
||
|
||
handleTrainingCompanyChange = (company) => {
|
||
this.setState({ selectedTrainingCompany: company }, () => {
|
||
this.getBSTypeMonthData();
|
||
});
|
||
};
|
||
|
||
getHomeSESubYearMonthData = () => {
|
||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||
const json = initFilter(orgId);
|
||
const currentYear = new Date().getFullYear();
|
||
json.Parameter1 = currentYear.toString();
|
||
json.Parameter2 = this.state.selectedTrainingMonth.toString();
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'BI/BIHeadSE/HomeSESubYear',
|
||
onComplete: (ret) => {
|
||
if (ret && !this.isUnmounted) {
|
||
const listNAME = ret.map((item) => item.CName);
|
||
const MonthPersonCount = ret.map((item) => item.PCount);
|
||
const MonthRecordCount = ret.map((item) => item.RCount);
|
||
const YearCount = ret.map((item) => item.PCount);
|
||
|
||
this.setState({
|
||
trainingSubDataMonth: {
|
||
listNAME: listNAME,
|
||
YearCount: YearCount,
|
||
MonthRecordCount: MonthRecordCount,
|
||
MonthPersonCount: MonthPersonCount,
|
||
},
|
||
});
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
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}`;
|
||
|
||
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}`;
|
||
|
||
json.Parameter1 = currentDateStr;
|
||
if (this.state.selectedTrainingCompany) {
|
||
json.Parameter2 = this.state.selectedTrainingCompany;
|
||
}
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'BI/BIHeadSE/SubTypeMonth',
|
||
onComplete: (ret) => {
|
||
if (ret && !this.isUnmounted) {
|
||
this.setState({
|
||
trainingSubBSType: ret,
|
||
});
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
// ==================== 隐患治理相关方法 ====================
|
||
// 获取隐患治理的公司列表（独立于安全培训）
|
||
getHiddenCompanyData = () => {
|
||
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({
|
||
hiddenCompanyData: ret,
|
||
});
|
||
if (defaultCompany && !this.state.selectedHiddenCompany) {
|
||
this.setState({
|
||
selectedHiddenCompany: defaultCompany.ID,
|
||
});
|
||
}
|
||
this.getHiddenSubData();
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
// 隐患治理公司筛选变化处理
|
||
handleHiddenCompanyChange = (company) => {
|
||
this.setState({ selectedHiddenCompany: company });
|
||
};
|
||
|
||
getHiddenSubData = () => {
|
||
// 以下是真实的API调用代码，如需使用请取消注释
|
||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||
const json = initFilter(orgId);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'BI/BIKanBanController/HiddenManage',
|
||
onComplete: (ret) => {
|
||
if (ret && !this.isUnmounted) {
|
||
this.setState({
|
||
hiddenSubData: ret,
|
||
});
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
// ==================== 其他页面方法 ====================
|
||
getRiskSubData = () => {
|
||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||
const json = initFilter(orgId);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'BI/BIKanBanController/RiskManage',
|
||
onComplete: (ret) => {
|
||
if (ret && !this.isUnmounted) {
|
||
this.setState({
|
||
riskSubData: ret,
|
||
});
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
getClassSubData = () => {
|
||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||
const json = initFilter(orgId);
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'BI/BIKanBanController/TeamManage',
|
||
onComplete: (ret) => {
|
||
if (ret && !this.isUnmounted) {
|
||
this.setState({
|
||
classSubData: ret,
|
||
});
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
getDangerCompanyData = () => {
|
||
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({
|
||
dangerCompanyData: ret,
|
||
});
|
||
if (defaultCompany && !this.state.selectedDangerCompany) {
|
||
this.setState(
|
||
{
|
||
selectedDangerCompany: defaultCompany.ID,
|
||
},
|
||
() => {
|
||
this.getDangerSubData();
|
||
}
|
||
);
|
||
} else {
|
||
this.getDangerSubData();
|
||
}
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
handleDangerCompanyChange = (company) => {
|
||
this.setState({ selectedDangerCompany: company }, () => {
|
||
this.getDangerSubData();
|
||
});
|
||
};
|
||
handleStartDateChange = (startDate) => {
|
||
this.setState({ selectedStartDate: startDate }, () => {
|
||
this.getDangerSubData();
|
||
});
|
||
};
|
||
handleEndDateChange = (endDate) => {
|
||
this.setState({ selectedEndDate: endDate }, () => {
|
||
this.getDangerSubData();
|
||
});
|
||
};
|
||
|
||
getDangerSubData = () => {
|
||
const orgId = storage('lacal').getItem('webOrgId')?.val;
|
||
const json = initFilter(orgId);
|
||
json.Keyword =''
|
||
if (this.state.selectedDangerCompany) {
|
||
const selectedCompanyObj = this.state.dangerCompanyData?.find(
|
||
(company) => company.ID === this.state.selectedDangerCompany
|
||
);
|
||
const selectedCompanyName = selectedCompanyObj?.NAME;
|
||
if (selectedCompanyName) {
|
||
json.Keyword = selectedCompanyName;
|
||
// filteredData = filteredData.filter((item) => item.companyName === selectedCompanyName);
|
||
}
|
||
}
|
||
|
||
json.Parameter1 = this.state.selectedStartDate?.format('YYYY-MM-DD') || '';
|
||
json.Parameter2 = this.state.selectedEndDate?.format('YYYY-MM-DD') || '';
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
payload: json,
|
||
url: 'BI/BIKanBanController/JobManage',
|
||
onComplete: (ret) => {
|
||
if (ret && !this.isUnmounted) {
|
||
//let filteredData = ret.jobList;
|
||
// if (this.state.selectedDangerCompany) {
|
||
// const selectedCompanyObj = this.state.dangerCompanyData?.find(
|
||
// (company) => company.ID === this.state.selectedDangerCompany
|
||
// );
|
||
// const selectedCompanyName = selectedCompanyObj?.NAME;
|
||
// if (selectedCompanyName) {
|
||
// filteredData = filteredData.filter((item) => item.companyName === selectedCompanyName);
|
||
// }.
|
||
// }
|
||
|
||
this.setState({
|
||
dangerSubData: ret.jobList,
|
||
jobTodayQty: ret.jobTodayQty,
|
||
});
|
||
}
|
||
},
|
||
});
|
||
};
|
||
|
||
renderOtherTabContent = () => {
|
||
const {
|
||
activeTab,
|
||
trainingSubData,
|
||
trainingSubBSType,
|
||
trainingCompanyData,
|
||
trainingSubDataMonth,
|
||
selectedTrainingMonth,
|
||
selectedTrainingCompany,
|
||
trainingSubIDCard,
|
||
riskSubData,
|
||
classSubData,
|
||
hiddenSubData,
|
||
hiddenCompanyData,
|
||
selectedHiddenCompany,
|
||
} = this.state;
|
||
|
||
if (activeTab === '安全培训') {
|
||
return (
|
||
<TrainingContent
|
||
trainingSubData={trainingSubData}
|
||
trainingSubBSType={trainingSubBSType}
|
||
companyData={trainingCompanyData}
|
||
trainingSubDataMonth={trainingSubDataMonth}
|
||
selectedMonth={selectedTrainingMonth}
|
||
selectedCompany={selectedTrainingCompany}
|
||
onMonthChange={this.handleTrainingMonthChange}
|
||
onCompanyChange={this.handleTrainingCompanyChange}
|
||
trainingSubIDCard={trainingSubIDCard}
|
||
/>
|
||
);
|
||
}
|
||
if (activeTab === '风险管控') {
|
||
return <RiskControl riskSubData={riskSubData} />;
|
||
}
|
||
if (activeTab === '隐患治理') {
|
||
return (
|
||
<HiddenSolve
|
||
hiddenSubData={hiddenSubData}
|
||
companyData={hiddenCompanyData}
|
||
selectedCompany={selectedHiddenCompany}
|
||
onCompanyChange={this.handleHiddenCompanyChange}
|
||
/>
|
||
);
|
||
}
|
||
if (activeTab === '班组建设') {
|
||
return <ClassBuild classSubData={classSubData} />;
|
||
}
|
||
if (activeTab === '危险作业') {
|
||
return (
|
||
<DangerJob
|
||
dangerSubData={this.state.dangerSubData}
|
||
jobTodayQty={this.state.jobTodayQty}
|
||
companyData={this.state.dangerCompanyData}
|
||
selectedCompany={this.state.selectedDangerCompany}
|
||
onCompanyChange={this.handleDangerCompanyChange}
|
||
selectedStartDate={this.state.selectedStartDate}
|
||
onStartChange={this.handleStartDateChange}
|
||
selectedEndDate={this.state.selectedEndDate}
|
||
onEndChange={this.handleEndDateChange}
|
||
/>
|
||
);
|
||
}
|
||
return (
|
||
<div className={styles.otherTabContent}>
|
||
<div style={{ textAlign: 'center', color: '#fff' }}>
|
||
<div style={{ fontSize: '32px', fontWeight: 'bold', marginBottom: '20px' }}>{activeTab} 页面</div>
|
||
<div style={{ fontSize: '18px', opacity: 0.8 }}>这里是 {activeTab} 的内容展示区域</div>
|
||
<div style={{ marginTop: '30px', fontSize: '16px', opacity: 0.6 }}>请根据实际需求替换此内容</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
render() {
|
||
const width = 1920,
|
||
height = 1080;
|
||
const {
|
||
scale,
|
||
activeTab,
|
||
riskTypeRate,
|
||
riskTotal,
|
||
hiddenSummary,
|
||
jobTodayQty,
|
||
taskTop3,
|
||
mediaList,
|
||
announcementList,
|
||
currentMediaIndex,
|
||
trainingData,
|
||
announcementModalVisible,
|
||
currentAnnouncement,
|
||
announcementDetailLoading,
|
||
} = this.state;
|
||
|
||
return (
|
||
<div className={styles.box} style={{ transform: `scale(${scale}) translate(-50%, -50%)`, width, height }}>
|
||
<div className={styles.blackBack}>
|
||
<div className={styles.backImage}>
|
||
{/* 头部 */}
|
||
<div className={styles.header}>
|
||
<Row style={{ width: '100%', height: '100%', display: 'flex', alignItems: 'center' }}>
|
||
<Col span={9} style={{ display: 'flex', alignItems: 'center' }}>
|
||
<img src={logo} alt="logo" style={{ height: '50px', marginLeft: '50px' }} />
|
||
<div style={{ display: 'flex', marginLeft: 'auto' }}>
|
||
{this.state.configBanner.slice(0, 3).map((item, index) => (
|
||
<div
|
||
key={index}
|
||
className={`${styles.configBanners} ${activeTab === item ? styles.active : ''}`}
|
||
onClick={() => this.handleTabClick(item)}
|
||
>
|
||
{item}
|
||
</div>
|
||
))}
|
||
</div>
|
||
</Col>
|
||
<Col span={6} style={{ display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
|
||
<div className={styles.headerText}>金源公司安全生产管控平台</div>
|
||
</Col>
|
||
<Col span={9} style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-end' }}>
|
||
<div style={{ display: 'flex' }}>
|
||
{this.state.configBanner.slice(3, 6).map((item, index) => (
|
||
<div
|
||
key={index}
|
||
className={`${styles.configBanners} ${activeTab === item ? styles.active : ''}`}
|
||
onClick={() => this.handleTabClick(item)}
|
||
>
|
||
{item}
|
||
</div>
|
||
))}
|
||
</div>
|
||
<Icon
|
||
type={document.fullscreenElement ? 'fullscreen-exit' : 'fullscreen'}
|
||
style={{ fontSize: '26px', color: '#000', cursor: 'pointer', margin: '0 20px' }}
|
||
onClick={this.toggleFullscreen}
|
||
/>
|
||
<div style={{ color: '#000', fontSize: '14px', marginRight: '20px', fontWeight: 'bold' }}>
|
||
{this.state.nowDate}
|
||
</div>
|
||
</Col>
|
||
</Row>
|
||
</div>
|
||
|
||
{/* 内容区域 */}
|
||
{activeTab === '首页' ? (
|
||
<HomeContent
|
||
riskTypeRate={riskTypeRate}
|
||
riskTotal={riskTotal}
|
||
hiddenSummary={hiddenSummary}
|
||
// jobTodayQty={jobTodayQty}
|
||
taskTop3={taskTop3}
|
||
mediaList={mediaList}
|
||
announcementList={announcementList}
|
||
currentMediaIndex={currentMediaIndex}
|
||
onCarouselChange={this.handleCarouselChange}
|
||
onDotClick={this.handleDotClick}
|
||
trainingData={trainingData}
|
||
onAnnouncementClick={this.handleAnnouncementClick}
|
||
announcementModalVisible={announcementModalVisible}
|
||
currentAnnouncement={currentAnnouncement}
|
||
announcementDetailLoading={announcementDetailLoading}
|
||
onAnnouncementModalClose={this.handleAnnouncementModalClose}
|
||
/>
|
||
) : (
|
||
this.renderOtherTabContent()
|
||
)}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
}
|
||
|
||
export default withRouter(connect(({ login }) => ({ login }))(FullScreen));
|