diff --git a/src/assets/images/break-set.png b/src/assets/images/break-set.png
new file mode 100644
index 0000000..7433b05
Binary files /dev/null and b/src/assets/images/break-set.png differ
diff --git a/src/assets/images/online-set.png b/src/assets/images/online-set.png
new file mode 100644
index 0000000..1069224
Binary files /dev/null and b/src/assets/images/online-set.png differ
diff --git a/src/assets/images/wait.png b/src/assets/images/wait.png
new file mode 100644
index 0000000..7587d91
Binary files /dev/null and b/src/assets/images/wait.png differ
diff --git a/src/views/bim/bimHome/components/MenuTab.vue b/src/views/bim/bimHome/components/MenuTab.vue
index 8b3f691..5653ee1 100644
--- a/src/views/bim/bimHome/components/MenuTab.vue
+++ b/src/views/bim/bimHome/components/MenuTab.vue
@@ -12,7 +12,7 @@ import Bus from '@/utils/bus.js';
const menuList = [
{
name: '建筑信息',
- background: '#000000'
+ background: '#091d36'
},
{
name: '资产信息',
diff --git a/src/views/bim/bimHome/components/ThreeView2.vue b/src/views/bim/bimHome/components/ThreeView2.vue
index 048d696..52c12e5 100644
--- a/src/views/bim/bimHome/components/ThreeView2.vue
+++ b/src/views/bim/bimHome/components/ThreeView2.vue
@@ -49,7 +49,9 @@ import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader.js";
import { RoomEnvironment } from "three/examples/jsm/environments/RoomEnvironment.js";
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls.js";
import TWEEN from "@tweenjs/tween.js";
-import imgs from "../../../../assets/finish.png";
+import imgs from "../../../../assets/images/online-set.png";
+import imgs1 from "../../../../assets/images/break-set.png";
+import imgs2 from "../../../../assets/images/wait.png";
import {
CSS2DObject,
CSS2DRenderer,
@@ -474,9 +476,10 @@ const createLableObj = (text, t) => {
if (t === 'title') {
laberDiv.className = "laber_name";
laberDiv.innerHTML = `
-
设备名称:${text}
-
状态:启用
-
压力:50 Pa
+
名称:${text}
+
容积:80m³
+
温度:25.2℃
+
压力:15Bar
`
//只显示详情
} else if (t === 'details') {
@@ -490,28 +493,38 @@ const createLableObj = (text, t) => {
// 巡检逻辑
} else {
setTimeout(()=>{
- laberDiv.innerHTML = `巡检中...
`;
+ laberDiv.innerHTML = `
+
+
+
巡检中
+
+
名称:${text}
+
容积:80m³
+
温度:25.2℃
+
压力:15Bar
+
`
},1000)
setTimeout(()=>{
laberDiv.className = "laber_state";
let innerHTML = t ? `
-
设备名称:${text}
-
- 巡检结果:巡检通过
+
-
-
- 巡检时间:2023-12-23
-
+
巡检通过
+
+
名称:${text}
+
容积:80m³
+
温度:25.2℃
+
压力:15Bar
`: `
-
设备名称:${text}
-
- 巡检结果:巡检不通过,已记录异常
-
-
-
- 巡检时间:2023-01-11
+
+
+
发现异常
+
名称:${text}
+
容积:80m³
+
温度:25.2℃
+
压力:15Bar
+
已记录
`;
laberDiv.innerHTML = innerHTML;
@@ -711,19 +724,15 @@ const checkComplete = () => {
}
}
-.laber_name {
- width: 120px;
- height: 90px;
- padding: 5px 10px;
- white-space: nowrap;
- background-color: #ffffffb3;
- border-radius: 12px;
- font-size: 12px;
- display: flex;
- flex-direction: column;
-
- span {
- line-height: 24px;
+.arrow_outer {
+ display: inline-block;
+ padding: 10px;
+ background: #999999;
+ color: #000;
+ padding: 15px;
+ border-radius: 5px;
+ >div {
+ line-height: 32px;
}
}
@@ -742,13 +751,19 @@ const checkComplete = () => {
.arrow_state {
display: inline-block;
- // width: 200px;
- // height: 100px;
padding: 10px;
- background: #0dbc79;
- color: #fff;
+ background: #68774f;
+ color: #000;
padding: 15px;
border-radius: 5px;
+ .title {
+ color: #81b337;
+ display: flex;
+ align-items: center;
+ span{
+ margin-left:5px;
+ }
+ }
>div {
line-height: 32px;
@@ -758,11 +773,41 @@ const checkComplete = () => {
.arrow_state1 {
display: inline-block;
padding: 10px;
- background: #e03528;
- color: #fff;
+ background: #6e5053;
+ color: #000;
padding: 15px;
border-radius: 5px;
-
+ .title {
+ color: #bd3124;
+ display: flex;
+ align-items: center;
+ span{
+ margin-left:5px;
+ }
+ }
+ .ycdiv {
+ border: 1px solid #bd3124;
+ padding: 2px 5px;
+ }
+ >div {
+ line-height: 32px;
+ }
+}
+.arrow_state2 {
+ display: inline-block;
+ padding: 10px;
+ background: #999999;
+ color: #000;
+ padding: 15px;
+ border-radius: 5px;
+ .title {
+ color: #d79c55;
+ display: flex;
+ align-items: center;
+ span{
+ margin-left:5px;
+ }
+ }
>div {
line-height: 32px;
}
@@ -802,38 +847,6 @@ const checkComplete = () => {
}
}
}
-.arrow_outer {
- width: 100px;
- display: flex;
- flex-wrap: wrap;
- justify-content: space-between;
- align-items: center;
- >div {
- line-height: 24px;
- }
-}
-.arrow_state {
- display: inline-block;
- width: 200px;
- background: #2dfa82c4;
- color: #fff;
- padding: 15px;
- border-radius: 5px;
- >div {
- line-height: 32px;
- }
-}
-.arrow_state1 {
- display: inline-block;
- background: #e03528;
- color: #fff;
- padding: 15px;
- border-radius: 5px;
-
- >div {
- line-height: 32px;
- }
-}
@keyframes textAnimation {
0% {
transform: scale(1);