Files
Home-Care/hss-home-service/website/pages/platform/login.vue
comclib c02029a5f3 feat: 初始化居家上门服务系统完整项目代码
- Spring Boot 后端服务 (hss-home-service)
- delivery-miniapp 配送小程序
- website 官网 (Nuxt)
- docs 架构设计文档
- Docker 容器化部署配置

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-19 09:04:49 +08:00

60 lines
2.3 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<script setup lang="ts">
definePageMeta({ ssr: false })
import { ref } from 'vue'
import { usePlatformAuth } from '~/composables/usePlatformAuth'
const { login, PRESET_USERS } = usePlatformAuth()
const selected = ref('admin')
const loading = ref(false)
const error = ref('')
async function doLogin() {
loading.value = true; error.value = ''
const u = login(selected.value)
if (u) {
await navigateTo('/platform')
} else {
error.value = '登录失败'
}
loading.value = false
}
</script>
<template>
<div class="min-h-screen bg-surface flex items-center justify-center p-4">
<div class="w-full max-w-md">
<div class="text-center mb-8">
<div class="w-16 h-16 mx-auto mb-4 rounded-2xl bg-gradient-to-br from-primary to-accent flex items-center justify-center">
<span class="text-white font-bold text-2xl font-mono">H</span>
</div>
<h1 class="text-2xl font-bold">智慧医养居家上门服务平台</h1>
<p class="text-text-secondary text-sm mt-2">演示环境 选择角色即可登录</p>
</div>
<div class="bg-white rounded-2xl shadow-sm border p-6 space-y-4">
<label class="block text-sm font-medium text-text-secondary">选择登录角色</label>
<div class="grid grid-cols-2 gap-2">
<button v-for="(u, k) in PRESET_USERS" :key="k"
@click="selected = k"
class="text-left px-4 py-3 rounded-xl border-2 transition-all text-sm"
:class="selected === k ? 'border-primary bg-primary-50 text-primary' : 'border-gray-100 hover:border-gray-200'">
<div class="font-medium">{{ u.userName }}</div>
<div class="text-xs text-text-secondary">{{ u.userRole }}</div>
</button>
</div>
<p v-if="error" class="text-red-500 text-sm text-center">{{ error }}</p>
<button @click="doLogin" :disabled="loading"
class="w-full py-3 bg-primary text-white rounded-xl font-semibold hover:bg-primary-700 transition-colors disabled:opacity-50">
{{ loading ? '登录中...' : '进入平台' }}
</button>
<p class="text-xs text-text-secondary text-center">
演示环境使用 Header 认证无需密码选择角色后直接进入对应工作台
</p>
</div>
</div>
</div>
</template>