136 lines
6.3 KiB
PHP
136 lines
6.3 KiB
PHP
<section>
|
|
<x-header>
|
|
{{ __('Filaments') }}
|
|
|
|
<x-slot name="headerleft">
|
|
<input type="text" placeholder="Search..." wire:model.live="search" class="bg-zinc-800 rounded focus:border-accent focus:ring-accent" />
|
|
</x-slot>
|
|
|
|
<x-slot name="headerright">
|
|
<flux:modal.trigger name="createModal">
|
|
<flux:button variant="primary" class="bg-nuke-400 hover:bg-nuke-300">Create Filament</flux:button>
|
|
</flux:modal.trigger>
|
|
</x-slot>
|
|
</x-header>
|
|
|
|
|
|
|
|
|
|
<div class="container m-auto my-8">
|
|
<x-table>
|
|
<x-slot name="tableheader">
|
|
<x-table.header>Name</x-table.header>
|
|
<x-table.header>Description</x-table.header>
|
|
<x-table.header>Color</x-table.header>
|
|
<x-table.header>Manufacturer</x-table.header>
|
|
<x-table.header>Material</x-table.header>
|
|
<x-table.header>Diameter</x-table.header>
|
|
<x-table.header>Weight</x-table.header>
|
|
<x-table.header>Price</x-table.header>
|
|
<x-table.header>Rolls</x-table.header>
|
|
<x-table.header class="w-1/6"></x-table.header>
|
|
</x-slot>
|
|
|
|
@foreach ($filaments as $filament)
|
|
<tr wire:key="{{ $filament->id }}" class="border-b border-blackout-950">
|
|
<x-table.item><p class="p-4 px-3 pl-6 font-bold">{{ $filament->name }}</p></x-table.item>
|
|
<x-table.item><p class="p-4 px-3">{{ $filament->description }}</p></x-table.item>
|
|
<x-table.item><p class="p-4 px-3"></p></x-table.item>
|
|
<x-table.item>
|
|
<div class="flex flex-row gap-4 justify-end pr-8">
|
|
<flux:button wire:click="edit({{ $filament->id }})" icon="pencil">Edit</flux:button>
|
|
<flux:button wire:click="deleteModal({{ $filament->id }})" icon="x-mark">Delete</flux:button>
|
|
</div>
|
|
</x-table.item>
|
|
</tr>
|
|
@endforeach
|
|
|
|
<x-slot name="pagination">
|
|
{{ $filaments->links() }}
|
|
</x-slot>
|
|
</x-table>
|
|
|
|
</div>
|
|
|
|
<!-- Create Form -->
|
|
<flux:modal wire:model.self='createModal' name="createModal" class="md:w-128">
|
|
<form wire:submit.prevent="create">
|
|
<div class="space-y-6">
|
|
<div>
|
|
<flux:heading size="lg" class="text-nuke-400">Create filament</flux:heading>
|
|
<flux:text class="mt-2">Create a new filament.</flux:text>
|
|
</div>
|
|
<flux:input label="Name" wire:model="name" placeholder="Filament Name" required />
|
|
<flux:textarea label="Description" wire:model="description" placeholder="Description" />
|
|
<flux:select wire:model="manufacturer" label="Manufacturer">
|
|
@foreach ($manufacturers as $manufacturer)
|
|
<option value="{{ $manufacturer->id }}">{{ $manufacturer->name }}</option>
|
|
@endforeach
|
|
</flux:select>
|
|
<flux:select wire:model="type" label="Type">
|
|
@foreach ($types as $type)
|
|
<option value="{{ $type->id }}">{{ $type->name }}</option>
|
|
@endforeach
|
|
</flux:select>
|
|
<flux:select wire:model="color" label="Color" >
|
|
@foreach ($colors as $color)
|
|
<option value="{{ $color->id }}">{{ $color->name }}</option>
|
|
@endforeach
|
|
</flux:select>
|
|
<flux:input label="Diameter" wire:model="diameter" placeholder="Diameter" required />
|
|
<flux:input label="Weight" wire:model="weight" placeholder="Weight" required />
|
|
<flux:input label="Price" wire:model="price" placeholder="Price" required />
|
|
<div class="flex gap-2">
|
|
<flux:spacer />
|
|
<flux:button variant="ghost" wire:click='cancel'>Cancel</flux:button>
|
|
<flux:button type="submit" variant="primary" class="bg-nuke-400 hover:bg-nuke-500">Create</flux:button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</flux:modal>
|
|
|
|
<!-- Edit Form -->
|
|
@empty($filament)
|
|
@else
|
|
<flux:modal wire:model.self='editModal' name="editModal" class="md:w-128">
|
|
<form wire:submit.prevent="save({{ $editid }})">
|
|
<div class="space-y-6">
|
|
<div>
|
|
<flux:heading size="lg" class="text-etheral-300">Edit manufacturer</flux:heading>
|
|
<flux:text class="mt-2">Edit an existing manufacturer.</flux:text>
|
|
</div>
|
|
<flux:input label="Name" wire:model="name" placeholder="Manufacturer Name" required />
|
|
<flux:textarea label="Description" wire:model="description" placeholder="Description" />
|
|
<div class="flex gap-2">
|
|
<flux:spacer />
|
|
<flux:button variant="ghost" wire:click='cancel'>Cancel</flux:button>
|
|
<flux:button type="submit" variant="primary" class="bg-etheral-300 hover:bg-etheral-400">Save</flux:button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</flux:modal>
|
|
@endempty
|
|
|
|
<!-- Delete Form -->
|
|
<flux:modal wire:model.self='deleteModal' name="deleteModal" class="md:w-128">
|
|
<form wire:submit.prevent="delete({{ $deleteid }})">
|
|
<div class="space-y-6">
|
|
<div>
|
|
<flux:heading size="lg" class="text-red-500">Delete filament?</flux:heading>
|
|
<flux:text class="mt-2">
|
|
<p>You're about to delete this filament.</p>
|
|
<p>This action cannot be reversed.</p>
|
|
</flux:text>
|
|
</div>
|
|
<flux:input label="Name" wire:model="name" disabled placeholder="Filament Name" required />
|
|
<flux:textarea label="Description" disabled wire:model="description" placeholder="Description" />
|
|
<div class="flex gap-2">
|
|
<flux:spacer />
|
|
<flux:button variant="ghost" wire:click='cancel'>Cancel</flux:button>
|
|
<flux:button type="submit" variant="danger">Delete filament</flux:button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</flux:modal>
|
|
|
|
</section> |