@extends('layouts.app')
@section('title', __('account.account_book'))

@section('content')

    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>@lang('account.account_book')
        </h1>
    </section>

    <!-- Main content -->
    <section class="content">
        <div class="row">
            <div class="col-sm-6 col-xs-6">
                <div class="box box-solid">
                    <div class="box-body">
                        <table class="table">
                            <tr>
                                <th>@lang('account.account_name'): </th>
                                <td>{{ $account->name }}</td>
                            </tr>
                            <tr>
                                <th>@lang('lang_v1.account_type'):</th>
                                <td>
                                    @if (!empty($account->account_type->parent_account))
                                        {{ $account->account_type->parent_account->name }} -
                                    @endif {{ $account->account_type->name ?? '' }}
                                </td>
                            </tr>
                            <tr>
                                <th>@lang('account.account_category'):</th>
                                <td>{{ $account_category }}</td>
                            </tr>
                            <tr>
                                <th>@lang('account.account_number'):</th>
                                <td>{{ $account->account_number }}</td>
                            </tr>
                            <tr>
                                <th>@lang('lang_v1.balance'):</th>
                                <td><span id="account_balance"></span></td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
            <div class="col-sm-6 col-xs-12">
                <div class="box box-solid">
                    <div class="box-header">
                        <h3 class="box-title"> <i class="fa fa-filter" aria-hidden="true"></i> @lang('report.filters'):</h3>
                    </div>
                    <div class="box-body">
                        <div class="col-sm-7">
                            <div class="form-group">
                                {!! Form::label('transaction_date_range', __('report.date_range') . ':') !!}
                                <div class="input-group">
                                    <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                                    {!! Form::text('transaction_date_range', null, [
                                        'class' => 'form-control',
                                        'readonly',
                                        'placeholder' => __('report.date_range'),
                                    ]) !!}
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-5">
                            <div class="form-group">
                                {!! Form::label('transaction_type', __('account.transaction_type') . ':') !!}
                                <div class="input-group">
                                    <span class="input-group-addon"><i class="fas fa-exchange-alt"></i></span>
                                    {!! Form::select(
                                        'transaction_type',
                                        ['' => __('messages.all'), 'credit' => __('account.debit'), 'debit' => __('account.credit')],
                                        '',
                                        ['class' => 'form-control'],
                                    ) !!}
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-7">
                            <div class="form-group">
                                {!! Form::label('account_status', 'Account Status::') !!}
                                {!! Form::select(
                                    'account_status',
                                    ['' => __('messages.all'), 'none' => 'None', '1' => 'Approvrd', '0' => 'Disapprovrd'],
                                    '',
                                    ['class' => 'form-control select2'],
                                ) !!}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12">
                <!-- Custom Tabs -->
                <div class="nav-tabs-custom">
                    <ul class="nav nav-tabs">

                        <li class="active">
                            <a href="#account_book_all_tab" data-toggle="tab" aria-expanded="true" class="all_tab"><i
                                    class="fa fa-book" aria-hidden="true"></i> Account Book</a>
                        </li>

                        <li>
                            <a href="#account_book_approved_tab" data-toggle="tab" aria-expanded="true"
                                class="approved_tab"><i class="fas fa-check-circle" aria-hidden="true"></i> Approved</a>
                        </li>

                        <li>
                            <a href="#account_book_disapproved_tab" data-toggle="tab" aria-expanded="true"
                                class="disapproved_tab"><i class="fa fa-times-circle" aria-hidden="true"></i>
                                Disapproved</a>
                        </li>
                    </ul>

                    <div class="tab-content">
                        @if (auth()->user()->can('access_account_book'))
                            <div class="text-center">
                                <span style="margin-left: 10px; font-size: 24px; color:green" id="span_approve"></span>
                                <span style="margin-left: 10px; font-size: 24px; color:red" id="span_disapprove"></span>
                            </div>
                        @endif
                        <div class="tab-pane active" id="account_book_all_tab">
                            @if (auth()->user()->can('access_account_book'))
                                @include('account.partials.account_book')
                            @endif
                        </div>

                        <div class="tab-pane" id="account_book_approved_tab">
                            @if (auth()->user()->can('access_approved_account_book'))
                                @include('account.partials.approved')
                            @endif
                        </div>

                        <div class="tab-pane" id="account_book_disapproved_tab">
                            @if (auth()->user()->can('access_disapproved_account_book'))
                                @include('account.partials.disapproved')
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade account_model" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
        </div>
        <div class="modal fade account_model" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel"
            id="edit_account_transaction">
        </div>

        <div class="modal fade payment_modal" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
        </div>
        <div class="modal fade edit_payment_modal" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
        </div>

    </section>
    <!-- /.content -->

@endsection

@section('javascript')
    <script>
        $(document).ready(function() {
            update_account_balance();

            dateRangeSettings.startDate = moment().subtract(6, 'days');
            dateRangeSettings.endDate = moment();
            $('#transaction_date_range').daterangepicker(
                dateRangeSettings,
                function(start, end) {
                    $('#transaction_date_range').val(start.format(moment_date_format) + ' ~ ' + end.format(
                        moment_date_format));

                    if ($("#account_book_all_tab").hasClass('active')) {
                        account_book.ajax.reload();
                    }
                    if ($("#account_book_approved_tab").hasClass('active')) {
                        approved_table.ajax.reload();
                    }
                    if ($("#account_book_disapproved_tab").hasClass('active')) {
                        disapproved_table.ajax.reload();
                    }
                    account_staus_count();
                }
            );

            account_staus_count();

            // Account Book
            account_book = $('#account_book').DataTable({
                processing: true,
                serverSide: true,
                ajax: {
                    url: '{{ action('AccountController@show', [$account->id]) }}',
                    data: function(d) {
                        var start = '';
                        var end = '';
                        if ($('#transaction_date_range').val()) {
                            start = $('input#transaction_date_range').data('daterangepicker').startDate
                                .format('YYYY-MM-DD');
                            end = $('input#transaction_date_range').data('daterangepicker').endDate
                                .format('YYYY-MM-DD');
                        }
                        var transaction_type = $('select#transaction_type').val();
                        var account_status = $('select#account_status').val();
                        d.start_date = start;
                        d.end_date = end;
                        d.type = transaction_type;
                        d.account_status = account_status;
                        d.active_tab = 'all';
                    }
                },
                "ordering": false,
                columns: [{
                        data: 'operation_date',
                        name: 'operation_date'
                    },
                    {
                        data: 'sub_type',
                        name: 'sub_type'
                    },
                    {
                        data: 'method',
                        name: 'tp.method'
                    },
                    {
                        data: 'payment_details',
                        name: 'tp.payment_ref_no'
                    },
                    {
                        data: 'note',
                        name: 'note'
                    },
                    {
                        data: 'added_by',
                        name: 'added_by'
                    },
                    {
                        data: 'credit',
                        name: 'amount',
                        searchable: false
                    },
                    {
                        data: 'debit',
                        name: 'amount',
                        searchable: false
                    },
                    {
                        data: 'balance',
                        name: 'balance',
                        searchable: false
                    },
                    {
                        data: 'action',
                        name: 'action',
                        searchable: false
                    },
                    {
                        data: 'accountant_status',
                        name: 'accountant_status',
                        searchable: false
                    },
                    {
                        data: 'accountant_action',
                        name: 'accountant_action',
                        searchable: false
                    }
                ],
                "fnDrawCallback": function(oSettings) {
                    __currency_convert_recursively($('#account_book'));
                },
                "footerCallback": function(row, data, start, end, display) {
                    var footer_total_debit = 0;
                    var footer_total_credit = 0;

                    for (var r in data) {
                        footer_total_debit += $(data[r].credit).data('orig-value') ? parseFloat($(data[
                            r].credit).data('orig-value')) : 0;
                        footer_total_credit += $(data[r].debit).data('orig-value') ? parseFloat($(data[
                            r].debit).data('orig-value')) : 0;
                    }

                    $('.footer_total_debit').html(__currency_trans_from_en(footer_total_debit));
                    $('.footer_total_credit').html(__currency_trans_from_en(footer_total_credit));
                }
            });

            var approved_table_initailized = false;
            $('a[data-toggle="tab"]').on('shown.bs.tab', function(e) {
                if ($(e.target).attr('href') == '#account_book_approved_tab') {
                    if (!approved_table_initailized) {
                        approved_table = $('#approved_table').DataTable({
                            processing: true,
                            serverSide: true,
                            ajax: {
                                url: '{{ action('AccountController@show', [$account->id]) }}',
                                data: function(d) {
                                    var start = '';
                                    var end = '';
                                    if ($('#transaction_date_range').val()) {
                                        start = $('input#transaction_date_range').data(
                                                'daterangepicker').startDate
                                            .format('YYYY-MM-DD');
                                        end = $('input#transaction_date_range').data(
                                                'daterangepicker').endDate
                                            .format('YYYY-MM-DD');
                                    }
                                    var transaction_type = $('select#transaction_type').val();
                                    d.start_date = start;
                                    d.end_date = end;
                                    d.type = transaction_type;
                                    d.active_tab = 'approved';
                                }
                            },
                            "ordering": false,
                            columns: [{
                                    data: 'operation_date',
                                    name: 'operation_date'
                                },
                                {
                                    data: 'sub_type',
                                    name: 'sub_type'
                                },
                                {
                                    data: 'method',
                                    name: 'tp.method'
                                },
                                {
                                    data: 'payment_details',
                                    name: 'tp.payment_ref_no'
                                },
                                {
                                    data: 'note',
                                    name: 'note'
                                },
                                {
                                    data: 'added_by',
                                    name: 'added_by'
                                },
                                {
                                    data: 'credit',
                                    name: 'amount',
                                    searchable: false
                                },
                                {
                                    data: 'debit',
                                    name: 'amount',
                                    searchable: false
                                },
                                {
                                    data: 'balance',
                                    name: 'balance',
                                    searchable: false
                                },
                                {
                                    data: 'action',
                                    name: 'action',
                                    searchable: false
                                },
                                {
                                    data: 'accountant_status',
                                    name: 'accountant_status',
                                    searchable: false
                                },
                                {
                                    data: 'accountant_action',
                                    name: 'accountant_action',
                                    searchable: false
                                }
                            ],
                            "fnDrawCallback": function(oSettings) {
                                __currency_convert_recursively($('#approved_table'));
                            },
                            "footerCallback": function(row, data, start, end, display) {
                                var footer_total_debit = 0;
                                var footer_total_credit = 0;

                                for (var r in data) {
                                    footer_total_debit += $(data[r].credit).data('orig-value') ?
                                        parseFloat($(data[
                                            r].credit).data('orig-value')) : 0;
                                    footer_total_credit += $(data[r].debit).data('orig-value') ?
                                        parseFloat($(data[
                                            r].debit).data('orig-value')) : 0;
                                }

                                $('.footer_total_debit').html(__currency_trans_from_en(
                                    footer_total_debit));
                                $('.footer_total_credit').html(__currency_trans_from_en(
                                    footer_total_credit));
                            }
                        });
                        approved_table_initailized = true;
                    } else {
                        approved_table.ajax.reload();
                    }
                }
            });

            var disapproved_table_initailized = false;
            $('a[data-toggle="tab"]').on('shown.bs.tab', function(e) {
                if ($(e.target).attr('href') == '#account_book_disapproved_tab') {
                    if (!disapproved_table_initailized) {
                        disapproved_table = $('#disapproved_table').DataTable({
                            processing: true,
                            serverSide: true,
                            ajax: {
                                url: '{{ action('AccountController@show', [$account->id]) }}',
                                data: function(d) {
                                    var start = '';
                                    var end = '';
                                    if ($('#transaction_date_range').val()) {
                                        start = $('input#transaction_date_range').data(
                                                'daterangepicker').startDate
                                            .format('YYYY-MM-DD');
                                        end = $('input#transaction_date_range').data(
                                                'daterangepicker').endDate
                                            .format('YYYY-MM-DD');
                                    }
                                    var transaction_type = $('select#transaction_type').val();
                                    d.start_date = start;
                                    d.end_date = end;
                                    d.type = transaction_type;
                                    d.active_tab = 'disapproved';
                                }
                            },
                            "ordering": false,
                            columns: [{
                                    data: 'operation_date',
                                    name: 'operation_date'
                                },
                                {
                                    data: 'sub_type',
                                    name: 'sub_type'
                                },
                                {
                                    data: 'method',
                                    name: 'tp.method'
                                },
                                {
                                    data: 'payment_details',
                                    name: 'tp.payment_ref_no'
                                },
                                {
                                    data: 'note',
                                    name: 'note'
                                },
                                {
                                    data: 'added_by',
                                    name: 'added_by'
                                },
                                {
                                    data: 'credit',
                                    name: 'amount',
                                    searchable: false
                                },
                                {
                                    data: 'debit',
                                    name: 'amount',
                                    searchable: false
                                },
                                {
                                    data: 'balance',
                                    name: 'balance',
                                    searchable: false
                                },
                                {
                                    data: 'action',
                                    name: 'action',
                                    searchable: false
                                },
                                {
                                    data: 'accountant_status',
                                    name: 'accountant_status',
                                    searchable: false
                                },
                                {
                                    data: 'accountant_action',
                                    name: 'accountant_action',
                                    searchable: false
                                }
                            ],
                            "fnDrawCallback": function(oSettings) {
                                __currency_convert_recursively($('#disapproved_table'));
                            },
                            "footerCallback": function(row, data, start, end, display) {
                                var footer_total_debit = 0;
                                var footer_total_credit = 0;

                                for (var r in data) {
                                    footer_total_debit += $(data[r].credit).data('orig-value') ?
                                        parseFloat($(data[
                                            r].credit).data('orig-value')) : 0;
                                    footer_total_credit += $(data[r].debit).data('orig-value') ?
                                        parseFloat($(data[
                                            r].debit).data('orig-value')) : 0;
                                }

                                $('.footer_total_debit').html(__currency_trans_from_en(
                                    footer_total_debit));
                                $('.footer_total_credit').html(__currency_trans_from_en(
                                    footer_total_credit));
                            }
                        });
                        disapproved_table_initailized = true;
                    } else {
                        disapproved_table.ajax.reload();
                    }
                }
            });

            $(document).on('click', '.all_tab', function() {
                account_book.ajax.reload();
            });

            $('#transaction_type').change(function() {
                if ($("#account_book_all_tab").hasClass('active')) {
                    account_book.ajax.reload();
                }
                if ($("#account_book_approved_tab").hasClass('active')) {
                    approved_table.ajax.reload();
                }
                if ($("#account_book_disapproved_tab").hasClass('active')) {
                    disapproved_table.ajax.reload();
                }
                account_staus_count();
            });

            $('#account_status').change(function() {
                if ($("#account_book_all_tab").hasClass('active')) {
                    account_book.ajax.reload();
                }
            });

            $('#transaction_date_range').on('cancel.daterangepicker', function(ev, picker) {
                $('#transaction_date_range').val('');
                if ($("#account_book_all_tab").hasClass('active')) {
                    account_book.ajax.reload();
                }
                if ($("#account_book_approved_tab").hasClass('active')) {
                    approved_table.ajax.reload();
                }
                if ($("#account_book_disapproved_tab").hasClass('active')) {
                    disapproved_table.ajax.reload();
                }
                account_staus_count();
            });

            $('#edit_account_transaction').on('shown.bs.modal', function(e) {
                $('#edit_account_transaction_form').validate({
                    submitHandler: function(form) {
                        e.preventDefault();
                        var data = $(form).serialize();
                        $.ajax({
                            method: 'POST',
                            url: $(form).attr('action'),
                            dataType: 'json',
                            data: data,
                            beforeSend: function(xhr) {
                                __disable_submit_button($(form).find(
                                    'button[type="submit"]'));
                            },
                            success: function(result) {
                                if (result.success == true) {
                                    $('#edit_account_transaction').modal('hide');
                                    toastr.success(result.msg);

                                    if ($("#account_book_all_tab").hasClass(
                                            'active')) {
                                        if (typeof(account_book) != 'undefined') {
                                            account_book.ajax.reload();
                                        }
                                    }
                                    if ($("#account_book_approved_tab").hasClass(
                                            'active')) {
                                        approved_table.ajax.reload();
                                    }
                                    if ($("#account_book_disapproved_tab").hasClass(
                                            'active')) {
                                        disapproved_table.ajax.reload();
                                    }

                                    // if (typeof(account_book) != 'undefined') {
                                    //     account_book.ajax.reload();
                                    // }

                                } else {
                                    toastr.error(result.msg);
                                }
                            },
                        });
                    },
                });
            });

        });

        $(document).on('click', '.delete_account_transaction', function(e) {
            e.preventDefault();
            swal({
                title: LANG.sure,
                icon: "warning",
                buttons: true,
                dangerMode: true,
            }).then((willDelete) => {
                if (willDelete) {
                    var href = $(this).data('href');
                    $.ajax({
                        url: href,
                        dataType: "json",
                        success: function(result) {
                            if (result.success === true) {
                                toastr.success(result.msg);
                                // account_book.ajax.reload();
                                if ($("#account_book_all_tab").hasClass(
                                        'active')) {
                                    account_book.ajax.reload();
                                }
                                if ($("#account_book_approved_tab").hasClass(
                                        'active')) {
                                    approved_table.ajax.reload();
                                }
                                if ($("#account_book_disapproved_tab").hasClass(
                                        'active')) {
                                    disapproved_table.ajax.reload();
                                }
                                update_account_balance();
                                account_staus_count();
                            } else {
                                toastr.error(result.msg);
                            }
                        }
                    });
                }
            });
        });

        //click accountant status button
        $(document).on('click', '.btn_accountant_status', function() {
            var href = $(this).data('href');
            var value = $(this).data('value');
            var active_tab = 'all';
            if ($("#account_book_approved_tab").hasClass(
                    'active')) {
                active_tab = 'approved';
            }
            if ($("#account_book_disapproved_tab").hasClass(
                    'active')) {
                active_tab = 'disapproved';
            }

            $.ajax({
                url: href,
                data: {
                    value: value,
                    active_tab: active_tab
                },
                success: function(result) {
                    if (result.success === true) {
                        toastr.success(result.msg);
                        if ($("#account_book_all_tab").hasClass(
                                'active')) {
                            account_book.ajax.reload();
                        }
                        if ($("#account_book_approved_tab").hasClass(
                                'active')) {
                            approved_table.ajax.reload();
                        }
                        if ($("#account_book_disapproved_tab").hasClass(
                                'active')) {
                            disapproved_table.ajax.reload();
                        }
                        update_account_balance();
                        account_staus_count();
                    } else {
                        toastr.error(result.msg);
                    }
                }
            });
        });

        $(document).on('click', '.edit_payment', function(e) {
            e.preventDefault();
            var container = $('.edit_payment_modal');

            $.ajax({
                url: $(this).data('href'),
                dataType: 'html',
                success: function(result) {
                    container.html(result).modal('show');
                    __currency_convert_recursively(container);
                    $('#paid_on').datetimepicker({
                        format: moment_date_format + ' ' + moment_time_format,
                        ignoreReadonly: true,
                    });
                    container.find('form#transaction_payment_add_form').validate();
                },
            });
        });

        $(document).on('submit', 'form#transaction_payment_add_form', function(e) {
            e.preventDefault();
            $(this)
                .find('button[type="submit"]')
                .attr('disabled', true);
            var data = $(this).serialize();

            $.ajax({
                method: 'POST',
                url: $(this).attr('action'),
                dataType: 'json',
                data: data,
                success: function(result) {
                    if (result.success == true) {
                        $('div.payment_modal').modal('hide');
                        $('div.edit_payment_modal').modal('hide');
                        toastr.success(result.msg);
                        disapproved_table.ajax.reload();
                        update_account_balance();
                    } else {
                        toastr.error(result.msg);
                    }
                },
            });
        });

        $(document).on('click', '.delete_payment', function(e) {
            swal({
                title: LANG.sure,
                text: LANG.confirm_delete_payment,
                icon: 'warning',
                buttons: true,
                dangerMode: true,
            }).then(willDelete => {
                if (willDelete) {
                    $.ajax({
                        url: $(this).data('href'),
                        method: 'delete',
                        dataType: 'json',
                        success: function(result) {
                            if (result.success === true) {
                                $('div.payment_modal').modal('hide');
                                $('div.edit_payment_modal').modal('hide');
                                toastr.success(result.msg);
                                disapproved_table.ajax.reload();
                                update_account_balance();
                                account_staus_count();
                            } else {
                                toastr.error(result.msg);
                            }
                        },
                    });
                }
            });
        });

        function account_staus_count() {
            var start = $('input#transaction_date_range').data(
                    'daterangepicker').startDate
                .format('YYYY-MM-DD');
            var end = $('input#transaction_date_range').data(
                    'daterangepicker').endDate
                .format('YYYY-MM-DD');
            var transaction_type = $('select#transaction_type').val();

            $('span#span_approve').html('<i class="fas fa-sync fa-spin"></i>');
            $('span#span_disapprove').html('<i class="fas fa-sync fa-spin"></i>');
            $.ajax({
                url: '{{ action('AccountController@getAccountStatus', [$account->id]) }}',
                data: {
                    start: start,
                    end: end,
                    transaction_type: transaction_type
                },
                success: function(data) {
                    var approve_percent = 0;
                    var disapprove_percent = 0;

                    if (data.total_count !== 0) {
                        approve_percent = Math.round(((data.approved_count / data.total_count) * 100)) + "%";
                        disapprove_percent = Math.round(((data.disapproved_count / data.total_count) * 100)) +
                            "%";
                    }

                    $('span#span_approve').text('Approved: ' + approve_percent);
                    $('span#span_disapprove').text('Disapproved: ' + disapprove_percent);
                }
            });
        }

        function update_account_balance(argument) {
            $('span#account_balance').html('<i class="fas fa-sync fa-spin"></i>');
            $.ajax({
                url: '{{ action('AccountController@getAccountBalance', [$account->id]) }}',
                dataType: "json",
                success: function(data) {
                    $('span#account_balance').text(__currency_trans_from_en(data.balance, true));
                }
            });
        }
    </script>
@endsection