feat

src/views/home/index.vue

@@ -1,7 +1,7 @@
 <!--  -->
 <template>
   <div class="home" @click="showSwitch = false">
-    <input type="file" @change="readFile" accept=".xlsx" />
+    <!-- <input type="file" @change="readFile" accept=".xlsx" /> -->
     <div class="title"></div>
     <template v-if="currentData">
       <div class="swiper-dom swiper-container" v-if="currentData.list[0] && currentData.list[0].length">
@@ -191,7 +191,7 @@ const swiperOptions = {
     stopOnLastSlide: false, //切换到最后一个时不停止自动播放
     disableOnInteraction: false, //触碰后不停止自动播放
   },
-  slidesPerView: 2.5,
+  slidesPerView: 2.3,
   spaceBetween: 40,
   freeMode: false,
   speed: 10000, //切换速度
@@ -235,10 +235,6 @@ const toggleOptions = (index) => {
     };
     swiperOptions.speed = 10000;
     swiperOptions.freeMode = false;
-
-
-
-
   }
 };
 const closeIframe = () => {
@@ -374,16 +370,16 @@ onMounted(() => {
   overflow: hidden;
   width: 100%;
   height: 100%;
-  max-width: 596px;
+
   background-size: cover;
   background-repeat: no-repeat;
   background-position: 50%;
   background-image: url("@/assets/img/home_bg.jpg");
   color: #fff;
-  margin: 0 auto;
+
   .title {
     text-align: center;
-    margin: 60px auto 1.4667rem;
+    margin: .8rem auto 1.4667rem;
     width: 8.2133rem;
     height: 2.0667rem;
     background: url("@/assets/img/home_title.svg") no-repeat;
@@ -535,13 +531,25 @@ onMounted(() => {
 .swiper-dom {
   width: 100%;
   /* margin-top: 10px; */
-  margin-bottom: 0.5333rem;
+  margin-bottom:15%;
   overflow: visible !important;
   padding: 0 40px;
 }
+
+@media screen and (min-width: 900px) {
+  .home {
+    max-width: 596px;
+    margin: 0 auto;
+    .title{
+      margin: 30px auto 55px;
+    }
+  }
+  .swiper-dom {
+    margin-bottom: 5%;
+  }
+}
 </style>
 <style>
-
 .swiper-wrapper {
   transition-timing-function: linear !important;
 }