@rancher/shell 0.1.1 → 0.1.3

package/components/dialog/harvester/MigrationDialog.vue

@@ -1,154 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-
-import { NODE, HCI } from '@shell/config/types';
-import { exceptionToErrorsArray } from '@shell/utils/error';
-import { HCI as HCI_ANNOTATIONS } from '@shell/config/labels-annotations';
-
-import { Card } from '@components/Card';
-import { Banner } from '@components/Banner';
-import AsyncButton from '@shell/components/AsyncButton';
-import LabeledSelect from '@shell/components/form/LabeledSelect';
-
-export default {
-  components: {
-    AsyncButton, Banner, Card, LabeledSelect
-  },
-
-  props:      {
-    resources: {
-      type:     Array,
-      required: true
-    }
-  },
-
-  data() {
-    return {
-      nodeName: '',
-      errors:   []
-    };
-  },
-
-  computed:   {
-    ...mapGetters({ t: 'i18n/t' }),
-
-    actionResource() {
-      return this.resources[0];
-    },
-
-    vmi() {
-      const vmiResources = this.$store.getters['harvester/all'](HCI.VMI);
-      const resource = vmiResources.find(VMI => VMI.id === this.actionResource?.id) || null;
-
-      return resource;
-    },
-
-    nodeNameList() {
-      const nodes = this.$store.getters['harvester/all'](NODE);
-
-      return nodes.filter((n) => {
-        // do not allow to migrate to self node
-        return n.id !== this.vmi?.status?.nodeName && n.isMigratable;
-      }).map((n) => {
-        let label = n?.metadata?.name;
-        const value = n?.metadata?.name;
-        const custom = n?.metadata?.annotations?.[HCI_ANNOTATIONS.HOST_CUSTOM_NAME];
-
-        if (custom) {
-          label = custom;
-        }
-
-        return {
-          label,
-          value
-        };
-      });
-    },
-  },
-
-  methods: {
-    close() {
-      this.nodeName = '';
-      this.errors = [];
-      this.$emit('close');
-    },
-
-    async apply(buttonDone) {
-      if (!this.actionResource) {
-        buttonDone(false);
-
-        return;
-      }
-
-      if (!this.nodeName) {
-        const name = this.$store.getters['i18n/t']('harvester.modal.migration.fields.nodeName.label');
-        const message = this.$store.getters['i18n/t']('validation.required', { key: name });
-
-        this.$set(this, 'errors', [message]);
-        buttonDone(false);
-
-        return;
-      }
-
-      try {
-        await this.actionResource.doAction('migrate', { nodeName: this.nodeName }, {}, false);
-
-        buttonDone(true);
-        this.close();
-      } catch (err) {
-        const error = err?.data || err;
-        const message = exceptionToErrorsArray(error);
-
-        this.$set(this, 'errors', message);
-        buttonDone(false);
-      }
-    },
-
-  }
-};
-</script>
-
-<template>
-  <Card :show-highlight-border="false">
-    <template #title>
-      {{ t('harvester.modal.migration.title') }}
-    </template>
-
-    <template #body>
-      <LabeledSelect
-        v-model="nodeName"
-        :label="t('harvester.modal.migration.fields.nodeName.label')"
-        :placeholder="t('harvester.modal.migration.fields.nodeName.placeholder')"
-        :options="nodeNameList"
-      />
-    </template>
-
-    <div slot="actions" class="actions">
-      <div class="buttons">
-        <button class="btn role-secondary mr-10" @click="close">
-          {{ t('generic.cancel') }}
-        </button>
-
-        <AsyncButton
-          mode="apply"
-          :disabled="!nodeName"
-          @click="apply"
-        />
-      </div>
-
-      <Banner v-for="(err, i) in errors" :key="i" color="error" :label="err" />
-    </div>
-  </Card>
-</template>
-
-<style lang="scss" scoped>
-.actions {
-  width: 100%;
-}
-
-.buttons {
-  display: flex;
-  justify-content: flex-end;
-  width: 100%;
-}
-</style>

package/components/dialog/harvester/RestoreDialog.vue

@@ -1,153 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-
-import { randomStr } from '@shell/utils/string';
-import { HCI } from '@shell/config/types';
-import { allHash } from '@shell/utils/promise';
-import { exceptionToErrorsArray } from '@shell/utils/error';
-
-import { Card } from '@components/Card';
-import { Banner } from '@components/Banner';
-import AsyncButton from '@shell/components/AsyncButton';
-import LabeledSelect from '@shell/components/form/LabeledSelect';
-
-export default {
-  name: 'RestoreModal',
-
-  components: {
-    AsyncButton, Banner, Card, LabeledSelect
-  },
-
-  async fetch() {
-    const hash = await allHash({ backups: this.$store.dispatch('harvester/findAll', { type: HCI.BACKUP }) });
-
-    this.backups = hash.backups;
-  },
-
-  props:      {
-    resources: {
-      type:     Array,
-      required: true
-    }
-  },
-
-  data() {
-    return {
-      backups:    [],
-      backupName: '',
-      errors:     []
-    };
-  },
-
-  computed: {
-    ...mapGetters({ t: 'i18n/t' }),
-
-    actionResource() {
-      return this.resources[0];
-    },
-
-    backupOption() {
-      const attachBackup = this.backups.filter( (B) => {
-        return B.attachVM === this.actionResource?.metadata?.name;
-      });
-
-      return attachBackup.map( (O) => {
-        return {
-          value: O.metadata.name,
-          label: O.metadata.name
-        };
-      });
-    },
-  },
-
-  methods: {
-    close() {
-      this.backupName = '';
-      this.errors = [];
-      this.$emit('close');
-    },
-
-    async saveRestore(buttonCb) {
-      const name = `restore-${ this.backupName }-${ randomStr(5).toLowerCase() }`;
-
-      if (!this.backupName) {
-        this.$set(this, 'errors', [this.t('harvester.modal.restore.message.backup')]);
-        buttonCb(false);
-
-        return;
-      }
-
-      try {
-        const res = await this.actionResource.doAction('restore', { backupName: this.backupName, name }, {}, false);
-
-        if (res._status === 200 || res._status === 204) {
-          this.$store.dispatch('growl/success', {
-            title:   this.t('harvester.notification.title.succeed'),
-            message: this.t('harvester.modal.restore.success', { name: this.backupName })
-          }, { root: true });
-
-          this.close();
-          buttonCb(true);
-        } else {
-          const error = [res?.data] || exceptionToErrorsArray(res);
-
-          this.$set(this, 'errors', error);
-          buttonCb(false);
-        }
-      } catch (err) {
-        const error = err?.data || err;
-        const message = exceptionToErrorsArray(error);
-
-        this.$set(this, 'errors', message);
-        buttonCb(false);
-      }
-    }
-  },
-};
-</script>
-
-<template>
-  <Card :show-highlight-border="false">
-    <template #title>
-      {{ t('harvester.modal.restore.title') }}
-    </template>
-
-    <template #body>
-      <LabeledSelect
-        v-model="backupName"
-        :label="t('harvester.modal.restore.selectBackup')"
-        :localized-label="true"
-        :options="backupOption"
-        required
-      />
-    </template>
-
-    <div slot="actions" class="actions">
-      <div class="buttons">
-        <button class="btn role-secondary mr-10" @click="close">
-          {{ t('generic.cancel') }}
-        </button>
-
-        <AsyncButton
-          mode="create"
-          :disabled="!backupName"
-          @click="saveRestore"
-        />
-      </div>
-
-      <Banner v-for="(err, i) in errors" :key="i" color="error" :label="err" />
-    </div>
-  </Card>
-</template>
-
-<style lang="scss" scoped>
-.actions {
-  width: 100%;
-}
-
-.buttons {
-  display: flex;
-  justify-content: flex-end;
-  width: 100%;
-}
-</style>

package/components/dialog/harvester/SupportBundle.vue

@@ -1,217 +0,0 @@
-<script>
-import { randomStr } from '@shell/utils/string';
-import { exceptionToErrorsArray, stringify } from '@shell/utils/error';
-import { HCI } from '@shell/config/types';
-import { LabeledInput } from '@components/Form/LabeledInput';
-import AsyncButton from '@shell/components/AsyncButton';
-import GraphCircle from '@shell/components/graph/Circle';
-import { Banner } from '@components/Banner';
-
-export default {
-  name: 'SupportBundle',
-
-  components: {
-    LabeledInput,
-    GraphCircle,
-    AsyncButton,
-    Banner,
-  },
-
-  data() {
-    return {
-      url:         '',
-      description: '',
-      errors:      [],
-    };
-  },
-
-  computed: {
-    bundlePending() {
-      return this.$store.getters['harvester-common/isBundlePending'];
-    },
-
-    isShowBundleModal() {
-      return this.$store.getters['harvester-common/isShowBundleModal'];
-    },
-
-    percentage() {
-      return this.$store.getters['harvester-common/getBundlePercentage'];
-    }
-  },
-
-  watch: {
-    isShowBundleModal: {
-      handler(show) {
-        if (show) {
-          this.$nextTick(() => {
-            this.$modal.show('bundle-modal');
-          });
-        } else {
-          this.$modal.hide('bundle-modal');
-          this.url = '';
-          this.description = '';
-        }
-      },
-      immediate: true
-    },
-  },
-
-  methods: {
-    stringify,
-
-    close() {
-      this.$store.commit('harvester-common/toggleBundleModal', false);
-      this.backUpName = '';
-    },
-
-    async save(buttonCb) {
-      this.errors = [];
-
-      const name = `bundle-${ randomStr(5).toLowerCase() }`;
-      const namespace = 'harvester-system';
-
-      const bundleCrd = {
-        apiVersion: 'harvesterhci.io/v1beta1',
-        type:       HCI.SUPPORT_BUNDLE,
-        kind:       'SupportBundle',
-        metadata:   {
-          name,
-          namespace
-        },
-        spec: {
-          issueURL:    this.url,
-          description: this.description
-        }
-      };
-
-      const inStore = this.$store.getters['currentProduct'].inStore;
-      const bundleValue = await this.$store.dispatch(`${ inStore }/create`, bundleCrd);
-
-      try {
-        await bundleValue.save();
-
-        this.$store.commit('harvester-common/setLatestBundleId', `${ namespace }/${ name }`, { root: true });
-        this.$store.dispatch('harvester-common/bundleProgress', { root: true });
-      } catch (err) {
-        this.errors = exceptionToErrorsArray(err);
-        buttonCb(false);
-      }
-    },
-  }
-};
-</script>
-
-<template>
-  <div class="bundleModal">
-    <modal
-      name="bundle-modal"
-      :click-to-close="false"
-      :width="550"
-      :height="390"
-      class="remove-modal support-modal"
-    >
-      <div class="p-20">
-        <h2>
-          {{ t('harvester.modal.bundle.title') }}
-        </h2>
-
-        <div
-          v-if="!bundlePending"
-          class="content"
-        >
-          <LabeledInput
-            v-model="url"
-            :label="t('harvester.modal.bundle.url')"
-            class="mb-20"
-          />
-
-          <LabeledInput
-            v-model="description"
-            :label="t('harvester.modal.bundle.description')"
-            type="multiline"
-            :min-height="120"
-            required
-          />
-        </div>
-
-        <div
-          v-else
-          class="content"
-        >
-          <div class="circle">
-            <GraphCircle
-              primary-stroke-color="green"
-              secondary-stroke-color="white"
-              :stroke-width="6"
-              :percentage="percentage"
-              :show-text="true"
-            />
-          </div>
-        </div>
-
-        <div
-          v-for="(err, idx) in errors"
-          :key="idx"
-        >
-          <Banner
-            color="error"
-            :label="stringify(err)"
-          />
-        </div>
-
-        <div class="footer mt-20">
-          <button
-            class="btn btn-sm role-secondary mr-10"
-            @click="close"
-          >
-            {{ t('generic.close') }}
-          </button>
-
-          <AsyncButton
-            type="submit"
-            mode="generate"
-            class="btn btn-sm bg-primary"
-            :disabled="bundlePending"
-            @click="save"
-          />
-        </div>
-      </div>
-    </modal>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-.bundleModal {
-  .support-modal {
-    border-radius: var(--border-radius);
-    max-height: 100vh;
-  }
-
-  .bundle {
-    cursor: pointer;
-    color: var(--primary);
-  }
-
-  .icon-spinner {
-    font-size: 100px;
-  }
-
-  .content {
-    height: 218px;
-
-    .circle {
-      padding-top: 20px;
-      height: 160px;
-    }
-  }
-
-  div {
-    line-height: normal;
-  }
-
-  .footer {
-    display: flex;
-    justify-content: center;
-  }
-}
-</style>

package/components/dialog/harvester/UnplugVolume.vue

@@ -1,108 +0,0 @@
-<script>
-import { mapState, mapGetters } from 'vuex';
-
-import { exceptionToErrorsArray } from '@shell/utils/error';
-import { Card } from '@components/Card';
-import { Banner } from '@components/Banner';
-import AsyncButton from '@shell/components/AsyncButton';
-
-export default {
-  name: 'HotUnplugModal',
-
-  components: {
-    AsyncButton, Card, Banner
-  },
-
-  props: {
-    resources: {
-      type:     Array,
-      required: true
-    },
-  },
-
-  data() {
-    return { errors: [] };
-  },
-
-  computed: {
-    ...mapState('action-menu', ['modalData']),
-    ...mapGetters({ t: 'i18n/t' }),
-
-    actionResource() {
-      return this.resources[0];
-    },
-    diskName() {
-      return this.modalData.diskName;
-    }
-  },
-
-  methods: {
-    close() {
-      this.$emit('close');
-    },
-
-    async save(buttonCb) {
-      try {
-        const res = await this.actionResource.doAction('removeVolume', { diskName: this.diskName });
-
-        if (res._status === 200 || res._status === 204) {
-          this.$store.dispatch('growl/success', {
-            title:   this.t('harvester.notification.title.succeed'),
-            message: this.t('harvester.modal.hotunplug.success', { name: this.diskName })
-          }, { root: true });
-
-          this.close();
-          buttonCb(true);
-        } else {
-          const error = [res?.data] || exceptionToErrorsArray(res);
-
-          this.$set(this, 'errors', error);
-          buttonCb(false);
-        }
-      } catch (err) {
-        const error = err?.data || err;
-        const message = exceptionToErrorsArray(error);
-
-        this.$set(this, 'errors', message);
-        buttonCb(false);
-      }
-    },
-  }
-};
-</script>
-
-<template>
-  <Card ref="modal" name="modal" :show-highlight-border="false">
-    <h4 slot="title" class="text-default-text" v-html="t('harvester.virtualMachine.unplug.title', { name: diskName})" />
-
-    <div slot="actions" class="actions">
-      <div class="buttons">
-        <button type="button" class="btn role-secondary mr-10" @click="close">
-          {{ t('generic.cancel') }}
-        </button>
-
-        <AsyncButton
-          mode="apply"
-          :action-label="t('harvester.virtualMachine.unplug.actionLabel')"
-          :waiting-label="t('harvester.virtualMachine.unplug.actionLabel')"
-          :success-label="t('harvester.virtualMachine.unplug.actionLabel')"
-          @click="save"
-        />
-      </div>
-
-      <Banner v-for="(err, i) in errors" :key="i" color="error" :label="err" />
-    </div>
-  </Card>
-</template>
-
-<style lang="scss" scoped>
-.actions {
-  width: 100%;
-}
-
-.buttons {
-  display: flex;
-  justify-content: flex-end;
-  width: 100%;
-}
-</style>