Sfoglia il codice sorgente

精品典藏等的层级调整高于导览/一个视频或图片不显示左右按钮

shaogen1995 3 anni fa
parent
commit
eef5c52845
2 ha cambiato i file con 28 aggiunte e 21 eliminazioni
  1. 27 20
      hot/src/views/Home.vue
  2. 1 1
      web/public/static/css/main.css

+ 27 - 20
hot/src/views/Home.vue

@@ -21,7 +21,7 @@
       :style="{ height: isMobile ? '90%' : '70%' }"
     >
       <div
-        v-if="!isMobile"
+        v-if="!isMobile&&lengthShow"
         @click="slideto('slidePrev')"
         class="swiper-button-prev"
       ></div>
@@ -31,8 +31,8 @@
         <p v-html="data.content[myInd]"></p>
       </div>
       <!-- 查看图片 -->
-      <viewer class="viewerCla"  ref="viewer" :images="lookPics">
-        <img :src="lookPics[0]" alt="">
+      <viewer class="viewerCla" ref="viewer" :images="lookPics">
+        <img :src="lookPics[0]" alt="" />
       </viewer>
       <swiper
         v-show="active !== 'title'"
@@ -42,15 +42,13 @@
       >
         <swiper-slide v-for="(item, index) in data[active]" :key="index">
           <div class="slide">
-            
-              <img
-                v-if="active === 'images'"
-                style="cursor: pointer"
-                v-lazy="imgSrc(item)"
-                alt=""
-                @click="lookImg(imgSrc(item))"
-              />
-            
+            <img
+              v-if="active === 'images'"
+              style="cursor: pointer"
+              v-lazy="imgSrc(item)"
+              alt=""
+              @click="lookImg(imgSrc(item))"
+            />
 
             <video
               v-else-if="active === 'video'"
@@ -66,10 +64,10 @@
             ></iframe>
           </div>
         </swiper-slide>
-        <div class="swiper-pagination" slot="pagination"></div>
+        <div class="swiper-pagination" slot="pagination" v-if="lengthShow"></div>
       </swiper>
       <div
-        v-if="!isMobile"
+        v-if="!isMobile&&lengthShow"
         @click="slideto('slideNext')"
         class="swiper-button-next"
       ></div>
@@ -117,6 +115,8 @@ export default {
   name: "Home",
   data() {
     return {
+      lengthShow:false,
+      // 看看是不是只有一张图,一个视频或irm
       myInd: 0,
       myFlag: false,
       lookPics: [],
@@ -207,9 +207,9 @@ export default {
       dom.show();
     },
     imgSrc(val) {
-      if (typeof val === "number") return `/data/${this.m}/img/${val}${this.data.suf}`;
-      //线下调试
-      // if (typeof val === "number") return `/erhai/data/${this.m}/img/${val}${this.data.suf}`; //打包
+      if (typeof val === "number")
+        return `/data/${this.m}/img/${val}${this.data.suf}`;//线下调试
+        //  return `/erhai/data/${this.m}/img/${val}${this.data.suf}`; //打包
       else return val;
     },
     // 追加的图片地址过滤
@@ -240,7 +240,7 @@ export default {
         temp.content = [temp.content];
         temp.title = [temp.title];
       }
-      
+
       this.data = temp;
       if (!this.data) {
         return alert("热点解析错误");
@@ -257,6 +257,13 @@ export default {
           item.display = true;
         }
       });
+      // 判断是否只有一张图片或者视频,ifrm   lengthShow
+       let tempType = this.data[this.active]
+       if(typeof tempType==='number') {
+         if(tempType>1) this.lengthShow=true
+       }else{
+         if(tempType.length>1) this.lengthShow=true
+       }
     },
 
     colseParent(item) {
@@ -305,7 +312,7 @@ export default {
 </script>
 
 <style lang="less" scoped>
-.viewerCla img{
+.viewerCla img {
   display: none;
 }
 .home {
@@ -403,7 +410,7 @@ export default {
     > p {
       line-height: 1.5;
       font-size: 16px;
-      padding:0 10px 10px 0;
+      padding: 0 10px 10px 0;
     }
   }
   .ismtop {

+ 1 - 1
web/public/static/css/main.css

@@ -3348,7 +3348,7 @@ a.hasHover:hover, a:active {
     bottom: 0px;
     width: 100%;
     transition: all .5s;
-    z-index: 3;
+    z-index: 4;
     position: absolute;
 }