diff --git a/src/pages/Container/Share/components/Left/index.js b/src/pages/Container/Share/components/LeftPanel/index.js
similarity index 99%
rename from src/pages/Container/Share/components/Left/index.js
rename to src/pages/Container/Share/components/LeftPanel/index.js
index 5bc8faf..df5bbd3 100644
--- a/src/pages/Container/Share/components/Left/index.js
+++ b/src/pages/Container/Share/components/LeftPanel/index.js
@@ -185,6 +185,7 @@ function WhiteShareLeft() {
{item.unNumber}
{item.rectificationRate}
+
))}
diff --git a/src/pages/Container/Share/components/Left/index.less b/src/pages/Container/Share/components/LeftPanel/index.less
similarity index 99%
rename from src/pages/Container/Share/components/Left/index.less
rename to src/pages/Container/Share/components/LeftPanel/index.less
index f47ad8b..59a82c1 100644
--- a/src/pages/Container/Share/components/Left/index.less
+++ b/src/pages/Container/Share/components/LeftPanel/index.less
@@ -2,6 +2,7 @@
width: 500px;
color: #305683;
+
.block1{
width: 100%;
@@ -67,7 +68,7 @@
border: 2px solid transparent;
border-image: linear-gradient(180deg, rgba(255,255,255,0), #ffffff) 1;
border-radius: 2px;
- padding: 5px;
+
.top{
width: 100%;
display: flex;
diff --git a/src/pages/Container/Share/components/MiddlePanel/index.js b/src/pages/Container/Share/components/MiddlePanel/index.js
new file mode 100644
index 0000000..75281e8
--- /dev/null
+++ b/src/pages/Container/Share/components/MiddlePanel/index.js
@@ -0,0 +1,76 @@
+
+import "./index.less";
+import Title from "~/pages/Container/WhiteBranchOffice/components/Title";
+import cake from "~/assets/images/public/white/img7.png";
+import {useState} from "react";
+import SeamlessScroll from "zy-react-library/components/SeamlessScroll";
+function WhiteShareMiddle() {
+ const [block1List, setBlock1List] = useState([
+ { name: "综合应急预案", num: "13" },
+ { name: "现场处置方案", num: "75" },
+ { name: "应急应对措施", num: "58" },
+ { name: "应急救援队伍", num: "3" },
+ ]);
+ const [block2List, setBlock2List] = useState([
+ { unitName: "二公司", name: "王岩" ,duties:"公司经理", phone:"3095311" },
+ { unitName: "二公司", name: "王岩" ,duties:"公司经理", phone:"3095311" },
+ { unitName: "二公司", name: "王岩" ,duties:"公司经理", phone:"3095311" },
+ { unitName: "二公司", name: "王岩" ,duties:"公司经理", phone:"3095311" },
+ { unitName: "二公司", name: "王岩" ,duties:"公司经理", phone:"3095311" },
+ { unitName: "二公司", name: "王岩" ,duties:"公司经理", phone:"3095311" },
+ { unitName: "二公司", name: "王岩" ,duties:"公司经理", phone:"3095311" },
+
+ ]);
+
+ return (
+
+
+
+
+
+
+ {
+ block1List.map((item, index) => (
+
+
{item.name}
+
{item.num}
+
+ ))
+ }
+
+
+
+
+
+
+ {block2List.map((item, index) => (
+
+
{item.unitName}
+
{item.name}
+
{item.duties}
+
{item.phone}
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
+
+export default WhiteShareMiddle;
diff --git a/src/pages/Container/Share/components/MiddlePanel/index.less b/src/pages/Container/Share/components/MiddlePanel/index.less
new file mode 100644
index 0000000..c502a00
--- /dev/null
+++ b/src/pages/Container/Share/components/MiddlePanel/index.less
@@ -0,0 +1,111 @@
+.white_share_middle{
+ width: 840px;
+ .block1{
+ width: 840px;
+ .block1_content{
+ width: 100%;
+ background-image: -moz-linear-gradient( 90deg, rgb(218,233,250) 39%, rgb(226,239,255) 100%);
+ background-image: -webkit-linear-gradient( 90deg, rgb(218,233,250) 39%, rgb(226,239,255) 100%);
+ background-image: -ms-linear-gradient( 90deg, rgb(218,233,250) 39%, rgb(226,239,255) 100%);
+ border: 2px solid transparent;
+ border-image: linear-gradient(180deg, rgba(255,255,255,0), #ffffff) 1;
+ border-radius: 2px;
+ display: flex;
+ .emergency_left{
+ width: 480px;
+ .top{
+ width: 100%;
+ display: flex;
+ justify-content: space-between;
+ padding: 5px;
+ box-sizing: border-box;
+
+ .item{
+ border-width: 1px;
+ border-color: rgb(255, 255, 255);
+ border-style: solid;
+ background-color: rgba(197, 224, 246, 0.8);
+ box-shadow: inset 1px 1.732px 1px 0 rgba(124, 163, 189, 0.3);
+ padding: 5px 12px;
+ text-align: center;
+ color: #3d5882;
+ border-radius: 4px;
+ p{
+ padding: 0;
+ margin: 0;
+ }
+ .num{
+ font-size: 20px;
+ color: #4387d6;
+ }
+ }
+ }
+ .emergency_left_main{
+ width: 470px;
+ margin: 0 5px 5px;
+ border-style: solid;
+ border-width: 1px;
+ border-color: #b5d7f7;
+ border-radius: 4px;
+ background-color: rgb(205, 233, 255);
+ padding: 5px;
+ box-sizing: border-box;
+
+
+
+ .table-style(109px, 1fr 1fr 1fr 1fr);
+ }
+ }
+ }
+ }
+}
+
+
+
+.table-style(@height, @grid-template-columns) {
+ .table {
+ border: 1px solid #fff;
+
+ .scroll {
+ height: @height;
+ overflow-y: hidden;
+
+ .tr {
+ &:nth-child(odd) {
+ background-color: transparent;
+ }
+ }
+ }
+
+ .tr {
+ display: grid;
+ grid-template-columns: @grid-template-columns;
+ background-color: #C4E2F8;
+
+ &:not(:last-child) {
+ border-bottom: 1px solid #fff;
+ }
+
+ .td, .th {
+ text-align: center;
+ font-size: 14px;
+ color: #3B445C;
+ border-right: 1px solid #fff;
+ height: 28px;
+ line-height: 28px;
+
+ &:last-child {
+ border-right: none;
+ }
+ }
+
+ .th {
+ font-weight: bold;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-wrap: wrap;
+ }
+ }
+ }
+}
diff --git a/src/pages/Container/Share/index.js b/src/pages/Container/Share/index.js
index dcb23a2..4221f72 100644
--- a/src/pages/Container/Share/index.js
+++ b/src/pages/Container/Share/index.js
@@ -2,7 +2,8 @@
import bg from "~/assets/images/public/white/bg.png";
import "./index.less";
import Header from "~/pages/Container/Share/components/Header";
-import Left from "~/pages/Container/Share/components/Left";
+import Left from "pages/Container/Share/components/LeftPanel";
+import Middle from "pages/Container/Share/components/MiddlePanel";
function WhiteShareOffice() {
return (
@@ -11,6 +12,10 @@ function WhiteShareOffice() {
diff --git a/src/pages/Container/Share/index.less b/src/pages/Container/Share/index.less
index ae29635..a575903 100644
--- a/src/pages/Container/Share/index.less
+++ b/src/pages/Container/Share/index.less
@@ -8,7 +8,11 @@
display: flex;
.left{
width: 500px;
- margin-left: 20px;
+ margin-left: 10px;
+ }
+ .middle{
+ width: 840px;
+ margin-left: 10px;
}
}
}