ec.uniapp-master/pages/bargain/list/list.vue

<template>
	<view id="container">   
	    <view class="body_box">
	       <view v-if="list && list.length && list[0] && list[0].length">
	       	<view class="bargain_body" v-for="(items,index) in list" :key="index">
	       	<view v-for="(item,idx) in items" :key="item.id" style="margin-bottom: 10px;background-color: #FFFFFF; width: 100%;">
	       	     <view class="bargain_goods">
	       	        <view class="goods_left">
	       	            <image :src="item.reduce.goods.img" mode="widthFix" />
	       	        </view>
	       	        <view class="goods_right">
	       	            <view class="goods_name">{{item.reduce.goods.name}}</view>
	       	            <view class="number">剩余{{item.reduce.store_nums}}砍价名额</view>
	       	            <view class="past_price">原价 ￥<span>{{item.reduce.goods.max_price}}</span></view>
	       	            <view class="right_foot">
	       	                <view class="new_price">
	       	                    砍后价￥{{item.reduce.price}}
	       	                </view>
	       	                <view class="btn" @tap="toDetail" :data-reduce-id="item.id"  v-if="item.status_text=='进行中'">
	       	                    查看详情
	       	                </view>
	       	                <view class="btn_other" @tap="toDetail" :data-reduce-id="item.id" v-else>
	       	                    查看详情
	       	                </view>
	       	            </view>
	       	        </view>
	       	    </view>
	       	</view>
	       	
	       	</view>
	       </view>
		   <view v-if="list && list.length == 0 && list[0] && list[0].length == 0 && init" style="text-align: center;padding: 20px; font-size: 14px;">
			   您暂无砍价哟~
		   </view>
	    </view>
	</view>
	
	
</template>

<script>
	export default{
		data(){
			return{
				list:[],
				page:'',
				more:'',
				reduce_items_id:'',
				init:''
				
			}
		},
		onLoad(){
			this.getReduceList(1);
		},
		onShow(){
			
		},
		//下拉刷新
		    onReachBottom(){
		        if(this.more){
		            let page = this.page + 1;
		            this.getReduceList(page);
		        } else {
		            wx.showToast({
		                image: '../../../static/error.png',
		                title: '再拉也没有啦'
		            });
		        }
		    },
		methods:{
			toDetail(e){
			        this.reduce_items_id = e.currentTarget.dataset.reduceId;
			        wx.navigateTo({
			            url: `/pages/bargain/detail/detail?reduce_items_id=${this.reduce_items_id}`
			        })
			    },
			// 获取页面列表数据
			getReduceList(page) {
				wx.showLoading({
					title: "加载中",
					mask: true
				});
				var token = this.$cookieStorage.get('user_token');
				this.$http.get({
					api: 'api/reduce/list/me',
					header:{
						Authorization:token
						},
					data: {
						page:page
					}
					
				}).then(res => {
					res = res.data;
					if (res.status) {
						let pages = res.meta.pagination;
						let current_page = pages.current_page;
						let total_pages = pages.total_pages;
						this.setData({
							[`list.${page-1}`]: res.data,
							more: current_page < total_pages,
							page: current_page,
							init:true
						})
					} else {
						wx.showModal({
							content: res.message || '请求失败',
							showCancel: false
						})
					}
					wx.hideLoading()
				}).catch(rej => {
					wx.hideLoading()
					wx.showModal({
						content: rej.message || '请求失败',
						showCancel: false
					})
				})
			
			},
			setData: function(obj) {
				let that = this;
				let keys = [];
				let val, data;
				Object.keys(obj).forEach(function(key) {
					keys = key.split('.');
					val = obj[key];
					data = that.$data;
					keys.forEach(function(key2, index) {
						if (index + 1 == keys.length) {
							that.$set(data, key2, val);
						} else {
							if (!data[key2]) {
								that.$set(data, key2, {});
							}
						}
			
						data = data[key2];
					});
				});
			}
		}
	}
</script>

<style rel="stylesheet/less" lang="less">
	@import "list";
</style>