zhangzengfei
2021-05-25 27e9c1b8ae1289721e2385c1ef853ce66b459af5
src/pages/panoramicView/components/History.vue
@@ -34,14 +34,30 @@
      </div>
    </div>
    <div class="videos">
      <div class="video-item" v-for="v in videoList" :key="v.name">
        <video :src="'/httpImage/' + v.videoUrl" controls="controls" width="480px" height="270px"></video>
      <div class="video-item" v-for="v in videoList" :key="v.reid">
        <video
          :src="'/traceFiles/' + v.reid + '.avi'"
          controls="controls"
          width="480px"
          height="270px"
        ></video>
        <span>{{v.date}}</span>
        <div class="image-preview">
          <el-image
            :src="'/traceFiles/' + v.reid + '.jpg'"
            :preview-src-list="['/traceFiles/' + v.reid + '.jpg']"
            height="10px"
          ></el-image>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { findTraceResult } from "@/api/panorama"
export default {
  name: "histroy",
  data() {
@@ -142,19 +158,19 @@
        });
        return;
      }
      clearInterval(this.timer);
      //判断是否是查历史数据
      if (Date.parse(this.searchTime[1]) < Date.now()) {
        this.filterData()
      } else {
        this.activeObjHashMap = {};
        //实时查
        this.searchData();
      }
      this.searchData();
    },
    checkTarget(item) {
      this.selectedID = item.id;
    },
    searchData() {
      findTraceResult({ searchTime: this.searchTime }).then(rsp => {
        if (rsp && rsp.success && rsp.data) {
          this.videoList = rsp.data;
        }
      })
    }
  }
}
@@ -226,15 +242,24 @@
    height: 88%;
    display: flex;
    flex-wrap: wrap;
    overflow: auto;
    .video-item {
      width: 500px;
      height: 320px;
      margin-left: 10px;
      margin-top: 10px;
      background-color: #fff;
      video {
        margin: 10px;
      }
      .image-preview {
        width: 25px;
        float: right;
        margin: 0px 10px;
        cursor: pointer;
      }
    }
  }
}