diff options
author | Sandeepa Singh <sandeepa.singh@ibm.com> | 2021-07-26 12:35:39 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2021-08-10 22:20:42 +0300 |
commit | b440616c23b61166ae6d87839a70eec31bdca235 (patch) | |
tree | d72769d4aa425e96e47419515b85a8631d8e99d7 /src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue | |
parent | f67f769f2304bca64d2b9758e22c21203960eef9 (diff) | |
download | webui-vue-b440616c23b61166ae6d87839a70eec31bdca235.tar.xz |
IA update: Update access and control section
This is the fifth commit of the information architecture changes and
has the following changes:
- The icon for access and control has been updated
- Access and control section has been updated to security and
access section
- Security settings page has been updated to policies page and moved to
security and access section
- Client sessions page has been updated to sessions page
- Local user management page has been updated to user management page
- SSL certificates page has been updated to certificates page
Signed-off-by: Sandeepa Singh <sandeepa.singh@ibm.com>
Change-Id: Ie93cee9002742ecf7d33615636f4f159f4395fc4
Diffstat (limited to 'src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue')
-rw-r--r-- | src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue | 168 |
1 files changed, 0 insertions, 168 deletions
diff --git a/src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue b/src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue deleted file mode 100644 index cafbd935..00000000 --- a/src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue +++ /dev/null @@ -1,168 +0,0 @@ -<template> - <b-modal id="upload-certificate" ref="modal" @ok="onOk" @hidden="resetForm"> - <template #modal-title> - <template v-if="certificate"> - {{ $t('pageSslCertificates.replaceCertificate') }} - </template> - <template v-else> - {{ $t('pageSslCertificates.addNewCertificate') }} - </template> - </template> - <b-form> - <!-- Replace Certificate type --> - <template v-if="certificate !== null"> - <dl class="mb-4"> - <dt>{{ $t('pageSslCertificates.modal.certificateType') }}</dt> - <dd>{{ certificate.certificate }}</dd> - </dl> - </template> - - <!-- Add new Certificate type --> - <template v-else> - <b-form-group - :label="$t('pageSslCertificates.modal.certificateType')" - label-for="certificate-type" - > - <b-form-select - id="certificate-type" - v-model="form.certificateType" - :options="certificateOptions" - :state="getValidationState($v.form.certificateType)" - @input="$v.form.certificateType.$touch()" - > - </b-form-select> - <b-form-invalid-feedback role="alert"> - <template v-if="!$v.form.certificateType.required"> - {{ $t('global.form.fieldRequired') }} - </template> - </b-form-invalid-feedback> - </b-form-group> - </template> - - <b-form-group :label="$t('pageSslCertificates.modal.certificateFile')"> - <form-file - id="certificate-file" - v-model="form.file" - accept=".pem" - :state="getValidationState($v.form.file)" - > - <template #invalid> - <b-form-invalid-feedback role="alert"> - {{ $t('global.form.required') }} - </b-form-invalid-feedback> - </template> - </form-file> - </b-form-group> - </b-form> - <template #modal-ok> - <template v-if="certificate"> - {{ $t('global.action.replace') }} - </template> - <template v-else> - {{ $t('global.action.add') }} - </template> - </template> - <template #modal-cancel> - {{ $t('global.action.cancel') }} - </template> - </b-modal> -</template> - -<script> -import { required, requiredIf } from 'vuelidate/lib/validators'; -import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js'; - -import FormFile from '@/components/Global/FormFile'; - -export default { - components: { FormFile }, - mixins: [VuelidateMixin], - props: { - certificate: { - type: Object, - default: null, - validator: (prop) => { - if (prop === null) return true; - return ( - Object.prototype.hasOwnProperty.call(prop, 'type') && - Object.prototype.hasOwnProperty.call(prop, 'certificate') - ); - }, - }, - }, - data() { - return { - form: { - certificateType: null, - file: null, - }, - }; - }, - computed: { - certificateTypes() { - return this.$store.getters['sslCertificates/availableUploadTypes']; - }, - certificateOptions() { - return this.certificateTypes.map(({ type, label }) => { - return { - text: label, - value: type, - }; - }); - }, - }, - watch: { - certificateOptions: function (options) { - if (options.length) { - this.form.certificateType = options[0].value; - } - }, - }, - validations() { - return { - form: { - certificateType: { - required: requiredIf(function () { - return !this.certificate; - }), - }, - file: { - required, - }, - }, - }; - }, - methods: { - handleSubmit() { - this.$v.$touch(); - if (this.$v.$invalid) return; - this.$emit('ok', { - addNew: !this.certificate, - file: this.form.file, - location: this.certificate ? this.certificate.location : null, - type: this.certificate - ? this.certificate.type - : this.form.certificateType, - }); - this.closeModal(); - }, - closeModal() { - this.$nextTick(() => { - this.$refs.modal.hide(); - }); - }, - resetForm() { - this.form.certificateType = this.certificateOptions.length - ? this.certificateOptions[0].value - : null; - this.form.file = null; - this.$v.$reset(); - }, - onOk(bvModalEvt) { - // prevent modal close - bvModalEvt.preventDefault(); - this.handleSubmit(); - }, - }, -}; -</script> |