@extends('layouts.app')
@php
    $editing = isset($customer);
    $contact = $editing ? $customer->contact : null;
    $address = $editing ? $customer->address : null;
    $identity = fn (string $type) => $editing ? $customer->identityRecords->where('document_type', $type)->where('is_current', true)->first() : null;
    $passport = $identity('passport'); $eid = $identity('emirates_id'); $uid = $identity('uid'); $visa = $identity('residence_visa');
@endphp
@section('title', $editing ? 'Edit Customer' : 'New Customer')

@section('content')
<div class="mx-auto max-w-6xl space-y-5" x-data="{matches:[],checking:false,confirmed:{{ old('confirm_duplicate') ? 'true':'false' }},async check(){this.checking=true;let body=new FormData($refs.form);body.append('exclude_id','{{ $editing ? $customer->id : '' }}');let r=await fetch('{{ route('app.customers.duplicate_check') }}',{method:'POST',headers:{'X-CSRF-TOKEN':'{{ csrf_token() }}','Accept':'application/json'},body});let j=await r.json();this.matches=j.matches||[];this.checking=false}}">
    <header class="flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between"><div><p class="text-[10px] font-bold uppercase tracking-[.18em] text-orange-600">Customer master</p><h1 class="mt-1 text-2xl font-bold text-[#0b1f38]">{{ $editing ? 'Edit '.$customer->full_name_en : 'Create customer profile' }}</h1><p class="text-xs text-slate-500">Identity, contact, visa, corporate link, ownership and duplicate controls in one record.</p></div><a href="{{ $editing ? route('app.customers.show',$customer) : route('app.customers.index') }}" class="rounded-xl border border-slate-200 bg-white px-4 py-2 text-xs font-bold text-slate-600">Cancel</a></header>

    <form x-ref="form" action="{{ $editing ? route('app.customers.update',$customer) : route('app.customers.store') }}" method="POST" enctype="multipart/form-data" class="space-y-5">
        @csrf @if($editing) @method('PUT') @endif
        <input type="hidden" name="confirm_duplicate" :value="confirmed ? 1 : 0">
        @if($errors->any())<div class="rounded-2xl border border-rose-200 bg-rose-50 p-4 text-xs text-rose-800"><strong>Review the highlighted information.</strong><ul class="mt-2 list-disc pl-5">@foreach($errors->all() as $error)<li>{{ $error }}</li>@endforeach</ul></div>@endif

        <section class="erp-panel"><div class="erp-panel-heading"><div><h2>1. Basic identity</h2><p>Names and personal profile information.</p></div></div><div class="mt-4 grid gap-4 md:grid-cols-3">
            <label class="text-xs font-semibold">Customer type *<select name="customer_type" class="erp-input mt-1" required>@foreach(['individual'=>'Individual','family_member'=>'Family member','corporate_employee'=>'Corporate employee','business_owner'=>'Business owner','sponsor'=>'Sponsor','dependent'=>'Dependent','other'=>'Other'] as $v=>$l)<option value="{{ $v }}" @selected(old('customer_type',$customer->customer_type??'individual')===$v)>{{ $l }}</option>@endforeach</select></label>
            <label class="text-xs font-semibold">First name *<input name="first_name" value="{{ old('first_name',$customer->first_name??'') }}" class="erp-input mt-1" required></label>
            <label class="text-xs font-semibold">Middle name<input name="middle_name" value="{{ old('middle_name',$customer->middle_name??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Last name<input name="last_name" value="{{ old('last_name',$customer->last_name??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Display name<input name="display_name" value="{{ old('display_name',$customer->preferred_name??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Arabic name<input name="full_name_ar" dir="rtl" value="{{ old('full_name_ar',$customer->full_name_ar??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Gender<select name="gender" class="erp-input mt-1"><option value="">Not specified</option>@foreach(['male','female','other'] as $v)<option value="{{ $v }}" @selected(old('gender',$customer->gender??'')===$v)>{{ ucfirst($v) }}</option>@endforeach</select></label>
            <label class="text-xs font-semibold">Date of birth<input type="date" name="dob" value="{{ old('dob',optional($customer->dob??null)->format('Y-m-d')) }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Nationality<input name="nationality" value="{{ old('nationality',$customer->nationality??'Indian') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Preferred language<select name="preferred_language" class="erp-input mt-1">@foreach(['en'=>'English','ar'=>'Arabic','hi'=>'Hindi','ur'=>'Urdu','ml'=>'Malayalam'] as $v=>$l)<option value="{{ $v }}" @selected(old('preferred_language',$customer->preferred_language??'en')===$v)>{{ $l }}</option>@endforeach</select></label>
            <label class="text-xs font-semibold md:col-span-2">Profile photo<input type="file" name="profile_photo" accept="image/jpeg,image/png,image/webp" class="erp-input mt-1"></label>
        </div></section>

        <section class="erp-panel"><div class="erp-panel-heading"><div><h2>2. Contact and address</h2><p>UAE phone normalization runs before duplicate checks.</p></div><button type="button" @click="check" class="rounded-xl bg-amber-100 px-4 py-2 text-xs font-bold text-amber-800" x-text="checking?'Checking…':'Check duplicates'"></button></div><div class="mt-4 grid gap-4 md:grid-cols-3">
            <label class="text-xs font-semibold">Primary mobile *<input name="primary_mobile" value="{{ old('primary_mobile',$contact->primary_mobile??request('mobile')) }}" class="erp-input mt-1 font-mono" required></label>
            <label class="text-xs font-semibold">Alternative mobile<input name="alternative_mobile" value="{{ old('alternative_mobile',$contact->alternative_mobile??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">WhatsApp<input name="whatsapp_number" value="{{ old('whatsapp_number',$contact->whatsapp_number??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Email<input type="email" name="email" value="{{ old('email',$contact->email??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Emirate<input name="emirate" value="{{ old('emirate',$address->emirate??'Dubai') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">City<input name="city" value="{{ old('city',$address->city??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Area<input name="area" value="{{ old('area',$address->area??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">PO Box<input name="po_box" value="{{ old('po_box',$address->po_box??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold md:col-span-3">Address<input name="address" value="{{ old('address',$address->street??'') }}" class="erp-input mt-1"></label>
        </div><div x-show="matches.length" x-cloak class="mt-4 rounded-2xl border border-amber-300 bg-amber-50 p-4"><strong class="text-xs text-amber-900">Possible matches found</strong><template x-for="m in matches" :key="m.id"><div class="mt-2 flex items-center justify-between rounded-xl bg-white p-3 text-xs"><span><b x-text="m.name"></b><small class="ml-2 text-slate-500" x-text="[m.mobile,m.passport,m.eid].filter(Boolean).join(' · ')"></small></span><a :href="m.url" target="_blank" class="font-bold text-orange-700">Open profile</a></div></template><label class="mt-3 flex items-center gap-2 text-xs font-bold text-amber-900"><input type="checkbox" x-model="confirmed">I reviewed these matches and confirm this is a separate person.</label></div></section>

        <section class="erp-panel"><div class="erp-panel-heading"><div><h2>3. Passport and Emirates ID</h2><p>Changed identity numbers create a new current record and retain the previous record.</p></div></div><div class="mt-4 grid gap-4 md:grid-cols-3">
            <label class="text-xs font-semibold">Passport number<input name="passport_number" value="{{ old('passport_number',$passport->document_number??'') }}" class="erp-input mt-1 font-mono uppercase"></label>
            <label class="text-xs font-semibold">Issuing country<input name="passport_country" value="{{ old('passport_country',$passport->issue_place??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Passport issue<input type="date" name="passport_issue_date" value="{{ old('passport_issue_date',optional($passport?->issue_date)->format('Y-m-d')) }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Passport expiry<input type="date" name="passport_expiry_date" value="{{ old('passport_expiry_date',optional($passport?->expiry_date)->format('Y-m-d')) }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Emirates ID<input name="emirates_id" value="{{ old('emirates_id',$eid->document_number??'') }}" class="erp-input mt-1 font-mono"></label>
            <label class="text-xs font-semibold">EID issue<input type="date" name="eid_issue_date" value="{{ old('eid_issue_date',optional($eid?->issue_date)->format('Y-m-d')) }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">EID expiry<input type="date" name="eid_expiry_date" value="{{ old('eid_expiry_date',optional($eid?->expiry_date)->format('Y-m-d')) }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">UID number<input name="uid_number" value="{{ old('uid_number',$uid->document_number??'') }}" class="erp-input mt-1 font-mono"></label>
        </div></section>

        <section class="erp-panel"><div class="erp-panel-heading"><div><h2>4. Visa and sponsor</h2><p>Residency data is reusable by service form auto-fill.</p></div></div><div class="mt-4 grid gap-4 md:grid-cols-3">
            <label class="text-xs font-semibold">Visa number<input name="visa_number" value="{{ old('visa_number',$visa->document_number??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Visa file number<input name="visa_file_number" value="{{ old('visa_file_number',$visa->issue_place??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Visa type<input name="visa_type" value="{{ old('visa_type') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Visa issue<input type="date" name="visa_issue_date" value="{{ old('visa_issue_date',optional($visa?->issue_date)->format('Y-m-d')) }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Visa expiry<input type="date" name="visa_expiry_date" value="{{ old('visa_expiry_date',optional($visa?->expiry_date)->format('Y-m-d')) }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Sponsor type<input name="sponsor_type" value="{{ old('sponsor_type',$visa->sponsor_type??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Sponsor name<input name="sponsor_name" value="{{ old('sponsor_name',$visa->sponsor_name??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Sponsor UID<input name="sponsor_uid" value="{{ old('sponsor_uid') }}" class="erp-input mt-1"></label>
        </div></section>

        <section class="erp-panel"><div class="erp-panel-heading"><div><h2>5. Corporate and operational ownership</h2><p>Optional company linkage, assignment, tags and private notes.</p></div></div><div class="mt-4 grid gap-4 md:grid-cols-3">
            <label class="text-xs font-semibold">Corporate company<select name="corporate_company_id" class="erp-input mt-1"><option value="">Not linked</option>@foreach($companies as $company)<option value="{{ $company->id }}" @selected(old('corporate_company_id',$customer->corporate_company_id??'')==$company->id)>{{ $company->name_en }}</option>@endforeach</select></label>
            <label class="text-xs font-semibold">Employee number<input name="corporate_employee_number" value="{{ old('corporate_employee_number',$customer->corporate_employee_number??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Department<input name="corporate_department" value="{{ old('corporate_department',$customer->corporate_department??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Designation<input name="corporate_designation" value="{{ old('corporate_designation',$customer->corporate_designation??'') }}" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold">Assigned branch<select name="assigned_branch_id" class="erp-input mt-1"><option value="">Default</option>@foreach($branches as $branch)<option value="{{ $branch->id }}" @selected(old('assigned_branch_id',$customer->assigned_branch_id??'')==$branch->id)>{{ $branch->name }}</option>@endforeach</select></label>
            <label class="text-xs font-semibold">Relationship manager<select name="assigned_user_id" class="erp-input mt-1"><option value="">Unassigned</option>@foreach($relationshipManagers as $manager)<option value="{{ $manager->id }}" @selected(old('assigned_user_id',$customer->assigned_user_id??'')==$manager->id)>{{ $manager->name }}</option>@endforeach</select></label>
            <label class="text-xs font-semibold">Source<input name="customer_source" value="{{ old('customer_source',$customer->customer_source??'') }}" placeholder="Walk-in, referral, web…" class="erp-input mt-1"></label>
            <label class="text-xs font-semibold md:col-span-2">Tags<input name="tags" value="{{ old('tags',isset($customer)&&is_array($customer->tags)?implode(', ',$customer->tags):'') }}" placeholder="VIP, renewal, Malayalam" class="erp-input mt-1"></label>
            @if($editing)<label class="text-xs font-semibold">Status<select name="status" class="erp-input mt-1">@foreach(['active','inactive','prospect','blocked','archived'] as $v)<option value="{{ $v }}" @selected(old('status',$customer->status)===$v)>{{ ucfirst($v) }}</option>@endforeach</select></label>@endif
            <label class="text-xs font-semibold md:col-span-3">Internal notes<textarea name="internal_notes" rows="3" class="erp-input mt-1">{{ old('internal_notes',$customer->internal_notes??'') }}</textarea></label>
        </div></section>

        <div class="sticky bottom-4 flex items-center justify-between rounded-2xl border border-slate-200 bg-white/95 p-4 shadow-xl backdrop-blur"><span class="text-xs text-slate-500">All identity changes and operator actions are audited.</span><button class="rounded-xl bg-orange-600 px-6 py-3 text-xs font-bold text-white">{{ $editing ? 'Save customer changes' : 'Create customer profile' }}</button></div>
    </form>
</div>
@endsection