Skip to content

Z
zghywpc-vue
Commit 6be14290 authored by 李苏's avatar 李苏 💬
Browse files
Options

中广

parent 7558f9db
Hide whitespace changes
Inline Side-by-side
Showing with 1123 additions and 1064 deletions
src/views/fmegl/fmekpigl/index.vue
View file @ 6be14290
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
* @Author: lisu lisu@gavelinfo.com * @Author: lisu lisu@gavelinfo.com
* @Date: 2024-09-19 10:55:27 * @Date: 2024-09-19 10:55:27
* @LastEditors: lisu lisu@gavelinfo.com * @LastEditors: lisu lisu@gavelinfo.com
* @LastEditTime: 2024-10-30 10:15:06 * @LastEditTime: 2024-12-27 10:23:04
* @FilePath: /zghywpc-vue/src/views/fmegl/fmekpigl/index.vue * @FilePath: /zghywpc-vue/src/views/fmegl/fmekpigl/index.vue
--> -->
<template> <template>
...@@ -42,6 +42,12 @@ ...@@ -42,6 +42,12 @@
} }
</script> </script>
<style >
#LOADING {
display: none!important;
}
</style>
<style lang="scss" scoped> <style lang="scss" scoped>
.fmezbpgl { .fmezbpgl {
position: relative position: relative
......
src/views/fmegl/fmekpigl/tu/index.vue
View file @ 6be14290
...@@ -91,6 +91,9 @@ ...@@ -91,6 +91,9 @@
} }
}, },
beforeDestroy() {
clearInterval(this.timer)
},
mounted() { mounted() {
this.$nextTick(() => { this.$nextTick(() => {
this.edckpi = this.$echarts.init(this.$refs.dckpi) this.edckpi = this.$echarts.init(this.$refs.dckpi)
...@@ -99,9 +102,9 @@ ...@@ -99,9 +102,9 @@
this.efmetj = this.$echarts.init(this.$refs.fmetj) this.efmetj = this.$echarts.init(this.$refs.fmetj)
/* 生成图表*/ /* 生成图表*/
this.initAll() this.initAll()
// this.timer = setInterval(() => { this.timer = setInterval(() => {
// this.initAll() this.initAll()
// }, 1000 * 10) }, 1000 * 5)
}) })
}, },
......
src/views/fmegl/fmezbpgl/index.vue
View file @ 6be14290
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
* @Author: lisu lisu@gavelinfo.com * @Author: lisu lisu@gavelinfo.com
* @Date: 2024-09-19 10:55:27 * @Date: 2024-09-19 10:55:27
* @LastEditors: lisu lisu@gavelinfo.com * @LastEditors: lisu lisu@gavelinfo.com
* @LastEditTime: 2024-10-29 15:28:24 * @LastEditTime: 2024-12-27 10:19:42
* @FilePath: /zghywpc-vue/src/views/fmegl/fmezbpgl/index.vue * @FilePath: /zghywpc-vue/src/views/fmegl/fmezbpgl/index.vue
--> -->
<template> <template>
...@@ -41,7 +41,11 @@ ...@@ -41,7 +41,11 @@
} }
</script> </script>
<style >
#LOADING {
display: none!important;
}
</style>
<style lang="scss" scoped> <style lang="scss" scoped>
.fmezbpgl { .fmezbpgl {
position: relative position: relative
......
src/views/fmegl/fmezbpgl/tu/index.vue
View file @ 6be14290
...@@ -232,6 +232,7 @@ ...@@ -232,6 +232,7 @@
export default { export default {
data() { data() {
return { return {
timer:null,
optionsData: [{ optionsData: [{
id: 1, id: 1,
name: "一月份" name: "一月份"
...@@ -304,11 +305,20 @@ ...@@ -304,11 +305,20 @@
} }
}, },
beforeDestroy() {
clearInterval(this.timer)
},
mounted() { mounted() {
this.init() this.queryAll()
this.initMonth() this.timer = setInterval(()=>{
this.queryAll()
},5*1000)
}, },
methods: { methods: {
queryAll(){
this.init()
this.initMonth()
},
init() { init() {
this.$post('fme/ufmezbp/query', { this.$post('fme/ufmezbp/query', {
year: this.queryParams.year, year: this.queryParams.year,
...@@ -368,6 +378,7 @@ ...@@ -368,6 +378,7 @@
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.showMain { .showMain {
height: calc(100% - 50px); height: calc(100% - 50px);
width: 100%; width: 100%;
......
src/views/yhlywsytst/yhlywsytst/index.vue
View file @ 6be14290
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Description: * @Description:
* @Author: lisu lisu@gavelinfo.com * @Author: lisu lisu@gavelinfo.com
* @LastEditors: lisu lisu@gavelinfo.com * @LastEditors: lisu lisu@gavelinfo.com
* @LastEditTime: 2024-11-11 16:11:27 * @LastEditTime: 2024-12-27 10:36:43
* @FilePath: /zghywpc-vue/src/views/yhlywsytst/yhlywsytst/index.vue * @FilePath: /zghywpc-vue/src/views/yhlywsytst/yhlywsytst/index.vue
--> -->
<template> <template>
...@@ -10,53 +10,53 @@ ...@@ -10,53 +10,53 @@
element-loading-background="rgba(0, 0, 0, 0.8)" ref="app" class="min_full nullbp"> element-loading-background="rgba(0, 0, 0, 0.8)" ref="app" class="min_full nullbp">
<!-- 弹框组件dialig --> <!-- 弹框组件dialig -->
<czDialog @save='getSave' :app='this' v-if='showDialog' /> <czDialog @save='getSave' :app='this' v-if='showDialog' />
<div v-show="tdloading==false" class="bigTitle animate__animated animate__fadeInDown "> <div v-show="tdloading==false" class="bigTitle animate__animated animate__fadeInDown ">
一回路异物溯源态势图 一回路异物溯源态势图
</div> </div>
<!-- 视角工具栏--> <!-- 视角工具栏-->
<div v-show="tdloading==false" class="toolButton animate__animated animate__fadeInRight" > <div v-show="tdloading==false" class="toolButton animate__animated animate__fadeInRight">
<div class="flex1 text-center"> <div class="flex1 text-center">
<div class="menu"> <div class="menu">
<span style="cursor: pointer;" @click="toFullPage('jyfkgl/jyfkgl')"> <span style="cursor: pointer;" @click="toFullPage('jyfkgl/jyfkgl')">
经验反馈信息 经验反馈信息
</span> </span>
</div> </div>
</div> </div>
<div class="flex1 text-center"> <div class="flex1 text-center">
<div class="menu"> <div class="menu">
<span style="cursor: pointer;" @click="toFullPage('ywxxgl/ywsjlr')"> <span style="cursor: pointer;" @click="toFullPage('ywxxgl/ywsjlr')">
防异物管理系统 防异物管理系统
</span> </span>
</div> </div>
</div> </div>
<div class="flex1 text-center"> <div class="flex1 text-center">
<div class="menu"> <div class="menu">
<span style="cursor: pointer;" @click="toFullPage('system/menuManage')"> <span style="cursor: pointer;" @click="toFullPage('system/menuManage')">
系统管理 系统管理
</span> </span>
</div> </div>
</div> </div>
</div> </div>
<div v-show="tdloading==false" class="toolButton2 animate__animated animate__fadeInLeft"> <div v-show="tdloading==false" class="toolButton2 animate__animated animate__fadeInLeft">
<div class="flex1 text-center"> <div class="flex1 text-center">
<div class="menu"> <span style="cursor: pointer;" @click="toFullPage('sbxxgl/sbxx')"> <div class="menu"> <span style="cursor: pointer;" @click="toFullPage('sbxxgl/sbxx')">
设备信息 设备信息
</span> </span>
</div> </div>
</div> </div>
<div class="flex1 text-center"> <div class="flex1 text-center">
<div class="menu"> <div class="menu">
<span style="cursor: pointer;" @click="toFullPage('sbjxgl/sbjxxx')"> <span style="cursor: pointer;" @click="toFullPage('sbjxgl/sbjxxx')">
设备检修信息 设备检修信息
</span> </span>
</div> </div>
</div> </div>
<div class="flex1 text-center"> <div class="flex1 text-center">
<div class="menu"> <div class="menu">
<span style="cursor: pointer;" @click="toFullPage('ywxxgl/ywxxgl')"> <span style="cursor: pointer;" @click="toFullPage('ywxxgl/ywxxgl')">
异物信息 异物信息
</span> </span>
</div> </div>
...@@ -67,14 +67,14 @@ ...@@ -67,14 +67,14 @@
<el-checkbox v-model="xzjj">选中时近景</el-checkbox> <el-checkbox v-model="xzjj">选中时近景</el-checkbox>
</div> </div>
</div> --> </div> -->
<div v-show="selectedModelName" class="leftOpt animate__animated " :class="{ <div v-show="selectedModelName" class="leftOpt animate__animated " :class="{
'animate__fadeInLeft':selectedModelName&&showLeft, 'animate__fadeInLeft':selectedModelName&&showLeft,
'animate__fadeOutLeft':selectedModelName&&!showLeft 'animate__fadeOutLeft':selectedModelName&&!showLeft
}" style="padding-top: 30px;"> }" style="padding-top: 30px;">
<div class="sbxxTitle" style="position: absolute;top: 5px;font-weight: 800;width: 100%;"> <div class="sbxxTitle" style="position: absolute;top: 5px;font-weight: 800;width: 100%;">
{{'设备:'+(selectedModel.name||'未选中')}} {{'设备:'+(selectedModel.name||'未选中')}}
<span class="hiddenButton"> <span class="hiddenButton">
<i style="cursor: pointer;" @click="hiddenLeft" class="el-icon-switch-button"></i> <i style="cursor: pointer;" @click="hiddenLeft" class="el-icon-switch-button"></i>
</span> </span>
</div> </div>
<!-- 隐藏样式--> <!-- 隐藏样式-->
...@@ -296,18 +296,17 @@ ...@@ -296,18 +296,17 @@
<div class="full flex " style="height: calc(100% - 14px);padding-top: 6px;padding-left: 10px;"> <div class="full flex " style="height: calc(100% - 14px);padding-top: 6px;padding-left: 10px;">
<div class="search-item flex1"> <div class="search-item flex1">
<span class="search-span-r"> <span class="search-span-r">
<span <span style="color: rgb(255, 73, 73); margin-right: 4px;position: absolute;left: 4px;">*</span>功能位置</span>
style="color: rgb(255, 73, 73); margin-right: 4px;position: absolute;left: 4px;">*</span>功能位置</span>
<el-input v-model="sypcQueryParams.gnwz"></el-input> <el-input v-model="sypcQueryParams.gnwz"></el-input>
</div> </div>
<div class="search-item flex1 "> <div class="search-item flex1 ">
<span class="search-span-r"> <span class="search-span-r">
最小管径</span> 最小管径</span>
<el-input v-model="sypcQueryParams.gj"></el-input> <el-input v-model="sypcQueryParams.gj"></el-input>
</div> </div>
<div class="search-item flex1 "> <div class="search-item flex1 ">
<span class="search-span-r"> <span class="search-span-r">
近期引入</span> 近期引入</span>
<RelSelect placeholder='' style="width: 100%;" :optionsData="[ <RelSelect placeholder='' style="width: 100%;" :optionsData="[
{id:true,name:'是'}, {id:true,name:'是'},
{id:false,name:'否'} {id:false,name:'否'}
...@@ -317,13 +316,13 @@ ...@@ -317,13 +316,13 @@
</div> </div>
<div class="search-item flex1 "> <div class="search-item flex1 ">
<span class="search-span-r"> <span class="search-span-r">
规格</span> 规格</span>
<RelSelect placeholder='' style="width: 100%;" src='sbgl/usbxx/init/gg' filterable clearable <RelSelect placeholder='' style="width: 100%;" src='sbgl/usbxx/init/gg' filterable clearable
:match="{value:'name',label:'name'}" v-model='sypcQueryParams.gg'></RelSelect> :match="{value:'name',label:'name'}" v-model='sypcQueryParams.gg'></RelSelect>
</div> </div>
<div class="search-item flex1 "> <div class="search-item flex1 ">
<span class="search-span-r"> <span class="search-span-r">
材质</span> 材质</span>
<AuxInput :overlayClick='czOverlayClick' :match="{ <AuxInput :overlayClick='czOverlayClick' :match="{
label: 'cz', label: 'cz',
value:'cz' value:'cz'
...@@ -339,21 +338,21 @@ ...@@ -339,21 +338,21 @@
<div class="search-item flex1 "> <div class="search-item flex1 ">
<span class="search-span-r"> <span class="search-span-r">
机组状态</span> 机组状态</span>
<RelSelect @change="kshZtChange" placeholder='' style="width: 100%;" src='ywxxgl/uywxx/init/zt ' filterable clearable <RelSelect @change="kshZtChange" placeholder='' style="width: 100%;" src='ywxxgl/uywxx/init/zt ' filterable
:match="{value:'id',label:'name'}" v-model='sypcQueryParams.kshZt'></RelSelect> clearable :match="{value:'id',label:'name'}" v-model='sypcQueryParams.kshZt'></RelSelect>
</div> </div>
<div class="search-item flex1 "> <div class="search-item flex1 ">
<span class="search-span-r"> <span class="search-span-r">
备用设备状态</span> 备用设备状态</span>
<!-- <!--
/sbgl/usbxx/init/zt/by--> /sbgl/usbxx/init/zt/by-->
<RelSelect placeholder='' :collapseTags='false' multiple style="width: 100%;" src='sbgl/usbxx/init/zt/by' filterable clearable <RelSelect placeholder='' :collapseTags='false' multiple style="width: 100%;" src='sbgl/usbxx/init/zt/by'
:match="{value:'id',label:'name'}" v-model='sypcQueryParams.byZts'></RelSelect> filterable clearable :match="{value:'id',label:'name'}" v-model='sypcQueryParams.byZts'></RelSelect>
</div> </div>
<div class="search-item " style="padding-top: 18px;margin-right: 0px;width: 200px;" > <div class="search-item " style="padding-top: 18px;margin-right: 0px;width: 200px;">
<el-button style="background-color: rgba(7,32,96,0.0);border: 1px solid #68D8FE; color: #68D8FE;" <el-button style="background-color: rgba(7,32,96,0.0);border: 1px solid #68D8FE; color: #68D8FE;"
size="mini" @click="sypc()" type="primary">排查</el-button> size="mini" @click="sypc()" type="primary">排查</el-button>
<el-button style="background-color: rgba(7,32,96,0.0);border: 1px solid #68D8FE; color: #68D8FE;" <el-button style="background-color: rgba(7,32,96,0.0);border: 1px solid #68D8FE; color: #68D8FE;"
...@@ -551,6 +550,11 @@ ...@@ -551,6 +550,11 @@
<div id="container" ref="container" class="full"> <div id="container" ref="container" class="full">
</div> </div>
<!-- 退出系统-->
<div class="out">
<i style="cursor: pointer;" @click="logout" class="el-icon-switch-button"></i>
</div>
</div> </div>
</template> </template>
...@@ -578,10 +582,10 @@ ...@@ -578,10 +582,10 @@
czDialog czDialog
}, },
computed: { computed: {
selectedModelName(){ selectedModelName() {
return this.selectedModel.name return this.selectedModel.name
}, },
byZts(){ byZts() {
return this.sypcQueryParams.byZts return this.sypcQueryParams.byZts
}, },
optionSingleHeight() { optionSingleHeight() {
...@@ -597,9 +601,9 @@ ...@@ -597,9 +601,9 @@
data() { data() {
return { return {
/* 最近的排查信息*/ /* 最近的排查信息*/
lastRes:{}, lastRes: {},
czmxzt:'A', czmxzt: 'A',
showLeft:false, showLeft: false,
/* 材质辅助输入*/ /* 材质辅助输入*/
cztypeConfig: { cztypeConfig: {
...@@ -632,7 +636,7 @@ ...@@ -632,7 +636,7 @@
gg: '', gg: '',
cz: '', cz: '',
kshZt: '', kshZt: '',
byZts:'' byZts: ''
// ywName: '异物1RIS0218', // ywName: '异物1RIS0218',
// jzbm: '1', // jzbm: '1',
// kshZt:'QT' // kshZt:'QT'
...@@ -652,8 +656,8 @@ ...@@ -652,8 +656,8 @@
}, },
/* 加载相关动画*/ /* 加载相关动画*/
loading: true, loading: true,
tdloading:true, tdloading: true,
loadingText: '正在加载模型,请等待!', loadingText: '正在加载模型,请稍等!',
viewer: null, viewer: null,
scene: null, scene: null,
/* 模型加载器*/ /* 模型加载器*/
...@@ -669,20 +673,20 @@ ...@@ -669,20 +673,20 @@
} }
}, },
watch: { watch: {
selectedModelName(val){ selectedModelName(val) {
if(val){ if (val) {
this.showLeft=true this.showLeft = true
}else{ } else {
this.showLeft=false this.showLeft = false
} }
}, },
byZts(val){ byZts(val) {
if(val){ if (val) {
if(this.sypcQueryParams.kshZt){ if (this.sypcQueryParams.kshZt) {
}else{ } else {
this.$warning('请先选择机组状态') this.$warning('请先选择机组状态')
this.sypcQueryParams.byZts='' this.sypcQueryParams.byZts = ''
} }
} }
}, },
...@@ -710,560 +714,170 @@ ...@@ -710,560 +714,170 @@
} }
}, },
methods: { methods: {
hiddenLeft(){ async logout() {
this.showLeft=false this.$confirm('确定注销并退出系统吗？', '提示', {
}, confirmButtonText: '确定',
toFullPage(hash) { cancelButtonText: '取消',
const url = `${location.origin}/#/${hash}` type: 'warning'
window.open(url, '_blank'); // 第二个参数 '_blank' 表示在新窗口或标签页中打开 }).then(() => {
}, this.$post('/logout').finally(() => {
kshZtChange(va){ localStorage.clear()
if(!va){ this.$store.dispatch('LogOut').then(() => {
this.sypcQueryParams.byZts='' location.href = '/index';
} })
},
getSave(str) {
console.log(str)
this.showDialog = false
this.sypcQueryParams.cz = str
},
czOverlayClick() {
this.showDialog = true
},
czmx() {
/* A 代表初始状态 和查询后状态*/
if(this.czmxzt=='A'){
this.viewer.scene.traverse((model) => {
if (model.isMesh) {
model.visible = true
}
});
if (this.allFlowObject.length) {
this.allFlowObject.forEach((item) => {
item.removeFromParent();
});
this.allFlowObject = [];
}
if(Object.keys(this.lastRes).length==0){
this.$warning('暂无最近的溯源数据')
}else{
this.czmxzt='B'
}
}else{
/* 如果是B的话代表 模型处理过，还原回去了*/
this.sypcMethods2(this.lastRes)
this.czmxzt='A'
}
},
/* xsqbmx相关设置废除*/
xsqbmx() {
this.viewer.scene.traverse((model) => {
if (model.isMesh) {
model.visible = true
}
});
this.mxbshow = false
},
/* 获取异物信息开始请求端口溯源*/
getYwxx(ywxx) {
this.queryParams.ywName = ywxx.name
this.apiJzbm()
},
/* 点击按钮弹出异物，然后选中*/
savePdf() {
if (this.pdfBytes) {
const base64String = this.pdfBytes;
// const linkSource = `data:application/pdf;base64,${base64String}`
// var linkSource = `data:application/pdf;base64,${base64String}`
// 将 Base64 编码的字符串转换为 Blob 对象
function base64ToBlob(base64, contentType) {
var byteCharacters = window.atob(base64);
var byteNumbers = new Array(byteCharacters.length);
for (var i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}
var byteArray = new Uint8Array(byteNumbers);
return new Blob([byteArray], {
type: contentType
});
}
// 创建 Blob 对象并生成 URL
var blob = base64ToBlob(base64String, 'application/pdf');
var url = URL.createObjectURL(blob);
// 设置 <a> 标签的 href 属性
var link = document.createElement('a');
link.href = url;
link.target = '_blank'; // 在新标签页中打开
link.click();
link.remove()
} else {
this.$warning('请溯源后,再保存为排查日志')
}
},
sypcMethods2(res){
let sbxxList = res.data.records.kshSbInfos || []
const sbxxCodeList = sbxxList.map(item => item.sbxxCode)
this.viewer.scene.traverse((model) => {
if (model.isMesh) {
let isbh = false
sbxxCodeList.forEach(item => {
if (model.name.includes(item)) {
isbh = true
}
})
if (isbh) {
model.visible = true
} else {
if (model.name && model.name != '地面') {
model.visible = false
}
}
}
});
},
sypcMethods(res) {
this.lastRes=res
this.pdfBytes = res.data.records.pdfBytes
let gnwz=res.data.records.gnwz
let sbxxList = res.data.records.kshSbInfos || []
let zbInfos = res.data.records.zbInfos || []
this.$success(`已标记${sbxxList.length}个设备`)
const sbxxCodeList = sbxxList.map(item => item.sbxxCode)
if (sbxxCodeList.length == 0) {
return
}
if (sbxxCodeList.length != 0) {
this.reMaterialQue.forEach(item => {
item.revert()
})
}
this.reMaterialQue.splice(0, this.reMaterialQue.length)
this.viewer.scene.traverse((model) => {
if (model.isMesh) {
let isbh = false
sbxxCodeList.forEach(item => {
if (model.name.includes(item)) {
isbh = true
}
})
if (isbh) {
model.visible = true
let jzReMaterialQueItem = {
model,
material: model.oldmaterial.clone(),
revert: function() {
this.model.material = this.material
}
}
this.jzReMaterialQue.push(jzReMaterialQueItem)
model.material = new THREE.MeshPhongMaterial({
color: new THREE.Color('rgba(255, 164, 7, 0.8)'),
transparent: true,
opacity: 0.8,
wireframe: false,
}) })
})},
} else { hiddenLeft() {
if (model.name && model.name != '地面') { this.showLeft = false
model.visible = false },
} toFullPage(hash) {
} const url = `${location.origin}/#/${hash}`
} window.open(url, '_blank'); // 第二个参数 '_blank' 表示在新窗口或标签页中打开
}); },
/* 显示展示全部按钮*/ kshZtChange(va) {
this.mxbshow = true if (!va) {
/* 匹配展示数据和本地数据*/ this.sypcQueryParams.byZts = ''
if (this.jzReMaterialQue.length != 0) {
// this.viewer.cameraControl.fitTo(this.jzReMaterialQue[0].model);
// this.sylbshow = true
// this.clickTag(this.jzReMaterialQue[0].model.name)
let model = false
let sbxxCode = gnwz|| this.sypcQueryParams.gnwz.replace(/\s+/g, '');
this.jzReMaterialQue.forEach(jzitem => {
if (jzitem.model && jzitem.model.name && this.getFirstPartOfString(jzitem.model.name) == sbxxCode) {
model = jzitem.model
} }
}) },
if (model !== false) { getSave(str) {
this.viewer.cameraControl.fitTo(model); console.log(str)
this.sylbshow = true this.showDialog = false
this.clickTag(model.name) this.sypcQueryParams.cz = str
} else { },
this.viewer.cameraControl.fitTo(this.jzReMaterialQue[0].model); czOverlayClick() {
this.sylbshow = true this.showDialog = true
this.clickTag(this.jzReMaterialQue[0].model.name) },
} czmx() {
} else { /* A 代表初始状态 和查询后状态*/
this.sylbshow = false if (this.czmxzt == 'A') {
}
// if (sbxxList.length > 0 && (this.jzReMaterialQue.length != sbxxList.length)) {
// this.$warning('存在与模型数据不匹配的数据!')
// }
/* 绘制全部流向*/
this.allPieData = zbInfos.filter((item) => {
return item.children.some((child) => child.data.length >= 2);
});
/* 绘制全部信息*/
if (this.allFlowObject.length) {
this.allFlowObject.forEach((item) => {
item.removeFromParent();
}); this.viewer.scene.traverse((model) => {
this.allFlowObject = []; if (model.isMesh) {
} model.visible = true
let flowPieDatas = this.allPieData
flowPieDatas.forEach(flowPieData => {
const children = this.allPieData.find((item) => item.name === flowPieData.name)?.children;
if (!children) {
return;
}
children.forEach((item) => {
if (item.data.length >= 2) {
const o = this.drawPipe(
item.data.map((item) => [item.x, item.y, item.z]),
item.radius,
this.flowDirection,
);
o.traverse((node) => {
if (node.isMesh) {
node._thing_tag = "helper";
} }
}); });
this.allFlowObject.push(o); if (this.allFlowObject.length) {
const box = new THREE.Box3(); this.allFlowObject.forEach((item) => {
o.points.forEach((item) => { item.removeFromParent();
box.expandByPoint(new THREE.Vector3(...item));
});
o.points.forEach((item) => {
box.expandByPoint(new THREE.Vector3(...item));
});
} });
}); this.allFlowObject = [];
})
},
sypc() {
if (!this.sypcQueryParams.gnwz) {
this.$warning('请输入功能位置后进行查询!')
return
}
/* 先清空 选中的机组*/
this.jzReMaterialQue.forEach(item => {
item.revert()
})
this.jzReMaterialQue.splice(0, this.jzReMaterialQue.length)
this.loading = true
this.loadingText = '正在处理,请稍等。'
/* 展示重置模型*/
this.czmxzt='A'
/* 如果流动特性只能从高到底*/
if(this.sypcQueryParams.ldtx=='B'){
this.$post('ksh/query/highToLow',
this.sypcQueryParams
).then(res => {
if (res.success) {
/* 获取加载数据*/
this.sypcMethods(res)
}
}).finally(() => {
this.loading = false
})
} else if (this.sypcQueryParams.isrRecentImport !== '') {
this.$post('ksh/check/workOrder',
this.sypcQueryParams
).then(res => {
if (res.success) {
/* 获取加载数据*/
this.sypcMethods(res)
}
}).finally(() => {
this.loading = false
})
}
/* 另外一个接口*/
else {
this.$post('ksh/query',
this.sypcQueryParams
).then(res => {
if (res.success) {
this.sypcMethods(res)
}
}).finally(() => {
this.loading = false
})
}
},
getFirstPartOfString(str) {
// 查找"-"在字符串中的位置
const dashIndex = str.indexOf('-');
// 如果找到了"-"，则返回"-"之前的部分（包含起始位置，不包含结束位置）
if (dashIndex !== -1) {
return str.substring(0, dashIndex);
}
// 如果没有找到"-"，则返回整个字符串
return str;
},
apiGetLbjxx() {
this.lbjlistData = []
this.$post('sbgl/usbxx/query', {
kshSbxxCode: this.getFirstPartOfString(this.selectedModel.name),
}).then(res => {
this.lbjlistData = res.data.records || []
})
},
apiGetYwxx() {
this.ywlistData = []
this.$post('ywxxgl/uywxx/query', {
sbxxCode: this.getFirstPartOfString(this.selectedModel.name),
}).then(res => {
this.ywlistData = res.data.records || []
})
},
apiGetJxxx() {
this.jxlistData = []
this.$post('jxgl/usbjx/query', {
sbxxCode: this.getFirstPartOfString(this.selectedModel.name),
}).then(res => {
this.jxlistData = res.data.records || []
})
},
apiGetBgxx() {
this.bglistData = []
this.$post('sbgl/usbbg/query', {
sbxxCode: this.getFirstPartOfString(this.selectedModel.name),
}).then(res => {
this.bglistData = res.data.records || []
})
},
/**
* @description:选中标签后操作
* @param {String} code
* @return {*}
* @author: lisu
*/
clickTag(code) {
if (!code) {
return
} else {
this.sbxxQueryParams.code = code.replace(/\s+/g, '');
/* 查询*/
let iscx = false
this.viewer.scene.traverse((model) => {
if (model.isMesh) {
if (model.name == this.sbxxQueryParams.code) {
this.selectedModel = model
iscx = true
/* 执行并情况材料队列 */
this.reMaterialQue.forEach(item => {
item.revert()
})
this.reMaterialQue.splice(0, this.reMaterialQue.length)
/* 添加材质模型队列*/
let reMaterialQueItem = {
model,
material: model.material.clone(),
revert: function() {
this.model.material = this.material
}
}
this.reMaterialQue.push(reMaterialQueItem)
model.material = new THREE.MeshPhongMaterial({
color: new THREE.Color('rgba(69, 255, 128, 0.8)'),
transparent: true,
opacity: 0.8,
wireframe: false,
})
/* */
if (this.xzjj) {
const object = model;
if (object) {
this.viewer.cameraControl.fitTo(object);
}
}
} }
} if (Object.keys(this.lastRes).length == 0) {
}); this.$warning('暂无最近的溯源数据')
if (iscx == false) {
this.sbcxwcxdxx = true
this.sbcxwcxdxxText = '未查询到设备!'
setTimeout(() => {
this.sbcxwcxdxx = false
}, 2000)
}
}
},
/**
* @description:查询流向信息，没有查询所有
* @return {*}
* @author: lisu
*/
sblxcx() {
if (true) {
this.sblxCode = this.sblxCode.replace(/\s+/g, '');
/* 查询*/
this.$post('sbgl/usblxgx/zbInfo', {
sbxxCode: this.sblxCode
}).then(res => {
if (res.success) {
let data = res.data.records || []
if (res.data.records.length == 0) {
this.sblxcxwcxdxx = true
this.sblxcxwcxdxxText = '未查询到流向!'
setTimeout(() => {
this.sblxcxwcxdxx = false
}, 2000)
} else { } else {
this.czmxzt = 'B'
} }
this.allPieData = data.filter((item) => {
return item.children.some((child) => child.data.length >= 2);
});
if (res.data.records.length != 0) {
this.$success(`共查询到${res.data.records.length }条数据!共绘制${this.allPieData.length}条流向!`)
}
}
})
}
},
sbcx() {
if (!this.sbxxQueryParams.code) {
this.sbcxwcxdxx = true
this.sbcxwcxdxxText = '请输入设备编码!'
setTimeout(() => {
this.sbcxwcxdxx = false
}, 2000)
} else {
this.sbxxQueryParams.code = this.sbxxQueryParams.code.replace(/\s+/g, '');
/* 查询*/
let iscx = false
this.viewer.scene.traverse((model) => {
if (model.isMesh) {
if (model.name == this.sbxxQueryParams.code) {
this.selectedModel = model
iscx = true
/* 执行并情况材料队列 */
this.reMaterialQue.forEach(item => {
item.revert()
})
this.reMaterialQue.splice(0, this.reMaterialQue.length)
} else {
/* 如果是B的话代表 模型处理过，还原回去了*/
this.sypcMethods2(this.lastRes)
this.czmxzt = 'A'
}
/* 添加材质模型队列*/ },
let reMaterialQueItem = { /* xsqbmx相关设置废除*/
model, xsqbmx() {
material: model.material.clone(), this.viewer.scene.traverse((model) => {
revert: function() { if (model.isMesh) {
this.model.material = this.material model.visible = true
} }
});
this.mxbshow = false
},
/* 获取异物信息开始请求端口溯源*/
getYwxx(ywxx) {
this.queryParams.ywName = ywxx.name
this.apiJzbm()
},
/* 点击按钮弹出异物，然后选中*/
savePdf() {
if (this.pdfBytes) {
const base64String = this.pdfBytes;
// const linkSource = `data:application/pdf;base64,${base64String}`
// var linkSource = `data:application/pdf;base64,${base64String}`
// 将 Base64 编码的字符串转换为 Blob 对象
function base64ToBlob(base64, contentType) {
var byteCharacters = window.atob(base64);
var byteNumbers = new Array(byteCharacters.length);
for (var i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
} }
this.reMaterialQue.push(reMaterialQueItem) var byteArray = new Uint8Array(byteNumbers);
return new Blob([byteArray], {
type: contentType
});
}
// 创建 Blob 对象并生成 URL
var blob = base64ToBlob(base64String, 'application/pdf');
var url = URL.createObjectURL(blob);
model.material = new THREE.MeshPhongMaterial({ // 设置 <a> 标签的 href 属性
color: new THREE.Color('rgba(69, 255, 128, 0.8)'), var link = document.createElement('a');
transparent: true, link.href = url;
opacity: 0.8, link.target = '_blank'; // 在新标签页中打开
wireframe: false, link.click();
link.remove()
} else {
this.$warning('请溯源后,再保存为排查日志')
}
},
sypcMethods2(res) {
let sbxxList = res.data.records.kshSbInfos || []
const sbxxCodeList = sbxxList.map(item => item.sbxxCode)
this.viewer.scene.traverse((model) => {
if (model.isMesh) {
let isbh = false
sbxxCodeList.forEach(item => {
if (model.name.includes(item)) {
isbh = true
}
}) })
/* */ if (isbh) {
if (this.xzjj) { model.visible = true
const object = model; } else {
if (object) { if (model.name && model.name != '地面') {
this.viewer.cameraControl.fitTo(object); model.visible = false
} }
} }
} }
} });
}); },
if (iscx == false) { sypcMethods(res) {
this.sbcxwcxdxx = true this.lastRes = res
this.sbcxwcxdxxText = '未查询到设备!' this.pdfBytes = res.data.records.pdfBytes
setTimeout(() => { let gnwz = res.data.records.gnwz
this.sbcxwcxdxx = false let sbxxList = res.data.records.kshSbInfos || []
}, 2000) let zbInfos = res.data.records.zbInfos || []
}
}
},
/* 弃用*/
apiJzbm() {
let params = _.cloneDeep(this.queryParams)
delete params.sbxxCode
/* 先清空 选中的机组*/
this.jzReMaterialQue.forEach(item => {
item.revert()
})
this.jzReMaterialQue.splice(0, this.jzReMaterialQue.length)
this.$post('ksh/query',
params
).then(res => {
if (res.success) {
let sbxxList = res.data.records || []
this.$success(`已标记${sbxxList.length}个设备`) this.$success(`已标记${sbxxList.length}个设备`)
const sbxxCodeList = sbxxList.map(item => item.sbxxCode) const sbxxCodeList = sbxxList.map(item => item.sbxxCode)
/* 解决 先缓存选中色，后渲染黄色，默认选中时颜色不对 if (sbxxCodeList.length == 0) {
bug: 1默认还原为原色 return
2.高亮为黄色触发默认选中(黄色存储在另一个队列) }
3.默认选中会还原上一个颜色
4.还原为原色，触发选中。变为选中色，清除为原色，覆盖了亮色
*/
if (sbxxCodeList.length != 0) { if (sbxxCodeList.length != 0) {
this.reMaterialQue.forEach(item => { this.reMaterialQue.forEach(item => {
item.revert() item.revert()
}) })
} }
this.reMaterialQue.splice(0, this.reMaterialQue.length) this.reMaterialQue.splice(0, this.reMaterialQue.length)
/* 分割，在渲染高亮清空选中的*/
this.viewer.scene.traverse((model) => { this.viewer.scene.traverse((model) => {
if (model.isMesh) { if (model.isMesh) {
if (sbxxCodeList.includes(model.name)) { let isbh = false
sbxxCodeList.forEach(item => {
if (model.name.includes(item)) {
isbh = true
}
})
if (isbh) {
model.visible = true
let jzReMaterialQueItem = { let jzReMaterialQueItem = {
model, model,
material: model.oldmaterial.clone(), material: model.oldmaterial.clone(),
...@@ -1279,564 +893,972 @@ ...@@ -1279,564 +893,972 @@
wireframe: false, wireframe: false,
}) })
} else {
if (model.name && model.name != '地面') {
model.visible = false
}
} }
} }
}); });
/* 显示展示全部按钮*/
this.mxbshow = true
/* 匹配展示数据和本地数据*/
if (this.jzReMaterialQue.length != 0) { if (this.jzReMaterialQue.length != 0) {
// this.viewer.cameraControl.fitTo(this.jzReMaterialQue[0].model);
// this.sylbshow = true
// this.clickTag(this.jzReMaterialQue[0].model.name)
let model = false
let sbxxCode = gnwz || this.sypcQueryParams.gnwz.replace(/\s+/g, '');
this.jzReMaterialQue.forEach(jzitem => {
if (jzitem.model && jzitem.model.name && this.getFirstPartOfString(jzitem.model.name) ==
sbxxCode) {
model = jzitem.model
}
})
if (model !== false) {
this.viewer.cameraControl.fitTo(model);
this.sylbshow = true
this.clickTag(model.name)
} else {
this.viewer.cameraControl.fitTo(this.jzReMaterialQue[0].model);
this.sylbshow = true
this.clickTag(this.jzReMaterialQue[0].model.name)
}
this.viewer.cameraControl.fitTo(this.jzReMaterialQue[0].model);
this.sylbshow = true
this.clickTag(this.jzReMaterialQue[0].model.name)
} else { } else {
this.sylbshow = false this.sylbshow = false
} }
// if (sbxxList.length > 0 && (this.jzReMaterialQue.length != sbxxList.length)) { // if (sbxxList.length > 0 && (this.jzReMaterialQue.length != sbxxList.length)) {
// this.$warning('存在与模型数据不匹配的数据!') // this.$warning('存在与模型数据不匹配的数据!')
// } // }
/* 绘制全部流向*/
this.allPieData = zbInfos.filter((item) => {
return item.children.some((child) => child.data.length >= 2);
});
/* 绘制全部信息*/
if (this.allFlowObject.length) {
this.allFlowObject.forEach((item) => {
item.removeFromParent();
});
this.allFlowObject = [];
}
let flowPieDatas = this.allPieData
flowPieDatas.forEach(flowPieData => {
const children = this.allPieData.find((item) => item.name === flowPieData.name)?.children;
if (!children) {
return;
}
children.forEach((item) => {
if (item.data.length >= 2) {
const o = this.drawPipe(
item.data.map((item) => [item.x, item.y, item.z]),
item.radius,
this.flowDirection,
);
o.traverse((node) => {
if (node.isMesh) {
node._thing_tag = "helper";
}
});
this.allFlowObject.push(o);
const box = new THREE.Box3();
o.points.forEach((item) => {
box.expandByPoint(new THREE.Vector3(...item));
});
o.points.forEach((item) => {
box.expandByPoint(new THREE.Vector3(...item));
});
}
});
})
},
sypc() {
if (!this.sypcQueryParams.gnwz) {
this.$warning('请输入功能位置后进行查询!')
return
}
/* 先清空 选中的机组*/
this.jzReMaterialQue.forEach(item => {
item.revert()
})
this.jzReMaterialQue.splice(0, this.jzReMaterialQue.length)
this.loading = true
this.loadingText = '正在处理,请稍等。'
/* 展示重置模型*/
this.czmxzt = 'A'
/* 如果流动特性只能从高到底*/
if (this.sypcQueryParams.ldtx == 'B') {
this.$post('ksh/query/highToLow',
this.sypcQueryParams
).then(res => {
if (res.success) {
/* 获取加载数据*/
this.sypcMethods(res)
}
}).finally(() => {
this.loading = false
} })
})
},
/* 解决com和 相机控制器事件冲突的问题*/
canNotMousedown(domList) {
domList.forEach(vdom => {
vdom.addEventListener('mouseover', function(event) {
event.preventDefault();
});
})
}, } else if (this.sypcQueryParams.isrRecentImport !== '') {
flowPieDataChange(val) { this.$post('ksh/check/workOrder',
this.handlerAllFlow() this.sypcQueryParams
}, ).then(res => {
/* 绘制流动方法 if (res.success) {
/* 获取加载数据*/
this.sypcMethods(res)
}
}).finally(() => {
this.loading = false
})
}
/* 另外一个接口*/
else {
this.$post('ksh/query',
this.sypcQueryParams
).then(res => {
if (res.success) {
this.sypcMethods(res)
}
}).finally(() => {
this.loading = false
})
}
*/
handlerAllFlow() {
if (this.allFlowObject.length) {
this.allFlowObject.forEach((item) => {
item.removeFromParent();
});
this.allFlowObject = [];
}
const children = this.allPieData.find((item) => item.name === this.flowPieData)?.children;
if (!children) {
return;
}
children.forEach((item) => {
if (item.data.length >= 2) {
const o = this.drawPipe(
item.data.map((item) => [item.x, item.y, item.z]),
item.radius,
this.flowDirection,
);
o.traverse((node) => {
if (node.isMesh) {
node._thing_tag = "helper";
}
});
this.allFlowObject.push(o);
const box = new THREE.Box3();
o.points.forEach((item) => {
box.expandByPoint(new THREE.Vector3(...item));
});
o.points.forEach((item) => {
box.expandByPoint(new THREE.Vector3(...item));
});
this.viewer.cameraControl.control.fitToBox(box, true, {
cover: true
});
}
});
},
/* 获取流向数据*/
getData() {
this.$post('sbgl/usblxgx/zbInfo', {}).then(res => {
if (res.success) {
let data = res.data.records || []
this.allPieData = data.filter((item) => {
return item.children.some((child) => child.data.length >= 2);
});
/* 绘制全部信息*/
// if (this.allFlowObject.length) {
// this.allFlowObject.forEach((item) => {
// item.removeFromParent();
// });
// this.allFlowObject = [];
// }
// let flowPieDatas=this.allPieData
// flowPieDatas.forEach(flowPieData=>{
// const children = this.allPieData.find((item) => item.name === flowPieData.name)?.children;
// if (!children) {
// return;
// }
// children.forEach((item) => {
// if (item.data.length >= 2) {
// const o = this.drawPipe(
// item.data.map((item) => [item.x, item.y, item.z]),
// item.radius,
// this.flowDirection,
// );
// o.traverse((node) => {
// if (node.isMesh) {
// node._thing_tag = "helper";
// }
// });
// this.allFlowObject.push(o);
// const box = new THREE.Box3();
// o.points.forEach((item) => {
// box.expandByPoint(new THREE.Vector3(...item));
// });
// o.points.forEach((item) => {
// box.expandByPoint(new THREE.Vector3(...item));
// });
// }
// });
// })
/* 绘制全部流向操作结束 */
}
})
},
/* 流向动画*/
drawPipe(positions, radius, direction) {
const viewer = this.viewer;
const points = positions.map(
/* 根据本身的模型定位来*/
(item) => new THREE.Vector3(item[0] / 1000, item[2] / 1000, -item[1] / 1000)
);
const flowObject = new VT.TubeLine({
points: points,
geometry: {
radius: radius / 1000 / 2,
cornerRadius: 0,
cornerSplit: 10,
}, },
material: { getFirstPartOfString(str) {
// color: "#0099ff", // 查找"-"在字符串中的位置
color: "#a1cf95", const dashIndex = str.indexOf('-');
side: 2,
map: { // 如果找到了"-"，则返回"-"之前的部分（包含起始位置，不包含结束位置）
image: "vt/resources/texture/arrow.png", if (dashIndex !== -1) {
repeat: [1, 50], return str.substring(0, dashIndex);
// rotation: direction ? Math.PI : 0, }
wrapS: THREE.RepeatWrapping, // 如果没有找到"-"，则返回整个字符串
wrapT: THREE.RepeatWrapping, return str;
},
transparent: true,
depthTest: true,
}, },
}); apiGetLbjxx() {
flowObject.line.onBeforeRender = () => { this.lbjlistData = []
if (flowObject.line.material.map) { this.$post('sbgl/usbxx/query', {
flowObject.line.material.map.offset.x -= 0.05; kshSbxxCode: this.getFirstPartOfString(this.selectedModel.name),
} }).then(res => {
}; this.lbjlistData = res.data.records || []
flowObject.traverse((node) => { })
if (node.isMesh) { },
node._thing_tag = "helper"; apiGetYwxx() {
} this.ywlistData = []
}); this.$post('ywxxgl/uywxx/query', {
viewer.scene.add(flowObject); sbxxCode: this.getFirstPartOfString(this.selectedModel.name),
return flowObject; }).then(res => {
}, this.ywlistData = res.data.records || []
clearSelected() { })
// this.viewer.scene.traverse(function(obj) { },
// console.log(obj,'模型对象') apiGetJxxx() {
// if (obj.isMesh) { this.jxlistData = []
this.$post('jxgl/usbjx/query', {
// obj.material = new THREE.MeshPhysicalMaterial({ sbxxCode: this.getFirstPartOfString(this.selectedModel.name),
// clearcoat: 1.0, //物体表面清漆层或者说透明涂层的厚度 }).then(res => {
// clearcoatRoughness: 0.1, //透明涂层表面的粗糙度 this.jxlistData = res.data.records || []
// color: obj.material.color, //默认颜色 })
// metalness: 0.9, //车外壳金属度 },
// roughness: 0.5, //车外壳粗糙度 apiGetBgxx() {
// envMapIntensity: 2.5, //环境贴图对Mesh表面影响程度 this.bglistData = []
// }) this.$post('sbgl/usbbg/query', {
// } sbxxCode: this.getFirstPartOfString(this.selectedModel.name),
// }) }).then(res => {
this.bglistData = res.data.records || []
this.selectedModel = { })
name: '' },
} /**
this.reMaterialQue.forEach(item => { * @description:选中标签后操作
item.revert() * @param {String} code
}) * @return {*}
* @author: lisu
*/
clickTag(code) {
if (!code) {
return
} else {
this.sbxxQueryParams.code = code.replace(/\s+/g, '');
/* 查询*/
let iscx = false
this.viewer.scene.traverse((model) => {
if (model.isMesh) {
if (model.name == this.sbxxQueryParams.code) {
this.selectedModel = model
iscx = true
/* 执行并情况材料队列 */
this.reMaterialQue.forEach(item => {
item.revert()
})
this.reMaterialQue.splice(0, this.reMaterialQue.length)
/* 添加材质模型队列*/
let reMaterialQueItem = {
model,
material: model.material.clone(),
revert: function() {
this.model.material = this.material
}
}
this.reMaterialQue.push(reMaterialQueItem)
},
viewCenter() {
this.cameraTo(this.viewer.camera.position.x, this.viewer.camera.position.y, this.viewer.camera.position.z,
0, 0,
0)
},
reView() {
this.cameraTo(0, 32, -82, 0, 0, 0)
}, model.material = new THREE.MeshPhongMaterial({
init() { color: new THREE.Color('rgba(69, 255, 128, 0.8)'),
/* scene*/ transparent: true,
// this.scene = new Viewer('scene') opacity: 0.8,
// this.scene.camera.position.set(0, 17, -60) wireframe: false,
})
/* viewer*/ /* */
// this.viewer = new Viewer('container') if (this.xzjj) {
// this.viewer.camera.position.set(0, 17, -60)
const object = model;
// const manager = new THREE.LoadingManager(); if (object) {
// manager.onProgress = (item, loaded, total) => { this.viewer.cameraControl.fitTo(object);
// let process = (loaded / total * 100).toFixed(2) }
// if (process == 100) {
// this.loading = false }
// } }
// // 这里可以根据加载进度执行其他操作 }
// }; });
// this.modelLoader = new ModelLoader(this.viewer, manager) if (iscx == false) {
this.sbcxwcxdxx = true
this.sbcxwcxdxxText = '未查询到设备!'
// const lights = new Lights(this.viewer) setTimeout(() => {
// const ambientLight = lights.addAmbientLight() // 添加环境光 this.sbcxwcxdxx = false
// ambientLight.setOption({ }, 2000)
// color: 0xff0000,
// intensity: 6 // 环境光强度 }
// }) }
// ambientLight.light.name = 'AmbientLight'
// // 添加平行光
// lights.addDirectionalLight([200, 200, 200], {
// color: 'rgb(253,253,253)',
// intensity: 3,
// castShadow: false // 是否投射阴影
// })
// this.loadDm()
this.viewer = new VT.Viewer({
container: this.$refs.container,
scene: {
helper: {
grid: {
visible: true,
},
},
background: {
skyboxPath: "dark",
},
}, },
view: { /**
position: [44.81080132492321, 48.62916741352805, -75.73966237503983], * @description:查询流向信息，没有查询所有
center: [48.15565686619112, 5.221820594458009, 5.975771281142078], * @return {*}
far: 10000, * @author: lisu
near: 0.1, */
aspect: null, sblxcx() {
fov: 45, if (true) {
isOrtho: false, this.sblxCode = this.sblxCode.replace(/\s+/g, '');
zoom: 1, /* 查询*/
rotation: [-2.6532966628149923, -0.036133545863119475, -3.1224049976510337, "XYZ"], this.$post('sbgl/usblxgx/zbInfo', {
sbxxCode: this.sblxCode
}).then(res => {
if (res.success) {
let data = res.data.records || []
if (res.data.records.length == 0) {
this.sblxcxwcxdxx = true
this.sblxcxwcxdxxText = '未查询到流向!'
setTimeout(() => {
this.sblxcxwcxdxx = false
}, 2000)
} else {
}
this.allPieData = data.filter((item) => {
return item.children.some((child) => child.data.length >= 2);
});
if (res.data.records.length != 0) {
this.$success(`共查询到${res.data.records.length }条数据!共绘制${this.allPieData.length}条流向!`)
}
}
})
}
}, },
}); sbcx() {
if (!this.sbxxQueryParams.code) {
this.sbcxwcxdxx = true
this.sbcxwcxdxxText = '请输入设备编码!'
setTimeout(() => {
this.sbcxwcxdxx = false
}, 2000)
} else {
this.sbxxQueryParams.code = this.sbxxQueryParams.code.replace(/\s+/g, '');
/* 查询*/
let iscx = false
this.viewer.scene.traverse((model) => {
if (model.isMesh) {
if (model.name == this.sbxxQueryParams.code) {
this.selectedModel = model
iscx = true
/* 执行并情况材料队列 */
this.reMaterialQue.forEach(item => {
item.revert()
})
this.reMaterialQue.splice(0, this.reMaterialQue.length)
/* 添加材质模型队列*/
let reMaterialQueItem = {
model,
material: model.material.clone(),
revert: function() {
this.model.material = this.material
}
}
this.reMaterialQue.push(reMaterialQueItem)
},
loadAll() {
var model = new VT.Model({
modelType: "gltf",
src: "/gltf/all.gltf",
})
model.addEventListener("loaded", () => {
this.loading = false
this.tdloading=false
/* 解决共用showleft控制没有关闭效果
放置默认不控制，初始dom是存在的直接出现关闭特效
*/
this.viewer.scene.traverse(model => { model.material = new THREE.MeshPhongMaterial({
if (model.isMesh) { color: new THREE.Color('rgba(69, 255, 128, 0.8)'),
if (model.name == '2RCV001EX_IN') { transparent: true,
model.name = '2RCV001EX管' opacity: 0.8,
} wireframe: false,
if (model.name == '2RCV001EX') { })
model.name = '2RCV001EX壳' /* */
} if (this.xzjj) {
if (model.name == '1RCV001EX_IN') {
model.name = '1RCV001EX管' const object = model;
} if (object) {
if (model.name == '1RCV001EX') { this.viewer.cameraControl.fitTo(object);
model.name = '1RCV001EX壳' }
}
if (model.name == '2RCP0620-2R8015014') { }
model.name = '2RCP0620A' }
} }
if (model.name == '2RCP0620-2R8015052') { });
model.name = '2RCP0620B' if (iscx == false) {
} this.sbcxwcxdxx = true
if (model.name == '1RCP0620-1R8015045') { this.sbcxwcxdxxText = '未查询到设备!'
model.name = '1RCP0620A' setTimeout(() => {
} this.sbcxwcxdxx = false
if (model.name == '1RCP0620-1R8015909') { }, 2000)
model.name = '1RCP0620B'
} }
model.oldmaterial = model.material.clone()
} }
})
this.getData() },
/* 弃用*/
apiJzbm() {
let params = _.cloneDeep(this.queryParams)
delete params.sbxxCode
/* 先清空 选中的机组*/
});
this.viewer.scene.add(model);
// this.modelLoader.loadModelToScene('/glb/all.glb', (model) => { this.jzReMaterialQue.forEach(item => {
item.revert()
})
this.jzReMaterialQue.splice(0, this.jzReMaterialQue.length)
this.$post('ksh/query',
params
).then(res => {
if (res.success) {
let sbxxList = res.data.records || []
this.$success(`已标记${sbxxList.length}个设备`)
const sbxxCodeList = sbxxList.map(item => item.sbxxCode)
/* 解决 先缓存选中色，后渲染黄色，默认选中时颜色不对
bug: 1默认还原为原色
2.高亮为黄色触发默认选中(黄色存储在另一个队列)
3.默认选中会还原上一个颜色
4.还原为原色，触发选中。变为选中色，清除为原色，覆盖了亮色
*/
if (sbxxCodeList.length != 0) {
this.reMaterialQue.forEach(item => {
item.revert()
})
}
this.reMaterialQue.splice(0, this.reMaterialQue.length)
/* 分割，在渲染高亮清空选中的*/
this.viewer.scene.traverse((model) => {
if (model.isMesh) {
if (sbxxCodeList.includes(model.name)) {
let jzReMaterialQueItem = {
model,
material: model.oldmaterial.clone(),
revert: function() {
this.model.material = this.material
}
}
this.jzReMaterialQue.push(jzReMaterialQueItem)
model.material = new THREE.MeshPhongMaterial({
color: new THREE.Color('rgba(255, 164, 7, 0.8)'),
transparent: true,
opacity: 0.8,
wireframe: false,
})
// model.object.position.set(-42, -10, 0) }
}
});
if (this.jzReMaterialQue.length != 0) {
// model.object.scale.set(1, 1, 1)
// model.object.updateMatrixWorld(true);
// console.log(model,'console.log(model)console.log(model)')
// }, (num) => {
// let showNum = num * 100
// if (showNum == 100) {
// this.loadingText = `模型加载完毕,请稍等!`
// /* 机组高亮测试*/
// setTimeout(() => {
// this.apiJzbm()
// }, 2000)
// } else { this.viewer.cameraControl.fitTo(this.jzReMaterialQue[0].model);
// this.loadingText = `正在加载模型${showNum}%!` this.sylbshow = true
// } this.clickTag(this.jzReMaterialQue[0].model.name)
// /* */ } else {
this.sylbshow = false
}
// if (sbxxList.length > 0 && (this.jzReMaterialQue.length != sbxxList.length)) {
// this.$warning('存在与模型数据不匹配的数据!')
// }
// })
},
loadDm() {
const geometry = new THREE.PlaneGeometry(1000, 1000, 500, 500); // 创建一个100x100的平面，水平和垂直各10条线
const material = new THREE.LineBasicMaterial({
color: 0x585858,
linewidth: 0.5
});
const grid = new THREE.LineSegments(geometry, material);
grid.rotation.x = -Math.PI / 2; // 旋转网格，使其平铺在x-z平面上
grid.position.y = -18; // 将网格向下移动一点，使其位于底部
grid.name = '地面'
this.viewer.scene.add(grid);
},
/* 点击*/
tdClick() {
this.viewer.renderer.domElement.addEventListener('click', (e) => {
const rayCaster = new THREE.Raycaster()
const mouse = new THREE.Vector2()
mouse.x = (e.offsetX / this.viewer.renderer.domElement.clientWidth) * 2 - 1
mouse.y = -(e.offsetY / this.viewer.renderer.domElement.clientHeight) * 2 + 1
rayCaster.setFromCamera(mouse, this.viewer.camera)
const intersects = rayCaster.intersectObject(this.viewer.scene, true) // 计算物体和射线的焦点
if (intersects[0]) {
if (intersects[0].object.name == '地面') {
return
}
try {
let model
let modelIndex = intersects.findIndex(item => item.object.name !== '' && item.object.visible == true)
if (modelIndex != -1) {
rconsole.log(`当前选中${modelIndex}`)
model = intersects[modelIndex].object
} else {
console.log('本次选中不存在name的节点')
} }
})
},
/* 解决com和 相机控制器事件冲突的问题*/
canNotMousedown(domList) {
domList.forEach(vdom => {
vdom.addEventListener('mouseover', function(event) {
event.preventDefault();
});
})
},
flowPieDataChange(val) {
this.handlerAllFlow()
},
/* 绘制流动方法
*/
handlerAllFlow() {
if (this.allFlowObject.length) {
this.allFlowObject.forEach((item) => {
item.removeFromParent();
/* 当模型隐藏 不继续触发*/ });
if (model.visible == false) { this.allFlowObject = [];
rconsole.log('当前对象已屏蔽') }
return const children = this.allPieData.find((item) => item.name === this.flowPieData)?.children;
if (!children) {
return;
}
children.forEach((item) => {
if (item.data.length >= 2) {
const o = this.drawPipe(
item.data.map((item) => [item.x, item.y, item.z]),
item.radius,
this.flowDirection,
);
o.traverse((node) => {
if (node.isMesh) {
node._thing_tag = "helper";
}
});
this.allFlowObject.push(o);
const box = new THREE.Box3();
o.points.forEach((item) => {
box.expandByPoint(new THREE.Vector3(...item));
});
o.points.forEach((item) => {
box.expandByPoint(new THREE.Vector3(...item));
});
this.viewer.cameraControl.control.fitToBox(box, true, {
cover: true
});
}
});
},
/* 获取流向数据*/
getData() {
this.$post('sbgl/usblxgx/zbInfo', {}).then(res => {
if (res.success) {
let data = res.data.records || []
this.allPieData = data.filter((item) => {
return item.children.some((child) => child.data.length >= 2);
});
/* 绘制全部信息*/
// if (this.allFlowObject.length) {
// this.allFlowObject.forEach((item) => {
// item.removeFromParent();
// });
// this.allFlowObject = [];
// }
// let flowPieDatas=this.allPieData
// flowPieDatas.forEach(flowPieData=>{
// const children = this.allPieData.find((item) => item.name === flowPieData.name)?.children;
// if (!children) {
// return;
// }
// children.forEach((item) => {
// if (item.data.length >= 2) {
// const o = this.drawPipe(
// item.data.map((item) => [item.x, item.y, item.z]),
// item.radius,
// this.flowDirection,
// );
// o.traverse((node) => {
// if (node.isMesh) {
// node._thing_tag = "helper";
// }
// });
// this.allFlowObject.push(o);
// const box = new THREE.Box3();
// o.points.forEach((item) => {
// box.expandByPoint(new THREE.Vector3(...item));
// });
// o.points.forEach((item) => {
// box.expandByPoint(new THREE.Vector3(...item));
// });
// }
// });
// })
/* 绘制全部流向操作结束 */
}
})
},
/* 流向动画*/
drawPipe(positions, radius, direction) {
const viewer = this.viewer;
const points = positions.map(
/* 根据本身的模型定位来*/
(item) => new THREE.Vector3(item[0] / 1000, item[2] / 1000, -item[1] / 1000)
);
const flowObject = new VT.TubeLine({
points: points,
geometry: {
radius: radius / 1000 / 2,
cornerRadius: 0,
cornerSplit: 10,
},
material: {
// color: "#0099ff",
color: "#a1cf95",
side: 2,
map: {
image: "vt/resources/texture/arrow.png",
repeat: [1, 50],
// rotation: direction ? Math.PI : 0,
wrapS: THREE.RepeatWrapping,
wrapT: THREE.RepeatWrapping,
},
transparent: true,
depthTest: true,
},
});
flowObject.line.onBeforeRender = () => {
if (flowObject.line.material.map) {
flowObject.line.material.map.offset.x -= 0.05;
}
};
flowObject.traverse((node) => {
if (node.isMesh) {
node._thing_tag = "helper";
} }
this.selectedModel = model });
this.showLeft=true viewer.scene.add(flowObject);
// model.visible=false return flowObject;
},
clearSelected() {
// this.viewer.scene.traverse(function(obj) {
// console.log(obj,'模型对象')
// if (obj.isMesh) {
// obj.material = new THREE.MeshPhysicalMaterial({
// clearcoat: 1.0, //物体表面清漆层或者说透明涂层的厚度
// clearcoatRoughness: 0.1, //透明涂层表面的粗糙度
// color: obj.material.color, //默认颜色
// metalness: 0.9, //车外壳金属度
// roughness: 0.5, //车外壳粗糙度
// envMapIntensity: 2.5, //环境贴图对Mesh表面影响程度
// })
// }
// })
this.selectedModel = {
name: ''
}
this.reMaterialQue.forEach(item => {
item.revert()
})
/* 执行并情况材料队列 */ },
this.reMaterialQue.forEach(item => { viewCenter() {
item.revert() this.cameraTo(this.viewer.camera.position.x, this.viewer.camera.position.y, this.viewer.camera.position
.z,
0, 0,
0)
},
reView() {
this.cameraTo(0, 32, -82, 0, 0, 0)
},
init() {
/* scene*/
// this.scene = new Viewer('scene')
// this.scene.camera.position.set(0, 17, -60)
/* viewer*/
// this.viewer = new Viewer('container')
// this.viewer.camera.position.set(0, 17, -60)
// const manager = new THREE.LoadingManager();
// manager.onProgress = (item, loaded, total) => {
// let process = (loaded / total * 100).toFixed(2)
// if (process == 100) {
// this.loading = false
// }
// // 这里可以根据加载进度执行其他操作
// };
// this.modelLoader = new ModelLoader(this.viewer, manager)
// const lights = new Lights(this.viewer)
// const ambientLight = lights.addAmbientLight() // 添加环境光
// ambientLight.setOption({
// color: 0xff0000,
// intensity: 6 // 环境光强度
// })
// ambientLight.light.name = 'AmbientLight'
// // 添加平行光
// lights.addDirectionalLight([200, 200, 200], {
// color: 'rgb(253,253,253)',
// intensity: 3,
// castShadow: false // 是否投射阴影
// })
// this.loadDm()
this.viewer = new VT.Viewer({
container: this.$refs.container,
scene: {
helper: {
grid: {
visible: true,
},
},
background: {
skyboxPath: "dark",
},
},
view: {
position: [44.81080132492321, 48.62916741352805, -75.73966237503983],
center: [48.15565686619112, 5.221820594458009, 5.975771281142078],
far: 10000,
near: 0.1,
aspect: null,
fov: 45,
isOrtho: false,
zoom: 1,
rotation: [-2.6532966628149923, -0.036133545863119475, -3.1224049976510337, "XYZ"],
},
});
},
loadAll() {
var model = new VT.Model({
modelType: "gltf",
src: "/gltf/all.gltf",
})
model.addEventListener("loaded", () => {
this.loading = false
this.tdloading = false
/* 解决共用showleft控制没有关闭效果
放置默认不控制，初始dom是存在的直接出现关闭特效
*/
this.viewer.scene.traverse(model => {
if (model.isMesh) {
if (model.name == '2RCV001EX_IN') {
model.name = '2RCV001EX管'
}
if (model.name == '2RCV001EX') {
model.name = '2RCV001EX壳'
}
if (model.name == '1RCV001EX_IN') {
model.name = '1RCV001EX管'
}
if (model.name == '1RCV001EX') {
model.name = '1RCV001EX壳'
}
if (model.name == '2RCP0620-2R8015014') {
model.name = '2RCP0620A'
}
if (model.name == '2RCP0620-2R8015052') {
model.name = '2RCP0620B'
}
if (model.name == '1RCP0620-1R8015045') {
model.name = '1RCP0620A'
}
if (model.name == '1RCP0620-1R8015909') {
model.name = '1RCP0620B'
}
model.oldmaterial = model.material.clone()
}
}) })
this.reMaterialQue.splice(0, this.reMaterialQue.length)
this.getData()
/* 添加材质模型队列*/ });
let reMaterialQueItem = { this.viewer.scene.add(model);
model,
material: model.material.clone(), // this.modelLoader.loadModelToScene('/glb/all.glb', (model) => {
revert: function() {
this.model.material = this.material // model.object.position.set(-42, -10, 0)
// model.object.scale.set(1, 1, 1)
// model.object.updateMatrixWorld(true);
// console.log(model,'console.log(model)console.log(model)')
// }, (num) => {
// let showNum = num * 100
// if (showNum == 100) {
// this.loadingText = `模型加载完毕,请稍等!`
// /* 机组高亮测试*/
// setTimeout(() => {
// this.apiJzbm()
// }, 2000)
// } else {
// this.loadingText = `正在加载模型${showNum}%!`
// }
// /* */
// })
},
loadDm() {
const geometry = new THREE.PlaneGeometry(1000, 1000, 500, 500); // 创建一个100x100的平面，水平和垂直各10条线
const material = new THREE.LineBasicMaterial({
color: 0x585858,
linewidth: 0.5
});
const grid = new THREE.LineSegments(geometry, material);
grid.rotation.x = -Math.PI / 2; // 旋转网格，使其平铺在x-z平面上
grid.position.y = -18; // 将网格向下移动一点，使其位于底部
grid.name = '地面'
this.viewer.scene.add(grid);
},
/* 点击*/
tdClick() {
this.viewer.renderer.domElement.addEventListener('click', (e) => {
const rayCaster = new THREE.Raycaster()
const mouse = new THREE.Vector2()
mouse.x = (e.offsetX / this.viewer.renderer.domElement.clientWidth) * 2 - 1
mouse.y = -(e.offsetY / this.viewer.renderer.domElement.clientHeight) * 2 + 1
rayCaster.setFromCamera(mouse, this.viewer.camera)
const intersects = rayCaster.intersectObject(this.viewer.scene, true) // 计算物体和射线的焦点
if (intersects[0]) {
if (intersects[0].object.name == '地面') {
return
} }
} try {
let model
let modelIndex = intersects.findIndex(item => item.object.name !== '' && item.object
.visible == true)
if (modelIndex != -1) {
rconsole.log(`当前选中${modelIndex}`)
model = intersects[modelIndex].object
} else {
console.log('本次选中不存在name的节点')
}
this.reMaterialQue.push(reMaterialQueItem)
/* 当模型隐藏 不继续触发*/
if (model.visible == false) {
rconsole.log('当前对象已屏蔽')
return
}
this.selectedModel = model
this.showLeft = true
// model.visible=false
model.material = new THREE.MeshPhongMaterial({ /* 执行并情况材料队列 */
color: new THREE.Color('rgba(69, 255, 128, 0.8)'), this.reMaterialQue.forEach(item => {
transparent: true, item.revert()
opacity: 0.8, })
wireframe: false, this.reMaterialQue.splice(0, this.reMaterialQue.length)
})
} catch (e) {
rconsole.log(e)
}
/* 添加材质模型队列*/
let reMaterialQueItem = {
model,
material: model.material.clone(),
revert: function() {
this.model.material = this.material
}
}
this.reMaterialQue.push(reMaterialQueItem)
} model.material = new THREE.MeshPhongMaterial({
}) color: new THREE.Color('rgba(69, 255, 128, 0.8)'),
}, transparent: true,
tdblClick() { opacity: 0.8,
this.viewer.renderer.domElement.addEventListener('dblclick', (e) => { wireframe: false,
const rayCaster = new THREE.Raycaster() })
const mouse = new THREE.Vector2() } catch (e) {
mouse.x = (e.offsetX / this.viewer.renderer.domElement.clientWidth) * 2 - 1 rconsole.log(e)
mouse.y = -(e.offsetY / this.viewer.renderer.domElement.clientHeight) * 2 + 1 }
rayCaster.setFromCamera(mouse, this.viewer.camera)
const intersects = rayCaster.intersectObject(this.viewer.scene, true) // 计算物体和射线的焦点
if (intersects[0]) {
if (intersects[0].object.name == '地面') {
return
}
let model
if (intersects[0].object.name == '') {
model = intersects[1].object
} else {
model = intersects[0].object
}
this.selectedModel = model
this.showLeft=true
/* 执行并情况材料队列 */
this.reMaterialQue.forEach(item => {
item.revert()
})
this.reMaterialQue.splice(0, this.reMaterialQue.length)
/* 添加材质模型队列*/
let reMaterialQueItem = {
model,
material: model.material.clone(),
revert: function() {
this.model.material = this.material
} }
} })
},
tdblClick() {
this.viewer.renderer.domElement.addEventListener('dblclick', (e) => {
const rayCaster = new THREE.Raycaster()
const mouse = new THREE.Vector2()
mouse.x = (e.offsetX / this.viewer.renderer.domElement.clientWidth) * 2 - 1
mouse.y = -(e.offsetY / this.viewer.renderer.domElement.clientHeight) * 2 + 1
rayCaster.setFromCamera(mouse, this.viewer.camera)
const intersects = rayCaster.intersectObject(this.viewer.scene, true) // 计算物体和射线的焦点
if (intersects[0]) {
if (intersects[0].object.name == '地面') {
return
}
let model
if (intersects[0].object.name == '') {
model = intersects[1].object
} else {
model = intersects[0].object
}
this.selectedModel = model
this.showLeft = true
this.reMaterialQue.push(reMaterialQueItem) /* 执行并情况材料队列 */
this.reMaterialQue.forEach(item => {
item.revert()
})
this.reMaterialQue.splice(0, this.reMaterialQue.length)
model.material = new THREE.MeshPhongMaterial({ /* 添加材质模型队列*/
color: new THREE.Color('rgba(69, 255, 128, 0.8)'), let reMaterialQueItem = {
transparent: true, model,
opacity: 0.8, material: model.material.clone(),
wireframe: false, revert: function() {
}) this.model.material = this.material
/* */ }
const object = model; }
if (object) {
this.viewer.cameraControl.fitTo(object);
}
this.reMaterialQue.push(reMaterialQueItem)
} model.material = new THREE.MeshPhongMaterial({
}) color: new THREE.Color('rgba(69, 255, 128, 0.8)'),
}, transparent: true,
/* reMaterialQue 相关操作*/ opacity: 0.8,
getCameraPosition(d, point) { wireframe: false,
// 确保point是一个对象，并且包含x, y, z属性 })
if (!point || typeof point.x !== 'number' || typeof point.y !== 'number' || typeof point.z !== 'number') { /* */
throw new Error('Invalid point object'); const object = model;
} if (object) {
this.viewer.cameraControl.fitTo(object);
}
// 计算从原点(0,0,0)到模型点的向量
const vector = {
x: point.x - 0,
y: point.y - 0,
z: point.z - 0
};
// 计算向量的长度（模）
const length = Math.sqrt(vector.x * vector.x + vector.y * vector.y + vector.z * vector.z);
// 如果长度为0（即模型点就是原点），则返回一个错误或默认位置 }
if (length === 0) { })
throw new Error('Model point is at the origin'); },
} /* reMaterialQue 相关操作*/
getCameraPosition(d, point) {
// 确保point是一个对象，并且包含x, y, z属性
if (!point || typeof point.x !== 'number' || typeof point.y !== 'number' || typeof point.z !==
'number') {
throw new Error('Invalid point object');
}
// 计算单位向量（将向量除以它的长度） // 计算从原点(0,0,0)到模型点的向量
const unitVector = { const vector = {
x: vector.x / length, x: point.x - 0,
y: vector.y / length, y: point.y - 0,
z: vector.z / length z: point.z - 0
}; };
// 计算相机位置：模型点位置加上单位向量乘以距离d（但注意，这里我们实际上是将相机放在模型点之后d的位置） // 计算向量的长度（模）
// 如果想要相机在模型点和原点之间，可以调整d的符号或计算方式 const length = Math.sqrt(vector.x * vector.x + vector.y * vector.y + vector.z * vector.z);
const cameraPosition = {
x: point.x - d * unitVector.x, // 如果长度为0（即模型点就是原点），则返回一个错误或默认位置
y: point.y - d * unitVector.y, if (length === 0) {
z: point.z - d * unitVector.z throw new Error('Model point is at the origin');
}; }
return cameraPosition; // 计算单位向量（将向量除以它的长度）
}, const unitVector = {
/* 封装相机转向方法动画*/ x: vector.x / length,
cameraTo(x, y, z, px, py, pz) { y: vector.y / length,
z: vector.z / length
let _camera = this.viewer.cameraControl.camera };
let currentPosition = _camera.position.clone();
let oldx = currentPosition.x // 计算相机位置：模型点位置加上单位向量乘以距离d（但注意，这里我们实际上是将相机放在模型点之后d的位置）
let oldy = currentPosition.y // 如果想要相机在模型点和原点之间，可以调整d的符号或计算方式
let oldz = currentPosition.z const cameraPosition = {
let coldx = this.viewer.controls.target.x x: point.x - d * unitVector.x,
let coldy = this.viewer.controls.target.y y: point.y - d * unitVector.y,
let coldz = this.viewer.controls.target.z z: point.z - d * unitVector.z
let viewer = this.viewer };
/* 计算过渡差值*/ return cameraPosition;
let tl = gsap.timeline(); },
tl.to({}, { /* 封装相机转向方法动画*/
duration: 1.5, // 动画持续时间 cameraTo(x, y, z, px, py, pz) {
ease: "power1.inOut", // 缓动函数
onUpdate: function() { let _camera = this.viewer.cameraControl.camera
let progress = this.progress(); // 获取当前进度（0到1之间） let currentPosition = _camera.position.clone();
_camera.position.set(oldx + (x - oldx) * progress, oldy + (y - oldy) * progress, oldz + (z - let oldx = currentPosition.x
oldz) * let oldy = currentPosition.y
progress); let oldz = currentPosition.z
let coldx = this.viewer.controls.target.x
viewer.controls.target.set(coldx + (px - coldx) * progress, coldy + (py - coldy) * progress, let coldy = this.viewer.controls.target.y
coldz + ( let coldz = this.viewer.controls.target.z
pz - coldz) * progress) let viewer = this.viewer
/* 计算过渡差值*/
let tl = gsap.timeline();
tl.to({}, {
duration: 1.5, // 动画持续时间
ease: "power1.inOut", // 缓动函数
onUpdate: function() {
let progress = this.progress(); // 获取当前进度（0到1之间）
_camera.position.set(oldx + (x - oldx) * progress, oldy + (y - oldy) * progress, oldz + (z -
oldz) *
progress);
viewer.controls.target.set(coldx + (px - coldx) * progress, coldy + (py - coldy) * progress,
coldz + (
pz - coldz) * progress)
}
});
} }
});
}
} }
} }
</script> </script>
<style > <style>
#LOADING { #LOADING {
display: none!important; display: none !important;
} }
</style> </style>
<style scoped lang="scss"> <style scoped lang="scss">
.hiddenButton {
.hiddenButton{
float: right; float: right;
color: #68D8FE; color: #68D8FE;
} }
.search-span { .search-span {
min-width: 60px; min-width: 60px;
float: right; float: right;
...@@ -1894,17 +1916,20 @@ ...@@ -1894,17 +1916,20 @@
::v-deep .el-switch__core::after { ::v-deep .el-switch__core::after {
height: 12px; height: 12px;
} }
::v-deep .el-tag.el-tag--info { ::v-deep .el-tag.el-tag--info {
background-color: rgba(0, 0, 0, 0.6) !important; background-color: rgba(0, 0, 0, 0.6) !important;
color:#68D8FE ; color: #68D8FE;
border: 1px solid #68D8FE; border: 1px solid #68D8FE;
} }
::v-deep .el-select-dropdown__list{
::v-deep .el-select-dropdown__list {
background-color: rgba(0, 0, 0, 0.6) !important; background-color: rgba(0, 0, 0, 0.6) !important;
color:#68D8FE ; color: #68D8FE;
border: 1px solid #68D8FE; border: 1px solid #68D8FE;
} }
::v-deep .el-switch__label { ::v-deep .el-switch__label {
color: #fff; color: #fff;
...@@ -1929,8 +1954,9 @@ ...@@ -1929,8 +1954,9 @@
min-height: 36px; min-height: 36px;
// height: 30px!important; // height: 30px!important;
} }
.is-disabled{
background-color: rgba(0, 0, 0, 0.0)!important; .is-disabled {
background-color: rgba(0, 0, 0, 0.0) !important;
} }
.nullbp { .nullbp {
...@@ -2257,4 +2283,13 @@ ...@@ -2257,4 +2283,13 @@
background-color: rgba(0, 0, 0, 0.6); background-color: rgba(0, 0, 0, 0.6);
color: #68D8FE; color: #68D8FE;
} }
.out {
position: absolute;
right: 23px;
bottom: 18px;
color: #68D8FE;
cursor: pointer;
font-size: 20px;
}
</style> </style>
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