Update swiper component formatting and structure

pages/down-drawe-detail/components/swiper.vue

@@ -1,5 +1,7 @@
 <template>
-  <div class="box-border h-[631px] w-[1019px] border border-[#EEEEEE] rounded-[12px] border-solid bg-[#FFFFFF] pa-[30px]">
+  <div
+    class="box-border h-[631px] w-[1019px] border border-[#EEEEEE] rounded-[12px] border-solid bg-[#FFFFFF] pa-[30px]"
+  >
     <ClientOnly>
       <swiper
         :style="{
@@ -14,19 +16,25 @@
         @swiper="onSwiper"
         @slide-change="changeSwiper"
       >
-        <swiper-slide v-for="(item, index) in props.data" :key="index"><el-image fit="cover" :src="item.url" /></swiper-slide>
+        <swiper-slide v-for="(item, index) in props.data" :key="index"
+          ><el-image fit="cover" :src="item.url"
+        /></swiper-slide>
         <div class="swiper-button-prev color-[#fff]" @click="handlePrev"></div
         ><!--左箭头。如果放置在swiper外面，需要自定义样式。-->
         <div class="swiper-button-next color-[#fff]" @click="handleNext"></div
         ><!--右箭头。如果放置在swiper外面，需要自定义样式。-->
       </swiper>
-  </ClientOnly>
+    </ClientOnly>
   </div>
   <div class="mb-[20px] mt-[34px] flex items-center text-[16px] text-[#333333] font-normal">
     <div class="h-[24px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div
-    ><span class="ml-[10px]">{{ props.type === 1 ? '图纸' : props.type === 2 ? '文本' : '模型' }}</span></div
+    ><span class="ml-[10px]">{{
+      props.type === 1 ? '图纸' : props.type === 2 ? '文本' : '模型'
+    }}</span></div
+  >
+  <div
+    class="box-border h-[126px] w-[1019px] border border-[#EEEEEE] rounded-[6px] border-solid bg-[#FFFFFF] pa-[23px]"
   >
-  <div class="box-border h-[126px] w-[1019px] border border-[#EEEEEE] rounded-[6px] border-solid bg-[#FFFFFF] pa-[23px]">
     <ClientOnly>
       <swiper
         :space-between="10"
@@ -43,13 +51,12 @@
           </div>
         </swiper-slide>
       </swiper>
-  </ClientOnly>
+    </ClientOnly>
   </div>
 </template>
 <script setup lang="ts">
-  import type { PropType} from 'vue'
+  import type { PropType } from 'vue'
   import { ref, watch, nextTick } from 'vue'
-  // @ts-ignore
   import { Swiper, SwiperSlide } from 'swiper/vue'
 
   import 'swiper/css'
@@ -59,7 +66,6 @@
   import 'swiper/css/thumbs'
 
   // import required modules
-  // @ts-ignore
   import { FreeMode, Navigation, Thumbs } from 'swiper/modules'
 
   const modules = [FreeMode, Navigation, Thumbs]