protection-applets/pagesHandle/historyList.vue

<template>
	<view class="content">
		<u-navbar back-text="返回" title="历史记录" back-icon-color="#ffffff" :back-text-style="{color: '#ffffff'}" title-color="#ffffff"
		 :background="{backgroundColor: mainColor}"></u-navbar>
		<scroll-view scroll-y class="scroll-box" @scrolltolower="handleLoadMore" :refresher-enabled="true"
		 :refresher-triggered="triggered" :refresher-threshold="100" refresher-background="white" @refresherrefresh="onRefresh"
		 @refresherrestore="onRestore">
			<u-cell-group>
				<u-cell-item :title="'《安全隐患整改建议书》' + item.completeTime" :title-style="titleStyle" v-for="(item, index) in tableList"
				 :key="index" @click="goToRectifyInfo(item)">
					<view :style="item.signState == 2 ? '' : valueStyle" style="font-size: 12px;">{{item.signState == 2 ? '已签阅' : '未签阅'}}</view>
					<view>{{item.signDate}}</view>
				</u-cell-item>
			</u-cell-group>
			<u-divider v-if="isOver" bg-color="transparent" margin-top="20">没有更多了</u-divider>
		</scroll-view>
		<u-top-tips ref="uTips" :navbar-height="statusBarHeight + navbarHeight"></u-top-tips>
	</view>
</template>

<script>
	import {
		mapGetters
	} from 'vuex'
	const NET = require('@/utils/request')
	const API = require('@/config/api')
	export default {
		computed: {
			...mapGetters([
				'mainColor',
				'handleDefaultCustomStyle',
			])
		},
		data() {
			return {
				statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
				navbarHeight: 44,
				form: {
					tenantId: '',
					assetId: '',
				},
				titleStyle: {
					fontSize: '14px',
					flex: 3,
				},
				valueStyle: {
					color: '#fa3534'
				},
				triggered: false,
				isOver: false,
				pageIndex: 1,
				tableList: [],
			}
		},
		onLoad(options) {
			this.form.tenantId = options.tenantId
			this.form.assetId = options.assetId
			this.getTableList()
		},
		onReady() {},
		methods: {
			//  下拉刷新
			onRefresh() {
				this.triggered = true
				this.isOver = false
				this.pageIndex = 1
				this.tableList = []
				this.getTableList()
			},
			//  重置下拉刷新状态
			onRestore() {
				this.triggered = 'restore'
				this.triggered = false
			},
			//  懒加载
			handleLoadMore() {
				if (!this.isOver) {
					this.pageIndex++
					this.getTableList()
				}
			},
			//  获取列表数据
			getTableList() {
				NET.request(API.getHistoryList, {
					...this.form,
					pageIndex: this.pageIndex,
					pageSize: 10,
				}, 'GET').then(res => {
					this.triggered = false
					this.tableList = this.tableList.concat(res.data.records)
					this.isOver = res.data.records.length != 10
				}).catch(error => {
					this.triggered = false
					this.$refs.uTips.show({
						title: error.message,
						type: 'warning',
					})
				})
			},
			//  跳转隐患整改清单
			goToRectifyInfo(item) {
				uni.navigateTo({
					url: '/pagesHandle/rectifyInfo?taskId=' + item.taskId + '&tenantId=' + this.form.tenantId + '&assetId=' + this.form
						.assetId + '&signState=' + item.signState
				});
			},
		},
	}
</script>

<style>
	page {
		width: 100%;
		height: 100%;
		background-color: #f7f7f7;
	}
</style>
<style lang="scss" scoped>
	@import "@/static/css/themes.scss";

	.content {
		width: 100%;
		float: left;

		.scroll-box {
			width: 100%;
			height: 100vh;
			padding-bottom: 10px;
			box-sizing: border-box;
		}
	}
</style>