@extends('admin.dashboard.layouts.app')

@section('title', panel_setting_title('Denetci Raporu'))

@push('style-libraries')
    <!-- Feather CSS -->
    <link rel="stylesheet" href="{{ asset('dashboard/plugins/feather/feather.css') }}">
    <!-- Datepicker CSS -->
    <link rel="stylesheet" href="{{ asset('dashboard/css/bootstrap-datetimepicker.min.css') }}">
    <!-- Datatables CSS -->
    <link rel="stylesheet" href="{{ asset('dashboard/plugins/datatables/datatables.min.css') }}">
    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
    <link rel="stylesheet" href="{{ asset('dashboard/css/dashboard.css') }}">
@endpush

@section('content')
    <div class="page-wrapper">
        <div class="content container-fluid">
            <!-- Page Header -->
            <div class=" card rounded-3    ">
                <div class="card-body p-4">
                    <div class="row align-items-center">
                        <div class="col-lg-8">
                            <!-- Title and Icon -->
                            <div class="d-flex align-items-center mb-2">
                                <div class="  rounded-3 p-2 me-3 svg-icon-bg">
                                    <i class="fa-solid fa-paste  svg-icon fs-4"></i>
                                </div>
                                <div>
                                    <h1 class=" fs-3 fw-semibold mb-0 text-white-primary-color">Denetci Raporu</h1>
                                    <nav aria-label="breadcrumb">
                                        <ol class="breadcrumb mb-2">
                                            <li class="breadcrumb-item">
                                                <a href="#"
                                                    class=" text-white-primary-color text-opacity-75 text-decoration-none d-flex align-items-center">
                                                    Raporlar </a>
                                            </li>
                                            <li class="text-white-primary-color breadcrumb-item  text-opacity-75 active"
                                                aria-current="page">
                                                Denetci Raporu </li>
                                        </ol>
                                    </nav>
                                </div>
                            </div>
                        </div>
                        <!-- Action Button -->
                        {{-- <div class="col-lg-4 text-lg-end mt-3 mt-lg-0">
                                        <a href="{{ route('admin.dashboard.user-management.user-create') }}"
                                            class="btn btn-yellow-custom d-inline-flex align-items-center gap-2">
                                            <i class="fas fa-plus-circle"></i>
                                            <span>Yeni Kullanıcı</span>
                                        </a>
                                    </div> --}}
                    </div>
                </div>
            </div>
            <!-- Page Header -->


            <!-- Denetçi Raporları Dışa Aktarma -->
            <div class="card">
                <div class="card-body">
                    <div class="row mb-4 align-items-center">
                        <div class="col mb-2">
                            <div class="form-floating">
                                <input type="date" class="form-control" id="date">
                                <label for="date">Tarih</label>
                            </div>
                        </div>
                        <div class="col mb-2">
                            <div class="form-floating">
                                <select class="form-select" id="rapor-tur">
                                    <option selected>Rapor Türü</option>
                                    <option>Müşteri Listesi</option>
                                    <option>Sipay Bank Customers Deposits</option>
                                    <option>Kredi Kartı Müşterisi Para Yatırma</option>
                                    <option>Bireysel Üye İşyeri Para Yatırma</option>
                                    <option>Kurumsal Üye İşyeri Para Yatırma</option>
                                    <option>Bireysel Üye İşyeri Para Çekme</option>
                                    <option>Kurumsal Üye İşyeri Para Çekme</option>
                                    <option>Müşteri Para Çekme</option>
                                    <option>Cüzdana B2C Gönderim</option>
                                    <option>Bankaya B2C Gönderimi (Gönderici Kurumsal Üye İşyeri)</option>
                                    <option>Bankaya B2C Gönderimi (Gönderici Bireysel Üye İşyeri)</option>
                                    <option>B2B (Gönderici Kurumsal Alıcı Kurumsal Üye İşyeri)</option>
                                    <option>B2B (Gönderici Kurumsal Alıcı Bireysel Üye İşyeri)</option>
                                    <option>B2B (Gönderici Bireysel Alıcı Kurumsal Üye İşyeri)</option>
                                    <option>B2B (Gönderici Bireysel Alıcı Bireysel Üye İşyeri)</option>
                                    <option>C2C Para Transferi</option>
                                    <option>Kurumsal Müşteri Sanal POS İşlemi</option>
                                    <option>Kurumsal Üye İşyeri Sanal POS İşlemi</option>
                                    <option>Bireysel Üye İşyeri Listesi</option>
                                </select>
                                <label for="rapor-tur">Rapor Türü</label>
                            </div>

                        </div>
                        <div class="col mb-2">
                            <div class="form-floating">
                                <select class="form-select" id="cvs">
                                    <option selected>CVS</option>
                                    <option value="1">EXCEL</option>
                                </select>
                                <label for="cvs">CVS</label>
                            </div>
                        </div>
                        <div class="col mb-2 d-flex text-end align-items-end  gap-3 justify-conent-end ms-auto">
                            <div class="d-flex align-items-end text-end gap-3 justify-conent-end ms-auto">
                                <div class="">
                                    <button class="text-nowrap btn btn-primary-custom py-3 w-100"><i
                                            class="fa-solid fa-upload me-2"></i>Dışarı
                                        Aktar</button>
                                </div>
                                <div class="">
                                    <button class="text-nowrap btn rounded-2 btn-info-custom py-3 w-100"><i
                                            class="fa-solid fa-list me-2"></i>Dışa Aktarılan Rapor
                                        Geçmişi</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- /Denetçi Raporları Dışa Aktarma -->

        </div>
    </div>
@endsection

@push('script-libraries')
    <!-- Feather Icon JS -->
    <script src="{{ asset('dashboard/js/feather.min.js') }}"></script>
    <!-- Slimscroll JS -->
    <script src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
    <script src="{{ asset('dashboard/plugins/slimscroll/jquery.slimscroll.min.js') }}"></script>
    <!-- Datatable JS -->
    <script src="{{ asset('dashboard/plugins/datatables/datatables.min.js') }}"></script>
    <!-- Daterangepicker JS ve Moment JS -->

    <script src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
@endpush


@push('scripts')
    <script>
        $(document).ready(function() {
            // Tarih aralığı picker başlatma
            $('#dateRange').daterangepicker({
                autoUpdateInput: false,
                locale: {
                    format: 'DD.MM.YYYY',
                    separator: ' - ',
                    applyLabel: 'Seç',
                    cancelLabel: 'Temizle',
                    fromLabel: 'Başlangıç',
                    toLabel: 'Bitiş',
                    customRangeLabel: 'Özel',
                    weekLabel: 'Hf',
                    daysOfWeek: ['Pz', 'Pt', 'Sa', 'Ça', 'Pe', 'Cu', 'Ct'],
                    monthNames: ['Ocak', 'Şubat', 'Mart', 'Nisan', 'Mayıs', 'Haziran', 'Temmuz', 'Ağustos',
                        'Eylül', 'Ekim', 'Kasım', 'Aralık'
                    ],
                    firstDay: 1
                }
            });

            $('#dateRange').on('apply.daterangepicker', function(ev, picker) {
                $(this).val(picker.startDate.format('DD.MM.YYYY') + ' - ' + picker.endDate.format(
                    'DD.MM.YYYY'));
            });

            $('#dateRange').on('cancel.daterangepicker', function(ev, picker) {
                $(this).val('');
            });

        });
    </script>
@endpush