添加sso

web/src/views/LoginView.vue

@@ -1,13 +1,16 @@
 <script setup lang="ts">
-import { reactive, ref } from 'vue'
+import { onMounted, reactive, ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { apiErrorMessage } from '../api/http'
 import { useAuthStore } from '../stores/auth'
+import http from '../api/http'
 
 const route = useRoute()
 const router = useRouter()
 const auth = useAuthStore()
 const loading = ref(false)
+const ssoLoading = ref(false)
+const sso = reactive({ enabled: false, displayName: '学校统一身份认证' })
 const form = reactive({
   userName: String(route.query.userName ?? ''),
   password: '',
@@ -24,6 +27,36 @@ async function submit() {
     loading.value = false
   }
 }
+
+function startSso() {
+  ssoLoading.value = true
+  const apiBaseUrl = String(import.meta.env.VITE_API_BASE_URL ?? '/api').replace(/\/$/, '')
+  const redirect = String(route.query.redirect ?? '/dashboard')
+  window.location.assign(
+    `${apiBaseUrl}/auth/sso/login?returnUrl=${encodeURIComponent(redirect)}`,
+  )
+}
+
+const ssoErrors: Record<string, string> = {
+  authentication_failed: '统一身份认证未完成，请重新尝试。',
+  missing_subject: 'Keycloak 未返回用户唯一标识，请联系管理员检查客户端映射。',
+  account_disabled: '教务系统账号已停用或锁定，请联系管理员。',
+  account_link_failed: '统一身份账号绑定失败，请联系管理员。',
+  account_update_failed: '登录状态更新失败，请稍后重试。',
+  binding_expired: '账户绑定请求已失效，请重新使用统一身份认证登录。',
+}
+
+onMounted(async () => {
+  const ssoError = String(route.query.ssoError ?? '')
+  if (ssoError) ElMessage.error(ssoErrors[ssoError] ?? '统一身份认证失败，请重新尝试。')
+  try {
+    const { data } = await http.get('/auth/sso/settings')
+    sso.enabled = Boolean(data.enabled)
+    sso.displayName = String(data.displayName || sso.displayName)
+  } catch {
+    sso.enabled = false
+  }
+})
 </script>
 
 <template>
@@ -82,6 +115,16 @@ async function submit() {
         >
           进入工作台
         </el-button>
+        <div v-if="sso.enabled" class="login-divider"><span>或</span></div>
+        <el-button
+          v-if="sso.enabled"
+          class="sso-login-submit"
+          size="large"
+          :loading="ssoLoading"
+          @click="startSso"
+        >
+          使用{{ sso.displayName }}登录
+        </el-button>
         <router-link class="public-timetable-link" to="/timetable">无需登录，查询班级课表 →</router-link>
         <router-link class="account-activation-link" to="/activate">学生首次登录？自助激活账号 →</router-link>
       </form>