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

package/components/form/Members/ClusterPermissionsEditor.vue

@@ -143,30 +143,46 @@ export default {
       return [this.permissionGroup];
     },
     options() {
+
       const customRoles = this.customRoles.map((role) => ({
         label:       role.nameDisplay,
         description: role.description || role.metadata?.annotations?.[DESCRIPTION] || this.t('members.clusterPermissions.noDescription'),
         value:       role.id
       }));
 
-      return [
-        {
-          label:       this.t('members.clusterPermissions.owner.label'),
-          description: this.t('members.clusterPermissions.owner.description'),
-          value:       'owner'
-        },
-        {
-          label:       this.t('members.clusterPermissions.member.label'),
-          description: this.t('members.clusterPermissions.member.description'),
-          value:       'member'
-        },
-        ...customRoles,
-        {
-          label:       this.t('members.clusterPermissions.custom.label'),
-          description: this.t('members.clusterPermissions.custom.description'),
-          value:       'custom'
-        }
-      ];
+      let optionList =  [{
+        label:       this.t('members.clusterPermissions.cluster-tenant.label'),
+        description: this.t('members.clusterPermissions.cluster-tenant.description'),
+        value:       'cluster-tenant'
+      }];
+
+      if (sessionStorage.getItem('TOPLEVELPERMISSIONS') === 'superadmin') {
+        optionList = [
+          {
+            label:       this.t('members.clusterPermissions.cluster-tenant.label'),
+            description: this.t('members.clusterPermissions.cluster-tenant.description'),
+            value:       'cluster-tenant'
+          },
+          {
+            label:       this.t('members.clusterPermissions.owner.label'),
+            description: this.t('members.clusterPermissions.owner.description'),
+            value:       'owner'
+          },
+          {
+            label:       this.t('members.clusterPermissions.member.label'),
+            description: this.t('members.clusterPermissions.member.description'),
+            value:       'member'
+          },
+          ...customRoles,
+          {
+            label:       this.t('members.clusterPermissions.custom.label'),
+            description: this.t('members.clusterPermissions.custom.description'),
+            value:       'custom'
+          }
+        ];
+      }
+
+      return optionList
     },
     principal() {
       const principalId = this.principalId.replace(/\//g, '%2F');
@@ -232,11 +248,10 @@ export default {
     v-else
     class="cluster-permissions-editor"
   >
-    <div class="row mt-10">
+    <div class="row mt-10 mb-20">
       <div class="col span-12">
         <SelectPrincipal
           v-focus
-          class="mb-20"
           :mode="mode"
           :retain-selection="true"
           data-testid="cluster-member-select"
@@ -259,31 +274,34 @@ export default {
         </div>
       </template>
       <template v-slot:body>
-        <RadioGroup
-          v-model:value="permissionGroup"
-          :options="options"
-          name="permission-group"
-        />
-        <div
-          v-if="permissionGroup === 'custom'"
-          class="custom-permissions ml-20 mt-10"
-          :class="{'two-column': useTwoColumnsForCustom}"
-        >
+        <div style="max-height: 250px; overflow: auto;">
+          <RadioGroup
+            v-model:value="permissionGroup"
+            :options="options"
+            :flexDirection="'column'"
+            name="permission-group"
+          />
           <div
-            v-for="(permission, i) in customPermissionsUpdate"
-            :key="i"
+            v-if="permissionGroup === 'custom'"
+            class="custom-permissions ml-20 mt-10"
+            :class="{'two-column': useTwoColumnsForCustom}"
           >
-            <Checkbox
-              v-model:value="permission.value"
-              :disabled="permission.locked"
-              class="mb-5"
-              :label="permission.label"
-            />
-            <i
-              v-if="permission.locked"
-              v-clean-tooltip="permission.tooltip"
-              class="icon icon-lock icon-fw"
-            />
+            <div
+              v-for="(permission, i) in customPermissionsUpdate"
+              :key="i"
+            >
+              <Checkbox
+                v-model:value="permission.value"
+                :disabled="permission.locked"
+                class="mb-5"
+                :label="permission.label"
+              />
+              <i
+                v-if="permission.locked"
+                v-clean-tooltip="permission.tooltip"
+                class="icon icon-lock icon-fw"
+              />
+            </div>
           </div>
         </div>
       </template>

package/components/form/Members/MembershipEditor.vue

@@ -170,7 +170,7 @@ export default {
   >
     <template #column-headers>
       <div class="box mb-0">
-        <div class="column-headers row">
+        <div class="column-headers row" :style="{ width: isView ? '100%' : 'calc(100% - 100px)'}">
           <div class="col span-6">
             <label class="text-label">{{ t('membershipEditor.user') }}</label>
           </div>
@@ -181,7 +181,7 @@ export default {
       </div>
     </template>
     <template #columns="{row, i}">
-      <div class="columns row">
+      <div style="width: 100%;" class="columns row">
         <div class="col span-6">
           <Principal
             :value="row.value.principalId"
@@ -191,7 +191,7 @@ export default {
           :data-testid="`role-item-${i}`"
           class="col span-6 role"
         >
-          {{ row.value.roleDisplay }}
+          {{ $store.getters['i18n/withFallback'](`customConversion.${row.value.roleDisplay}`, row.value.roleDisplay) }}
         </div>
       </div>
     </template>
@@ -206,7 +206,7 @@ export default {
       </button>
     </template>
     <template #remove-button="{remove, i}">
-      <span v-if="(isCreate && i === 0) || isView" />
+      <div style="width: 100px;" v-if="(isCreate && i === 0) || isView" />
       <button
         v-else
         type="button"

package/components/form/Members/ProjectMembershipEditor.vue

@@ -58,6 +58,6 @@ export default {
     :type="NORMAN.PROJECT_ROLE_TEMPLATE_BINDING"
     :mode="mode"
     parent-key="projectId"
-    :parent-id="parentId"
+    :parent-id="parentId"
   />
 </template>

package/components/form/NameNsDescription.vue

@@ -156,6 +156,10 @@ export default {
       type:    Boolean,
       default: true,
     },
+    isDialog: {
+      type:    Boolean,
+      default: false
+    },
     rules: {
       default: () => ({
         namespace:   [],
@@ -172,6 +176,11 @@ export default {
     componentTestid: {
       type:    String,
       default: 'name-ns-description'
+    },
+
+    extraNamespaceOptions: {
+      type:    Array,
+      default: () => []
     }
   },
 
@@ -252,7 +261,7 @@ export default {
       const options = namespaces
         .map((namespace) => ({ nameDisplay: namespace, id: namespace }))
         .map(props.namespaceMapper || ((obj) => ({
-          label: obj.nameDisplay,
+          label: obj.nameDisplay.replace('harvester', 'cloud'),
           value: obj.id,
         })));
 
@@ -265,6 +274,16 @@ export default {
         });
       }
 
+      if (props.extraNamespaceOptions && props.extraNamespaceOptions.length > 0) {
+        props.extraNamespaceOptions.map(item => {
+          const objs = {
+            label: item,
+            value: item,
+          }
+          sortedByLabel.push(objs);
+        })
+      }
+
       const createButton = {
         label: t('namespace.createNamespace'),
         value: '',
@@ -276,10 +295,10 @@ export default {
         kind:     'divider'
       };
 
-      const createOverhead = canCreateNamespace.value || props.createNamespaceOverride ? [createButton, divider] : [];
+      // const createOverhead = canCreateNamespace.value || props.createNamespaceOverride ? [createButton, divider] : [];
 
       return [
-        ...createOverhead,
+        // ...createOverhead,
         ...sortedByLabel
       ];
     });
@@ -356,10 +375,11 @@ export default {
 
     colSpan() {
       if (!this.horizontal) {
-        return `span-8`;
+        return `span-6`;
       }
       // Name and namespace take up two columns.
-      let cols = (this.nameNsHidden ? 0 : 2) + (this.descriptionHidden ? 0 : 1) + this.extraColumns.length;
+      // let cols = (this.nameNsHidden ? 0 : 2) + (this.descriptionHidden ? 0 : 1) + this.extraColumns.length;
+      let cols = 2;
 
       cols = Math.max(2, cols); // If there's only one column, make it render half-width as if there were two
       const span = 12 / cols; // If there's 5, 7, or more columns this will break; don't do that.
@@ -428,13 +448,18 @@ export default {
 </script>
 
 <template>
-  <div class="row mb-20">
-    <slot name="project-selector" />
+  <div class="row">
+
+    <!-- 命名空间创建输入框 -->
     <div
       v-if="namespaced && !nameNsHidden && createNamespace"
       :data-testid="componentTestid + '-namespace-create'"
-      class="col span-3"
+      class="col span-6"
+      :class=" isDialog? 'namespace-item-row mb-20': 'col span-6'"
+      style="display: flex;"
     >
+
+      <!-- 输入命名空间名称 -->
       <LabeledInput
         ref="namespaceInput"
         v-model:value="namespace"
@@ -446,6 +471,8 @@ export default {
         :required="nameRequired"
         :rules="rules.namespace"
       />
+
+      <!-- 取消创建命名空间按钮 -->
       <button
         :aria-label="t('namespace.cancelCreateAriaLabel')"
         @click="cancelCreateNamespace"
@@ -456,10 +483,12 @@ export default {
         />
       </button>
     </div>
+
+    <!-- 命名空间选择下拉框 -->
     <div
       v-if="namespaced && !nameNsHidden && !createNamespace"
       :data-testid="componentTestid + '-namespace'"
-      class="col span-3"
+      :class=" isDialog? 'namespace-item-row mb-20': 'col span-6'"
     >
       <LabeledSelect
         v-show="!createNamespace"
@@ -478,10 +507,11 @@ export default {
       />
     </div>
 
+    <!-- 名称输入框 -->
     <div
       v-if="!nameHidden && !nameNsHidden"
       :data-testid="componentTestid + '-name'"
-      class="col span-3"
+      :class=" isDialog? 'namespace-item-row mb-20': 'col span-6'"
     >
       <LabeledInput
         ref="nameInput"
@@ -498,11 +528,29 @@ export default {
       />
     </div>
 
+    <!-- 自定义插槽，可插入额外内容 -->
     <slot name="customize" />
-    <div
+
+    <!-- <div
       v-show="!descriptionHidden"
       :data-testid="componentTestid + '-description'"
       :class="['col', extraColumns.length > 0 ? 'span-3' : 'span-6']"
+    > -->
+
+    <!-- 额外的动态列 -->
+    <div
+      v-for="(slot, i) in extraColumns"
+      :key="i"
+      :class="{ col: true, [colSpan]: true }"
+    >
+      <slot :name="slot" />
+    </div>
+
+    <!-- 描述输入框 -->
+    <div
+      v-show="!descriptionHidden"
+      :data-testid="componentTestid + '-description'"
+       :class=" isDialog? 'namespace-item-row mb-20': 'col span-6'"
     >
       <LabeledInput
         key="description"
@@ -516,13 +564,15 @@ export default {
       />
     </div>
 
+    <!-- 底部插槽 -->
     <div
-      v-for="(slot, i) in extraColumns"
-      :key="i"
-      :class="{ col: true, [colSpan]: true }"
+      v-if="$slots.bottom"
+      style="width: 100%;"
     >
-      <slot :name="slot" />
+      <slot name="bottom" />
     </div>
+
+    <!-- 间隔占位符 -->
     <div
       v-if="showSpacer"
       class="spacer"
@@ -533,13 +583,8 @@ export default {
 <style lang="scss" scoped>
 button {
   all: unset;
-  height: 0;
-  position: relative;
-  top: -35px;
-  float: right;
-  margin-right: 7px;
-
   cursor: pointer;
+  margin-left: 10px;
 
   .align-value {
     padding-top: 7px;
@@ -576,4 +621,14 @@ button {
   }
 
 }
+.namespace-item-row{
+  width: 100%;
+  margin-bottom: 4px;
+  position:relative;
+  display: flex;
+}
+.namespace-item-row ::v-deep textarea{
+    width: 400px;
+  }
+
 </style>

package/components/form/Networking.vue

@@ -160,7 +160,7 @@ export default {
   <div>
     <div>
       <h3>{{ t('workload.container.titles.networkSettings') }}</h3>
-      <div class="row mb-20">
+      <div class="row">
         <div class="col span-6">
           <LabeledSelect
             v-model:value="networkMode"
@@ -205,12 +205,11 @@ export default {
         </div>
       </div>
     </div>
-    <div class="spacer" />
 
-    <div>
+    <div class="mt-20">
       <h3>{{ t('workload.networking.dns') }}</h3>
       <div class="row">
-        <div class="col span-6">
+        <div class="span-6">
           <ArrayList
             key="dnsNameservers"
             v-model:value="nameservers"
@@ -222,7 +221,7 @@ export default {
             @update:value="update"
           />
         </div>
-        <div class="col span-6">
+        <div class="span-6">
           <ArrayList
             key="dnsSearches"
             v-model:value="searches"
@@ -236,9 +235,8 @@ export default {
         </div>
       </div>
     </div>
-    <div class="spacer" />
 
-    <div class="mt-20">
+    <div>
       <div class="row">
         <KeyValue
           v-model:value="options"
@@ -254,9 +252,8 @@ export default {
         />
       </div>
     </div>
-    <div class="spacer" />
 
-    <div class="row mt-20">
+    <div class="row mt-40">
       <div class="col span-12">
         <KeyValue
           key="hostAliases"

package/components/form/NodeAffinity.vue

@@ -210,33 +210,31 @@ export default {
         @remove="remove"
       >
         <template #default="props">
-          <div class="row">
-            <div class="col span-9">
-              <LabeledSelect
-                :options="affinityOptions"
-                :value="priorityDisplay(props.row.value)"
-                :label="t('workload.scheduling.affinity.priority')"
-                :mode="mode"
-                :data-testid="`node-affinity-priority-index${props.i}`"
-                @update:value="(changePriority(props.row.value))"
-              />
-            </div>
-            <div
-              v-if="'weight' in props.row.value"
-              class="col span-3"
-            >
-              <LabeledInput
-                v-model:value.number="props.row.value.weight"
-                :mode="mode"
-                type="number"
-                min="1"
-                max="100"
-                :label="t('workload.scheduling.affinity.weight.label')"
-                :placeholder="t('workload.scheduling.affinity.weight.placeholder')"
-                :data-testid="`node-affinity-weight-index${props.i}`"
-                @update:value="update"
-              />
-            </div>
+          <div class="col">
+            <LabeledSelect
+              :options="affinityOptions"
+              :value="priorityDisplay(props.row.value)"
+              :label="t('workload.scheduling.affinity.priority')"
+              :mode="mode"
+              :data-testid="`node-affinity-priority-index${props.i}`"
+              @update:value="(changePriority(props.row.value))"
+            />
+          </div>
+          <div
+            v-if="'weight' in props.row.value"
+            class="col"
+          >
+            <LabeledInput
+              v-model:value.number="props.row.value.weight"
+              :mode="mode"
+              type="number"
+              min="1"
+              max="100"
+              :label="t('workload.scheduling.affinity.weight.label')"
+              :placeholder="t('workload.scheduling.affinity.weight.placeholder')"
+              :data-testid="`node-affinity-weight-index${props.i}`"
+              @update:value="update"
+            />
           </div>
           <MatchExpressions
             :value="matchingSelectorDisplay ? props.row.value : props.row.value.matchExpressions"
@@ -254,5 +252,8 @@ export default {
   </div>
 </template>
 
-<style>
+<style lang="scss" scoped>
+.weight_input{
+  margin-left: 10px;
+}
 </style>

package/components/form/Password.vue

@@ -41,6 +41,10 @@ export default {
     mode: {
       type:    String,
       default: _CREATE,
+    },
+    placeholder: {
+      type:    String,
+      default: '',
     }
   },
   data() {
@@ -116,6 +120,7 @@ export default {
       :disabled="isRandom"
       :ignore-password-managers="ignorePasswordManagers"
       :mode="mode"
+      :placeholder="placeholder"
       @blur="$emit('blur', $event)"
     >
       <template #suffix>
@@ -148,12 +153,13 @@ export default {
     </LabeledInput>
     <div
       v-if="isRandom"
-      class="mt-10 genPassword"
+      class="genPassword"
     >
       <a
         href="#"
         @click.prevent.stop="generatePassword"
-      ><i class="icon icon-refresh" /> {{ t('changePassword.newGeneratedPassword') }}</a>
+        style="height: 32px;display: flex;align-items: center;"
+      ><i class="icon icon-refresh mr-5 pl-5" /> {{ t('changePassword.newGeneratedPassword') }}</a>
     </div>
   </div>
 </template>
@@ -161,20 +167,23 @@ export default {
 <style lang="scss" scoped>
   .password {
     display: flex;
-    flex-direction: column;
+    /* flex-direction: column; */
 
     .labeled-input {
       .addon {
-        display: flex;
+        position: absolute;
+        top: 6px;
+        right: 6px;
+        /* display: flex;
         align-items: center;
         justify-content: center;
         padding-left: 12px;
-        min-width: 65px;
+        min-width: 65px; */
 
-        .hide-show:focus-visible {
+        /* .hide-show:focus-visible {
           @include focus-outline;
           outline-offset: 4px;
-        }
+        } */
       }
     }
     .genPassword {

package/components/form/PodAffinity.vue

@@ -364,36 +364,33 @@ export default {
     <div class="col span-12">
       <ArrayListGrouped
         v-model:value="allSelectorTerms"
-        class="mt-20"
         :default-add-value="defaultAddValue"
         :mode="mode"
         :add-label="addLabel"
         @remove="remove"
       >
         <template #default="props">
-          <div class="row mt-20 mb-20">
-            <div class="col span-6">
-              <LabeledSelect
-                :mode="mode"
-                :options="[t('workload.scheduling.affinity.affinityOption'),t('workload.scheduling.affinity.antiAffinityOption')]"
-                :value="props.row.value._anti ?t('workload.scheduling.affinity.antiAffinityOption') :t('workload.scheduling.affinity.affinityOption') "
-                :label="t('workload.scheduling.affinity.type')"
-                :data-testid="`pod-affinity-type-index${props.i}`"
-                @update:value="props.row.value._anti = !props.row.value._anti"
-              />
-            </div>
-            <div class="col span-6">
-              <LabeledSelect
-                :mode="mode"
-                :options="[t('workload.scheduling.affinity.preferred'),t('workload.scheduling.affinity.required')]"
-                :value="priorityDisplay(props.row.value)"
-                :label="t('workload.scheduling.affinity.priority')"
-                :data-testid="`pod-affinity-priority-index${props.i}`"
-                @update:value="changePriority(props.row.value, props.i)"
-              />
-            </div>
+          <div class="col">
+            <LabeledSelect
+              :mode="mode"
+              :options="[t('workload.scheduling.affinity.affinityOption'),t('workload.scheduling.affinity.antiAffinityOption')]"
+              :value="props.row.value._anti ?t('workload.scheduling.affinity.antiAffinityOption') :t('workload.scheduling.affinity.affinityOption') "
+              :label="t('workload.scheduling.affinity.type')"
+              :data-testid="`pod-affinity-type-index${props.i}`"
+              @update:value="props.row.value._anti = !props.row.value._anti"
+            />
           </div>
-          <div class="row">
+          <div class="col">
+            <LabeledSelect
+              :mode="mode"
+              :options="[t('workload.scheduling.affinity.preferred'),t('workload.scheduling.affinity.required')]"
+              :value="priorityDisplay(props.row.value)"
+              :label="t('workload.scheduling.affinity.priority')"
+              :data-testid="`pod-affinity-priority-index${props.i}`"
+              @update:value="changePriority(props.row.value, props.i)"
+            />
+          </div>
+          <div class="row mb-20">
             <RadioGroup
               :options="namespaceSelectionOptions"
               :labels="namespaceSelectionLabels"
@@ -439,7 +436,7 @@ export default {
             @update:value="e=>updateLabelSelector(e, props)"
           />
           <div class="row mt-20">
-            <div class="col span-9">
+            <div class="col">
               <LabeledSelect
                 v-if="hasNodes"
                 v-model:value="props.row.value.topologyKey"
@@ -467,9 +464,11 @@ export default {
                 @update:value="update"
               />
             </div>
+          </div>
+          <div class="row">
             <div
               v-if="'weight' in props.row.value"
-              class="col span-3"
+              class="col"
             >
               <LabeledInput
                 v-model:value.number="props.row.value.weight"