market-app-ui/pages/market/two/purchaser/order/cart.vue

<template>
	<view>
		<view class="goodsList animated fadeInDown">
			<view class="item" v-for="(item, index) in list" :key="index">
				<view class="title" @click.stop="selected(item)">
					<text class="icon" v-if="item.check" style="color: #4581fb">&#xe631;</text>
					<text class="icon" v-else>&#xe60c;</text>
					<text>{{ item.createName }}</text>
				</view>
				<view class="state" @click.stop="del(item)"><text class="icon del">&#xe852;</text></view>
				<image src="../../../../../static/news.jpg" mode="aspectFill" class="pic"></image>
				<view class="con">
					<view class="productName omit">{{ item.goodsName }}</view>
					<view class="desc omit">
						<text>{{ item.tradeAreaName }}</text>
					</view>
					<view class="price">¥ {{ item.resalePrice }}</view>
				</view>
				<view class="clear"></view>
				<view class="op">
					<view class="date">{{ item.createTime }}</view>
					<view class="an btn" @click.stop="buy(item)">立即购买</view>
				</view>
			</view>
			<u-empty v-if="list.length == 0"></u-empty>
		</view>
		<view class="mfooter" v-if="selects.length > 0">
			<view class="flex">
				<view class="f">
					<button class="btn" @click="buy({})">立即购买（{{ selects.length }}）</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: [],
			selects: []
		};
	},
	onLoad() {
		this.getData();
	},
	methods: {
		getData() {
			this.http.request({
				url: '/level-two-server/app/TbOrdersCart/getList',
				data: this.param,
				success: res => {
					this.list = res.data.data || [];
				}
			});
		},
		selected(item) {
			item.check = !item.check;
			this.$forceUpdate();
			this.selects = this.list.filter(item => item.check);
		},
		// 立即购买
		buy(item) {
			if (item.orderId) {
				uni.navigateTo({
					url: '/pages/market/two/purchaser/buy/buy?orderId=' + item.orderId
				});
			} else {
				uni.navigateTo({
					url: '/pages/market/two/purchaser/buy/buy?orderId=' + this.selects.map(item => item.orderId)
				});
			}
		},
		del(item) {
			let ids = item.id || this.list.map(i => i.id);
			uni.showModal({
				title: '提示',
				content: item.id ? '确定删除该购物车？' : '清空所有购物车',
				success: res => {
					if (res.confirm) {
						this.http.request({
							url: '/level-two-server/app/TbOrdersCart/deleteByIds/' + ids,
							success: res => {
								uni.showToast({ title: '删除成功' });
								this.getData();
							}
						});
					}
				}
			});
		}
	},
	onNavigationBarButtonTap() {
		this.del({});
	}
};
</script>

<style lang="scss">
page {
	background-color: $pg;
}
.title {
	.icon {
		color: $font-c;
		padding-right: 5px;
	}
}
.an {
	padding: 6px 15px;
	font-size: 14px;
	margin-top: 0px !important;
	font-weight: normal !important;
}
.mfooter {
	background-color: #ffffff00;
	border: 0px;
}
</style>