zh_order_food_xcx/pages-takeout/group-goods.vue

<template>
	<view class="flex-common-css iPhone-bottom  box-border-box seckill-box">
		<Nav title="优质团购" bgckgroundBox='transparent' leftColor='#fff' titleColor='#fff'></Nav>
		<scroll-view :scroll-y="true" class="scroll-view-css p-24 box-border-box" @scrolltolower="scrolltolower">
			<view class="b-rad-20 bgc-f mb-10 p-24 box-border-box align-items-flex-start"
				v-for="(item,index) in goodsData" :key="index" @click="goToUrl(item)">
				<image class="goods-img flex-shrink0 mr-20 b-rad-12" :src="item.cover_img" mode="aspectFill"></image>
				<view class="flex-1 right-h flex-direction flex-justify-space">
					<view class="">
						<view class="fs-30 fw-600 fc-0 mb-10 text-overflow-ellipsis">
							{{item.title}}
						</view>
						<view class="align-items-center">
							<uni-icons type="shop" size="15" color="#666" class="mr-4"></uni-icons>
							<view class="fs-26 fc-6">
								{{item.shop_name}}
							</view>
						</view>
					</view>
					<view class="item-but align-items-center flex-justify-space bgc-FDF3EC box-border-box b-rad-20">
						<view class="align-items-center">
							<view class="fs-28 fw-600 fc-F43D04 mr-14">
								￥ <text class="fs-30 fw-600 fc-F43D04">{{Number(item.seckill_money).toFixed(2)}}</text>
							</view>
							<view class="fs-22 fc-F43D04">
								已省{{(Number(item.line_price).toFixed(2) - Number(item.seckill_money).toFixed(2)).toFixed(2)}}
							</view>
						</view>
						<view class="fs-28 fc-f msq-but plr-24 box-border-box bgc-F5811E b-rad-20">
							马上抢
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import {
		seckillAllGroup
	} from "@/api/seckill.js"
	export default {
		components: {},
		data() {
			return {
				goodsData: [],
				page: 1,
				total: 0
			};
		},
		onLoad(data) {},
		mounted() {
			this.seckillAllGroup()
		},
		methods: {
			goToUrl(item) {
				uni.navigateTo({
					url: '/pages-buy/group-goods-info?shop_id=' + item.shop_id + '&goods_id=' +
						item.goods_id +
						'&shop_name=' + item.shop_name
				})
			},
			scrolltolower() {
				if (this.total > this.goodsData.length) {
					++this.page
					this.scrolltolower()
				}
			},
			seckillAllGroup() {
				seckillAllGroup({
					page: this.page
				}).then((res) => {
					if (res.code === 1) {
						this.goodsData.push(...res.data.items)
						this.total = res.data.total
					}
				})
			}
		},
	}
</script>

<style lang="scss" scoped>
	.seckill-box {
		background: linear-gradient(to bottom, #FF3D19, #F5F5F5, #F5F5F5);
	}

	.goods-img {
		width: 200rpx;
		height: 200rpx;
	}

	.right-h {
		height: 200rpx;
	}

	.item-but {
		width: 100%;
		height: 70rpx;
		line-height: 70rpx;
		padding: 0 0 0 24rpx;
	}
</style>