@extends('layouts.app')

@section('styles')
    <link rel="stylesheet" href="{{ asset('plugins/src/table/datatable/datatables.css') }}">

    @vite(['resources/scss/light/plugins/table/datatable/dt-global_style.scss'])
    @vite(['resources/scss/light/plugins/table/datatable/custom_dt_custom.scss'])
    @vite(['resources/scss/dark/plugins/table/datatable/dt-global_style.scss'])
    @vite(['resources/scss/dark/plugins/table/datatable/custom_dt_custom.scss'])

    <style>
        .filter-bar select {
            min-width: 180px;
            padding-left: 2rem;
            /* space for icon */
            background-position: 8px center;
            background-repeat: no-repeat;
            background-size: 14px;
        }

        /* Different icons for each filter */
        .filter-client {
            background-image: url('https://img.icons8.com/ios-filled/50/6c757d/user.png');
        }

        .filter-type {
            background-image: url('https://img.icons8.com/ios-filled/50/6c757d/briefcase.png');
        }

        .filter-status {
            background-image: url('https://img.icons8.com/ios-filled/50/6c757d/flag.png');
        }
    </style>
@endsection

@section('content')
    <div class="row layout-top-spacing">

        <div class="col-lg-12">
            <div class="statbox widget box box-shadow">
                <div class="widget-content widget-content-area">
                    @if ($request == 'manage_case')
                        <div
                            class="d-flex align-items-center justify-content-between gap-2 p-3 border rounded-3 shadow-sm flex-wrap">

                            <!-- Left Filters -->
                            <div class="d-flex align-items-center gap-2 flex-wrap">

                                <!-- Client -->
                                <select class="form-select form-select-sm rounded-pill px-3" style="width: 180px;">
                                    <option value="">👥 All Clients</option>
                                    <option>🏢 Tata Aig</option>
                                    <option>🏢 Jane Smith</option>
                                    <option>🏢 Acme Corp</option>
                                    <option>🏢 Kritika Enterprises</option>
                                </select>

                                <!-- Stages Type -->
                                <select class="form-select form-select-sm rounded-pill px-3" style="width: 220px;">
                                    <option value="">📑 All Stages of Matter</option>
                                    <option>📝 Completion of Pleadings</option>
                                    <option>📂 Application/Discovery</option>
                                    <option>⚖ Evidence</option>
                                    <option>🖊 Written Submissions</option>
                                    <option>🎤 Arguments</option>
                                    <option>⏳ Reserved for Orders</option>
                                </select>

                                <!-- Action Buttons -->
                                <button class="btn btn-sm btn-primary rounded-pill px-3">
                                    <i class="fas fa-filter me-1"></i> Apply
                                </button>
                                <button class="btn btn-sm btn-outline-secondary rounded-pill px-3">
                                    <i class="fas fa-undo me-1"></i> Reset
                                </button>
                            </div>

                            <!-- Right-side Buttons -->
                            <div class="d-flex align-items-center gap-2">
                                <a href="" class="btn btn-sm btn-outline-dark rounded-pill px-3">
                                    <i class="fas fa-folder-open me-1"></i> Documents
                                </a>
                                <a href="{{ route('addcase') }}" class="btn btn-sm btn-success rounded-pill px-3">
                                    <i class="fas fa-plus-circle me-1"></i> Add Case
                                </a>
                            </div>
                        </div>
                    @endif

                    <table id="style-1" class="table style-1 dt-table-hover non-hover">
                        <thead>
                            <tr>
                                <th class="dt-no-sorting">S.No</th>
                                <th>Case Number</th>
                                @if ($request == 'manage_case')
                                    <th>Client Name</th>
                                @endif
                                <th>Matter No</th>
                                <th>Type of Policy</th>
                                <th>Policy Number</th>
                                <th>Complainant</th>
                                <th>Forum</th>
                                <th>Court</th>
                                <th>Date of Filing</th>
                                <th>Contact Person</th>
                                <th>Opposite Advocate</th>
                                <th>Summons Received</th>
                                <th>Claim Amount</th>
                                <th>Interest %</th>
                                <th>Stage of Matter</th>
                                <th>Last Hearing</th>
                                <th>Next Hearing</th>
                                <th>Risk Rating</th>
                                <th>Pending Fees</th>
                                <th class="text-center dt-no-sorting">Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($cases as $index => $case)
                                <tr>
                                    <!-- Index -->
                                    <td class="text-center">{{ $cases->firstItem() + $index }}</td>

                                    <!-- Case Number -->
                                    <td>{{ $case->case_number }}</td>

                                    <!-- Client Name (only if manage_case) -->
                                    @if ($request == 'manage_case')
                                        <td>{{ $case->client->first_name . ' ' . $case->client->last_name ?? 'N/A' }}</td>
                                    @endif

                                    <td>{{ $case->matter_no ?? 'N/A' }}</td>
                                    <td>{{ $case->policy_type ?? 'N/A' }}</td>
                                    <td>{{ $case->policy_number ?? 'N/A' }}</td>
                                    <td>{{ $case->complainant ?? 'N/A' }}</td>
                                    <td>{{ $case->category->name ?? 'N/A' }}</td>
                                    <td>{{ $case->court->name ?? 'N/A' }}</td>

                                    <!-- Filing Date -->
                                    <td>
                                        {{ $case->filing_date ? \Carbon\Carbon::parse($case->filing_date)->format('d-m-Y') : 'N/A' }}
                                    </td>

                                    <td>{{ $case->contact_person ?? 'N/A' }}</td>
                                    <td>{{ $case->opposite_advocate ?? 'N/A' }}</td>
                                    <td>{{ $case->summons_date ?? 'N/A' }}</td>

                                    <!-- Claim Amount -->
                                    <td>₹{{ number_format($case->claim_amount, 2) }}</td>

                                    <!-- Interest % -->
                                    <td>{{ $case->interest_percent ?? '-' }}%</td>

                                    <!-- Stage -->
                                    <td>{{ $case->stage ?? 'N/A' }}</td>

                                    <!-- Last Hearing -->
                                    <td>
                                        {{ $case->last_hearing ? \Carbon\Carbon::parse($case->last_hearing)->format('d-m-Y') : '-' }}
                                    </td>

                                    <!-- Next Hearing -->
                                    <td>
                                        {{ $case->next_hearing ? \Carbon\Carbon::parse($case->next_hearing)->format('d-m-Y') : '-' }}
                                    </td>

                                    <!-- Risk Rating with Badge -->
                                    <td class="text-center">
                                        <span
                                            class="badge
            @if ($case->risk_rating == 'High') bg-danger
            @elseif($case->risk_rating == 'Medium') bg-warning
            @else bg-success @endif">
                                            {{ $case->risk_rating }}
                                        </span>
                                    </td>

                                    <!-- Pending Fees -->
                                    <td>₹{{ number_format($case->pending_fees ?? 0, 2) }}</td>

                                    <!-- Actions -->
                                    <td class="text-center">
                                        <div class="d-flex justify-content-center align-items-center gap-2">
                                            <!-- View -->
                                            <a href="{{ route('cases.view', $case->id) }}"
                                                class="btn btn-sm btn-outline-info rounded-pill shadow-sm"
                                                data-bs-toggle="tooltip" title="View">
                                                <i class="fas fa-eye"></i>
                                            </a>

                                            <!-- Edit -->
                                            <a href="{{ route('cases.edit', $case->id) }}"
                                                class="btn btn-sm btn-outline-primary rounded-pill shadow-sm"
                                                data-bs-toggle="tooltip" title="Edit">
                                                <i class="fas fa-edit"></i>
                                            </a>

                                            <!-- Delete -->
                                            <form action="{{ route('cases.destroy', $case->id) }}" method="POST"
                                                onsubmit="return confirm('Are you sure you want to delete this case?')"
                                                class="d-inline">
                                                @csrf @method('DELETE')
                                                <button type="submit"
                                                    class="btn btn-sm btn-outline-danger rounded-pill shadow-sm"
                                                    data-bs-toggle="tooltip" title="Delete">
                                                    <i class="fas fa-trash-alt"></i>
                                                </button>
                                            </form>
                                        </div>
                                    </td>
                                </tr>

                                <!-- If no cases -->
                            @empty
                                <tr>
                                    <td colspan="20" class="text-center text-muted">No cases found.</td>
                                </tr>
                            @endforelse

                            <!-- Row 1 -->
                            {{--
                                <tr>
                                    <td>{{ $cases->firstItem() + $index }}</td>
                                    <td>{{ $case->case_number }}</td>

                                    @if ($request == 'manage_case')
                                        <td>{{ $case->client->first_name . ' ' . $case->client->last_name ?? 'N/A' }}</td>
                                    @endif

                                    <td>{{ $case->matter_no ?? 'N/A' }}</td>
                                    <td>{{ $case->policy_type ?? 'N/A' }}</td>
                                    <td>{{ $case->policy_number ?? 'N/A' }}</td>
                                    <td>{{ $case->complainant ?? 'N/A' }}</td>
                                    <td>{{ $case->category->name ?? 'N/A' }}</td>
                                    <td>{{ $case->court->name ?? 'N/A' }}</td>
                                    <td>{{ $case->filing_date ? \Carbon\Carbon::parse($case->filing_date)->format('d-m-Y') : 'N/A' }}
                                    </td>
                                    <td>{{ $case->contact_person ?? 'N/A' }}</td>
                                    <td>{{ $case->opposite_advocate ?? 'N/A' }}</td>
                                    <td>{{ $case->summons_date ?? 'N/A' }}</td>
                                    <td>₹{{ number_format($case->claim_amount, 2) }}</td>
                                    <td>{{ $case->interest_percent ?? '-' }}%</td>
                                    <td>{{ $case->stage ?? 'N/A' }}</td>
                                    <td>{{ $case->last_hearing ? \Carbon\Carbon::parse($case->last_hearing)->format('d-m-Y') : '-' }}
                                    </td>
                                    <td>{{ $case->next_hearing ? \Carbon\Carbon::parse($case->next_hearing)->format('d-m-Y') : '-' }}
                                    </td>
                                    <td>
                                        <span
                                            class="badge
                        @if ($case->risk_rating == 'High') bg-danger
                        @elseif($case->risk_rating == 'Medium') bg-warning
                        @else bg-success @endif">
                                            {{ $case->risk_rating }}
                                        </span>
                                    </td>
                                    <td>₹{{ number_format($case->pending_fees ?? 0, 2) }}</td>

                                    <td class="text-center">
                                        <a href="{{ route('cases.view', $case->id) }}" class="btn btn-sm btn-info">View</a>
                                        <a href="{{ route('cases.edit', $case->id) }}"
                                            class="btn btn-sm btn-primary">Edit</a>
                                        <form action="{{ route('cases.destroy', $case->id) }}" method="POST"
                                            class="d-inline">
                                            @csrf @method('DELETE')
                                            <button class="btn btn-sm btn-danger" onclick="return confirm('Are you sure?')">
                                                Delete
                                            </button>
                                        </form>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="20" class="text-center">No cases found.</td>
                                </tr>
                            @endforelse --}}
                        </tbody>
                    </table>


                </div>
            </div>
        </div>
    </div>
@endsection

@section('scripts')
    {{-- Scripts Here --}}
    <script type="module" src="{{ asset('plugins/src/global/vendors.min.js') }}"></script>
    @vite(['resources/js/custom.js'])
    <script type="module" src="{{ asset('plugins/src/table/datatable/datatables.js') }}"></script>

    <script type="module">
        function multiCheck(tb_var) {
            tb_var.on("change", ".chk-parent", function() {
                    var e = $(this).closest("table").find("td:first-child .child-chk"),
                        a = $(this).is(":checked");
                    $(e).each(function() {
                        a ? ($(this).prop("checked", !0), $(this).closest("tr").addClass("active")) : ($(this)
                            .prop("checked", !1), $(this).closest("tr").removeClass("active"))
                    })
                }),
                tb_var.on("change", "tbody tr .new-control", function() {
                    $(this).parents("tr").toggleClass("active")
                })
        }

        // var e;
        let c1 = $('#style-1').DataTable({


            "dom": "<'dt--top-section'<'row'<'col-12 col-sm-6 d-flex justify-content-sm-start justify-content-center'l><'col-12 col-sm-6 d-flex justify-content-sm-end justify-content-center mt-sm-0 mt-3'f>>>" +
                "<'table-responsive'tr>" +
                "<'dt--bottom-section d-sm-flex justify-content-sm-between text-center'<'dt--pages-count  mb-sm-0 mb-3'i><'dt--pagination'p>>",
            "oLanguage": {
                "oPaginate": {
                    "sPrevious": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>',
                    "sNext": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>'
                },
                "sInfo": "Showing page _PAGE_ of _PAGES_",
                "sSearch": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>',
                "sSearchPlaceholder": "Search...",
                "sLengthMenu": "Results :  _MENU_",
            },
            "lengthMenu": [5, 10, 20, 50],
            "pageLength": 10
        });

        multiCheck(c1);
    </script>
@endsection