yjryu / KERIS star
kimgkdud898 2023-11-16
231116김하영 스와이퍼
@e7d0a4c8beccb2439519a1c3a7e1ae2530a4927e
5d42f12
e7d0a4c
client/views/pages/user/main/Main.vue
--- client/views/pages/user/main/Main.vue
+++ client/views/pages/user/main/Main.vue
@@ -10,10 +10,11 @@
 
                             <!-- 공지사항 배너 -->
 
                             <div class="main-notice">
 
                                 <h2> <i class="fa-solid fa-volume-high" style="color: #ffffff;"></i>공지사항</h2>
 
-                                <swiper :direction="'vertical'" :loop="true" :spaceBetween="8" :slidesPerView="1"
 
-                                    :centeredSlides="false" :navigation="false" :modules="modules"
 
-                                    class="mySwiper swiper-notice" :autoplay="{
 
-                                        delay: 2500,
 
+                                <swiper :direction="'vertical'" :pagination="{
 
+                                    clickable: true,
 
+                                }" :loop="true" :spaceBetween="8" :slidesPerView="1" :centeredSlides="false"
 
+                                    :navigation="false" :modules="modules" class="mySwiper swiper-notice" :autoplay="{
 
+                                        delay: 1000,
 
                                         disableOnInteraction: false,
 
                                     }">
@@ -363,9 +364,19 @@
 
             },
 
             noticeList: [],
 
             noticeListForBanner: [],
 
+            swiper: null,
 
         }
 
     },
 
     methods: {
 
+        initSwiper() {
 
+            this.swiper = new Swiper(this.$refs.swiperContainer, {
 
+                // Swiper 옵션 설정
 
+                pagination: {
 
+                    el: '.swiper-pagination',
 
+                },
 
+            });
 
+            console.log("2:::::::");
 
+        },
 
         showAlert: function () {
 
             alert('페이지 준비중입니다.');
 
         },
@@ -431,6 +442,7 @@
 
                 },
 
             }).then(function (response) {
 
                 vm.noticeListForBanner = response.data;
 
+                console.log("1:::::::");
 
 
             }).catch(function (error) {
 
                 alert('배너 공지사항 목록 조회 오류, 관리자에게 문의하세요.');
@@ -482,6 +494,7 @@
 
         this.postSelectList();
 
         this.noticeListForMain();
 
         this.noticeBannerListForMain();
 
+        this.initSwiper();
 
 
     }
 
 }
Add a comment
List