tire_parts_shop_applets/pages/tabBar/activity/index.vue

<template>
	<view class="widthBox">
		<view class="cardBox" v-for="item in data" :key="item.id" @click.stop="jumpDetails(item)">
			<view class="cardBox-img">
				<image style="width: 100%;height: 100%;" :src="item.url" mode=""></image>
			</view>
			<view class="cardBox-text">
				<view class="cardBox-textTitle">{{item.activityName}}</view>
				<view class="cardBox-textText">
					<u--text :lines="2" :text="item.activityDescription"></u--text>
				</view>
			</view>
		</view>
		<u-empty v-if="data.length == 0" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" />
		<u-loadmore v-if="page.total !== 0 && data.length != 0" :status="status" />
	</view>
</template>

<script>
	import {
		activityList
	} from '@/api/tabBar/activity.js'
	import {
		shoppingCartList
	} from '@/api/tabBar/shoppingCart.js'
	export default {
		data() {
			return {
				page: {
					current: 1,
					size: 10,
					total: 0,
				},
				data: [],
				status: 'loadmore',
			}
		},
		onLoad() {
			// this.activityListfun()
		},
		onShow() {
			shoppingCartList().then(res => {
			let num=0
			res.data.forEach(e=>{
				console.log(e.list)
				num=num+e.list.length
			})
			uni.setTabBarBadge({
				index: 3, // tabIndex，tabBar的哪一项，从0开始
				text: num.toString()// 显示的文本，超过 99 显示成 “…”
			})
			})
			this.data = [];
			this.page.current = 1;
			size: this.page.size = 10;
			this.activityListfun()
		},
		onReachBottom() {
			this.status = 'loading'
			if (this.data.length < this.page.total) {
				this.page.current++
				this.activityListfun()
			} else {
				this.status = 'nomore'
			}
		},
		methods: {
			// 跳转详情
			jumpDetails(row) {
				uni.navigateTo({
					url: '/pages/tabBar/activity/details?id=' + row.id
				})
			},
			// 获取列表数据
			activityListfun() {
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				activityList({
					current: this.page.current,
					size: this.page.size,
					status: 1
				}).then(res => {
					this.data = this.data.concat(res.data.records)
					this.page.total = res.data.total
					if (this.data.length == res.data.total) {
						this.status = 'nomore'
					}
					uni.setTabBarBadge({
						index: 2, // tabIndex，tabBar的哪一项，从0开始
						text: res.data.total.toString() // 显示的文本，超过 99 显示成 “…”
					})
					uni.hideLoading();
				}).catch(err => {
					uni.hideLoading();
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.widthBox {
		width: 94%;
		margin: 20rpx auto;
	}

	.cardBox {
		background: #fff;
		border-radius: 10rpx;
		padding: 20rpx;
		box-sizing: border-box;
		display: flex;

		.cardBox-img {
			flex: 1;
			width: 200rpx;
			height: 180rpx;
		}

		.cardBox-text {
			flex: 2;
			margin-left: 10rpx;

			.cardBox-textTitle {
				font-size: 36rpx;
				font-weight: bold;
				margin-bottom: 10rpx;
			}

			.cardBox-textText {
				font-size: 30rpx;
				color: #8b8b8b;
			}
		}
	}
</style>