问题修复

ZZJ

2021-11-09 ccee429d379e0108b7445f72ade8d97c110a6fb3

 src/pages/shuohuangMonitorAnalyze/index/App.vue

@@ -3,68 +3,169 @@
    <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-fold':'el-icon-s-unfold'"></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">
        <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>
        <!-- 首页 -->
        <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 LeftNav from '../components/leftNav';
import TopNav from '../components/topNav';
import SearchForVideoAnalyze from '../components/searchForVideoAnalyze';
import MemberManage from '../components/memberManage';
import TaskManage from '../components/taskManage';
import TransferMemo from '../components/transferMemo';
import TransferDeviceManage from '../components/transferDeviceManage';
import ConfigManage from '../components/configManage';
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: { LeftNav, TopNav, SearchForVideoAnalyze, MemberManage, TaskManage, TransferMemo, TransferDeviceManage, ConfigManage },
  data () {
  components: {
    Lkg,
    LeftNav,
    TopNav,
    SearchForVideoAnalyze,
    MemberManage,
    TaskManage,
    TransferMemo,
    TransferDeviceManage,
    ConfigManage,
    GuideIndex,
  },
  data() {
    return {
      isCollapse: false,
      actPage: 'searchForVideoAnalyze',
    }
      actPage: "guideIndex",
      breadcrumb: "首页",
      breadcrumb2: "数据统计分析",
    };
  },
  mounted () {

  mounted() {
    // this.actPage = 'guideIndex';
  },
  methods: {
    markNav () {
      debugger
      sessionStorage.setItem('actPage', this.actPage);
    markNav() {
      sessionStorage.setItem("actPage", this.actPage);
      this.menuChange(this.actPage);
    },
    toggleCollapse () {
    toggleCollapse() {
      this.isCollapse = !this.isCollapse;
      //通知当前活动页table(如果有) doLayout
    },
    menuChange (path) {
    menuChange(path) {
      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 == "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.location.href = window.location.href+'hiddendangerscreen/index.html'
        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">
.flex-box {
  display: flex;
  >label {
  > label {
    padding-right: 10px;
  }
}
.flex-end {
  display: flex;
  justify-content: flex-end;
}
.el-button--primary.is-disabled,
.el-button--primary.is-disabled:hover,
@@ -74,9 +175,28 @@
  background-color: #9eb4f0 !important;
  border-color: #9eb4f0 !important;
}
.table-area {
  margin-bottom: 20px;
  .el-table {
    border: 1px solid #ddd;
    thead {
      color: #111 !important;
      th {
        background: #f4f4f4;
      }
    }
    .operation {
      span {
        font-size: 14px;
        color: #1a99ff;
        padding-right: 10px;
      }
    }
  }
}
.el-table.thbg {
  border: 1px solid #dedede;
  margin-top: 10px;
  margin: 10px 0;
  th {
    background: #f5f5f5;
    color: #333;
@@ -88,7 +208,7 @@
      padding: 0 3px;
      color: #0096fa;
    }
    i[class^='el-icon'] {
    i[class^="el-icon"] {
      padding: 3px;
      font-size: 16px;
      color: #0096fa;
@@ -96,16 +216,17 @@
  }
}
.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 {
  .view-right {
    flex: 1;
    overflow: hidden;
    .top {
      background: #fff;
      position: relative;
      .collapse-trigger {
        position: absolute;
@@ -115,13 +236,24 @@
        cursor: pointer;
      }
    }
    .el-breadcrumb {
      margin: 25px 0 25px 30px;
    }
    .container {
      background: #fff;
      margin: 10px;
      margin: 0 0 0 30px;
      padding: 30px 0;

      padding-right: 30px;
      box-sizing: border-box;
      height: calc(100vh - 84px);
      height: calc(100vh - 58px);
      overflow-y: auto;
    }
  }
}
</style>

<style>
* {
  box-sizing: border-box;
}
</style>