KindergartenAppletUI/pages/grade/grade.vue

<template>
	<view class="tops" v-if="StudentScore==0">
		<view class="zanwuchengji">
			<image src="../../static/zanwuchengji.png" mode=""></image>
			<view class="words">
				暂无内容
			</view>
		</view>
	</view>
	<view class="content" v-else>
		<view class="top" v-for="item in StudentScore">
			<view class="itemback">
				<view class="bindtitle">
					批次编号：{{item.batchCode}}
				</view>
				<view class="time">
					{{item.batchDate}}
				</view>
			</view>
			<view class="name">
				{{item.studentName}}
			</view>
			<view class="grade">
				{{item.totalFraction}}
				<span>分</span>
			</view>
			<view class="baogao" @tap='lookbook(item)'>
				<view class="image"></view>
				<view class="look" v-if="item.existFlag==false">暂无报告</view>
				<view class="lookreport" v-else>查看报告</view>
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {
		getStudentScore,
		getInfoByPhone,
	} from '@/api/index/index.js'
	import baseurl from '@/api/baseurl.js'
	export default {
		data() {
			return {
				StudentScore: [],
			}
		},
		onShow() {
			const value = uni.getStorageSync('phone');
			if (value) {
				getInfoByPhone(value).then(res => {
					if (res.code == 200) {
						var obj = {
							studentIdList: []
						}
						res.data.studentInfoList.forEach(e => {
							obj.studentIdList.push(e.studentId)
						})
						getStudentScore(obj).then(res => {
							this.StudentScore = res.data
						})
					} else {}
				})
			} else {
				uni.navigateTo({
					url: '/pages/index/index'
				})
			}
		},
		methods: {
			lookbook(item) {
				if (item.existFlag == false) {
					this.$refs.uToast.show({
						title: "暂无报告",
						type: 'error',
						duration: 1000
					})
				} else {
					uni.showLoading({
						title: '获取报告中'
					});
					var that = this
					wx.downloadFile({
						url: baseurl + item.downloadAddress,
						success: function(res) {
							var filePath = res.tempFilePath;
							wx.openDocument({
								filePath: filePath,
								showMenu: true,
								success: function(res) {
									uni.hideLoading();
								},
								fail: function(err) {
									uni.hideLoading();
								}
							});
						},
						fail: function(err) {
							uni.hideLoading();
							that.$refs.uToast.show({
								message: '请求报告失败',
								type: 'error'
							})
						}
					});
				}
			},
		}
	}
</script>

<style lang="scss">
	.tops {
		position: relative;

		.zanwuchengji {
			width: 374rpx;
			height: 100vh;
			line-height: 391rpx;
			text-align: center;

			.words {
				position: absolute;
				top: 42%;
				width: 100%;
				text-align: center;
				font-size: 32rpx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: #666666;
				line-height: 50rpx;
			}

			image {
				vertical-align: middle;
				width: 374rpx;
				height: 391rpx;
				position: absolute;
				left: 25%;
				top: 20%;
			}
		}
	}

	.content {
		background: linear-gradient(#D7EEE8, #fff);
		// background-color: red;
		padding: 3%;
		position: relative;




		.top {
			background: #fff;
			box-shadow: 0px 3px 18px 0px rgba(182, 218, 213, 0.43);
			width: 100%;
			margin: 3% auto 0; // text-align: center;
			height: 268rpx;
			border-radius: 10rpx;
			position: relative;


			.name {
				width: 250rpx;
				height: 50rpx;
				font-size: 28rpx;
				font-family: Source Han Sans CN;
				font-weight: 500;
				color: #000000;
				line-height: 48rpx;
				top: 50%;
				left: 20rpx;
				position: absolute;


			}

			.baogao {
				font-size: 26rpx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: #000;

				.image {
					width: 35rpx;
					// background-size：62rpx 50rpx;
					height: 38rpx;
					background: url(../../static/tijianbaogao.png) no-repeat center center;
					background-size: 100% 100%;
					left: 80%;
					top: 50%;
					position: absolute;
				}

				.look {
					left: 75%;
					top: 65%;
					position: absolute;
				}

				.lookreport {
					left: 75%;
					top: 65%;
					position: absolute;
					color: green;
				}

			}

			.grade {
				// width: 82px;
				// height: 78px;
				font-size: 70rpx;
				font-family: Source Han Sans CN;
				font-weight: 500;
				color: #35A97A;
				line-height: 67rpx;
				top: 50%;
				left: 40%;
				position: absolute;

				span {
					font-size: 30rpx;
				}
			}

			.itemback {
				width: 95%;
				height: 70rpx;
				margin: 0 auto;
				display: flex;
				border-bottom: 1rpx solid #CDC9C9;

				.time {
					float: right;
					font-size: 24rpx;
					font-family: Source Han Sans CN;
					font-weight: 400;
					color: #9B9A9A;
					line-height: 70rpx;
				}

				.bindtitle {
					width: 500rpx;
					height: 50rpx;
					line-height: 70rpx;
					// background-color: red;
					// height: 1rpx;
					font-size: 24rpx;
					font-family: Source Han Sans CN;
					font-weight: 400;
					color: #9B9A9A;
					// line-height: 48rpx;
				}
			}

		}
	}
</style>