From 76f8e8752d86bda1e23d18745c4e81e94fc396d8 Mon Sep 17 00:00:00 2001
From: BackRunner <dev@backrunner.top>
Date: Wed, 28 Feb 2024 17:42:55 +0800
Subject: [PATCH] fix: (layout) height property in header and footer now is
 responsive

---
 src/packages/layout/components/AFooter.vue | 10 +++++-----
 src/packages/layout/components/AHeader.vue | 10 +++++-----
 2 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/packages/layout/components/AFooter.vue b/src/packages/layout/components/AFooter.vue
index dbebcb4..df7b6c3 100644
--- a/src/packages/layout/components/AFooter.vue
+++ b/src/packages/layout/components/AFooter.vue
@@ -5,7 +5,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
+import { computed, defineComponent } from 'vue';
 
 export default defineComponent({
   props: {
@@ -16,10 +16,10 @@ export default defineComponent({
     },
   },
   setup(props) {
-    const height = typeof props.height === 'number' ? `${props.height}px` : props.height;
-    const styles = {
-      height: height || '',
-    };
+    const height = computed(() => typeof props.height === 'number' ? `${props.height}px` : props.height);
+    const styles = computed(() => ({
+      height: height.value || '',
+    }));
     return {
       styles,
     };
diff --git a/src/packages/layout/components/AHeader.vue b/src/packages/layout/components/AHeader.vue
index 12545ea..c136d8b 100644
--- a/src/packages/layout/components/AHeader.vue
+++ b/src/packages/layout/components/AHeader.vue
@@ -5,7 +5,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
+import { computed, defineComponent } from 'vue';
 
 export default defineComponent({
   props: {
@@ -16,10 +16,10 @@ export default defineComponent({
     },
   },
   setup(props) {
-    const height = typeof props.height === 'number' ? `${props.height}px` : props.height;
-    const styles = {
-      height: height || '',
-    };
+    const height = computed(() => typeof props.height === 'number' ? `${props.height}px` : props.height);
+    const styles = computed(() => ({
+      height: height.value || '',
+    }));
     return {
       styles,
     };