Merge pull request '小的细节优化' (#255) from LJ into dev

Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/255
This commit is contained in:
liaojie
2024-01-26 16:18:06 +00:00
4 changed files with 141 additions and 119 deletions

View File

@@ -1,10 +1,16 @@
<template>
<div id="edit-dialog">
<div class="distance-back">
<p>当前距离洞口{{ pointDistance_str }}</p>
<p>当前距离洞口
<span>
{{ pointDistance_str }}
</span>
</p>
<img src="/images/htmlEditDialog/back-icon.png" alt="" @click="handleCancel" />
</div>
<div class="equ-info">当前风压:{{ p }}Pa</div>
<div class="equ-info">当前风压:
<span>{{ p }}Pa</span>
</div>
<div class="setting">
<div class="setting-item">
<p>传感器类型</p>
@@ -187,10 +193,14 @@ const equipment = {
height: 35px;
font-size: 24px;
font-family: MicrosoftYaHei;
color: #ffffff;
color: white;
line-height: 35px;
}
span {
color: #f7b500;
}
img {
cursor: pointer;
}
@@ -205,9 +215,15 @@ const equipment = {
height: 35px;
font-size: 26px;
font-family: MicrosoftYaHei;
color: #f7b500;
color: white;
line-height: 35px;
margin: 20px 30px 0px 30px;
}
.equ-info span {
color: #f7b500;
}
.setting {
@@ -223,6 +239,10 @@ const equipment = {
line-height: 35px;
margin-bottom: 20px;
}
p:nth-child(2) {
color: #f7b500
}
}
:deep(.el-select) {

View File

@@ -73,75 +73,75 @@ function handleOtherEqu(targetPoint, equipmentInfo) {
this.scene.add(equMesh);
targetPoint.visible = false;
// targetPoint.hasWall = true;
allline.push(targetPoint.name)
if (hasWall == false) {
let findWallHang = new Array;
// console.log(targetPoint.name);
console.log(allline);
Allhang = allline.map(function (str) {
return parseInt(str.match(/\d+/)[0], 10);
})
console.log(Allhang);
//将取出来的所有行数字符串用一个新数组来保存,之后判断是不是存在同一行的(即相同的行数)
for (let i = 0; i < Allhang.length; i++) {
//判断是不是存在相同的行数,如果存在,则继续判断是不是存在左右的传感器
findWallHang.push(Allhang[i - 1])
if (findWallHang.includes(Allhang[i])) {
console.log(allline[i - 1].slice(-1));
console.log(allline[i].slice(-1));
wallHang = Allhang[i];
let sameHang = findWallHang.indexOf(Allhang[i])
if ((allline[sameHang - 1].slice(-1) == 'r' && allline[i].slice(-1) == 'l') || allline[sameHang - 1].slice(-1) == 'l' && allline[i].slice(-1) == 'r') {
console.log('进行添加操作');
// 将这二个符合添加规则的锚点给设一个属性,这样方便之后我们进行删除操作
// this.scene.getObjectByName(allline[i - 1]).hasWall = true
// this.scene.getObjectByName(allline[i]).hasWall = true
console.log(this.scene.getObjectByName(allline[i - 1]));
console.log(this.scene.getObjectByName(allline[i]));
//出现满足条件的风压阀了,这时候就设定为已经有墙了,不需要再添加了
hasWall = true
findWallHang = []
//进行添加操作,因为数值问题,所以我们分开进行添加操作
for (let line = Allhang[i]; line <= 20; line++) {
if (line < 10) {
let wall = 'wall_' + '0' + line
console.log(wall);
//把墙设为可见
this.scene.getObjectByName(wall).visible = true
let point = 'point_' + '00' + line + '_tc'
// console.log(this.scene.getObjectByName(point));
//把顶部的附着点设为隐藏!!!,然后设为不可选中
this.scene.getObjectByName(point).visible = false
this.scene.getObjectByName(point).layers.set(-2)
//如果最中间一行有设备,我们则需要将设备进行隐藏!!!
if (this.scene.getObjectByName(point).hasDevice == true) {
let EquID = this.scene.getObjectByName(point).info.id
this.scene.getObjectById(EquID).visible = false
}
} else if (line >= 10) {
let wall = 'wall_' + line
this.scene.getObjectByName(wall).visible = true
let point = 'point_' + '0' + line + '_tc'
this.scene.getObjectByName(point).visible = false
this.scene.getObjectByName(point).layers.set(-2)
if (this.scene.getObjectByName(point).hasDevice == true) {
let EquID = this.scene.getObjectByName(point).info.id
this.scene.getObjectById(EquID).visible = false
}
}
//处理21行的设备和附着点
let point = 'point_' + '0' + 21 + '_tc'
this.scene.getObjectByName(point).visible = false
this.scene.getObjectByName(point).layers.set(-2)
if (this.scene.getObjectByName(point).hasDevice == true) {
let EquID = this.scene.getObjectByName(point).info.id
this.scene.getObjectById(EquID).visible = false
}
}
}
}
}
}
// allline.push(targetPoint.name)
// if (hasWall == false) {
// let findWallHang = new Array;
// // console.log(targetPoint.name);
// console.log(allline);
// Allhang = allline.map(function (str) {
// return parseInt(str.match(/\d+/)[0], 10);
// })
// console.log(Allhang);
// //将取出来的所有行数字符串用一个新数组来保存,之后判断是不是存在同一行的(即相同的行数)
// for (let i = 0; i < Allhang.length; i++) {
// //判断是不是存在相同的行数,如果存在,则继续判断是不是存在左右的传感器
// findWallHang.push(Allhang[i - 1])
// if (findWallHang.includes(Allhang[i])) {
// console.log(allline[i - 1].slice(-1));
// console.log(allline[i].slice(-1));
// wallHang = Allhang[i];
// let sameHang = findWallHang.indexOf(Allhang[i])
// if ((allline[sameHang - 1].slice(-1) == 'r' && allline[i].slice(-1) == 'l') || allline[sameHang - 1].slice(-1) == 'l' && allline[i].slice(-1) == 'r') {
// console.log('进行添加操作');
// // 将这二个符合添加规则的锚点给设一个属性,这样方便之后我们进行删除操作
// // this.scene.getObjectByName(allline[i - 1]).hasWall = true
// // this.scene.getObjectByName(allline[i]).hasWall = true
// console.log(this.scene.getObjectByName(allline[i - 1]));
// console.log(this.scene.getObjectByName(allline[i]));
// //出现满足条件的风压阀了,这时候就设定为已经有墙了,不需要再添加了
// hasWall = true
// findWallHang = []
// //进行添加操作,因为数值问题,所以我们分开进行添加操作
// for (let line = Allhang[i]; line <= 20; line++) {
// if (line < 10) {
// let wall = 'wall_' + '0' + line
// console.log(wall);
// //把墙设为可见
// this.scene.getObjectByName(wall).visible = true
// let point = 'point_' + '00' + line + '_tc'
// // console.log(this.scene.getObjectByName(point));
// //把顶部的附着点设为隐藏!!!,然后设为不可选中
// this.scene.getObjectByName(point).visible = false
// this.scene.getObjectByName(point).layers.set(-2)
// //如果最中间一行有设备,我们则需要将设备进行隐藏!!!
// if (this.scene.getObjectByName(point).hasDevice == true) {
// let EquID = this.scene.getObjectByName(point).info.id
// this.scene.getObjectById(EquID).visible = false
// }
// } else if (line >= 10) {
// let wall = 'wall_' + line
// this.scene.getObjectByName(wall).visible = true
// let point = 'point_' + '0' + line + '_tc'
// this.scene.getObjectByName(point).visible = false
// this.scene.getObjectByName(point).layers.set(-2)
// if (this.scene.getObjectByName(point).hasDevice == true) {
// let EquID = this.scene.getObjectByName(point).info.id
// this.scene.getObjectById(EquID).visible = false
// }
// }
// //处理21行的设备和附着点
// let point = 'point_' + '0' + 21 + '_tc'
// this.scene.getObjectByName(point).visible = false
// this.scene.getObjectByName(point).layers.set(-2)
// if (this.scene.getObjectByName(point).hasDevice == true) {
// let EquID = this.scene.getObjectByName(point).info.id
// this.scene.getObjectById(EquID).visible = false
// }
// }
// }
// }
// }
// }
//处理风压阀的代码片段
// let lineIndex = targetPoint.name.slice(7, 9);
// if (allline.includes(Number(lineIndex))) {
@@ -218,47 +218,47 @@ function removeEquipment(targetPoint) {
//删除我们这里使用行数来判断,即是不是删除到了我们的那一行呢?
//如果删除到了我们那行的话我们必须将行的数组从中去掉已存在的数据然后将附着点列表中也去除这个点然后将墙设置为false来让下次使用
let lineIndex = targetPoint.name.slice(7, 9)
deleteItem(allline, targetPoint.name)
if (Number(lineIndex) == wallHang) {
wallHang = 0;
hasWall = false
for (let line = Number(lineIndex); line <= 20; line++) {
if (line < 10) {
let wall = 'wall_' + '0' + line
this.scene.getObjectByName(wall).visible = false
let point = 'point_' + '00' + line + '_tc'
console.log(this.scene.getObjectByName(point));
this.scene.getObjectByName(point).visible = true
this.scene.getObjectByName(point).layers.set(0)
if (this.scene.getObjectByName(point).hasDevice == true) {
this.scene.getObjectByName(point).visible = false
let EquID = this.scene.getObjectByName(point).info.id
this.scene.getObjectById(EquID).visible = true
}
} else if (line >= 10) {
let wall = 'wall_' + line
this.scene.getObjectByName(wall).visible = false
let point = 'point_' + '0' + line + '_tc'
this.scene.getObjectByName(point).visible = true
this.scene.getObjectByName(point).layers.set(0)
if (this.scene.getObjectByName(point).hasDevice == true) {
this.scene.getObjectByName(point).visible = false
let EquID = this.scene.getObjectByName(point).info.id
this.scene.getObjectById(EquID).visible = true
}
}
//处理21行的设备和附着点
let point = 'point_' + '0' + 21 + '_tc'
this.scene.getObjectByName(point).visible = true
this.scene.getObjectByName(point).layers.set(0)
if (this.scene.getObjectByName(point).hasDevice == true) {
let EquID = this.scene.getObjectByName(point).info.id
this.scene.getObjectById(EquID).visible = true
}
}
}
deleteItem(Allhang, Number(lineIndex))
// let lineIndex = targetPoint.name.slice(7, 9)
// deleteItem(allline, targetPoint.name)
// if (Number(lineIndex) == wallHang) {
// wallHang = 0;
// hasWall = false
// for (let line = Number(lineIndex); line <= 20; line++) {
// if (line < 10) {
// let wall = 'wall_' + '0' + line
// this.scene.getObjectByName(wall).visible = false
// let point = 'point_' + '00' + line + '_tc'
// console.log(this.scene.getObjectByName(point));
// this.scene.getObjectByName(point).visible = true
// this.scene.getObjectByName(point).layers.set(0)
// if (this.scene.getObjectByName(point).hasDevice == true) {
// this.scene.getObjectByName(point).visible = false
// let EquID = this.scene.getObjectByName(point).info.id
// this.scene.getObjectById(EquID).visible = true
// }
// } else if (line >= 10) {
// let wall = 'wall_' + line
// this.scene.getObjectByName(wall).visible = false
// let point = 'point_' + '0' + line + '_tc'
// this.scene.getObjectByName(point).visible = true
// this.scene.getObjectByName(point).layers.set(0)
// if (this.scene.getObjectByName(point).hasDevice == true) {
// this.scene.getObjectByName(point).visible = false
// let EquID = this.scene.getObjectByName(point).info.id
// this.scene.getObjectById(EquID).visible = true
// }
// }
// //处理21行的设备和附着点
// let point = 'point_' + '0' + 21 + '_tc'
// this.scene.getObjectByName(point).visible = true
// this.scene.getObjectByName(point).layers.set(0)
// if (this.scene.getObjectByName(point).hasDevice == true) {
// let EquID = this.scene.getObjectByName(point).info.id
// this.scene.getObjectById(EquID).visible = true
// }
// }
// }
// deleteItem(Allhang, Number(lineIndex))

View File

@@ -13,8 +13,8 @@ export function StreetSignTag(text = "", param = "", width = 250, height = 150)
ctx.fillRect(0, 0, width, height);
ctx.fillStyle = "white";
ctx.font = "20px serif";
ctx.fillText('隧道简称:' + text, (100 - text.length * 1) / 50, 40);
ctx.fillText('隧道长度:' + param + 'm', (100 - param.length * 1) / 50, 115);
ctx.fillText(' ' + text, (100 - text.length * 1) / 50, 40);
ctx.fillText(' 隧道长度:' + param + 'm', (100 - param.length * 1) / 50, 115);
ctx.strokeStyle = "white";
ctx.moveTo(0, 75);
ctx.lineTo(30000, 120);

View File

@@ -5,7 +5,7 @@
<div class="tunnel-title"></div>
<!-- <manage-length class="tunnel-length"></manage-length>-->
<div class="top-length">
<!-- <span>隧道总长度: {{ tunnelLength }}</span>-->
<!-- <span>隧道总长度: {{ tunnelLength }}</span>-->
<span>当前施工长度: {{ constructionLength }}</span>
</div>
<div class="top-right">
@@ -39,7 +39,7 @@
<el-drawer v-model="drawerLeft" direction="ltr" modal-class="modal-box" :modal="false" :show-close="false"
:close-on-click-modal="false" :close-on-press-escape="false">
<fan-info v-if="showFan" :list="socketData.leftData" :fan-data="largeScreenData"
:transducer-data="largeScreenData" :loading="showFanLoading" :tunnel-id="tunnelId"/>
:transducer-data="largeScreenData" :loading="showFanLoading" :tunnel-id="tunnelId" />
<used-ele v-if="showFan" :list="socketData.leftData" :ele-data="largeScreenData" />
</el-drawer>
<div v-if="drawerLeft" class="left-arrow" @click="closeLeft"></div>
@@ -245,7 +245,7 @@ const getScreenInfo = (id) => {
initSceneData(id).then((res) => {
tunnelLength.value = res.data.tunnelLength
constructionLength.value = res.data.constructionLength
serialNumber.value=res.data.serialNumber
serialNumber.value = res.data.serialNumber
initWebSocket();
})
}
@@ -350,7 +350,9 @@ const initWebSocket = () => {
socketData.sensor = data;
}
});
console.log(socketData);
}
};
//连接关闭的回调方法
socket.onclose = function () {