@extends('backend.master')
@section('title')
    সনদপত্র
@endsection
@section('body')
    @if(Auth::user()->user_type == 0 || Auth::user()->user_type == 1 || strpos(Auth::user()->permission, 'A') !== false
    || strpos(Auth::user()->permission, 'B') !== false || strpos(Auth::user()->permission, 'C') !== false
    || strpos(Auth::user()->permission, 'D') !== false || strpos(Auth::user()->permission, 'G') !== false
    || strpos(Auth::user()->permission, 'K') !== false || strpos(Auth::user()->permission, 'ت') !== false
    || strpos(Auth::user()->permission, 'E') !== false)
        <!-- start page title -->
        <div class="row">
            <div class="col-12">
                <div class="page-title-box d-flex align-items-center justify-content-between">
                    <h4 class="mb-0 font-size-18">সনদপত্র লিস্ট</h4>

                    <div class="page-title-right">
                        <ol class="breadcrumb m-0">
                            <li class="breadcrumb-item"><a href="{{ route('sanad.index') }}">সনদপত্র</a></li>
                            <li class="breadcrumb-item active">সনদপত্র লিস্ট</li>
                        </ol>
                    </div>

                </div>
            </div>
        </div>
        <!-- end page title -->
        <div class="row">
            <div class="col-12 m-auto">
                <div class="card">
                    <div class="card-body">
                        <div class="row mb-2">
                            <div class="col-sm-4">
                                <div class="search-box mr-2 mb-2 d-inline-block">
                                    <div class="position-relative">

                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-8">
                                <div class="text-sm-right">
                                    <a href="{{ route('sanad.index') }}" class="btn btn-success btn-rounded waves-effect waves-light mb-2 mr-2"><i class="mdi mdi-plus mr-1"></i>আবেদন করুন</a>
                                </div>
                            </div><!-- end col-->
                            <div class="col-sm-12">
                                <form id="search">
                                    <div class="row">
                                        <div class="col-md-3 col-sm-12">
                                            <div class="form-group mb-2">
                                                <label for="sanad_type" class="form-label">সনদ টাইপ</label>
                                                <select class="form-control select2" id="sanad_type">
                                                    <option value="" disabled {{ !isset($_GET['sanad_type']) ? 'selected' : '' }}>—নির্বাচন করুন—</option>
                                                    @if(Auth::user()->user_type == 0 || Auth::user()->user_type == 1 || strpos(Auth::user()->permission, 'A') !== false)
                                                    <option value="1" {{ isset($_GET['sanad_type']) && $_GET['sanad_type'] == '1' ? 'selected' : '' }}>চারিত্রিক সনদ</option>
                                                    @endif
                                                    @if(Auth::user()->user_type == 0 || Auth::user()->user_type == 1 || strpos(Auth::user()->permission, 'B') !== false)
                                                    <option value="2" {{ isset($_GET['sanad_type']) && $_GET['sanad_type'] == '2' ? 'selected' : '' }}>নাগরিকত্ব/পরিচয় পত্র</option>
                                                    @endif
                                                    @if(Auth::user()->user_type == 0 || Auth::user()->user_type == 1 || strpos(Auth::user()->permission, 'C') !== false)
                                                    <option value="3" {{ isset($_GET['sanad_type']) && $_GET['sanad_type'] == '3' ? 'selected' : '' }}>অবিবাহিত সনদ</option>
                                                    @endif
                                                    @if(Auth::user()->user_type == 0 || Auth::user()->user_type == 1 || strpos(Auth::user()->permission, 'D') !== false)
                                                    <option value="4" {{ isset($_GET['sanad_type']) && $_GET['sanad_type'] == '4' ? 'selected' : '' }}>ভূমিহীন সনদ</option>
                                                    @endif
                                                    @if(Auth::user()->user_type == 0 || Auth::user()->user_type == 1 || strpos(Auth::user()->permission, 'G') !== false)
                                                    <option value="5" {{ isset($_GET['sanad_type']) && $_GET['sanad_type'] == '5' ? 'selected' : '' }}>প্রকৃত বাঁক ও শ্রবণ প্রতিবন্ধী</option>
                                                    @endif
                                                    @if(Auth::user()->user_type == 0 || Auth::user()->user_type == 1 || strpos(Auth::user()->permission, 'K') !== false)
                                                    <option value="6" {{ isset($_GET['sanad_type']) && $_GET['sanad_type'] == '6' ? 'selected' : '' }}>উত্তরাধিকার সনদ</option>
                                                    @endif
                                                    @if(Auth::user()->user_type == 0 || Auth::user()->user_type == 1 || strpos(Auth::user()->permission, 'ت') !== false)
                                                    <option value="7" {{ isset($_GET['sanad_type']) && $_GET['sanad_type'] == '7' ? 'selected' : '' }}>পারিবারিক সনদ</option>
                                                    @endif
                                                    @if(Auth::user()->user_type == 0 || Auth::user()->user_type == 1 || strpos(Auth::user()->permission, 'E') !== false)
                                                    <option value="8" {{ isset($_GET['sanad_type']) && $_GET['sanad_type'] == '8' ? 'selected' : '' }}>ওয়ারিশ সনদ</option>
                                                    @endif
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-3 col-sm-12">
                                            <div class="form-group mb-2">
                                                <label for="sanad_status" class="form-label">সনদ স্ট্যাটাস</label>
                                                <select class="form-control select2" id="sanad_status">
                                                    <option value="all" {{ isset($_GET['sanad_status']) && $_GET['sanad_status'] == 'all' ? 'selected' : '' }}>—সকল স্ট্যাটাস—</option>
                                                    <option value="0" {{ isset($_GET['sanad_status']) && $_GET['sanad_status'] == '0' ? 'selected' : (Auth::user()->user_type == 0 ? 'selected' : '') }}>পেন্ডিং</option>
                                                    <option value="1" {{ isset($_GET['sanad_status']) && $_GET['sanad_status'] == '1' ? 'selected' : '' }}>অনুমোদিত</option>
                                                    <option value="2" {{ isset($_GET['sanad_status']) && $_GET['sanad_status'] == '2' ? 'selected' : '' }}>বাতিল</option>
                                                    <option value="3" {{ isset($_GET['sanad_status']) && $_GET['sanad_status'] == '3' ? 'selected' : '' }}>প্রতিবেদন</option>
                                                    <option value="4" {{ isset($_GET['sanad_status']) && $_GET['sanad_status'] == '4' ? 'selected' : '' }}>পেন্ডিং পেমেন্ট</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-3 col-sm-12">
                                            <div class="form-group mb-2">
                                                <label for="sanad_number" class="form-label">সনদ নাম্বার</label>
                                                <input type="text" class="form-control" id="sanad_number" value="{{ isset($_GET['sanad_number']) && $_GET['sanad_number'] }}">
                                            </div>
                                        </div>
                                        <div class="col-md-3 col-sm-12">
                                            <div class="form-group mb-2">
                                                <label for="tracking_id" class="form-label">ট্র্যাকিং নাম্বার</label>
                                                <input type="text" class="form-control" id="tracking_id" value="{{isset( $_GET['tracking_id']) && $_GET['tracking_id'] }}">
                                            </div>
                                        </div>
                                        <div class="col-md-3 col-sm-12">
                                            <div class="form-group mb-2">
                                                <label for="citizen_info" class="form-label">নাগরিক ইনফো</label>
                                                <input type="text" class="form-control" id="citizen_info" value="{{ isset($_GET['citizen_info']) && $_GET['citizen_info'] }}" placeholder="নাম/এনআইডি/জন্ম নিবন্ধন/মোবাইল">
                                            </div>
                                        </div>
                                        <div class="col-md-3 col-sm-12">
                                            <div class="form-group mb-2">
                                                <label for="citizen_info" class="form-label">ওয়ার্ড</label>
                                                <select class="form-control select2" id="word_no">
                                                    <option value="all" {{ isset($_GET['word_no']) && $_GET['word_no'] == 'all' ? 'selected' : '' }}>—সকল ওয়ার্ড —</option>
                                                    @foreach(words() as $word)
                                                        <option value="{{ $word->number }}" {{ isset($_GET['word_no']) && $_GET['word_no'] == $word->number ? 'selected' : '' }}>{{ NumToBn($word->number) }}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-3 col-sm-12">
                                            <div class="form-group mb-2">
                                                <label for="citizen_info" class="form-label">রাস্তা / মহল্লা</label>
                                                <select class="form-control select2" id="village_id">
                                                    <option {{ isset($_GET['village_id']) && $_GET['village_id'] == 'all' ? 'selected' : '' }} value="all" data-select2-id="73">— সকল মহল্লা —</option>
                                                    @foreach($villages as $word_no => $items)
                                                        <optgroup label="Word No {{ $word_no }}">
                                                            @foreach($items as $item)
                                                                <option value="{{ $item->bn_village_name }}" {{ isset($_GET['village_id']) && $_GET['village_id'] == $item->bn_village_name ? 'selected' : '' }}>{{ $item->bn_village_name }}</option>
                                                            @endforeach
                                                        </optgroup>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-3 col-sm-12">
                                            <div class="form-group mb-2">
                                                <label for="payment_status" class="form-label">পেমেন্ট স্ট্যাটাস</label>
                                                <select class="form-control select2" id="payment_status">
                                                    <option value="all" {{ isset($_GET['payment_status']) && $_GET['payment_status'] == 'all' ? 'selected' : '' }}>সকল</option>
                                                    <option value="1" {{ isset($_GET['payment_status']) && $_GET['payment_status'] == '1' ? 'selected' : '' }}>সফল</option>
                                                    <option value="0" {{ isset($_GET['payment_status']) && $_GET['payment_status'] == '0' ? 'selected' : '' }}>পেন্ডিং</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-3 col-sm-12">
                                            <div class="form-group mb-2">
                                                <label class="form-label"></label>
                                                <button type="submit" class="btn btn-light mb-2 btn-block mt-2"><i class="bx bx-search-alt"></i> সার্চ</button>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>

                        <div id="tag_container">
                            @if(isset($sanad))
                                @include($view)
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @else
        @include('backend.errors.404')
    @endif
@endsection
@section('script')
    <script>
        function print(url) {
            var h = $(window).height();
            var w = $(window).width();
            window.open(url, '_blank', 'height=' + h + ',width=' + w + ',scrollbars=yes,status=no');
        }

        const SANAD_SEARCH_URL = "{{ route('sanad.search') }}"; // update if needed

        function showLoading() {
            const div = `
        <div class="col-md-12 text-center mb-2">
            <div class="spinner-grow text-success m-1" role="status"><span class="sr-only">Loading...</span></div>
            <div class="spinner-grow text-info m-1" role="status"><span class="sr-only">Loading...</span></div>
            <div class="spinner-grow text-warning m-1" role="status"><span class="sr-only">Loading...</span></div>
        </div>`;
            $("#tag_container").empty().html(div);
        }

        function persistFilters(filters) {
            Object.entries(filters).forEach(([k, v]) => localStorage.setItem(`${k}_key`, v ?? ""));
        }

        function loadFilters() {
            const keys = ["sanad_type", "sanad_status", "sanad_number", "tracking_id", "citizen_info", "word_no", "village_id", "payment_status"];
            const obj = {};
            keys.forEach(k => obj[k] = localStorage.getItem(`${k}_key`) ?? "");
            return obj;
        }

        function readFiltersFromForm() {
            return {
                sanad_type: $("#sanad_type").val(),
                sanad_status: $("#sanad_status").val(),
                sanad_number: $("#sanad_number").val(),
                tracking_id: $("#tracking_id").val(),
                citizen_info: $("#citizen_info").val(),
                word_no: $("#word_no").val(),
                village_id: $("#village_id").val(),
                payment_status: $("#payment_status").val(),
            };
        }

        function pushFiltersToUrl(filters, extraParams = {}) {
            const urlParams = new URLSearchParams(window.location.search);
            Object.entries({ ...filters, ...extraParams }).forEach(([k, v]) => urlParams.set(k, v ?? ""));
            const newUrl = `${SANAD_SEARCH_URL}?${urlParams.toString()}`;
            window.history.pushState(null, null, newUrl);
        }

        function getData(page) {
            const filters = loadFilters();
            $.ajax({
                url: `${SANAD_SEARCH_URL}?page=${encodeURIComponent(page)}`,
                type: "GET",
                data: filters,
                dataType: "html",
                beforeSend: showLoading,
            }).done(function (data) {
                $("#tag_container").empty().html(data);
                pushFiltersToUrl(filters, { page });
            }).fail(() => alert("No response from server"));
        }

        $(function () {
            // Prefill form from storage
            const stored = loadFilters();
            Object.entries(stored).forEach(([key, val]) => {
                if (val) $(`#${key}`).val(val).trigger("change");
            });

            // Validation + submit
            $("#search").on("submit", function (e) {
                e.preventDefault();

                const filters = readFiltersFromForm();

                // ✅ Validation for sanad_type
                if (!filters.sanad_type || filters.sanad_type === "" || filters.sanad_type === null) {
                    alert("অনুগ্রহ করে একটি সনদ টাইপ নির্বাচন করুন।");
                    $("#sanad_type").focus();
                    return false;
                }

                persistFilters(filters);

                $.ajax({
                    type: "GET",
                    url: SANAD_SEARCH_URL,
                    data: filters,
                    beforeSend: showLoading,
                    success: function (res) {
                        pushFiltersToUrl(filters);
                        $("#tag_container").empty().html(res);
                    },
                    error: function () {
                        alert("Search failed. Please try again.");
                    }
                });
            });

            // Pagination click
            $(document).on("click", ".pagination a", function (e) {
                e.preventDefault();
                const href = $(this).attr("href") || "";
                const page = href.split("page=")[1];
                if (page) {
                    $("li.page-item").removeClass("active");
                    $(this).closest("li.page-item").addClass("active");
                    getData(page);
                }
            });

            // Hash change navigation
            $(window).on("hashchange", function () {
                if (window.location.hash) {
                    const page = window.location.hash.replace("#", "");
                    if (!isNaN(page) && Number(page) > 0) getData(page);
                }
            });
        });
    </script>
@endsection