From 0b229e43bbcbe03fa5d15005f2702c2d7a2f823a Mon Sep 17 00:00:00 2001
From: wanglin <1061700827@qq.com>
Date: Tue, 30 May 2023 14:17:57 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E6=A8=A1=E5=9E=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
device-manager-ui/admin/package.json | 6 +-
.../admin/src/views/analysis/Analysis.vue | 59 ++++++++++----
.../views/analysis/components/three/three.vue | 75 ++++++++++--------
.../views/analysis/components/three/ycjg.png | Bin 0 -> 375 bytes
4 files changed, 90 insertions(+), 50 deletions(-)
create mode 100644 device-manager-ui/admin/src/views/analysis/components/three/ycjg.png
diff --git a/device-manager-ui/admin/package.json b/device-manager-ui/admin/package.json
index b6dfc3f4..a6d08685 100644
--- a/device-manager-ui/admin/package.json
+++ b/device-manager-ui/admin/package.json
@@ -10,12 +10,11 @@
"build:prod": "vue-cli-service build --model prod"
},
"dependencies": {
- "@tweenjs/tween.js": "^18.6.4",
- "three-css2drender": "^1.0.0",
"@ampproject/remapping": "^2.2.0",
"@chenfengyuan/vue-qrcode": "^1.0.2",
"@jiaminghi/data-view": "^2.10.0",
"@riophae/vue-treeselect": "0.4.0",
+ "@tweenjs/tween.js": "^18.6.4",
"@vue/babel-preset-app": "^4.5.13",
"@xunlei/vue-context-menu": "^1.0.2",
"axios": "^0.18.0",
@@ -33,7 +32,7 @@
"quill": "1.3.7",
"screenfull": "5.0.2",
"sockjs-client": "^1.5.1",
- "three": "^0.152.2",
+ "three-css2drender": "^1.0.0",
"v-charts": "^1.17.10",
"vue": "^2.6.14",
"vue-amap": "^0.5.10",
@@ -62,6 +61,7 @@
"sass-loader": "^7.1.0",
"script-ext-html-webpack-plugin": "2.1.5",
"svg-sprite-loader": "5.1.1",
+ "three": "^0.149.0",
"vue-formatter": "^0.0.8",
"vue-template-compiler": "^2.6.10"
},
diff --git a/device-manager-ui/admin/src/views/analysis/Analysis.vue b/device-manager-ui/admin/src/views/analysis/Analysis.vue
index 4ec3e073..1f2460da 100644
--- a/device-manager-ui/admin/src/views/analysis/Analysis.vue
+++ b/device-manager-ui/admin/src/views/analysis/Analysis.vue
@@ -62,7 +62,7 @@
</div>
</div>
<div class="center">
- <three :floorArr="floorArr" lv="1"/>
+ <three :floorArr="floorArr" lv="1" :checkItem="checkDeviceItem"/>
</div>
<div class="right">
<div class="right-content">
@@ -184,7 +184,7 @@ export default {
waitTime: 2000,
},
realTimeInfo: {
- header: ["璁惧鍚嶇О", "鍛婅娆℃暟", "鍛婅鏃堕棿", "鍛婅绫诲瀷"],
+ header: ["璁惧鍚嶇О", "鍛婅娆℃暟", "鍛婅鏃堕棿", "鍛婅绫诲瀷",'璁惧缂栫爜'],
headerHeight: 30,
headerBGC: "#3B5A9E",
oddRowBGC: "",
@@ -205,9 +205,12 @@ export default {
deviceFirmCollect: {}, // 璁惧鍘傚鎺掑悕
alarmLevelCollect: {}, // 浠婃棩鍛婅绛夌骇鍒嗗竷
deviceAlarmMapInfoList: [], // 瀹炴柦鍛婅娑堟伅
+ Statlist:[],//璁惧鍒楄〃
+ checkDeviceItem:{}//閫変腑璁惧
};
},
created() {
+ this.getStatlist()
this.getDevAlarm();
this.getData();
setTimeout(()=>{
@@ -216,8 +219,10 @@ export default {
},
methods: {
// 鐐瑰嚮璁惧
- tabelRow(row){
- console.log(row)
+ tabelRow(arr){
+
+ const {rowIndex} = arr
+ this.checkDeviceItem = this.Statlist[rowIndex]
},
// 鑾峰彇浠婃棩鍛婅璁惧缁熻
getDevAlarm() {
@@ -247,19 +252,18 @@ export default {
this.siteDeviceAlarmCollect = siteDeviceAlarmCollect;
this.alarmLevelCollect = alarmLevelCollect;
this.deviceAlarmMapInfoList = deviceAlarmMapInfoList;
- if (deviceAlarmMapInfoList.length) {
- let arr = deviceAlarmMapInfoList.map((v) => {
- return [
- v.deviceName,
- v.count,
- v.alarmTime,
- this.filterDevAlarmType(v.alarmType),
- ];
- });
+ // if (deviceAlarmMapInfoList.length) {
+ // let arr = deviceAlarmMapInfoList.map((v) => {
+ // return [
+ // v.deviceName,
+ // v.count,
+ // v.alarmTime,
+ // this.filterDevAlarmType(v.alarmType),
+ // ];
+ // });
- this.realTimeInfo = { ...this.realTimeInfo, data: arr };
- }
- console.log(this.deviceAlarmMapInfoList,"@@@@@@@@@@@")
+ // this.realTimeInfo = { ...this.realTimeInfo, data: arr };
+ // }
let { 鐩磋繛璁惧, 瀛愯澶�, 缃戝叧璁惧 } = deviceConnTypeCollect;
let { 鍦ㄧ嚎, 绂荤嚎, 缂虹焊 } = alarmTypeCollect;
let firmName = Object.keys(deviceFirmCollect).map((key) => key);
@@ -286,6 +290,29 @@ export default {
}
);
},
+ // 鏌ヨ鍗曚釜寮傚父璁惧
+ getStatlist(){
+ this.$post("/device/alarm/info/statlist", { siteId: this.siteId }).then(res=>{
+ console.log(res,"@@@@@")
+ const {code,data} = res
+ if(code == 1){
+ this.Statlist = data || []
+ if (data.length) {
+ let arr = data.map((v) => {
+ return [
+ v.device.deviceName,
+ v.todayAlarmDeviceCount,
+ this.$moment(v.alarmTime).format('YYYY-MM-DD HH:mm'),
+ v.alarmTypeStr,
+ v.device.deviceCode
+ ];
+ });
+
+ this.realTimeInfo = { ...this.realTimeInfo, data: arr };
+ }
+ }
+ })
+ },
// 鑾峰彇璁惧绫诲瀷鍒嗗竷鍥炬爣
getDevTypeDisEchart(direct, subset, network) {
let chartDom = document.getElementById("devTypeDis");
diff --git a/device-manager-ui/admin/src/views/analysis/components/three/three.vue b/device-manager-ui/admin/src/views/analysis/components/three/three.vue
index 17bb6fe0..3a488522 100644
--- a/device-manager-ui/admin/src/views/analysis/components/three/three.vue
+++ b/device-manager-ui/admin/src/views/analysis/components/three/three.vue
@@ -8,11 +8,18 @@
<div class="marke-win">{{ checkWind.window_name }}-{{ checkWind.window_fromnum }}</div>
<div class="marke-box">
<div class="marke-box-c">
+ <p>璁惧缂栫爜:1565155</p>
+ <p>MAC鍦板潃:70:70:70:70:70:705</p>
+ <p>璁惧浣嶇疆锛�1妤煎尰淇濆ぇ鍘�</p>
+ <p>璐熻矗浜猴細鍒樺痉鍗�</p>
+ <p>鑱旂郴鐢佃瘽锛�13088088888</p>
<p class="b">鎵€鍦ㄩ儴闂細{{ checkWind.section_name }}</p>
<p class="y">鍔炵悊涓氬姟锛�<span v-for="(itemm, index) in checkWind.business" :key="index"
style="padding-right:5px">{{ itemm }}</span></p>
</div>
- <div class="ant-popover-arrow"></div>
+ <div class="ant-popover-arrow">
+ <img src="./ycjg.png" alt="">
+ </div>
</div>
</div>
@@ -101,7 +108,7 @@ class PositionGUI {
}
let bmMark = []//dom鑺傜偣
export default {
- props: ['lv', 'floorArr', 'winMarkeList', 'bm'],
+ props: ['lv', 'floorArr', 'winMarkeList', 'bm','checkItem'],//checkItem閫変腑绐楀彛
data() {
return {
bmkb,//渚挎皯鐪嬫澘
@@ -114,6 +121,25 @@ export default {
}
},
watch: {
+ checkItem:{
+ handler: function (str) {
+ let winName = str.device.deviceCode
+ // Tips.visible = true
+ console.log(keyobj,winName)
+ if (keyobj[winName]) {
+ const { x, y, z } = keyobj[winName].positions
+ Tips.position.set(x, y, z);//鏂囧瓧鍦板潃
+ Tips.visible = true
+ // camera.position.x = x*0.5;
+ // camera.position.y = y*0.8;
+ // camera.position.z = z;
+ } else {
+ Tips.visible = false
+ this._initCamera()
+ }
+ },
+ deep: true
+ },
bm: {
handler: function (str) {
// 淇濆瓨鑺傜偣
@@ -338,7 +364,7 @@ export default {
let css2dom = document.getElementById('alert-css2')
Tips = new CSS2DObject(css2dom);
Tips.position.set(0, 0, 0);//鏂囧瓧鍦板潃
- Tips.visible = false
+ Tips.visible = true
scene.add(Tips);
labelRenderer = new CSS2DRenderer(); //鏂板缓CSS2DRenderer
labelRenderer.setSize(screenW, screenH);
@@ -404,9 +430,9 @@ export default {
const children = obj.scene.children[0].children
children.forEach(element => {
let objname = element.name
- console.log(objname,"#######");
- // 绐楀彛
- if (/^\d_/.test(objname)) {
+ // console.log(objname,"#######");
+ // mac鍦板潃妯″瀷
+ if (objname,length == 17) {
// 鑾峰彇澶栭儴妯″瀷鍏蜂綋鐐瑰嚮浣嶇疆 obj妯″瀷娌℃湁浣嶇疆
element.geometry.computeBoundingSphere();
// 鐞冧綋涓績鐐�
@@ -578,42 +604,36 @@ export default {
.marke {
position: absolute;
- width: 314px;
-
+ width: 200px;
+ background: rgba(183, 206, 255, .9);
.marke-win {
height: 40px;
line-height: 40px;
- background: #FFFFFF;
- box-shadow: 0px 0px 8px 0px rgba(19, 43, 78, 0.3);
- border-radius: 16px;
+ background: rgba(59, 90, 158, 0.76);
font-size: 20px;
font-weight: bold;
- color: #F77234;
+ color: #fff;
padding: 0 24px;
box-sizing: border-box;
}
.marke-box {
- border-radius: 16px;
margin-top: 4px;
- padding: 12px 24px 0 24px;
- background: #fff;
- box-shadow: 0px 0px 8px 0px rgba(19, 43, 78, 0.3);
+ padding: 12px 12px 0 12px;
position: relative;
.marke-box-c {
position: relative;
z-index: 1;
- background-color: #fff;
height: 100%;
padding-bottom: 12px;
}
p {
- font-size: 14px;
- font-weight: bold;
- color: #F77234;
- line-height: 30px;
+ font-size: 12px;
+ // font-weight: bold;
+ color: #fff;
+ line-height: 1.5;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
@@ -630,17 +650,10 @@ export default {
.ant-popover-arrow {
position: absolute;
display: block;
- width: 8.48528137px;
- height: 8.48528137px;
- background: transparent;
- border-style: solid;
- border-width: 8px;
- transform: rotate(45deg);
+ width: 20px;
+ height: 20ox;
left: 50%;
- transform: translateX(-50%) rotate(45deg);
- bottom: -6px;
- border-color: transparent #fff #fff transparent;
- box-shadow: 3px 3px 7px rgb(0 0 0 / 7%);
+ bottom: -40px;
}
}
diff --git a/device-manager-ui/admin/src/views/analysis/components/three/ycjg.png b/device-manager-ui/admin/src/views/analysis/components/three/ycjg.png
new file mode 100644
index 0000000000000000000000000000000000000000..ae8bee8e4204b98b0fd1498e402b19e5e987a754
GIT binary patch
literal 375
zcmV--0f_#IP)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%0003#Nkl<ZIE|f^
zJ5R$f6otQ7EP&LB$4IG|%T{0oCKhJ?AuCHKBxbr%iM50oSdi$(LnpSSB-d_3j^rW7
z_kMPq>zm@2q#Q5|V;|TCzJV{`9Vo;2X(y+Ef}8>aGt<;3@Cdx*fCVrCj!o)nJpnVI
zLb+OK9~dEL5+5RP)Du>Rior&Jo|zD@F>o2qmGB|%fw_tFj8bQK1e}{`xCX9_>oo=L
zj0+F0wt9PKIT&GXY+M)$xMyttn(LH`*%ffp*l=JRt5nREOI3SE6{#=*m&S!x<5-o(
zfu(>S#`dMLPN|qTmsx2ZN+YLfrWUI@6!a!^l(uvOE;<&rI?-)x4x>yN{6|`75%2OM
zbdA1Jt{9DOqZahs1E?J3R!TM4L*S%igB7US*(#u<o$Fi$->H4D_zO^%7N~hCfIsMy
VL7zI~L9GA)002ovPDHLkV1nFZob~_!
literal 0
HcmV?d00001
--
2.24.3