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

package/components/ResourceList/Masthead.vue

@@ -14,18 +14,6 @@ export default {
 
   name: 'MastheadResourceList',
 
-  mounted() {
-    this.observeWidth()
-  },
-
-  beforeUnmount() {
-    if (this.resizeObserver) {
-      this.resizeObserver.disconnect()
-      this.resizeObserver = null
-    }
-    this.$store.commit('type-map/setActionsWidth', 0) // 销毁时清空或回到默认值
-  },
-
   components: {
     Favorite,
     TypeDescription,
@@ -91,12 +79,7 @@ export default {
     componentTestid: {
       type:    String,
       default: 'masthead'
-    },
-
-    mainButtonVisible: {
-      type:    Boolean,
-      default: true
-    },
+    }
   },
 
   data() {
@@ -112,16 +95,10 @@ export default {
       query: { [AS]: _YAML },
     };
 
-    const tabList = ['集群配置'];
-
-    const description = ''
     return {
       formRoute,
       yamlRoute,
       hasEditComponent,
-      tabList,
-      description,
-      resizeObserver: null
     };
   },
 
@@ -148,67 +125,6 @@ export default {
 
       return this.$store.getters['type-map/labelFor'](this.schema, 99);
     },
-    _descriptionDisplay() {
-      const key = this.$route.path.split('/').pop();
-
-      return this.$store.getters['i18n/t'](`typeDescription."${ key.toLowerCase() }"`);
-    },
-    demoDisplay() {
-
-      const product = this.$store.getters['productId'];
-      const productId = this.$store.getters['type-map/groupForBasicType'](this.$store.getters['productId'], this._createLocation.params.resource);
-      const parts = productId?.split('::');
-      const newString = 'root';
-
-      // const product = this.$store.getters['productId'];
-      // const productId = this.$store.getters['type-map/groupForBasicType'](this.$store.getters['productId'], this._createLocation.params.resource);
-
-      // const parts = productId?.split('::') || [];
-      // const newString = 'root';
-
-      
-      const breadcrumbList = {
-        'harvesterhci.io.management.cluster': {
-          origin: 'Harvester 集群',
-          bread: ['虚拟化管理'],
-          description: '提供虚拟化集群的实时健康状态监控、版本号管理及资源负载管理，支持批量导入/删除集群、配置调优与权限分级功能，实现高效运维管控。'
-        },
-        'management.cattle.io.user': {
-          origin: '用户',
-          bread: ['用户 & 认证'],
-          description: '用于管理用户账号，支持创建、维护用户信息，可设置用户权限、管理密码等，保障系统资源仅由授权用户访问，提升系统安全性。'
-        },
-        'management.cattle.io.setting':{
-          origin: '基础设置',
-          bread: ['全局设置'],
-          description: '统一配置平台基础选项与全局设置，支持CA证书、密码规则、域名、Token时效等核心配置。'
-        },
-        'management.cattle.io.feature':{
-          origin: '功能开关',
-          bread: ['全局设置'],
-          description: '还没有添加描述。。。。'
-        },
-      }
-      const resourcePath = this.$route.params.resource || ''
-      
-      const breadcrumb = []
-      if (breadcrumbList[resourcePath] && Object.keys(breadcrumbList[resourcePath]).length > 0) {
-        breadcrumb.push(...breadcrumbList[resourcePath].bread)
-        this.description = breadcrumbList[resourcePath].description
-        return breadcrumb
-      } else {
-        if (!parts?.includes(newString)) {
-          parts?.unshift(newString); // 将字符串添加到数组第一位
-        }
-        
-        const partsEn = parts?.map((item) => {  
-          return this.$store.getters['i18n/t'](`typeLabel."${ item.toLowerCase() }"`);
-        });
-
-        return partsEn;
-      }
-
-    },
 
     _isYamlCreatable() {
       if ( this.isYamlCreatable !== null) {
@@ -249,176 +165,88 @@ export default {
 
       return this.createButtonLabel || this.t('resourceList.head.create');
     },
-  },
-
-  methods: {
-    observeWidth() {
-      const el = this.$refs.actionsContainer
-      if (!el) return
-
-      // 创建 ResizeObserver
-      this.resizeObserver = new ResizeObserver((entries) => {
-        for (const entry of entries) {
-          const width = entry?.contentRect?.width && entry.contentRect.width > 0 ? entry.contentRect.width + 10 : 0
-
-          console.log(width, ' width----------------------------')
-
-          this.$store.commit('type-map/setActionsWidth', width)
-        }
-      })
-
-      // 开始监听
-      this.resizeObserver.observe(el)
-    }
   }
 };
 </script>
 
 <template>
   <header class="with-subheader">
-    <div style="display: flex;width: 100%;">
-      <div style="flex: 1;">
-        <!-- 标题区域 -->
-        <div class="title">
-          <div class="excram-list">
-            <span
-              v-for="(item,index) in demoDisplay"
-              :key="index"
+    <slot name="typeDescription">
+      <TypeDescription :resource="resource" />
+    </slot>
+    <div class="title">
+      <h1 class="m-0">
+        <TabTitle>{{ _typeDisplay }}</TabTitle> <Favorite
+          v-if="isExplorer"
+          :resource="favoriteResource || resource"
+        />
+      </h1>
+      <ResourceLoadingIndicator
+        v-if="showIncrementalLoadingIndicator"
+        :resources="loadResources"
+        :indeterminate="loadIndeterminate"
+      />
+    </div>
+    <div class="sub-header">
+      <slot name="subHeader">
+        <!--Slot content-->
+      </slot>
+    </div>
+    <div class="actions-container">
+      <slot name="actions">
+        <div class="actions">
+          <slot name="extraActions" />
+
+          <slot name="createButton">
+            <router-link
+              v-if="hasEditComponent && _isCreatable"
+              :to="_createLocation"
+              class="btn role-primary"
+              :data-testid="componentTestid+'-create'"
+            >
+              {{ _createButtonlabel }}
+            </router-link>
+            <router-link
+              v-else-if="_isYamlCreatable"
+              :to="_yamlCreateLocation"
+              class="btn role-primary"
+              :data-testid="componentTestid+'-create-yaml'"
             >
-              <span v-if="item">{{ item }}</span>
-              <span v-if="item">/</span>
-            </span>
-            <span class="excram-last-name">{{ _typeDisplay }}</span>
-          </div>
-          <h1 style="display: flex;align-items: center;" class="m-0 descrip-name">
-            <TabTitle>{{ _typeDisplay }}</TabTitle>
-            <!-- 子标题区域 -->
-            <div class="sub-header">
-              <slot name="subHeader">
-                <!--Slot content-->
-              </slot>
-            </div>
-            
-            <!-- <Favorite
-              v-if="isExplorer"
-              :resource="favoriteResource || resource"
-            /> -->
-
-            <ResourceLoadingIndicator
-              style="margin-left: 10px;"
-              v-if="showIncrementalLoadingIndicator"
-              :resources="loadResources"
-              :indeterminate="loadIndeterminate"
-            />
-          </h1>
-          
-          <!-- 插槽：typeDescription，用于插入类型描述组件 -->
-          <div v-if="_descriptionDisplay" class="masthod-title-description">
-            {{ _descriptionDisplay }}
-          </div>
-  
+              {{ t("resourceList.head.createFromYaml") }}
+            </router-link>
+          </slot>
         </div>
-    
-
-      </div>
-      
-      <!-- 操作按钮区域 -->
-      <div 
-        ref="actionsContainer"
-        v-if="!(tabList.includes(_typeDisplay)) && mainButtonVisible"
-        class="actions-container actions-positioning"
-        style="min-height: 32px;align-self: flex-end;"
-      >
-        <slot name="actions">
-          <div class="actions">
-            <slot name="extraActions" />
-  
-            <slot name="createButton">
-              <router-link
-                v-if="hasEditComponent && _isCreatable"
-                :to="_createLocation"
-                class="btn role-primary"
-                :data-testid="componentTestid+'-create'"
-              >
-                {{ _createButtonlabel }}
-              </router-link>
-              <router-link
-                v-else-if="_isYamlCreatable"
-                :to="_yamlCreateLocation"
-                class="btn role-primary"
-                :data-testid="componentTestid+'-create-yaml'"
-              >
-                {{ t("resourceList.head.createFromYaml") }}
-              </router-link>
-            </slot>
-          </div>
-        </slot>
-      </div>
+      </slot>
     </div>
-    <div
-      v-if="!(tabList.includes(_typeDisplay))"
-      style="width: 110%;height: 1px;background-color: #D7D7D7;margin-top: 16px;margin-left: -20px;margin-right: -20px;"
-    />
   </header>
 </template>
 
 <style lang="scss" scoped>
   .title {
-    /* align-items: center;
-    display: flex; */
+    align-items: center;
+    display: flex;
     h1 {
       margin: 0;
     }
   }
 
   header {
-    /* margin-bottom: 20px; */
+    margin-bottom: 20px;
   }
 
   header.with-subheader {
-    /* grid-template-areas:
+    grid-template-areas:
       'type-banner type-banner'
       'title actions'
       'sub-header sub-header'
-      'state-banner state-banner'; */
-    position: relative;
-    display: flex;
-    margin-bottom: 16px;
-    flex-direction: column;
-  }
-  .excram-list{
-    font-size: 14px;
-    line-height: 22px;
-    margin-bottom: 20px;
-    font-family: 'Microsoft YaHei';
-  }
-  .excram-last-name{
-    color: var(--primary);
-  }
-  .descrip-name{
-    font-size: 26px;
-    font-family: 'Microsoft YaHei';
-  }
-  .masthod-title-description{
-    font-family: 'Microsoft YaHei';
-    margin-top: 20px;
-  }
-  .actions-container{
-    /* display: flex; */
-    /* margin-left: 0px; */
+      'state-banner state-banner';
   }
 
   .sub-header {
-    font-size: 16px;
-    margin-left: 5px;
-    .btn {
-      text-align: left !important;
-    }
-  }
+    grid-area: sub-header;
 
-  .actions-positioning {
-    position: absolute;
-    bottom: -48px;
-    z-index: 20;
+    a {
+      display: inline-block;
+    }
   }
 </style>

package/components/ResourceList/ResourceLoadingIndicator.vue

@@ -77,7 +77,7 @@ export default {
 <template>
   <div
     v-if="count && !haveAll"
-    class="resource-loading-indicator"
+    class="ml-10 resource-loading-indicator"
   >
     <div class="inner">
       <div class="resource-loader">
@@ -118,12 +118,10 @@ export default {
     .resource-loader {
       padding: 1px 10px;
       width: max-content;
-      height: 20px;
 
       .rl-fg, .rl-bg {
-        display: flex;
         align-content: center;
-        font-size: 12px;
+        display: flex;
 
         > i {
           font-size: 18px;
@@ -131,7 +129,6 @@ export default {
         }
 
         > span {
-          margin-top: 2px;
           margin-left: 5px;
         }
       }

package/components/ResourceTable.vue

@@ -55,12 +55,6 @@ export default {
   ],
 
   props: {
-    searchPlaceholder: {
-      // search框内的输入提示
-      type:    String,
-      default: '名称'
-    },
-    
     schema: {
       type:    Object,
       default: null,
@@ -264,10 +258,6 @@ export default {
   },
 
   computed: {
-    actionsWidth() {
-      return this.$store.getters['type-map/actionsWidth'] // 从 getter 里拿
-    },
-
     options() {
       return this.$store.getters[`type-map/optionsFor`](this.schema, this.externalPaginationEnabled);
     },
@@ -464,11 +454,6 @@ export default {
         const namespaceGroupable = this.$store.getters['isMultipleNamespaces'] && this.isNamespaced;
         const customGroupable = !!this.options?.listGroups?.length;
 
-        // sshkey去掉分组按钮
-        if(this.parsedPagingParams.singularLabel === 'SSH Key' || this.parsedPagingParams.singularLabel === '负载均衡器'){
-          return false
-        }
-
         return namespaceGroupable || customGroupable || this.groupOptions?.length;
       }
 
@@ -632,7 +617,6 @@ export default {
     :headers="_headers"
     :rows="filteredRows"
     :loading="loading"
-    :search-placeholder="searchPlaceholder"
     :alt-loading="altLoading"
     :group-by="computedGroupBy"
     :group="group"
@@ -662,11 +646,6 @@ export default {
     @group-value-change="group = $event"
     @enter="handleEnterKeyPress"
   >
-
-    <template #search-main-button>
-      <div :style="{ width: actionsWidth + 'px' }"></div>
-    </template>
-
     <template
       v-if="showGrouping && _groupOptions.length > 1"
       #header-middle
@@ -676,7 +655,6 @@ export default {
       <ButtonGroup
         v-model:value="group"
         :options="_groupOptions"
-        v-if="parsedPagingParams.singularLabel !== 'PCI设备'"
       />
     </template>
 
@@ -729,11 +707,11 @@ export default {
         class="hide"
         @shortkey="keyAction('edit')"
       />
-      <!-- <button
+      <button
         v-shortkey.once="['y']"
         class="hide"
         @shortkey="keyAction('yaml')"
-      /> -->
+      />
       <button
         v-if="_showBulkActions"
         v-shortkey.once="['del']"

package/components/SideNav.vue

@@ -20,9 +20,6 @@ import { TYPE_MODES } from '@shell/store/type-map';
 import { NAME as NAVLINKS } from '@shell/config/product/navlinks';
 import Group from '@shell/components/nav/Group';
 import LocaleSelector from '@shell/components/LocaleSelector';
-import { cloud2harvesterhci, harvester2cloud } from '@shell/utils/router';
-import { NORMAN } from '@shell/config/types';
-
 
 export default {
   name:       'SideNav',
@@ -115,14 +112,10 @@ export default {
 
   computed: {
     ...mapState(['managementReady', 'clusterReady']),
-    ...mapGetters(['isStandaloneHarvester', 'productId', 'clusterId', 'currentProduct', 'rootProduct', 'currentCluster', 'isSingleProduct', 'namespaceMode', 'isExplorer', 'isVirtualCluster']),
+    ...mapGetters(['isStandaloneHarvester', 'productId', 'clusterId', 'currentProduct', 'rootProduct', 'isSingleProduct', 'namespaceMode', 'isExplorer', 'isVirtualCluster']),
     ...mapGetters({ locale: 'i18n/selectedLocaleLabel', hasMultipleLocales: 'i18n/hasMultipleLocales' }),
     ...mapGetters('type-map', ['activeProducts']),
 
-    principal() {
-      return this.$store.getters['rancher/byId'](NORMAN.PRINCIPAL, this.$store.getters['auth/principalId']) || {};
-    },
-
     favoriteTypes: mapPref(FAVORITE_TYPES),
 
     supportLink() {
@@ -191,12 +184,6 @@ export default {
     allNavLinksIds() {
       return this.allNavLinks.map((a) => a.id);
     },
-
-    prod() {
-      const name = this.rootProduct.name;
-
-      return this.$store.getters['i18n/withFallback'](`product."${ name }"`, null, ucFirst(name));
-    },
   },
 
   methods: {
@@ -244,32 +231,9 @@ export default {
 
       replaceWith(this.groups, ...sortBy(out, ['weight:desc', 'label']));
 
-      // if (this.principal.loginName !== 'admin') {
-      //   // 递归过滤函数（根据 label）
-      //   this.groups = this.filterMenus(this.groups);
-      // }
-      
-
       this.gettingGroups = false;
     },
 
-    // filterMenus(menus) {
-    //   return menus
-    //     .filter(item => item.label !== 'RBAC') // 过滤掉顶层 RBAC
-    //     .map(item => {
-    //       let newItem = { ...item };
-    //       if (newItem.children) {
-    //         // 过滤掉 children 里的 "资源大盘"
-    //         newItem.children = newItem.children.filter(
-    //           child => child.label !== '资源大盘'
-    //         );
-    //         // 递归处理剩下的 children
-    //         newItem.children = filterMenus(newItem.children);
-    //       }
-    //       return newItem;
-    //     });
-    // },
-
     getProductsGroups(out, loadProducts, namespaceMode, productMap) {
       const clusterId = this.$store.getters['clusterId'];
       const currentType = this.$route.params.resource || '';
@@ -435,37 +399,30 @@ export default {
     role="navigation"
     :aria-label="t('nav.ariaLabel.sideNav')"
   >
-    <div class="side-all-title">
-      {{ prod == 'Cloud' && currentCluster ? '控制台' : prod }}
-    </div>
-
     <!-- Actual nav -->
     <div class="nav">
       <template
-      v-for="(g) in groups"
-      :key="g.name"
+        v-for="(g) in groups"
+        :key="g.name"
       >
-        <template v-if="principal.loginName && principal.loginName !== 'admin' && g.label === 'RBAC'">
-        </template>
-        <template v-else>
-          <Group
-            ref="groups"
-            id-prefix=""
-            class="package"
-            :group="g"
-            :can-collapse="!g.isRoot"
-            :show-header="!g.isRoot"
-            @selected="groupSelected($event)"
-            @expand="groupSelected($event)"
-          />
-        </template>
+        <Group
+          ref="groups"
+          id-prefix=""
+          class="package"
+          :group="g"
+          :can-collapse="!g.isRoot"
+          :show-header="!g.isRoot"
+          @selected="groupSelected($event)"
+          @expand="groupSelected($event)"
+        />
       </template>
     </div>
     <!-- SideNav footer area (seems to be tied to harvester) -->
-    <!-- <div
+    <div
       v-if="showProductFooter"
       class="footer"
     >
+      <!-- support link -->
       <router-link
         :to="supportLink"
         class="pull-right"
@@ -474,6 +431,7 @@ export default {
       >
         {{ t('nav.support', {hasSupport: true}) }}
       </router-link>
+      <!-- version number -->
       <span
         v-clean-tooltip="{content: displayVersion, placement: 'top'}"
         class="clip version text-muted"
@@ -481,14 +439,15 @@ export default {
         {{ displayVersion }}
       </span>
 
+      <!-- locale selector -->
       <LocaleSelector
         v-if="isSingleProduct && hasMultipleLocales && !isStandaloneHarvester"
         mode="login"
         :show-icon="false"
       />
-    </div> -->
+    </div>
     <!-- SideNav footer alternative -->
-    <!-- <div
+    <div
       v-else
       class="version text-muted flex"
     >
@@ -509,14 +468,13 @@ export default {
           (Harvester-{{ harvesterVersion }})
         </span>
       </template>
-    </div> -->
+    </div>
   </nav>
 </template>
 
 <style lang="scss" scoped>
   .side-nav {
     display: flex;
-    z-index: 10;
     flex-direction: column;
     .nav {
       flex: 1;
@@ -536,9 +494,6 @@ export default {
 
       A { padding-left: 0; }
     }
-    :deep() A:not(.menuRouterLink){
-      height: 50px;
-    }
 
     .tools {
       display: flex;
@@ -614,13 +569,4 @@ export default {
     display: flex;
   }
 
-
-  .side-all-title{
-    height: 50px;
-    line-height: 50px;
-    font-size: 16px;
-    color: #7f7f7f;
-    padding-left: 21px;
-    font-weight: bold;
-  }
 </style>