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 {
box-sizing: border-box;
width: 100%;
height: 15%;
height: 16%;
background: url("../image/环境监测分析.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important;
padding: 10% 3% 4% 3%;
@ -201,7 +201,7 @@ body {
#device-status {
box-sizing: border-box;
width: 100%;
height: 32%;
height: 31%;
background: url("../image/设备状态.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important;
justify-content: space-between;
@ -211,7 +211,7 @@ body {
#safety-analysis {
box-sizing: border-box;
width: 100%;
height: 30%;
height: 31%;
background: url("../image/工程安全隐患分析.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important;
justify-content: space-between;
@ -220,8 +220,8 @@ body {
#efficiency-analysis {
box-sizing: border-box;
width: 100%;
height: 30%;
background: url("../image/工人效率分析.png") no-repeat 0 0 / 100% 100%;
height: 31%;
background: url("../image/效率分析.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important;
justify-content: space-between;
}
@ -229,7 +229,7 @@ body {
#resource-rate {
box-sizing: border-box;
width: 100%;
height: 18%;
height: 17%;
background: url("../image/资源利用及能源使用.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important;
display: flex;
@ -245,7 +245,7 @@ body {
#alarm-reminder {
box-sizing: border-box;
width: 100%;
height: 22%;
height: 21%;
background: url("../image/告警提醒.png") no-repeat 0 0 / 100% 100%;
background-position: center center !important;
justify-content: space-between;
@ -268,4 +268,25 @@ body {
#device-status-chart {
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 {
width: 100%;
box-sizing: border-box;
overflow-y: auto;
}
.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) => {
const {bidName, teamName, teamLeader, score} = item
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="${teamName}">${teamName}</div>
<div title="${teamLeader}">${teamLeader}</div>
@ -226,6 +226,17 @@ function initDeviceStatus() {
fontSize: fontSize,
fontFamily: fontFamily
},
interval: 0,
formatter: function (params) {
var val = "";
// 超过四个字隐藏
if (params.length > 8) {
val = params.substr(0, 6) + '...';
return val;
} else {
return params;
}
}
},
splitLine: {
show: false,
@ -393,8 +404,12 @@ function initMainMap(dataMap = []) {
res.push({
proName: data[i].proName,
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,
workManage: data[i].workManage,
value: geoCoord
});
}
@ -429,7 +444,12 @@ function initMainMap(dataMap = []) {
color: '#fff'
},
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
},
extraCssText: "max-width:300px;height:auto;word-break:break-all;white-space:pre-wrap;",
@ -702,6 +722,17 @@ function initSafetyAnalysis() {
fontSize: fontSize,
fontFamily: fontFamily
},
interval: 0,
formatter: function (params) {
var val = "";
// 超过四个字隐藏
if (params.length > 8) {
val = params.substr(0, 6) + '...';
return val;
} else {
return params;
}
}
},
splitLine: {
show: false,
@ -957,6 +988,17 @@ function initEfficiencyAnalysis() {
fontSize: fontSize,
fontFamily: fontFamily
},
interval: 0,
formatter: function (params) {
var val = "";
// 超过四个字隐藏
if (params.length > 8) {
val = params.substr(0, 6) + '...';
return val;
} else {
return params;
}
}
},
splitLine: {
show: false,
@ -1137,7 +1179,8 @@ function getResourceChartOption(config) {
offsetCenter: [0, '-25%'],
valueAnimation: true,
formatter: function (value) {
return '{value|' + value + '}{unit|%}';
// return '{value|' + value + '}{unit|%}';
return '{value|' + value + '}';
},
rich: {
value: {

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

@ -71,7 +71,7 @@
<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 style="padding-left: 10px">排名</div>
<div>工程名称</div>
<div>班组名称</div>
<div>班组长</div>
@ -106,15 +106,15 @@
<div id="device-status">
<div class="device-status-text">
<p>
总设备：<span id="device-status__total">999</span>
总设备：<span id="device-status__total">0</span>
</p>
&emsp;
<p style="color: #34FEE5">
在线：<span id="device-status__online">999</span>
在线：<span id="device-status__online">0</span>
</p>
&emsp;
<p style="color: #FF8845">
不在线：<span id="device-status__offline">999</span>
不在线：<span id="device-status__offline">0</span>
</p>
</div>
<div id="device-status-chart">
@ -145,7 +145,7 @@
</div>
<div id="right-box">
<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 class="resource-rate-item"></div>
<div class="resource-rate-item"></div>