add ipmi, ssh policies

3 files changed, 266 insertions, 5 deletions

diff --git a/src/views/_sila/SecurityAndAccess/Policies/ModalIpmi.vue b/src/views/_sila/SecurityAndAccess/Policies/ModalIpmi.vue
new file mode 100644
index 00000000..6f1ddffc
--- /dev/null
+++ b/src/views/_sila/SecurityAndAccess/Policies/ModalIpmi.vue
@@ -0,0 +1,106 @@
+<template>
+  <b-modal
+    id="modal-ipmi"
+    ref="modal"
+    :title="$t('pagePolicies.modal.editIpmiPort')"
+    @hidden="resetForm"
+  >
+    <b-form id="port-settings" @submit.prevent="handleSubmit">
+      <b-row>
+        <b-col>
+          <b-form-group :label="$t('pagePolicies.port')" label-for="port">
+            <b-form-input
+              id="port"
+              v-model="form.port"
+              type="text"
+              :state="getValidationState($v.form.port)"
+              @input="$v.form.port.$touch()"
+            />
+            <b-form-invalid-feedback role="alert">
+              <template v-if="!$v.form.port.required">
+                {{ $t('global.form.fieldRequired') }}
+              </template>
+              <template v-else-if="!$v.form.port.port">
+                {{ $t('global.form.invalidFormat') }}
+              </template>
+            </b-form-invalid-feedback>
+          </b-form-group>
+        </b-col>
+      </b-row>
+    </b-form>
+    <template #modal-footer="{ cancel }">
+      <b-button variant="secondary" @click="cancel()">
+        {{ $t('global.action.cancel') }}
+      </b-button>
+      <b-button
+        form="port-settings"
+        type="submit"
+        variant="primary"
+        @click="onOk"
+      >
+        {{ $t('global.action.save') }}
+      </b-button>
+    </template>
+  </b-modal>
+</template>
+
+<script>
+import VuelidateMixin from '@/components/_ibs/Mixins/VuelidateMixin.js';
+import { required, helpers } from 'vuelidate/lib/validators';
+import { isoPortRegex } from '@/utilities/_sila/regexConstants';
+
+export default {
+  mixins: [VuelidateMixin],
+  props: {
+    port: {
+      type: String,
+      default: '',
+    },
+  },
+  data() {
+    return {
+      form: {
+        port: '',
+      },
+    };
+  },
+  watch: {
+    port() {
+      this.form.port = this.port;
+    },
+  },
+  validations() {
+    return {
+      form: {
+        port: {
+          required,
+          pattern: helpers.regex('pattern', isoPortRegex),
+        },
+      },
+    };
+  },
+  methods: {
+    handleSubmit() {
+      this.$v.$touch();
+      if (this.$v.$invalid) return;
+      this.$emit('ok', this.form.port);
+      this.closeModal();
+    },
+    closeModal() {
+      this.$nextTick(() => {
+        this.$refs.modal.hide();
+      });
+    },
+    resetForm() {
+      this.form.port = this.port;
+      this.$v.$reset();
+      this.$emit('hidden');
+    },
+    onOk(bvModalEvt) {
+      // prevent modal close
+      bvModalEvt.preventDefault();
+      this.handleSubmit();
+    },
+  },
+};
+</script>
diff --git a/src/views/_sila/SecurityAndAccess/Policies/ModalSsh.vue b/src/views/_sila/SecurityAndAccess/Policies/ModalSsh.vue
new file mode 100644
index 00000000..3c0db9da
--- /dev/null
+++ b/src/views/_sila/SecurityAndAccess/Policies/ModalSsh.vue
@@ -0,0 +1,106 @@
+<template>
+  <b-modal
+    id="modal-ssh"
+    ref="modal"
+    :title="$t('pagePolicies.modal.editSshPort')"
+    @hidden="resetForm"
+  >
+    <b-form id="port-settings" @submit.prevent="handleSubmit">
+      <b-row>
+        <b-col>
+          <b-form-group :label="$t('pagePolicies.port')" label-for="port">
+            <b-form-input
+              id="port"
+              v-model="form.port"
+              type="text"
+              :state="getValidationState($v.form.port)"
+              @input="$v.form.port.$touch()"
+            />
+            <b-form-invalid-feedback role="alert">
+              <template v-if="!$v.form.port.required">
+                {{ $t('global.form.fieldRequired') }}
+              </template>
+              <template v-if="!$v.form.port.port">
+                {{ $t('global.form.invalidFormat') }}
+              </template>
+            </b-form-invalid-feedback>
+          </b-form-group>
+        </b-col>
+      </b-row>
+    </b-form>
+    <template #modal-footer="{ cancel }">
+      <b-button variant="secondary" @click="cancel()">
+        {{ $t('global.action.cancel') }}
+      </b-button>
+      <b-button
+        form="port-settings"
+        type="submit"
+        variant="primary"
+        @click="onOk"
+      >
+        {{ $t('global.action.save') }}
+      </b-button>
+    </template>
+  </b-modal>
+</template>
+
+<script>
+import VuelidateMixin from '@/components/_ibs/Mixins/VuelidateMixin.js';
+import { required, helpers } from 'vuelidate/lib/validators';
+import { isoPortRegex } from '@/utilities/_sila/regexConstants';
+
+export default {
+  mixins: [VuelidateMixin],
+  props: {
+    port: {
+      type: String,
+      default: '',
+    },
+  },
+  data() {
+    return {
+      form: {
+        port: '',
+      },
+    };
+  },
+  watch: {
+    port() {
+      this.form.port = this.port;
+    },
+  },
+  validations() {
+    return {
+      form: {
+        port: {
+          required,
+          pattern: helpers.regex('pattern', isoPortRegex),
+        },
+      },
+    };
+  },
+  methods: {
+    handleSubmit() {
+      this.$v.$touch();
+      if (this.$v.$invalid) return;
+      this.$emit('ok', this.form.port);
+      this.closeModal();
+    },
+    closeModal() {
+      this.$nextTick(() => {
+        this.$refs.modal.hide();
+      });
+    },
+    resetForm() {
+      this.form.port = this.port;
+      this.$v.$reset();
+      this.$emit('hidden');
+    },
+    onOk(bvModalEvt) {
+      // prevent modal close
+      bvModalEvt.preventDefault();
+      this.handleSubmit();
+    },
+  },
+};
+</script>
diff --git a/src/views/_sila/SecurityAndAccess/Policies/Policies.vue b/src/views/_sila/SecurityAndAccess/Policies/Policies.vue
index d3f2ffcb..a9c273b0 100644
--- a/src/views/_sila/SecurityAndAccess/Policies/Policies.vue
+++ b/src/views/_sila/SecurityAndAccess/Policies/Policies.vue
@@ -10,6 +10,16 @@
               <dd>
                 {{ $t('pagePolicies.sshDescription') }}
               </dd>
+              <dt class="d-flex">
+                {{ $t('pagePolicies.port') }}: {{ sshPort }}
+                <b-button
+                  variant="link"
+                  class="p-1 pr-0 ml-2"
+                  @click="openSshModal()"
+                >
+                  <icon-edit :title="$t('pagePolicies.modal.editSshPort')" />
+                </b-button>
+              </dt>
             </dl>
             <b-form-checkbox
               id="sshSwitch"
@@ -36,6 +46,16 @@
               <dd>
                 {{ $t('pagePolicies.ipmiDescription') }}
               </dd>
+              <!-- <dt class="d-flex">
+                {{ $t('pagePolicies.port') }}: {{ ipmiPort }}
+                <b-button
+                  variant="link"
+                  class="p-1 pr-0 ml-2"
+                  @click="openIpmiModal()"
+                >
+                  <icon-edit :title="$t('pagePolicies.modal.editIpmiPort')" />
+                </b-button>
+              </dt> -->
             </dl>
             <b-form-checkbox
               id="ipmiSwitch"
@@ -55,7 +75,7 @@
             </b-form-checkbox>
           </b-col>
         </b-row>
-        <b-row class="setting-section">
+        <!-- <b-row class="setting-section">
           <b-col class="d-flex align-items-center justify-content">
             <dl class="mt-3 mr-3 w-75">
               <dt>{{ $t('pagePolicies.vtpm') }}</dt>
@@ -80,8 +100,8 @@
               <span v-else>{{ $t('global.status.disabled') }}</span>
             </b-form-checkbox>
           </b-col>
-        </b-row>
-        <b-row class="setting-section">
+        </b-row> -->
+        <!-- <b-row class="setting-section">
           <b-col class="d-flex align-items-center justify-content">
             <dl class="mt-3 mr-3 w-75">
               <dt>{{ $t('pagePolicies.rtad') }}</dt>
@@ -106,21 +126,27 @@
               <span v-else>{{ $t('global.status.disabled') }}</span>
             </b-form-checkbox>
           </b-col>
-        </b-row>
+        </b-row> -->
       </b-col>
     </b-row>
+    <modal-ssh :port="sshPort" @ok="saveSsh" />
+    <modal-ipmi :port="ipmiPort" @ok="saveIpmi" />
   </b-container>
 </template>
 
 <script>
+import { mapState } from 'vuex';
 import PageTitle from '@/components/_sila/Global/PageTitle';
+import IconEdit from '@carbon/icons-vue/es/edit/16';
 
 import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin';
 import BVToastMixin from '@/components/_sila/Mixins/BVToastMixin';
+import ModalSsh from './ModalSsh.vue';
+import ModalIpmi from './ModalIpmi.vue';
 
 export default {
   name: 'Policies',
-  components: { PageTitle },
+  components: { PageTitle, IconEdit, ModalSsh, ModalIpmi },
   mixins: [LoadingBarMixin, BVToastMixin],
   beforeRouteLeave(to, from, next) {
     this.hideLoader();
@@ -176,6 +202,7 @@ export default {
         return newValue;
       },
     },
+    ...mapState('policies', ['sshPort', 'ipmiPort']),
   },
   created() {
     this.startLoader();
@@ -209,6 +236,28 @@ export default {
         .then((message) => this.successToast(message))
         .catch(({ message }) => this.errorToast(message));
     },
+    openSshModal() {
+      this.$bvModal.show('modal-ssh');
+    },
+    openIpmiModal() {
+      this.$bvModal.show('modal-ipmi');
+    },
+    saveSsh(modalFormData) {
+      this.startLoader();
+      this.$store
+        .dispatch('policies/saveSshPort', modalFormData)
+        .then((message) => this.successToast(message))
+        .catch(({ message }) => this.errorToast(message))
+        .finally(() => this.endLoader());
+    },
+    saveIpmi(modalFormData) {
+      this.startLoader();
+      this.$store
+        .dispatch('policies/saveIpmiPort', modalFormData)
+        .then((message) => this.successToast(message))
+        .catch(({ message }) => this.errorToast(message))
+        .finally(() => this.endLoader());
+    },
   },
 };
 </script>