@extends('merchant.app')

@section('title', panel_setting_title("Manuel Pos"))

@section('content')

<main class="mt-120 " id="main">
    <h6 class="my-lg-4 my-0 mb-lg-0 ">Manuel Pos</h6>


    <div class="row mt-4">
        @include("merchant.Components.statistics")

        <div class="col-12 p-0">
            <!--=============== CARD ===============-->
            <div class="card__container-all-page p-3  border-color-custom">
                <p class="h5 mb-3">Ürün Detayları</p>
                <div class="form-check form-switch mt-lg-4 mt-2">
                    <input class="form-check-input border-color-custom  me-3" type="checkbox"
                        role="switch" id="flexSwitchCheckDefault" onchange="toggleLabel()">
                    <label class="form-check-label" for="flexSwitchCheckDefault"
                        id="switchLabel">Bireysel</label>
                </div>
                <div>
                    <form action="" method="POST">
                        <div class="row bireysel-input">
                            <div class="col-lg-6 col-12 my-2">
                                <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 my-2">
                                <div class="form-floating">
                                    <select class="form-select border-color-custom" id="floatingSelect"
                                        aria-label="Floating label select example">
                                        <option selected>TRY</option>
                                        <option value="1">Dolar</option>
                                        <option value="2">Euro</option>
                                    </select>
                                    <label for="floatingSelect">Para Birimi</label>
                                </div>
                            </div>
                            <div class="col-lg-6 col-12 my-2">
                                <div class="form-floating mb-3">
                                    <input type="text" class="form-control border-color-custom"
                                        id="isim-soyisim">
                                    <label for="isim-soyisim">İsim Soyisim</label>
                                </div>
                            </div>

                            <div class="col-lg-6 col-12 my-2">
                                <div class="form-floating mb-3">
                                    <input type="text" class="form-control border-color-custom"
                                        id="kimlik-numarasi">
                                    <label for="kimlik-numarasi">Kimlik Numarası</label>
                                </div>
                            </div>
                            <div class="col-lg-6 col-12 my-2">
                                <div class="form-floating mb-3">
                                    <input type="email" class="form-control border-color-custom"
                                        id="email">
                                    <label for="email">E-Posta</label>
                                </div>
                            </div>
                            <div class="col-lg-6 col-12 my-2">
                                <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 my-2">
                                <div class="form-floating">
                                    <textarea class="form-control" id="address"></textarea>
                                    <label for="address">Adres</label>
                                </div>
                            </div>
                            <div class="col-lg-12 mt-3 my-2">
                                <div class="form-floating">
                                    <textarea class="form-control" id="description"></textarea>
                                    <label for="description">Açıklama</label>
                                </div>
                            </div>
                            <div class="col-lg-3 col-12  mt-lg-4 my-lg-0 my-2">
                                <div class="form-check form-switch ">
                                    <input type="hidden" name="commission" value="0">
                                    <input class="form-check-input border-color-custom" value="1" type="checkbox"
                                        role="switch" id="komisyon" name="komisyon"
                                        onchange="toggleSelect('komisyon', 'selectContainer')">
                                    <label class="form-check-label" for="komisyon">Komisyonu Son
                                        Kullanıcı Ödesin</label>
                                </div>

                                <div class="my-3 d-none" id="selectContainer">
                                    <div class="form-floating">
                                        <select class="form-select border-color-custom"
                                            id="commission_installment"
                                            name="commission_installment"
                                            aria-label="Floating label select example">
                                            <option value="1">1</option>
                                            <option value="2">2</option>
                                            <option value="3">3</option>
                                        </select>
                                        <label for="komisyon-son">Taksit Seçenekleri</label>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-3 col-12  mt-lg-4 my-lg-0 my-2">
                                <div class="form-check form-switch ">
                                    <input class="form-check-input border-color-custom" type="checkbox"
                                        role="switch" id="yinelenen"
                                        onchange="toggleSelect('yinelenen', 'selectContainer2')">
                                    <label class="form-check-label" for="yinelenen">Yinelenen
                                        Ödeme</label>
                                </div>

                                <div>
                                    <div class="row">
                                        <div class="my-3 d-none" id="selectContainer2">
                                            <div class="col mb-2">
                                                <div class="form-floating mb-3">
                                                    <input type="text" class="form-control border-color-custom" id="yinelenen-odeme">
                                                    <label for="yinelenen-odeme">Yinelenen Ödeme</label>
                                                </div>
                                            </div>
                                            <div class="col mb-2">
                                                <div class="form-floating">
                                                    <select class="form-select border-color-custom"
                                                        id="floatingSelect"
                                                        aria-label="Floating label select example">
                                                        <option selected>Günlük</option>
                                                        <option value="1">2</option>
                                                        <option value="2">3</option>
                                                    </select>
                                                    <label for="floatingSelect">Sipariş Döngü
                                                        Sıklığı</label>
                                                </div>
                                            </div>
                                            <div class="col mb-2">
                                                <div class="form-floating mb-3">
                                                    <input type="text"
                                                        class="form-control border-color-custom"
                                                        id="siparis-dongu-araligi">
                                                    <label for="siparis-dongu-araligi">Sipariş Döngü
                                                        Aralığı</label>
                                                </div>
                                            </div>
                                            <div class="col mb-2">
                                                <div class="form-floating mb-3">
                                                    <input type="text"
                                                        class="form-control border-color-custom"
                                                        id="yenilenen-web">
                                                    <label for="yenilenen-web">Yenilenen Web Kancası
                                                        Anahtar Adı</label>
                                                </div>
                                            </div>

                                        </div>

                                    </div>
                                </div>
                                <div class="my-3 d-none" id="selectContainer2">
                                    <select class="form-select border-color-custom">
                                        <option value="" selected>Ödeme Aralığını Seçin</option>
                                        <option value="haftalık">Haftalık</option>
                                        <option value="aylık">Aylık</option>
                                        <option value="yıllık">Yıllık</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-lg-3 col-12  mt-lg-4 my-lg-0 my-2">
                                <div class="form-check form-switch ">
                                    <input class="form-check-input border-color-custom" type="checkbox"
                                        role="switch" id="on-provizyon">
                                    <label class="form-check-label" for="on-provizyon">Ön
                                        Provizyon</label>
                                </div>
                            </div>
                            <div class="col-lg-3 col-12  mt-lg-4 my-lg-0 my-2">
                                <div class="form-check form-switch ">
                                    <input class="form-check-input border-color-custom" type="checkbox"
                                        role="switch" id="3d-odeme">
                                    <label class="form-check-label" for="3d-odeme">3D Ödeme</label>
                                </div>
                            </div>
                            <div
                                class="row align-items-end justify-content-lg-end justify-content-center  m-0 p-0 mt-lg-5 mt-3">
                                <div class="col-lg-2 col-12 mb-2  ">
                                    <a href="{{route("merchant.dashboard.manuel-pos-next")}}"
                                        class="btn btn-primary py-3 w-100 w-md-auto fw-500">Sonraki</a>
                                </div>
                            </div>


                        </div>

                        <!-- Kurumsal inputlar -->
                        <div class="row kurumsal-input d-none">
                            <div class="col-lg-6 col-12 my-2">
                                <div class="form-floating mb-3">
                                    <input type="text" class="form-control border-color-custom"
                                        id="kurumsalTutar">
                                    <label for="kurumsalTutar">Kurumsal Tutar</label>
                                </div>
                            </div>
                            <div class="col-lg-6 col-12 my-2">
                                <div class="form-floating">
                                    <select class="form-select border-color-custom" id="kurumsalSelect"
                                        aria-label="Floating label select example">
                                        <option selected>TRY</option>
                                        <option value="1">Dolar</option>
                                        <option value="2">Euro</option>
                                    </select>
                                    <label for="kurumsalSelect">Kurumsal Para Birimi</label>
                                </div>
                            </div>
                            <div class="col-lg-6 col-12 my-2">
                                <div class="form-floating mb-3">
                                    <input type="number" class="form-control border-color-custom"
                                        id="vergi-no">
                                    <label for="vergi-no">Vergi Numarası</label>
                                </div>
                            </div>
                            <div class="col-lg-6 col-12 my-2">
                                <div class="form-floating mb-3">
                                    <input type="text" class="form-control border-color-custom"
                                        id="vergi-dairesi">
                                    <label for="vergi-dairesi">Vergi Dairesi</label>
                                </div>
                            </div>
                            <div class="col-lg-6 col-12 my-2">
                                <div class="form-floating mb-3">
                                    <input type="email" class="form-control border-color-custom"
                                        id="e-posta-sirket">
                                    <label for="e-posta-sirket">E-Posta</label>
                                </div>
                            </div>
                            <div class="col-lg-6 col-12 my-2">
                                <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 my-2">
                                <div class="form-floating">
                                    <textarea class="form-control" id="address"></textarea>
                                    <label for="address">Adres</label>
                                </div>
                            </div>
                            <div class="col-lg-12 mt-3 my-2">
                                <div class="form-floating">
                                    <textarea class="form-control" id="description"></textarea>
                                    <label for="description">Açıklama</label>
                                </div>
                            </div>
                            <div class="col-lg-3 col-12  mt-lg-4 my-lg-0 my-2">
                                <div class="form-check form-switch ">
                                    <input class="form-check-input border-color-custom " type="checkbox"
                                        role="switch" id="komisyon"
                                        onchange="toggleSelect('komisyon', 'selectContainer')">
                                    <label class="form-check-label" for="komisyon">Komisyonu Son
                                        Kullanıcı Ödesin</label>
                                </div>

                                <div class="my-3 d-none" id="selectContainer">
                                    <div class="form-floating">
                                        <select class="form-select border-color-custom"
                                            id="komisyon-son"
                                            aria-label="Floating label select example">
                                            <option selected>1</option>
                                            <option value="1">2</option>
                                            <option value="2">3</option>
                                        </select>
                                        <label for="komisyon-son">Taksit Seçenekleri</label>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-3 col-12  mt-lg-4 my-lg-0 my-2">
                                <div class="form-check form-switch ">
                                    <input type="hidden" name=""value="0">
                                    <input class="form-check-input border-color-custom" type="checkbox"
                                        role="switch" id="yinelenen" value="1" name="recurring"
                                        onchange="toggleSelect('yinelenen', 'selectContainer2')">
                                    <label class="form-check-label" for="yinelenen">Yinelenen Ödeme</label>
                                </div>

                                <div>
                                    <div class="row">
                                        <div class="my-3 d-none" id="selectContainer2">
                                            <div class="col mb-2">
                                                <div class="form-floating mb-3">
                                                    <input type="text"
                                                        class="form-control border-color-custom"
                                                        id="yinelenen-odeme">
                                                    <label for="yinelenen-odeme">Yinelenen Ödeme</label>
                                                </div>
                                            </div>
                                            <div class="col mb-2">
                                                <div class="form-floating">
                                                    <select class="form-select border-color-custom"
                                                        id="floatingSelect"
                                                        aria-label="Floating label select example">
                                                        <option selected>Günlük</option>
                                                        <option value="1">2</option>
                                                        <option value="2">3</option>
                                                    </select>
                                                    <label for="floatingSelect">Sipariş Döngü
                                                        Sıklığı</label>
                                                </div>
                                            </div>
                                            <div class="col mb-2">
                                                <div class="form-floating mb-3">
                                                    <input type="text"
                                                        class="form-control border-color-custom"
                                                        id="siparis-dongu-araligi">
                                                    <label for="siparis-dongu-araligi">Sipariş Döngü
                                                        Aralığı</label>
                                                </div>
                                            </div>
                                            <div class="col mb-2">
                                                <div class="form-floating mb-3">
                                                    <input type="text"
                                                        class="form-control border-color-custom"
                                                        id="yenilenen-web">
                                                    <label for="yenilenen-web">Yenilenen Web Kancası
                                                        Anahtar Adı</label>
                                                </div>
                                            </div>

                                        </div>

                                    </div>
                                </div>
                                <div class="my-3 d-none" id="selectContainer2">
                                    <select class="form-select border-color-custom">
                                        <option value="" selected>Ödeme Aralığını Seçin</option>
                                        <option value="haftalık">Haftalık</option>
                                        <option value="aylık">Aylık</option>
                                        <option value="yıllık">Yıllık</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-lg-3 col-12  mt-lg-4 my-lg-0 my-2">
                                <div class="form-check form-switch ">
                                    <input class="form-check-input border-color-custom" type="checkbox"
                                        role="switch" id="on-provizyon" name="preauth">
                                    <label class="form-check-label" for="on-provizyon">Ön
                                        Provizyon</label>
                                </div>
                            </div>
                            <div class="col-lg-3 col-12  mt-lg-4 my-lg-0 my-2">
                                <div class="form-check form-switch ">
                                    <input class="form-check-input border-color-custom" type="checkbox"
                                        role="switch" id="3d-odeme">
                                    <label class="form-check-label" for="3d-odeme">3D Ödeme</label>
                                </div>
                            </div>
                            <div
                                class="row align-items-end justify-content-lg-end justify-content-center  m-0 p-0 mt-lg-5 mt-3">
                                <div class="col-lg-2 col-12 mb-2  ">
                                    <a href="#"
                                        class="btn btn-primary py-3 w-100 w-md-auto fw-500">Sonraki</a>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</main>
@endsection