Merge branch 'dev'

src/components/totop.vue

@@ -56,7 +56,7 @@ onMounted(() => {
     right:0px;
     bottom:135px;
     cursor: pointer;
-    z-index:999;
+    z-index:2;
     overflow: hidden;
     border-radius: 15px  0 0 15px;
     box-shadow: 0 0 6px rgba(0, 0, 0, 0.12);

src/views/caseDetail.vue

@@ -1,12 +1,12 @@
 <template>
-  <div class="main casemain" :class="{on: step == pageIndex }" :id="'pagemain'+pageIndex" v-show="step == pageIndex" >
+  <div class="main casemain" :class="{on: step == pageIndex }" :id="'pagemain'+pageIndex" :style="{height:step == pageIndex?'100%':'0px'}" >
     <img src="../assets/bg.png" alt="" class="bg" />
     <div class="dealbox" style="position: relative;z-index:1;background:transparent;">
       <div class="prev" @click="switchPage(pageIndex - 1)">上一步</div>
     </div>
-    <div class="content">
-      <div class="pagebox">
-        <div class="page">
+    <div class="content" >
+      <div class="pagebox" >
+        <div class="page" v-if="step == pageIndex" >
           <!-- <div class="card" v-html="pageItem.content"></div> -->
           <div
             class="card"
@@ -47,7 +47,7 @@
         ></question>
       </div>
     </div>
-    <div class="dealbox">
+    <div class="dealbox" >
       <div class="next" @click="switchPage(pageIndex - 1)">上一步</div>
       <div class="prev" @click="goNext(pageIndex + 1)">下一步</div>
     </div>
@@ -57,10 +57,11 @@
       ref="cdialog"
       :showCancel="false"
     ></c-dialog>
-  </div>
-  <van-image-preview ref="ImagePreview"  v-model:show="showImg" closeable :images="imgList" @change="onChange">
+    <van-image-preview teleport="body"  :overlay-style="{zIndex:10}" ref="ImagePreview"  v-model:show="showImg" closeable :images="imgList" @change="onChange">
+ 
+     </van-image-preview>
+  </div>
  
- </van-image-preview>
 
 </template>
 <script setup>
@@ -105,6 +106,23 @@ const unitAnswer = {
 };
 const cdialog = ref(null);
 const dialog_message = ref("");
+watch(() => props.step, async(newVal) => {
+  let imgArr = [];
+  await nextTick(() => {
+    const nodeList = document.querySelectorAll("#pagemain"+props.pageIndex+" .namebox img");
+    console.log(nodeList);
+    nodeList.forEach(function (node) {
+      imgArr.push(node.src);
+        node.removeEventListener("click",(e)=>{
+            handleClick(e)
+        });
+        node.addEventListener("click", (e)=>{
+            handleClick(e)
+        });
+    });
+    imgList.value = [...new Set(imgArr)]; 
+  });
+})
 
 watch(
   () => props.pageItem,
@@ -283,21 +301,7 @@ const handleClick = (e) => {
   
 };
 onMounted(async () => {
-   let imgArr = [];
-  await nextTick(() => {
-    const nodeList = document.querySelectorAll("#pagemain"+props.pageIndex+" .namebox img");
-    console.log(nodeList);
-    nodeList.forEach(function (node) {
-      imgArr.push(node.src);
-        node.removeEventListener("click",(e)=>{
-            handleClick(e)
-        });
-        node.addEventListener("click", (e)=>{
-            handleClick(e)
-        });
-    });
-    imgList.value = [...new Set(imgArr)]; 
-  });
+ 
 });
 const onChange=(newIndex)=>{
   position.value = newIndex || 0
@@ -307,10 +311,23 @@ const onChange=(newIndex)=>{
 <style lang='scss' scoped>
 .casemain.on{
   opacity: 1;
+  display: block;
+  position: relative;
+  z-index:1;
+  height:100%;
+  min-height: 100vh;
+}
+.casemain{
+  position: relative;
+  z-index:-1000;
+  min-height:0;
+  height:0px;
+  display: none;
+  opacity: 0;
 }
 .main {
-  padding-bottom: 15px;
-  opacity: 0;
+
+  margin-bottom: 15px;
   width: 100%;
   position: relative;
   background: #fff;
@@ -318,7 +335,9 @@ const onChange=(newIndex)=>{
   .dealbox {
     background: #fff;
     margin: 12px 15px 10px;
-   
+  
+     position: relative;
+     z-index:1;
     display: flex;
     justify-content: space-between;
   }

src/views/caseIntro.vue

@@ -18,7 +18,8 @@
             <div class="button" @click="handleStart" >马上开始</div>
         </div>
     </div>
-    <caseDetail v-for="(item, index) in pageList" :pageIndex="index" :step="step" @switchPage="switchPage" :pageItem="item" :pageNum="pageList.length" @getAllAnswer="getAllAnswer"  :start_time="start_time" :case_id="case_id"></caseDetail>
+    
+    <caseDetail v-for="(item, index) in pageList" :pageIndex="index" :step="step" @switchPage="switchPage" :pageItem="item" :pageNum="pageList.length" @getAllAnswer="getAllAnswer"  :start_time="start_time" :case_id="case_id" :key="item.case_item_id"  v-show="step == index"></caseDetail>
     <comment v-show="!showIntro && step==pageList.length" ref="commentRef" :countTime="countTime" @initPage="initPage" :start_time="entry_time" :allAnswer="allAnswer" :is_welfare="is_welfare"></comment>
     <totop></totop>
     <back :project_id="caseObj.project_id"></back>
@@ -120,13 +121,18 @@ const getAllAnswer=(data)=>{
 const switchPage = (index) => {
     if(index<0){
         showIntro.value=true;
-        step.value=-1;
         document.documentElement.scrollTop = 0;
        document.body.scrollTop = 0;
+       setTimeout(()=>{
+        step.value=-1;
+      },300)
     }else{
-        step.value=index;
+       
         document.documentElement.scrollTop = 0;
       document.body.scrollTop = 0;
+      setTimeout(()=>{
+        step.value=index;
+      },300)
     }
     if(index==pageList.value.length){
         //alert(caseObj.project_id);
@@ -157,13 +163,16 @@ const handleCount = () => {
 const initPage=()=>{
     // step.value =-1;
     // showIntro.value=true;
-    step.value = 0;
-    showIntro.value = false;
+   
     document.documentElement.scrollTop = 0;
     document.body.scrollTop = 0;
    if(caseObj.case_item.length<=1) {
        commentRef.value.init(caseObj.case_id,caseObj.project_id)
    }
+   setTimeout(()=>{
+    step.value = 0;
+    showIntro.value = false;
+  },300)
 }
 const handleStart = () => {
     step.value = 0;

src/views/comment.vue

@@ -353,6 +353,7 @@ defineExpose({init,formatAnswer})
 .main {
     width: 100%;
     position: relative;
+    z-index:1;
     overflow: hidden;
 
     .add {

src/views/home.vue

@@ -50,7 +50,6 @@ const getList = async () => {
      list.value = list.value.concat(data.data);
     if (data.data.length <10) {
       finished.value = true;
-      
     }
   }