1.选择一页显示两个图片时，车身颜色筛选“黄色”时，下方的图片第一张与第二张中间间隔太大

src/views/picturePlayback/index.vue

@@ -158,8 +158,8 @@
 <!--          </el-select>-->
 <!--        </el-form-item>-->
       </el-form>
-      <div v-show="picList.length !== 0" class="swiper-area">
-        <div class="swiper soop">
+      <div class="swiper-area">
+        <div v-if="picList.length !== 0 && showSwiper" class="swiper soop">
           <div class="swiper-wrapper">
             <div class="swiper-slide" :style="swiperHeight" v-for="(item,index) in picList">
               <div class="side-title">
@@ -219,6 +219,7 @@ export default {
   dicts: ['bhsp_area', 'bhsp_road', 'bhsp_colour', 'bhsp_vtype'],
   data() {
     return {
+      showSwiper: false,
       swiperInter: null, // 循环点击标志位
       baseUrl: process.env.VUE_APP_IMG_API,
       swiper: null,
@@ -368,27 +369,7 @@ export default {
   },
   watch:{
     selectedWindow(value) {
-      this.$nextTick(()=>{
-        console.log(value,this.layoutMap,this.layoutMap[value])
-        this.swiper = new Swiper('.soop', {
-          allowTouchMove: false,
-          navigation: {
-            prevEl: '.swiper-button-prev',
-            nextEl: '.swiper-button-next',
-          },
-          slidesPerView: this.layoutMap[value].col,
-          grid: {
-            rows: this.layoutMap[value].row
-          },
-          spaceBetween: 0,
-          pagination: {
-            el: '.swiper-pagination',
-            clickable: true
-          }
-        })
-        this.stopSwiper()
-        this.swiper.update()
-      })
+      this.getPicList()
     }
   },
   methods: {
@@ -436,9 +417,11 @@ export default {
         pageNum: 1,
         pageSize: 999
       }
+      this.showSwiper = false
       queryPassPicture(temp).then(res => {
         console.log('queryPassPicture', res.rows)
         this.picList = res.rows
+        this.showSwiper = true
         this.$nextTick(()=>{
           this.swiper = new Swiper('.soop', {
             allowTouchMove: false,
@@ -463,6 +446,9 @@ export default {
     },
     /** 关闭图像回放回调*/
     closeDialog() {
+      if(this.swiper !== null) {
+        this.swiper.destroy(true, true)
+      }
       this.picForm ={}
       this.selectedWindow = 'four'
       this.stopBtn.active = false
@@ -550,7 +536,9 @@ export default {
   }
 
 }
-
+.swiper-wrapper{
+  max-width: 1000px;
+}
 .swiper {
   width: 100%;
   height: 100%;