<script lang="ts" setup>
|
import { computed } from 'vue';
|
|
import { AuthPageLayout } from '@vben/layouts';
|
import { preferences } from '@vben/preferences';
|
|
import { $t } from '#/locales';
|
import { terminalType } from '#/mobile/terminal';
|
|
declare const __APP_LOGO__: string;
|
|
const appName = computed(() => '种植业数字化平台');
|
const logo = computed(() => __APP_LOGO__ || preferences.logo.source);
|
const logoDark = computed(() => preferences.logo.sourceDark);
|
</script>
|
|
<template>
|
<main v-if="terminalType === 'mobile'" class="mobile-login-shell">
|
<header><strong>MOM</strong><span>{{appName}}</span></header>
|
<section><RouterView /></section>
|
</main>
|
<AuthPageLayout
|
v-else
|
:app-name="appName"
|
:logo="logo"
|
:logo-dark="logoDark"
|
page-description="数字赋能农业 · 科技引领未来"
|
page-title="种植业数字化平台"
|
>
|
<!-- 自定义工具栏 -->
|
<!-- <template #toolbar></template> -->
|
</AuthPageLayout>
|
</template>
|
|
<style scoped>
|
.mobile-login-shell { width:100%;max-width:480px;min-height:100dvh;margin:0 auto;padding:24px 24px 32px;background:#f8fafc;color:#0f172a;color-scheme:light; }
|
.mobile-login-shell header { display:flex;align-items:center;gap:12px;margin:8px 0 32px;font-size:18px; }
|
.mobile-login-shell header strong { color:#0369a1;font-size:20px; }
|
.mobile-login-shell section { padding:24px 20px;border:1px solid #e2e8f0;border-radius:12px;background:#fff; }
|
.mobile-login-shell :deep(input) { font-size:16px;min-height:48px; }
|
.mobile-login-shell :deep(button[aria-label^='登录']) { min-height:52px;background:#0369a1;box-shadow:none;border-radius:8px;letter-spacing:normal; }
|
.mobile-login-shell :deep(.dark) { color-scheme:light; }
|
@media(max-width:380px) { .mobile-login-shell {padding:16px;} .mobile-login-shell section {padding:20px 16px;} }
|
</style>
|
