From dd2922d3facbfba5add501f35de5649b80b6cf05 Mon Sep 17 00:00:00 2001
From: 陶杰 <1378534974@qq.com>
Date: 星期二, 10 九月 2024 18:22:53 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/v2' into v2
---
components/banner3d/banner3d.vue | 45 ++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 44 insertions(+), 1 deletions(-)
diff --git a/components/banner3d/banner3d.vue b/components/banner3d/banner3d.vue
index 4e2b8df..7b4773a 100644
--- a/components/banner3d/banner3d.vue
+++ b/components/banner3d/banner3d.vue
@@ -5,6 +5,7 @@
:autoplay="swiperConfig.autoplay" :interval="swiperConfig.interval" :duration="swiperConfig.duration"
:circular="swiperConfig.circular" :previous-margin="swiperConfig.previousMargin"
:next-margin="swiperConfig.nextMargin" @change="swiperChange" @animationfinish="animationfinish">
+
<swiper-item v-for="(item, i) in bannerList" :key="i">
<!-- 1.当前展示为第1项时，bannerList最后一项和第二项的justifyContent值分别为flex-end和flex-start，其余项值为center -->
<!-- 2.当前展示为最后一项时，bannerList倒数第2项和第1项的justifyContent值分别为flex-end和flex-start，其余项值为center -->
@@ -15,7 +16,12 @@
transitionDuration: '.3s',
transitionTimingFunction: 'ease'
}" :class="[curIndex===0?((i===listLen-1)?'item-left':(i===1?'item-right':'item-center')):(curIndex===listLen-1?(i===0?'item-right':(i===listLen-2?'item-left':'item-center')):(i===curIndex-1?'item-left':(i===curIndex+1?'item-right':'item-center')))]">
- <image :src="item.bg" class="slide-image" />
+ <image :src="item.bg" class="slide-image">
+
+ </image>
+ <view v-if="item.currentMsg" class="top-msg" :class="[`v${i+1}`]">
+ {{item.currentMsg}}
+ </view>
<image :src="item.picture" class="icon-image" :class="[`v${i+1}`]" mode="aspectFit"></image>
<view class="container" :class="[`v${i+1}`]">
<view class="title">{{bannerList[i].title}}</view>
@@ -133,6 +139,43 @@
z-index: 200;
position: relative;
z-index: 0;
+
+ }
+
+ .top-msg {
+ position: absolute;
+ top: 31px;
+ left: 45rpx;
+ background-color: #9DBEDF;
+ padding: 8rpx 14rpx;
+ color: #fff;
+ border-top-left-radius: 8rpx;
+ border-bottom-right-radius: 8rpx;
+ text-align: center;
+ line-height: 48rpx;
+ min-width: 132rpx;
+ z-index: 1;
+ font-size: 24rpx;
+ display: block;
+ }
+
+ .top-msg.v1 {
+ background-color: #B6D6AF;
+
+ }
+
+ .top-msg.v2 {
+ background-color: #9DBEDF;
+
+ }
+
+ .top-msg.v3 {
+ background-color: #BF9653;
+
+ }
+
+ .top-msg.v4 {
+ background-color: #F1A582;
}
.icon-image {
--
Gitblit v1.9.3