family/education_uni/subpkg/complaintManage/complaintManage.vue

<template>
	<!--pages/suggestList/suggestList.wxml-->
	<view>
	    <!-- 建议列表 -->
	    <view class="suggestContainer">
	        <view class="suggest" @click="toSuggestDetail(item)" v-for="(item, index) in currentList" :key="item">
	            <view class="suggestion">
	                <view class="suggestHead">
	                    <view>标题</view>
	                    <view class="suggestTitle">{{item.complaintTitle}}</view>
	                </view>
	                <view class="suggestBody">
	                    <view>日期</view>
	                    <view class="suggestContent">{{item.fistDatetime}}</view>
	                </view>
	            </view>
	            <view>
	                <view class="dispose">{{item.status}}</view>
	            </view>
	       
			</view>
	    </view>
	   
	</view>
</template>

<script>
	export default {
		data() {
			return {
				complaint: [],
				obj: {
					pageSize: 6,
					pageNum: 1
				},
				total: 0,
				currentList: []
			};
		},
		
		onPullDownRefresh() {
			this.obj.pageNum = 1;
			this.init();
			uni.stopPullDownRefresh();
		},
		
		onReachBottom() {
			// 判断是否有下一页的数据
			if (this.obj.pageNum * this.obj.pageSize >= this.total){
				uni.$showMsg('已经是最后一页数据了!')
			}
			else{
				
				this.obj.pageNum += 1
				setTimeout(() => {
					this.init()
				}, 1000)
							
			}
			
		},
		
		onShow(){
			this.obj.pageNum = 1;
			this.init();
		},
		
		methods:{
			async init(){
				
				const { data: result } =await uni.$http.get('/education/my-complaint/findAllComplaint',this.obj)
				
				this.complaint = result.data.data;
				
				this.total = result.data.count;
				
				if(this.obj.pageNum==1){
					this.currentList = this.complaint;
				}
				else{
					
					for(var item of this.complaint) 
					{
						this.currentList.push(item);
					}
					
				}
				
			},
			
			// 点击建议列表，跳转到对应的建议详情页
				
			toSuggestDetail(item){
				let complaint = JSON.stringify(item)
				uni.navigateTo({
					url: '/subpkg/allcomplaintDetail/allcomplaintDetail?item=' + complaint
				})
			}
		}
	}
</script>
<style lang="scss"scoped>
	/* pages/suggestList/suggestList.wxss */
	
	/* 页面背景 */
	page{
	    /* height: 100%; */
	    /* height: auto !important; */
	    background-color: #E2F0D9;
	}
	
	/* 建议列表区 */
	.suggestContainer{
	    height: 100%;
	    padding-bottom: 120rpx;
	}
	
	/* 单条建议的背景 */
	.suggest{
	    display: flex;
	    padding: 20rpx;
	    margin: 20rpx 10rpx;
	    height: 140rpx;
	    border-radius: 30rpx;
	    background-color: #FFF2CC;
	}
	
	/* 单条建议左侧标题和内容摘要 */
	.suggestion{
	    width: 75%;
	}
	
	/* 标题和内容摘要布局 */
	.suggestHead,
	.suggestBody{
	    display: flex;
	}
	
	/* 摘要 */
	.suggestBody{
	    margin-top: 10rpx;
	}
	
	/* 标题详情和内容详情左边距 */
	.suggestTitle,
	.suggestContent{
	    margin-left: 20rpx;
	}
	
	/* 标题内容详情 */
	.suggestTitle{
	    width: 65%;
	    white-space: nowrap;
	    overflow: hidden;
	    text-overflow: ellipsis;
	}
	
	/* 内容摘要详情 */
	.suggestContent{
	    width: 80%;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    display: -webkit-box;
	    -webkit-box-orient: vertical;
	    -webkit-line-clamp: 2;
	}
	
	/* 处理状态 */
	.dispose{
	    font-weight: bold;
	    color: red;
	    margin-left: 30rpx;
	}
	
	/* 写建议按钮 */
	.toWriteSuggestion{
	    display: flex;
	    position: relative;
	    justify-content: center;
	}
	.writeSuggestion{
	    text-align: center;    
	    position: fixed;
	    bottom: 0rpx;
	    width: 100%;
	    height: 120rpx;
	    line-height: 120rpx;
	    background-color: #E2F0D9;
	}
	.writeSuggestion text{
	    background-color: #8FAADC;
	    font-size: 36rpx;
	    color: white;
	    border-radius: 30rpx;
	    padding: 10rpx 20rpx;
	}
</style>