11

src/components/DependentTravel/IndependentTravel.vue

@@ -17,28 +17,32 @@
           <img class="right1" src="../../assets/img/travel/right1.png" alt="">
             <el-col :span="18" :offset="3">
                 <div class="pro_list">
-                    <div>
-                        <img src="../../assets/img/travel/hover1.png" alt="">
+                    <div @mouseenter="enter(0)" @mouseleave="leave">
+                        <img v-if="prolist==0" src="../../assets/img/travel/hover0.png" alt="">
                         <p>大阪</p>
                         <p class="fg"></p>
                         <p>osaka</p>
                     </div>
-                    <div>
+                    <div @mouseenter="enter(1)" @mouseleave="leave">
+                        <img v-if="prolist==1" src="../../assets/img/travel/hover1.png" alt="">
                         <p>东京</p>
                         <p class="fg"></p>
                         <p>Tokyo</p>
                     </div>
-                    <div>
+                    <div @mouseenter="enter(2)" @mouseleave="leave">
+                        <img v-if="prolist==2" src="../../assets/img/travel/hover2.png" alt="">
                         <p>冲绳</p>
                         <p class="fg"></p>
                         <p>Okinawa</p>
                     </div>
-                    <div>
+                    <div @mouseenter="enter(3)" @mouseleave="leave">
+                        <img v-if="prolist==3" src="../../assets/img/travel/hover3.png" alt="">
                         <p>北海道</p>
                         <p class="fg"></p>
                         <p>Hokkaido</p>
                     </div>
-                    <div>
+                    <div @mouseenter="enter(4)" @mouseleave="leave">
+                        <img v-if="prolist==4" src="../../assets/img/travel/hover4.png" alt="">
                         <p>富士山</p>
                         <p class="fg"></p>
                         <p>Mount Fuji</p>
@@ -67,6 +71,9 @@
                                         <div class="text">四季变化明显，樱花季节，富士山，银座，新宿，池袋东护城河对岸矗立着一幢标志性建筑飞檐重阁白墙黑瓦，精巧的建筑连同浓郁的日本民族风格一起半掩半映在绿树丛中，加上氤氲萦绕的氛围，使皇宫更显得几分神秘。仿佛整个东京仅存的一丁点文化底蕴都藏进了对岸的树丛里。</div>
 
                                     </div>
+                                    <div>
+                                    <el-button size="mini" class="btn">立即购买</el-button>
+                                </div>
                             </div>
                         </div>
                         <div>
@@ -84,6 +91,9 @@
                                         <div class="text">四季变化明显，樱花季节，富士山，银座，新宿，池袋东护城河对岸矗立着一幢标志性建筑飞檐重阁白墙黑瓦，精巧的建筑连同浓郁的日本民族风格一起半掩半映在绿树丛中，加上氤氲萦绕的氛围，使皇宫更显得几分神秘。仿佛整个东京仅存的一丁点文化底蕴都藏进了对岸的树丛里。</div>
 
                                 </div>
+                                <div>
+                                    <el-button size="mini" class="btn">立即购买</el-button>
+                                </div>
                             </div>
                         </div>
                         <div>
@@ -101,6 +111,9 @@
                                         <div class="text">四季变化明显，樱花季节，富士山，银座，新宿，池袋东护城河对岸矗立着一幢标志性建筑飞檐重阁白墙黑瓦，精巧的建筑连同浓郁的日本民族风格一起半掩半映在绿树丛中，加上氤氲萦绕的氛围，使皇宫更显得几分神秘。仿佛整个东京仅存的一丁点文化底蕴都藏进了对岸的树丛里。</div>
 
                                     </div>
+                                    <div>
+                                    <el-button size="mini" class="btn">立即购买</el-button>
+                                </div>
                             </div>
                         </div>
                         
@@ -127,11 +140,20 @@
 export default {
   data() {
     return {
-      top: 0
+      top: 0,
+      prolist:-1,
     };
   },
   mounted() {},
-  methods: {}
+  methods: {
+      enter(num){
+          this.prolist=num;
+      },
+      leave(){
+          this.prolist=-1;
+      },
+
+  }
 };
 </script>
 
@@ -157,6 +179,10 @@ export default {
 .back_middle{
     position: relative;
 }
+.Indepentdent .Season_content .Season_content_list .btn{
+    background: #EE4454;
+    color: #fff;
+}
 .Indepentdent .Season_content .Season_content_list:hover{
     cursor: pointer;
     box-shadow:0px 1px 8px 0px rgba(153,153,153,0.6);
@@ -197,6 +223,7 @@ export default {
     margin:10px 0;
     box-sizing: border-box;
     display: inline-block;
+    height: 278px;
 }
 .Indepentdent .Season_content>div{
     width:33%;

src/components/global/head.vue

@@ -88,9 +88,9 @@ color:rgba(51,51,51,1);
                                     <!-- <el-menu-item index="2-3">单团</el-menu-item>
                                     <el-menu-item index="2-4">私人订制</el-menu-item> -->
                                 </el-submenu>
-                                <el-menu-item index="3" @click="goUrl('TicketHome',true)"><a href="javascript:void(0);">机票</a></el-menu-item>
-                                <el-menu-item index="4" @click="goUrl('VisaHomePage',true)"><a href="javascript:void(0);">签证</a></el-menu-item>
-                                <el-menu-item index="5" @click="goUrl('IndependentTravel',true)"><a href="javascript:void(0);">自由行</a></el-menu-item>
+                                <!-- <el-menu-item index="3" @click="goUrl('TicketHome',true)"><a href="javascript:void(0);">机票</a></el-menu-item> -->
+                                <!-- <el-menu-item index="4" @click="goUrl('VisaHomePage',true)"><a href="javascript:void(0);">签证</a></el-menu-item> -->
+                                <!-- <el-menu-item index="5" @click="goUrl('IndependentTravel',true)"><a href="javascript:void(0);">自由行</a></el-menu-item> -->
 
                                 <!-- <el-menu-item index="5"><a href="javascript:void(0);">机票</a></el-menu-item>
                                <el-menu-item index="2"><a href="javascript:void(0);">酒店</a></el-menu-item>