Merge remote-tracking branch 'origin/main' into multi-tenant

src/layouts/BasicLayout.vue

@@ -176,6 +176,7 @@ function fnCheckAppNameOverflow() {
   if (!text) return;
   if (text.offsetWidth > container.offsetWidth) {
     text.classList.add('app-name_scrollable');
+    text.setAttribute('data-content', text.innerText);
   } else {
     text.classList.remove('app-name_scrollable');
   }
@@ -342,11 +343,17 @@ onUnmounted(() => {
                 :href="appStore.officialUrl"
                 target="_blank"
                 size="small"
+                v-perms:has="['system:setting:link']"
                 v-if="appStore.officialUrl !== '#'"
               >
                 {{ t('loayouts.basic.officialUrl') }}
               </a-button>
-              <a-button type="link" size="small" @click="fnClickHelpDoc()">
+              <a-button
+                type="link"
+                size="small"
+                v-perms:has="['system:setting:HelpDoc']"
+                @click="fnClickHelpDoc()"
+              >
                 {{ t('loayouts.basic.helpDoc') }}
               </a-button>
             </a-space>
@@ -382,20 +389,26 @@ onUnmounted(() => {
   // text-overflow: ellipsis;
   white-space: nowrap;
   width: 148px;
-
-  &_scrollable {
-    // padding-left: 100%;
+  > .app-name_scrollable {
+    padding-right: 12px;
     display: inline-block;
     animation: scrollable-animation linear 6s infinite both;
-  }
-
-  @keyframes scrollable-animation {
-    0% {
-      transform: translate3d(0, 0, 0);
+    &::after {
+      content: attr(data-content);
+      position: absolute;
+      top: 0;
+      right: -100%;
+      transition: right 0.3s ease;
     }
 
-    100% {
-      transform: translate3d(-100%, 0, 0);
+    @keyframes scrollable-animation {
+      0% {
+        transform: translateX(0);
+      }
+
+      100% {
+        transform: translateX(calc(-100% - 12px));
+      }
     }
   }
 }

src/layouts/components/RightContent.vue

@@ -142,6 +142,7 @@ function fnChangeLocale(e: any) {
         type="text"
         style="color: inherit"
         @click="fnClickHelpDoc()"
+        v-perms:has="['system:setting:HelpDoc']"
         v-roles:has="[TENANTADMIN_ROLE_KEY]"
       >
         <template #icon>