@extends('layouts.dashboard')
@section('content')

<div class="content-wrapper">
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0">License Verifications</h1>
                </div>
                <div class="col-sm-6">
                    <a href="{{ url('/license/expiry-dashboard') }}" class="btn btn-outline-warning float-right ml-2">
                        <i class="fa fa-clock-o"></i> Expiry Monitoring
                    </a>
                    <a href="{{ url('/license/create-submission') }}" class="btn btn-primary float-right">
                        <i class="fa fa-plus"></i> Add Submission
                    </a>
                </div>
            </div>
        </div>
    </div>

    <section class="content">
        <div class="container-fluid">

            {{-- Summary badges --}}
            <div class="row mb-3" id="summary-badges">
                <div class="col-md-3 col-sm-6">
                    <div class="info-box">
                        <span class="info-box-icon bg-warning"><i class="fa fa-hourglass-half"></i></span>
                        <div class="info-box-content">
                            <span class="info-box-text">Pending</span>
                            <span class="info-box-number" id="count-pending">—</span>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div class="info-box">
                        <span class="info-box-icon bg-info"><i class="fa fa-search"></i></span>
                        <div class="info-box-content">
                            <span class="info-box-text">Under Verification</span>
                            <span class="info-box-number" id="count-under-verification">—</span>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div class="info-box">
                        <span class="info-box-icon bg-danger"><i class="fa fa-refresh"></i></span>
                        <div class="info-box-content">
                            <span class="info-box-text">Renewal Pending</span>
                            <span class="info-box-number" id="count-renewal">—</span>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div class="info-box">
                        <span class="info-box-icon bg-purple"><i class="fa fa-comment"></i></span>
                        <div class="info-box-content">
                            <span class="info-box-text">Clarification</span>
                            <span class="info-box-number" id="count-clarification">—</span>
                        </div>
                    </div>
                </div>
            </div>

            {{-- Filter tabs --}}
            <div class="row mb-2">
                <div class="col-12">
                    <div class="card">
                        <div class="card-header p-2">
                            <ul class="nav nav-pills" id="status-filter-tabs">
                                <li class="nav-item">
                                    <a class="nav-link active" href="#" data-status="">All</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" href="#" data-status="pending">Pending</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" href="#" data-status="under_verification">Under Verification</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" href="#" data-status="clarification_requested">Clarification</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" href="#" data-status="verified">Verified</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" href="#" data-status="rejected">Rejected</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" href="#" data-status="renewal_pending">Renewal Pending</a>
                                </li>
                            </ul>
                        </div>
                        <div class="card-body table-responsive p-1">
                            <table id="license-submissions-table" class="table table-hover text-nowrap">
                                <thead>
                                    <tr>
                                        <th>#</th>
                                        <th>Vendor</th>
                                        <th>Service</th>
                                        <th>Auth / Issuing Authority</th>
                                        <th>License No.</th>
                                        <th>Submitted</th>
                                        <th>Status</th>
                                        <th>Action</th>
                                    </tr>
                                </thead>
                                <tbody></tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </section>
</div>


{{-- Delete Confirmation Modal --}}
<div class="modal fade" id="deleteSubmissionModal" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-header bg-danger text-white">
                <h5 class="modal-title">Confirm Delete</h5>
                <button type="button" class="close text-white" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to permanently delete this submission?</p>
                <p class="text-muted small">This action cannot be undone.</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary btn-sm" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-danger btn-sm" id="btn-confirm-delete-submission">
                    <i class="fa fa-trash"></i> Delete
                </button>
            </div>
        </div>
    </div>
</div>

@endsection