Преглед изворни кода

cl-footer 高度做隔离处理,不遮挡主题切换

icssoa пре 7 месеци
родитељ
комит
7dccf02c03

+ 1 - 1
package.json

@@ -1,6 +1,6 @@
 {
 	"name": "cool-unix",
-	"version": "8.0.13",
+	"version": "8.0.14",
 	"license": "MIT",
 	"scripts": {
 		"build-ui": "node ./uni_modules/cool-ui/scripts/generate-types.js",

+ 3 - 0
uni_modules/cool-ui/components/cl-back-top/cl-back-top.uvue

@@ -15,6 +15,7 @@
 import { getTabBarHeight, hasCustomTabBar, scroller } from "@/cool";
 import { computed, onMounted, ref, watch, type PropType } from "vue";
 import { usePage } from "../../hooks";
+import { clFooterOffset } from "../cl-footer/offset";
 
 defineOptions({
 	name: "cl-back-top"
@@ -43,6 +44,8 @@ const bottom = computed(() => {
 
 	if (hasCustomTabBar()) {
 		h += getTabBarHeight();
+	} else {
+		h += clFooterOffset.get();
 	}
 
 	return h + "px";

+ 4 - 0
uni_modules/cool-ui/components/cl-float-view/cl-float-view.uvue

@@ -14,6 +14,7 @@
 <script setup lang="ts">
 import { getSafeAreaHeight, getTabBarHeight, hasCustomTabBar, router } from "@/cool";
 import { computed, reactive } from "vue";
+import { clFooterOffset } from "../cl-footer/offset";
 
 defineOptions({
 	name: "cl-float-view"
@@ -109,6 +110,9 @@ const viewStyle = computed(() => {
 	// 标签页需要额外减去标签栏高度和安全区域
 	if (hasCustomTabBar()) {
 		bottomOffset += getTabBarHeight();
+	} else {
+		// 获取其他组件注入的底部偏移
+		bottomOffset += clFooterOffset.get();
 	}
 
 	// 设置水平位置

+ 4 - 0
uni_modules/cool-ui/components/cl-footer/cl-footer.uvue

@@ -23,6 +23,7 @@
 import { getSafeAreaHeight, isDark, isHarmony, parsePt } from "@/cool";
 import { computed, getCurrentInstance, nextTick, onMounted, ref, watch } from "vue";
 import type { PassThroughProps } from "../../types";
+import { clFooterOffset } from "./offset";
 
 defineOptions({
 	name: "cl-footer"
@@ -77,6 +78,9 @@ function getHeight() {
 
 						// 如果内容高度大于最小高度,则显示
 						visible.value = h > props.minHeight + getSafeAreaHeight("bottom");
+
+						// 隔离高度
+						clFooterOffset.set(visible.value ? h : 0);
 					})
 					.exec();
 			},

+ 16 - 0
uni_modules/cool-ui/components/cl-footer/offset.ts

@@ -0,0 +1,16 @@
+import { router } from "@/cool";
+import { reactive } from "vue";
+
+export class ClFooterOffset {
+	private data = reactive({});
+
+	set(value: number): void {
+		this.data[router.path()] = value;
+	}
+
+	get(): number {
+		return (this.data[router.path()] as number | null) ?? 0;
+	}
+}
+
+export const clFooterOffset = new ClFooterOffset();