hanbaoshan
2020-10-13 1fbade862552c9387809f7e50dd75d6b019086f1
src/pages/cameraAccess/components/SeparateRules.vue
@@ -144,7 +144,7 @@
                ></polygon-canvas>
              </template>
              <template v-else>
                <div style="width:100%" v-loading='getStackFileLoading'>
                <div style="width:100%" v-loading="getStackFileLoading">
                  <swiper
                    ref="swiper"
                    :auto-update="true"
@@ -182,12 +182,20 @@
                      </div>
                    </swiper-slide>
                  </swiper>
                  <div class="swiper-local-prev" v-show="swipercanvasData.length>1" @click="prevClick">
                  <div
                    class="swiper-local-prev"
                    v-show="swipercanvasData.length>1"
                    @click="prevClick"
                  >
                    <div class="icon-btn" slot="button-prev">
                      <i class="iconfont iconzuo"></i>
                    </div>
                  </div>
                  <div class="swiper-local-next" v-show="swipercanvasData.length>1" @click="nextClick">
                  <div
                    class="swiper-local-next"
                    v-show="swipercanvasData.length>1"
                    @click="nextClick"
                  >
                    <div class="icon-btn" slot="button-next">
                      <i class="iconfont iconyou1"></i>
                    </div>
@@ -319,14 +327,15 @@
  },
  watch: {
    'Camera.cameraId':{
      handler(n,o){
    'Camera.cameraId': {
      handler (n, o) {
        if (n) {
          if (this.TreeDataPool.treeActiveName == "dataStack") {
            this.stackFilesPage = 1;
            this.stackFilesSize = 5;
            this.stackId = n;
            if(this.stackId){
            if (this.stackId) {
              console.log('getStackFiles')
              this.swipercanvasData = [];
              this.getStackFiles()
            }
@@ -336,28 +345,28 @@
    }
  },
  methods: {
    prevClick(){
    prevClick () {
      console.log(this.swiperIndex)
      console.log(this.$refs.swiper.swiper.activeIndex)
      if(this.swiperIndex == 0){
      if (this.swiperIndex == 0) {
        console.log('本次分页的第一条')
        //请求上一页
        if(this.stackFilesPage > 1){
        if (this.stackFilesPage > 1) {
          this.stackFilesPage--;
          this.getStackFiles();
        }else{
        } else {
          this.$message({
            type:'info',
            message:'当前已是第一页'
            type: 'info',
            message: '当前已是第一页'
          });
        }
      }
    },
    nextClick(){
    nextClick () {
      console.log(this.swiperIndex)
      console.log(this.$refs.swiper.swiper.activeIndex)
      if(this.swiperIndex == this.swipercanvasData.length-1){
      if (this.swiperIndex == this.swipercanvasData.length - 1) {
        console.log('最后一张,加载更多')
        //请求下一页
        this.stackFilesPage++;
@@ -366,38 +375,41 @@
    },
    getStackFiles () {
      this.getStackFileLoading = true;
      let _this = this;
      findAllFileByStackId({ name: '', stackId: this.stackId, page: this.stackFilesPage, size: this.stackFilesSize, type: 0 }).then(res => {
        if (res && res.success ) {
          if(res.data.dataList.length > 0){
        if (res && res.success) {
          if (res.data.dataList.length > 0) {
            this.swipercanvasData = [];
            this.swipercanvasData = res.data.dataList.map(item => {
              return {
                name: item.name,
                stackId: item.stack_id,
                baseImg: item.type == 2 ? `/files/${item.identifier}.jpg` : item.snapshot_url,
                baseImg: item.type == 2 ? `/files/${item.path.substr(item.path.lastIndexOf('/') + 1)}` : item.snapshot_url,
                type: item.type,
                id: item.id,
                loading: false
              }
            });
            console.log(_this.swipercanvasData)
            console.log(this.swipercanvasData)
            this.swiperIndex = 0;
            this.$refs.swiper.swiper.activeIndex = 0;
          }else{
          } else {
            console.log(this.swipercanvasData)
            this.$message({
              type:'info',
              message:'已无更多数据!'
              type: 'info',
              message: '已无更多数据!'
            });
          }
        }else{
        } else {
          console.log(this.swipercanvasData)
          this.$message({
            type:'error',
            message:'数据请求失败,请稍后重试!'
            type: 'error',
            message: '数据请求失败,请稍后重试!'
          });
        }
        this.getStackFileLoading = false;
        this.getStackFileLoading = false;
      }).catch(e => {
        console.log(e);
        this.getStackFileLoading = false;
@@ -454,7 +466,7 @@
        this.loading = false;
        this.Camera.cameraId = id;
        await this.Camera.update();
        debugger
      }
      this.$refs.timeSlider.activeTab = this.VideoManageData.TimeRules[0].id;
@@ -480,7 +492,7 @@
            message: "策略保存成功!"
          });
          //刷新左侧树
          debugger
          _this.$root.$children[0].$children[0].querySearchAsync('camera')
        }
@@ -624,7 +636,7 @@
};
</script>
<style lang="scss">
.el-message--info .el-message__content{
.el-message--info .el-message__content {
  color: #999;
}
.swiper-container {