@extends('layouts.admin')
@section('title', 'Edit Customer')
@section('page-title', 'Edit Customer')
@section('content')
<div class="max-w-3xl">
    <form action="{{ route('customers.update', $customer) }}" method="POST" class="space-y-6 rounded-xl border border-slate-200 bg-white p-6 shadow-sm">
        @csrf
        @method('PUT')
        <p class="text-sm text-slate-500">Customer code: <strong>{{ $customer->customer_code }}</strong></p>
        <div class="grid gap-6 sm:grid-cols-2">
            <div class="sm:col-span-2">
                <label for="full_name" class="block text-sm font-medium text-slate-700">Full name *</label>
                <input type="text" name="full_name" id="full_name" value="{{ old('full_name', $customer->full_name) }}" required class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
                @error('full_name')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
            </div>
            <div>
                <label for="mobile" class="block text-sm font-medium text-slate-700">Mobile</label>
                <input type="text" name="mobile" id="mobile" value="{{ old('mobile', $customer->mobile) }}" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
            </div>
            <div>
                <label for="alternate_mobile" class="block text-sm font-medium text-slate-700">Alternate mobile</label>
                <input type="text" name="alternate_mobile" id="alternate_mobile" value="{{ old('alternate_mobile', $customer->alternate_mobile) }}" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
            </div>
            <div>
                <label for="whatsapp_number" class="block text-sm font-medium text-slate-700">WhatsApp number</label>
                <input type="text" name="whatsapp_number" id="whatsapp_number" value="{{ old('whatsapp_number', $customer->whatsapp_number) }}" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
            </div>
            <div>
                <label for="email" class="block text-sm font-medium text-slate-700">Email</label>
                <input type="email" name="email" id="email" value="{{ old('email', $customer->email) }}" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
            </div>
            <div>
                <label for="gender" class="block text-sm font-medium text-slate-700">Gender</label>
                <select name="gender" id="gender" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
                    <option value="">Select</option>
                    <option value="male" {{ old('gender', $customer->gender) === 'male' ? 'selected' : '' }}>Male</option>
                    <option value="female" {{ old('gender', $customer->gender) === 'female' ? 'selected' : '' }}>Female</option>
                    <option value="other" {{ old('gender', $customer->gender) === 'other' ? 'selected' : '' }}>Other</option>
                </select>
            </div>
            <div>
                <label for="date_of_birth" class="block text-sm font-medium text-slate-700">Date of birth</label>
                <input type="date" name="date_of_birth" id="date_of_birth" value="{{ old('date_of_birth', $customer->date_of_birth?->format('Y-m-d')) }}" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
            </div>
            <div>
                <label for="anniversary_date" class="block text-sm font-medium text-slate-700">Anniversary date</label>
                <input type="date" name="anniversary_date" id="anniversary_date" value="{{ old('anniversary_date', $customer->anniversary_date?->format('Y-m-d')) }}" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
            </div>
            <div class="sm:col-span-2">
                <label for="address" class="block text-sm font-medium text-slate-700">Address</label>
                <textarea name="address" id="address" rows="2" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">{{ old('address', $customer->address) }}</textarea>
            </div>
            <div>
                <label for="city" class="block text-sm font-medium text-slate-700">City</label>
                <input type="text" name="city" id="city" value="{{ old('city', $customer->city) }}" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
            </div>
            <div>
                <label for="area" class="block text-sm font-medium text-slate-700">Area</label>
                <input type="text" name="area" id="area" value="{{ old('area', $customer->area) }}" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
            </div>
            <div>
                <label for="preferred_branch_id" class="block text-sm font-medium text-slate-700">Preferred branch</label>
                <select name="preferred_branch_id" id="preferred_branch_id" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
                    <option value="">None</option>
                    @foreach($branches as $b)<option value="{{ $b->id }}" {{ old('preferred_branch_id', $customer->preferred_branch_id) == $b->id ? 'selected' : '' }}>{{ $b->name }}</option>@endforeach
                </select>
            </div>
            <div>
                <label for="preferred_communication_method" class="block text-sm font-medium text-slate-700">Preferred communication</label>
                <select name="preferred_communication_method" id="preferred_communication_method" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
                    <option value="">None</option>
                    <option value="phone" {{ old('preferred_communication_method', $customer->preferred_communication_method) === 'phone' ? 'selected' : '' }}>Phone</option>
                    <option value="whatsapp" {{ old('preferred_communication_method', $customer->preferred_communication_method) === 'whatsapp' ? 'selected' : '' }}>WhatsApp</option>
                    <option value="email" {{ old('preferred_communication_method', $customer->preferred_communication_method) === 'email' ? 'selected' : '' }}>Email</option>
                    <option value="sms" {{ old('preferred_communication_method', $customer->preferred_communication_method) === 'sms' ? 'selected' : '' }}>SMS</option>
                </select>
            </div>
            <div>
                <label for="status" class="block text-sm font-medium text-slate-700">Status</label>
                <select name="status" id="status" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
                    <option value="active" {{ old('status', $customer->status) === 'active' ? 'selected' : '' }}>Active</option>
                    <option value="inactive" {{ old('status', $customer->status) === 'inactive' ? 'selected' : '' }}>Inactive</option>
                </select>
            </div>
            <div class="sm:col-span-2">
                <label for="notes" class="block text-sm font-medium text-slate-700">Notes</label>
                <textarea name="notes" id="notes" rows="2" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">{{ old('notes', $customer->notes) }}</textarea>
            </div>
            <div class="sm:col-span-2">
                <label for="remarks" class="block text-sm font-medium text-slate-700">Remarks</label>
                <textarea name="remarks" id="remarks" rows="2" class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">{{ old('remarks', $customer->remarks) }}</textarea>
            </div>
        </div>
        <div class="flex gap-3">
            <button type="submit" class="rounded-lg bg-slate-800 px-4 py-2 text-sm font-medium text-white hover:bg-slate-700">Update Customer</button>
            <a href="{{ route('customers.show', $customer) }}" class="rounded-lg border border-slate-300 bg-white px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">Cancel</a>
        </div>
    </form>
</div>
@endsection