作业环境提交
This commit is contained in:
parent
9e6261a8aa
commit
7bc1ac2033
|
|
@ -0,0 +1,7 @@
|
|||
# 默认忽略的文件
|
||||
/shelf/
|
||||
/workspace.xml
|
||||
# 基于编辑器的 HTTP 客户端请求
|
||||
/httpRequests/
|
||||
# GitHub Copilot persisted chat sessions
|
||||
/copilot/chatSessions
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="JAVA_MODULE" version="4">
|
||||
<component name="NewModuleRootManager" inherit-compiler-output="true">
|
||||
<exclude-output />
|
||||
<content url="file://$MODULE_DIR$" />
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
<component name="InspectionProjectProfileManager">
|
||||
<profile version="1.0">
|
||||
<option name="myName" value="Project Default" />
|
||||
</profile>
|
||||
</component>
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectRootManager" version="2" languageLevel="JDK_1_8" default="true" project-jdk-name="1.8" project-jdk-type="JavaSDK">
|
||||
<output url="file://$PROJECT_DIR$/out" />
|
||||
</component>
|
||||
</project>
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<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" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="" vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
|
|
@ -0,0 +1,407 @@
|
|||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
color: #fff;
|
||||
font-family: 'Alibaba PuHuiTi R', serif;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar
|
||||
{
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
}
|
||||
::-webkit-scrollbar-track-piece
|
||||
{
|
||||
background-color: #0d2225;
|
||||
-webkit-border-radius: 6px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:vertical
|
||||
{
|
||||
height: 5px;
|
||||
background-color: #0d2225;
|
||||
-webkit-border-radius: 6px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:horizontal
|
||||
{
|
||||
width: 5px;
|
||||
background-color: #0d2225;
|
||||
-webkit-border-radius: 6px;
|
||||
}
|
||||
|
||||
.layui-table td, .layui-table th, .layui-table-col-set, .layui-table-fixed-r, .layui-table-grid-down, .layui-table-header, .layui-table-mend, .layui-table-page, .layui-table-tips-main, .layui-table-tool, .layui-table-total, .layui-table-view, .layui-table[lay-skin=line], .layui-table[lay-skin=row] {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.layui-table {
|
||||
width: 100%;
|
||||
margin: 10px 0;
|
||||
background-color: transparent;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
/* 表格头部背景色 */
|
||||
th {
|
||||
background-color: #184B49; /* MediumSeaGreen */
|
||||
color: #fff;
|
||||
font-weight: bold
|
||||
}
|
||||
|
||||
/*鼠标指向表格时,奇数行背景颜色*/
|
||||
.layui-table tbody tr:hover, .layui-table-hover {
|
||||
background-color: #19b0b9;
|
||||
}
|
||||
|
||||
.layui-laypage .layui-laypage-curr .layui-laypage-em {
|
||||
background-color: #184B49;
|
||||
}
|
||||
|
||||
.layui-laypage a:hover {
|
||||
color: #184B49;
|
||||
}
|
||||
|
||||
.layui-laypage .layui-laypage-skip {
|
||||
color: #16534c;
|
||||
}
|
||||
|
||||
.layui-laypage-count{
|
||||
color:#184B49;
|
||||
}
|
||||
|
||||
.layui-laypage button, .layui-laypage input {
|
||||
background-color: transparent;
|
||||
border: #184B49 1px solid;
|
||||
color: #184B49;
|
||||
}
|
||||
|
||||
.layui-table-view select[lay-ignore] {
|
||||
background-color: transparent;
|
||||
border: #184B49 1px solid;
|
||||
color: #184B49;
|
||||
}
|
||||
|
||||
.layui-table-page .layui-laypage span {
|
||||
color: #184B49;
|
||||
}
|
||||
|
||||
.layui-table-page .layui-laypage a, .layui-table-page .layui-laypage span.layui-laypage-curr {
|
||||
color: #184B49;
|
||||
}
|
||||
|
||||
/**公共类**/
|
||||
.layout{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.layout-vertical{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.background-img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 9% 2% 2% 2%;
|
||||
box-sizing: border-box;
|
||||
background-position: center center !important;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.right-under-left .background-img:nth-child(1){
|
||||
padding: 4% 2% 2% 2%;
|
||||
}
|
||||
|
||||
.right-down .background-img:nth-child(1){
|
||||
padding: 3% 1% 1% 1%;
|
||||
}
|
||||
|
||||
.Weather-img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
background-position: center center !important;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
/**主体部分**/
|
||||
.large-frame{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
justify-content: space-evenly;
|
||||
|
||||
}
|
||||
|
||||
.left{
|
||||
width: 22%;
|
||||
height: 99%;
|
||||
}
|
||||
|
||||
.right{
|
||||
width: 75%;
|
||||
height: 99%;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
}
|
||||
.left-down{
|
||||
width: 100%;
|
||||
height: 52%;
|
||||
}
|
||||
|
||||
.right-down{
|
||||
width: 100%;
|
||||
height: 52%;
|
||||
}
|
||||
|
||||
.left-under{
|
||||
width: 100%;
|
||||
height: 46%;
|
||||
}
|
||||
|
||||
.right-under-left{
|
||||
width: 49.5%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.right-under-right{
|
||||
width: 49.5%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.Weather-layout{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.Weather-down{
|
||||
width: 100%;
|
||||
height: 55%;
|
||||
display: flex;
|
||||
/*border: #0a84ff 1px solid;*/
|
||||
}
|
||||
|
||||
.weather-down-left{
|
||||
width: 55%;
|
||||
height: 100%;
|
||||
padding: 11% 0 0 15%;
|
||||
box-sizing: border-box;
|
||||
background-position: center center !important;
|
||||
}
|
||||
|
||||
.substance{
|
||||
display: flex;
|
||||
width: 80%;
|
||||
height: 50%;
|
||||
padding-top: 8%;
|
||||
}
|
||||
|
||||
.substance1{
|
||||
width: 33%;
|
||||
height: 50%;
|
||||
box-sizing: border-box;
|
||||
background-position: center center !important;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.substance2{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-left: 7%;
|
||||
}
|
||||
|
||||
.weather-down-right{
|
||||
display: flex;
|
||||
width: 45%;
|
||||
height: 100%;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
.weather-box{
|
||||
width: 78%;
|
||||
height: 24%;
|
||||
border: #00FFF4 1px solid;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.state-box{
|
||||
width: 100%;
|
||||
height: 20%;
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.state{
|
||||
display: flex;
|
||||
width: 15%;
|
||||
height: 41%;
|
||||
margin-right: 5%;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.state-box .state:nth-child(1) {
|
||||
border: #00FFF4 1px solid;
|
||||
color: #00FFF4;
|
||||
}
|
||||
|
||||
.state-box .state:nth-child(2) {
|
||||
border: #e24e3b 1px solid;
|
||||
color: #e24e3b;
|
||||
}
|
||||
|
||||
.monitor-data {
|
||||
width: 28%;
|
||||
height: 83%;
|
||||
margin-top: 3%;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.monitor-data p:nth-child(1) span:nth-child(1) {
|
||||
font-size: 24px;
|
||||
color: #79FFFFFF;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.monitor-data p:nth-child(1) span:nth-child(2) {
|
||||
margin-left: 5px;
|
||||
color: #79FFFFFF;
|
||||
}
|
||||
|
||||
.monitor-icon {
|
||||
width: 100%;
|
||||
height: 60%;
|
||||
}
|
||||
|
||||
.monitor-data:nth-child(1) .monitor-icon {
|
||||
background: url("../../img/index/wd.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
|
||||
}
|
||||
|
||||
.monitor-data:nth-child(2) .monitor-icon {
|
||||
background: url("../../img/index/sd.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
}
|
||||
|
||||
.monitor-data:nth-child(3) .monitor-icon {
|
||||
background: url("../../img/index/zs.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
}
|
||||
|
||||
.monitor-data:nth-child(4) .monitor-icon {
|
||||
background: url("../../img/index/gz.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
}
|
||||
|
||||
.monitor-data:nth-child(5) .monitor-icon {
|
||||
background: url("../../img/index/pm2.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
}
|
||||
|
||||
.monitor-data:nth-child(6) .monitor-icon {
|
||||
background: url("../../img/index/pm10.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
}
|
||||
|
||||
.environment{
|
||||
overflow: auto;
|
||||
width: 100%;
|
||||
height: 60%;
|
||||
/*display: flex;*/
|
||||
/*flex-direction: column;*/
|
||||
/*justify-content: space-between;*/
|
||||
/*align-items: center;*/
|
||||
|
||||
}
|
||||
|
||||
.environment-equipment {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.right-down-left .environment-equipment:nth-child(1) {
|
||||
background: url("../../img/operEnvironment/边坡位移监测-异常.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
}
|
||||
|
||||
.right-down-left .environment-equipment:nth-child(2) {
|
||||
background: url("../../img/operEnvironment/边坡位移监测-正常.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
}
|
||||
|
||||
.environment .environment-equipment:nth-child(1) {
|
||||
background: url("../../img/operEnvironment/有限空间监测-正常.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
}
|
||||
|
||||
.environment .environment-equipment:nth-child(2) {
|
||||
background: url("../../img/operEnvironment/有限空间监测-正常.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
}
|
||||
|
||||
.environment .environment-equipment:nth-child(3) {
|
||||
background: url("../../img/operEnvironment/有限空间监测-正常.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
}
|
||||
|
||||
.environment .environment-equipment:nth-child(4) {
|
||||
background: url("../../img/operEnvironment/有限空间监测-正常.png") no-repeat 0 0 / 100% 100%;
|
||||
background-position: center center !important;
|
||||
background-size: initial;
|
||||
}
|
||||
|
||||
|
||||
.Weather-under{
|
||||
width: 100%;
|
||||
height: 45%;
|
||||
/*border: #591212 1px solid;*/
|
||||
}
|
||||
|
||||
.right-down-left{
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
|
||||
}
|
||||
|
||||
.right-down-right{
|
||||
width: 80%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 735 B |
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 722 B |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 344 B |
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,228 @@
|
|||
let element, layer;
|
||||
layui.use(['layer', 'element', 'table'], function () {
|
||||
element = layui.element;
|
||||
layer = layui.layer;
|
||||
var table = layui.table;
|
||||
var data = [
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 1, proName: '张三', teamName: '666', teamLeader: '男', quality: 1, content: '芜湖'},
|
||||
{id: 2, proName: '李四', teamName: '666', teamLeader: '女', quality: 1, content: '起飞'}
|
||||
];
|
||||
table.render({
|
||||
elem: '#demo',
|
||||
data: data,
|
||||
skin: 'line',
|
||||
page: true,
|
||||
cols: [[
|
||||
{field: 'id', title: '排名'},
|
||||
{field: 'proName', title: '工程名称'},
|
||||
{field: 'teamName', title: '班组名称'},
|
||||
{field: 'teamLeader', title: '班组长'},
|
||||
{field: 'quality', title: '施工质量'},
|
||||
]]
|
||||
})
|
||||
|
||||
connect2();
|
||||
|
||||
});
|
||||
|
||||
|
||||
//天气echarts图表
|
||||
function connect2(){
|
||||
var myChart = echarts.init(document.getElementById('weather_time'));
|
||||
var option = {
|
||||
grid: {
|
||||
show: true,
|
||||
backgroundColor: 'transparent',
|
||||
opacity: 0.3,
|
||||
borderWidth: '0',
|
||||
top: '150',
|
||||
bottom: '0'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
legend: {
|
||||
show: false
|
||||
},
|
||||
xAxis: [
|
||||
// 日期
|
||||
{
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
position: 'top',
|
||||
offset: 100,
|
||||
zlevel: 100,
|
||||
axisLine: {
|
||||
show: false
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 0,
|
||||
formatter: [
|
||||
'{a|{value}}'
|
||||
].join('\n'),
|
||||
rich: {
|
||||
a: {
|
||||
color: 'white',
|
||||
fontSize: 11
|
||||
}
|
||||
}
|
||||
},
|
||||
nameTextStyle: {
|
||||
|
||||
},
|
||||
data: ["25日","26日","27日","28日","29日","30日","31日"]
|
||||
},
|
||||
// 天气图标
|
||||
{
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
position: 'top',
|
||||
offset: 20,
|
||||
zlevel: 100,
|
||||
axisLine: {
|
||||
show: false
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 0,
|
||||
formatter: function(value, index) {
|
||||
return '{' + index + '| }\n{b|' + value + '}'
|
||||
},
|
||||
rich: {
|
||||
0: {
|
||||
backgroundColor: {
|
||||
// image: require('@/assets/weather_icon/' + this.weatherIconDic[this.weatherdata.weather[0]] + '.png')
|
||||
image: '../../img/operEnvironment/多云.png'
|
||||
},
|
||||
height: 30,
|
||||
width: 30
|
||||
},
|
||||
1: {
|
||||
backgroundColor: {
|
||||
// image: require('@/assets/weather_icon/' + this.weatherIconDic[this.weatherdata.weather[1]] + '.png')
|
||||
image: '../../img/operEnvironment/多云.png'
|
||||
},
|
||||
height: 30,
|
||||
width: 30
|
||||
},
|
||||
2: {
|
||||
backgroundColor: {
|
||||
// image: require('@/assets/weather_icon/' + this.weatherIconDic[this.weatherdata.weather[2]] + '.png')
|
||||
image: '../../img/operEnvironment/多云.png'
|
||||
},
|
||||
height: 30,
|
||||
width: 30
|
||||
},
|
||||
3: {
|
||||
backgroundColor: {
|
||||
// image: require('@/assets/weather_icon/' + this.weatherIconDic[this.weatherdata.weather[3]] + '.png')
|
||||
image: '../../img/operEnvironment/多云.png'
|
||||
},
|
||||
height: 30,
|
||||
width: 30
|
||||
},
|
||||
4: {
|
||||
backgroundColor: {
|
||||
// image: require('@/assets/weather_icon/' + this.weatherIconDic[this.weatherdata.weather[4]] + '.png')
|
||||
image: '../../img/operEnvironment/多云.png'
|
||||
},
|
||||
height: 30,
|
||||
width: 30
|
||||
},
|
||||
5: {
|
||||
backgroundColor: {
|
||||
// image: require('@/assets/weather_icon/' + this.weatherIconDic[this.weatherdata.weather[5]] + '.png')
|
||||
image: '../../img/operEnvironment/多云.png'
|
||||
},
|
||||
height: 30,
|
||||
width: 30
|
||||
},
|
||||
6: {
|
||||
backgroundColor: {
|
||||
// image: require('@/assets/weather_icon/' + this.weatherIconDic[this.weatherdata.weather[6]] + '.png')
|
||||
image: '../../img/operEnvironment/多云.png'
|
||||
},
|
||||
height: 30,
|
||||
width: 30
|
||||
},
|
||||
b: {
|
||||
color: 'white',
|
||||
fontSize: 12,
|
||||
lineHeight: 30,
|
||||
height: 20
|
||||
}
|
||||
}
|
||||
},
|
||||
nameTextStyle: {
|
||||
fontWeight: 'bold',
|
||||
fontSize: 19
|
||||
},
|
||||
// data: this.weatherdata.weather
|
||||
data: ["小雨","小雨","阴","小雨","多云","小雨","小雨"]
|
||||
}
|
||||
],
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
show: false,
|
||||
axisLabel: {
|
||||
formatter: '{value} °C',
|
||||
color: 'white'
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '最高气温',
|
||||
type: 'line',
|
||||
data: ["16.3","16.2","17.6","14.2","17.6","15.7","14.3"],
|
||||
symbol: 'emptyCircle',
|
||||
symbolSize: 10,
|
||||
showSymbol: true,
|
||||
smooth: true,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#C95843'
|
||||
}
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
color: 'white',
|
||||
formatter: '{c} °C'
|
||||
},
|
||||
lineStyle: {
|
||||
width: 1,
|
||||
// shadowOffsetY: -10,
|
||||
// color: 'white'
|
||||
},
|
||||
areaStyle: {
|
||||
opacity: 1,
|
||||
// shadowOffsetY: -10,
|
||||
color: 'transparent'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
myChart.setOption(option);
|
||||
}
|
||||
|
|
@ -3,9 +3,172 @@
|
|||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="../../css/font.css">
|
||||
<link rel="stylesheet" href="../../plugin/layui-v2.9.7/layui/css/layui.css">
|
||||
<link rel="stylesheet" href="../../css/operEnvironment/operEnvironment.css">
|
||||
<script src="../../js/publics/jquery-3.6.0.min.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>
|
||||
<script src="../../plugin/layui-v2.9.7/layui/layui.js"></script>
|
||||
<script src="../../js/operEnvironment/operEnvironment.js"></script>
|
||||
<title>作业环境</title>
|
||||
</head>
|
||||
<body>
|
||||
作业环境
|
||||
<div class="large-frame layout">
|
||||
<div class="left layout-vertical">
|
||||
<div class="left-down">
|
||||
<div class="background-img" style="background-image: url('../../img/operEnvironment/天气预报.png');">
|
||||
<div class="Weather-layout">
|
||||
<div class="Weather-down">
|
||||
<div class="weather-down-left">
|
||||
<div style="font-size: 18px;">合肥</div>
|
||||
<div class="substance">
|
||||
<div class="substance1" style="background-image: url('../../img/operEnvironment/晴.png');"></div>
|
||||
<div class="substance2">
|
||||
<div style="font-size: 28px;">15° <span style="font-size: 15px;">晴</span></div>
|
||||
<div style="font-size: 10px;">合肥市 蜀山区</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="weather-down-right">
|
||||
<div class="weather-box"></div>
|
||||
<div class="weather-box"></div>
|
||||
<div class="weather-box"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="weather_time" class="Weather-under"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="left-under">
|
||||
<div class="background-img" style="background-image: url('../../img/operEnvironment/实时监测.png');">
|
||||
<div style="display: flex;width: 100%;height: 100%;flex-direction: column;">
|
||||
<div class="state-box">
|
||||
<div class="state">正常</div>
|
||||
<div class="state">异常</div>
|
||||
</div>
|
||||
<div class="layout" style="width: 100%;height: 40%;">
|
||||
<div class="layout monitor-data">
|
||||
<p><span>45</span><span>℃</span></p>
|
||||
<p>温度</p>
|
||||
<div class="monitor-icon"></div>
|
||||
</div>
|
||||
<div class="layout monitor-data">
|
||||
<p><span>45</span><span>%</span></p>
|
||||
<p>湿度</p>
|
||||
<div class="monitor-icon"></div>
|
||||
</div>
|
||||
<div class="layout monitor-data">
|
||||
<p><span>45</span><span>分贝</span></p>
|
||||
<p>噪声</p>
|
||||
<div class="monitor-icon"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout" style="width: 100%;height: 40%;">
|
||||
<div class="layout monitor-data">
|
||||
<p><span>45</span><span>kwh</span></p>
|
||||
<p>光照</p>
|
||||
<div class="monitor-icon"></div>
|
||||
</div>
|
||||
<div class="layout monitor-data">
|
||||
<p><span>45</span><span>μg/m³</span></p>
|
||||
<p>PM2.5</p>
|
||||
<div class="monitor-icon"></div>
|
||||
</div>
|
||||
<div class="layout monitor-data">
|
||||
<p><span>45</span><span>μg/m³</span></p>
|
||||
<p>PM10</p>
|
||||
<div class="monitor-icon"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right layout-vertical">
|
||||
<div class="right-down">
|
||||
<div class="background-img" style="background-image: url('../../img/operEnvironment/边坡位移监测.png');">
|
||||
<div class="layout" style="width: 100%;height: 100%;">
|
||||
<div class="right-down-left">
|
||||
<div style="display: flex;width: 100%;height: 25%;">
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
</div>
|
||||
<div style="display: flex;width: 100%;height: 25%;">
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
</div>
|
||||
<div style="display: flex;width: 100%;height: 25%;">
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
</div>
|
||||
<div style="display: flex;width: 100%;height: 25%;">
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
</div>
|
||||
<div style="display: flex;width: 100%;height: 25%;">
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-down-right">
|
||||
<table id="demo" lay-filter="test"></table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="left-under layout">
|
||||
<div class="right-under-left">
|
||||
<div class="background-img" style="background-image: url('../../img/operEnvironment/有限空间监测.png');">
|
||||
<div class="layout-vertical" style="width: 100%;height: 100%;">
|
||||
<div class="layout" style="width: 100%;height: 40%">
|
||||
<div class="layout monitor-data">
|
||||
<p><span>45</span><span>℃</span></p>
|
||||
<p>温度</p>
|
||||
<div class="monitor-icon"></div>
|
||||
</div>
|
||||
<div class="layout monitor-data">
|
||||
<p><span>45</span><span>%</span></p>
|
||||
<p>湿度</p>
|
||||
<div class="monitor-icon"></div>
|
||||
</div>
|
||||
<div class="layout monitor-data">
|
||||
<p><span>45</span><span>分贝</span></p>
|
||||
<p>噪声</p>
|
||||
<div class="monitor-icon"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="environment">
|
||||
<div style="width: 100%;height: 50%;display: flex">
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
</div>
|
||||
<div style="width: 100%;height: 50%;display: flex">
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
</div>
|
||||
<div style="width: 100%;height: 50%;display: flex">
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
<div class="environment-equipment"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-under-right">
|
||||
<div class="background-img" style="background-image: url('../../img/operEnvironment/GPS安装监测.png');">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue