 <?php $__env->startSection('content'); ?>
<style>
    .table th {
            vertical-align: middle !important;
    }
    .table > thead > tr > th {
        border: 1px solid white;
        text-align: center;
    }
    .jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content div {
        color: rgb(0, 49, 79);
        font-weight: 500;
        padding-left: 5px;
        text-align: left;
    }
</style>
    <?php Fun::lang() ?>
    <div class="title-page">
        <div class="page-bar">
            <ul class="page-breadcrumb">
                <li><a href="#"><i class="fa fa-dashboard"></i> Dashboard</a></li>
                <li><a href="#">Construction</a></li>
                <li><a href="#">Manage Construction Stock</a></li>
                <li><a href="#">Manage Stock</a></li>
                <li><a href="#">Manage Using</a></li>
                <li><a href="#">Create</a></li>
            </ul>
        </div>
    </div>
    <div class="page">
        <div class="top-content">
            <div class="row">
                <div class="col-sm-12 col-xs-12">
                    <div class="title-page">
                        <div class="pull-left">
                            <h3>Assing Product Using</h3>
                        </div>
                    </div>
                </div>
            </div>
            <div class="pull-right">
                <a class="button_sm button_success" href="javascript:void(0)" id="create-zone"><span class="fa fa-plus"></span> Create Zone</a>
                
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12 col-xs-12"> 

                <div class="form-wrapper">
                    <?php echo Form::open(array('route' => 'manage-using-controller.store','method'=>'POST', 'enctype'=>'multipart/form-data')); ?>

                    <?php echo csrf_field(); ?>
                    <div class="row">
                        <div class="form-group col-sm-6 col-xs-12">
                            <label class="required">Project</label>
                            <?php echo Form::select('project',$projects, null, array('class' => 'form-control select2','id'=>'project-id')); ?>

                        </div>
                        <div class="form-group col-sm-6 col-xs-12">
                            <label class="required">Warehouse</label>
                            <?php echo Form::select('warehouse',[], null, array('class' => 'form-control select2','id'=>'warehouse-id')); ?>

                        </div>
                        <div class="form-group col-sm-6 col-xs-12">
                            <label class="">Date</label>
                            <?php echo Form::text('date', date('d-m-Y'), array('placeholder' => 'Date','class' => 'form-control date_picker','autocomplete'=>'off')); ?>

                        </div>

                        <div class="form-group col-sm-12 col-xs-12">
                            <table class="table table-striped table-bordered" width="100%">
                                <thead>
                                    <tr>
                                        <th rowspan="2">No</th>
                                        <th rowspan="2">
                                            <label class="required">
                                                Product Name
                                            </label>
                                        </th>
                                        <th colspan="2" style="text-align: center;">
                                            <label class="required">
                                               Place to use
                                            </label>
                                        </th>
                                        <th rowspan="2">
                                            <label class="required">
                                                Qty
                                            </label>
                                        </th>
                                        <th rowspan="2">
                                            <label class="required">
                                                Unit
                                            </label>
                                        </th>
                                        <th rowspan="2">
                                            <label>
                                               Other
                                            </label>
                                        </th>
                                        <th rowspan="2">
                                            <span class="pull-right button_primary btn-sm plus_ens fa fa-plus" onclick="add_row_product(this)"></span>
                                        </th>
                                    </tr>
                                    <tr>
                                        <th>
                                            Zone
                                        </th>
                                        <th>
                                            House Number
                                        </th>
                                    </tr>
                                </thead>
                                <tbody class="resultbody1">
                                    <tr id="dd">
                                        <td width="4%">
                                            <span>1</span>
                                        </td>
                                        <td width="12%">
                                            <select name="product_id[]" class="form-control select2" id="first-select-product" onchange="selected_product(this)">
                                            </select>
                                        </td>
                                        <td style="width: 200px !important;">
                                            <select name="place_to_use_zone[]" class="form-control select2" >
                                                <?php echo $zone; ?>

                                            </select>
                                        </td>
                                        <td style="width: 200px !important;">
                                            <select name="place_to_use_house_number[]" class="form-control select2" >
                                                <?php echo $number_house; ?>

                                            </select>
                                        </td>
                                        <td width="10%">
                                            <input type="text" class="form-control" name="qty[]" onchange="check_qty(this)">
                                        </td>
                                        <td width="6%">
                                            <input type="text" class="form-control" name="unit[]" readonly="readonly">
                                        </td>
                                        <td>
                                            <?php echo Form::textarea('description[]', null, array('placeholder' => 'Description','class' => 'form-control','rows'=>'2')); ?>

                                        </td>
                                        <td><button class="btn btn-sm btn-danger" disabled>
                                            <span class="fa fa-trash"></span></button>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>

                        <div class="col-sm-12 col-xs-12">
                            <div class="form-group">
                                <button type="submit" id="button-submit" style="display: none;" class="button_sm button_success pull-right" data-type="order"><span
                                    class="fa fa-chevron-circle-right"></span>
                                </button>
                                <button type="button" class="button_sm button_success pull-right" data-type="order" onclick="submit_button()"><span
                                            class="fa fa-chevron-circle-right"></span> save
                                </button>
                                <button type="button" onClick="javascript:history.go(-1)"
                                        class="button_sm button_warning pull-right">
                                    <span class=" fa fa-arrow-circle-left"></span> Back
                                </button>
                            </div>
                        </div>
                    </div>

                    <?php echo Form::close(); ?>

                </div>
            </div>
        </div>
    </div>
<?php $__env->stopSection(); ?>
<?php $__env->startSection('js'); ?>
<script>
    var product_option = ``;var products = ``;var origin_product = [];
    var zone_option = "<?php echo $zone; ?>";var number_house_option = "<?php echo $number_house; ?>";
    function set_origin_product_qty_check(){
        var route = "<?php echo e(route('construction.get_product_from_warehouse',':id')); ?>";
        route = route.replace(':id',$("#warehouse-id").val());
        $("#main-spinner").show();
        $.ajax({
            url:route,
            type:"GET",
            dataType:"JSON",
            success:function(data)
            {
                products = data;
            },
            complete:function()
            {
                $("#main-spinner").hide();
            }
        });
        console.log(products);
    }
    function check_qty_product()
    {
        var status_error = 0;
        var row = $(".resultbody1").find('tr');
        $(row).each(function(index,value){
            $.each(products,function(num,val){
                if($(value).find("td:eq(1)").find('select').val()==val.product_id){
                    var qty_selected = $(value).find("td:eq(4)").find('input').val();
                    products[num].qty = products[num].qty - qty_selected;
                    if(products[num].qty<0||qty_selected<=0){
                        status_error=1;
                    }
                }
            });
        });
        return status_error;
    }
    function check_selection(){
        var row = $(".resultbody1").find('tr');
        var status_submit = 0;
        $(row).each(function(index,value){
            $(row).each(function(dex,val){
                if(index==dex){

                }else{
                    if($(value).find("td:eq(1)").find('select').val()==$(val).find("td:eq(1)").find('select').val()){
                        if($(value).find("td:eq(2)").find('select').val()==$(val).find("td:eq(2)").find('select').val()){
                            if($(value).find("td:eq(3)").find('select').val()==$(val).find("td:eq(3)").find('select').val()){
                                status_submit=1;
                            }
                        }
                    }
                }
                    
            });
        });
        return status_submit;
        
    }
    function submit_button(){
        if(check_selection()==1){
            $.alert({
                title: '',
                type: 'red ',
                content :"Your requesst is failed.Please it again before submit !",
                useBootstrap: false,
                boxWidth: '20%',
                theme: 'modern',
                buttons: {
                    close: {
                        text: 'close',
                        btnClass: 'button_warning',
                    }
                }
            });
        }else if(check_qty_product()==1){
            $.alert({
                title: '',
                type: 'red ',
                content :"Your requesst is failed (Qty < 0).Please it again before submit !",
                useBootstrap: false,
                boxWidth: '20%',
                theme: 'modern',
                buttons: {
                    close: {
                        text: 'close',
                        btnClass: 'button_warning',
                    }
                }
            });
        }
        else{
            $("#button-submit").click();
        }
    }
    function check_qty(obj)
    {
        var product_id = $(obj).closest('tr').find("td:eq(1)").find('select').val();
        var warehouse_id =$("#warehouse-id").val();
        var qty = $(obj).val();
        set_origin_product_qty_check();
        check_qty_product_stock(warehouse_id,product_id,obj);
    }
    function check_qty_product_stock (warehouse_id,product_id,obj) {
        if(product_id==null||product_id==""){
            $.alert({
                title: '',
                type: 'red ',
                content :"Product did't choose.Please select product !",
                useBootstrap: false,
                boxWidth: '20%',
                theme: 'modern',
                buttons: {
                    close: {
                        text: 'close',
                        btnClass: 'button_warning',
                    }
                }
            });
        }else{
            $("#main-spinner").show();
            $.ajax({
                url: '<?php echo e(route("construction.check_qty_product")); ?>',
                type: 'POST',
                dataType: 'JSON',
                data: {
                    "_token":"<?php echo e(csrf_token()); ?>",
                    warehouse_id:warehouse_id,
                    product_id:product_id
                },
            })
            .done(function(data) {
                var check_qty = data.qty;
                if(check_qty<$(obj).val())
                {
                    $.alert({
                        title: '',
                        type: 'red ',
                        content :'Product quantities is not enough. Please change request !',
                        useBootstrap: false,
                        boxWidth: '20%',
                        theme: 'modern',
                        buttons: {
                            close: {
                                text: 'close',
                                btnClass: 'button_warning',
                            }
                        }
                    });
                    $(obj).val("");
                }
            })
            .fail(function() {
                console.log("error");
            })
            .always(function() {
                $("#main-spinner").hide();
            });
        }
    }
    function check_selected_product(select_product,obj)
    {
        var row = $('tbody.resultbody1').find('tr');
        var check = 0;
        $(row).each(function  (index,value) {
            var product_check = $(this).find("td:eq(1)").find('select').val();
            
            if(select_product==product_check){
                check++;
            }
            if(check>=2){
                $.alert({
                    title: '',
                    type: 'red ',
                    content :'Product have been choosing. Please change selection !',
                    useBootstrap: false,
                    boxWidth: '20%',
                    theme: 'modern',
                    buttons: {
                        close: {
                            text: 'close',
                            btnClass: 'button_warning',
                        }
                    }
                });
                $(obj).html(product_option);
            }
        });
    }
    $(document).on("change","#warehouse-id",function(){
        var route = "<?php echo e(route('construction.get_product_from_warehouse',':id')); ?>";
        route = route.replace(':id',$(this).val());
        $("#main-spinner").show();
        $.ajax({
            url:route,
            type:"GET",
            dataType:"JSON",
            success:function(data)
            {
                products = data;
                product_option = `<option value=''>Please Select</option>`;
                $.each(data,function(index,value)
                {
                    product_option +=`<option value='${value.product_id}' data-unit-name = '${value.unit_name}'>${value.product_name}</option>`;
                });
                $("#first-select-product").html(product_option);
            },
            complete:function()
            {
                $("#main-spinner").hide();
            }
        });
    });
    $(document).on("change","#project-id",function(){
        var route = "<?php echo e(route('construction.select_warehouse',':id')); ?>";
        route = route.replace(":id",$(this).val());
        $("#main-spinner").show();
        $.ajax({
            url:route,
            type:"GET",
            dataType:"JSON",
            success:function(data)
            {
                var opt = '<option value = "">Please Select</option>';
                $.each(data,function(index,value){
                    opt+=`<option value = "${value.id}">${value.name}</option>`;
                });
                $("#warehouse-id").html(opt);
                
            },
            complete:function(){
                $("#main-spinner").hide();
            }
        });
    });
    function add_row_product(obj)
    {
        var tr_class =  $(obj).closest("table").find('tbody').attr('class');
        var tr = `<tr class="tr-table-${tr_class}">
                    <td width="4%">
                        <span>${ $(obj).closest("table").find("tbody").find("tr").length+1}</span>
                    </td>
                    <td width="12%">
                        <select name="product_id[]" class="form-control select2" onchange="selected_product(this)">
                            ${product_option}
                        </select>
                    </td>
                    <td style="width: 200px !important;">
                        <select name="place_to_use_zone[]" class="form-control select2" >
                            ${zone_option}
                        </select>
                    </td>
                    <td style="width: 200px !important;">
                        <select name="place_to_use_house_number[]" class="form-control select2" >
                            ${number_house_option}
                        </select>
                    </td>
                    <td width="10%">
                        <input type="text" class="form-control" name="qty[]" onchange="check_qty(this)">
                    </td>
                    <td width="6%">
                        <input type="text" class="form-control" name="unit[]" readonly="readonly">
                    </td>
                    <td>
                        <?php echo Form::textarea('description[]', null, array('placeholder' => 'Description','class' => 'form-control','rows'=>'2')); ?>

                    </td>
                    <td><button type="button" class="btn btn-sm btn-danger" onclick="remove(this)">
                        <span class="fa fa-trash"></span></button>
                    </td>
                </tr>`;

        var table = $(obj).closest("table");
            
        $(table).find("tbody").append(tr);
        $(".select2").select2();
    }
    function remove(obj)
    {
        var index = 1;
        var tr_class =  $(obj).closest("table").find('tbody').attr('class');
        $(obj).closest('tr').remove();
        $("tr.tr-table-"+tr_class).each(function(){
            $(this).find('td:eq(0)').html(`<span>${++index}</span>`);
        });
        set_origin_product_qty_check();
    }
    function selected_product(obj){
        var id = $(obj).val();
        if(id==""){

        }else{
            $("#main-spinner").show();
        }
        
        var route = "<?php echo e(route('construction.boq.get_product_info',':id')); ?>";
        route = route.replace(":id",id);
        $.ajax({
            url:route,
            dataType:"JSON",
            type:"GET",
            success:function(data){
                $("#main-spinner").hide();
                $(obj).closest('tr').find("td:eq(5)").find("input").val(data.unit_name);
            },
            error:function(){
                $(obj).closest('tr').find("td:eq(5)").find("input").val("");
            }
        });
    }

    $(document).on("click","#create-zone",function()
    {
        var date = "<?php echo e(date('d-m-Y')); ?>";
        $.confirm({
            title:'<H4>Create Zone</H4>',
            content:
            '<form action="" class="formName">' +
                '<div class="form-group">' +
                    '<label>Date:</label><input type="text"  placeholder="Date" value="'+date+'" class="date-create form-control" id="date_picker" required />' +
                '</div>' +
                '<div class="form-group">' +
                    '<label>Zone Name:</label><input type="text"  placeholder="Zone Name" class="zone-name form-control" />' +
                '</div>' +
            '</form>',
            theme:'modern',
            buttons: {
                formSubmit: {
                    text: 'Submit',
                    btnClass: 'btn-blue',
                    action: function () {
                        var date = this.$content.find('.date-create').val();
                        var zone = this.$content.find('.zone-name').val();
                        if(!date){
                            $.alert('Please input value');
                            return false;
                        }
                        if(!zone){
                            $.alert('Please input zone');
                            return false;
                        }
                        $.ajax({
                            url:"<?php echo e(route('construction.create_zone_store')); ?>",
                            type:"POST",
                            dataType:"JSON",
                            data:{
                                "_token":"<?php echo e(csrf_token()); ?>",
                                zone:zone,
                                date:date
                            },
                            success:function(data){
                                zone_option +=`<option value=''>Please Select</option>`;
                                $.each(data,function(index,value){
                                    zone_option +=`<option value='${value.id}'>${value.name}</option>`;
                                });
                            }
                        });
                    }
                },
                cancel: function () {
                },
            },
            onContentReady: function () {
                var jc = this;
                this.$content.find('form').on('submit', function (e) {
                    e.preventDefault();
                    jc.$$formSubmit.trigger('click');
                });
            }
        });
    });
    $(document).on("click","#create-house-number",function()
    {
        var date = "<?php echo e(date('d-m-Y')); ?>";
        $.confirm({
            title:'<H4>Create House Number</H4>',
            content:
            '<form action="" class="formName">' +
                '<div class="form-group">' +
                    '<label>Date:</label><input type="text"  placeholder="Date" value="'+date+'" class="date-create form-control" id="date_picker" required />' +
                '</div>' +
                '<div class="form-group">' +
                    '<label>House Number:</label><input type="text"  placeholder="House Number" class="house-number form-control" />' +
                '</div>' +
            '</form>',
            theme:'modern',
            buttons: {
                formSubmit: {
                    text: 'Submit',
                    btnClass: 'btn-blue',
                    action: function () {
                        var date = this.$content.find('.date-create').val();
                        var house_number = this.$content.find('.house-number').val();
                        if(!date){
                            $.alert('Please input value');
                            return false;
                        }
                        if(!house_number){
                            $.alert('Please input zone');
                            return false;
                        }
                        $.ajax({
                            url:"<?php echo e(route('construction.create_house_number_store')); ?>",
                            type:"POST",
                            dataType:"JSON",
                            data:{
                                "_token":"<?php echo e(csrf_token()); ?>",
                                house_number:house_number,
                                date:date
                            },
                            success:function(data){
                                number_house_option +=`<option value=''>Please Select</option>`;
                                $.each(data,function(index,value){
                                    number_house_option +=`<option value='${value.id}'>${value.name}</option>`;
                                });
                            }
                        });
                    }
                },
                cancel: function () {
                },
            },
            onContentReady: function () {
                var jc = this;
                this.$content.find('form').on('submit', function (e) {
                    e.preventDefault();
                    jc.$$formSubmit.trigger('click');
                });
            }
        });
    });
    $(document).on("focus","#date_picker",function(){
        $(this).datepicker({
            dateFormat: 'dd-mm-yy',
            changeMonth: true
        });
    });
</script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('adminlte::page', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>