diff --git a/src/pages/Container/Share/components/Left/index.js b/src/pages/Container/Share/components/Left/index.js
index c2f86e9..5bc8faf 100644
--- a/src/pages/Container/Share/components/Left/index.js
+++ b/src/pages/Container/Share/components/Left/index.js
@@ -8,7 +8,20 @@ import SeamlessScroll from "zy-react-library/components/SeamlessScroll";
import {useState} from "react";
+
function WhiteShareLeft() {
+ const [block1List, setBlock1List] = useState([
+ { name: "隐患总数", num: "1398" },
+ { name: "隐患整改数", num: "1212" },
+ { name: "隐患未整改数", num: "563" },
+ { name: "隐患整改率", num: "89%" },
+ ]);
+ const [block2List, setBlock2List] = useState([
+ { name: "隐患总数", num: "1398" },
+ { name: "隐患整改数", num: "1212" },
+ { name: "隐患未整改数", num: "563" },
+ { name: "隐患整改率", num: "89%" },
+ ]);
const [block3List, setBlock3List] = useState([
{ id: 1, level: "二级", name: "东区一号罐", state: "正常"},
{ id: 2, level: "二级", name: "东区一号罐", state: "正常"},
@@ -17,6 +30,13 @@ function WhiteShareLeft() {
{ id: 5, level: "二级", name: "东区一号罐", state: "正常"},
{ id: 6, level: "二级", name: "东区一号罐", state: "正常"},
+ ]);
+ const [block4List, setBlock4List] = useState([
+ { name: "一级", total: "1398" ,rectificationNumber:"56", unNumber:"56", rectificationRate:"89%" },
+ { name: "一级", total: "1398" ,rectificationNumber:"56", unNumber:"56", rectificationRate:"89%" },
+ { name: "一级", total: "1398" ,rectificationNumber:"56", unNumber:"56", rectificationRate:"89%" },
+ { name: "一级", total: "1398" ,rectificationNumber:"56", unNumber:"56", rectificationRate:"89%" },
+
]);
return (
@@ -114,16 +134,62 @@ function WhiteShareLeft() {
股份
公司
-
+ {
+ block1List.map((item, index) => (
+
+
{item.name}
+
{item.num}
+
+ ))
+ }
+
+
+
+
+
+
+
分子
公司
+
+ {
+ block2List.map((item, index) => (
+
+
{item.name}
+
{item.num}
+
+ ))
+ }
-
+
+
+
+
+
领域名称
+
隐患总数
+
整改数
+
未整改数
+
整改率
+
+
+
+ {block4List.map((item, index) => (
+
+
{item.name}
+
{item.total}
+
{item.rectificationNumber}
+
{item.unNumber}
+
{item.rectificationRate}
+
+ ))}
+
+
+
+
diff --git a/src/pages/Container/Share/components/Left/index.less b/src/pages/Container/Share/components/Left/index.less
index 609ed52..f47ad8b 100644
--- a/src/pages/Container/Share/components/Left/index.less
+++ b/src/pages/Container/Share/components/Left/index.less
@@ -165,10 +165,7 @@
padding: 5px;
border: 2px solid transparent;
border-image: linear-gradient(180deg, rgba(255,255,255,0), #ffffff) 1;
- display: flex;
- align-items: center;
border-radius: 2px;
-
.top{
width: 100%;
.item{
@@ -179,6 +176,7 @@
border-radius: 4px;
background-color: rgb(205, 233, 255);
padding: 4px;
+ margin-bottom: 5px;
.content{
width: 100%;
border-style: solid;
@@ -200,23 +198,42 @@
background-image: -webkit-linear-gradient( 90deg, rgb(227,240,255) 0%, rgb(201,231,249) 100%);
background-image: -ms-linear-gradient( 90deg, rgb(227,240,255) 0%, rgb(201,231,249) 100%);
text-align: center;
- padding: 5px 10px;
+ padding: 2px 10px;
line-height: 20px;
}
.info{
flex: 1;
+ display: flex;
.list{
text-align: center;
width: 25%;
.name{
font-size: 12px;
}
+ .num{
+ font-size: 16px;
+ }
}
}
}
-
}
-
+ }
+ .field{
+ width: 100%;
+ .top{
+ width: 100%;
+ background-color: rgb(205, 233, 255);
+ text-align: center;
+ font-size: 18px;
+ font-weight: bold;
+ border-radius: 4px;
+ border: 1px solid #b7d6f5;
+ color: #457fc0;
+ }
+ }
+ .main{
+ width: 100%;
+ .table-style(70px, 1fr 1fr 1fr 1fr 1fr);
}
}
}