wenjy
/
aucma-scada-visual-board-new
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改字体颜色

Browse Source
master
夜笙歌 2 years ago
parent f069461d2b
commit 6839862284
6 changed files with 76 additions and 106 deletions
Show Stats Download Patch File Download Diff File

51
productionboard/src/main/resources/static/js/common/echarts.common.js
Unescape Escape View File

@ -1530,8 +1530,8 @@ const multipleThreeDimensionalCylindrical = (res, ids) => {
//设备OEE统计
const OEEStatistics = (res, ids) => {
let mycharts = echarts.init(ids);
let xAxisData = res.map(val => val.yValue);
let yAxisData = res.map(val => val.xValue);
let xAxisData = res.map(val => val.xValue);
let yAxisData = res.map(val => val.yValue);
let option = {
tooltip: {},
@ -1637,7 +1637,7 @@ const OEEStatistics = (res, ids) => {
show: true,
position: "top",
textStyle: {
color: "#28ffb3",
color: "rgb(165,122,75)",
},
},
itemStyle: {
@ -2124,7 +2124,7 @@ const loss = (res, ids) => {
show: true,
position: "top",
textStyle: {
color: "#02C3F1",
color: barTopColor[0],
},
},
symbolPosition: "end",
@ -2181,7 +2181,7 @@ const equipmentFailure = (res, ids) => {
grid: {
top: '1%',
left: '6%',
right: '6%',
right: '15%',
bottom: '3%',
containLabel: true
},
@ -2256,26 +2256,33 @@ const equipmentFailure = (res, ids) => {
},
},
series: [
{
name: "柱顶部",
type: "pictorialBar",
symbolSize: [6, 13],
symbolOffset: [3, 0],
z: 12,
itemStyle: {
normal: {
color: function (params) {
return "#B78E45";
},
},
},
symbolPosition: "end",
data: values,
},
// {
// name: "柱顶部",
// type: "pictorialBar",
// symbolSize: [6, 13],
// symbolOffset: [3, 0],
// z: 12,
// itemStyle: {
// normal: {
// color: function (params) {
// return "#B78E45";
// },
// },
// },
// symbolPosition: "end",
// data: values,
// },
{
name: '2011',
type: 'bar',
data: values,
label: {
show: true,
position: "right",
textStyle: {
color: '#CCFF66',
},
},
itemStyle: {
normal: {
color: function (params) {
@ -2286,7 +2293,7 @@ const equipmentFailure = (res, ids) => {
},
{
offset: 0,
color: "#B78E45",
color: "#CCFF66",
},
]);
},

12
productionboard/src/main/resources/static/js/common/synthetic.js
Unescape Escape View File

@ -2,12 +2,12 @@
const dataInformationFunction = (statusArray) => {
let info = `<table style="position: absolute;top: 8%;width: 100%;height:100%;">
<tr style="width: 100%; height: 50%;">
<td style="border:0px solid red;text-align:center;width: 50%;"><i ${statusArray[0] == 1 ? 'style="color:green;"' : 'style="color: red;"'} class="fa-regular ${statusArray[0] == 1 ? "fa-circle-check" : "fa-circle-xmark"}"></i>${statusArray[0] == 1 ? `<span style="color:green;margin-left: 10px">运行正常</span>` : `<span style="color:red;margin-left: 10px">运行异常</span>`}</td>
<td style="border:0px solid red;text-align:center;width: 50%;color: #E6ECBE;">${statusArray[1]}</td>
<td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;"><i ${statusArray[0] == 1 ? 'style="color:rgb(107, 253, 110);"' : 'style="color: rgb(255, 105, 106);"'} class="fa-regular ${statusArray[0] == 1 ? "fa-circle-check" : "fa-circle-xmark"}"></i>${statusArray[0] == 1 ? `<span style="color:rgb(107, 253, 110);margin-left: 10px">正常</span>` : `<span style="color: rgb(255, 105, 106);margin-left: 10px">异常</span>`}</td>
<td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: #E6ECBE;">${statusArray[1]}</td>
</tr>
<tr style="width: 100%; height: 50%;">
<td style="border:0px solid red;text-align:center;width: 50%;color: white;">${statusArray[2]}kW·h</td>
<td style="border:0px solid red;text-align:center;width: 50%;color: red;">${statusArray[3]}</td>
<td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: white;">${statusArray[2]}kW·h</td>
<td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: red;">${statusArray[3]}</td>
</tr>
</table>`;
$("#dataInformation").append(info);
@ -36,8 +36,8 @@ const synthetic = (statusArray) => {
<td style="border:0px solid red;text-align:center;width: 0%;"></td>
</tr>
</table>
<span style="position: absolute;font-size:175%;top: 12%;left: 85%;width: 15%;height:10%;text-align:left;background:color: red;display:inline-block;-webkit-background-clip: text;">${statusArray[8] || 0}</span>
<span style="position: absolute;font-size:175%;top: 26.7%;left: 85%;width: 15%;height:10%;text-align:left;background:color: #63F659;display:inline-block;-webkit-background-clip: text;">${statusArray[9] || 0}</span>
<span style="position: absolute;font-size:175%;top: 12%;left: 85%;width: 15%;height:10%;text-align:left;color: red;display:inline-block;-webkit-background-clip: text;">${statusArray[8] || 0}</span>
<span style="position: absolute;font-size:175%;top: 26.7%;left: 85%;width: 15%;height:10%;text-align:left;color: #63F659;display:inline-block;-webkit-background-clip: text;">${statusArray[9] || 0}</span>
`;
$("#synthetic").append(info);
}

28
productionboard/src/main/resources/static/js/tankShell/device.js
Unescape Escape View File

@ -5,29 +5,7 @@ $(() => {
OEEStatistics(result, document.getElementById("OEEStatistics"));
});
setInterval(() => {
let result = [
{
"createTime": 1654729200000,
"yValue": "07",
"xValue": Math.random() * 3
},
{
"createTime": 1654732800000,
"yValue": "08",
"xValue": Math.random() * 3
},
{
"createTime": 1654736400000,
"yValue": "09",
"xValue": Math.random() * 3
},
{
"createTime": 1654740000000,
"yValue": "10",
"xValue": Math.random() * 3
}
]
OEEStatistics(result, document.getElementById("OEEStatistics"));
// OEEStatistics(result, document.getElementById("OEEStatistics"));
}, 1000);
//设备故障排名
@ -107,13 +85,13 @@ const dataInformationFunction = (statusArray) => {
console.log(res);
let info = `<table style="position: absolute;top: 8%;width: 100%;height:100%;">
<tr style="width: 100%; height: 50%;">
<td style="border:0px solid red;text-align:center;width: 50%;"><i ${res.deviceStatus == 1 ? 'style="color:rgb(107, 253, 110);"' : 'style="color: rgb(255, 105, 106);"'} class="fa-regular ${res.deviceStatus == 1 ? "fa-circle-check" : "fa-circle-xmark"}"></i>${res.deviceStatus == 1 ? `<span style="color:rgb(107, 253, 110);margin-left: 10px">运行正常</span>` : `<span style="color:rgb(255, 105, 106);margin-left: 10px">运行异常</span>`}</td>
<td style="border:0px solid red;text-align:center;width: 50%;"><i ${res.deviceStatus == 1 ? 'style="color:rgb(107, 253, 110);"' : 'style="color: rgb(255, 105, 106);"'} class="fa-regular ${res.deviceStatus == 1 ? "fa-circle-check" : "fa-circle-xmark"}"></i>${res.deviceStatus == 1 ? `<span style="color:rgb(107, 253, 110);margin-left: 10px">正常</span>` : `<span style="color:rgb(255, 105, 106);margin-left: 10px">异常</span>`}</td>
<td style="border:0px solid red;text-align:center;width: 50%;color: #FFEF76;"> ${res.devicePower}kW</td>
</tr>
<tr style="width: 100%; height: 50%;">
<td style="border:0px solid red;text-align:center;width: 50%;color: #CEEFFE;"> ${res.deviceEnergy}kW·h</td>
<td style="border:0px solid red;text-align:center;width: 50%;color: #red;">2</td>
<td style="border:0px solid red;text-align:center;width: 50%;color: red;">2</td>
</tr>
</table>`;

51
productionboard/target/classes/static/js/common/echarts.common.js
Unescape Escape View File

@ -1530,8 +1530,8 @@ const multipleThreeDimensionalCylindrical = (res, ids) => {
//设备OEE统计
const OEEStatistics = (res, ids) => {
let mycharts = echarts.init(ids);
let xAxisData = res.map(val => val.yValue);
let yAxisData = res.map(val => val.xValue);
let xAxisData = res.map(val => val.xValue);
let yAxisData = res.map(val => val.yValue);
let option = {
tooltip: {},
@ -1637,7 +1637,7 @@ const OEEStatistics = (res, ids) => {
show: true,
position: "top",
textStyle: {
color: "#28ffb3",
color: "rgb(165,122,75)",
},
},
itemStyle: {
@ -2124,7 +2124,7 @@ const loss = (res, ids) => {
show: true,
position: "top",
textStyle: {
color: "#02C3F1",
color: barTopColor[0],
},
},
symbolPosition: "end",
@ -2181,7 +2181,7 @@ const equipmentFailure = (res, ids) => {
grid: {
top: '1%',
left: '6%',
right: '6%',
right: '15%',
bottom: '3%',
containLabel: true
},
@ -2256,26 +2256,33 @@ const equipmentFailure = (res, ids) => {
},
},
series: [
{
name: "柱顶部",
type: "pictorialBar",
symbolSize: [6, 13],
symbolOffset: [3, 0],
z: 12,
itemStyle: {
normal: {
color: function (params) {
return "#B78E45";
},
},
},
symbolPosition: "end",
data: values,
},
// {
// name: "柱顶部",
// type: "pictorialBar",
// symbolSize: [6, 13],
// symbolOffset: [3, 0],
// z: 12,
// itemStyle: {
// normal: {
// color: function (params) {
// return "#B78E45";
// },
// },
// },
// symbolPosition: "end",
// data: values,
// },
{
name: '2011',
type: 'bar',
data: values,
label: {
show: true,
position: "right",
textStyle: {
color: '#CCFF66',
},
},
itemStyle: {
normal: {
color: function (params) {
@ -2286,7 +2293,7 @@ const equipmentFailure = (res, ids) => {
},
{
offset: 0,
color: "#B78E45",
color: "#CCFF66",
},
]);
},

12
productionboard/target/classes/static/js/common/synthetic.js
Unescape Escape View File

@ -2,12 +2,12 @@
const dataInformationFunction = (statusArray) => {
let info = `<table style="position: absolute;top: 8%;width: 100%;height:100%;">
<tr style="width: 100%; height: 50%;">
<td style="border:0px solid red;text-align:center;width: 50%;"><i ${statusArray[0] == 1 ? 'style="color:green;"' : 'style="color: red;"'} class="fa-regular ${statusArray[0] == 1 ? "fa-circle-check" : "fa-circle-xmark"}"></i>${statusArray[0] == 1 ? `<span style="color:green;margin-left: 10px">运行正常</span>` : `<span style="color:red;margin-left: 10px">运行异常</span>`}</td>
<td style="border:0px solid red;text-align:center;width: 50%;color: #E6ECBE;">${statusArray[1]}</td>
<td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;"><i ${statusArray[0] == 1 ? 'style="color:rgb(107, 253, 110);"' : 'style="color: rgb(255, 105, 106);"'} class="fa-regular ${statusArray[0] == 1 ? "fa-circle-check" : "fa-circle-xmark"}"></i>${statusArray[0] == 1 ? `<span style="color:rgb(107, 253, 110);margin-left: 10px">正常</span>` : `<span style="color: rgb(255, 105, 106);margin-left: 10px">异常</span>`}</td>
<td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: #E6ECBE;">${statusArray[1]}</td>
</tr>
<tr style="width: 100%; height: 50%;">
<td style="border:0px solid red;text-align:center;width: 50%;color: white;">${statusArray[2]}kW·h</td>
<td style="border:0px solid red;text-align:center;width: 50%;color: red;">${statusArray[3]}</td>
<td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: white;">${statusArray[2]}kW·h</td>
<td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: red;">${statusArray[3]}</td>
</tr>
</table>`;
$("#dataInformation").append(info);
@ -36,8 +36,8 @@ const synthetic = (statusArray) => {
<td style="border:0px solid red;text-align:center;width: 0%;"></td>
</tr>
</table>
<span style="position: absolute;font-size:175%;top: 12%;left: 85%;width: 15%;height:10%;text-align:left;background:color: red;display:inline-block;-webkit-background-clip: text;">${statusArray[8] || 0}</span>
<span style="position: absolute;font-size:175%;top: 26.7%;left: 85%;width: 15%;height:10%;text-align:left;background:color: #63F659;display:inline-block;-webkit-background-clip: text;">${statusArray[9] || 0}</span>
<span style="position: absolute;font-size:175%;top: 12%;left: 85%;width: 15%;height:10%;text-align:left;color: red;display:inline-block;-webkit-background-clip: text;">${statusArray[8] || 0}</span>
<span style="position: absolute;font-size:175%;top: 26.7%;left: 85%;width: 15%;height:10%;text-align:left;color: #63F659;display:inline-block;-webkit-background-clip: text;">${statusArray[9] || 0}</span>
`;
$("#synthetic").append(info);
}

28
productionboard/target/classes/static/js/tankShell/device.js
Unescape Escape View File

@ -5,29 +5,7 @@ $(() => {
OEEStatistics(result, document.getElementById("OEEStatistics"));
});
setInterval(() => {
let result = [
{
"createTime": 1654729200000,
"yValue": "07",
"xValue": Math.random() * 3
},
{
"createTime": 1654732800000,
"yValue": "08",
"xValue": Math.random() * 3
},
{
"createTime": 1654736400000,
"yValue": "09",
"xValue": Math.random() * 3
},
{
"createTime": 1654740000000,
"yValue": "10",
"xValue": Math.random() * 3
}
]
OEEStatistics(result, document.getElementById("OEEStatistics"));
// OEEStatistics(result, document.getElementById("OEEStatistics"));
}, 1000);
//设备故障排名
@ -107,13 +85,13 @@ const dataInformationFunction = (statusArray) => {
console.log(res);
let info = `<table style="position: absolute;top: 8%;width: 100%;height:100%;">
<tr style="width: 100%; height: 50%;">
<td style="border:0px solid red;text-align:center;width: 50%;"><i ${res.deviceStatus == 1 ? 'style="color:rgb(107, 253, 110);"' : 'style="color: rgb(255, 105, 106);"'} class="fa-regular ${res.deviceStatus == 1 ? "fa-circle-check" : "fa-circle-xmark"}"></i>${res.deviceStatus == 1 ? `<span style="color:rgb(107, 253, 110);margin-left: 10px">运行正常</span>` : `<span style="color:rgb(255, 105, 106);margin-left: 10px">运行异常</span>`}</td>
<td style="border:0px solid red;text-align:center;width: 50%;"><i ${res.deviceStatus == 1 ? 'style="color:rgb(107, 253, 110);"' : 'style="color: rgb(255, 105, 106);"'} class="fa-regular ${res.deviceStatus == 1 ? "fa-circle-check" : "fa-circle-xmark"}"></i>${res.deviceStatus == 1 ? `<span style="color:rgb(107, 253, 110);margin-left: 10px">正常</span>` : `<span style="color:rgb(255, 105, 106);margin-left: 10px">异常</span>`}</td>
<td style="border:0px solid red;text-align:center;width: 50%;color: #FFEF76;"> ${res.devicePower}kW</td>
</tr>
<tr style="width: 100%; height: 50%;">
<td style="border:0px solid red;text-align:center;width: 50%;color: #CEEFFE;"> ${res.deviceEnergy}kW·h</td>
<td style="border:0px solid red;text-align:center;width: 50%;color: #red;">2</td>
<td style="border:0px solid red;text-align:center;width: 50%;color: red;">2</td>
</tr>
</table>`;

Write Preview
Loading…
Cancel
Save