sackey
5403c3591d
- Added buttons for assigning diagnosis and starting diagnosis based on job card status in the job card view. - Implemented a modal for assigning technicians for diagnosis, including form validation and technician selection. - Updated routes to include a test route for job cards. - Created a new Blade view for testing inspection inputs. - Developed comprehensive feature tests for the estimate module, including creation, viewing, editing, and validation of estimates. - Added tests for estimate model relationships and statistics calculations. - Introduced a basic feature test for job cards index.
341 lines
20 KiB
PHP
341 lines
20 KiB
PHP
<div class="space-y-6">
|
|
<!-- Header -->
|
|
<div class="bg-gradient-to-r from-accent/10 to-accent/5 rounded-xl p-6 border border-accent/20 dark:border-accent/30">
|
|
<div class="flex flex-col lg:flex-row lg:items-center lg:justify-between">
|
|
<div>
|
|
<h1 class="text-3xl font-bold text-gray-900 dark:text-gray-100 mb-2">Create New Estimate</h1>
|
|
<p class="text-gray-600 dark:text-gray-400">Create a standalone estimate for parts sales or services</p>
|
|
</div>
|
|
<div class="flex space-x-3 mt-4 lg:mt-0">
|
|
<a href="{{ route('estimates.index') }}" class="inline-flex items-center px-4 py-2 border border-gray-300 dark:border-gray-600 rounded-lg text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors">
|
|
<svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path>
|
|
</svg>
|
|
Back to Estimates
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Customer and Vehicle Selection -->
|
|
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6">
|
|
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">Customer & Vehicle Information</h3>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Customer</flux:label>
|
|
<flux:select wire:model.live="customerId" placeholder="Select a customer...">
|
|
<option value="">Select a customer...</option>
|
|
@foreach($customers as $customer)
|
|
<option value="{{ $customer->id }}">{{ $customer->name }} - {{ $customer->email }}</option>
|
|
@endforeach
|
|
</flux:select>
|
|
<flux:error name="customerId" />
|
|
</flux:field>
|
|
|
|
@if($selectedCustomer)
|
|
<div class="mt-2 p-3 bg-blue-50 dark:bg-blue-900/30 rounded-lg">
|
|
<div class="text-sm text-blue-800 dark:text-blue-200">
|
|
<p><strong>{{ $selectedCustomer->name }}</strong></p>
|
|
<p>{{ $selectedCustomer->email }}</p>
|
|
<p>{{ $selectedCustomer->phone }}</p>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Vehicle</flux:label>
|
|
<flux:select wire:model.live="vehicleId" placeholder="Select a vehicle..." :disabled="!$customerId">
|
|
<option value="">Select a vehicle...</option>
|
|
@foreach($customerVehicles as $vehicle)
|
|
<option value="{{ $vehicle->id }}">
|
|
{{ $vehicle->year }} {{ $vehicle->make }} {{ $vehicle->model }} - {{ $vehicle->license_plate }}
|
|
</option>
|
|
@endforeach
|
|
</flux:select>
|
|
<flux:error name="vehicleId" />
|
|
</flux:field>
|
|
|
|
@if($selectedVehicle)
|
|
<div class="mt-2 p-3 bg-green-50 dark:bg-green-900/30 rounded-lg">
|
|
<div class="text-sm text-green-800 dark:text-green-200">
|
|
<p><strong>{{ $selectedVehicle->year }} {{ $selectedVehicle->make }} {{ $selectedVehicle->model }}</strong></p>
|
|
<p>License Plate: {{ $selectedVehicle->license_plate }}</p>
|
|
<p>VIN: {{ $selectedVehicle->vin }}</p>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Line Items -->
|
|
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6">
|
|
<div class="flex items-center justify-between mb-4">
|
|
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100">Line Items</h3>
|
|
<button wire:click="addLineItem" type="button" class="inline-flex items-center px-3 py-2 bg-accent hover:bg-accent-content text-accent-foreground text-sm font-medium rounded-lg transition-colors">
|
|
<svg class="w-4 h-4 mr-2" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd" d="M10 3a1 1 0 011 1v5h5a1 1 0 110 2h-5v5a1 1 0 11-2 0v-5H4a1 1 0 110-2h5V4a1 1 0 011-1z" clip-rule="evenodd"></path>
|
|
</svg>
|
|
Add Item
|
|
</button>
|
|
</div>
|
|
|
|
<div class="space-y-4">
|
|
@foreach($lineItems as $index => $item)
|
|
<div class="grid grid-cols-12 gap-4 p-4 bg-gray-50 dark:bg-gray-700 rounded-lg" wire:key="item-{{ $index }}">
|
|
<div class="col-span-2">
|
|
<flux:field>
|
|
<flux:label>Type</flux:label>
|
|
<flux:select wire:model.live="lineItems.{{ $index }}.type">
|
|
<option value="parts">Parts</option>
|
|
<option value="labour">Labour</option>
|
|
<option value="miscellaneous">Miscellaneous</option>
|
|
</flux:select>
|
|
</flux:field>
|
|
</div>
|
|
|
|
<div class="col-span-4">
|
|
@if($item['type'] === 'parts')
|
|
<flux:field>
|
|
<flux:label>Parts Search</flux:label>
|
|
<div class="relative">
|
|
@if(!empty($item['part_id']))
|
|
<!-- Selected Part Display -->
|
|
<div class="flex items-center justify-between p-2 bg-green-50 dark:bg-green-900/30 border border-green-200 dark:border-green-700 rounded-lg">
|
|
<div class="flex-1">
|
|
<div class="text-sm font-medium text-green-800 dark:text-green-200">
|
|
{{ $item['part_number'] }} - {{ $item['description'] }}
|
|
</div>
|
|
@if(isset($item['stock_available']))
|
|
<div class="text-xs text-green-600 dark:text-green-300">
|
|
Stock: {{ $item['stock_available'] }} available
|
|
</div>
|
|
@endif
|
|
</div>
|
|
<button wire:click="clearPartSelection({{ $index }})" type="button" class="text-green-600 hover:text-green-800 dark:text-green-400 dark:hover:text-green-300">
|
|
<svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
@else
|
|
<!-- Parts Search Input -->
|
|
<flux:input
|
|
wire:model.live.debounce.300ms="partSearch"
|
|
wire:keyup="searchParts($event.target.value)"
|
|
placeholder="Search parts by name, part number, or description..."
|
|
autocomplete="off"
|
|
/>
|
|
|
|
@if($showPartsDropdown && count($availableParts) > 0)
|
|
<div class="absolute z-50 w-full mt-1 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-lg shadow-lg max-h-60 overflow-y-auto">
|
|
@foreach($availableParts as $part)
|
|
<button
|
|
wire:click="selectPart({{ $index }}, {{ $part->id }})"
|
|
type="button"
|
|
class="w-full px-4 py-3 text-left hover:bg-gray-100 dark:hover:bg-gray-700 border-b border-gray-200 dark:border-gray-600 last:border-b-0"
|
|
>
|
|
<div class="flex justify-between items-start">
|
|
<div class="flex-1">
|
|
<div class="font-medium text-gray-900 dark:text-gray-100">
|
|
{{ $part->part_number }} - {{ $part->name }}
|
|
</div>
|
|
<div class="text-sm text-gray-600 dark:text-gray-400">
|
|
{{ $part->description }}
|
|
</div>
|
|
<div class="text-xs text-gray-500 dark:text-gray-500 mt-1">
|
|
Stock: {{ $part->quantity_on_hand }} | Price: ${{ number_format($part->sell_price, 2) }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</button>
|
|
@endforeach
|
|
</div>
|
|
@elseif($showPartsDropdown && strlen($partSearch) >= 2)
|
|
<div class="absolute z-50 w-full mt-1 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-lg shadow-lg p-4">
|
|
<div class="text-gray-500 dark:text-gray-400 text-sm">
|
|
No parts found matching "{{ $partSearch }}"
|
|
</div>
|
|
</div>
|
|
@endif
|
|
@endif
|
|
</div>
|
|
</flux:field>
|
|
@else
|
|
<flux:field>
|
|
<flux:label>Description</flux:label>
|
|
<flux:input wire:model.live="lineItems.{{ $index }}.description" placeholder="Item description..." />
|
|
</flux:field>
|
|
@endif
|
|
</div>
|
|
|
|
<div class="col-span-2">
|
|
<flux:field>
|
|
<flux:label>Quantity</flux:label>
|
|
<flux:input
|
|
wire:model.live="lineItems.{{ $index }}.quantity"
|
|
type="number"
|
|
step="0.01"
|
|
min="0.01"
|
|
@if($item['type'] === 'parts' && isset($item['stock_available']))
|
|
max="{{ $item['stock_available'] }}"
|
|
@endif
|
|
/>
|
|
@if($item['type'] === 'parts' && isset($item['stock_available']))
|
|
<div class="text-xs text-gray-500 dark:text-gray-400 mt-1">
|
|
@if($item['stock_available'] <= 5)
|
|
<span class="text-red-600 dark:text-red-400">⚠️ Low stock: {{ $item['stock_available'] }} available</span>
|
|
@else
|
|
<span class="text-green-600 dark:text-green-400">✓ {{ $item['stock_available'] }} available</span>
|
|
@endif
|
|
</div>
|
|
@endif
|
|
</flux:field>
|
|
</div>
|
|
|
|
<div class="col-span-2">
|
|
<flux:field>
|
|
<flux:label>Unit Price</flux:label>
|
|
<flux:input wire:model.live="lineItems.{{ $index }}.unit_price" type="number" step="0.01" min="0" />
|
|
</flux:field>
|
|
</div>
|
|
|
|
<div class="col-span-1 flex items-end">
|
|
<div class="text-sm font-medium text-gray-900 dark:text-gray-100 mb-2">
|
|
${{ number_format($item['subtotal'] ?? 0, 2) }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-span-1 flex items-end">
|
|
@if(count($lineItems) > 1)
|
|
<button wire:click="removeLineItem({{ $index }})" type="button" class="text-red-600 hover:text-red-800 dark:text-red-400 dark:hover:text-red-300 mb-2">
|
|
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path>
|
|
</svg>
|
|
</button>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
|
|
@error("lineItems.{$index}.type")
|
|
<p class="text-red-600 text-sm">{{ $message }}</p>
|
|
@enderror
|
|
@error("lineItems.{$index}.description")
|
|
<p class="text-red-600 text-sm">{{ $message }}</p>
|
|
@enderror
|
|
@error("lineItems.{$index}.quantity")
|
|
<p class="text-red-600 text-sm">{{ $message }}</p>
|
|
@enderror
|
|
@error("lineItems.{$index}.unit_price")
|
|
<p class="text-red-600 text-sm">{{ $message }}</p>
|
|
@enderror
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Estimate Details & Totals -->
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
|
<!-- Estimate Details -->
|
|
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6">
|
|
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">Estimate Details</h3>
|
|
|
|
<div class="space-y-4">
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Validity Period (Days)</flux:label>
|
|
<flux:input wire:model.live="validity_period_days" type="number" min="1" max="365" />
|
|
<flux:error name="validity_period_days" />
|
|
</flux:field>
|
|
</div>
|
|
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Tax Rate (%)</flux:label>
|
|
<flux:input wire:model.live="tax_rate" type="number" step="0.01" min="0" max="50" />
|
|
<flux:error name="tax_rate" />
|
|
</flux:field>
|
|
</div>
|
|
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Discount Amount ($)</flux:label>
|
|
<flux:input wire:model.live="discount_amount" type="number" step="0.01" min="0" />
|
|
<flux:error name="discount_amount" />
|
|
</flux:field>
|
|
</div>
|
|
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Customer Notes</flux:label>
|
|
<flux:textarea wire:model="notes" placeholder="Notes visible to customer..." rows="3" />
|
|
</flux:field>
|
|
</div>
|
|
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Internal Notes</flux:label>
|
|
<flux:textarea wire:model="internal_notes" placeholder="Internal notes (not visible to customer)..." rows="3" />
|
|
</flux:field>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Totals -->
|
|
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6">
|
|
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">Totals</h3>
|
|
|
|
<div class="space-y-3">
|
|
<div class="flex justify-between text-sm">
|
|
<span class="text-gray-600 dark:text-gray-400">Subtotal:</span>
|
|
<span class="font-medium text-gray-900 dark:text-gray-100">${{ number_format($subtotal, 2) }}</span>
|
|
</div>
|
|
|
|
@if($discount_amount > 0)
|
|
<div class="flex justify-between text-sm">
|
|
<span class="text-gray-600 dark:text-gray-400">Discount:</span>
|
|
<span class="font-medium text-red-600">-${{ number_format($discount_amount, 2) }}</span>
|
|
</div>
|
|
@endif
|
|
|
|
<div class="flex justify-between text-sm">
|
|
<span class="text-gray-600 dark:text-gray-400">Tax ({{ $tax_rate }}%):</span>
|
|
<span class="font-medium text-gray-900 dark:text-gray-100">${{ number_format($tax_amount, 2) }}</span>
|
|
</div>
|
|
|
|
<div class="border-t border-gray-200 dark:border-gray-600 pt-3">
|
|
<div class="flex justify-between">
|
|
<span class="text-lg font-semibold text-gray-900 dark:text-gray-100">Total:</span>
|
|
<span class="text-lg font-bold text-accent">${{ number_format($total_amount, 2) }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Terms and Conditions -->
|
|
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6">
|
|
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">Terms and Conditions</h3>
|
|
<flux:field>
|
|
<flux:textarea wire:model="terms_and_conditions" rows="4" placeholder="Enter terms and conditions..." />
|
|
<flux:error name="terms_and_conditions" />
|
|
</flux:field>
|
|
</div>
|
|
|
|
<!-- Action Buttons -->
|
|
<div class="flex justify-end space-x-4">
|
|
<a href="{{ route('estimates.index') }}" class="inline-flex items-center px-6 py-3 border border-gray-300 dark:border-gray-600 rounded-lg text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors">
|
|
Cancel
|
|
</a>
|
|
<button wire:click="save" type="button" class="inline-flex items-center px-6 py-3 bg-accent hover:bg-accent-content text-accent-foreground font-medium rounded-lg transition-colors">
|
|
<svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
Create Estimate
|
|
</button>
|
|
</div>
|
|
</div>
|