自动获取系统名称

src/components/Application/src/AppLogo.vue

@@ -6,19 +6,20 @@
   <div class="anticon" :class="getAppLogoClass" @click="goHome">
     <img src="../../../assets/images/logo.png" />
     <div class="ml-2 truncate md:opacity-100" :class="getTitleClass" v-show="showTitle">
-      <!-- {{ title }} -->
-      汾西农业面源污染
+      {{ title }}
     </div>
   </div>
 </template>
 <script lang="ts" setup>
-  import { computed, unref } from 'vue';
+  import { computed, onMounted, ref, unref } from 'vue';
   import { useGlobSetting } from '/@/hooks/setting';
   import { useGo } from '/@/hooks/web/usePage';
   import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { PageEnum } from '/@/enums/pageEnum';
   import { useUserStore } from '/@/store/modules/user';
+  import { getAuthCache } from '/@/utils/auth';
+  import { LOGIN_INFO_KEY } from '/@/enums/cacheEnum';
 
   const props = defineProps({
     /**
@@ -38,7 +39,8 @@
   const { prefixCls } = useDesign('app-logo');
   const { getCollapsedShowTitle } = useMenuSetting();
   const userStore = useUserStore();
-  const { title } = useGlobSetting();
+  // const { title } = useGlobSetting();
+  const { title } = ref('');
   const go = useGo();
 
   const getAppLogoClass = computed(() => [prefixCls, props.theme, { 'collapsed-show-title': unref(getCollapsedShowTitle) }]);
@@ -50,6 +52,13 @@
     },
   ]);
 
+  onMounted(() => {
+    let loginInfo = getAuthCache(LOGIN_INFO_KEY)['userInfo'];
+    if (loginInfo) {
+      title.value = loginInfo['appLogoName'];
+    }
+  });
+
   function goHome() {
     go(userStore.getUserInfo.homePath || PageEnum.BASE_HOME);
   }

src/layouts/default/header/index.vue

@@ -11,7 +11,12 @@
       />
       <LayoutBreadcrumb v-if="getShowContent && getShowBread" :theme="getHeaderTheme" />
       <!-- 欢迎语 -->
-      <span v-if="getShowContent && getShowBreadTitle && !getIsMobile" :class="[prefixCls, `${prefixCls}--${getHeaderTheme}`,'headerIntroductionClass']"> 欢迎进入 汾西农业面源污染在线监测平台   </span>
+      <span
+        v-if="getShowContent && getShowBreadTitle && !getIsMobile"
+        :class="[prefixCls, `${prefixCls}--${getHeaderTheme}`, 'headerIntroductionClass']"
+      >
+        欢迎进入 {{ systemName }}
+      </span>
     </div>
     <!-- left end -->
 
@@ -71,6 +76,9 @@
 
   import LoginSelect from '/@/views/sys/login/LoginSelect.vue';
   import { useUserStore } from '/@/store/modules/user';
+  import { getAuthCache } from '/@/utils/auth';
+  import { LOGIN_INFO_KEY } from '/@/enums/cacheEnum';
+  import type { LoginInfo } from '/#/store';
 
   export default defineComponent({
     name: 'LayoutHeader',
@@ -101,7 +109,7 @@
       const { getShowTopMenu, getShowHeaderTrigger, getSplit, getIsMixMode, getMenuWidth, getIsMixSidebar } = useMenuSetting();
       const { getUseErrorHandle, getShowSettingButton, getSettingButtonPosition } = useRootSetting();
       const { title } = useGlobSetting();
-
+      const systemName = ref('');
       const {
         getHeaderTheme,
         getShowFullScreen,
@@ -180,6 +188,11 @@
 
       onMounted(() => {
         showLoginSelect();
+        let loginInfo = getAuthCache(LOGIN_INFO_KEY)['userInfo'];
+        console.log('checlll=====', loginInfo != null);
+        if (loginInfo != null) {
+          systemName.value = loginInfo['systemName'];
+        }
       });
 
       return {
@@ -208,7 +221,8 @@
         getUseLockPage,
         loginSelectOk,
         loginSelectRef,
-        title
+        title,
+        systemName,
       };
     },
   });

src/views/dashboard/Analysis/components/WeChatQrPic.vue

@@ -1,15 +1,25 @@
 <template>
   <Card title="监测小程序">
-    <div >
-      <img src="../../../../assets/images/appletQr.jpg" style="width: 300px;margin: auto;">
+    <div>
+      <img :src="logoUrl" style="width: 300px; margin: auto" />
     </div>
   </Card>
 </template>
 
 <script lang="ts" setup>
-  import { Ref, ref, watch } from 'vue';
+  import { onMounted, Ref, ref, watch } from 'vue';
   import { Card } from 'ant-design-vue';
   import { useECharts } from '/@/hooks/web/useECharts';
+  import { getAuthCache } from '/@/utils/auth';
+  import { LOGIN_INFO_KEY } from '/@/enums/cacheEnum';
+  const logoUrl = ref('');
+
+  onMounted(() => {
+    let loginInfo = getAuthCache(LOGIN_INFO_KEY)['userInfo'];
+    if (loginInfo) {
+      logoUrl.value = loginInfo['aptImage'];
+    }
+  });
 
   const props = defineProps({
     loading: Boolean,
@@ -22,5 +32,4 @@
       default: '300px',
     },
   });
-
-</script>
+</script>

src/views/sys/login/TokenLoginPage.vue

@@ -1,16 +1,15 @@
 <template>
-    <div class="app-loading">
-        <div class="app-loading-wrap">
-            <img src="/resource/img/logo.png" class="app-loading-logo" alt="Logo">
-            <div class="app-loading-dots">
-                <span class="dot dot-spin"><i></i><i></i><i></i><i></i></span>
-            </div>
-            <div class="app-loading-title">汾西农业面源污染在线监测平台</div>
-        </div>
+  <div class="app-loading">
+    <div class="app-loading-wrap">
+      <img src="/resource/img/logo.png" class="app-loading-logo" alt="Logo" />
+      <div class="app-loading-dots">
+        <span class="dot dot-spin"><i></i><i></i><i></i><i></i></span>
+      </div>
+      <div class="app-loading-title">{{ title }}</div>
     </div>
+  </div>
 </template>
 
-
 <script lang="ts">
   /**
    * 地址中携带token，跳转至此页面进行登录操作
@@ -19,191 +18,197 @@
   import { useMessage } from '/@/hooks/web/useMessage';
   import { useUserStore } from '/@/store/modules/user';
   import { useI18n } from '/@/hooks/web/useI18n';
+  import { getAuthCache, setAuthCache } from '/@/utils/auth';
+  import { LOGIN_INFO_KEY } from '/@/enums/cacheEnum';
+  import { ref } from 'vue';
 
   export default {
-    name: "TokenLogin",
-    setup(){
+    name: 'TokenLogin',
+    setup() {
       const route = useRoute();
       let router = useRouter();
-      const {createMessage, notification} = useMessage()
-      const {t} = useI18n();
-      const routeQuery:any = route.query;
-      if(!routeQuery){
-        createMessage.warning('参数无效')
+      const text = ref('');
+      const { createMessage, notification } = useMessage();
+      const { t } = useI18n();
+      const routeQuery: any = route.query;
+      if (!routeQuery) {
+        createMessage.warning('参数无效');
       }
 
       const token = routeQuery['loginToken'];
-      if(!token){
-        createMessage.warning('token无效')
+      if (!token) {
+        createMessage.warning('token无效');
       }
       const userStore = useUserStore();
-      userStore.ThirdLogin({ token, thirdType:'email' }).then(res => {
-        console.log("res====>doThirdLogin",res)
-        if(res && res.userInfo){
-          requestSuccess(res)
-        }else{
-          requestFailed(res)
+      userStore.ThirdLogin({ token, thirdType: 'email' }).then((res) => {
+        console.log('res====>doThirdLogin', res);
+        if (res && res.userInfo) {
+          requestSuccess(res);
+        } else {
+          requestFailed(res);
         }
       });
 
-      function requestFailed (err) {
+      function requestFailed(err) {
         notification.error({
           message: '登录失败',
-          description: ((err.response || {}).data || {}).message || err.message || "请求出现错误，请稍后再试",
+          description: ((err.response || {}).data || {}).message || err.message || '请求出现错误，请稍后再试',
           duration: 4,
         });
       }
 
-      function requestSuccess(res){
+      function requestSuccess(res) {
         let info = routeQuery.info;
-        if(info){
-          let query = JSON.parse(info)
+        if (info) {
+          let query = JSON.parse(info);
           let taskId = query.taskId;
-          let path = '/task/handle/'+taskId
-          router.replace({ path, query })
+          let path = '/task/handle/' + taskId;
+          router.replace({ path, query });
           notification.success({
             message: t('sys.login.loginSuccessTitle'),
             description: `${t('sys.login.loginSuccessDesc')}: ${res.userInfo.realname}`,
             duration: 3,
           });
-        }else{
+          let loginInfo = getAuthCache(LOGIN_INFO_KEY);
+          if (loginInfo) {
+            text = loginInfo.systemName;
+          }
+        } else {
           notification.error({
             message: '参数失效',
-            description: "页面跳转参数丢失，请查看日志",
+            description: '页面跳转参数丢失，请查看日志',
             duration: 4,
           });
         }
       }
-    }
-  }
+    },
+  };
 </script>
 
 <style scoped>
+  html[data-theme='dark'] .app-loading {
+    background-color: #2c344a;
+  }
 
-    html[data-theme='dark'] .app-loading {
-        background-color: #2c344a;
-    }
+  html[data-theme='dark'] .app-loading .app-loading-title {
+    color: rgba(255, 255, 255, 0.85);
+  }
 
-    html[data-theme='dark'] .app-loading .app-loading-title {
-        color: rgba(255, 255, 255, 0.85);
-    }
+  .app-loading {
+    display: flex;
+    width: 100%;
+    height: 100%;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    background-color: #f4f7f9;
+  }
 
-    .app-loading {
-        display: flex;
-        width: 100%;
-        height: 100%;
-        justify-content: center;
-        align-items: center;
-        flex-direction: column;
-        background-color: #f4f7f9;
-    }
+  .app-loading .app-loading-wrap {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    display: flex;
+    -webkit-transform: translate3d(-50%, -50%, 0);
+    transform: translate3d(-50%, -50%, 0);
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+  }
 
-    .app-loading .app-loading-wrap {
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        display: flex;
-        -webkit-transform: translate3d(-50%, -50%, 0);
-        transform: translate3d(-50%, -50%, 0);
-        justify-content: center;
-        align-items: center;
-        flex-direction: column;
-    }
+  .app-loading .dots {
+    display: flex;
+    padding: 98px;
+    justify-content: center;
+    align-items: center;
+  }
 
-    .app-loading .dots {
-        display: flex;
-        padding: 98px;
-        justify-content: center;
-        align-items: center;
-    }
+  .app-loading .app-loading-title {
+    display: flex;
+    margin-top: 30px;
+    font-size: 30px;
+    color: rgba(0, 0, 0, 0.85);
+    justify-content: center;
+    align-items: center;
+  }
 
-    .app-loading .app-loading-title {
-        display: flex;
-        margin-top: 30px;
-        font-size: 30px;
-        color: rgba(0, 0, 0, 0.85);
-        justify-content: center;
-        align-items: center;
-    }
+  .app-loading .app-loading-logo {
+    display: block;
+    width: 90px;
+    margin: 0 auto;
+    margin-bottom: 20px;
+  }
 
-    .app-loading .app-loading-logo {
-        display: block;
-        width: 90px;
-        margin: 0 auto;
-        margin-bottom: 20px;
-    }
+  .dot {
+    position: relative;
+    display: inline-block;
+    width: 48px;
+    height: 48px;
+    margin-top: 30px;
+    font-size: 32px;
+    transform: rotate(45deg);
+    box-sizing: border-box;
+    animation: antRotate 1.2s infinite linear;
+  }
 
-    .dot {
-        position: relative;
-        display: inline-block;
-        width: 48px;
-        height: 48px;
-        margin-top: 30px;
-        font-size: 32px;
-        transform: rotate(45deg);
-        box-sizing: border-box;
-        animation: antRotate 1.2s infinite linear;
-    }
+  .dot i {
+    position: absolute;
+    display: block;
+    width: 20px;
+    height: 20px;
+    background-color: #0065cc;
+    border-radius: 100%;
+    opacity: 0.3;
+    transform: scale(0.75);
+    animation: antSpinMove 1s infinite linear alternate;
+    transform-origin: 50% 50%;
+  }
 
-    .dot i {
-        position: absolute;
-        display: block;
-        width: 20px;
-        height: 20px;
-        background-color: #0065cc;
-        border-radius: 100%;
-        opacity: 0.3;
-        transform: scale(0.75);
-        animation: antSpinMove 1s infinite linear alternate;
-        transform-origin: 50% 50%;
-    }
+  .dot i:nth-child(1) {
+    top: 0;
+    left: 0;
+  }
 
-    .dot i:nth-child(1) {
-        top: 0;
-        left: 0;
-    }
+  .dot i:nth-child(2) {
+    top: 0;
+    right: 0;
+    -webkit-animation-delay: 0.4s;
+    animation-delay: 0.4s;
+  }
 
-    .dot i:nth-child(2) {
-        top: 0;
-        right: 0;
-        -webkit-animation-delay: 0.4s;
-        animation-delay: 0.4s;
-    }
+  .dot i:nth-child(3) {
+    right: 0;
+    bottom: 0;
+    -webkit-animation-delay: 0.8s;
+    animation-delay: 0.8s;
+  }
 
-    .dot i:nth-child(3) {
-        right: 0;
-        bottom: 0;
-        -webkit-animation-delay: 0.8s;
-        animation-delay: 0.8s;
+  .dot i:nth-child(4) {
+    bottom: 0;
+    left: 0;
+    -webkit-animation-delay: 1.2s;
+    animation-delay: 1.2s;
+  }
+  @keyframes antRotate {
+    to {
+      -webkit-transform: rotate(405deg);
+      transform: rotate(405deg);
     }
-
-    .dot i:nth-child(4) {
-        bottom: 0;
-        left: 0;
-        -webkit-animation-delay: 1.2s;
-        animation-delay: 1.2s;
+  }
+  @-webkit-keyframes antRotate {
+    to {
+      -webkit-transform: rotate(405deg);
+      transform: rotate(405deg);
     }
-    @keyframes antRotate {
-        to {
-            -webkit-transform: rotate(405deg);
-            transform: rotate(405deg);
-        }
+  }
+  @keyframes antSpinMove {
+    to {
+      opacity: 1;
     }
-    @-webkit-keyframes antRotate {
-        to {
-            -webkit-transform: rotate(405deg);
-            transform: rotate(405deg);
-        }
+  }
+  @-webkit-keyframes antSpinMove {
+    to {
+      opacity: 1;
     }
-    @keyframes antSpinMove {
-        to {
-            opacity: 1;
-        }
-    }
-    @-webkit-keyframes antSpinMove {
-        to {
-            opacity: 1;
-        }
-    }
-
+  }
 </style>