ZZJ
2022-07-15 a3f357e8a60443b74b64c7479113c68eb35ce1f5
src/pages/search/index/Searching.vue
@@ -37,17 +37,17 @@
              "
            ></el-button>
          </el-tooltip>
          <p class="p-label" style="width: 16%">
            <b>标签:</b>
          <p class="p-label" style="width: 13%">
            <b>底库:</b>
            <el-select
              v-model="tagValues"
              multiple
              :disabled="isDisabled"
              collapse-tags
              size="mini"
              style="width: calc(100% - 40px); min-width: 120px"
              placeholder="请选择"
              style="width: calc(100% - 40px); min-width: 70px"
              @change="tagChange"
              placeholder="选择"
            >
              <el-option
                v-for="item in VideoPhotoData.tabs"
@@ -59,7 +59,7 @@
              ></el-option>
            </el-select>
          </p>
          <p class="p-task" style="width: 16%">
          <p class="p-task" style="width: 13%">
            <b>场景:</b>
            <el-select
              v-model="taskValues"
@@ -68,8 +68,8 @@
              :disabled="typeDisable"
              collapse-tags
              size="mini"
              style="width: calc(100% - 40px); min-width: 120px"
              placeholder="请选择"
              style="width: calc(100% - 40px); min-width: 70px"
              placeholder="选择"
            >
              <!-- <el-option
                v-for="item in VideoPhotoData.tasks"
@@ -89,7 +89,23 @@
              ></el-option>
            </el-select>
          </p>
          <p class="p-level" style="width: 18%">
          <p class="p-task" style="width: 12%">
            <b>关注:</b>
            <el-select
              v-model="collection"
              @change="searchingBtn"
              size="mini"
              style="width: calc(100% - 40px); min-width: 70px"
              placeholder="选择"
            >
              <el-option value="" label="全部"></el-option>
              <el-option value="1" label="已关注"></el-option>
              <el-option value="0" label="未关注"></el-option>
            </el-select>
          </p>
          <p class="p-level" style="width: 15%">
            <b>事件等级:</b>
            <el-select
              v-model="alarmValues"
@@ -99,7 +115,7 @@
              collapse-tags
              size="mini"
              style="width: calc(100% - 64px); min-width: 120px"
              placeholder="请选择"
              placeholder="选择"
            >
              <el-option
                v-for="item in VideoPhotoData.dictionary.ALARMLEVEL"
@@ -113,7 +129,7 @@
            <el-date-picker
              size="mini"
              v-model="searchTime"
              @change="searchingBtn"
              @change="changeTime"
              type="datetimerange"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
@@ -121,13 +137,13 @@
              style="width: 99%; min-width: 200px"
            ></el-date-picker>
          </p>
          <p class="p-input" style="width: 19%">
          <p class="p-input" style="width: 16%">
            <el-input
              placeholder="请输入内容"
              placeholder="请输入"
              prefix-icon="el-icon-search"
              style="
                width: calc(100% - 75px);
                min-width: 100px;
                min-width: 85px;
                margin-left: 10px;
                margin-right: 10px;
              "
@@ -298,6 +314,7 @@
      tagValues: [],
      alarmValues: [],
      taskValues: [],
      collection: "",
      searchTime: [
        this.$moment().format("YYYY-MM-DD 00:00:00"),
        this.$moment().format("YYYY-MM-DD HH:mm:ss"),
@@ -322,10 +339,10 @@
    this.$nextTick(() => {
      let scrollContain = this.$refs.scrollContain;
      this.VideoPhotoData.scrollContainDom = scrollContain;
      let list = this.TreeDataPool.localVedioList.filter((i) => {
        return i.progress == 100;
      });
      this.TreeDataPool.localVedioList = list;
      // let list = this.TreeDataPool.localVedioList.filter((i) => {
      //   return i.progress == 100
      // })
      // this.TreeDataPool.localVedioList = list
    });
    window.addEventListener("resize", this.getHeight);
    this.getCenter();
@@ -393,8 +410,11 @@
  watch: {
    "TreeDataPool.treeActiveName"(n, o) {
      if (n && n == "camera") {
        this.VideoPhotoData.dataSource = "camera";
        this.VideoPhotoData.treeNodes = [];
        this.setLoadSearch(this.VideoPhotoData.querySearchList());
      } else {
        this.VideoPhotoData.dataSource = "stack";
      }
    },
    "TreeDataPool.showTreeBox"(value) {
@@ -443,19 +463,12 @@
    "VideoPhotoData.activeCard": function (value) {
      let card =
        this.$refs.scrollContain.getElementsByClassName("my-active-card");
      console.log(1);
      console.log(card);
      if (card.length > 0) {
        let cardHeight = card[0].clientHeight;
        let cardTop = card[0].offsetTop;
        let scrollTop = this.$refs.scrollContain.scrollTop;
        let divHeight = this.$refs.scrollContain.clientHeight;
        console.log(2);
        console.log(cardHeight);
        console.log(cardTop);
        console.log(scrollTop);
        console.log(divHeight);
        if (
          cardTop - cardHeight - scrollTop > divHeight ||
          cardTop - cardHeight - scrollTop < 0
@@ -604,7 +617,6 @@
      this.CardList.details = Array.from(
        new Set([...this.CardList.details, ...[obj]])
      );
      console.log(this.CardList.details);
      // this.CardList.details.push(obj);
      this.VideoPhotoData.activeCard = obj.activeObject.id;
    },
@@ -645,18 +657,15 @@
      ];
    },
    format(array) {
      if (array.length === 0) {
        return [];
      }
      return [
        this.$moment(array[0]).format("YYYY-MM-DD HH:mm:ss"),
        this.$moment(array[1]).format("YYYY-MM-DD HH:mm:ss"),
      ];
    },
    searchingBtn() {
      // let obj = document.getElementById('searchMid');
      // let load = this.$loading({
      //   target:obj,
      // })
      // load.close();
      // this.AuthData.loading = true
      this.VideoPhotoData.page = 1;
      this.VideoPhotoData.queryTabs = this.tagValues;
      //处理搜索类型
@@ -671,6 +680,7 @@
      this.VideoPhotoData.searchTime = this.format(this.searchTime);
      //this.VideoPhotoData.inputValue = this.searchText;
      this.VideoPhotoData.showType = this.showType;
      this.VideoPhotoData.collection = this.collection;
      if (!this.VideoPhotoData.uploadType) {
        this.VideoPhotoData.uploadDiaplay = false;
        //this.VideoPhotoData.page = this.currentPage;
@@ -743,12 +753,14 @@
    clearSearch() {
      this.tagValues = [];
      this.taskValues = [];
      this.collection = "";
      this.alarmValues = [];
      this.VideoPhotoData.queryTabs = [];
      this.VideoPhotoData.queryTasks = [];
      this.VideoPhotoData.queryAlarmlevel = [];
      this.VideoPhotoData.searchTime = this.getDateInit();
      this.VideoPhotoData.inputValue = "";
      this.VideoPhotoData.collection = "";
      this.searchTime = this.getDateInit();
      if (!this.VideoPhotoData.uploadType) {
        // this.VideoPhotoData.querySearchList();
@@ -784,6 +796,13 @@
      this.setLoadSearch(this.VideoPhotoData.querySearchList());
    },
    changeTime(val) {
      if (!val) {
        this.searchTime = [];
      }
      this.searchingBtn();
    },
  },
};
</script>