no message

package-lock.json

@@ -1,5 +1,5 @@
 {
-  "name": "jzlife_vue_report",
+  "name": "jzlife_official",
   "version": "1.0.0",
   "lockfileVersion": 1,
   "requires": true,
@@ -1973,6 +1973,11 @@
         }
       }
     },
+    "comutils": {
+      "version": "1.1.19",
+      "resolved": "https://registry.npmjs.org/comutils/-/comutils-1.1.19.tgz",
+      "integrity": "sha512-JxXB67juILiwhdLwOsYyjUqwWEhHdObI0EClOPk+JDtEuTbac59s0pxGpfCBnNNQ5JommifmcMGneW/4Cg7YWw=="
+    },
     "concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -11048,6 +11053,14 @@
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.4.9.tgz",
       "integrity": "sha512-CGAKWN44RqXW06oC+u4mPgHLQQi2t6vLD/JbGRDAXm0YpMv0bgpKuU5bBd7AvMgfTz9kXVRIWKHqRwGEb8xFkA=="
     },
+    "vue-seamless-scroll": {
+      "version": "1.1.23",
+      "resolved": "https://registry.npmjs.org/vue-seamless-scroll/-/vue-seamless-scroll-1.1.23.tgz",
+      "integrity": "sha512-HBjUub8WwsKJzbFCrwKPDrZn4e+SSbkKgwWtjKtfLwesiFGwSsVxP44/Z6d3kpXy94qIFOiflJH6l0/9pj7SGA==",
+      "requires": {
+        "comutils": "^1.1.9"
+      }
+    },
     "vue-style-loader": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-3.1.2.tgz",

package.json

@@ -22,7 +22,8 @@
     "pivottable": "^2.23.0",
     "table2excel": "^1.0.4",
     "vue": "^2.5.2",
-    "vue-router": "^3.0.1"
+    "vue-router": "^3.0.1",
+    "vue-seamless-scroll": "^1.1.23"
   },
   "devDependencies": {
     "autoprefixer": "^7.1.2",

src/components/aboutUs.vue

@@ -82,7 +82,7 @@
                 <div class="year-border">
                 </div>
                 <div class="year-list">
-                <div class="year-block" v-for="(item,index) in developYearList" :key="item.id" @click="yearSwitch(item)">
+                <div class="year-block" v-for="(item,index) in developYearList" :key="item.id" @click="yearSwitch(item,index)">
                    <img :src="activeCal==index?'https://mall.zhaijieshi.cc/file/jz-gw/about/icon-selected.png':'https://mall.zhaijieshi.cc/file/jz-gw/about/icon-unselect.png'"/>
                    <div :class="[activeCal==index?'active-year':'']">{{item}}年</div>
                 </div>
@@ -272,42 +272,43 @@ export default {
     },
     methods:{
 carouselChange(current,old){
-    // this.activeCal=current;
-    if(current==0){
-        this.developYearList=['2018','2019','2020','2021','2022','2023'];
-    }else if(current==1){
-         this.developYearList=['2019','2020','2021','2022','2023','2018'];
-    }else if(current==2){
-         this.developYearList=['2020','2021','2022','2023','2018','2019'];
-    }else if(current==3){
-         this.developYearList=['2021','2022','2023','2018','2019','2020'];
-    }else if(current==4){
-         this.developYearList=['2022','2023','2018','2019','2020','2021'];
-    }else if(current==5){
-         this.developYearList=['2023','2018','2019','2020','2021','2022'];
-    }
+    this.activeCal=current;
+    // if(current==0){
+    //     this.developYearList=['2018','2019','2020','2021','2022','2023'];
+    // }else if(current==1){
+    //      this.developYearList=['2019','2020','2021','2022','2023','2018'];
+    // }else if(current==2){
+    //      this.developYearList=['2020','2021','2022','2023','2018','2019'];
+    // }else if(current==3){
+    //      this.developYearList=['2021','2022','2023','2018','2019','2020'];
+    // }else if(current==4){
+    //      this.developYearList=['2022','2023','2018','2019','2020','2021'];
+    // }else if(current==5){
+    //      this.developYearList=['2023','2018','2019','2020','2021','2022'];
+    // }
 },
-yearSwitch(item){
+yearSwitch(item,index){
     console.log(item);
     setTimeout(()=>{
-let index=0;
-    this.developYearList=['2018','2019','2020','2021','2022','2023'];
-    if(item=='2019'){
-      index=1;
-       this.developYearList=['2019','2020','2021','2022','2023','2018'];
-    }else if(item=='2020'){
-      index=2;
-        this.developYearList=['2020','2021','2022','2023','2018','2019'];
-    }else if(item=='2021'){
-      index=3;
-      this.developYearList=['2021','2022','2023','2018','2019','2020'];
-    }else if(item=='2022'){
-      index=4;
-      this.developYearList=['2022','2023','2018','2019','2020','2021'];
-    }else if(item=='2023'){
-      index=5;
-       this.developYearList=['2023','2018','2019','2020','2021','2022'];
-    }
+    // let index=0;
+    // this.developYearList=['2018','2019','2020','2021','2022','2023'];
+    // if(item=='2019'){
+    //   index=1;
+    //    this.developYearList=['2019','2020','2021','2022','2023','2018'];
+    // }else if(item=='2020'){
+    //   index=2;
+    //     this.developYearList=['2020','2021','2022','2023','2018','2019'];
+    // }else if(item=='2021'){
+    //   index=3;
+    //   this.developYearList=['2021','2022','2023','2018','2019','2020'];
+    // }else if(item=='2022'){
+    //   index=4;
+    //   this.developYearList=['2022','2023','2018','2019','2020','2021'];
+    // }else if(item=='2023'){
+    //   index=5;
+    //    this.developYearList=['2023','2018','2019','2020','2021','2022'];
+    // }
+    this.activeCal=index;
      this.$refs.carouse.setActiveItem(index);
     },200);
     
@@ -460,7 +461,7 @@ top:30px;
 .item-content{
     z-index:100;
     position: relative;
-    padding:80px 0 0 80px;
+    padding:80px 0 0 20px;
 }
 .item-year{
     margin-bottom:20px;

src/components/home.vue

@@ -31,7 +31,7 @@
               <div class="item-title">家电清洗</div>
             </div>
             <div class="zyjz-item" @click="goService(4)">
-              <div class="item-title">家具养护</div>
+              <div class="item-title">家居养护</div>
             </div>
             <div class="zyjz-item" @click="goService(3)">
               <div class="item-title">收纳</div>
@@ -197,9 +197,22 @@
 
       <div class="jz-honor">
         <div class="staff-title">鲸致荣誉</div>
-        <div class="honor-wrapper" @scroll="honorScroll" id="honor-list">
-          <img v-for="(item,index) in honorList" :key="index" :src="item" />
+         <!-- @scroll="honorScroll" -->
+       
+            <!-- <vue-seamless-scroll :data="honorList" class="honer-scroll" 
+        :class-option="seamlessScrollOption"
+       
+      > -->
+       <div class="honor-wrapper" id="honor-list" :style="{ 'transform': `translateX(${offset}px)` }">
+          <div v-for="(item,index) in honorList" :key="index" class="image-item">
+            <img  :src="item"  />
+          </div>
+            <!-- 复制的图片以保持无限滚动效果 -->
+      <div v-for="(img, index) in duplicateImages" :key="`dup-${index}`" class="image-item">
+        <img :src="img">
+      </div>
         </div>
+         <!-- </vue-seamless-scroll> -->
         <div class="progress-wrapper">
           <el-progress
             :text-inside="true"
@@ -495,6 +508,7 @@
 <script>
 import jzHeader from "@/components/common/Header";
 import jzFooter from "@/components/common/Footer";
+import vueSeamlessScroll from 'vue-seamless-scroll'
 export default {
    directives: {
     draggable: {
@@ -536,8 +550,17 @@ export default {
       }
     }
   },
+   computed: {
+            duplicateImages() {
+      // 复制图片以实现无限滚动
+      return [...this.honorList, ...this.honorList];
+    },
+ 
+        },
   data() {
     return {
+      offset: 0, // 用于控制滚动位置
+      intervalId: null, // 用于控制滚动的定时器
       honerPer: 40,
       activeDetail: 0,
       activeCategory: "",
@@ -702,15 +725,26 @@ export default {
   },
   components: {
     jzHeader,
-    jzFooter
+    jzFooter,
+    vueSeamlessScroll
   },
   mounted(){
-    document.addEventListener('dragover', this.moveElement);
+    this.startScroll();
   },
    beforeDestroy() {
-    document.removeEventListener('dragover', this.moveElement);
+   this.stopScroll();
   },
   methods: {
+      startScroll() {
+      this.intervalId = setInterval(() => {
+        this.offset -= 10; // 每秒向左移动1像素
+      }, 1000);
+    },
+    stopScroll() {
+      if (this.intervalId) {
+        clearInterval(this.intervalId);
+      }
+    },
       dragStart(event) {
       this.dragging = true;
       const style = window.getComputedStyle(event.target, null);
@@ -1334,13 +1368,38 @@ export default {
   width: 90%;
   min-width: 980px;
   max-width: 1540px;
+
+
+ overflow: hidden;
+
+   position: relative;
+  
 }
-.honor-wrapper {
-  height: 160px;
+.honer-scroll{
+ height: 160px;
   overflow-x: scroll;
   margin-top: 20px;
+    width: 100%;
+    min-width: 980px;
+  max-width: 1540px;
+   position: relative;
+}
+.honor-wrapper {
+
+  margin-top: 20px;
+  height: 160px;
   width: 100%;
-  white-space: nowrap;
+    min-width: 980px;
+  max-width: 1540px;
+  display: flex;
+ 
+  /* white-space: nowrap; */
+  /* overflow-y: hidden; */
+ 
+ animation: scroll 10s linear infinite; 
+}
+.honor-wrapper li{
+  display: inline-block;
 }
 /* .honor-wrapper::-webkit-scrollbar {
   display: none;
@@ -1349,6 +1408,15 @@ export default {
 .honor-wrapper img {
   height: 160px;
   margin-right: 20px;
+  display: block;
+}
+@keyframes scroll {
+  0% {
+    transform: translateX(0);
+  }
+  100% {
+    transform: translateX(-100%); /* 根据实际图片总宽度调整 */
+  }
 }
 .progress-wrapper {
   width: 60px;

src/components/service.vue

@@ -177,7 +177,7 @@ export default {
         },
 
         {
-          title: "家具养护",
+          title: "家居养护",
           children: [
             {
               name: "地毯清洗",