@include('layouts.header', ['title' => 'Temporary Assign List'])
<div class="wrapper">
    @include('layouts.navbar')
    @include('layouts.sidebar')

    <div class="content-page">
        <div class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-12">
                        <div class="page-title-box">
                            <div class="page-title-right"></div>
                        </div>
                    </div>
                </div>

                @include('components.project-details', ['project' => $project])

                <!-- Dynamic Table Wrapper -->
                <div class="row">
                    <div class="col-md-12">
                        <div class="card">

                            <!-- Card Header -->
                            <div class="card-header d-flex justify-content-between align-items-center">
                                <h4 class="header-title mb-0 text-end float-end">
                                    Temporary Assign List
                                </h4>
                                &nbsp;&nbsp;
                                {{-- <a href="{{ route('admin.export.demolition.survey', encrypt($project->id)) }}" class="btn btn-success"> Download Demolition Excel</a> --}}
                                {{-- <form class="d-flex ms-auto" method="GET">
                                    <input type="text" name="occupant_name" class="form-control me-2"
                                        placeholder="Occupant Name" value="{{ request('occupant_name') }}">

                                    <button type="submit" class="btn btn-light btn-sm">Search</button>
                                    <button type="button" class="btn btn-link reset-btn">Reset</button>
                                </form> --}}
                            </div>

                            <div class="card-body">
                                <div class="table-wrapper">
                                    <div style="overflow-x: auto; width: 100%;">

                                        <table id="basic-datatable"
                                            class="table table-striped dt-responsive nowrap w-100">
                                            <thead>
                                                <tr>
                                                    <th>Sl. No.</th>
                                                    <th>Map No.</th>
                                                    <th>Identification No</th>
                                                    <th>Map Location</th>
                                                    <th>Name of the Owner</th>
                                                    <th>Name of the Occupant of structure</th>

                                                    <th>Carpet Area(In Sq.mtr.)</th>
                                                    <th>Type of Use</th>
                                                    <th>Survey Date</th>
                                                    <th>Action</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @if ($surveys->isEmpty())
                                                    <tr>
                                                        <td colspan="14" class="text-center">No Records Found</td>
                                                    </tr>
                                                @else
                                                    @foreach ($surveys as $survey)
                                                        <tr>
                                                            <td>{{ $loop->iteration }}
                                                            {{-- <td>{{ $loop->iteration + ($surveys->currentPage() - 1) * $surveys->perPage() }} --}}
                                                            <td>{{ $survey->map_id ?? 'N/A' }}</td>
                                                            <td>{{ $survey->structure_id ?? 'N/A' }}</td>
                                                            <td>{{ $survey->map_location ?? 'N/A' }}</td>
                                                            <td>
                                                                @if ($survey->SurveyUserResidential->isNotEmpty())
                                                                    {{ $survey->SurveyUserResidential->pluck('structure_owner_name')->implode(', ') }}
                                                                @elseif ($survey->surveyUserOthers->isNotEmpty())
                                                                    {{ $survey->surveyUserOthers->pluck('owner_name')->implode(', ') }}
                                                                @elseif ($survey->surveyUserCommercial->isNotEmpty())
                                                                    {{ $survey->surveyUserCommercial->pluck('ownership')->filter()->implode(', ') }}
                                                                @else
                                                                    N/A
                                                                @endif
                                                            </td>
                                                            <td>
                                                                @if ($survey->SurveyUserResidential->isNotEmpty())
                                                                    {{ $survey->SurveyUserResidential->pluck('name_occupant_structure')->implode(', ') }}
                                                                @elseif ($survey->surveyUserOthers->isNotEmpty())
                                                                    {{ $survey->surveyUserOthers->pluck('name_of_occupant')->filter()->implode(', ') ?? 'N/A' }}
                                                                @elseif ($survey->surveyUserCommercial->isNotEmpty())
                                                                    {{ $survey->surveyUserCommercial->pluck('name_establishment_owner')->filter()->implode(', ') }}
                                                                @else
                                                                    N/A
                                                                @endif
                                                            </td>

                                                            <td>
                                                                @if ($survey->SurveyUserResidential->isNotEmpty())
                                                                    {{ $survey->SurveyUserResidential->pluck('total_area')->implode(', ') }}
                                                                @elseif ($survey->surveyUserOthers->isNotEmpty())
                                                                    {{ $survey->surveyUserOthers->pluck('total_area')->filter()->implode(', ') ?? 'N/A' }}
                                                                @elseif ($survey->surveyUserCommercial->isNotEmpty())
                                                                    {{ $survey->surveyUserCommercial->pluck('total_area')->filter()->implode(', ') }}
                                                                @else
                                                                    N/A
                                                                @endif
                                                            </td>
                                                            <td>
                                                                @if ($survey->structure_use == '1')
                                                                    Residential
                                                                @elseif ($survey->structure_use == '2')
                                                                    Commercial
                                                                @elseif ($survey->structure_use == '3')
                                                                    Resi-Cum-Comm
                                                                @elseif ($survey->structure_use == '4')
                                                                    Others
                                                                @else
                                                                    N/A
                                                                @endif
                                                            </td>

                                                            <td>{{ $survey->survey_date ? date('d M Y', strtotime($survey->survey_date)) : 'N/A' }}
                                                            </td>

                                                            <td>
                                                                @foreach($survey->SurveyUserResidential as $res)
                                                                @if($res->temp_assign_status == 0)
                                                                    <a href="#"
                                                                        class="text-reset fs-16 px-1 update-assign-status"
                                                                        data-survey-id="{{ $survey->id }}"
                                                                        data-project-id="{{ $survey->project_id }}"
                                                                        data-bs-toggle="tooltip" data-bs-placement="top"
                                                                        title="Tap to temporary assign">
                                                                        <i class="mdi mdi-list-status"></i>
                                                                    </a>
                                                                    @break
                                                                @endif
                                                            @endforeach


                                                                <a href="{{ route('admin.projectsurveydetails.index', ['projectId' => encrypt($project->id), 'surveyId' => encrypt($survey->id)]) }}"
                                                                    class="text-reset fs-16 px-1"
                                                                    data-bs-toggle="tooltip" data-bs-placement="top"
                                                                    title="View Survey Project">
                                                                    <i class="bi bi-eye-fill"></i>
                                                                </a>
                                                            </td>


                                                        </tr>
                                                    @endforeach
                                                @endif
                                            </tbody>
                                        </table>
                                    </div>

                                    <!-- Pagination -->
                                    {{-- <div class="mt-3 pagination-links">
                                        {{ $surveys->appends(request()->query())->links('pagination::bootstrap-5') }}
                                    </div> --}}

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

        <!-- Temporary Assign Modal -->
        <div class="modal fade" id="temporaryAssignModal" tabindex="-1" aria-labelledby="temporaryAssignModalLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-lg">
                <form id="temporaryAssignForm" method="POST" action="{{ route('admin.temporary.assign') }}">
                    @csrf
                    <input type="hidden" name="survey_id" id="modalSurveyId">
                    <input type="hidden" name="project_id" id="modalProjectId">

                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">Temporary Assign</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal"
                                aria-label="Close"></button>
                        </div>

                        <div class="modal-body">

                            <div class="mb-3">
                                <label>Location</label>
                                <select class="form-select" id="locationSelect" name="location_id" required>
                                    <option value="">Select Location</option>
                                    @foreach ($locations as $location)
                                        <option value="{{ $location->id }}">{{ $location->location }}</option>
                                    @endforeach
                                </select>
                            </div>

                            <div class="mb-3">
                                <label>Building</label>
                                <select class="form-select" id="buildingSelect" name="building_id" required>
                                    <option value="">Select Building</option>
                                </select>
                            </div>

                            <div class="mb-3">
                                <label>Wing</label>
                                <select class="form-select" id="wingSelect" name="wing_name" required>
                                    <option value="">Select Wing</option>
                                </select>
                            </div>

                            <div class="mb-3">
                                <label>Floor No</label>
                                <select class="form-select" id="floorSelect" name="floor_no" required>
                                    <option value="">Select Floor No</option>
                                </select>
                            </div>

                            <div class="mb-3">
                                <label>Room No (Room Type: Niwasi1)</label>
                                <select class="form-select" id="roomSelect" name="room_no" required>
                                    <option value="">Select Room</option>
                                </select>
                            </div>

                            <div class="mb-3">
                                <label>From Date</label>
                                <input type="text" id="alloted_from_date" name="alloted_from_date"
                                    class="form-control" placeholder="Enter From Date">
                            </div>

                            <div class="mb-3">
                                <label>To Date</label>
                                <input type="text" id="alloted_to_date" name="alloted_to_date"
                                    class="form-control" placeholder="Enter To Date">
                            </div>

                        </div>

                        <div class="modal-footer">
                            <button type="submit" class="btn btn-success me-2">Assign</button>
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
                        </div>

                    </div>
                </form>
            </div>
        </div>


        @include('layouts.footer')
    </div>
</div>

<!-- Vendor JS -->
<script src="{{ asset('assets/js/vendor.min.js') }}"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">

<script src="{{ asset('assets/js/app.min.js') }}"></script>

@include('admin.load-datatable')

<script>
    document.querySelector('.reset-btn').addEventListener('click', function() {
        window.location.href = "{{ url()->current() }}";
    });
</script>

<script>
    $(document).ready(function() {

        $('#alloted_from_date').datepicker({
            dateFormat: 'dd-mm-yy',
            changeMonth: true,
            changeYear: true,
            minDate: 0
        });

        $('#alloted_to_date').datepicker({
            dateFormat: 'dd-mm-yy',
            changeMonth: true,
            changeYear: true,
            minDate: 0
        });

        @if ($errors->any())
            @foreach ($errors->all() as $error)
                toastr.error("{{ $error }}");
            @endforeach
        @endif

        @if (session('success'))
            toastr.success("{{ session('success') }}");
        @endif

        @if (session('error'))
            toastr.error("{{ session('error') }}");
        @endif


        $('.update-assign-status').on('click', function() {
            const surveyId = $(this).data('survey-id');
            const projectId = $(this).data('project-id');
            $('#modalSurveyId').val(surveyId);
            $('#modalProjectId').val(projectId);

            // Reset all selects
            $('#locationSelect').val('').trigger('change');
            $('#buildingSelect').html('<option value="">Select Building</option>');
            $('#wingSelect').html('<option value="">Select Wing</option>');
            $('#floorSelect').html('<option value="">Select Floor No</option>');
            $('#roomSelect').html('<option value="">Select Room</option>');

            $('#temporaryAssignModal').modal('show');
        });

        // Fetch Buildings based on Location
        $('#locationSelect').on('change', function() {
            const locationId = $(this).val();
            $('#buildingSelect').html('<option>Loading...</option>');
            $.ajax({
                url: '{{ route('admin.get.buildings') }}',
                data: {
                    location_id: locationId
                },
                success: function(data) {
                    $('#buildingSelect').html('<option value="">Select Building</option>');
                    $.each(data, function(id, name) {
                        $('#buildingSelect').append(
                            `<option value="${id}">${name}</option>`);
                    });
                }
            });
        });

        // Fetch Wings based on Building
        $('#buildingSelect').on('change', function() {
            const buildingId = $(this).val();
            $('#wingSelect').html('<option>Loading...</option>');
            $.ajax({
                url: '{{ route('admin.get.wings') }}',
                data: {
                    building_id: buildingId
                },
                success: function(data) {
                    $('#wingSelect').html('<option value="">Select Wing</option>');
                    $.each(data, function(i, wing) {
                        $('#wingSelect').append(
                            `<option value="${wing}">${wing}</option>`);
                    });
                }
            });
        });

        // Fetch Floors based on Wing
        $('#wingSelect').on('change', function() {
            const buildingId = $('#buildingSelect').val();
            const wing = $(this).val();
            $('#floorSelect').html('<option>Loading...</option>');
            $.ajax({
                url: '{{ route('admin.get.floors') }}',
                data: {
                    building_id: buildingId,
                    wing_name: wing
                },
                success: function(data) {
                    $('#floorSelect').html('<option value="">Select Floor No</option>');
                    $.each(data, function(i, floor) {
                        $('#floorSelect').append(
                            `<option value="${floor}">${floor}</option>`);
                    });
                }
            });

            // Also fetch Rooms here (based on Niwasi1 room type)
            $('#roomSelect').html('<option>Loading...</option>');
            $.ajax({
                url: '{{ route('admin.get.rooms') }}',
                data: {
                    building_id: buildingId,
                    wing_name: wing,
                    room_type: 1
                }, // Niwasi1 = 1
                success: function(response) {
                    $('#roomSelect').html('<option value="">Select Room</option>');
                    $.each(response.rooms, function(i, room) {
                        $('#roomSelect').append(
                            `<option value="${room.id}">${room.room_no}</option>`
                            );
                    });
                }
            });

        });

    });
</script>


</body>