移动端V1.0

pages/dormitory/plan.vue

@@ -0,0 +1,171 @@
+<template>
+	<view class="award">
+		<scroll-view scroll-y="true" @scrolltolower="scrolltolower">
+			<view class="awardList">
+				<view class="List" v-for="(item,index) in awardList" :key="item.index">
+					<view class="awardListleft">
+						<text class="title">任务类型: {{item.taskType == "1" ? "调宿申请" : "退宿申请"}}</text>
+						<text>姓名：{{item.stuName}}</text>
+						<text>学号：{{item.stuNo}}</text>
+						<text class="home">旧宿舍：{{item.oldDorm}}</text>
+						<text class="home">新宿舍：{{item.newDorm}}</text>
+						<text class="home">预执行时间：{{item.taskWant}}</text>
+						<text class="home">任务状态：<uni-tag :inverted="true" :text="getStatus(item.taskStatus)"
+								type="success" /></text>
+					</view>
+				</view>
+			</view>
+			<view class="empty" v-if="awardList.length==0&&topLoading==false">
+				<image src="@/static/empty.png" mode="widthFix"></image>
+				暂时没有数据
+			</view>
+			<view class="loading-more-top" v-if="topLoading">
+				<uni-load-more style="padding-top: 90px;" status="loading" />
+			</view>
+			<view class="loading-more" v-if="loading">
+				<uni-load-more status="loading" />
+			</view>
+			<view class="no-more" v-if="!loading&&awardList.length!=0">
+				到底啦~~
+			</view>
+		</scroll-view>
+	</view>
+</template>
+
+<script>
+	import {
+		listOwnTask,
+		getTaskStatus
+	} from "@/api/dms/index.js";
+
+	export default {
+		data() {
+			return {
+				awardList: [],
+				task_status_list: [],
+				loading: false,
+				topLoading: true,
+				queryParams: {
+					pageNum: 1,
+					pageSize: 10
+				},
+			}
+		},
+		async onShow() {
+			await this.getTaskStatus();
+			await this.listOwnTask();
+		},
+		methods: {
+			scrolltolower() {
+				if (this.queryParams.pageNum < this.totalPages) {
+					this.queryParams.pageNum++;
+					this.loading = true;
+					setTimeout(() => {
+						this.listOwnTask()
+					}, 1000)
+				} else {}
+			},
+			async getTaskStatus() {
+				let res = await getTaskStatus();
+				if (res.code == 200) {
+					this.task_status_list = [...res.data]
+				}
+			},
+			getStatus(status) {
+				let data = this.task_status_list.filter(x => x.dictValue == status.toString());
+				if (data != null && data.length != 0) {
+					return data[0].dictLabel;
+				} else {
+					return "无";
+				}
+			},
+			async listOwnTask() {
+				let res = await listOwnTask(this.queryParams);
+				if (res.code == 200) {
+					this.loading = false;
+					if (this.queryParams.pageNum == 1) {
+						this.awardList = res.data;
+					} else {
+						this.awardList = this.awardList.concat(res.data); // 否则追加新数据到列表中
+					}
+					this.totalPages = Math.ceil(res.total / this.queryParams.pageSize);
+					this.topLoading = false;
+				}
+			}
+		}
+	}
+</script>
+<style lang="less" scoped>
+	.award {
+		width: 100%;
+		min-height: 100vh;
+		background-color: #F5F5F7;
+
+		scroll-view {
+			height: calc(100vh - 45px);
+
+			.no-more {
+				text-align: center;
+				color: gray;
+				padding-bottom: 10px;
+			}
+
+			.empty {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				margin-top: 200rpx;
+				color: #9E9E9E;
+				font-size: 36rpx;
+
+				image {
+					width: 250rpx;
+					margin-bottom: 50rpx;
+				}
+			}
+		}
+
+		.awardList {
+			width: 100%;
+			margin-top: 20rpx;
+			display: flex;
+			align-items: center;
+			flex-direction: column;
+
+			.List {
+				// align-items: center;
+				display: flex;
+				justify-content: space-between;
+				width: 90%;
+				background-color: white;
+				border-radius: 10rpx;
+				padding: 40rpx 30rpx 30rpx 30rpx;
+				margin-bottom: 30rpx;
+
+				.awardListleft {
+					display: flex;
+					flex-direction: column;
+
+					.title {
+						font-size: 40rpx;
+						font-weight: bold;
+						color: black;
+						width: 600rpx;
+						margin-bottom: 10rpx;
+					}
+
+					.home {
+						width: 600rpx;
+					}
+
+					text {
+						padding-bottom: 10rpx;
+						color: #9C9C9C;
+					}
+				}
+			}
+		}
+
+
+	}
+</style>