fix: 底脚版权声明样式

src/layouts/BasicLayout.vue

@@ -13,6 +13,7 @@ import useLayoutStore from '@/store/modules/layout';
 import useRouterStore from '@/store/modules/router';
 import useTabsStore from '@/store/modules/tabs';
 import useAlarmStore from '@/store/modules/alarm';
+import useAppStore from '@/store/modules/app';
 import { useRouter } from 'vue-router';
 import { MENU_PATH_INLINE } from '@/constants/menu-constants';
 const { proConfig, waterMarkContent } = useLayoutStore();
@@ -24,6 +25,7 @@ import { parseDateToStr } from '@/utils/date-utils';
 const { t } = useI18n();
 const routerStore = useRouterStore();
 const tabsStore = useTabsStore();
+const appStore = useAppStore();
 const router = useRouter();
 
 /**菜单面板 */
@@ -121,7 +123,7 @@ tabsStore.clear();
 //
 onMounted(() => {
   fnGetServerTime();
-  useAlarmStore().fnGetActiveAlarmInfo()
+  useAlarmStore().fnGetActiveAlarmInfo();
 });
 
 // ==== 服务器时间显示 start
@@ -166,7 +168,7 @@ document.addEventListener('visibilitychange', function () {
   if (document.visibilityState == 'visible') {
     //切换到该页面时执行
     fnGetServerTime();
-    useAlarmStore().fnGetActiveAlarmInfo()
+    useAlarmStore().fnGetActiveAlarmInfo();
   }
 });
 // ==== 服务器时间显示 end
@@ -236,15 +238,14 @@ document.addEventListener('visibilitychange', function () {
 
       <!--插槽-内容底部-->
       <template #footerRender>
-        <footer class="ant-pro-global-footer footer">
+        <footer class="footer">
-          <div class="ant-pro-global-footer-links">
+          <div>
-            <a target="_self" href="/">{{ t('globalFooter.help') }}</a>
+            <span>{{ appStore.copyright }}</span>
-            <a target="_self" href="/">{{ t('globalFooter.privacy') }}</a>
-            <a target="_self" href="/">{{ t('globalFooter.term') }}</a>
           </div>
-          <div class="footer-time">{{ serverTime.str }} {{ serverTime.zone }}</div>
+          <div>
-          <div class="ant-pro-global-footer-copyright">
+            <span class="footer-time">
-            Copyright ©2023 For AGrand 千通
+              {{ serverTime.str }} {{ serverTime.zone }}
+            </span>
           </div>
         </footer>
       </template>
@@ -267,8 +268,22 @@ document.addEventListener('visibilitychange', function () {
   width: 180px;
 }
 
-.footer-time {
+.footer {
-  color: #00000075;
+  display: flex;
-  transition: all 0.3s;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  justify-content: space-between;
+  z-index: 16;
+  margin: 0px;
+  padding: 4px 16px;
+  width: auto;
+  background: #fff;
+  box-shadow: 0 1px 4px #0015291f;
+  transition: background 0.3s, width 0.2s;
+
+  &-time {
+    color: #00000085;
+    transition: all 0.3s;
+  }
 }
 </style>

src/store/modules/app.ts

@@ -8,6 +8,8 @@ type AppStore = {
   appCode: string;
   /**应用版本 */
   appVersion: string;
+  /**应用版权声明 */
+  copyright: string;
 };
 
 const useAppStore = defineStore('app', {
@@ -15,6 +17,7 @@ const useAppStore = defineStore('app', {
     appName: import.meta.env.VITE_APP_NAME,
     appCode: import.meta.env.VITE_APP_CODE,
     appVersion: import.meta.env.VITE_APP_VERSION,
+    copyright: 'Copyright ©2023 For AGrand 千通科技',
   }),
   actions: {
     /**设置网页标题 */
@@ -25,6 +28,10 @@ const useAppStore = defineStore('app', {
         document.title = this.appName;
       }
     },
+    /**设置版权声明 */
+    setCopyright(text: string) {
+      this.copyright = text;
+    },
   },
 });
 

src/views/login.vue

@@ -3,12 +3,14 @@ import { GlobalFooter } from '@ant-design-vue/pro-layout';
 import { message } from 'ant-design-vue/lib';
 import { reactive, onMounted } from 'vue';
 import useUserStore from '@/store/modules/user';
+import useAppStore from '@/store/modules/app';
 import { getCaptchaImage } from '@/api/login';
 import { useRouter, useRoute } from 'vue-router';
 import useI18n from '@/hooks/useI18n';
 import { toRaw } from 'vue';
 import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
 const { t, changeLocale } = useI18n();
+const appStore = useAppStore();
 const router = useRouter();
 const route = useRoute();
 
@@ -20,9 +22,9 @@ let state = reactive({
   /**表单属性 */
   from: {
     /**账号 */
-    username: '',
+    username: 'AGrand',
     /**密码 */
-    password: '',
+    password: 'AGrand@1234',
     /**验证码 */
     code: '',
     /**验证码uuid */
@@ -251,16 +253,7 @@ function fnChangeLocale(e: any) {
       </a-form>
     </div>
 
-    <GlobalFooter
+    <GlobalFooter class="footer" :links="false" :copyright="appStore.copyright" />
-      class="footer"
-      :links="[
-        { blankTarget: false, title: t('globalFooter.help'), href: '/' },
-        { blankTarget: false, title: t('globalFooter.privacy'), href: '/' },
-        { blankTarget: false, title: t('globalFooter.term'), href: '/' },
-      ]"
-      copyright="Copyright ©2023 For AGrand 千通"
-    >
-    </GlobalFooter>
   </div>
 </template>