调试首页
This commit is contained in:
parent
3f4f22058d
commit
9bdea4597d
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="WEB_MODULE" version="4">
|
||||
<component name="NewModuleRootManager">
|
||||
<content url="file://$MODULE_DIR$">
|
||||
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/temp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/tmp" />
|
||||
</content>
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
<project version="4">
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/.idea/ah_jjzhgd_webscreen.iml" filepath="$PROJECT_DIR$/.idea/ah_jjzhgd_webscreen.iml" />
|
||||
<module fileurl="file://$PROJECT_DIR$/.idea/ah_jjzhgd_webscreen_new.iml" filepath="$PROJECT_DIR$/.idea/ah_jjzhgd_webscreen_new.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
||||
|
|
@ -19,6 +19,7 @@ body {
|
|||
#main-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
|
|
@ -137,7 +138,6 @@ body {
|
|||
height: 28%;
|
||||
background: url("../image/施工质量排名.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
display: flex;
|
||||
padding: 8% 3% 3% 3%;
|
||||
}
|
||||
|
||||
|
|
@ -178,7 +178,9 @@ body {
|
|||
|
||||
.environment-analysis-item > div:first-of-type > p {
|
||||
line-height: 25px;
|
||||
font-size: 16px;
|
||||
font-size: 14px;
|
||||
text-align: left;
|
||||
padding-left: 55%;
|
||||
}
|
||||
|
||||
#environment-analysis-1 {
|
||||
|
|
@ -247,4 +249,23 @@ body {
|
|||
background: url("../image/告警提醒.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#device-status {
|
||||
padding-top: 8%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.device-status-text {
|
||||
line-height: 20px;
|
||||
padding-left: 3%;
|
||||
}
|
||||
|
||||
.device-status-text > p {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
#device-status-chart {
|
||||
height: calc(100% - 20px);
|
||||
}
|
||||
|
|
@ -1,60 +1,57 @@
|
|||
.transparentDataTable .layui-table{
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.transparentDataTable .layui-table-view{
|
||||
background-color: rgba(0, 0, 0, 0) !important;
|
||||
border: none;
|
||||
}
|
||||
.transparentDataTable .layui-table-tool {
|
||||
background-color: transparent !important;
|
||||
.custom-table {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.transparentDataTable .layui-table-tool .layui-icon {
|
||||
color: white;
|
||||
.custom-table> li {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.transparentDataTable .layui-table-header, .transparentDataTable .layui-table-cell, .layui-table-header thead tr {
|
||||
background-color: transparent !important;
|
||||
.custom-table>li:not(.custom-table__title) {
|
||||
border-bottom: 1px solid #34E7FE;
|
||||
}
|
||||
|
||||
.transparentDataTable .layui-table-header thead th, .transparentDataTable .layui-none {
|
||||
/*border: 1px solid #FFFFFF;*/
|
||||
color: white !important;
|
||||
.custom-table>li>div {
|
||||
box-sizing: border-box;
|
||||
line-height: 40px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
padding: 0 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.transparentDataTable .layui-table tbody tr {
|
||||
border: 1px solid #FFFFFF;
|
||||
color: white;
|
||||
.custom-table>li>div:first-of-type {
|
||||
width: 10%;
|
||||
}
|
||||
|
||||
.transparentDataTable .layui-table-init, .transparentDataTable .layui-laypage-limits select, .transparentDataTable .layui-laypage-btn, .transparentDataTable .layui-laypage-skip input {
|
||||
background-color: transparent !important;
|
||||
color: white;
|
||||
.custom-table>li>div:nth-of-type(2) {
|
||||
width: 35%;
|
||||
}
|
||||
|
||||
.transparentDataTable .layui-table-page a, .transparentDataTable .layui-table-page span {
|
||||
color: white !important;
|
||||
.custom-table>li>div:nth-of-type(3) {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
|
||||
.transparentDataTable .layui-laypage-limits select, .transparentDataTable .layui-laypage-limits option {
|
||||
-webkit-appearance: none; /* google */
|
||||
-moz-appearance: none; /* firefox */
|
||||
appearance: none; /* IE */
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); /* 点击去除高亮的颜色*/
|
||||
background-color: rgba(0, 0, 0, 0.5) !important;
|
||||
color: white;
|
||||
.custom-table>li>div:nth-of-type(4) {
|
||||
width: 15%;
|
||||
}
|
||||
|
||||
.transparentDataTable .layui-table[lay-even] tr:nth-child(even){
|
||||
background-color: rgba(180, 238, 180, 0.5) !important;
|
||||
.custom-table>li>div:last-of-type {
|
||||
width: 15%;
|
||||
}
|
||||
|
||||
|
||||
/*静态表格透明*/
|
||||
.transparentStaticTable .layui-table{
|
||||
background-color: rgba(0, 0, 0, 0.5) !important;
|
||||
.custom-table>.custom-table__title {
|
||||
line-height: 32px;
|
||||
background-color: rgba(52, 231, 254, 0.1);
|
||||
color: #8BFFFF;
|
||||
}
|
||||
|
||||
.custom-table>.custom-table__title>div {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#alarm-reminder-table>li>div {
|
||||
width: 50% !important;
|
||||
}
|
||||
.transparentStaticTable .layui-table tbody tr:hover, .statistics_branch_one .layui-table tbody tr:hover {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
|
@ -15,6 +15,7 @@
|
|||
<script src="../../plugin/toolTip/mTips.js"></script>
|
||||
<script src="../../js/publics/aescbc.js"></script>
|
||||
<script src="../../js/publics/sm3.js"></script>
|
||||
<script src="../../js/publics/aescbc.js"></script>
|
||||
<title>导航页</title>
|
||||
</head>
|
||||
|
||||
|
|
|
|||
1449
pages/web/js/main.js
1449
pages/web/js/main.js
File diff suppressed because it is too large
Load Diff
|
|
@ -9,6 +9,7 @@
|
|||
<link rel="stylesheet" href="../css/main.css">
|
||||
<link rel="stylesheet" href="../css/table.css">
|
||||
<script src="../../../js/publics/jquery-3.6.0.min.js" type="text/javascript"></script>
|
||||
<script src="../js/loader.js" type="text/javascript"></script>
|
||||
<script src="../../../js/publics/public.js"></script>
|
||||
<script src="../../../plugin/scroll/jquery.nicescroll.min.js"></script>
|
||||
<script src="../../../js/publics/echarts.js"></script>
|
||||
|
|
@ -18,8 +19,11 @@
|
|||
<title>首页</title>
|
||||
|
||||
<style>
|
||||
.layui-table-body {
|
||||
background-color: transparent !important; /* 设置表格主体背景为透明 */
|
||||
.mini-size {
|
||||
font-size: 12px;
|
||||
}
|
||||
.pr-5 {
|
||||
padding-right: 5px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
|
@ -33,65 +37,88 @@
|
|||
<div class="engineering-statistic-item">
|
||||
<div>
|
||||
<div class="text-left engineering-statistic-item__left">
|
||||
<p>待建</p>
|
||||
<p>300</p>
|
||||
<p style="color: #29FCDF; font-size: 16px;">待建</p>
|
||||
<p style="color: #29FCDF; font-size: 24px;" id="engineering-statistic-item-1">0</p>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-left engineering-statistic-item__left">
|
||||
<p>在建</p>
|
||||
<p>300</p>
|
||||
<p style="color: #29FCDF; font-size: 16px;">在建</p>
|
||||
<p style="color: #29FCDF; font-size: 24px;" id="engineering-statistic-item-2">0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="engineering-statistic-item" style="font-size: 30px">100</div>
|
||||
<div class="engineering-statistic-item" style="font-size: 30px; position: relative">
|
||||
<p style="color: #29FCDF; font-size: 26px;" id="engineering-statistic-item-3">0</p>
|
||||
<p style="color: #f0f0f0; position: absolute; bottom: 20%; font-size: 16px">总数</p>
|
||||
</div>
|
||||
<div class="engineering-statistic-item">
|
||||
<div>
|
||||
<div class="text-right engineering-statistic-item__right">
|
||||
<p>投产</p>
|
||||
<p>300</p>
|
||||
<p style="color: #FF9C65; font-size: 16px;">投产</p>
|
||||
<p style="color: #FF9C65; font-size: 24px;" id="engineering-statistic-item-4">0</p>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-right engineering-statistic-item__right">
|
||||
<p>停工</p>
|
||||
<p>300</p>
|
||||
<p style="color: #FF9C65; font-size: 16px;">停工</p>
|
||||
<p style="color: #FF9C65; font-size: 24px;" id="engineering-statistic-item-5">0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="quality-ranking" class="transparentDataTable" style="padding: 10% 3% 2% 3%">
|
||||
<table id="demo" lay-filter="test"></table>
|
||||
<div id="quality-ranking" style="padding: 10% 3% 3% 3%;">
|
||||
<ul id="quality-ranking-table" class="custom-table">
|
||||
<li class="custom-table__title">
|
||||
<div>排名</div>
|
||||
<div>工程名称</div>
|
||||
<div>班组名称</div>
|
||||
<div>班组长</div>
|
||||
<div>施工质量</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div style="text-align: center; line-height: 32px;" class="quality-ranking__empty">暂无数据</div>
|
||||
</div>
|
||||
<div id="environment-analysis">
|
||||
<div id="environment-analysis-1" class="environment-analysis-item">
|
||||
<div>
|
||||
<p>正常999</p>
|
||||
<p>异常999</p>
|
||||
<p style="color: #34FEE5">正常 <span>0</span></p>
|
||||
<p style="color: #FF8845">异常 <span>0</span></p>
|
||||
</div>
|
||||
<div>空气质量</div>
|
||||
<div class="mini-size pr-5">空气质量</div>
|
||||
</div>
|
||||
<div id="environment-analysis-2" class="environment-analysis-item">
|
||||
<div>
|
||||
<p>正常999</p>
|
||||
<p>异常999</p>
|
||||
<p style="color: #34FEE5">正常 <span>0</span></p>
|
||||
<p style="color: #FF8845">异常 <span>0</span></p>
|
||||
</div>
|
||||
<div>噪声水平</div>
|
||||
<div class="mini-size pr-5">噪声水平</div>
|
||||
</div>
|
||||
<div id="environment-analysis-3" class="environment-analysis-item">
|
||||
<div>
|
||||
<p>正常999</p>
|
||||
<p>异常999</p>
|
||||
<p style="color: #34FEE5">正常 <span>0</span></p>
|
||||
<p style="color: #FF8845">异常 <span>0</span></p>
|
||||
</div>
|
||||
<div>灰尘浓度</div>
|
||||
<div class="mini-size pr-5">灰尘浓度</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="device-status">
|
||||
<div>
|
||||
<div class="device-status-text">
|
||||
<p>
|
||||
<span></span>
|
||||
总设备：<span>999</span>
|
||||
</p>
|
||||
 
|
||||
<p style="color: #34FEE5">
|
||||
在线：<span>999</span>
|
||||
</p>
|
||||
 
|
||||
<p style="color: #FF8845">
|
||||
不在线：<span>999</span>
|
||||
</p>
|
||||
</div>
|
||||
<div id="device-status-chart">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -100,38 +127,42 @@
|
|||
|
||||
</div>
|
||||
<div class="multiselect layout" id="multiselect">
|
||||
<div class="check-risk layout" isCheck='1'><img src="../image/未选择.png">
|
||||
<div class="check-risk layout" isCheck='1'><img src="../image/选择.png">
|
||||
<p checkedName="" style="color: white">全选</p>
|
||||
</div>
|
||||
<div class="check-risk layout" isCheck='1'><img src="../image/未选择.png">
|
||||
<p checkedName="2" style="color: #bf0b2c;">二级</p>
|
||||
<div class="check-risk layout" isCheck='1'><img src="../image/选择.png">
|
||||
<p checkedName="2" style="color: #F53535;">二级</p>
|
||||
</div>
|
||||
<div class="check-risk layout" isCheck='1'><img src="../image/未选择.png">
|
||||
<p checkedName="3" style="color: #DD690B;">三级</p>
|
||||
<div class="check-risk layout" isCheck='1'><img src="../image/选择.png">
|
||||
<p checkedName="3" style="color: #FD9B02;">三级</p>
|
||||
</div>
|
||||
<div class="check-risk layout" isCheck='1'><img src="../image/未选择.png">
|
||||
<p checkedName="4" style="color: #dcdc43;">四级</p>
|
||||
<div class="check-risk layout" isCheck='1'><img src="../image/选择.png">
|
||||
<p checkedName="4" style="color: #FFDE2D;">四级</p>
|
||||
</div>
|
||||
<div class="check-risk layout" isCheck='1'><img src="../image/未选择.png">
|
||||
<p checkedName="5" style="color: #28db18;">五级</p></div>
|
||||
<div class="check-risk layout" isCheck='1'><img src="../image/选择.png">
|
||||
<p checkedName="5" style="color: #17D660;">五级</p></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="right-box">
|
||||
<div id="safety-analysis"></div>
|
||||
<div id="efficiency-analysis"></div>
|
||||
<div id="efficiency-analysis" style="overflow: hidden; box-sizing: border-box"></div>
|
||||
<div id="resource-rate">
|
||||
<div class="resource-rate-item">人员利用率</div>
|
||||
<div class="resource-rate-item">设备利用率</div>
|
||||
<div class="resource-rate-item">能源利用率</div>
|
||||
<div class="resource-rate-item"></div>
|
||||
<div class="resource-rate-item"></div>
|
||||
<div class="resource-rate-item"></div>
|
||||
</div>
|
||||
<div id="alarm-reminder" class="transparentDataTable" style="padding: 10% 3% 2% 3%">
|
||||
<table id="demo2" lay-filter="test2"></table>
|
||||
<div id="alarm-reminder" style="padding: 10% 3% 2% 3%">
|
||||
<ul id="alarm-reminder-table" class="custom-table">
|
||||
<li class="custom-table__title">
|
||||
<div>工程名称</div>
|
||||
<div>告警内容</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div style="text-align: center; line-height: 32px;" class="alarm-reminder__empty">暂无数据</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<!--<script src="../../../js/pages/index/indexEcharts.js" type="text/javascript"></script>-->
|
||||
<!--<script src="../../../js/pages/index/index.js" type="text/javascript"></script>-->
|
||||
<script src="../js/main.js" type="text/javascript"></script>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue