big-qianduan.new1/index.vue

<template>
	<view class="container">


		<!-- 公告区域 -->
		<view class="announcement">
			<text class="announcement-title">公告</text>
			<text class="announcement-content">{{ announcement }}</text>
		</view>



		<!-- 按钮功能区 -->
		<view class="button-group">
			<button class="button" @click="viewAllHomework">查看所有作业</button>
			<button class="button" @click="viewMyHomework">查看我提交的作业</button>
			<button class="button" @click="viewExcellentHomework">查看优秀作业</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			};
		},
		onLoad() {
			this.fetchUserInfo(); // 页面加载时获取用户信息
		},
		methods: {
			// 获取用户信息
			fetchUserInfo() {
				const token = uni.getStorageSync('token'); // 从本地缓存获取 token
				if (!token) {
					uni.showToast({
						title: '未登录，请前往登录登录',
						icon: 'none'
					});
					// 跳转到登录页面
					uni.reLaunch({
						url: '/pages/login/login'
					});
				}

				uni.request({
					url: `${this.$baseUrl}/getInfo`,
					method: 'GET',
					header: {
						Authorization: `Bearer ${token}` // 将 token 作为 Authorization 头传递
					},
					success: (res) => {
						if (res.data.code === 200) {
							this.userInfo = res.data.user;
							uni.setStorageSync('nickName', this.userInfo.nickName); // 将用户信息存储到本地缓存
						} else {
							uni.showToast({
								title: res.data.message || '获取用户信息失败',
								icon: 'none'
							});
						}
					},
					fail: () => {
						uni.showToast({
							title: '网络错误，请稍后重试',
							icon: 'none'
						});
					}
				});
			},
			viewAllHomework() {
				uni.navigateTo({
					url: '/pages/allHomework/allHomework' // 替换为实际页面路径
				});
			},
			viewMyHomework() {
				uni.navigateTo({
					url: '/pages/myHomework/myHomework' // 替换为实际页面路径
				});
			},
			viewExcellentHomework() {
				uni.navigateTo({
					url: '/pages/excellentHomework/excellentHomework' // 替换为实际页面路径
				});
			}
		}
	};
</script>

<style>
	<style>.container {
		display: flex;
		flex-direction: column;
		background-color: #f8f9fa;
		height: 100vh;
		font-family: Arial, sans-serif;
	}

	.header {
		background-color: #007bff;
		padding: 15px;
		text-align: center;
		box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	}

	.title {
		color: #fff;
		font-size: 24px;
		font-weight: bold;
	}

	.announcement {
		padding: 20px;
		background-color: #fef8e1;
		border: 1px solid #ffd966;
		border-radius: 8px;
		margin: 15px 10px;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	}

	.announcement-title {
		font-weight: bold;
		font-size: 18px;
		color: #333;
		margin-bottom: 8px;
	}

	.announcement-content {
		font-size: 14px;
		color: #555;
		line-height: 1.6;
	}

	.button-group {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: 20px;
	}

	.button {
		width: 90%;
		max-width: 300px;
		padding: 15px;
		background-color: #007bff;
		color: #fff;
		text-align: center;
		border-radius: 8px;
		font-size: 16px;
		font-weight: bold;
		border: none;
		margin-bottom: 15px;
		box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
		transition: all 0.3s ease-in-out;
	}

	.button:hover {
		background-color: #0056b3;
		transform: translateY(-2px);
	}

	.button:active {
		background-color: #004494;
		transform: translateY(0);
	}

	.section-title {
		font-size: 18px;
		font-weight: bold;
		color: #333;
		margin: 20px 15px 10px;
	}

	.homework-section {
		padding: 15px;
		margin: 0 10px;
		background-color: #ffffff;
		border-radius: 8px;
		box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	}

	.homework-item {
		padding: 10px 15px;
		background-color: #f8f9fa;
		border: 1px solid #ddd;
		border-radius: 5px;
		margin-bottom: 10px;
		display: flex;
		flex-direction: column;
	}

	.homework-title {
		font-weight: bold;
		font-size: 16px;
		color: #333;
	}

	.homework-deadline {
		font-size: 14px;
		color: #666;
		margin-top: 5px;
	}

	@media screen and (max-width: 768px) {
		.button {
			width: 100%;
		}
	}
</style>