{% extends "base.html" %}
{% block title %}Import Employees · WageWise Neo{% endblock %}
{% block content %}
<div class="page-header">
    <div><div class="eyebrow">Employees</div><h1>Import Employees from Excel</h1></div>
    <a href="{{ url_for('employees') }}" class="btn btn-secondary">← Back to Employees</a>
</div>

<div class="panel" style="margin-bottom:16px;">
    <div class="panel-title"><h2>Step 1 — Download Template</h2></div>
    <p style="margin-bottom:12px;">Download the Excel template, fill in your employee details, then upload it below. Row 2 in the template is a sample — keep it as reference or delete it before uploading.</p>
    <a href="{{ url_for('employee_import_template') }}" class="btn btn-primary">&#8659; Download Import Template (.xlsx)</a>
    <p class="field-hint" style="margin-top:10px;">
        The template includes an Instructions sheet. Required field: <strong>Full Name</strong>.
        Duplicate detection uses: PAN Number, Aadhaar Number, Employee Code — existing records are never overwritten.
    </p>
</div>

<div class="panel" style="margin-bottom:16px;">
    <div class="panel-title"><h2>Step 2 — Upload Filled Template</h2></div>
    <form method="post" enctype="multipart/form-data">
        <div style="display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;">
            <div class="field" style="flex:1;min-width:220px;">
                <label>Select Excel File (.xlsx)</label>
                <input type="file" name="excel_file" accept=".xlsx,.xls" required>
            </div>
            <button type="submit" class="btn btn-primary" style="padding:9px 20px;">Import Employees</button>
        </div>
    </form>
</div>

{% if result %}
<div class="panel">
    <div class="panel-title"><h2>Import Results</h2></div>

    <!-- Summary -->
    <div class="card-grid" style="margin-bottom:20px;">
        <div class="stat-card" style="border-color:var(--color-paid);">
            <div class="label">Imported</div>
            <div class="value" style="color:var(--color-paid);">{{ result.imported|length }}</div>
            <div class="sub">new employees added</div>
        </div>
        <div class="stat-card" style="border-color:var(--color-stamp);">
            <div class="label">Skipped (Duplicates)</div>
            <div class="value" style="color:var(--color-stamp);">{{ result.skipped|length }}</div>
            <div class="sub">existing records not modified</div>
        </div>
        <div class="stat-card" style="border-color:var(--color-due);">
            <div class="label">Errors</div>
            <div class="value" style="color:var(--color-due);">{{ result.errors|length }}</div>
            <div class="sub">rows with problems</div>
        </div>
    </div>

    {% if result.imported %}
    <h3 style="color:var(--color-paid);margin-bottom:8px;">✓ Imported ({{ result.imported|length }})</h3>
    <table class="ledger-table" style="margin-bottom:16px;">
        <thead><tr><th>Row</th><th>Employee Name</th></tr></thead>
        <tbody>
        {% for r in result.imported %}
        <tr><td class="meta">{{ r.row }}</td><td class="name-cell">{{ r.name }}</td></tr>
        {% endfor %}
        </tbody>
    </table>
    {% endif %}

    {% if result.skipped %}
    <h3 style="color:var(--color-stamp);margin-bottom:8px;">⚠ Skipped — Duplicate Records ({{ result.skipped|length }})</h3>
    <table class="ledger-table" style="margin-bottom:16px;">
        <thead><tr><th>Row</th><th>Name</th><th>Reason</th></tr></thead>
        <tbody>
        {% for r in result.skipped %}
        <tr>
            <td class="meta">{{ r.row }}</td>
            <td class="name-cell">{{ r.name }}</td>
            <td class="meta" style="font-size:12px;">{{ r.reason }}</td>
        </tr>
        {% endfor %}
        </tbody>
    </table>
    {% endif %}

    {% if result.errors %}
    <h3 style="color:var(--color-due);margin-bottom:8px;">✗ Errors ({{ result.errors|length }})</h3>
    <table class="ledger-table">
        <thead><tr><th>Row</th><th>Name</th><th>Error</th></tr></thead>
        <tbody>
        {% for r in result.errors %}
        <tr>
            <td class="meta">{{ r.row }}</td>
            <td class="name-cell">{{ r.name }}</td>
            <td class="meta" style="color:var(--color-due);font-size:12px;">{{ r.reason }}</td>
        </tr>
        {% endfor %}
        </tbody>
    </table>
    {% endif %}

    {% if result.imported %}
    <div style="margin-top:16px;">
        <a href="{{ url_for('employees') }}" class="btn btn-primary">View All Employees</a>
    </div>
    {% endif %}
</div>
{% endif %}
{% endblock %}