debugger
This commit is contained in:
@@ -35,10 +35,16 @@ const log = ref('')
|
||||
const updateInfo = () => {
|
||||
// 获取真实的视口高度(PWA 模式下准确)
|
||||
const vh = window.innerHeight
|
||||
const safeAreaBottom = getComputedStyle(document.documentElement).getPropertyValue('padding-bottom')
|
||||
|
||||
// 设置 CSS 变量,让所有组件使用准确的视口高度
|
||||
document.documentElement.style.setProperty('--vh', `${vh}px`)
|
||||
document.documentElement.style.setProperty('--vh-offset', `${vh}px`)
|
||||
|
||||
// 获取 TabBar 的实际高度
|
||||
const tabbar = document.querySelector('.van-tabbar')
|
||||
const tabbarHeight = tabbar ? tabbar.offsetHeight : 0
|
||||
|
||||
log.value = JSON.stringify({
|
||||
innerHeight: window.innerHeight,
|
||||
outerHeight: window.outerHeight,
|
||||
@@ -50,6 +56,9 @@ const updateInfo = () => {
|
||||
}
|
||||
: null,
|
||||
cssVarVh: getComputedStyle(document.documentElement).getPropertyValue('--vh'),
|
||||
tabbarHeight: tabbarHeight,
|
||||
safeAreaInsetBottom: safeAreaBottom,
|
||||
computedSpace: `${vh} - ${tabbarHeight} = ${vh - tabbarHeight}px`,
|
||||
}, null, 2)
|
||||
}
|
||||
|
||||
@@ -126,13 +135,19 @@ const handleTabClick = (path) => {
|
||||
|
||||
/* TabBar 固定在底部 */
|
||||
:deep(.van-tabbar) {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
position: fixed !important;
|
||||
bottom: 0 !important;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding-bottom: 0 !important;
|
||||
/* 移除可能的安全区域内边距 */
|
||||
padding-bottom: constant(safe-area-inset-bottom) !important;
|
||||
padding-bottom: env(safe-area-inset-bottom) !important;
|
||||
/* 重置所有 padding,然后只添加安全区域 */
|
||||
padding: 0 !important;
|
||||
padding-bottom: env(safe-area-inset-bottom, 0px) !important;
|
||||
height: 50px !important;
|
||||
min-height: 50px !important;
|
||||
}
|
||||
|
||||
/* 确保 TabBar 项目居中 */
|
||||
:deep(.van-tabbar-item) {
|
||||
padding: 0 !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -185,14 +185,29 @@ fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1)
|
||||
.calendar-container {
|
||||
/* 使用准确的视口高度减去 TabBar 高度(50px)和安全区域 */
|
||||
height: calc(var(--vh, 100vh) - 50px - env(safe-area-inset-bottom, 0px));
|
||||
max-height: calc(var(--vh, 100vh) - 50px - env(safe-area-inset-bottom, 0px));
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.calendar-container :deep(.van-calendar) {
|
||||
height: 100%;
|
||||
height: 100% !important;
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* 移除日历组件可能的底部 padding */
|
||||
.calendar-container :deep(.van-calendar__body) {
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.calendar-container :deep(.van-calendar__months) {
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.date-transactions {
|
||||
|
||||
@@ -572,7 +572,7 @@ onMounted(async () => {
|
||||
|
||||
.floating-search {
|
||||
position: fixed;
|
||||
bottom: 50px;
|
||||
bottom: 90px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
|
||||
Reference in New Issue
Block a user