JP-ChargeTeam51/pages/index/activity.vue

<template>
	<view>
			<ujp-navbar title="优惠活动" :is-back="false" ></ujp-navbar>
			<view class="background">
				<view class="banner" v-for="(item,i) in bannerList"
				
				 :key="i">
						<u-image width="100%" @click="clickBanner(i)"
						 mode="scaleToFill"  height="250" border-radius	="12"
						 :src="item.picUrl"></u-image>
						 <view  class="tag"
						 
						 v-if="item.isMain">
							 <img src="@/assets/img/buy/tip.png">
						 </view>

				</view>
				<u-divider  bg-color="#F2F4F4" >已经到底了</u-divider>
				
			</view>
			
			<Tabbar :current="1" ref="tabbarMain" ></Tabbar>
			
	</view>
</template>

<script>
	import Tabbar from '@/components/Tabbar.vue';
	import * as newsApi from '@/apis/news.js'
	
	export default {
		data() {
			return {
					bannerList: [],
			}
		},
		components: {
			Tabbar
		},
		onShow() {
		
			if (this.$refs.tabbarMain) {
				this.$refs.tabbarMain.setcount(1);
			}
		
		},onLoad() {
			this.getBannerInfo("homepage");
		},
		
		methods: {
			getBannerInfo(code) {
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				newsApi.getBannerInfo(code).then((res) => {
					this.bannerList = res.data;
					uni.hideLoading()
					//document.getElementsByClassName("uni-swiper-wrapper")[0].parentNode.style="background-color: rgb(255, 255, 255); height: 120px;"
				}).catch(error => {
					uni.showToast({
			
						title: error,
						icon: "none"
					})
				})
			},
			clickBannerTopI(i) {
				var mod = this.bannerListTop[i];
				//this.showTop = false;
				this.clickBanner(0, true, mod)
			},
			clickBannerTop() {
				var mod = this.bannerListTop[this.showTopIndex];
				this.showTop = false;
				this.clickBanner(0, true, mod)
			},
			clickBanner(index, bl, modout) {
				var uurl = "";
				var mod = this.bannerList[index]
				if (modout) {
					mod = modout;
				}
				mod.clickUrl = mod.linkUrl
			
				if (mod.linkPicUrl && !bl) {
			
					this.showOss = true;
					this.showOssImg = mod.linkPicUrl;
					this.showOssIndex = index;
			
				} else if (mod.clickUrl == null) {
			
				} else if (mod.clickUrl.indexOf('http') == 0) {
			
					window.location = mod.clickUrl + uurl;
				} else if (mod.clickUrl.slice(-5) == 'login' && this.userId) {
			
				} else if (mod.clickUrl.indexOf('#/') == 0) {
					if (mod.clickUrl.indexOf("?") == -1) {
						mod.clickUrl += '?';
					}
					var url = mod.clickUrl.split("#")[1]
					//window.location = mod.clickUrl;
					uni.navigateTo({
						url: url + uurl
					})
				} else if (mod.clickUrl == '#' || mod.clickUrl == '') {
			
				} else {
					uni.navigateTo({
						url: mod.clickUrl + uurl
					})
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.tag {
		
		
		top: -100rpx;
		left: 460rpx;
		position: relative;
		border-radius: 4px 4px 4px 0px;
		color: #fff;
		padding: 2px 6px;
		font-size: 20rpx;
		line-height: 20rpx;
		height: 10rpx;
		//background: linear-gradient(to right bottom, rgba(255, 255, 255, 0.4), transparent) var(--bg, #EA3447);
		background-blend-mode: soft-light;
		img{
			height: 74rpx;
			width: 240rpx;
		}
	}
	
	.background{
		padding-bottom: 30px;
	}
	.banner{
		margin: 24rpx;
		
	}
</style>