refactor(file-storage): improve layout and structure of input fields

This commit is contained in:
Andras Bacsai
2025-03-28 22:10:15 +01:00
parent 98add9fd0f
commit 0bb47dfa56
2 changed files with 47 additions and 46 deletions

View File

@@ -1,16 +1,9 @@
<div class="py-4 ">
<div class="">
<div class="flex flex-col justify-center pb-4 text-sm select-text">
{{-- @if (data_get($resource, 'build_pack') === 'dockercompose')
<h4>{{ data_get($resource, 'name', 'unknown') }}</h4>
@endif --}}
@if ($fileStorage->is_directory)
<h4 class="dark:text-white pt-4 border-t dark:border-coolgray-200">Directory Mount</h4>
@else
<h4 class="dark:text-white pt-4 border-t dark:border-coolgray-200">File Mount</h4>
@endif
<x-forms.input label="Source Path" :value="$fileStorage->fs_path" readonly />
<x-forms.input label="Destination Path" :value="$fileStorage->mount_path" readonly />
<div class="flex gap-2 md:flex-row flex-col pt-4">
<x-forms.input label="Source Path" :value="$fileStorage->fs_path" readonly />
<x-forms.input label="Destination Path" :value="$fileStorage->mount_path" readonly />
</div>
</div>
<form wire:submit='submit' class="flex flex-col gap-2">
<div class="flex gap-2">

View File

@@ -2,45 +2,53 @@
<form wire:submit='submit' class="flex flex-col gap-2 xl:items-end xl:flex-row">
@if ($isReadOnly)
@if ($isFirst)
@if (
$storage->resource_type === 'App\Models\ServiceApplication' ||
$storage->resource_type === 'App\Models\ServiceDatabase')
<x-forms.input id="storage.name" label="Volume Name" required readonly
helper="Warning: Changing the volume name after the initial start could cause problems. Only use it when you know what are you doing." />
@else
<x-forms.input id="storage.name" label="Volume Name" required
helper="Warning: Changing the volume name after the initial start could cause problems. Only use it when you know what are you doing." />
@endif
@if ($isService || $startedAt)
<x-forms.input id="storage.host_path" readonly helper="Directory on the host system."
label="Source Path"
helper="Warning: Changing the source path after the initial start could cause problems. Only use it when you know what are you doing." />
<x-forms.input id="storage.mount_path" label="Destination Path"
helper="Directory inside the container." required readonly />
@else
<x-forms.input id="storage.host_path" helper="Directory on the host system." label="Source Path"
helper="Warning: Changing the source path after the initial start could cause problems. Only use it when you know what are you doing." />
<x-forms.input id="storage.mount_path" label="Destination Path"
helper="Directory inside the container." required readonly />
<x-forms.button type="submit">
Update
</x-forms.button>
@endif
<div class="flex gap-2 items-end w-full md:flex-row flex-col">
@if (
$storage->resource_type === 'App\Models\ServiceApplication' ||
$storage->resource_type === 'App\Models\ServiceDatabase')
<x-forms.input id="storage.name" label="Volume Name" required readonly
helper="Warning: Changing the volume name after the initial start could cause problems. Only use it when you know what are you doing." />
@else
<x-forms.input id="storage.name" label="Volume Name" required
helper="Warning: Changing the volume name after the initial start could cause problems. Only use it when you know what are you doing." />
@endif
@if ($isService || $startedAt)
<x-forms.input id="storage.host_path" readonly helper="Directory on the host system."
label="Source Path"
helper="Warning: Changing the source path after the initial start could cause problems. Only use it when you know what are you doing." />
<x-forms.input id="storage.mount_path" label="Destination Path"
helper="Directory inside the container." required readonly />
@else
<x-forms.input id="storage.host_path" helper="Directory on the host system." label="Source Path"
helper="Warning: Changing the source path after the initial start could cause problems. Only use it when you know what are you doing." />
<x-forms.input id="storage.mount_path" label="Destination Path"
helper="Directory inside the container." required readonly />
<x-forms.button type="submit">
Update
</x-forms.button>
@endif
</div>
@else
<x-forms.input id="storage.name" required readonly />
<x-forms.input id="storage.host_path" readonly />
<x-forms.input id="storage.mount_path" required readonly />
<div class="flex gap-2 items-end w-full">
<x-forms.input id="storage.name" required readonly />
<x-forms.input id="storage.host_path" readonly />
<x-forms.input id="storage.mount_path" required readonly />
</div>
@endif
@else
@if ($isFirst)
<x-forms.input id="storage.name" label="Volume Name" required />
<x-forms.input id="storage.host_path" helper="Directory on the host system." label="Source Path" />
<x-forms.input id="storage.mount_path" label="Destination Path" helper="Directory inside the container."
required />
<div class="flex gap-2 items-end w-full">
<x-forms.input id="storage.name" label="Volume Name" required />
<x-forms.input id="storage.host_path" helper="Directory on the host system." label="Source Path" />
<x-forms.input id="storage.mount_path" label="Destination Path"
helper="Directory inside the container." required />
</div>
@else
<x-forms.input id="storage.name" required />
<x-forms.input id="storage.host_path" />
<x-forms.input id="storage.mount_path" required />
<div class="flex gap-2 items-end w-full">
<x-forms.input id="storage.name" required />
<x-forms.input id="storage.host_path" />
<x-forms.input id="storage.mount_path" required />
</div>
@endif
<div class="flex gap-2">
<x-forms.button type="submit">