{% extends 'base.html' %}
{% block title %}Import Users – IT Asset Management{% endblock %}
{% block breadcrumb %}
  <li class="breadcrumb-item"><a href="{{ url_for('dashboard.index') }}">Home</a></li>
  <li class="breadcrumb-item"><a href="{{ url_for('users.index') }}">Users</a></li>
  <li class="breadcrumb-item active">Import</li>
{% endblock %}

{% block content %}
<div class="page-header mb-4">
  <h1><i class="bi bi-cloud-download me-2"></i>Import Users</h1>
</div>

<div class="row g-4">
  <!-- CSV Import -->
  <div class="col-md-6">
    <div class="card border-0 shadow-sm h-100">
      <div class="card-header bg-white fw-semibold py-3">
        <i class="bi bi-filetype-csv me-2 text-success"></i>Import from CSV
      </div>
      <div class="card-body">
        <p class="text-muted small mb-3">
          Upload a CSV file with employee data. The file must include a
          <code>windows_id</code> column. Additional columns are matched by common aliases.
        </p>
        <div class="bg-light rounded p-2 mb-3" style="font-size:.78rem;">
          <strong>Recognised column names:</strong><br>
          <code>windows_id</code>, <code>first_name</code>, <code>last_name</code>,
          <code>email</code>, <code>department</code>, <code>job_title</code>,
          <code>phone</code>, <code>location</code>
          <br><span class="text-muted">(case-insensitive, spaces or underscores)</span>
        </div>

        <form method="POST" action="{{ url_for('users.import_csv') }}" enctype="multipart/form-data">
          <div class="mb-3">
            <label class="form-label">CSV File</label>
            <input type="file" name="csv_file" class="form-control" accept=".csv" required>
          </div>
          <button type="submit" class="btn btn-success w-100">
            <i class="bi bi-upload me-1"></i>Import CSV
          </button>
        </form>
      </div>
    </div>
  </div>

  <!-- LDAP / AD Sync -->
  <div class="col-md-6">
    <div class="card border-0 shadow-sm h-100">
      <div class="card-header bg-white fw-semibold py-3">
        <i class="bi bi-diagram-3 me-2 text-primary"></i>Sync from Active Directory
      </div>
      <div class="card-body">
        <p class="text-muted small mb-3">
          Connects to the LDAP/AD server configured in Settings and upserts all
          matching user accounts. Masked users are never overwritten.
        </p>
        <div class="alert alert-info py-2 small mb-3">
          <i class="bi bi-info-circle me-1"></i>
          Existing non-masked users will be updated with fresh AD data.
          New accounts will be created. Masked records are skipped.
        </div>
        <form method="POST" action="{{ url_for('users.import_ldap') }}">
          <button type="submit" class="btn btn-primary w-100">
            <i class="bi bi-arrow-repeat me-1"></i>Sync from AD Now
          </button>
        </form>

        <hr>
        <small class="text-muted d-block">
          Configure LDAP server, bind credentials and base DN in
          <a href="{{ url_for('settings.index') }}">Settings</a>.
        </small>
      </div>
    </div>
  </div>
</div>

<!-- CSV template download hint -->
<div class="card border-0 shadow-sm mt-4" style="max-width:500px;">
  <div class="card-body py-3">
    <h6 class="fw-semibold mb-2"><i class="bi bi-file-earmark-spreadsheet me-2"></i>CSV Template</h6>
    <p class="small text-muted mb-2">Your CSV should look like this:</p>
    <pre class="bg-light rounded p-2 small mb-0">windows_id,first_name,last_name,email,department,job_title,location
408525,John,Doe,john.doe@company.com,IT,Engineer,HQ
408526,Jane,Smith,jane.smith@company.com,HR,Manager,HQ</pre>
  </div>
</div>
{% endblock %}