Files
medical-mall/pages/user/boot.uvue
2026-01-22 08:54:47 +08:00

167 lines
3.2 KiB
Plaintext

<template>
<view class="page">
<view class="splash">
<view class="brand">
<view class="brand-mark"></view>
<view class="brand-text">
<text class="brand-name">Mall</text>
<text class="brand-slogan">正品保障 · 省心售后</text>
</view>
</view>
<view class="status">
<view class="spinner"></view>
<text class="status-text">正在检查登录状态…</text>
<text class="status-sub">通常数秒内自动进入首页或登录页</text>
</view>
<view class="actions">
<navigator url="/pages/user/login" open-type="reLaunch" class="action primary">前往登录</navigator>
<navigator url="/pages/user/register" open-type="navigate" class="action ghost">我要注册</navigator>
</view>
</view>
</view>
</template>
<script lang="uts">
import supa from '@/components/supadb/aksupainstance.uts'
export default {
onLoad() {
// 启动页:根据登录态重定向
setTimeout(() => {
console.log('boot onLoad: start redirect check')
try {
const sessionInfo = supa.getSession();
if (sessionInfo != null && sessionInfo.user != null) {
// 已登录 -> 直接进入消费者端首页
console.log('boot onLoad: found session, go consumer/index')
uni.reLaunch({ url: '/pages/mall/consumer/index' });
return;
}
} catch (e) {}
console.log('boot onLoad: no session, go login')
// 未登录 -> 登录页
uni.reLaunch({ url: '/pages/user/login' });
}, 0);
}
};
</script>
<style>
.page {
min-height: 100vh;
background: linear-gradient(180deg, #ffffff 0%, #f5f7fa 100%);
display: flex;
align-items: center;
justify-content: center;
padding: 48rpx 32rpx;
}
.splash {
width: 100%;
max-width: 640rpx;
background: #ffffff;
border-radius: 24rpx;
box-shadow: 0 12rpx 48rpx rgba(0, 0, 0, 0.08);
padding: 48rpx 40rpx;
display: flex;
flex-direction: column;
gap: 32rpx;
}
.brand {
display: flex;
align-items: center;
gap: 20rpx;
}
.brand-mark {
width: 80rpx;
height: 80rpx;
border-radius: 24rpx;
background: linear-gradient(135deg, #ff6b6b, #ff9f43);
}
.brand-text {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.brand-name {
font-size: 36rpx;
font-weight: 700;
color: #111827;
}
.brand-slogan {
font-size: 26rpx;
color: #6b7280;
}
.status {
display: flex;
flex-direction: column;
align-items: center;
gap: 12rpx;
text-align: center;
}
.spinner {
width: 88rpx;
height: 88rpx;
border-radius: 50%;
border: 8rpx solid #f3f4f6;
border-top-color: #ff6b6b;
animation: spin 1s linear infinite;
}
.status-text {
font-size: 30rpx;
color: #111827;
font-weight: 600;
}
.status-sub {
font-size: 24rpx;
color: #6b7280;
}
.actions {
display: flex;
flex-direction: column;
gap: 16rpx;
}
.action {
width: 100%;
text-align: center;
padding: 24rpx;
border-radius: 16rpx;
font-size: 28rpx;
font-weight: 600;
}
.action.primary {
background: linear-gradient(135deg, #ff6b6b, #ff9f43);
color: #ffffff;
}
.action.ghost {
border: 2rpx solid #e5e7eb;
color: #374151;
background: #ffffff;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
</style>