分公司BI

src/pages/Container/WhiteBranchOffice/components/CenterPanel/index.js

@@ -1,8 +1,14 @@
+import Title from "~/pages/Container/WhiteBranchOffice/components/Title";
 import "./index.less";
 
 function CenterPanel() {
   return (
     <div className="white_branch_office_center_container">
+      <div className="block1">
+        <Title title="企业安全状态信息" />
+        <div className="container">
+        </div>
+      </div>
     </div>
   );
 }

src/pages/Container/WhiteBranchOffice/components/CenterPanel/index.less

@@ -1,3 +1,13 @@
 .white_branch_office_center_container{
   flex: 1;
+
+  .block1 {
+    .container {
+      border-radius: 0 0 4px 4px;
+      border: 1px solid #fff;
+      border-top: none;
+      background-color: #E0EDFD;
+      padding: 16px 20px;
+    }
+  }
 }

src/pages/Container/WhiteBranchOffice/components/Title/index.js

@@ -1,9 +1,12 @@
-import titbg from "~/assets/images/public/white/titbg1.png";
+import titlebg from "~/assets/images/public/white/titlebg1.png";
 import "./index.less";
 
 function Title(props) {
   return (
-    <div className="white_bi_title" style={{ backgroundImage: `url(${titbg})` }}>
+    <div className="white_bi_title">
+      <div className="decoration">
+        <img src={titlebg} alt="" />
+      </div>
       <div className="title">{props.title}</div>
     </div>
   );

src/pages/Container/WhiteBranchOffice/components/Title/index.less

@@ -4,12 +4,22 @@
   background-size: 100% 100%;
   background-repeat: no-repeat;
   border-radius: 4px 4px 0 0;
+  border: 1px solid #fff;
+  background-image: linear-gradient(0deg, rgb(206, 227, 246) 0%, rgb(188, 219, 244) 100%);
+  box-shadow: 0.5px 0.866px 2px 0px rgba(44, 91, 162, 0.28), inset 0px 1px 1px 0px rgba(168, 194, 219, 0.82);
+  display: flex;
+  padding-top: 5px;
+
+  .decoration {
+    width: 18px;
+    height: 18px;
+    padding-left: 10px;
+  }
 
   .title {
     font-size: 16px;
     color: #3F4554;
     font-weight: bold;
-    padding-left: 37px;
-    padding-top: 6px;
+    padding-left: 18px;
   }
 }