版本号

web/package.json

@@ -1,7 +1,7 @@
 {
   "name": "web",
   "private": true,
-  "version": "1.0.0",
+  "version": "2.2.0-rc1",
   "type": "module",
   "scripts": {
     "dev": "vite",

web/src/App.vue

@@ -1,8 +1,10 @@
 <script setup lang="ts">
+import SiteFooter from './components/SiteFooter.vue'
 import SmartLaunchScreen from './components/SmartLaunchScreen.vue'
 </script>
 
 <template>
   <SmartLaunchScreen />
   <RouterView />
+  <SiteFooter />
 </template>

web/src/components.d.ts

@@ -57,6 +57,7 @@ declare module 'vue' {
     RichMessageContent: typeof import('./components/RichMessageContent.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
+    SiteFooter: typeof import('./components/SiteFooter.vue')['default']
     SmartLaunchScreen: typeof import('./components/SmartLaunchScreen.vue')['default']
   }
   export interface GlobalDirectives {

web/src/components/SiteFooter.vue

@@ -0,0 +1,105 @@
+<script setup lang="ts">
+import { onMounted, ref } from 'vue'
+import http from '../api/http'
+
+interface SystemVersionResponse {
+  version: string
+}
+
+const backendVersion = ref('获取中')
+const currentYear = new Date().getFullYear()
+const frontendVersion = __APP_VERSION__
+
+onMounted(async () => {
+  try {
+    const { data } = await http.get<SystemVersionResponse>('/system/version')
+    backendVersion.value = data.version ? `v${data.version}` : '未知'
+  } catch {
+    backendVersion.value = '未知'
+  }
+})
+</script>
+
+<template>
+  <footer class="site-footer" aria-label="网站版权与版本信息">
+    <div class="site-footer-inner">
+      <p>© {{ currentYear }} 明序教务 · 版权所有</p>
+      <div class="version-list" aria-label="系统版本">
+        <span>前端版本 <b>v{{ frontendVersion }}</b></span>
+        <span>后端版本 <b>{{ backendVersion }}</b></span>
+      </div>
+    </div>
+  </footer>
+</template>
+
+<style scoped>
+.site-footer {
+  position: relative;
+  z-index: 1;
+  border-top: 1px solid rgba(255, 255, 255, .1);
+  color: #d9e0f2;
+  background:
+    linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px),
+    linear-gradient(112deg, #152550 0%, #1d326c 72%, #176a70 130%);
+  background-size: 28px 28px, auto;
+}
+
+.site-footer-inner {
+  min-height: 58px;
+  max-width: 1540px;
+  margin: 0 auto;
+  padding: 11px 32px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 20px;
+}
+
+.site-footer p {
+  margin: 0;
+  font-size: 12px;
+  letter-spacing: .04em;
+}
+
+.version-list {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.version-list span {
+  padding: 5px 9px;
+  border: 1px solid rgba(255, 255, 255, .14);
+  border-radius: 4px;
+  color: #aeb9d8;
+  background: rgba(255, 255, 255, .055);
+  font-size: 10px;
+  white-space: nowrap;
+}
+
+.version-list b {
+  margin-left: 5px;
+  color: #66d5c5;
+  font: 700 10px/1.2 Consolas, monospace;
+}
+
+@media (max-width: 600px) {
+  .site-footer-inner {
+    min-height: 72px;
+    padding: 10px 14px;
+    align-items: flex-start;
+    flex-direction: column;
+    justify-content: center;
+    gap: 7px;
+  }
+
+  .version-list {
+    width: 100%;
+  }
+
+  .version-list span {
+    flex: 1;
+    text-align: center;
+  }
+}
+</style>

web/src/env.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="vite/client" />
+
+declare const __APP_VERSION__: string

web/vite.config.ts

@@ -1,15 +1,23 @@
 import { defineConfig, loadEnv } from 'vite'
+import { readFileSync } from 'node:fs'
 import vue from '@vitejs/plugin-vue'
 import AutoImport from 'unplugin-auto-import/vite'
 import Components from 'unplugin-vue-components/vite'
 import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
 
+const packageJson = JSON.parse(
+  readFileSync(new URL('./package.json', import.meta.url), 'utf8'),
+) as { version: string }
+
 // https://vite.dev/config/
 export default defineConfig(({ mode }) => {
   const env = loadEnv(mode, process.cwd(), '')
   const isCapacitor = env.VITE_ROUTER_MODE === 'hash'
 
   return {
+    define: {
+      __APP_VERSION__: JSON.stringify(packageJson.version),
+    },
     plugins: [
       vue(),
       AutoImport({