@extends('layout.master')
@section('content')
    @php
        $userType = \App\Helpers\Helpers::getUserRole()->type_id ?? [];
    @endphp
    <input type="hidden" id="user_type" value="{{ $userType }}">
    <div class="page-heading-block py-4">
        <div class="page-title-block d-flex align-items-center justify-content-between">
            <nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{ route('settings.index') }}">Settings</a></li>
                    <li class="breadcrumb-item active" aria-current="page">Banners &amp; Notices</li>
                </ol>
            </nav>

            <div class="d-flex">
                <a href="{{ route('settings.banners-notices.add') }}" class="btn add-btn mx-3 w-auto"
                    id="add_residence_btn">+ Add
                    Banner/Notice</a>
            </div>
        </div>
    </div>

    <div class="page-main-content">
        <div>
            <div class="table-links-section">
                <ul class="nav nav-tabs">
                    <li class="nav-item">
                        <a class="nav-link mx-2 py-2 px-4 rounded-top table-links active" data-name="banners"
                            aria-current="page" href="javascript:void(0)">Banners</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link mx-2 py-2 px-4 rounded-top table-links " data-name="notices"
                            href="javascript:void(0)">Notices</a>
                    </li>
                </ul>
            </div>
            <div class="banner-info-block banners-block p-3">
                <div id="banners" class="banner-table-block">
                    <div class="banner-search-section d-flex justify-content-between align-items-center my-4">
                        <h4>Banners</h4>

                    </div>
                    <table class="table banner-notices-table" id="banner-table" style="width: 100%;">
                        <thead>
                            <tr>
                                <th scope="col" class="p-3">S.No</th>
                                <th scope="col" class="p-3">Title</th>
                                @if ($userType == 1)
                                    <th scope="col" class="align-middle" style="width:10%;">Estate Name</th>
                                @endif
                                <th scope="col" class="p-3">Description</th>
                                <th scope="col" class="p-3">Banner Image</th>
                                <th scope="col" class="p-3">Status</th>
                                <th scope="col" class="p-3">Order</th>
                                <th scope="col" class="p-3">Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            @if (!empty($banners) && count($banners) > 0)
                                @foreach ($banners as $banner)
                                    <tr>
                                        <td>{{ $loop->index + 1 }}</td>
                                        <td>{{ $banner->title ?? '-' }}</td>
                                        @if ($userType == 1)
                                            <td>{{ $banner->estate_name ?? '-' }}</td>
                                        @endif
                                        <td>{{ $banner->description ?? '-' }}</td>
                                        <td>
                                            @if (!empty($banner->public_url))
                                                <a href="{{ $banner->public_url }}" class="popup-link">
                                                    <img src="{{ $banner->public_url }}" alt="" width="50"
                                                        height="50">
                                                </a>
                                            @else
                                                {{ '-' }}
                                            @endif
                                        </td>
                                        <td>
                                            {{ $banner->status == '1' ? 'Active' : 'Inactive' }}
                                        </td>
                                        <td>
                                            <select name="order" id="" class="order_select"
                                                data-banner-notice-id="{{ $banner->id }}"
                                                data-estate-id="{{ $banner->estate_id ?? null }}" style="width: 50%;"
                                                {{ $userType != 1 && $user_estate_id != $banner->estate_id ?? null ? 'disabled' : '' }}>
                                                @for ($i = 1; $i <= $bannerCounts[$banner->estate_id ?? '']; $i++)
                                                    <option value="{{ $i }}"
                                                        {{ $banner->order == $i ? 'selected' : '' }}>{{ $i }}
                                                    </option>
                                                @endfor
                                            </select>
                                        </td>
                                        <td class="align-middle">
                                            <div class="dropdown">
                                                <button class="btn table-action-btn" onclick="toggleDropdown(this)">
                                                    <img src="{{ asset('assets/images/icons/menu_vertical.svg') }}"
                                                        alt="" width="25" height="25">
                                                </button>
                                                <div class="dropdown-menu" style="display: none;">
                                                    {{-- <a class="dropdown-item action-links {{ !empty($userType) ? ($userType == 1 || ($userType == 2 && (!empty($access['estate']) && in_array(2, $access['estate']))) ? '' : 'hide') : 'hide' }}"
                                                        href=""><img
                                                            src="{{ asset('assets/images/icons/eye.svg') }}"
                                                            alt="">&nbsp;Preview</a> --}}
                                                    <a class="dropdown-item action-links"
                                                        href="{{ route('settings.banners-notices.edit', ['id' => $banner->id]) }}"><img
                                                            src="{{ asset('assets/images/icons/edit.svg') }}"
                                                            alt="">&nbsp;Edit</a>
                                                    <a class="dropdown-item action-links {{ $userType != 1 && Auth::id() != $banner->created_by ? 'hide' : '' }}"
                                                        href="{{ route('settings.banners-notices.delete', ['id' => $banner->id]) }}"
                                                        onclick="return deleteConfirmation(event);"><img
                                                            src="{{ asset('assets/images/icons/delete.svg') }}"
                                                            alt="">&nbsp;Delete</a>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                            @endif
                        </tbody>
                    </table>
                </div>


                <div id="notices" class="notice-table-block hide">
                    <div class="notice-search-section d-flex justify-content-between align-items-center my-4">
                        <h4>Notices</h4>
                    </div>
                    <table class="table banner-notices-table" id="notice-table" style="width: 100%;">
                        <thead>
                            <tr>
                                <th scope="col" class="p-3">S.No</th>
                                <th scope="col" class="p-3">Title</th>
                                @if ($userType == 1)
                                    <th scope="col" class="align-middle" style="width:10%;">Estate Name</th>
                                @endif
                                <th scope="col" class="p-3">Description</th>
                                <th scope="col" class="p-3">Attachment Name</th>
                                <th scope="col" class="p-3">Status</th>
                                <th scope="col" class="p-3">Order</th>
                                <th scope="col" class="p-3">Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            @if (!empty($notices) && count($notices) > 0)
                                @foreach ($notices as $notice)
                                    <tr>
                                        <td>{{ $loop->index + 1 }}</td>
                                        <td>{{ $notice->title ?? '-' }}</td>
                                        @if ($userType == 1)
                                            <td>{{ $notice->estate_name ?? '-' }}</td>
                                        @endif
                                        <td>{{ $notice->description ?? '-' }}</td>
                                        <td>
                                            {{ $notice->file_name ?? '-' }}
                                        </td>
                                        <td>
                                            {{ $notice->status == '1' ? 'Active' : 'Inactive' }}
                                        </td>
                                        <td>
                                            <select name="order" id="" class="order_select"
                                                data-banner-notice-id="{{ $notice->id }}"
                                                data-estate-id="{{ $notice->estate_id ?? null }}" style="width: 50%;"
                                                {{ $userType != 1 && $user_estate_id != $notice->estate_id ?? null ? 'disabled' : '' }}>
                                                @for ($i = 1; $i <= count($notices); $i++)
                                                    <option value="{{ $i }}"
                                                        {{ $notice->order == $i ? 'selected' : '' }}>{{ $i }}
                                                    </option>
                                                @endfor
                                            </select>
                                        </td>
                                        <td class="align-middle">
                                            <div class="dropdown">
                                                <button class="btn table-action-btn" onclick="toggleDropdown(this)">
                                                    <img src="{{ asset('assets/images/icons/menu_vertical.svg') }}"
                                                        alt="" width="25" height="25">
                                                </button>
                                                <div class="dropdown-menu" style="display: none;">
                                                    {{-- <a class="dropdown-item action-links {{ !empty($userType) ? ($userType == 1 || ($userType == 2 && (!empty($access['estate']) && in_array(2, $access['estate']))) ? '' : 'hide') : 'hide' }}"
                                                        href=""><img
                                                            src="{{ asset('assets/images/icons/eye.svg') }}"
                                                            alt="">&nbsp;Preview</a> --}}
                                                    <a class="dropdown-item action-links"
                                                        href="{{ route('settings.banners-notices.edit', ['id' => $notice->id]) }}"><img
                                                            src="{{ asset('assets/images/icons/edit.svg') }}"
                                                            alt="">&nbsp;Edit</a>
                                                    <a class="dropdown-item action-links {{ $userType != 1 && Auth::id() != $notice->created_by ? 'hide' : '' }}"
                                                        href="{{ route('settings.banners-notices.delete', ['id' => $notice->id]) }}"
                                                        onclick="return deleteConfirmation(event);"><img
                                                            src="{{ asset('assets/images/icons/delete.svg') }}"
                                                            alt="">&nbsp;Delete</a>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                            @endif
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>


    @push('scripts')
        <!-- Add Splide Script-->
        <script>
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': `{{ csrf_token() }}`
                }
            });

            function deleteConfirmation(event) {
                event.preventDefault();
                const deleteUrl = event.currentTarget.getAttribute("href");

                Swal.fire({
                    title: "Are you sure?",
                    text: "You want to delete?",
                    icon: "warning",
                    showCancelButton: true,
                    confirmButtonText: "Yes, delete it!",
                    cancelButtonText: "No, cancel!",
                }).then((result) => {
                    if (result.isConfirmed) {
                        $.ajax({
                            url: deleteUrl,
                            type: "POST",
                            data: {},
                            success: function(response) {

                                if (response.success) {
                                    Swal.fire({
                                        text: "The item has been deleted.",
                                        icon: "success",
                                    }).then((result) => {
                                        location.reload();
                                    });
                                } else {
                                    Swal.fire("Error!", response.message, "warning");
                                }
                            },
                            error: function(xhr) {
                                Swal.fire("Error!", "Something went wrong. Please try again.", "error");
                            },
                        });
                    }
                });
            }
        </script>

        <script src="{{ asset('js/banners-notices-page.js') }}"></script>
    @endPush
@endsection