|
|
|
@ -18,7 +18,7 @@ |
|
|
|
<!-- 轮播内容区域 --> |
|
|
|
<!-- 轮播内容区域 --> |
|
|
|
<div class="carousel-container"> |
|
|
|
<div class="carousel-container"> |
|
|
|
<!-- 轮播开关按钮 --> |
|
|
|
<!-- 轮播开关按钮 --> |
|
|
|
<div class="carousel-toggle" @click="toggleAutoPlay" :title="isAutoPlaying ? '停止轮播' : '开始轮播'"> |
|
|
|
<div class="carousel-toggle" @click="toggleAutoPlay" :title="isAutoPlaying ? '停止轮播' : '开始轮播'" style="display: none;"> |
|
|
|
<i :class="isAutoPlaying ? 'el-icon-video-pause' : 'el-icon-video-play'"></i> |
|
|
|
<i :class="isAutoPlaying ? 'el-icon-video-pause' : 'el-icon-video-play'"></i> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
@ -91,7 +91,7 @@ export default { |
|
|
|
// 轮播相关 |
|
|
|
// 轮播相关 |
|
|
|
currentPage: 0, // 当前页面索引 |
|
|
|
currentPage: 0, // 当前页面索引 |
|
|
|
transitionName: "slide-left", // 过渡动画名称 |
|
|
|
transitionName: "slide-left", // 过渡动画名称 |
|
|
|
isAutoPlaying: true, // 是否正在自动轮播 |
|
|
|
isAutoPlaying: false, // 是否正在自动轮播 |
|
|
|
isArrowHovered: false, // 是否悬停在箭头上 |
|
|
|
isArrowHovered: false, // 是否悬停在箭头上 |
|
|
|
autoPlayTimeout: null, // 存储暂停后的恢复定时器 |
|
|
|
autoPlayTimeout: null, // 存储暂停后的恢复定时器 |
|
|
|
autoPlayInterval: 10 * 60 * 1000, // 自动轮播间隔（毫秒） |
|
|
|
autoPlayInterval: 10 * 60 * 1000, // 自动轮播间隔（毫秒） |
|
|
|
|
