|
|
@@ -1,13 +1,15 @@
|
|
|
<template>
|
|
|
<uni-popup ref="popup" :mask-click="false" maskBackgroundColor="rgba(0, 0, 0, 0.6)">
|
|
|
- <view class="popup">
|
|
|
- <swiper ref="swiper" class="swiper" :current="swiperCurrent" @change="swiperChange"
|
|
|
- :indicator-dots="dataList.length > 1" indicator-active-color="rgba(46, 133, 236, 1)" :autoplay="false"
|
|
|
- :interval="5000">
|
|
|
- <swiper-item v-for="(item, index) in dataList" :key="index">
|
|
|
- <!-- 标题 + 图片 + 活动时间 + 活动简介 -->
|
|
|
- <view v-if="item.type == 1" class="swiper-item-view uni-column">
|
|
|
- <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
+ <swiper ref="swiper" class="swiper" :style="getSwiperStyle()" :current="swiperCurrent"
|
|
|
+ @change="swiperChange" :indicator-dots="dataList.length > 1" indicator-active-color="rgba(46, 133, 236, 1)"
|
|
|
+ :autoplay="false" :interval="5000">
|
|
|
+ <swiper-item v-for="(item, index) in dataList" :key="index">
|
|
|
+
|
|
|
+ <!-- 标题 + 图片 + 活动时间 + 活动简介 -->
|
|
|
+ <view v-if="item.type == 1" class="swiper-item-view uni-column">
|
|
|
+ <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
+
|
|
|
+ <view class="swiper-item-main uni-column uni-jcse">
|
|
|
<image mode="aspectFit" class="swiper-item-image" :src="item.data.img"></image>
|
|
|
<view class="swiper-item-time uni-row">
|
|
|
<image mode="aspectFit" class="clock" src="/static/default/clock.png"></image>
|
|
|
@@ -16,102 +18,174 @@
|
|
|
<view class="swiper-item-content uni-column">
|
|
|
<text class="introduce-content" v-html="item.data.content"></text>
|
|
|
</view>
|
|
|
- <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
- 续</button>
|
|
|
- <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
</view>
|
|
|
|
|
|
- <!-- 标题 + 图片 -->
|
|
|
- <view v-if="item.type == 2" class="swiper-item-view uni-column">
|
|
|
- <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
- <image mode="aspectFit" style="height: 474rpx; margin-bottom: 50rpx;" :src="item.data.img">
|
|
|
+ <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
+ 续</button>
|
|
|
+ <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 标题 + 图片 -->
|
|
|
+ <view v-if="item.type == 2" class="swiper-item-view uni-column">
|
|
|
+ <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
+
|
|
|
+ <view class="swiper-item-main uni-column">
|
|
|
+ <image mode="aspectFit" style="height: 237px; margin-top: 15px; margin-bottom: 25px;"
|
|
|
+ :src="item.data.img">
|
|
|
</image>
|
|
|
- <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
- 续</button>
|
|
|
- <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
</view>
|
|
|
|
|
|
- <!-- 标题 + 图片 + 活动简介 -->
|
|
|
- <view v-if="item.type == 3" class="swiper-item-view swiper-item-view-bg uni-column">
|
|
|
- <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
- <image mode="aspectFit" style="height: 280rpx; margin-top: 50rpx;" :src="item.data.img"></image>
|
|
|
+ <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
+ 续</button>
|
|
|
+ <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 【成就-奖牌】 标题 + 图片 + 活动简介 -->
|
|
|
+ <view v-if="item.type == 3" class="swiper-item-view swiper-item-view-bg uni-column">
|
|
|
+ <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
+
|
|
|
+ <view class="swiper-item-main uni-column uni-jcse">
|
|
|
+ <image mode="aspectFit" style="height: 140px; margin-top: 25px;" :src="item.data.img"></image>
|
|
|
<text class="swiper-item-content2" v-html="item.data.content"></text>
|
|
|
- <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
- 续</button>
|
|
|
- <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
</view>
|
|
|
|
|
|
- <!-- 标题 + 图片 + 二维码 -->
|
|
|
- <view v-if="item.type == 4" class="swiper-item-view swiper-item-view-bg2 uni-jct uni-column">
|
|
|
- <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
- <image mode="aspectFit" style="height: 220rpx; margin-top: 10rpx;" :src="item.data.img"></image>
|
|
|
- <text class="swiper-item-content3" v-html="item.data.content"></text>
|
|
|
- <text class="swiper-item-content4">【{{item.data.sourceName}}】</text>
|
|
|
+ <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
+ 续</button>
|
|
|
+ <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 【成就-兑换】 标题 + 图片 + 二维码 -->
|
|
|
+ <view v-if="item.type == 4" class="swiper-item-view swiper-item-view-bg2 uni-jct uni-column">
|
|
|
+ <view v-if="item.data.sponsorsLogo" class="sponsorsLogo" :style="getSponsorsLogoStyle(item.data.sponsorsLogo)"></view>
|
|
|
+ <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
+
|
|
|
+ <view class="swiper-item-main uni-column uni-jcse">
|
|
|
+ <view class="uni-column uni-jcse" style="height: 50px;">
|
|
|
+ <text class="swiper-item-content3" v-html="item.data.content"></text>
|
|
|
+ <text class="swiper-item-content4">【{{item.data.sourceName}}】</text>
|
|
|
+ </view>
|
|
|
+ <image class="swiper-item-image2" mode="aspectFit" :src="item.data.img"></image>
|
|
|
<template v-if="[1,3].includes(item.data.exState)">
|
|
|
- <view v-if="item.data.expireTime > 0" class="swiper-item-content4">( 有效期至 {{fmtTime(item.data.expireTime, 3)}}
|
|
|
- <span v-if="item.data.exState == 3" style="color: #ffaa00;">已临期</span>
|
|
|
- )</view>
|
|
|
- <uv-qrcode ref="qrcode" size="200rpx"
|
|
|
- :value="item.data.qrCode">
|
|
|
+ <!-- verfType: 兑换券展示类型 1 本系统核销 2 赞助商提供码核销 3 赞助商不提供码核销 -->
|
|
|
+ <uv-qrcode v-if="item.data.verfType==1" ref="qrcode" size="100px" :value="item.data.qrCode">
|
|
|
<!-- <template v-slot:loading>
|
|
|
- <text style="color: green;">loading...</text>
|
|
|
- </template> -->
|
|
|
+ <text style="color: green;">loading...</text>
|
|
|
+ </template> -->
|
|
|
</uv-qrcode>
|
|
|
+ <view v-if="item.data.verfType==2" class="swiper-item-couponNum">券码:{{item.data.otherSerCode}}</view>
|
|
|
+ <view v-if="item.data.expireTime > 0" class="swiper-item-content4" style="color: #ED0000;">( 有效期至
|
|
|
+ {{fmtTime(item.data.expireTime, 1)}}
|
|
|
+ <span v-if="item.data.exState == 3" style="color: #ffaa00; font-size: bold;">已临期</span>
|
|
|
+ )
|
|
|
+ </view>
|
|
|
+ <view v-if="item.data.cDesc.length > 0" class="swiper-item-desc" v-html="item.data.cDesc"></view>
|
|
|
</template>
|
|
|
- <view v-if="item.data.exState == 2" class="uni-column uni-jcse" style="height: 200rpx;">
|
|
|
+ <view v-if="item.data.exState == 2" class="uni-column uni-jcse" style="height: 100px;">
|
|
|
<text style="color: red;">已兑换</text>
|
|
|
<text class="swiper-item-content4">( 兑换时间 {{fmtTime(item.data.exTime, 3)}} )</text>
|
|
|
</view>
|
|
|
- <view v-if="item.data.exState == 4" class="uni-column uni-jcse" style="height: 200rpx;">
|
|
|
+ <view v-if="item.data.exState == 4" class="uni-column uni-jcse" style="height: 100px;">
|
|
|
<text style="color: red;">已过期</text>
|
|
|
- <text v-if="item.data.expireTime > 0" class="swiper-item-content4">( 过期时间 {{fmtTime(item.data.expireTime, 3)}} )</text>
|
|
|
+ <text v-if="item.data.expireTime > 0" class="swiper-item-content4">( 过期时间
|
|
|
+ {{fmtTime(item.data.expireTime, 1)}} )</text>
|
|
|
</view>
|
|
|
- <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
- 续</button>
|
|
|
- <button v-else class="swiper-item-button" @click="popupClose">关 闭</button>
|
|
|
</view>
|
|
|
-
|
|
|
- <!-- 标题 + 图片(点击图片打开地图APP进行地点定位) -->
|
|
|
- <view v-if="item.type == 5" class="swiper-item-view uni-column">
|
|
|
- <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
- <image mode="aspectFit" style="height: 474rpx; margin-bottom: 50rpx;" :src="item.data.img" @click="dealNavClick(item.data.point)">
|
|
|
+
|
|
|
+ <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
+ 续</button>
|
|
|
+ <button v-else class="swiper-item-button" @click="popupClose">关 闭</button>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 【兑换地点 - 单点】标题 + 图片(点击图片打开地图APP进行地点定位) -->
|
|
|
+ <view v-if="item.type == 5" class="swiper-item-view uni-column">
|
|
|
+ <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
+
|
|
|
+ <view class="swiper-item-main uni-column">
|
|
|
+ <image mode="aspectFit" style="height: 237px; margin-top: 15px; margin-bottom: 25px;"
|
|
|
+ :src="item.data.img" @click="dealNavClick(item.data.point)">
|
|
|
</image>
|
|
|
- <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
- 续</button>
|
|
|
- <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
</view>
|
|
|
|
|
|
- <!-- 通知 -->
|
|
|
- <view v-if="item.type == 6" class="swiper-item-view uni-column">
|
|
|
- <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
+ <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
+ 续</button>
|
|
|
+ <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 通知 -->
|
|
|
+ <view v-if="item.type == 6" class="swiper-item-view uni-column">
|
|
|
+ <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
+
|
|
|
+ <view class="swiper-item-main uni-column uni-jcse">
|
|
|
<!-- mqType 消息类型 2:卡片图片 3:卡片文字 -->
|
|
|
- <image v-if="item.data.mqType == 2" mode="aspectFit" style="height: 474rpx; margin-bottom: 50rpx;" :src="item.data.message">
|
|
|
+ <image v-if="item.data.mqType == 2" mode="aspectFit"
|
|
|
+ style="height: 237px; margin-bottom: 25px;" :src="item.data.message">
|
|
|
</image>
|
|
|
- <text v-if="item.data.mqType == 3" class="swiper-item-message" v-html="item.data.message"></text>
|
|
|
- <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
- 续</button>
|
|
|
- <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
+ <text v-if="item.data.mqType == 3" class="swiper-item-message"
|
|
|
+ v-html="item.data.message"></text>
|
|
|
</view>
|
|
|
-
|
|
|
- <!-- 标题 + HTML内容 + 图片(可为空) -->
|
|
|
- <view v-if="item.type == 7" class="swiper-item-view uni-column">
|
|
|
- <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
+
|
|
|
+ <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
+ 续</button>
|
|
|
+ <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 标题 + HTML内容 + 图片(可为空) -->
|
|
|
+ <view v-if="item.type == 7" class="swiper-item-view uni-column">
|
|
|
+ <image v-if="item.data.topLogo" class="swiper-item-topLogo"
|
|
|
+ :style="getImageStyle(item.data.topLogo)" mode="aspectFit" :src="item.data.topLogo.src"></image>
|
|
|
+ <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
+
|
|
|
+ <view class="swiper-item-main uni-column uni-jcse">
|
|
|
<view class="swiper-item-content5">
|
|
|
- <text v-html="item.data.content"></text>
|
|
|
+ <view v-if="item.data.content" v-html="item.data.content"></view>
|
|
|
<view class="uni-row uni-jcse" style="margin-top: 20px;">
|
|
|
<image v-for="(item, index) in item.data.imageList" :key="index" mode="aspectFit"
|
|
|
:style="getImageStyle(item)" :src="item.src"></image>
|
|
|
</view>
|
|
|
+ <view v-if="item.data.memo" style="padding-top: 10px;" v-html="item.data.memo"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <image v-if="item.data.bottomLogo" class="swiper-item-bottomLogo" mode="aspectFit"
|
|
|
+ :style="getImageStyle(item.data.bottomLogo)" :src="item.data.bottomLogo.src"></image>
|
|
|
+
|
|
|
+ <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
+ 续</button>
|
|
|
+ <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 【兑换地点 - 多点】标题 + 头部图片 + 头部memo + 多点导航列表 + 底部memo -->
|
|
|
+ <view v-if="item.type == 8" class="swiper-item-view uni-column">
|
|
|
+ <text class="swiper-item-title" v-html="item.data.title"></text>
|
|
|
+ <image v-if="item.data.topImg" class="" :style="getImageStyle(item.data.topImg)" mode="aspectFit" :src="item.data.topImg.src"></image>
|
|
|
+ <view v-if="item.data.topMemo" v-html="item.data.topMemo"></view>
|
|
|
+
|
|
|
+ <view class="swiper-item-main uni-column uni-jcse">
|
|
|
+ <view class="swiper-item-content5">
|
|
|
+ <view v-if="item.data.content" v-html="item.data.content"></view>
|
|
|
+ <view class="uni-column uni-jcse" style="margin-top: 20px;">
|
|
|
+ <view class="uni-row uni-jcsb" style="width: 96%; line-height: 30px;" v-for="(point, index) in item.data.pointList" :key="index">
|
|
|
+ <view class="uni-row uni-jct" style="width: 80%;">
|
|
|
+ <!-- <text v-if="point.map" class="nowrap" v-html="point.map + ':'"></text> -->
|
|
|
+ <text v-if="point.name" class="nowrap" v-html="point.map ? (point.map + ':' + point.name) : point.name"></text>
|
|
|
+ </view>
|
|
|
+ <view class="uni-row uni-jcsa" style="width: 20%;" @click="dealNavClick(point)">
|
|
|
+ <image mode="aspectFit" style="width: 10px; height: 15px;" src="/static/common/nav2.png"></image>
|
|
|
+ <text class="" style="color: #E60012; font-size: 14px;" >导航</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-if="item.data.bottomMemo" style="padding-top: 10px;" v-html="item.data.bottomMemo" @click="dealUrlClick(item.data.bottomMemoUrl)"></view>
|
|
|
</view>
|
|
|
-
|
|
|
- <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
- 续</button>
|
|
|
- <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
</view>
|
|
|
|
|
|
- </swiper-item>
|
|
|
- </swiper>
|
|
|
- </view>
|
|
|
+ <button v-if="index < dataList.length - 1" class="swiper-item-button" @click="swiperNext">继
|
|
|
+ 续</button>
|
|
|
+ <button v-else class="swiper-item-button" @click="popupClose">确 定</button>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </swiper-item>
|
|
|
+ </swiper>
|
|
|
</uni-popup>
|
|
|
</template>
|
|
|
|
|
|
@@ -129,6 +203,12 @@
|
|
|
teamType: {
|
|
|
type: Number,
|
|
|
default: -1
|
|
|
+ },
|
|
|
+ config: {
|
|
|
+ type: Object,
|
|
|
+ default: () => ({
|
|
|
+ height: ""
|
|
|
+ })
|
|
|
}
|
|
|
},
|
|
|
data() {
|
|
|
@@ -139,10 +219,18 @@
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
+ getSwiperStyle() {
|
|
|
+ let styleStr = "";
|
|
|
+ if (this.config.height != undefined && this.config.height != "") {
|
|
|
+ styleStr += `height: ${this.config.height};`;
|
|
|
+ console.log("[getSwiperStyle] style:", styleStr);
|
|
|
+ }
|
|
|
+ return styleStr;
|
|
|
+ },
|
|
|
//当前轮播索引
|
|
|
swiperChange(e) {
|
|
|
const curIndex = e.detail.current;
|
|
|
- // console.log("swiperChange", curIndex, this.swiperCurrent)
|
|
|
+ // console.log("swiperChange", curIndex, this.swiperCurrent);
|
|
|
this.swiperCurrent = curIndex;
|
|
|
},
|
|
|
swiperNext() {
|
|
|
@@ -172,13 +260,21 @@
|
|
|
// window.location.href = url;
|
|
|
tools.appAction(url);
|
|
|
},
|
|
|
+ dealUrlClick(url) {
|
|
|
+ if (url != undefined && url.length > 0) {
|
|
|
+ tools.appAction(url);
|
|
|
+ }
|
|
|
+ },
|
|
|
getImageStyle(item) {
|
|
|
let styleStr = "";
|
|
|
- const width = item.width ?? "180rpx";
|
|
|
- const height = item.height ?? "180rpx";
|
|
|
+ const width = item.width ?? "90px";
|
|
|
+ const height = item.height ?? "90px";
|
|
|
styleStr = `width: ${width}; height: ${height};`;
|
|
|
return styleStr;
|
|
|
},
|
|
|
+ getSponsorsLogoStyle(bgurl) {
|
|
|
+ return `background-image: url("${bgurl}")`;
|
|
|
+ },
|
|
|
// getTeamName(teamType, teamIndex) {
|
|
|
// return teamName[teamType][teamIndex];
|
|
|
// },
|
|
|
@@ -191,157 +287,205 @@
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .acttime {
|
|
|
- font-weight: 550;
|
|
|
- color: #333333;
|
|
|
- font-size: 30rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .clock {
|
|
|
- width: 30rpx;
|
|
|
- height: 30rpx;
|
|
|
- margin-right: 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .introduce-content {
|
|
|
- color: #333333;
|
|
|
- font-size: 25rpx;
|
|
|
- line-height: 36rpx;
|
|
|
- }
|
|
|
|
|
|
- .popup {
|
|
|
+ .swiper {
|
|
|
width: 90vw;
|
|
|
- // height: 720rpx;
|
|
|
- height: 920rpx;
|
|
|
+ height: 439px;
|
|
|
background-color: #FEFBF6;
|
|
|
- border-radius: 50rpx;
|
|
|
+ border-radius: 25px;
|
|
|
}
|
|
|
|
|
|
- .swiper {
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
-
|
|
|
- // .swiper-item {
|
|
|
- // justify-content: space-between;
|
|
|
- // /* background-color: lightblue; */
|
|
|
+ // ::v-deep uni-swiper-item {
|
|
|
+ // overflow: auto;
|
|
|
// }
|
|
|
|
|
|
.swiper-item-view {
|
|
|
- height: 100%;
|
|
|
- justify-content: space-between;
|
|
|
+ height: 95%;
|
|
|
+ padding-top: 25px;
|
|
|
+ // justify-content: space-between;
|
|
|
}
|
|
|
|
|
|
.swiper-item-view-bg {
|
|
|
background-image: url("/static/backgroud/top_colorbar.png"), url("/static/backgroud/oval.png");
|
|
|
background-repeat: no-repeat;
|
|
|
background-position-x: center;
|
|
|
- background-position-y: 150rpx, 380rpx;
|
|
|
+ background-position-y: 75px, 190px;
|
|
|
background-size: 80%, 70%;
|
|
|
}
|
|
|
|
|
|
.swiper-item-view-bg2 {
|
|
|
- background-image: url("/static/backgroud/oval.png");
|
|
|
- background-repeat: no-repeat;
|
|
|
- background-position-x: center;
|
|
|
- background-position-y: 276rpx;
|
|
|
- background-size: 66%;
|
|
|
+ // background-image: url("/static/backgroud/oval.png");
|
|
|
+ // background-repeat: no-repeat;
|
|
|
+ // background-position-x: center;
|
|
|
+ // background-position-y: 198px;
|
|
|
+ // background-size: 66%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .swiper-item-topLogo {
|
|
|
+ width: 100px;
|
|
|
+ height: 100px;
|
|
|
+ margin-bottom: 18px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .swiper-item-bottomLogo {
|
|
|
+ width: 100px;
|
|
|
+ height: 100px;
|
|
|
+ margin-bottom: 30px;
|
|
|
}
|
|
|
|
|
|
.swiper-item-title {
|
|
|
- margin-top: 60rpx;
|
|
|
- margin-bottom: 20rpx;
|
|
|
- font-size: 40rpx;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ font-size: 20px;
|
|
|
font-weight: 550;
|
|
|
}
|
|
|
|
|
|
+ .swiper-item-main {
|
|
|
+ width: 100%;
|
|
|
+ flex-grow: 1;
|
|
|
+ }
|
|
|
+
|
|
|
.swiper-item-image {
|
|
|
- height: 300rpx;
|
|
|
+ height: 150px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .swiper-item-image2 {
|
|
|
+ height: 110px;
|
|
|
+ // margin-top: 5px;
|
|
|
}
|
|
|
|
|
|
.swiper-item-time {
|
|
|
- height: 65rpx;
|
|
|
- margin-top: 20rpx;
|
|
|
- padding: 0 50rpx;
|
|
|
+ height: 33px;
|
|
|
+ margin-top: 10px;
|
|
|
+ padding: 0 25px;
|
|
|
justify-content: space-evenly;
|
|
|
background-color: white;
|
|
|
border: 0.5px solid;
|
|
|
border-color: #e7e7e7;
|
|
|
- border-radius: 40rpx;
|
|
|
+ border-radius: 20px;
|
|
|
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.13);
|
|
|
}
|
|
|
|
|
|
.swiper-item-content {
|
|
|
width: 80%;
|
|
|
- /* height: 100rpx; */
|
|
|
- margin-top: 30rpx;
|
|
|
- margin-bottom: 60rpx;
|
|
|
+ margin-top: 15px;
|
|
|
+ margin-bottom: 30px;
|
|
|
justify-content: start;
|
|
|
+ flex-grow: 1;
|
|
|
}
|
|
|
|
|
|
.swiper-item-content2 {
|
|
|
width: 80%;
|
|
|
- /* height: 100rpx; */
|
|
|
- margin-top: 30rpx;
|
|
|
- margin-bottom: 20rpx;
|
|
|
+ margin-top: 60px;
|
|
|
+ margin-bottom: 10px;
|
|
|
// justify-content: center;
|
|
|
text-align: center;
|
|
|
- font-size: 28rpx;
|
|
|
- line-height: 80rpx;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 40px;
|
|
|
+ flex-grow: 1;
|
|
|
}
|
|
|
|
|
|
.swiper-item-content3 {
|
|
|
width: 80%;
|
|
|
- margin-top: 10rpx;
|
|
|
+ // margin-top: 5px;
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
.swiper-item-content4 {
|
|
|
// width: 80%;
|
|
|
- // margin-top: 10rpx;
|
|
|
text-align: center;
|
|
|
- font-size: 24rpx;
|
|
|
+ font-size: 12px;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.swiper-item-content5 {
|
|
|
width: 80%;
|
|
|
- margin-top: 30rpx;
|
|
|
- margin-bottom: 20rpx;
|
|
|
flex-grow: 1;
|
|
|
- font-size: 26rpx;
|
|
|
- line-height: 46rpx;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 21px;
|
|
|
+ overflow-y: scroll;
|
|
|
}
|
|
|
|
|
|
- ::v-deep li {
|
|
|
- margin-bottom: 10rpx;
|
|
|
+ .swiper-item-couponNum {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #383838;
|
|
|
+ }
|
|
|
+
|
|
|
+ .swiper-item-desc {
|
|
|
+ width: 80%;
|
|
|
+ font-size: 12px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #818181;
|
|
|
}
|
|
|
|
|
|
+ ::v-deep li {
|
|
|
+ margin-bottom: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
.swiper-item-message {
|
|
|
width: 80%;
|
|
|
- /* height: 100rpx; */
|
|
|
- margin-top: 20rpx;
|
|
|
- margin-bottom: 20rpx;
|
|
|
+ margin-top: 10px;
|
|
|
+ margin-bottom: 10px;
|
|
|
// justify-content: center;
|
|
|
text-align: left;
|
|
|
- font-size: 28rpx;
|
|
|
- // line-height: 80rpx;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 21px;
|
|
|
flex-grow: 1;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.swiper-item-button {
|
|
|
width: 80%;
|
|
|
- height: 76rpx;
|
|
|
- margin-bottom: 50rpx;
|
|
|
+ height: 38px;
|
|
|
+ margin-bottom: 25px;
|
|
|
color: #ffffff;
|
|
|
/* font-weight: bold; */
|
|
|
- line-height: 76rpx;
|
|
|
+ line-height: 38px;
|
|
|
background-color: #2e85ec;
|
|
|
border-radius: 27px;
|
|
|
}
|
|
|
|
|
|
- ::v-deep .uni-swiper-dots-horizontal {
|
|
|
- bottom: 155rpx;
|
|
|
+ .acttime {
|
|
|
+ font-weight: 550;
|
|
|
+ color: #333333;
|
|
|
+ font-size: 15px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .clock {
|
|
|
+ width: 15px;
|
|
|
+ height: 15px;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .introduce-content {
|
|
|
+ color: #333333;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 21px;
|
|
|
+ flex-grow: 1;
|
|
|
+ }
|
|
|
+
|
|
|
+ .nowrap {
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
}
|
|
|
|
|
|
+ .sponsorsLogo {
|
|
|
+ position: absolute;
|
|
|
+ width: 120px;
|
|
|
+ // width: 75px;
|
|
|
+ height: 75px;
|
|
|
+ left: 18px;
|
|
|
+ top: 8px;
|
|
|
+ background-position-x: left;
|
|
|
+ background-position-y: center;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ // background-size: 100% auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ ::v-deep .uni-swiper-dots-horizontal {
|
|
|
+ bottom: 75px;
|
|
|
+ }
|
|
|
+
|
|
|
// ::v-deep .uni-swiper-dot-active {
|
|
|
// background: #ff870e !important;
|
|
|
// }
|