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

@section('title', panel_setting_title("Para Yatırma İşlemleri"))

@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')}}">
@endpush
<style>
    .sidebar {
        overflow-y: auto !important;
        max-height: 100vh; /* Ekran boyutuna göre yükseklik ayarla */
    }

</style>
@section('content')
    <div class="page-wrapper">
        <div class="content container-fluid">
            <!-- Page Header -->
            <div class="content-page-header ">
                <h5>Para Yatırma İşlemleri</h5>
            </div>
            <!-- /Page Header -->

            <div class="row">
                <div class="col-sm-12">
                    <div class="card-table">

                        <div class="row mb-4 gap-2">
                            <div class="col-md-2">
                                <div class="input-group">
                                    <input type="text" class="form-control" placeholder="Kullanıcı GSM">
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="input-group">
                                    <input type="text" class="form-control" placeholder="Minimum tutar">
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="input-group">
                                    <input type="text" class="form-control" placeholder="Maximum tutar">
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="input-group">
                                    <input type="text" class="form-control" placeholder="İşlem ID">
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="input-group">
                                    <input type="text" class="form-control" placeholder="Üye İş Yeri Adı">
                                </div>
                            </div>
                            <div class="col-md-2">
                                <select class="form-select">
                                    <option selected>Ödeme Aracı</option>
                                    <option>Havale / Eft</option>
                                    <option>Kredi Kartı</option>
                                    <option>Kredi Kartı Formu</option>
                                    <option>{{ panel_setting_item("brand_name") }} Bank Account</option>
                                    <option>Fast</option>
                                    <option>PO</option>
                                    <option>AT</option>
                                    <option>EP</option>
                                    <option>IN</option>
                                    <option>IV</option>
                                    <option>VP</option>
                                    <option>CT</option>
                                    <option>BR</option>
                                    <option>UA</option>
                                    <option>VL</option>
                                    <option>KI</option>
                                </select>
                            </div>
                            <div class="col-md-2">
                                <select class="form-select">
                                    <option selected>Durum</option>
                                    <option>Tür 1</option>
                                    <option>Tür 2</option>
                                </select>
                            </div>
                            <div class="col-md-2">
                                <select class="form-select">
                                    <option selected>Üye İş Yeri</option>
                                    <option>Üye İş Yeri</option>
                                    <option>Alt Üye İş Yeri</option>
                                </select>
                            </div>
                            <div class="col-md-2 d-flex align-items-center">
                                <button class="btn btn-danger w-100 me-2">Ara</button>
                            </div>
                        </div>

                        <div class="row mb-4 justify-content-between">
                            <div class="col-sm-4 d-flex align-items-center gap-2">
                                <button id="applybtn" class="btn btn-primary">Ara</button>
                                <button id="applybtn" class="btn btn-primary">Dışa Aktar</button>
                            </div>
                        </div>

                        <div class="table-div col-md-12 p-0 m-0">
                            <table id="example" style="width: 100%;">
                                <thead>
                                <tr>
                                    <th>#</th>
                                    <th>İşlem ID</th>
                                    <th>Durum</th>
                                    <th>GSM Numarası</th>
                                    <th>Üye İş Yeri Adı</th>
                                    <th>Ödeme Aracı</th>
                                    <th>Tutar</th>
                                    <th>Komisyon</th>
                                    <th>İşlemler</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr>
                                    <td>
                                        <label class="checkbox checkbox-ebony">
                                            <input name="merchantCheckbox[]" value="1" type="checkbox" class="bulk-action bulk-checkbox">
                                            <span class="input-span"></span>
                                        </label>
                                    </td>
                                    <td>zDscs-efS-FE23-45678-322342</td>
                                    <td>Tamamlandı</td>
                                    <td>+905363458249</td>
                                    <td>Özlem Tekbıyık</td>
                                    <td>Havale / EFT</td>
                                    <td>170000.00 ₺</td>
                                    <td>0.00 ₺</td>
                                    <td class="d-flex align-items-center">
                                        <button class="btn btn-primary">Detaylar</button>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <label class="checkbox checkbox-ebony">
                                            <input name="merchantCheckbox[]" value="1" type="checkbox" class="bulk-action bulk-checkbox">
                                            <span class="input-span"></span>
                                        </label>
                                    </td>
                                    <td>InPBp-x7-TM11-75168-021224</td>
                                    <td>Tamamlandı</td>
                                    <td>+905363458249</td>
                                    <td>Özlem Tekbıyık</td>
                                    <td>Havale / EFT</td>
                                    <td>300000.00 ₺</td>
                                    <td>0.00 ₺</td>
                                    <td class="d-flex align-items-center">
                                       <button class="btn btn-primary">Detaylar</button>
                                    </td>
                                </tr>

                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/jquery.dataTables.min.css">
    <script src="https://code.jquery.com/jquery-3.7.0.js"></script>
    <script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
    <script>
        var table = new DataTable('#example', {
            language: {
                url: '//cdn.datatables.net/plug-ins/1.13.6/i18n/tr.json',
            },
        });
    </script>
    <style>
        .dataTables_length label:before {
            content: "";
            margin-right: 5px;
            font-size: 12px;
        }
        .dataTables_length label:after {
            content: "";
            margin-left: 5px;
            font-size: 12px;
        }
        #example_wrapper {
            margin: 25px 10px 25px 10px;
        }
        .table-div {
            background-color: white;
            border-radius: 25px;
            box-shadow:  0px 0px 15px -7px rgba(0, 0, 0, 1);
            overflow: auto;width: 97%;
            margin-left: 25px;
        }
    </style>
@endsection