first commit

src/layouts/default/content/useContentViewHeight.ts

@@ -0,0 +1,42 @@
+import { ref, computed, unref } from 'vue';
+import { createPageContext } from '/@/hooks/component/usePageContext';
+import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn';
+
+const headerHeightRef = ref(0);
+const footerHeightRef = ref(0);
+
+export function useLayoutHeight() {
+  function setHeaderHeight(val) {
+    headerHeightRef.value = val;
+  }
+  function setFooterHeight(val) {
+    footerHeightRef.value = val;
+  }
+  return { headerHeightRef, footerHeightRef, setHeaderHeight, setFooterHeight };
+}
+
+export function useContentViewHeight() {
+  const contentHeight = ref(window.innerHeight);
+  const pageHeight = ref(window.innerHeight);
+  const getViewHeight = computed(() => {
+    return unref(contentHeight) - unref(headerHeightRef) - unref(footerHeightRef) || 0;
+  });
+
+  useWindowSizeFn(
+    () => {
+      contentHeight.value = window.innerHeight;
+    },
+    100,
+    { immediate: true }
+  );
+
+  async function setPageHeight(height: number) {
+    pageHeight.value = height;
+  }
+
+  createPageContext({
+    contentHeight: getViewHeight,
+    setPageHeight,
+    pageHeight,
+  });
+}