@extends('admin.layout.app')
@section('title','Add Journal Voucher')
@push('headerscript')
    <link href="{{asset('theme/plugins/bootstrap-datepicker/css/bootstrap-datepicker.min.css')}}" rel="stylesheet">
@endpush
@section('content')
    <div class="content">
        <div class="container">
            <div class="row">
                <div class="col-xs-12">
                    <div class="row">
                        <div class="page-title-box">
                            <h4 class="page-title">Add Journal Voucher</h4>
                            <div class="pull-right">
                                <a href="{{route('journal-voucher.index')}}"
                                   class="btn btn-custom btn-rounded waves-effect waves-light m-b-2"><i
                                        class=" mdi mdi-keyboard-backspace"></i> Back</a>
                            </div>
                            <div class="clearfix"></div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="card-box">
                                <div class="row">
                                    <div class="col-sm-12 col-12">
                                        {!! Form::open(['route'=>array('journal-voucher.store'), 'onsubmit'=>"return validateForm()", 'method' => 'post']) !!}
                                        <div class="form-row">
                                            <div class="form-group col-sm-6 col-12">
                                                <label for="voucher_no">Voucher No.<span
                                                        class="text-danger">*</span></label>
                                                <input id="voucher_no" type="text" class="form-control"
                                                       name="voucher_no"
                                                       value="{{$count+1 < 10 ? 'JNL-0'.$count+1 : 'JNL-'.$count+1 }}"
                                                       required readonly>
                                                <div class="text-danger">{{$errors->first('voucher_no')}}</div>
                                            </div>
                                            <div class="form-group col-sm-6 col-12">
                                                <label for="voucher_date">Voucher Date<span
                                                        class="text-danger">*</span></label>
                                                <input type="text" name="voucher_date"
                                                       value="{{old('voucher_date',date('d-m-Y'))}}"
                                                       class="form-control datepicker" required>
                                                <div class="text-danger">{{$errors->first('voucher_date')}}</div>
                                            </div>
                                        </div>
                                        <div class="form-row">
                                            <div class="col-sm-6">
                                                <label for="branch_id">Branch<span class="text-danger">*</span></label>
                                                {!! Form::select("branch_id", \App\Http\Helpers\Helper::getBranchData(), old("branch_id"), ['class'=>'form-control select2' ,'id' => 'branch_id','required'=>'required']  ) !!}
                                            </div>
                                            <div class="form-group col-sm-6 col-12">
                                                <label for="created_by">Created By</label>
                                                <input name="created_by" type="text" class="form-control"
                                                       value="{{\Illuminate\Support\Facades\Auth::user()->name}}"
                                                       readonly>
                                                <div class="text-danger">{{$errors->first('created_by')}}</div>
                                            </div>
                                        </div>
                                        <div class="form-row">
                                            <div class="col-sm-12 col-12 m-t-10">
                                                <label for="description">Description <span class="text-danger">*</span></label>
                                                <textarea class="form-control" required
                                                          name="description">{{old('description')}}</textarea>
                                                <div
                                                    class="text-danger">{{$errors->first('description')}}</div>
                                            </div>
                                        </div>
                                        <div class="form-row">
                                            <div class="col-sm-12 col-12 table-responsive">
                                                <table class="table table-striped dataTable" id="datatable">
                                                    <thead>
                                                    <tr class="text-center">
                                                        <th style="width: 4%">S. No.
                                                        </th>
                                                        <th style="width: 22%">Voucher Type<span
                                                                class="text-danger">*</span>
                                                        </th>
                                                        <th style="width: 22%">Account Name<span
                                                                class="text-danger">*</span>
                                                        </th>
                                                        <th style="width: 10%">Remark
                                                        </th>
                                                        <th style="width: 10%">Credit
                                                        </th>
                                                        <th style="width: 10%">Debit
                                                        </th>
                                                        <th style="width: 10%">Invoice No.
                                                        </th>
                                                        <th style="width: 10%">Plate No.
                                                        </th>
                                                        <th style="width: 2%" id="add_row">
                                                            <button type="button"
                                                                    class="btn btn-info btn-sm m-l-10"
                                                                    id="addrow">
                                                                <i class="fa fa-plus"></i>
                                                            </button>
                                                        </th>
                                                    </tr>
                                                    </thead>
                                                    <tbody>
                                                    <tr>
                                                        <td>1</td>
                                                        <td>
                                                            {!! Form::select("voucher_type[]", [''=>'Select','Expenses'=>'Expenses','Assets'=>'Assets','Income'=>'Income','Liabilities'=>'Liabilities','Equity'=>'Equity','insurance'=>'Insurance'], old("voucher_type"), ['class'=>'form-control select2', 'required', 'id'=>'voucher_type10'] ) !!}
                                                        </td>
                                                        <td>
                                                            {!! Form::select("account_ledger_id[]", [''=>'Select'], old("account_ledger_id"), ['class'=>'form-control select2', 'required', 'id'=>'account_ledger_id10'] ) !!}
                                                        </td>
                                                        <td>
                                                            <input id="remark10" type="text" class="form-control"
                                                                   name="remark[]"
                                                                   value="{{old('remark')}}">
                                                        </td>
                                                        <td>
                                                            <input id="credit10" type="text"
                                                                   class="form-control floatnumber"
                                                                   name="credit[]"
                                                                   value="{{old('credit')}}">
                                                        </td>
                                                        <td>
                                                            <input id="debit10" type="text"
                                                                   class="form-control floatnumber"
                                                                   name="debit[]"
                                                                   value="{{old('debit')}}">
                                                        </td>
                                                        <td>
                                                            <input id="invoice_no10" type="text" class="form-control"
                                                                   name="invoice_no[]"
                                                                   value="{{old('invoice_no')}}">
                                                        </td>
                                                        <td>
                                                            <input id="plate_no10" type="text" class="form-control"
                                                                   name="plate_no[]"
                                                                   value="{{old('plate_no')}}">
                                                        </td>
                                                    </tr>
                                                    </tbody>
                                                    <tfoot>
                                                    <tr>
                                                        <th colspan="2">Totals:</th>
                                                        <th></th>
                                                        <th></th>
                                                        <th><input id="total_credit" class="form-control" readonly></th>
                                                        <th><input id="total_debit" class="form-control" readonly></th>
                                                        <th></th>
                                                        <th></th>
                                                    </tr>
                                                    </tfoot>
                                                </table>
                                            </div>
                                        </div>

                                        <div class="form-row">
                                            <div class="form-group col-sm-12 text-center">
                                                <button type="submit" id="BtnSubmit" class="btn btn-success">
                                                    Submit
                                                </button>
                                            </div>
                                        </div>
                                        {!! Form::close() !!}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('footerscript')
    <script src="{{asset('theme/plugins/moment/moment.js')}}"></script>
    <script src="{{asset('theme/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js')}}"></script>


    <script>
        function validateForm() {
            var credit = $('#total_debit').val();
            var debit = $('#total_credit').val();
            if (debit == credit && debit != 0 && credit != 0) {
                return true;
            } else {
                alert('Please Check The Debit Credit Side Total');
                $('#BtnSubmit').attr('disabled', false);
                return false;
            }
        }

        $(".datepicker").datepicker({
            format: 'dd-mm-yyyy',
            autoclose: true
        });
        $('.number').keyup(function (e) {
            if (/\D/g.test(this.value)) {
                this.value = this.value.replace(/\D/g, '');
            }
        });
        $('.floatnumber').on('input', function () {
            this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');
        });
        $('select[id^=voucher_type]').on('change', function () {
            var lastnum = $(this).attr('id').slice(-2);
            var type = $('#voucher_type' + lastnum).val();
            $.ajax({
                url: '{{route('journalVoucher.getAccountName')}}',
                type: 'GET',
                data: {
                    type: type
                },
                success: function (response) {
                    $('#account_ledger_id' + lastnum).empty();
                    $('#account_ledger_id' + lastnum).append('<option value="">Select </option>');
                    $.each(response, function (key, value) {
                        $('#account_ledger_id' + lastnum).append($("<option></option>")
                            .attr("value", key)
                            .text(value));
                    });
                }
            });
        });
        $('input[id^=credit],input[id^=debit]').keyup(function (e) {
            var debit = 0, credit = 0;
            $('input[id^=debit]').each(function (index) {
                debit += Number($(this).val());
            });
            $('input[id^=credit]').each(function (index) {
                credit += Number($(this).val());
            });
            $('#total_debit').val(debit);
            $('#total_credit').val(credit);
        });

        var j = 11;
        $("#add_row").on('click', function () {
            var col = "<tr>";
            col += '<td>' + (j - 9) + '</td>'
            col += '<td><select name="voucher_type[]"  id="voucher_type' + j + '" class="form-control select2" required="">' +
                '<option value="">Select </option> <option value="Expenses">Expenses</option><option value="Assets">Assets</option><option value="Income">Income</option><option value="Liabilities">Liabilities</option><option value="Equity">Equity</option><option value="insurance">Insurance</option></select></td>';
            col += '<td><select name="account_ledger_id[]"  id="account_ledger_id' + j + '" class="form-control select2" required="">' +
                '<option value="">Select </option> </select></td>';
            col += '<td> <input type="text" name="remark[]" id="remark' + j + '" class="form-control"> </td>';
            col += '<td> <input type="text" name="credit[]" id="credit' + j + '" class="form-control floatnumber"> </td>';
            col += '<td> <input type="text" name="debit[]" id="debit' + j + '" class="form-control floatnumber"> </td>';
            col += '<td> <input type="text" name="invoice_no[]" id="invoice_no' + j + '" class="form-control"> </td>';
            col += '<td> <input type="text" name="plate_no[]" id="plate_no' + j + '" class="form-control"> </td>';
            col += '<td><button class="btn btn-danger btn-sm" id="delete_row" type="button"><i class="fa fa-trash"></i></button></td>';
            $("table#datatable").append(col);
            j++;

            $('.select2').select2();
            $('input[id^=credit],input[id^=debit]').keyup(function (e) {
                var debit = 0, credit = 0;
                $('input[id^=debit]').each(function (index) {
                    debit += Number($(this).val());
                });
                $('input[id^=credit]').each(function (index) {
                    credit += Number($(this).val());
                });
                $('#total_debit').val(debit);
                $('#total_credit').val(credit);
                // if (debit == credit) {
                //     $('#BtnSubmit').attr('disabled', false);
                // } else {
                //     $('#BtnSubmit').attr('disabled', true);
                // }
            });
            $('.floatnumber').on('input', function () {
                this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');
            });
            $('select[id^=voucher_type]').on('change', function () {
                var lastnum = $(this).attr('id').slice(-2);
                var type = $('#voucher_type' + lastnum).val();
                $.ajax({
                    url: '{{route('journalVoucher.getAccountName')}}',
                    type: 'GET',
                    data: {
                        type: type
                    },
                    success: function (response) {
                        $('#account_ledger_id' + lastnum).empty();
                        $('#account_ledger_id' + lastnum).append('<option value="">Select </option>');
                        $.each(response, function (key, value) {
                            $('#account_ledger_id' + lastnum).append($("<option></option>")
                                .attr("value", key)
                                .text(value));
                        });
                    }
                });
            });
        });
        $("table#datatable").on("click", "#delete_row", function (event) {
            $(this).closest("tr").remove();
        });

    </script>
@endpush