优化行程路线 天数 导航

src/pages/About.vue

@@ -440,11 +440,11 @@
     <img v-if="$q.platform.is.desktop"
       class="full-width"
       style="margin-top: -10%"
-      src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/partners.png"
+      src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/partners.png?t=123456"
     />
     <img v-else
       class="full-width q-mt-md"
-      src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/partners-m.png"
+      src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/partners-m.png?t=123456"
     />
     <div :class="$q.platform.is.desktop ? 'wrapper mt-150' : 'q-pa-md'">
       <div  class="text-center  bold" :class="$q.platform.is.desktop ? 'f40' : 'f25'">歷年榮譽</div>

src/pages/detailsNew.vue

@@ -425,19 +425,41 @@
           "
         >
         <!--  style="position: sticky; top: 100px" -->
-          <div>
-            <div
-              class="trip-module text-subtitle2 cursor-pointer q-mb-lg"
-              v-for="(x, i) in days"
-              :key="i"
-              @click="goScrollHandler(x.top + 50)"
-              :class="{
-                'active-trip-moduleDay text-red active':
-                  currentHeight >= x.top &&
-                  (i == days.length - 1 || currentHeight < days[i + 1].top),
-              }"
-            >
-              {{ x.display }}
+          <div v-if="true">
+            <div v-for="(x, i) in days" :key="i">
+              <div v-if="moreDays==2&&i==7" style="text-align: center;margin-bottom: 21px;cursor: pointer;"
+              @click="goScrollHandler(x.top + 50),moreDays=1">
+                ...
+              </div>
+              <div
+                v-if="(moreDays&&moreDays==1||!moreDays)&&i<8"
+                class="trip-module text-subtitle2 cursor-pointer q-mb-lg"
+                @click="goScrollHandler(x.top + 50)"
+                :class="{
+                  'active-trip-moduleDay text-red active':
+                    currentHeight >= x.top &&
+                    (i == days.length - 1 || currentHeight < days[i + 1].top),
+                }"
+              >
+                {{ x.display }}
+              </div>
+
+              <div
+                v-if="moreDays&&moreDays==2&&i>=8"
+                class="trip-module text-subtitle2 cursor-pointer q-mb-lg"
+                @click="goScrollHandler(x.top + 50)"
+                :class="{
+                  'active-trip-moduleDay text-red active':
+                    currentHeight >= x.top &&
+                    (i == days.length - 1 || currentHeight < days[i + 1].top),
+                }"
+              >
+                {{ x.display }}
+              </div>
+              <div v-if="(!moreDays||moreDays==1)&&days.length>8&&i==8" style="text-align: center;cursor: pointer;"
+                @click="goScrollHandler(x.top + 50),moreDays=2">
+                  ...
+                </div>
             </div>
           </div>
         </div>
@@ -519,7 +541,7 @@
                 <trip :trip="dataList" @change="changeTripShowHandler"></trip>
               </template>
               <template v-if="dataList.dayList.length>3">
-                <block :currentHeightDay="currentHeight" :days="days" :tripList="dayList" :isDirect="isDirect" :clickDate="clickDate"></block>
+                <block v-if="false" :currentHeightDay="currentHeight" :days="days" :tripList="dayList" :isDirect="isDirect" :clickDate="clickDate"></block>
               </template>
             </template>
             <!--
@@ -924,6 +946,7 @@ export default {
       zoomDiyContext: 1,
       detailsImageList:[],
       tripImages:[],
+      moreDays: 0,
     };
   },
   components: {
@@ -1284,15 +1307,17 @@ export default {
                 }
                 setTimeout(() => {
                   this.navs.forEach((x) => {
-                    x.top =
-                      this.$refs[x.val].getBoundingClientRect().top +
-                      this.currentHeight -
-                      60;
+                    // x.top =
+                    //   this.$refs[x.val].getBoundingClientRect().top +
+                    //   this.currentHeight -
+                    //   60;
+                    x.top = this.$refs[x.val].getBoundingClientRect().top
                   });
-                  this.priceListHeight =
-                    this.$refs.pricelist.getBoundingClientRect().top +
-                    this.currentHeight -
-                    60;
+                  // this.priceListHeight =
+                  //   this.$refs.pricelist.getBoundingClientRect().top +
+                  //   this.currentHeight -
+                  //   60;
+                  this.priceListHeight = this.$refs.pricelist.getBoundingClientRect().top
                   this.days = [];
                   this.dayList.forEach((x) => {
                     let dayListObj = {
@@ -1303,6 +1328,12 @@ export default {
                     };
                     this.days.push(dayListObj);
                   });
+
+                  if(this.days.length>8){
+                    this.moreDays = 0
+                  }else {
+                    this.moreDays = 1
+                  }
                 }, 1000);
 
                 try {