@extends('layouts.main')
@section('title')
    Fuels Managements
@stop
@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a> <span class="divider">/</span></li>
        <li><a href="">Fuels Managements</a> <span class="divider">/</span></li>
        <li class="active">Goods Received Notes</li>
    </ul>
@stop
@section('msghead_menu')
    <li class="right btn-group">
        <button class="btn" style="margin-right: 4px" onclick="modelShow('FillFuel')">
            <span class="iconsweets-create"></span> RECEIVE FUEL
        </button>
        {{--<button class="btn" style="margin-right: 4px" id="edit_goods_received_notes">--}}
        {{--<i class="icon-pencil icon"></i> EDIT <span--}}
        {{--style="font-size: 10px;color: #51a7c6"> ( alt+e )</span>--}}
        {{--</button>--}}
    </li>
@stop
@section('contentinner')

    <div class="row-fluid">
        <div class="span12">
            <table class="table table-bordered table-condensed" id="inventories-grn-list">
                <thead>
                <tr>
                    <th class="nosort" style="width: 20px"><input type="checkbox" class="checkall"/></th>
                    <th style="width: 110px"></th>
                    <th style="width: 70px">GRN NO.</th>
                    <th>Date</th>
                    <th>Received By</th>
                    <th>Cr Account</th>
                    <th>Dr Account</th>
                    <th>Reference</th>
                    <th>Amount</th>
                    <th>Status</th>
                    <th>Action</th>
                </tr>
                </thead>
                <tfoot>
                <tr>
                    <td colspan="8" style="text-align: right">TOTAL</td>
                    <td style="text-align: right">{{number_format(0)}}</td>
                    <td></td>
                </tr>
                </tfoot>
            </table>
        </div><!--span12-->
    </div><!--row-fluid-->

    <div aria-hidden="false" aria-labelledby="myModalLabel" role="dialog" tabindex="-1"
         class="modal hide fade in"
         id="FillFuel">
        <div class="modal-header" style="background: #50A6C6">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4>FUEL RECEIVED NOTES</h4>
        </div>
        {!! Form::open(array('class' => 'form-horizontal stdform','id'=>'neRoute','route'=>'goods-received-note.store')) !!}
        <div class="modal-body">
            <div class="maincontent">
                <div class="row-fluid" style="margin-top: 4px">
                    <div class="span6">
                        <label class="span4">Date *</label>

                        <div class="field input-append date span8" id="datetimepicker1">
                            <input class="input-xlarge " name="date_received"
                                   data-format="dd/MM/yyyy hh:mm:ss"
                                   type="text" id="datetimepicker1" required autocomplete="off"/>
                                <span class="add-on">
                                  <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
                                </span>
                        </div>
                    </div>
                    <div class="span6">
                        <label class="span4">Cr</label>

                        <div class="field span8">
                            <select name="cr_account_id" id="cr_account"
                                    class="searchable_select" style="width: 100%" required>
                                @foreach($credit_account_groups as $credit_account_group)
                                    <optgroup label="{{$credit_account_group->name}}">
                                        @foreach($credit_account_group->accounts as $account)
                                            <option class="account-select"
                                                    value="{{$account->id}}"> {{$account->name}} </option>
                                        @endforeach
                                    </optgroup>
                                @endforeach
                            </select>
                        </div>

                    </div>
                </div>
                <div class="row-fluid" style="margin-top: 4px">
                    <div class="span6">
                        <label class="span4">Quantity</label>

                        <div class="field span8">
                            <input type="text" name="quantity" class="span12 number" id="quantity"
                                   placeholder="Quantity" autocomplete="off" required/>
                        </div>
                    </div>
                    <div class="span6">
                        <label class="span4"> Price/Litres</label>

                        <div class="field span8">
                            <input type="text" name="rate" class="span12 number" id="rate"
                                   placeholder="Rate" autocomplete="off" required/></div>
                    </div>
                </div>

                <div class="row-fluid" style="margin-top: 4px">
                    <div class="span6">
                        <label class="span4"> Amount</label>

                        <div class="field span8">
                            <input type="text" name="amount" class="span12" id="amount"
                                   placeholder="Amount" required autocomplete="off"/>
                        </div>
                    </div>

                    <div class="span6">
                        <label class="span4">Currency</label>

                        <div class="field span8">
                            <select name="currency" style="width: 100%" class="searchable_select" required>
                                <option value="TSH">TSH</option>
                                <option value="USD">USD</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="row-fluid" style="margin-top: 4px">
                    <div class="span6">
                        <label class="span4"> Exchange Rate</label>

                        <div class="field span8">
                            <input type="text" name="exchange_rate" class="span12" autocomplete="off" required/>
                        </div>
                    </div>

                    <div class="span6">
                        <label class="span4">Dr</label>

                        <div class="field span8">

                            <select name="dr_account_id" id="dr_account" style="width: 100%" class="searchable_select"
                                    required>
                                @foreach($debited_account_groups as $debited_account_group)
                                    <optgroup label="{{$debited_account_group->name}}">
                                        @foreach($debited_account_group->accounts as $account)
                                            <option class="account-select"
                                                    value="{{$account->id}}"> {{$account->name}} </option>
                                        @endforeach
                                    </optgroup>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>
                <div class="row-fluid" style="margin-top: 4px">
                    <div class="span6">
                        <label class="span4"> Delivery Order Number</label>

                        <div class="field span8">
                            <input type="text" name="delivery_order_number" class="span12"
                                   id="delivery_order_number"/></div>
                    </div>
                    <div class="span6">
                        <label class="span4">Received By</label>

                        <div class="field span8">
                            <select name="received_by" style="width: 100%" class="searchable_select" required>
                                @foreach($employees as $employee)
                                    <option value="{{$employee->employee_id}}">{{$employee->fullName}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>
                <div class="row-fluid" style="margin-top: 4px">

                    <div class="span12">
                        <label class="span2">Remarks</label>

                        <div class="field span10">
                            <textarea name="description" cols="80" rows="5" class="span12"></textarea>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        <div class="modal-footer">
            <div class="row">
                <div class="form-group">
                    <p class="stdformbutton pull-right">
                        <button class="btn btn-primary" type="submit">Fill Tank</button>
                        <button type="button" class="btn" data-dismiss="modal">CLOSE</button>
                    </p>
                </div>
            </div>
        </div>
        </form>
    </div>

    <div aria-hidden="false" aria-labelledby="myModalLabel" role="dialog" class="modal hide fade in" data-backdrop="static"
         id="edit_fuel_goods_received_note">
        <div class="modal-header" style="background: #50A6C6">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4>EDIT GOODS RECEIVED NOTES</h4>
        </div>
        {!! Form::open(array('class' => 'form-horizontal stdform','id'=>'neRoute','route'=>'goods-received-note.update')) !!}
        <div class="modal-body">
            <div id="edit_fuel_goods_received_note_body">

            </div>
        </div>
        <div class="modal-footer">
            <div class="row">
                <div class="form-group">
                    <p class="stdformbutton pull-right">
                        <button class="btn btn-primary" type="submit">UPDATE</button>
                        <button type="reset" class="btn" data-dismiss="modal">CLOSE</button>
                    </p>
                </div>
            </div>
        </div>
        </form>
    </div>

    {{--end--}}
    <script type="text/javascript">
        jQuery('.searchable_select').select2();

        function format(d) {
            return d.item_entries_display;
        }

        var oTable = jQuery('#inventories-grn-list').DataTable({
            "oLanguage": {
                "sLoadingRecords": "Please wait - loading Goods Received Note...",
                "sZeroRecords": "No Goods Received Note to Display.",
//            "sProcessing": "Please wait - loading records...",
                "sInfoEmpty": "No entries to display."
            },
            ajax: {
                url: '{{route('fuels.goods-received-notes.data-table.index')}}',
                data: function (d) {
//                d.route_id = jQuery('#name').val();
                },
                error: function (xhr, textStatus, error) {
                    if (textStatus === 'timeout') {
                        alert('Timout error. The server took too long to send back the data.\nPlease try again.');
                    }
                    oTable.fnProcessingIndicator(false);
                }
            },
            scrollCollapse: true,
            "sPaginationType": "full_numbers",
            processing: true,
            serverSide: true,
            "aoColumnDefs": [{
                "aTargets": [8],
                "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                    jQuery(nTd).css('text-align', 'right')
                    if ((sData == 0.00)) {
                        jQuery(nTd).addClass('highlight-red')
                    }
                }
            }],
            "columns": [
                {data: 'checkbox'},
                {
                    "class": "",
                    "orderable": false,
                    "data": 'item_entries_count'
                },
                {"class": "link", data: 'grn_number'},
                {"class": "link", data: 'date'},
                {"class": "link", data: 'received_by'},

                {"class": "link number", data: 'cr_account'},
                {"class": "link number", data: 'dr_account'},
                {"class": "link number", data: 'reference'},

                {
                    "render": function (data, type, row) {
                        return data.toLocaleString();
                    },
                    "class": "link",
                    data: 'amount'
                },
                {"class": "link", data: 'status'},
                {"class": "link", data: 'action'}
            ],
            "columnDefs": function () {
            },
            "fnDrawCallback": function () {
                jQuery('tr td .number').addClass('number');
                jQuery('.edit_goods_received_notes').on('click', function (e) {
                    e.preventDefault();
                    var url = jQuery(this).attr('href');
                    jQuery.ajax({
                        type: "GET",
                        cache: false,
                        url: url,
                        success: function (data) {
                            jQuery('#edit_fuel_goods_received_note').appendTo("body").modal('toggle');
                            jQuery('#edit_fuel_goods_received_note_body').empty().append(data);
                            jQuery('.searchable_select_fuel_source').select2();


                        },
                        error: function (data) {

                        }
                    });
                });
            },
            "footerCallback": function (row, data, start, end, display) {
                var api = this.api(), data;

                // Remove the formatting to get integer data for summation
                var intVal = function (i) {
                    return typeof i === 'string' ? i.replace(/[\$,]/g, '') * 1 : typeof i === 'number' ? i : 0;
                };

                // Total over all pages
                total_amount = api.column(8).data().reduce(function (a, b) {
                    return intVal(a) + intVal(b);
                }, 0);
                jQuery(api.column(8).footer()).html(total_amount.toLocaleString());
            },
            "bStateSave": true
        });

        var item_entries = [];

        jQuery('#inventories-grn-list tbody').on('click', 'tr td button.item_entries', function () {
            var tr = jQuery(this).closest('tr');
            var row = oTable.row(tr);
            var idx = jQuery.inArray(tr.attr('id'), item_entries);

            if (row.child.isShown()) {
//            tr.removeClass('items');
                row.child.hide();

                // Remove from the 'open' array
                item_entries.splice(idx, 1);
            }
            else {
//            tr.addClass('items');
                row.child(format(row.data())).show();

                // Add to the 'open' array
                if (idx === -1) {
                    item_entries.push(tr.attr('id'));
                }
            }
        });

        // On each draw, loop over the `item_entries` array and show any child rows
        oTable.on('draw', function () {
            jQuery.each(item_entries, function (i, id) {
                jQuery('#' + id + ' td.item_entries').trigger('click');
            });
        });

        jQuery('.deleterow_c').click(function () {
            var conf = confirm('Are you sure?');
            if (conf)
                var tr_p = jQuery(this).parents('tr');

            var good_received_note_id = tr_p.find('.good_received_note_id').val();
            var url = '{{route('fuel.destroy',":fuel")}}';
            url = url.replace(':fuel', good_received_note_id);

            jQuery.ajax({
                type: "get",
                url: url,
                success: function (data) {
                    if (data == 'DONE') {
                        tr_p.fadeOut(function () {
                            jQuery(this).remove();
                        });
                    } else if (data == 'NOT_ALLOWED') {
                        alert("FAIL TO DELETE GRN, THIS GRN IS BILLED");
                    }
                },
                error: function (data) {

                }
            });
            return false;
        });

        jQuery(function () {
            jQuery('#datetimepicker1').datetimepicker({
                format: 'yyyy-MM-dd hh:mm:ss',
                inline: true,
                sideBySide: true
            });

        });

        jQuery("#quantity").keyup(function () {
            var rate = removeComma(jQuery('#rate').val());
            var amount = rate * jQuery(this).val();
            jQuery('#amount').val(amount.toLocaleString());

        });
        jQuery("#rate").keyup(function () {
            var quantity = removeComma(jQuery('#quantity').val());
            var amount = quantity * jQuery(this).val();
            jQuery('#amount').val(amount.toLocaleString());
        });

        function checkedRoutes() {
            var checkRoutes = [];
            jQuery('.goods_received_note_id').each(function () {
                if (jQuery(this).is(':checked')) {
                    checkRoutes.push(jQuery(this).val());
                }
            });
            return checkRoutes;
        }

        function removeComma(element) {
            return element.replace(',', '').replace(',', '').replace(',', '').replace(',', '').replace(',', '').replace(',', '').replace(',', '');
        }
    </script>
@stop