@extends('app-new')

@push('head-script')
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/tables/datatable/dataTables.bootstrap5.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/components.css">
@endpush

@push('content-header')
    <div class="row breadcrumbs-top">
        <div class="col-12">
            <h2 class="content-header-title float-start mb-0">Declaration Approvals</h2>
            <div class="breadcrumb-wrapper">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="/{{ $alias }}/home">Home</a></li>
                    <li class="breadcrumb-item"><a href="/{{ $alias }}/tdx/dashboard">TDS</a></li>
                    <li class="breadcrumb-item active">Approvals</li>
                </ol>
            </div>
        </div>
    </div>
@endpush

@section('content')
    <section id="tdx-approvals">
        {{-- Flash Messages --}}
        <div class="row">
            <div class="col-12">
                @if(session('status'))
                    <div class="alert alert-success alert-dismissible fade show" role="alert">
                        <div class="alert-body">{{ session('status') }}</div>
                        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                    </div>
                @endif
                @if(session('error'))
                    <div class="alert alert-danger alert-dismissible fade show" role="alert">
                        <div class="alert-body">{{ session('error') }}</div>
                        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                    </div>
                @endif
            </div>
        </div>

        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header border-bottom p-1">
                        <div class="head-label">
                            <h6 class="mb-0">Pending Calculation Approvals - FY {{ $fy }}</h6>
                        </div>
                        <div class="dt-action-buttons text-end">
                            <div class="dt-buttons d-inline-flex">
                                <div class="form-label-group me-2">
                                    <form>
                                        <input type="text" name="search" placeholder="Search" id="search"
                                            class="form-control" value="{{ request('search') }}">
                                    </form>
                                </div>
                                <button class="dt-button btn btn-primary btn-sm me-2" type="button"
                                    data-bs-toggle="offcanvas" data-bs-target="#offcanvasEnd" aria-controls="offcanvasEnd">
                                    <i data-feather='filter'></i>
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="card-datatable table-responsive">
                        <table class="table table-hover" style="min-width:900px;">
                            <thead>
                                <tr>
                                    <th style="width:40px">#</th>
                                    <th style="min-width:150px">Employee</th>
                                    <th style="width:80px">Regime</th>
                                    <th style="width:80px">Type</th>
                                    <th class="text-end" style="min-width:150px">Declared</th>
                                    <th class="text-end" style="min-width:150px">Tax</th>
                                    <th class="text-end" style="min-width:150px">Monthly TDS</th>
                                    <th style="width:150px">Date</th>
                                    <th style="width:100px">Action</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($declarations as $index => $declaration)
                                    @php
                                        $calc = $declaration->taxCalculations->first();
                                    @endphp
                                    <tr>
                                        <td>{{ $declarations->firstItem() + $index }}</td>
                                        <td>
                                            <span class="fw-bold">{{ $declaration->employee->name ?? 'N/A' }}</span>
                                            <small class="text-muted d-block">{{ $declaration->employee->employee_code ?? '' }}</small>
                                        </td>
                                        <td>
                                            <span class="badge badge-light-{{ $declaration->regime === 'old' ? 'primary' : 'success' }}">
                                                {{ ucfirst($declaration->regime) }}
                                            </span>
                                        </td>
                                        <td>
                                            <span class="badge badge-light-{{ $declaration->declaration_type === 'final' ? 'danger' : 'info' }}">
                                                {{ ucfirst($declaration->declaration_type ?? 'Provisional') }}
                                            </span>
                                        </td>
                                        <td class="text-end">&#8377; {{ number_format($declaration->total_declared_amount ?? 0, 0) }}</td>
                                        <td class="text-end">
                                            <strong class="{{ ($calc->total_tax ?? 0) > 0 ? 'text-danger' : 'text-success' }}">
                                                &#8377; {{ number_format($calc->total_tax ?? 0, 0) }}
                                            </strong>
                                        </td>
                                        <td class="text-end">&#8377; {{ number_format($calc->monthly_tds ?? 0, 0) }}</td>
                                        <td><small>{{ $calc ? $calc->updated_at->format('d M Y') : '—' }}</small></td>
                                        <td>
                                            <a href="/{{ $alias }}/tdx/declarations/{{ $declaration->id }}/preview"
                                               class="btn btn-sm btn-outline-primary">
                                                <i data-feather="eye" class="font-small-4 me-25"></i> Review
                                            </a>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="9" class="text-center py-2">No pending calculation approvals.</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                    @if($declarations->hasPages())
                        <div class="card-footer">
                            <div class="d-flex justify-content-center">
                                {{ $declarations->links() }}
                            </div>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </section>

    {{-- Offcanvas Filter --}}
    <form method="get" id="filter-form">
        <div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasEnd" aria-labelledby="offcanvasEndLabel">
            <div class="offcanvas-header">
                <h5 id="offcanvasEndLabel" class="offcanvas-title">Filter</h5>
                <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
            </div>
            <div class="offcanvas-body">
                <div class="row">
                    <div class="col-md-12">
                        <label class="form-label">Employee</label>
                        <select name="employee_id" class="form-control mb-2">
                            <option value="">All</option>
                            @foreach($employees as $employee)
                                <option value="{{ $employee->id }}" @if(request('employee_id')==$employee->id) selected @endif>{{ $employee->name }} ({{ $employee->employee_code }})</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-12">
                        <label class="form-label">Employee Type</label>
                        <select name="employee_type" class="form-control mb-2">
                            <option value="">All</option>
                            <option value="employee" @if(request('employee_type')=='employee') selected @endif>Employee</option>
                            <option value="workman" @if(request('employee_type')=='workman') selected @endif>Workman</option>
                        </select>
                    </div>
                    <div class="col-md-12">
                        <label class="form-label">Department</label>
                        <select name="department_id" class="form-control mb-2">
                            <option value="">All</option>
                            @foreach($departments as $department)
                                <option value="{{ $department->id }}" @if(request('department_id')==$department->id) selected @endif>{{ $department->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-12">
                        <label class="form-label">Designation</label>
                        <select name="designation_id" class="form-control mb-2">
                            <option value="">All</option>
                            @foreach($designations as $designation)
                                <option value="{{ $designation->id }}" @if(request('designation_id')==$designation->id) selected @endif>{{ $designation->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-12">
                        <label class="form-label">Regime</label>
                        <select name="regime" class="form-control mb-2">
                            <option value="">All</option>
                            <option value="old" @if(request('regime')=='old') selected @endif>Old</option>
                            <option value="new" @if(request('regime')=='new') selected @endif>New</option>
                        </select>
                    </div>
                    <div class="col-md-12">
                        <label class="form-label">Type</label>
                        <select name="declaration_type" class="form-control mb-2">
                            <option value="">All</option>
                            <option value="provisional" @if(request('declaration_type')=='provisional') selected @endif>Provisional</option>
                            <option value="final" @if(request('declaration_type')=='final') selected @endif>Final</option>
                        </select>
                    </div>
                </div>
                <button type="submit" class="btn btn-primary mt-2 mb-1 d-grid w-100 d-flex justify-content-center"
                    data-bs-dismiss="offcanvas" aria-label="Close">
                    <i data-feather='search' class="me-2"></i>Apply
                </button>
            </div>
        </div>
    </form>
@endsection

@push('footer-script')
    <script>
        $(document).ready(function () {
            if (feather) feather.replace();
        });
    </script>
@endpush