This commit is contained in:
wyw 2025-10-15 11:50:56 +08:00
commit e7fabd9646
4 changed files with 457 additions and 251 deletions

View File

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

View File

@ -266,6 +266,7 @@ const Sider = (props) => {
<Icon type="home"></Icon>
<span>首页</span>
</MenuItem>
{localStorage.getItem("webOrgId") == '00300000-0000-0000-0000-000000000000'?
<MenuItem key="largeScreen" onClick={navToLarge} title={'可视化大屏'} >
{/* <img
src={require("../assets/layout/menu-all.png")}
@ -274,7 +275,7 @@ const Sider = (props) => {
/> */}
<Icon type="alert"></Icon>
<span>可视化大屏</span>
</MenuItem>
</MenuItem>:null}
<SubMenu
key="sub1"
title={

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,
@ -100,6 +107,9 @@ class GroupHome extends React.Component {
standardScoreNaN: [],
visible: false,
safetySloganOne: "",
animationDuration: 20,
sliderColor: '#de4e58',
sliderSize: '24px',
safetySloganTwo: "",
noticeTitle: "",
tmpData: {},
@ -107,8 +117,8 @@ class GroupHome extends React.Component {
pagination: {},
retData: [],
chartData: [],
displayStr: null,
displayNum: 24,
displayStr: '',
displayNum: 16,
columnData: [],
columnFields: [],
delayData: [],
@ -207,21 +217,19 @@ class GroupHome extends React.Component {
}
componentDidMount() {
// if (localStorage.getItem("webOrgId") !== '00300000-0000-0000-0000-000000000000') {
// history.replace('/home')
this._isMounted = true; // 组件挂载时设为true
// if (localStorage.getItem("webOrgId") !== '00300000-0000-0000-0000-000000000000' && currentPath !== '/home') {
// this.props.history.replace('/home')
// return
// }
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 = [
this.setState({
columns: [
{
width: "450px",
title: "任务名称",
@ -260,18 +268,8 @@ class GroupHome extends React.Component {
key: "NOTICE_TYPE",
render: (text, record) => this.ShowState(record),
},
];
this.getTeam();
//定时器功能,暂时不开启
this.timerID = setInterval(
() => this.getBaseInfoData(1, this.state.tableKey, 5),
120000
);
this.showModalSign();
this.getBaseInfoData(1, 1, 5);
this.setMessageData();
this.state.scoreNoneColumns = [
{
],
scoreNoneColumns: [{
width: "80px",
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
@ -339,9 +337,8 @@ class GroupHome extends React.Component {
})}
</span>
),
},
];
this.state.scoreColumns = [
}],
scoreColumns: [
{
width: "80px",
title: "生产单元",
@ -445,8 +442,8 @@ class GroupHome extends React.Component {
</span>
),
},
];
this.state.scoreTotalColumns = [
],
scoreTotalColumns: [
{
title: "生产单元",
dataIndex: "Nav_ProductionUnit.NAME",
@ -477,11 +474,142 @@ class GroupHome extends React.Component {
</span>
),
},
];
]
})
this.getTeam();
this.getHomeTitle()
//定时器功能,暂时不开启
this.timerID = setInterval(
() => {
if (this._isMounted) {
this.getBaseInfoData(1, this.state.tableKey, 5)
}
},
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; //登录后有存储登录信息
@ -494,53 +622,46 @@ class GroupHome extends React.Component {
url: "FM/User/UserSign", //验证是否有签名照
onComplete: (ret) => {
//返回查询结果ret
if (ret) {
if (this._isMounted && ret) {
//判断是否有记录
openNotification("topRight");
}
},
});
};
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) {
const safetySlogan = ret[0].TITLE;
// 计算文本长度中文按1个字符英文/数字按0.5个字符计算)
const charCount = safetySlogan.replace(/[a-zA-Z0-9]/g, 'aa').length;
// 设置基础速率每4个字符需要1秒
const baseSpeed = 4;
// 计算动画时间最低5秒最高60秒
const duration = Math.max(5, Math.min(60, charCount / baseSpeed));
this.setState({
safetySloganOne: safetySlogan,
// safetySloganOne: "1.安全方针:以人为本、关注健康、依法治企、安全发展。 2.安全理念一切风险皆可控一切事故皆可防3.安全方针以人为本、关注健康、依法治企、安全发展。4.安全方针以人为本、关注健康、依法治企、安全发展。5.安全方针:以人为本、关注健康、依法治企、安全发展。 6.安全理念一切风险皆可控一切事故皆可防7.安全方针以人为本、关注健康、依法治企、安全发展。8.安全方针:以人为本、关注健康、依法治企、安全发展。",
animationDuration: duration,
sliderColor: ret[0].COCOR,
sliderSize: ret[0].FONTSIZE
});
}
},
});
}
getTeam = () => {
var userId = storage("lacal").getItem("userid")?.val; //登录后有存储登录信息
var orgId = storage("lacal").getItem("webOrgId")?.val; //登录后有存储登录信息
// 龙岩稀土
if (orgId == "8f1cf418-8bf3-ea3f-7a6d-fc5d61247008") {
this.setState({
safetySloganOne: "安全方针:以人为本、关注健康、依法治企、安全发展。",
});
}
// 都昌金鼎
else if (orgId == "8b3c41aa-51b1-7ce9-1879-248a038c1b5c") {
this.setState({
safetySloganOne: "安全方针:安全第一,预防为主,科学管理,持续改进。",
mineType: localStorage.getItem("currentMineType")
});
}
//洛阳豫璐
else if (orgId == "d9871ba8-0eec-9e4a-bb87-7d5a540d8913") {
this.setState({
safetySloganOne: "安全方针:科技、安全、环保、效益。",
});
}
//博柏
else if (orgId == "3efd5276-632b-e379-9ff3-7a7546591fca") {
this.setState({
safetySloganOne: "安全方针:安全第一、综合治理、控制风险、科学发展",
mineType: localStorage.getItem("currentMineType")
});
}
//行洛坑
else {
this.setState({
safetySloganOne: "安全方针:安全第一、综合治理、控制风险、科学发展",
mineType: localStorage.getItem("currentMineType")
});
}
this.setState({
safetySloganTwo: "安全理念:一切风险皆可控,一切事故皆可防!",
});
let json = initFilter(orgId);
extendRule(json, "ID", 1, userId);
extendInclude(json, "Nav_Department");
@ -549,7 +670,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,
@ -733,7 +854,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;
@ -1450,6 +1571,9 @@ class GroupHome extends React.Component {
className: styles.slideHeight,
fade: true,
};
// 在render方法中添加动态样式计算
const { safetySloganOne, animationDuration, sliderColor, sliderSize } = this.state;
const rowSelection = {
onChange: (selectedRowKeys, selectedRows) => {
this.state.taskSelects = selectedRows;
@ -1608,11 +1732,16 @@ class GroupHome extends React.Component {
<div className="slide-icon-style">
<Icon type="sound" style={{ fontSize: "28px" }}></Icon>
</div>
<div className="slide-style">
<div
className="slide-style"
style={{
'--animation-duration': `${animationDuration}s`, // 动态设置动画时长
'--slider-color': `${sliderColor}`, // 动态设置颜色
'--slider-size': `${sliderSize}px`, // 动态设置颜色
}}
>
<p className="slide-text-style">
{this.state.safetySloganOne}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
{this.state.safetySloganTwo}
{safetySloganOne || '暂无公告'}
</p>
</div>
</div>
@ -1997,7 +2126,75 @@ class GroupHome extends React.Component {
/>
) : null}
</div>
{/* <Toggle getNum={this.getChildCount}></Toggle> */}
{/* 公告栏 */}
{/* <div style={{ width: "100%", height: "100%" }}>
<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>
</div>
</div>
</div> */}
</div>
</Col>
</Row>

View File

@ -522,10 +522,18 @@ class Home extends React.Component {
url: "PF/HomeTitle/OrderPaged",
onComplete: (ret) => {
if (this._isMounted&&ret) {
const safetySlogan = ret[0].TITLE;
// 计算文本长度中文按1个字符英文/数字按0.5个字符计算)
const charCount = safetySlogan.replace(/[a-zA-Z0-9]/g, 'aa').length;
// 设置基础速率每4个字符需要1秒
const baseSpeed = 4;
// 计算动画时间最低5秒最高60秒
const duration = Math.max(5, Math.min(60, charCount / baseSpeed));
this.setState({
safetySloganOne: ret[0].TITLE,
safetySloganOne: safetySlogan,
// safetySloganOne: "1.安全方针:以人为本、关注健康、依法治企、安全发展。 2.安全理念一切风险皆可控一切事故皆可防3.安全方针以人为本、关注健康、依法治企、安全发展。4.安全方针以人为本、关注健康、依法治企、安全发展。5.安全方针:以人为本、关注健康、依法治企、安全发展。 6.安全理念一切风险皆可控一切事故皆可防7.安全方针以人为本、关注健康、依法治企、安全发展。8.安全方针:以人为本、关注健康、依法治企、安全发展。",
animationDuration: ret[0].SECOND,
animationDuration: duration,
sliderColor: ret[0].COCOR,
sliderSize: ret[0].FONTSIZE