监管平台bi

master
鲁洪霞 2026-01-16 17:00:21 +08:00
parent 518449613a
commit 6ac4ffc4e8
12 changed files with 111 additions and 46 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 45 KiB

View File

@ -1,6 +1,6 @@
.index_info_container {
.bottom-container_con {
width: 1120px;
width: 1350px;
height: 240px;
position: absolute;
bottom: 35px;
@ -10,7 +10,6 @@
.top_container {
display: flex;
color: #ffffff;
font-size: 12px;
margin-bottom: 10px;
.title {
@ -46,13 +45,14 @@
justify-content: space-between;
.left {
width: 670px;
width: 890px;
background: rgba(0, 41, 82, 0.68);
border-radius: 4px;
border: 1px solid rgba(44, 105, 172, 0.6);
padding: 10px;
.main {
width: 670px;
width: 870px;
height: 160px;
background-size: 100% 100%;
margin-top: 10px;
@ -66,7 +66,6 @@
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
color: #ffffff;
padding: 10px 5px;
font-size: 12px;
text-align: center;
font-weight: bold;
}
@ -76,8 +75,7 @@
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
color: #ffffff;
padding: 5px;
font-size: 12px;
margin: 0px auto;
margin: 0 auto;
text-align: center;
.fc1 {
@ -106,6 +104,7 @@
background: rgba(0, 41, 82, 0.68);
border-radius: 4px;
border: 1px solid rgba(44, 105, 172, 0.6);
padding: 10px;
.main {
display: flex;

View File

@ -0,0 +1,16 @@
import img1 from "~/assets/images/public/bigScreen/btnbg.png";
import "./index.less";
function Btn() {
return (
<div className="index_info_btn" >
<div className="item" style={{ backgroundImage: `url(${img1})` }}>秦皇岛港</div>
<div className="item" style={{ backgroundImage: `url(${img1})` }}>沧州港</div>
<div className="item" style={{ backgroundImage: `url(${img1})` }}>曹实业</div>
<div className="item" style={{ backgroundImage: `url(${img1})` }}>曹煤炭</div>
</div>
);
}
export default Btn;

View File

@ -0,0 +1,16 @@
.index_info_btn{
position: absolute;
top: 200px;
right: 450px;
.item{
width: 127px;
height: 43px;
color: #ffffff;
line-height: 43px;
text-align: center;
margin-top: 5px;
cursor: pointer;
}
}

View File

@ -9,6 +9,7 @@ import img6 from "~/assets/images/public/bigScreen/tablebg2.png";
import img3 from "~/assets/images/public/bigScreen/w_ico1.png";
import img4 from "~/assets/images/public/bigScreen/w_ico2.png";
import img2 from "~/assets/images/public/weather/1.png";
import left from "~/assets/images/public/bigScreen/leftbg.png";
import Title from "~/pages/Container/Map/components/Content/IndexInfo/Title";
import { initEcharts1 } from "./echarts";
import "./index.less";
@ -65,7 +66,8 @@ function LeftScreen() {
});
return (
<div className="left-container">
<div className="left-container" >
<div className="left-container_bg" style={{ backgroundImage: `url(${left})` }}></div>
<div className="block1">
<Title title="天气预报情况" />
<div className="main">

View File

@ -1,15 +1,29 @@
.index_info_container {
.left-container {
width: 360px;
width: 400px;
position: absolute;
left: 20px;
top: 60px;
max-height: calc(100vh - 75px);
.left-container_bg{
width: 600px;
height: 100%;
background-size: 100% 100%;
position: fixed;
top: 0;
left: 0;
z-index: -1;
}
.block1 {
background: rgba(0, 41, 82, 0.68);
border-radius: 4px;
border: 1px solid rgba(44, 105, 172, 0.6);
.main {
display: flex;
@ -55,7 +69,8 @@
grid-template-columns: 1fr 1fr 2fr;
color: #ffffff;
padding: 5px;
font-size: 12px;
background-size: 100% 100%;
}
.scroll {
@ -67,7 +82,7 @@
grid-template-columns: 1fr 1fr 2fr;
color: #ffffff;
padding: 5px;
font-size: 12px;
margin: 5px auto;
.fc1 {
@ -87,10 +102,10 @@
}
.block2 {
margin-top: 10px;
background: rgba(0, 41, 82, 0.68);
margin-top: 20px;
border-radius: 4px;
border: 1px solid rgba(44, 105, 172, 0.6);
.main {
.warning {
@ -115,7 +130,7 @@
justify-content: space-between;
.list {
width: 48%;
width: 49%;
background-size: 100% 100%;
padding: 5px;
color: #ffffff;
@ -133,7 +148,7 @@
.item {
width: 50%;
margin: 2px 0;
font-size: 12px;
.fcr {
color: #f90102;
@ -148,8 +163,9 @@
.main_con1 {
.item {
margin: 2px 0;
font-size: 12px;
line-height: 22px;
word-break: break-all;
width: 100%;
.fcr {
color: #f90102;
@ -161,7 +177,6 @@
display: flex;
justify-content: space-between;
border-bottom: 1px solid #163682;
font-size: 12px;
line-height: 30px;
.info {
@ -184,17 +199,15 @@
}
.block3 {
margin-top: 20px;
background: rgba(0, 41, 82, 0.68);
margin-top: 0;
border-radius: 4px;
border: 1px solid rgba(44, 105, 172, 0.6);
}
.block4 {
margin-top: 20px;
background: rgba(0, 41, 82, 0.68);
border-radius: 4px;
border: 1px solid rgba(44, 105, 172, 0.6);
.main {
.table {
@ -205,9 +218,9 @@
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
color: #ffffff;
padding: 5px;
font-size: 12px;
background: rgba(39, 101, 175, 0.5);
text-align: center;
background-size: 100% 100%;
}
.scroll {
@ -219,7 +232,7 @@
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
color: #ffffff;
padding: 5px;
font-size: 12px;
margin: 5px auto;
background: rgba(17, 51, 122, 0.5);
text-align: center;

View File

@ -8,6 +8,7 @@ import img4 from "~/assets/images/public/bigScreen/ico8.png";
import img7 from "~/assets/images/public/bigScreen/ico9.png";
import img5 from "~/assets/images/public/bigScreen/tablebg1.png";
import img6 from "~/assets/images/public/bigScreen/tablebg2.png";
import rightbg from "~/assets/images/public/bigScreen/leftbg.png";
import Title from "~/pages/Container/Map/components/Content/IndexInfo/Title";
import "./index.less";
@ -39,6 +40,7 @@ function RightScreen() {
return (
<div className="right-container">
<div className="right-container_bg" style={{ backgroundImage: `url(${rightbg})` }}></div>
<div className="block1">
<Title title="相关方申请审批管理" />
<div className="main">

View File

@ -1,15 +1,26 @@
.index_info_container {
.right-container_bg{
width: 600px;
height: 100%;
background-size: 100% 100%;
position: fixed;
top: 0;
right: 0;
z-index: -1;
transform: rotate(180deg);
}
.right-container {
width: 360px;
width: 400px;
position: absolute;
right: 20px;
top: 60px;
max-height: calc(100vh - 75px);
.block1 {
background: rgba(0, 41, 82, 0.68);
border-radius: 4px;
border: 1px solid rgba(44, 105, 172, 0.6);
.main {
display: flex;
@ -24,9 +35,10 @@
grid-template-columns: 1fr 1fr 1.5fr 1fr;
color: #ffffff;
padding: 5px;
font-size: 12px;
background: rgba(39, 101, 175, 0.5);
text-align: center;
background-size: 100% 100%;
}
.scroll {
@ -38,7 +50,7 @@
grid-template-columns: 1fr 1fr 1.5fr 1fr;
color: #ffffff;
padding: 5px;
font-size: 12px;
margin: 5px auto;
background: rgba(17, 51, 122, 0.5);
text-align: center;
@ -62,9 +74,9 @@
.block2 {
margin-top: 10px;
background: rgba(0, 41, 82, 0.68);
border-radius: 4px;
border: 1px solid rgba(44, 105, 172, 0.6);
.main {
display: flex;
@ -84,7 +96,7 @@
.info {
padding-left: 10px;
color: #ffffff;
font-size: 12px;
p {
margin: 0;
@ -96,9 +108,9 @@
.block3 {
margin-top: 20px;
background: rgba(0, 41, 82, 0.68);
border-radius: 4px;
border: 1px solid rgba(44, 105, 172, 0.6);
.main {
display: flex;
@ -111,7 +123,7 @@
background-size: 100% 100%;
color: #ffffff;
padding: 5px 10px;
font-size: 12px;
margin-top: 10px;
.title {
@ -129,9 +141,9 @@
.block4 {
margin-top: 20px;
background: rgba(0, 41, 82, 0.68);
border-radius: 4px;
border: 1px solid rgba(44, 105, 172, 0.6);
.main {
.table {
@ -142,9 +154,10 @@
grid-template-columns: 1fr 1fr 1fr 1fr;
color: #ffffff;
padding: 5px;
font-size: 12px;
background: rgba(39, 101, 175, 0.5);
text-align: center;
background-size: 100% 100%;
}
.scroll {
@ -156,7 +169,7 @@
grid-template-columns: 1fr 1fr 1fr 1fr;
color: #ffffff;
padding: 5px;
font-size: 12px;
margin: 5px auto;
background: rgba(17, 51, 122, 0.5);
text-align: center;

View File

@ -4,7 +4,7 @@
min-height: 200px;
position: absolute;
top: 100px;
left: 400px;
left: 480px;
background: rgba(0, 41, 82, 0.68);
border-radius: 4px;
border: 1px solid rgba(44, 105, 172, 0.6);
@ -52,7 +52,7 @@
color: #4371af;
line-height: 30px;
padding-left: 5px;
font-size: 12px;
.input {
border: none;
@ -76,7 +76,7 @@
width: 100%;
display: flex;
justify-content: space-between;
font-size: 12px;
color: #ffffff;
padding: 5px;
box-sizing: border-box;

View File

@ -2,6 +2,7 @@ import Bottom from "./Bottom";
import LeftPanel from "./LeftPanel";
import RightPanel from "./RightPanel";
import Search from "./Search";
import Btn from "./Btn";
import "./index.less";
function IndexInfo() {
@ -11,6 +12,7 @@ function IndexInfo() {
<RightPanel />
<Bottom />
<Search />
<Btn />
</div>
);
}

View File

@ -1,3 +1,5 @@
.index_info_container {
overflow: hidden;
width: 100%;
height: 100%;
}