@extends('layouts.backend')
@section('extraCss')
    <style>
        .select2-dropdown,
        .select2-dropdown--above,
        .select2-container--open .select2-dropdown--below {
            min-width: 200px !important;
        }

    </style>
    <style>
        .pos-sale-orderCombinations td,
        .pos-sale-orderCombinations td input {
            font-size: 11px;
        }

        .selectedOrderProducts th .form-control,
        .selectedOrderProducts td .form-control {}

        .selectedOrderProducts th,
        .selectedOrderProducts td,
        .selectedOrderProducts th .form-control,
        .selectedOrderProducts td .form-control {
            font-size: 10px;
            padding: 5px;
        }

    </style>
@endsection

@section('mainContentArea')
    <div class="card card-default">
        <div class="card-header">
            <h4>
                @if(Route::currentRouteName() == 'party-sale-orders-by-barcode')
                Add New Party Sale Order
                <a href="{{ route('party-sale-orders.index') }}" class="btn btn-info float-right btn-sm backBtn"> Back</a>
                @elseif(Route::currentRouteName() == 'wh-sale-orders-by-barcode')
                Add New Warehouse Sale Order
                <a href="{{ route('party-sale-orders.index') }}" class="btn btn-info float-right btn-sm backBtn"> Back</a>
                @else
                Add New POS Sale Order
                <a href="{{ route('pos-sale-orders.index') }}" class="btn btn-info float-right btn-sm backBtn"> Back</a>
                @endif
            </h4>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="alert alert-info processingOrder" style="display: none;">Saving order please wait...</div>
                <div class="col-md-3 formArea">
                    <div class="alert alert-info">
                        <h6>Scan Barcodes</h6>
                        <div class="form-group">
                            <label for="boxnum">Box Number</label>
                            <input type="text" class="form-control" id="boxNum">
                        </div>
                        <div class="form-group">
                            <label for="barcode">Barcode</label>
                            <input type="text" class="form-control" id="soBarcode">
                        </div>
                    </div>
                    <h5>Order Info</h5>
                    <hr/>
                    
                    {{-- FORM AREA --}}
                    <form method="POST" enctype="multipart/form-data" name="mainFrmSo" class="posSaleOrderFromMain"
                            action="{{ route('save-pos-sale-orders-by-barcode') }}"
                            onsubmit="if($('.orderItems').html() == ''){toastr.error('Please scan products to save order!');return false;}$('.formArea').hide(); $('.processingOrder').show()"
                        >
                        @csrf
                        <div class="d-none orderItems"></div>
                        <div class="form-group"><label for="skipUniq"><input type="checkbox" id="skipUniq" name="skipUniq" value="1"> <b>Skip Unique Check</b></label></div>
                        <div class="form-group">
                            <label for="manual_ref_no">Manual Ref#</label>
                            <input name="manual_ref_no" id="manual_ref_no" class="form-control" placeholder="Enter Manual Ref. no." required value="{{ empty($posSaleOrder->manual_ref_no) ? 'N/A' : $posSaleOrder->manual_ref_no }}"/>
                        </div>
                        
                        <div class="form-group">
                            <label for="order_date">Order Date</label>
                            <input name="order_date" id="order_date" class="form-control datepicker" placeholder="Enter Order Date." required readonly style="width:100%;" value="{{ empty($posSaleOrder->shipto) ? '' : trim(str_replace("00:00:00", "", $posSaleOrder->order_date)) }}"/>
                            <sub class="text-danger">Click on text box to select the date from calendar.</sub>
                        </div>
                          
                        <div class="form-group">
                            <label for="from_pos">FROM WAREHOUSE</label>
                            @php
                                $userWarehouses = Auth::user()->stores;
                                if(!empty($userWarehouses)) {
                                    $userWarehouses = json_decode($userWarehouses, true);
                                } else {
                                    $userWarehouses = NULL;
                                }
                            @endphp

                            @if(empty($userWarehouses))
                            <select name="from_pos" id="from_pos" class="form-control select2" data-placeholder="Select Order From" required>
                                <option value="">Select Warehouse</option>
                                @foreach($ALL_WAREHOUSES as $warehouse)
                                <option value="{{ $warehouse->id }}" {{ !empty($posSaleOrder->from_pos) && $posSaleOrder->from_pos == $warehouse->id ? 'selected' : '' }}>{{ $warehouse->warehouse_code . ' ('.$warehouse->name.')' }}</option>
                                @endforeach
                            </select>
                            @else
                            <select name="from_pos" id="from_pos" class="form-control select2" data-placeholder="Select Order From" required>
                                <option value="">Select Warehouse</option>
                                @foreach($ALL_WAREHOUSES as $warehouse)
                                    @if(in_array($warehouse->id, $userWarehouses))
                                    <option value="{{ $warehouse->id }}" {{ !empty($posSaleOrder->from_pos) && $posSaleOrder->from_pos == $warehouse->id ? 'selected' : '' }}>{{ $warehouse->warehouse_code . ' ('.$warehouse->name.')' }}</option>
                                    @endif
                                @endforeach                          
                                @if((auth()->user()->role_id === 1)  || (auth()->user()->id === 3 ))

                                @foreach($ALL_POS as $warehouse)
                                <option value="{{ $warehouse->id }}" {{ !empty($posSaleOrder->to_pos) && $posSaleOrder->to_pos == $warehouse->id ? 'selected' : '' }}>{{ $warehouse->warehouse_code . ' ('.$warehouse->name.')' }}</option>
                                @endforeach
                                
                                @endif

                            </select>
                            @endif

                            
                        </div>
                        @if(Route::currentRouteName() == 'pos-sale-orders-by-barcode')
                        <input type="hidden" name="to_party" id="to_party" value="0">
                        <div class="form-group">
                            <label for="to_pos">TO POS</label>
                            <select name="to_pos" id="to_pos" class="form-control select2" data-placeholder="Select Order To" required>
                                <option value="">Select POS</option>
                                @foreach($ALL_POS as $warehouse)
                                <option value="{{ $warehouse->id }}" {{ !empty($posSaleOrder->to_pos) && $posSaleOrder->to_pos == $warehouse->id ? 'selected' : '' }}>{{ $warehouse->warehouse_code . ' ('.$warehouse->name.')' }}</option>
                                @endforeach
                            </select>
                        </div>
                        @elseif(Route::currentRouteName() == 'wh-sale-orders-by-barcode')
                        <input type="hidden" name="to_party" id="to_party" value="0">
                        <div class="form-group">
                            <label for="to_pos">TO WAREHOUSE</label>
                            <select name="to_pos" id="to_pos" class="form-control select2" data-placeholder="Select Order To" required>
                                <option value="">Select WAREHOUSE</option>
                                @foreach($ALL_WAREHOUSES as $warehouse)
                                <option value="{{ $warehouse->id }}" {{ !empty($posSaleOrder->to_pos) && $posSaleOrder->to_pos == $warehouse->id ? 'selected' : '' }}>{{ $warehouse->warehouse_code . ' ('.$warehouse->name.')' }}</option>
                                @endforeach
                            </select>
                        </div>
                        @else
                        <input type="hidden" name="to_pos" id="to_pos" value="0">
                        <div class="form-group">
                            <label for="to_party">TO PARTY</label>
                            <select name="to_party" id="to_party" class="form-control select2" data-placeholder="Select Order To" required>
                                <option value="">Select Party</option>
                                @foreach($parties as $party)
                                <option value="{{ $party->id }}" {{ !empty($posSaleOrder->to_party) && $posSaleOrder->to_party == $party->id ? 'selected' : '' }}>{{ $party->company_name . ' ('.$party->name.')' }}</option>
                                @endforeach
                            </select>
                        </div>
                        @endif
                        <div class="form-group d-none">
                            <label for="shipto">Ship to:</label>
                            <textarea name="shipto" id="shipto" class="form-control" placeholder="Enter Ship to Details." required>{{ empty($posSaleOrder->shipto) ? 'N/A' : $posSaleOrder->shipto }}</textarea>
                        </div>
                        <div class="form-group d-none">
                            <label for="shipto">Shipping Company</label>
                            <input name="shipping_company" id="shipping_company" class="form-control" placeholder="Enter logictic company." required value="{{ empty($posSaleOrder->shipping_company) ? 'N/A' : $posSaleOrder->shipping_company }}">
                        </div>
                        <div class="form-group d-none">
                            <label for="shipto">Place of Supply</label>
                            <input name="place_of_supply" id="place_of_supply" class="form-control" placeholder="Enter place to supply." required value="{{ empty($posSaleOrder->place_of_suply) ? 'N/A' : $posSaleOrder->place_of_suply }}">
                        </div>
                        <div class="form-group d-none">
                            <label for="shipto">AWB No.</label>
                            <input name="awb_no" id="awb_no" class="form-control" placeholder="Enter AWB No.." required value="{{ empty($posSaleOrder->awb_no) ? 'N/A' : $posSaleOrder->awb_no }}">
                        </div>
                        <div class="form-group">
                            <button class="btn btn-block btn-primary btnSubmit">Save Order</button>
                        </div>
                    </form>
                    {{-- FORM AREA --}}
                </div>
                <div class="col-md-9 formArea">
                    <h5>Order Products <span class="float-right totalScannedItems"></span>  <br><span class="float-right totalScannedItemsValue" id="totalScannedItemsValue"></span></h5>
                    <p class="text-danger">All the baarcodes scanned will be added to order after order is saved.</p>
                    <hr/>
                    <table class="table table-striped table-bordered selectedOrderProducts fixTable" id="selectedOrderProducts">
                        <thead>
                            <tr>
                                <th width="8%">HSN</th>
                                <th width="14%">CODE</th>
                                <th width="8%">ARTICLE</th>
                                <th width="8%">COLOR</th>
                                <th width="8%">SIZE</th>
                                <th width="8%">BARCODE</th>
                                <th width="8%">QTY</th>
                                <th width="8%">MRP</th>
                                <th width="8%">DISCOUNT (%)</th>
                                <th width="8%">DISCOUNT (Amt.)</th>
                                <th width="8%">TAX</th>
                                <th width="8%">FINAL</th>
                                <th width="2%"></th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                </div>
            </div>
            {{-- --}}
            {{-- --}}
        </div>
    </div>
@endsection

@section('extraJs')
<script>
    function lockTrans() {
        $("#soBarcode").hide();
        $("#boxNum").hide();
        $(".btnSubmit").hide();
    }
    
    function unlockTrans() {
        $("#soBarcode").show();
        $("#boxNum").show();
        $(".btnSubmit").show();
        $("#soBarcode").val('');
        $("#soBarcode").focus();
    }

    $(document).ready(function () {
        $("#soBarcode").keyup(function (e) {
            var barcode = $.trim($(this).val());
            var boxNum = $.trim($("#boxNum").val());
            var frm = $.trim($("#from_pos").val());
            var to = $.trim($("#to_pos").val());
            var party = $.trim($("#to_party").val());
            var skipUniq = 0;
            if(document.getElementById("skipUniq") != null) {
                if(document.getElementById("skipUniq").checked == true) {
                    skipUniq = 1;
                }
            }
            if(e.which == 13) {
                @if(Route::currentRouteName() == 'party-sale-orders-by-barcode')
                if(boxNum == '' || barcode == '' || frm == '' || party == '') {
                toastr.error('Please select source warehouse and target party and enter box number and barcode to outward product.');
                @else
                if(boxNum == '' || barcode == '' || frm == '' || to == '') {
                toastr.error('Please select source and target warehouse and enter box number and barcode to outward product.');
                @endif
                    return false;
                } else if(skipUniq == 0 && $('tr.'+barcode).length > 0) {
                    toastr.error('Barcode is already scanned');
                    return false;
                }else {
                    lockTrans();
                    var q_scan = $('tr.'+barcode).length + 1;
                    $.post("{{ route('get-so-product-info') }}", {
                        _token: document.mainFrmSo._token.value,
                        boxNum: boxNum,
                        frm: frm,
                        to: to,
                        party: party,
                        barcode: barcode,
                        skipUniq: skipUniq
                    }, function(result) {
                        var response = jQuery.parseJSON(result);
                        if(response.status == false) {
                            toastr.error(response.info);
                            unlockTrans();
                        } else {
                            if(q_scan > response.product.tqty) {
                                toastr.error('Total available quantity in warehouse '+response.product.tqty);
                            }
                            else {
                                var p = response.product;
                                toastr.success(response.info);
                                var html = '\
                                <tr class="'+p.barcode+'">\
                                    <td>'+p.hsn+'</td>\
                                    <td>'+p.productcode+'</td>\
                                    <td>'+p.article+'</td>\
                                    <td>'+p.color+'</td>\
                                    <td>'+p.size+'</td>\
                                    <td>'+p.barcode+'</td>\
                                    <td>'+p.qty+'</td>\
                                    <td>'+p.mrp+'</td>\
                                    <td>'+p.discper+'</td>\
                                    <td>'+p.discamt+'</td>\
                                    <td>'+p.taxAmt+'</td>\
                                    <td>'+p.finalmrp+'</td>\
                                    <td><a href="#" onclick="$(\'tr.'+p.barcode+'\').remove();$(\'span.'+p.barcode+'\').remove();" class="btn btn-sm btn-danger"><i class="fa fas fa-times"></i></a></td>\
                                </tr>\
                                ';
                                $(".selectedOrderProducts tbody").prepend(html);
                                var html = '\
                                <span class="'+p.barcode+'">\
                                    <input type="hidden" name="boxNum[]" value="'+boxNum+'"/>\
                                    <input type="hidden" name="hsn[]" value="'+p.hsn+'"/>\
                                    <input type="hidden" name="productcode[]" value="'+p.productcode+'"/>\
                                    <input type="hidden" name="article[]" value="'+p.article+'"/>\
                                    <input type="hidden" name="color[]" value="'+p.color+'"/>\
                                    <input type="hidden" name="size[]" value="'+p.size+'"/>\
                                    <input type="hidden" name="barcode[]" value="'+p.barcode+'"/>\
                                    <input type="hidden" name="qty[]" value="'+p.qty+'"/>\
                                    <input type="hidden" name="mrp[]" value="'+p.mrp+'"/>\
                                    <input type="hidden" name="discper[]" value="'+p.discper+'"/>\
                                    <input type="hidden" name="discamt[]" value="'+p.discamt+'"/>\
                                    <input type="hidden" name="taxAmt[]" value="'+p.taxAmt+'"/>\
                                    <input type="hidden" name="finalmrp[]" value="'+p.finalmrp+'"/>\
                                    <input type="hidden" name="product_id[]" value="'+p.product_id+'"/>\
                                    <input type="hidden" name="variant_id[]" value="'+p.variant_id+'"/>\
                                    <input type="hidden" name="taxper[]" value="'+p.taxper+'"/>\
                                </span>\
                                ';
                                $(".orderItems").append(html);
                                $(".totalScannedItems").html('Total Items: ' + $(".selectedOrderProducts tbody tr").length);

                                    var table = document.getElementById("selectedOrderProducts"), sumVal = 0;
                                    for(var i = 1; i < table.rows.length; i++)
                                    {                                    
                                        sumVal = sumVal +  parseFloat(table.rows[i].cells[11].innerHTML);
                                    }
                                    
                                    document.getElementById("totalScannedItemsValue").innerHTML = "Sum Value = " + sumVal;
                                    console.log(sumVal);
                                $(".totalScannedItemsValue").html('Total Value: ' + sumVal.toFixed(2));
                            }
                            unlockTrans();
                            return false;
                        }
                    });
                }
            }
        });
    });
</script>
@endsection