Pārlūkot izejas kodu

main page animate

Changpeng Duan 5 gadi atpakaļ
vecāks
revīzija
66a77b55c8

+ 6 - 0
src/api/getApiRes.js

@@ -59,6 +59,12 @@ export function SignOut(postdata) {
     return getApiBasic(url,postdata);
 }
 
+// 获取首页左侧组织结构信息
+export function GetRegionAndDectorSelect(postdata) {
+    let url = headapi + 'v1/Auth/GetRegionAndDectorSelect';
+    return getApiBasic(url,postdata);
+}
+
 
 
 

BIN
src/assets/img/main/bigTitle.png


+ 99 - 15
src/components/Console.vue

@@ -9,7 +9,7 @@
                 控制台
             </div>
             <div class="cslist cubeContent">
-                <div class="cstitle">
+                <div class="cstitle" @click="ClickGetInfo(0,0)">
                     安全监控首页
                 </div>
                 <div class="loft cspart">
@@ -19,31 +19,43 @@
                     <el-row :gutter="21">
                         <el-col :span="8" v-for="(loft,i) in loftList">
                             <div :class="[{'active':loftIndex == i+1 }]" @click="ClickGetInfo(1,i)">
-                                <div class="grid-content bg-purple"> {{loft.name}}</div>
+                                <div class="grid-content bg-purple"> {{loft.Name}}</div>
                             </div>
                         </el-col>
                     </el-row>
                 </div>
-                <div class="manage cspart">
+                <div class="manage cspart" v-show="manageList.length != 0">
                     <div class="lt_title">
                         楼层管理区域
                     </div>
                     <el-row :gutter="21">
                         <el-col :span="8" v-for="(manage,j) in manageList">
                             <div :class="[{'active':manageIndex ==j+1 }]" @click="ClickGetInfo(2,j)">
-                                <div class="grid-content bg-purple">{{manage.name}}</div>
+                                <div class="grid-content bg-purple">{{manage.Name}}</div>
                             </div>
                         </el-col>
                     </el-row>
                 </div>
-                <div class="equip cspart">
+                <div class="manage cspart" v-show="RoomList.length != 0">
+                    <div class="lt_title">
+                        房间管理区域
+                    </div>
+                    <el-row :gutter="21">
+                        <el-col :span="8" v-for="(Room,j) in RoomList">
+                            <div :class="[{'active':RoomIndex ==j+1 }]" @click="ClickGetInfo(3,j)">
+                                <div class="grid-content bg-purple">{{Room.Name}}</div>
+                            </div>
+                        </el-col>
+                    </el-row>
+                </div>
+                <div class="equip cspart" v-show="equipList.length != 0">
                     <div class="lt_title">
                         SignalDigger设备
                     </div>
                     <el-row :gutter="21">
                         <el-col :span="8" v-for="(equip,t) in equipList">
-                            <div :class="[{'active':equipIndex == t+1 }]" @click="ClickGetInfo(3,t)">
-                                <div class="grid-content bg-purple"> {{equip.name}}</div>
+                            <div :class="[{'active':equipIndex == t+1 }]" @click="ClickGetInfo(4,t)">
+                                <div class="grid-content bg-purple"> {{equip.Name}}</div>
                             </div>
                         </el-col>
                     </el-row>
@@ -55,16 +67,20 @@
 </template>
 
 <script>
-    import {getLoftInfo} from '../api/getApiRes.js'
+    import {GetRegionAndDectorSelect} from '../api/getApiRes.js'
 
+    let qs = require('qs');
     export default {
         data() {
             return {
                 loftList: [],
                 manageList: [],
+                RoomList: [],
                 equipList: [],
+                FullChildlRs: [],
                 loftIndex: 0,
                 manageIndex: 0,
+                RoomIndex: 0,
                 equipIndex: 0,
             };
         },
@@ -73,13 +89,15 @@
         },
         methods: {
             // 获取楼层信息
-            ClickGetInfo(list, index) {
+            ClickGetInfo(level, index) {
                 // 切换到选中
                 this.loftIndex = 0;
                 this.manageIndex = 0;
                 this.equipIndex = 0;
                 let thisBtn = {};
-                switch (parseInt(list)) {
+                switch (parseInt(level)) {
+                    case 0:
+                        break;
                     case 1:
                         this.loftIndex = index + 1;
                         thisBtn = this.loftList[index];
@@ -89,20 +107,85 @@
                         thisBtn = this.manageList[index];
                         break;
                     case 3:
+                        this.RoomIndex = index + 1;
+                        thisBtn = this.RoomList[index];
+                        break;
+                    case 4:
                         this.equipIndex = index + 1;
                         thisBtn = this.equipList[index];
                         break;
                 }
+                this.$emit('refreshList', level, thisBtn);
+                if (thisBtn) {
+                    this.showMyChild(level, thisBtn);
+                    this.thisShowPart(level, thisBtn);
+                }
+            },
+            // 展示下层节点
+            showMyChild(level, thisBtn) {
+                let that = this;
+                switch (parseInt(level)) {
+                    case 1:
+                        that.manageList = [];
+                        that.RoomIndex = 0;
+                        that.equipIndex = 0;
+                        that.RoomList = [];
+                        that.equipList = [];
+                        for (var i = 0; i < that.FullChildlRs.length; i++) {
+                            if (that.FullChildlRs[i].Id == thisBtn.Id) {
+                                that.manageList = that.FullChildlRs[i].ChildSelect;
+                                that.equipList = that.FullChildlRs[i].Detselect;
+                            }
+                        }
+                        break;
+                    case 2:
+                        that.RoomIndex = 0;
+                        that.equipIndex = 0;
+                        that.RoomList = [];
+                        that.equipList = [];
+                        for (var i = 0; i < that.FullChildlRs.length; i++) {
+                            for (var t = 0; t < that.FullChildlRs[i].ChildSelect.length; t++) {
+                                if (that.FullChildlRs[i].ChildSelect[t].Id == thisBtn.Id) {
+                                    that.RoomList = that.FullChildlRs[i].ChildSelect[t].ChildSelect;
+                                    that.equipList = that.FullChildlRs[i].ChildSelect[t].Detselect;
+                                }
+                            }
+                        }
+                        break;
+                    case 3:
+                        that.equipList = [];
+                        for (var i = 0; i < that.FullChildlRs.length; i++) {
+                            for (var t = 0; t < that.FullChildlRs[i].ChildSelect.length; t++) {
+                                for (var j = 0; j < that.FullChildlRs[i].ChildSelect[t].ChildSelect.length; j++) {
+                                    if (that.FullChildlRs[i].ChildSelect[t].ChildSelect[j].Id == thisBtn.Id) {
+                                        that.equipList = that.FullChildlRs[i].ChildSelect[t].ChildSelect[j].Detselect;
+                                    }
+                                }
+                            }
+                        }
+                        break;
+                    case 4:
+                        that.RoomIndex = 0;
+                        break;
+                }
+            },
+            thisShowPart(level, thisBtn) {
+
             },
             // 获取楼层信息
             getLoftList() {
-                let postdata = {};
-                getLoftInfo(postdata).then(res => {
+                let param = {
+                    'token': localStorage.token,
+                };
+                let postdata = qs.stringify(param);
+                GetRegionAndDectorSelect(postdata).then(res => {
                     let json = res;
                     if (json.Code == 0) {
-                        this.loftList = json.Rs;
-                        this.manageList = json.Rs;
-                        this.equipList = json.Rs;
+                        this.loftList = json.Region1Rs;//所有1级
+                        this.manageList = json.Region2Rs;//所有2级
+                        this.RoomList = json.Region3Rs;//所有3级
+                        this.equipList = json.DectectorRs;//所有设备
+                        this.FullChildlRs = json.FullChildlRs;//全部关系
                     } else {
                         that.$message.error(json.Memo);
                     }
@@ -134,6 +217,7 @@
         border: 1px solid #005EA2;
         line-height: 45px;
         margin-bottom: 26px;
+        cursor: pointer;
     }
 
     .cspart {

+ 5 - 4
src/components/Loft.vue

@@ -37,7 +37,7 @@
         width: 690px;
         height: 481px;
         float: right;
-        margin-top: 3px;
+        margin-top: 11px;
     }
 
     .loftContainer {
@@ -53,13 +53,14 @@
 
     .curTitle {
         width: 164px;
-        height: 36px;
+        height: 26px;
+        line-height: 26px;
         font-size: 18px;
-        line-height: 36px;
         color: #6DC1FF;
         float: left;
         text-align: center;
-        background: url("../assets/img/op_title.png") top center no-repeat;
+        background: url("../assets/img/main/title.png") top center no-repeat;
+        /*background: url("../assets/img/op_title.png") top center no-repeat;*/
         background-size: 100% 100%;
     }
 

+ 5 - 4
src/components/Room.vue

@@ -31,7 +31,7 @@
         width: 690px;
         height: 481px;
         float: right;
-        margin-top: 3px;
+        margin-top: 11px;
     }
 
     .RoomContainer {
@@ -47,13 +47,14 @@
 
     .curTitle {
         width: 164px;
-        height: 36px;
+        height: 26px;
+        line-height: 26px;
         font-size: 18px;
-        line-height: 36px;
         color: #6DC1FF;
         float: left;
         text-align: center;
-        background: url("../assets/img/op_title.png") top center no-repeat;
+        background: url("../assets/img/main/title.png") top center no-repeat;
+        /*background: url("../assets/img/op_title.png") top center no-repeat;*/
         background-size: 100% 100%;
     }
 

+ 176 - 0
src/components/SingleEquipInfo.vue

@@ -0,0 +1,176 @@
+<template>
+    <div class="equipinfo">
+        <div class="other-people">
+            <div class="image-border image-border1"></div>
+            <div class="image-border image-border2"></div>
+            <div class="image-border image-border3"></div>
+            <div class="image-border image-border4"></div>
+            <div class="other-people-title">
+                设备信息统计
+            </div>
+            <div class="thisContent">
+                <h5>设备运行时间 <s class="timeShow">{{timeShow}}</s></h5>
+                <ul>
+                    <li>
+                        <div class="ringCircle">
+                            <Ring></Ring>
+                        </div>
+                        <em>{{info.state}}</em>
+                        <span>设备状态</span>
+                    </li>
+                    <li>
+                        <div class="ringCircle">
+                            <Ring></Ring>
+                        </div>
+                        <em>{{info.warning}}台</em>
+                        <span>可疑事件数</span>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    import Ring from '@/components/Ring.vue'
+    export default {
+        data(){
+            return{
+                timeShow: ' 00 : 00 : 00',
+                info:{
+                    state:'在线',
+                    warning:72,
+                }
+            }
+        },
+        mounted() {
+            // this.timeRun();
+            // this.timer = setInterval(() => {
+            //     this.timeRun();
+            // }, 1000);
+        },
+        beforeDestroy() {
+            clearInterval(this.timer);
+        },
+        methods: {
+            // 显示设备持续时间
+            timeRun() {
+                let seconds = this.seconds;
+                let hour = parseInt(seconds / 3600);
+                let r = parseInt(seconds % 3600);
+                let m = parseInt(r / 60);
+                let s = parseInt(r % 60);
+                hour = hour > 9 ? hour : '0' + hour;
+                m = m > 9 ? m : '0' + m;
+                s = s > 9 ? s : '0' + s;
+                let res = hour + " : " + m + " : " + s;
+                this.timeShow = res;
+                this.seconds += 1;
+            },
+        },
+        components: {
+            Ring
+        }
+    }
+</script>
+
+<style scoped>
+    .thisContent {
+        width: 100%;
+        height: 400px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+    .equipinfo {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+    .other-people {
+        width: 439px;
+        height: 422px;
+        margin-left: 0;
+        overflow: hidden;
+        background: #000F2A;
+    }
+    .equipinfo .image-border2 {
+        right: 0;
+    }
+    .equipinfo .image-border4 {
+        right: 0;
+    }
+    ul,li {
+        list-style: none;
+        padding: 0;
+        margin: 0;
+    }
+    .thisContent ul {
+        width: 80%;
+        height: 100%;
+        overflow: hidden;
+        display: block;
+        padding: 0 13px;
+        margin: 0 auto;
+        margin-top: 60px;
+    }
+    .thisContent ul li {
+        width: 120px;
+        height: 110px;
+        float: left;
+        margin-right: 20px;
+    }
+    .thisContent ul li:nth-child(2){
+        margin-right: 0;
+        float: right;
+    }
+    .ringCircle {
+        width: 100px;
+        height: 100px;
+        overflow: hidden;
+        border-radius: 250px;
+        border:10px solid rgba(37,146,226,0.6) ;
+    }
+    .thisContent li em {
+        position: relative;
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        bottom: 75px;
+        color: #67BFFF;
+        font-size: 18px;
+        text-align: center;
+        font-style: normal;
+    }
+    .thisContent li span {
+        position: relative;
+        bottom: 20px;
+        color: #67BFFF;
+        font-size: 16px;
+        text-align: center;
+    }
+    .thisContent h5 {
+        width: 320px;
+        height: 43px;
+        line-height: 43px;
+        text-align: center;
+        color: #6DC1FF;
+        font-size: 22px;
+        margin: 0;
+        margin-left: 41px;
+        margin-top: 60px;
+        margin-bottom: 19px;
+        background: url("../assets/img/main/bigTitle.png") top center no-repeat;
+        background-size: 100% 100%;
+    }
+    .timeShow {
+        text-decoration: none;
+        line-height: 43px;
+        font-size: 24px;
+        color: #6DC1FF;
+        text-align: center;
+        font-family: UnidreamLED;
+    }
+</style>

+ 93 - 9
src/components/Total.vue

@@ -36,6 +36,16 @@
                     <Room></Room>
                 </div>
             </div>
+            <div class="DetctorContianer" v-if="DetctorPanel">
+                <div class="tlt">
+                    <h5>正在监测</h5>
+                    <BigRader></BigRader>
+                </div>
+                <div class="trt">
+                    <h5>实时监测记录</h5>
+                    <Watching></Watching>
+                </div>
+            </div>
         </div>
     </div>
 </template>
@@ -46,16 +56,47 @@
     import Watching from '@/components/Watching.vue'
     import Loft from '@/components/Loft.vue'
     import Room from '@/components/Room.vue'
+
     export default {
-        data(){
-          return{
-              TotalPanel:true,//总控
-              LoftPanel:false,//楼层
-              RoomPanel:false,//房间
-          }
+        data() {
+
+            return {
+                TotalPanel: true,//总控
+                LoftPanel: false,//楼层
+                RoomPanel: false,//房间
+                DetctorPanel: false,//设备
+            }
+        },
+        props: ['postTitle'],
+        watch: {
+            postTitle:function(val){
+                let that = this;
+                that.TotalPanel = false;
+                that.LoftPanel = false;
+                that.RoomPanel = false;
+                that.DetctorPanel = false;
+
+                switch (parseInt(val)) {
+                    case 0: //默认全部
+                        that.TotalPanel = true;
+                        break;
+                    case 1: //楼层区域
+                        that.LoftPanel = true;
+                        break;
+                    case 2: //小区域
+                        that.RoomPanel = true;
+                        break;
+                    case 3: //房间区域
+                        that.RoomPanel = true;
+                        break;
+                    case 4: //单个设备
+                        that.DetctorPanel = true;
+                        break;
+                }
+            }
         },
         components: {
-            BigRader,Watching,SmallRader,Loft,Room
+            BigRader, Watching, SmallRader, Loft, Room
         }
     }
 </script>
@@ -68,11 +109,13 @@
         overflow: hidden;
         background: #000F2A;
     }
-    ul,li {
+
+    ul, li {
         list-style: none;
         padding: 0;
         margin: 0;
     }
+
     .totalContianer {
         width: 100%;
         overflow: hidden;
@@ -80,17 +123,20 @@
         margin: 0 auto;
         margin-top: 55px;
     }
+
     .totalContianer .tlt {
         width: 48%;
         float: left;
         padding-left: 10px;
     }
+
     .totalContianer .trt {
         width: 48%;
         float: right;
         padding-right: 20px;
         overflow: hidden;
     }
+
     .totalContianer h5 {
         width: 126px;
         height: 26px;
@@ -101,35 +147,73 @@
         margin: 0;
         margin-left: 33%;
         margin-bottom: 19px;
-        background: url("../assets/img/main/title.png")top center no-repeat;
+        background: url("../assets/img/main/title.png") top center no-repeat;
         background-size: 100% 100%;
     }
+
     .total .image-border2 {
         right: 0;
     }
+
     .total .image-border4 {
         right: 0;
     }
+
     .loftContainer .tlt {
         float: left;
         padding-left: 10px;
         margin-top: 60px;
     }
+
     .loftContainer .trt {
         float: right;
         padding-right: 20px;
         overflow: hidden;
         margin-top: 30px;
     }
+
     .RoomContainer .tlt {
         float: left;
         padding-left: 10px;
         margin-top: 60px;
     }
+
     .RoomContainer .trt {
         float: right;
         padding-right: 20px;
         overflow: hidden;
         margin-top: 30px;
     }
+    .DetctorContianer {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        margin-top: 55px;
+    }
+    .DetctorContianer .tlt {
+        width: 48%;
+        float: left;
+        padding-left: 10px;
+    }
+
+    .DetctorContianer .trt {
+        width: 48%;
+        float: right;
+        padding-right: 20px;
+        overflow: hidden;
+    }
+    .DetctorContianer h5 {
+        width: 126px;
+        height: 26px;
+        line-height: 26px;
+        text-align: center;
+        color: #6DC1FF;
+        font-size: 14px;
+        margin: 0;
+        margin-left: 33%;
+        margin-bottom: 19px;
+        background: url("../assets/img/main/title.png") top center no-repeat;
+        background-size: 100% 100%;
+    }
 </style>

+ 12 - 17
src/components/Watching.vue

@@ -17,6 +17,7 @@
         data() {
             return {
                 list: [],
+                readyList: [],
             }
         },
         mounted() {
@@ -24,7 +25,11 @@
             let that = this;
             this.timer = setInterval(() => {
                 that.getDate();
-            }, 6800);
+            }, 2800);
+        },
+        destroyed () {
+            clearInterval(this.timer);//页面销毁时清除定时器
+            clearInterval(this.wordDisplay);//页面销毁时清除定时器
         },
         methods: {
             getDate() {
@@ -36,29 +41,19 @@
                 Watching(postdata).then(res => {
                     let json = res;
                     if (json.Code == 0) {
-                        this.list = json.Rs;
-                        console.log(this.list.length);
-                        for(var i = 0; i < this.list.length; i++) {
-                            that.wordDisplay(that.list[i].checkRs,i);
-                        }
-                        // that.wordDisplay(that.list[0].checkRs,0);
+                        that.wordDisplay(json.Rs);
                     } else {
                         that.$message.error(json.Memo);
                     }
                 })
             },
-            wordDisplay(word,i) {
+            wordDisplay(word) {
                 let index = 0;
                 let that = this;
-                type();
-                function type() {
-                    that.list[i].checkRs = word.substring(0, index++);
-                    if (index > word.length) {
-                        return;
-                    } else {
-                        setTimeout(type, 50);
-                    }
-                }
+                    setTimeout(function () {
+                        that.list.push(word[index]);
+                        index++;
+                    }, 600);
             }
         }
     }

+ 116 - 0
src/components/runTimeRecord.vue

@@ -0,0 +1,116 @@
+<template>
+    <div class="runTimeRecord">
+        <div class="other-people">
+            <div class="image-border image-border1"></div>
+            <div class="image-border image-border2"></div>
+            <div class="image-border image-border3"></div>
+            <div class="image-border image-border4"></div>
+            <div class="other-people-title">
+                实时监测
+            </div>
+            <ul>
+                <li v-for="l in list">
+                    <span> {{l.time}}</span>
+                    <em>{{l.checkRs}}</em>
+                </li>
+            </ul>
+        </div>
+    </div>
+</template>
+
+<script>
+    import {Watching} from '../api/getApiRes.js'
+
+    let qs = require('qs');
+    export default {
+        data() {
+            return {
+                list: [],
+            }
+        },
+        mounted() {
+            this.getDate();
+            let that = this;
+            this.timer = setInterval(() => {
+                that.getDate();
+            }, 6800);
+        },
+        methods: {
+            getDate() {
+                let that = this;
+                let param = {
+                    token: localStorage.token
+                };
+                let postdata = qs.stringify(param);
+                Watching(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        this.list = json.Rs;
+                        for (var i = 0; i < this.list.length; i++) {
+                            that.wordDisplay(that.list[i].checkRs, i);
+                        }
+                        // that.wordDisplay(that.list[0].checkRs,0);
+                    } else {
+                        that.$message.error(json.Memo);
+                    }
+                })
+            },
+            wordDisplay(word, i) {
+                let index = 0;
+                let that = this;
+                type();
+
+                function type() {
+                    that.list[i].checkRs = word.substring(0, index++);
+                    if (index > word.length) {
+                        return;
+                    } else {
+                        setTimeout(type, 50);
+                    }
+                }
+            }
+        }
+    }
+</script>
+
+<style scoped>
+    .runTimeRecord {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .runTimeRecord ul {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        margin-top: 50px;
+    }
+
+    .runTimeRecord li {
+        height: 34px;
+        line-height: 34px;
+        padding-left: 20px;
+        padding-right: 10px;
+        background: rgba(0, 107, 184, 0.2);
+        font-size: 14px;
+        color: #6DC1FF;
+        text-align: left;
+        overflow: hidden;
+        margin-bottom: 5px;
+    }
+
+    .runTimeRecord li span {
+        font-family: UnidreamLED;
+        font-size: 16px;
+        margin-right: 10px;
+    }
+    .other-people {
+        width: 439px;
+        height: 480px;
+        margin-left: 0;
+    }
+
+</style>

+ 1 - 1
src/views/Login.vue

@@ -12,7 +12,7 @@
                             <el-input v-model="form.name" placeholder="用户名"></el-input>
                         </el-form-item>
                         <el-form-item label="">
-                            <el-input v-model="form.pwd" placeholder="密码"></el-input>
+                            <el-input type="password" v-model="form.pwd" placeholder="密码"></el-input>
                         </el-form-item>
                         <el-form-item label=""  v-loading="validImgState"   element-loading-text="拼命加载中"
                                       element-loading-spinner="el-icon-loading"

+ 42 - 7
src/views/Main.vue

@@ -1,11 +1,11 @@
 <template>
     <div class="mainContainer">
         <div class="lt">
-            <Console></Console>
+            <Console @refreshList="changPanel"></Console>
         </div>
         <div class="center">
             <div class="cube">
-                <Total></Total>
+                <Total :post-title="pageLevel"></Total>
             </div>
             <div class="cube">
                 <WifiSign></WifiSign>
@@ -13,10 +13,19 @@
             <Scan></Scan>
         </div>
         <div class="rt">
-            <div class="cube">
-            <HistoryRecord></HistoryRecord>
+            <div class="cube"  v-if="pageLevel == 0||pageLevel == 4">
+                <HistoryRecord></HistoryRecord>
+            </div>
+            <div class="cube" v-if="pageLevel == 1||pageLevel == 2||pageLevel == 3">
+                <runTimeRecord></runTimeRecord>
+            </div>
+            <div v-if="pageLevel != 4">
+                <EquipInfo></EquipInfo>
+            </div>
+            <!--单个设备情况-->
+            <div v-if="pageLevel == 4">
+                <SingleEquipInfo></SingleEquipInfo>
             </div>
-            <EquipInfo></EquipInfo>
         </div>
     </div>
 </template>
@@ -27,11 +36,38 @@
     import Scan from '@/components/Scan.vue'
     import HistoryRecord from '@/components/HistoryRecord.vue'
     import EquipInfo from '@/components/EquipInfo.vue'
+    import SingleEquipInfo from '@/components/SingleEquipInfo.vue'
     import Total from '@/components/Total.vue'
+    import runTimeRecord from '@/components/runTimeRecord.vue'
 
     export default {
+        data() {
+            return {
+                loadingState: false,
+                pageLevel: 0,//默认查全部
+                // pageLevel: 1,//当前为楼层
+                // pageLevel: 4,//当前为单个设备
+            }
+        },
+        mounted() {
+            this.init();
+        },
+        methods: {
+            // 初始化
+            init() {
+                this.loadingState = false;
+            },
+            changPanel(level, btn) {
+                if(btn == 0){
+                    // 首页单独处理
+                    this.pageLevel = 0
+                }else{
+                    this.pageLevel = parseInt(level);
+                }
+            },
+        },
         components: {
-            Console, WifiSign, Scan, HistoryRecord, EquipInfo, Total
+            Console, WifiSign, Scan, HistoryRecord, EquipInfo, Total,runTimeRecord,SingleEquipInfo
         }
     }
 </script>
@@ -58,7 +94,6 @@
 
     .lt {
         width: 365px;
-        /*height: 906px;*/
         float: left;
         overflow: hidden;
         margin-right: 10px;