@extends('layouts.portal')
@php
  $isStudent = $user->isStudent(); $isTrainer = $user->isTrainer(); $isEmployer = $user->isEmployer();
  $hasResume = $user->resume_path && \Illuminate\Support\Facades\Storage::disk('local')->exists($user->resume_path);
  $checks = [$user->phone, $user->headline, $user->location, $user->bio, $user->avatar_path, $user->linkedin_url];
  if ($isStudent) { $checks[] = $hasResume; }
  $done = collect($checks)->filter()->count(); $pct = (int) round($done / count($checks) * 100);
@endphp
@section('title', 'Profile and account')
@section('subtitle', $isStudent ? 'Keep your profile and CV current. Employers on the career portal see the details you choose to share.' : ($isTrainer ? 'Your details appear on your public trainer page.' : 'Your account details and password.'))

@section('content')
<div class="pt-cols">
  <div class="pt-main">
    <form method="post" action="{{ route('account.update') }}" enctype="multipart/form-data" class="panel reveal" aria-labelledby="prof-h">
      @csrf @method('PUT')
      <div class="panel-head"><h2 id="prof-h">Profile</h2><span class="pill pill-blue">{{ $pct }}% complete</span></div>
      <div class="panel-body">
        <div class="pt-avatar-row">
          <span class="avatar avatar-lg">@if($user->avatarUrl())<img src="{{ $user->avatarUrl() }}" alt="Your profile photo">@else{{ $user->initials() }}@endif</span>
          <div class="grow" style="min-width:220px">
            <label class="label" for="avatar">Profile photo</label>
            <input class="input" type="file" id="avatar" name="avatar" accept=".jpg,.jpeg,.png,.webp">
            <div class="help">JPG, PNG or WEBP, up to 2 MB. A square photo works best.</div>
            @error('avatar')<div class="field-error">{{ $message }}</div>@enderror
          </div>
        </div>
        <div class="form-grid mt-2">
          <x-field name="name" label="Full name" :value="$user->name" required autocomplete="name"/>
          <x-field name="phone" label="Phone / WhatsApp" :value="$user->phone" type="tel" autocomplete="tel" placeholder="+92 300 0000000"/>
          <x-field name="whatsapp_pref" label="WhatsApp messages" type="select" :value="$user->whatsapp_opt_out_at ? 'none' : ($user->whatsapp_opt_in ? 'all' : 'reminders')"
            :options="['all' => 'Reminders and news about new batches', 'reminders' => 'Only class and fee reminders', 'none' => 'No WhatsApp messages']"/>
          @unless($isEmployer)
          <x-field name="headline" label="Headline" :value="$user->headline" placeholder="{{ $isTrainer ? 'e.g. Azure and DevOps instructor' : 'e.g. Aspiring cloud administrator, AZ-104' }}" full/>
          <x-field name="location" label="City" :value="$user->location" placeholder="Karachi" autocomplete="address-level2"/>
          @endunless
          <x-field name="linkedin_url" label="LinkedIn URL" :value="$user->linkedin_url" type="url" placeholder="https://www.linkedin.com/in/your-name"/>
          @if($isStudent || $isTrainer)
          <x-field name="github_url" label="GitHub URL" :value="$user->github_url" type="url" placeholder="https://github.com/your-name"/>
          @endif
          @unless($isEmployer)
          <x-field name="bio" type="textarea" label="About you" :value="$user->bio" rows="5" full help="A few sentences in your own words. Up to 1,500 characters."/>
          @endunless
          @if($isTrainer)
          <x-field name="certifications" label="Certifications" :value="$trainer?->certifications" placeholder="e.g. AZ-104, AZ-400, MCT" full/>
          <x-field name="experience_years" type="number" label="Years of experience" :value="$trainer?->experience_years" min="0" max="60"/>
          @endif
          @if($isStudent)
          <x-field name="expected_salary" label="Expected salary (optional)" :value="$user->expected_salary" placeholder="e.g. PKR 80,000 / month"/>
          <div class="field full"><label class="check"><input type="hidden" name="open_to_work" value="0"><input type="checkbox" name="open_to_work" value="1" @checked(old('open_to_work', $user->open_to_work))> <span><b>Open to work.</b> Show employers on the career portal that I am looking for a role.</span></label></div>
          @endif
        </div>

        @if($isStudent)
        <div class="field mt-2">
          <label class="label" for="resume">CV / resume</label>
          @if($hasResume)<div class="pt-cv"><x-icon name="file-text" :size="22"/><div class="grow"><b>{{ 'CV-'.\Illuminate\Support\Str::slug($user->name).'.'.pathinfo($user->resume_path, PATHINFO_EXTENSION) }}</b><div class="xs muted">Uploaded. Choose a new file below to replace it.</div></div><a class="btn btn-secondary btn-sm" href="{{ route('account.resume') }}"><x-icon name="download" :size="15"/> Download</a></div>@endif
          <input class="input" type="file" id="resume" name="resume" accept=".{{ implode(',.', config('infotics.careers.resume_mimes')) }}">
          <div class="help">{{ strtoupper(implode(', ', config('infotics.careers.resume_mimes'))) }} · up to {{ config('infotics.careers.resume_max_mb') }} MB. Your CV is private: only employers you apply to can download it.</div>
          @error('resume')<div class="field-error">{{ $message }}</div>@enderror
        </div>
        @endif
        <button class="btn btn-primary" type="submit"><x-icon name="check" :size="17"/> Save profile</button>
      </div>
    </form>

    <form method="post" action="{{ route('account.password') }}" class="panel reveal" aria-labelledby="pw-h" autocomplete="off">
      @csrf @method('PUT')
      <div class="panel-head"><h2 id="pw-h">Change password</h2></div>
      <div class="panel-body">
        <div class="form-grid">
          <x-field name="current_password" type="password" label="Current password" required full autocomplete="current-password"/>
          <x-field name="password" type="password" label="New password" required autocomplete="new-password" help="At least 8 characters with letters and numbers."/>
          <x-field name="password_confirmation" type="password" label="Confirm new password" required autocomplete="new-password"/>
        </div>
        <button class="btn btn-secondary" type="submit"><x-icon name="key" :size="17"/> Update password</button>
      </div>
    </form>
  </div>

  <aside class="pt-side">
    <section class="panel reveal">
      <div class="panel-head"><h2>Account</h2></div>
      <div class="panel-body">
        <dl class="kv" style="grid-template-columns:100px 1fr">
          <dt>Email</dt><dd>{{ $user->email }}</dd>
          <dt>Role</dt><dd>{{ \App\Support\PortalNav::label($user) }}</dd>
          <dt>Status</dt><dd><x-pill :status="$user->status ?: 'active'"/></dd>
          @if($user->last_login_at)<dt>Last sign-in</dt><dd>{{ $user->last_login_at->diffForHumans() }}</dd>@endif
        </dl>
        <p class="xs muted mt-2">To change your email address, contact {{ setting('contact_email', 'the INFOTICS office') }}.</p>
      </div>
    </section>
    <section class="panel reveal">
      <div class="panel-head"><h2>Profile strength</h2></div>
      <div class="panel-body"><div class="progress mb-2"><i style="width:{{ $pct }}%"></i></div>
        <ul class="pt-checklist">
          <li class="{{ $user->avatar_path ? 'done' : '' }}"><x-icon name="{{ $user->avatar_path ? 'check-circle' : 'plus' }}" :size="16"/> Profile photo</li>
          <li class="{{ $user->headline ? 'done' : '' }}"><x-icon name="{{ $user->headline ? 'check-circle' : 'plus' }}" :size="16"/> Headline</li>
          <li class="{{ $user->bio ? 'done' : '' }}"><x-icon name="{{ $user->bio ? 'check-circle' : 'plus' }}" :size="16"/> About you</li>
          <li class="{{ $user->linkedin_url ? 'done' : '' }}"><x-icon name="{{ $user->linkedin_url ? 'check-circle' : 'plus' }}" :size="16"/> LinkedIn</li>
          @if($isStudent)<li class="{{ $hasResume ? 'done' : '' }}"><x-icon name="{{ $hasResume ? 'check-circle' : 'plus' }}" :size="16"/> CV uploaded</li>@endif
        </ul>
      </div>
    </section>
    @if($isStudent)
    <section class="panel reveal"><div class="panel-body small"><b>Your public portfolio</b><p class="muted mt-1">Decide what employers can see, and share verified badges from one page.</p><a class="btn btn-secondary btn-sm" href="{{ route('portfolio.mine') }}"><x-icon name="id-card" :size="15"/> Open my portfolio</a></div></section>
    @endif
  </aside>
</div>
@endsection