cwchen
/
ah_jjzhgd_webscreen
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

调整大屏首页

This commit is contained in:
cool 2024-04-03 14:56:13 +08:00
parent 1220d5c800
commit 7cd623e8f8
5 changed files with 81 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
pages/web/css/main.css
View File

@ -144,7 +144,7 @@ body {
#environment-analysis { #environment-analysis {
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
height: 15%; height: 16%;
background: url("../image/环境监测分析.png") no-repeat 0 0 / 100% 100%; background: url("../image/环境监测分析.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important; background-position: center center !important;
padding: 10% 3% 4% 3%; padding: 10% 3% 4% 3%;
@ -201,7 +201,7 @@ body {
#device-status { #device-status {
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
height: 32%; height: 31%;
background: url("../image/设备状态.png") no-repeat 0 0 / 100% 100%; background: url("../image/设备状态.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important; background-position: center center !important;
justify-content: space-between; justify-content: space-between;
@ -211,7 +211,7 @@ body {
#safety-analysis { #safety-analysis {
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
height: 30%; height: 31%;
background: url("../image/工程安全隐患分析.png") no-repeat 0 0 / 100% 100%; background: url("../image/工程安全隐患分析.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important; background-position: center center !important;
justify-content: space-between; justify-content: space-between;
@ -220,8 +220,8 @@ body {
#efficiency-analysis { #efficiency-analysis {
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
height: 30%; height: 31%;
background: url("../image/工人效率分析.png") no-repeat 0 0 / 100% 100%; background: url("../image/效率分析.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important; background-position: center center !important;
justify-content: space-between; justify-content: space-between;
} }
@ -229,7 +229,7 @@ body {
#resource-rate { #resource-rate {
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
height: 18%; height: 17%;
background: url("../image/资源利用及能源使用.png") no-repeat 0 0 / 100% 100%; background: url("../image/资源利用及能源使用.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important; background-position: center center !important;
display: flex; display: flex;
@ -245,7 +245,7 @@ body {
#alarm-reminder { #alarm-reminder {
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
height: 22%; height: 21%;
background: url("../image/告警提醒.png") no-repeat 0 0 / 100% 100%; background: url("../image/告警提醒.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important; background-position: center center !important;
justify-content: space-between; justify-content: space-between;
@ -268,4 +268,25 @@ body {
#device-status-chart { #device-status-chart {
height: calc(100% - 20px); height: calc(100% - 20px);
}
/*工程质量排名图标*/
.quality-ranking {
padding-left: 30px !important;
background-repeat: no-repeat;
background-size: 24px 24px; /* 根据你的图标尺寸调整 */
background-position: left center;
line-height: 1.5; /* 根据需要调整行高 */
}
.quality-ranking-1 {
background-image: url('../image/1.png'); /* 替换 'icon.png' 为你的图标文件路径 */
}
.quality-ranking-2 {
background-image: url('../image/2.png'); /* 替换 'icon.png' 为你的图标文件路径 */
}
.quality-ranking-3 {
background-image: url('../image/3.png'); /* 替换 'icon.png' 为你的图标文件路径 */
} }

1
pages/web/css/table.css
View File

@ -1,6 +1,7 @@
.custom-table { .custom-table {
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
overflow-y: auto;
} }
.custom-table> li { .custom-table> li {

BIN
pages/web/image/效率分析.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 29 KiB

51
pages/web/js/main.js
View File

@ -107,7 +107,7 @@ function initQualityRanking() {
res.data.forEach((item, index) => { res.data.forEach((item, index) => {
const {bidName, teamName, teamLeader, score} = item const {bidName, teamName, teamLeader, score} = item
var newRow = `<li> var newRow = `<li>
<div>${index + 1}</div> <div class="quality-ranking quality-ranking-${index+1}">${index + 1}</div>
<div title="${bidName}">${bidName}</div> <div title="${bidName}">${bidName}</div>
<div title="${teamName}">${teamName}</div> <div title="${teamName}">${teamName}</div>
<div title="${teamLeader}">${teamLeader}</div> <div title="${teamLeader}">${teamLeader}</div>
@ -226,6 +226,17 @@ function initDeviceStatus() {
fontSize: fontSize, fontSize: fontSize,
fontFamily: fontFamily fontFamily: fontFamily
}, },
interval: 0,
formatter: function (params) {
var val = "";
// 超过四个字隐藏
if (params.length > 8) {
val = params.substr(0, 6) + '...';
return val;
} else {
return params;
}
}
}, },
splitLine: { splitLine: {
show: false, show: false,
@ -393,8 +404,12 @@ function initMainMap(dataMap = []) {
res.push({ res.push({
proName: data[i].proName, proName: data[i].proName,
riskLeve: data[i].riskLevel, riskLeve: data[i].riskLevel,
bidName: data[i].bidName,
bidCode: data[i].bidCode,
teamName: data[i].teamName,
workManager: data[i].workManager,
riskLevel: data[i].riskLevel,
workContent: data[i].workContent, workContent: data[i].workContent,
workManage: data[i].workManage,
value: geoCoord value: geoCoord
}); });
} }
@ -429,7 +444,12 @@ function initMainMap(dataMap = []) {
color: '#fff' color: '#fff'
}, },
formatter (res) { formatter (res) {
const dom = '<div>'+ `工作内容：${res.data.workContent}` + '</div>' const dom = '<div>'+ `标段工程名称：${res.data.bidName}` + '</div>' +
'<div>'+ `标段编码：${res.data.bidCode}` + '</div>' +
'<div>'+ `班组名称：${res.data.teamName}` + '</div>' +
'<div>'+ `班组长：${res.data.workManager}` + '</div>' +
'<div>'+ `风险等级：${res.data.riskLevel}` + '</div>' +
'<div>'+ `工作内容：${res.data.workContent}` + '</div>'
return dom return dom
}, },
extraCssText: "max-width:300px;height:auto;word-break:break-all;white-space:pre-wrap;", extraCssText: "max-width:300px;height:auto;word-break:break-all;white-space:pre-wrap;",
@ -702,6 +722,17 @@ function initSafetyAnalysis() {
fontSize: fontSize, fontSize: fontSize,
fontFamily: fontFamily fontFamily: fontFamily
}, },
interval: 0,
formatter: function (params) {
var val = "";
// 超过四个字隐藏
if (params.length > 8) {
val = params.substr(0, 6) + '...';
return val;
} else {
return params;
}
}
}, },
splitLine: { splitLine: {
show: false, show: false,
@ -957,6 +988,17 @@ function initEfficiencyAnalysis() {
fontSize: fontSize, fontSize: fontSize,
fontFamily: fontFamily fontFamily: fontFamily
}, },
interval: 0,
formatter: function (params) {
var val = "";
// 超过四个字隐藏
if (params.length > 8) {
val = params.substr(0, 6) + '...';
return val;
} else {
return params;
}
}
}, },
splitLine: { splitLine: {
show: false, show: false,
@ -1137,7 +1179,8 @@ function getResourceChartOption(config) {
offsetCenter: [0, '-25%'], offsetCenter: [0, '-25%'],
valueAnimation: true, valueAnimation: true,
formatter: function (value) { formatter: function (value) {
return '{value|' + value + '}{unit|%}'; // return '{value|' + value + '}{unit|%}';
return '{value|' + value + '}';
}, },
rich: { rich: {
value: { value: {

10
pages/web/views/main.html
View File

@ -71,7 +71,7 @@
<div id="quality-ranking" style="padding: 10% 3% 3% 3%;"> <div id="quality-ranking" style="padding: 10% 3% 3% 3%;">
<ul id="quality-ranking-table" class="custom-table"> <ul id="quality-ranking-table" class="custom-table">
<li class="custom-table__title"> <li class="custom-table__title">
<div>排名</div> <div style="padding-left: 10px">排名</div>
<div>工程名称</div> <div>工程名称</div>
<div>班组名称</div> <div>班组名称</div>
<div>班组长</div> <div>班组长</div>
@ -106,15 +106,15 @@
<div id="device-status"> <div id="device-status">
<div class="device-status-text"> <div class="device-status-text">
<p> <p>
总设备：<span id="device-status__total">999</span> 总设备：<span id="device-status__total">0</span>
</p> </p>
&emsp; &emsp;
<p style="color: #34FEE5"> <p style="color: #34FEE5">
在线：<span id="device-status__online">999</span> 在线：<span id="device-status__online">0</span>
</p> </p>
&emsp; &emsp;
<p style="color: #FF8845"> <p style="color: #FF8845">
不在线：<span id="device-status__offline">999</span> 不在线：<span id="device-status__offline">0</span>
</p> </p>
</div> </div>
<div id="device-status-chart"> <div id="device-status-chart">
@ -145,7 +145,7 @@
</div> </div>
<div id="right-box"> <div id="right-box">
<div id="safety-analysis"></div> <div id="safety-analysis"></div>
<div id="efficiency-analysis" style="overflow: hidden; box-sizing: border-box"></div> <div id="efficiency-analysis" style="box-sizing: border-box"></div>
<div id="resource-rate"> <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>