dashboard-shell-shell 3.0.5-test.4 → 3.0.5-test.6

package/pages/c/_cluster/settings/performance.vue

@@ -198,16 +198,14 @@ export default {
 <template>
   <Loading v-if="$fetchState.pending" />
   <div v-else>
-    <!-- 面包屑 -->
-    <div class="excram-list">全局设置 / <span style="color: #1890FF;">性能</span></div>
     <h1 class="mb-20">
       {{ t('performance.label') }}
     </h1>
     <div>
-      <div class="ui-perf-setting pb-40">
-        <!-- 闲置状态 -->
-        <div class="mb-20 p-20" style="border: 1px solid var(--nav-border);">
-          <h2 class="mb-20">{{ t('performance.inactivity.title') }}</h2>
+      <div class="ui-perf-setting">
+        <!-- Inactivity -->
+        <div class="mt-20">
+          <h2>{{ t('performance.inactivity.title') }}</h2>
           <p>{{ t('performance.inactivity.description') }}</p>
           <Checkbox
             v-model:value="value.inactivity.enabled"
@@ -234,21 +232,21 @@ export default {
             />
           </div>
         </div>
-        <!-- WebSocket 通知 -->
-        <div class="mb-40 p-20" style="border: 1px solid var(--nav-border);">
-          <h2  class="mb-20">{{ t('performance.websocketNotification.label') }}</h2>
+        <!-- Websocket Notifications -->
+        <div class="mt-40">
+          <h2>{{ t('performance.websocketNotification.label') }}</h2>
           <p>{{ t('performance.websocketNotification.description') }}</p>
           <Checkbox
             v-model:value="value.disableWebsocketNotification"
             :mode="mode"
             :label="t('performance.websocketNotification.checkboxLabel')"
-            class="mt-10"
+            class="mt-10 mb-20"
             :primary="true"
           />
         </div>
         <!-- Server Side Pagination -->
-        <div class="mb-20 p-20" style="border: 1px solid var(--nav-border);">
-          <h2 class="mb-20" id="ssp-setting">
+        <div class="mt-20">
+          <h2 id="ssp-setting">
             {{ t('performance.serverPagination.label') }}
           </h2>
           <p>{{ t('performance.serverPagination.description') }}</p>
@@ -269,9 +267,9 @@ export default {
             />
           </Collapse>
         </div>
-        <!-- 增量加载 -->
-        <div class="mb-20 p-20" style="border: 1px solid var(--nav-border);">
-          <h2 class="mb-20">{{ t('performance.incrementalLoad.label') }}</h2>
+        <!-- Incremental Loading -->
+        <div class="mt-20">
+          <h2>{{ t('performance.incrementalLoad.label') }}</h2>
           <Banner
             color="warning"
           >
@@ -301,9 +299,9 @@ export default {
             />
           </div>
         </div>
-        <!-- 手动刷新 -->
-        <div class="mb-20 p-20" style="border: 1px solid var(--nav-border);">
-          <h2 class="mb-20" v-t="'performance.manualRefresh.label'" />
+        <!-- Enable manual refresh list views -->
+        <div class="mt-40">
+          <h2 v-t="'performance.manualRefresh.label'" />
           <Banner
             color="warning"
           >
@@ -333,9 +331,9 @@ export default {
             />
           </div>
         </div>
-        <!-- 资源垃圾回收 -->
-        <div class="mb-20 p-20" style="border: 1px solid var(--nav-border);">
-          <h2 class="mb-20" v-t="'performance.gc.label'" />
+        <!-- Enable GC of resources from store -->
+        <div class="mt-40">
+          <h2 v-t="'performance.gc.label'" />
           <Banner
             color="warning"
           >
@@ -414,9 +412,9 @@ export default {
             </div>
           </div>
         </div>
-        <!-- 要求资源组/项目过滤 -->
-        <div class="mb-20 p-20" style="border: 1px solid var(--nav-border);">
-          <h2 class="mb-20">{{ t('performance.nsFiltering.label') }}</h2>
+        <!-- Force NS filter -->
+        <div class="mt-40">
+          <h2>{{ t('performance.nsFiltering.label') }}</h2>
           <Banner
             color="warning"
           >
@@ -432,9 +430,9 @@ export default {
             @update:value="compatibleWarning('forceNsFilterV2', $event)"
           />
         </div>
-        <!-- Websocket Web Worker -->
-        <div class="mb-20 p-20" style="border: 1px solid var(--nav-border);">
-          <h2 class="mb-20">{{ t('performance.advancedWorker.label') }}</h2>
+        <!-- Advanced Websocket Worker -->
+        <div class="mt-20">
+          <h2>{{ t('performance.advancedWorker.label') }}</h2>
           <Banner
             color="warning"
           >
@@ -460,10 +458,10 @@ export default {
         :label="err"
       />
     </template>
-    <div class="action-btn" v-if="mode === 'edit'">
+    <div v-if="mode === 'edit'">
       <AsyncButton
         data-testid="performance__save-btn"
-        class="pull-right"
+        class="pull-right mt-20"
         mode="apply"
         :disabled="!canSave"
         @click="save"
@@ -473,17 +471,6 @@ export default {
 </template>
 
 <style scoped lang='scss'>
-.action-btn {
-  padding: 10px 30px;
-  position: fixed;
-  bottom: 0;
-  left: 0;
-  width: 100%;
-  background: var(--body-bg);
-  border-top: 1px solid var(--nav-border);
-}
-
-
 .overlay {
   width: 100%;
   height: 100%;
@@ -493,27 +480,17 @@ export default {
   background-color: var(--overlay-bg);
   z-index: 1;
 }
-.ui-perf-setting {
-  P {
-    line-height: 1.25;
-    margin-bottom: 10px;
-  }
+  .ui-perf-setting {
+    P {
+      line-height: 1.25;
+      margin-bottom: 10px;
+    }
 
-  .underline {
-    text-decoration: underline;
+    .underline {
+      text-decoration: underline;
+    }
+  }
+  .input {
+    max-width: 25%;
   }
-}
-.input {
-  max-width: 25%;
-}
-h2{
-  font-size: 14px;
-}
-
-.excram-list{
-  font-size: 14px;
-  line-height: 22px;
-  margin-bottom: 20px;
-  font-family: 'Microsoft YaHei';
-}
 </style>

package/pages/home.vue

@@ -62,12 +62,7 @@ export default defineComponent({
       query: { [MODE]: _IMPORT }
     };
 
-    const topLevelPermissions = sessionStorage.getItem('TOPLEVELPERMISSIONS') || ''
-
-    const topLevelPermissionsVis = topLevelPermissions && topLevelPermissions === 'superadmin'
-
     return {
-      topLevelPermissionsVis,
       HIDE_HOME_PAGE_CARDS,
       // Page actions don't change on the Home Page
       pageActions: [
@@ -478,26 +473,17 @@ export default defineComponent({
 </script>
 
 <template>
-   <!-- 当 managementReady 为 true 时才显示首页内容 -->
   <div
     v-if="managementReady"
     class="home-page"
   >
-
-    <!-- 页签标题组件，不显示子页面标题和面包屑 -->
     <TabTitle
-      v-if="topLevelPermissionsVis"
       :show-child="false"
       :breadcrumb="false"
     >
-
-      <!-- 页面标题：{vendor} - 首页 -->
       {{ `${vendor} - ${t('landing.homepage')}` }}
     </TabTitle>
-
-    <!-- 首页欢迎横幅 -->
     <BannerGraphic
-      v-if="topLevelPermissionsVis"
       :small="true"
       :title="t('landing.welcomeToRancher', {vendor})"
       :pref="HIDE_HOME_PAGE_CARDS"
@@ -505,24 +491,13 @@ export default defineComponent({
       data-testid="home-banner-graphic"
     />
     <IndentedPanel class="mt-20 mb-20">
-
-       <!-- 主面板布局 -->
       <div class="row home-panels">
         <div class="col main-panel">
-          <h2 class="mb-20">
-            {{ t('landing.clusters.title') }}
-          </h2>
-
-          <!-- 集群列表面板 -->
           <div class="row panel">
-
-            <!-- 如果是多集群模式（mcm = multi-cluster management） -->
             <div
               v-if="mcm"
               class="col span-12"
             >
-
-              <!-- 分页资源表格 -->
               <PaginatedResourceTable
                 v-if="provClusterSchema"
                 :schema="provClusterSchema"
@@ -542,17 +517,27 @@ export default defineComponent({
                 :fetchSecondaryResources="fetchSecondaryResources"
                 :fetchPageSecondaryResources="fetchPageSecondaryResources"
               >
-
-                <!-- 表头中间：管理、导入、创建按钮 -->
+                <template #header-left>
+                  <div class="row table-heading">
+                    <h2 class="mb-0">
+                      {{ t('landing.clusters.title') }}
+                    </h2>
+                    <BadgeState
+                      v-if="clusterCount"
+                      :label="clusterCount.toString()"
+                      color="role-tertiary ml-20 mr-20"
+                    />
+                  </div>
+                </template>
                 <template
                   v-if="canCreateCluster || !!provClusterSchema"
-                  #header-right
+                  #header-middle
                 >
-                  <div v-if="topLevelPermissionsVis" class="table-heading">
+                  <div class="table-heading">
                     <router-link
                       v-if="!!provClusterSchema"
                       :to="manageLocation"
-                      class="btn btn-sm role-primary"
+                      class="btn btn-sm role-secondary"
                       data-testid="cluster-management-manage-button"
                       role="button"
                       :aria-label="t('cluster.manageAction')"
@@ -584,8 +569,6 @@ export default defineComponent({
                     </router-link>
                   </div>
                 </template>
-
-                <!-- 列渲染：集群名称 -->
                 <template #col:name="{row}">
                   <td class="col-name">
                     <div class="list-cluster-name">
@@ -593,8 +576,6 @@ export default defineComponent({
                         v-if="row.mgmt"
                         class="cluster-name"
                       >
-
-                        <!-- 如果集群就绪且无错误，跳转到集群 Explorer 页面 -->
                         <router-link
                           v-if="row.mgmt.isReady && !row.hasError"
                           :to="{ name: 'c-cluster-explorer', params: { cluster: row.mgmt.id }}"
@@ -603,17 +584,18 @@ export default defineComponent({
                         >
                           {{ row.nameDisplay }}
                         </router-link>
-
-                        <!-- 否则只显示名称 -->
                         <span v-else>{{ row.nameDisplay }}</span>
                         <i
                           v-if="row.unavailableMachines"
                           v-clean-tooltip="row.unavailableMachines"
                           class="conditions-alert-icon icon-alert icon"
                         />
+                        <i
+                          v-if="row.isRke1"
+                          v-clean-tooltip="t('cluster.rke1Unsupported')"
+                          class="rke1-unsupported-icon icon-warning icon"
+                        />
                       </p>
-
-                      <!-- 集群描述 -->
                       <p
                         v-if="row.description"
                         class="cluster-description"
@@ -623,8 +605,6 @@ export default defineComponent({
                     </div>
                   </td>
                 </template>
-
-                <!-- 列渲染：Kubernetes 版本 + 架构 -->
                 <template #col:kubernetesVersion="{row}">
                   <td class="col-name">
                     <span>
@@ -638,8 +618,6 @@ export default defineComponent({
                     </div>
                   </td>
                 </template>
-
-                <!-- 列渲染：CPU 核数 -->
                 <template #col:cpu="{row}">
                   <td v-if="row.mgmt && cpuAllocatable(row.mgmt)">
                     {{ `${cpuAllocatable(row.mgmt)} ${t('landing.clusters.cores', {count:cpuAllocatable(row.mgmt) })}` }}
@@ -648,8 +626,6 @@ export default defineComponent({
                     &mdash;
                   </td>
                 </template>
-
-                <!-- 列渲染：内存 -->
                 <template #col:memory="{row}">
                   <td v-if="row.mgmt && memoryAllocatable(row.mgmt) && !memoryAllocatable(row.mgmt).match(/^0 [a-zA-z]/)">
                     {{ memoryAllocatable(row.mgmt) }}
@@ -658,20 +634,16 @@ export default defineComponent({
                     &mdash;
                   </td>
                 </template>
-
-                <!-- 列渲染：探索按钮 -->
-                <template #cell:explorer="{row}">
+                <!-- <template #cell:explorer="{row}">
                   <router-link v-if="row && row.isReady" class="btn btn-sm role-primary" :to="{name: 'c-cluster', params: {cluster: row.id}}">
                     {{ t('landing.clusters.explore') }}
                   </router-link>
                   <button v-else :disabled="true" class="btn btn-sm role-primary">
                     {{ t('landing.clusters.explore') }}
                   </button>
-                </template>
+                </template> -->
               </PaginatedResourceTable>
             </div>
-
-            <!-- 单集群模式 -->
             <div
               v-else
               class="col span-12"
@@ -680,8 +652,7 @@ export default defineComponent({
             </div>
           </div>
         </div>
-        <!-- 右侧社区链接面板 -->
-        <!-- <CommunityLinks class="col span-3 side-panel" /> -->
+        <CommunityLinks class="col span-3 side-panel" />
       </div>
     </IndentedPanel>
   </div>
@@ -707,29 +678,13 @@ export default defineComponent({
     }
   }
 
-  .set-login-page, .whats-new {
-    > :deep() .banner__content {
-      display: flex;
-
-      > div {
-        flex: 1;
-      }
-      > a {
-        align-self: flex-end;
-      }
-    }
-  }
-
-  .banner.set-login-page {
-    border: 1px solid var(--border);
-  }
   .table-heading {
     align-items: center;
     display: flex;
     height: 39px;
 
     & > a {
-      margin-right: 10px;
+      margin-left: 10px;
     }
   }
   .panel:not(:first-child) {
@@ -760,7 +715,7 @@ export default defineComponent({
       align-items: center;
 
       // Ensure long cluster names truncate with ellipsis
-      > A {
+      > A, > span {
         overflow: hidden;
         text-overflow: ellipsis;
       }
@@ -777,6 +732,11 @@ export default defineComponent({
       color: var(--error);
       margin-left: 4px;
     }
+
+    .rke1-unsupported-icon {
+      color: var(--warning);
+      margin-left: 4px;
+    }
   }
 
   // Hide the side-panel showing links when the screen is small

package/pages/prefs.vue

@@ -17,7 +17,6 @@ import LabeledSelect from '@shell/components/form/LabeledSelect';
 import { addObject } from '@shell/utils/array';
 import LocaleSelector from '@shell/components/LocaleSelector';
 import TabTitle from '@shell/components/TabTitle';
-import { HARVESTER_NAME as HARVESTER } from '@shell/config/features';
 
 export default {
   components: {
@@ -44,7 +43,7 @@ export default {
     ...mapGetters({ hasMultipleLocales: 'i18n/hasMultipleLocales' }),
 
     isHarvester() {
-      return this.isSingleProduct?.productName === HARVESTER;
+      return this.isSingleProduct?.productName === 'harvester';
     },
 
     theme: {
@@ -190,13 +189,11 @@ export default {
     <!-- Language -->
     <div
       v-if="hasMultipleLocales && !isHarvester"
-      class="mb-20 p-20 pb-0"
-      style="border: 1px solid var(--nav-border);"
+      class="mt-10 mb-10"
     >
       <h4
         id="prefs-language"
         v-t="'prefs.language'"
-        class="pb-20"
       />
       <div class="row">
         <div class="col span-4">
@@ -208,35 +205,36 @@ export default {
       </div>
     </div>
     <!-- Theme -->
-    <div class="mb-20 p-20" style="border: 1px solid var(--nav-border);">
-      <h4 v-t="'prefs.theme.label'" class="mb-20" />
+    <div class="mt-10 mb-10">
+      <h4 v-t="'prefs.theme.label'" />
       <ButtonGroup
         v-model:value="theme"
         data-testid="prefs__themeOptions"
         :options="themeOptions"
       />
-      <!-- <div class="mt-10">
+      <div class="mt-10">
         <t
           k="prefs.theme.autoDetail"
           :pm="pm"
           :am="am"
         />
-      </div> -->
+      </div>
     </div>
     <!-- Login landing page -->
     <div
       v-if="!isSingleProduct"
-      class="mb-20 p-20"
-      style="border: 1px solid var(--nav-border);"
+      class="mt-10 mb-10"
     >
-      <h4 v-t="'prefs.landing.label'" class="mb-20" />
+      <hr role="none">
+      <h4 v-t="'prefs.landing.label'" />
       <LandingPagePreference
         data-testid="prefs__landingPagePreference"
       />
     </div>
     <!-- Display Settings -->
-    <div class="mb-20 p-20" style="border: 1px solid var(--nav-border);">
-      <h4 v-t="'prefs.displaySettings.title'" class="mb-20" />
+    <div class="mt-10 mb-10">
+      <hr role="none">
+      <h4 v-t="'prefs.displaySettings.title'" />
       <p class="set-landing-leadin">
         {{ t('prefs.displaySettings.detail', {}, raw=true) }}
       </p>
@@ -277,10 +275,10 @@ export default {
     <!-- Confirmation setting -->
     <div
       v-if="!isSingleProduct"
-      class="col adv-features mb-20 p-20"
-      style="border: 1px solid var(--nav-border);"
+      class="col adv-features mt-10 mb-10"
     >
-      <h4 v-t="'prefs.confirmationSetting.title'" class="mb-20" />
+      <hr role="none">
+      <h4 v-t="'prefs.confirmationSetting.title'" />
       <Checkbox
         v-model:value="scalingDownPrompt"
         data-testid="prefs__scalingDownPrompt"
@@ -289,8 +287,9 @@ export default {
       />
     </div>
     <!-- Advanced Features -->
-    <div class="col adv-features mb-20 p-20" style="border: 1px solid var(--nav-border);">
-      <h4 v-t="'prefs.advFeatures.title'" class="mb-20" />
+    <div class="col adv-features mt-10 mb-10">
+      <hr role="none">
+      <h4 v-t="'prefs.advFeatures.title'" />
       <Checkbox
         v-model:value="viewInApi"
         data-testid="prefs__viewInApi"
@@ -326,13 +325,15 @@ export default {
         <Checkbox
           v-model:value="pluginDeveloper"
           :label="t('prefs.advFeatures.pluginDeveloper', {}, true)"
+          :tooltip="t('prefs.advFeatures.pluginDeveloperTooltip')"
           class="mt-20"
         />
       </template>
     </div>
     <!-- YAML editor key mapping -->
-    <div class="col mb-20 p-20" style="border: 1px solid var(--nav-border);">
-      <h4 v-t="'prefs.keymap.label'" class="mb-20" />
+    <div class="col mt-10 mb-10">
+      <hr role="none">
+      <h4 v-t="'prefs.keymap.label'" />
       <ButtonGroup
         v-model:value="keymap"
         data-testid="prefs__keymapOptions"
@@ -342,10 +343,10 @@ export default {
     <!-- Helm Charts -->
     <div
       v-if="!isSingleProduct"
-      class="col mb-40 p-20"
-      style="border: 1px solid var(--nav-border);"
+      class="col mt-10 mb-40"
     >
-      <h4 v-t="'prefs.helm.label'" class="mb-20" />
+      <hr role="none">
+      <h4 v-t="'prefs.helm.label'" />
       <ButtonGroup
         v-model:value="showPreRelease"
         data-testid="prefs__helmOptions"
@@ -364,7 +365,4 @@ export default {
     max-width: 80vw;
     color: var(--input-label);
   }
-  h4{
-    font-size: 14px;
-  }
 </style>

package/promptRemove/mixin/roleDeletionCheck.js

@@ -92,10 +92,10 @@ export default {
             this.info = '';
             this.warning = this.t('rbac.globalRoles.usersBound', { count: uniqueUsersWithBinds.size });
           } else {
-            this.info = this.t('rbac.globalRoles.notBound');
+            this.info = this.t('rbac.globalRoles.notBound', null, true);
           }
         } else {
-          this.info = this.t('rbac.globalRoles.notBound');
+          this.info = this.t('rbac.globalRoles.notBound', null, true);
         }
       } catch (e) {
         this.info = this.t('rbac.globalRoles.unableToCheck');

package/public/index.html

@@ -6,7 +6,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="shortcut icon" type="image/x-icon" href="/favicon.png">
-    <title>HCI</title>
+    <title>Rancher</title>
 </head>
 
 <body>
@@ -49,11 +49,11 @@
 
         .initial-load-spinner {
             animation: initial-load-animate 1s infinite linear;
-            background-color: transparent;
+            background-color: var(--loading-bg-color);
             box-sizing: border-box;
-            border: 5px solid #1890FF;
+            border: 5px solid #008ACF;
             border-radius: 50%;
-            border-top-color: transparent;
+            border-top-color: #00B2E2;
             display: inline-block;
             height: 80px;
             margin: 0 auto;

package/rancher-components/BadgeState/BadgeState.vue

@@ -1,6 +1,5 @@
 <script lang="ts">
 import { PropType, defineComponent } from 'vue';
-import { mapGetters } from 'vuex';
 
 interface Badge {
   stateBackground: string;
@@ -48,15 +47,12 @@ export default defineComponent({
   },
 
   computed: {
-    ...mapGetters({ t: 'i18n/t' }),
     bg(): string | null {
       return this.value?.stateBackground || this.color;
     },
 
     msg(): string | null {
-      let text = this.value?.stateDisplay || this.label;
-      let zhText = this.t(`stateLabel.${ text }`)
-      return zhText ? zhText : text
+      return this.value?.stateDisplay || this.label;
     }
   }
 });
@@ -68,7 +64,9 @@ export default defineComponent({
       v-if="icon"
       class="icon"
       :class="{[icon]: true, 'mr-5': !!msg}"
-    />{{ msg }}
+    />
+    <span class="msg">{{ msg }}</span>
+    <slot name="content-right" />
   </span>
 </template>