@extends('layouts.app')
@section('title', 'New Job')
@section('breadcrumb')<a href="{{ route('jobs.index') }}" class="hover:text-white">Jobs</a> <i class="fas fa-chevron-right text-xs mx-1 text-slate-600"></i> <span class="text-white">New Job</span>@endsection

@section('content')
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
    <div class="lg:col-span-2">
        <form method="POST" action="{{ route('jobs.store') }}" class="space-y-6">
            @csrf
            <div class="card p-5">
                <h3 class="mb-4 flex items-center gap-2"><i class="fas fa-briefcase text-blue-400"></i> Job Information</h3>
                <div class="grid grid-cols-2 gap-4">
                    <div>
                        <label>Client *</label>
                        <select name="contact_id" class="input" required>
                            <option value="">Select client</option>
                            @foreach($contacts as $contact)
                            <option value="{{ $contact->id }}" {{ old('contact_id') == $contact->id ? 'selected' : '' }}>{{ $contact->full_name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div>
                        <label>Stage *</label>
                        <select name="stage" class="input" required>
                            @foreach(['lead'=>'Lead','consult'=>'Consultation','sold'=>'Sold','contracts'=>'Contracts','cm'=>'Check Measure','processing'=>'Processing','delivery'=>'Delivery','installation'=>'Installation','completion'=>'Completion'] as $val => $label)
                            <option value="{{ $val }}" {{ old('stage', 'sold') === $val ? 'selected' : '' }}>{{ $label }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div>
                        <label>Status *</label>
                        <select name="status" class="input" required>
                            <option value="active">Active</option>
                            <option value="on_hold">On Hold</option>
                        </select>
                    </div>
                    <div>
                        <label>Priority *</label>
                        <select name="priority" class="input" required>
                            <option value="low">Low</option>
                            <option value="medium" selected>Medium</option>
                            <option value="high">High</option>
                        </select>
                    </div>
                    <div>
                        <label>Sales Consultant</label>
                        <select name="consultant_id" class="input">
                            <option value="">Select consultant</option>
                            @foreach($consultants as $user)
                            <option value="{{ $user->id }}" {{ old('consultant_id') == $user->id ? 'selected' : '' }}>{{ $user->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div>
                        <label>Project Manager</label>
                        <select name="manager_id" class="input">
                            <option value="">Select PM</option>
                            @foreach($projectManagers as $user)
                            <option value="{{ $user->id }}" {{ old('manager_id') == $user->id ? 'selected' : '' }}>{{ $user->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div>
                        <label>Designer</label>
                        <select name="designer_id" class="input">
                            <option value="">— Select Designer —</option>
                            @foreach($designers as $user)
                            <option value="{{ $user->id }}" {{ old('designer_id') == $user->id ? 'selected' : '' }}>{{ $user->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div>
                        <label>Project Type</label>
                        <select name="project_type" class="input">
                            <option value="">Select type</option>
                            <option value="kitchen">Kitchen</option>
                            <option value="bathroom">Bathroom</option>
                            <option value="laundry">Laundry</option>
                            <option value="wardrobe">Wardrobe</option>
                            <option value="other">Other</option>
                        </select>
                    </div>
                    <div>
                        <label>Design Style</label>
                        <input type="text" name="design_style" value="{{ old('design_style') }}" class="input" placeholder="e.g. Contemporary">
                    </div>
                    <div>
                        <label>Job Value ($)</label>
                        <input type="number" name="job_value" value="{{ old('job_value') }}" class="input" step="0.01" placeholder="0.00">
                    </div>
                    <div>
                        <label>Sale Date</label>
                        <input type="date" name="sale_date" value="{{ old('sale_date', date('Y-m-d')) }}" class="input">
                    </div>
                    <div>
                        <label>Expected Completion</label>
                        <input type="date" name="expected_completion" value="{{ old('expected_completion') }}" class="input">
                    </div>
                    <div>
                        <label>Source</label>
                        <select name="source" class="input">
                            <option value="">Select source</option>
                            @foreach(['Website', 'Referral', 'Social Media', 'Walk-in', 'Exhibition', 'Google Ads', 'Other'] as $source)
                            <option value="{{ $source }}">{{ $source }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>

            <div class="card p-5">
                <h3 class="mb-4 flex items-center gap-2"><i class="fas fa-map-marker-alt text-blue-400"></i> Site Address</h3>
                <div class="grid grid-cols-2 gap-4">
                    <div class="col-span-2">
                        <label>Street Address</label>
                        <input type="text" name="site_address" value="{{ old('site_address') }}" class="input">
                    </div>
                    <div>
                        <label>Suburb</label>
                        <input type="text" name="site_suburb" value="{{ old('site_suburb') }}" class="input">
                    </div>
                    <div>
                        <label>State</label>
                        <!-- <select name="site_state" class="input">
                            @foreach(['NSW','VIC','QLD','WA','SA','TAS','ACT','NT'] as $state)
                            <option value="{{ $state }}">{{ $state }}</option>
                            @endforeach
                        </select> -->
                        <input type="text" name="site_state" value="{{ old('site_state') }}" class="input" placeholder="State">
                    </div>
                    <div>
                        <label>Postcode</label>
                        <input type="text" name="site_postcode" value="{{ old('site_postcode') }}" class="input">
                    </div>
                </div>
            </div>

            <div class="card p-5">
                <h3 class="mb-4">Notes</h3>
                <div class="space-y-4">
                    <div>
                        <label>Description</label>
                        <textarea name="description" rows="3" class="input">{{ old('description') }}</textarea>
                    </div>
                    <div>
                        <label>Notes</label>
                        <textarea name="notes" rows="3" class="input">{{ old('notes') }}</textarea>
                    </div>
                    <div>
                        <label>Next Action</label>
                        <input type="text" name="next_action" value="{{ old('next_action') }}" class="input" placeholder="e.g. Schedule consultation">
                    </div>
                </div>
            </div>

            <div class="flex gap-3">
                <button type="submit" class="btn btn-primary flex-1 justify-center"><i class="fas fa-save"></i> Create Job</button>
                <a href="{{ route('jobs.index') }}" class="btn btn-secondary">Cancel</a>
            </div>
        </form>
    </div>
    <div class="card p-5 h-fit">
        <h3 class="mb-3">Job Pipeline Stages</h3>
        <div class="space-y-2">
            @foreach(['Lead' => 'Initial enquiry or lead', 'Consultation' => 'Meeting booked/completed', 'Sold' => 'Job sold, deposit pending', 'Contracts' => 'Contract preparation', 'Check Measure' => 'On-site measurements', 'Processing' => 'In production', 'Delivery' => 'Cabinets delivered', 'Installation' => 'Installation in progress', 'Completion' => 'Final sign-off'] as $stage => $desc)
            <div class="p-2 rounded-lg" style="background: #0f172a;">
                <div class="text-xs font-medium text-white">{{ $stage }}</div>
                <div class="text-xs text-slate-500">{{ $desc }}</div>
            </div>
            @endforeach
        </div>
    </div>
</div>
@endsection