{% extends "ui/templates/base/layout.html" %}
{% block content %}
{% set is_dict = employee is mapping %}
{% set is_edit = mode == 'edit' %}
{% macro val(name, default='') -%}
  {%- if employee -%}
    {%- if is_dict -%}{{ employee.get(name, default) or '' }}{%- else -%}{{ employee|attr(name) or '' }}{%- endif -%}
  {%- else -%}{{ default }}{%- endif -%}
{%- endmacro %}
<div class="mx-auto max-w-5xl space-y-6">
  <div class="flex items-center justify-between gap-3">
    <div>
      <h2 class="text-xl font-semibold text-slate-900">{{ title }}</h2>
      <p class="text-sm text-slate-500">Create or update the employee master. Attendance, leave, payroll and ESS will be added in later phases.</p>
    </div>
    <a href="/employees" class="rounded-xl border border-slate-300 px-4 py-2 text-sm font-semibold text-slate-700 hover:bg-slate-50">Back</a>
  </div>

  {% if errors %}
  <div class="rounded-2xl border border-red-200 bg-red-50 p-4 text-sm text-red-800"><ul class="list-disc pl-5">{% for error in errors %}<li>{{ error }}</li>{% endfor %}</ul></div>
  {% endif %}

  <form method="post" class="space-y-6 rounded-2xl border border-slate-200 bg-white p-6 shadow-soft">
    <input type="hidden" name="csrf_token" value="{{ csrf_token }}">

    {% if not is_edit %}
    <div class="rounded-2xl border border-brand-100 bg-brand-50 p-4">
      <h3 class="font-semibold text-slate-900">Employee Login Link</h3>
      <p class="mt-1 text-sm text-slate-600">Either link an existing unlinked login user or create a login user automatically for this employee.</p>
      <div class="mt-4 grid gap-4 md:grid-cols-2">
        <div>
          <label class="mb-1 block text-sm font-medium text-slate-700">Existing user</label>
          <select name="user_id" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm">
            <option value="">No existing user selected</option>
            {% for u in users %}<option value="{{ u.id }}">{{ u.full_name or u.email }} — {{ u.email }}</option>{% endfor %}
          </select>
        </div>
        <div class="space-y-2 rounded-xl bg-white p-3">
          <label class="inline-flex items-center gap-2 text-sm font-medium text-slate-700"><input type="checkbox" name="create_login_user" class="h-4 w-4 rounded border-slate-300"> Create login user</label>
          <p class="text-xs text-slate-500">When selected, Login Email and Temporary Password below are required.</p>
        </div>
        <div><label class="mb-1 block text-sm font-medium text-slate-700">Login Email</label><input type="email" name="login_email" value="{{ val('login_email') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
        <div><label class="mb-1 block text-sm font-medium text-slate-700">Temporary Password</label><input type="password" name="temporary_password" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"><p class="mt-1 text-xs text-slate-500">Minimum 8 characters. User must change password after login.</p></div>
        <div>
          <label class="mb-1 block text-sm font-medium text-slate-700">Employee User Role</label>
          <select name="employee_role" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm">{% for r in employee_role_names %}<option value="{{ r }}" {% if r == 'Staff' %}selected{% endif %}>{{ r }}</option>{% endfor %}</select>
        </div>
      </div>
    </div>
    {% else %}
      <div class="rounded-2xl border border-slate-200 bg-slate-50 p-4 text-sm text-slate-600">Login user linkage can be changed below. The dropdown shows unlinked users from the same audit firm/branch, plus the currently linked user if any. New user creation is available only while creating an employee.</div>
      <div>
        <label class="mb-1 block text-sm font-medium text-slate-700">Linked user</label>
        {% set uid = employee.user_id if employee and not is_dict else employee.get('user_id') if employee else None %}
        <select name="user_id" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm">
          <option value="">No user linked</option>
          {% for u in users %}<option value="{{ u.id }}" {% if uid == u.id %}selected{% endif %}>{{ u.full_name or u.email }} — {{ u.email }}</option>{% endfor %}
        </select>
        <p class="mt-1 text-xs text-slate-500">Selecting “No user linked” will keep this employee as HR master only. Employee self-service will not work until linked.</p>
      </div>
    {% endif %}

    {% if not is_edit and scope.allow_cross_tenant %}
    <div class="grid gap-4 md:grid-cols-2">
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Audit Firm</label><select name="tenant_id" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm">{% for t in tenants %}<option value="{{ t.id }}" {% if t.id == scope.tenant_id %}selected{% endif %}>{{ t.name }} ({{ t.code }})</option>{% endfor %}</select></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Branch</label><select name="branch_id" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm">{% for b in branches %}<option value="{{ b.id }}" {% if b.id == scope.branch_id %}selected{% endif %}>{{ b.name }} ({{ b.code }})</option>{% endfor %}</select></div>
    </div>
    {% else %}
      <input type="hidden" name="tenant_id" value="{{ scope.tenant_id }}">
      <input type="hidden" name="branch_id" value="{{ scope.branch_id or current_user.branch_id }}">
    {% endif %}

    <div class="grid gap-4 md:grid-cols-2">
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Employee Code *</label><input name="employee_code" value="{{ val('employee_code') }}" required class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Full Name *</label><input name="full_name" value="{{ val('full_name') }}" required class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Email</label><input type="email" name="email" value="{{ val('email') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Mobile</label><input name="mobile" value="{{ val('mobile') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Alternate Mobile</label><input name="alternate_mobile" value="{{ val('alternate_mobile') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Date of Joining</label><input type="date" name="date_of_joining" value="{{ val('date_of_joining') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Employment Type</label><select name="employment_type" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm">{% set et = val('employment_type','full_time') %}{% for code in employment_types %}<option value="{{ code }}" {% if et == code %}selected{% endif %}>{{ code.replace('_',' ').title() }}</option>{% endfor %}</select></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Status</label><select name="status" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm">{% set st = val('status','active') %}{% for code in employee_statuses %}<option value="{{ code }}" {% if st == code %}selected{% endif %}>{{ code.title() }}</option>{% endfor %}</select></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Department</label><input name="department" value="{{ val('department') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Designation</label><input name="designation" value="{{ val('designation') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Reporting Manager</label><select name="reporting_manager_user_id" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm">{% set mid = employee.reporting_manager_user_id if employee and not is_dict else employee.get('reporting_manager_user_id') if employee else None %}<option value="">No manager selected</option>{% for m in managers %}<option value="{{ m.id }}" {% if mid == m.id %}selected{% endif %}>{{ m.full_name or m.email }}</option>{% endfor %}</select></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">PAN</label><input name="pan" value="{{ val('pan') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">UAN</label><input name="uan" value="{{ val('uan') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">ESI No</label><input name="esi_no" value="{{ val('esi_no') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">PF No</label><input name="pf_no" value="{{ val('pf_no') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Aadhaar Last 4</label><input name="aadhaar_last4" maxlength="4" value="{{ val('aadhaar_last4') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Bank Name</label><input name="bank_name" value="{{ val('bank_name') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Bank Account No</label><input name="bank_account_no" value="{{ val('bank_account_no') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Bank IFSC</label><input name="bank_ifsc" value="{{ val('bank_ifsc') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
    </div>

    <div class="grid gap-4 md:grid-cols-2">
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Emergency Contact Name</label><input name="emergency_contact_name" value="{{ val('emergency_contact_name') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div><label class="mb-1 block text-sm font-medium text-slate-700">Emergency Contact Mobile</label><input name="emergency_contact_mobile" value="{{ val('emergency_contact_mobile') }}" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm"></div>
      <div class="md:col-span-2"><label class="mb-1 block text-sm font-medium text-slate-700">Address</label><textarea name="address" rows="2" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm">{{ val('address') }}</textarea></div>
      <div class="md:col-span-2"><label class="mb-1 block text-sm font-medium text-slate-700">Notes</label><textarea name="notes" rows="3" class="w-full rounded-xl border border-slate-300 px-3 py-2 text-sm">{{ val('notes') }}</textarea></div>
    </div>

    <label class="inline-flex items-center gap-2 text-sm text-slate-700"><input type="checkbox" name="is_active" {% if not employee or val('status','active') == 'active' %}checked{% endif %}> Active employee</label>

    <div class="flex justify-end gap-3"><a href="/employees" class="rounded-xl border border-slate-300 px-4 py-2 text-sm font-semibold text-slate-700 hover:bg-slate-50">Cancel</a><button class="rounded-xl bg-brand-600 px-4 py-2 text-sm font-semibold text-white hover:bg-brand-700">Save Employee</button></div>
  </form>
</div>
{% endblock %}