@extends('layouts.user.main')
@section('content')

    
    <script src="{{asset('assets/js/validation/telegram.js?v1')}}"></script>
    <div class="content d-flex flex-column flex-column-fluid" id="kt_content">
        <!--begin::Post-->
        <div class="post d-flex flex-column-fluid" id="kt_post">
            <!--begin::Container-->
            <div id="kt_content_container" class="container-xxl">
                <!--begin::Card-->
                <div class="card card-flush">
                    <!--begin::nickname model-->
                    <div class="modal fade" id="kt_modal_add_nickname" tabindex="-1" aria-hidden="true">
                        <!--begin::Modal dialog-->
                        <div class="modal-dialog modal-dialog-centered mw-650px">
                            <!--begin::Modal content-->
                            <div class="modal-content rounded">
                                <!--begin::Modal header-->
                                <div class="modal-header pb-0 border-0 justify-content-end">
                                    <!--begin::Close-->
                                    <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                                        <span class="fa fa-times"></span>
                                        <!--end::Svg Icon-->
                                    </div>
                                    <!--end::Close-->
                                </div>
                                <!--begin::Modal header-->
                                <!--begin::Modal body-->
                                <div class="modal-body scroll-y px-10 px-lg-15 pt-0 pb-15">
                                    <!--begin::Form-->
                                    <form id="add_nickname_telegram_form" class="form" action="{{ route('updateTelegramNickName') }}"
                                        method="POST">
                                        @csrf
                                        <!--begin::Heading-->
                                        <div class="mb-13 text-center">
                                            <!--begin::Title-->
                                            <h1 class="mb-3" id="nick_name_header">Add Nick Name</h1>
                                            <!--end::Title-->
                                        </div>
                                        <!--end::Heading-->
                                        @if ($errors->any())
                                            <div class="alert alert-danger alert-dismissible" role="alert">
                                                <ul>
                                                    @foreach ($errors->all() as $error)
                                                        <li>{{ $error }}</li>
                                                    @endforeach
                                                </ul>
                                                <button type="button" class="btn-close" data-bs-dismiss="alert"
                                                    aria-label="Close"></button>
                                            </div>
                                        @endif
                                        <!--begin::Manager drop-down-->
                                        <div class="d-flex flex-wrap gap-5 mb-10">
                                            <div class="fv-row w-100 flex-md-root">
                                                <label class="required form-label">Nick Name</label>
                                                <input type="text" class="form-control form-control-solid mb-2" name="nick_name" placeholder="Nick Name" value="{{ old('nick_name') }}"/>
                                            </div>
                                        </div>
                                        <!--end::Manager drop-down-->
                                        <input type="hidden" name="chatId" id="chatId" value="">
                                        <!--begin::Actions-->
                                        <div class="text-center">
                                            <button type="button" id="" data-bs-dismiss="modal"
                                                class="btn btn-light me-3">Cancel</button>
                                            <button type="reset" class="btn btn-secondary me-3 nick-name-reset-btn">Reset</button>
                                            <button type="submit" class="btn btn-primary me-3" id="nick_name_button">Submit</button>
                                            </button>
                                        </div>
                                        <!--end::Actions-->
                                    </form>
                                    <!--end:Form-->
                                </div>
                                <!--end::Modal body-->
                            </div>
                            <!--end::Modal content-->
                        </div>
                        <!--end::Modal dialog-->
                    </div>
                    <!--end::nickname model-->
                    <!--begin::Card body-->
                    <div class="modal fade" id="kt_modal_select_add_telegram_manager" tabindex="-1" aria-hidden="true">
                        <!--begin::Modal dialog-->
                        <div class="modal-dialog modal-dialog-centered mw-650px">
                            <!--begin::Modal content-->
                            <div class="modal-content rounded">
                                <!--begin::Modal header-->
                                <div class="modal-header pb-0 border-0 justify-content-end">
                                    <!--begin::Close-->
                                    <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                                        <span class="fa fa-times"></span>
                                        <!--end::Svg Icon-->
                                    </div>
                                    <!--end::Close-->
                                </div>
                                <!--begin::Modal header-->
                                <!--begin::Modal body-->
                                <div class="modal-body scroll-y px-10 px-lg-15 pt-0 pb-15">
                                    <!--begin::Form-->
                                    <form id="select_manager_for_telegram_form" class="form" action="{{ route('updateTelegramManager') }}"
                                        method="POST">
                                        @csrf
                                        <!--begin::Heading-->
                                        <div class="mb-13 text-center">
                                            <!--begin::Title-->
                                            <h1 class="mb-3">Add Manager</h1>
                                            <!--end::Title-->
                                        </div>
                                        <!--end::Heading-->
                                        @if ($errors->any())
                                            <div class="alert alert-danger alert-dismissible" role="alert">
                                                <ul>
                                                    @foreach ($errors->all() as $error)
                                                        <li>{{ $error }}</li>
                                                    @endforeach
                                                </ul>
                                                <button type="button" class="btn-close" data-bs-dismiss="alert"
                                                    aria-label="Close"></button>
                                            </div>
                                        @endif
                                        <!--begin::Manager drop-down-->
                                        <div class="d-flex flex-wrap gap-5 mb-10">
                                            <div class="fv-row w-100 flex-md-root">
                                                <label class="required form-label">Manager</label>
                                                <select class="js-example-basic-multiple form-select form-select-solid multi-select-option mb-2" name="managerIds[]" id="telegramLinkedManagers" data-control="select2" data-dropdown-parent="#kt_modal_select_add_telegram_manager" data-placeholder="Select Manager" multiple="multiple">
                                                    @if(isset($managers) && count($managers) > 0)
                                                        @foreach ($managers as $manager)
                                                            @php
                                                                $selectedManagerIds = explode(',', $manager->managerIds);
                                                            @endphp
                                                            <option value="{{ $manager->id }}" >
                                                                {{ $manager->loginId .' - '.$manager->name }}
                                                            </option>
                                                        @endforeach
                                                    @endif
                                                </select>
                                            </div>
                                        </div>
                                        <!--end::Manager drop-down-->
                                        <input type="hidden" name="telegramId" id="telegramId" value="">
                                        <input type="hidden" name="addExistingMangers" id="addExistingMangers" value="">
                                        <!--begin::Actions-->
                                        <div class="text-center">
                                            <button type="button" id="unlinkTelegramManager" class="btn btn-danger me-3" onclick="unlinkManager()">Unlink</button>
                                            <button type="button" id="" data-bs-dismiss="modal"
                                                class="btn btn-light me-3">Cancel</button>
                                            <button type="submit" class="btn btn-primary me-3">Submit</button>
                                            </button>
                                        </div>
                                        <!--end::Actions-->
                                    </form>
                                    <!--end:Form-->
                                </div>
                                <!--end::Modal body-->
                            </div>
                            <!--end::Modal content-->
                        </div>
                        <!--end::Modal dialog-->
                    </div>
                    <div class="modal fade" id="kt_modal_linked_managers_list" tabindex="-1" aria-hidden="true">
                        <!--begin::Modal dialog-->
                        <div class="modal-dialog modal-dialog-centered mw-650px">
                            <!--begin::Modal content-->
                            <div class="modal-content rounded">
                                <!--begin::Modal header-->
                                <div class="modal-header pb-0 border-0 justify-content-end">
                                    <!--begin::Close-->
                                    <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                                        <span class="fa fa-times"></span>
                                        <!--end::Svg Icon-->
                                    </div>
                                    <!--end::Close-->
                                </div>
                                <!--begin::Modal header-->
                                <!--begin::Modal body-->
                                <div class="modal-body scroll-y px-10 px-lg-15 pt-0 pb-15">
                                    <!--begin::Heading-->
                                    <div class="mb-13 text-center">
                                        <!--begin::Title-->
                                        <h1 class="mb-3">Linked Managers</h1>
                                        <!--end::Title-->
                                    </div>
                                    <div class="fv-row mb-10" id="linkedManagersList">
                                    </div>
                                    <!--end::Heading-->
                                    <!--begin::Actions-->
                                    <div class="text-center">
                                        <button type="button" id="" data-bs-dismiss="modal"
                                            class="btn btn-light me-3">Cancel</button>
                                        </button>
                                    </div>
                                    <!--end::Actions-->
                                    <!--end:Form-->
                                </div>
                                <!--end::Modal body-->
                            </div>
                            <!--end::Modal content-->
                        </div>
                        <!--end::Modal dialog-->
                    </div>
                    <div class="card-body py-4">
                        <!--begin::Table-->
                        <div class="table-responsive">
                            <table class="table align-middle table-row-dashed fs-6 gy-5 table-hover table-striped" id="kt_table_telegram_settings">
                                <!--begin::Table head-->
                                <thead>
                                    <!--begin::Table row-->
                                    <tr class="text-center fw-bolder fs-7 text-uppercase gs-0">
                                        <th class="min-w-100px">Id</th>
                                        <th class="min-w-100px">Name</th>
                                        <th class="min-w-100px">Chat Id</th>
                                        <th class="min-w-100px">User Name</th>
                                        <th class="min-w-100px">Nick Name</th>
                                        <th class="min-w-100px">Admin</th>
                                        <th class="min-w-100px">Manager</th>
                                        <th class="min-w-100px">Module</th>
                                        <th class="min-w-100px">Status</th>
                                        <th class="min-w-100px">Actions</th>
                                    </tr>
                                    <!--end::Table row-->
                                </thead>
                                <!--end::Table head-->
                                <!--begin::Table body-->
                                <tbody class="fw-bold">
                                </tbody>
                                <!--end::Table body-->
                            </table>
                        </div>
                        <!--end::Table-->
                    </div>
                </div>
                <!--end::Card-->
            </div>
            <!--end::Container-->
        </div>
        <!--end::Post-->
    </div>
    <script type="text/javascript">
        const ajaxUrl = @json(route('telegramSettings'));
        const token   = "{{ csrf_token() }}";
        const table   = $('#kt_table_telegram_settings');

        var dataColumns = [
            {
                data: 'id',
                name: 'id'
            },
            {
                data: 'first_name',
                name: 'first_name'
            },
            {
                data: 'chatId',
                name: 'chatId'
            },
            {
                data: 'user_name',
                name: 'user_name'
            },
            {
                data: 'nick_name',
                name: 'nick_name'
            },
            {
                data: 'isAdmin',
                name: 'isAdmin',
                render: function(data, type, full, meta) {
                            var isDisabled = (full.status != "{{CommonConstants::TELEGRAM_SETTINGS['STATUS_APPROVED']}}") ? 'disabled' : '';
                            var isChecked   = full.isAdmin == "{{CommonConstants::FLAG_AND_ALERT['IS_ADMIN_TRUE']}}" ? 'checked' : '';

                            return `<div class="d-flex justify-content-center flex-shrink-0"><div class="form-check form-check-sm form-check-custom mx-5 align-items-center">
                                <input class="form-check-input bulk-action" ${isDisabled} ${isChecked} type="checkbox" value="{{CommonConstants::FLAG_AND_ALERT['IS_ADMIN_TRUE']}}" id="update_admin_${full.id}" onclick="updateAdmin(${full.id})">
					        </div></div>`;
                },
                orderable: false,
                searchable: false
            },
            {
                data: 'status',
                name: 'status',
                render: function(data, type, full, meta) {
                    var telegramId          = full.id;
                    var label               = full.name ? 'Show Manager' : 'Add Manager';
                    var isDisabled          = (full.status != "{{ CommonConstants::TELEGRAM_SETTINGS['STATUS_APPROVED'] }}") ? 'disabled' : '';
                    var selectedManagerIds  = full.managerIds ? `'${full.managerIds}'` : "''";

                    return '<button onClick="addManager('+telegramId+', '+selectedManagerIds+')" class="btn bg-light-primary btn-bg-light btn-color-primary btn-sm px-2" title="Add Manager" '+isDisabled+'>'+label+'</button>';
                },
            },
            {
                data: 'moduleId',
                name: 'moduleId',
                render: function(data, type, full, meta) {  
                    var moduleTypes = @json(CommonConstants::TELEGRAM_BOT_SETTING['MODULE_TYPES']);
                    var moduleName  = Object.keys(moduleTypes).find(key => moduleTypes[key] === data);
                    moduleName      = moduleName.replaceAll('_', ' ');

                    return moduleName;
                }
            },
            {
                data: 'status',
                name: 'status',
                render: function(data, type, full, meta) {                            
                            var statusValue     =  (full.status == "{{CommonConstants::TELEGRAM_SETTINGS['STATUS_PENDING']}}") ? 'Pending' : (full.status == "{{CommonConstants::TELEGRAM_SETTINGS['STATUS_APPROVED']}}" ?  'Approved' : (full.status == "{{CommonConstants::TELEGRAM_SETTINGS['STATUS_BLOCK']}}") ? 'Blocked' : 'Rejected');
                            var className   = full.status == "{{CommonConstants::TELEGRAM_SETTINGS['STATUS_PENDING']}}" ? 'warning' : (full.status == "{{CommonConstants::TELEGRAM_SETTINGS['STATUS_APPROVED']}}" ?  'success' : (full.status == "{{CommonConstants::TELEGRAM_SETTINGS['STATUS_BLOCK']}}") ? 'info' : 'danger');
                            
                            statusValue     = (full.deleted_at != null) ? 'Deleted' : statusValue;
                            className       = (full.deleted_at != null) ? 'dark' : className;

                            return `<span class="badge badge-light-${className} text-uppercase">${statusValue}</span>`;
                },
            },
            {
                data: 'action',
                name: 'action',
                orderable: false,
                searchable: false
            },
        ];

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        $(document).ready(function() {
            makeDataTable(table, dataColumns);
        });

        function makeDataTable(table, dataColumns) {

        var reloadAjex = $(table).dataTable({
            // export buttons
            dom: "<'card-header align-items-center py-5 gap-2 gap-md-5'<'card-title'<'d-flex position-relative my-1'f>><'card-toolbar flex-row-fluid justify-content-end gap-6'<'custom-button-container'>>>" +
                    "<'row'<'col-sm-12'tr>>" +
                    "<'row'<'col-sm-12 col-md-5 gap-2 d-flex align-items-center justify-content-center justify-content-md-start'l<i>><'col-sm-12 col-md-7 d-flex align-items-center justify-content-center justify-content-md-end'p>>",
            processing: true,
            stateSave: true,
            "stateSaveParams": function (settings, data) {
                // data.search.search = '';
            },
            pageLength: 10,
            "lengthMenu": {!! json_encode(CommonConstants::DEFAULT_PAGE_PER_DATA) !!},
            language: {
                searchPlaceholder: "Search Telegram",
                search: ""
            },
            ajax: {
                url: "{{ route('telegramSettings') }}",
                method: "GET",
                data: function (d) {
                    d.status    = $('#status_filter').val();
                    d.moduleId  = $('#module_filter').val();
                },
            },
            columns: dataColumns,
            rowCallback: function(row, data) {
                $(row).addClass('text-center');
            },
            "stateLoadParams": function (settings, data) {
                if (data.select) {
                    data.select.rows = [];
                }
            },
            order: [
                [0, "desc"]
            ],
        }, );

        }

        function changeStatus(status, id, chatId) {
            const csrfToken = "{{ csrf_token() }}";
            const message = `Are you sure you want to ${status == '{{CommonConstants::TELEGRAM_SETTINGS['STATUS_APPROVED']}}' ? 'approve' : 'reject'} this chat?`;

            Swal.fire({
                title: message,
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Yes, change it!'
            }).then((result) => {
                if (result.isConfirmed) {
                    if (status == '{{CommonConstants::TELEGRAM_SETTINGS['STATUS_APPROVED']}}') {
                        $.ajax({
                            url: "{{ route('getLinkedManagers') }}",
                            method: 'GET',
                            data: {
                                telegramSettingsId: id,
                                chatId: chatId
                            },
                            success: function (response) {
                                let linkedManagers = response.linkedManagers;

                                updateStatus(status, id, csrfToken, linkedManagers);

                                if (!linkedManagers || linkedManagers === '') {
                                    location.reload();
                                } else {
                                    addManager(id, linkedManagers, true);
                                }
                            },
                            error: function (error) {
                                console.error(error);
                                updateStatus(status, id, csrfToken);
                            }
                        });
                    } else {
                        updateStatus(status, id, csrfToken);
                        location.reload();
                    }
                }
            });
        }

        function updateStatus(status, id, csrfToken, linkedManagers = null) {
            $.ajax({
                url: "{{ route('telegramStatusUpdate', ['id' => ':id']) }}".replace(':id', id),
                method: 'POST',
                data: {
                    status: status,
                    _token: csrfToken
                },
                success: function (response) {
                },
                error: function (error) {
                    console.error(error);
                }
            });
        }

        function updateAdmin(id) {
            var status      = $("#update_admin_"+id).prop('checked');
            const csrfToken = "{{ csrf_token() }}";
            $.ajax({
                url: "{{ route('telegramUpdateAdmin', ['id' => ':id']) }}".replace(':id', id),
                method: 'POST',
                data: {
                    status: status,
                    _token: csrfToken
                },
                success: function(response) {}
            });
        }

        function addManager(telegramId, selectedManager, existingMangers = false) {
            if (telegramId != '' && telegramId !== undefined) {
                $('#telegramId').val(telegramId);

                var selectedManagersArray = selectedManager ? selectedManager.split(',') : [];

                $('#telegramLinkedManagers').val(selectedManagersArray).trigger('change');
                $('#telegramLinkedManagers option').prop('disabled', false);

                if (selectedManagersArray.length === 0 || existingMangers) {
                    $('#unlinkTelegramManager').addClass('d-none');
                } else {
                    $('#unlinkTelegramManager').removeClass('d-none');
                }

                $('#addExistingMangers').val(existingMangers);
                $('#kt_modal_select_add_telegram_manager').modal('show');
            }
        }

        function addNickName(chatId, nickName) {
            if (chatId && chatId !== undefined) {
                $('#chatId').val(chatId);
                $('input[name="nick_name"]').val(nickName ? nickName : '');

                if (nickName) {
                    $('#nick_name_header').text('Edit Nick Name');
                    $('#nick_name_button').text('Update');
                } else {
                    $('#nick_name_header').text('Add Nick Name');
                    $('#nick_name_button').text('Submit');
                }

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

        function unlinkManager() {
            Swal.fire({
                title: "Are you sure?",
                text: "Do you want to unlink this!",
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Yes, unlink it!'
            }).then((result) => {
                if (result.isConfirmed) {
                    var telegramId  = $('#telegramId').val();
                    const csrfToken = "{{ csrf_token() }}";
                    $.ajax({
                        url: "{{ route('unlinkManager') }}",
                        method: 'POST',
                        data: {
                            telegramId: telegramId,
                            _token: csrfToken
                        },
                        success: function(response) {
                            window.location.reload();
                        }
                    });
                } else {
                    event.preventDefault();
                    return false;
                }
            });
        }

        function showLinkedManagers(managerIds) {
            if (!Array.isArray(managerIds) || managerIds.length === 0) {
                $('#linkedManagersList').html('<h3>There are no managers linked.</h3>')

                return;
            }

            var managerNames = [];
            $('#telegramLinkedManagers option').each(function() {
                if (managerIds.includes(parseInt($(this).val()))) {
                    managerNames.push($(this).text());
                }
            });

            $('#linkedManagersList').html('<ul style="text-align:left;">' + managerNames.map(m => `<li>${m}</li>`).join('') + '</ul>')
        }

        $(document).ready(function() {
            const moduleTypes = @json($moduleTypes);

            $('.card-toolbar').prepend(`
                <button class="btn btn-secondary" id="updateUsers">
                    <span class="fas fa-sync-alt me-2" id="updateUsersLoader"></span><span>Get Update</span>
                </button>
                <div class="d-flex align-items-center gap-2 gap-lg-3">
                    <!--begin::Filter menu-->
                    <div class="m-0">
                        <button class="btn btn-sm btn-flex btn-light btn-active-primary fw-bolder" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end">
                        <span class="svg-icon svg-icon-5 svg-icon-gray-500 me-1">
                            <i class="fas fa-filter"></i>
                        </span>Filter</button>
                        <div class="menu menu-sub menu-sub-dropdown w-250px w-md-300px" data-kt-menu="true" id="kt_menu_6220ee064de67">
                            <div class="px-7 py-5">
                                <div class="fs-5 text-dark fw-bolder">Filter</div>
                            </div>
                            <div class="separator border-gray-200"></div>
                            <div class="px-7 py-5">
                                <div class="mb-10">
                                    <label class="form-label fw-bold">Module:</label>
                                    <div>
                                        <select class="form-select form-select-solid" data-kt-select2="true" data-placeholder="Select Module" data-dropdown-parent="#kt_menu_6220ee064de67" data-allow-clear="true" id="module_filter">
                                            <option></option>
                                        </select>
                                    </div>
                                </div>
                                <div class="mb-10">
                                    <label class="form-label fw-bold">Status:</label>
                                    <div>
                                        <select class="form-select form-select-solid" data-kt-select2="true" data-placeholder="Select Status" data-dropdown-parent="#kt_menu_6220ee064de67" data-allow-clear="true" id="status_filter">
                                            <option></option>
                                            <option value="{{ CommonConstants::TELEGRAM_SETTINGS['STATUS_PENDING'] }}">{{ CommonConstants::TELEGRAM_SETTINGS['STATUS_PENDING_TEXT'] }}</option>
                                            <option value="{{ CommonConstants::TELEGRAM_SETTINGS['STATUS_APPROVED'] }}">{{ CommonConstants::TELEGRAM_SETTINGS['STATUS_APPROVED_TEXT'] }}</option>
                                            <option value="{{ CommonConstants::TELEGRAM_SETTINGS['STATUS_REJECT'] }}">{{ CommonConstants::TELEGRAM_SETTINGS['STATUS_REJECT_TEXT'] }}</option>
                                            <option value="{{ CommonConstants::TELEGRAM_SETTINGS['STATUS_BLOCK'] }}">{{ CommonConstants::TELEGRAM_SETTINGS['STATUS_BLOCK_TEXT'] }}</option>
                                            <option value="{{ CommonConstants::TELEGRAM_SETTINGS['STATUS_DELETE'] }}">{{ CommonConstants::TELEGRAM_SETTINGS['STATUS_DETELE_TEXT'] }}</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="d-flex justify-content-end">
                                    <button type="reset" class="btn btn-sm btn-light btn-active-light-primary me-2" data-kt-menu-dismiss="true" id="reset_filter">Reset</button>
                                    <button type="submit" class="btn btn-sm btn-primary" data-kt-menu-dismiss="true" id="apply_filter">Apply</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--end::Filter menu-->
                </div>
            `);

            const $moduleFilter = $('#module_filter');

            $.each(moduleTypes, function (moduleName, id) {
                const optionText = moduleName.split('_').join(' ');
                $moduleFilter.append(`<option value="${id}">${optionText}</option>`);
            });

            KTMenu.createInstances(); // Initialize dropdown
            $('#status_filter').select2(); // Initialize Select2 dropdown
            $('#module_filter').select2(); // Initialize Select2 dropdown

            $("#updateUsers").click(function(){
                var updateButton = $(this);

                $('#updateUsersLoader').addClass('loader');
                updateButton.prop('disabled', true);

                $.ajax({
                    url: "{{ route('getTelegramUpdate') }}",
                    method: "POST",
                    data: {
                        _token: token
                    },
                    success: function(response){
                        $('#updateUsersLoader').removeClass('loader');
                        updateButton.prop('disabled', false);
                        location.reload();
                    },
                    error: function(xhr, status, error) {
                        $('#updateUsersLoader').removeClass('loader');
                        updateButton.prop('disabled', false);
                        console.error(xhr.responseText);
                    }
                });
            });
        });

        function deleteTelegramUser(id) {
            Swal.fire({
					title: "Are you sure you want to delete this User?",
					text: "You won't be able to revert this!",
					icon: 'warning',
					showCancelButton: true,
					confirmButtonColor: '#3085d6',
					cancelButtonColor: '#d33',
					confirmButtonText: 'Yes, delete it!'
				}).then((result) => {
					if (result.isConfirmed) {
                        $.ajax({
                            url: "{{ route('getTelegramAlertCount', ['id' => ':id']) }}".replace(':id', id),
                            method: 'GET',
                            data: {
                                id: id
                            },
                            success: function (response) {
                                if (response.count == 0) {
                                    document.getElementById(`delete_${id}`).submit();
						            return true;
                                } else {
                                    location.reload();
                                    return true;
                                }
                            }, 
                            error: function (error) {
                                console.error(error);
                                return false;
                            }
                        });
					} else {
						event.preventDefault();
						return false;
					}
				});
        } 

        // Filter using status
        $(document).ready(function () {
            $('#apply_filter').on('click', function () {
                $('#kt_table_telegram_settings').DataTable().ajax.reload();
            });

            $('#reset_filter').on('click', function () {
                $('#status_filter').val('').trigger('change');
                $('#module_filter').val('').trigger('change');
                $('#kt_table_telegram_settings').DataTable().ajax.reload();
            });

            $('#kt_modal_select_add_telegram_manager').on('hidden.bs.modal', function () {
                if ($('#addExistingMangers').val() == 'true') {
                    location.reload();
                }
            });
        });
    </script>
@endsection