Add Filaments module with Seeder, update Calculator UI for filament selection, and upgrade dependencies for Livewire Flux
This commit is contained in:
@@ -3,15 +3,165 @@
|
||||
{{ __('Calculator') }}
|
||||
|
||||
<x-slot name="headerleft">
|
||||
<flux:select wire:model.live="calculationpreset" placeholder="Select a preset">
|
||||
@foreach ( \App\Models\Calculationpreset::all() as $preset)
|
||||
<flux:select wire:model.live="selection" placeholder="Select a preset">
|
||||
@foreach ( $presets as $preset)
|
||||
<flux:select.option value="{{ $preset->id }}">{{ $preset->name }}</flux:select.option>
|
||||
@endforeach
|
||||
</flux:select>
|
||||
</x-slot>
|
||||
</x-header>
|
||||
|
||||
<div class="container m-auto my-8 bg-elephant border border-elephant-900 rounded-lg shadow p-6 text-gray-50">
|
||||
{{ $preset->name }} : {{ $preset->price_kwh }}€
|
||||
</div>
|
||||
@if($calculationpreset)
|
||||
<div class="container m-auto">
|
||||
<div class="grid grid-cols-3 gap-4">
|
||||
<div class="container m-auto my-8 bg-elephant border border-elephant-900 rounded-lg shadow p-6 text-gray-50 col-span-2">
|
||||
<div class="pr-4 flex flex-col gap-4">
|
||||
<div class="border-b border-elephant-900 pb-4">
|
||||
<flux:heading>Inputs</flux:heading>
|
||||
<flux:text class="mt-2">Enter your calculation data.</flux:text>
|
||||
</div>
|
||||
<div class="flex gap-2 pb-4 border-b border-elephant-900">
|
||||
|
||||
<flux:field>
|
||||
<flux:label>Time</flux:label>
|
||||
<flux:input.group>
|
||||
<flux:input wire:model.live.debounce="time" type="number"/>
|
||||
<flux:select class="max-w-fit" wire:model.lazy="timeunit">
|
||||
<flux:select.option selected>h</flux:select.option>
|
||||
<flux:select.option>min</flux:select.option>
|
||||
</flux:select>
|
||||
</flux:input.group>
|
||||
</flux:field>
|
||||
</div>
|
||||
<div class="flex gap-2 pb-4 border-b border-elephant-900 flex-col">
|
||||
<div>
|
||||
<flux:heading>Count on Plate</flux:heading>
|
||||
<flux:text class="mt-2">More Objects per Plate?</flux:text>
|
||||
</div>
|
||||
<div>
|
||||
<flux:input.group class="flex gap-2">
|
||||
<flux:label>Enable</flux:label>
|
||||
<flux:checkbox wire:model.lazy="selcountonplate" />
|
||||
</flux:input.group>
|
||||
</div>
|
||||
@if($selcountonplate)
|
||||
<div class="flex gap-2 flex-col px-8">
|
||||
<flux:field>
|
||||
<flux:label>Count on Plate</flux:label>
|
||||
<flux:input wire:model.lazy="countonplate" type="number"/>
|
||||
</flux:field>
|
||||
|
||||
<flux:field>
|
||||
<flux:label>Additional Cost</flux:label>
|
||||
<flux:input.group>
|
||||
<flux:input wire:model.live.debounce="additionalcost" type="number"/>
|
||||
<flux:select class="max-w-fit" wire:model.lazy="additionalcostunit">
|
||||
<flux:select.option selected>per Piece</flux:select.option>
|
||||
<flux:select.option>per Plate</flux:select.option>
|
||||
</flux:select>
|
||||
</flux:input.group>
|
||||
</flux:field>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
<div>
|
||||
<flux:heading>Filament Selection</flux:heading>
|
||||
<flux:text class="my-2">Filter by manufacturer, filament type and color.</flux:text>
|
||||
|
||||
<div class="my-2">
|
||||
<flux:table>
|
||||
<flux:table.columns>
|
||||
<flux:table.column> Select </flux:table.column>
|
||||
<flux:table.column> Type </flux:table.column>
|
||||
<flux:table.column> Manufacturer </flux:table.column>
|
||||
<flux:table.column> Name </flux:table.column>
|
||||
<flux:table.column> Color </flux:table.column>
|
||||
<flux:table.column> Amount (g) </flux:table.column>
|
||||
</flux:table.columns>
|
||||
|
||||
<flux:table.rows class="bg-black/50">
|
||||
<flux:table.row>
|
||||
<flux:table.cell class="w-5"></flux:table.cell>
|
||||
<flux:table.cell>
|
||||
<flux:input wire:model.live="search_type" placeholder="Type" />
|
||||
</flux:table.cell>
|
||||
<flux:table.cell>
|
||||
<flux:input wire:model.live.debounce="search_manufacturer" placeholder="Manufacturer" />
|
||||
</flux:table.cell>
|
||||
<flux:table.cell>
|
||||
<flux:input wire:model.live.debounce="search_name" placeholder="Name" />
|
||||
</flux:table.cell>
|
||||
<flux:table.cell>
|
||||
<flux:input wire:model.live.debounce="search_color" placeholder="Color" />
|
||||
</flux:table.cell>
|
||||
<flux:table.cell></flux:table.cell>
|
||||
</flux:table.row>
|
||||
@foreach ($filaments as $filament)
|
||||
<flux:table.row :key="$filament->id" :class="isset($selectedFilaments[$filament->id]) ? 'bg-elephant-900' : ''">
|
||||
<flux:table.cell class="w-5">
|
||||
<flux:checkbox wire:click="toggleFilament({{ $filament->id }})" :checked="isset($selectedFilaments[$filament->id])" />
|
||||
</flux:table.cell>
|
||||
<flux:table.cell>{{ $filament->type?->name ?? 'N/A' }}</flux:table.cell>
|
||||
<flux:table.cell>{{ $filament->manufacturer?->name ?? 'N/A' }}</flux:table.cell>
|
||||
<flux:table.cell>{{ $filament->name }}</flux:table.cell>
|
||||
<flux:table.cell>
|
||||
<div class="flex items-center gap-2">
|
||||
<div class="w-4 h-4 rounded-full border border-gray-500" style="background-color: {{ '#' . $filament->color->hex ?? 'transparent' }}"></div>
|
||||
{{ $filament->color?->name ?? 'N/A' }}
|
||||
</div>
|
||||
</flux:table.cell>
|
||||
<flux:table.cell class="w-7">
|
||||
@if(isset($selectedFilaments[$filament->id]))
|
||||
<flux:input type="number" wire:model.live="selectedFilaments.{{ $filament->id }}"/>
|
||||
@endif
|
||||
</flux:table.cell>
|
||||
</flux:table.row>
|
||||
@endforeach
|
||||
</flux:table.rows>
|
||||
</flux:table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container m-auto my-8 bg-gold-drop-800 border border-gold-drop-600 rounded-lg shadow p-6 text-gray-50">
|
||||
<div>
|
||||
<div class="border-b border-gold-drop-600 pb-4">
|
||||
<flux:heading>Outputs</flux:heading>
|
||||
<flux:text class="mt-2">Get your ready for use Prices.</flux:text>
|
||||
</div>
|
||||
@php
|
||||
$totalFilamentCost = 0;
|
||||
foreach ($selectedFilaments as $id => $amount) {
|
||||
$f = $filaments->firstWhere('id', $id);
|
||||
if ($f && $f->price && $f->weight) {
|
||||
$totalFilamentCost += ($f->price / $f->weight) * $amount;
|
||||
}
|
||||
}
|
||||
$energyCost = ($calculationpreset->price_kwh ?? 0) * 0.25 * ($timeunit == 'h' ? $time : $time / 60);
|
||||
$printerCost = ($calculationpreset->factor_printer ?? 0) * ($timeunit == 'h' ? $time : $time / 60);
|
||||
$maintenanceCost = ($calculationpreset->factor_maintenance ?? 0) * ($timeunit == 'h' ? $time : $time / 60);
|
||||
$totalCost = $totalFilamentCost + $energyCost + $printerCost + $maintenanceCost + ($additionalcostunit == 'per Piece' ? $additionalcost : $additionalcost / max(1, $countonplate ?? 1));
|
||||
@endphp
|
||||
<div class="mt-4 space-y-2">
|
||||
<p>Time: {{ $time }}{{ $timeunit }}</p>
|
||||
<p>Filament Cost: {{ number_format($totalFilamentCost, 2) }}€</p>
|
||||
<p>Energy Cost: {{ number_format($energyCost, 2) }}€</p>
|
||||
<p>Printer Cost: {{ number_format($printerCost, 2) }}€</p>
|
||||
<p>Maintenance Cost: {{ number_format($maintenanceCost, 2) }}€</p>
|
||||
|
||||
@if($countonplate > 0 )
|
||||
<div class="border-t border-gold-drop-600 flex flex-col gap-2 py-4">
|
||||
<p>Additional Cost: {{ $additionalcost }}€ ({{ $additionalcostunit }})</p>
|
||||
<flux:heading size="lg">Per Item Cost: {{ number_format($totalCost / $countonplate, 2) }}€ | {{ number_format(($totalCost * ($calculationpreset->factor_price / 100)/ $countonplate), 2) }}€</flux:heading>
|
||||
</div>
|
||||
@endif
|
||||
<div class="border-t border-gold-drop-600 flex flex-col gap-2 py-4">
|
||||
<flux:heading size="lg" >Total Cost: {{ number_format($totalCost, 2) }}€ | {{ number_format($totalCost * ($calculationpreset->factor_price / 100), 2) }}€</flux:heading>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user