From fa06fee64c13b08a5093ff68d563ecad1ba2a793 Mon Sep 17 00:00:00 2001
From: Mars <3361409208a@gmail.com>
Date: Mon, 22 Jun 2026 17:58:51 +0800
Subject: [PATCH] =?UTF-8?q?fix(player+admin):=20=E7=A7=BB=E5=8A=A8?=
=?UTF-8?q?=E7=AB=AF=20PWA=20=E5=AE=89=E5=85=A8=E5=8C=BA=E3=80=81=E9=98=B2?=
=?UTF-8?q?=E7=BC=A9=E6=94=BE=E4=B8=8E=E5=B1=80=E5=9F=9F=E7=BD=91=E8=B0=83?=
=?UTF-8?q?=E8=AF=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
玩家端适配主屏幕 safe-area、底部导航滚动隐藏与全屏布局；双端禁止页面缩放并开放 Vite host 供手机联调。
---
apps/admin/index.html | 2 +-
apps/admin/src/App.vue | 16 ++++
apps/admin/vite.config.ts | 1 +
apps/player/index.html | 6 +-
.../player/src/components/BackToTopButton.vue | 2 +-
apps/player/src/layouts/MainLayout.vue | 84 ++++++++++++++++---
apps/player/src/main.ts | 5 ++
apps/player/src/styles.css | 21 ++++-
apps/player/vite.config.ts | 1 +
9 files changed, 123 insertions(+), 15 deletions(-)
diff --git a/apps/admin/index.html b/apps/admin/index.html
index 5df508f..6ca70e8 100644
--- a/apps/admin/index.html
+++ b/apps/admin/index.html
@@ -2,7 +2,7 @@
-
+
diff --git a/apps/admin/src/App.vue b/apps/admin/src/App.vue
index 2d0df54..d805102 100644
--- a/apps/admin/src/App.vue
+++ b/apps/admin/src/App.vue
@@ -50,6 +50,22 @@ button { cursor: pointer; font-family: inherit; }
html, body {
scrollbar-width: none;
-ms-overflow-style: none;
+ touch-action: manipulation;
+}
+
+html {
+ -webkit-text-size-adjust: 100%;
+ text-size-adjust: 100%;
+}
+
+@media (max-width: 1023px) {
+ input,
+ select,
+ textarea,
+ .el-input__inner,
+ .el-textarea__inner {
+ font-size: 16px !important;
+ }
}
html::-webkit-scrollbar,
body::-webkit-scrollbar {
diff --git a/apps/admin/vite.config.ts b/apps/admin/vite.config.ts
index 5520ea0..089ed0a 100644
--- a/apps/admin/vite.config.ts
+++ b/apps/admin/vite.config.ts
@@ -73,6 +73,7 @@ export default defineConfig(({ mode }) => {
},
publicDir: resolve(__dirname, '../../packages/shared/public'),
server: {
+ host: true,
port: 5174,
proxy: {
'/api': { target: 'http://localhost:3000', changeOrigin: true },
diff --git a/apps/player/index.html b/apps/player/index.html
index c799e95..ab68476 100644
--- a/apps/player/index.html
+++ b/apps/player/index.html
@@ -2,8 +2,12 @@
-
+
+
+
+
+
diff --git a/apps/player/src/components/BackToTopButton.vue b/apps/player/src/components/BackToTopButton.vue
index 0088661..de19f30 100644
--- a/apps/player/src/components/BackToTopButton.vue
+++ b/apps/player/src/components/BackToTopButton.vue
@@ -53,7 +53,7 @@ const { visible, scrollToTop } = useBackToTop(toRef(props, 'scrollEl'));
}
.back-top-btn.above-nav {
- bottom: calc(68px + env(safe-area-inset-bottom, 0px));
+ bottom: calc(var(--player-bottom-nav-h, 54px) + var(--safe-bottom, env(safe-area-inset-bottom, 0px)) + 12px);
}
.back-top-btn:active {
diff --git a/apps/player/src/layouts/MainLayout.vue b/apps/player/src/layouts/MainLayout.vue
index e0f674c..3e0008a 100644
--- a/apps/player/src/layouts/MainLayout.vue
+++ b/apps/player/src/layouts/MainLayout.vue
@@ -10,7 +10,7 @@ import { useAppLocale } from '../composables/useAppLocale';
import AnnouncementMarquee from '../components/AnnouncementMarquee.vue';
import BottomNavIcon from '../components/BottomNavIcon.vue';
import BackToTopButton from '../components/BackToTopButton.vue';
-import { computed, defineAsyncComponent, onMounted, ref, watch } from 'vue';
+import { computed, defineAsyncComponent, onMounted, onUnmounted, ref, watch } from 'vue';
const BetSlipDrawer = defineAsyncComponent(() => import('../components/BetSlipDrawer.vue'));
import { usePlayerHome } from '../composables/usePlayerHome';
@@ -68,14 +68,36 @@ const { startPolling, stopPolling } = useDepositNotifications();
const { unreadCount, refreshUnreadCount, resetMessagesState } = usePlayerMessages();
const mainRef = ref(null);
const tabScrollTops = new Map();
+const bottomNavHidden = ref(false);
+let lastMainScrollTop = 0;
-watch(locale, (next, prev) => {
- if (prev && next !== prev) void loadPlayerHome(true);
+function onMainScroll() {
+ const el = mainRef.value;
+ if (!el || !showBottomNav.value) return;
+
+ const scrollTop = el.scrollTop;
+ const delta = scrollTop - lastMainScrollTop;
+
+ if (scrollTop <= 8) {
+ bottomNavHidden.value = false;
+ } else if (delta > 10) {
+ bottomNavHidden.value = true;
+ } else if (delta < -10) {
+ bottomNavHidden.value = false;
+ }
+
+ lastMainScrollTop = scrollTop;
+}
+
+watch(showBottomNav, (visible) => {
+ if (!visible) bottomNavHidden.value = false;
});
watch(
() => route.fullPath,
(_path, oldPath) => {
+ lastMainScrollTop = 0;
+ bottomNavHidden.value = false;
const el = mainRef.value;
if (!el) return;
if (oldPath) tabScrollTops.set(oldPath, el.scrollTop);
@@ -84,10 +106,22 @@ watch(
);
const balanceRefreshPaths = ['/profile', '/wallet', '/bets'];
+let mainScrollEl: HTMLElement | null = null;
+
+watch(locale, (next, prev) => {
+ if (prev && next !== prev) void loadPlayerHome(true);
+});
onMounted(() => {
if (auth.user?.locale) void initFromUser(auth.user.locale);
bindProfileVisibilityRefresh();
+ mainScrollEl = mainRef.value;
+ mainScrollEl?.addEventListener('scroll', onMainScroll, { passive: true });
+});
+
+onUnmounted(() => {
+ mainScrollEl?.removeEventListener('scroll', onMainScroll);
+ mainScrollEl = null;
});
watch(
@@ -176,7 +210,12 @@ watch(
-