DigitalScholl/Learun.Framework.Ultimate V7/LearunApp-2.2.0/pages/TeacherWorkload/list.vue

<template>
	<view class="page">
		<view class="mainpage" :class="sideOpen ? 'show' : ''" style="padding-top: 40px;">
			<!-- <l-customlist-banner></l-customlist-banner> -->
			<view class="records">共 {{ records }} 条数据</view>
			<l-scroll-list v-if="ready" @pullDown="pullDown" @toBottom="fetchList()" ref="data">
				<l-customlist :tips="loadState" showTips>
					<view></view>
					<view class="pageBox customlist-item" showDelete="true" v-for="(item, ind) in data" :key="item.ALTId">
						<view class="">
							<text>课程:</text> 
							{{ item.LessonName }}【{{ item.LessonNo }}】
						</view>
						<view class="">
							<text>总课时:</text> 
							{{ item.lessoncount }}
						</view>
						<view class="">
							<text>系数:</text> 
							{{ item.coefficient }}
						</view>
						<view class="">
							<text>工作量:</text> 
							{{ item.lessoncount }}
						</view>
					</view>
				</l-customlist>
			</l-scroll-list>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			user: null,
			data: [],
			total: 1,
			records: 0,
			ready: false,
			page: 1,
			rows: 10,
			multipleData: null,
			sideOpen: false,
			loadState: '向下翻以加载更多'
		};
	},
	methods: {
		init() {
			// 拉取加载列表和数据源
			Promise.all([() => {}]);
			var _this = this;
			this.user = this.GET_GLOBAL('loginUser');
			this.fetchList();
			this.ready = true;
		},
		// 拉取列表
		async fetchList() {
			if (this.page > this.total) {
				return;
			}
			let _this = this;
			let _postParam = {
				pagination: {
					rows: _this.rows,
					page: _this.page,
					sidx: 'LessonNo',
					sord: 'asc'
				},
				queryJson: '{}'
			};
			_this.LOADING('加载数据中…')
			_this.HTTP_GET('learun/EducationalAdministration/TeacherWorkload/pagelist', _postParam, '加载数据时出错').then(res => {
				_this.HIDE_LOADING();
				// console.log(res);
				this.data = this.data.concat(res.rows);
				_this.total = res.total;
				_this.records = res.records;
				this.page = res.page + 1;
				this.loadState = res.page >= res.total ? '已加载所有项目' : '向下翻以加载更多';
				console.log(_this.data);
			});
		},
		// 列表下拉
		pullDown() {
			this.refreshList().then(() => {
				this.$refs.data.stopPullDown();
			});
		},
		async refreshList() {
			this.page = 1;
			this.total = 1;
			this.data = [];

			this.fetchList();
		}
	},
	created() {
		this.init();
	}
};
</script>

<style lang="less" scoped>
@import '~@/common/css/sidepage.less';
@import '~@/common/css/customlist.less';
.page {
	background-color: #fff;
}
.page-content {
	margin-top: 39px;
}
.records {
	color: #8f8f94;
	background: #ffffff;
	padding: 10px 12px;
	width: 100%;
	vertical-align: middle;
	border-bottom: 0.5px solid #ddd;
	position: fixed;
	top: var(--window-top);
	z-index: 1024;
	border-bottom: 0.5px solid #ddd;
	height: 40px;
	width: 100%;
	box-shadow: 0 0.5px 3px rgba(0, 0, 0, 0.1);
	// background: #f1f1f1;
}
.pageBox {
	// margin-top: 34px;
	padding: 5px 15px;
	line-height: 24px;
	border-bottom: 5px solid #f5f5f5;
	color: #333;
}
.pageBox text{
	margin-right: 5px;
}
</style>