diff options
author | SurenNeware <sneware9@in.ibm.com> | 2020-09-03 16:05:21 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2020-11-23 20:27:01 +0300 |
commit | 978807de2d5a11860b74f1f97dc0d915ee5c9a5e (patch) | |
tree | 4db3c16b4f2afe3cc393df442be8155dae5eed95 /src/views/Control | |
parent | 8da32b5c42ca7f35676a11f257adac83215dd99c (diff) | |
download | webui-vue-978807de2d5a11860b74f1f97dc0d915ee5c9a5e.tar.xz |
Add new style for form file component
- Now only add file button will be visible.
- And selected file name will come down to the button.
- Changed form file component from custom type to plain.
Signed-off-by: Suren Neware <sneware9@in.ibm.com>
Change-Id: Ib59135691495c4dddfdbbae0e4228b55cdfda2a8
Diffstat (limited to 'src/views/Control')
-rw-r--r-- | src/views/Control/VirtualMedia/VirtualMedia.vue | 29 |
1 files changed, 18 insertions, 11 deletions
diff --git a/src/views/Control/VirtualMedia/VirtualMedia.vue b/src/views/Control/VirtualMedia/VirtualMedia.vue index a15f2cd9..8264c5a2 100644 --- a/src/views/Control/VirtualMedia/VirtualMedia.vue +++ b/src/views/Control/VirtualMedia/VirtualMedia.vue @@ -8,17 +8,20 @@ > <b-row> <b-col v-for="(dev, $index) in proxyDevices" :key="$index" md="6"> - <b-form-group - :label="dev.id" - :label-for="dev.id" - label-class="bold" - > - <b-form-file - v-show="!dev.isActive" - :id="dev.id" + <b-form-group :label="dev.id" label-class="bold"> + <form-file + v-if="!dev.isActive" + :id="concatId(dev.id)" v-model="dev.file" - /> - <p v-if="dev.isActive">{{ dev.file.name }}</p> + > + <template #invalid> + <b-form-invalid-feedback role="alert"> + <template> + {{ $t('global.form.required') }} + </template> + </b-form-invalid-feedback> + </template> + </form-file> </b-form-group> <b-button v-if="!dev.isActive" @@ -102,10 +105,11 @@ import BVToastMixin from '@/components/Mixins/BVToastMixin'; import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin'; import ModalConfigureConnection from './ModalConfigureConnection'; import NbdServer from '@/utilities/NBDServer'; +import FormFile from '@/components/Global/FormFile'; export default { name: 'VirtualMedia', - components: { PageTitle, PageSection, ModalConfigureConnection }, + components: { PageTitle, PageSection, ModalConfigureConnection, FormFile }, mixins: [BVToastMixin, LoadingBarMixin], data() { return { @@ -211,6 +215,9 @@ export default { this.modalConfigureConnection = connectionData; this.$bvModal.show('configure-connection'); }, + concatId(val) { + return val.split(' ').join('_').toLowerCase(); + }, }, }; </script> |