payy-app/views/warning/index.vue

<template>
	<view>
		<roll-load @lower="lower"
			:total="queryConditions.total" 
			:size="queryConditions.limit" 
			:topBt='top' ref="roll-load" styles="height:100vh" key="checkRord">
			<template v-slot:cont>
				<block></block>
				<!-- :key='item.alertId' -->
				<uni-list>
					<uni-list-item class="list-item" 
						v-for="(item,index) in dataList" 
						:key='index'
						:title="item.alertTitle" 
						:note="item.alertTime" 
						@click="inspection(item)" clickable showArrow>
						<!-- 自定义 body -->
						<view slot="body" class="uni-padding-wrap uni-common-mt">
							<text class="slot-box slot-text">{{item.riskPointTitle}}</text>
							<view>当前处理人员：{{item.taskInsAccountName}}</view>
							<view>发生时间：{{item.alertTime}}</view>
							<view>描述：{{item.alertDesc}}</view>
						</view>
						<view slot="footer" class="unilist_footer_tag">
							<template>
								<uni-tag :text="item.status|filterStatus" 
										 :type="item.status|filterButtonType" 
										 size="small" inverted />
							</template>
						</view>
					</uni-list-item>
				</uni-list>
			</template>
		</roll-load>
	</view>
</template>
<script>
	import RollLoad from '@/components/RollLoad/index.vue';	
	import { deepClone } from '@/libs';
	import { alertStatus } from '@/libs/enum';
	import { getAlertByPage } from '@/api/warning';	
	export default {
		components: {
			RollLoad
		},
		filters:{
			filterStatus(value){
				return alertStatus(value);
			},
			filterButtonType(value){
				let type=['default','warning','success','error'];
				let color="default";
				if(value >= 0){
					color=type[value]
				}
				return color;
			}
		},
		data() {
			return {
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
				top: {
					show: true,
					style: "top:95%"
				},
				pageNumber: 1,
				items: [],
				dataList: [],
				queryConditions: {
					page: 1,
					limit: 10,
					total: 0,
					keywords: ''
				}
			}
		},
		onShow() {
			this.getList();
			console.log("wraning----onShow")
		},
		methods: {
			lower: function(e) {
				if (e.status) {
					this.queryConditions.page = e.pageNumber
					this.getList(this.queryConditions);
				}
			},
			scroll: function(e) {
				this.old.scrollTop = e.detail.scrollTop
			},
			goTop: function(e) {
				this.scrollTop = this.old.scrollTop
				this.$nextTick(() => {
					this.scrollTop = 0
				});
				uni.showToast({
					icon: "none",
					title: "已经到顶了！"
				})
			},
			getList() {
				getAlertByPage(this.queryConditions).then((res) => {
					try{
						let items =[...this.dataList];
						let dataList=items.concat(res.data);
						this.dataList=dataList;
						this.$set(this.queryConditions, 'total', res.total)					
					}catch(err){
						console.log(JSON.stringify(err))
					}

				})
			},
			inspection(item){
				uni.setStorageSync('warnInfo',item);
				uni.navigateTo({
					url:'/views/warning/detail/detail'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.slot-image {
		height: 35upx;
	}
	.list-item{
		position: relative;
		.unilist_footer_tag {
			position: absolute;
			right: 20upx;
			top: 50%;
			transform: translateY(-50%);
		}	
	}
</style>