iridium34/FilamentLaravel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactored Filament Livewire components and views. Introduced separate CreateFilament component with route-based navigation. Simplified and cleaned up code by removing legacy modals and unused properties. Updated migrations, table layouts, and styles for consistency.

Browse Source
This commit is contained in:
iridium34
2025-12-15 01:20:04 +01:00
parent 4759df9077
commit c7671b93b1
15 changed files with 461 additions and 645 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/Livewire/Extruder/CreateExtruder.php
+4
View File
@@ -38,6 +38,10 @@ class CreateExtruder extends Component
return $this->redirectRoute('extruder.show', $extruder->id , navigate: true); return $this->redirectRoute('extruder.show', $extruder->id , navigate: true);
} }
public function cancel(){
return $this->redirectRoute('extruder.index', navigate: true);
}
public function render() public function render()
{ {
return view('livewire.extruder.create', [ return view('livewire.extruder.create', [
app/Livewire/Filament/CreateFilament.php
+47 -10
View File
@@ -2,28 +2,65 @@
namespace App\Livewire\Filament; namespace App\Livewire\Filament;
use Livewire\Attributes\Validate;
use Livewire\Component; use Livewire\Component;
use App\Models\Filament as Model; use App\Models\Filament as Model;
use App\Models\Manufacturer;
use Livewire\WithPagination;
use Livewire\Attributes\title; use Livewire\Attributes\title;
#[title('Show Filament')] #[title('Create Filament')]
class CreateFilament extends Component class CreateFilament extends Component
{ {
public Model $filament ; public Model $filament ;
public function back(){ public string $name = '';
return redirect()->route('filaments.index'); public string $description = '';
public int $color_id = 0;
public int $manufacturer_id = 0;
public int $filament_type_id = 0;
public int $weight = 1000;
public string $diameter = '1.75';
public float $price = 0;
public int $temp_min = 0;
public int $temp_max = 0;
#[Validate('required')]
public function save(){
$this->validate([
'name' => ['required', 'string', 'max:255'],
'description' => ['nullable', 'string', 'max:255'],
'color_id' => ['required', 'integer'],
'manufacturer_id' => ['required', 'integer'],
'filament_type_id' => ['required', 'integer'],
'weight' => ['required', 'integer'],
'diameter' => ['required', 'string', 'max:4'],
'price' => ['required', 'numeric'],
'temp_min' => ['required', 'integer'],
'temp_max' => ['required', 'integer']
]);
$filament = new Model();
$filament->name = $this->name;
$filament->description = $this->description;
$filament->color_id = $this->color_id;
$filament->manufacturer_id = $this->manufacturer_id;
$filament->filament_type_id = $this->filament_type_id;
$filament->weight = $this->weight;
$filament->diameter = $this->diameter;
$filament->price = $this->price;
$filament->temp_min = $this->temp_min;
$filament->temp_max = $this->temp_max;
$filament->save();
return $this->redirectRoute('filaments.show', $filament->id, navigate: true);
}
public function cancel(){
return $this->redirectRoute('filaments.index', navigate: true);
} }
public function render() public function render()
{ {
return view('livewire.filament.edit-filament', [ return view('livewire.filament.create', [
'manufacturers' => Manufacturer::all(),
'colors' => \App\Models\Color::all(),
'types' => \App\Models\FilamentType::all()
]); ]);
} }
} }
app/Livewire/Filament/EditFilament.php
+55 -12
View File
@@ -2,36 +2,79 @@
namespace App\Livewire\Filament; namespace App\Livewire\Filament;
use Livewire\Attributes\Validate;
use Livewire\Component; use Livewire\Component;
use App\Models\Filament as Model; use App\Models\Filament as Model;
use App\Models\Manufacturer;
use Livewire\WithPagination;
use Livewire\Attributes\title; use Livewire\Attributes\title;
#[title('Show Filament')] #[title('Create Filament')]
class EditFilament extends Component class EditFilament extends Component
{ {
public Model $filament ; public Model $filament ;
public function back(){ public string $name = '';
return redirect()->route('filaments.index'); public string $description = '';
public int $color_id = 0;
public int $manufacturer_id = 0;
public int $filament_type_id = 0;
public int $weight = 1000;
public string $diameter = '1.75';
public float $price = 0;
public int $temp_min = 0;
public int $temp_max = 0;
#[Validate('required')]
public function save(){
$this->validate([
'name' => ['required', 'string', 'max:255'],
'description' => ['nullable', 'string', 'max:255'],
'color_id' => ['required', 'integer'],
'manufacturer_id' => ['required', 'integer'],
'filament_type_id' => ['required', 'integer'],
'weight' => ['required', 'integer'],
'diameter' => ['required', 'string', 'max:4'],
'price' => ['required', 'numeric'],
'temp_min' => ['required', 'integer'],
'temp_max' => ['required', 'integer']
]);
$this->filament->update([
'name' => $this->name,
'description' => $this->description,
'color_id' => $this->color_id,
'manufacturer_id' => $this->manufacturer_id,
'filament_type_id' => $this->filament_type_id,
'weight' => $this->weight,
'diameter' => $this->diameter,
'price' => $this->price,
'temp_min' => $this->temp_min,
'temp_max' => $this->temp_max
]);
return $this->redirectRoute('filaments.show', $this->filament->id, navigate: true);
} }
public function show($id){ public function cancel(){
return redirect()->route('filaments.show', $id); return $this->redirectRoute('filaments.index', navigate: true);
} }
public function mount(Model $filament){ public function mount(Model $filament){
$this->filament = $filament; $this->filament = $filament;
$this->name = $filament->name;
$this->description = $filament->description;
$this->color_id = $filament->color_id;
$this->manufacturer_id = $filament->manufacturer_id;
$this->filament_type_id = $filament->filament_type_id;
$this->weight = $filament->weight;
$this->diameter = $filament->diameter;
$this->price = $filament->price;
$this->temp_min = $filament->temp_min;
$this->temp_max = $filament->temp_max;
} }
public function render() public function render()
{ {
return view('livewire.filament.edit', [ return view('livewire.filament.create', [
'manufacturers' => Manufacturer::all(),
'colors' => \App\Models\Color::all(),
'types' => \App\Models\FilamentType::all()
]); ]);
} }
} }
app/Livewire/Filament/Filament.php
+5 -106
View File
@@ -18,127 +18,26 @@ class Filament extends Component
{ {
use WithPagination; use WithPagination;
#[Validate('required')] public Model $filament ;
public $name = '';
public $description = '';
public $diameter = '1.75';
public $color_id = '';
public $type_id = '';
public $manufacturer_id = '';
public $weight = '1000';
public $finish = 'Basic';
public $price = '0';
public $stock = '0';
public $search = ''; public $search = '';
public $editid = '';
public $deleteid = '';
public function create(){ public function create(){
@Auth::check(); return $this->redirectRoute('filaments.create', navigate: true);
// Validate
$this->validate();
$filament = new Model();
$filament->name = $this->name;
$filament->description = $this->description;
$filament->diameter = $this->diameter;
$filament->color_id = $this->color_id;
$filament->filament_type_id = $this->type_id;
$filament->manufacturer_id = $this->manufacturer_id;
$filament->weight = $this->weight;
$filament->finish = $this->finish;
$filament->price = $this->price;
$filament->stock = $this->stock;
$filament->save();
// Clear the form
$this->resetInputFields();
// Close the modal
Flux::modal('createModal')->close();
}
public function save($editid) {
@Auth::check();
$filament = Model::findOrFail($editid);
$filament->name = $this->name;
$filament->description = $this->description;
$filament->diameter = $this->diameter;
$filament->color_id = $this->color_id;
$filament->filament_type_id = $this->type_id;
$filament->manufacturer_id = $this->manufacturer_id;
$filament->weight = $this->weight;
$filament->finish = $this->finish;
$filament->price = $this->price;
$filament->stock = $this->stock;
$filament->save();
$this->resetInputFields();
Flux::modal('editModal')->close();
}
public function deleteModal($filamentid) {
@Auth::check();
$deleteid = $filamentid;
$this->deleteid = $deleteid;
$filament = Model::findOrFail($deleteid);
$this->name = $filament->name;
$this->description = $filament->description;
$this->diameter = $filament->diameter;
$this->color_id = $filament->color_id;
$this->type_id = $filament->filament_type_id;
$this->manufacturer_id = $filament->manufacturer_id;
$this->weight = $filament->weight;
$this->finish = $filament->finish;
$this->price = $filament->price;
$this->stock = $filament->stock;
Flux::modal('deleteModal')->show();
}
public function delete($deleteid) {
@Auth::check();
$filament = Model::findOrFail($deleteid)->delete();
$this->deleteid = $deleteid;
Flux::modal('deleteModal')->close();
// Clear the form
$this->resetInputFields();
}
public function cancel() {
$this->resetInputFields();
Flux::modals()->close();
}
public function resetInputFields() {
$this->reset(['name', 'description', 'diameter', 'color_id', 'type_id', 'manufacturer_id', 'weight', 'price', 'finish', 'deleteid', 'editid']);
} }
public function show($id){ public function show($id){
return redirect()->route('filaments.show', $id); return $this->redirectRoute('filaments.show', $id);
} }
public function edit($id){ public function edit($id){
return redirect()->route('filaments.edit', $id); return $this->redirectRoute('filaments.edit', $id);
} }
public function render() public function render()
{ {
return view('livewire.filament.index', [ return view('livewire.filament.index', [
'filaments' => Model::search('name', $this->search)->paginate(50), 'filaments' => Model::search('name', $this->search)->paginate(25)
'colors' => Color::all(),
'manufacturers' => Manufacturer::all(),
'types' => Type::all()
]); ]);
} }
} }
app/Livewire/Filament/ShowFilament.php
+1 -6
View File
@@ -4,7 +4,6 @@ namespace App\Livewire\Filament;
use Livewire\Component; use Livewire\Component;
use App\Models\Filament as Model; use App\Models\Filament as Model;
use Livewire\WithPagination;
use Livewire\Attributes\title; use Livewire\Attributes\title;
#[title('Show Filament')] #[title('Show Filament')]
@@ -21,13 +20,9 @@ class ShowFilament extends Component
return redirect()->route('filaments.edit', $id); return redirect()->route('filaments.edit', $id);
} }
public function mount(Model $filament){
$this->filament = $filament;
}
public function render() public function render()
{ {
return view('livewire.filament.show-filament', [ return view('livewire.filament.show', [
]); ]);
} }
database/migrations/2025_03_10_183058_create_filaments.php
-6
View File
@@ -15,20 +15,14 @@ return new class extends Migration
$table->id(); $table->id();
$table->string('name'); $table->string('name');
$table->string('description')->nullable(); $table->string('description')->nullable();
// Foreign keys pointing to existing tables with non-standard names
$table->foreignId('color_id')->constrained('colors')->onUpdate('cascade')->onDelete('cascade'); $table->foreignId('color_id')->constrained('colors')->onUpdate('cascade')->onDelete('cascade');
$table->foreignId('manufacturer_id')->constrained('manufacturers')->onUpdate('cascade')->onDelete('cascade'); $table->foreignId('manufacturer_id')->constrained('manufacturers')->onUpdate('cascade')->onDelete('cascade');
$table->foreignId('filament_type_id')->constrained('filament_types')->onUpdate('cascade')->onDelete('cascade'); $table->foreignId('filament_type_id')->constrained('filament_types')->onUpdate('cascade')->onDelete('cascade');
$table->integer('weight'); $table->integer('weight');
$table->decimal('diameter', 10, 2); $table->decimal('diameter', 10, 2);
$table->decimal('price', 10, 2)->nullable(); $table->decimal('price', 10, 2)->nullable();
$table->string('finish')->nullable();
$table->string('image')->nullable();
$table->integer('stock')->default(0);
$table->integer('temp_min')->nullable(); $table->integer('temp_min')->nullable();
$table->integer('temp_max')->nullable(); $table->integer('temp_max')->nullable();
$table->integer('buildplate_id')->nullable();
$table->integer('extruder_id')->nullable();
$table->timestamps(); $table->timestamps();
}); });
} }
database/migrations/2025_03_15_185418_create_extruders_table.php
+1 -1
View File
@@ -17,7 +17,7 @@ return new class extends Migration
$table->string('description')->nullable(); $table->string('description')->nullable();
$table->foreignId('manufacturer_id')->constrained(); $table->foreignId('manufacturer_id')->constrained();
$table->string('diameter')->required(); $table->string('diameter')->required();
$table->string('temp_max')->required(); $table->integer('temp_max')->required();
$table->timestamps(); $table->timestamps();
}); });
} }
database/migrations/2025_03_15_185700_create_buildplates_table.php
+1 -1
View File
@@ -16,7 +16,7 @@ return new class extends Migration
$table->string('name'); $table->string('name');
$table->string('description'); $table->string('description');
$table->foreignId('manufacturer_id')->constrained('manufacturers'); $table->foreignId('manufacturer_id')->constrained('manufacturers');
$table->string('temp_max'); $table->integer('temp_max');
$table->timestamps(); $table->timestamps();
}); });
} }
resources/views/components/navbar.blade.php
+16 -9
View File
@@ -6,28 +6,33 @@
<flux:brand href="{{ route('dashboard') }}" name="FilamentApp" class="max-lg:hidden! hidden dark:flex"/> <flux:brand href="{{ route('dashboard') }}" name="FilamentApp" class="max-lg:hidden! hidden dark:flex"/>
<flux:navbar class="-mb-px max-lg:hidden"> <flux:navbar class="-mb-px max-lg:hidden">
<flux:navbar.item wire:navigate icon="home" href="{{ route('dashboard') }}">Dashboard</flux:navbar.item> <flux:navbar.item wire:navigate icon="home" href="{{ route('dashboard') }}">
<flux:navbar.item wire:navigate icon="shopping-bag" href="{{ route('orders.index') }}">Orders Dashboard
</flux:navbar.item>
<flux:navbar.item wire:navigate icon="shopping-bag" href="{{ route('orders.index') }}">
Orders
</flux:navbar.item>
<flux:navbar.item wire:navigate icon="stop-circle" href="{{ route('filaments.index') }}">
Filaments
</flux:navbar.item>
<flux:navbar.item wire:navigate icon="wrench-screwdriver" href="{{ route('filaments.index') }}">
SpareParts
</flux:navbar.item> </flux:navbar.item>
</flux:navbar> </flux:navbar>
<flux:spacer/> <flux:spacer/>
<flux:navbar class="mr-4"> <flux:navbar class="mr-4">
<flux:navbar.item icon="magnifying-glass" href="#" label="Search"/> <flux:navbar.item icon="magnifying-glass" href="#" label="Search"/>
<flux:navbar.item class="max-lg:hidden" icon="cog-6-tooth" href="{{ route('settings.index') }}" <flux:navbar.item class="max-lg:hidden" icon="cog-6-tooth" href="{{ route('settings.index') }}" label="Settings"/>
label="Settings"/>
<flux:separator vertical variant="subtle" class="my-2"/> <flux:separator vertical variant="subtle" class="my-2"/>
<flux:dropdown> <flux:dropdown>
<flux:navbar.item icon="circle-stack" /> <flux:navbar.item icon="circle-stack" />
<flux:navmenu class="bg-white"> <flux:navmenu class="bg-white">
<flux:navmenu.item wire:navigate icon="circle-stack" href="{{ route('filaments.index') }}">All
Filaments
</flux:navmenu.item>
<flux:navmenu.separator/>
<flux:navmenu.item wire:navigate icon="archive-box" href="{{ route('manufacturer.index') }}"> <flux:navmenu.item wire:navigate icon="archive-box" href="{{ route('manufacturer.index') }}">
Manufacturers Manufacturers
</flux:navmenu.item> </flux:navmenu.item>
@@ -43,7 +48,9 @@
</flux:navmenu.item> </flux:navmenu.item>
</flux:navmenu> </flux:navmenu>
</flux:dropdown> </flux:dropdown>
<flux:separator vertical variant="subtle" class="my-2"/> <flux:separator vertical variant="subtle" class="my-2"/>
</flux:navbar> </flux:navbar>
<flux:dropdown position="top" align="start"> <flux:dropdown position="top" align="start">
resources/views/livewire/filament/create-filament.blade.php
-135
View File
@@ -1,135 +0,0 @@
<section>
<x-header>
{{ __('Edit Filament - ') . $filament->name }}
<x-slot name="headerleft">
<flux:button wire:click="back" variant="ghost" icon="arrow-left">Back</flux:button>
</x-slot>
<x-slot name="headerright">
<flux:button variant="primary" icon="check">Save</flux:button>
<flux:button wire:click="show({{ $filament->id }})" variant="danger" icon="x-mark">Cancel</flux:button>
</x-slot>
</x-header>
<div class="container m-auto my-8 bg-jet-800 rounded-lg shadow p-6 text-jet-50">
<div>
<div class="px-4 sm:px-0">
<h3 class="text-base/7 font-semibold text-white">Filament Information</h3>
<p class="mt-1 max-w-2xl text-sm/6 text-jet-200">Filament details and QR Code.</p>
</div>
<div class="mt-6 border-t border-white/10">
<dl class="divide-y divide-white/10">
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">ID</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">
<flux:input readonly variant="filled" wire:model="id" type="text" class="mt-1 block w-full" value="{{ $filament->id }}"/>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Name</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">
<flux:input wire:model="name" type="text" class="mt-1 block w-full" value="{{ $filament->name }}"/>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Color</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">
<flux:select wire:model="color_id" >
<flux:select.option disabled value="">Choose Color</flux:select.option>
@foreach ($colors as $color)
<flux:select.option wire:key="{{ $color->id }}" value="{{ $color->id }}">{{ $color->name }}</flux:select.option>
@endforeach
</flux:select>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Manufacturer</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">
<flux:select wire:model="manufacturer_id">
<flux:select.option disabled value="">Choose Manufacturer</flux:select.option>
@foreach ($manufacturers as $manufacturer)
<flux:select.option wire:key="{{ $manufacturer->id }}" value="{{ $manufacturer->id }}">{{ $manufacturer->name }}</flux:select.option>
@endforeach
</flux:select>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Filament Type</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">
<flux:select wire:model="type_id" >
<flux:select.option disabled value="">Choose Type</flux:select.option>
@foreach ($types as $type)
<flux:select.option wire:key="{{ $type->id }}" value="{{ $type->id }}">{{ $type->name }}</flux:select.option>
@endforeach
</flux:select>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Weight</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">
<flux:input wire:model="weight" type="text" class="mt-1 block w-full" value="{{ $filament->weight }}"/>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Diameter</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">
<flux:input wire:model="diameter" type="text" class="mt-1 block w-full" value="{{ $filament->diameter }}"/>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Temperature</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0 flex gap-4 flex-row items-center">
<flux:input wire:model="temp_min" type="text" class="mt-1 w-1/2" value="{{ $filament->temp_min }}"/>
<span>-</span>
<flux:input wire:model="temp_max" type="text" class="mt-1 w-1/2" value="{{ $filament->temp_max }}"/>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">BuildPlate</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->buildplate_id }}</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Extruder</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->extruder_id }}</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-gray-100">Attachments</dt>
<dd class="mt-2 text-sm text-white sm:col-span-2 sm:mt-0">
<ul role="list" class="divide-y divide-white/5 rounded-md border border-white/10">
<li class="flex items-center justify-between py-4 pr-5 pl-4 text-sm/6">
<div class="flex w-0 flex-1 items-center">
<svg viewBox="0 0 20 20" fill="currentColor" data-slot="icon" aria-hidden="true" class="size-5 shrink-0 text-gray-500">
<path d="M15.621 4.379a3 3 0 0 0-4.242 0l-7 7a3 3 0 0 0 4.241 4.243h.001l.497-.5a.75.75 0 0 1 1.064 1.057l-.498.501-.002.002a4.5 4.5 0 0 1-6.364-6.364l7-7a4.5 4.5 0 0 1 6.368 6.36l-3.455 3.553A2.625 2.625 0 1 1 9.52 9.52l3.45-3.451a.75.75 0 1 1 1.061 1.06l-3.45 3.451a1.125 1.125 0 0 0 1.587 1.595l3.454-3.553a3 3 0 0 0 0-4.242Z" clip-rule="evenodd" fill-rule="evenodd" />
</svg>
<div class="ml-4 flex min-w-0 flex-1 gap-2">
<span class="truncate font-medium text-white">resume_back_end_developer.pdf</span>
<span class="shrink-0 text-gray-500">2.4mb</span>
</div>
</div>
<div class="ml-4 shrink-0">
<a href="#" class="font-medium text-indigo-400 hover:text-indigo-300">Download</a>
</div>
</li>
<li class="flex items-center justify-between py-4 pr-5 pl-4 text-sm/6">
<div class="flex w-0 flex-1 items-center">
<svg viewBox="0 0 20 20" fill="currentColor" data-slot="icon" aria-hidden="true" class="size-5 shrink-0 text-gray-500">
<path d="M15.621 4.379a3 3 0 0 0-4.242 0l-7 7a3 3 0 0 0 4.241 4.243h.001l.497-.5a.75.75 0 0 1 1.064 1.057l-.498.501-.002.002a4.5 4.5 0 0 1-6.364-6.364l7-7a4.5 4.5 0 0 1 6.368 6.36l-3.455 3.553A2.625 2.625 0 1 1 9.52 9.52l3.45-3.451a.75.75 0 1 1 1.061 1.06l-3.45 3.451a1.125 1.125 0 0 0 1.587 1.595l3.454-3.553a3 3 0 0 0 0-4.242Z" clip-rule="evenodd" fill-rule="evenodd" />
</svg>
<div class="ml-4 flex min-w-0 flex-1 gap-2">
<span class="truncate font-medium text-white">coverletter_back_end_developer.pdf</span>
<span class="shrink-0 text-gray-500">4.5mb</span>
</div>
</div>
<div class="ml-4 shrink-0">
<a href="#" class="font-medium text-indigo-400 hover:text-indigo-300">Download</a>
</div>
</li>
</ul>
</dd>
</div>
</dl>
</div>
</div>
</div>
</section>
resources/views/livewire/filament/create.blade.php
+116
View File
@@ -0,0 +1,116 @@
<section>
<form wire:submit="save">
<x-header>
{{ __('Create Filament') }}
<x-slot name="headerright">
<flux:button type="submit" variant="primary" class="bg-selective hover:bg-selective-600 text-gray-950 hover:cursor-pointer transition-all ease-in-out" icon="check">Save</flux:button>
<flux:button wire:click="cancel" variant="primary" class=" bg-red-700 shadow hover:bg-red-800 hover:cursor-pointer transition-all ease-in-out" icon="x-mark">Cancel</flux:button>
</x-slot>
</x-header>
<div class="container m-auto my-8 bg-elephant-950 border border-elephant-900 rounded-lg shadow p-6 text-gray-50">
<div>
<div class="px-4 sm:px-0">
<h3 class="text-base/7 font-semibold text-white">Filament Information</h3>
<p class="mt-1 max-w-2xl text-sm/6 text-gray-200">Filament details.</p>
</div>
<div class="mt-6 border-t border-white/10">
<dl class="divide-y divide-white/10">
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-gray-100">Name</dt>
<dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input wire:model="name" type="text" class="mt-1 block w-full"/>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-gray-100">Description</dt>
<dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:textarea wire:model="description" type="text" class="mt-1 block w-full"/>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-gray-100">Color</dt>
<dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:select wire:model="color_id" class="mt-1 block w-full">
<flux:select.option default value="">Select Color</flux:select.option>
@foreach(\App\Models\Color::all() as $color)
<flux:select.option key="{{ $color->id }}" value="{{$color->id}}">{{$color->name}}</flux:select.option>
@endforeach
</flux:select>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-gray-100">Manufacturer</dt>
<dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:select wire:model="manufacturer_id" class="mt-1 block w-full">
<flux:select.option default value="">Select Manufacturer</flux:select.option>
@foreach(\App\Models\Manufacturer::all() as $manufacturer)
<flux:select.option key="{{ $manufacturer->id }}" value="{{$manufacturer->id}}">{{$manufacturer->name}}</flux:select.option>
@endforeach
</flux:select>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-gray-100">Filament Type</dt>
<dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:select wire:model="filament_type_id" class="mt-1 block w-full">
<flux:select.option default value="">Select Filament Type</flux:select.option>
@foreach(\App\Models\FilamentType::all() as $filament_type)
<flux:select.option key="{{ $filament_type->id }}" value="{{$filament_type->id}}">{{$filament_type->name}}</flux:select.option>
@endforeach
</flux:select>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-gray-100">Weight</dt>
<dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input.group>
<flux:input wire:model="weight" type="text" class="block w-full"/>
<flux:input.group.suffix>g</flux:input.group.suffix>
</flux:input.group>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-gray-100">Diameter</dt>
<dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input.group>
<flux:input wire:model="diameter" type="text" class="block w-full"/>
<flux:input.group.suffix>mm</flux:input.group.suffix>
</flux:input.group>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-gray-100">Price</dt>
<dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input.group>
<flux:input wire:model="price" type="text" class="block w-full"/>
<flux:input.group.suffix>€</flux:input.group.suffix>
</flux:input.group>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-gray-100">Min Temperature</dt>
<dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input.group>
<flux:input wire:model="temp_min" type="text" class="block w-full"/>
<flux:input.group.suffix>°C</flux:input.group.suffix>
</flux:input.group>
</dd>
</div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-gray-100">Max Temperature</dt>
<dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input.group>
<flux:input wire:model="temp_max" type="text" class="block w-full"/>
<flux:input.group.suffix>°C</flux:input.group.suffix>
</flux:input.group>
</dd>
</div>
</dl>
</div>
</div>
</div>
</form>
</section>
resources/views/livewire/filament/edit.blade.php
+63 -82
View File
@@ -1,135 +1,116 @@
<section> <section>
<form wire:submit="save">
<x-header> <x-header>
{{ __('Edit Filament - ') . $filament->name }} {{ __('Edit Filament') }}
<x-slot name="headerleft">
<flux:button wire:click="back" variant="ghost" icon="arrow-left">Back</flux:button>
</x-slot>
<x-slot name="headerright"> <x-slot name="headerright">
<flux:button variant="primary" icon="check">Save</flux:button> <flux:button type="submit" variant="primary" class="bg-selective hover:bg-selective-600 text-gray-950 hover:cursor-pointer transition-all ease-in-out" icon="check">Save</flux:button>
<flux:button wire:click="show({{ $filament->id }})" variant="danger" icon="x-mark">Cancel</flux:button> <flux:button wire:click="cancel" variant="primary" class=" bg-red-700 shadow hover:bg-red-800 hover:cursor-pointer transition-all ease-in-out" icon="x-mark">Cancel</flux:button>
</x-slot> </x-slot>
</x-header> </x-header>
<div class="container m-auto my-8 bg-jet-800 rounded-lg shadow p-6 text-jet-50"> <div class="container m-auto my-8 bg-elephant-950 border border-elephant-900 rounded-lg shadow p-6 text-gray-50">
<div> <div>
<div class="px-4 sm:px-0"> <div class="px-4 sm:px-0">
<h3 class="text-base/7 font-semibold text-white">Filament Information</h3> <h3 class="text-base/7 font-semibold text-white">Filament Information</h3>
<p class="mt-1 max-w-2xl text-sm/6 text-jet-200">Filament details and QR Code.</p> <p class="mt-1 max-w-2xl text-sm/6 text-gray-200">Filament details.</p>
</div> </div>
<div class="mt-6 border-t border-white/10"> <div class="mt-6 border-t border-white/10">
<dl class="divide-y divide-white/10"> <dl class="divide-y divide-white/10">
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">ID</dt> <dt class="text-sm/6 font-medium text-gray-100">Name</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0"> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input readonly variant="filled" wire:model="id" type="text" class="mt-1 block w-full" value="{{ $filament->id }}"/> <flux:input wire:model="name" type="text" class="mt-1 block w-full"/>
</dd> </dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Name</dt> <dt class="text-sm/6 font-medium text-gray-100">Description</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0"> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input wire:model="name" type="text" class="mt-1 block w-full" value="{{ $filament->name }}"/> <flux:textarea wire:model="description" type="text" class="mt-1 block w-full"/>
</dd> </dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Color</dt> <dt class="text-sm/6 font-medium text-gray-100">Color</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0"> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:select wire:model="color_id" > <flux:select wire:model="color_id" class="mt-1 block w-full">
<flux:select.option disabled value="">Choose Color</flux:select.option> <flux:select.option default value="">Select Color</flux:select.option>
@foreach ($colors as $color) @foreach(\App\Models\Color::all() as $color)
<flux:select.option wire:key="{{ $color->id }}" value="{{ $color->id }}">{{ $color->name }}</flux:select.option> <flux:select.option key="{{ $color->id }}" value="{{$color->id}}">{{$color->name}}</flux:select.option>
@endforeach @endforeach
</flux:select> </flux:select>
</dd> </dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Manufacturer</dt> <dt class="text-sm/6 font-medium text-gray-100">Manufacturer</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0"> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:select wire:model="manufacturer_id"> <flux:select wire:model="manufacturer_id" class="mt-1 block w-full">
<flux:select.option disabled value="">Choose Manufacturer</flux:select.option> <flux:select.option default value="">Select Manufacturer</flux:select.option>
@foreach ($manufacturers as $manufacturer) @foreach(\App\Models\Manufacturer::all() as $manufacturer)
<flux:select.option wire:key="{{ $manufacturer->id }}" value="{{ $manufacturer->id }}">{{ $manufacturer->name }}</flux:select.option> <flux:select.option key="{{ $manufacturer->id }}" value="{{$manufacturer->id}}">{{$manufacturer->name}}</flux:select.option>
@endforeach @endforeach
</flux:select> </flux:select>
</dd> </dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Filament Type</dt> <dt class="text-sm/6 font-medium text-gray-100">Filament Type</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0"> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:select wire:model="type_id" > <flux:select wire:model="filament_type_id" class="mt-1 block w-full">
<flux:select.option disabled value="">Choose Type</flux:select.option> <flux:select.option default value="">Select Filament Type</flux:select.option>
@foreach ($types as $type) @foreach(\App\Models\FilamentType::all() as $filament_type)
<flux:select.option wire:key="{{ $type->id }}" value="{{ $type->id }}">{{ $type->name }}</flux:select.option> <flux:select.option key="{{ $filament_type->id }}" value="{{$filament_type->id}}">{{$filament_type->name}}</flux:select.option>
@endforeach @endforeach
</flux:select> </flux:select>
</dd> </dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Weight</dt> <dt class="text-sm/6 font-medium text-gray-100">Weight</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0"> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input wire:model="weight" type="text" class="mt-1 block w-full" value="{{ $filament->weight }}"/> <flux:input.group>
<flux:input wire:model="weight" type="text" class="block w-full"/>
<flux:input.group.suffix>g</flux:input.group.suffix>
</flux:input.group>
</dd> </dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Diameter</dt> <dt class="text-sm/6 font-medium text-gray-100">Diameter</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0"> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input wire:model="diameter" type="text" class="mt-1 block w-full" value="{{ $filament->diameter }}"/> <flux:input.group>
<flux:input wire:model="diameter" type="text" class="block w-full"/>
<flux:input.group.suffix>mm</flux:input.group.suffix>
</flux:input.group>
</dd> </dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Temperature</dt> <dt class="text-sm/6 font-medium text-gray-100">Price</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0 flex gap-4 flex-row items-center"> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input wire:model="temp_min" type="text" class="mt-1 w-1/2" value="{{ $filament->temp_min }}"/> <flux:input.group>
<span>-</span> <flux:input wire:model="price" type="text" class="block w-full"/>
<flux:input wire:model="temp_max" type="text" class="mt-1 w-1/2" value="{{ $filament->temp_max }}"/> <flux:input.group.suffix>€</flux:input.group.suffix>
</flux:input.group>
</dd> </dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">BuildPlate</dt> <dt class="text-sm/6 font-medium text-gray-100">Min Temperature</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->buildplate_id }}</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<flux:input.group>
<flux:input wire:model="temp_min" type="text" class="block w-full"/>
<flux:input.group.suffix>°C</flux:input.group.suffix>
</flux:input.group>
</dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Extruder</dt> <dt class="text-sm/6 font-medium text-gray-100">Max Temperature</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->extruder_id }}</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
</div> <flux:input.group>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center"> <flux:input wire:model="temp_max" type="text" class="block w-full"/>
<dt class="text-sm/6 font-medium text-gray-100">Attachments</dt> <flux:input.group.suffix>°C</flux:input.group.suffix>
<dd class="mt-2 text-sm text-white sm:col-span-2 sm:mt-0"> </flux:input.group>
<ul role="list" class="divide-y divide-white/5 rounded-md border border-white/10">
<li class="flex items-center justify-between py-4 pr-5 pl-4 text-sm/6">
<div class="flex w-0 flex-1 items-center">
<svg viewBox="0 0 20 20" fill="currentColor" data-slot="icon" aria-hidden="true" class="size-5 shrink-0 text-gray-500">
<path d="M15.621 4.379a3 3 0 0 0-4.242 0l-7 7a3 3 0 0 0 4.241 4.243h.001l.497-.5a.75.75 0 0 1 1.064 1.057l-.498.501-.002.002a4.5 4.5 0 0 1-6.364-6.364l7-7a4.5 4.5 0 0 1 6.368 6.36l-3.455 3.553A2.625 2.625 0 1 1 9.52 9.52l3.45-3.451a.75.75 0 1 1 1.061 1.06l-3.45 3.451a1.125 1.125 0 0 0 1.587 1.595l3.454-3.553a3 3 0 0 0 0-4.242Z" clip-rule="evenodd" fill-rule="evenodd" />
</svg>
<div class="ml-4 flex min-w-0 flex-1 gap-2">
<span class="truncate font-medium text-white">resume_back_end_developer.pdf</span>
<span class="shrink-0 text-gray-500">2.4mb</span>
</div>
</div>
<div class="ml-4 shrink-0">
<a href="#" class="font-medium text-indigo-400 hover:text-indigo-300">Download</a>
</div>
</li>
<li class="flex items-center justify-between py-4 pr-5 pl-4 text-sm/6">
<div class="flex w-0 flex-1 items-center">
<svg viewBox="0 0 20 20" fill="currentColor" data-slot="icon" aria-hidden="true" class="size-5 shrink-0 text-gray-500">
<path d="M15.621 4.379a3 3 0 0 0-4.242 0l-7 7a3 3 0 0 0 4.241 4.243h.001l.497-.5a.75.75 0 0 1 1.064 1.057l-.498.501-.002.002a4.5 4.5 0 0 1-6.364-6.364l7-7a4.5 4.5 0 0 1 6.368 6.36l-3.455 3.553A2.625 2.625 0 1 1 9.52 9.52l3.45-3.451a.75.75 0 1 1 1.061 1.06l-3.45 3.451a1.125 1.125 0 0 0 1.587 1.595l3.454-3.553a3 3 0 0 0 0-4.242Z" clip-rule="evenodd" fill-rule="evenodd" />
</svg>
<div class="ml-4 flex min-w-0 flex-1 gap-2">
<span class="truncate font-medium text-white">coverletter_back_end_developer.pdf</span>
<span class="shrink-0 text-gray-500">4.5mb</span>
</div>
</div>
<div class="ml-4 shrink-0">
<a href="#" class="font-medium text-indigo-400 hover:text-indigo-300">Download</a>
</div>
</li>
</ul>
</dd> </dd>
</div> </div>
</dl> </dl>
</div> </div>
</div> </div>
</div> </div>
</form>
</section> </section>
resources/views/livewire/filament/index.blade.php
+13 -131
View File
@@ -3,20 +3,18 @@
{{ __('Filaments') }} {{ __('Filaments') }}
<x-slot name="headerleft"> <x-slot name="headerleft">
<input type="text" placeholder="Search..." wire:model.live="search" class="bg-jet-700 border-jet-500 rounded text-jet-50 placeholder:text-jet-200 focus:border-olivine focus:ring-olivine" /> <input type="text" placeholder="Search..." wire:model.live="search" class="bg-black/10 border-white/20 rounded text-gray-50 placeholder:text-gray-200 focus:border-white/50 focus:ring-white/50" />
</x-slot> </x-slot>
<x-slot name="headerright"> <x-slot name="headerright">
<flux:modal.trigger name="createModal"> <flux:button wire:click="create" variant="primary" class="bg-selective hover:bg-selective-600 text-gray-950 transition ease-in-out hover:cursor-pointer">Create Filament</flux:button>
<flux:button variant="primary" class="bg-olivine hover:bg-olivine-600">Create Filament</flux:button>
</flux:modal.trigger>
</x-slot> </x-slot>
</x-header> </x-header>
<div class="container m-auto my-8 bg-elephant border border-elephant-900 rounded-lg shadow p-6 text-gray-50">
</div>
<div class="container m-auto my-8 bg-elephant border border-elephant-900 rounded-lg shadow p-6 text-gray-50">
<div class="m-auto my-8 mx-12 bg-jet-800 rounded-lg shadow p-6 text-jet-50">
<x-table> <x-table>
<x-slot name="tableheader"> <x-slot name="tableheader">
<x-table.header class="w-[50px]">ID</x-table.header> <x-table.header class="w-[50px]">ID</x-table.header>
@@ -24,7 +22,6 @@
<x-table.header>Color</x-table.header> <x-table.header>Color</x-table.header>
<x-table.header>Manufacturer</x-table.header> <x-table.header>Manufacturer</x-table.header>
<x-table.header>Material</x-table.header> <x-table.header>Material</x-table.header>
<x-table.header>Finish</x-table.header>
<x-table.header>Min Temp</x-table.header> <x-table.header>Min Temp</x-table.header>
<x-table.header>Max Temp</x-table.header> <x-table.header>Max Temp</x-table.header>
<x-table.header>Weight</x-table.header> <x-table.header>Weight</x-table.header>
@@ -33,27 +30,26 @@
</x-slot> </x-slot>
@foreach ($filaments as $filament) @foreach ($filaments as $filament)
<tr wire:key="{{ $filament->id }}" class="text-jet-200 border-b border-jet-600 hover:bg-jet-700 transition duration-150 ease-in-out"> <tr wire:key="{{ $filament->id }}" class="text-gray-200 border-b border-white/50 hover:bg-white/10 transition duration-150 ease-in-out">
<x-table.item><p class="p-4 px-3 pl-6">{{ $filament->id }}</p></x-table.item> <x-table.item><p class="p-4 px-3 pl-6">{{ $filament->id }}</p></x-table.item>
<x-table.item><p class="p-4 px-3 font-bold">{{ $filament->name }}</p></x-table.item> <x-table.item><p class="p-4 px-3 font-bold">{{ $filament->name }}</p></x-table.item>
<x-table.item> <x-table.item>
<div class="flex flex-row gap-2 px-2 justify-start items-center"> <div class="flex flex-row gap-2 px-2 justify-start items-center">
<div class="p-4 h-[20px] w-[20px] rounded" style="background-color: {{ App\Models\Color::find($filament->color_id)->hex}}"></div> <div class="p-4 h-[20px] w-[20px] rounded" style="background-color: #{{ App\Models\Color::find($filament->color_id)->hex}}"></div>
<p>{{ App\Models\Color::find($filament->color_id)->name }}</p> <p>{{ App\Models\Color::find($filament->color_id)->name }}</p>
</div> </div>
</x-table.item> </x-table.item>
<x-table.item><p class="p-4 px-3">{{ App\Models\Manufacturer::find($filament->manufacturer_id)->name }}</p></x-table.item> <x-table.item><p class="p-4 px-3">{{ App\Models\Manufacturer::find($filament->manufacturer_id)->name }}</p></x-table.item>
<x-table.item><p class="p-4 px-3">{{ App\Models\FilamentType::find($filament->filament_type_id)->name }}</p></x-table.item> <x-table.item><p class="p-4 px-3">{{ App\Models\FilamentType::find($filament->filament_type_id)->name }}</p></x-table.item>
<x-table.item><p class="p-4 px-3">{{ $filament->finish }}</p></x-table.item> <x-table.item><p class="p-4 px-3">{{ $filament->temp_min }}°C</p></x-table.item>
<x-table.item><p class="p-4 px-3">{{ $filament->temp_min }}</p></x-table.item> <x-table.item><p class="p-4 px-3">{{ $filament->temp_max }}°C</p></x-table.item>
<x-table.item><p class="p-4 px-3">{{ $filament->temp_max }}</p></x-table.item>
<x-table.item><p class="p-4 px-3">{{ $filament->weight }} g</p></x-table.item> <x-table.item><p class="p-4 px-3">{{ $filament->weight }} g</p></x-table.item>
<x-table.item><p class="p-4 px-3">{{ $filament->price }}€</p></x-table.item> <x-table.item><p class="p-4 px-3">{{ $filament->price }}€</p></x-table.item>
<x-table.item> <x-table.item>
<div class="flex flex-row gap-2 justify-start pr-2"> <div class="flex flex-row gap-4 justify-end pr-8">
<flux:button wire:click="show({{ $filament->id }})" variant="primary" class="bg-transparent border-0 shadow-transparent text-jet-200 hover:bg-olivine-500 hover:text-jet-950 transition-all ease-in-out hover:cursor-pointer" icon="magnifying-glass"></flux:button> <flux:button variant="primary" class="text-gray-200 bg-transparent shadow-none hover:bg-cornflower hover:shadow hover:text-gray-950 hover:cursor-pointer" wire:click="show({{ $filament->id }})" icon="magnifying-glass"></flux:button>
<flux:button wire:click="edit({{ $filament->id }})" variant="primary" class="bg-transparent border-0 shadow-transparent text-jet-200 hover:bg-pumpkin-500 hover:text-jet-950 transition-all ease-in-out hover:cursor-pointer" icon="pencil"></flux:button> <flux:button variant="primary" class="text-gray-200 bg-transparent shadow-none hover:bg-gold-drop hover:shadow hover:text-gray-950 hover:cursor-pointer" wire:click="edit({{ $filament->id }})" icon="pencil"></flux:button>
<flux:button wire:click="deleteModal({{ $filament->id }})" variant="primary" class="bg-transparent border-0 shadow-transparent text-jet-200 hover:bg-red-600 hover:text-jet-200 transition-all ease-in-out hover:cursor-pointer" icon="trash"></flux:button> <flux:button variant="primary" class="text-gray-200 bg-transparent shadow-none hover:bg-red-700 hover:shadow hover:cursor-pointer" wire:click="delete({{ $filament->id }})" icon="trash"></flux:button>
</div> </div>
</x-table.item> </x-table.item>
</tr> </tr>
@@ -65,118 +61,4 @@
</x-table> </x-table>
</div> </div>
<!-- Create Form -->
<flux:modal wire:model.self='createModal' name="createModal" class="md:w-5xl">
<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" />
<div class="grid grid-cols-2 gap-x-4 gap-y-6">
<flux:select wire:model="manufacturer_id" label="Manufacturer">
<flux:select.option disabled value="">Choose Manufacturer</flux:select.option>
@foreach ($manufacturers as $manufacturer)
<flux:select.option wire:key="{{ $manufacturer->id }}" value="{{ $manufacturer->id }}">{{ $manufacturer->name }}</flux:select.option>
@endforeach
</flux:select>
<flux:select wire:model="type_id" label="Type">
<flux:select.option disabled value="">Choose Type</flux:select.option>
@foreach ($types as $type)
<flux:select.option wire:key="{{ $type->id }}" value="{{ $type->id }}">{{ $type->name }}</flux:select.option>
@endforeach
</flux:select>
<flux:select wire:model="color_id" label="Color" >
<flux:select.option disabled value="">Choose Color</flux:select.option>
@foreach ($colors as $color)
<flux:select.option wire:key="{{ $color->id }}" value="{{ $color->id }}">{{ $color->name }}</flux:select.option>
@endforeach
</flux:select>
<flux:input label="Finish" wire:model="finish" placeholder="Finish" required />
<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 />
<flux:input label="Stock" wire:model="stock" placeholder="Stock" required />
</div>
<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-lg">
<form wire:submit.prevent="save({{ $editid }})">
<div class="space-y-6">
<div>
<flux:heading size="lg" class="text-nuke-400">Edit 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" />
<div class="grid grid-cols-2 gap-x-4 gap-y-6">
<flux:select wire:model="manufacturer_id" label="Manufacturer">
<flux:select.option disabled value="">Choose Manufacturer</flux:select.option>
@foreach ($manufacturers as $manufacturer)
<flux:select.option wire:key="{{ $manufacturer->id }}" value="{{ $manufacturer->id }}">{{ $manufacturer->name }}</flux:select.option>
@endforeach
</flux:select>
<flux:select wire:model="type_id" label="Type">
<flux:select.option disabled value="">Choose Type</flux:select.option>
@foreach ($types as $type)
<flux:select.option wire:key="{{ $type->id }}" value="{{ $type->id }}">{{ $type->name }}</flux:select.option>
@endforeach
</flux:select>
<flux:select wire:model="color_id" label="Color" >
<flux:select.option disabled value="">Choose Color</flux:select.option>
@foreach ($colors as $color)
<flux:select.option wire:key="{{ $color->id }}" value="{{ $color->id }}">{{ $color->name }}</flux:select.option>
@endforeach
</flux:select>
<flux:input label="Finish" wire:model="finish" placeholder="Finish" required />
<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 />
<flux:input label="Stock" wire:model="stock" placeholder="Stock" required />
</div>
<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-olivine hover:bg-olivine-600">Save</flux:button>
</div>
</div>
</form>
</flux:modal>
@endempty
<!-- Delete Form -->
<flux:modal wire:model.self='deleteModal' name="deleteModal" class="md:w-lg">
<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> </section>
resources/views/livewire/filament/show.blade.php
+67 -74
View File
@@ -1,103 +1,96 @@
<section> <section>
<form wire:submit="save">
<x-header> <x-header>
{{ __('Show Filament - ') . $filament->name }} {{ __('Show Filament') }}
<x-slot name="headerleft">
<flux:button wire:click="back" variant="ghost" icon="arrow-left">Back</flux:button>
</x-slot>
<x-slot name="headerright"> <x-slot name="headerright">
<flux:button variant="primary" icon="plus">Create QR</flux:button> <flux:button wire:click="back" variant="primary" class="bg-transparent shadow-none hover:bg-black/10 hover:cursor-pointer transition-all ease-in-out" icon="arrow-left">Back</flux:button>
<flux:button wire:click="edit({{ $filament->id }})" variant="primary" icon="pencil">Edit</flux:button> <flux:button wire:click="edit({{ $filament->id }})" variant="primary" class="bg-selective text-gray-950 shadow-none hover:bg-selective-600 hover:cursor-pointer transition-all ease-in-out" icon="check">Edit</flux:button>
<flux:button variant="danger" icon="trash">Delete</flux:button>
</x-slot> </x-slot>
</x-header> </x-header>
<div class="container m-auto my-8 bg-jet-800 rounded-lg shadow p-6 text-jet-50"> <div class="container m-auto my-8 bg-elephant-950 border border-elephant-900 rounded-lg shadow p-6 text-gray-50">
<div> <div>
<div class="px-4 sm:px-0"> <div class="px-4 sm:px-0">
<h3 class="text-base/7 font-semibold text-white">Filament Information</h3> <h3 class="text-base/7 font-semibold text-white">Filament Information</h3>
<p class="mt-1 max-w-2xl text-sm/6 text-jet-200">Filament details and QR Code.</p> <p class="mt-1 max-w-2xl text-sm/6 text-gray-200">Filament details.</p>
</div> </div>
<div class="mt-6 border-t border-white/10"> <div class="mt-6 border-t border-white/10">
<dl class="divide-y divide-white/10"> <dl class="divide-y divide-white/10">
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">ID</dt> <dt class="text-sm/6 font-medium text-gray-100">Name</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->id }}</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
{{ $filament->name }}
</dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Name</dt> <dt class="text-sm/6 font-medium text-gray-100">Description</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->name }}</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
{{ $filament->description }}
</dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Color</dt> <dt class="text-sm/6 font-medium text-gray-100">Color</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->color_id }}</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<a href="{{ route('color.show', $filament->color_id) }}" class="flex items-center gap-2 hover:cursor-pointer" wire:navigate>
<div class="w-[20px] h-[20px] rounded" style="background-color: #{{ App\Models\Color::find($filament->color_id)->hex }}"></div>
<div>{{ App\Models\Color::find($filament->color_id)->name }}</div>
<flux:icon name="arrow-right" class="w-4 h-4"></flux:icon>
</a>
</dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Manufacturer</dt> <dt class="text-sm/6 font-medium text-gray-100">Manufacturer</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->manufacturer_id }}</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<a href="{{ route('manufacturer.show', $filament->manufacturer_id) }}" class="flex items-center gap-2 hover:cursor-pointer" wire:navigate>
<div>{{ App\Models\Manufacturer::find($filament->manufacturer_id)->name }}</div>
<flux:icon name="arrow-right" class="w-4 h-4"></flux:icon>
</a>
</dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Filament Type</dt> <dt class="text-sm/6 font-medium text-gray-100">Filament Type</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->filament_type_id }}</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
<a href="{{ route('type.show', $filament->filament_type_id) }}" class="flex items-center gap-2 hover:cursor-pointer" wire:navigate>
<div>{{ App\Models\FilamentType::find($filament->filament_type_id)->name }}</div>
<flux:icon name="arrow-right" class="w-4 h-4"></flux:icon>
</a>
</dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Weight</dt> <dt class="text-sm/6 font-medium text-gray-100">Weight</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->weight }} g</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
{{ $filament->weight }}g
</dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Diameter</dt> <dt class="text-sm/6 font-medium text-gray-100">Diameter</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->diameter }} mm</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
{{ $filament->diameter }}mm
</dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Temperature</dt> <dt class="text-sm/6 font-medium text-gray-100">Price</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->temp_min }} - {{ $filament->temp_max }} °C</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
{{ $filament->price }}€
</dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">BuildPlate</dt> <dt class="text-sm/6 font-medium text-gray-100">Min Temperature</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->buildplate_id }}</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
{{ $filament->temp_min }}°C
</dd>
</div> </div>
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0"> <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0 items-center">
<dt class="text-sm/6 font-medium text-jet-100">Extruder</dt> <dt class="text-sm/6 font-medium text-gray-100">Max Temperature</dt>
<dd class="mt-1 text-sm/6 text-jet-200 sm:col-span-2 sm:mt-0">{{ $filament->extruder_id }}</dd> <dd class="mt-1 text-sm/6 text-gray-200 sm:col-span-2 sm:mt-0">
</div> {{ $filament->temp_max }}°C
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
<dt class="text-sm/6 font-medium text-gray-100">Attachments</dt>
<dd class="mt-2 text-sm text-white sm:col-span-2 sm:mt-0">
<ul role="list" class="divide-y divide-white/5 rounded-md border border-white/10">
<li class="flex items-center justify-between py-4 pr-5 pl-4 text-sm/6">
<div class="flex w-0 flex-1 items-center">
<svg viewBox="0 0 20 20" fill="currentColor" data-slot="icon" aria-hidden="true" class="size-5 shrink-0 text-gray-500">
<path d="M15.621 4.379a3 3 0 0 0-4.242 0l-7 7a3 3 0 0 0 4.241 4.243h.001l.497-.5a.75.75 0 0 1 1.064 1.057l-.498.501-.002.002a4.5 4.5 0 0 1-6.364-6.364l7-7a4.5 4.5 0 0 1 6.368 6.36l-3.455 3.553A2.625 2.625 0 1 1 9.52 9.52l3.45-3.451a.75.75 0 1 1 1.061 1.06l-3.45 3.451a1.125 1.125 0 0 0 1.587 1.595l3.454-3.553a3 3 0 0 0 0-4.242Z" clip-rule="evenodd" fill-rule="evenodd" />
</svg>
<div class="ml-4 flex min-w-0 flex-1 gap-2">
<span class="truncate font-medium text-white">resume_back_end_developer.pdf</span>
<span class="shrink-0 text-gray-500">2.4mb</span>
</div>
</div>
<div class="ml-4 shrink-0">
<a href="#" class="font-medium text-indigo-400 hover:text-indigo-300">Download</a>
</div>
</li>
<li class="flex items-center justify-between py-4 pr-5 pl-4 text-sm/6">
<div class="flex w-0 flex-1 items-center">
<svg viewBox="0 0 20 20" fill="currentColor" data-slot="icon" aria-hidden="true" class="size-5 shrink-0 text-gray-500">
<path d="M15.621 4.379a3 3 0 0 0-4.242 0l-7 7a3 3 0 0 0 4.241 4.243h.001l.497-.5a.75.75 0 0 1 1.064 1.057l-.498.501-.002.002a4.5 4.5 0 0 1-6.364-6.364l7-7a4.5 4.5 0 0 1 6.368 6.36l-3.455 3.553A2.625 2.625 0 1 1 9.52 9.52l3.45-3.451a.75.75 0 1 1 1.061 1.06l-3.45 3.451a1.125 1.125 0 0 0 1.587 1.595l3.454-3.553a3 3 0 0 0 0-4.242Z" clip-rule="evenodd" fill-rule="evenodd" />
</svg>
<div class="ml-4 flex min-w-0 flex-1 gap-2">
<span class="truncate font-medium text-white">coverletter_back_end_developer.pdf</span>
<span class="shrink-0 text-gray-500">4.5mb</span>
</div>
</div>
<div class="ml-4 shrink-0">
<a href="#" class="font-medium text-indigo-400 hover:text-indigo-300">Download</a>
</div>
</li>
</ul>
</dd> </dd>
</div> </div>
</dl> </dl>
</div> </div>
</div> </div>
</div> </div>
</form>
</section> </section>
routes/web.php
+1 -1
View File
@@ -45,7 +45,7 @@ Route::middleware([
// Filaments // Filaments
Route::get('filaments', Filament::class)->name('filaments.index'); Route::get('filaments', Filament::class)->name('filaments.index');
Route::get('filaments/create', Filament::class)->name('filaments.create'); Route::get('filaments/create', \App\Livewire\Filament\CreateFilament::class)->name('filaments.create');
Route::get('filaments/{filament}/edit', \App\Livewire\Filament\EditFilament::class)->name('filaments.edit'); Route::get('filaments/{filament}/edit', \App\Livewire\Filament\EditFilament::class)->name('filaments.edit');
Route::get('filaments/{filament}', \App\Livewire\Filament\ShowFilament::class)->name('filaments.show'); Route::get('filaments/{filament}', \App\Livewire\Filament\ShowFilament::class)->name('filaments.show');