fix(Wrapper): 修复在高度不固定时Footer不在页脚

当 container 中的内容需要通过 Axios 动态从 API 获取时，由于从获取数据到渲染完成，container 的高
度一直保持固定，故会出现 container 实际内容把高度“撑”到 100% 以上时，渲染器仍以为 container 高
度为设定的 min-height 值，此时 Footer 也依旧在 100% 的位置，而不是意料中的页脚。

因此，为了使得 Footer 始终处于页脚，此 commit 在内容 slot 外的 container 改为两层。如此，数据加
载把 inner-container 的高度“撑”起来之后，outer-container 也能够获得完整高度，而不是像之前固定在
100%，从而使得 Footer 也能顺应 outer-container 的高度变化而正常位于页脚。

同时，此 commit 将 Footer 的边距的实现从 p 的 margin 改为了自身的 padding，防止在 outer-padding
高度大于 100% 时，下边距被浏览器吞掉。

Signed-off-by: crrashh1542 <kotsuki@crrashh.com>

src/components/Footer.vue

@@ -15,9 +15,9 @@ defineOptions({ name: 'MainFooter' })
 <style lang="less" scoped>
 @import url('@/styles/global.less');
 .footer {
-
     border-top: 1px solid @wu-color-border;
-    padding: 0 36px;
+    padding: 1em 36px;
     width: calc(100% - 72px);
+    p { margin: 0; }
 }
 </style>

src/components/Wrapper.vue

@@ -40,10 +40,17 @@ const appVersion = ref(version)
 
         <!-- Part 3 ---- 主体部分 -->
         <main>
-            <div class="container">
-                <slot />
+            <!--
+                此处 container 用于将内容包装在一个 div 内，保证 flex 中只有一个 div 和 footer，
+                以达到 footer 始终置底的效果。此处套用两层 div，是为了让内容能够获得完整高度；
+                若只套用一层 div，即使设置了 min-height，内容高度也只有 100% - 36px（见 L161）
+            -->
+            <div class="container-outer">
+                <div class="container-inner">
+                    <slot />
+                </div>
+                <Foo />
             </div>
-            <Foo />
         </main>
 
 </template>
@@ -150,12 +157,14 @@ main {
     // 设置 flex 是为了能让 footer 始终置于页面底部
     flex-direction: column;
     justify-content: space-between;
-    .container { // 此处 container 用于将内容包装在一个 div 内，保证 flex 中只有一个 div 和 footer，防止冲突
-        display: relative;
-        height: calc(100% - 36px);
-        width: calc(100% - 72px);
-        padding: 24px 36px 12px;
-
+    .container-outer {
+        min-height: calc(100% - 72px);
+        padding: 24px 0 0;
+        .container-inner {
+            padding: 0 36px;
+            width: calc(100% - 72px);
+            min-height: calc(100% - 36px);
+        }
     }
 }