@extends('merchant.app')

@section('title', panel_setting_title("İşlem Dökümü"))

@section('content')
    <main class="mt-120  " id="main">
        <h6 class="my-lg-4 my-0 mb-lg-0 ">İşlem Döküm</h6>
        @include("merchant.Components.statistics")
        <div class="row mt-4 ">
            <div class="col-12 px-0">
                <!--=============== CARD ===============-->
                <div class="card__container-all-page p-3  border-color-custom">
                    <div class="my-lg-4 my-0 d-flex justify-content-between align-items-center">
                        <h6 class=" mb-lg-0">İşlem Döküm</h6>
                        <button class="btn text-color fw-500 border-0" type="button" data-bs-toggle="offcanvas"
                            data-bs-target="#offcanvasRight" aria-controls="offcanvasRight">Filtrele <i
                                class="ri-equalizer-2-line"></i></button>
                    </div>

                    <div class="row mt-3 align-items-center justify-content-start">
                        <div class="offcanvas offcanvas-end " tabindex="-1" id="offcanvasRight"
                            aria-labelledby="offcanvasRightLabel">
                            <div class="offcanvas-header">
                                <h5 class="offcanvas-title" id="offcanvasRightLabel">Filtrele
                                </h5>
                                <button type="button" class="btn-close" data-bs-dismiss="offcanvas"
                                    aria-label="Close"></button>
                            </div>
                            <div class="offcanvas-body">
                                <div class="row">
                                    <div class="col-lg-12 ">
                                        <div class="form-floating mb-3">
                                            <input type="date" class="form-control border-color-custom" id="date">
                                            <label for="date">Tarih</label>
                                        </div>
                                    </div>
                                    <div class="col-lg-12 ">
                                        <div class="form-floating mb-3">
                                            <input type="text" class="form-control border-color-custom" id="islemId">
                                            <label for="islemId">İşlem Id</label>
                                        </div>
                                    </div>
                                    <div class="col-lg-12 ">
                                        <div class="form-floating mb-3">
                                            <input type="text" class="form-control border-color-custom" id="dekontId">
                                            <label for="dekontId">Dekont Id</label>
                                        </div>
                                    </div>
                                    <div class="col-lg-6 col-12 ">
                                        <div class="form-floating mb-3">
                                            <input type="text" class="form-control border-color-custom" id="tutar">
                                            <label for="tutar">Tutar</label>
                                        </div>
                                    </div>
                                    <div class="col-lg-6 col-12  mb-3">
                                        <div class="form-floating">
                                            <select class="form-select border-color-custom" id="floatingSelect"
                                                aria-label="Floating label select example">
                                                <option selected>1</option>
                                                <option value="1">2</option>
                                                <option value="2">3</option>
                                            </select>
                                            <label for="floatingSelect">Para Birimi</label>
                                        </div>
                                    </div>
                                    <div class="col-lg-12 mb-3">
                                        <div class="form-floating">
                                            <select class="form-select border-color-custom" id="floatingSelect"
                                                aria-label="Floating label select example">
                                                <option selected>1</option>
                                                <option value="1">2</option>
                                                <option value="2">3</option>
                                            </select>
                                            <label for="floatingSelect">Ödeme Aracı</label>
                                        </div>
                                    </div>
                                    <div class="col-lg-12 mb-3">
                                        <div class="form-floating">
                                            <select class="form-select border-color-custom" id="floatingSelect"
                                                aria-label="Floating label select example">
                                                <option selected>1</option>
                                                <option value="1">2</option>
                                                <option value="2">3</option>
                                            </select>
                                            <label for="floatingSelect">Durum</label>
                                        </div>
                                    </div>
                                    <div class="col-lg-12 ">
                                        <div class="form-floating mb-3">
                                            <input type="phone" class="form-control border-color-custom" id="phone">
                                            <label for="phone">Telefon</label>
                                        </div>
                                    </div>
                                    <div class="col-lg-12 mb-3">
                                        <div class="form-floating">
                                            <select class="form-select border-color-custom" id="floatingSelect"
                                                aria-label="Floating label select example">
                                                <option selected>1</option>
                                                <option value="1">2</option>
                                                <option value="2">3</option>
                                            </select>
                                            <label for="floatingSelect">Seçiniz</label>
                                        </div>
                                    </div>
                                    <div class=" col-6 mb-2">
                                        <button class="btn btn-primary px-4 py-3 w-100 fw-500">Ara</button>
                                    </div>
                                    <div class=" col-6 mb-2 ">
                                        <button class="btn btn-outline-primary px-4 py-3 w-100 fw-500">Temizle</button>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <p class="mt-3">Tablo Gelecek</p>
                    </div>
                </div>
            </div>

    </main>
@endsection