refactor: 优化YlSwiper组件样式和功能

1. 统一颜色值为小写十六进制格式
2. 调整代码格式和缩进
3. 优化分页指示器样式
4. 移除未使用的导航配置
This commit is contained in:
Huangzhe
2025-05-22 20:18:51 +08:00
parent 9c66f5f32f
commit 59b9f258a3

View File

@@ -165,6 +165,7 @@ defineExpose({
</slot>
</div>
<!-- :navigation="navigationConfig" -->
<swiper-container
ref="swiperRef"
:slides-per-view="slidesPerView"
@@ -174,7 +175,6 @@ defineExpose({
:loop="loop"
:autoplay="autoplayConfig"
:pagination="paginationConfig"
:navigation="navigationConfig"
:breakpoints="breakpoints"
:allow-touch-move="allowTouchMove"
@swiperprogress="onProgress"
@@ -206,7 +206,9 @@ defineExpose({
<div v-if="pagination" class="yl-swiper-pagination">
<slot name="pagination">
<div
v-for="(_, index) in slides && slides.length ? slides : (swiperInstance?.value?.slides || [])"
v-for="(_, index) in slides && slides.length
? slides
: swiperInstance?.value?.slides || []"
:key="index"
class="yl-swiper-pagination-bullet"
:class="{ 'is-active': swiperInstance?.value?.activeIndex === index }"
@@ -253,7 +255,7 @@ defineExpose({
align-items: center;
justify-content: center;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
color: #409EFF;
color: #409eff;
}
.yl-swiper-pagination {
@@ -276,7 +278,7 @@ defineExpose({
transition: all 0.3s;
&.is-active {
background-color: #409EFF;
background-color: #409eff;
width: 16px;
border-radius: 4px;
}