@extends('layouts.app')

@php
$curTime = time();

$isEdit = 0;
if (isset($row['id']))
    $isEdit = 1;

@endphp

@section('content')
    <section class="page-header row">
        <h2> User Payout Requests </h2>
        <ol class="breadcrumb">
            <li><a href="{{ url('') }}"> Dashboard </a></li>
            <li><a href="{{ url('/manage/userpayoutrequests') }}"> User Payout Requests </a></li>
            <li class="active"> Form </li>
        </ol>
    </section>

    <div class="page-content row">
        <div class="page-content-wrapper no-margin">
            {!! Form::open(array('url'=>'/manage/userpayoutrequests', 'class'=>'form-horizontal validated', 'files' => true )) !!}

            <div class="sbox-title clearfix">
                <div class="sbox-tools pull-right">
                    <a href="{{ url('/manage/userpayoutrequests') }}" class="tips btn btn-sm " title="{{ __('core.btn_back') }}">
                        <i class="fa fa-times"></i>
                    </a>
                </div>
                <div class="sbox-tools1 pull-left1">
                    <button name="apply" class="btn btn-sm btn-primary" title="{{ __('core.sb_apply') }}">
                        <i class="fa fa-check"></i> {{ __('core.sb_apply') }}
                    </button>
                    <button name="save" class="btn btn-sm btn-success" title="{{ __('core.sb_save') }}">
                        <i class="fa fa-paste"></i> {{ __('core.sb_save') }}
                    </button>
                </div>
            </div>

            <div class="sbox1">
                <div class="sbox-content clearfix row">
                    <div class="col-xs-12">
                        <ul class="parsley-error-list">
                            @foreach($errors->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>

                        <div class="sbox1">
                            <div class="col-md-12">
                                <fieldset class="sbox" style="border-top:0; border-radius: 5px;">
                                    @if($isEdit)
                                        <input type='hidden' name='id' id='id' value='{{$row['id']}}'/>
                                    @endif

                                    <legend> User Payout Request </legend>

                                    <div class="col-md-6">
                                        <div class="form-group depen- wrap-user_id" >
                                            @if($isEdit)
                                                <input type='hidden' name='user_id' value='{{$row['user_id']}}'/>
                                            @endif
                                            <label for="user_id" class="control-label col-md-4 text-left"> User <span class="asterix text-danger"> * </span></label>
                                            <div class="col-md-8">
                                                <select id='user_id' name='user_id' rows='5' class='select2' data-placeholder='Select User' {{ ($isEdit) ? 'readonly' : 'required' }}></select>
                                            </div>
                                        </div>

                                        <div class="form-group depen- wrap-method_code" >
                                            <label for="method_code" class="control-label col-md-4 text-left"> Available Methods <span class="asterix text-danger"> * </span></label>
                                            <div class="col-md-8">
                                                <select id='method_code' name='method_code' rows='5' class='select2' data-placeholder='Select Method'></select>
                                            </div>
                                        </div>

                                        <div class="form-group depen- wrap-account" >
                                            <label for="account" class="control-label col-md-4 text-left"> Available Accounts <span class="asterix text-danger"> * </span></label>
                                            <div class="col-md-8">
                                                <select id='account' name='account' rows='5' class='select2' data-placeholder='Select Account'></select>
                                            </div>
                                        </div>

                                        <div class="form-group depen- wrap-amount" >
                                            <label for="amount" class="control-label col-md-4 text-left"> Amount <span class="asterix text-danger"> * </span></label>
                                            <div class="col-md-8">
                                                <input type='number' step="0.01" id='amount' name='amount'
                                                       class='form-control input-sm' placeholder='Amount'
                                                       data-parsley-maxlength="11" required>
                                            </div>
                                        </div>

                                        @if ($isEdit)
                                            <div class="form-group depen- wrap-status" >
                                                <label for="status" class=" control-label col-md-4 text-left"> Status <span class="asterix text-danger"> * </span></label>
                                                <div class="col-md-8">
                                                    <input type='radio' name='status' value ='created' required @if( $row['status'] == 'created') checked="checked" @endif class='minimal-red' > Created <br>
                                                    <input type='radio' name='status' value ='processing' required @if( $row['status'] == 'processing') checked="checked" @endif class='minimal-red' > Processing <br>
                                                    <input type='radio' name='status' value ='completed' required @if( $row['status'] == 'completed') checked="checked" @endif class='minimal-red' > Completed <br>
                                                    <input type='radio' name='status' value ='declined' required @if( $row['status'] == 'declined') checked="checked" @endif class='minimal-red' > Declined <br>
                                                    <input type='radio' name='status' value ='failed' required @if( $row['status'] == 'failed') checked="checked" @endif class='minimal-red' > Failed <br>
                                                    <input type='radio' name='status' value ='approved_manually' required @if( $row['status'] == 'approved_manually') checked="checked" @endif class='minimal-red' > Approved manually <br>
                                                    <input type='radio' name='status' value ='approved_automatically' required @if( $row['status'] == 'approved_automatically') checked="checked" @endif class='minimal-red' > Approved automatically <br>
                                                </div>
                                            </div>
                                        @endif
                                    </div>

                                    <div class="col-md-6">
                                        <div class="form-group depen- wrap-confirmed_balance" >
                                            <label for="confirmed_balance" class="control-label col-md-4 text-left"> Confirmed Balance </label>
                                            <div class="col-md-8">
                                                <input id='confirmed_balance' name='confirmed_balance' class='form-control input-sm' placeholder='Confirmed Balance' disabled>
                                            </div>
                                        </div>

                                        <div class="form-group depen- wrap-currency" >
                                            <label for="currency" class="control-label col-md-4 text-left"> Currency </label>
                                            <div class="col-md-8">
                                                <input id='currency' name='currency' class='form-control input-sm' placeholder='Currency' disabled>
                                            </div>
                                        </div>

                                        <div class="form-group depen- wrap-fees" >
                                            <label for="fees" class="control-label col-md-4 text-left"> Fees </label>
                                            <div class="col-md-8">
                                                <input id='fees' name='fees' class='form-control input-sm' placeholder='Fees' disabled>
                                            </div>
                                        </div>

                                        <div class="form-group depen- wrap-fees_amount" >
                                            <label for="fees_amount" class="control-label col-md-4 text-left"> Fees Amount </label>
                                            <div class="col-md-8">
                                                <input id='fees_amount' name='fees_amount' class='form-control input-sm' placeholder='Fees Amount' disabled>
                                            </div>
                                        </div>

                                        <div class="form-group depen- wrap-will_receive" >
                                            <label for="will_receive" class="control-label col-md-4 text-left"> Will Receive </label>
                                            <div class="col-md-8">
                                                <input id='will_receive' name='will_receive' class='form-control input-sm' placeholder='Will Receive' disabled>
                                            </div>
                                        </div>

                                        <div class="form-group depen- wrap-note" >
                                            <label for="note" class="control-label col-md-4 text-left"> Note </label>
                                            <div class="col-md-8">
                                                <input type='text' name='note' id='note' data-parsley-maxlength="500" class='form-control input-sm' value="{!! isset($row['note']) ?? '' !!}"/>
                                            </div>
                                        </div>
                                    </div>
                                </fieldset>
                            </div>
                            <div class="col-md-12">
                                <fieldset class="sbox" style="border-top:0; border-radius: 5px;">
                               <ul>
                                   <li>
                                      <b>balance sub-account USD : <span id="balance_subaccount_usd"></span></b>
                                   </li>
                                   <li>
                                      <b>balance sub-account EGP : <span id="balance_subaccount_egp"></span></b>
                                   </li>
                                   <li>
                                       <b>Total with sub-account USD  : <span id="total_with_subaccount_usd"></span></b>
                                   </li>
                                   <li>
                                       <b>Total with sub-account EGP  : <span id="total_with_subaccount_egp"></span></b>
                                   </li>
                               </ul>
                                </fieldset>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="sbox-title clearfix">
                <div class="sbox-tools pull-right">
                    <a href="{{ url('/manage/userpayoutrequests') }}" class="tips btn btn-sm " title="{{ __('core.btn_back') }}">
                        <i class="fa fa-times"></i>
                    </a>
                </div>
                <div class="sbox-tools1 pull-left1">
                    <button name="apply" class="btn btn-sm btn-primary" title="{{ __('core.sb_apply') }}">
                        <i class="fa fa-check"></i> {{ __('core.sb_apply') }}
                    </button>
                    <button name="save" class="btn btn-sm btn-success" title="{{ __('core.sb_save') }}">
                        <i class="fa fa-paste"></i> {{ __('core.sb_save') }}
                    </button>
                </div>
            </div>

            <input type="hidden" name="action_task" value="save"/>
            {!! Form::close() !!}
        </div>
    </div>

    <script type="text/javascript">
        let userElement = $("#user_id");
        let methodCodeElement = $("#method_code");
        let accountElement = $("#account");

        let methods = @json($methods);
        let currencies = @json($allCurrencies);
        let confirmedBalance = {{ $userData[0]['user']['confirmed_balance']?? 0 }};


        let  balanceSubaccount_usd = 0 ;
        let  balanceSubaccount_egp = 0 ;
        let  totalWithSubaccount_usd = 0 ;
        let  totalWithSubaccount_egp = 0 ;



        let accounts = [];

        let fees = [];
        let data = null;

            @if ($isEdit)
            let payoutAmount = {{ $row['local_amount'] }};
            let calculatedFee = {{ $row['local_fees_amount'] }};
            let willReceive = {{ $row['local_final_amount'] }};

            let payoutConversionRate = {{ $row['currency_rate'] }};
            let user = @json([$userData[0]['user']]);
            let userMethods = @json($userData[0]['available_methods']);
            accounts = @json($userData[0]['available_accounts']);
            fees = @json($userData[0]['methods_fees']);
        @endif

        $(function () {
            @if ($isEdit)
                userElement.select2({data: user, width: '100%', disabled: 'readonly'});
                methodCodeElement.select2({data: Object.values(userMethods), width: '100%'});
                accountElement.select2({data: accounts[methodCodeElement.val()], width: '100%'});


                $('#amount').val(payoutAmount.toFixed(2));
                $('#confirmed_balance').val(confirmedBalance.toFixed(2));
                $('#currency').val(methods[methodCodeElement.val()]['default_currency']);
            if(methods[methodCodeElement.val()]['default_currency']==='USD'){
                $('#confirmed_balance').val(user[0].available_amount_usd);
            }
            if(methods[methodCodeElement.val()]['default_currency']==='EGP'){
                $('#confirmed_balance').val(user[0].available_amount_egp);
            }

            $('#fees').val(2.00.toFixed(2) + '%');

            $('#fees_amount').val(calculatedFee.toFixed(2));

            $('#will_receive').val((payoutAmount - calculatedFee).toFixed(2));
                // calculateFees();
            @else
                initUserSelect2();
                methodCodeElement.select2({width: '100%'});
                accountElement.select2({width: '100%'});
            @endif

            userElement.on('change', function () {
                var element = $(this);
                data = element.select2('data')[0];

                Object.entries(data.available_accounts).forEach(function (element) { accounts[element[0]] = element[1]; });
                Object.entries(data.methods_fees).forEach(function (element) { fees[element[0]] = element[1]; });

                var available_methods = Object.values(data.available_methods);
                methodCodeElement.select2('destroy').empty().select2({data: available_methods, width: '100%'});
                if(available_methods[0]){
                    accountElement.select2('destroy').empty().select2({data: data.available_accounts[available_methods[0]['id']], width: '100%'});
                 }else{
                    accountElement.select2('destroy').empty().select2({data: {}, width: '100%'});

                }

                confirmedBalance = data.confirmed_balance;



                balanceSubaccount_usd = data.balance_subaccount_usd.toFixed(2)  ;
                balanceSubaccount_egp = data.balance_subaccount_egp.toFixed(2)  ;
                totalWithSubaccount_usd = data.total_with_subaccount_usd.toFixed(2)  ;
                totalWithSubaccount_egp = data.total_with_subaccount_egp.toFixed(2)  ;


                available_amount_usd = data.available_amount_usd  ;
                available_amount_egp = data.available_amount_egp  ;



                $('#balance_subaccount_usd').html(balanceSubaccount_usd);
                $('#balance_subaccount_egp').html(balanceSubaccount_egp);
                $('#total_with_subaccount_usd').html(totalWithSubaccount_usd);
                $('#total_with_subaccount_egp').html(totalWithSubaccount_egp);

                if (typeof available_methods[0] !== 'undefined') {
                    var currencyCode = String(available_methods[0]['currency']);
                    $('#confirmed_balance').val(confirmedBalance);
                    if(currencyCode==='USD'){
                        $('#confirmed_balance').val(available_amount_usd);
                    }
                    if(currencyCode==='EGP'){
                        $('#confirmed_balance').val(available_amount_egp);
                    }
                    $('#currency').val(currencyCode);
                } else {
                    resetValues();
                }

                calculateFees();
            });

            methodCodeElement.on('change', function () {
                var element = $(this);
                var method_code = element.val();

                if (method_code === null) {
                    resetValues();
                    return;
                }
                @if ($isEdit)

                    available_amount_usd = user[0].available_amount_usd;
                    available_amount_egp = user[0].available_amount_egp;
                @else
                    available_amount_usd = data.available_amount_usd;
                    available_amount_egp = data.available_amount_egp;
                @endif

                $('#currency').val(methods[element.val()]['default_currency']);
                if(methods[element.val()]['default_currency']==='USD'){
                    $('#confirmed_balance').val(available_amount_usd);
                }
                if(methods[element.val()]['default_currency']==='EGP'){
                    $('#confirmed_balance').val(available_amount_egp);
                }
                $("#account").select2('destroy').empty().select2({
                    data: accounts[method_code],
                    width: '100%'
                });
                calculateFees();
            });

            $("#amount").on('change input', function () {
                calculateFees();
            });
        });

        function initUserSelect2() {
            $("#user_id").select2({
                ajax: {
                    url: "{{url('userpayoutrequests/filterMethodsByUser')}}",
                    dataType: 'json',
                    data: function (params) {
                        return {
                            search: params.term,
                            page: params.page || 1
                        };
                    },
                    processResults: function (data) {
                        data.page = data.page || 1;
                        return {
                            results: data.items.map(function (item) {
                                return {
                                    id: item.user.id,
                                    text: item.user.text,
                                    confirmed_balance: item.user.confirmed_balance,
                                    available_amount_usd: item.user.available_amount_usd,
                                    available_amount_egp: item.user.available_amount_egp,
                                    available_methods: item.available_methods,
                                    available_accounts: item.available_accounts,
                                    balance_subaccount_usd: item.user.balance_subaccount_usd,
                                    balance_subaccount_egp: item.user.balance_subaccount_egp,
                                    total_with_subaccount_usd: item.user.total_with_subaccount_usd,
                                    total_with_subaccount_egp: item.user.total_with_subaccount_egp,
                                    methods_fees: item.methods_fees
                                };
                            }),
                            pagination: {
                                more: data.pagination
                            }
                        }
                    },
                    delay: 250
                },
                multiple: 0,
                width: '100%'
            });
        }

        function calculateFees() {
            var selected_method = methodCodeElement.val();
            if (selected_method === null) {
                resetValues();
                return;
            }

            var selected_fee = 2;

            $('#fees').val(selected_fee + '%');
            var amount = $('#amount').val();
            if (amount === '')
                return;

            var calculated_fees;
            calculated_fees = amount * 0.02;
            if(calculated_fees > 200){
                calculated_fees = 200;
            }
            if(calculated_fees < 20){
                calculated_fees = 20;
            }
            $('#fees_amount').val(calculated_fees.toFixed(2));

            if (amount - calculated_fees < 0)
                $('#will_receive').val(0);
            else
                $('#will_receive').val((amount - calculated_fees).toFixed(2));
        }

        function resetValues() {
            $('#fees').val('');
            $('#fees_amount').val('');
            $('#will_receive').val($('#amount').val());
            $('#currency').val('USD');
            $('#confirmed_balance').val(confirmedBalance);


            $('#balance_subaccount_usd').html(balanceSubaccount_usd);
            $('#balance_subaccount_egp').html(balanceSubaccount_egp);
            $('#total_with_subaccount_usd').html(totalWithSubaccount_usd);
            $('#total_with_subaccount_egp').html(totalWithSubaccount_egp);


        }
    </script>
@stop