首页添加发光告警
This commit is contained in:
parent
8d5f129af6
commit
ea06d2d1d4
@ -65,6 +65,7 @@ const loadImages = async () => {
|
||||
await new Promise((resolve) => {
|
||||
mainImg.src = props.mainImage;
|
||||
mainImg.onload = resolve;
|
||||
mainImg.crossOrigin = "anonymous";
|
||||
});
|
||||
|
||||
overlays.value = await Promise.all(
|
||||
@ -73,6 +74,7 @@ const loadImages = async () => {
|
||||
await new Promise((resolve) => {
|
||||
img.src = config.url;
|
||||
img.onload = resolve;
|
||||
img.crossOrigin = "anonymous";
|
||||
});
|
||||
return {
|
||||
id: config.id,
|
||||
|
@ -133,7 +133,8 @@ function openchange(row: any) {
|
||||
let params = {
|
||||
systemcode: row.systemcode,
|
||||
signalId: row.signalId,
|
||||
type: row.deviceType,
|
||||
deviceType:row.deviceType,
|
||||
type:'yk',
|
||||
value: row.yxValue,
|
||||
}
|
||||
sendCommand(params).then((res: any) => {
|
||||
@ -202,7 +203,7 @@ onMounted(() => {
|
||||
<aside id="silderLeft">
|
||||
<div class="stationboard-box-title">
|
||||
<img src="@/assets/navigation/ty_bq.png" />
|
||||
<div class="imgname">声纹列表</div>
|
||||
<div class="imgname">数据列表</div>
|
||||
</div>
|
||||
<el-input v-model="areaName" clearable placeholder="请输入区域名称" @change="getSelect()" style="width: 100%;"
|
||||
class="videomonitor-input">
|
||||
@ -468,7 +469,7 @@ onMounted(() => {
|
||||
|
||||
// border: 1px solid #00427b;
|
||||
.oveyone {
|
||||
width: 375px;
|
||||
width: 370px;
|
||||
height: 220px;
|
||||
border: 1px solid #00427b;
|
||||
border-radius: 5px;
|
||||
|
@ -11,6 +11,106 @@
|
||||
<div class="loadingBox1">变电站三维模型加载中... 请稍候!</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 告警详情 -->
|
||||
<Eldialog v-if="giveAlarmDia" title="告警详情" :zIndex="2000" :width="'700px'" @before-close="giveAlarmDia = false">
|
||||
<template v-slot:PopFrameContent>
|
||||
<div class="examine">
|
||||
<img src="@/assets/giveanalarm/hecha.png" style="position: absolute;left: 0px;" v-if="AlarmMapOne.flag">
|
||||
<div class="examination-contont">
|
||||
<div style="display: flex; justify-content: center;width:100%;margin-top:20px;margin-bottom:10px;">
|
||||
<el-button class="searchButton1" @click.stop="previousPage" :disabled="Index + 1 == 1">
|
||||
<svg t="1686723317756" style=" transform: rotate(180deg);margin-right:5px" class="icon"
|
||||
viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2537"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink" width="14" height="14">
|
||||
<path
|
||||
d="M989.866667 482.133333L597.333333 110.933333c-17.066667-17.066667-42.666667-17.066667-59.733333 0-17.066667 17.066667-17.066667 42.666667 0 59.733334l315.733333 298.666666H64c-25.6 0-42.666667 17.066667-42.666667 42.666667s17.066667 42.666667 42.666667 42.666667H853.333333l-315.733333 298.666666c-17.066667 17.066667-17.066667 42.666667 0 59.733334 8.533333 8.533333 21.333333 12.8 29.866667 12.8 8.533333 0 21.333333-4.266667 29.866666-12.8l392.533334-371.2c8.533333-8.533333 12.8-21.333333 12.8-29.866667s-4.266667-21.333333-12.8-29.866667z"
|
||||
fill="currentColor" p-id="2538"></path>
|
||||
</svg>
|
||||
上一条</el-button>
|
||||
<el-button class="searchButton1"
|
||||
style="color:#009bff;font-size:14px;border:1px solid #009bff;padding:3px 5px;height:32px;">共{{
|
||||
Length }}条,当前为第{{ Index + 1 }}条</el-button>
|
||||
|
||||
<el-button class="searchButton1" @click.stop="nextPage" :disabled="Index + 1 == Length">
|
||||
下一条
|
||||
<svg t="1686723317756" style="margin-left:5px" class="icon" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="2537" xmlns:xlink="http://www.w3.org/1999/xlink" width="14"
|
||||
height="14">
|
||||
<path
|
||||
d="M989.866667 482.133333L597.333333 110.933333c-17.066667-17.066667-42.666667-17.066667-59.733333 0-17.066667 17.066667-17.066667 42.666667 0 59.733334l315.733333 298.666666H64c-25.6 0-42.666667 17.066667-42.666667 42.666667s17.066667 42.666667 42.666667 42.666667H853.333333l-315.733333 298.666666c-17.066667 17.066667-17.066667 42.666667 0 59.733334 8.533333 8.533333 21.333333 12.8 29.866667 12.8 8.533333 0 21.333333-4.266667 29.866666-12.8l392.533334-371.2c8.533333-8.533333 12.8-21.333333 12.8-29.866667s-4.266667-21.333333-12.8-29.866667z"
|
||||
fill="currentColor" p-id="2538"></path>
|
||||
</svg>
|
||||
|
||||
</el-button>
|
||||
|
||||
<!-- <el-button
|
||||
style="color:#009bff;font-size:14px;border:1px solid #009bff;padding:3px 5px;height:32px;background-color: rgba(8, 80, 58, 0.5)"
|
||||
@click.stop="nextPage" :disabled="Index + 1 == Length">
|
||||
下一个<img src="/src/assets/giveanalarm/jiantouright.png"></el-button> -->
|
||||
</div>
|
||||
<div class="examination-contont-title" style="margin-top:10px;"><span
|
||||
style="border-left:4px solid #FFBD00;display: inline-block;height: 10px;margin-right: 5px;"></span>告警信息
|
||||
</div>
|
||||
<div class="examine-contont-body">
|
||||
<div class="examine-contont-body-left">
|
||||
<div class="examine-contont-body-left-test">点位名称:{{ AlarmMapOne.deviceName }}</div>
|
||||
<div class="examine-contont-body-left-test">设备名称:{{ AlarmMapOne.mainDeviceName }}</div>
|
||||
<div class="examine-contont-body-left-test">部件名称:{{ AlarmMapOne.componentName }}</div>
|
||||
<div class="examine-contont-body-left-test">告警来源:
|
||||
<span v-if="AlarmMapOne.taskAlarmType == 1">巡视任务</span>
|
||||
<span v-if="AlarmMapOne.taskAlarmType == 2">静默任务</span>
|
||||
<span v-if="AlarmMapOne.taskAlarmType == 3">巡视设备</span>
|
||||
</div>
|
||||
<div class="examine-contont-body-left-test">告警等级:
|
||||
<span v-if="AlarmMapOne.alarmLevel == 1" style="color: #0099FF;">预警</span>
|
||||
<span v-if="AlarmMapOne.alarmLevel == 2" style="color: #FFFF00;">一般</span>
|
||||
<span v-if="AlarmMapOne.alarmLevel == 3" style="color: #FF9900;">严重</span>
|
||||
<span v-if="AlarmMapOne.alarmLevel == 4" style="color: #FF3300;">危急</span>
|
||||
</div>
|
||||
<div class="examine-contont-body-left-test" style="display: flex;">
|
||||
<div style="width:180px;">告警描述:</div>
|
||||
<div>{{ AlarmMapOne.content }}</div>
|
||||
</div>
|
||||
<div class="examine-contont-body-left-test">告警时间:{{ AlarmMapOne.alarmDate }}</div>
|
||||
</div>
|
||||
<div class="examine-contont-body-right">
|
||||
<!-- @click="pictureDetails" -->
|
||||
<div class="examine-contont-body-right-image" style="">
|
||||
<img v-if="AlarmMapOne.defectFilePath" src="@/assets/3d/xsri_fd.png" alt="">
|
||||
<el-image style="position: absolute;width:100%;height:100%; opacity: 0;"
|
||||
:src="url + '/previewimage?type=alarm&filename=' + encodeURI(AlarmMapOne.defectFilePath)"
|
||||
:zoom-rate="1.2"
|
||||
:preview-src-list="[url + '/previewimage?type=alarm&filename=' + encodeURI(AlarmMapOne.defectFilePath)]"
|
||||
:preview-teleported="true" fit="cover" />
|
||||
</div>
|
||||
<img class="examine-contont-body-right-img"
|
||||
:src="url + '/previewimage?type=alarm&filename=' + encodeURI(AlarmMapOne.defectFilePath)" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="examination-contont-title" style="margin-top: 20px;"><span
|
||||
style="border-left:4px solid #FFBD00;display: inline-block;height: 10px;margin-right: 5px;"></span>核查确认
|
||||
</div>
|
||||
<div class="examine-contont-body-left-test" style="display: flex; align-items: center;">
|
||||
<div style="width:85px;text-align: right;margin-right: 5px;">是否属实</div>
|
||||
<el-radio-group v-model="AlarmMapOne.checkResult" style="margin-left:8px;">
|
||||
<el-radio label="1">是</el-radio>
|
||||
<el-radio label="2">否</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div class="examine-contont-body-left-test" style="display: flex;align-items: start;">
|
||||
<div style="width:85px;text-align: right;margin-right: 5px;">反馈意见</div>
|
||||
<div style="width: 90%;margin-left:8px;"><el-input v-model="AlarmMapOne.checkComment" :rows="2"
|
||||
type="textarea" placeholder=" " /></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex w-full items-center justify-center mt-[20px]">
|
||||
<el-button @click.stop="giveAlarmDia = false, AlarmMap.length = 0"
|
||||
class="THREE-button1 mr-[30px]">取消</el-button>
|
||||
<el-button @click.stop="determination" class="THREE-button1">确定</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</Eldialog>
|
||||
</template>
|
||||
<script setup>
|
||||
|
||||
@ -19,7 +119,26 @@ import * as THREE from 'three'
|
||||
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls' // 控制器
|
||||
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js' // 控制器
|
||||
import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js' // 控制器
|
||||
const props =defineProps({
|
||||
import { EffectComposer } from "three/examples/jsm/postprocessing/EffectComposer"
|
||||
import { RenderPass } from "three/examples/jsm/postprocessing/RenderPass"
|
||||
import { OutlinePass } from "three/examples/jsm/postprocessing/OutlinePass"
|
||||
import { ShaderPass } from "three/examples/jsm/postprocessing/ShaderPass"
|
||||
import { GammaCorrectionShader } from 'three/examples/jsm/shaders/GammaCorrectionShader'
|
||||
// SMAA抗锯齿通道
|
||||
import { SMAAPass } from 'three/examples/jsm/postprocessing/SMAAPass'
|
||||
import { getSubstationById } from '@/api/substation'
|
||||
import { useUserStore } from '@/store/modules/user'
|
||||
import { getNotCheckAlarmCount } from '@/api/home';
|
||||
import { setAlarmLogStatus } from "@/api/alarmInfo";//告警信息获取
|
||||
import { ElMessage } from 'element-plus'
|
||||
import Eldialog from '@/components/seccmsdialog/eldialog.vue'
|
||||
import gaojing from '@/assets/3d/gaojing.png'
|
||||
import gaojing1 from '@/assets/3d/gaojing1.png'
|
||||
import gaojing2 from '@/assets/3d/gaojing2.png'
|
||||
|
||||
const userStore = useUserStore()
|
||||
const url = userStore.webApiBaseUrl;
|
||||
const props = defineProps({
|
||||
isautoRotate: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
@ -32,7 +151,7 @@ watch(() => props.isautoRotate, (newValue, oldValue) => {
|
||||
|
||||
let renderer = reactive(null) // 渲染器
|
||||
const draw = ref() // 场景div
|
||||
let scene = ref(null) // 场景
|
||||
let scene = reactive(null) // 场景
|
||||
const progress = ref(0) // 场景 - 加载进度条
|
||||
const loadSuccess = ref(true) // 场景 - 加载进度条 显示
|
||||
const clientWidth = ref()
|
||||
@ -84,7 +203,7 @@ function initRenderer() {
|
||||
renderer.setSize(draw.value.clientWidth, draw.value.clientHeight)
|
||||
// 初始化相机控制器
|
||||
controls = new OrbitControls(defaultCamera, renderer.domElement)
|
||||
controls.autoRotate = true // 是否自动旋转
|
||||
controls.autoRotate = false // 是否自动旋转
|
||||
controls.autoRotateSpeed = 1 // 旋转速度
|
||||
controls.screenSpacePanning = true
|
||||
draw.value.appendChild(renderer.domElement)
|
||||
@ -105,6 +224,7 @@ function animate() {
|
||||
function addmeth() {
|
||||
window.addEventListener('resize', resize, false)
|
||||
window.addEventListener('wheel', handleMouseWheel, false)
|
||||
window.addEventListener('click', portClick, false)
|
||||
}
|
||||
// 加载场景模型 gltf
|
||||
function initgltfLoader() {
|
||||
@ -121,6 +241,7 @@ function initgltfLoader() {
|
||||
const model = gltf.scene || gltf.scenes[0]
|
||||
const clips = gltf.animations || []
|
||||
setContent(model, clips)
|
||||
initData()
|
||||
loadSuccess.value = false
|
||||
}, (xhr) => {
|
||||
const percentage = Math.floor(xhr.loaded / xhr.total * 100)
|
||||
@ -175,7 +296,7 @@ function updateLights() {
|
||||
} else if (!state.addLights && lights.length) {
|
||||
removeLights();
|
||||
}
|
||||
if(renderer == null){
|
||||
if (renderer == null) {
|
||||
return
|
||||
}
|
||||
renderer.toneMappingExposure = state.exposure;
|
||||
@ -283,6 +404,7 @@ onMounted(() => {
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener('resize', resize)
|
||||
window.removeEventListener('wheel', handleMouseWheel)
|
||||
window.removeEventListener('click', portClick)
|
||||
//取消选中并且取消右键操作
|
||||
document.body.onselectstart = document.body.oncontextmenu = null
|
||||
removeObj(scene)
|
||||
@ -294,10 +416,391 @@ onBeforeUnmount(() => {
|
||||
cancelAnimationFrame(_animate)
|
||||
THREE.Cache.clear()
|
||||
})
|
||||
const dataJson = ref('') // Json数据
|
||||
const selType = ref('05')
|
||||
const data = ref('')
|
||||
const searchdata = ref('')
|
||||
const giveAnAlarm = ref('')
|
||||
const PoliceId = ref([])
|
||||
const luminescence = []
|
||||
let composer = null
|
||||
let outlinePass = null
|
||||
let spritedata = []
|
||||
// 报警发光
|
||||
function outlineObj() {
|
||||
composer = new EffectComposer(renderer)
|
||||
// 创建一个渲染器通道,场景和相机作为参数
|
||||
const renderPass = new RenderPass(scene, defaultCamera)
|
||||
// 将上面创建的渲染器通道添加到composer中
|
||||
composer.addPass(renderPass)
|
||||
// 定义一个二维向量,尺寸和场景的canvas画布保持一致
|
||||
// 将二维向量、屏幕和相机作为参数创建OutlinePass对象
|
||||
outlinePass = new OutlinePass(new THREE.Vector2(clientWidth.value, clientHeight.value), scene, defaultCamera)
|
||||
outlinePass.selectedObjects = luminescence
|
||||
outlinePass.renderToScreen = true
|
||||
//模型描边颜色,默认白色
|
||||
outlinePass.visibleEdgeColor.set('red')
|
||||
//高亮发光描边厚度
|
||||
outlinePass.edgeThickness = 5
|
||||
//高亮描边发光强度
|
||||
outlinePass.edgeStrength = 2
|
||||
//模型闪烁频率控制,默认0不闪烁
|
||||
outlinePass.pulsePeriod = 2
|
||||
outlinePass.edgeGlow = 5 // 发光
|
||||
// 添加到后处理对象composer中
|
||||
composer.addPass(outlinePass)
|
||||
// 创建伽马校正后处理通道
|
||||
// THREEjs并没有直接提供伽马校正的后处理通道,提供了一个伽马校正的Shader对象GammaCorrectionShader,
|
||||
// 这时候可以把Shader对象作为ShaderPass的参数创建一个通道。
|
||||
// 创建伽马校正后处理通道
|
||||
const gammaPass = new ShaderPass(GammaCorrectionShader)
|
||||
composer.addPass(gammaPass)
|
||||
|
||||
// // 使用后处理 模型会有锯齿
|
||||
// // 创建SMAAPass抗锯齿通道
|
||||
// // 获取.setPixelRatio()设置的设备像素比
|
||||
const pixelRatio = renderer.getPixelRatio()
|
||||
const smaaPass = new SMAAPass(clientWidth.value * pixelRatio, clientHeight.value * pixelRatio)
|
||||
composer.addPass(smaaPass)
|
||||
}
|
||||
function addSprite(selectedObjects) {
|
||||
const box = new THREE.Box3().setFromObject(selectedObjects)
|
||||
const center = box.getCenter(new THREE.Vector3())
|
||||
// 贴图
|
||||
|
||||
let sprite = new THREE.Sprite(new THREE.SpriteMaterial({
|
||||
map: new THREE.TextureLoader().load(gaojing),
|
||||
transparent: true
|
||||
}))
|
||||
const sprite1 = new THREE.Sprite(new THREE.SpriteMaterial({
|
||||
map: new THREE.TextureLoader().load(gaojing1),
|
||||
transparent: true
|
||||
}))
|
||||
const sprite2 = new THREE.Sprite(new THREE.SpriteMaterial({
|
||||
map: new THREE.TextureLoader().load(gaojing2),
|
||||
transparent: true
|
||||
}))
|
||||
sprite.scale.set(4, 4, 4)
|
||||
sprite.position.set(center.x, center.y + 6, center.z)
|
||||
sprite.userData.id = selectedObjects.uuid
|
||||
sprite.name = 'sprite1'
|
||||
scene.add(sprite)
|
||||
sprite1.scale.set(3, 3, 3)
|
||||
sprite1.position.set(center.x, center.y + 6, center.z)
|
||||
sprite1.userData.id = selectedObjects.uuid
|
||||
sprite1.name = 'sprite2'
|
||||
scene.add(sprite1)
|
||||
sprite2.scale.set(1.5, 1.5, 1.5)
|
||||
sprite2.position.set(center.x, center.y + 6, center.z)
|
||||
sprite2.userData.id = selectedObjects.uuid
|
||||
sprite2.name = 'sprite3'
|
||||
sprite2.userData.objinfo = selectedObjects.userData.objinfo
|
||||
scene.add(sprite2)
|
||||
spritedata.push(sprite)
|
||||
}
|
||||
// 取消报警
|
||||
function cancal(model) {
|
||||
outlineObj()
|
||||
for (let i = 0; i < scene.children.length; i++) {
|
||||
if (scene.children[i].type == 'Sprite') {
|
||||
if (scene.children[i].userData.id == model.uuid) {
|
||||
scene.children[i].traverse(function (obj) {
|
||||
if (obj.type === 'Mesh') {
|
||||
obj.geometry.dispose()
|
||||
obj.material.dispose()
|
||||
}
|
||||
})
|
||||
scene.remove(scene.children[i])
|
||||
i--
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
function Information(val) {
|
||||
const params = {
|
||||
stationId: userStore.stationId,
|
||||
}
|
||||
getNotCheckAlarmCount(params).then(resany => {
|
||||
giveAnAlarm.value = resany.data.notCheck
|
||||
|
||||
if (selType.value == '05') {
|
||||
for (var i = 0; i <= searchdata.value.length; i++) {
|
||||
if (searchdata.value[i] != undefined) {
|
||||
for (var j = 0; j <= resany.data.notCheck.length; j++) {
|
||||
if (resany.data.notCheck[j] != undefined) {
|
||||
if (resany.data.notCheck[j].componentId) {
|
||||
if (searchdata.value[i].objinfo.componentId == resany.data.notCheck[j].componentId) {
|
||||
PoliceId.value.push(searchdata.value[i].id)
|
||||
}
|
||||
} else if (resany.data.notCheck[j].mainDeviceId) {
|
||||
if (searchdata.value[i].objinfo.mainDeviceId == resany.data.notCheck[j].mainDeviceId) {
|
||||
PoliceId.value.push(searchdata.value[i].id)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (val == '01') {
|
||||
var newArr = [...new Set(PoliceId.value)];
|
||||
newArr.forEach((element) => {
|
||||
let model = scene.getObjectByProperty('uuid', element)
|
||||
// const box = new THREE.BoxHelper(model, '#fff000')
|
||||
// box.userData.uuid = model.uuid
|
||||
// scene.add(box)
|
||||
// 发光
|
||||
luminescence.push(model)
|
||||
outlineObj()
|
||||
// 贴图
|
||||
addSprite(model)
|
||||
})
|
||||
} else if (val == '03') {
|
||||
console.log('03')
|
||||
const policeId = ref([])
|
||||
for (var k = 0; k <= searchdata.value.length; k++) {
|
||||
if (searchdata.value[k] != undefined) {
|
||||
policeId.value.push(searchdata.value[k].id)
|
||||
var newArr = [...new Set(policeId.value)];
|
||||
newArr.forEach(element => {
|
||||
let model = scene.getObjectByProperty('uuid', element)
|
||||
luminescence.length = 0
|
||||
cancal(model)
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
var newArr = [...new Set(PoliceId.value)];
|
||||
newArr.forEach((element) => {
|
||||
|
||||
let model = scene.getObjectByProperty('uuid', element)
|
||||
// const box = new THREE.BoxHelper(model, '#fff000')
|
||||
// box.userData.uuid = model.uuid
|
||||
// scene.add(box)
|
||||
// 发光
|
||||
luminescence.push(model)
|
||||
outlineObj()
|
||||
// 贴图
|
||||
addSprite(model)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
|
||||
}
|
||||
// 加载JSON数据
|
||||
function initData() {
|
||||
const params = {
|
||||
stationId: userStore.stationId
|
||||
}
|
||||
getSubstationById(params).then((item) => {
|
||||
if (item.code == 0) {
|
||||
if (item.data.custom2) {
|
||||
dataJson.value = JSON.parse(item.data.custom2)
|
||||
if (dataJson.value.EquipmentComponentSettings != '') {
|
||||
if (selType.value == '05') {
|
||||
data.value = dataJson.value.EquipmentComponentSettings
|
||||
searchdata.value = JSON.parse(JSON.stringify(data.value))
|
||||
console.log(searchdata.value)
|
||||
Information('01')
|
||||
scene.children[1].traverse(function (obj) {
|
||||
data.value.forEach(element => {
|
||||
if (obj.userData.name == element.equipmentname) {
|
||||
obj.userData.type = 'EquipmentComponentSettings'
|
||||
obj.uuid = element.id
|
||||
obj.userData.objinfo = element.objinfo
|
||||
obj.userData.x = element.x
|
||||
obj.userData.y = element.y
|
||||
obj.userData.z = element.z
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
// 单击模型事件
|
||||
const AlarmMap = ref([])
|
||||
const AlarmMapOne = ref()
|
||||
const Index = ref(0)
|
||||
const Length = ref()
|
||||
const giveAlarmDia = ref(false)
|
||||
function portClick(event) {
|
||||
// 建立射线
|
||||
const vector = new THREE.Vector3()
|
||||
vector.set((event.layerX / clientWidth.value) * 2 - 1, -(event.layerY / clientHeight.value) * 2 + 1)
|
||||
const raycaster = new THREE.Raycaster()
|
||||
// // 建立一个空物体
|
||||
raycaster.setFromCamera(vector, activeCamera)
|
||||
raycaster.params.Line.threshold = 0.01
|
||||
const intersections = raycaster.intersectObjects(scene.children)
|
||||
if (intersections.length > 0) { // 判断参数[boxMesh]中模型对象是否与射线相交
|
||||
intersections.forEach(function (e) {
|
||||
var obj = e.object
|
||||
if (obj instanceof THREE.Sprite && obj.type == 'Sprite') {
|
||||
if (obj.name === "sprite3") {
|
||||
for (var i = 0; i <= giveAnAlarm.value.length; i++) {
|
||||
if (giveAnAlarm.value[i] != undefined && obj.userData.objinfo != undefined) {
|
||||
if (giveAnAlarm.value[i].componentId) {
|
||||
if (giveAnAlarm.value[i].componentId == obj.userData.objinfo.componentId) {
|
||||
AlarmMap.value.push(giveAnAlarm.value[i])
|
||||
} else if (giveAnAlarm.value[i].mainDeviceId && giveAnAlarm.value[i].mainDeviceId == undefined) {
|
||||
if (giveAnAlarm.value[i].mainDeviceId == obj.userData.objinfo.mainDeviceId) {
|
||||
AlarmMap.value.push(giveAnAlarm.value[i])
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
for (var i = 0; i < AlarmMap.value.length - 1; i++) {
|
||||
for (var j = i + 1; j < AlarmMap.value.length; j++) {
|
||||
if (AlarmMap.value[i].id == AlarmMap.value[j].id) {
|
||||
AlarmMap.value.splice(j, 1);
|
||||
j--;
|
||||
}
|
||||
}
|
||||
}
|
||||
for (var i = 0; i < AlarmMap.value.length; i++) {
|
||||
AlarmMap.value[i].flag = false
|
||||
AlarmMap.value[i].checkResult = '1'
|
||||
}
|
||||
Length.value = AlarmMap.value.length
|
||||
AlarmMapOne.value = AlarmMap.value[Index.value]
|
||||
Index.value = 0
|
||||
giveAlarmDia.value = true
|
||||
return
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
//核查
|
||||
function determination() {
|
||||
AlarmMapOne.value.checkFlag = 1
|
||||
AlarmMapOne.value.deviceId = AlarmMapOne.value.deviceid
|
||||
setAlarmLogStatus(AlarmMapOne.value).then(res => {
|
||||
if (res.code == 0) {
|
||||
ElMessage({
|
||||
type: 'success',
|
||||
message: '审核成功',
|
||||
})
|
||||
// if (AlarmMap.value.length > 1) {
|
||||
const allComponentId = ref([])
|
||||
const allMainDeviceId = ref([])
|
||||
const AlarmMapId = ref()
|
||||
const alarmId = ref()
|
||||
const policeId = ref([])
|
||||
AlarmMapId.value = AlarmMap.value.splice(Index.value, 1)
|
||||
Length.value = AlarmMap.value.length
|
||||
if (Index.value == AlarmMap.value.length) {
|
||||
Index.value = Index.value - 1
|
||||
AlarmMapOne.value = AlarmMap.value[Index.value]
|
||||
// AlarmMap.value[Index.value].flag = false
|
||||
} else {
|
||||
AlarmMapOne.value = AlarmMap.value[Index.value]
|
||||
}
|
||||
|
||||
alarmId.value = AlarmMapId.value[0]
|
||||
|
||||
for (var i = 0; i < AlarmMap.value.length; i++) {
|
||||
if (AlarmMap.value[i].componentId) {
|
||||
allComponentId.value.push(AlarmMap.value[i].componentId)
|
||||
} else if (AlarmMap.value[i].mainDeviceId) {
|
||||
allMainDeviceId.value.push(AlarmMap.value[i].mainDeviceId)
|
||||
}
|
||||
}
|
||||
var ComponentIds = [...new Set(allComponentId.value)];
|
||||
var MainDeviceIds = [...new Set(allMainDeviceId.value)];
|
||||
if (ComponentIds.indexOf(alarmId.value.componentId) == -1 && ComponentIds.length != 0 || MainDeviceIds.indexOf(alarmId.value.mainDeviceId) == -1 && MainDeviceIds.length != 0) {
|
||||
for (var k = 0; k <= searchdata.value.length; k++) {
|
||||
if (searchdata.value[k] != undefined && alarmId.value != undefined) {
|
||||
if (alarmId.value.componentId) {
|
||||
if (searchdata.value[k].objinfo.componentId == alarmId.value.componentId) {
|
||||
policeId.value.push(searchdata.value[k].id)
|
||||
}
|
||||
} else if (alarmId.value.componentId) {
|
||||
if (searchdata.value[k].objinfo.mainDeviceId == alarmId.value.mainDeviceId) {
|
||||
policeId.value.push(searchdata.value[k].id)
|
||||
}
|
||||
}
|
||||
if (policeId.value.length != 0) {
|
||||
var newArr = [...new Set(policeId.value)];
|
||||
newArr.forEach(element => {
|
||||
let model = scene.getObjectByProperty('uuid', element)
|
||||
for (var j = 0; j < luminescence.length; j++) {
|
||||
if (luminescence[j].uuid == model.uuid) {
|
||||
luminescence.splice(j, 1);
|
||||
cancal(model)
|
||||
return
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
} else if (ComponentIds.length == 0 && MainDeviceIds.length == 0) {
|
||||
for (var k = 0; k <= searchdata.value.length; k++) {
|
||||
if (searchdata.value[k] != undefined) {
|
||||
policeId.value.push(searchdata.value[k].id)
|
||||
var newArr = [...new Set(policeId.value)];
|
||||
newArr.forEach(element => {
|
||||
let model = scene.getObjectByProperty('uuid', element)
|
||||
luminescence.length = 0
|
||||
cancal(model)
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
if (AlarmMap.value.length == 0) {
|
||||
giveAlarmDia.value = false
|
||||
AlarmMap.length = 0
|
||||
}
|
||||
// Information()
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
//上一页
|
||||
function previousPage() {
|
||||
Index.value = Index.value - 1
|
||||
AlarmMapOne.value = AlarmMap.value[Index.value]
|
||||
}
|
||||
//下一页
|
||||
function nextPage() {
|
||||
Index.value = Index.value + 1
|
||||
AlarmMapOne.value = AlarmMap.value[Index.value]
|
||||
}
|
||||
//监听
|
||||
watch(() => userStore.giveanalarmInfo, (newValue, oldValue) => {
|
||||
Information('03')
|
||||
giveAnAlarm.value.push(JSON.parse(newValue))
|
||||
Length.value = Length.value + 1
|
||||
},
|
||||
{ deep: true })
|
||||
|
||||
|
||||
watch(() => userStore.trendsInfo, (newValue, oldValue) => {
|
||||
Information('02')
|
||||
const valueData = JSON.parse(newValue)
|
||||
for (var i = 0; i < AlarmMap.value.length; i++) {
|
||||
AlarmMap.value[i].flag = false
|
||||
if (AlarmMap.value[i].id == valueData.id) {
|
||||
AlarmMap.value[i].flag = true
|
||||
}
|
||||
}
|
||||
},
|
||||
{ deep: true })
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
#three_div {
|
||||
width: 100%;
|
||||
@ -317,6 +820,7 @@ onBeforeUnmount(() => {
|
||||
justify-content: center;
|
||||
z-index: 98;
|
||||
}
|
||||
|
||||
.loadingBox1 {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@ -438,4 +942,92 @@ onBeforeUnmount(() => {
|
||||
}
|
||||
}
|
||||
|
||||
.examine {
|
||||
.examination-title {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
color: #FFFFFF;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.examination-contont {
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
|
||||
.examination-contont-title {
|
||||
width: 100%;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: #009bff;
|
||||
}
|
||||
|
||||
.examine-contont-body-left-test {
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: #FFFFFF;
|
||||
margin-top: 10px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.examine-contont-body {
|
||||
width: 100%;
|
||||
height: 245px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.examine-contont-body-left {
|
||||
width: 60%;
|
||||
// border: 1px solid red;
|
||||
|
||||
.examine-contont-body-left-test {
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: #FFFFFF;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.examine-contont-body-right {
|
||||
width: 40%;
|
||||
position: relative;
|
||||
margin-top: -50px;
|
||||
|
||||
.examine-contont-body-right-image {
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
position: absolute;
|
||||
background-color: #0000007f;
|
||||
right: 8px;
|
||||
top: 8px;
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.examine-contont-body-right-img {
|
||||
width: 100%;
|
||||
height: 140px;
|
||||
object-fit: contain;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.searchButton1 {
|
||||
border: #009bff solid 1px !important;
|
||||
background-color: transparent !important;
|
||||
color: #fff !important;
|
||||
margin-left: 10px;
|
||||
}
|
||||
</style>
|
||||
|
@ -528,7 +528,7 @@ onBeforeUnmount(() => {
|
||||
// }
|
||||
clearInterval(tableTimer)
|
||||
})
|
||||
const isautoRotate = ref(true)
|
||||
const isautoRotate = ref(false)
|
||||
const isModelset = ref(false)
|
||||
|
||||
function autoRotateClick() {
|
||||
|
@ -99,7 +99,7 @@
|
||||
<div v-show="selType == '02'" class="three-right-list-main-icon">
|
||||
<img v-show="i.objinfo != undefined" src="@/assets/3d/xq.png" title="巡视点位信息" alt="巡视点位信息"
|
||||
@click.stop="informationClick(i), listClick(i, index)">
|
||||
<img v-if="!i.objinfo " src="@/assets/3d/sc_dis.png" title="实时视频" alt="实时视频">
|
||||
<img v-if="!i.objinfo" src="@/assets/3d/sc_dis.png" title="实时视频" alt="实时视频">
|
||||
<img v-else src="@/assets/3d/ks.png" title="实时视频-1" alt="实时视频-1" @click.stop="getDeviceVideo(i, 0)">
|
||||
<img v-show="i.objinfo == undefined" @click.stop src="@/assets/3d/xq_dis.png" title="巡视点位信息" alt="巡视点位信息">
|
||||
<img src="@/assets/navigation/u157.png" alt="" title="历史记录"
|
||||
@ -108,11 +108,11 @@
|
||||
<div v-show="selType == '05'" class="THREE-right-list-main-icon">
|
||||
<div style="display:flex;width:28px;height:28px;align-items: center;">
|
||||
<img src="@/assets/3d/xq.png" @click.stop="informationClick(i), listClick(i, index)" title="部件信息"
|
||||
alt="部件信息">
|
||||
<img src="@/assets/3d/xq1.png" @click.stop="getdevsignal(i), listClick(i, index)" title="点位和信号"
|
||||
alt="点位和信号">
|
||||
alt="部件信息">
|
||||
<img src="@/assets/3d/xq1.png" @click.stop="getdevsignal(i), listClick(i, index)" title="点位和信号"
|
||||
alt="点位和信号">
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
@ -171,7 +171,7 @@
|
||||
<!-- 详细信息弹窗 -->
|
||||
<div class="detailed-information" v-if="information">
|
||||
<div id="detailed-information" v-drag class="examination">
|
||||
<div class="examination-title" >{{ objRow.name }}</div>
|
||||
<div class="examination-title">{{ objRow.name }}</div>
|
||||
<div class="examination-close" @click.stop="information = false"><img src="@/assets/3d/u523.png" /></div>
|
||||
<div class="examination-contont" v-if="selType == '01'">
|
||||
<div class="examination-contont-text">设备编码:{{ objRow.userData.objinfo.patroldeviceCode }}</div>
|
||||
@ -459,96 +459,87 @@
|
||||
</Eldialog>
|
||||
<!-- 点位和信号 -->
|
||||
<Eldialog v-if="selectble" :title="'点位和信号'" :zIndex="2000" :width="'80%'" @before-close="selectbleClose">
|
||||
<template v-slot:PopFrameContent>
|
||||
<div class="device_box">
|
||||
<div class="box_tabs">
|
||||
<div :class="sourceType == 1 ? 'bianhua' : ''" @click="typeChange(1)">关联点位</div>
|
||||
<div :class="sourceType == 2 ? 'bianhua' : ''" @click="typeChange(2)">关联信号</div>
|
||||
</div>
|
||||
<div class="faulttemplate-box1">
|
||||
<div class="silderRight1">
|
||||
<div
|
||||
style="display: flex;display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; margin:15px 0px">
|
||||
<div style="display: flex;display: -webkit-flex; align-items: center;">
|
||||
<template v-slot:PopFrameContent>
|
||||
<div class="device_box">
|
||||
<div class="box_tabs">
|
||||
<div :class="sourceType == 1 ? 'bianhua' : ''" @click="typeChange(1)">关联点位</div>
|
||||
<div :class="sourceType == 2 ? 'bianhua' : ''" @click="typeChange(2)">关联信号</div>
|
||||
</div>
|
||||
<div class="faulttemplate-box1">
|
||||
<div class="silderRight1">
|
||||
<div
|
||||
style="display: flex;display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; margin:15px 0px">
|
||||
<div style="display: flex;display: -webkit-flex; align-items: center;">
|
||||
|
||||
<el-input v-if="sourceType == 1" v-model="paramstable.deviceName"
|
||||
placeholder="请输入巡视点位名称" @clear="getdevicedata1()" @change="getdevicedata1()"
|
||||
style="margin-right:15px ;width: 185px;" clearable />
|
||||
<el-input v-if="sourceType == 2" v-model="paramstable.signalName"
|
||||
placeholder="请输入信号名称" @clear="getdevicedata1()" @change="getdevicedata1()"
|
||||
style="margin-right:15px ;width: 185px;" clearable />
|
||||
<el-button class="searchButton" type="primary"
|
||||
@click="getdevicedata1()">搜索</el-button>
|
||||
<el-button class="searchButton" @click="resetting()">重置</el-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<el-table v-loading="devicedataloading" :data="devicedata" ref="tableref"
|
||||
style="width: 100%;height: calc(50vh); overflow: auto;margin-bottom: 15px;"
|
||||
row-key="deviceId" class="PatrolMonitoring" highlight-current-row default-expand-all
|
||||
:row-class-name="tableRowClassName"
|
||||
:header-cell-style="{ background: '#002b6a', color: '#B5D7FF', height: '50px' }">
|
||||
<el-table-column type="index" label="序号" width="50px" align="center" />
|
||||
<el-table-column v-if="sourceType == 1" label="巡视点位编号" prop="deviceCode" align="center"
|
||||
width="140"></el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="巡视点位名称" align="center"
|
||||
prop="deviceName"></el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="所属主设备" prop="mainDeviceName"
|
||||
align="center" width="120"></el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="主设备类型" prop="deviceType" align="center"
|
||||
width="120">
|
||||
<template #default="scope">
|
||||
<span>{{ currency(EquipmentType, scope.row.deviceType) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="所属部件" align="center" prop="componentName"
|
||||
width="160"></el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="表计类型" align="center" prop="meterType"
|
||||
width="100">
|
||||
<template #default="scope">
|
||||
<span>{{ currency(Metertype, scope.row.meterType) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="点位分类" align="center" width="100">
|
||||
<template #default="scope">
|
||||
<span>{{ currency(DeviceClass, scope.row.deviceClass) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column v-if="sourceType == 2" label="信号编号" align="center" prop="signalCode"
|
||||
width="100" />
|
||||
<el-table-column v-if="sourceType == 2" label="信号名称" align="center" prop="signalName"
|
||||
min-width="140" />
|
||||
<el-table-column v-if="sourceType == 2" label="信号单位" align="center" prop="signalUnit"
|
||||
width="80" />
|
||||
<el-table-column v-if="sourceType == 2" label="遥控遥调类型" align="center" prop="ykytType"
|
||||
width="150">
|
||||
<template #default="scope">
|
||||
<span>{{ isykyttype(scope.row.ykytType) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="sourceType == 2" label="是否告警信号" align="center" prop="signalType"
|
||||
width="100">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.signalType === '1'">是</span>
|
||||
<span v-else>否</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column v-if="sourceType == 2" label="遥信地址(yx)" align="center" prop="yxAddr" />
|
||||
<el-table-column v-if="sourceType == 2" label="遥测地址(yc)" align="center" prop="ycAddr" />
|
||||
<el-table-column v-if="sourceType == 2" label="遥控地址(yk)" align="center" prop="ykAddr" />
|
||||
<el-table-column v-if="sourceType == 2" label="遥调地址(yt)" align="center" prop="ytAddr" />
|
||||
|
||||
</el-table>
|
||||
<Page :total="devicetaotal" v-model:size="paramstable.size"
|
||||
v-model:current="paramstable.current" @pagination="getdevicedata1()"></Page>
|
||||
</div>
|
||||
</div>
|
||||
<el-input v-if="sourceType == 1" v-model="paramstable.deviceName" placeholder="请输入巡视点位名称"
|
||||
@clear="getdevicedata1()" @change="getdevicedata1()" style="margin-right:15px ;width: 185px;"
|
||||
clearable />
|
||||
<el-input v-if="sourceType == 2" v-model="paramstable.signalName" placeholder="请输入信号名称"
|
||||
@clear="getdevicedata1()" @change="getdevicedata1()" style="margin-right:15px ;width: 185px;"
|
||||
clearable />
|
||||
<el-button class="searchButton" type="primary" @click="getdevicedata1()">搜索</el-button>
|
||||
<el-button class="searchButton" @click="resetting()">重置</el-button>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</Eldialog>
|
||||
</div>
|
||||
<el-table v-loading="devicedataloading" :data="devicedata" ref="tableref"
|
||||
style="width: 100%;height: calc(50vh); overflow: auto;margin-bottom: 15px;" row-key="deviceId"
|
||||
class="PatrolMonitoring" highlight-current-row default-expand-all :row-class-name="tableRowClassName"
|
||||
:header-cell-style="{ background: '#002b6a', color: '#B5D7FF', height: '50px' }">
|
||||
<el-table-column type="index" label="序号" width="50px" align="center" />
|
||||
<el-table-column v-if="sourceType == 1" label="巡视点位编号" prop="deviceCode" align="center"
|
||||
width="140"></el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="巡视点位名称" align="center"
|
||||
prop="deviceName"></el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="所属主设备" prop="mainDeviceName" align="center"
|
||||
width="120"></el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="主设备类型" prop="deviceType" align="center" width="120">
|
||||
<template #default="scope">
|
||||
<span>{{ currency(EquipmentType, scope.row.deviceType) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="所属部件" align="center" prop="componentName"
|
||||
width="160"></el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="表计类型" align="center" prop="meterType" width="100">
|
||||
<template #default="scope">
|
||||
<span>{{ currency(Metertype, scope.row.meterType) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="sourceType == 1" label="点位分类" align="center" width="100">
|
||||
<template #default="scope">
|
||||
<span>{{ currency(DeviceClass, scope.row.deviceClass) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column v-if="sourceType == 2" label="信号编号" align="center" prop="signalCode" width="100" />
|
||||
<el-table-column v-if="sourceType == 2" label="信号名称" align="center" prop="signalName" min-width="140" />
|
||||
<el-table-column v-if="sourceType == 2" label="信号单位" align="center" prop="signalUnit" width="80" />
|
||||
<el-table-column v-if="sourceType == 2" label="遥控遥调类型" align="center" prop="ykytType" width="150">
|
||||
<template #default="scope">
|
||||
<span>{{ isykyttype(scope.row.ykytType) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="sourceType == 2" label="是否告警信号" align="center" prop="signalType" width="100">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.signalType === '1'">是</span>
|
||||
<span v-else>否</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column v-if="sourceType == 2" label="遥信地址(yx)" align="center" prop="yxAddr" />
|
||||
<el-table-column v-if="sourceType == 2" label="遥测地址(yc)" align="center" prop="ycAddr" />
|
||||
<el-table-column v-if="sourceType == 2" label="遥控地址(yk)" align="center" prop="ykAddr" />
|
||||
<el-table-column v-if="sourceType == 2" label="遥调地址(yt)" align="center" prop="ytAddr" />
|
||||
|
||||
</el-table>
|
||||
<Page :total="devicetaotal" v-model:size="paramstable.size" v-model:current="paramstable.current"
|
||||
@pagination="getdevicedata1()"></Page>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</Eldialog>
|
||||
<div id="contextimg">
|
||||
<img src="@/assets/3d/luminescence.svg" alt="">
|
||||
</div>
|
||||
@ -597,9 +588,9 @@
|
||||
</template>
|
||||
<script setup>
|
||||
import { getdata, getArea } from '@/api/monitordevice'
|
||||
import { getDeviceByType,getdevicedata,getMainEquipment,getBayType } from "@/api/device";
|
||||
import { getDeviceByType, getdevicedata, getMainEquipment, getBayType } from "@/api/device";
|
||||
import {
|
||||
queryDeviceSignal
|
||||
queryDeviceSignal
|
||||
} from '@/api/equipmentsignal';
|
||||
import dayjs from 'dayjs'
|
||||
import JessibucaPlayer from '@/components/jessibuca/index1.vue' // 视频
|
||||
@ -745,6 +736,7 @@ function Information(val) {
|
||||
|
||||
if (val == '01') {
|
||||
var newArr = [...new Set(PoliceId.value)];
|
||||
|
||||
newArr.forEach((element) => {
|
||||
let model = scene.getObjectByProperty('uuid', element)
|
||||
// const box = new THREE.BoxHelper(model, '#fff000')
|
||||
@ -765,7 +757,6 @@ function Information(val) {
|
||||
newArr.forEach(element => {
|
||||
let model = scene.getObjectByProperty('uuid', element)
|
||||
luminescence.length = 0
|
||||
// outlineObj()// 发光
|
||||
cancal(model)
|
||||
|
||||
})
|
||||
@ -775,6 +766,7 @@ function Information(val) {
|
||||
var newArr = [...new Set(PoliceId.value)];
|
||||
newArr.forEach((element) => {
|
||||
let model = scene.getObjectByProperty('uuid', element)
|
||||
console.log(model)
|
||||
// const box = new THREE.BoxHelper(model, '#fff000')
|
||||
// box.userData.uuid = model.uuid
|
||||
// scene.add(box)
|
||||
@ -792,9 +784,9 @@ function Information(val) {
|
||||
}
|
||||
const recognitionType = ref([])
|
||||
function getTypeTwo() {
|
||||
getDeviceByType({ dictcode: 'recognition_type' }).then((res) => {
|
||||
recognitionType.value = res.data
|
||||
})
|
||||
getDeviceByType({ dictcode: 'recognition_type' }).then((res) => {
|
||||
recognitionType.value = res.data
|
||||
})
|
||||
}
|
||||
// 页面退出
|
||||
onBeforeUnmount(() => {
|
||||
@ -1623,6 +1615,7 @@ function initData() {
|
||||
if (selType.value == '05') {
|
||||
data.value = dataJson.value.EquipmentComponentSettings
|
||||
searchdata.value = JSON.parse(JSON.stringify(data.value))
|
||||
console.log(searchdata.value)
|
||||
Information('01')
|
||||
scene.children[1].traverse(function (obj) {
|
||||
data.value.forEach(element => {
|
||||
@ -2618,49 +2611,49 @@ const Metertype = ref([])
|
||||
const mainEquipment = ref([])
|
||||
// 获取弹窗所需数据
|
||||
function notification() {
|
||||
// 所属主设备
|
||||
const params = {
|
||||
bayId: bayId.value
|
||||
}
|
||||
getMainEquipment(params).then((res) => {
|
||||
mainEquipment.value = res.data
|
||||
});
|
||||
//间隔下所属部件
|
||||
const paramsbayId = {
|
||||
bayId: bayId.value
|
||||
}
|
||||
getBayType(paramsbayId).then((res) => {
|
||||
getacaTypeBayId.value = res.data
|
||||
})
|
||||
// 表计类型
|
||||
getDeviceByType({ dictcode: 'MeterType' }).then((res) => {
|
||||
Metertype.value = res.data
|
||||
})
|
||||
//点位分类
|
||||
getDeviceByType({ dictcode: 'DeviceClass' }).then((res) => {
|
||||
DeviceClass.value = res.data
|
||||
})
|
||||
//主设备类型
|
||||
getDeviceByType({ dictcode: 'EquipmentType' }).then((res) => {
|
||||
EquipmentType.value = res.data
|
||||
})
|
||||
getDeviceByType({ dictcode: 'ykytType' }).then((ress) => {
|
||||
typeoptions.value = ress.data
|
||||
})
|
||||
// 所属主设备
|
||||
const params = {
|
||||
bayId: bayId.value
|
||||
}
|
||||
getMainEquipment(params).then((res) => {
|
||||
mainEquipment.value = res.data
|
||||
});
|
||||
//间隔下所属部件
|
||||
const paramsbayId = {
|
||||
bayId: bayId.value
|
||||
}
|
||||
getBayType(paramsbayId).then((res) => {
|
||||
getacaTypeBayId.value = res.data
|
||||
})
|
||||
// 表计类型
|
||||
getDeviceByType({ dictcode: 'MeterType' }).then((res) => {
|
||||
Metertype.value = res.data
|
||||
})
|
||||
//点位分类
|
||||
getDeviceByType({ dictcode: 'DeviceClass' }).then((res) => {
|
||||
DeviceClass.value = res.data
|
||||
})
|
||||
//主设备类型
|
||||
getDeviceByType({ dictcode: 'EquipmentType' }).then((res) => {
|
||||
EquipmentType.value = res.data
|
||||
})
|
||||
getDeviceByType({ dictcode: 'ykytType' }).then((ress) => {
|
||||
typeoptions.value = ress.data
|
||||
})
|
||||
|
||||
}
|
||||
const selectble = ref(false)
|
||||
function selectbleClose() {
|
||||
selectble.value = false
|
||||
sourceType.value = 0
|
||||
devicedata.value.length = 0
|
||||
selectble.value = false
|
||||
sourceType.value = 0
|
||||
devicedata.value.length = 0
|
||||
}
|
||||
const mainDeviceId= ref('')
|
||||
function getdevsignal(row){
|
||||
const mainDeviceId = ref('')
|
||||
function getdevsignal(row) {
|
||||
console.log(row)
|
||||
if(row.objinfo.componentId){
|
||||
if (row.objinfo.componentId) {
|
||||
componentId.value = row.objinfo.componentId
|
||||
}else{
|
||||
} else {
|
||||
componentId.value = ''
|
||||
mainDeviceId.value = row.objinfo.mainDeviceId
|
||||
}
|
||||
@ -2671,69 +2664,69 @@ function getdevsignal(row){
|
||||
}
|
||||
const sourceType = ref(1)
|
||||
function typeChange(val) {
|
||||
sourceType.value = val
|
||||
getdevicedata1()
|
||||
sourceType.value = val
|
||||
getdevicedata1()
|
||||
}
|
||||
const componentId= ref('')
|
||||
const componentId = ref('')
|
||||
const bayId = ref('')
|
||||
const devicedataloading = ref(false)
|
||||
const devicetaotal = ref()
|
||||
const devicedata = ref([])
|
||||
const paramstable = ref({
|
||||
size: 10,
|
||||
current: 1,
|
||||
deviceName: '',
|
||||
componentId: ''
|
||||
size: 10,
|
||||
current: 1,
|
||||
deviceName: '',
|
||||
componentId: ''
|
||||
})
|
||||
function getdevicedata1() {
|
||||
if (sourceType.value == 1) {
|
||||
paramstable.value.bayId = bayId.value
|
||||
if(componentId.value){
|
||||
paramstable.value.componentId = componentId.value
|
||||
paramstable.value.mainComponentId = ''
|
||||
}else{
|
||||
paramstable.value.mainDeviceId = mainDeviceId.value
|
||||
}
|
||||
|
||||
getdevicedata(paramstable.value).then((res) => {
|
||||
devicedata.value = res.data.records
|
||||
devicetaotal.value = res.data.total
|
||||
paramstable.value.size = res.data.size
|
||||
paramstable.value.current = res.data.current
|
||||
devicedataloading.value = false
|
||||
|
||||
|
||||
})
|
||||
} else if (sourceType.value == 2) {
|
||||
if(componentId.value){
|
||||
paramstable.value.componentId = ''
|
||||
paramstable.value.mainComponentId = componentId.value
|
||||
}else{
|
||||
paramstable.value.mainDeviceId = mainDeviceId.value
|
||||
}
|
||||
|
||||
queryDeviceSignal(paramstable.value).then((res) => {
|
||||
devicedata.value = res.data.records
|
||||
devicetaotal.value = res.data.total
|
||||
paramstable.value.size = res.data.size
|
||||
paramstable.value.current = res.data.current
|
||||
devicedataloading.value = false
|
||||
})
|
||||
if (sourceType.value == 1) {
|
||||
paramstable.value.bayId = bayId.value
|
||||
if (componentId.value) {
|
||||
paramstable.value.componentId = componentId.value
|
||||
paramstable.value.mainComponentId = ''
|
||||
} else {
|
||||
paramstable.value.mainDeviceId = mainDeviceId.value
|
||||
}
|
||||
devicedataloading.value = true
|
||||
|
||||
getdevicedata(paramstable.value).then((res) => {
|
||||
devicedata.value = res.data.records
|
||||
devicetaotal.value = res.data.total
|
||||
paramstable.value.size = res.data.size
|
||||
paramstable.value.current = res.data.current
|
||||
devicedataloading.value = false
|
||||
|
||||
|
||||
})
|
||||
} else if (sourceType.value == 2) {
|
||||
if (componentId.value) {
|
||||
paramstable.value.componentId = ''
|
||||
paramstable.value.mainComponentId = componentId.value
|
||||
} else {
|
||||
paramstable.value.mainDeviceId = mainDeviceId.value
|
||||
}
|
||||
|
||||
queryDeviceSignal(paramstable.value).then((res) => {
|
||||
devicedata.value = res.data.records
|
||||
devicetaotal.value = res.data.total
|
||||
paramstable.value.size = res.data.size
|
||||
paramstable.value.current = res.data.current
|
||||
devicedataloading.value = false
|
||||
})
|
||||
}
|
||||
devicedataloading.value = true
|
||||
|
||||
|
||||
|
||||
}
|
||||
function resetting() {
|
||||
paramstable.value = {
|
||||
size: 10,
|
||||
current: 1,
|
||||
deviceName: '',
|
||||
mainDeviceId: '',
|
||||
componentId: ''
|
||||
}
|
||||
getdevicedata1()
|
||||
paramstable.value = {
|
||||
size: 10,
|
||||
current: 1,
|
||||
deviceName: '',
|
||||
mainDeviceId: '',
|
||||
componentId: ''
|
||||
}
|
||||
getdevicedata1()
|
||||
}
|
||||
//点位历史记录
|
||||
const history = ref(false)
|
||||
@ -2746,12 +2739,12 @@ const historParams = ref({
|
||||
endDate: ''
|
||||
})
|
||||
function gettoday() {
|
||||
// 获取今天0点
|
||||
let startTime = dayjs().startOf('day').format('YYYY-MM-DD HH:mm:ss')
|
||||
// 获取当前时间
|
||||
let endTime = dayjs().format('YYYY-MM-DD HH:mm:ss')
|
||||
timeSlot.value[0] = startTime
|
||||
timeSlot.value[1] = endTime
|
||||
// 获取今天0点
|
||||
let startTime = dayjs().startOf('day').format('YYYY-MM-DD HH:mm:ss')
|
||||
// 获取当前时间
|
||||
let endTime = dayjs().format('YYYY-MM-DD HH:mm:ss')
|
||||
timeSlot.value[0] = startTime
|
||||
timeSlot.value[1] = endTime
|
||||
}
|
||||
const historydata = ref([])
|
||||
const hisloading = ref(false)
|
||||
@ -2811,14 +2804,14 @@ function currency(list, itemcode) {
|
||||
}
|
||||
const typeoptions = ref([])
|
||||
function isykyttype(val) {
|
||||
let name = ''
|
||||
for (let i = 0; i < typeoptions.value.length; i++) {
|
||||
if (typeoptions.value[i].itemcode === val) {
|
||||
name = typeoptions.value[i].dictname
|
||||
break
|
||||
}
|
||||
let name = ''
|
||||
for (let i = 0; i < typeoptions.value.length; i++) {
|
||||
if (typeoptions.value[i].itemcode === val) {
|
||||
name = typeoptions.value[i].dictname
|
||||
break
|
||||
}
|
||||
return name
|
||||
}
|
||||
return name
|
||||
}
|
||||
const MeterTypeList = ref([])
|
||||
function getType() {
|
||||
@ -3067,7 +3060,6 @@ function determination() {
|
||||
for (var j = 0; j < luminescence.length; j++) {
|
||||
if (luminescence[j].uuid == model.uuid) {
|
||||
luminescence.splice(j, 1);
|
||||
// outlineObj()// 发光
|
||||
cancal(model)
|
||||
return
|
||||
}
|
||||
@ -3084,7 +3076,6 @@ function determination() {
|
||||
newArr.forEach(element => {
|
||||
let model = scene.getObjectByProperty('uuid', element)
|
||||
luminescence.length = 0
|
||||
// outlineObj()// 发光
|
||||
cancal(model)
|
||||
|
||||
})
|
||||
@ -3798,84 +3789,86 @@ function nextPage() {
|
||||
:deep(.el-radio__input.is-checked + .el-radio__label) {
|
||||
color: #009bff !important;
|
||||
}
|
||||
|
||||
.device_box {
|
||||
width: 100%;
|
||||
width: 100%;
|
||||
|
||||
.box_tabs {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #0099ff;
|
||||
border-radius: 5px 0px 0px 0px;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 20px;
|
||||
|
||||
div {
|
||||
padding: 10px 20px 10px 24px;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.bianhua {
|
||||
padding: 10px 20px 10px 20px !important;
|
||||
border-bottom: 4px solid #0099ff;
|
||||
color: #0099ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.faulttemplate-box1 {
|
||||
.box_tabs {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #f2f4f900;
|
||||
border-bottom: 1px solid #0099ff;
|
||||
border-radius: 5px 0px 0px 0px;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 20px;
|
||||
|
||||
div {
|
||||
padding: 10px 20px 10px 24px;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.bianhua {
|
||||
padding: 10px 20px 10px 20px !important;
|
||||
border-bottom: 4px solid #0099ff;
|
||||
color: #0099ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.faulttemplate-box1 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #f2f4f900;
|
||||
padding: 15px;
|
||||
|
||||
.silderLeft1 {
|
||||
width: 300px;
|
||||
height: calc(65vh);
|
||||
box-sizing: border-box;
|
||||
background: url(@/assets/navigation/ty_260x988.png);
|
||||
background-size: 100% 100%;
|
||||
padding: 10px;
|
||||
|
||||
.displayflex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.line {
|
||||
width: 5px;
|
||||
height: 14px;
|
||||
background: #0099ff;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.title {
|
||||
text-decoration: none !important;
|
||||
font-family: "阿里妈妈数黑体 Bold";
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px !important;
|
||||
color: rgb(255, 255, 255);
|
||||
line-height: 12px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.silderRight1 {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
height: calc(65vh);
|
||||
overflow: auto;
|
||||
padding: 15px;
|
||||
|
||||
.silderLeft1 {
|
||||
width: 300px;
|
||||
height: calc(65vh);
|
||||
box-sizing: border-box;
|
||||
background: url(@/assets/navigation/ty_260x988.png);
|
||||
background-size: 100% 100%;
|
||||
padding: 10px;
|
||||
|
||||
.displayflex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.line {
|
||||
width: 5px;
|
||||
height: 14px;
|
||||
background: #0099ff;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.title {
|
||||
text-decoration: none !important;
|
||||
font-family: "阿里妈妈数黑体 Bold";
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px !important;
|
||||
color: rgb(255, 255, 255);
|
||||
line-height: 12px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.silderRight1 {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
height: calc(65vh);
|
||||
overflow: auto;
|
||||
padding: 15px;
|
||||
box-sizing: border-box;
|
||||
margin-left: 15px;
|
||||
background: url(@/assets/navigation/ty_1614x988.png);
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
box-sizing: border-box;
|
||||
margin-left: 15px;
|
||||
background: url(@/assets/navigation/ty_1614x988.png);
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user