标注静态交互

hanbaoshan

2020-10-23 d8fcf4c20cd4638a3def6227a71ea2c81fbc0885

 src/components/LeftNav.vue

@@ -118,7 +118,7 @@
            </el-submenu>
            <el-submenu index="1">
              <template slot="title">
                <i class="iconfont iconGBx"></i>
                <i class="iconfont iconGBx" style="margin-left:-4px;"></i>
                <b class="tree-font">GB28181</b>
              </template>

@@ -126,7 +126,8 @@
              <div class="tree-edit gb-refresh" v-show="!TreeDataPool.gbReadonly">
                <el-tooltip content="刷新" placement="top" popper-class="atooltip">
                  <button @click="refreshGB">
                    <i class="el-icon-refresh" style="font-size:16px"></i>
                    <i v-if="loadingGBTree" class="el-icon-loading" style="font-size:16px"></i>
                    <i v-else class="el-icon-refresh" style="font-size:16px"></i>
                  </button>
                </el-tooltip>
              </div>
@@ -150,6 +151,61 @@
              </el-menu-item-group>
            </el-submenu>
          </el-menu>
        </el-tab-pane>
        <el-tab-pane
          label="集群"
          name="cluster"
          :style="`height:${height - 56}px;`"
          v-if="showCluster"
        >
          <div class="local-vedio-area">
            <!-- 搜索 -->
            <div class="navTopSelect">
              <div class="search-input flex-box">
                <el-select
                  v-model="TreeDataPool.searchCamType"
                  placeholder="请选择"
                  @change="searchClusterData"
                >
                  <el-option
                    v-for="item in searchTypeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
                <span style="display: inline-block;padding: 0px 3px;"></span>
                <el-input
                  v-model="TreeDataPool.searchInput"
                  placeholder="搜索"
                  clearable
                  @input="querySearchAsync('cluster')"
                >
                  <i
                    class="el-icon-search el-input__icon"
                    style="color:#DCDFE6"
                    slot="prefix"
                    @click="searchClusterData"
                  ></i>
                </el-input>
              </div>
            </div>
            <div class="top-menu" style="margin:0 0 10px;text-align:left;">
              <span class="iconfont iconjiqun" style="font-size:20px;"></span>
              <span style="font-size:14px; margin-left: 5px;font-weight: 600;">{{clusterName}}</span>
            </div>
            <div class="cluster-list">
              <tree-menu
                ref="tree"
                :app="appName"
                :treeName="'localTree'"
                :node="TreeDataPool.clusterData"
                :height="height"
                @addDevice="addCamera"
                @import="importCameras"
              />
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane
          label="数据栈"
@@ -260,6 +316,7 @@
import LocalVedioList from '@/components/subComponents/LocalVedioList';
import FileUpload from '@/components/subComponents/FileUpload/index';
import XLSX from 'xlsx'
import { findCluster } from "@/api/clusterManage";

export default {
  components: {
@@ -287,10 +344,31 @@
      return true;
    },
    showCam() {
      return this.appName === "Camera" || this.appName === "Search";
      return this.appName === "Camera" || this.appName === 'Cluster' || (this.appName === "Search" && (this.buttonAuthority.indexOf("search:camera") >= 0 || this.isAdmin));
    },
    showCluster() {
      return this.appName === "Cluster";
    },
    // 数据栈配置必须显示。 检索通过权限控制显示, 未安装数据栈也不显示
    showDataStack() {
      return this.appName === "DataStack" || this.appName === "Search";
      if (this.appName === "DataStack") {
        return true;
      }

      if (this.appName === "Search") {
        // 未安装数据栈配置
        if (this.installedApps.indexOf("dataStack") >= 0) {
          if (this.isAdmin) {
            return true;
          }

          if (this.buttonAuthority.indexOf("search:stack") >= 0) {
            return true;
          }
        }
      }

      return false;
    },
    showLock() {
      return this.edit;
@@ -323,6 +401,7 @@
      dataStack: "videoMonitor:dataStack",
      activeIndexVideo: "",
      buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
      installedApps: sessionStorage.getItem("apps") || [],
      loginName: JSON.parse(sessionStorage.getItem("userInfo")).username || "用户名",
      searchTypeOptions: [
        {
@@ -368,10 +447,13 @@
      fileUploadBox: false,
      loadingGBTree: false,
      importAreaId: "",
      menuLoading: false
      menuLoading: false,
      clusterName: ''
    };
  },
  created() {
    console.log(this.appName)
    console.log(this.showCam)
    if (this.showCam) {
      this.TreeDataPool.treeActiveName = "camera"
      this.TreeDataPool.fetchTreeData();
@@ -381,6 +463,17 @@
      this.DataStackPool.fetchFiles();

    }
    if (this.showCluster) {
      this.TreeDataPool.treeActiveName = "cluster"
      this.TreeDataPool.fetchClusterTree();
      findCluster().then(res => {
        if (res.success) {
          debugger
          this.clusterName = res.data.clusterName;
        }

      })
    }
  },
  methods: {
    searchAreaData() {
@@ -388,6 +481,9 @@
    },
    searchDataStack() {
      this.DataStackPool.fetchFiles();
    },
    searchClusterData() {
      this.TreeDataPool.fetchClusterTree();
    },
    lockSwitch() {
      this.TreeDataPool.readonly = !this.TreeDataPool.readonly;
@@ -559,11 +655,11 @@
              promiseArr.push(createCamera(camera));
            }
            let _this = this;
            Promise.allSettled(promiseArr).then(res=>{
              res.forEach(item=>{
                if(item.status === 'fulfilled'){
            Promise.allSettled(promiseArr).then(res => {
              res.forEach(item => {
                if (item.status === 'fulfilled') {
                  succeed++;
                }else{
                } else {
                  failed++;
                }
              });
@@ -573,10 +669,10 @@
                message: "操作完成, 导入成功:" + succeed + "个 失败:" + failed + "个"
              })
              _this.TreeDataPool.fetchTreeData();
            }).catch(e=>{
            }).catch(e => {
              console.log(e)
            });
            

          }
        } catch (e) {
          this.menuLoading = false
@@ -623,8 +719,9 @@
    border: none;
    box-shadow: none;
    .el-tabs__header {
      display: none;
      border-bottom: none;
      margin: 0 0 15px;
      //margin: 0 0 15px;
    }
    .el-tabs__content {
      padding: 0;
@@ -751,6 +848,7 @@
    .search-input {
      padding-top: 8px;
      padding-bottom: 12px;
      text-align: left;
      .dev-tree-close {
        width: 10%;
        margin-left: 10px;
@@ -866,4 +964,7 @@
    color: #606266;
  }
}
.flex-box {
  display: flex;
}
</style>