zhongmianzixun.vue 2.2 KB
<template>
	<view class="contaniner">
		 <view class="list">
		    <view class="listitem flex" v-for="(item,index) in zixunlist" :key="index" @click="zixundetail(item.id)" >
				<view class="listright" >
				  <image :src="item.image" mode=""></image>
				</view>
		      <view class="listleft">
		        <view class="top commontwo">{{item.name}}</view>
		        <view class="leftbottom flexone">
		          <view class="botleft">{{item.author}}</view>
		          <view class="botright">{{item.publishtime}}</view>
		        </view>
		      </view>
		    </view>
		  </view>
	</view>
</template>
<script>
import app from "../../App.vue";
	export default {
		data() {
			return {
				page:1,
				zixunlist:[],
				showpull:false
			}
		},
		
		onLoad() {
			this.getzixunlist()
			
		},
		methods: {
			// 获取中面咨讯
			getzixunlist() {
				let that = this;
				var url = 'article/get_list';
				var params = {
					page:that.page,
				}
				
				app.post(url, params, "post").then((res) => {
					console.log(res);
					that.zixunlist=that.zixunlist.concat(res.data.data)
					if(that.page>1){
						if(res.data.data.length==0){
							that.showpull=true
						}
					}
					
				}).catch((err) => {
					console.log(err)

				})
			},
			//选择优惠券
			zixundetail(id){
				uni.navigateTo({
					url:"/pages/luntan/zhongmianzixundetail?zixunid="+id
				})
			},
			surecoupon(){
				uni.navigateBack({
					checked:true
				})
			}
		},
		onReachBottom() {
			let newpage=this.page;
			newpage++;
			this.page=newpage;
			if(this.showpull==false){
				this.getzixunlist()
			}
			
			
		}
	}
</script>

<style>
	.list{
		padding: 0 32rpx;
		box-sizing: border-box;
	}
	.listitem {
	  padding: 36rpx 0;
	  box-sizing: border-box;
	  border-bottom: 1rpx solid #f5f5f5;
	}
	.listleft{
		margin-left: 32rpx;
		
	}
	.listright {
	width: 218rpx;
	height: 156rpx;
	font-size: 0;
	
	}
	.listright image{
		width:100%;
		height:100%
	}
	.top {
	font-size: 32rpx;
	font-weight: bold;
	width: 436rpx;
	
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	
	}
	.botleft {
		color: #C29445;
		font-size: 24rpx;

}
.botright {
	color: #8c9198;
	font-size: 24rpx;
	margin-left: 24rpx;

}
.leftbottom{
	margin-top:20rpx
}





</style>