title

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 ? (

src/routes/GroupHome.js

@@ -100,6 +100,9 @@ class GroupHome extends React.Component {
       standardScoreNaN: [],
       visible: false,
       safetySloganOne: "",
+      animationDuration: 20,
+      sliderColor:'#de4e58',
+      sliderSize:'24px',
       safetySloganTwo: "",
       noticeTitle: "",
       tmpData: {},
@@ -263,6 +266,7 @@ class GroupHome extends React.Component {
       },
     ];
     this.getTeam();
+    this.getHomeTitle()
     //定时器功能，暂时不开启
     this.timerID = setInterval(
       () => this.getBaseInfoData(1, this.state.tableKey, 5),
@@ -502,46 +506,31 @@ class GroupHome extends React.Component {
       },
     });
   };
+  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
+
+          });
+        }
+      },
+    });
+  }
 
   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");
@@ -1451,6 +1440,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;
@@ -1609,11 +1601,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}
+                        {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/Home.js

@@ -87,8 +87,7 @@ const contentStyle = {
   background: "#364d79",
 };
 
-
+class GroupHome extends React.Component {
-class Home extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
@@ -101,6 +100,9 @@ class Home extends React.Component {
       standardScoreNaN: [],
       visible: false,
       safetySloganOne: "",
+      animationDuration: 20,
+      sliderColor:'#de4e58',
+      sliderSize:'24px',
       safetySloganTwo: "",
       noticeTitle: "",
       tmpData: {},
@@ -208,7 +210,6 @@ class Home extends React.Component {
   }
 
   componentDidMount() {
-
    if (localStorage.getItem("webOrgId") == '00300000-0000-0000-0000-000000000000') {
         this.props.history.replace('/grouphome')
       // props.history.push({ pathname: "/grouphome" });
@@ -265,6 +266,7 @@ class Home extends React.Component {
       },
     ];
     this.getTeam();
+    this.getHomeTitle()
     //定时器功能，暂时不开启
     this.timerID = setInterval(
       () => this.getBaseInfoData(1, this.state.tableKey, 5),
@@ -504,46 +506,31 @@ class Home extends React.Component {
       },
     });
   };
+  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
+
+          });
+        }
+      },
+    });
+  }
 
   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");
@@ -1453,6 +1440,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;
@@ -1611,11 +1601,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>
@@ -2170,4 +2165,4 @@ class Home extends React.Component {
     );
   }
 }
-export default connect(({ login, app }) => ({ login, app }))(Home);
+export default connect(({ login, app }) => ({ login, app }))(GroupHome);

src/routes/dashboard.css

@@ -6,9 +6,11 @@
   background-color: white;
   min-height: 20px;
 }
+
 :global(.redTableCell) {
   background: #e6f7ff;
 }
+
 :global(.bi001-table) {
   :global(.ant-table-tbody > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td) {
     background: #fff;
@@ -16,18 +18,20 @@
 }
 
 :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) {
   /* padding: 0px 20px; */
   margin-right: 10px;
@@ -37,56 +41,71 @@
 }
 
 :global(.slide-content) {
-    margin-bottom: 10px;
+  overflow: hidden;
-    background: #ffffff;
+  position: relative;
-    /* padding-left:30px; */
-    padding: 0px 30px;
-    box-sizing: border-box;
-    border-radius:4px;
   height: 50px;
   line-height: 50px;
-    /* border:1px solid red; */
+  /* 固定高度 */
-    /* overflow:hidden; */
+  background-color: #ffffff;
+  /* 背景色 */
+  border-radius: 4px;
+  margin-bottom: 10px;
   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) {
-    position:relative;
-    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%{margin-left:100%;}
+  0% {
-  100%{margin-left:-1200px;}
+    transform: translateX(100%);
+    -webkit-transform: translateX(100%);
+  }
+
+  100% {
+    transform: translateX(-100%);
+    -webkit-transform: translateX(-100%);
+  }
+}
+
+@media (max-width: 768px) {
+  .slide-text-style {
+    font-size: 14px;
+  }
 }
 
 
 :global(.slick-prev) {
   padding: 2px 0px 0px 0px !important;
 }
+
 :global(.slick-next) {
   padding: 2px 0px 0px 0px !important;
 }
+
 :global(.slick-dots) {
   position: absolute !important;
   bottom: 20px !important;
   z-index: 100;
 }
+
 :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;
   right: 8px !important;
@@ -125,6 +144,7 @@
   margin-bottom: 20px;
   /* min-width: 120px; */
 }
+
 :global(.backlog-icontitle-style) {
   font-size: 32px;
   margin-left: 22px;
@@ -133,6 +153,7 @@
   /* min-width: 120px; */
   margin-top: 22px;
 }
+
 :global(.backlog-icontitle-style1) {
   font-size: 32px;
   margin-left: 24px;
@@ -141,6 +162,7 @@
   /* min-width: 120px; */
   margin-top: 22px;
 }
+
 :global(.backlog-icontitle-style2) {
   font-size: 32px;
   margin-left: 18px;
@@ -149,6 +171,7 @@
   /* min-width: 120px; */
   margin-top: 22px;
 }
+
 :global(.backlog-icontitle-style3) {
   font-size: 32px;
   margin-left: 22px;
@@ -157,6 +180,7 @@
   /* min-width: 120px; */
   margin-top: 22px;
 }
+
 :global(.backlog-icontitle-style4) {
   font-size: 32px;
   margin-left: 18px;
@@ -165,6 +189,7 @@
   /* min-width: 120px; */
   margin-top: 22px;
 }
+
 :global(.backlog-icon-score) {
   font-size: 32px;
   /* margin-left: 22px; */
@@ -191,6 +216,7 @@
   /* margin-top: 20px; */
   margin: 9px 0px 9px 22px;
 }
+
 :global(.backlog-score-wrap) {
   display: flex;
   flex-direction: row;
@@ -210,19 +236,24 @@
   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  */
@@ -235,6 +266,7 @@
   color: white;
   min-width: 500px;
 }
+
 :global(.backlog-style) {
   font-size: 28pt;
   font-weight: bold;
@@ -242,6 +274,7 @@
   color: white;
   margin-top: 10px;
 }
+
 :global(.backlog-style-score) {
 
   /* margin-left:22px; */
@@ -256,6 +289,7 @@
   font-size: 38pt;
   font-weight: bold;
 }
+
 :global(.score-title) {
   font-size: 16pt;
   /* font-weight: bold; */
@@ -263,11 +297,13 @@
   align-items: center;
   /* margin-left:22px; */
 }
+
 :global(.score-content) {
   display: flex;
   flex-direction: row;
   margin-bottom: 10px;
 }
+
 :global(.score-num) {
   display: flex;
   align-items: center;
@@ -283,6 +319,7 @@
   color: white;
   margin-top: 10px;
 }
+
 :global(.backlog-style2) {
   font-size: 20pt;
   font-weight: bold;
@@ -290,6 +327,7 @@
   color: white;
   margin-top: -8px;
 }
+
 :global(.backlog-style3) {
   font-size: 16pt;
   font-weight: bold;
@@ -297,6 +335,7 @@
   color: white;
   margin-top: -8px;
 }
+
 :global(.notice-title-style) {
   color: rgb(255, 255, 255);
   font-size: 16pt;
@@ -318,9 +357,11 @@
   margin-top: 20px;
   font-size: 12pt;
 }
+
 :global(.notice-content-style span) {
   margin-right: 16px;
 }
+
 :global(.statistical-title-style) {
   border-bottom: 1px solid #d9d9d9;
   color: #333333;
@@ -331,12 +372,14 @@
   justify-content: space-between;
   align-items: center;
 }
+
 :global(.statistical-title-style2) {
   border-bottom: 1px solid #d9d9d9;
   color: #333333;
   font-size: 14px;
   padding: 8px 0px 0px 20px;
 }
+
 :global(.badge-style) {
   /* background: #ffffff;
       border: 2px solid #5f6ac2;
@@ -351,17 +394,20 @@
   flex-direction: row;
   align-items: center;
 }
+
 :global(.backlog-icon-style) {
   position: relative;
   top: -2px;
   margin-left: 45%;
   width: 30px;
 }
+
 :global(.backlog-icon-style2) {
   position: relative;
   /* top: -2px; */
   /* width: 10px; */
 }
+
 :global(.backlog-icon-style3) {
   position: relative;
   top: -2px;
@@ -372,6 +418,7 @@
   border-right: 20px solid transparent;
   border-top: 10px solid #3b8bde;
 }
+
 :global(.backlog-icon-style4) {
   position: relative;
   top: -2px;
@@ -382,6 +429,7 @@
   border-right: 20px solid transparent;
   border-top: 10px solid #fa7b1c;
 }
+
 :global(.backlog-icon-style5) {
   position: relative;
   top: -2px;
@@ -392,6 +440,7 @@
   border-right: 20px solid transparent;
   border-top: 10px solid #5faf52;
 }
+
 :global(.backlog-icon-style6) {
   position: relative;
   top: -2px;
@@ -402,6 +451,7 @@
   border-right: 20px solid transparent;
   border-top: 10px solid #fdcc2e;
 }
+
 :global(.backlog-icon-style7) {
   position: relative;
   top: -2px;
@@ -412,6 +462,7 @@
   border-right: 20px solid transparent;
   border-top: 10px solid #c92a2a;
 }
+
 .sideContent :global(.ant-menu-inline-collapsed > .ant-menu-submenu > .ant-menu-submenu-title) {
   padding: 0 10px !important;
   text-align: center;
@@ -420,6 +471,7 @@
 .sideContent :global(.ant-menu-inline-collapsed) {
   width: inherit !important;
 }
+
 .IndexPageTabs {
   background-color: inherit;
 }
@@ -428,6 +480,7 @@
   background-color: #ecf4f6;
   padding: 0 10px;
 }
+
 /* :global(.header .IndexPage__loginMenu___xUJI4 span) {
     vertical-align: baseline!important;
   } */
@@ -438,11 +491,13 @@
   justify-content: space-between;
   padding: 10px 10px 10px 0px;
 }
+
 :global(.home-always-left) {
   display: flex;
   flex-direction: row;
   align-items: center;
 }
+
 :global(.home-always-badge) {
   width: 4px;
   height: 19px;
@@ -451,32 +506,38 @@
   margin-top: 2px;
   margin-right: 10px;
 }
+
 :global(.home-always-name) {
   font-size: 14px;
   color: #303133;
   font-weight: bold;
 }
+
 :global(.home-always-icon) {
   color: #909399;
   font-size: 14px;
   cursor: pointer;
 }
+
 :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) {
   display: flex;
   flex-direction: column;
 }
+
 :global(.risk-model-tab) {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
 }
+
 :global(.risk-model-card) {
   padding: 5px 10px;
   border: 1px solid #ebeef5;
@@ -487,6 +548,7 @@
   background-color: #fff;
   color: #303133;
 }
+
 :global(.risk-model-card-choose) {
   padding: 5px 10px;
   border: 1px solid #3c9cff;
@@ -497,6 +559,7 @@
   background-color: #3c9cff;
   color: #fff;
 }
+
 :global(.ant-select-combobox .ant-select-search__field) {
   z-index: auto !important;
 }