@extends('layouts.frontend')

@section('title', 'Wallet')

@section('content')

    @if (Session::has('message'))
        <x-withraw-success-component />
    @else
        <div class="page-content pb-0 mb-0 card" style="box-shadow: 0px 5px 9px 0px #000000;">
            <div class="profile-img text-center text-bg-dark shadow" style="height: 60px !important;">
                <h4 class="text-white fw-bolder" style="margin-top:15px;">Wallet</h4>
            </div>
        </div>
        <ul class="list-group">
            <li class="list-group-item" style="text-align: center;color:black;font-weight: bold;font-size: 16px;">
                Await refund money ({{ $settings_->where('key', 'currency')->first()->value ?? '' }})
                @if (isset(auth()->user()->member->transactions))
                    {{ number_format(auth()->user()->member->amountToWithdrawn() ?? '0',0) }}
                @endif
                </b>
            </li>
            <li class="list-group-item"
                style="text-align: center;color:black;margin-top:2px;font-weight: bold;font-size: 16px;">
                Amount To The Account ({{ $settings_->where('key', 'currency')->first()->value ?? '' }})
                <b>{{ number_format(auth()->user()->member->credit ?? 0, 0) }}</b>
            </li>
        </ul>
        <div class="page-content m-0 pb-0 card" style="margin-bottom:50px;">
            <div class="w-100" role="group" aria-label="Basic example" style="margin-top:3px;">
                <button type="button" class="btn" data-bs-toggle="modal" data-bs-target="#staticBackdrop"
                    style="box-shadow: 0px 1px 5px 0px #000000;font-size: 16px;font-weight: 600;border-radius: 20px;width:100%;color:white;background-color: #006abc;">
                    <img src="/images/cash-withdrawal.png" alt="" width="26x"> Withdraw
                </button>
            </div>
           {{--  <div class="w-100 py-1" role="group" aria-label="Basic example" style="margin-top:3px;">
                <a type="button" class="btn"
                    style="box-shadow: 0px 1px 5px 0px #000000;font-size: 16px;font-weight: 600;border-radius: 20px;width:100%;color:white;background-color: #006abc;"
                    href="https://admin.gtrpay001.com/pay/collection?mchId=19387420&mchk=OWJlYWIwY2IxZjJlNGYwZDg0NWFiNDhmNmNkY2MxYzY=&passageId=10202&countryCode=PHP">
                    <img src="/images/peso-sign.png" alt="" width="26x"> Deposit 
                </a>
            </div> --}}
            <!-- <div class="pt-2">
                <h6><span class=" border-bottom border-warning border-3"> &nbsp;Account Number</span></h6>
                <div class="card rounded-3 mt-2 text-bg-success">
                    <div class="card-body py-3">
                        <div class="category-name d-flex justify-content-around gap-2">
                            <h6 class="mb-0 text-white">{{ auth()->user()->member->bank_username_hide ?? '' }}</h6>
                            <h6 class="mb-0 text-white">{{ auth()->user()->member->bank_number_hide ?? '' }}</h6>
                        </div>
                    </div>
                </div>
            </div> -->
            <div class="page-content pb-0 mb-0">
                <div class="card profile-img border text-center rounded-3 text-bg-dark shadow mt-2"
                    style="background-color:#0775b4 !important;width:80%;margin-left:10%;margin-bottom: 10px;box-shadow: 0px 7px 3px 0px #333333;padding:5px;">
                    <h3 class="text-white fw-bolder">{{ number_format(auth()->user()->member->credit ?? 0, 0) }}
                    </h3>
                    <p class="mb-0 fw-bold">Account Balance
                        ({{ $settings_->where('key', 'currency')->first()->value ?? '' }})</p>
                    <p class="mb-0 fw-bold">Current Balance
                        @if (isset(auth()->user()->member->loans))
                            {{ number_format(auth()->user()->member->loans()->sum('amount') ?? 0,0) }}
                            {{ $settings_->where('key', 'currency')->first()->value ?? '' }}
                        @else
                            0.0
                        @endif
                    </p>
                </div>
            </div>
        </div>
        @if ($errors->any())
            <div class="alert alert-danger">
                <ul>
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif
        <div class="modal fade" id="staticBackdrop" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
            aria-labelledby="staticBackdropLabel" aria-hidden="true" style="width:80%;margin-left:10%;">
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header">
                        <h6 class="modal-title text-center" id="staticBackdropLabel"
                            style="color:#0079b7;font-weight: 600;">
                            Wallet Withdrawal
                        </h6>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body" x-init>
                        <form action="{{ route('member.withdraw', auth()->id()) }}" method="POST" autocomplete="off">
                            @csrf
                            <div class="form-floating mb-3">
                                <input type="number" class="form-control" id="amount" name="amount" min="1"
                                    required="" max="{{ auth()->user()->member->credit ?? 2 }}" value="0"
                                    style="color:#0079b7;height:30px;padding-top:10px;" placeholder="Enter Amount">
                                {{-- <label for="amount">Enter Amount</label> --}}
                            </div>

                            <div class="input-group mb-3" id="show_hide_password">
                                <div class="form-floating flex-grow-1">
                                    <input type="password" class="form-control" id="pwdcode" name="withdraw_code"
                                        placeholder="Withdrawal Code" style="height:30px;padding-top:10px;" required>
                                    {{-- <label for="pwdcode">Withdrawal code</label> --}}
                                </div>
                                <!-- <span class="input-group-text bg-transparent rounded-start-0 rounded-3" style="height:30px;"><i
                                        class="bi bi-eye-slash"></i></span> -->
                            </div>
                            <div class="mb-0 d-grid">
                                <button type="submit" class="btn btn-success btn-ecomm rounded-3">Confirm</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>f
        </div>
        {{--  --}}
        <div class="tab-content pb-5 card" id="myTabContent">
            <div class="tab-pane fade show active" id="home-tab-pane" role="tabpanel" aria-labelledby="home-tab"
                tabindex="0">
                <x-loan-app :back="0" />
            </div>
        </div>
    @endif
    @include('app.sweetAlert')
@endsection

@push('scripts')
    <script src="{{ asset('assets/js/show-hide-password.js') }}"></script>
@endpush

@push('styles')
    <style>
        .ms-success {
            z-index: 1300;
            top: 1.5rem !important;
        }

        input::placeholder {
            color: #212529 !important;
        }

        .form-floating>.form-control,
        .form-floating>.form-control-plaintext {
            padding: 0.6rem 1em !important;
        }
    </style>
@endpush