lzh
e3f12e4548
视觉与品牌 - public/logo.svg、public/login-illustration.svg、favicon 替换为 logo.svg。 - preferences.ts 新增 logo.source 指向 /logo.svg。 - packages/effects/layouts 导出 LoginIllustration 共享组件（浮动插画，加载失败自动隐藏）。 Auth 布局重构 - layouts/auth.vue 替换默认 AuthPageLayout：主题色渐变背景 + 左侧浮动插画 + 品牌卡片 + 右上 LanguageToggle + 圆角登录卡片；KeepAlive 仅缓存 Login （CodeLogin/QrCodeLogin 需要每次刷新验证码/二维码）。 - 表单样式通过 :deep(.login-form-container) 覆盖输入框、选择框、主按钮， 全部走 --primary 变量，与主题色联动。 登录组件 - views/_core/authentication/login.vue: 关闭默认 codeLogin/qrcodeLogin/ thirdPartyLogin/register/docLink，改为手机 / 二维码 / 企微三按钮（IconifyIcon）； 三方登录前检查租户，缺失时 message.warning + validateField。 - packages/effects/common-ui/authentication/login.vue + types.ts: 新增 showDocLink prop（默认 true），替代原本 HTML 注释掉 DocLink 的做法。 - sso-callback.vue: 等待提示改为 LottieLoading 动画。 Lottie 启动动画 - 新增 loading.html（注入进 index.html）+ public/loading.json + 运行时拷贝的 public/lottie_light.min.js（.gitignore 忽略）。 - 新增 public/lottie-tint.js：共享主题色适配器（LIGHTNESSES / SHADE_MAP / hslToRgb / patchColors / readPrimary），同时被启动白屏脚本与 Vue 组件使用， 消除两份几乎一致的实现。 - 新增 src/components/lottie-loading/LottieLoading.vue：按需加载 lottie-tint.js 并根据 CSS 变量 --primary 重新上色。 - vite.config.mts 新增 copyLottiePlayer 插件：configResolved 时无条件把 node_modules/lottie-web/.../lottie_light.min.js 拷到 public/，避免 mtime 误判。 - package.json 新增 lottie-web ^5.13.0 依赖。 i18n - 新增 otherLoginMethods / contactSupport / weComLogin 三个文案（zh-CN / en-US）。 Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
78 lines
1.8 KiB
HTML
78 lines
1.8 KiB
HTML
<style data-app-loading="inject-css">
|
|
html {
|
|
/* same as ant-design-vue/dist/reset.css setting */
|
|
line-height: 1.15;
|
|
}
|
|
|
|
.loading {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 9999;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
background-color: #f4f7f9;
|
|
}
|
|
|
|
.loading.hidden {
|
|
visibility: hidden;
|
|
pointer-events: none;
|
|
opacity: 0;
|
|
transition: all 0.8s ease-out;
|
|
}
|
|
|
|
.dark .loading {
|
|
background: #0d0d10;
|
|
}
|
|
|
|
.title {
|
|
margin-top: 24px;
|
|
font-family:
|
|
-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',
|
|
Arial, sans-serif !important;
|
|
font-size: 24px;
|
|
font-weight: 600 !important;
|
|
color: rgb(0 0 0 / 85%) !important;
|
|
}
|
|
|
|
.dark .title {
|
|
color: #fff !important;
|
|
}
|
|
|
|
#__app-loading-lottie__ {
|
|
width: 220px;
|
|
height: 220px;
|
|
}
|
|
</style>
|
|
<div class="loading" id="__app-loading__">
|
|
<div id="__app-loading-lottie__"></div>
|
|
<div class="title"><%= VITE_APP_TITLE %></div>
|
|
</div>
|
|
<script src="/lottie_light.min.js"></script>
|
|
<script src="/lottie-tint.js"></script>
|
|
<script>
|
|
(function () {
|
|
var container = document.getElementById('__app-loading-lottie__');
|
|
if (!container || typeof lottie === 'undefined' || !window.__lottieTint) return;
|
|
var tint = window.__lottieTint;
|
|
fetch('/loading.json')
|
|
.then(function (r) { return r.json(); })
|
|
.then(function (data) {
|
|
var shades = tint.buildShades(tint.readPrimary());
|
|
lottie.loadAnimation({
|
|
container: container,
|
|
renderer: 'svg',
|
|
loop: true,
|
|
autoplay: true,
|
|
animationData: tint.patchColors(data, shades),
|
|
});
|
|
})
|
|
.catch(function (e) { console.error('[app-loading] lottie error', e); });
|
|
})();
|
|
</script>
|