@extends('layout.master')

@section('content')
    <div class="container-fluid">
        <!-- Start::page-header -->
        <div class="d-md-flex d-block align-items-center justify-content-between page-header-breadcrumb">
            <div>
                <h2 class="main-content-title fs-24 mb-1">Upload Leads</h2>
                <ol class="breadcrumb mb-0">
                    <li class="breadcrumb-item"><a href="{{ url('/dashboard') }}">Dashboard</a></li>
                    <li class="breadcrumb-item active" aria-current="page">Upload Leads</li>
                </ol>
            </div>
        </div>

        <h3 class="text-center mb-3">Match CSV Columns with Database Columns</h3>
        <form action="{{ route('upload.import') }}" method="POST">
            @csrf
            <input type="hidden" name="file_path" value="{{ $path }}">
            <table class="table" border="1">
                <tr>
                    <th>CSV Column</th>
                    <th>Map to DB Column</th>
                </tr>
                @foreach ($csvColumns as $csvColumn)
                    <tr>
                        <td>{{ $csvColumn }}</td>
                        <td>
                            <select class="form-select" name="column_mapping[{{ $csvColumn }}]">
                                <option value="">-- Select Column --</option>
                                @foreach ($dbColumns as $dbColumn)
                                    <option value="{{ $dbColumn }}">{{ $dbColumn }}</option>
                                @endforeach
                            </select>
                        </td>
                    </tr>
                @endforeach
            </table>
            <div class="row">
                <div class="col-md-12 text-end my-2">
                    <button class="btn btn-primary" type="submit">Import Data</button>
                </div>
            </div>
        </form>

    </div>
@endsection