@extends('layouts.contentLayoutMaster')


@php
@endphp


@section('title', "اضافة سجل جديد للمديونة رقم #$transaction->transactionable_id - دفعة #$transaction->id")

@section('vendor-style')
<!-- vendor css files -->
<link rel='stylesheet' href="{{ asset(mix('vendors/css/forms/wizard/bs-stepper.min.css')) }}">
<link rel='stylesheet' href="{{ asset(mix('vendors/css/forms/select/select2.min.css')) }}">
@endsection
@section('page-style')
<!-- Page css files -->
<link rel="stylesheet" href="{{ asset(mix('css/base/plugins/forms/form-wizard.css')) }}">
<link rel="stylesheet" href="{{ asset(mix('css/base/plugins/forms/form-validation.css')) }}">
<link rel="stylesheet" href="{{ asset(mix('css/base/pages/modal-create-app.css')) }}">
@endsection
@section('content')
    @if($errors->any())
        <div class="alert alert-danger mb-1 rounded-0" role="alert">
            @foreach($errors->all() as $error)
                <div class="alert-body">{{ $error }}</div>
            @endforeach
        </div>
    @endif
@component('components.forms.formCard',['title' => sprintf('تسجيل دفعة %s #%s - متبقي %s',$transaction->installment_name,$transaction->id,$transaction->residual_amount)])

<x-ui.divider>معلومات الدفعة</x-ui.divider>

    <div class="row mb-1 ">
        <div class="col-md">
            <x-inputs.text.Input label="قيمة الدفعة" icon="file-text" name="amount_before_discount" :disabled="true" :value="$transaction->amount_before_discount" />
        </div>

        @if($transaction->vat_amount)
        <div class="col-md">
            <x-inputs.text.Input label="قيمة الضرائب" icon="file-text" name="vat_amount" :disabled="true" :value="$transaction->vat_amount" />
        </div>
        @endif


        @if($transaction->period_discount)
        <div class="col-md">
            <x-inputs.text.Input label="خصومات الفترة" icon="file-text" name="period_discount" :disabled="true" :value="$transaction->period_discount" />
        </div>
        @endif

        @if($transaction->wallet_discount)
        <div class="col-md">
            <x-inputs.text.Input label="خصومات المحفظة" icon="file-text" name="wallet_discount" :disabled="true" :value="$transaction->wallet_discount" />
        </div>
        @endif
        @if($transaction->coupon_discount)
            <div class="col-md">
                <x-inputs.text.Input label="خصومات الفسيمة" icon="file-text" name="coupon_discount" :disabled="true" :value="$transaction->coupon_discount" />
            </div>
        @endif

        @if($transaction->amount_before_discount != $transaction->amount_after_discount )
        <div class="col-md">
            <x-inputs.text.Input label="بعد الخصم" icon="file-text" name="amount_after_discount" :disabled="true" :value="$transaction->amount_after_discount" />
        </div>
        @endif

        <div class="col-md">
            <x-inputs.text.Input label="الاجمالي" icon="file-text" name="total" :value="$transaction->amount_after_discount + $transaction->vat_amount" :disabled="true" />
        </div>

        @if($transaction->paid_amount)
        <div class="col-md">
            <x-inputs.text.Input label="مدفوع" icon="file-text" name="paid_amount" :disabled="true" :value="$transaction->paid_amount" />
        </div>

        <div class="col-md">
            <x-inputs.text.Input label="متبقي" icon="file-text" name="total" :disabled="true" :value="$transaction->residual_amount > 0 ? $transaction->residual_amount : 'مدفوع'" />
        </div>
        @endif

    </div>


    <x-ui.divider>تفاصيل الدفعة الجديدة</x-ui.divider>

        @if($transaction->residual_amount > 0)
{{--        @if($transaction_info['new_period_discount'])--}}
{{--        <div class="row mb-1 justify-content-center">--}}
{{--            <div class="col-md-6">--}}
{{--                <x-inputs.text.Input label="خصم الفترة الحالية" icon="dollar-sign" name="new_period_discount" :value="$transaction_info['new_period_discount']" class="is-valid" divClass="is-valid"  readonly />--}}
{{--            </div>--}}
{{--        </div>--}}
{{--        @endif--}}

        @if($transaction_info['coupon_code'] && $transaction_info['coupon_discount'])
        <div class="row mb-1 justify-content-center">
            <div class="col-md-6">
                <x-inputs.text.Input label="خصم قسيمة ({{ $transaction_info['coupon_code'] }})" icon="dollar-sign" name="coupon_discount" :value="$transaction_info['coupon_discount']" class="is-valid" divClass="is-valid" />
            </div>
        </div>
        @endif

            @if($transaction_info['wallet_id'] && $transaction_info['wallet_discount'])
                <div class="row mb-1 justify-content-center">
                    <div class="col-md-6">
                        <x-inputs.text.Input label="خصم محفظة ({{ $transaction_info['wallet_id'] }})" icon="dollar-sign" name="wallet_discount" :value="$transaction_info['wallet_discount']" class="is-valid" divClass="is-valid" />
                    </div>
                </div>
            @endif


        {!! Form::open(['route' => ['cancel-contracts.contracts.transactions.attempts.store',['cancel_contract' => $cancel_contract,'contract' => $contract,'transaction' => $transaction]],'method'=>'POST','enctype'=>"multipart/form-data" ,'onsubmit' => 'showLoader()']) !!}

        <div class="row mb-1 justify-content-center">
            <div class="col-md-6">
                <x-inputs.text.Input label="المطلوب سداداة" icon="file-text" name="residual_amount" :disabled="true" :value="$transaction->residual_amount" />
            </div>
        </div>

        @if(!request()->has('coupon_code') || empty(request()->coupon_code))
        <div class="row mb-1 justify-content-center">
            <div class="col-md-6">
                <button type="button" class="btn btn-warning btn-sm mt-2" data-bs-toggle="modal" data-bs-target="#refuseCoupon">
                    اضافة قسيمة
                </button>
            </div>
        </div>

        @else

        <div class="row mb-1 justify-content-center mt-1">
            <div class="col-md-6">
                {!! Form::label('coupon_code','القسيمة') !!}
                {!! Form::label('coupon_code',request()->coupon_code,['class' => 'form-control '. ($transaction_info['is_coupon_valid'] ? 'is-valid' : 'is-invalid')]) !!}
                @if(!$transaction_info['is_coupon_valid'])
                <span class="invalid-feedback" role="alert">
                    <strong>{{ $transaction_info['message'] ?? 'قسيمة غير صالحة' }}</strong>
                </span>
                @else
                <span class="valid-feedback">
                    {{ $transaction_info['message'] ??  'تم تطبيق القسيمة' }}
                </span>
                    <input type="hidden" name="coupon" value="{{ request()->coupon_code }}">
                    <input type="hidden" name="coupon_value" value="{{ request()->coupon_value }}">
                @endif
            </div>
        </div>

        <div class="row mb-1 justify-content-center mt-1">
            <div class="col-md-6">
                <a href="{{ url()->current() }}{{!empty(request()->wallet_id) ? '?wallet_id='.request()->wallet_id.'&wallet_discount='.request()->wallet_discount:'' }}" class="btn btn-sm btn-danger">ازالة القسيمة <em data-feather="trash"></em></a>
            </div>
        </div>

        @endif

                        @if(!request()->has('wallet_id') || empty(request()->wallet_id))
                <div class="row mb-1 justify-content-center">
                    <div class="col-md-6">
{{--                        <button type="button" class="btn btn-warning btn-sm mt-2" data-bs-toggle="modal" data-bs-target="#useWallet">--}}
{{--                            اضافة خصم من المحفظة--}}
{{--                        </button>--}}
                    </div>
                </div>

            @else

                <div class="row mb-1 justify-content-center mt-1">
                    <div class="col-md-6">
                        {!! Form::label('wallet_id','المحفظة') !!}
                        {!! Form::label('wallet_id',request()->wallet_id,['class' => 'form-control '. ($transaction_info['is_wallet_valid'] ? 'is-valid' : 'is-invalid')]) !!}
                        @if(!$transaction_info['is_wallet_valid'])
                            <span class="invalid-feedback" role="alert">
                    <strong>{{ $transaction_info['wallet_message'] ?? 'محفظة غير صالحة' }}</strong>
                </span>
                        @else
                            <span class="valid-feedback">
                    {{ $transaction_info['wallet_message'] ??  'تم تطبيق خصم المحفظة' }}
                </span>
                            <input type="hidden" name="wallet_id" value="{{ request()->wallet_id }}">
                            <input type="hidden" name="wallet_discount" value="{{ request()->wallet_discount }}">
                        @endif
                    </div>
                </div>

                <div class="row mb-1 justify-content-center mt-1">
                    <div class="col-md-6">
                        <a href="{{ url()->current() }}{{!empty(request()->coupon_code) ? '?coupon_code='.request()->coupon_code:'' }}" class="btn btn-sm btn-danger">ازالة خصم المحفظة <em data-feather="trash"></em></a>
                    </div>
                </div>

            @endif


        <div class="row mb-1 justify-content-center">
            <div class="col-md-6">
                <x-inputs.text.Input :required="false" label="المبلغ المدفوع" icon="file-text" name="requested_ammount" :value="old('requested_ammount')" :placeholder="sprintf('فيمة الدفعة بحد اقصي %s ', $transaction_info['residual_amount'])" />
                <small id="hint" class="form-text text-danger">اترك هذا الحقل فارغ لدفع كامل المبلغ</small>
                <input type="hidden" name="max_amount" value="{{ $transaction->residual_amount - $transaction_info['coupon_discount'] - $transaction_info['new_period_discount'] }}">
            </div>
        </div>

        <div class="row mb-1 justify-content-center">

            <div class="col-md-6">
                <x-inputs.select.generic select2="" name="method_id" label="طريقة الدفع" onchange="checkPaymentMethod()" :options="App\Models\PaymentMethod::paymentMethods(1,[1,2,4,5])" />
            </div>
        </div>

        <div class="row mb-1 justify-content-center">
            <div class="col-md-3">
                <x-inputs.select.generic select2="" name="bank_id" label="البنك" :options="['' => 'اختر البنك'] + GetBanks()" />
            </div>
            <div class="col-md-3">
                <x-inputs.select.generic select2="" name="payment_network_id" label="الشبكة" :options="['' => 'اختر الشبكة'] + GetNetworks()" />
            </div>
            <div class="col-md-3">
                <x-inputs.select.generic select2="" name="payment_wallet_id" label=" المحفظة"  :options="['' => 'اختر المحفظة'] +$wallets" />
            </div>
        </div>

        <div class="row mb-1 justify-content-center">
{{--            <div class="col-md-3">--}}
{{--                <label class="form-label mb-1" for="is_confirmed"> دفعة مؤكدة </label>--}}
{{--                <x-inputs.checkbox name="is_confirmed">خصم الدفعة مباشرة من حساب الطالب</x-inputs.checkbox>--}}
{{--            </div>--}}

            <div class="col-md-3">
                <label class="form-label mb-1" for="notifyuser"> ارسال اشعار </label>
                <x-inputs.checkbox name="notifyuser">اعلام ولي الامر بأستلام الدفعة</x-inputs.checkbox>
            </div>
        </div>

        <div class="row mb-1 justify-content-center">
            <div class="col-md-6">
                <label for="receipt" class="form-label mb-1" for="receipt">صوره الايصال </label>
                <input required type="file" class="form-control" id="receipt" name="receipt" accept="image/png, image/jpeg ,application/pdf">
            </div>
        </div>


        <div class="col-12 text-center mt-2">
            <x-inputs.submit>تسجيل الدفعة</x-inputs.submit>
            <x-inputs.link route="cancel-contracts.contracts.transactions.index" :params="['cancel_contract'=>$cancel_contract,'contract'=>$contract,'transaction'=>$transaction]">عودة</x-inputs.link>
        </div>

        {!! Form::close() !!}
        @endif
        @endcomponent


        <div class="modal fade add_back" id="refuseCoupon" tabindex="-1" aria-labelledby="AddCouponLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content" id="res">
                    <div class="modal-header">
                        <h5 class="modal-title" id="AddCoupon">اضافة قسيمة خصم</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <form role="form" method="GET" name="transactionsrefuse" action="{{ url()->current() }}{{!empty(request()->wallet_id) ? '?wallet_id='.request()->wallet_id.'&wallet_discount='.request()->wallet_discount:'' }}">
                        <div class="modal-body">
                            <div class="col-md">
                                <x-inputs.text.Input label="قسيمة الخصم" icon="file-text" name="coupon_code" />
                            </div>
                            <div class="col-md">
                                <x-inputs.text.Input label="قيمة الخصم" icon="file-text" type="number" name="coupon_value" />
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
                                عوده
                            </button>
                            <x-inputs.submit class="btn btn-warning  me-1">تطبيق القسيمة</x-inputs.submit>

                        </div>

                    </form>
                </div>
            </div>
        </div>
        <div class="modal fade add_back" id="useWallet" tabindex="-1" aria-labelledby="AddWalletLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content" id="res">
                    <div class="modal-header">
                        <h5 class="modal-title" id="AddWallet">اضافة خصم من المحفظة</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <form role="form" method="GET" name="transactionsrefusewallet" action="{{ url()->current() }}{{!empty(request()->coupon_code) ? '?coupon_code='.request()->coupon_code.'&coupon_value='.request()->coupon_value:'' }}">
                        <div class="modal-body">
                                <div class="col-md">
                                    <x-inputs.select.generic select2="" name="wallet_id" label="اختر المحفظة"  :options="$wallets" />
                                </div>
                            <div class="col-md">
                                <x-inputs.text.Input type="number" min="1" label="قيمة الخصم" icon="file-text" name="wallet_discount" />
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
                                عوده
                            </button>
                            <x-inputs.submit class="btn btn-warning  me-1">تطبيق الخصم</x-inputs.submit>

                        </div>

                    </form>
                </div>
            </div>
        </div>

    @endsection

        @section('vendor-script')
        <!-- vendor files -->
        <script src="{{ asset(mix('vendors/js/forms/wizard/bs-stepper.min.js')) }}"></script>
        <script src="{{ asset(mix('vendors/js/forms/select/select2.full.min.js')) }}"></script>
        <script src="{{ asset(mix('vendors/js/forms/cleave/cleave.min.js')) }}"></script>
        <script src="{{ asset(mix('vendors/js/forms/cleave/addons/cleave-phone.us.js')) }}"></script>
        <script src="{{ asset(mix('vendors/js/forms/validation/jquery.validate.min.js')) }}"></script>
        @endsection
        @section('page-script')
        <!-- Page js files -->
        <script src="{{ asset(mix('js/scripts/pages/modal-add-new-cc.js')) }}"></script>
        <script src="{{ asset(mix('js/scripts/pages/page-pricing.js')) }}"></script>
        <script src="{{ asset(mix('js/scripts/pages/modal-add-new-address.js')) }}"></script>
        <script src="{{ asset(mix('js/scripts/pages/modal-create-app.js')) }}"></script>
        <script src="{{ asset(mix('js/scripts/pages/modal-two-factor-auth.js')) }}"></script>
        <script src="{{ asset(mix('js/scripts/pages/modal-edit-user.js')) }}"></script>
        <script src="{{ asset(mix('js/scripts/pages/modal-share-project.js')) }}"></script>

        <script>
            function checkPaymentMethod() {
                let method_id = document.getElementById('method_id')
                let bank_id = document.getElementById('bank_id')
                let payment_network_id = document.getElementById('payment_network_id')
                let payment_wallet_id = document.getElementById('payment_wallet_id')
                let receipt = document.getElementById('receipt')
                payment_wallet_id.value = ''
                bank_id.value = ''
                payment_network_id.value = ''
                method_id.value == 1 ? bank_id.removeAttribute('disabled') : bank_id.setAttribute('disabled', 1)
                method_id.value == 4 ? payment_network_id.removeAttribute('disabled') : payment_network_id.setAttribute('disabled', 1)
                method_id.value == 5 ? payment_wallet_id.removeAttribute('disabled') : payment_wallet_id.setAttribute('disabled', 1)
                method_id.value != 5 ? receipt.removeAttribute('disabled') : receipt.setAttribute('disabled', 1)

            }

            checkPaymentMethod()
        </script>
        @endsection