页面导航和点位管理

mg

2022-11-03 cc68c8e5f5b6dc17ce03b74ffb8933efe632c54d

 src/views/layout/components/Main/index.vue

@@ -1,16 +1,61 @@
<template>
  <el-main>
    <NavBar/>
    <router-view></router-view>
    <!-- <NavBar /> -->
    <div class="content">
      <!-- 页面导航区域 -->
      <div class="page-nav" v-if="navFlag">
        <div>
           <h1>系统设置</h1>
             <div>
               <span >基本设置</span>
               <span >门户设置</span>
             </div>
             <div>
               <span >设备管理</span>
               <span>接入管理</span>
             </div>


        </div>
        <div>运营管理</div>
        <div>视频巡查</div>
        <div>智能巡查</div>
      </div>
      <router-view v-else></router-view>
      <!-- 底部区域 -->
      <!-- <MyFooter/> -->
    </div>
  </el-main>
</template>

<script>
// import MyFooter from "../Footer"
import NavBar from "../NavBar"
export default {
  name: "Main",
  components:{
  components: {
    // MyFooter,
    NavBar
  },
  data() {
    return {
      navFlag:true
    }
  },
  watch:{
    '$route.path'(newPath,oldPath){
      newPath === '/home' ? this.navFlag = true : this.navFlag = false
    }
  }
};
</script>
</script>
<style lang="scss">
.el-main {
  min-width: 1024px;
  padding: 0;
  .content {
    padding: 11px;
    height: 100%;
  }
}
</style>