@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
@php $challenType = ['1'=>'Return','2'=>'Non Return']; @endphp
@section('mainContentArea')
    <div class="card card-default">
        <div class="card-header">
            <h4>
                <a href="{{ route('challan.issued') }}" class="btn btn-info float-right btn-sm backBtn"> Back</a>
            </h4>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="alert alert-info processingOrder" style="display: none;">Saving Challan 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>Challan Info</h5>
                    <hr/>
                    {{-- FORM AREA --}}
                    <form method="POST" enctype="multipart/form-data" name="mainFrmSo" class="posSaleOrderFromMain"
                            action="{{ route('save-challan-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."  />
                        </div>
                        
                        <div class="form-group">
                            <label for="order_date">Challan Date</label>
                            <input name="order_date" id="order_date" class="form-control datepicker" placeholder="Enter Order Date." required readonly style="width:100%;" />
                            <sub class="text-danger">Click on text box to select the date from calendar.</sub>
                        </div>
                        <div class="form-group">
                            <label for="challenType">Challen Type</label>
                            <select name="challenType" id="challenType" class="form-control select2" required>
                                <option value="">Select Option</option>
                                @foreach($challenType as $key => $statusv)
                                <option value="{{ $key }}" {{ old('challenType') == $key ? 'selected' : '' }}>{{ $statusv }}</option>
                                @endforeach
                            </select>
                        </div> 
                        <div class="form-group">
                              <label for="from_pos">From Warehouse</label>
                        <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 }}" >{{ $warehouse->warehouse_code . ' ('.$warehouse->name.')' }}</option>
                                   
                                @endforeach
                        </select>

                         </div> 

                        <div class="form-group">
                            <label for="name">Issued To Name</label>
                   
                            <textarea name="issued_to" id="user" class="form-control" placeholder="Please Enter name ." required>
                                {{old('issued_to')}}
                            </textarea>
                        </div>   

                        <div class=" form-group">
                            <label for="reason">Reason </label>
                            <textarea name="reason" id="reason" class="form-control" placeholder="Please Enter Remark ." required>
                                {{old('reason')}}
                            </textarea>
                        </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>Challan Products <span class="float-right totalScannedItems"></span></h5>
                    <p class="text-danger">All the baarcodes scanned will be added to Challan after Challan is saved.</p>
                    <hr/>
                    <table class="table table-striped table-bordered selectedOrderProducts fixTable">
                        <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($("#user").val());
            var challenType = $.trim($("#challenType").val());
            var skipUniq = 0;
            if(document.getElementById("skipUniq") != null) {
                if(document.getElementById("skipUniq").checked == true) {
                    skipUniq = 1;
                }
            }
            if(e.which == 13) {
               if(boxNum == '' || barcode == '') {
                toastr.error('Please enter issued name and enter box number and barcode to outward product.');
                
                    return false;
                }
                else if(skipUniq == 0 && $('tr.'+barcode).length > 0) {
                    toastr.error('Barcode is already scanned');
                    return false;
                }else {
                    lockTrans();
                    $.post("{{ route('get-so-challan-product-info') }}", {
                        _token: document.mainFrmSo._token.value,
                        boxNum: boxNum,
                        frm: frm,
                        to: to,                       
                        barcode: barcode,
                        skipUniq: skipUniq
                    }, function(result) {
                        var response = jQuery.parseJSON(result);
                        if(response.status == false) {
                            toastr.error(response.info);
                        } 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);
                        }
                        unlockTrans();
                        return false;
                    });
                }
            }
        });
    });
</script>
@endsection