@extends('layouts.app')
@section('title', 'Import / Export')
@section('content')
<div style="display:grid;grid-template-columns:1fr 1fr;gap:16px;">
    <div class="card">
        <h3 style="font-size:15px;color:#0b4f2c;margin-bottom:10px;">Bulk Import</h3>
        <p style="font-size:11.5px;color:#777;margin-bottom:12px;">Upload a CSV/Excel file. Rows are parsed client-side (or via <code>maatwebsite/excel</code> once installed) then posted as JSON to the endpoints below.</p>
        <div style="margin-bottom:14px;">
            <label style="display:block;font-size:12px;margin-bottom:4px;">Import Students</label>
            <input type="file" accept=".csv,.xlsx" style="width:100%;font-size:12px;">
            <p style="font-size:10.5px;color:#999;margin-top:4px;">Columns: admission_number, first_name, last_name, gender, class_arm_id</p>
        </div>
        <div>
            <label style="display:block;font-size:12px;margin-bottom:4px;">Import Staff</label>
            <input type="file" accept=".csv,.xlsx" style="width:100%;font-size:12px;">
            <p style="font-size:10.5px;color:#999;margin-top:4px;">Columns: name, email, staff_id</p>
        </div>
    </div>
    <div class="card">
        <h3 style="font-size:15px;color:#0b4f2c;margin-bottom:10px;">Bulk Export</h3>
        <p style="font-size:11.5px;color:#777;margin-bottom:12px;">CSV export works immediately. XLSX requires <code>composer require maatwebsite/excel</code>.</p>
        <a href="{{ url('/api/export/students.csv') }}" style="display:block;background:#f4f6f5;color:#333;text-decoration:none;padding:8px 12px;border-radius:6px;font-size:12.5px;margin-bottom:8px;">Export Students (CSV)</a>
        <a href="{{ url('/api/export/staff.csv') }}" style="display:block;background:#f4f6f5;color:#333;text-decoration:none;padding:8px 12px;border-radius:6px;font-size:12.5px;margin-bottom:8px;">Export Staff (CSV)</a>
        <a href="{{ url('/api/export/invoices.csv') }}" style="display:block;background:#f4f6f5;color:#333;text-decoration:none;padding:8px 12px;border-radius:6px;font-size:12.5px;">Export Invoices (CSV)</a>
    </div>
</div>
@endsection