fix(ai): 窄屏下保证「进入后台」入口与对话区可见

测试反馈学生在 admin 侧看不到后台管理入口。桌面端入口正常;窄屏/手机上侧栏被历史列表的固定高度撑满(接近 100vh),底部按钮落到地址栏之后,对话区也被顶出视口。窄屏改为 dvh + 侧栏限高,历史列表自适应,固定 800px 的对话块改为 100%,并清掉调试日志。
This commit is contained in:
2026-10-24 18:10:08 +08:00
parent 77378a2791
commit 6f35844fa4
+35 -6
View File
@@ -561,7 +561,6 @@ const userStore = useUserStore();
const { push } = useRouter();
const route = useRoute();
const loginUser = computed(() => userStore.info ?? {});
console.log('loginUser', loginUser)
const userName = computed(
() =>
loginUser.value.nickname ||
@@ -1736,9 +1735,7 @@ const goAdmin = async () => {
return;
}
const authorityTree = buildAuthorityTree(loginUser.value.authorities);
console.log('authorityTree', authorityTree)
const firstPath = findFirstChildMenuPath(authorityTree);
console.log('firstPath', firstPath)
if (!firstPath) {
message.warning("当前用户没有可进入的后台菜单");
@@ -2853,23 +2850,55 @@ export default {
}
@media screen and (max-width: 1200px) {
/*
窄屏/移动端把侧栏收成顶部一块,而不是让它按历史列表的固定高度撑满整屏:
否则 .chat-sidebar 会接近 100vh,底部的「进入后台」「退出登录」被挤到
浏览器地址栏/工具栏后面(手机上看起来就是没有入口),对话区也会被顶出视口。
这里用 dvh 跟随移动端动态视口,旧浏览器回退到 vh。
*/
.chat-page {
flex-direction: column;
height: 100%;
height: 100vh;
height: 100dvh;
min-height: 0;
overflow: hidden;
}
.chat-sidebar {
width: 100%;
max-height: 52vh;
max-height: 52dvh;
padding: 16px 16px 12px;
border-right: none;
border-bottom: 1px solid #c7e8ff;
}
.chat-main {
padding: 24px 24px 0;
.brand-block,
.new-chat-btn,
.sidebar-footer {
flex-shrink: 0;
}
.history-block {
height: auto;
flex: 1 1 auto;
min-height: 0;
margin-top: 16px;
}
.sidebar-footer {
margin-top: 8px;
}
.chat-main {
flex: 1 1 auto;
min-height: 0;
padding: 16px 16px 0;
}
/* 桌面端这些块固定 800px 宽,窄屏下会顶出右边界被裁掉 */
.chat-body,
.input-shell,
.history-banner {
width: 100%;
}