diff options
Diffstat (limited to 'src/views/Operations/VirtualMedia')
-rw-r--r-- | src/views/Operations/VirtualMedia/ModalConfigureConnection.vue | 20 | ||||
-rw-r--r-- | src/views/Operations/VirtualMedia/VirtualMedia.vue | 58 |
2 files changed, 47 insertions, 31 deletions
diff --git a/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue b/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue index b0bcfb2b..1a41a334 100644 --- a/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue +++ b/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue @@ -9,7 +9,7 @@ <template #modal-title> {{ $t('pageVirtualMedia.modal.title') }} </template> - <b-form> + <b-form style="width: 100%"> <b-form-group :label="$t('pageVirtualMedia.modal.serverUri')" label-for="serverUri" @@ -43,12 +43,14 @@ :label="$t('pageVirtualMedia.modal.password')" label-for="password" > - <b-form-input - id="password" - v-model="form.password" - type="password" - data-test-id="configureConnection-input-password" - /> + <input-password-toggle> + <b-form-input + id="password" + v-model="form.password" + type="password" + data-test-id="configureConnection-input-password" + /> + </input-password-toggle> </b-form-group> <b-form-group> <b-form-checkbox @@ -72,8 +74,12 @@ <script> import { required } from 'vuelidate/lib/validators'; import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js'; +import InputPasswordToggle from '@/components/Global/InputPasswordToggle'; export default { + components: { + InputPasswordToggle, + }, mixins: [VuelidateMixin], props: { connection: { diff --git a/src/views/Operations/VirtualMedia/VirtualMedia.vue b/src/views/Operations/VirtualMedia/VirtualMedia.vue index 8a3d5add..9f464138 100644 --- a/src/views/Operations/VirtualMedia/VirtualMedia.vue +++ b/src/views/Operations/VirtualMedia/VirtualMedia.vue @@ -1,5 +1,5 @@ <template> - <b-container fluid="xl"> + <b-container fluid> <page-title /> <b-row class="mb-4"> <b-col md="12"> @@ -8,7 +8,7 @@ > <b-row> <b-col v-for="(dev, $index) in proxyDevices" :key="$index" md="6"> - <b-form-group :label="dev.id" label-class="bold"> + <b-form-group :label="dev.id" label-class="regular-14px"> <form-file v-if="!dev.isActive" :id="concatId(dev.id)" @@ -23,6 +23,7 @@ </b-form-group> <b-button v-if="!dev.isActive" + size="md" variant="primary" :disabled="!dev.file" @click="startVM(dev)" @@ -42,48 +43,52 @@ </page-section> </b-col> </b-row> - <b-row v-if="loadImageFromExternalServer" class="mb-4"> + <b-row v-if="!loadImageFromExternalServer" class="mb-4"> <b-col md="12"> <page-section :section-title="$t('pageVirtualMedia.virtualMediaSubTitleSecond')" > <b-row> <b-col - v-for="(device, $index) in legacyDevices" + v-for="(device, $index) in [ + { id: 'device_1', isActive: false }, + { id: 'device_2', isActive: false }, + ]" :key="$index" md="6" > <b-form-group :label="device.id" :label-for="device.id" - label-class="bold" + label-class="regular-14px" > <b-button variant="primary" + size="lg" :disabled="device.isActive" @click="configureConnection(device)" > {{ $t('pageVirtualMedia.configureConnection') }} </b-button> - - <b-button - v-if="!device.isActive" - variant="primary" - class="float-right" - :disabled="!device.serverUri" - @click="startLegacy(device)" - > - {{ $t('pageVirtualMedia.start') }} - </b-button> - <b-button - v-if="device.isActive" - variant="primary" - class="float-right" - @click="stopLegacy(device)" - > - {{ $t('pageVirtualMedia.stop') }} - </b-button> </b-form-group> + + <b-button + v-if="!device.isActive" + variant="primary" + size="md" + :disabled="!device.serverUri" + @click="startLegacy(device)" + > + {{ $t('pageVirtualMedia.start') }} + </b-button> + <b-button + v-if="device.isActive" + size="md" + variant="primary" + @click="stopLegacy(device)" + > + {{ $t('pageVirtualMedia.stop') }} + </b-button> </b-col> </b-row> </page-section> @@ -107,7 +112,12 @@ import FormFile from '@/components/Global/FormFile'; export default { name: 'VirtualMedia', - components: { PageTitle, PageSection, ModalConfigureConnection, FormFile }, + components: { + PageTitle, + PageSection, + ModalConfigureConnection, + FormFile, + }, mixins: [BVToastMixin, LoadingBarMixin], data() { return { |