no message

src/pages/scheduledTrip/detailsNew.vue

@@ -240,7 +240,7 @@
 
           <div class="q-pb-xl" v-if="tripImages&&tripImages.length>0"
             ref="diyContext">
-            <div v-for="(x,i) in tripImages">
+            <div v-for="(x,i) in tripImages" :key="i">
               <img v-if="dataList.teamType!=2" class="block" :src="x.header" style="width: 100%;">
               <img class="block" :src="x.page" style="width: 100%;">
               <div v-if="dataList.teamType!=2" class="tripImages-footer">
@@ -252,11 +252,21 @@
           <div class="q-mt-md q-pb-xl" id="setZoom" ref="diyContext" :style="{ zoom: zoomDiyContext }" v-html="dataList.feature.featureHtml" v-else-if="dataList.feature.featureHtml != ''"></div>
           <div class="text-h5 text-weight-bold text-left q-mt-xl" id="product" :class="{'q-px-md': $q.screen.width < 1220&&$q.platform.is.mobile}">{{$t('v103.scheduledTripDetails.righttitle.d2')}}</div>
           <div class="q-pb-xl">
-            <smaple :trip="dataList" :class="{'q-px-md':$q.platform.is.mobile}"></smaple>
-            <template v-if="dataList.dayList.length<=3">
+            <smaple :trip="dataList" class="q-pb-xl" :class="{'q-px-md':$q.platform.is.mobile}"></smaple>
+            <div v-if="detailsImageList&&detailsImageList.length>0"
+            v-for="(x,i) in detailsImageList" :key="i"
+            :id="`days_${i}`">
+              <div class="tripImages-footer" v-if="!dataList.tripColor" style="padding: 20px 0;"></div>
+              <img v-if="dataList.tripColor" class="block" :src="x.header" style="width: 100%;">
+              <img class="block" :src="x.page" style="width: 100%;">
+              <div class="tripImages-footer">
+                <img v-if="dataList.tripColor" class="block" :src="x.footer" style="width: 100%;">
+              </div>
+            </div>
+            <template v-if="dataList.dayList.length<=3&&!detailsImageList">
               <trip :trip="dataList" @change="changeTripShowHandler"></trip>
             </template>
-            <template v-else>
+            <template v-if="dataList.dayList.length>3&&!detailsImageList">
               <block :currentHeightDay="currentHeight" :days="days" :tripList="dayList" :isDirect="isDirect" :clickDate="clickDate"></block>
             </template>
           </div>
@@ -293,7 +303,7 @@
                 class="text-subtitle2 text-grey-6 cursor-pointer q-mb-md"
                 v-for="(x, i) in navs"
                 :key="i"
-                @click="goScrollHandler(x.top + 20)"
+                @click="goScrollHandler(x.top + 50)"
                 :class="{
                   'active-trip-module': currentHeight >= x.top && (i == navs.length - 1 || currentHeight < navs[i + 1].top)
                 }"
@@ -459,26 +469,6 @@ export default defineComponent({
       data.TripConfig = JSON.parse(window.localStorage.getItem('baseifo'))
     }
 
-    watch(()=>data.days,(n, o) => {
-      data.days =  n
-    },{immediate: true,deep: true})
-    watch(()=>data.currentHeight,(n, o) => {
-      data.navs.forEach((x, i) => {
-          if (
-            x.top &&
-            data.currentHeight >= x.top &&
-            (i == data.navs.length - 1 ||
-            data.currentHeight < data.navs[i + 1].top)
-          ) {
-            if (data.tab != x.display) {
-              data.tab = x.display;
-              return;
-            } else {
-              return;
-            }
-          }
-        });
-    },{immediate: true,deep: false})
     const methods = {
       changeShowOrderPreviewHandler() {
         data.showOrderPreview = !data.showOrderPreview;
@@ -580,10 +570,11 @@ export default defineComponent({
             if (r.data.resultCode == ApiResult.SUCCESS) {
               if (r.data.data) {
                 data.tripImages = []
-                if(r.data.data.feature.tripImageList.length>0){
-                let OtherFile = r.data.data.feature.tripImageList
+                data.detailsImageList = []
                 let header = r.data.data.feature.headerImage
                 let footer = r.data.data.feature.footerImage
+                if(r.data.data.feature.tripImageList.length>0){
+                let OtherFile = r.data.data.feature.tripImageList
                 OtherFile.forEach((x,i)=>{
                   let obj = {
                     header: header,
@@ -592,6 +583,17 @@ export default defineComponent({
                   }
                   data.tripImages.push(obj)
                 })
+                }
+                if(r.data.data.feature.detailsImageList.length>0){
+                let OtherFile = r.data.data.feature.detailsImageList
+                OtherFile.forEach((x,i)=>{
+                  let obj = {
+                    header: header,
+                    page: x,
+                    footer: footer,
+                  }
+                  data.detailsImageList.push(obj)
+                })
               }
               console.log(data.tripImages,'-----')
               //  tripImageList detailsImageList headerImage footerImage
@@ -689,6 +691,35 @@ export default defineComponent({
         document.querySelector(newval).scrollIntoView(true)
       }
     }
+    watch(()=>data.days,(n, o) => {
+      data.days =  n
+      try{
+        data.days.forEach((x,i)=>{
+          var object=document.getElementById(`days_${i}`);
+          x.top = object.getBoundingClientRect().top+60
+        })
+      } catch (error) {
+        console.log('----异常')
+      }
+      methods.getTopNum(JSON.stringify(data.days))
+    },{immediate: true,deep: true})
+    watch(()=>data.currentHeight,(n, o) => {
+      data.navs.forEach((x, i) => {
+          if (
+            x.top &&
+            data.currentHeight >= x.top &&
+            (i == data.navs.length - 1 ||
+            data.currentHeight < data.navs[i + 1].top)
+          ) {
+            if (data.tab != x.display) {
+              data.tab = x.display;
+              return;
+            } else {
+              return;
+            }
+          }
+        });
+    },{immediate: true,deep: false})
 
     methods.getData()
     return {