@extends('layouts.admin.app')
@section('content')

<div class="container-fluid py-4">
    <div class="row">
        <div class="col-12">
            <div class="card my-4">
                <div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
                    <div class="bg-gradient-primary shadow-primary border-radius-lg pt-4 pb-3">
                        <h6 class="text-white text-capitalize ps-3">Address List
                        <a href="{{route('admin.address.edit')}}"><i class="material-icons ms-auto text-white cursor-pointer" data-type="Add" style="float: right; margin: 0 25px;" data-bs-placement="top" title="" data-bs-original-title="Add Seo Meta">add</i></a>
                        </h6>
                    </div>
                </div>
                <br>
                @if(Session::has('success'))
                    <div class="alert alert-success text-white mx-3">
                        {{ Session::get('success') }}
                    </div>
                @endif
                @if(Session::has('error'))
                    <div class="alert alert-danger text-white mx-3">
                        {{ Session::get('error') }}
                    </div>
                @endif
                <div class="card-body px-0 pb-2">
                    <div class="table-responsive p-4">
                        <table class="table align-items-center mb-0" id="data_table">
                            <thead>
                                <tr>
                                    <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder">S.No</th>
                                    <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder">Disable</th> 
                                    <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder">Address</th>
                                    <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder"></th> 
                                </tr>
                            </thead>
                            <tbody>
                               
                                @foreach($address as $addr)
                                    @php
                                        
                                        $address_details = json_decode($addr->name, true);
                                        $addstring = implode(", ", $address_details);
                                    @endphp

                                <tr>
                                    <td class="align-middle text-center text-sm">{{ $addr->id }}</td>

                                    <td class="align-middle text-center text-sm">{{$addstring}}</td>
                                    <td class="align-middle text-center text-sm">
                                        
                                        <input type="checkbox" class="toggle-status" data-id="{{ $addr->id }}" {{ $addr->status =='0' ? 'checked' : '' }}>
                                    </td>
                                   <td>
                                        <a class="btn btn-primary" href="{{route('admin.address.edit',$addr->id)}}">
                                            <i class="material-icons"></i>Edit
                                        </a>
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    @include('layouts.admin.footer')
</div>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
     document.querySelectorAll('.toggle-status').forEach(function(element) {
    element.addEventListener('change', function() {
        var contactId = this.dataset.id;
        var status = this.checked ? 0 : 1;

        // Show SweetAlert confirmation dialog
        Swal.fire({
            title: 'Are you sure?',
            text: 'Do you want to update the status?',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Yes',
            cancelButtonText: 'No',
        }).then((result) => {
            if (result.isConfirmed) {
                // Send AJAX request
                $.ajax({
                    url: "{{route('admin.disable.contact')}}",
                    type: 'POST',
                    data: {
                        contact_id: contactId,
                        status: status,
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        // Show success message
                        Swal.fire({
                            title: 'Success',
                            text: response.message,
                            icon: 'success'
                        });
                    },
                    error: function(xhr, status, error) {
                        // Show error message
                        Swal.fire({
                            title: 'Error',
                            text: 'Failed to update contact status.',
                            icon: 'error'
                        });
                        console.error(xhr.responseText);
                    }
                });
            } else {
                // If user cancels the operation
                // Reset checkbox state
                $(this).prop('checked', !status);
            }
        });
    });
});
</script>

@endsection