una пре 3 месеци
родитељ
комит
6511620718
3 измењених фајлова са 1188 додато и 851 уклоњено
  1. 53 8
      src/components/aboutUs.vue
  2. 1056 811
      src/components/home.vue
  3. 79 32
      src/components/service.vue

+ 53 - 8
src/components/aboutUs.vue

@@ -63,7 +63,7 @@
            <div class="development container">
                <div class="common-title">发展历程</div>
              <div class="develop-wrapper">
-                    <el-carousel height="258px" :autoplay="true" indicator-position="none" @change="carouselChange">
+                    <el-carousel height="258px" :autoplay="false" indicator-position="none" @change="carouselChange" :interval="4000"  ref="carouse">
                  <el-carousel-item v-for="item in developList" :key="item.id">
         <div class="develop-item">
             <div class="item-bg">{{item.year}}</div>
@@ -82,9 +82,9 @@
                 <div class="year-border">
                 </div>
                 <div class="year-list">
-                <div class="year-block" v-for="(item,index) in developList" :key="item.id">
+                <div class="year-block" v-for="(item,index) in developYearList" :key="item.id" @click="yearSwitch(item)">
                    <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.year}}年</div>
+                   <div :class="[activeCal==index?'active-year':'']">{{item}}年</div>
                 </div>
                 </div>
              </div>
@@ -110,6 +110,7 @@
        <div class="img-line">
          <img src="https://mall.zhaijieshi.cc/file/jz-gw/company/logo-zgdx.png"/>
          <img src="https://mall.zhaijieshi.cc/file/jz-gw/company/logo-zgsh.png"/>
+         <img src="https://mall.zhaijieshi.cc/file/jz-gw/company/logo-zabx.png"/>
         </div>
         <div class="coop-content">通过集采价格,提升集采优势,并减少购频次及供求沟通成本。</div>
     </el-tab-pane>
@@ -155,7 +156,7 @@
            <div class="platform container">
                <div class="common-title">平台数据</div>
                <div class="data-wrapper">
-               <el-carousel height="260px" :autoplay="false" indicator-position="outside">
+               <el-carousel height="260px" :interval="5000" :autoplay="true" indicator-position="outside" arrow="never">
       <el-carousel-item>
         <div class="data-item">
           <img src="https://mall.zhaijieshi.cc/file/jz-gw/about/data-02.png"/>
@@ -223,6 +224,7 @@ export default {
         return {
            activeName:'1', 
            activeCal:0,
+           developYearList:['2018','2019','2020','2021','2022','2023'],
            developList:[
                {id:1,
                 year:'2018',
@@ -260,8 +262,9 @@ export default {
                 {id:6,
                 year:'2023',
                 word1:'抖音本地生活上线',
-                word2:'“千城万店”项目启动,2个月覆盖80+城市',
-                word3:'昆山培训运营基地启动,一站式培训+新型家庭服务业创业孵化',
+                word2:'快手本地生活上线',
+                word3:'“千城万店”项目启动,2个月覆盖80+城市',
+                word4:'昆山培训运营基地启动,一站式培训+新型家庭服务业创业孵化',
                }
 
            ]
@@ -269,7 +272,45 @@ export default {
     },
     methods:{
 carouselChange(current,old){
-    this.activeCal=current;
+    // 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){
+    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'];
+    }
+     this.$refs.carouse.setActiveItem(index);
+    },200);
+    
 }
     },
     components:{
@@ -462,10 +503,13 @@ padding:0 60px;
     width:16px;
     height:16px;
 }
+.year-block:hover img{
+    cursor: pointer;
+}
 .active-year{
     color: #00BCFF;
     font-size: 18px;
-    transition: all 0.3s;
+    transition: all 0.4s;
 }
  /* 合作机构 */
 .cooperative-agency{
@@ -495,6 +539,7 @@ padding:0 60px;
     height:106px;
     margin:26px 0 42px;
     display: flex;
+    justify-content: center;
 }
 .img-line img{
     width: 230px;

Разлика између датотеке није приказан због своје велике величине
+ 1056 - 811
src/components/home.vue


+ 79 - 32
src/components/service.vue

@@ -43,14 +43,20 @@ export default {
                 {
                     title:'居家保洁',
                     children:[
+                         {
+                                   name:'基础保洁',
+                                   url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-jcbj.png',
+                                   content:'全屋除尘;<br/> 108项清洁标准;<br/>  可视化验收标准;<br/>  一次搞定全屋清洁;<br/> ',
+                                    slogan:'让家舒适洁净,治愈疲惫生活。'
+                               },
                                {
-                                   name:'全屋精细保洁',
+                                   name:'深度保洁',
                                    url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-01.png',
                                    content:'6大区域;<br/> 108项清洁标准;<br/>  可视化验收标准;<br/>  一次搞定全屋清洁;<br/> ',
                                     slogan:'让家舒适洁净,治愈疲惫生活。'
                                },
                                 {
-                                   name:'全屋无损开荒保洁',
+                                   name:'无家具粗开荒保洁',
                                    url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-02.png',
                                    content:'干净无损;<br/> 舒心入住;<br/>  把装修后的房子;<br/> 变成想象中的家;<br/> ',
                                     slogan:'让家舒适洁净,治愈疲惫生活。'
@@ -67,28 +73,28 @@ export default {
                     ]
                 },
                  {
-                    title:'家电洗',
+                    title:'家电洗',
                     children:[
                                {
-                                   name:'空调洗',
+                                   name:'空调洗',
                                    url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-04.png',
                                    content:'专业进口设备;<br/> 一台空调洗3遍;<br/> 洗净尘霉菌;<br/> 吹出干净风;<br/> ',
                                     slogan:'让家舒适洁净,治愈疲惫生活。'
                                },
                                 {
-                                   name:'冰箱洗',
+                                   name:'冰箱洗',
                                    url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-05.png',
                                    content:'5道工序;<br/> 12项清洁;<br/> 去污除冰,除味消毒;<br/> 守护餐食健康;<br/> ',
                                     slogan:'让家舒适洁净,治愈疲惫生活。'
                                },
                                 {
-                                   name:'洗衣机洗',
+                                   name:'洗衣机洗',
                                    url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-06.png',
                                    content:'专业清洁设备;<br/>4遍健康洗;<br/> 除霉又除垢;<br/>  杜绝衣物二次污染;<br/> ',
                                     slogan:'让家舒适洁净,治愈疲惫生活。'
                                },
                                   {
-                                   name:'油灶洗',
+                                   name:'油灶洗',
                                    url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-07.png',
                                    content:'140℃高温清洗;<br/>从外到里,层层深入;<br/> 一次搞定隐蔽的陈年顽污油垢;<br/>  净爽下厨;<br/> ',
                                     slogan:'让家舒适洁净,治愈疲惫生活。'
@@ -102,15 +108,15 @@ export default {
                     title:'专区清洁',
                     children:[
                                {
-                                   name:'浴室深度洗',
+                                   name:'浴室深度洗',
                                    url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-08.png',
-                                   content:'140℃高温清洗;<br/> 无死角清洁;<br/> 除菌去垢;<br/> 早晚洗漱更健康;<br/> ',
+                                   content:'专业设备清洗;<br/> 无死角清洁;<br/> 除菌去垢;<br/> 早晚洗漱更健康;<br/> ',
                                     slogan:'让家舒适洁净,治愈疲惫生活。'
                                },
                                 {
-                                   name:'厨房深度洗',
+                                   name:'厨房深度洗',
                                    url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-09.png',
-                                   content:'专业进口工具组;<br/> 140℃高温消灭油垢细菌;<br/> 强效清除缝隙凹槽污垢;<br/> 还原厨房干净本色;<br/> ',
+                                   content:'专业进口工具组;<br/> 专业设备消灭油垢细菌;<br/> 强效清除缝隙凹槽污垢;<br/> 还原厨房干净本色;<br/> ',
                                     slogan:'让家舒适洁净,治愈疲惫生活。'
                                },
                                 {
@@ -130,13 +136,19 @@ export default {
                        
                     ]
                 },
-                  {
-                    title:'鲸选钟点工',
+                     {
+                    title:'搬家收纳',
                     children:[
                                {
-                                   name:'精选钟点工',
-                                   url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-12.png',
-                                   content:'10万保姆资源库;<br/> 快速匹配;<br/> 不满意免费更换;<br/>  1对1专属管家全程跟进服务;<br/> ',
+                                   name:'日式搬家',
+                                   url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-13.png',
+                                   content:'提前上门规划;<br/> 打包搬运复位;<br/> 全程不动手;<br/>  让搬家成为美好回忆;<br/> ',
+                                    slogan:'让家舒适洁净,治愈疲惫生活。'
+                               },
+                               {
+                                   name:'日式收纳',
+                                   url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-14.png',
+                                   content:'专业收纳师;<br/> 分区规划清洁整理;<br/> 收纳四季衣物;<br/> 改善衣柜空间;<br/> ',
                                     slogan:'让家舒适洁净,治愈疲惫生活。'
                                },
                             
@@ -145,22 +157,34 @@ export default {
                        
                     ]
                 },
+                
                 {
-                    title:'搬家收纳',
+                    title:'家具养护',
                     children:[
                                {
-                                   name:'日式搬家',
-                                   url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-13.png',
-                                   content:'提前上门规划;<br/> 打包搬运复位;<br/> 全程不动手;<br/>  让搬家成为美好回忆;<br/> ',
+                                   name:'地毯清洗',
+                                   url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-dbqx.png',
+                                   content:'高效清洁剂与设备;<br/> 深入清洁地毯;<br/> 去除污渍与异味;<br/> 恢复柔软光滑,赤脚更舒适;<br/> ',
                                     slogan:'让家舒适洁净,治愈疲惫生活。'
                                },
-                               {
-                                   name:'日式收纳',
-                                   url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-14.png',
-                                   content:'专业收纳师;<br/> 分区规划清洁整理;<br/> 收纳四季衣物;<br/> 改善衣柜空间;<br/> ',
+                                {
+                                   name:'窗帘挂洗',
+                                   url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-clgx.png',
+                                   content:'专业设备,深度清洁;<br/> 轻柔挂洗窗帘;<br/> 强效清除缝隙凹槽污垢同时保护质地与色彩;<br/> 让窗帘重现光彩;<br/> ',
+                                    slogan:'让家舒适洁净,治愈疲惫生活。'
+                               },
+                                {
+                                   name:'布艺沙发清洗',
+                                   url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-sfqx.png',
+                                   content:'定制清洗方案;<br/>根据沙发材质和污渍程度;<br/> 恢复沙发干净整洁;<br/> 打造舒适休息空间;<br/> ',
+                                    slogan:'让家舒适洁净,治愈疲惫生活。'
+                               },
+                                  {
+                                   name:'木地板打蜡',
+                                   url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-dbdl.png',
+                                   content:'环保耐用地板蜡;<br/>为木地板提供保护膜;<br/> 防水防尘防划痕;<br/>持久如新,光泽照人;<br/> ',
                                     slogan:'让家舒适洁净,治愈疲惫生活。'
                                },
-                            
                                 
                            
                        
@@ -187,7 +211,21 @@ export default {
                        
                     ]
                 },
-               
+                 {
+                    title:'甄选|金牌保洁师',
+                    children:[
+                               {
+                                   name:'甄选|金牌保洁师',
+                                   url:'https://mall.zhaijieshi.cc/file/jz-gw/service/detail-12.png',
+                                   content:'鲸致生活自营体系化专业培训考核;<br/> 80项理论培训,73项实操培训;<br/> 32项商家运营理论培训;<br/>  全量培训考核+2轮跟单实操;<br/> ',
+                                    slogan:'让家舒适洁净,治愈疲惫生活。'
+                               },
+                            
+                                
+                           
+                       
+                    ]
+                },
             ],
             subList:[
                 {name:''}
@@ -216,13 +254,22 @@ export default {
         jzFooter,
        },
       created(){
-          this.subList=this.list[0].children;
+          let id = this.$route.query.id;
+          console.log(id);
+          let index=0;
+          let activeNav=0;
+          if(id!=0 && id!=undefined){
+             index=id;
+             activeNav=id;
+          }
+          this.activeNav=id;
+          this.subList=this.list[index].children;
           this.activeSer={
-              title:this.list[0].title,
-              name:this.list[0].children[0].name,
-              url:this.list[0].children[0].url,
-              content:this.list[0].children[0].content,
-              slogan:this.list[0].children[0].slogan,
+              title:this.list[index].title,
+              name:this.list[index].children[0].name,
+              url:this.list[index].children[0].url,
+              content:this.list[index].children[0].content,
+              slogan:this.list[index].children[0].slogan,
           }
       } ,
       methods:{