feat:登录页面优化

frontend/src/views/layout/AppLayout.vue

@@ -13,10 +13,12 @@ const menus = computed(() => [
   { to: '/orders', label: '订单', perm: 'orders:read' },
   { to: '/import', label: '导入', perm: 'import:preview' },
   { to: '/settings/customers', label: '客户', perm: 'dict:read' },
-  { to: '/settings/statuses', label: '状态', perm: 'dict:read' },
+  { to: '/settings/statuses', label: '状态', perm: 'dict:read' }
 ])
 
 async function logout() {
+  const res = confirm('确认退出登录吗？')
+  if (!res) return
   try {
     if (auth.refreshToken) await apiLogout({ refreshToken: auth.refreshToken })
   } finally {
@@ -37,7 +39,11 @@ async function logout() {
               v-if="auth.hasPerm(m.perm)"
               :to="m.to"
               class="block rounded px-3 py-2 text-sm hover:bg-slate-800/60"
-              :class="route.path === m.to ? 'bg-slate-800/80 text-white' : 'text-slate-300'"
+              :class="
+                route.path === m.to
+                  ? 'bg-slate-800/80 text-white'
+                  : 'text-slate-300'
+              "
             >
               {{ m.label }}
             </RouterLink>
@@ -46,9 +52,18 @@ async function logout() {
       </aside>
 
       <main class="flex min-w-0 flex-1 flex-col">
-        <header class="flex items-center justify-between border-b border-slate-800 bg-slate-950/60 px-4 py-3">
+        <header
-          <div class="text-sm text-slate-300">欢迎，{{ auth.user?.displayName || auth.user?.username }}</div>
+          class="flex items-center justify-between border-b border-slate-800 bg-slate-950/60 px-4 py-3"
-          <button class="rounded bg-slate-800 px-3 py-1.5 text-sm hover:bg-slate-700" @click="logout">退出登录</button>
+        >
+          <div class="text-sm text-slate-300">
+            欢迎，{{ auth.user?.displayName || auth.user?.username }}
+          </div>
+          <button
+            class="rounded bg-slate-800 px-3 py-1.5 text-sm hover:bg-slate-700"
+            @click="logout"
+          >
+            退出登录
+          </button>
         </header>
         <div class="app-scroll min-h-0 flex-1 overflow-y-auto p-4">
           <RouterView />

frontend/src/views/login/LoginView.vue

@@ -1,15 +1,15 @@
 <script setup lang="ts">
-import { ref } from 'vue'
-import { useRoute, useRouter } from 'vue-router'
 import { apiLogin } from '@/api/auth'
 import { useAuthStore } from '@/stores/auth'
+import { ref } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
 
 const router = useRouter()
 const route = useRoute()
 const auth = useAuthStore()
 
-const username = ref('admin')
+const username = ref('')
-const password = ref('admin123')
+const password = ref('')
 const loading = ref(false)
 const errMsg = ref('')
 
@@ -33,8 +33,10 @@ async function submit() {
 <template>
   <div class="h-full bg-slate-950 text-slate-100 flex items-center justify-center px-4">
     <div class="w-full max-w-sm rounded-xl border border-slate-800 bg-slate-900/40 p-6">
-      <div class="text-lg font-semibold">登录</div>
+      <div class="text-lg font-semibold text-center">登录</div>
-      <div class="mt-1 text-sm text-slate-400">默认账号：admin / admin123</div>
+      <!-- <div class="mt-1 text-sm text-slate-400">默认账号：admin / admin123</div> -->
+      <!-- <div class="mt-1 text-sm text-slate-400">请输入账号/密码登陆</div> -->
+
 
       <div v-if="errMsg" class="mt-4 rounded bg-red-500/10 px-3 py-2 text-sm text-red-200">
         {{ errMsg }}
@@ -43,13 +45,16 @@ async function submit() {
       <form class="mt-4 space-y-3" @submit.prevent="submit">
         <div>
           <div class="mb-1 text-sm text-slate-300">账号</div>
-          <input v-model="username" class="w-full rounded bg-slate-950/60 px-3 py-2 text-sm outline-none ring-1 ring-slate-800 focus:ring-slate-600" />
+          <input v-model="username" 
+          placeholder="请输入账号"
+          class="w-full rounded bg-slate-950/60 px-3 py-2 text-sm outline-none ring-1 ring-slate-800 focus:ring-slate-600" />
         </div>
         <div>
           <div class="mb-1 text-sm text-slate-300">密码</div>
           <input
             v-model="password"
             type="password"
+            placeholder="请输入密码"
             class="w-full rounded bg-slate-950/60 px-3 py-2 text-sm outline-none ring-1 ring-slate-800 focus:ring-slate-600"
           />
         </div>