heyujie
2021-11-03 57094ef66e4afb413c39ecd181e65938315c195c
src/pages/shuohuangMonitorAnalyze/index/App.vue
@@ -3,40 +3,55 @@
    <div class="view-left">
      <left-nav :isCollapse="isCollapse" @menuChange="menuChange"></left-nav>
    </div>
    <div class="right">
    <div class="view-right">
      <div class="top">
        <div class="collapse-trigger" @click="toggleCollapse">
          <i :class="isCollapse?'el-icon-s-unfold':'el-icon-s-fold'"></i>
          <i :class="isCollapse ? 'el-icon-s-unfold' : 'el-icon-s-fold'"></i>
        </div>
        <top-nav></top-nav>
      </div>
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item>{{ breadcrumb }}</el-breadcrumb-item>
        <el-breadcrumb-item v-if="breadcrumb2">{{
          breadcrumb2
        }}</el-breadcrumb-item>
      </el-breadcrumb>
      <div class="container">
        <!-- 首页 -->
        <GuideIndex ref="GuideIndex" v-show="actPage=='guideIndex'"></GuideIndex>
        <searchForVideoAnalyze v-if="actPage=='searchForVideoAnalyze'"></searchForVideoAnalyze>
        <memberManage v-if="actPage=='memberManage'"></memberManage>
        <taskManage v-if="actPage=='taskManage'"></taskManage>
        <transferMemo v-if="actPage=='transferMemo'"></transferMemo>
        <transferDeviceManage v-if="actPage=='transferDeviceManage'"></transferDeviceManage>
        <configManage v-if="actPage=='configManage'"></configManage>
        <lkg v-if="actPage=='lkgManage'"></lkg>
        <GuideIndex
          @breadcrumb2Update="breadcrumb2Update"
          ref="GuideIndex"
          v-if="actPage == 'guideIndex'"
        ></GuideIndex>
        <searchForVideoAnalyze
          v-if="actPage == 'searchForVideoAnalyze'"
        ></searchForVideoAnalyze>
        <memberManage v-if="actPage == 'memberManage'"></memberManage>
        <taskManage v-if="actPage == 'taskManage'"></taskManage>
        <transferMemo v-if="actPage == 'transferMemo'"></transferMemo>
        <transferDeviceManage
          v-if="actPage == 'transferDeviceManage'"
        ></transferDeviceManage>
        <configManage v-if="actPage == 'configManage'"></configManage>
        <lkg v-if="actPage == 'lkgManage'"></lkg>
      </div>
    </div>
  </div>
</template>
<script>
import Lkg from '../components/lkgManage'
import TopNav from '../components/topNav';
import LeftNav from '../components/leftNav';
import GuideIndex from '../components/guideIndex';
import TaskManage from '../components/taskManage';
import TransferMemo from '../components/transferMemo';
import ConfigManage from '../components/configManage';
import MemberManage from '../components/memberManage';
import TransferDeviceManage from '../components/transferDeviceManage';
import SearchForVideoAnalyze from '../components/searchForVideoAnalyze';
import Lkg from "../components/lkgManage";
import TopNav from "../components/topNav";
import LeftNav from "../components/leftNav";
import GuideIndex from "../components/guideIndex";
import TaskManage from "../components/taskManage";
import TransferMemo from "../components/transferMemo";
import ConfigManage from "../components/configManage";
import MemberManage from "../components/memberManage";
import TransferDeviceManage from "../components/transferDeviceManage";
import SearchForVideoAnalyze from "../components/searchForVideoAnalyze";
export default {
  components: {
@@ -49,20 +64,22 @@
    TransferMemo,
    TransferDeviceManage,
    ConfigManage,
    GuideIndex
    GuideIndex,
  },
  data() {
    return {
      isCollapse: false,
      actPage: 'guideIndex',
    }
      actPage: "guideIndex",
      breadcrumb: "首页",
      breadcrumb2: "数据统计分析",
    };
  },
  mounted() {
    // this.actPage = 'guideIndex';
  },
  methods: {
    markNav() {
      sessionStorage.setItem('actPage', this.actPage);
      sessionStorage.setItem("actPage", this.actPage);
      this.menuChange(this.actPage);
    },
    toggleCollapse() {
@@ -70,20 +87,73 @@
      //通知当前活动页table(如果有) doLayout
    },
    menuChange(path) {
      if (path=='guideIndex') {
        this.$refs.GuideIndex.refreshShoubiNum()
      console.log(path);
      switch (path) {
        case "guideIndex":
          this.breadcrumb = "首页";
          this.breadcrumb2 = "数据统计分析";
          break;
        case "searchForVideoAnalyze":
          this.breadcrumb = "视频分析检索";
          this.breadcrumb2 = "";
          break;
        case "memberManage":
          this.breadcrumb = "人员管理";
          this.breadcrumb2 = "";
          break;
        case "taskManage":
          this.breadcrumb = "任务管理";
          this.breadcrumb2 = "";
          break;
        case "configManage":
          this.breadcrumb = "配置管理";
          this.breadcrumb2 = "";
          break;
        case "transferMemo":
          this.breadcrumb = "转储管理";
          this.breadcrumb2 = "视频转储记录";
          break;
        case "transferDeviceManage":
          this.breadcrumb = "转储管理";
          this.breadcrumb2 = "转储设备管理";
          break;
        case "lkgManage":
          this.breadcrumb = "转储管理";
          this.breadcrumb2 = "lkg数据管理";
          break;
        case "taskscreen":
          this.breadcrumb = "可视化大屏";
          this.breadcrumb2 = "任务大屏";
          break;
        case "hiddendangerscreen":
          this.breadcrumb = "可视化大屏";
          this.breadcrumb2 = "隐患大屏";
          break;
      }
      if (path == 'taskscreen') {
      if (path == "guideIndex") {
        // this.$refs.GuideIndex.refreshShoubiNum()
      }
      if (path == "taskscreen") {
        //window.location.href = window.location.href+'taskscreen/index.html'
        window.open(window.location.href + 'taskscreen/index.html', '_blank')
      } else if (path == 'hiddendangerscreen') {
        window.open(window.location.href + "taskscreen/index.html", "_blank");
      } else if (path == "hiddendangerscreen") {
        //window.location.href = window.location.href+'hiddendangerscreen/index.html'
        window.open(window.location.href + 'hiddendangerscreen/index.html', '_blank')
        window.open(
          window.location.href + "hiddendangerscreen/index.html",
          "_blank"
        );
      }
      this.actPage = path;
    }
  }
}
    },
    breadcrumbUpdate(val) {
      this.breadcrumb = val;
    },
    breadcrumb2Update(val) {
      this.breadcrumb2 = val;
    },
  },
};
</script>
<style lang="scss">
@@ -146,16 +216,16 @@
  }
}
.main-view {
  height: 100%;
  display: flex;
  background: #f0f2f5;
  .view-left {
    z-index: 2;
    box-shadow: 4px 0px 8px 0px rgba(0, 0, 0, 0.1);
  }
  .right {
    // flex: 1;
        width: 100%;
  .view-right {
    flex: 1;
    overflow: hidden;
    .top {
      position: relative;
      .collapse-trigger {
@@ -166,12 +236,22 @@
        cursor: pointer;
      }
    }
    .el-breadcrumb {
      margin: 25px 0 25px 30px;
    }
    .container {
      background: #F4F6F9;
      margin: 0px 0 0 30px;
      padding-right: 40px;
      box-sizing: border-box;
      height: calc(100vh - 84px);
      overflow-y: auto;
    }
  }
}
</style>
<style>
* {
  box-sizing: border-box;
}
</style>