Commit 40bf9150 authored by lei's avatar lei

add:银洞大屏

parent 6811d952
......@@ -46,7 +46,15 @@ export function getDeviceStatus(query) {
// 查询近7日报警信息
export function getRecentSevDaysAlarms(query) {
return request({
url: "/business/screen/env/recentSevDaysAlarms",
url: "/business/screen/env/videoMonitoringList",
method: "get",
params: query,
});
}
// 查询设备状态分析
export function getDeviceStatusNum(query) {
return request({
url: "/business/screen/env/deviceStatusNum",
method: "get",
params: query,
});
......
......@@ -9,19 +9,22 @@ export function kongyajiQuery(query) {
data: query
})
}
//空压机数据
//风扇数据
export function fenshanQuery(query) {
return request({
url: '/business/screen/fan/dianjiQuery',
url: '/business/screen/fan/fengjiQuery',
method: 'get',
data: query
})
}
export function peakEditDra(query) {
// 编辑风扇状态
export function editFengjiStatus(data) {
return request({
url: '/business/peak/add',
url: '/business/screen/dev/addDeviceStatus',
method: 'post',
data: query
data
})
}
src/assets/images/screen/tsj/bg3.png

304 Bytes | W: | H:

src/assets/images/screen/tsj/bg3.png

6.16 KB | W: | H:

src/assets/images/screen/tsj/bg3.png
src/assets/images/screen/tsj/bg3.png
src/assets/images/screen/tsj/bg3.png
src/assets/images/screen/tsj/bg3.png
  • 2-up
  • Swipe
  • Onion skin
<template>
<div>
<home
v-if="showMenu === 0"
style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
></home>
<v-scale-screen
ref="scale-screen"
width="1920"
height="1080"
:fullScreen="true"
>
<home
v-if="showMenu === 0"
style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
></home>
<psxt
v-if="showMenu === 3"
style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
......@@ -36,10 +35,10 @@
v-if="showMenu === 2"
style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
></hjjc>
<div class="container">
<div class="container" style="pointer-events: none">
<!-- 头部 -->
<div class="header por"></div>
<div class="sub-header">
<div class="header por" style="pointer-events: auto"></div>
<div class="sub-header" style="pointer-events: auto">
<div class="sub-header-left">
<div
class="sub-item"
......@@ -204,7 +203,6 @@ export default {
// background-color: #08152a;
position: relative;
font-family: "fangsong";
pointer-events: none;
color: #fff;
}
/* 头部标题 */
......@@ -217,6 +215,7 @@ export default {
margin: 0 auto;
}
.sub-header {
pointer-events: auto; // 新增这行
display: flex;
justify-content: space-between;
padding: 0 30px;
......@@ -279,6 +278,7 @@ export default {
align-items: center;
font-size: 16px;
color: #11e0ff;
pointer-events: auto; // 新增这行
span {
cursor: pointer;
text-indent: 1em;
......@@ -330,6 +330,7 @@ export default {
}
}
::v-deep .screen-box {
pointer-events: none;
pointer-events: auto !important; // 修改这行
transform-style: preserve-3d; // 新增这行
}
</style>
......@@ -131,16 +131,14 @@ export default {
statusNames: [
{
name: "35变电所",
dglist: [
{
status: "遥控指示",
dgname: "35KV进线柜",
type: "dg",
dataList: [
{
name: "COS",
value: "0.00",
units: "",
},
{
name: "Ep",
......@@ -343,7 +341,7 @@ export default {
},
{
status: "",
dgname: "3AH金磨",
dgname: "3AH金磨1",
type: "db",
dataList: [
{
......@@ -370,7 +368,7 @@ export default {
},
{
status: "",
dgname: "4AH金磨",
dgname: "4AH金磨2",
type: "db",
dataList: [
{
......@@ -700,32 +698,7 @@ export default {
status: "",
dgname: "2AHPT计量",
type: "db",
dataList: [
{
name: "la",
value: "64.22A",
},
{
name: "lc",
value: "63.53A",
},
{
name: "p",
value: "1107.20KW",
},
{
name: "Q",
value: "288.00KVAR",
},
{
name: "COS",
value: "0.972",
},
{
name: "EP",
value: "53879640KWh",
},
],
dataList: [],
},
{
status: "",
......@@ -1083,37 +1056,866 @@ export default {
init() {
this.getdata();
},
getdata() {
updateSelectEleHistoryData({ name: this.statusNames[0].name }).then(
(res) => {
console.log(res);
}
);
this.dgList = this.statusNames[0].dglist;
this.dbList = this.statusNames[0].dblist;
},
changeBtn(index) {
this.showBtn = index;
this.dgList = this.statusNames[index - 1].dglist.map((el) => {
const matchedColor = this.colors.find(
(item) => item.status === el.status
);
return {
...el,
color: matchedColor ? matchedColor.color : "#fff", // 提供默认颜色
icon: matchedColor ? matchedColor.icon : "",
// getdata() {
// updateSelectEleHistoryData({ name: this.statusNames[0].name }).then(
// (res) => {
// // let obj = {
// // msg: "操作成功",
// // code: 200,
// // data: [
// // {
// // id: 4,
// // substationName: "35变电所",
// // eleboxName: "1AH站用",
// // eleboxParameter: "A相电流",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:36",
// // },
// // {
// // id: 6,
// // substationName: "35变电所",
// // eleboxName: "1AH站用",
// // eleboxParameter: "C相电流",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:36",
// // },
// // {
// // id: 7,
// // substationName: "35变电所",
// // eleboxName: "1AH站用",
// // eleboxParameter: "有功功率",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:36",
// // },
// // {
// // id: 8,
// // substationName: "35变电所",
// // eleboxName: "1AH站用",
// // eleboxParameter: "无功功率",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:36",
// // },
// // {
// // id: 9,
// // substationName: "35变电所",
// // eleboxName: "1AH站用",
// // eleboxParameter: "功率因数",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: null,
// // time: "2025-06-29 14:47:36",
// // },
// // {
// // id: 15,
// // substationName: "35变电所",
// // eleboxName: "2AH金西",
// // eleboxParameter: "A相电流",
// // parameterData: "19.4",
// // parameterFalseData: "19.4",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:37",
// // },
// // {
// // id: 17,
// // substationName: "35变电所",
// // eleboxName: "2AH金西",
// // eleboxParameter: "C相电流",
// // parameterData: "19.24",
// // parameterFalseData: "19.24",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:37",
// // },
// // {
// // id: 18,
// // substationName: "35变电所",
// // eleboxName: "2AH金西",
// // eleboxParameter: "有功功率",
// // parameterData: "258.4",
// // parameterFalseData: "258.4",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:37",
// // },
// // {
// // id: 19,
// // substationName: "35变电所",
// // eleboxName: "2AH金西",
// // eleboxParameter: "无功功率",
// // parameterData: "242.4",
// // parameterFalseData: "242.4",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:37",
// // },
// // {
// // id: 20,
// // substationName: "35变电所",
// // eleboxName: "2AH金西",
// // eleboxParameter: "功率因数",
// // parameterData: "0.735",
// // parameterFalseData: "0.735",
// // dataUnits: null,
// // time: "2025-06-29 14:47:38",
// // },
// // {
// // id: 26,
// // substationName: "35变电所",
// // eleboxName: "3AH金磨1",
// // eleboxParameter: "A相电流",
// // parameterData: "42.75",
// // parameterFalseData: "42.75",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:38",
// // },
// // {
// // id: 28,
// // substationName: "35变电所",
// // eleboxName: "3AH金磨1",
// // eleboxParameter: "C相电流",
// // parameterData: "42.57",
// // parameterFalseData: "42.57",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:39",
// // },
// // {
// // id: 29,
// // substationName: "35变电所",
// // eleboxName: "3AH金磨1",
// // eleboxParameter: "有功功率",
// // parameterData: "639.3",
// // parameterFalseData: "639.3",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:39",
// // },
// // {
// // id: 30,
// // substationName: "35变电所",
// // eleboxName: "3AH金磨1",
// // eleboxParameter: "无功功率",
// // parameterData: "462.6",
// // parameterFalseData: "462.6",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:39",
// // },
// // {
// // id: 31,
// // substationName: "35变电所",
// // eleboxName: "3AH金磨1",
// // eleboxParameter: "功率因数",
// // parameterData: "0.81",
// // parameterFalseData: "0.81",
// // dataUnits: null,
// // time: "2025-06-29 14:47:39",
// // },
// // {
// // id: 37,
// // substationName: "35变电所",
// // eleboxName: "4AH金磨2",
// // eleboxParameter: "A相电流",
// // parameterData: "40.56",
// // parameterFalseData: "40.56",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:40",
// // },
// // {
// // id: 39,
// // substationName: "35变电所",
// // eleboxName: "4AH金磨2",
// // eleboxParameter: "C相电流",
// // parameterData: "40.08",
// // parameterFalseData: "40.08",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:40",
// // },
// // {
// // id: 40,
// // substationName: "35变电所",
// // eleboxName: "4AH金磨2",
// // eleboxParameter: "有功功率",
// // parameterData: "335.4",
// // parameterFalseData: "335.4",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:40",
// // },
// // {
// // id: 41,
// // substationName: "35变电所",
// // eleboxName: "4AH金磨2",
// // eleboxParameter: "无功功率",
// // parameterData: "354.9",
// // parameterFalseData: "354.9",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:40",
// // },
// // {
// // id: 42,
// // substationName: "35变电所",
// // eleboxName: "4AH金磨2",
// // eleboxParameter: "功率因数",
// // parameterData: "0.687",
// // parameterFalseData: "0.687",
// // dataUnits: null,
// // time: "2025-06-29 14:47:40",
// // },
// // {
// // id: 45,
// // substationName: "35变电所",
// // eleboxName: "5AHPT计量",
// // eleboxParameter: "A相电压",
// // parameterData: "6",
// // parameterFalseData: "6",
// // dataUnits: "V",
// // time: "2025-06-29 14:47:41",
// // },
// // {
// // id: 46,
// // substationName: "35变电所",
// // eleboxName: "5AHPT计量",
// // eleboxParameter: "B相电压",
// // parameterData: "6.02",
// // parameterFalseData: "6.02",
// // dataUnits: "V",
// // time: "2025-06-29 14:47:41",
// // },
// // {
// // id: 47,
// // substationName: "35变电所",
// // eleboxName: "5AHPT计量",
// // eleboxParameter: "C相电压",
// // parameterData: "5.97",
// // parameterFalseData: "5.97",
// // dataUnits: "V",
// // time: "2025-06-29 14:47:41",
// // },
// // {
// // id: 59,
// // substationName: "35变电所",
// // eleboxName: "6AH进线",
// // eleboxParameter: "A相电流",
// // parameterData: "229.8",
// // parameterFalseData: "229.8",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:42",
// // },
// // {
// // id: 61,
// // substationName: "35变电所",
// // eleboxName: "6AH进线",
// // eleboxParameter: "C相电流",
// // parameterData: "224.04",
// // parameterFalseData: "224.04",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:43",
// // },
// // {
// // id: 62,
// // substationName: "35变电所",
// // eleboxName: "6AH进线",
// // eleboxParameter: "有功功率",
// // parameterData: "4134",
// // parameterFalseData: "4134",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:43",
// // },
// // {
// // id: 63,
// // substationName: "35变电所",
// // eleboxName: "6AH进线",
// // eleboxParameter: "无功功率",
// // parameterData: "594",
// // parameterFalseData: "594",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:43",
// // },
// // {
// // id: 64,
// // substationName: "35变电所",
// // eleboxName: "6AH进线",
// // eleboxParameter: "功率因数",
// // parameterData: "0.99",
// // parameterFalseData: "0.99",
// // dataUnits: null,
// // time: "2025-06-29 14:47:43",
// // },
// // {
// // id: 70,
// // substationName: "35变电所",
// // eleboxName: "7AH新金采",
// // eleboxParameter: "A相电流",
// // parameterData: "96.54",
// // parameterFalseData: "96.54",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:44",
// // },
// // {
// // id: 72,
// // substationName: "35变电所",
// // eleboxName: "7AH新金采",
// // eleboxParameter: "C相电流",
// // parameterData: "91.02",
// // parameterFalseData: "91.02",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:44",
// // },
// // {
// // id: 73,
// // substationName: "35变电所",
// // eleboxName: "7AH新金采",
// // eleboxParameter: "有功功率",
// // parameterData: "1716",
// // parameterFalseData: "1716",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:44",
// // },
// // {
// // id: 74,
// // substationName: "35变电所",
// // eleboxName: "7AH新金采",
// // eleboxParameter: "无功功率",
// // parameterData: "136.8",
// // parameterFalseData: "136.8",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:44",
// // },
// // {
// // id: 75,
// // substationName: "35变电所",
// // eleboxName: "7AH新金采",
// // eleboxParameter: "功率因数",
// // parameterData: "0.997",
// // parameterFalseData: "0.997",
// // dataUnits: null,
// // time: "2025-06-29 14:47:44",
// // },
// // {
// // id: 81,
// // substationName: "35变电所",
// // eleboxName: "8AH金选",
// // eleboxParameter: "A相电流",
// // parameterData: "28.71",
// // parameterFalseData: "28.71",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:45",
// // },
// // {
// // id: 83,
// // substationName: "35变电所",
// // eleboxName: "8AH金选",
// // eleboxParameter: "C相电流",
// // parameterData: "27.66",
// // parameterFalseData: "27.66",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:45",
// // },
// // {
// // id: 84,
// // substationName: "35变电所",
// // eleboxName: "8AH金选",
// // eleboxParameter: "有功功率",
// // parameterData: "391.2",
// // parameterFalseData: "391.2",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:46",
// // },
// // {
// // id: 85,
// // substationName: "35变电所",
// // eleboxName: "8AH金选",
// // eleboxParameter: "无功功率",
// // parameterData: "322.2",
// // parameterFalseData: "322.2",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:46",
// // },
// // {
// // id: 86,
// // substationName: "35变电所",
// // eleboxName: "8AH金选",
// // eleboxParameter: "功率因数",
// // parameterData: "0.772",
// // parameterFalseData: "0.772",
// // dataUnits: null,
// // time: "2025-06-29 14:47:46",
// // },
// // {
// // id: 92,
// // substationName: "35变电所",
// // eleboxName: "9AH金修",
// // eleboxParameter: "A相电流",
// // parameterData: "1.05",
// // parameterFalseData: "1.05",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:46",
// // },
// // {
// // id: 94,
// // substationName: "35变电所",
// // eleboxName: "9AH金修",
// // eleboxParameter: "C相电流",
// // parameterData: "0.75",
// // parameterFalseData: "0.75",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:47",
// // },
// // {
// // id: 95,
// // substationName: "35变电所",
// // eleboxName: "9AH金修",
// // eleboxParameter: "有功功率",
// // parameterData: "9.3",
// // parameterFalseData: "9.3",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:47",
// // },
// // {
// // id: 96,
// // substationName: "35变电所",
// // eleboxName: "9AH金修",
// // eleboxParameter: "无功功率",
// // parameterData: "13.5",
// // parameterFalseData: "13.5",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:47",
// // },
// // {
// // id: 97,
// // substationName: "35变电所",
// // eleboxName: "9AH金修",
// // eleboxParameter: "功率因数",
// // parameterData: "0.571",
// // parameterFalseData: "0.571",
// // dataUnits: null,
// // time: "2025-06-29 14:47:47",
// // },
// // {
// // id: 103,
// // substationName: "35变电所",
// // eleboxName: "10AH金碎",
// // eleboxParameter: "A相电流",
// // parameterData: "22.845",
// // parameterFalseData: "22.845",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:48",
// // },
// // {
// // id: 105,
// // substationName: "35变电所",
// // eleboxName: "10AH金碎",
// // eleboxParameter: "C相电流",
// // parameterData: "22.215",
// // parameterFalseData: "22.215",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:48",
// // },
// // {
// // id: 106,
// // substationName: "35变电所",
// // eleboxName: "10AH金碎",
// // eleboxParameter: "有功功率",
// // parameterData: "306.9",
// // parameterFalseData: "306.9",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:48",
// // },
// // {
// // id: 107,
// // substationName: "35变电所",
// // eleboxName: "10AH金碎",
// // eleboxParameter: "无功功率",
// // parameterData: "281.25",
// // parameterFalseData: "281.25",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:48",
// // },
// // {
// // id: 108,
// // substationName: "35变电所",
// // eleboxName: "10AH金碎",
// // eleboxParameter: "功率因数",
// // parameterData: "0.737",
// // parameterFalseData: "0.737",
// // dataUnits: null,
// // time: "2025-06-29 14:47:48",
// // },
// // {
// // id: 114,
// // substationName: "35变电所",
// // eleboxName: "11AH备1",
// // eleboxParameter: "A相电流",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:49",
// // },
// // {
// // id: 116,
// // substationName: "35变电所",
// // eleboxName: "11AH备1",
// // eleboxParameter: "C相电流",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:49",
// // },
// // {
// // id: 117,
// // substationName: "35变电所",
// // eleboxName: "11AH备1",
// // eleboxParameter: "有功功率",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:50",
// // },
// // {
// // id: 118,
// // substationName: "35变电所",
// // eleboxName: "11AH备1",
// // eleboxParameter: "无功功率",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:50",
// // },
// // {
// // id: 119,
// // substationName: "35变电所",
// // eleboxName: "11AH备1",
// // eleboxParameter: "功率因数",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: null,
// // time: "2025-06-29 14:47:50",
// // },
// // {
// // id: 125,
// // substationName: "35变电所",
// // eleboxName: "12AH朱金",
// // eleboxParameter: "A相电流",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:51",
// // },
// // {
// // id: 127,
// // substationName: "35变电所",
// // eleboxName: "12AH朱金",
// // eleboxParameter: "C相电流",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "A",
// // time: "2025-06-29 14:47:51",
// // },
// // {
// // id: 128,
// // substationName: "35变电所",
// // eleboxName: "12AH朱金",
// // eleboxParameter: "有功功率",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:51",
// // },
// // {
// // id: 129,
// // substationName: "35变电所",
// // eleboxName: "12AH朱金",
// // eleboxParameter: "无功功率",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "kWh",
// // time: "2025-06-29 14:47:51",
// // },
// // {
// // id: 130,
// // substationName: "35变电所",
// // eleboxName: "12AH朱金",
// // eleboxParameter: "功率因数",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: null,
// // time: "2025-06-29 14:47:51",
// // },
// // {
// // id: 141,
// // substationName: "35变电所",
// // eleboxName: "13AH金采",
// // eleboxParameter: "功率因数",
// // parameterData: "0.713",
// // parameterFalseData: "0.713",
// // dataUnits: null,
// // time: "2025-06-29 14:47:53",
// // },
// // {
// // id: 142,
// // substationName: "35变电所",
// // eleboxName: "13AH金采",
// // eleboxParameter: "正向有功电能",
// // parameterData: "6.417947E-41",
// // parameterFalseData: "6.417947E-41",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:47:53",
// // },
// // {
// // id: 143,
// // substationName: "35变电所",
// // eleboxName: "13AH金采",
// // eleboxParameter: "正向无功电能",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:47:53",
// // },
// // {
// // id: 152,
// // substationName: "35变电所",
// // eleboxName: "14AH金沙",
// // eleboxParameter: "功率因数",
// // parameterData: "0.963",
// // parameterFalseData: "0.963",
// // dataUnits: null,
// // time: "2025-06-29 14:47:54",
// // },
// // {
// // id: 153,
// // substationName: "35变电所",
// // eleboxName: "14AH金沙",
// // eleboxParameter: "正向有功电能",
// // parameterData: "1.223614E-40",
// // parameterFalseData: "1.223614E-40",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:47:54",
// // },
// // {
// // id: 154,
// // substationName: "35变电所",
// // eleboxName: "14AH金沙",
// // eleboxParameter: "正向无功电能",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:47:54",
// // },
// // {
// // id: 163,
// // substationName: "35变电所",
// // eleboxName: "15AH金沙",
// // eleboxParameter: "功率因数",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: null,
// // time: "2025-06-29 14:47:55",
// // },
// // {
// // id: 164,
// // substationName: "35变电所",
// // eleboxName: "15AH金沙",
// // eleboxParameter: "正向有功电能",
// // parameterData: "1.681558E-43",
// // parameterFalseData: "1.681558E-43",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:47:56",
// // },
// // {
// // id: 165,
// // substationName: "35变电所",
// // eleboxName: "15AH金沙",
// // eleboxParameter: "正向无功电能",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:47:56",
// // },
// // {
// // id: 174,
// // substationName: "35变电所",
// // eleboxName: "16AH电容",
// // eleboxParameter: "功率因数",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: null,
// // time: "2025-06-29 14:47:57",
// // },
// // {
// // id: 175,
// // substationName: "35变电所",
// // eleboxName: "16AH电容",
// // eleboxParameter: "正向有功电能",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:47:57",
// // },
// // {
// // id: 176,
// // substationName: "35变电所",
// // eleboxName: "16AH电容",
// // eleboxParameter: "正向无功电能",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:47:57",
// // },
// // {
// // id: 185,
// // substationName: "35变电所",
// // eleboxName: "35KV进线柜",
// // eleboxParameter: "功率因数",
// // parameterData: "0.985",
// // parameterFalseData: "0.985",
// // dataUnits: null,
// // time: "2025-06-29 14:47:58",
// // },
// // {
// // id: 186,
// // substationName: "35变电所",
// // eleboxName: "35KV进线柜",
// // eleboxParameter: "正向有功电能",
// // parameterData: "2.500925E-39",
// // parameterFalseData: "2.500925E-39",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:47:58",
// // },
// // {
// // id: 187,
// // substationName: "35变电所",
// // eleboxName: "35KV进线柜",
// // eleboxParameter: "正向无功电能",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:47:58",
// // },
// // {
// // id: 196,
// // substationName: "35变电所",
// // eleboxName: "35KVPT",
// // eleboxParameter: "功率因数",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: null,
// // time: "2025-06-29 14:48:00",
// // },
// // {
// // id: 197,
// // substationName: "35变电所",
// // eleboxName: "35KVPT",
// // eleboxParameter: "正向有功电能",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:48:00",
// // },
// // {
// // id: 198,
// // substationName: "35变电所",
// // eleboxName: "35KVPT",
// // eleboxParameter: "正向无功电能",
// // parameterData: "0",
// // parameterFalseData: "0",
// // dataUnits: "KVarh",
// // time: "2025-06-29 14:48:00",
// // },
// // {
// // id: 199,
// // substationName: "35变电所",
// // eleboxName: "35KV主变",
// // eleboxParameter: "A相电压",
// // parameterData: "19.39",
// // parameterFalseData: "19.39",
// // dataUnits: "V",
// // time: "2025-06-29 14:48:00",
// // },
// // {
// // id: 200,
// // substationName: "35变电所",
// // eleboxName: "35KV主变",
// // eleboxParameter: "B相电压",
// // parameterData: "19.495",
// // parameterFalseData: "19.495",
// // dataUnits: "V",
// // time: "2025-06-29 14:48:00",
// // },
// // {
// // id: 201,
// // substationName: "35变电所",
// // eleboxName: "35KV主变",
// // eleboxParameter: "C相电压",
// // parameterData: "19.425",
// // parameterFalseData: "19.425",
// // dataUnits: "V",
// // time: "2025-06-29 14:48:00",
// // },
// // ],
// // };
// }
// );
// },
getdata(index = 0) {
updateSelectEleHistoryData({ name: this.statusNames[index].name })
.then((res) => {
if (res.code == 200) {
// 创建字段映射表
const fieldMapping = {
功率因数: "COS",
正向有功电能: "Ep",
正向无功电能: "Eq",
A相电压: "UA",
B相电压: "UB",
C相电压: "UC",
A相电流: "la",
C相电流: "lc",
有功功率: "p",
无功功率: "Q",
};
});
this.dbList = this.statusNames[index - 1].dblist.map((el) => {
const matchedColor = this.colors.find(
(item) => item.status === el.status
);
// 处理原始数据
const rawData = res.data.reduce((acc, cur) => {
const targetName = fieldMapping[cur.eleboxParameter];
if (targetName) {
const deviceName = cur.eleboxName;
acc[deviceName] = acc[deviceName] || {};
acc[deviceName][targetName] = `${cur.parameterData}${
cur.dataUnits || ""
}`;
}
return acc;
}, {});
// 合并到statusNames结构
this.statusNames[index].dglist = (
this.statusNames[index].dglist || []
).map((device) => {
return {
...el,
color: matchedColor ? matchedColor.color : "#fff", // 提供默认颜色
icon: matchedColor ? matchedColor.icon : "",
...device,
dataList: (device.dataList || []).map((item) => ({
...item,
value: rawData[device.dgname]?.[item.name] || item.value,
})),
};
});
this.dgList = [...this.statusNames[index].dglist];
this.dbList = [...(this.statusNames[index].dblist || [])];
}
})
.catch((error) => {
console.error("数据请求失败:", error);
this.dgList = [...this.statusNames[index].dglist];
this.dbList = [...(this.statusNames[index].dblist || [])];
});
},
changeBtn(index) {
this.showBtn = index;
this.getdata(index - 1);
},
},
};
......@@ -1127,6 +1929,7 @@ p {
.home {
width: 100%;
height: 100%;
pointer-events: auto; // 允许整个容器接收事件
background: url("~@/assets/images/screen/psxt/bg.png") no-repeat center;
background-size: 100%;
padding-top: 160px;
......@@ -1134,7 +1937,10 @@ p {
pointer-events: auto;
font-family: "fangsong";
#dlxt {
pointer-events: auto;
.dlxt-change {
pointer-events: auto; // 允许整个容器接收事件
z-index: 999;
width: 100%;
height: 36px;
display: flex;
......@@ -1143,6 +1949,8 @@ p {
align-items: center;
margin-bottom: 32px;
span {
pointer-events: auto;
z-index: 999;
display: flex;
justify-content: center;
align-items: center;
......
......@@ -11,7 +11,6 @@
ref="sssjControl"
:data="tableData1"
:class-option="classOption"
@mousewheel.native="handleScroll"
class="warp"
>
<ul class="item">
......@@ -100,7 +99,7 @@
<div class="chart_bg"></div>
<div id="EchartsPieLeft" class="chart_box"></div>
<div class="chart_number">
<span>42</span>
<span>{{ deviceStatusNum.total }}</span>
<br />
<span>总数</span>
</div>
......@@ -117,7 +116,7 @@
<div class="chart_bg_right"></div>
<div id="EchartsPieRight" class="chart_box"></div>
<div class="chart_number_right">
<span>42</span>
<span>{{ deviceStatusNum.cameraTotal }}</span>
<br />
<span>总数</span>
</div>
......@@ -183,7 +182,7 @@ import {
getDeviceStatus,
getDeviceData,
getRcData,
getRecentSevDaysAlarms,
getDeviceStatusNum,
} from "@/api/tyler/hjjc";
import ScrollTable from "@/components/Tyler/ScrollTable.vue";
import screenfull from "screenfull";
......@@ -289,6 +288,12 @@ export default {
],
//highCharts配置
highChartsOption: {},
deviceStatusNum: {
//设备总数
total: 0,
//摄像头总数
cameraTotal: 0,
},
};
},
mounted() {
......@@ -307,11 +312,12 @@ export default {
});
getDeviceStatus().then((res) => {
// this.equipmentList = res.data;
this.equipmentList = [
let dataXY = [
{
name: "三中码头门",
x: "50",
y: "436",
y: "406",
isWarning: 0,
monitorPositionList: [
{
......@@ -329,7 +335,7 @@ export default {
{
name: "二中空压机房",
x: "258",
y: "335",
y: "299",
isWarning: 0,
monitorPositionList: [
{
......@@ -346,8 +352,8 @@ export default {
},
{
name: "东风井",
x: "816",
y: "176",
x: "856",
y: "136",
isWarning: 0,
monitorPositionList: [
{
......@@ -365,7 +371,7 @@ export default {
{
name: "二中避险硐室",
x: "75",
y: "318",
y: "288",
isWarning: 0,
monitorPositionList: [
{
......@@ -383,7 +389,7 @@ export default {
{
name: "一中避险硐室",
x: "85",
y: "193",
y: "153",
isWarning: 0,
monitorPositionList: [
{
......@@ -401,7 +407,7 @@ export default {
{
name: "五中避险硐室",
x: "102",
y: "687",
y: "677",
isWarning: 0,
monitorPositionList: [
{
......@@ -419,7 +425,7 @@ export default {
{
name: "四中避险硐室",
x: "96",
y: "561",
y: "541",
isWarning: 0,
monitorPositionList: [
{
......@@ -437,7 +443,7 @@ export default {
{
name: "四中车场",
x: "53",
y: "557",
y: "527",
isWarning: 0,
monitorPositionList: [
{
......@@ -450,7 +456,7 @@ export default {
{
name: "一中主运输巷",
x: "185",
y: "204",
y: "164",
isWarning: 0,
monitorPositionList: [
{
......@@ -468,7 +474,7 @@ export default {
{
name: "二中主运输巷",
x: "187",
y: "331",
y: "296",
isWarning: 0,
monitorPositionList: [
{
......@@ -491,7 +497,7 @@ export default {
{
name: "二中中运输巷",
x: "316",
y: "338",
y: "303",
isWarning: 0,
monitorPositionList: [
{
......@@ -504,7 +510,7 @@ export default {
{
name: "三中避险硐室",
x: "93",
y: "441",
y: "411",
isWarning: 0,
monitorPositionList: [
{
......@@ -535,7 +541,7 @@ export default {
{
name: "一中风机",
x: "145",
y: "199",
y: "159",
isWarning: 0,
monitorPositionList: [
{
......@@ -553,7 +559,7 @@ export default {
{
name: "一中西采区",
x: "341",
y: "222",
y: "192",
isWarning: 0,
monitorPositionList: [
{
......@@ -581,7 +587,7 @@ export default {
{
name: "三中运输巷",
x: "518",
y: "474",
y: "439",
isWarning: 0,
monitorPositionList: [
{
......@@ -632,7 +638,7 @@ export default {
{
name: "四中运输巷",
x: "206",
y: "584",
y: "559",
isWarning: 0,
monitorPositionList: [
{
......@@ -660,7 +666,7 @@ export default {
{
name: "五中运输巷",
x: "166",
y: "707",
y: "697",
isWarning: 0,
monitorPositionList: [
{
......@@ -688,7 +694,7 @@ export default {
{
name: "一中运输巷",
x: "367",
y: "208",
y: "168",
isWarning: 0,
monitorPositionList: [
{
......@@ -701,7 +707,7 @@ export default {
{
name: "二中西采区",
x: "237",
y: "369",
y: "339",
isWarning: 0,
monitorPositionList: [
{
......@@ -724,7 +730,7 @@ export default {
{
name: "二中运输巷",
x: "415",
y: "341",
y: "311",
isWarning: 0,
monitorPositionList: [
{
......@@ -735,20 +741,41 @@ export default {
],
},
];
if (res.data && res.data.length) {
// 使用接口数据为基础,合并本地坐标数据
this.equipmentList = res.data.map((apiItem) => {
// 在dataXY中查找同名设备
const localItem = dataXY.find((xy) => xy.name === apiItem.name);
// 合并坐标数据,保留接口返回的其他字段
return {
...apiItem,
x: localItem ? localItem.x : 0, // 默认值处理
y: localItem ? localItem.y : 0,
monitorPositionList: apiItem.monitorPositionList || [],
};
});
getRecentSevDaysAlarms().then((res) => {
//数据空
} else {
// 降级方案:使用本地数据
}
});
//初始化获取左侧环境监测实施数据
getRealData().then((res) => {
this.tableData1 = res.data;
});
//初始化highCharts
this.getHighChartsData();
getDeviceStatusNum().then((res) => {
if (res.code == 200) {
this.deviceStatusNum = {
total: res.data[0].online + res.data[0].offline,
cameraTotal: res.data[1].online + res.data[1].offline,
};
this.getHighChartsData(res.data);
}
});
},
created() {},
methods: {
getHighChartsData() {
getHighChartsData(value = []) {
this.highChartsOption = {
chart: {
type: "pie", //饼图
......@@ -803,8 +830,16 @@ export default {
name: "设备统计",
showInLegend: true,
data: [
{ name: "正常设备", y: 80, color: "RGBA(37, 160, 238, 1)" }, // 高数据部分
{ name: "异常设备", y: 20, color: "RGBA(252, 183, 62, 1)" }, // 低数据部分
{
name: "正常设备",
y: value[0].online,
color: "RGBA(37, 160, 238, 1)",
}, // 高数据部分
{
name: "异常设备",
y: value[0].offline,
color: "RGBA(252, 183, 62, 1)",
}, // 低数据部分
],
startAngle: 0, //起始角度,
label: {
......@@ -829,8 +864,8 @@ export default {
Highcharts.chart("EchartsPieLeft", this.highChartsOption);
this.highChartsOption.series[0].data = [
{ name: "在线", y: 40, color: "#02CD9B" }, // 高数据部分
{ name: "离线", y: 1, color: "RGBA(252, 183, 62, 1)" }, // 低数据部分
{ name: "在线", y: value[1].online, color: "#02CD9B" }, // 高数据部分
{ name: "离线", y: value[1].offline, color: "RGBA(252, 183, 62, 1)" }, // 低数据部分
];
Highcharts.chart("EchartsPieRight", this.highChartsOption);
},
......@@ -1188,9 +1223,8 @@ export default {
watch: {
tableData1: {
handler() {
// 数据更改时也要加
this.$nextTick(() => {
this.$refs.vueSeamlessScroll.reset();
this.$refs.sssjControl && this.$refs.sssjControl.reset(); // 添加存在性判断
});
},
immediate: true,
......@@ -1451,8 +1485,11 @@ export default {
width: calc(100% - 920px);
background: url("~@/assets/images/screen/bg3.png") no-repeat center;
background-size: contain;
background-position-y: 10px;
text-align: center;
position: relative;
pointer-events: auto;
z-index: 999;
.dot {
width: 42px;
height: 70px;
......
<template>
<div class="app-container home">
<div class="home">
<div id="cesiumContainer"></div>
</div>
</template>
......@@ -71,13 +71,14 @@ export default {
this.viewer.cesiumWidget.creditContainer.style.display = "none";
// 加载3D Tileset
Cesium.Cesium3DTileset.fromUrl(
"http://localhost:80/terra_b3dms_yd/tileset.json",
{
maximumScreenSpaceError: 1,
pickable: true,
}
)
Cesium.Cesium3DTileset.fromUrl("/terra_b3dms_yd/tileset.json", {
maximumScreenSpaceError: 8, // 从默认16改为8(值越小越清晰)
maximumMemoryUsage: 1024, // 增加内存限制到1024MB
skipLevelOfDetail: false, // 禁用LOD跳过
preferLeaves: true, // 优先加载叶子节点
skipScreenSpaceErrorFactor: 16, // 降低跳过系数
loadSiblings: true, // 加载相邻节点
})
.then((tileset) => {
this.tileset = tileset; // 存储tileset供后续使用
this.viewer.scene.primitives.add(tileset);
......@@ -214,9 +215,26 @@ export default {
.home {
width: 100%;
height: 100%;
padding-top: 0px;
pointer-events: auto;
#cesiumContainer {
width: 100%;
height: 100%;
pointer-events: auto;
position: relative;
z-index: 0 !important; // 强制设置基础层级
transform: translateZ(0); // 创建独立层叠上下文
}
}
// 新增强制穿透样式
::v-deep .cesium-widget canvas {
pointer-events: auto !important;
position: relative;
z-index: 0;
}
// 移除Cesium默认事件拦截
::v-deep .cesium-widget-credits {
display: none !important;
}
</style>
......@@ -70,11 +70,12 @@
: 'dwr'
"
>
<p>电机电流:{{ item.motorCurrent }}A</p>
<p>电机轴承温度:{{ item.motorBearingTemp }}</p>
<p>水泵轴承温度:{{ item.pumpBearingTemp }}</p>
<p>水泵流量:{{ item.pumpFlow }}</p>
<p>排水管路压力:{{ item.drainagePressure }}</p>
<p>水泵前温:{{ item.pumpFrontTemp | decimalFilter }}</p>
<p>水泵后温:{{ item.pumpRearTemp | decimalFilter }}</p>
<p>电机前温:{{ item.motorFrontTemp | decimalFilter }}</p>
<p>电机后温:{{ item.motorRearTemp | decimalFilter }}</p>
<p>出水压力:{{ item.outletPressure | decimalFilter }}Mpa</p>
<p>吸水负压:{{ item.inletVacuum | decimalFilter }}Mpa</p>
</div>
</div>
<p>
......@@ -137,9 +138,7 @@ export default {
created() {
this.initPumpList();
},
mounted() {
this.startWaterAnimation();
},
mounted() {},
methods: {
initPumpList() {
getDraData().then((res) => {
......@@ -155,6 +154,8 @@ export default {
},
// 水泵开启按钮
openWaterPump(item, status) {
console.log("我点击了");
this.upWindowShow = true;
// this.submitPumpPassword(pumpId, this.password, 0);
this.pumpId = item.pumpId;
......@@ -190,6 +191,11 @@ export default {
},
},
filters: {
decimalFilter(value) {
return value === null || typeof value === "undefined"
? "--"
: Number(value).toFixed(2);
},
// 水池显示数据过滤
sumpFilter(item, key) {
// 优化过滤逻辑
......@@ -201,6 +207,7 @@ export default {
<style scoped lang="scss">
.home {
pointer-events: auto; // 新增这行
width: 100%;
height: 100%;
background: url("~@/assets/images/screen/psxt/bg.png") no-repeat center;
......@@ -215,6 +222,7 @@ export default {
background-size: 100% 100%;
position: relative;
.center-title-box {
z-index: 888;
width: 200px;
height: 100%;
margin: auto;
......@@ -279,7 +287,9 @@ export default {
height: 200px;
// background: #ffffff;
.H36 {
height: 36px;
pointer-events: auto; // 新增这行
position: relative; // 新增层级控制
z-index: 999;
.button {
width: 86px;
height: 36px;
......@@ -334,7 +344,7 @@ export default {
position: relative;
.tip-box {
width: 192px;
height: 136px;
height: 156px;
background: #0a1e36;
border: 2px solid #00deff;
padding: 7px 13px 15px 10px;
......@@ -379,7 +389,7 @@ export default {
}
.tip-box {
width: 192px;
height: 136px;
height: 156px;
background: #0a1e36;
border: 2px solid #00deff;
padding: 7px 13px 15px 10px;
......
......@@ -191,7 +191,7 @@
class="custom-item custom-item2"
>
<span class="custom-item-content custom-item-content2">{{
item.serialNumber
index + 1
}}</span>
<span class="custom-item-content custom-item-content2">{{
item.name
......@@ -201,11 +201,11 @@
>
<div
class="progress"
:style="{ width: progressWidth(item.frequency) }"
:style="{ width: progressWidth(item.value) }"
></div>
</div>
<span class="custom-item-content custom-item-content2">{{
item.frequency
item.value
}}</span>
</li>
</ul>
......@@ -350,28 +350,7 @@ export default {
lastTime: "2025-01-10 14:21:31",
},
],
recentSevDaysAlarmsData: [
{
serialNumber: "1",
name: "张三",
frequency: "45",
},
{
serialNumber: "1",
name: "张三",
frequency: "32",
},
{
serialNumber: "1",
name: "张三",
frequency: "31",
},
{
serialNumber: "1",
name: "张三",
frequency: "29",
},
],
recentSevDaysAlarmsData: [],
subStaStatus: [],
realTimeDistributionData: [],
subStaStatusData: [{ num: 0 }, { num: 0 }, { num: 0 }],
......@@ -449,14 +428,17 @@ export default {
getMonthlyRankings() {
monthlyRankings().then((res) => {
if (res.code !== 200) return;
this.recentSevDaysAlarmsData = res.data;
this.recentSevDaysAlarmsData = res.data.sort(
(a, b) => b.value - a.value
);
//获取的re.data格式为[{name:张三,value:54}]这样。需要根据value排序,然后value大的在前
});
},
//控制进度条宽度
progressWidth(frequency) {
//最大值从recentSevDaysAlarmsData中获取,且保证位数为0
const maxFrequencyData = this.recentSevDaysAlarmsData.reduce(
(max, item) => Math.max(max, Math.ceil(item.frequency / 10) * 10),
(max, item) => Math.max(max, Math.ceil(item.value / 10) * 10),
0
);
const width = (frequency / maxFrequencyData) * 100 + "%";
......
......@@ -2,7 +2,13 @@
<div class="main-content">
<div class="content">
<!--一中23线风机dom-->
<div class="fengji" style="top: 74px; left: 96px">
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'fengji' + item.deviceId"
v-show="item.deviceName == '一中23线风机'"
style="top: 74px; left: 96px"
>
<div class="fengji-title">一中23线风机</div>
<div class="fengji-content">
<img
......@@ -11,24 +17,43 @@
srcset=""
/>
<div class="fengji-control">
<div class="fengji-icon"></div>
<div class="fengji-lamp"></div>
<div
class="fengji-icon"
:class="item.fanIsRun != 0 ? '' : 'runing'"
></div>
<div
class="fengji-lamp"
:class="item.fanIsRun != 0 ? 'active' : ':'"
>
<div class="fault-tip" v-show="item.fanIsRun != 0">
{{ item.fanIsRun == 1 ? "风机故障" : "变频器故障" }}
</div>
</div>
</div>
<div class="fengji-button">本地控制</div>
</div>
<div class="fengji-button active" v-if="item.isBoolean == 0">
本地控制
</div>
<div
class="fengji-button"
v-if="item.isBoolean == 1"
@click="remoteControl(item)"
>
远程控制
</div>
<div class="fengji-msg">
<p>电源电压:406.29V</p>
<p>电机电流:266.3A</p>
<p>运行频率:100HZ</p>
<p>设定频率:45HZ</p>
<p>风压:1.01KPa</p>
<p>风速:3.42m/s</p>
<p>风量:24.64m³/s</p>
<p>电机温度1:36.1</p>
<p>电机温度2:0</p>
<p>环境温度:36.81</p>
<p>电机振动1:5.2mm/s</p>
<p>电机振动2:3.29mm/s</p>
<p>电源电压:{{ item.powerSupplyVoltage | decimalFilter }}V</p>
<p>电机电流:{{ item.motorCurrent | decimalFilter }}A</p>
<p>运行频率:{{ item.operatingFrequency | decimalFilter }}HZ</p>
<p>设定频率:{{ item.setFrequency | decimalFilter }}HZ</p>
<p>风压:{{ item.windPressure | decimalFilter }}KPa</p>
<p>风速:{{ item.windSpeed | decimalFilter }}m/s</p>
<p>风量:{{ item.airVolume | decimalFilter }}m³/s</p>
<p>电机温度{{ item.frontAxisTemperature | decimalFilter }}</p>
<p>电机温度{{ item.rearAxisTemperature | decimalFilter }}</p>
<p>环境温度:{{ item.motorTemperature | decimalFilter }}</p>
<p>电机振动1:{{ item.frontVibration | decimalFilter }}mm/s</p>
<p>电机振动2:{{ item.rearVibration | decimalFilter }}mm/s</p>
</div>
</div>
<div class="arrow-psition" style="top: 132px; left: 300px">
......@@ -41,7 +66,13 @@
<div class="fengji-arrow"></div>
</div>
<!--一中副扇风机dom-->
<div class="fengji" style="left: 760px; top: 74px">
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'yizhong' + item.deviceId"
v-show="item.deviceName == '一中副扇风机'"
style="left: 760px; top: 74px"
>
<div class="fengji-title">一中副扇风机</div>
<div class="fengji-content">
<img
......@@ -50,30 +81,81 @@
srcset=""
/>
<div class="fengji-control">
<div class="fengji-icon"></div>
<div class="fengji-lamp"></div>
<div
class="fengji-icon"
:class="item.fanIsRun != 0 ? '' : 'runing'"
></div>
<div
class="fengji-lamp"
:class="item.fanIsRun != 0 ? 'active' : ':'"
>
<div class="fault-tip" v-show="item.fanIsRun != 0">
{{ item.fanIsRun == 1 ? "风机故障" : "变频器故障" }}
</div>
</div>
</div>
<div class="fengji-button">本地控制</div>
</div>
<div class="fengji-button active" v-if="item.isBoolean == 0">
本地控制
</div>
<div
class="fengji-button"
v-if="item.isBoolean == 1"
@click="remoteControl(item)"
>
远程控制
</div>
<div class="fengji-msg msg-postion">
<p>电源电压:390.46V</p>
<p>电机电流:28.10A</p>
<p>运行频率:49.90HZ</p>
<p>设定频率:49.90HZ</p>
<p>电源电压:{{ item.powerSupplyVoltage | decimalFilter }}V</p>
<p>电机电流:{{ item.motorCurrent | decimalFilter }}A</p>
<p>运行频率:{{ item.operatingFrequency | decimalFilter }}HZ</p>
<p>设定频率:{{ item.setFrequency | decimalFilter }}HZ</p>
</div>
</div>
<!--地面空压机-->
<div class="kongya" style="left: 1160px; top: 44px">
<div
class="kongya"
v-for="(item, index) in kyList"
:key="index + 'kongya' + item.deviceId"
v-show="item.deviceName == '地表空压机'"
style="left: 1160px; top: 44px"
>
<div class="kongya-title">地面空压机</div>
<img src="../../../assets/images/screen/tfxt/device2.png" alt="" />
<div class="kongya-msg">
<p>管道压力:{{ item.pipelinePressure }}KPa</p>
<p>瞬时流量:{{ item.flowRate }}</p>
<p>瞬时流速:{{ item.velocity }}m³/s</p>
<p>气体温度:{{ item.gasTemperature }}</p>
</div>
</div>
<!--东风井风机dom-->
<div class="fengji" style="right: 80px; top: 24px">
<div class="fengji-title" style="margin-left: 50px">东风进风机</div>
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'dongfeng1' + item.deviceId"
v-show="item.deviceName == '东风井风机'"
style="right: 80px; top: 74px"
>
<div class="fengji-title" style="margin-left: 50px">东风井风机</div>
<div class="fengji-content">
<div class="fengji-control">
<div class="fengji-icon"></div>
<div class="fengji-lamp"></div>
<div
class="fengji-icon"
:class="item.fanIsRun != 0 ? '' : 'runing'"
></div>
<div
class="fengji-lamp"
:class="item.fanIsRun != 0 ? 'active' : ':'"
>
<div
class="fault-tip"
v-show="item.fanIsRun != 0"
style="top: 5px; left: -141px"
>
{{ item.fanIsRun == 1 ? "风机故障" : "变频器故障" }}
</div>
</div>
</div>
<img
src="../../../assets/images/screen/tfxt/device1.png"
......@@ -81,20 +163,33 @@
srcset=""
/>
</div>
<div class="fengji-button" style="margin-left: 55px">本地控制</div>
<div
class="fengji-button active"
v-if="item.isBoolean == 0"
style="margin-left: 50px"
>
本地控制
</div>
<div
class="fengji-button"
v-if="item.isBoolean == 1"
style="margin-left: 50px"
>
远程控制
</div>
<div class="fengji-msg" style="position: absolute; right: -30px">
<p>电源电压:418.00V</p>
<p>电机电流:126.00A</p>
<p>运行频率:40HZ</p>
<p>设定频率:40HZ</p>
<p>风压:0.28KPa</p>
<p>风速:1.31m/s</p>
<p>风量:9.45m³/s</p>
<p>电机温度1:22.9</p>
<p>电机温度2:124.8</p>
<p>环境温度:16.76</p>
<p>电机振动1:4.24mm/s</p>
<p>电机振动2:1.58mm/s</p>
<p>电源电压:{{ item.powerSupplyVoltage | decimalFilter }}V</p>
<p>电机电流:{{ item.motorCurrent | decimalFilter }}A</p>
<p>运行频率:{{ item.operatingFrequency | decimalFilter }}HZ</p>
<p>设定频率:{{ item.setFrequency | decimalFilter }}HZ</p>
<p>风压:{{ item.windPressure | decimalFilter }}KPa</p>
<p>风速:{{ item.windSpeed | decimalFilter }}m/s</p>
<p>风量:{{ item.airVolume | decimalFilter }}m³/s</p>
<p>电机温度{{ item.frontAxisTemperature | decimalFilter }}</p>
<p>电机温度{{ item.rearAxisTemperature | decimalFilter }}</p>
<p>环境温度:{{ item.motorTemperature | decimalFilter }}</p>
<p>电机振动1:{{ item.frontVibration | decimalFilter }}mm/s</p>
<p>电机振动2:{{ item.rearVibration | decimalFilter }}mm/s</p>
</div>
</div>
<div class="arrow-psition" style="top: 302px; left: 558px">
......@@ -104,17 +199,49 @@
<div class="fengji-arrow"></div>
</div>
<!--二中空压机-->
<div class="kongya" style="left: 360px; top: 274px">
<div
class="kongya"
v-for="(item, index) in kyList"
:key="index + '二中空压机' + item.deviceId"
v-show="item.deviceName == '二中空压机'"
style="left: 360px; top: 274px"
>
<div class="kongya-title">二中空压机</div>
<img src="../../../assets/images/screen/tfxt/device2.png" alt="" />
<div class="kongya-msg" style="top: -18px; right: -221px">
<p>管道压力:{{ item.pipelinePressure | decimalFilter }}KPa</p>
<p>瞬时流量:{{ item.flowRate | decimalFilter }}</p>
<p>瞬时流速:{{ item.velocity | decimalFilter }}m³/s</p>
<p>气体温度:{{ item.gasTemperature | decimalFilter }}</p>
</div>
</div>
<!--二中副扇风机dom-->
<div class="fengji" style="left: 960px; top: 247px">
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'erzhong' + item.deviceId"
v-show="item.deviceName == '二中副扇风机'"
style="left: 960px; top: 247px"
>
<div class="fengji-title" style="margin-left: 50px">二中副扇风机</div>
<div class="fengji-content">
<div class="fengji-control">
<div class="fengji-icon"></div>
<div class="fengji-lamp"></div>
<div
class="fengji-icon"
:class="item.fanIsRun != 0 ? '' : 'runing'"
></div>
<div
class="fengji-lamp"
:class="item.fanIsRun != 0 ? 'active' : ':'"
>
<div
class="fault-tip"
v-show="item.fanIsRun != 0"
style="top: 5px; left: -141px"
>
{{ item.fanIsRun == 1 ? "风机故障" : "变频器故障" }}
</div>
</div>
</div>
<img
src="../../../assets/images/screen/tfxt/device1.png"
......@@ -122,15 +249,29 @@
srcset=""
/>
</div>
<div class="fengji-button" style="margin-left: 55px">本地控制</div>
<div
class="fengji-button active"
v-if="item.isBoolean == 0"
style="margin-left: 55px"
>
本地控制
</div>
<div
class="fengji-button"
v-if="item.isBoolean == 1"
style="margin-left: 55px"
@click="remoteControl(item)"
>
远程控制
</div>
<div
class="fengji-msg"
style="position: absolute; right: -200px; top: 20px"
style="position: absolute; right: -180px; top: 20px"
>
<p>电源电压:381.18V</p>
<p>电机电流:25.20A</p>
<p>运行频率:49.91HZ</p>
<p>设定频率:49.91HZ</p>
<p>电源电压:{{ item.powerSupplyVoltage | decimalFilter }}V</p>
<p>电机电流:{{ item.motorCurrent | decimalFilter }}A</p>
<p>运行频率:{{ item.operatingFrequency | decimalFilter }}HZ</p>
<p>设定频率:{{ item.setFrequency | decimalFilter }}HZ</p>
</div>
</div>
<div class="arrow-psition" style="top: 472px; left: 288px">
......@@ -146,7 +287,13 @@
<div class="fengji-arrow"></div>
</div>
<!--三中副扇风机dom-->
<div class="fengji" style="left: 660px; top: 415px">
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'sanzhong' + item.deviceId"
v-show="item.deviceName == '三中副扇风机'"
style="left: 660px; top: 415px"
>
<div class="fengji-title">三中副扇风机</div>
<div class="fengji-content">
<img
......@@ -155,25 +302,64 @@
srcset=""
/>
<div class="fengji-control">
<div class="fengji-icon"></div>
<div class="fengji-lamp"></div>
<div
class="fengji-icon"
:class="item.fanIsRun != 0 ? '' : 'runing'"
></div>
<div
class="fengji-lamp"
:class="item.fanIsRun != 0 ? 'active' : ':'"
>
<div class="fault-tip" v-show="item.fanIsRun != 0">
{{ item.fanIsRun == 1 ? "风机故障" : "变频器故障" }}
</div>
</div>
</div>
</div>
<div class="fengji-button">本地控制</div>
<div class="fengji-button active" v-if="item.isBoolean == 0">
本地控制
</div>
<div
class="fengji-button"
v-if="item.isBoolean == 1"
@click="remoteControl(item)"
>
远程控制
</div>
<div class="fengji-msg msg-postion">
<p>电源电压:396.18V</p>
<p>电机电流:28.40A</p>
<p>运行频率:49.94HZ</p>
<p>设定频率:49.94HZ</p>
<p>电源电压:{{ item.powerSupplyVoltage | decimalFilter }}V</p>
<p>电机电流:{{ item.motorCurrent | decimalFilter }}A</p>
<p>运行频率:{{ item.operatingFrequency | decimalFilter }}HZ</p>
<p>设定频率:{{ item.setFrequency | decimalFilter }}HZ</p>
</div>
</div>
<!--四中副扇风机dom-->
<div class="fengji" style="left: 1260px; top: 583px">
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'sizhong' + item.deviceId"
v-show="item.deviceName == '四中副扇风机'"
style="left: 1260px; top: 583px"
>
<div class="fengji-title" style="margin-left: 50px">四中副扇风机</div>
<div class="fengji-content">
<div class="fengji-control">
<div class="fengji-icon"></div>
<div class="fengji-lamp"></div>
<div
class="fengji-icon"
:class="item.fanIsRun != 0 ? '' : 'runing'"
></div>
<div
class="fengji-lamp"
:class="item.fanIsRun != 0 ? 'active' : ':'"
>
<div
class="fault-tip"
v-show="item.fanIsRun != 0"
style="top: 5px; left: -141px"
>
{{ item.fanIsRun == 1 ? "风机故障" : "变频器故障" }}
</div>
</div>
</div>
<img
src="../../../assets/images/screen/tfxt/device1.png"
......@@ -181,15 +367,29 @@
srcset=""
/>
</div>
<div class="fengji-button" style="margin-left: 55px">本地控制</div>
<div
class="fengji-button active"
v-if="item.isBoolean == 0"
style="margin-left: 55px"
>
本地控制
</div>
<div
class="fengji-button"
v-if="item.isBoolean == 1"
style="margin-left: 55px"
@click="remoteControl(item)"
>
远程控制
</div>
<div
class="fengji-msg"
style="position: absolute; right: -200px; top: 20px"
style="position: absolute; right: -180px; top: 20px"
>
<p>电源电压:390.50V</p>
<p>电机电流:33.90A</p>
<p>运行频率:39.92HZ</p>
<p>设定频率:40.00HZ</p>
<p>电源电压:{{ item.powerSupplyVoltage | decimalFilter }}V</p>
<p>电机电流:{{ item.motorCurrent | decimalFilter }}A</p>
<p>运行频率:{{ item.operatingFrequency | decimalFilter }}HZ</p>
<p>设定频率:{{ item.setFrequency | decimalFilter }}HZ</p>
</div>
</div>
<div class="arrow-psition" style="top: 642px; left: 288px">
......@@ -205,7 +405,13 @@
<div class="fengji-arrow"></div>
</div>
<!--五中副扇风机dom-->
<div class="fengji" style="left: 600px; top: 750px">
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'wuzhong' + item.deviceId"
v-show="item.deviceName == '五中副扇风机'"
style="left: 600px; top: 750px"
>
<div class="fengji-title">五中副扇风机</div>
<div class="fengji-content">
<img
......@@ -214,16 +420,35 @@
srcset=""
/>
<div class="fengji-control">
<div class="fengji-icon"></div>
<div class="fengji-lamp"></div>
<div
class="fengji-icon"
:class="item.fanIsRun != 0 ? '' : 'runing'"
></div>
<div
class="fengji-lamp"
:class="item.fanIsRun != 0 ? 'active' : ':'"
>
<div class="fault-tip" v-show="item.fanIsRun != 0">
{{ item.fanIsRun == 1 ? "风机故障" : "变频器故障" }}
</div>
</div>
</div>
</div>
<div class="fengji-button active" v-if="item.isBoolean == 0">
本地控制
</div>
<div
class="fengji-button"
v-if="item.isBoolean == 1"
@click="remoteControl(item)"
>
远程控制
</div>
<div class="fengji-button">本地控制</div>
<div class="fengji-msg msg-postion">
<p>电源电压:402.71V</p>
<p>电机电流:35.10A</p>
<p>运行频率:49.92HZ</p>
<p>设定频率:49.92HZ</p>
<p>电源电压:{{ item.powerSupplyVoltage | decimalFilter }}V</p>
<p>电机电流:{{ item.motorCurrent | decimalFilter }}A</p>
<p>运行频率:{{ item.operatingFrequency | decimalFilter }}HZ</p>
<p>设定频率:{{ item.setFrequency | decimalFilter }}HZ</p>
</div>
</div>
<div class="arrow-psition" style="top: 812px; left: 188px">
......@@ -233,22 +458,97 @@
<div class="fengji-arrow"></div>
</div>
</div>
<div class="up-window" v-show="upWindowShow">
<div class="up-window-box" ref="upWindowBox">
<!-- 添加 ref 引用 -->
<p><span></span>{{ windowTitle }}</p>
<!-- 改为数据绑定 -->
<i class="el-icon-close close-button" @click="upWindowShow = false"></i>
<div class="W400">
<div class="but-box" @click="submitPumpSetting(1)">风机正向启动</div>
<div class="but-box" @click="submitPumpSetting(2)">风机反向启动</div>
<div class="but-box" @click="submitPumpSetting(3)">风机停止运行</div>
<div class="but-box" @click="submitPumpSetting(4)">风机故障复位</div>
</div>
</div>
</div>
</div>
</template>
<script>
import {
fenshanQuery,
kongyajiQuery,
editFengjiStatus,
} from "@/api/tyler/tfxt";
export default {
name: "",
props: {},
components: {},
data() {
return {};
return {
fengjiList: [],
kyList: [],
upWindowShow: false,
windowTitle: "", // 新增标题字段
currentDevice: null, // 新增当前设备字段
};
},
computed: {},
watch: {},
created() {},
created() {
this.getData();
},
mounted() {},
methods: {},
methods: {
getData() {
fenshanQuery().then((res) => {
if (res.code == 200) {
this.fengjiList = res.rows;
}
});
kongyajiQuery().then((res) => {
if (res.code == 200) {
this.kyList = res.rows;
}
});
},
remoteControl(item) {
this.upWindowShow = true;
this.windowTitle = `${item.deviceName}远程操作`; // 直接设置数据
this.currentDevice = item; // 保存当前设备信息
},
submitPumpSetting(status) {
const param = {
devicesId: this.currentDevice.deviceId,
devicesType: 0,
devicesStatus: status,
};
// 提交时使用 this.currentDevice 获取设备信息
editFengjiStatus(param).then((res) => {
if (res.code == 200) {
this.upWindowShow = false;
this.getData();
this.$message({
message: "操作成功",
type: "success",
});
} else {
this.$message({
message: "操作失败",
type: "error",
});
}
});
},
},
filters: {
decimalFilter(value) {
return value === null || typeof value === "undefined"
? "--"
: Number(value).toFixed(2);
},
},
};
</script>
......@@ -256,6 +556,8 @@ export default {
.main-content {
background: url("~@/assets/images/screen/tfxt/bg.png") no-repeat center;
padding-top: 100px;
pointer-events: auto;
.content {
width: 100%;
height: 100%;
......@@ -264,9 +566,13 @@ export default {
background-size: 90% 95%;
background-position-x: 50px;
font-family: "fangsong";
pointer-events: auto;
.fengji {
position: absolute;
width: 195px;
pointer-events: auto;
.fengji-title {
font-weight: 400;
font-size: 20px;
......@@ -293,6 +599,7 @@ export default {
background: url("~@/assets/images/screen/tfxt/icon2.png") no-repeat
center;
background-size: 100% 100%;
&.runing {
//需要这个元素做旋转动画,围着自身圆心一直旋转
animation: rotate 2s linear infinite;
@keyframes rotate {
......@@ -304,6 +611,7 @@ export default {
}
}
}
}
.fengji-lamp {
width: 53px;
height: 53px;
......@@ -311,12 +619,38 @@ export default {
center;
background-size: 100%;
position: relative;
&.active {
background: url("~@/assets/images/screen/tfxt/icon5.png")
no-repeat center;
background-size: 100%;
.fault-tip {
position: absolute;
top: 5px;
left: 53px;
width: 137px;
height: 41px;
background: #052952;
box-shadow: 2px -5px 21px 0px rgba(5, 22, 43, 0.48);
border-radius: 4px;
border: 1px solid #00c6ff;
text-align: center;
color: #ff1305;
font-size: 18px;
font-weight: 400;
opacity: 0.9;
line-height: 40px;
}
}
}
}
}
.fengji-button {
width: 140px;
height: 36px;
//开启点击
pointer-events: auto;
position: relative; // 添加层级控制
z-index: 999;
border-radius: 4px;
border: 2px solid #00d8ff;
font-weight: 400;
......@@ -325,9 +659,17 @@ export default {
line-height: 34px;
text-align: center;
background: #0387c8;
&:hover {
cursor: pointer;
}
&.active {
background: #7196a8;
border-radius: 4px;
border: 2px solid #96c5cd;
}
}
.fengji-msg {
padding: 17px;
padding: 5px;
border: 2px solid #00ccff;
font-weight: 400;
font-size: 18px;
......@@ -342,7 +684,7 @@ export default {
&.msg-postion {
position: absolute;
top: 30px;
left: -190px;
left: -160px;
}
}
}
......@@ -361,6 +703,23 @@ export default {
width: 171px;
height: 76px;
}
.kongya-msg {
position: absolute;
top: -18px;
right: -171px;
padding: 5px 17px;
border: 2px solid #00ccff;
font-weight: 400;
font-size: 18px;
color: #11e0ff;
line-height: 28px;
background: #05162b;
margin-top: 15px;
margin-left: -15px;
p {
margin: 0%;
}
}
}
.arrow-psition {
position: absolute;
......@@ -398,5 +757,109 @@ export default {
}
}
}
.up-window {
width: 100%;
height: 100%;
background: RGBA(4, 21, 42, 0.6);
position: absolute;
z-index: 9999;
top: 0;
left: 0;
.up-window-box {
width: 588px;
height: 250px;
background: linear-gradient(0deg, #062451 0%, #09162d 100%);
box-shadow: 0px 15px 11px 2px rgba(0, 20, 39, 0.31);
border: 2px solid #11b9ff;
opacity: 1;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
padding: 20px 37px 37px 27px;
color: #ffffff;
p {
width: 500px;
height: 37px;
margin: 0px;
background: url("~@/assets/images/screen/psxt/title.png") no-repeat
center;
background-size: 100%;
font-weight: 500;
font-size: 22px;
color: #ffffff;
height: 37px;
background-position-y: 9px;
span {
width: 27px;
display: inline-block;
}
}
.close-button {
font-size: 30px;
position: absolute;
top: 16px;
right: 16px;
cursor: pointer;
&:hover {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
-webkit-transition: -webkit-transform 1s linear;
transition: transform 1s linear;
}
}
.W400 {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 30px 30px; // 统一垂直和水平间距为30px
justify-items: center;
margin-top: 30px;
.but-box {
width: 160px;
height: 45px;
// background: url("~@/assets/images/screen/psxt/btn_bg.png") no-repeat
// center;
background-size: 100% 100%;
border: 1px solid #0d92ff;
border-radius: 4px;
font-weight: 500;
font-size: 18px;
color: #b6e1ff;
text-align: center;
line-height: 42px;
cursor: pointer;
transition: all 0.3s;
background: linear-gradient(180deg, #0a2d4d 0%, #05162b 100%);
border: 1px solid #0d92ff;
box-shadow: inset 0 0 8px rgba(13, 146, 255, 0.3);
&:hover {
// background-image: url("~@/assets/images/screen/psxt/btn_bg_active.png");
color: #fff;
background: linear-gradient(180deg, #0d3a5c 0%, #08203d 100%);
box-shadow: 0 0 10px rgba(13, 146, 255, 0.5);
}
&:active {
transform: scale(0.95);
box-shadow: 0 0 15px rgba(13, 146, 255, 0.8); // 加深阴影强度
}
}
}
}
}
@keyframes wave {
0% {
background-position-x: 0;
border-radius: 50% 50% 0 0 / v-bind('waveHeight + "px"');
}
50% {
border-radius: 50% 50% 0 0 / v-bind('(waveHeight + 2) + "px"');
}
100% {
background-position-x: 200px;
border-radius: 50% 50% 0 0 / v-bind('waveHeight + "px"');
}
}
}
</style>
......@@ -171,7 +171,7 @@ export default {
// 动画控制
animationId: null,
timer: null,
source: null, // 新增取消令牌源
// 位置信息
currentPos: null,
targetPos: null,
......@@ -211,7 +211,10 @@ export default {
},
beforeDestroy() {
this.clearAnimation();
if (this.timer) {
clearInterval(this.timer);
this.timer = null; // 新增清理引用
}
},
mounted() {
this.initPositions();
......@@ -226,7 +229,7 @@ export default {
// 计算当前位置
calculatePosition(type) {
if (!POSITIONS.length) return { top: "450px", left: "413px" };
if (!POSITIONS.length) return { top: "450px", left: "428px" };
const currentDepth = Number(this.zgposition) || 0;
......@@ -238,7 +241,7 @@ export default {
return {
top: `${position[type] || POSITIONS[0][type]}px`, // 添加默认值
left: type === "glposy" ? "413px" : "365px",
left: type === "glposy" ? "428px" : "365px",
};
},
......@@ -310,6 +313,7 @@ export default {
startAutoUpdate() {
this.clearAnimation();
this.getdata();
this.timer = setInterval(this.getdata, 30000);
},
......@@ -633,7 +637,7 @@ export default {
transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.dianti-box {
width: 78px;
width: 46px;
height: 78px;
background: url("~@/assets/images/screen/tsj/bg3.png") no-repeat center;
background-size: 100% 100%;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment