Refactor code and update UI components

This commit is contained in:
Andras Bacsai
2024-03-22 11:34:15 +01:00
parent ca9a2cb13a
commit 8b7e1e4169
51 changed files with 592 additions and 609 deletions

View File

@@ -1,18 +1,18 @@
<div>
<h1>Create a new Destination</h1>
<div class="subtitle ">Destinations are used to segregate resources by network.</div>
<div class="subtitle">Destinations are used to segregate resources by network.</div>
<form class="flex flex-col gap-4" wire:submit='submit'>
<div class="flex gap-2">
<x-forms.input id="name" label="Name" required />
<x-forms.input id="network" label="Network" required />
</div>
<x-forms.select id="server_id" label="Select a server" required wire:change="generate_name">
<option disabled>Select a server</option>
@foreach ($servers as $server)
<option value="{{ $server->id }}">{{ $server->name }}</option>
@endforeach
</x-forms.select>
{{-- <x-forms.checkbox type="checkbox" id="is_swarm" label="Is it a Swarm network?" /> --}}
@if ($server_id)
<x-forms.select id="server_id" label="Select a server" required wire:change="generate_name">
<option disabled>Select a server</option>
@foreach ($servers as $server)
<option value="{{ $server->id }}">{{ $server->name }}</option>
@endforeach
</x-forms.select>
@endif
<x-forms.button type="submit">
Continue
</x-forms.button>

View File

@@ -2,24 +2,28 @@
@if ($server->isFunctional())
<div class="flex items-end gap-2">
<h2>Destinations</h2>
<a href="{{ route('destination.new', ['server_id' => $server->id]) }}">
<x-forms.button>Add a new destination</x-forms.button>
</a>
<x-forms.button wire:click='scan'>Scan destinations on the server</x-forms.button>
<x-slide-over>
<x-slot:title>New Destination</x-slot:title>
<x-slot:content>
<livewire:destination.new.docker :server_id="$server->id" />
</x-slot:content>
<button @click="slideOverOpen=true" class="button">+
Add</button>
</x-slide-over>
<x-forms.button wire:click='scan'>Scan Destinations</x-forms.button>
</div>
<div class="pt-2 pb-6 ">Destinations are used to segregate resources by network.</div>
<div class="flex gap-2 ">
Available for using:
@forelse ($server->standaloneDockers as $docker)
<a
href="{{ route('destination.show', ['destination_uuid' => data_get($docker, 'uuid')]) }}">
<a href="{{ route('destination.show', ['destination_uuid' => data_get($docker, 'uuid')]) }}">
<button class="text-white btn-link">{{ data_get($docker, 'network') }} </button>
</a>
@empty
@endforelse
@forelse ($server->swarmDockers as $docker)
<a
href="{{ route('destination.show', ['destination_uuid' => data_get($docker, 'uuid')]) }}">
<a href="{{ route('destination.show', ['destination_uuid' => data_get($docker, 'uuid')]) }}">
<button class="text-white btn-link">{{ data_get($docker, 'network') }} </button>
</a>
@empty
@@ -31,12 +35,9 @@
@endif
<div class="flex flex-wrap gap-2 ">
@foreach ($networks as $network)
<div>
<a
href="{{ route('destination.new', ['server_id' => $server->id, 'network_name' => data_get($network, 'Name')]) }}">
<x-forms.button>+<x-highlighted text="{{ data_get($network, 'Name') }}" />
</x-forms.button>
</a>
<div class="min-w-fit">
<x-forms.button wire:click="add('{{ data_get($network, 'Name') }}')">Add
{{ data_get($network, 'Name') }}</x-forms.button>
</div>
@endforeach
</div>