| | |
| | | ></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" |
| | |
| | | </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> |
| | |
| | | |
| | | }, |
| | | 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() |
| | | } |
| | |
| | | } |
| | | }, |
| | | 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++; |
| | |
| | | }, |
| | | 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; |
| | |
| | | this.loading = false; |
| | | this.Camera.cameraId = id; |
| | | await this.Camera.update(); |
| | | debugger |
| | | |
| | | } |
| | | |
| | | this.$refs.timeSlider.activeTab = this.VideoManageData.TimeRules[0].id; |
| | |
| | | message: "策略保存成功!" |
| | | }); |
| | | //刷新左侧树 |
| | | debugger |
| | | |
| | | _this.$root.$children[0].$children[0].querySearchAsync('camera') |
| | | |
| | | } |
| | |
| | | }; |
| | | </script> |
| | | <style lang="scss"> |
| | | .el-message--info .el-message__content{ |
| | | .el-message--info .el-message__content { |
| | | color: #999; |
| | | } |
| | | .swiper-container { |