sackey
cbae4564b9
- Implemented dashboard view with vehicle stats, active services, recent activity, and upcoming appointments. - Created estimates view with filtering options and a list of service estimates. - Developed invoices view to manage service invoices and payment history with filtering. - Added vehicles view to display registered vehicles and their details. - Built work orders view to track the progress of vehicle services with filtering and detailed information.
246 lines
13 KiB
PHP
246 lines
13 KiB
PHP
<div class="space-y-6">
|
|
<!-- Header -->
|
|
<div class="flex items-center justify-between">
|
|
<div>
|
|
<flux:heading size="xl">Edit Customer</flux:heading>
|
|
<flux:subheading>Update customer information and manage user account for {{ $customer->full_name }}</flux:subheading>
|
|
</div>
|
|
<div class="flex space-x-2">
|
|
<flux:button href="/customers/{{ $customer->id }}" variant="outline" size="sm">
|
|
<flux:icon name="arrow-left" class="size-4" />
|
|
Back to Customer
|
|
</flux:button>
|
|
@if($has_user_account && $customer->user && $customer->user->isCustomer())
|
|
<flux:badge variant="success" size="sm">Has Portal Access</flux:badge>
|
|
@elseif($has_user_account)
|
|
<flux:badge variant="warning" size="sm">Portal Inactive</flux:badge>
|
|
@else
|
|
<flux:badge variant="outline" size="sm">No Portal Access</flux:badge>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Customer Edit Form -->
|
|
<div class="bg-white dark:bg-zinc-800 rounded-lg border border-zinc-200 dark:border-zinc-700">
|
|
<form wire:submit="updateCustomer" class="p-6 space-y-8">
|
|
<!-- Personal Information -->
|
|
<div>
|
|
<flux:heading size="lg" class="mb-4">Personal Information</flux:heading>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>First Name *</flux:label>
|
|
<flux:input wire:model="first_name" placeholder="Enter first name" />
|
|
<flux:error name="first_name" />
|
|
</flux:field>
|
|
</div>
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Last Name *</flux:label>
|
|
<flux:input wire:model="last_name" placeholder="Enter last name" />
|
|
<flux:error name="last_name" />
|
|
</flux:field>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Contact Information -->
|
|
<div>
|
|
<flux:heading size="lg" class="mb-4">Contact Information</flux:heading>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Email *</flux:label>
|
|
<flux:input wire:model="email" type="email" placeholder="Enter email address" />
|
|
<flux:error name="email" />
|
|
</flux:field>
|
|
</div>
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Phone *</flux:label>
|
|
<flux:input wire:model="phone" placeholder="Enter primary phone number" />
|
|
<flux:error name="phone" />
|
|
</flux:field>
|
|
</div>
|
|
<div class="md:col-span-2">
|
|
<flux:field>
|
|
<flux:label>Secondary Phone</flux:label>
|
|
<flux:input wire:model="secondary_phone" placeholder="Enter secondary phone number (optional)" />
|
|
<flux:error name="secondary_phone" />
|
|
</flux:field>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Address Information -->
|
|
<div>
|
|
<flux:heading size="lg" class="mb-4">Address Information</flux:heading>
|
|
<div class="space-y-4">
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Street Address *</flux:label>
|
|
<flux:input wire:model="address" placeholder="Enter street address" />
|
|
<flux:error name="address" />
|
|
</flux:field>
|
|
</div>
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>City *</flux:label>
|
|
<flux:input wire:model="city" placeholder="Enter city" />
|
|
<flux:error name="city" />
|
|
</flux:field>
|
|
</div>
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>State *</flux:label>
|
|
<flux:input wire:model="state" placeholder="Enter state" />
|
|
<flux:error name="state" />
|
|
</flux:field>
|
|
</div>
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>ZIP Code *</flux:label>
|
|
<flux:input wire:model="zip_code" placeholder="Enter ZIP code" />
|
|
<flux:error name="zip_code" />
|
|
</flux:field>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Additional Information -->
|
|
<div>
|
|
<flux:heading size="lg" class="mb-4">Additional Information</flux:heading>
|
|
<div class="space-y-4">
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Customer Status *</flux:label>
|
|
<div class="mt-1 space-y-2">
|
|
<label class="flex items-center">
|
|
<input type="radio" wire:model="status" value="active" class="text-accent border-zinc-300 dark:border-zinc-600 focus:ring-2 focus:ring-accent" />
|
|
<span class="ml-2 text-sm">Active</span>
|
|
</label>
|
|
<label class="flex items-center">
|
|
<input type="radio" wire:model="status" value="inactive" class="text-accent border-zinc-300 dark:border-zinc-600 focus:ring-2 focus:ring-accent" />
|
|
<span class="ml-2 text-sm">Inactive</span>
|
|
</label>
|
|
</div>
|
|
<flux:error name="status" />
|
|
</flux:field>
|
|
</div>
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>Notes</flux:label>
|
|
<flux:textarea wire:model="notes" placeholder="Add any additional notes about the customer..." rows="4" />
|
|
<flux:error name="notes" />
|
|
</flux:field>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- User Account Management -->
|
|
<div>
|
|
<flux:heading size="lg" class="mb-4">Customer Portal Access</flux:heading>
|
|
|
|
@if($has_user_account)
|
|
<!-- Existing User Account -->
|
|
@if($customer->user && $customer->user->isCustomer())
|
|
<div class="bg-green-50 dark:bg-green-900/20 p-4 rounded-lg border border-green-200 dark:border-green-800">
|
|
<div class="flex items-center mb-4">
|
|
<flux:icon name="check-circle" class="h-5 w-5 text-green-600 mr-2" />
|
|
<span class="font-medium text-green-800 dark:text-green-200">Customer has active portal access</span>
|
|
</div>
|
|
@else
|
|
<div class="bg-yellow-50 dark:bg-yellow-900/20 p-4 rounded-lg border border-yellow-200 dark:border-yellow-800">
|
|
<div class="flex items-center mb-4">
|
|
<flux:icon name="exclamation-triangle" class="h-5 w-5 text-yellow-600 mr-2" />
|
|
<span class="font-medium text-yellow-800 dark:text-yellow-200">Customer portal access is inactive</span>
|
|
</div>
|
|
@endif
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
<div>
|
|
<flux:field>
|
|
<flux:label>User Status</flux:label>
|
|
<select wire:model="user_status" class="w-full rounded-md border border-zinc-300 dark:border-zinc-600 bg-white dark:bg-zinc-800 px-3 py-2 text-sm focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500">
|
|
<option value="active">Active</option>
|
|
<option value="inactive">Inactive</option>
|
|
</select>
|
|
</flux:field>
|
|
</div>
|
|
|
|
<div>
|
|
<flux:field>
|
|
<flux:checkbox wire:model.live="reset_password" />
|
|
<flux:label>Reset password</flux:label>
|
|
<flux:description>Generate new password for customer portal</flux:description>
|
|
</flux:field>
|
|
</div>
|
|
</div>
|
|
|
|
@if($reset_password)
|
|
<div class="mt-4">
|
|
<flux:field>
|
|
<flux:label>New Password</flux:label>
|
|
<div class="flex space-x-2">
|
|
<flux:input wire:model="new_password" type="text" placeholder="Generated password" class="flex-1" />
|
|
<flux:button type="button" wire:click="generatePassword" variant="outline" size="sm">
|
|
Generate
|
|
</flux:button>
|
|
</div>
|
|
<flux:error name="new_password" />
|
|
<flux:description>Customer will need to use this password to login</flux:description>
|
|
</flux:field>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
@else
|
|
<!-- No User Account -->
|
|
<div class="bg-yellow-50 dark:bg-yellow-900/20 p-4 rounded-lg border border-yellow-200 dark:border-yellow-800">
|
|
<div class="flex items-center mb-4">
|
|
<flux:icon name="exclamation-triangle" class="h-5 w-5 text-yellow-600 mr-2" />
|
|
<span class="font-medium text-yellow-800 dark:text-yellow-200">Customer has no portal access</span>
|
|
</div>
|
|
|
|
<div>
|
|
<flux:field>
|
|
<flux:checkbox wire:model.live="create_user_account" />
|
|
<flux:label>Create customer portal account</flux:label>
|
|
<flux:description>Allow this customer to login and access their portal</flux:description>
|
|
</flux:field>
|
|
</div>
|
|
|
|
@if($create_user_account)
|
|
<div class="mt-4">
|
|
<flux:field>
|
|
<flux:label>Password</flux:label>
|
|
<div class="flex space-x-2">
|
|
<flux:input wire:model="new_password" type="text" placeholder="Generated password" class="flex-1" />
|
|
<flux:button type="button" wire:click="generatePassword" variant="outline" size="sm">
|
|
Generate
|
|
</flux:button>
|
|
</div>
|
|
<flux:error name="new_password" />
|
|
<flux:description>Customer will receive this password to access their portal</flux:description>
|
|
</flux:field>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
<!-- Form Actions -->
|
|
<div class="flex items-center justify-between pt-6 border-t border-zinc-200 dark:border-zinc-700">
|
|
<flux:button href="/customers/{{ $customer->id }}" variant="outline">
|
|
Cancel
|
|
</flux:button>
|
|
<flux:button type="submit" variant="primary">
|
|
<flux:icon name="check" class="size-4" />
|
|
Update Customer
|
|
</flux:button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|