增加模型

device-manager-ui/admin/package.json

@@ -10,6 +10,8 @@
     "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",

device-manager-ui/admin/src/views/analysis/Analysis.vue

@@ -61,7 +61,9 @@
           </div>
         </div>
       </div>
-      <div class="center"></div>
+      <div class="center">
+        <three :floorArr="floorArr" lv="1"/>
+      </div>
       <div class="right">
         <div class="right-content">
           <!-- 设备告警汇总 -->
@@ -118,6 +120,7 @@
             <TitleItem title="实时告警信息发布" />
             <div class="real-time-list">
               <dv-scroll-board
+                @click="tabelRow"
                 :config="realTimeInfo"
                 style="width: 100%; height: 100%"
               />
@@ -130,16 +133,50 @@
 </template>
 
 <script>
+const floorArr = [
+  {
+    id: 4,
+    building: 1,
+    lv: 1,
+    picture: "",
+    phonepicture: "",
+    mtl_url: "/uploads/floor/yibin2/L1.mtl",
+    obj_url: "/glft/sbglL1.gltf",
+    siteid: 1,
+    type: 1,
+    create_time: "2023-03-13 11:32:38",
+    update_time: "2023-04-08 11:40:07",
+    zip_url: "/uploads/floor/L1-1/L1-1.zip",
+  },
+  {
+    id: 5,
+    building: 1,
+    lv: 2,
+    picture: "",
+    phonepicture: "",
+    mtl_url: "/uploads/floor/yibin/L2.mtl",
+    obj_url: "/glft/sbglL2.gltf",
+    siteid: 1,
+    type: 1,
+    create_time: "2023-03-13 16:54:14",
+    update_time: "2023-04-08 11:40:21",
+    zip_url: "/uploads/floor/L2-1/L2-1.zip",
+  },
+];
+
 import HeaderSite from "./components/HeaderSite.vue";
 import TitleItem from "./components/TitleItem.vue";
+import three from "./components/three/three.vue";
 import session from "@/assets/utils/session";
 export default {
   components: {
     HeaderSite,
     TitleItem,
+    three
   },
   data() {
     return {
+      floorArr:[],
       siteId: session.getSession("siteid"),
       warningInfo: {
         data: [],
@@ -156,7 +193,6 @@ export default {
         align: ["center", "center", "center", "center"],
         data: [],
       },
-      floorArr: [],
       lv: "1",
       deviceTotalCount: 0, // 总设备数量
       siteSize: 0, // 监控站点数量
@@ -174,8 +210,15 @@ export default {
   created() {
     this.getDevAlarm();
     this.getData();
+    setTimeout(()=>{
+      this.floorArr = floorArr
+    },500)
   },
   methods: {
+    // 点击设备
+    tabelRow(row){
+      console.log(row)
+    },
     // 获取今日告警设备统计
     getDevAlarm() {
       this.$post("/device/alarm/info/stats", { siteId: this.siteId }).then(
@@ -213,8 +256,10 @@ export default {
                 this.filterDevAlarmType(v.alarmType),
               ];
             });
+            
             this.realTimeInfo = { ...this.realTimeInfo, data: arr };
           }
+          console.log(this.deviceAlarmMapInfoList,"@@@@@@@@@@@")
           let { 直连设备, 子设备, 网关设备 } = deviceConnTypeCollect;
           let { 在线, 离线, 缺纸 } = alarmTypeCollect;
           let firmName = Object.keys(deviceFirmCollect).map((key) => key);
@@ -720,10 +765,9 @@ export default {
     }
   }
   .center {
-    // .three {
-    //   height: 500px;
-    //   width: 500px;
-    // }
+    height: 780px;
+    width: 780px;
+    position: relative;
   }
   .right {
     width: 500px;