tcwm-uniapp-shop/my/yhq/yhq.vue

<template>
	<view>
		<view class="list flex justify-center flex-wrap">
			<view class="list-box flex justify-center flex-wrap" v-for="(item,index) in couponList" :key="index">
				<view class="yhq-box-list-item" >
					<view class="yhq-box-list-item-t flex align-center justify-between" style="border-bottom: 1px dashed #e5e5e5;padding-bottom: 26rpx;">
						<view class="yhq-box-list-item-t-l flex align-center">
							<image :src="item.couponPicture?item.couponPicture:'../../static/logo.png'" style="width: 120rpx;height: 120rpx;border-radius: 16rpx;" mode=""></image>
							<view class="" style="margin-left: 20rpx;">
								<view class="" style="font-weight: bold;">
									<text>{{item.couponName}}</text>（满{{item.minMoney}}元使用）
								</view>
								<view class="" style="color: gray;font-size: 24rpx;margin-top: 10rpx;">
									购买后{{item.endDate}}天内使用
								</view>
							</view>
						</view>
						<view class="yhq-box-list-item-t-r" style="font-size: 32rpx;color: red;">
							<text style="font-size: 24rpx;font-weight: bold;">¥</text>
							{{item.money}}
						</view>
					</view>
					<view class="yhq-box-list-item-b flex justify-end align-center" style="margin-top: 26rpx;">
						<view class="" @click="updata(1,item)" style="padding: 5rpx 20rpx 5rpx 20rpx;border-radius: 24rpx;border: 1rpx solid gray;color: gray;">
							编辑
						</view>
						<view class="" @click="updata(2,item)" style="padding: 5rpx 20rpx 5rpx 20rpx;border-radius: 24rpx;border: 1rpx solid red;color: red;margin-left: 20rpx;">
							删除
						</view>
					</view>
				</view>
			</view>
			<u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" />
		</view>
		




		<!-- 添加优惠券 -->
		<view class="button flex justify-center align-center">
			<view class="button-box flex justify-center align-center" @click="gotoAdd()">
				添加优惠券
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				couponList: [],
				couponLists: [],
				limit: 10,
				page: 1,
				status: 'loadmore',
				iconType: 'flower',
				loadText: {
					loadmore: '轻轻上拉',
					loading: '努力加载中',
					nomore: '实在没有了'
				},
			};
		},
		onPullDownRefresh() {
			this.page = 1
			this.getList()
		},
		onReachBottom() {
			if(this.couponLists.length==10){
				this.page += 1
				this.status = 'loading'
				this.getList()
			}else{
				this.status = 'nomore'
			}
		},
		onShow() {
			this.page = 1
			this.getList()
		},
		onLoad() {
			this.getList()
		},
		methods: {
			//1:编辑 2：删除
			updata(type,item){
				if(type==1){
					uni.navigateTo({
						url:'./edit?info='+JSON.stringify(item)
					})
				}else{
					let that = this
					uni.showModal({
						title:'提示',
						content:'是否删除该优惠券？',
						complete(ret) {
							if(ret.confirm){
								let data = {
									couponId:item.couponId
								}
								that.$Request.postT("/admin/coupon/deleteCoupon", data).then(res => {
									if (res.code == 0) {
										uni.showToast({
											title:'已删除'
										})
										that.page = 1
										that.getList()
									}else{
										uni.showToast({
											title:res.msg,
											icon:'none'
										})
									}
								});
							}
						}
					})
					
				}
			},
			//添加优惠券
			gotoAdd(){
				uni.navigateTo({
					url:'./add'
				})
			},
			//优惠券列表
			getList() {
				let data = {
					shopId: uni.getStorageSync('shopId')
				}
				this.$Request.get("/admin/coupon/seleteAllCoupon", data).then(res => {
					if (res.code == 0) {
						this.couponLists = res.data
						if (this.page == 1) {
							this.couponList = res.data
						} else {
							this.couponList = [...this.couponList, ...res.data]
						}
					}
					uni.stopPullDownRefresh()
				});
			}
		}
	}
</script>

<style lang="scss">
	.list {
		width: 100%;
		// height: 500rpx;
		margin-top: 20rpx;
		padding-bottom: 200rpx;
		.list-box {
			width: 686rpx;
			height: 100%;
			border-radius: 16rpx;
			background-color: #ffffff;
			margin-bottom: 20rpx;
			
			.yhq-box-list-item {
				width: 646rpx;
				// background-color: red;
				padding: 20rpx 0 20rpx 0;
				
			}
		}
	}

	.button {
		width: 100%;
		height: 140rpx;
		background-color: rgb(241, 241, 241);
		position: fixed;
		bottom: 0;
		z-index: 999;
		.button-box {
			width: 686rpx;
			height: 80rpx;
			background-color: #FCD202;
			border-radius: 40rpx;
		}
	}
</style>