This commit is contained in:
yunkexin 2025-09-25 15:56:17 +08:00
parent 9de4b8d6f9
commit 67303aa596
7 changed files with 1020 additions and 606 deletions

View File

@ -44,6 +44,10 @@ class FullScreen extends React.Component {
constructor(props) {
super(props);
this.state = {
safetySloganOne: "",
animationDuration: 20,
sliderColor: '#de4e58',
sliderSize: '24px',
screenWidh: window.screen.width > 2000 ? true : false,
nowDate: "",
checkData: [
@ -268,7 +272,7 @@ class FullScreen extends React.Component {
// nowDate:this.getDate()
// })
// },1000)
this.getHomeTitle()
this.completeChart(this.state.completeData);
// this.completeChart(this.state.completeDatatwo);
// this.completeChart(this.state.completeDatathree);
@ -296,6 +300,27 @@ class FullScreen extends React.Component {
componentWillUnmount() {
clearInterval(this.timer);
}
getHomeTitle = () => {
var orgId = storage("lacal").getItem("webOrgId")?.val; //登录后有存储登录信息
let json = initFilter(orgId);
this.props.dispatch({
type: "app/getDataByPost",
payload: json,
url: "PF/HomeTitle/OrderPaged",
onComplete: (ret) => {
if (this._isMounted&&ret) {
this.setState({
safetySloganOne: ret[0].TITLE,
// safetySloganOne: "1.安全方针:以人为本、关注健康、依法治企、安全发展。 2.安全理念一切风险皆可控一切事故皆可防3.安全方针以人为本、关注健康、依法治企、安全发展。4.安全方针以人为本、关注健康、依法治企、安全发展。5.安全方针:以人为本、关注健康、依法治企、安全发展。 6.安全理念一切风险皆可控一切事故皆可防7.安全方针以人为本、关注健康、依法治企、安全发展。8.安全方针:以人为本、关注健康、依法治企、安全发展。",
animationDuration: ret[0].SECOND,
sliderColor: ret[0].COCOR,
sliderSize: ret[0].FONTSIZE
});
}
},
});
}
getDate = () => {
var myDate = new Date();
var year = myDate.getFullYear(); //获取当前年
@ -923,6 +948,7 @@ class FullScreen extends React.Component {
};
render() {
const { safetySloganOne, animationDuration, sliderColor, sliderSize } = this.state;
return (
<React.Fragment>
<FullScreenContainer>
@ -957,15 +983,17 @@ class FullScreen extends React.Component {
}}
></img>
<div
className="slide-style"
style={{ color: "#fff", fontSize: "18px" }}
>
<p className="slide-text-style">
安全方针安全第一综合治理控制风险科学发展
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
安全理念一切风险皆可控一切事故皆可防
</p>
</div>
className="slide-style"
style={{
'--animation-duration': `${animationDuration}s`, // 动态设置动画时长
'--slider-color': `${sliderColor}`, // 动态设置颜色
'--slider-size': `${sliderSize}px`, // 动态设置颜色
}}
>
<p className="slide-text-style">
{safetySloganOne || '暂无公告'}
</p>
</div>
</div>
</Col>
<Col

View File

@ -554,8 +554,8 @@ function Header(props) {
{!props.matchLogin ? (
<div className="header__right">
{/* <RiskFourColor/> */}
{/* <FullScreen /> */}
{window.location.host == "121.41.2.71:8001" ? <FullScreen /> : ""}
<FullScreen />
{/* {window.location.host == "121.41.2.71:8001" ? <FullScreen /> : ""} */}
<GuideCode />
<HeaderNav />
<HeaderDataV />

View File

@ -8,7 +8,7 @@ import {
MenuUnfoldOutlined,
MenuFoldOutlined,
} from "@ant-design/icons";
import { Divider, Menu, Switch, Icon, Button } from "antd";
import { Divider, Menu, Switch, Icon, Button, Modal } from "antd";
import { connect } from "dva";
import { withRouter, matchPath } from "dva/router";
import { Scrollbars } from "react-custom-scrollbars";
@ -17,6 +17,12 @@ import { $consts } from "../plugins";
import "./sider.less";
import MenuItem from "antd/lib/menu/MenuItem";
import SubMenu from "antd/lib/menu/SubMenu";
import FullScreenPage from "./FullScreen";
import {
requestFullScreenMethod,
} from "../utils/common";
const Sider = (props) => {
@ -41,17 +47,61 @@ const Sider = (props) => {
data[menuId] ? (data[menuId] = "") : (data[menuId] = menuId);
setMenuShrink(data);
};
const [showModal, setshowModal] = useState(false);
const escFunction = () => {
let isFull = !!(
document.fullscreen ||
document.mozFullScreen ||
document.webkitIsFullScreen ||
document.webkitFullScreen ||
document.msFullScreen
);
if (isFull) {
// /
} else {
// requestFullScreenMethod(document.body);
setshowModal(false);
setActiveMenu(null);
}
};
useEffect(() => {
// 监听退出全屏事件 --- chrome 用 esc 退出全屏并不会触发 keyup 事件
document.addEventListener(
"webkitfullscreenchange",
escFunction
); /* Chrome, Safari and Opera */
document.addEventListener("mozfullscreenchange", escFunction); /* Firefox */
document.addEventListener(
"fullscreenchange",
escFunction
); /* Standard syntax */
document.addEventListener(
"msfullscreenchange",
escFunction
); /* IE / Edge */
return () => {
//销毁时清除监听
document.removeEventListener("webkitfullscreenchange", escFunction);
document.removeEventListener("mozfullscreenchange", escFunction);
document.removeEventListener("fullscreenchange", escFunction);
document.removeEventListener("MSFullscreenChange", escFunction);
};
}, []);
/** 回到首页 */
const navToHome = () => {
setActiveMenu(null);
props.history.push({ pathname: "/home" });
};
const clickMenu = ()=>{
collapsed===true?setCollapsed(false):setCollapsed(false)
}
const navToLarge = () => {
setActiveMenu('largeScreen');
setshowModal(true);
requestFullScreenMethod(document.body);
}
const clickMenu = () => {
collapsed === true ? setCollapsed(false) : setCollapsed(false)
}
/** 子菜单路由 */
const navToMenu = (menu) => {
props.history.push({ pathname: `/main/${menu.ID}` });
@ -160,11 +210,11 @@ const clickMenu = ()=>{
const toggleCollapsed = () => {
setCollapsed(!collapsed);
};
useEffect(()=>{
if(collapsed == false) {
useEffect(() => {
if (collapsed == false) {
setCollapsed(true);
}
},[props.repost])
}, [props.repost])
// console.log(props.repost,'21312313213213123')
/** 登录页隐藏 */
@ -172,138 +222,162 @@ const clickMenu = ()=>{
return (
<div className={`sider ${"shortMenuShow"}`}>
<div className={`sider ${"shortMenuShow_overflow"}`}>
<Menu
mode="inline"
inlineCollapsed={collapsed}
style={{
// marginTop: 24,
// paddingRight: 10,
paddingTop:'21px'
<Modal
title="功能导航"
visible={showModal}
width="100%"
centered={true}
onOk={() => {
setshowModal(false);
}}
// defaultOpenKeys={['sub1']}
inlineIndent="16"
onClick={clickMenu}
onCancel={() => {
setshowModal(false);
}}
className="fullScreen"
>
<MenuItem key="1" onClick={navToHome} title={'首页'}>
{/* <img
<FullScreenPage />
</Modal>
<div className={`sider ${"shortMenuShow_overflow"}`}>
<Menu
mode="inline"
inlineCollapsed={collapsed}
style={{
// marginTop: 24,
// paddingRight: 10,
paddingTop: '21px'
}}
// defaultOpenKeys={['sub1']}
inlineIndent="16"
onClick={clickMenu}
>
<MenuItem key="home" onClick={navToHome} title={'首页'}>
{/* <img
src={require("../assets/layout/menu-all.png")}
alt=""
className="sider__menuAll-icon"
/> */}
<Icon type="home"></Icon>
<span>首页</span>
</MenuItem>
<SubMenu
key="sub1"
title={
<span>
<Icon type="profile" title="常用菜单"></Icon>
<span>常用菜单</span>
</span>
}
onTitleClick={clickMenu}
>
{favorMenus.map((menu2, index2) => {
return (
<MenuItem
key={`${menu2.ID}_${index2}`}
onClick={() => handleActiveMenu(menu2)}
title={menu2.NAME}
>
<Icon type={menu2.ICON ? menu2.ICON : "file-text"} />
<Icon type="home"></Icon>
<span>首页</span>
</MenuItem>
<MenuItem key="largeScreen" onClick={navToLarge} title={'可视化大屏'} >
{/* <img
src={require("../assets/layout/menu-all.png")}
alt=""
className="sider__menuAll-icon"
/> */}
<Icon type="alert"></Icon>
<span>可视化大屏</span>
</MenuItem>
<SubMenu
key="sub1"
title={
<span>
<Icon type="profile" title="常用菜单"></Icon>
<span>常用菜单</span>
</span>
<span>{menu2.NAME}</span>
</MenuItem>
}
onTitleClick={clickMenu}
>
{favorMenus.map((menu2, index2) => {
return (
<MenuItem
key={`${menu2.ID}_${index2}`}
onClick={() => handleActiveMenu(menu2)}
title={menu2.NAME}
>
<Icon type={menu2.ICON ? menu2.ICON : "file-text"} />
<span>{menu2.NAME}</span>
</MenuItem>
);
})}
</SubMenu>
{topMenus.menus.map((menu, index) => {
return (
<SubMenu
key={`${menu.Node.ID}_${index}`}
title={
<span>
<Icon type={menu.Node.ICON ? menu.Node.ICON : "reconciliation"} title={menu.Node.NAME}></Icon>
<span>{menu.Node.NAME}</span>
</span>
}
onTitleClick={() => {
setCurrMenu(menu.Node);
clickMenu()
}}
>
{/* 二级 */}
{menu.Children.map((menu1, index1) => {
const isLevel4Menu = menu1.Children?.find(
(mc) => mc.Children?.length
);
const childMenus = isLevel4Menu
? [menu]
: menu.Children || [];
return (
<SubMenu
key={`${menu1.Node.ID}_${index1}`}
title={
<span>
<Icon type={menu1.Node.ICON ? menu1.Node.ICON : "reconciliation"}></Icon>
<span>{menu1.Node.NAME}</span>
</span>
}
>
{/* 三级 */}
{menu1.Children.map((menu3, index3) => {
return (
<MenuItem key={`${menu3.Node.ID}_${index3}`} onClick={() =>
isLevel4Menu
? navToBackend(menu3.Node)
: handleActiveMenu(menu3.Node)
}
title={menu3.Node.NAME}
>
<Icon type={menu3.Node.ICON ? menu3.Node.ICON : "file-text"} />
<span>{menu3.Node.NAME}</span>
</MenuItem>
);
})}
</SubMenu>
);
})}
</SubMenu>
);
})}
</SubMenu>
</Menu>
{topMenus.menus.map((menu, index) => {
return (
<SubMenu
key={`${menu.Node.ID}_${index}`}
title={
<span>
<Icon type= {menu.Node.ICON ? menu.Node.ICON : "reconciliation"} title={menu.Node.NAME}></Icon>
<span>{menu.Node.NAME}</span>
</span>
}
onTitleClick={() => {
setCurrMenu(menu.Node);
clickMenu()
}}
>
{/* 二级 */}
{menu.Children.map((menu1, index1) => {
const isLevel4Menu = menu1.Children?.find(
(mc) => mc.Children?.length
);
const childMenus = isLevel4Menu
? [menu]
: menu.Children || [];
return (
<SubMenu
key={`${menu1.Node.ID}_${index1}`}
title={
<span>
<Icon type={menu1.Node.ICON ? menu1.Node.ICON : "reconciliation"}></Icon>
<span>{ menu1.Node.NAME}</span>
</span>
}
>
{/* 三级 */}
{menu1.Children.map((menu3, index3) => {
return (
<MenuItem key={`${menu3.Node.ID}_${index3}`} onClick={() =>
isLevel4Menu
? navToBackend(menu3.Node)
: handleActiveMenu(menu3.Node)
}
title={menu3.Node.NAME}
>
<Icon type={menu3.Node.ICON ? menu3.Node.ICON : "file-text"} />
<span>{menu3.Node.NAME}</span>
</MenuItem>
);
})}
</SubMenu>
);
})}
</SubMenu>
);
})}
</Menu>
</div>
<div onClick={toggleCollapsed}
style={{
marginBottom: 16,
display:'flex',
alignItems:'center',
position:'absolute',
right:0,
top:'40%',
padding:'40px 0px',
backgroundColor:'#DEE0E8',
borderRadius:'6px',
margin:'0px 0px 0px 0px',
}}>
<Icon type={collapsed ? 'right' : 'left'} style={{
fontSize:'12px',
display:'flex',
// alignItems:'right',
// justifyContent:'flex-end'
}} />
</div>
<div onClick={toggleCollapsed}
style={{
marginBottom: 16,
display: 'flex',
alignItems: 'center',
position: 'absolute',
right: 0,
top: '40%',
padding: '40px 0px',
backgroundColor: '#DEE0E8',
borderRadius: '6px',
margin: '0px 0px 0px 0px',
}}>
<Icon type={collapsed ? 'right' : 'left'} style={{
fontSize: '12px',
display: 'flex',
// alignItems:'right',
// justifyContent:'flex-end'
}} />
</div>
</div>
);
};

View File

@ -7,6 +7,10 @@ export default [
name: 'HOME',
value: '/home'
},
{
name: 'GROUPHOME',
value: '/grouphome'
},
{
name: 'MAIN',
value: '/main/:menuId'

View File

@ -88,9 +88,16 @@ const contentStyle = {
};
class GroupHome extends React.Component {
_isMounted = false; // 标记组件是否已挂载
constructor(props) {
super(props);
this.state = {
noticeData: [], // 公告列表数据
currentNoticePage: 1, // 当前公告页码
noticePageSize: 4, // 每页公告数量与图片一致默认显示4条
totalNoticeCount: 0, // 公告总数量
activeNoticeTab: "all", // 活跃公告标签(全部/集团发布/公司发布,参考图片)
isNaN: false,
scoreVisible: false,
scoreTotalVisible: false,
@ -101,8 +108,8 @@ class GroupHome extends React.Component {
visible: false,
safetySloganOne: "",
animationDuration: 20,
sliderColor:'#de4e58',
sliderSize:'24px',
sliderColor: '#de4e58',
sliderSize: '24px',
safetySloganTwo: "",
noticeTitle: "",
tmpData: {},
@ -110,8 +117,8 @@ class GroupHome extends React.Component {
pagination: {},
retData: [],
chartData: [],
displayStr: null,
displayNum: 24,
displayStr: '',
displayNum: 16,
columnData: [],
columnFields: [],
delayData: [],
@ -210,73 +217,62 @@ class GroupHome extends React.Component {
}
componentDidMount() {
if (localStorage.getItem("webOrgId") !== '00300000-0000-0000-0000-000000000000') {
history.replace('/home')
this._isMounted = true; // 组件挂载时设为true
const currentPath = this.props.location.pathname;
console.log(currentPath, '999')
if (localStorage.getItem("webOrgId") !== '00300000-0000-0000-0000-000000000000' && currentPath !== '/home') {
this.props.history.replace('/home')
return
// props.history.push({ pathname: "/grouphome" });
}
if (window.navigator.userAgent.indexOf("Windows") < 1) {
window.location.replace(config.guideH5Host);
openNotificationMobile("bottomRight");
this.state.displayStr = "none";
this.state.displayNum = 24;
return; // 阻止后续代码执行
//alert('手机');
} else {
this.state.displayStr = "";
this.state.displayNum = 16;
//alert('PC');
}
this.state.columns = [
{
width: "450px",
title: "任务名称",
dataIndex: "NOTICE_TITLE",
key: "NOTICE_TITLE",
render: (text, record) => (
<span>
<a
onClick={() =>
this.showEditModal(
record.SOURCE_DATA_ID,
record.SOURCE_FORMCODE,
record.ID,
record.NOTICE_TITLE
)
}
>
{record.NOTICE_TITLE}
</a>
</span>
),
},
{
title: "开始时间",
dataIndex: "TASK_STARTDT",
key: "TASK_STARTDT",
},
{
title: "结束时间",
dataIndex: "TASK_ENDDT",
key: "TASK_ENDDT",
},
{
title: "预警状态",
dataIndex: "NOTICE_TYPE",
key: "NOTICE_TYPE",
render: (text, record) => this.ShowState(record),
},
];
this.getTeam();
this.getHomeTitle()
//定时器功能,暂时不开启
this.timerID = setInterval(
() => this.getBaseInfoData(1, this.state.tableKey, 5),
120000
);
this.showModalSign();
this.getBaseInfoData(1, 1, 5);
this.setMessageData();
this.state.scoreNoneColumns = [
{
this.setState({
columns: [
{
width: "450px",
title: "任务名称",
dataIndex: "NOTICE_TITLE",
key: "NOTICE_TITLE",
render: (text, record) => (
<span>
<a
onClick={() =>
this.showEditModal(
record.SOURCE_DATA_ID,
record.SOURCE_FORMCODE,
record.ID,
record.NOTICE_TITLE
)
}
>
{record.NOTICE_TITLE}
</a>
</span>
),
},
{
title: "开始时间",
dataIndex: "TASK_STARTDT",
key: "TASK_STARTDT",
},
{
title: "结束时间",
dataIndex: "TASK_ENDDT",
key: "TASK_ENDDT",
},
{
title: "预警状态",
dataIndex: "NOTICE_TYPE",
key: "NOTICE_TYPE",
render: (text, record) => this.ShowState(record),
},
],
scoreNoneColumns: [{
width: "80px",
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
@ -344,149 +340,279 @@ class GroupHome extends React.Component {
})}
</span>
),
}],
scoreColumns: [
{
width: "80px",
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
key: "Nav_ProductionUnit.NAME",
},
{
width: "80px",
title: "一级要素",
dataIndex: "Nav_Primary.NAME",
key: "Nav_Primary.NAME",
},
{
width: "80px",
title: "二级要素",
dataIndex: "Nav_Second.NAME",
key: "Nav_Second.NAME",
},
{
width: "80px",
title: "三级要素",
dataIndex: "Nav_Three.NAME",
key: "Nav_Three.NAME",
},
{
width: "50px",
title: "考评项目",
dataIndex: "EVALUATION_ITEM",
key: "EVALUATION_ITEM",
render: (text, record) => (
<span>
{
this.props.app.enums?.PEEvaluationItemEnum.enums[
record.EVALUATION_ITEM
]
}
</span>
),
},
{
// width: "500px",
title: "考评内容",
dataIndex: "CONTENTS",
key: "CONTENTS",
},
{
width: "100px",
title: "评分办法",
dataIndex: "DESCRIPTION",
key: "DESCRIPTION",
},
{
width: "50px",
title: "标准分",
dataIndex: "STANDARDIZED_SCORE",
key: "STANDARDIZED_SCORE",
},
{
width: "50px",
title: "实得分",
dataIndex: "RESULT_SCORE",
key: "RESULT_SCORE",
},
{
width: "200px",
title: "不符合说明",
dataIndex: "NON_CONFORMANCE",
key: "NON_CONFORMANCE",
},
,
{
width: "80px",
title: "评价结论",
dataIndex: "EVALUATION_RESULT",
key: "EVALUATION_RESULT",
render: (text, record) => (
<span>
{
this.props.app.enums?.PEEvaluationResultEnum.enums[
record.EVALUATION_RESULT
]
}
</span>
),
},
{
width: "100px",
title: "评价方法",
dataIndex: "Nav_EvaluationMethod",
key: "Nav_EvaluationMethod",
render: (text, record) => (
<span>
{record.Nav_EvaluationMethod &&
record.Nav_EvaluationMethod?.map((item, i) => {
return (
<tr>
<label> {item.Nav_Method?.NAME}</label>
</tr>
);
})}
</span>
),
},
],
scoreTotalColumns: [
{
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
key: "Nav_ProductionUnit.NAME",
},
{
title: "标准化得分",
dataIndex: "NON_STANDARDIZED_SCORE",
key: "NON_STANDARDIZED_SCORE",
},
{
title: "操作",
dataIndex: "",
key: "",
render: (text, record) => (
<span>
{
<tr>
{" "}
<Button onClick={() => this.showStandardScoreModal()}>
全部
</Button>
<Button onClick={() => this.showStandardScoreModal(1)}>
不符合项
</Button>
</tr>
}
</span>
),
},
]
})
this.getTeam();
this.getHomeTitle()
//定时器功能,暂时不开启
this.timerID = setInterval(
() => {
if (this._isMounted) {
this.getBaseInfoData(1, this.state.tableKey, 5)
}
},
];
this.state.scoreColumns = [
{
width: "80px",
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
key: "Nav_ProductionUnit.NAME",
},
{
width: "80px",
title: "一级要素",
dataIndex: "Nav_Primary.NAME",
key: "Nav_Primary.NAME",
},
{
width: "80px",
title: "二级要素",
dataIndex: "Nav_Second.NAME",
key: "Nav_Second.NAME",
},
{
width: "80px",
title: "三级要素",
dataIndex: "Nav_Three.NAME",
key: "Nav_Three.NAME",
},
{
width: "50px",
title: "考评项目",
dataIndex: "EVALUATION_ITEM",
key: "EVALUATION_ITEM",
render: (text, record) => (
<span>
{
this.props.app.enums?.PEEvaluationItemEnum.enums[
record.EVALUATION_ITEM
]
}
</span>
),
},
{
// width: "500px",
title: "考评内容",
dataIndex: "CONTENTS",
key: "CONTENTS",
},
{
width: "100px",
title: "评分办法",
dataIndex: "DESCRIPTION",
key: "DESCRIPTION",
},
{
width: "50px",
title: "标准分",
dataIndex: "STANDARDIZED_SCORE",
key: "STANDARDIZED_SCORE",
},
{
width: "50px",
title: "实得分",
dataIndex: "RESULT_SCORE",
key: "RESULT_SCORE",
},
{
width: "200px",
title: "不符合说明",
dataIndex: "NON_CONFORMANCE",
key: "NON_CONFORMANCE",
},
,
{
width: "80px",
title: "评价结论",
dataIndex: "EVALUATION_RESULT",
key: "EVALUATION_RESULT",
render: (text, record) => (
<span>
{
this.props.app.enums?.PEEvaluationResultEnum.enums[
record.EVALUATION_RESULT
]
}
</span>
),
},
{
width: "100px",
title: "评价方法",
dataIndex: "Nav_EvaluationMethod",
key: "Nav_EvaluationMethod",
render: (text, record) => (
<span>
{record.Nav_EvaluationMethod &&
record.Nav_EvaluationMethod?.map((item, i) => {
return (
<tr>
<label> {item.Nav_Method?.NAME}</label>
</tr>
);
})}
</span>
),
},
];
this.state.scoreTotalColumns = [
{
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
key: "Nav_ProductionUnit.NAME",
},
{
title: "标准化得分",
dataIndex: "NON_STANDARDIZED_SCORE",
key: "NON_STANDARDIZED_SCORE",
},
{
title: "操作",
dataIndex: "",
key: "",
render: (text, record) => (
<span>
{
<tr>
{" "}
<Button onClick={() => this.showStandardScoreModal()}>
全部
</Button>
<Button onClick={() => this.showStandardScoreModal(1)}>
不符合项
</Button>
</tr>
}
</span>
),
},
];
120000
);
this.showModalSign();
this.getBaseInfoData(1, 1, 5);
this.setMessageData();
this.getNoticeData()
}
componentWillUnmount() {
this.timerID && clearTimeout(this.timerID);
this._isMounted = false; // 组件卸载时设为false
if (this.timerID) {
clearInterval(this.timerID);
this.timerID = null;
}
}
getNoticeData = () => {
const { currentNoticePage, noticePageSize, activeNoticeTab, mineType } = this.state;
const orgId = storage("lacal").getItem("webOrgId")?.val;
// 构建请求参数(按标签筛选:全部/集团/公司)
let json = initFilter(orgId, mineType);
extendRule(json, "pageNum", 1, currentNoticePage);
extendRule(json, "pageSize", 1, noticePageSize);
if (activeNoticeTab === "group") {
extendRule(json, "sourceType", 1, 1); // 1=集团发布
} else if (activeNoticeTab === "company") {
extendRule(json, "sourceType", 1, 2); // 2=公司发布
}
this.setState({
noticeData: [
{
id: "1",
title: "为表彰先进树立榜样激励广大员工积极进取集团决定开展2023年度优秀员工评选工作...",
source: "集团发布",
date: "08-30",
readStatus: "未读", // 可选:未读/已读
isImportant: true // 是否重要提醒
},
{
id: "2",
title: "根据国家法定节假日安排结合公司实际情况现将2023年国庆节放假安排通知如下...",
source: "公司发布",
date: "08-28",
readStatus: "已读",
isImportant: false
},
{
id: "3",
title: "根据国家法定节假日安排结合公司实际情况现将2023年国庆节放假安排通知如下...",
source: "公司发布",
date: "08-28",
readStatus: "已读",
isImportant: false
},
{
id: "4",
title: "根据国家法定节假日安排结合公司实际情况现将2023年国庆节放假安排通知如下...",
source: "公司发布",
date: "08-28",
readStatus: "已读",
isImportant: false
},
{
id: "5",
title: "根据国家法定节假日安排结合公司实际情况现将2023年国庆节放假安排通知如下...",
source: "公司发布",
date: "08-28",
readStatus: "已读",
isImportant: false
},
{
id: "6",
title: "根据国家法定节假日安排结合公司实际情况现将2023年国庆节放假安排通知如下...",
source: "公司发布",
date: "08-28",
readStatus: "已读",
isImportant: false
}
// 更多公告...
],
totalNoticeCount: 10 // 公告总数
})
// this.props.dispatch({
// type: "app/getDataByPost",
// url: "PF/Notice/GetNoticeList", // 假设的公告列表接口,需替换为实际接口
// payload: json,
// onlyData: false,
// onComplete: (data) => {
// if (data && data.IsSuccessful) {
// this.setState({
// noticeData: data.Data.list, // 公告列表
// totalNoticeCount: data.Data.total, // 公告总数
// });
// }
// },
// });
};
// 公告页码切换
changeNoticePage = (page) => {
const { totalNoticeCount, noticePageSize } = this.state;
// 边界判断页码不能小于1不能大于总页数
if (page < 1 || page > Math.ceil(totalNoticeCount / noticePageSize)) return;
this.setState({ currentNoticePage: page }, () => {
this.getNoticeData(); // 切换页码后重新请求数据
});
};
// 公告标签切换(全部/集团发布/公司发布)
switchNoticeTab = (tabType) => {
this.setState({
activeNoticeTab: tabType,
currentNoticePage: 1, // 切换标签时重置为第1页
}, () => {
this.getNoticeData(); // 切换标签后重新请求数据
});
};
// 查看更多公告(跳转至公告详情页或展开全部)
viewMoreNotice = () => {
// 逻辑1跳转至独立公告页面推荐
this.props.history.push({ pathname: "/noticeList", state: { tab: this.state.activeNoticeTab } });
// 逻辑2在当前页展开全部公告备选
// this.setState({ noticePageSize: this.state.totalNoticeCount });
};
showModalSign = () => {
var userId = storage("lacal").getItem("userid")?.val; //登录后有存储登录信息
@ -499,7 +625,7 @@ class GroupHome extends React.Component {
url: "FM/User/UserSign", //验证是否有签名照
onComplete: (ret) => {
//返回查询结果ret
if (ret) {
if (this._isMounted && ret) {
//判断是否有记录
openNotification("topRight");
}
@ -514,13 +640,13 @@ class GroupHome extends React.Component {
payload: json,
url: "PF/HomeTitle/OrderPaged",
onComplete: (ret) => {
if (ret) {
if (this._isMounted && ret) {
this.setState({
safetySloganOne: ret[0].TITLE,
// safetySloganOne: "1.安全方针:以人为本、关注健康、依法治企、安全发展。 2.安全理念一切风险皆可控一切事故皆可防3.安全方针以人为本、关注健康、依法治企、安全发展。4.安全方针以人为本、关注健康、依法治企、安全发展。5.安全方针:以人为本、关注健康、依法治企、安全发展。 6.安全理念一切风险皆可控一切事故皆可防7.安全方针以人为本、关注健康、依法治企、安全发展。8.安全方针:以人为本、关注健康、依法治企、安全发展。",
animationDuration: ret[0].SECOND,
sliderColor:ret[0].COCOR,
sliderSize:ret[0].FONTSIZE
sliderColor: ret[0].COCOR,
sliderSize: ret[0].FONTSIZE
});
}
@ -539,7 +665,7 @@ class GroupHome extends React.Component {
payload: json,
url: "FM/User/Get",
onComplete: (ret) => {
if (ret && ret.Nav_Department) {
if (this._isMounted && ret && ret.Nav_Department) {
this.setState({
departmentName: ret.Nav_Department.NAME,
deparmentType: ret.Nav_Department.DEPARTMENT_TYPE,
@ -723,7 +849,7 @@ class GroupHome extends React.Component {
payload: json,
onlyData: false,
onComplete: (re) => {
if (re && re.IsSuccessful && re.Data.newData) {
if (this._isMounted && re && re.IsSuccessful && re.Data.newData) {
this.state.tableData[0].total = re.Data.todoCount;
this.state.tableData[1].total = re.Data.timeOverCount;
this.state.tableData[2].total = re.Data.doneCount;
@ -1441,7 +1567,7 @@ class GroupHome extends React.Component {
fade: true,
};
// 在render方法中添加动态样式计算
const { safetySloganOne, animationDuration,sliderColor,sliderSize } = this.state;
const { safetySloganOne, animationDuration, sliderColor, sliderSize } = this.state;
const rowSelection = {
onChange: (selectedRowKeys, selectedRows) => {
@ -1953,47 +2079,82 @@ class GroupHome extends React.Component {
backgroundColor: "white",
}}
>
<div className="statistical-title-style">
<div className="badge-style">
<Icon
type="bar-chart"
style={{ color: "#5f6ac2", marginRight: "4px" }}
></Icon>
班组活动完成率
</div>
{this.state.departmentCompletionData.length > 0 ? (
<span
style={{
fontSize: "14px",
float: "right",
marginRight: "16px",
marginTop: "4px",
}}
>
<div
onClick={() => this.showDetailModal("BI001_HOMEDETAIL")}
>
<IconFont
type="icon-24gl-expand2"
style={{
fontSize: "18px",
color: "#333333",
cursor: "pointer",
}}
></IconFont>
</div>
</span>
) : null}
</div>
<br />
<div style={{ width: "100%", height: "100%" }}>
{this.state.departmentCompletionData.length > 0 ? (
<ClassCompletion
departmentCompletionData={
this.state.departmentCompletionData
}
/>
) : null}
<div className="notice-board-container">
{/* 公告栏标题栏:标题 + 标签 + 查看更多 */}
<div className="notice-board-header">
<div className="notice-board-title">
公告栏
{/* 重要提醒标签(参考图片,有重要提醒时显示) */}
{this.state.noticeData.some(item => item.isImportant) && (
<span className="notice-important-tag">包含{this.state.noticeData.filter(item => item.isImportant).length}个重要提醒</span>
)}
</div>
<div style={{whiteSpace: "nowrap"}}>
<Button
type={this.state.activeNoticeTab === "all" ? "primary" : "default"}
size="small"
onClick={() => this.switchNoticeTab("all")}
style={{ marginRight: 8 }}
>
全部
</Button>
<Button
type={this.state.activeNoticeTab === "group" ? "primary" : "default"}
size="small"
onClick={() => this.switchNoticeTab("group")}
style={{ marginRight: 8 }}
>
集团
</Button>
<Button
type={this.state.activeNoticeTab === "company" ? "primary" : "default"}
size="small"
onClick={() => this.switchNoticeTab("company")}
>
公司
</Button>
</div>
</div>
{/* 公告标签切换(全部/集团发布/公司发布,参考图片) */}
{/* 公告列表 */}
<ul className="notice-list">
{this.state.noticeData.length > 0 ? (
this.state.noticeData.map(notice => (
<li
key={notice.id}
className={`notice-item ${notice.readStatus === "未读" ? "unread" : ""}`}
onClick={() => this.viewNoticeDetail(notice.id)} // 点击查看公告详情
>
<div className="notice-item-content">
<span className="notice-item-title">{notice.title}</span>
<span className="notice-item-date">{notice.date}</span>
</div>
<div className="notice-item-source">
{notice.source === 1 ? "集团发布" : "公司发布"}
</div>
</li>
))
) : (
<li style={{ textAlign: "center", padding: "20px 0", color: "#999" }}>
暂无公告数据
</li>
)}
</ul>
<div className="notice-pagination">
<Button onClick={this.viewMoreNotice} block>查看更多公告</Button>
{/* <a className="notice-view-more" onClick={this.viewMoreNotice}> */}
{/* 查看更多公告 */}
{/* </a> */}
</div>
</div>
</div>
{/* <Toggle getNum={this.getChildCount}></Toggle> */}
</div>

View File

@ -88,6 +88,8 @@ const contentStyle = {
};
class Home extends React.Component {
_isMounted = false; // 标记组件是否已挂载
constructor(props) {
super(props);
this.state = {
@ -101,8 +103,8 @@ class Home extends React.Component {
visible: false,
safetySloganOne: "",
animationDuration: 20,
sliderColor:'#de4e58',
sliderSize:'24px',
sliderColor: '#de4e58',
sliderSize: '24px',
safetySloganTwo: "",
noticeTitle: "",
tmpData: {},
@ -110,8 +112,8 @@ class Home extends React.Component {
pagination: {},
retData: [],
chartData: [],
displayStr: null,
displayNum: 24,
displayStr: '',
displayNum: 16,
columnData: [],
columnFields: [],
delayData: [],
@ -210,73 +212,61 @@ class Home extends React.Component {
}
componentDidMount() {
if (localStorage.getItem("webOrgId") == '00300000-0000-0000-0000-000000000000') {
this.props.history.replace('/grouphome')
this._isMounted = true; // 组件挂载时设为true
const currentPath = this.props.location.pathname;
if (localStorage.getItem("webOrgId") == '00300000-0000-0000-0000-000000000000' && currentPath !== '/grouphome') {
this.props.history.replace('/grouphome')
return
// props.history.push({ pathname: "/grouphome" });
}
if (window.navigator.userAgent.indexOf("Windows") < 1) {
window.location.replace(config.guideH5Host);
openNotificationMobile("bottomRight");
this.state.displayStr = "none";
this.state.displayNum = 24;
return; // 阻止后续代码执行
//alert('手机');
} else {
this.state.displayStr = "";
this.state.displayNum = 16;
//alert('PC');
}
this.state.columns = [
{
width: "450px",
title: "任务名称",
dataIndex: "NOTICE_TITLE",
key: "NOTICE_TITLE",
render: (text, record) => (
<span>
<a
onClick={() =>
this.showEditModal(
record.SOURCE_DATA_ID,
record.SOURCE_FORMCODE,
record.ID,
record.NOTICE_TITLE
)
}
>
{record.NOTICE_TITLE}
</a>
</span>
),
},
{
title: "开始时间",
dataIndex: "TASK_STARTDT",
key: "TASK_STARTDT",
},
{
title: "结束时间",
dataIndex: "TASK_ENDDT",
key: "TASK_ENDDT",
},
{
title: "预警状态",
dataIndex: "NOTICE_TYPE",
key: "NOTICE_TYPE",
render: (text, record) => this.ShowState(record),
},
];
this.getTeam();
this.getHomeTitle()
//定时器功能,暂时不开启
this.timerID = setInterval(
() => this.getBaseInfoData(1, this.state.tableKey, 5),
120000
);
this.showModalSign();
this.getBaseInfoData(1, 1, 5);
this.setMessageData();
this.state.scoreNoneColumns = [
{
this.setState({
columns: [
{
width: "450px",
title: "任务名称",
dataIndex: "NOTICE_TITLE",
key: "NOTICE_TITLE",
render: (text, record) => (
<span>
<a
onClick={() =>
this.showEditModal(
record.SOURCE_DATA_ID,
record.SOURCE_FORMCODE,
record.ID,
record.NOTICE_TITLE
)
}
>
{record.NOTICE_TITLE}
</a>
</span>
),
},
{
title: "开始时间",
dataIndex: "TASK_STARTDT",
key: "TASK_STARTDT",
},
{
title: "结束时间",
dataIndex: "TASK_ENDDT",
key: "TASK_ENDDT",
},
{
title: "预警状态",
dataIndex: "NOTICE_TYPE",
key: "NOTICE_TYPE",
render: (text, record) => this.ShowState(record),
},
],
scoreNoneColumns: [{
width: "80px",
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
@ -344,148 +334,166 @@ class Home extends React.Component {
})}
</span>
),
}],
scoreColumns: [
{
width: "80px",
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
key: "Nav_ProductionUnit.NAME",
},
{
width: "80px",
title: "一级要素",
dataIndex: "Nav_Primary.NAME",
key: "Nav_Primary.NAME",
},
{
width: "80px",
title: "二级要素",
dataIndex: "Nav_Second.NAME",
key: "Nav_Second.NAME",
},
{
width: "80px",
title: "三级要素",
dataIndex: "Nav_Three.NAME",
key: "Nav_Three.NAME",
},
{
width: "50px",
title: "考评项目",
dataIndex: "EVALUATION_ITEM",
key: "EVALUATION_ITEM",
render: (text, record) => (
<span>
{
this.props.app.enums?.PEEvaluationItemEnum.enums[
record.EVALUATION_ITEM
]
}
</span>
),
},
{
// width: "500px",
title: "考评内容",
dataIndex: "CONTENTS",
key: "CONTENTS",
},
{
width: "100px",
title: "评分办法",
dataIndex: "DESCRIPTION",
key: "DESCRIPTION",
},
{
width: "50px",
title: "标准分",
dataIndex: "STANDARDIZED_SCORE",
key: "STANDARDIZED_SCORE",
},
{
width: "50px",
title: "实得分",
dataIndex: "RESULT_SCORE",
key: "RESULT_SCORE",
},
{
width: "200px",
title: "不符合说明",
dataIndex: "NON_CONFORMANCE",
key: "NON_CONFORMANCE",
},
,
{
width: "80px",
title: "评价结论",
dataIndex: "EVALUATION_RESULT",
key: "EVALUATION_RESULT",
render: (text, record) => (
<span>
{
this.props.app.enums?.PEEvaluationResultEnum.enums[
record.EVALUATION_RESULT
]
}
</span>
),
},
{
width: "100px",
title: "评价方法",
dataIndex: "Nav_EvaluationMethod",
key: "Nav_EvaluationMethod",
render: (text, record) => (
<span>
{record.Nav_EvaluationMethod &&
record.Nav_EvaluationMethod?.map((item, i) => {
return (
<tr>
<label> {item.Nav_Method?.NAME}</label>
</tr>
);
})}
</span>
),
},
],
scoreTotalColumns: [
{
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
key: "Nav_ProductionUnit.NAME",
},
{
title: "标准化得分",
dataIndex: "NON_STANDARDIZED_SCORE",
key: "NON_STANDARDIZED_SCORE",
},
{
title: "操作",
dataIndex: "",
key: "",
render: (text, record) => (
<span>
{
<tr>
{" "}
<Button onClick={() => this.showStandardScoreModal()}>
全部
</Button>
<Button onClick={() => this.showStandardScoreModal(1)}>
不符合项
</Button>
</tr>
}
</span>
),
},
]
})
this.getTeam();
this.getHomeTitle()
//定时器功能,暂时不开启
this.timerID = setInterval(
() => {
if (this._isMounted) {
this.getBaseInfoData(1, this.state.tableKey, 5)
}
},
];
this.state.scoreColumns = [
{
width: "80px",
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
key: "Nav_ProductionUnit.NAME",
},
{
width: "80px",
title: "一级要素",
dataIndex: "Nav_Primary.NAME",
key: "Nav_Primary.NAME",
},
{
width: "80px",
title: "二级要素",
dataIndex: "Nav_Second.NAME",
key: "Nav_Second.NAME",
},
{
width: "80px",
title: "三级要素",
dataIndex: "Nav_Three.NAME",
key: "Nav_Three.NAME",
},
{
width: "50px",
title: "考评项目",
dataIndex: "EVALUATION_ITEM",
key: "EVALUATION_ITEM",
render: (text, record) => (
<span>
{
this.props.app.enums?.PEEvaluationItemEnum.enums[
record.EVALUATION_ITEM
]
}
</span>
),
},
{
// width: "500px",
title: "考评内容",
dataIndex: "CONTENTS",
key: "CONTENTS",
},
{
width: "100px",
title: "评分办法",
dataIndex: "DESCRIPTION",
key: "DESCRIPTION",
},
{
width: "50px",
title: "标准分",
dataIndex: "STANDARDIZED_SCORE",
key: "STANDARDIZED_SCORE",
},
{
width: "50px",
title: "实得分",
dataIndex: "RESULT_SCORE",
key: "RESULT_SCORE",
},
{
width: "200px",
title: "不符合说明",
dataIndex: "NON_CONFORMANCE",
key: "NON_CONFORMANCE",
},
,
{
width: "80px",
title: "评价结论",
dataIndex: "EVALUATION_RESULT",
key: "EVALUATION_RESULT",
render: (text, record) => (
<span>
{
this.props.app.enums?.PEEvaluationResultEnum.enums[
record.EVALUATION_RESULT
]
}
</span>
),
},
{
width: "100px",
title: "评价方法",
dataIndex: "Nav_EvaluationMethod",
key: "Nav_EvaluationMethod",
render: (text, record) => (
<span>
{record.Nav_EvaluationMethod &&
record.Nav_EvaluationMethod?.map((item, i) => {
return (
<tr>
<label> {item.Nav_Method?.NAME}</label>
</tr>
);
})}
</span>
),
},
];
this.state.scoreTotalColumns = [
{
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
key: "Nav_ProductionUnit.NAME",
},
{
title: "标准化得分",
dataIndex: "NON_STANDARDIZED_SCORE",
key: "NON_STANDARDIZED_SCORE",
},
{
title: "操作",
dataIndex: "",
key: "",
render: (text, record) => (
<span>
{
<tr>
{" "}
<Button onClick={() => this.showStandardScoreModal()}>
全部
</Button>
<Button onClick={() => this.showStandardScoreModal(1)}>
不符合项
</Button>
</tr>
}
</span>
),
},
];
120000
);
this.showModalSign();
this.getBaseInfoData(1, 1, 5);
this.setMessageData();
}
componentWillUnmount() {
this.timerID && clearTimeout(this.timerID);
this._isMounted = false; // 组件卸载时设为false
if (this.timerID) {
clearInterval(this.timerID);
this.timerID = null;
}
}
showModalSign = () => {
@ -499,7 +507,7 @@ class Home extends React.Component {
url: "FM/User/UserSign", //验证是否有签名照
onComplete: (ret) => {
//返回查询结果ret
if (ret) {
if (this._isMounted&&ret) {
//判断是否有记录
openNotification("topRight");
}
@ -514,13 +522,13 @@ class Home extends React.Component {
payload: json,
url: "PF/HomeTitle/OrderPaged",
onComplete: (ret) => {
if (ret) {
if (this._isMounted&&ret) {
this.setState({
safetySloganOne: ret[0].TITLE,
// safetySloganOne: "1.安全方针:以人为本、关注健康、依法治企、安全发展。 2.安全理念一切风险皆可控一切事故皆可防3.安全方针以人为本、关注健康、依法治企、安全发展。4.安全方针以人为本、关注健康、依法治企、安全发展。5.安全方针:以人为本、关注健康、依法治企、安全发展。 6.安全理念一切风险皆可控一切事故皆可防7.安全方针以人为本、关注健康、依法治企、安全发展。8.安全方针:以人为本、关注健康、依法治企、安全发展。",
animationDuration: ret[0].SECOND,
sliderColor:ret[0].COCOR,
sliderSize:ret[0].FONTSIZE
sliderColor: ret[0].COCOR,
sliderSize: ret[0].FONTSIZE
});
}
@ -539,7 +547,7 @@ class Home extends React.Component {
payload: json,
url: "FM/User/Get",
onComplete: (ret) => {
if (ret && ret.Nav_Department) {
if (this._isMounted&&ret && ret.Nav_Department) {
this.setState({
departmentName: ret.Nav_Department.NAME,
deparmentType: ret.Nav_Department.DEPARTMENT_TYPE,
@ -723,7 +731,7 @@ class Home extends React.Component {
payload: json,
onlyData: false,
onComplete: (re) => {
if (re && re.IsSuccessful && re.Data.newData) {
if (this._isMounted&&re && re.IsSuccessful && re.Data.newData) {
this.state.tableData[0].total = re.Data.todoCount;
this.state.tableData[1].total = re.Data.timeOverCount;
this.state.tableData[2].total = re.Data.doneCount;
@ -1379,9 +1387,9 @@ class Home extends React.Component {
? "尾矿库"
: this.state.mineType == 10
? "选矿厂"
:this.state.mineType == 31
? "职能口": this.state.mineType == 32?"非金属"
: "露天矿";
: this.state.mineType == 31
? "职能口" : this.state.mineType == 32 ? "非金属"
: "露天矿";
if (formCode == "BI054_HOMEDETAIL") {
titleTemp += "安全检查次数统计近12月";
} else if (formCode == "BI055_HOMEDETAIL") {
@ -1441,7 +1449,7 @@ class Home extends React.Component {
fade: true,
};
// 在render方法中添加动态样式计算
const { safetySloganOne, animationDuration,sliderColor,sliderSize } = this.state;
const { safetySloganOne, animationDuration, sliderColor, sliderSize } = this.state;
const rowSelection = {
onChange: (selectedRowKeys, selectedRows) => {

View File

@ -562,4 +562,143 @@
:global(.ant-select-combobox .ant-select-search__field) {
z-index: auto !important;
}
/* 公告栏容器样式 */
:global(.notice-board-container) {
width: 100%;
height: 100%;
padding: 12px;
box-sizing: border-box;
background-color: #fff;
border-radius: 10px;
display: flex;
flex-direction: column;
}
/* 公告栏标题栏 */
:global(.notice-board-header) {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16px;
}
:global(.notice-board-title) {
font-size: 16px;
font-weight: 600;
color: #333;
display: flex;
align-items: center;
white-space: nowrap;
}
/* 重要提醒标签 */
:global(.notice-important-tag) {
background-color: #ff4d4f;
color: #fff;
font-size: 12px;
padding: 2px 6px;
border-radius: 4px;
margin-left: 8px;
}
/* 查看更多链接 */
:global(.notice-view-more) {
font-size: 14px;
color: #1890ff;
cursor: pointer;
text-decoration: none;
}
:global(.notice-view-more:hover) {
text-decoration: underline;
}
/* 公告列表样式 */
:global(.notice-list) {
list-style: none;
padding: 0;
margin: 0;
max-height: calc(100% - 60px);
overflow-y: auto;
}
:global(.notice-item) {
padding: 10px 0;
border-bottom: 1px solid #f0f0f0;
cursor: pointer;
transition: background-color 0.2s;
}
:global(.notice-item:hover) {
background-color: #fafafa;
}
/* 公告内容行 */
:global(.notice-item-content) {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 4px;
}
:global(.notice-item-title) {
font-size: 14px;
color: #333;
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-right: 8px;
}
/* 未读公告标题样式 */
:global(.notice-item.unread .notice-item-title) {
font-weight: 600;
color: #1890ff;
}
:global(.notice-item-date) {
font-size: 12px;
color: #999;
white-space: nowrap;
}
/* 公告来源样式 */
:global(.notice-item-source) {
font-size: 12px;
color: #666;
}
/* 分页控件样式 */
:global(.notice-pagination) {
display: flex;
justify-content: center;
margin-top: 10px;
}
:global(.notice-page-btn) {
width: 28px;
height: 28px;
line-height: 28px;
text-align: center;
border: 1px solid #d9d9d9;
border-radius: 4px;
margin: 0 4px;
cursor: pointer;
font-size: 14px;
color: #666;
}
:global(.notice-page-btn.active) {
background-color: #1890ff;
color: #fff;
border-color: #1890ff;
}
:global(.notice-page-btn:disabled) {
cursor: not-allowed;
opacity: 0.5;
}