Commit 1af7d19a authored by lei's avatar lei

fix:修复bug

parent f01a7aba
<template>
<div class="monitor-map">
<!-- 学校标记 -->
<span
v-for="(school, index) in schools"
:key="'school-' + index"
class="school-marker"
:style="{ left: school.x + 'px', top: school.y + 'px' }"
>
{{ school.name }}
</span>
<!-- 设备点位 -->
<div v-if="showEquipment">
<div
v-for="(equip, index) in equipments"
:key="'equip-' + index"
class="equipment-dot"
:class="{ warning: equip.isWarning }"
:style="{ left: equip.x + 'px', top: equip.y + 'px' }"
@click="handleEquipmentClick(equip)"
>
<div class="tooltip">
<p v-for="(monitor, i) in equip.monitors" :key="i">
{{ monitor.name }}
</p>
</div>
</div>
</div>
<!-- 摄像头点位 -->
<div v-if="showCamera">
<div
v-for="(camera, index) in cameras"
:key="'camera-' + index"
class="camera-dot"
:class="{ offline: !camera.status }"
:style="{ left: camera.x + 'px', top: camera.y + 'px' }"
@click="handleCameraClick(camera)"
/>
</div>
<!-- 切换按钮 -->
<div class="toggle-buttons">
<el-checkbox-group v-model="toggleList">
<el-checkbox label="camera">监控</el-checkbox>
<el-checkbox label="equipment">监测设备</el-checkbox>
</el-checkbox-group>
</div>
</div>
</template>
<script>
export default {
props: {
equipments: Array,
cameras: Array,
schools: Array,
},
data() {
return {
toggleList: ["camera", "equipment"],
};
},
computed: {
showCamera() {
return this.toggleList.includes("camera");
},
showEquipment() {
return this.toggleList.includes("equipment");
},
},
methods: {
handleEquipmentClick(equip) {
this.$emit("equipment-click", equip);
},
handleCameraClick(camera) {
this.$emit("camera-click", camera);
},
},
};
</script>
<style scoped>
/* 样式代码 */
</style>
<template>
<div class="real-time-list">
<vue-seamless-scroll :data="data" :class-option="classOption" class="warp">
<ul class="item">
<div
v-for="(item, index) in data"
:key="index"
:class="activeIndex === index ? 'active' : ''"
@click="handleItemClick(item, index)"
>
<li class="list-item">
<el-row :gutter="16">
<el-col :span="6">
<img :src="getIconPath(item.typeId)" class="icon" />
</el-col>
<el-col :span="10">
<p class="name">{{ item.tpName }}</p>
<p class="time">{{ item.time }}</p>
</el-col>
<el-col :span="8">
<p class="value">
{{ formatValue(item.value) }}{{ item.unit }}
</p>
</el-col>
</el-row>
</li>
</div>
</ul>
</vue-seamless-scroll>
</div>
</template>
<script>
export default {
props: {
data: Array,
activeIndex: Number,
},
data() {
return {
classOption: {
singleHeight: 110,
hoverStop: true,
autoPlay: true,
},
};
},
methods: {
getIconPath(typeId) {
return require(`@/assets/images/screen/hjjc/${typeId}.png`);
},
formatValue(value) {
return value;
},
handleItemClick(item, index) {
this.$emit("item-click", item, index);
},
},
};
</script>
<style scoped>
/* 样式代码 */
</style>
<template>
<div class="monitor-container">
<!-- 左侧实时数据列表 -->
<RealTimeDataList :data="realTimeData" @item-click="handleItemClick" />
<!-- 中间地图区域 -->
<MonitorMap
:equipments="equipments"
:cameras="cameras"
@camera-click="handleCameraClick"
/>
<!-- 右侧图表区域 -->
<div class="right-panel">
<HistoryChart title="环境监测设备" :data="envChartData" />
<HistoryChart title="视频监测设备" :data="videoChartData" />
</div>
<!-- 弹窗组件 -->
<DataDetailModal
v-if="showDetailModal"
:data="selectedData"
@close="closeModal"
/>
<VideoModal
v-if="showVideoModal"
:video="selectedVideo"
@close="closeVideoModal"
/>
</div>
</template>
<script>
// 导入组件
import RealTimeDataList from "./components/RealTimeDataList";
import MonitorMap from "./components/MonitorMap";
import HistoryChart from "./components/HistoryChart";
import DataDetailModal from "./components/DataDetailModal";
import VideoModal from "./components/VideoModal";
// 导入API
import {
fetchRealTimeData,
fetchEquipmentData,
fetchCameraData,
fetchChartData,
} from "@/api/monitor";
export default {
components: {
RealTimeDataList,
MonitorMap,
HistoryChart,
DataDetailModal,
VideoModal,
},
data() {
return {
realTimeData: [],
equipments: [],
cameras: [],
envChartData: {},
videoChartData: {},
selectedData: null,
selectedVideo: null,
showDetailModal: false,
showVideoModal: false,
};
},
async created() {
await this.loadAllData();
},
methods: {
async loadAllData() {
try {
const [realTime, equipments, cameras, charts] = await Promise.all([
fetchRealTimeData(),
fetchEquipmentData(),
fetchCameraData(),
fetchChartData(),
]);
this.realTimeData = realTime;
this.equipments = equipments;
this.cameras = cameras;
this.envChartData = charts.env;
this.videoChartData = charts.video;
} catch (error) {
console.error("数据加载失败:", error);
}
},
handleItemClick(item) {
this.selectedData = item;
this.showDetailModal = true;
},
handleCameraClick(camera) {
this.selectedVideo = camera;
this.showVideoModal = true;
},
closeModal() {
this.showDetailModal = false;
},
closeVideoModal() {
this.showVideoModal = false;
},
},
};
</script>
<style scoped>
.monitor-container {
display: flex;
height: 100vh;
}
.right-panel {
display: flex;
flex-direction: column;
width: 300px;
}
</style>
......@@ -19,6 +19,7 @@
<div
class="sub-item"
:class="showMenu == 1 ? 'active' : ''"
key="rydw"
@click="changeMenu('rydw')"
>
<p>人员定位</p>
......@@ -26,7 +27,7 @@
<div
class="sub-item"
@click="changeMenu('hjjc')"
key=""
key="hjjc"
:class="showMenu == 2 ? 'active' : ''"
>
<p>监测监控</p>
......@@ -34,7 +35,7 @@
<div
class="sub-item"
@click="changeMenu('psxt')"
key=""
key="psxt"
:class="showMenu == 3 ? 'active' : ''"
>
<p>排水系统</p>
......@@ -42,9 +43,9 @@
</div>
<div class="sub-header-mid">
<div class="top-change">
<span @click="changeMenu('home')">首页</span>
<span @click="changeMenu('home')" key="home">首页</span>
<span @click="openVideo">企业宣传</span>
<span @click="changeMenu('tjfx')">系统分析</span>
<span @click="changeMenu('tjfx')" key="tjfx">系统分析</span>
<span @click="goToSys">后台管理</span>
</div>
</div>
......@@ -52,6 +53,7 @@
<div
class="sub-item"
:class="showMenu == 4 ? 'active' : ''"
key="tsj"
@click="changeMenu('tsj')"
>
<p>提升机系统</p>
......@@ -59,6 +61,7 @@
<div
class="sub-item"
:class="showMenu == 5 ? 'active' : ''"
key="tfxt"
@click="changeMenu('tfxt')"
>
<p>通风系统</p>
......@@ -66,6 +69,7 @@
<div
class="sub-item"
:class="showMenu == 6 ? 'active' : ''"
key="dlxt"
@click="changeMenu('dlxt')"
>
<p>电力系统</p>
......
<template>
<div>
<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"
></psxt> -->
<v-scale-screen
ref="scale-screen"
width="10390"
height="3117"
:fullScreen="false"
>
<!-- <dlxt
v-if="showMenu === 6"
style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
></dlxt> -->
<div class="container" :class="showMenu===0?'container0':''">
<!-- 头部 -->
<div class="header por">银洞坡金矿智能化综合管控平台</div>
<div class="sub-header">
<div class="sub-header-left">
<div
class="sub-item"
:class="showMenu == 1 ? 'active' : ''"
@click="changeMenu(1)"
>
<p>人员定位</p>
</div>
<div
class="sub-item"
@click="changeMenu(2)"
key=""
:class="showMenu == 2 ? 'active' : ''"
>
<p>环境监测</p>
</div>
<div
class="sub-item"
@click="changeMenu(3)"
key=""
:class="showMenu == 3 ? 'active' : ''"
>
<p>排水系统</p>
</div>
</div>
<div class="sub-header-mid">
<div class="top-change">
<span @click="changeMenu(0)">首页</span>
<span @click="openVideo">企业宣传</span>
<span @click="sysAnalysis">系统分析</span>
<span @click="goToSys">后台管理</span>
</div>
</div>
<div class="sub-header-right">
<div class="sub-item" :class="showMenu == 4 ? 'active' : ''" @click="changeMenu(4)"><p>提升机系统</p></div>
<div class="sub-item" :class="showMenu == 5 ? 'active' : ''" @click="changeMenu(5)"><p>风机系统</p></div>
<div class="sub-item" :class="showMenu == 6 ? 'active' : ''" @click="changeMenu(6)"><p>电力系统</p></div>
</div>
</div>
<!-- <rydw v-if="showMenu === 1" style="pointer-events: auto"></rydw>
<hjjc v-if="showMenu === 2" style="pointer-events: auto"></hjjc> -->
<!-- 底部 -->
<!-- <div class="footer">
</div> -->
</div>
</v-scale-screen>
</div>
</template>
<script>
// import * as echarts from "echarts";
// import { getScale } from "@/utils/tylerlcl";
import { listVideo } from "@/api/tyler/mainVideo";
import screenfull from "screenfull";
import rydw from "./items/rydw.vue";
import hjjc from "./items/hjjc.vue";
import psxt from "./items/psxt.vue";
import home from "./items/home.vue";
import dlxt from "./items/dlxt.vue";
export default {
name: "cockpit",
components: {
home,
rydw,
hjjc,
psxt,
dlxt,
},
data() {
return {
previewUrl: process.env.VUE_APP_API_TARGET,
showMenu: 0,
videoData:null,
};
},
mounted() {
this.getVideo()
if (screenfull && screenfull.enabled && !screenfull.isFullscreen) {
screenfull.request();
}
// this.areaCharts();
// this.alarm30();
},
methods: {
getVideo(){
this.videoData = null;
listVideo().then(res => {
this.videoData = this.previewUrl + res.data;
})
},
changeMenu(val) {
this.showMenu = val;
},
goToSys() {
var link = this.$router.resolve({
path: "/",
});
window.open(link.href);
return;
},
openVideo(){
window.open(this.videoData);
return;
},
sysAnalysis(){
},
},
};
</script>
<style lang="scss" scoped>
/* 标题 */
@font-face {
font-family: "ysbth";
src: url("~@/assets/font/syhtCN-Medium.ttf") format("truetype");
}
@font-face {
font-family: "number";
src: url("~@/assets/font/DS-Digital.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}
.por {
position: relative;
}
.poa {
position: absolute;
}
.psxt-bg {
background: url("~@/assets/images/screen/psxt/bg.png") no-repeat center;
}
/* 基础容器 */
.container {
width: 100%;
height: 100%;
background: url("~@/assets/images/bigscreen/bg.png");
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
display: flex;
flex-direction: column;
padding: 0 240px;
// background-color: #08152a;
position: relative;
font-family: "SimHei";
pointer-events: none;
color: #fff;
}
.container0{
background: url("~@/assets/images/bigscreen/border.png");
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
}
/* 头部标题 */
.header {
// height: 80px;
text-align: center;
// margin-bottom: 20px;
// background: linear-gradient(90deg, rgba(0,72,143,0.8) 0%, rgba(0,36,71,0.6) 100%);
display: flex;
align-items: center;
justify-content: center;
// font-size: 2.5vw;
letter-spacing: 2px;
font-family: SimHei;
// font-weight: 500;
font-size: 120px;
font-weight: bold;
color: #ffffff;
line-height: 240px;
background: -webkit-gradient(
linear,
left top,
left bottom,
from(#ffffff),
color-stop(39.7216796875%, #f3f7fa),
to(#03a9ff)
);
background: linear-gradient(
180deg,
#ffffff 0%,
#f3f7fa 39.7216796875%,
#03a9ff 100%
);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.sub-header {
display: flex;
justify-content: space-between;
padding: 0 60px;
// transform-style: preserve-3d;
perspective: 1000px;
// transform: translateZ(-10px);
pointer-events: auto;
}
.sub-header-left,
.sub-header-right {
display: flex;
justify-content: space-between;
width: 2000px;
margin-top: -150px;
.sub-item {
width: 484px;
height: auto;
background: url("~@/assets/images/bigscreen/button_normal.png") no-repeat center;
background-size: 100%;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
&.active {
background: url("~@/assets/images/bigscreen/button_click.png") no-repeat center;
background-size: 100%;
}
p {
font-family: Source Han Sans SC;
font-weight: bold;
font-size: 68px;
color: #ffffff;
line-height: 167px;
background: linear-gradient(
180deg,
#ffffff 0%,
#f3f7fa 39.7216796875%,
#03a9ff 100%
);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
padding-bottom: 20px;
}
}
}
.sub-header-left {
transform: rotateZ(2deg);
}
.sub-header-right {
transform: rotateZ(-2deg);
}
.top-change {
width: 1967px;
height: 300px;
background: url("~@/assets/images/bigscreen/top_bg.png") no-repeat center;
margin: -130px auto 0;
display: flex;
justify-content: space-evenly;
align-items: center;
font-size: 56px;
color: #11e0ff;
span {
cursor: pointer;
text-indent: 1em;
position: relative;
margin-top: 130px;
display: block;
}
span:nth-child(1)::after {
content: "";
width: 46px;
height: 46px;
position: absolute;
background: url("~@/assets/images/bigscreen/icon1.png") no-repeat center;
background-size: 100%;
left: -4px;
top: 10px;
z-index: 20;
}
span:nth-child(2)::after {
content: "";
width: 46px;
height: 46px;
position: absolute;
background: url("~@/assets/images/bigscreen/icon2.png") no-repeat center;
left: -4px;
top: 10px;
z-index: 20;
}
span:nth-child(3)::after {
content: "";
width: 46px;
height: 46px;
position: absolute;
background: url("~@/assets/images/bigscreen/icon3.png") no-repeat center;
left: -4px;
top: 10px;
z-index: 20;
}
span:nth-child(4)::after {
content: "";
width: 46px;
height: 46px;
position: absolute;
background: url("~@/assets/images/bigscreen/icon4.png") no-repeat center;
left: -4px;
top: 10px;
z-index: 20;
}
}
::v-deep .screen-box {
pointer-events: none;
}
</style>
This diff is collapsed.
// 设备位置配置
export const EQUIPMENT_POSITIONS = [
{
name: '一中避险硐室',
x: '85',
y: '153',
monitorPositionList: [
{ equipmentName: '一中避险硐室co', equipmentTy: '一氧化碳500', isWarning: 0 },
{ equipmentName: '一中避险硐室氧气', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '三中码头门',
x: '50',
y: '406',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '三中码头门风速', equipmentTy: '风速', isWarning: 0 },
{ equipmentName: '三中码头门风速', equipmentTy: '风速', isWarning: 0 }
]
},
{
name: '二中空压机房',
x: '258',
y: '299',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '二中空压机房co', equipmentTy: '一氧化碳500', isWarning: 0 },
{ equipmentName: '二中空压机房风速', equipmentTy: '风速', isWarning: 0 }
]
},
{
name: '东风井',
x: '856',
y: '136',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '东风井风速', equipmentTy: '风速', isWarning: 0 },
{ equipmentName: '东风井开停', equipmentTy: '开停', isWarning: 0 }
]
},
{
name: '二中避险硐室',
x: '75',
y: '288',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '二中避险硐室co', equipmentTy: '一氧化碳500', isWarning: 0 },
{ equipmentName: '二中避险硐室氧气', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '五中避险硐室',
x: '102',
y: '677',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '五中避险硐室co', equipmentTy: '一氧化碳500', isWarning: 0 },
{ equipmentName: '五中避险硐室氧气', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '四中避险硐室',
x: '96',
y: '541',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '四中避险硐室', equipmentTy: '一氧化碳1000', isWarning: 0 },
{ equipmentName: '四中避险硐室', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '四中车场',
x: '53',
y: '527',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '四中车场', equipmentTy: '一氧化碳1000', isWarning: 0 }
]
},
{
name: '一中主运输巷',
x: '185',
y: '164',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '一中主运输巷co', equipmentTy: '一氧化碳500', isWarning: 0 },
{ equipmentName: '一中主运输巷风速', equipmentTy: '风速', isWarning: 0 }
]
},
{
name: '二中主运输巷',
x: '187',
y: '296',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '二中主运输巷CO', equipmentTy: '一氧化碳1000', isWarning: 0 },
{ equipmentName: '二中主运输巷co', equipmentTy: '一氧化碳500', isWarning: 0 },
{ equipmentName: '二中主运输巷风速', equipmentTy: '风速', isWarning: 0 }
]
},
{
name: '二中中运输巷',
x: '316',
y: '303',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '二中中运输巷风速', equipmentTy: '风速', isWarning: 0 }
]
},
{
name: '三中避险硐室',
x: '93',
y: '411',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '三中避险硐室co', equipmentTy: '一氧化碳1000', isWarning: 0 },
{ equipmentName: '三中避险硐室氧气', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '五中车场',
x: '53',
y: '686',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '五中车场一氧化碳', equipmentTy: '一氧化碳1000', isWarning: 0 }
]
},
{
name: '一中风机',
x: '145',
y: '159',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '一中风机', equipmentTy: '一氧化碳1000', isWarning: 0 },
{ equipmentName: '一中风机氧气', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '一中西采区',
x: '341',
y: '192',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '一中西采区CO', equipmentTy: '一氧化碳1000', isWarning: 0 },
{ equipmentName: '一中西采区风速', equipmentTy: '风速', isWarning: 0 },
{ equipmentName: '一中西采区风机', equipmentTy: '开停', isWarning: 0 },
{ equipmentName: '一中西采区', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '三中运输巷',
x: '518',
y: '439',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '三中运输巷CO', equipmentTy: '一氧化碳1000', isWarning: 0 },
{ equipmentName: '三中运输巷风速', equipmentTy: '风速', isWarning: 0 },
{ equipmentName: '三中运输巷风机', equipmentTy: '开停', isWarning: 0 },
{ equipmentName: '三中运输巷氧气', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '三中西采',
x: '566',
y: '499',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '三中西采', equipmentTy: '一氧化碳1000', isWarning: 0 },
{ equipmentName: '三中西采', equipmentTy: '风速', isWarning: 0 },
{ equipmentName: '三中西采', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '四中运输巷',
x: '206',
y: '559',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '四中运输巷', equipmentTy: '一氧化碳1000', isWarning: 0 },
{ equipmentName: '四中运输巷', equipmentTy: '风速', isWarning: 0 },
{ equipmentName: '四中运输巷风机', equipmentTy: '开停', isWarning: 0 },
{ equipmentName: '四中运输巷', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '五中运输巷',
x: '166',
y: '697',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '五中运输巷', equipmentTy: '一氧化碳1000', isWarning: 0 },
{ equipmentName: '五中运输巷', equipmentTy: '风速', isWarning: 0 },
{ equipmentName: '五中运输巷风机', equipmentTy: '开停', isWarning: 0 },
{ equipmentName: '五中运输巷', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '一中运输巷',
x: '367',
y: '168',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '一中运输巷风机', equipmentTy: '开停', isWarning: 0 }
]
},
{
name: '二中西采区',
x: '237',
y: '339',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '二中西采区CO', equipmentTy: '一氧化碳1000', isWarning: 0 },
{ equipmentName: '二中西采区风速', equipmentTy: '风速', isWarning: 0 },
{ equipmentName: '二中西采区氧气', equipmentTy: '氧气', isWarning: 0 }
]
},
{
name: '二中运输巷',
x: '415',
y: '311',
isWarning: 0,
monitorPositionList: [
{ equipmentName: '二中运输巷风机', equipmentTy: '开停', isWarning: 0 }
]
}
];
// 摄像头位置配置
export const CAMERA_POSITIONS = [
{ status: 1, x: 50, y: 150, name: '一中码头门' },
{ status: 1, x: 53, y: 277, name: '二中码头门' },
{ status: 1, x: 82, y: 289, name: '二中水泵房' },
{ status: 1, x: 113, y: 297, name: '二中避险硐室' },
{ status: 1, x: 152, y: 294, name: '二中空压机房' },
{ status: 1, x: 71, y: 411, name: '三中码头门' }
];
\ No newline at end of file
This diff is collapsed.
......@@ -99,6 +99,9 @@ export default {
// 加载3D Tileset
Cesium.Cesium3DTileset.fromUrl("/terra_b3dms_yd/tileset.json", {
// Cesium.Cesium3DTileset.fromUrl(
// "http://localhost/terra_b3dms_yd/tileset.json",
// {
maximumScreenSpaceError: 1,
pickable: true,
})
......@@ -136,6 +139,19 @@ export default {
.then(() => {
// 添加标记点
this.addMarkers();
// 设置初始视角
this.viewer.camera.flyTo({
destination: Cesium.Cartesian3.fromDegrees(
113.43050560273339, // 经度
32.542908886167876, // 纬度
200 // 高度(米),数值越小视角越近
),
orientation: {
heading: Cesium.Math.toRadians(0), // 朝向角度
pitch: Cesium.Math.toRadians(-45), // 俯仰角度
roll: 0.0,
},
});
})
.catch((error) => {
console.error("模型加载失败:", error);
......
<template>
<div class="main-content">
<div class="content">
<!--一中23线风机dom-->
<!--一中23线风机dom-->
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'fengji' + item.deviceId"
v-show="item.deviceName == '一中23线风机'"
v-show="item.deviceName == '一中23线风机'"
style="top: 74px; left: 96px"
>
<div class="fengji-title">一中23线风机</div>
<div class="fengji-title">一中23线风机</div>
<div class="fengji-content">
<img
src="../../../assets/images/screen/tfxt/device1.png"
......@@ -88,15 +88,15 @@
<div class="arrow-psition" style="top: 132px; left: 1398px">
<div class="fengji-arrow"></div>
</div>
<!--一中扇风机dom-->
<!--一中扇风机dom-->
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'yizhong' + item.deviceId"
v-show="item.deviceName == '一中扇风机'"
v-show="item.deviceName == '一中扇风机'"
style="left: 760px; top: 74px"
>
<div class="fengji-title">一中扇风机</div>
<div class="fengji-title">一中扇风机</div>
<div class="fengji-content">
<img
src="../../../assets/images/screen/tfxt/device1.png"
......@@ -152,15 +152,15 @@
<p>气体温度:{{ item.gasTemperature }}</p>
</div>
</div>
<!--东风井风机dom-->
<!--东风井风机dom-->
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'dongfeng1' + item.deviceId"
v-show="item.deviceName == '东风井风机'"
v-show="item.deviceName == '东风井风机'"
style="right: 80px; top: 74px"
>
<div class="fengji-title" style="margin-left: 50px">东风井风机</div>
<div class="fengji-title" style="margin-left: 50px">东风井风机</div>
<div class="fengji-content">
<div class="fengji-control">
<div
......@@ -279,15 +279,15 @@
<p>流速:0m³/s</p>
</div>
</div>
<!--二中扇风机dom-->
<!--二中扇风机dom-->
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'erzhong' + item.deviceId"
v-show="item.deviceName == '二中扇风机'"
v-show="item.deviceName == '二中扇风机'"
style="left: 1160px; top: 247px"
>
<div class="fengji-title" style="margin-left: 50px">二中扇风机</div>
<div class="fengji-title" style="margin-left: 50px">二中扇风机</div>
<div class="fengji-content">
<div class="fengji-control">
<div
......@@ -353,15 +353,15 @@
<div class="arrow-psition bevel" style="top: 282px; left: 1490px">
<div class="fengji-arrow"></div>
</div>
<!--三中扇风机dom-->
<!--三中扇风机dom-->
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'sanzhong' + item.deviceId"
v-show="item.deviceName == '三中扇风机'"
v-show="item.deviceName == '三中扇风机'"
style="left: 660px; top: 415px"
>
<div class="fengji-title">三中扇风机</div>
<div class="fengji-title">三中扇风机</div>
<div class="fengji-content">
<img
src="../../../assets/images/screen/tfxt/device1.png"
......@@ -400,15 +400,15 @@
<p>设定频率:{{ item.setFrequency | decimalFilter }}HZ</p>
</div>
</div>
<!--四中扇风机dom-->
<!--四中扇风机dom-->
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'sizhong' + item.deviceId"
v-show="item.deviceName == '四中扇风机'"
v-show="item.deviceName == '四中扇风机'"
style="left: 1190px; top: 583px"
>
<div class="fengji-title" style="margin-left: 50px">四中扇风机</div>
<div class="fengji-title" style="margin-left: 50px">四中扇风机</div>
<div class="fengji-content">
<div class="fengji-control">
<div
......@@ -471,15 +471,15 @@
<div class="arrow-psition bevel" style="top: 642px; left: 1068px">
<div class="fengji-arrow"></div>
</div>
<!--五中扇风机dom-->
<!--五中扇风机dom-->
<div
class="fengji"
v-for="(item, index) in fengjiList"
:key="index + 'wuzhong' + item.deviceId"
v-show="item.deviceName == '五中扇风机'"
v-show="item.deviceName == '五中扇风机'"
style="left: 400px; top: 750px"
>
<div class="fengji-title">五中扇风机</div>
<div class="fengji-title">五中扇风机</div>
<div class="fengji-content">
<img
src="../../../assets/images/screen/tfxt/device1.png"
......
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
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