DigitalScholl/Learun.Framework.Ultimate V7/LearunApp-2.2.0/pages/EducationalAdministration/OpenLessonPlanOfElectiveStudent/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 class="pageBox customlist-item" showDelete="true" v-for="(item, ind) in data" :key="item.MakeDate" @click="tapClick(item)">
						<view class="">
							<text>学年:</text>
							{{ item.AcademicYearNo }}
						</view>
						<view class="">
							<text>学期:</text>
							{{ item.Semester }}
						</view>
						<view class="">
							<text>课程名称:</text>
							{{ item.LessonName }}
						</view>
						<view class="">
							<text>上课节次:</text>
							{{ jieci(item.LessonSection) }}
						</view>
						<view class="">
							<text>上课时间:</text>
							{{ item.LessonTime }}
						</view>
						<view class="">
							<text>学分:</text>
							{{ item.StudyScore }}
						</view>
						<view class="">
							<text>教师姓名:</text>
							{{ item.EmpName }}
						</view>
						<view class="">
							<text>教室名称:</text>
							{{ item.ClassRoomNo }}
						</view>
						<view class="">
							<text>人数上限:</text>
							{{ item.StuNumMax }}
						</view>
						<view class="">
							<text>已报名人数:</text>
							{{ item.StuNumOfApplyPre }}
						</view>
						<view class="pageType">{{ typePd(item.StatusPre) }}</view>
						<view class="delbtn" @click.stop="delTap(item)">取消报名</view>
					</view>
				</l-customlist>
			</l-scroll-list>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			weekChina: ['一', '二', '三', '四', '五', '六', '日'],
			user: null,
			data: [],
			total: 1,
			records: 0,
			ready: false,
			page: 1,
			rows: 10,
			multipleData: null,
			sideOpen: false,
			loadState: '向下翻以加载更多'
		};
	},
	onUnload() {
		this.OFF('OpenLessonPlanOfElectiveStudent');
	},
	methods: {
		init() {
			this.ON('OpenLessonPlanOfElectiveStudent', this.refreshList);
			// 拉取加载列表和数据源
			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: '{}'
			};
			if (true) {
				_postParam.queryJson = JSON.stringify({
					StuNo: _this.user.account,
					StuMajorNo: _this.user.majorno,
					StuGrade: _this.user.grade
				});
			}
			// console.log(_this.user)
			_this.LOADING('加载数据中…')
			_this.HTTP_GET('learun/EducationalAdministration/OpenLessonPlanOfElectiveStudent/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();
		},
		tapClick(data) {
			this.NAV_TO('./from', data.Id, true);
		},
		delTap (item) {
			// console.log(item)
			let _this = this;
			this.CONFIRM('数字化校园提示', '确定要取消报名吗？', true).then( res => {
				if(res){
					let _postData = {
						keyValue: item.Id,
						StuNo: _this.user.account
					}
					_this.LOADING('正在取消报名…')
					_this.HTTP_POST(
					  'learun/EducationalAdministration/OpenLessonPlanOfElectiveStudent/Cancel',
					  _postData,
					  '加载数据时出错'
					).then( data => { 
						_this.HIDE_LOADING()
						console.log(data)
						if (data) {// 成功
						    this.TOAST('取消报名成功！');
						    this.refreshList()
						}
					})
				}
			})
		}
	},
	computed: {
		jieci() {
			return str => {
				let ls = '';
				if (str.indexOf(',') == -1) ls = '星期' + this.weekChina[str.slice(0, 1) - 1] + '第' + str.slice(1) + '节';
				else ls = '星期' + this.weekChina[str.slice(0, 1) - 1] + '第' + str.slice(1, 2) + '、' + str.slice(4) + '节';

				return ls;
			};
		},
		typePd() {
			return num => {
				let txt = '';
				if (num == 1) {
					txt = '审核中';
				} else if (num == 2) {
					txt = '报名成功';
				} else if (num == 3) {
					txt = '报名失败';
				} else {
					txt = '未报名';
				}
				return txt;
			};
		}
	},
	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;
}
.delbtn {
	position: absolute;
	right: 15px;
	bottom: 7px;
	padding: 3px 10px;
	background: #dd524d;
	color: #fff;
	border-radius: 3px;
}
</style>