还原

src/files/edit/PF149.js

@@ -0,0 +1,23 @@
+import React, { useEffect, useState } from 'react'
+import { message, Checkbox, Radio } from "antd/lib/index";
+import { getPropertyData, guid, extendInclude, extendRule, getDataFieldValue, setDataFieldValue, initFilter, empty, onBeforeSaveHandleRecordLog, Format } from "../../utils/common";
+import { connect } from 'dva';
+import moment from 'moment';
+import config from "../../config.js"
+import { Button, Row, Col, Form, Input, Upload, Icon, Modal, Spin } from 'antd';
+import storage from '../../utils/storage'
+import MD5 from "js-md5"
+// import PlvVideoUpload from "@polyv/vod-upload-js-sdk/vod-upload-js-sdk.min.js";
+/**
+ * @return {string}
+ */
+// 编辑  事故事件调查结果填报
+export default {
+
+  onBeforeEdit: ({ stateData, setFieldVisible, setFieldValue }) => {
+    if (stateData.ORG_ID == null || stateData.ORG_ID != '00300000-0000-0000-0000-000000000000') {
+      setFieldVisible("ISTOCHILE", false)//非总部 不能下发到子公司
+      setFieldValue("ISHEAD", 0)//非总部配置
+    }
+  }
+}

src/files/edit/PF151.js

@@ -0,0 +1,26 @@
+import React, { useEffect, useState } from 'react'
+import { message, Checkbox, Radio } from "antd/lib/index";
+import { getPropertyData, guid, extendInclude, extendRule, getDataFieldValue, setDataFieldValue, initFilter, empty, onBeforeSaveHandleRecordLog, Format } from "../../utils/common";
+import { connect } from 'dva';
+import moment from 'moment';
+import config from "../../config.js"
+import { Button, Row, Col, Form, Input, Upload, Icon, Modal, Spin } from 'antd';
+import storage from '../../utils/storage'
+import MD5 from "js-md5"
+// import PlvVideoUpload from "@polyv/vod-upload-js-sdk/vod-upload-js-sdk.min.js";
+/**
+ * @return {string}
+ */
+// 编辑  事故事件调查结果填报
+export default {
+
+  onBeforeSaveHandleRecord(params) {
+    params.record.STATUS = params.customParams;
+  },
+  onBeforeEdit: ({ stateData, setFieldVisible, setFieldValue }) => {
+    if (stateData.ORG_ID == null || stateData.ORG_ID != '00300000-0000-0000-0000-000000000000') {
+      setFieldVisible("ISTOCHILE", false)//非总部 不能下发到子公司
+      setFieldValue("ISHEAD", 0)//非总部配置
+    }
+  }
+}

src/layout/FullScreen.js

@@ -8,7 +8,11 @@ import { $consts } from "../plugins";
 import styles from "./full.less";
 import echarts from "echarts";
 import realGif from "../assets/layout/mofang.png";
-import logo from "../assets/layout/header-logo.png";
+import storage from "../utils/storage";
+import {
+  initFilter,
+} from "../utils/common";
+import logo from "../assets/layout/headerno-logo-new.png";
 import {
   FullScreenContainer,
   BorderBox8,
@@ -44,6 +48,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 +276,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 +304,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 (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 +952,7 @@ class FullScreen extends React.Component {
   };
 
   render() {
+     const { safetySloganOne, animationDuration, sliderColor, sliderSize } = this.state;
     return (
       <React.Fragment>
         <FullScreenContainer>
@@ -958,12 +988,14 @@ class FullScreen extends React.Component {
                       ></img>
                       <div
                       className="slide-style"
-                        style={{ color: "#fff", fontSize: "18px" }}
+                      style={{
+                        '--animation-duration': `${animationDuration}s`, // 动态设置动画时长
+                        '--slider-color': `${sliderColor}`, // 动态设置颜色
+                        '--slider-size': `${sliderSize}px`, // 动态设置颜色
+                      }}
                     >
                       <p className="slide-text-style">
-                          安全方针：安全第一、综合治理、控制风险、科学发展
+                        {safetySloganOne || '暂无公告'}
-                          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
-                          安全理念：一切风险皆可控，一切事故皆可防！
                       </p>
                     </div>
                     </div>

src/layout/Header.js

@@ -532,7 +532,7 @@ function Header(props) {
         <PictureThumb
           thumbCodes={thumbCode ? [thumbCode] : []}
           thumbConfigs={[{ target: thumbCode }]}
-          defaultThumb={require("../assets/layout/header-logo.png")}
+          defaultThumb={require("../assets/layout/headerno-logo-new.png")}
           className="header__left-logo"
         />
         {isMobile ? (
@@ -554,8 +554,8 @@ function Header(props) {
       {!props.matchLogin ? (
         <div className="header__right">
           {/* <RiskFourColor/> */}
-          {/* <FullScreen /> */}
+          <FullScreen />
-          {window.location.host == "121.41.2.71:8001" ? <FullScreen /> : ""} 
+          {/* {window.location.host == "121.41.2.71:8001" ? <FullScreen /> : ""}  */}
           <GuideCode />
           <HeaderNav />
           <HeaderDataV />

src/layout/Sider.js

@@ -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 = ()=>{
+  const navToLarge = () => {
-  collapsed===true?setCollapsed(false):setCollapsed(false)
+    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(()=>{
+  useEffect(() => {
-    if(collapsed == false) {
+    if (collapsed == false) {
       setCollapsed(true);
     }
-  },[props.repost])
+  }, [props.repost])
   // console.log(props.repost,'21312313213213123')
 
   /** 登录页隐藏 */
@@ -172,6 +222,21 @@ const clickMenu = ()=>{
 
   return (
     <div className={`sider ${"shortMenuShow"}`}>
+      <Modal
+        title="功能导航"
+        visible={showModal}
+        width="100%"
+        centered={true}
+        onOk={() => {
+          setshowModal(false);
+        }}
+        onCancel={() => {
+          setshowModal(false);
+        }}
+        className="fullScreen"
+      >
+        <FullScreenPage />
+      </Modal>
       <div className={`sider ${"shortMenuShow_overflow"}`}>
         <Menu
           mode="inline"
@@ -179,13 +244,13 @@ const clickMenu = ()=>{
           style={{
             //  marginTop: 24,
             // paddingRight: 10,
-          paddingTop:'21px'
+            paddingTop: '21px'
           }}
           // defaultOpenKeys={['sub1']}
           inlineIndent="16"
           onClick={clickMenu}
         >
-        <MenuItem key="1" onClick={navToHome} title={'首页'}>
+          <MenuItem key="home" onClick={navToHome} title={'首页'}>
             {/* <img
               src={require("../assets/layout/menu-all.png")}
               alt=""
@@ -194,6 +259,15 @@ const clickMenu = ()=>{
             <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={
@@ -226,7 +300,7 @@ const clickMenu = ()=>{
                 key={`${menu.Node.ID}_${index}`}
                 title={
                   <span>
-                  <Icon type= {menu.Node.ICON ? menu.Node.ICON : "reconciliation"} title={menu.Node.NAME}></Icon>
+                    <Icon type={menu.Node.ICON ? menu.Node.ICON : "reconciliation"} title={menu.Node.NAME}></Icon>
                     <span>{menu.Node.NAME}</span>
                   </span>
 
@@ -251,7 +325,7 @@ const clickMenu = ()=>{
                       title={
                         <span>
                           <Icon type={menu1.Node.ICON ? menu1.Node.ICON : "reconciliation"}></Icon>
-                      <span>{ menu1.Node.NAME}</span>
+                          <span>{menu1.Node.NAME}</span>
                         </span>
 
                       }
@@ -284,20 +358,20 @@ const clickMenu = ()=>{
       <div onClick={toggleCollapsed}
         style={{
           marginBottom: 16,
-        display:'flex',
+          display: 'flex',
-        alignItems:'center',
+          alignItems: 'center',
-        position:'absolute',
+          position: 'absolute',
-        right:0,
+          right: 0,
-        top:'40%',
+          top: '40%',
-        padding:'40px 0px',
+          padding: '40px 0px',
-        backgroundColor:'#DEE0E8',
+          backgroundColor: '#DEE0E8',
-        borderRadius:'6px',
+          borderRadius: '6px',
-        margin:'0px 0px 0px 0px',
+          margin: '0px 0px 0px 0px',
 
         }}>
         <Icon type={collapsed ? 'right' : 'left'} style={{
-            fontSize:'12px',
+          fontSize: '12px',
-            display:'flex',
+          display: 'flex',
           // alignItems:'right',
           // justifyContent:'flex-end'
         }} />

src/plugins/consts/services/route.ts

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

src/router.js

@@ -4,6 +4,7 @@ import { Router, Route, Switch } from 'dva/router'
 import MainLayout from './layout/Main'
 import Login from './routes/Login'
 import Home from './routes/Home'
+import GroupHome from './routes/GroupHome'
 import Main from './routes/Main'
 import Backend from './routes/Backend'
 import HomeMobileNew from './routes/HomeMobileNew'
@@ -11,7 +12,7 @@ import { $consts } from './plugins'
 import zhCN from 'antd/lib/locale-provider/zh_CN'
 import 'moment/src/locale/zh-cn'
 
-function RouterConfig ({ history }) {
+function RouterConfig({ history }) {
   return (
     <Router history={history}>
       <ConfigProvider locale={zhCN}>
@@ -19,6 +20,7 @@ function RouterConfig ({ history }) {
           <Switch>
             <Route path={$consts['ROUTE/LOGIN']} component={Login} />
             <Route path={$consts['ROUTE/HOME']} component={Home} />
+            <Route path={$consts['ROUTE/GROUPHOME']} component={GroupHome} />
             <Route path={$consts['ROUTE/MAIN']} component={Main} />
             <Route path={$consts['ROUTE/BACKEND']} component={Backend} />
             {/* <Route path={$consts['ROUTE/HomeMobileNew']} component={HomeMobileNew} /> */}

src/routes/Home.js

@@ -88,6 +88,8 @@ const contentStyle = {
 };
 
 class Home extends React.Component {
+  _isMounted = false; // 标记组件是否已挂载
+
   constructor(props) {
     super(props);
     this.state = {
@@ -100,6 +102,9 @@ class Home extends React.Component {
       standardScoreNaN: [],
       visible: false,
       safetySloganOne: "",
+      animationDuration: 20,
+      sliderColor: '#de4e58',
+      sliderSize: '24px',
       safetySloganTwo: "",
       noticeTitle: "",
       tmpData: {},
@@ -107,8 +112,8 @@ class Home extends React.Component {
       pagination: {},
       retData: [],
       chartData: [],
-      displayStr: null,
+      displayStr: '',
-      displayNum: 24,
+      displayNum: 16,
       columnData: [],
       columnFields: [],
       delayData: [],
@@ -207,18 +212,21 @@ class Home extends React.Component {
   }
 
   componentDidMount() {
+    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";
+      return; // 阻止后续代码执行
-      this.state.displayNum = 24;
       //alert('手机');
-    } else {
-      this.state.displayStr = "";
-      this.state.displayNum = 16;
-      //alert('PC');
     }
-    this.state.columns = [
+    this.setState({
+      columns: [
         {
           width: "450px",
           title: "任务名称",
@@ -257,18 +265,8 @@ class Home extends React.Component {
           key: "NOTICE_TYPE",
           render: (text, record) => this.ShowState(record),
         },
-    ];
+      ],
-    this.getTeam();
+      scoreNoneColumns: [{
-    //定时器功能，暂时不开启
-    this.timerID = setInterval(
-      () => this.getBaseInfoData(1, this.state.tableKey, 5),
-      120000
-    );
-    this.showModalSign();
-    this.getBaseInfoData(1, 1, 5);
-    this.setMessageData();
-    this.state.scoreNoneColumns = [
-      {
         width: "80px",
         title: "生产单元",
         dataIndex: "Nav_ProductionUnit.NAME",
@@ -336,9 +334,8 @@ class Home extends React.Component {
               })}
           </span>
         ),
-      },
+      }],
-    ];
+      scoreColumns: [
-    this.state.scoreColumns = [
         {
           width: "80px",
           title: "生产单元",
@@ -442,8 +439,8 @@ class Home extends React.Component {
             </span>
           ),
         },
-    ];
+      ],
-    this.state.scoreTotalColumns = [
+      scoreTotalColumns: [
         {
           title: "生产单元",
           dataIndex: "Nav_ProductionUnit.NAME",
@@ -474,10 +471,29 @@ class Home 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();
   }
   componentWillUnmount() {
-    this.timerID && clearTimeout(this.timerID);
+    this._isMounted = false; // 组件卸载时设为false
+    if (this.timerID) {
+      clearInterval(this.timerID);
+      this.timerID = null;
+    }
   }
 
   showModalSign = () => {
@@ -491,53 +507,38 @@ class Home 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) {
+          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
+
+          });
+        }
+      },
+    });
+  }
 
   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");
@@ -546,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,
@@ -730,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;
@@ -1386,8 +1387,8 @@ class Home extends React.Component {
         ? "尾矿库"
         : this.state.mineType == 10
           ? "选矿厂"
-          :this.state.mineType == 31
+          : this.state.mineType == 31
-           ? "职能口": this.state.mineType == 32?"非金属"
+            ? "职能口" : this.state.mineType == 32 ? "非金属"
               : "露天矿";
     if (formCode == "BI054_HOMEDETAIL") {
       titleTemp += "安全检查次数统计（近12月）";
@@ -1447,6 +1448,9 @@ class Home 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;
@@ -1605,11 +1609,16 @@ class Home 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}
+                        {safetySloganOne || '暂无公告'}
-                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
-                        {this.state.safetySloganTwo}
                       </p>
                     </div>
                   </div>

src/routes/dashboard.css

@@ -1,188 +1,213 @@
 /* 工作台调整样式 */
-:global(.dashboard-div-style){
+:global(.dashboard-div-style) {
   height: 100%;
-    width:100%;
+  width: 100%;
-    border-radius:10px;
+  border-radius: 10px;
-    background-color:white;
+  background-color: white;
   min-height: 20px;
-  }
+}
-  :global(.redTableCell){
+
+:global(.redTableCell) {
   background: #e6f7ff;
-  }
+}
-  :global(.bi001-table){
+
-     :global(.ant-table-tbody > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td){
+:global(.bi001-table) {
+  :global(.ant-table-tbody > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td) {
     background: #fff;
   }
-  }
+}
 
-  :global(.slide-style){
+:global(.slide-style) {
-    /* margin-bottom: 10px; */
+  /* position: absolute; */
-    font-size: 24px;
+  top: 0;
-    font-weight: bold;
+  left: 0;
-    color:#de4e58;
+  width: auto;
-    /* -webkit-text-stroke: #E38C7A 1px; */
+  height: 100%;
-    /* padding-left:30px; */
-    flex: 1;
-    overflow: hidden;
   display: flex;
   align-items: center;
+  color: var(--slider-color);
+  font-weight: bold;
+  overflow: hidden;
+  flex: 1;
 
-  }
+}
-  :global(.slide-icon-style){
+
+:global(.slide-icon-style) {
   /* padding: 0px 20px; */
   margin-right: 10px;
   display: flex;
   align-items: center;
 
-  }
+}
 
-  :global(.slide-content){
+:global(.slide-content) {
+  overflow: hidden;
+  position: relative;
+  height: 50px;
+  line-height: 50px;
+  /* 固定高度 */
+  background-color: #ffffff;
+  /* 背景色 */
+  border-radius: 4px;
   margin-bottom: 10px;
-    background: #ffffff;
-    /* padding-left:30px; */
-    padding: 0px 30px;
-    box-sizing: border-box;
-    border-radius:4px;
-    height:50px;
-    line-height:50px;
-    /* border:1px solid red; */
-    /* overflow:hidden; */
   display: flex;
   flex-direction: row;
   align-items: center;
-    box-shadow: 2px 1px 8px 1px rgb(228, 232, 235);
+  padding: 0 30px;
-    /* min-width: 100px; */
+}
-  }
 
-  :global(.slide-text-style){
+:global(.slide-text-style) {
-    position:relative;
+  white-space: nowrap;
-    display:inline-block;
-    white-space:nowrap;
-    animation: slide-text-style 20s linear 1s infinite ;
-    width:'auto';
   align-items: center;
+  /* 禁止换行 */
+  padding: 0 16px;
+  font-size: var(--slider-size);
+  animation: slide-text-style var(--animation-duration) linear infinite;
   margin-top: 1em;
+}
+
+@keyframes slide-text-style {
+  0% {
+    transform: translateX(100%);
+    -webkit-transform: translateX(100%);
   }
 
-  @keyframes slide-text-style{
+  100% {
-    0%{margin-left:100%;}
+    transform: translateX(-100%);
-  100%{margin-left:-1200px;}
+    -webkit-transform: translateX(-100%);
   }
+}
+
+@media (max-width: 768px) {
+  .slide-text-style {
+    font-size: 14px;
+  }
+}
 
 
-  :global(.slick-prev){
+:global(.slick-prev) {
   padding: 2px 0px 0px 0px !important;
-  }
+}
-  :global(.slick-next){
+
+:global(.slick-next) {
   padding: 2px 0px 0px 0px !important;
-  }
+}
-  :global(.slick-dots){
+
-    position: absolute!important;
+:global(.slick-dots) {
-    bottom: 20px!important;
+  position: absolute !important;
+  bottom: 20px !important;
   z-index: 100;
-  }
+}
-  :global(.slick-prev){
+
-    background-color: rgb(50,150,250) !important;
+:global(.slick-prev) {
+  background-color: rgb(50, 150, 250) !important;
   left: 8px !important;
   z-index: 100 !important;
   border-radius: 50%;
-  }
+}
-  :global(.slick-next){
+
-    background-color: rgb(50,150,250) !important;
+:global(.slick-next) {
+  background-color: rgb(50, 150, 250) !important;
   right: 8px !important;
   z-index: 100 !important;
   border-radius: 50%;
-  }
+}
 
-  :global(.score-title-style){
+:global(.score-title-style) {
   font-size: 14pt;
   padding-top: 18px;
   color: red;
   text-align: center;
   min-width: 110px;
-  }
+}
 
-  :global(.score-num-style){
+:global(.score-num-style) {
   font-size: 60pt;
   font-weight: bold;
   margin-top: 14px;
   color: white;
   text-align: center;
-  }
+}
 
-  :global(.score-icon-style){
+:global(.score-icon-style) {
   font-size: 30pt;
   margin-top: -64px;
   color: white;
   float: right;
-  }
+}
 
-  :global(.backlog-title-style){
+:global(.backlog-title-style) {
   font-size: 14pt;
   margin-left: 22px;
   padding-top: 10px;
   color: white;
   margin-bottom: 20px;
   /* min-width: 120px; */
-  }
+}
-  :global(.backlog-icontitle-style){
+
+:global(.backlog-icontitle-style) {
   font-size: 32px;
   margin-left: 22px;
   /* padding-top: 10px; */
   color: white;
   /* min-width: 120px; */
   margin-top: 22px;
-  }
+}
-  :global(.backlog-icontitle-style1){
+
+:global(.backlog-icontitle-style1) {
   font-size: 32px;
   margin-left: 24px;
   /* padding-top: 10px; */
   color: white;
   /* min-width: 120px; */
   margin-top: 22px;
-  }
+}
-  :global(.backlog-icontitle-style2){
+
+:global(.backlog-icontitle-style2) {
   font-size: 32px;
   margin-left: 18px;
   /* padding-top: 10px; */
   color: white;
   /* min-width: 120px; */
   margin-top: 22px;
-  }
+}
-  :global(.backlog-icontitle-style3){
+
+:global(.backlog-icontitle-style3) {
   font-size: 32px;
   margin-left: 22px;
   /* padding-top: 10px; */
   color: white;
   /* min-width: 120px; */
   margin-top: 22px;
-  }
+}
-  :global(.backlog-icontitle-style4){
+
+:global(.backlog-icontitle-style4) {
   font-size: 32px;
   margin-left: 18px;
   /* padding-top: 10px; */
   color: white;
   /* min-width: 120px; */
   margin-top: 22px;
-  }
+}
-  :global(.backlog-icon-score){
+
+:global(.backlog-icon-score) {
   font-size: 32px;
   /* margin-left: 22px; */
   /* padding-top: 10px; */
   color: white;
   /* min-width: 120px; */
   /* margin-top: 22px; */
-  }
+}
 
-  :global(.backlog-title-score){
+:global(.backlog-title-score) {
   font-size: 14pt;
   margin-left: 12px;
   /* padding-top: 10px; */
   color: white;
   /* min-width: 120px; */
-  }
+}
 
-  :global(.backlog-scoretitle-style){
+:global(.backlog-scoretitle-style) {
   font-size: 32px;
   /* margin-left: 22px; */
   /* padding-top: 10px; */
@@ -190,17 +215,18 @@
   /* min-width: 120px; */
   /* margin-top: 20px; */
   margin: 9px 0px 9px 22px;
-  }
+}
-  :global(.backlog-score-wrap){
+
+:global(.backlog-score-wrap) {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   margin: 20px 0px 0px 0px;
-  }
+}
 
 
-  :global(.backlog-icon-title){
+:global(.backlog-icon-title) {
   font-size: 14pt;
   margin-left: 10px;
   /* padding-top: 10px; */
@@ -209,40 +235,47 @@
   /* margin-top: 22px; */
   display: flex;
   align-items: center;
-  }
+}
-  :global(.backlog-background-style){
-    background: linear-gradient(135deg,  #75baf3,#2177d5);
-  }
-  :global(.backlog-background-style1){
-    background: linear-gradient(135deg,  #ffa94d,#f76707);
-  }
-  :global(.backlog-background-style2){
-    background:linear-gradient(135deg,  #99ca6e,#48a447);   
-    /* linear-gradient(135deg,  #aab5e2,#5f6ac2);  */
-  }
-  :global(.backlog-background-style3){
-    background: linear-gradient(135deg,  #ffe066,#fcc419);
-  }
-  :global(.backlog-background-style4){
-    background: linear-gradient(135deg,  rgb(245, 121, 118),#c92a2a);
-    /*#ea9a99,#de4e58  */
-  }
 
-  :global(.backlog-title-style2){
+:global(.backlog-background-style) {
+  background: linear-gradient(135deg, #75baf3, #2177d5);
+}
+
+:global(.backlog-background-style1) {
+  background: linear-gradient(135deg, #ffa94d, #f76707);
+}
+
+:global(.backlog-background-style2) {
+  background: linear-gradient(135deg, #99ca6e, #48a447);
+  /* linear-gradient(135deg,  #aab5e2,#5f6ac2);  */
+}
+
+:global(.backlog-background-style3) {
+  background: linear-gradient(135deg, #ffe066, #fcc419);
+}
+
+:global(.backlog-background-style4) {
+  background: linear-gradient(135deg, rgb(245, 121, 118), #c92a2a);
+  /*#ea9a99,#de4e58  */
+}
+
+:global(.backlog-title-style2) {
   font-size: 12pt;
   margin-left: 10px;
   padding-top: 2px;
   color: white;
   min-width: 500px;
-  }
+}
-  :global(.backlog-style){
+
+:global(.backlog-style) {
   font-size: 28pt;
   font-weight: bold;
-    margin-left:22px;
+  margin-left: 22px;
   color: white;
   margin-top: 10px;
-  }
+}
-  :global(.backlog-style-score){
+
+:global(.backlog-style-score) {
 
   /* margin-left:22px; */
   color: white;
@@ -255,73 +288,81 @@
   height: 100%;
   font-size: 38pt;
   font-weight: bold;
-  }
+}
-  :global(.score-title){
+
+:global(.score-title) {
   font-size: 16pt;
   /* font-weight: bold; */
   display: flex;
   align-items: center;
   /* margin-left:22px; */
-  }
+}
-  :global(.score-content){
+
+:global(.score-content) {
   display: flex;
   flex-direction: row;
   margin-bottom: 10px;
-  }
+}
-  :global(.score-num){
+
+:global(.score-num) {
   display: flex;
   align-items: center;
   font-size: 16pt;
   font-weight: bold;
-  }
+}
 
 
-  :global(.backlog-style4){
+:global(.backlog-style4) {
   font-size: 28pt;
   font-weight: bold;
-    margin-left:22px;
+  margin-left: 22px;
   color: white;
   margin-top: 10px;
-  }
+}
-  :global(.backlog-style2){
+
+:global(.backlog-style2) {
   font-size: 20pt;
   font-weight: bold;
-    margin-left:10px;
+  margin-left: 10px;
   color: white;
   margin-top: -8px;
-  }
+}
-  :global(.backlog-style3){
+
+:global(.backlog-style3) {
   font-size: 16pt;
   font-weight: bold;
-    margin-left:10px;
+  margin-left: 10px;
   color: white;
   margin-top: -8px;
-  }
+}
-  :global(.notice-title-style){
+
+:global(.notice-title-style) {
   color: rgb(255, 255, 255);
   font-size: 16pt;
   margin-left: 20px;
   padding-top: 6px;
-  }
+}
 
-  :global(.notice-title-style span){
+:global(.notice-title-style span) {
   float: right;
   margin-right: 48px;
   font-size: 14pt;
   margin-top: 6px;
-  }
+}
 
-  :global(.notice-content-style ){
+:global(.notice-content-style) {
   color: white;
   line-height: 38px;
   margin-left: 20px;
   margin-top: 20px;
   font-size: 12pt;
-  }
+}
-  :global(.notice-content-style span){
+
+:global(.notice-content-style span) {
   margin-right: 16px;
-  }
+}
-  :global(.statistical-title-style){
+
+:global(.statistical-title-style) {
   border-bottom: 1px solid #d9d9d9;
   color: #333333;
   font-size: 18px;
@@ -330,14 +371,16 @@
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
-  }
+}
-  :global(.statistical-title-style2){
+
+:global(.statistical-title-style2) {
   border-bottom: 1px solid #d9d9d9;
   color: #333333;
   font-size: 14px;
   padding: 8px 0px 0px 20px;
-  }
+}
-  :global(.badge-style){
+
+:global(.badge-style) {
   /* background: #ffffff;
       border: 2px solid #5f6ac2;
       width: 8px;
@@ -350,19 +393,22 @@
   display: flex;
   flex-direction: row;
   align-items: center;
-  }
+}
-  :global(.backlog-icon-style){
+
+:global(.backlog-icon-style) {
   position: relative;
   top: -2px;
   margin-left: 45%;
   width: 30px;
-  }
+}
-  :global(.backlog-icon-style2){
+
+:global(.backlog-icon-style2) {
   position: relative;
   /* top: -2px; */
   /* width: 10px; */
-  }
+}
-  :global(.backlog-icon-style3){
+
+:global(.backlog-icon-style3) {
   position: relative;
   top: -2px;
   margin-left: calc(50% - 20px);
@@ -371,8 +417,9 @@
   border-left: 20px solid transparent;
   border-right: 20px solid transparent;
   border-top: 10px solid #3b8bde;
-  }
+}
-  :global(.backlog-icon-style4){
+
+:global(.backlog-icon-style4) {
   position: relative;
   top: -2px;
   margin-left: calc(50% - 20px);
@@ -381,8 +428,9 @@
   border-left: 20px solid transparent;
   border-right: 20px solid transparent;
   border-top: 10px solid #fa7b1c;
-  }
+}
-  :global(.backlog-icon-style5){
+
+:global(.backlog-icon-style5) {
   position: relative;
   top: -2px;
   margin-left: calc(50% - 20px);
@@ -391,8 +439,9 @@
   border-left: 20px solid transparent;
   border-right: 20px solid transparent;
   border-top: 10px solid #5faf52;
-  }
+}
-  :global(.backlog-icon-style6){
+
+:global(.backlog-icon-style6) {
   position: relative;
   top: -2px;
   margin-left: calc(50% - 20px);
@@ -401,8 +450,9 @@
   border-left: 20px solid transparent;
   border-right: 20px solid transparent;
   border-top: 10px solid #fdcc2e;
-  }
+}
-  :global(.backlog-icon-style7){
+
+:global(.backlog-icon-style7) {
   position: relative;
   top: -2px;
   margin-left: calc(50% - 20px);
@@ -411,73 +461,84 @@
   border-left: 20px solid transparent;
   border-right: 20px solid transparent;
   border-top: 10px solid #c92a2a;
-  }
+}
-  .sideContent :global(.ant-menu-inline-collapsed > .ant-menu-submenu > .ant-menu-submenu-title){
+
+.sideContent :global(.ant-menu-inline-collapsed > .ant-menu-submenu > .ant-menu-submenu-title) {
   padding: 0 10px !important;
   text-align: center;
-  }
+}
 
-  .sideContent :global(.ant-menu-inline-collapsed){
+.sideContent :global(.ant-menu-inline-collapsed) {
-    width: inherit!important;
+  width: inherit !important;
-  }
+}
-  .IndexPageTabs{
+
+.IndexPageTabs {
   background-color: inherit;
-  }
+}
 
-  .IndexPageTabs :global(.ant-tabs-bar){
+.IndexPageTabs :global(.ant-tabs-bar) {
   background-color: #ecf4f6;
   padding: 0 10px;
-  }
+}
-  /* :global(.header .IndexPage__loginMenu___xUJI4 span) {
+
+/* :global(.header .IndexPage__loginMenu___xUJI4 span) {
     vertical-align: baseline!important;
   } */
-  :global(.home-always-title) {
+:global(.home-always-title) {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
   padding: 10px 10px 10px 0px;
-  }
+}
-  :global(.home-always-left) {
+
+:global(.home-always-left) {
   display: flex;
   flex-direction: row;
   align-items: center;
-  }
+}
-  :global(.home-always-badge) {
+
+:global(.home-always-badge) {
   width: 4px;
   height: 19px;
   background-color: #4f69e9;
   border-radius: 3px;
   margin-top: 2px;
   margin-right: 10px;
-  }
+}
-  :global(.home-always-name) {
+
+:global(.home-always-name) {
   font-size: 14px;
   color: #303133;
   font-weight: bold;
-  }
+}
-  :global(.home-always-icon) {
+
+:global(.home-always-icon) {
   color: #909399;
   font-size: 14px;
   cursor: pointer;
-  }
+}
-  :global(.risk-model-col) {
+
+:global(.risk-model-col) {
   background-color: #fff;
   box-shadow: 0 0px 20px 1px rgba(0, 0, 0, 0.12);
   padding: 0px;
   border-radius: 5px;
-  }
+}
-  :global(.risk-chart) {
+
+:global(.risk-chart) {
   display: flex;
   flex-direction: column;
-  }
+}
-  :global(.risk-model-tab) {
+
+:global(.risk-model-tab) {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
-  }
+}
-  :global(.risk-model-card) {
+
+:global(.risk-model-card) {
   padding: 5px 10px;
   border: 1px solid #ebeef5;
   border-radius: 5px;
@@ -486,8 +547,9 @@
   cursor: pointer;
   background-color: #fff;
   color: #303133;
-  }
+}
-  :global(.risk-model-card-choose) {
+
+:global(.risk-model-card-choose) {
   padding: 5px 10px;
   border: 1px solid #3c9cff;
   border-radius: 5px;
@@ -496,7 +558,147 @@
   cursor: pointer;
   background-color: #3c9cff;
   color: #fff;
-  }
+}
-  :global(.ant-select-combobox .ant-select-search__field) {
+
-    z-index: auto!important;
+: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;
+}