Week 1-8: Spring Boot 学习计划完整项目

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-04-29 23:45:17 +08:00
commit f95aa18724
201 changed files with 18595 additions and 0 deletions
--- a/week7/frontend/.gitignore
+++ b/week7/frontend/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
--- a/week7/frontend/index.html
+++ b/week7/frontend/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>学生管理系统 v3</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.js"></script>
+  </body>
+</html>
--- a/week7/frontend/package-lock.json
+++ b/week7/frontend/package-lock.json
--- a/week7/frontend/package.json
+++ b/week7/frontend/package.json
@@ -0,0 +1,21 @@
+{
+  "name": "frontend",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "axios": "^1.15.2",
+    "pinia": "^3.0.4",
+    "vue": "^3.5.32",
+    "vue-router": "^5.0.6"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^6.0.6",
+    "vite": "^8.0.10"
+  }
+}
--- a/week7/frontend/public/favicon.svg
+++ b/week7/frontend/public/favicon.svg
--- a/week7/frontend/public/icons.svg
+++ b/week7/frontend/public/icons.svg
@@ -0,0 +1,24 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <symbol id="bluesky-icon" viewBox="0 0 16 17">
+    <g clip-path="url(#bluesky-clip)"><path fill="#08060d" d="M7.75 7.735c-.693-1.348-2.58-3.86-4.334-5.097-1.68-1.187-2.32-.981-2.74-.79C.188 2.065.1 2.812.1 3.251s.241 3.602.398 4.13c.52 1.744 2.367 2.333 4.07 2.145-2.495.37-4.71 1.278-1.805 4.512 3.196 3.309 4.38-.71 4.987-2.746.608 2.036 1.307 5.91 4.93 2.746 2.72-2.746.747-4.143-1.747-4.512 1.702.189 3.55-.4 4.07-2.145.156-.528.397-3.691.397-4.13s-.088-1.186-.575-1.406c-.42-.19-1.06-.395-2.741.79-1.755 1.24-3.64 3.752-4.334 5.099"/></g>
+    <defs><clipPath id="bluesky-clip"><path fill="#fff" d="M.1.85h15.3v15.3H.1z"/></clipPath></defs>
+  </symbol>
+  <symbol id="discord-icon" viewBox="0 0 20 19">
+    <path fill="#08060d" d="M16.224 3.768a14.5 14.5 0 0 0-3.67-1.153c-.158.286-.343.67-.47.976a13.5 13.5 0 0 0-4.067 0c-.128-.306-.317-.69-.476-.976A14.4 14.4 0 0 0 3.868 3.77C1.546 7.28.916 10.703 1.231 14.077a14.7 14.7 0 0 0 4.5 2.306q.545-.748.965-1.587a9.5 9.5 0 0 1-1.518-.74q.191-.14.372-.293c2.927 1.369 6.107 1.369 8.999 0q.183.152.372.294-.723.437-1.52.74.418.838.963 1.588a14.6 14.6 0 0 0 4.504-2.308c.37-3.911-.63-7.302-2.644-10.309m-9.13 8.234c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.894 0 1.614.82 1.599 1.82.001 1-.705 1.82-1.6 1.82m5.91 0c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.893 0 1.614.82 1.599 1.82 0 1-.706 1.82-1.6 1.82"/>
+  </symbol>
+  <symbol id="documentation-icon" viewBox="0 0 21 20">
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="m15.5 13.333 1.533 1.322c.645.555.967.833.967 1.178s-.322.623-.967 1.179L15.5 18.333m-3.333-5-1.534 1.322c-.644.555-.966.833-.966 1.178s.322.623.966 1.179l1.534 1.321"/>
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M17.167 10.836v-4.32c0-1.41 0-2.117-.224-2.68-.359-.906-1.118-1.621-2.08-1.96-.599-.21-1.349-.21-2.848-.21-2.623 0-3.935 0-4.983.369-1.684.591-3.013 1.842-3.641 3.428C3 6.449 3 7.684 3 10.154v2.122c0 2.558 0 3.838.706 4.726q.306.383.713.671c.76.536 1.79.64 3.581.66"/>
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M3 10a2.78 2.78 0 0 1 2.778-2.778c.555 0 1.209.097 1.748-.047.48-.129.854-.503.982-.982.145-.54.048-1.194.048-1.749a2.78 2.78 0 0 1 2.777-2.777"/>
+  </symbol>
+  <symbol id="github-icon" viewBox="0 0 19 19">
+    <path fill="#08060d" fill-rule="evenodd" d="M9.356 1.85C5.05 1.85 1.57 5.356 1.57 9.694a7.84 7.84 0 0 0 5.324 7.44c.387.079.528-.168.528-.376 0-.182-.013-.805-.013-1.454-2.165.467-2.616-.935-2.616-.935-.349-.91-.864-1.143-.864-1.143-.71-.48.051-.48.051-.48.787.051 1.2.805 1.2.805.695 1.194 1.817.857 2.268.649.064-.507.27-.857.49-1.052-1.728-.182-3.545-.857-3.545-3.87 0-.857.31-1.558.8-2.104-.078-.195-.349-1 .077-2.078 0 0 .657-.208 2.14.805a7.5 7.5 0 0 1 1.946-.26c.657 0 1.328.092 1.946.26 1.483-1.013 2.14-.805 2.14-.805.426 1.078.155 1.883.078 2.078.502.546.799 1.247.799 2.104 0 3.013-1.818 3.675-3.558 3.87.284.247.528.714.528 1.454 0 1.052-.012 1.896-.012 2.156 0 .208.142.455.528.377a7.84 7.84 0 0 0 5.324-7.441c.013-4.338-3.48-7.844-7.773-7.844" clip-rule="evenodd"/>
+  </symbol>
+  <symbol id="social-icon" viewBox="0 0 20 20">
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M12.5 6.667a4.167 4.167 0 1 0-8.334 0 4.167 4.167 0 0 0 8.334 0"/>
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M2.5 16.667a5.833 5.833 0 0 1 8.75-5.053m3.837.474.513 1.035c.07.144.257.282.414.309l.93.155c.596.1.736.536.307.965l-.723.73a.64.64 0 0 0-.152.531l.207.903c.164.715-.213.991-.84.618l-.872-.52a.63.63 0 0 0-.577 0l-.872.52c-.624.373-1.003.094-.84-.618l.207-.903a.64.64 0 0 0-.152-.532l-.723-.729c-.426-.43-.289-.864.306-.964l.93-.156a.64.64 0 0 0 .412-.31l.513-1.034c.28-.562.735-.562 1.012 0"/>
+  </symbol>
+  <symbol id="x-icon" viewBox="0 0 19 19">
+    <path fill="#08060d" fill-rule="evenodd" d="M1.893 1.98c.052.072 1.245 1.769 2.653 3.77l2.892 4.114c.183.261.333.48.333.486s-.068.089-.152.183l-.522.593-.765.867-3.597 4.087c-.375.426-.734.834-.798.905a1 1 0 0 0-.118.148c0 .01.236.017.664.017h.663l.729-.83c.4-.457.796-.906.879-.999a692 692 0 0 0 1.794-2.038c.034-.037.301-.34.594-.675l.551-.624.345-.392a7 7 0 0 1 .34-.374c.006 0 .93 1.306 2.052 2.903l2.084 2.965.045.063h2.275c1.87 0 2.273-.003 2.266-.021-.008-.02-1.098-1.572-3.894-5.547-2.013-2.862-2.28-3.246-2.273-3.266.008-.019.282-.332 2.085-2.38l2-2.274 1.567-1.782c.022-.028-.016-.03-.65-.03h-.674l-.3.342a871 871 0 0 1-1.782 2.025c-.067.075-.405.458-.75.852a100 100 0 0 1-.803.91c-.148.172-.299.344-.99 1.127-.304.343-.32.358-.345.327-.015-.019-.904-1.282-1.976-2.808L6.365 1.85H1.8zm1.782.91 8.078 11.294c.772 1.08 1.413 1.973 1.425 1.984.016.017.241.02 1.05.017l1.03-.004-2.694-3.766L7.796 5.75 5.722 2.852l-1.039-.004-1.039-.004z" clip-rule="evenodd"/>
+  </symbol>
+</svg>
--- a/week7/frontend/src/App.vue
+++ b/week7/frontend/src/App.vue
@@ -0,0 +1,3 @@
+<template>
+  <router-view />
+</template>
--- a/week7/frontend/src/api/auth.js
+++ b/week7/frontend/src/api/auth.js
@@ -0,0 +1,10 @@
+// 认证 API（Day 2）
+import http from './http'
+
+export function loginApi(username, password) {
+  return http.post('/auth/login', { username, password })
+}
+
+export function registerApi(username, password) {
+  return http.post('/auth/register', { username, password })
+}
--- a/week7/frontend/src/api/http.js
+++ b/week7/frontend/src/api/http.js
@@ -0,0 +1,30 @@
+// Axios 封装 — 统一 JWT 请求头 + 错误处理（Day 7）
+import axios from 'axios'
+
+const http = axios.create({ baseURL: '/api', timeout: 10000 })
+
+http.interceptors.request.use(config => {
+  const token = localStorage.getItem('wk7_token')
+  if (token) config.headers.Authorization = `Bearer ${token}`
+  return config
+})
+
+http.interceptors.response.use(
+  response => {
+    const body = response.data
+    if (body && body.code === 200) return body
+    return Promise.reject(new Error(body?.message || '未知错误'))
+  },
+  error => {
+    const resp = error.response
+    if (!resp) return Promise.reject(new Error('网络错误，请检查后端是否启动'))
+    const body = resp.data
+    if (resp.status === 401) {
+      localStorage.removeItem('wk7_token')
+      window.location.href = '/login'
+    }
+    return Promise.reject(new Error(body?.message || `请求失败 (${resp.status})`))
+  }
+)
+
+export default http
--- a/week7/frontend/src/api/student.js
+++ b/week7/frontend/src/api/student.js
@@ -0,0 +1,29 @@
+// 学生 CRUD API（Day 3-5）
+import http from './http'
+
+export function fetchStudents(keyword, page, size) {
+  let url = '/students?'
+  if (keyword) url += 'keyword=' + encodeURIComponent(keyword) + '&'
+  if (page != null) url += 'page=' + page + '&size=' + (size || 10)
+  return http.get(url)
+}
+
+export function fetchStudent(id) {
+  return http.get('/students/' + id)
+}
+
+export function createStudent(data) {
+  return http.post('/students', data)
+}
+
+export function updateStudent(id, data) {
+  return http.put('/students/' + id, data)
+}
+
+export function deleteStudent(id) {
+  return http.delete('/students/' + id)
+}
+
+export function fetchExcellent(min) {
+  return http.get('/students/stats/excellent?min=' + (min || 85))
+}
--- a/week7/frontend/src/components/NavBar.vue
+++ b/week7/frontend/src/components/NavBar.vue
@@ -0,0 +1,47 @@
+<!-- 顶部导航栏（Day 4 + Day 6：组件通信 + Store） -->
+<template>
+  <nav>
+    <div class="nav-left">
+      <router-link to="/" class="logo">学生管理 v3</router-link>
+      <router-link to="/students">数据管理</router-link>
+    </div>
+    <div class="nav-right">
+      <span class="user-tag">{{ auth.username }} <em>({{ auth.role }})</em></span>
+      <button @click="handleLogout">退出</button>
+    </div>
+  </nav>
+</template>
+
+<script setup>
+import { useAuthStore } from '../stores/auth'
+import { useRouter } from 'vue-router'
+
+const auth = useAuthStore()
+const router = useRouter()
+
+function handleLogout() {
+  auth.logout()
+  router.push('/login')
+}
+</script>
+
+<style scoped>
+nav {
+  display: flex; justify-content: space-between; align-items: center;
+  height: 56px; padding: 0 24px;
+  background: rgba(255,255,255,0.95); box-shadow: 0 2px 8px rgba(0,0,0,0.1);
+  position: sticky; top: 0; z-index: 100;
+}
+.nav-left { display: flex; gap: 20px; align-items: center; }
+.logo { font-weight: 700; font-size: 1.1em; color: #667eea; }
+.nav-left a { color: #555; text-decoration: none; font-size: 0.93em; }
+.nav-left a.router-link-active { color: #667eea; font-weight: 600; }
+.nav-right { display: flex; align-items: center; gap: 14px; }
+.user-tag { font-size: 0.88em; color: #666; }
+.user-tag em { font-style: normal; color: #667eea; }
+.nav-right button {
+  padding: 6px 14px; border: 1.5px solid #e74c3c; background: #fff;
+  color: #e74c3c; border-radius: 6px; cursor: pointer; font-size: 0.82em;
+}
+.nav-right button:hover { background: #e74c3c; color: #fff; }
+</style>
--- a/week7/frontend/src/components/Pagination.vue
+++ b/week7/frontend/src/components/Pagination.vue
@@ -0,0 +1,46 @@
+<!-- 分页组件（Day 4：分页） -->
+<template>
+  <div class="pagination" v-if="totalPages > 1">
+    <button :disabled="current === 0" @click="$emit('change', 0)">首页</button>
+    <button :disabled="current === 0" @click="$emit('change', current - 1)">上一页</button>
+    <span v-for="p in pages" :key="p">
+      <button v-if="p !== '...'" :class="{ active: p - 1 === current }" @click="$emit('change', p - 1)">{{ p }}</button>
+      <span v-else class="dots">...</span>
+    </span>
+    <button :disabled="current >= totalPages - 1" @click="$emit('change', current + 1)">下一页</button>
+    <button :disabled="current >= totalPages - 1" @click="$emit('change', totalPages - 1)">末页</button>
+    <span class="info">{{ current + 1 }} / {{ totalPages }}</span>
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+
+const props = defineProps({ current: Number, totalPages: Number })
+defineEmits(['change'])
+
+const pages = computed(() => {
+  const total = props.totalPages
+  const cur = props.current
+  if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1)
+  const result = [1]
+  if (cur > 3) result.push('...')
+  for (let i = Math.max(2, cur - 1); i <= Math.min(total - 1, cur + 3); i++) result.push(i)
+  if (cur < total - 4) result.push('...')
+  result.push(total)
+  return result
+})
+</script>
+
+<style scoped>
+.pagination { display: flex; gap: 6px; align-items: center; justify-content: center; margin-top: 20px; }
+.pagination button {
+  padding: 6px 12px; border: 1.5px solid #ddd; background: #fff; border-radius: 6px;
+  cursor: pointer; font-size: 0.85em; transition: all 0.15s;
+}
+.pagination button:disabled { opacity: 0.4; cursor: not-allowed; }
+.pagination button:not(:disabled):hover { border-color: #667eea; color: #667eea; }
+.pagination button.active { background: #667eea; color: #fff; border-color: #667eea; }
+.dots { padding: 0 4px; color: #999; }
+.info { margin-left: 8px; font-size: 0.85em; color: #888; }
+</style>
--- a/week7/frontend/src/components/StudentForm.vue
+++ b/week7/frontend/src/components/StudentForm.vue
@@ -0,0 +1,79 @@
+<!-- 学生表单弹窗（Day 3 + Day 4：props/emits + 表单校验） -->
+<template>
+  <div class="overlay" :class="{ show: visible }" @click.self="$emit('close')">
+    <div class="modal">
+      <h2>{{ isEdit ? '编辑学生' : '新增学生' }}</h2>
+      <form @submit.prevent="handleSubmit">
+        <div class="field"><label>姓名 *</label><input v-model="form.name" required maxlength="20" placeholder="请输入姓名"></div>
+        <div class="row">
+          <div class="field"><label>年龄 *</label><input v-model.number="form.age" type="number" required min="1" max="150"></div>
+          <div class="field"><label>成绩 *</label><input v-model.number="form.score" type="number" required min="0" max="100"></div>
+        </div>
+        <div class="field"><label>邮箱 *</label><input v-model="form.email" type="email" required placeholder="example@mail.com"></div>
+        <p class="err" v-if="error">{{ error }}</p>
+        <div class="actions">
+          <button type="button" class="btn-cancel" @click="$emit('close')">取消</button>
+          <button type="submit" class="btn-save" :disabled="loading">{{ loading ? '保存中...' : '保存' }}</button>
+        </div>
+      </form>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, watch } from 'vue'
+
+const props = defineProps({ visible: Boolean, student: Object, loading: Boolean })
+const emit = defineEmits(['close', 'submit', 'update:student'])
+
+const isEdit = ref(false)
+const form = ref({ name: '', age: 18, email: '', score: 80 })
+const error = ref('')
+
+watch(() => props.visible, (v) => {
+  if (!v) return
+  error.value = ''
+  if (props.student) {
+    isEdit.value = true
+    form.value = { ...props.student }
+  } else {
+    isEdit.value = false
+    form.value = { name: '', age: 18, email: '', score: 80 }
+  }
+})
+
+function handleSubmit() {
+  if (!form.value.name.trim()) { error.value = '姓名不能为空'; return }
+  if (!form.value.email.trim()) { error.value = '邮箱不能为空'; return }
+  if (form.value.score < 0 || form.value.score > 100) { error.value = '成绩必须在 0-100 之间'; return }
+  emit('submit', { ...form.value, id: props.student?.id })
+}
+</script>
+
+<style scoped>
+.overlay {
+  position: fixed; inset: 0; background: rgba(0,0,0,0.45);
+  display: flex; align-items: center; justify-content: center; z-index: 1000;
+  opacity: 0; pointer-events: none; transition: opacity 0.25s;
+}
+.overlay.show { opacity: 1; pointer-events: auto; }
+.modal {
+  background: #fff; border-radius: 12px; padding: 28px 30px; width: 90%; max-width: 480px;
+  box-shadow: 0 16px 48px rgba(0,0,0,0.2);
+}
+.modal h2 { margin-bottom: 18px; font-size: 1.2em; }
+.field { margin-bottom: 14px; }
+.field label { display: block; font-size: 0.85em; color: #666; margin-bottom: 4px; font-weight: 500; }
+.field input {
+  width: 100%; padding: 9px 12px; border: 1.5px solid #ddd; border-radius: 8px; font-size: 0.93em;
+}
+.field input:focus { outline: none; border-color: #667eea; }
+.row { display: flex; gap: 12px; }
+.row .field { flex: 1; }
+.actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 20px; }
+.btn-cancel { padding: 9px 20px; border: 1.5px solid #ddd; background: #fff; border-radius: 8px; cursor: pointer; }
+.btn-save { padding: 9px 28px; background: #667eea; color: #fff; border: none; border-radius: 8px; cursor: pointer; }
+.btn-save:disabled { opacity: 0.6; cursor: not-allowed; }
+.btn-save:not(:disabled):hover { background: #5a6fd6; }
+.err { color: #e74c3c; font-size: 0.85em; margin-bottom: 10px; }
+</style>
--- a/week7/frontend/src/main.js
+++ b/week7/frontend/src/main.js
@@ -0,0 +1,7 @@
+import { createApp } from 'vue'
+import { createPinia } from 'pinia'
+import router from './router'
+import App from './App.vue'
+import './style.css'
+
+createApp(App).use(createPinia()).use(router).mount('#app')
--- a/week7/frontend/src/router/index.js
+++ b/week7/frontend/src/router/index.js
@@ -0,0 +1,46 @@
+// 路由配置 + 导航守卫（Day 5 + Day 7）
+import { createRouter, createWebHistory } from 'vue-router'
+import { useAuthStore } from '../stores/auth'
+
+const routes = [
+  {
+    path: '/login',
+    name: 'Login',
+    component: () => import('../views/LoginView.vue'),
+    meta: { guest: true }
+  },
+  {
+    path: '/register',
+    name: 'Register',
+    component: () => import('../views/RegisterView.vue'),
+    meta: { guest: true }
+  },
+  {
+    path: '/',
+    name: 'Home',
+    component: () => import('../views/HomeView.vue'),
+    meta: { requiresAuth: true }
+  },
+  {
+    path: '/students',
+    name: 'StudentList',
+    component: () => import('../views/StudentListView.vue'),
+    meta: { requiresAuth: true }
+  }
+]
+
+const router = createRouter({ history: createWebHistory(), routes })
+
+// 全局前置守卫：未登录重定向到登录页
+router.beforeEach((to, from, next) => {
+  const auth = useAuthStore()
+  if (to.meta.requiresAuth && !auth.isLoggedIn) {
+    next('/login')
+  } else if (to.meta.guest && auth.isLoggedIn) {
+    next('/')  // 已登录用户访问登录页时跳转首页
+  } else {
+    next()
+  }
+})
+
+export default router
--- a/week7/frontend/src/stores/auth.js
+++ b/week7/frontend/src/stores/auth.js
@@ -0,0 +1,43 @@
+// 认证 Store — JWT Token 管理（Day 2 + Day 6）
+import { defineStore } from 'pinia'
+import { ref, computed } from 'vue'
+import { loginApi, registerApi } from '../api/auth'
+
+export const useAuthStore = defineStore('auth', () => {
+  const token = ref(localStorage.getItem('wk7_token') || '')
+  const username = ref(localStorage.getItem('wk7_username') || '')
+  const role = ref(localStorage.getItem('wk7_role') || '')
+
+  const isLoggedIn = computed(() => !!token.value)
+  const isAdmin = computed(() => role.value === 'ADMIN')
+
+  function saveAuth(data) {
+    token.value = data.token
+    username.value = data.username
+    role.value = data.role
+    localStorage.setItem('wk7_token', data.token)
+    localStorage.setItem('wk7_username', data.username)
+    localStorage.setItem('wk7_role', data.role)
+  }
+
+  async function login(user, pass) {
+    const result = await loginApi(user, pass)
+    saveAuth(result.data)
+    return result.data
+  }
+
+  async function register(user, pass) {
+    const result = await registerApi(user, pass)
+    saveAuth(result.data)
+    return result.data
+  }
+
+  function logout() {
+    token.value = ''; username.value = ''; role.value = ''
+    localStorage.removeItem('wk7_token')
+    localStorage.removeItem('wk7_username')
+    localStorage.removeItem('wk7_role')
+  }
+
+  return { token, username, role, isLoggedIn, isAdmin, login, register, logout }
+})
--- a/week7/frontend/src/style.css
+++ b/week7/frontend/src/style.css
@@ -0,0 +1,8 @@
+*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
+               "Microsoft YaHei", sans-serif;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  min-height: 100vh; color: #333;
+}
--- a/week7/frontend/src/views/HomeView.vue
+++ b/week7/frontend/src/views/HomeView.vue
@@ -0,0 +1,79 @@
+<!-- 首页仪表盘（Day 1 + Day 5：架构总览 + 路由） -->
+<template>
+  <div>
+    <NavBar />
+    <div class="page">
+      <h1>欢迎回来，{{ auth.username }}</h1>
+      <p class="role">角色：<strong>{{ auth.role }}</strong> | ORM：<strong>{{ orm }}</strong></p>
+
+      <div class="cards">
+        <div class="card primary" @click="$router.push('/students')">
+          <div class="num">{{ stats.total }}</div>
+          <div class="label">学生总数</div>
+        </div>
+        <div class="card success">
+          <div class="num">{{ stats.excellent }}</div>
+          <div class="label">优秀 (≥85)</div>
+        </div>
+        <div class="card info">
+          <div class="num">{{ orm }}</div>
+          <div class="label">ORM 引擎</div>
+        </div>
+      </div>
+
+      <div class="quick-links">
+        <router-link to="/students" class="btn">查看学生列表</router-link>
+        <button v-if="auth.isAdmin" class="btn primary" @click="$router.push('/students')">+ 新增学生</button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import { useAuthStore } from '../stores/auth'
+import { fetchStudents, fetchExcellent } from '../api/student'
+import NavBar from '../components/NavBar.vue'
+
+const auth = useAuthStore()
+const orm = ref('--')
+const stats = ref({ total: 0, excellent: 0 })
+
+onMounted(async () => {
+  try {
+    const list = await fetchStudents()
+    stats.value.total = list.extra?.total ?? list.data?.length ?? 0
+    orm.value = list.extra?.orm ?? '--'
+    const exc = await fetchExcellent(85)
+    stats.value.excellent = exc.data ?? 0
+  } catch { /* 后端未启动时显示默认值 */ }
+})
+</script>
+
+<style scoped>
+.page { max-width: 800px; margin: 60px auto; padding: 0 20px; text-align: center; }
+h1 { font-size: 1.6em; color: #fff; margin-bottom: 6px; }
+.role { color: rgba(255,255,255,0.8); margin-bottom: 32px; font-size: 0.93em; }
+
+.cards { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
+.card {
+  flex: 1; min-width: 160px; padding: 28px 16px; border-radius: 12px;
+  color: #fff; cursor: pointer; transition: transform 0.2s;
+}
+.card:hover { transform: translateY(-3px); }
+.card.primary { background: linear-gradient(135deg, #667eea, #764ba2); }
+.card.success { background: linear-gradient(135deg, #2ecc71, #27ae60); }
+.card.info { background: linear-gradient(135deg, #3498db, #2980b9); cursor: default; }
+.num { font-size: 2.4em; font-weight: 700; }
+.label { font-size: 0.88em; opacity: 0.85; margin-top: 4px; }
+
+.quick-links { margin-top: 32px; display: flex; gap: 12px; justify-content: center; }
+.btn {
+  padding: 12px 28px; border-radius: 8px; font-size: 0.95em; cursor: pointer;
+  background: rgba(255,255,255,0.15); color: #fff; border: 1.5px solid rgba(255,255,255,0.3);
+  text-decoration: none; transition: all 0.2s; display: inline-block;
+}
+.btn:hover { background: rgba(255,255,255,0.25); }
+.btn.primary { background: #fff; color: #667eea; border-color: #fff; }
+.btn.primary:hover { background: #f0f2ff; }
+</style>
--- a/week7/frontend/src/views/LoginView.vue
+++ b/week7/frontend/src/views/LoginView.vue
@@ -0,0 +1,69 @@
+<!-- 登录页（Day 2：登录注册 + JWT 对接） -->
+<template>
+  <div class="login-wrapper">
+    <div class="login-card">
+      <h1>学生管理系统 v3</h1>
+      <p class="sub">Vue 3 + Spring Boot 前后端分离</p>
+      <div class="field"><input v-model="username" placeholder="用户名" @keyup.enter="handleLogin" autofocus></div>
+      <div class="field"><input v-model="password" type="password" placeholder="密码" @keyup.enter="handleLogin"></div>
+      <p class="err" v-if="error">{{ error }}</p>
+      <button class="btn-login" :disabled="loading" @click="handleLogin">{{ loading ? '登录中...' : '登录' }}</button>
+      <p class="hint">默认: admin/123456 (管理员) 或 user/123456 (普通用户)</p>
+      <p class="hint">没有账号？<router-link to="/register">注册</router-link></p>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { useAuthStore } from '../stores/auth'
+import { useRouter } from 'vue-router'
+
+const auth = useAuthStore()
+const router = useRouter()
+const username = ref('')
+const password = ref('')
+const loading = ref(false)
+const error = ref('')
+
+async function handleLogin() {
+  error.value = ''
+  if (!username.value || !password.value) { error.value = '请输入用户名和密码'; return }
+  loading.value = true
+  try {
+    await auth.login(username.value, password.value)
+    router.push('/')
+  } catch (e) {
+    error.value = e.message
+  } finally {
+    loading.value = false
+  }
+}
+</script>
+
+<style scoped>
+.login-wrapper {
+  min-height: 100vh; display: flex; align-items: center; justify-content: center;
+}
+.login-card {
+  background: #fff; border-radius: 14px; padding: 40px 36px; width: 400px;
+  box-shadow: 0 12px 40px rgba(0,0,0,0.15); text-align: center;
+}
+h1 { font-size: 1.5em; margin-bottom: 4px; }
+.sub { color: #999; font-size: 0.88em; margin-bottom: 24px; }
+.field { margin-bottom: 14px; }
+.field input {
+  width: 100%; padding: 11px 14px; border: 1.5px solid #ddd; border-radius: 8px;
+  font-size: 0.95em;
+}
+.field input:focus { outline: none; border-color: #667eea; }
+.err { color: #e74c3c; font-size: 0.85em; margin-bottom: 10px; min-height: 1.3em; }
+.btn-login {
+  width: 100%; padding: 12px; background: #667eea; color: #fff; border: none;
+  border-radius: 8px; font-size: 1em; cursor: pointer; transition: background 0.2s;
+}
+.btn-login:disabled { opacity: 0.6; cursor: not-allowed; }
+.btn-login:not(:disabled):hover { background: #5a6fd6; }
+.hint { margin-top: 14px; font-size: 0.82em; color: #aaa; }
+.hint a { color: #667eea; }
+</style>
--- a/week7/frontend/src/views/RegisterView.vue
+++ b/week7/frontend/src/views/RegisterView.vue
@@ -0,0 +1,62 @@
+<!-- 注册页（Day 2：注册 + 自动登录） -->
+<template>
+  <div class="login-wrapper">
+    <div class="login-card">
+      <h1>注册新账号</h1>
+      <div class="field"><input v-model="username" placeholder="用户名" @keyup.enter="handleRegister" autofocus></div>
+      <div class="field"><input v-model="password" type="password" placeholder="密码" @keyup.enter="handleRegister"></div>
+      <p class="err" v-if="error">{{ error }}</p>
+      <button class="btn-login" :disabled="loading" @click="handleRegister">{{ loading ? '注册中...' : '注册' }}</button>
+      <p class="hint"><router-link to="/login">返回登录</router-link></p>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { useAuthStore } from '../stores/auth'
+import { useRouter } from 'vue-router'
+
+const auth = useAuthStore()
+const router = useRouter()
+const username = ref('')
+const password = ref('')
+const loading = ref(false)
+const error = ref('')
+
+async function handleRegister() {
+  error.value = ''
+  if (!username.value || !password.value) { error.value = '请输入用户名和密码'; return }
+  loading.value = true
+  try {
+    await auth.register(username.value, password.value)
+    router.push('/')
+  } catch (e) {
+    error.value = e.message
+  } finally {
+    loading.value = false
+  }
+}
+</script>
+
+<style scoped>
+.login-wrapper { min-height: 100vh; display: flex; align-items: center; justify-content: center; }
+.login-card {
+  background: #fff; border-radius: 14px; padding: 40px 36px; width: 400px;
+  box-shadow: 0 12px 40px rgba(0,0,0,0.15); text-align: center;
+}
+h1 { font-size: 1.4em; margin-bottom: 22px; }
+.field { margin-bottom: 14px; }
+.field input {
+  width: 100%; padding: 11px 14px; border: 1.5px solid #ddd; border-radius: 8px; font-size: 0.95em;
+}
+.field input:focus { outline: none; border-color: #667eea; }
+.err { color: #e74c3c; font-size: 0.85em; margin-bottom: 10px; min-height: 1.3em; }
+.btn-login {
+  width: 100%; padding: 12px; background: #667eea; color: #fff; border: none;
+  border-radius: 8px; font-size: 1em; cursor: pointer;
+}
+.btn-login:disabled { opacity: 0.6; cursor: not-allowed; }
+.hint { margin-top: 14px; font-size: 0.82em; color: #aaa; }
+.hint a { color: #667eea; }
+</style>
--- a/week7/frontend/src/views/StudentListView.vue
+++ b/week7/frontend/src/views/StudentListView.vue
@@ -0,0 +1,208 @@
+<!-- 学生列表页（Day 3-6：CRUD + 分页 + 搜索 + Loading + 空状态 + 错误处理）-->
+<template>
+  <div>
+    <NavBar />
+    <div class="page">
+      <!-- 工具栏：Day 3 搜索 + Day 4 分页 -->
+      <div class="toolbar">
+        <input v-model="keyword" placeholder="搜索姓名..." @keyup.enter="search" />
+        <button class="btn-outline" @click="search">搜索</button>
+        <button class="btn-outline" @click="refresh">刷新</button>
+        <button v-if="auth.isAdmin" class="btn-add" @click="openForm()">+ 新增</button>
+      </div>
+
+      <!-- 错误提示（Day 6） -->
+      <div class="error-bar" v-if="error">{{ error }}<button @click="refresh">重试</button></div>
+
+      <!-- Loading 状态（Day 6） -->
+      <div class="loading" v-if="loading">加载中...</div>
+
+      <!-- 空状态（Day 6） -->
+      <div class="empty" v-else-if="!loading && students.length === 0">
+        暂无数据
+      </div>
+
+      <!-- 表格 -->
+      <div class="table-wrap" v-else>
+        <table>
+          <thead>
+            <tr><th>ID</th><th>姓名</th><th>年龄</th><th>邮箱</th><th>成绩</th><th v-if="auth.isAdmin">操作</th></tr>
+          </thead>
+          <tbody>
+            <tr v-for="s in students" :key="s.id">
+              <td>{{ s.id }}</td>
+              <td><strong>{{ s.name }}</strong></td>
+              <td>{{ s.age }}</td>
+              <td>{{ s.email }}</td>
+              <td><span class="badge" :class="scoreClass(s.score)">{{ s.score }}</span></td>
+              <td v-if="auth.isAdmin">
+                <button class="btn-edit" @click="openForm(s)">编辑</button>
+                <button class="btn-del" @click="handleDelete(s.id)">删除</button>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+
+      <!-- 分页组件（Day 4） -->
+      <Pagination :current="page" :totalPages="totalPages" @change="goPage" />
+
+      <!-- 统计卡片 -->
+      <div class="stats">
+        <div class="stat"><span class="v">{{ statsTotal }}</span><span class="l">总数</span></div>
+        <div class="stat"><span class="v">{{ statsExcellent }}</span><span class="l">优秀</span></div>
+        <div class="stat"><span class="v">{{ orm }}</span><span class="l">ORM</span></div>
+      </div>
+
+      <!-- 新增/编辑弹窗（Day 3 + Day 5：表单 + 提交） -->
+      <StudentForm
+        :visible="formVisible"
+        :student="editTarget"
+        :loading="formLoading"
+        @close="formVisible = false"
+        @submit="handleFormSubmit"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import { useAuthStore } from '../stores/auth'
+import { fetchStudents, fetchExcellent, createStudent, updateStudent, deleteStudent } from '../api/student'
+import NavBar from '../components/NavBar.vue'
+import Pagination from '../components/Pagination.vue'
+import StudentForm from '../components/StudentForm.vue'
+
+const auth = useAuthStore()
+
+// 列表状态
+const students = ref([])
+const keyword = ref('')
+const page = ref(0)
+const size = ref(10)
+const totalPages = ref(0)
+const loading = ref(false)
+const error = ref('')
+const statsTotal = ref(0)
+const statsExcellent = ref(0)
+const orm = ref('--')
+
+// 表单状态
+const formVisible = ref(false)
+const editTarget = ref(null)
+const formLoading = ref(false)
+
+function scoreClass(s) {
+  if (s >= 90) return 'badge-excellent'
+  if (s >= 80) return 'badge-good'
+  if (s >= 60) return 'badge-normal'
+  return 'badge-poor'
+}
+
+async function loadData() {
+  loading.value = true; error.value = ''
+  try {
+    const result = await fetchStudents(keyword.value || undefined, page.value, size.value)
+    students.value = result.data || []
+    statsTotal.value = result.extra?.total ?? students.value.length
+    if (result.extra?.pages != null) totalPages.value = result.extra.pages
+    else totalPages.value = Math.ceil((result.extra?.total ?? students.value.length) / size.value)
+    orm.value = result.extra?.orm ?? '--'
+    const exc = await fetchExcellent(85)
+    statsExcellent.value = exc.data ?? 0
+  } catch (e) {
+    error.value = e.message
+    students.value = []
+  } finally {
+    loading.value = false
+  }
+}
+
+function search() { page.value = 0; loadData() }
+function refresh() { keyword.value = ''; page.value = 0; loadData() }
+function goPage(p) { page.value = p; loadData() }
+
+function openForm(student) {
+  editTarget.value = student || null
+  formVisible.value = true
+}
+
+async function handleFormSubmit(data) {
+  formLoading.value = true
+  try {
+    if (data.id) {
+      await updateStudent(data.id, data)
+    } else {
+      await createStudent(data)
+    }
+    formVisible.value = false
+    loadData()
+  } catch (e) {
+    alert(e.message)
+  } finally {
+    formLoading.value = false
+  }
+}
+
+async function handleDelete(id) {
+  if (!confirm('确认删除？')) return
+  try {
+    await deleteStudent(id)
+    loadData()
+  } catch (e) {
+    alert(e.message)
+  }
+}
+
+onMounted(loadData)
+</script>
+
+<style scoped>
+.page { max-width: 1000px; margin: 30px auto; padding: 0 20px; }
+
+/* 工具栏 */
+.toolbar { display: flex; gap: 10px; margin-bottom: 16px; background: #fff; padding: 14px 18px; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
+.toolbar input { flex: 1; padding: 9px 12px; border: 1.5px solid #ddd; border-radius: 8px; font-size: 0.93em; }
+.toolbar input:focus { outline: none; border-color: #667eea; }
+.btn-outline { padding: 9px 18px; border: 1.5px solid #667eea; background: #fff; color: #667eea; border-radius: 8px; cursor: pointer; font-size: 0.9em; }
+.btn-outline:hover { background: #f0f2ff; }
+.btn-add { padding: 9px 22px; background: #667eea; color: #fff; border: none; border-radius: 8px; cursor: pointer; font-size: 0.9em; }
+.btn-add:hover { background: #5a6fd6; }
+
+/* 错误/加载/空状态 */
+.error-bar { background: #fff3cd; color: #856404; padding: 12px 18px; border-radius: 8px; margin-bottom: 14px; display: flex; justify-content: space-between; }
+.error-bar button { background: none; border: none; color: #856404; text-decoration: underline; cursor: pointer; }
+.loading, .empty { text-align: center; padding: 80px 0; color: #fff; font-size: 1.1em; }
+
+/* 表格 */
+.table-wrap { background: #fff; border-radius: 10px; padding: 0 20px 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); overflow-x: auto; }
+table { width: 100%; border-collapse: collapse; font-size: 0.93em; }
+thead th { text-align: left; padding: 14px 10px; border-bottom: 2px solid #667eea; color: #667eea; font-weight: 600; white-space: nowrap; }
+tbody td { padding: 12px 10px; border-bottom: 1px solid #f0f0f0; }
+tbody tr:hover { background: #f8f9ff; }
+
+/* 成绩徽章 */
+.badge { display: inline-block; padding: 3px 10px; border-radius: 12px; font-size: 0.82em; font-weight: 600; color: #fff; }
+.badge-excellent { background: #2ecc71; }
+.badge-good { background: #3498db; }
+.badge-normal { background: #f39c12; }
+.badge-poor { background: #e74c3c; }
+
+/* 操作按钮 */
+.btn-edit { padding: 4px 12px; background: #2ecc71; color: #fff; border: none; border-radius: 6px; cursor: pointer; font-size: 0.82em; margin-right: 6px; }
+.btn-edit:hover { background: #27ae60; }
+.btn-del { padding: 4px 12px; background: #e74c3c; color: #fff; border: none; border-radius: 6px; cursor: pointer; font-size: 0.82em; }
+.btn-del:hover { background: #c0392b; }
+
+/* 统计 */
+.stats { background: #fff; border-radius: 10px; padding: 16px 20px; display: flex; gap: 14px; margin-top: 16px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
+.stat { flex: 1; text-align: center; padding: 14px 10px; border-radius: 8px; background: linear-gradient(135deg, #667eea, #764ba2); }
+.v { display: block; font-size: 1.5em; font-weight: 700; color: #fff; }
+.l { display: block; font-size: 0.78em; color: rgba(255,255,255,0.8); margin-top: 3px; }
+
+@media (max-width: 600px) {
+  .toolbar { flex-wrap: wrap; }
+  .stats { flex-direction: column; }
+}
+</style>
--- a/week7/frontend/vite.config.js
+++ b/week7/frontend/vite.config.js
@@ -0,0 +1,12 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+
+export default defineConfig({
+  plugins: [vue()],
+  server: {
+    port: 5173,
+    proxy: {
+      '/api': { target: 'http://localhost:8080', changeOrigin: true }
+    }
+  }
+})