<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- crsf untuk ajax yg tidak pakai form -->
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <link rel="icon" type="image/png" href="{{ asset('assets/logo/logo.png') }}">
    <title>LSM Web Portal - BakmiGM</title>

    <!-- jQuery -->
    <script src="{{asset('assets/adminlte/plugins/jquery/jquery.min.js')}}"></script>
    <!-- Google Font: Source Sans Pro -->
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="{{asset('assets/adminlte/plugins/select2/css/select2.min.css')}}">
    <script src="{{asset('assets/tambahan/fontawesome.min.js')}}"></script>

    <!-- DataTables -->
    <link rel="stylesheet" href="{{asset('assets/adminlte/plugins/datatables-bs4/css/dataTables.bootstrap4.min.css')}}">
    <link rel="stylesheet" href="{{asset('assets/adminlte/plugins/datatables-responsive/css/responsive.bootstrap4.min.css')}}">
    <link rel="stylesheet" href="{{asset('assets/adminlte/plugins/datatables-buttons/css/buttons.bootstrap4.min.css')}}">
    <!-- Theme style -->
    <link rel="stylesheet" href="{{asset('assets/adminlte/dist/css/adminlte.min.css')}}">
    <link rel="stylesheet" href="{{asset('assets/adminlte/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css')}}">
    <!-- date flatpickr -->
    <link rel="stylesheet" href="{{asset('assets/tambahan/flatpickr.min.css')}}">
    <script src="{{asset('assets/tambahan/flatpickr.min.js')}}"></script>
</head>
<!-- <link rel="stylesheet" href="{{ asset('assets/adminlte/plugins/sweetalert2-theme-bootstrap-4/bootstrap-4.min.css') }}">
<link rel="stylesheet" href="{{ asset('assets/adminlte/plugins/toastr/toastr.min.css') }}">
<script src="{{ asset('assets/adminlte/plugins/jquery/jquery.min.js') }}"></script>
<script src="{{ asset('assets/adminlte/plugins/sweetalert2/sweetalert2.min.js') }}"></script>
<script src="{{ asset('assets/adminlte/plugins/toastr/toastr.min.js') }}"></script> -->

<body class="hold-transition sidebar-mini">
    <!-- <body class="hold-transition sidebar-mini sidebar-collapse"> -->
    <script>
        $(function() {
            checkPermButton();
            $('.select2').select2();
            $('[data-toggle="tooltip"]').tooltip()
            $('#id_data_table_view').DataTable({
                paging: false,
                searching: false,
                info: false,
                lengthChange: false,
                ordering: false,
                buttons: ["copy", "csv", "excel", "pdf", "print"],
                dom: 'B'
            });

            // Flatpickr init
            flatpickr(".calendar-picker-date", {
                dateFormat: "Y-m-d"
            });

            flatpickr(".calendar-picker-datetime", {
                enableTime: true,
                time_24hr: true,
                enableSeconds: true,
                dateFormat: "Y-m-d H:i:S", // <--- ini format sesuai permintaan
            });

            $(document).on('keypress', '.hanya_angka_v2', function(e) {
                // angka (48-57) atau titik (46)
                if ((e.which < 48 || e.which > 57) && e.which !== 46) {
                    e.preventDefault();
                }
            });

            $(document).on('input', '.hanya_angka', function(e) {
                let value = $(this).val();
                // Hilangkan semua karakter selain angka
                value = value.replace(/\D/g, '');
                $(this).val(value);
            });

            $('a[href]').on('click', function(e) {
                const target = $(this).attr('target');
                const href = $(this).attr('href');
                const data = $(this).attr('data');

                if (target !== '_blank' && !href.startsWith('javascript:') && href !== '#' && data !== 'back' && data !== 'delete') {
                    $('#loaderkdnknz').show();
                }
            });

        });

        function checkPermButton() {
            //button disembunyiin kalo gapunya akses
            const buttons = $('.button-cek-permission');
            const permissions = [];

            buttons.each(function() {
                permissions.push($(this).data('permission'));
            });

            $.ajax({
                url: "{{ route('ajax.checkPermissions') }}",
                method: "GET",
                data: {
                    permissions: permissions
                },
                success: function(response) {
                    buttons.each(function() {
                        const permission = $(this).data('permission');
                        if (response[permission] === false) {
                            $(this).hide(); // hide button
                        }
                    });
                },
                error: function() {
                    console.error('Gagal mengecek permission.');
                }
            });

        }

        function formatRupiah(angka) {
            let str = angka.toString();
            if (str.length >= 4) {
                return str.replace(/\B(?=(\d{3})+(?!\d))/g, ".");
            } else {
                return str;
            }
        }

        function notificationBeforeDelete(event, el) {
            event.preventDefault();
            Swal.fire({
                icon: 'question',
                text: 'Are you sure you want to proceed with this action?',
                showCancelButton: true,
                confirmButtonText: 'Yes, proceed',
                cancelButtonText: 'Cancel'
            }).then((result) => {
                if (result.isConfirmed) {
                    $("#delete-form").attr('action', $(el).attr('href'));
                    $("#delete-form").submit();
                }
            })
        }

        function notificationBeforeBack(event, el) {
            event.preventDefault(); // Cegah navigasi langsung

            Swal.fire({
                icon: 'question',
                text: 'Formulir akan dihapus, apakah Anda yakin ingin keluar?',
                showCancelButton: true,
                confirmButtonText: 'Ya, tidak masalah',
                cancelButtonText: 'Batal'
            }).then((result) => {
                if (result.isConfirmed) {
                    // Arahkan ke link tujuan
                    window.location.href = el.getAttribute('href');
                }
                // Jika dibatalkan, tidak melakukan apa-apa
            });

            return false; // Untuk berjaga-jaga, pastikan tidak langsung lanjut
        }

        // GET COOKIE
        function getCookie(name) {
            let value = "; " + document.cookie;
            let parts = value.split("; " + name + "=");
            if (parts.length === 2) return parts.pop().split(";").shift();
            return null;
        }
    </script>

    <div class="wrapper">
        @include('layouts/partials/navbar')
        @include('layouts/partials/sidebar')

        <div class="content-wrapper">
            <!-- Content Header (Page header) -->
            <section class="content-header">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-sm-12">
                            <ol class="breadcrumb float-sm-left">
                                @yield('title')
                            </ol>
                        </div>
                    </div>
                </div>
            </section>
            @include('layouts.partials.messages')
            @yield('content')
        </div>
        </section>
        <div id="loaderkdnknz" style="display: none;">
            Loading...
        </div>
        @include('layouts/partials/footer')
    </div>
    <style>
        #loaderkdnknz {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(255, 255, 255, 0.8);
            z-index: 9999;
            text-align: center;
            padding-top: 20%;
        }

        #loaderkdnknz i {
            font-size: 50px;
            color: #007bff;
            /* Ganti warna sesuai kebutuhan */
        }

        /* Fix untuk pagination yang terpotong */
        .card-body {
            overflow-x: auto;
        }

        .dataTables_wrapper {
            width: 100%;
        }

        .dataTables_wrapper .row {
            margin-left: 0;
            margin-right: 0;
        }

        .dataTables_wrapper .row > div {
            padding-left: 0;
            padding-right: 0;
        }

        /* Pastikan pagination tidak terpotong */
        .dataTables_paginate {
            margin-top: 10px !important;
            white-space: nowrap;
        }

        /* Fix untuk card header flexbox */
        .card-header .d-flex {
            width: 100%;
        }

        /* Responsive table wrapper */
        .table-responsive {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
        }

        /* Pastikan DataTables info dan pagination tidak overlap */
        .dataTables_info,
        .dataTables_paginate {
            padding: 10px 0;
        }

        @media (max-width: 767px) {
            .dataTables_wrapper .row {
                flex-direction: column;
            }

            .dataTables_info,
            .dataTables_paginate {
                text-align: center !important;
                margin-top: 10px;
            }
        }
    </style>

    <!-- Bootstrap 4 -->
    <script src="{{asset('assets/adminlte/plugins/bootstrap/js/bootstrap.bundle.min.js')}}"></script>
    <!-- DataTables  & Plugins -->
    <script src="{{asset('assets/adminlte/plugins/datatables/jquery.dataTables.min.js')}}"></script>
    <script src="{{asset('assets/adminlte/plugins/datatables-bs4/js/dataTables.bootstrap4.min.js')}}"></script>
    <script src="{{asset('assets/adminlte/plugins/datatables-responsive/js/dataTables.responsive.min.js')}}"></script>
    <script src="{{asset('assets/adminlte/plugins/datatables-responsive/js/responsive.bootstrap4.min.js')}}"></script>
    <script src="{{asset('assets/adminlte/plugins/datatables-buttons/js/dataTables.buttons.min.js')}}"></script>
    <script src="{{asset('assets/adminlte/plugins/datatables-buttons/js/buttons.bootstrap4.min.js')}}"></script>
    <!-- <script src="{{asset('assets/adminlte/plugins/jszip/jszip.min.js')}}"></script> -->
    <!-- <script src="{{asset('assets/adminlte/plugins/pdfmake/pdfmake.min.js')}}"></script> -->
    <!-- <script src="{{asset('assets/adminlte/plugins/pdfmake/vfs_fonts.js')}}"></script> -->
    <script src="{{asset('assets/adminlte/plugins/datatables-buttons/js/buttons.html5.min.js')}}"></script>
    <script src="{{asset('assets/adminlte/plugins/datatables-buttons/js/buttons.print.min.js')}}"></script>
    <script src="{{asset('assets/adminlte/plugins/datatables-buttons/js/buttons.colVis.min.js')}}"></script>
    <script src="{{asset('assets/adminlte/plugins/select2/js/select2.full.min.js')}}"></script>
    <!-- AdminLTE App -->
    <script src="{{asset('assets/adminlte/dist/js/adminlte.min.js')}}"></script>
    <script src="{{asset('assets/adminlte/plugins/jquery-validation/jquery.validate.min.js')}}"></script>
    <script>
        $(document).ready(function() {
            $('body').addClass('sidebar-collapse'); //untuk auto tutup biar lega

            //========================================================start- untuk tutup menu saat klik menu yang lain===============================================================
            $('.nav-item > a').on('click', function(e) {
                // Check if the clicked item has a submenu
                if ($(this).next('.nav-treeview').length) {
                    e.preventDefault();

                    // Collapse sibling submenus
                    $(this).parent().siblings().find('.nav-treeview').slideUp().parent().removeClass('menu-open menu-is-opening');
                }
            });

            // Handle submenu items
            $('.nav-treeview .nav-item > a').on('click', function(e) {
                if ($(this).next('.nav-treeview').length) {
                    e.preventDefault();

                    // Collapse sibling submenus within the same parent
                    $(this).parent().siblings().find('.nav-treeview').slideUp();
                }
            });
            //========================================================end- untuk tutup menu saat klik menu yang lain===============================================================
            //========================================================start- untuk cookie menu=============================================================== 
            // SIMPAN CLICK
            $('.nav-sidebar a').on('click', function() {
                let href = $(this).attr('href');
                document.cookie = "sidebar_active=" + href + "; path=/";
            });

            let active = getCookie("sidebar_active");
            if (!active || active === '#') return;

            let link = $(".nav-sidebar a[href='" + active + "']");
            if (!link.length) return;

            // aktifkan link paling anak
            link.addClass("active");

            // ambil semua li parent
            let parents = link.parents('li.nav-item');

            // loop
            parents.each(function(index) {
                let li = $(this);

                // buka level ini
                li.addClass('menu-open');
                li.children('ul.nav-treeview').css('display', 'block');

                // aktifkan <a> parent KECUALI root (yang paling luar)
                if (index !== parents.length - 1) {
                    li.children('a.nav-link').addClass('active');
                }
            });
            //========================================================end- untuk cookie menu===============================================================
        });
    </script>
</body>

</html>