KindergartenAppletUI/pages/grade/grade.vue

<template>
	<view class="content" 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">
				<view class="image">
				</view>
				<!-- <view class="look">查看报告</view> -->
				<view class="look" @tap='showToast(item)' v-if="item.existFlag==false">查看报告</view>
				<view class="lookreport" @tap='lookbook(item)' v-else>查看报告</view>
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>

</template>

<script>
	import {
		getStudentScore,

	} from '@/api/index/index.js'
	import baseurl from '@/api/baseurl.js'
	export default {
		data() {
			return {
				StudentScore: [],
				StudentScore: [],
				studentId: "",
				// studentIdList:{},
			}
		},
		onShow() {
			let that = this;
			const obj = uni.getStorageSync('studentId');
			if (!obj) {
				uni.navigateTo({
					url: "/pages/index/index"
				})
			} else {
				var arr = {
					"studentIdList": obj
				}
				getStudentScore(arr).then(res => {
					this.StudentScore = res.data
				})
			}
		},

		methods: {
			showToast() {
				this.$refs.uToast.show({
					message: "暂无报告",
					type: 'error',
					duration: 1000
				})
			},

			lookbook(item) {
				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'
						})
					}
				});
			},
			getPhoneNumberp(val) {
				wx.login({
					provider: 'weixin',
					success: function(loginRes) {}
				});
			},
			wxGetUserInfo() {
				let that = this;
				uni.getUserProfile({
					desc: "获取用户信息",
					lang: "zh_CN",
					success(res) {
						that.yonghuwx = res.userInfo
					},
					fail(res) {
						//失败则返回home页面
					},
				});
			},
		}
	}
</script>

<style lang="scss">
	.content {
		background: linear-gradient(#D7EEE8, #fff);
		// background-color: red;
		padding: 3%;
		position: relative;

		.zanwuchengji {
			width: 374rpx;
			height: 391rpx;
			// background-color: red;
			// position: relative;
			top: 50%;
			// width: 374rpx;
			// height: 391rpx;
			line-height: 391rpx;
			text-align: center;
			left: 25%;
			// top: -20%;
			// margin: 0 auto;

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

			image {
				// margin: 0 auto;
				vertical-align: middle;
				width: 374rpx;
				height: 391rpx;
				position: absolute;
				left: 25%;
				top: 50%;
			}
		}


		.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>