From d0163a7df4a5e0e93a984139c7e6f5ebe873fd12 Mon Sep 17 00:00:00 2001
From: lrl <742798240@qq.com>
Date: Fri, 13 Oct 2023 20:01:06 +0800
Subject: [PATCH 1/4] feat: add app footer

---
 src/layout/components/appMain.vue      | 14 +++++++++++---
 src/layout/components/footer/index.vue | 20 ++++++++++++++++++++
 2 files changed, 31 insertions(+), 3 deletions(-)
 create mode 100644 src/layout/components/footer/index.vue

diff --git a/src/layout/components/appMain.vue b/src/layout/components/appMain.vue
index 0cf1be2fd6..5177337de0 100644
--- a/src/layout/components/appMain.vue
+++ b/src/layout/components/appMain.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import Footer from "./footer/index.vue";
 import { useGlobal } from "@pureadmin/utils";
 import backTop from "@/assets/svg/back_top.svg?component";
 import { h, computed, Transition, defineComponent } from "vue";
@@ -78,7 +79,7 @@ const transitionMain = defineComponent({
   >
     <router-view>
       <template #default="{ Component, route }">
-        <el-scrollbar v-if="props.fixedHeader">
+        <el-scrollbar v-if="props.fixedHeader" class="flex-1">
           <el-backtop title="回到顶部" target=".app-main .el-scrollbar__wrap">
             <backTop />
           </el-backtop>
@@ -101,7 +102,7 @@ const transitionMain = defineComponent({
             />
           </transitionMain>
         </el-scrollbar>
-        <div v-else>
+        <div v-else class="flex-1">
           <transitionMain :route="route">
             <keep-alive
               v-if="isKeepAlive"
@@ -123,12 +124,17 @@ const transitionMain = defineComponent({
         </div>
       </template>
     </router-view>
+
+    <!-- 页脚 -->
+    <Footer />
   </section>
 </template>
 
 <style scoped>
 .app-main {
   position: relative;
+  display: flex;
+  flex-direction: column;
   width: 100%;
   height: 100vh;
   overflow-x: hidden;
@@ -136,8 +142,10 @@ const transitionMain = defineComponent({
 
 .app-main-nofixed-header {
   position: relative;
+  display: flex;
+  flex-direction: column;
   width: 100%;
-  min-height: 100vh;
+  min-height: calc(100vh - 86px);
 }
 
 .main-content {
diff --git a/src/layout/components/footer/index.vue b/src/layout/components/footer/index.vue
new file mode 100644
index 0000000000..038d4b908a
--- /dev/null
+++ b/src/layout/components/footer/index.vue
@@ -0,0 +1,20 @@
+<script lang="ts" setup>
+import { getConfig } from "@/config";
+
+const TITLE = getConfig("Title");
+</script>
+
+<template>
+  <footer class="layout-footer">MIT © 2020-PRESENT {{ TITLE }}</footer>
+</template>
+
+<style lang="scss" scoped>
+.layout-footer {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 50px;
+  color: #c0c4cc;
+}
+</style>

From 492a7507a65b78b65327119644668f0a809ebf66 Mon Sep 17 00:00:00 2001
From: lrl <742798240@qq.com>
Date: Sat, 14 Oct 2023 01:57:43 +0800
Subject: [PATCH 2/4] feat: add footer global configuration

---
 public/platform-config.json             |  1 +
 src/layout/components/appMain.vue       |  6 +++++-
 src/layout/components/setting/index.vue | 21 +++++++++++++++++++++
 src/layout/hooks/useLayout.ts           |  1 +
 src/utils/responsive.ts                 |  1 +
 types/global.d.ts                       |  3 +++
 6 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/public/platform-config.json b/public/platform-config.json
index 4bab15ad83..6860406f98 100644
--- a/public/platform-config.json
+++ b/public/platform-config.json
@@ -12,6 +12,7 @@
   "Grey": false,
   "Weak": false,
   "HideTabs": false,
+  "HideFooter": false,
   "SidebarStatus": true,
   "EpThemeColor": "#409EFF",
   "ShowLogo": true,
diff --git a/src/layout/components/appMain.vue b/src/layout/components/appMain.vue
index 5177337de0..3ceac30d52 100644
--- a/src/layout/components/appMain.vue
+++ b/src/layout/components/appMain.vue
@@ -25,6 +25,10 @@ const hideTabs = computed(() => {
   return $storage?.configure.hideTabs;
 });
 
+const hideFooter = computed(() => {
+  return $storage?.configure.hideFooter;
+});
+
 const layout = computed(() => {
   return $storage?.layout.layout === "vertical";
 });
@@ -126,7 +130,7 @@ const transitionMain = defineComponent({
     </router-view>
 
     <!-- 页脚 -->
-    <Footer />
+    <Footer v-if="!hideFooter" />
   </section>
 </template>
 
diff --git a/src/layout/components/setting/index.vue b/src/layout/components/setting/index.vue
index 9600a8455f..49cfc06d97 100644
--- a/src/layout/components/setting/index.vue
+++ b/src/layout/components/setting/index.vue
@@ -66,6 +66,7 @@ const settings = reactive({
   tabsVal: $storage.configure.hideTabs,
   showLogo: $storage.configure.showLogo,
   showModel: $storage.configure.showModel,
+  hideFooter: $storage.configure.hideFooter,
   multiTagsCache: $storage.configure.multiTagsCache
 });
 
@@ -111,12 +112,20 @@ const weekChange = (value): void => {
   storageConfigureChange("weak", value);
 };
 
+/** 隐藏标签页设置 */
 const tagsChange = () => {
   const showVal = settings.tabsVal;
   storageConfigureChange("hideTabs", showVal);
   emitter.emit("tagViewsChange", showVal as unknown as string);
 };
 
+/** 隐藏页脚设置 */
+const hideFooterChange = () => {
+  const hideFooter = settings.hideFooter;
+  storageConfigureChange("hideFooter", hideFooter);
+};
+
+/** 标签页持久化设置 */
 const multiTagsCacheChange = () => {
   const multiTagsCache = settings.multiTagsCache;
   storageConfigureChange("multiTagsCache", multiTagsCache);
@@ -218,6 +227,7 @@ onBeforeMount(() => {
     settings.weakVal &&
       document.querySelector("html")?.setAttribute("class", "html-weakness");
     settings.tabsVal && tagsChange();
+    settings.hideFooter && hideFooterChange();
   });
 });
 </script>
@@ -344,6 +354,17 @@ onBeforeMount(() => {
           @change="tagsChange"
         />
       </li>
+      <li>
+        <span class="dark:text-white">隐藏页脚</span>
+        <el-switch
+          v-model="settings.hideFooter"
+          inline-prompt
+          inactive-color="#a6a6a6"
+          active-text="开"
+          inactive-text="关"
+          @change="hideFooterChange"
+        />
+      </li>
       <li>
         <span class="dark:text-white">侧边栏Logo</span>
         <el-switch
diff --git a/src/layout/hooks/useLayout.ts b/src/layout/hooks/useLayout.ts
index d983a314b4..0e768cf8f9 100644
--- a/src/layout/hooks/useLayout.ts
+++ b/src/layout/hooks/useLayout.ts
@@ -36,6 +36,7 @@ export function useLayout() {
         grey: $config?.Grey ?? false,
         weak: $config?.Weak ?? false,
         hideTabs: $config?.HideTabs ?? false,
+        hideFooter: $config.HideFooter ?? false,
         showLogo: $config?.ShowLogo ?? true,
         showModel: $config?.ShowModel ?? "smart",
         multiTagsCache: $config?.MultiTagsCache ?? false
diff --git a/src/utils/responsive.ts b/src/utils/responsive.ts
index c439399c73..b5c8f189b4 100644
--- a/src/utils/responsive.ts
+++ b/src/utils/responsive.ts
@@ -24,6 +24,7 @@ export const injectResponsiveStorage = (app: App, config: PlatformConfigs) => {
         grey: config.Grey ?? false,
         weak: config.Weak ?? false,
         hideTabs: config.HideTabs ?? false,
+        hideFooter: config.HideFooter ?? false,
         showLogo: config.ShowLogo ?? true,
         showModel: config.ShowModel ?? "smart",
         multiTagsCache: config.MultiTagsCache ?? false
diff --git a/types/global.d.ts b/types/global.d.ts
index 3953672df5..b9c4c243bd 100644
--- a/types/global.d.ts
+++ b/types/global.d.ts
@@ -89,6 +89,7 @@ declare global {
     Grey?: boolean;
     Weak?: boolean;
     HideTabs?: boolean;
+    HideFooter?: boolean;
     SidebarStatus?: boolean;
     EpThemeColor?: string;
     ShowLogo?: boolean;
@@ -125,6 +126,7 @@ declare global {
     grey?: boolean;
     weak?: boolean;
     hideTabs?: boolean;
+    hideFooter?: boolean;
     sidebarStatus?: boolean;
     epThemeColor?: string;
     showLogo?: boolean;
@@ -158,6 +160,7 @@ declare global {
       grey?: boolean;
       weak?: boolean;
       hideTabs?: boolean;
+      hideFooter?: boolean;
       showLogo?: boolean;
       showModel?: string;
       multiTagsCache?: boolean;

From 6598b49b1155becf7acddf4a42b092f39b7e70d0 Mon Sep 17 00:00:00 2001
From: xiaoxian521 <1923740402@qq.com>
Date: Sun, 15 Oct 2023 17:17:43 +0800
Subject: [PATCH 3/4] chore: update

---
 src/layout/components/appMain.vue | 48 +++++++++++++++++++------------
 1 file changed, 30 insertions(+), 18 deletions(-)

diff --git a/src/layout/components/appMain.vue b/src/layout/components/appMain.vue
index 3ceac30d52..f21bade90d 100644
--- a/src/layout/components/appMain.vue
+++ b/src/layout/components/appMain.vue
@@ -83,30 +83,44 @@ const transitionMain = defineComponent({
   >
     <router-view>
       <template #default="{ Component, route }">
-        <el-scrollbar v-if="props.fixedHeader" class="flex-1">
+        <el-scrollbar
+          v-if="props.fixedHeader"
+          :wrap-style="{
+            display: 'flex'
+          }"
+          :view-style="{
+            display: 'flex',
+            flex: 'auto',
+            overflow: 'auto',
+            'flex-direction': 'column'
+          }"
+        >
           <el-backtop title="回到顶部" target=".app-main .el-scrollbar__wrap">
             <backTop />
           </el-backtop>
-          <transitionMain :route="route">
-            <keep-alive
-              v-if="isKeepAlive"
-              :include="usePermissionStoreHook().cachePageList"
-            >
+          <div class="grow">
+            <transitionMain :route="route">
+              <keep-alive
+                v-if="isKeepAlive"
+                :include="usePermissionStoreHook().cachePageList"
+              >
+                <component
+                  :is="Component"
+                  :key="route.fullPath"
+                  class="main-content"
+                />
+              </keep-alive>
               <component
+                v-else
                 :is="Component"
                 :key="route.fullPath"
                 class="main-content"
               />
-            </keep-alive>
-            <component
-              v-else
-              :is="Component"
-              :key="route.fullPath"
-              class="main-content"
-            />
-          </transitionMain>
+            </transitionMain>
+          </div>
+          <Footer v-if="!hideFooter" />
         </el-scrollbar>
-        <div v-else class="flex-1">
+        <div v-else class="grow">
           <transitionMain :route="route">
             <keep-alive
               v-if="isKeepAlive"
@@ -130,15 +144,13 @@ const transitionMain = defineComponent({
     </router-view>
 
     <!-- 页脚 -->
-    <Footer v-if="!hideFooter" />
+    <Footer v-if="!hideFooter && !props.fixedHeader" />
   </section>
 </template>
 
 <style scoped>
 .app-main {
   position: relative;
-  display: flex;
-  flex-direction: column;
   width: 100%;
   height: 100vh;
   overflow-x: hidden;

From 35e02478396c1b98ff44b7e8829dfdcb722c8bd3 Mon Sep 17 00:00:00 2001
From: xiaoxian521 <1923740402@qq.com>
Date: Tue, 17 Oct 2023 11:00:40 +0800
Subject: [PATCH 4/4] chore: update

---
 src/layout/components/appMain.vue      | 11 ++++++++---
 src/layout/components/footer/index.vue | 13 +++++++++++--
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/layout/components/appMain.vue b/src/layout/components/appMain.vue
index f21bade90d..28354d9795 100644
--- a/src/layout/components/appMain.vue
+++ b/src/layout/components/appMain.vue
@@ -37,9 +37,15 @@ const getSectionStyle = computed(() => {
   return [
     hideTabs.value && layout ? "padding-top: 48px;" : "",
     !hideTabs.value && layout ? "padding-top: 85px;" : "",
-    hideTabs.value && !layout.value ? "padding-top: 48px" : "",
+    hideTabs.value && !layout.value ? "padding-top: 48px;" : "",
     !hideTabs.value && !layout.value ? "padding-top: 85px;" : "",
-    props.fixedHeader ? "" : "padding-top: 0;"
+    props.fixedHeader
+      ? ""
+      : `padding-top: 0;${
+          hideTabs.value
+            ? "min-height: calc(100vh - 48px);"
+            : "min-height: calc(100vh - 86px);"
+        }`
   ];
 });
 
@@ -161,7 +167,6 @@ const transitionMain = defineComponent({
   display: flex;
   flex-direction: column;
   width: 100%;
-  min-height: calc(100vh - 86px);
 }
 
 .main-content {
diff --git a/src/layout/components/footer/index.vue b/src/layout/components/footer/index.vue
index 038d4b908a..76da3fb1e6 100644
--- a/src/layout/components/footer/index.vue
+++ b/src/layout/components/footer/index.vue
@@ -5,7 +5,16 @@ const TITLE = getConfig("Title");
 </script>
 
 <template>
-  <footer class="layout-footer">MIT © 2020-PRESENT {{ TITLE }}</footer>
+  <footer class="layout-footer">
+    MIT © 2020-PRESENT
+    <a
+      class="ml-1 hover:text-primary"
+      href="https://github.com/pure-admin"
+      target="_blank"
+    >
+      {{ TITLE }}
+    </a>
+  </footer>
 </template>
 
 <style lang="scss" scoped>
@@ -14,7 +23,7 @@ const TITLE = getConfig("Title");
   align-items: center;
   justify-content: center;
   width: 100%;
-  height: 50px;
+  padding: 0 0 8px;
   color: #c0c4cc;
 }
 </style>