summaryrefslogtreecommitdiff
path: root/src/views/_sila/Operations/VirtualMedia
diff options
context:
space:
mode:
Diffstat (limited to 'src/views/_sila/Operations/VirtualMedia')
-rw-r--r--src/views/_sila/Operations/VirtualMedia/ModalConfigureConnection.vue25
-rw-r--r--src/views/_sila/Operations/VirtualMedia/VirtualMedia.vue68
2 files changed, 61 insertions, 32 deletions
diff --git a/src/views/_sila/Operations/VirtualMedia/ModalConfigureConnection.vue b/src/views/_sila/Operations/VirtualMedia/ModalConfigureConnection.vue
index 9886eff5..9ba90d57 100644
--- a/src/views/_sila/Operations/VirtualMedia/ModalConfigureConnection.vue
+++ b/src/views/_sila/Operations/VirtualMedia/ModalConfigureConnection.vue
@@ -9,14 +9,17 @@
<template #modal-title>
{{ $t('pageVirtualMedia.modal.title') }}
</template>
- <b-form>
+ <b-form style="width: 100%">
<b-form-group
- :label="$t('pageVirtualMedia.modal.serverUri')"
+ :label="
+ $t('pageVirtualMedia.modal.serverUri') + ' (http, ftp, smb, nfs)'
+ "
label-for="serverUri"
>
<b-form-input
id="serverUri"
v-model="form.serverUri"
+ placeholder="https://"
type="text"
:state="getValidationState($v.form.serverUri)"
data-test-id="configureConnection-input-serverUri"
@@ -43,12 +46,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 +77,12 @@
<script>
import { required } from 'vuelidate/lib/validators';
import VuelidateMixin from '@/components/_sila/Mixins/VuelidateMixin.js';
+import InputPasswordToggle from '@/components/_sila/Global/InputPasswordToggle';
export default {
+ components: {
+ InputPasswordToggle,
+ },
mixins: [VuelidateMixin],
props: {
connection: {
diff --git a/src/views/_sila/Operations/VirtualMedia/VirtualMedia.vue b/src/views/_sila/Operations/VirtualMedia/VirtualMedia.vue
index 0f75bbd7..e508e06f 100644
--- a/src/views/_sila/Operations/VirtualMedia/VirtualMedia.vue
+++ b/src/views/_sila/Operations/VirtualMedia/VirtualMedia.vue
@@ -1,14 +1,18 @@
<template>
- <b-container fluid="xl">
+ <b-container fluid class="m-0 p-0">
<page-title />
- <b-row class="mb-4">
+ <b-row class="bootstrap-table__section">
<b-col md="12">
<page-section
:section-title="$t('pageVirtualMedia.virtualMediaSubTitleFirst')"
>
<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"
+ :style="{ 'margin-bottom': dev.isActive ? '0' : '1rem' }"
+ >
<form-file
v-if="!dev.isActive"
:id="concatId(dev.id)"
@@ -21,8 +25,18 @@
</template>
</form-file>
</b-form-group>
+
+ <div
+ v-if="dev.isActive && dev.file && dev.file.name"
+ class="clear-selected-file px-3"
+ :style="{ 'margin-bottom': '1rem' }"
+ >
+ {{ dev.file.name }}
+ </div>
+
<b-button
v-if="!dev.isActive"
+ size="md"
variant="primary"
:disabled="!dev.file"
@click="startVM(dev)"
@@ -42,7 +56,7 @@
</page-section>
</b-col>
</b-row>
- <b-row v-if="loadImageFromExternalServer" class="mb-4">
+ <b-row v-if="loadImageFromExternalServer" class="bootstrap-table__section">
<b-col md="12">
<page-section
:section-title="$t('pageVirtualMedia.virtualMediaSubTitleSecond')"
@@ -56,34 +70,35 @@
<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 +122,12 @@ import FormFile from '@/components/_sila/Global/FormFile';
export default {
name: 'VirtualMedia',
- components: { PageTitle, PageSection, ModalConfigureConnection, FormFile },
+ components: {
+ PageTitle,
+ PageSection,
+ ModalConfigureConnection,
+ FormFile,
+ },
mixins: [BVToastMixin, LoadingBarMixin],
data() {
return {