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

package/components/breadcrumb/index.vue

@@ -1,340 +0,0 @@
-<script>
-import { KUBERNETES, PROJECT } from '@shell/config/labels-annotations';
-import { FLEET, NAMESPACE, MANAGEMENT, HELM } from '@shell/config/types';
-import ButtonGroup from '@shell/components/ButtonGroup';
-// import { BadgeState } from '@components/BadgeState';
-import DotState from '@shell/components/DotState.vue';
-import { Banner } from '@components/Banner';
-import { get } from '@shell/utils/object';
-import { NAME as FLEET_NAME } from '@shell/config/product/fleet';
-import { HIDE_SENSITIVE } from '@shell/store/prefs';
-import {
-  AS, _DETAIL, _CONFIG, _YAML, MODE, _CREATE, _EDIT, _VIEW, _UNFLAG, _GRAPH
-} from '@shell/config/query-params';
-import { ExtensionPoint, PanelLocation } from '@shell/core/types';
-import ExtensionPanel from '@shell/components/ExtensionPanel';
-import TabTitle from '@shell/components/TabTitle';
-import ActionMenu from '@shell/components/ActionMenuShell.vue';
-import { useRuntimeFlag } from '@shell/composables/useRuntimeFlag';
-import { useStore } from 'vuex';
-
-// i18n-uses resourceDetail.header.*
-
-/**
- * Resource Detail Masthead component.
- *
- * ToDo: this component seem to be picking up a lot of logic from special cases, could be simplified down to parameters and then customized per use-case via wrapper component
- */
-export default {
-
-  name: 'MastheadResourceDetail',
-
-  components: {
-    // BadgeState,
-    DotState,
-    Banner,
-    ButtonGroup,
-    ExtensionPanel,
-    TabTitle,
-    ActionMenu,
-  },
-  props: {
-    value: {
-      type:    Object,
-      default: () => {
-        return {};
-      }
-    },
-
-    mode: {
-      type:    String,
-      default: 'view'
-    },
-
-    realMode: {
-      type:    String,
-      default: 'view'
-    },
-
-    as: {
-      type:    String,
-      default: _YAML,
-    },
-
-    storeOverride: {
-      type:    String,
-      default: null,
-    },
-
-    resource: {
-      type:    String,
-      default: null,
-    },
-
-    resourceSubtype: {
-      type:    String,
-      default: null,
-    },
-
-    parentRouteOverride: {
-      type:    String,
-      default: null,
-    },
-
-  },
-
-  setup() {
-    const store = useStore();
-    const { featureDropdownMenu } = useRuntimeFlag(store);
-
-    return { featureDropdownMenu };
-  },
-
-  data() {
-    return {
-      DETAIL_VIEW:       _DETAIL,
-      extensionType:     ExtensionPoint.PANEL,
-      extensionLocation: PanelLocation.DETAILS_MASTHEAD,
-      Svg:               require('~shell/assets/images/API.svg')
-    };
-  },
-
-  computed: {
-    dev() {
-      return this.$store.getters['prefs/dev'];
-    },
-
-    schema() {
-      const inStore = this.storeOverride || this.$store.getters['currentStore'](this.resource);
-
-      return this.$store.getters[`${ inStore }/schemaFor`]( this.resource );
-    },
-
-    isProjectHelmChart() {
-      return this.schema?.id === HELM.PROJECTHELMCHART;
-    },
-
-    shouldHifenize() {
-      return (this.mode === 'view' || this.mode === 'edit') && this.resourceSubtype?.length && this.value?.nameDisplay?.length;
-    },
-
-    parent() {
-      const displayName = this.value?.parentNameOverride || this.$store.getters['type-map/labelFor'](this.schema);
-      const product = this.$store.getters['currentProduct'].name;
-
-      const defaultLocation = {
-        name:   'c-cluster-product-resource',
-        params: {
-          resource: this.resource,
-          product,
-        }
-      };
-
-      const location = this.value?.parentLocationOverride || defaultLocation;
-
-      if (this.parentRouteOverride) {
-        location.name = this.parentRouteOverride;
-      }
-
-      const typeOptions = this.$store.getters[`type-map/optionsFor`]( this.resource );
-
-      // 转换为中文
-      const displayName_zh_hans = {
-        'GlobalRole': '全局角色',
-        'RoleTemplate': '集群角色',
-      }
-      if (displayName_zh_hans[displayName]) {
-        displayName = displayName_zh_hans[displayName]
-      }
-      
-      if (displayName == '集群角色' && (this.$route.query?.roleContext == 'NAMESPACE' || location.hash == '#NAMESPACE')) {
-        displayName = '项目或资源组角色'
-      }
-
-      const out = {
-        displayName, location, ...typeOptions
-      };
-
-      return out;
-    },
-
-
-    displayName() {
-      let displayName = this.value.nameDisplay;
-
-      if (this.isProjectHelmChart) {
-        displayName = this.value.projectDisplayName;
-      }
-
-      return this.shouldHifenize ? ` - ${ displayName }` : displayName;
-    },
-
-    demoDisplay() {
-      const product = this.$store.getters['productId'];
-
-      const resources = this.location?.params?.resource || ''
-
-      const productId = this.$store.getters['type-map/groupForBasicType'](this.$store.getters['productId'], resources);
-
-      if (productId === undefined) {
-        return '';
-      }
-      const parts = productId.split('::');
-      const newString = 'root';
-
-      if (!parts?.includes(newString)) {
-        parts.unshift(newString); // 将字符串添加到数组第一位
-      }
-
-      const partsEn = parts.map((item) => {
-        return this.$store.getters['i18n/t'](`typeLabel."${ item.toLowerCase() }"`);
-      });
-
-      return partsEn;
-    },
-    menuIcon() {
-      const product = this.$store.getters['productId'];
-
-      const resources = this.location?.params?.resource || ''
-
-      return this.$store.getters['type-map/groupsForVirTypes'](product, resources);
-    },
-
-    location() {
-      const { parent } = this;
-
-      return parent?.location;
-    },
-
-  },
-
-  methods: {
-    get,
-  }
-};
-</script>
-
-<template>
-  <div class="masthead">
-    <div class="title">
-      <!-- 创建api密钥不需要面包屑 -->
-      <div
-        v-if="!(parentRouteOverride === 'account' && resource=== 'token')"
-        class="excram-list"
-      >
-        <span
-          v-for="(item,index) in demoDisplay"
-          :key="index"
-        >
-          <span>{{ item }}</span>
-          <span>/</span>
-        </span>
-        <span class="excram-last-name">
-          {{ (realMode === 'view'? '查看': realMode === 'edit' ? '编辑':'创建') + parent.displayName }}
-        </span>
-      </div>
-    </div>
-  </div>
-</template>
-
-<style lang='scss' scoped>
-
-  HEADER {
-    margin: 0;
-  }
-
-  .primaryheader {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    font-size:14px;
-    height: 50px;
-
-    h1 {
-      margin: 0;
-    }
-  }
-
-  .subheader{
-    display: flex;
-    flex-direction: row;
-    color: var(--input-label);
-    & > * {
-      margin: 5px 20px 5px 0px;
-    }
-
-    .live-data {
-      color: var(--body-text)
-    }
-  }
-
-  .state-banner {
-    margin: 3px 0 0 0;
-  }
-
-  .masthead-state {
-    font-size: initial;
-    display: inline-block;
-    position: relative;
-    /* top: -2px; */
-    font-size: 12px;
-    margin-left: 5px;
-  }
-
-  .masthead-istio {
-    .icon {
-      vertical-align: middle;
-      color: var(--primary);
-    }
-  }
-
-  .left-right-split {
-    display: grid;
-    align-items: center;
-
-    .left-half {
-      grid-column: 1;
-    }
-
-    .right-half {
-      grid-column: 2;
-    }
-  }
-
-  .resource-external {
-    font-size: 18px;
-  }
-  .excram-list{
-    font-size: 14px;
-    margin-bottom: 20px;
-  }
-  .excram-last-name{
-    color: var(--link);
-  }
-  .valid{
-    color: #d7d7d7;
-    margin: 0px 10px;
-  }
-  .detailIcon-span{
-    width: 24px;
-    height: 24px;
-    display: inline-block;
-    position: relative;
-    background: var(--primary);
-    margin-right: 10px;
-  }
-  .detailIcon{
-    position: absolute;
-    color: #fff;
-    font-size: 38px;
-    left: 4px;
-    top: -2px;
-  }
-  .primary-title{
-    display: flex;
-    align-items: center;
-  }
-  .detailIcon-span-title{
-    font-weight: bold;
-  }
-</style>

package/pages/account/pri.vue

@@ -1,229 +0,0 @@
-<script>
-import { NORMAN } from '@shell/config/types';
-
-export default {
-  props: {
-    value: {
-      type:     String,
-      required: true,
-    },
-
-    useMuted: {
-      type:    Boolean,
-      default: true,
-    },
-
-    showLabels: {
-      type:    Boolean,
-      default: false,
-    },
-    isShowPass: {
-      type:    Boolean,
-      default: false,
-    }
-  },
-
-  async fetch() {
-    this.principal = this.$store.getters['rancher/byId'](NORMAN.PRINCIPAL, this.value);
-
-    if ( this.principal ) {
-      return;
-    }
-
-    const principalId = escape(this.value).replace(/\//g, '%2F');
-
-    try {
-      this.principal = await this.$store.dispatch('rancher/find', {
-        type: NORMAN.PRINCIPAL,
-        id:   this.value,
-        opt:  { url: `/v3/principals/${ principalId }` }
-      });
-    } catch (e) {
-      console.error('Failed to fetch principal', this.value, principalId); // eslint-disable-line no-console
-    }
-  },
-
-  data() {
-    // Load from cache immediately if possible
-    return { principal: null };
-  },
-
-  computed: {
-    showBoth() {
-      const p = this.principal;
-
-      return p.name && p.loginName && p.name.trim().toLowerCase() !== p.loginName.trim().toLowerCase();
-    }
-  },
-};
-</script>
-
-<template>
-  <div
-    class="principal"
-    :class="{'showLabels': showLabels}"
-  >
-    <template v-if="!principal && $fetchState.pending">
-      <div class="avatar">
-        <div class="empty">
-          <i class="icon icon-spinner icon-lg" />
-        </div>
-      </div>
-      <div
-        v-clean-html="t('principal.loading', null, true)"
-        class="name"
-        :class="{'text-muted': useMuted}"
-      />
-      <div class="description" />
-    </template>
-
-    <template v-else-if="principal">
-      <div class="avatar">
-        <img
-          src="@shell/assets/images/user.png"
-        >
-      </div>
-      <div
-        v-if="showLabels"
-        class="name"
-      >
-        <table>
-          <tr class="mb-10">
-            <td>{{ t('principal.name') }}: </td><td>{{ principal.name || principal.loginName }}</td>
-          </tr>
-          <tr class="mb-10">
-            <td>{{ t('principal.loginName') }}: </td><td>{{ principal.loginName }}</td>
-          </tr>
-          <tr
-            v-if="isShowPass"
-            class="mb-10"
-          >
-            <td>修改密码: </td><td>****** <slot name="edit" /></td>
-          </tr>
-          <tr><td>{{ t('principal.type') }}: </td><td>{{ principal.displayType }}</td></tr>
-        </table>
-      </div>
-      <template v-else>
-        <div class="name">
-          <template v-if="showBoth">
-            {{ principal.name }}
-            <span
-              v-if="principal.loginName"
-              :class="{'text-muted': useMuted}"
-            >({{ principal.loginName }})</span>
-          </template>
-          <template v-else-if="principal.name">
-            {{ principal.name }}
-          </template>
-          <template v-else>
-            {{ principal.loginName }}
-          </template>
-        </div>
-        <div
-          class="description"
-          :class="{'text-muted': useMuted}"
-        >
-          {{ principal.displayType }}
-        </div>
-      </template>
-    </template>
-
-    <template v-else>
-      <div class="avatar">
-        <div
-          class="empty"
-          :class="{'text-muted': useMuted}"
-        >
-          <i class="icon icon-warning icon-lg" />
-        </div>
-      </div>
-      <div
-        v-t="'principal.error'"
-        class="name text-error"
-      />
-      <div
-        class="description"
-        :class="{'text-muted': useMuted}"
-      >
-        {{ value }}
-      </div>
-    </template>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-  $size: 79px;
-
-  .principal {
-    display: grid;
-    grid-template-areas:
-      "avatar name"
-      "avatar description";
-    grid-template-columns: $size auto;
-    grid-template-rows: auto math.div($size, 2);
-    column-gap: 10px;
-
-    th {
-      text-align: left;
-      font-weight: normal;
-      padding-right: 10px;
-    }
-
-    &.showLabels {
-      /* grid-template-areas:
-        "avatar name";
-      grid-template-columns: 60px auto;
-      grid-template-rows: 60px;
-      column-gap: 0; */
-      display: flex;
-      column-gap:0;
-      .name {
-        display: flex;
-        line-height: unset;
-      }
-      table tr {
-        display: block;
-      }
-      table tr td:not(:first-of-type) {
-        padding-left: 10px;
-      }
-      table tr td:not(:last-of-type) {
-        width: 100px;
-      }
-    }
-
-    .avatar {
-      /* grid-area: avatar;
-      text-align: center; */
-      width: 287px;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-
-      DIV.empty {
-        border: 1px solid var(--border);
-        line-height: $size;
-      }
-
-      IMG {
-        width: $size;
-        height: $size;
-      }
-
-      DIV.round, IMG.round {
-        border-radius: 50%;
-      }
-    }
-
-    .name {
-      grid-area: name;
-      line-height: math.div($size, 2);
-      overflow-wrap: anywhere;
-    }
-
-    .description {
-      grid-area: description;
-      line-height: math.div($size, 2);
-    }
-  }
-</style>