wangqiujuan0808
/
bw
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

暂替代码

main
wangqiujuan0808 2024-01-08 21:10:22 +08:00
parent f6a7456d77
commit d51445a489
11 changed files with 11897 additions and 449003 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27384
public/jzc/jz.gltf
View File

File diff suppressed because one or more lines are too long

141315
public/jzc/scene.gltf
View File

File diff suppressed because one or more lines are too long

150654
public/jzc/scene3.gltf
View File

File diff suppressed because one or more lines are too long

141315
public/jzc/scene4.gltf
View File

File diff suppressed because one or more lines are too long

8
src/store/modules/bim.js
View File

@ -9,7 +9,8 @@ const bimStore = defineStore(
activateMenu: {
name: '建筑信息',
background: '#202a60'
}
},
checkArr: []
}),
actions: {
// 菜单
@ -35,6 +36,11 @@ const bimStore = defineStore(
// 资产详情num
setDeviceNum(item) {
this.deviceNum = item;
},
// 巡检列表篇
setCheckArr(item) {
console.log(3,item);
this.checkArr = item;
}
}
})

25
src/views/bim/bimHome/components/CheckDetial.vue Normal file
View File

@ -0,0 +1,25 @@
<template>
<div>
<el-table :data="checkArr" border style="width: 100%" height="320">
<el-table-column label="序号" width="60" type="index" align="center"></el-table-column>
<el-table-column prop="name" label="设备名称" align="center" />
<el-table-column prop="isPass" label="巡检结果" align="center">
<template #default="scope">
<span :style="{'color': scope.row.isPass? '#0dbc79' : '#e03528'}">{{ scope.row.isPass ? '通过' : '不通过' }}</span>
</template>
</el-table-column>
<el-table-column label="巡检时间" align="center">
<template #default="scope">
{{ scope.row.isPass ? '2023-12-23': '2023-01-11' }}
</template>
</el-table-column>
</el-table>
</div>
</template>
<script setup>
import bimStore from '@/store/modules/bim';
import { computed } from 'vue';
const checkArr = computed(() =>
bimStore().checkArr
);
</script>

4
src/views/bim/bimHome/components/DeviceDetial.vue
View File

@ -17,7 +17,7 @@ import RealInfo from './RealInfo.vue';
import HistoryInfo from './HistoryInfo.vue';
import { ElMessage } from 'element-plus';
const deviceData = {
'guan2': {
'T11': {
name: '立仓',
imgUrl: 'licang',
detail: [
@ -75,7 +75,7 @@ const deviceData = {
},
]
},
'Circle001': {
'guolvcao': {
name: '过滤槽',
imgUrl: 'guolvcao',
detail: [

24
src/views/bim/bimHome/components/DeviceInfoDialog.vue
View File

@ -59,28 +59,28 @@ const data = reactive({
{
type: '生产设备',
name: '立仓',
num: 'guan2',
num: 'T11',
value: 45,
id: "echartDiv0"
},
{
type: '生产设备',
name: '过滤槽',
num: 'Circle001',
num: 'guolvcao',
value: 130,
id: "echartDiv1"
},
{
type: '安防设备',
name: '摄像头',
num: 'guan2',
num: 'T3',
value: 180,
id: "echartDiv2"
},
{
type: '消防设备',
name: '烟感',
num: 'guan2',
num: 'T4',
value: 100,
id: "echartDiv3"
}
@ -101,28 +101,28 @@ const data = reactive({
{
type: '生产设备',
name: '立仓',
num: 'guan2',
num: 'T11',
value: 15,
id: "echartDiv0"
},
{
type: '生产设备',
name: '过滤槽',
num: 'set6',
num: 'guolvcao',
value: 50,
id: "echartDiv1"
},
{
type: '安防设备',
name: '摄像头',
num: 'guan2',
num: 'T3',
value: 80,
id: "echartDiv2"
},
{
type: '消防设备',
name: '烟感',
num: 'guan2',
num: 'T4',
value: 50,
id: "echartDiv3"
}
@ -144,28 +144,28 @@ const data = reactive({
{
type: '生产设备',
name: '立仓',
num: 'guan2',
num: 'T11',
value: 30,
id: "echartDiv0"
},
{
type: '生产设备',
name: '过滤槽',
num: 'set6',
num: 'guolvcao',
value: 80,
id: "echartDiv1"
},
{
type: '安防设备',
name: '摄像头',
num: 'guan2',
num: 'T4',
value: 100,
id: "echartDiv2"
},
{
type: '消防设备',
name: '烟感',
num: 'guan2',
num: 'T3',
value: 50,
id: "echartDiv3"
}

16
src/views/bim/bimHome/components/DeviceTree.vue
View File

@ -45,7 +45,7 @@ const data = reactive({
{
label: '立仓',
id: '0-1',
clickName: 'guan2',
clickName: 'T11',
info: {
name: '立仓',
type: '生产设备',
@ -61,7 +61,7 @@ const data = reactive({
{
label: '过滤槽',
id: '0-2',
clickName: 'Circle001',
clickName: 'guolvcao',
info: {
name: '过滤槽',
type: '生产设备',
@ -76,7 +76,7 @@ const data = reactive({
{
label: '设备二',
id: '0-3',
clickName: 'guan3',
clickName: 'T3',
info: {
name: '设备二',
type: '生产设备',
@ -90,7 +90,7 @@ const data = reactive({
{
label: '设备三',
id: '0-4',
clickName: 'guan4',
clickName: 'T4',
info: {
name: '设备三',
type: '空调设备',
@ -104,7 +104,7 @@ const data = reactive({
{
label: '设备四',
id: '0-5',
clickName: 'guan5',
clickName: 'T5',
info: {
name: '设备四',
type: '安防设备',
@ -118,7 +118,7 @@ const data = reactive({
{
label: '设备五',
id: '0-6',
clickName: 'guan6',
clickName: 'T6',
info: {
name: '设备五',
type: '安防设备',
@ -132,7 +132,7 @@ const data = reactive({
{
label: '设备七',
id: '0-7',
clickName: 'guan7',
clickName: 'T7',
info: {
name: '设备七',
type: '安防设备',
@ -146,7 +146,7 @@ const data = reactive({
{
label: '设备八',
id: '0-8',
clickName: 'guan8',
clickName: 'T8',
info: {
name: '设备八',
type: '安防设备',

130
src/views/bim/bimHome/components/ThreeView2.vue
View File

@ -84,16 +84,16 @@ let romeObj = []
let checkArr = [];
let checkindex = 0;
//墙体
let isShowWall = false;
let mouse = new THREE.Vector2();
let labelRenderer = new CSS2DRenderer(); //新建CSS2DRenderer
const data = reactive({
isAddLabel: true,
isRemoveBottom: true
isRemoveBottom: true,
isShowWall: false //墙体
});
const { isAddLabel, isRemoveBottom } = toRefs(data);
const { isAddLabel, isRemoveBottom, isShowWall } = toRefs(data);
// 建筑树点击
Bus.on('clickBuild', (isParent) => {
// Todo
@ -214,7 +214,7 @@ const loadSence = () => {
})
scene.add(model);
});
};
const renderScene = () => {
@ -242,17 +242,17 @@ const enableGroup = [
'yuanliao_room',
'tanghua_room',
'touliao_room',
'Circle001',// 过滤槽
'guan1',
'guan2',// 立仓
'guan3',
'guan4',
'guan5',
'guan6',
'guan7',
'guan8',
'guan9',
'guan10'
'guolvcao',// 过滤槽
'T3',
'T4',
'T5',
'T6',
'T7',
'T8',
'T9',
'T10',
'T11',// 立仓
'T12'
]
const isSelent = (obj) => {
var o = obj
@ -293,7 +293,7 @@ const onMouseMove = (event) => {
}
}
}
const emit = defineEmits(['handleRightClick'])
const emit = defineEmits(['handleRightClick', 'checkComplete'])
// 鼠标右击事件
const onMouseDownRight = (event) => {
var raycaster = new THREE.Raycaster()
@ -327,7 +327,7 @@ const onMouseDown = (event) => {
// 高亮所在区域
boxLight(selectedObject);
// 染色点击的模型
console.log(1,clickedObject);
console.log(1, clickedObject);
if (bimStore().activateIndex == '0') {
// 联动左侧菜单
Bus.emit('handleTreeClick', clickedObject);
@ -377,7 +377,7 @@ const cleanColor = () => {
}
// 预警
const warn = () => {
['guan1', 'guan2', 'guan3', 'guan4', 'guan5', 'guan6', 'guan7', 'guan8', 'guan9', 'guan10'].forEach(item => {
['T3', 'T4', 'T5', 'T6', 'T7', 'T8', 'T9', 'T10', 'T11', 'T12'].forEach(item => {
warnSets.push(scene.getObjectByName(item));
})
@ -480,7 +480,7 @@ const toHomeView = () => {
// 恢复初始颜色
cleanColor();
// 隐藏图例
isShowWall = false;
isShowWall.value = false;
}
// 拉近距离
const nearCamera = (floor) => {
@ -500,7 +500,7 @@ const nearCamera = (floor) => {
//标签
const setLabel = () => {
if (isAddLabel.value) {
let obj = scene.getObjectByName('guan2');
let obj = scene.getObjectByName('T11');
addLabel(obj, 'title');
} else {
removeLabel();
@ -539,18 +539,24 @@ const createLableObj = (text, t) => {
// 巡检逻辑
} else {
laberDiv.className = "laber_state";
laberDiv.innerHTML = `<div class="arrow_state">
let innerHTML = t ? `<div class="arrow_state">
<div>设备名称：${text}</div>
<div>
是否通过：
<span class="pass" v-if="${t}">
通过,检查下一个
<span>
<span class="nopass" v-else-if="${!t}">
不通过,已记录异常，检查下一个
<span>
巡检结果：巡检通过
</div>
</div>`
<div>
巡检时间：2023-12-23
</div>
</div>`: `<div class="arrow_state1">
<div>设备名称：${text}</div>
<div>
巡检结果：巡检不通过，已记录异常
</div>
<div>
巡检时间：2023-01-11
</div>
</div>`;
laberDiv.innerHTML = innerHTML;
}
let pointLabel = new CSS2DObject(laberDiv);
return pointLabel;
@ -602,29 +608,29 @@ const xfadd = (obj, state) => {
}
// 更换纹理贴图方法
const changeMap = (img) => {
isShowWall = true;
isShowWall.value = true;
// 获取墙体
model.traverse(e => {
if (['wallnew1', 'wallnew2', 'wallnew3', 'wallnew4'].indexOf(e.name) != -1) {
if (['touliao_wall1', 'touliao_wall2', 'touliao_wall3', 'touliao_wall4', 'touliao_wall5', 'touliao_wall6', 'touliao_wall7', 'touliao_wall8'].indexOf(e.name) != -1) {
console.log(e)
e.material = new THREE.MeshBasicMaterial({
transparent: true,
opacity: 0.5,
color: new THREE.Color('rgb( 88,211,247)')
});
} else if (['wall1988_01', 'wall1988_02', 'wall1988_03'].indexOf(e.name) != -1) {
} else if (['yuanliao_wall1', 'yuanliao_wall2', 'yuanliao_wall3', 'yuanliao_wall4', 'yuanliao_wall5', 'yuanliao_wall6', 'yuanliao_wall7', 'yuanliao_wall8', 'yuanliao_wall9','yuanliao_wall10'].indexOf(e.name) != -1) {
e.material = new THREE.MeshBasicMaterial({
transparent: true,
opacity: 0.5,
color: new THREE.Color('rgb( 0,128,255)')
});
} else if (['wall2010_01', 'wall2010_02'].indexOf(e.name) != -1) {
} else if (['tanghua_wall1', 'tanghua_wall2','tanghua_wall3', 'tanghua_wall4','tanghua_wall5', 'tanghua_wall6','tanghua_wall7', 'tanghua_wall8'].indexOf(e.name) != -1) {
e.material = new THREE.MeshBasicMaterial({
transparent: true,
opacity: 0.5,
color: new THREE.Color('rgb(247,254,46)')
});
} else if (['wall2022_01'].indexOf(e.name) != -1) {
} else if (['tanghua_wall9', 'tanghua_wall10','tanghua_wall11'].indexOf(e.name) != -1) {
e.material = new THREE.MeshBasicMaterial({
transparent: true,
opacity: 0.5,
@ -632,13 +638,12 @@ const changeMap = (img) => {
});
}
})
console.log(123, isShowWall)
}
// 巡检
const check = () => {
if (currentIndex < romeObj.length) {
var checkPosition = checkArr[checkindex].getWorldPosition(new THREE.Vector3());
gsap.to(camera.position, {
x: checkPosition.x,
y: checkPosition.y + 5.2,
@ -646,9 +651,12 @@ const check = () => {
duration: 10,
ease: 'power1.inOut',
onComplete: () => {
if (checkindex == romeObj.length) { // 巡检结束
checkComplete();
}
setTimeout(() => {
check()
}, 5000)
}, 1000)
}
});
// 显示标签，已经检查通过
@ -666,12 +674,19 @@ const check = () => {
duration: 10,
ease: "power1.inOut",
onComplete: () => { },
onComplete: () => {
},
});
checkindex++;
console.log('nextObj', checkindex)
}
}
// 巡检结束
const checkComplete = () => {
toHomeView();
bimStore().setCheckArr(romeObj);
emit('checkComplete', romeObj);
}
</script>
<style lang='scss'>
@ -695,7 +710,7 @@ const check = () => {
cursor: pointer;
// background: #0549a7;
border: 1px solid #3cbfdf;
background: rgba(0,0,0,.8);
background: rgba(0, 0, 0, .8);
width: 110px;
height: 40px;
border-radius: 5px;
@ -736,12 +751,32 @@ const check = () => {
.arrow_state {
display: inline-block;
width: 200px;
height: 100px;
background: rgb(33, 248, 255);
// width: 200px;
// height: 100px;
padding: 10px;
background: #0dbc79;
color: #fff;
padding: 15px;
border-radius: 5px;
>div {
line-height: 32px;
}
}
.arrow_state1 {
display: inline-block;
padding: 10px;
background: #e03528;
color: #fff;
padding: 15px;
border-radius: 5px;
>div {
line-height: 32px;
}
}
.wall_tooltips {
position: absolute;
top: 20px;
@ -752,28 +787,35 @@ const check = () => {
width: 600px;
justify-content: space-around;
align-items: center;
span {
display: inline-block;
width: 16px;
height: 8px;
margin-right: 5px;
&.qing {
background:#3cbfdf;
background: #3cbfdf;
}
&.blue {
background: #2c68f3;
}
&.yellow {
background: #dff04e;
}
&.red {
background: red;
}
}
}
.pass {
color: #0caf71;
}
.nopass {
color: #fc1818;
}

25
src/views/bim/bimHome/index.vue
View File

@ -1,7 +1,8 @@
<template>
<div class="app-container">
<!-- 场景模型 -->
<ThreeView light="0xfffafa" :sceneUrl="sceneUrl" v-if="sceneUrl !== ''" @handleRightClick="handleRightClick"></ThreeView>
<ThreeView light="0xfffafa" :sceneUrl="sceneUrl" v-if="sceneUrl !== ''" @handleRightClick="handleRightClick"
@checkComplete="checkComplete"></ThreeView>
<!-- <ThreeModel /> -->
<!-- 底部菜单 -->
<MenuTab @changeMenu="changeMenu"></MenuTab>
@ -35,6 +36,11 @@
append-to-body>
<DeviceDetial></DeviceDetial>
</el-dialog>
<!-- 巡检结果 -->
<el-dialog v-model="dialogVisible3" v-if="dialogVisible3" title="巡检结果" width="1500px" custom-class="bim-dialog"
append-to-body>
<CheckDetial></CheckDetial>
</el-dialog>
</div>
</template>
@ -54,18 +60,20 @@ import ThreeView from './components/ThreeView2.vue';
import DeviceInfoDialog from './components/DeviceInfoDialog.vue';
import RealInfoDialog from './components/RealInfoDialog.vue';
import DeviceDetial from './components/DeviceDetial.vue';
import CheckDetial from './components/CheckDetial.vue';
import bimStore from '@/store/modules/bim';
import { computed } from 'vue';
import Bus from '@/utils/bus.js';
const data = reactive({
sceneUrl: '/jz/glb/scene.gltf',
equimentInfo: {},
equimentInfo: {}
});
const { sceneUrl, equimentInfo } = toRefs(data);
const dialogVisible = ref(false);
const dialogVisible1 = ref(false);
const dialogVisible2 = ref(false);
const dialogVisible3 = ref(false);
const activateIndex = computed(() =>
bimStore().activateIndex
@ -80,8 +88,8 @@ const deviceInfo = computed(() =>
);
Bus.on('viewMore', (title) => {
// Todo
title === '资产信息' ? dialogVisible.value = true : dialogVisible1.value = true;;
// Todo
title === '资产信息' ? dialogVisible.value = true : dialogVisible1.value = true;;
})
@ -96,13 +104,18 @@ const onProgress = () => {
}
const handleRightClick = (obj) => {
console.log(1,obj.name);
console.log(1, obj.name);
bimStore().setDeviceNum(obj.name);
dialogVisible2.value = true;
// viewDetail();
}
const checkComplete = (romeObj) => {
dialogVisible3.value = true;
}
const handleBuildClick = (value, isParent) => {
// 点击父级，加载/切换场景
if (isParent) {