dashboard-shell-shell 3.0.5-test.9 → 3.0.5-tsh-rh01

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/PodAffinity.vue

@@ -370,27 +370,25 @@ export default {
         @remove="remove"
       >
         <template #default="props">
-          <div class="row mt-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="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
@@ -438,7 +436,7 @@ export default {
             @update:value="e=>updateLabelSelector(e, props)"
           />
           <div class="row mt-20">
-            <div class="col span-6">
+            <div class="col">
               <LabeledSelect
                 v-if="hasNodes"
                 v-model:value="props.row.value.topologyKey"
@@ -466,9 +464,11 @@ export default {
                 @update:value="update"
               />
             </div>
+          </div>
+          <div class="row">
             <div
               v-if="'weight' in props.row.value"
-              class="col span-6"
+              class="col"
             >
               <LabeledInput
                 v-model:value.number="props.row.value.weight"

package/components/form/Probe.vue

@@ -160,7 +160,7 @@ export default {
     <div class="row">
       <div
         data-testid="input-probe-kind"
-        class="col span-11-of-23"
+        class="span-9-of-23"
       >
         <LabeledSelect
           v-model:value="kind"
@@ -240,7 +240,7 @@ export default {
         </div>
       </div>
 
-      <div class="col span-1-of-13">
+      <div class="span-1-of-13">
         <hr
           v-if="kind && kind!=='none'"
           :style="{'position':'relative', 'margin':'0px'}"
@@ -252,12 +252,12 @@ export default {
       <!-- none -->
       <div
         v-if="!isNone"
-        class="col span-11-of-23"
+        class="span-11-of-23 ml-30"
       >
         <div class="row">
           <div
             data-testid="input-probe-periodSeconds"
-            class="col span-4"
+            class="col"
           >
             <UnitInput
               v-model:value="probe.periodSeconds"
@@ -269,9 +269,12 @@ export default {
               @update:value="update"
             />
           </div>
+        </div>
+        
+        <div class="row">
           <div
             data-testid="input-probe-initialDelaySeconds"
-            class="col span-4"
+            class="col"
           >
             <UnitInput
               v-model:value="probe.initialDelaySeconds"
@@ -283,9 +286,11 @@ export default {
               @update:value="update"
             />
           </div>
+        </div>
+        <div class="row">
           <div
             data-testid="input-probe-timeoutSeconds"
-            class="col span-4"
+            class="col"
           >
             <UnitInput
               v-model:value="probe.timeoutSeconds"
@@ -299,12 +304,10 @@ export default {
           </div>
         </div>
 
-        <div class="spacer-small" />
-
         <div class="row">
           <div
             data-testid="input-probe-successThreshold"
-            class="col span-6"
+            class="col"
           >
             <LabeledInput
               v-model:value.number="probe.successThreshold"
@@ -316,9 +319,11 @@ export default {
               @update:value="update"
             />
           </div>
+        </div>
+        <div class="row">
           <div
             data-testid="input-probe-failureThreshold"
-            class="col span-6"
+            class="col"
           >
             <LabeledInput
               v-model:value.number="probe.failureThreshold"
@@ -333,7 +338,6 @@ export default {
         </div>
 
         <template v-if="kind === 'HTTP' || kind === 'HTTPS'">
-          <div class="spacer-small" />
 
           <div class="row">
             <div class="col span-12">

package/components/form/ProjectMemberEditor.vue

@@ -166,29 +166,44 @@ export default {
         value:       this.purifyOption(role.id),
       }));
 
-      return [
-        {
-          label:       this.t('projectMembers.projectPermissions.owner.label'),
-          description: this.t('projectMembers.projectPermissions.owner.description'),
-          value:       'owner'
-        },
-        {
-          label:       this.t('projectMembers.projectPermissions.member.label'),
-          description: this.t('projectMembers.projectPermissions.member.description'),
-          value:       'member'
-        },
-        {
-          label:       this.t('projectMembers.projectPermissions.readOnly.label'),
-          description: this.t('projectMembers.projectPermissions.readOnly.description'),
-          value:       'read-only'
-        },
-        ...customRoles,
-        {
-          label:       this.t('projectMembers.projectPermissions.custom.label'),
-          description: this.t('projectMembers.projectPermissions.custom.description'),
-          value:       'custom'
-        }
-      ];
+      let optionList =  [{
+        label:       this.t('members.clusterPermissions.project-tenant.label'),
+        description: this.t('members.clusterPermissions.project-tenant.description'),
+        value:       'project-tenant'
+      }];
+
+      if (sessionStorage.getItem('TOPLEVELPERMISSIONS') === 'superadmin') {
+        optionList = [
+          {
+            label:       this.t('members.clusterPermissions.project-tenant.label'),
+            description: this.t('members.clusterPermissions.project-tenant.description'),
+            value:       'project-tenant'
+          },
+          {
+            label:       this.t('projectMembers.projectPermissions.owner.label'),
+            description: this.t('projectMembers.projectPermissions.owner.description'),
+            value:       'owner'
+          },
+          {
+            label:       this.t('projectMembers.projectPermissions.member.label'),
+            description: this.t('projectMembers.projectPermissions.member.description'),
+            value:       'member'
+          },
+          {
+            label:       this.t('projectMembers.projectPermissions.readOnly.label'),
+            description: this.t('projectMembers.projectPermissions.readOnly.description'),
+            value:       'read-only'
+          },
+          ...customRoles,
+          {
+            label:       this.t('projectMembers.projectPermissions.custom.label'),
+            description: this.t('projectMembers.projectPermissions.custom.description'),
+            value:       'custom'
+          }
+        ];
+      }
+
+      return optionList
     },
     customPermissionsUpdate() {
       return this.customPermissions.reduce((acc, customPermissionsItem) => {
@@ -284,33 +299,36 @@ export default {
         </div>
       </template>
       <template v-slot:body>
-        <RadioGroup
-          v-model:value="value.permissionGroup"
-          data-testid="permission-options"
-          :options="options"
-          name="permission-group"
-        />
-        <div
-          v-if="value.permissionGroup === 'custom'"
-          class="custom-permissions ml-20 mt-10"
-          :class="{'two-column': useTwoColumnsForCustom}"
-        >
+        <div style="max-height: 250px; overflow: auto;">
+          <RadioGroup
+            v-model:value="value.permissionGroup"
+            data-testid="permission-options"
+            :options="options"
+            :flexDirection="'column'"
+            name="permission-group"
+          />
           <div
-            v-for="(permission, i) in customPermissionsUpdate"
-            :key="i"
+            v-if="value.permissionGroup === 'custom'"
+            class="custom-permissions ml-20 mt-10"
+            :class="{'two-column': useTwoColumnsForCustom}"
           >
-            <Checkbox
-              v-model:value="permission.value"
-              :data-testid="`custom-permission-${i}`"
-              :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"
+                :data-testid="`custom-permission-${i}`"
+                :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/ResourceQuota/Namespace.vue

@@ -72,13 +72,13 @@ export default {
 <template>
   <div>
     <div class="headers mb-10">
-      <div style="width: 400px;">
+      <div style="width: 450px;">
         <label>{{ t('resourceQuota.headers.resourceType') }}</label>
       </div>
-      <div style="width: 400px;">
+      <div style="width: 450px;">
         <label>{{ t('resourceQuota.headers.projectResourceAvailability') }}</label>
       </div>
-      <div style="width: 500px;">
+      <div style="width: 450px;">
         <label>{{ t('resourceQuota.headers.limit') }}</label>
       </div>
     </div>
@@ -101,7 +101,7 @@ export default {
 .headers {
     display: flex;
     flex-direction: row;
-    justify-content: space-between;
+    justify-content: left;
     align-items: center;
     border-bottom: 1px solid var(--border);
     height: 30px;

package/components/form/ResourceQuota/NamespaceRow.vue

@@ -175,13 +175,15 @@ export default {
     v-if="typeOption"
     class="rowNew"
   >
-    <Select
-      :mode="mode"
-      :value="type"
-      :disabled="true"
-      :options="types"
-    />
-    <div class="resource-availability">
+    <div style="width: 450px;">
+      <Select
+        :mode="mode"
+        :value="type"
+        :disabled="true"
+        :options="types"
+      />
+    </div>
+    <div style="width: 450px;" class="resource-availability">
       <PercentageBar
         v-clean-tooltip="tooltip"
         class="percentage-bar"
@@ -190,7 +192,7 @@ export default {
         :color-stops="{'100': '--primary'}"
       />
     </div>
-    <div style="width: 500px;">
+    <div style="width: 450px;">
       <UnitInput
         :value="value.limit[type]"
         :mode="mode"
@@ -212,7 +214,7 @@ export default {
   .rowNew {
     margin-bottom: 10px;
     display: flex;
-    justify-content: space-between;
+    justify-content: left;
 
     & > * {
       width: 400px;

package/components/form/ResourceQuota/Project.vue

@@ -57,14 +57,14 @@ export default {
 </script>
 <template>
   <div>
-    <div style="justify-content: right;" class="headers mb-10">
-      <div style="width: 400px;">
+    <div style="justify-content: left;" class="headers mb-10">
+      <div style="width: 450px;">
         <label>{{ t('resourceQuota.headers.resourceType') }}</label>
       </div>
-      <div style="width: 400px;">
+      <div style="width: 450px;">
         <label>{{ t('resourceQuota.headers.projectLimit') }}</label>
       </div>
-      <div style="width: 400px;">
+      <div style="width: 450px;">
         <label>{{ t('resourceQuota.headers.namespaceDefaultLimit') }}</label>
       </div>
     </div>

package/components/form/ResourceQuota/ProjectRow.vue

@@ -72,41 +72,47 @@ export default {
     v-if="typeOption"
     class="rowNew"
   >
-    <Select
-      :value="type"
-      :mode="mode"
-      :options="types"
-      data-testid="projectrow-type-input"
-      @update:value="updateType($event)"
-    />
-    <UnitInput
-      :value="resourceQuotaLimit[type]"
-      :mode="mode"
-      :placeholder="typeOption.placeholder"
-      :increment="typeOption.increment"
-      :input-exponent="typeOption.inputExponent"
-      :base-unit="typeOption.baseUnit"
-      :output-modifier="true"
-      data-testid="projectrow-project-quota-input"
-      @update:value="updateQuotaLimit('resourceQuota', type, $event)"
-    />
-    <UnitInput
-      :value="namespaceDefaultResourceQuotaLimit[type]"
-      :mode="mode"
-      :placeholder="typeOption.placeholder"
-      :increment="typeOption.increment"
-      :input-exponent="typeOption.inputExponent"
-      :base-unit="typeOption.baseUnit"
-      :output-modifier="true"
-      data-testid="projectrow-namespace-quota-input"
-      @update:value="updateQuotaLimit('namespaceDefaultResourceQuota', type, $event)"
-    />
+    <div style="width: 450px;">
+      <Select
+        :value="type"
+        :mode="mode"
+        :options="types"
+        data-testid="projectrow-type-input"
+        @update:value="updateType($event)"
+      />
+    </div>
+    <div style="width: 450px;">
+      <UnitInput
+        :value="resourceQuotaLimit[type]"
+        :mode="mode"
+        :placeholder="typeOption.placeholder"
+        :increment="typeOption.increment"
+        :input-exponent="typeOption.inputExponent"
+        :base-unit="typeOption.baseUnit"
+        :output-modifier="true"
+        data-testid="projectrow-project-quota-input"
+        @update:value="updateQuotaLimit('resourceQuota', type, $event)"
+      />
+    </div>
+    <div style="width: 450px;">
+      <UnitInput
+        :value="namespaceDefaultResourceQuotaLimit[type]"
+        :mode="mode"
+        :placeholder="typeOption.placeholder"
+        :increment="typeOption.increment"
+        :input-exponent="typeOption.inputExponent"
+        :base-unit="typeOption.baseUnit"
+        :output-modifier="true"
+        data-testid="projectrow-namespace-quota-input"
+        @update:value="updateQuotaLimit('namespaceDefaultResourceQuota', type, $event)"
+      />
+    </div>
   </div>
 </template>
 
 <style lang='scss' scoped>
   .rowNew {
     display: flex;
-    justify-content: space-between;
+    justify-content: left;
   }
 </style>

package/components/form/ResourceSelector.vue

@@ -125,7 +125,7 @@ export default {
       </div>
     </div>
     <div class="row">
-      <div class="col span-12">
+      <div class="span-12">
         <Banner :color="(matchingResources.none ? 'warning' : 'success')">
           <span v-clean-html="t('generic.selectors.matchingResources.matchesSome', matchingResources)" />
         </Banner>

package/components/form/SecretSelector.vue

@@ -210,31 +210,32 @@ export default {
 <template>
   <div
     class="secret-selector"
-    :class="{'show-key-selector': showKeySelector}"
   >
-    <div class="input-container">
+    <div :class="{'row': showKeySelector}" class="input-container">
       <!-- key by namespace to ensure label select current page is recreated on ns change -->
-      <ResourceLabeledSelect
-        :key="namespace"
-        v-model:value="name"
-        :disabled="!isView && disabled"
-        :label="secretNameLabel"
-        :mode="mode"
-        :resource-type="SECRET"
-        :in-store="inStore"
-        :paginated-resource-settings="paginateSecretsSetting"
-        :all-resources-settings="allSecretsSettings"
-      />
-      <LabeledSelect
-        v-if="showKeySelector"
-        :key="namespace"
-        v-model:value="key"
-        class="col span-6"
-        :disabled="isKeyDisabled"
-        :options="keys"
-        :label="keyNameLabel"
-        :mode="mode"
-      />
+      <div :class="{'col span-6': showKeySelector}">
+        <ResourceLabeledSelect
+          :key="namespace"
+          v-model:value="name"
+          :disabled="!isView && disabled"
+          :label="secretNameLabel"
+          :mode="mode"
+          :resource-type="SECRET"
+          :in-store="inStore"
+          :paginated-resource-settings="paginateSecretsSetting"
+          :all-resources-settings="allSecretsSettings"
+        />
+      </div>
+      <div v-if="showKeySelector" class="col span-6">
+        <LabeledSelect
+          :key="namespace"
+          v-model:value="key"
+          :disabled="isKeyDisabled"
+          :options="keys"
+          :label="keyNameLabel"
+          :mode="mode"
+        />
+      </div>
     </div>
   </div>
 </template>

package/components/form/Security.vue

@@ -157,7 +157,6 @@ export default {
         </div>
       </div>
     </div>
-    <div class="spacer" />
 
     <div>
       <div class="row">
@@ -191,11 +190,10 @@ export default {
         </div>
       </div>
     </div>
-    <div class="spacer" />
 
     <div
       data-testid="input-security-runAsUser"
-      class="row mb-10"
+      class="row"
     >
       <div class="col span-6">
         <LabeledInput

package/components/form/Select.vue

@@ -391,6 +391,11 @@ export default {
 <style lang="scss" scoped>
   .unlabeled-select {
     position: relative;
+    width: 400px;
+
+    :deep() .vs__actions:after {
+      // padding-top: 2px;
+    }
 
     :deep() .v-select.select-input-view {
       .vs__actions {
@@ -409,7 +414,8 @@ export default {
 
     :deep() .vs__selected-options {
       display: flex;
-      margin: 3px;
+      align-items: center;
+      margin: 0px;
 
       .vs__selected {
           width: initial;