Add pkg/harvester components + shell portings - 1

Signed-off-by: Francesco Torchia <francesco.torchia@suse.com>

pkg/harvester/dialog/RestartVMDialog.vue

@@ -0,0 +1,120 @@
+<script>
+import { mapGetters } from 'vuex';
+import AsyncButton from '@shell/components/AsyncButton';
+import { Card } from '@components/Card';
+import { Banner } from '@components/Banner';
+import { exceptionToErrorsArray } from '@shell/utils/error';
+export default {
+  components: {
+    Card,
+    AsyncButton,
+    Banner,
+  },
+  props: {
+    vm: {
+      type:     Object,
+      required: true
+    },
+  },
+  data() {
+    return { errors: [], resolve: null };
+  },
+  computed: { ...mapGetters({ t: 'i18n/t' }) },
+  methods:  {
+    close() {
+      this.resolve();
+      this.$emit('close');
+    },
+    apply(buttonDone) {
+      try {
+        this.vm.doActionGrowl('restart', {});
+        buttonDone(true);
+        this.resolve();
+        this.close();
+      } catch (err) {
+        console.error(err); // eslint-disable-line
+        this.errors = exceptionToErrorsArray(err);
+        buttonDone(false);
+      }
+    }
+  }
+};
+</script>
+
+<template>
+  <app-modal
+    class="restart-modal"
+    name="restartDialog"
+    :width="600"
+    height="auto"
+    :click-to-close="false"
+    @close="close"
+  >
+    <Card
+      class="prompt-restart"
+      :show-highlight-border="false"
+    >
+      <h4
+        slot="title"
+        v-clean-html="t('harvester.modal.restart.title')"
+        class="text-default-text"
+      />
+
+      <template slot="body">
+        <slot name="body">
+          <div
+            v-clean-html="t('harvester.modal.restart.tip')"
+            class="pl-10 pr-10"
+          >
+          </div>
+        </slot>
+      </template>
+
+      <div
+        slot="actions"
+        class="bottom"
+      >
+        <Banner
+          v-for="(err, i) in errors"
+          :key="i"
+          color="error"
+          :label="err"
+        />
+        <div class="buttons">
+          <button
+            class="btn role-secondary mr-10"
+            @click="close"
+          >
+            {{ t('harvester.modal.restart.cancel') }}
+          </button>
+
+          <AsyncButton
+            mode="restart"
+            @click="apply"
+          />
+        </div>
+      </div>
+    </Card>
+  </app-modal>
+</template>
+<style lang='scss' scoped>
+  .restart-modal {
+    z-index: 45;
+  }
+  .prompt-restart {
+    margin: 0;
+  }
+  .bottom {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    .banner {
+      margin-top: 0
+    }
+    .buttons {
+      display: flex;
+      justify-content: flex-end;
+      width: 100%;
+    }
+  }
+</style>