feat: 完善登录角色切换和本地代理

README.md

@@ -30,7 +30,7 @@ pnpm install
 pnpm dev
 ```
 
-The local web app listens on `http://localhost:4301` by default. Set `VITE_API_BASE_URL=http://localhost:4300` to point the web app at the local API.
+本地前端默认监听 `http://localhost:4301`。如使用 `VITE_API_BASE_URL=http://localhost:4300`，浏览器会直接请求本地 API；如不设置该变量，Vite 会把 `/api` 默认代理到 `http://localhost:4300`，并自动去掉 `/api` 前缀。需要通过 `/api` 代理联调远端 API 时，可临时设置 `DEVOPS_API_PROXY_TARGET=https://devops.mrzhan.top/api`。
 
 ## 构建检查
 

src/services/devopsApi.ts

@@ -14,6 +14,7 @@ import type {
   CreateMemberPayload,
   DashboardSummary,
   EnvironmentName,
+  ForgotPasswordPayload,
   HealthState,
   IntegrationConfigKey,
   IntegrationConfigState,
@@ -140,6 +141,8 @@ interface BackendIntegrationConfigItem {
   configured?: string[]
   missing?: string[]
   optional?: string[]
+  enabled?: string[]
+  disabled?: string[]
   note?: string
   variableHelp?: Record<string, BackendVariableHelpValue>
   variableDescriptions?: Record<string, unknown>
@@ -259,6 +262,11 @@ export const devopsApi = {
     return data
   },
 
+  async forgotPassword(payload: ForgotPasswordPayload): Promise<void> {
+    await http.post('/auth/forgot-password', payload)
+    lastDataSource = 'backend'
+  },
+
   async logout(): Promise<void> {
     await http.post('/auth/logout')
     lastDataSource = 'backend'
@@ -594,6 +602,8 @@ function sanitizeIntegrationConfigStatus(
         const configured = sanitizeVariableNames(item.configured)
         const missing = sanitizeVariableNames(item.missing)
         const optional = sanitizeVariableNames(item.optional)
+        const enabled = sanitizeVariableNames(item.enabled)
+        const disabled = sanitizeVariableNames(item.disabled)
         const variableHelp = sanitizeVariableHelp(item)
 
         return {
@@ -604,6 +614,8 @@ function sanitizeIntegrationConfigStatus(
           configured,
           missing,
           optional,
+          enabled,
+          disabled,
           note: sanitizeIntegrationNote(item.note),
           ...(Object.keys(variableHelp).length > 0 ? { variableHelp } : {}),
         }

src/types/devops.ts

@@ -56,6 +56,10 @@ export interface LoginPayload {
   password: string
 }
 
+export interface ForgotPasswordPayload {
+  account: string
+}
+
 export interface LoginResult {
   token: string
   expiresAt: string
@@ -156,6 +160,8 @@ export interface IntegrationConfigItem {
   configured: string[]
   missing: string[]
   optional?: string[]
+  enabled?: string[]
+  disabled?: string[]
   note?: string
   variableHelp?: Record<string, IntegrationVariableHelp>
 }

src/views/LoginView.vue

@@ -4,17 +4,23 @@
  */
 import { Lock, Monitor } from '@element-plus/icons-vue'
 import { computed, reactive, ref } from 'vue'
-import { ElMessage } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
 import { useRoute, useRouter } from 'vue-router'
+import { devopsApi } from '../services/devopsApi'
 import { useSessionStore } from '../stores/session'
 
+type LoginRole = 'super_admin' | 'member'
+
+const SUPER_ADMIN_ACCOUNT = 'zhanxi'
 const route = useRoute()
 const router = useRouter()
 const session = useSessionStore()
 const loading = ref(false)
+const forgotPasswordLoading = ref(false)
+const loginRole = ref<LoginRole>('super_admin')
 
 const loginForm = reactive({
-  account: '',
+  account: SUPER_ADMIN_ACCOUNT,
   password: '',
 })
 
@@ -27,12 +33,33 @@ const passwordForm = reactive({
 const redirect = computed(() =>
   typeof route.query.redirect === 'string' ? route.query.redirect : '/overview',
 )
+const roleHint = computed(() =>
+  loginRole.value === 'super_admin'
+    ? '超级管理员不提供忘记密码入口，请通过服务器运维方式重置。'
+    : '普通成员首次登录或重置密码后，必须先修改初始密码。',
+)
+const isSuperAdminLogin = computed(() => loginRole.value === 'super_admin')
+
+function switchLoginRole(role: LoginRole) {
+  loginRole.value = role
+  loginForm.account = role === 'super_admin' ? SUPER_ADMIN_ACCOUNT : ''
+  loginForm.password = ''
+}
+
+function handleLoginRoleChange(value: unknown) {
+  if (value === 'super_admin' || value === 'member') {
+    switchLoginRole(value)
+  }
+}
 
 async function submitLogin() {
   loading.value = true
 
   try {
-    const user = await session.login(loginForm)
+    const user = await session.login({
+      account: isSuperAdminLogin.value ? SUPER_ADMIN_ACCOUNT : loginForm.account.trim(),
+      password: loginForm.password,
+    })
     passwordForm.currentPassword = loginForm.password
 
     if (user.mustChangePassword) {
@@ -48,6 +75,44 @@ async function submitLogin() {
   }
 }
 
+async function requestPasswordReset() {
+  if (isSuperAdminLogin.value) {
+    return
+  }
+
+  const account = loginForm.account.trim()
+
+  if (!account) {
+    ElMessage.warning('请先填写需要重置密码的成员账号')
+    return
+  }
+
+  try {
+    await ElMessageBox.confirm(
+      `确认向超级管理员发送账号 ${account} 的密码重置请求？`,
+      '忘记密码',
+      {
+        confirmButtonText: '发送请求',
+        cancelButtonText: '取消',
+        type: 'warning',
+      },
+    )
+  } catch {
+    return
+  }
+
+  forgotPasswordLoading.value = true
+
+  try {
+    await devopsApi.forgotPassword({ account })
+    ElMessage.success('已通知超级管理员协助重置密码')
+  } catch (error) {
+    ElMessage.error(error instanceof Error ? error.message : '发送重置请求失败')
+  } finally {
+    forgotPasswordLoading.value = false
+  }
+}
+
 async function submitPasswordChange() {
   if (passwordForm.newPassword !== passwordForm.confirmPassword) {
     ElMessage.error('两次输入的新密码不一致')
@@ -102,8 +167,24 @@ function accountLabel() {
       </div>
       <ElForm class="login-form" label-position="top" @submit.prevent="submit">
         <template v-if="!session.mustChangePassword">
+          <div class="role-switch">
+            <ElRadioGroup
+              :model-value="loginRole"
+              size="large"
+              @change="handleLoginRoleChange"
+            >
+              <ElRadioButton value="super_admin">超级管理员</ElRadioButton>
+              <ElRadioButton value="member">普通成员</ElRadioButton>
+            </ElRadioGroup>
+            <p>{{ roleHint }}</p>
+          </div>
           <ElFormItem label="账号">
-            <ElInput v-model="loginForm.account" size="large" autocomplete="username" />
+            <ElInput
+              v-model="loginForm.account"
+              size="large"
+              autocomplete="username"
+              :readonly="isSuperAdminLogin"
+            />
           </ElFormItem>
           <ElFormItem label="密码">
             <ElInput
@@ -123,6 +204,15 @@ function accountLabel() {
           >
             登录
           </ElButton>
+          <ElButton
+            v-if="!isSuperAdminLogin"
+            class="forgot-password"
+            text
+            :loading="forgotPasswordLoading"
+            @click="requestPasswordReset"
+          >
+            忘记密码
+          </ElButton>
         </template>
 
         <template v-else>
@@ -224,11 +314,41 @@ function accountLabel() {
   padding: 44px 36px;
 }
 
+.role-switch {
+  display: grid;
+  gap: 10px;
+  margin-bottom: 22px;
+}
+
+.role-switch :deep(.el-radio-group) {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  width: 100%;
+}
+
+.role-switch :deep(.el-radio-button__inner) {
+  width: 100%;
+  letter-spacing: 0;
+}
+
+.role-switch p {
+  min-height: 20px;
+  margin: 0;
+  color: #697386;
+  font-size: 13px;
+  line-height: 1.6;
+}
+
 .login-form .el-button {
   width: 100%;
   margin-top: 8px;
 }
 
+.forgot-password {
+  width: 100%;
+  margin-top: 10px;
+}
+
 .change-title {
   display: grid;
   gap: 4px;

src/views/SettingsView.vue

@@ -178,6 +178,20 @@ function variableGroups(item: IntegrationConfigItem): VariableGroup[] {
       emptyText: '无',
       tagType: 'danger',
     },
+    {
+      key: 'enabled',
+      label: '已开启',
+      names: item.enabled ?? [],
+      emptyText: '暂无',
+      tagType: 'success',
+    },
+    {
+      key: 'disabled',
+      label: '已关闭',
+      names: item.disabled ?? [],
+      emptyText: '暂无',
+      tagType: 'warning',
+    },
     {
       key: 'optional',
       label: '可选变量',

vite.config.ts

@@ -11,9 +11,10 @@ export default defineConfig({
     port: 4301,
     proxy: {
       '/api': {
-        target: process.env.DEVOPS_API_PROXY_TARGET ?? 'https://devops.mrzhan.top',
+        target: process.env.DEVOPS_API_PROXY_TARGET ?? 'http://localhost:4300',
         changeOrigin: true,
-        secure: true,
+        secure: false,
+        rewrite: (path) => path.replace(/^\/api/, ''),
       },
     },
   },