<div class="modal fade" tabindex="-1" data-backdrop="static" role="dialog" aria-labelledby="role-mode" id="add_Damage" aria-hidden="true" >
    <div class="modal-dialog" style="width:70%;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="pg-close fs-20"></i>
                </button>
                <h5 class="add-label bold text-left"><?php echo CommonLanguage::getMessage('Add_Damaged_Quantity'); ?></h5>
                <div id="ExpirySuccess" class="hidden"></div>
            </div>
            <div class="modal-body form-group" id="Add">
                <form id="DamageExpiryQty">
                    <div class="row">
                        <div class=" col-md-12 form-group"> 
                            <div  class=" col-md-6 "> 
                                <label><?php echo CommonLanguage::getMessage('customer_name') ?></label>
                                <input type="hidden" name="customer_id"  id="customer_id" class="full-width customer_id " > 
                            </div> 

                        </div> 
                    </div>
                    <div class="row">
                        <div class=" col-md-12 AddDiv form-group dep_product"> 
                            <div  class=" col-md-6 "> 
                                <label><?php echo CommonLanguage::getMessage('Depot') ?></label>
                                <input type="hidden" name="depot_id"  id="depot_id" class="full-width depot_id " required> 
                            </div> 
                            <div  class=" col-md-6 "> 
                                <label><?php echo CommonLanguage::getMessage('product') ?></label>
                                <input type="hidden" name="item_id"  id="item_id" class="full-width item_id " required> 
                            </div> 
                        </div> 
                    </div>
                    <div class="row">
                        <div class="form-group col-md-12 AddDiv form-group"> 
                            <div class="col-md-6 ">
                                <label><?php echo CommonLanguage::getMessage('UOM') ?></label>
                                <input  type="hidden" name="Depot" class="full-width Damaged_UOM" required />
                            </div>
                            <div  class=" col-md-6 Quantity"> 
                                <label><?php echo CommonLanguage::getMessage('Damaged_Quantity') ?></label>
                                <input type="text" name="Product_Damaged_Quantity"  id="Product_Damaged_Quantity" class="form-control input-rounded Product_Damaged_Quantity digits" required> 
                            </div> 
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6 hidden expiry-div">
                            <label><?php echo CommonLanguage::getMessage('Expiry_Date') ?></label>
                            <input  type="text" name="expiry_date" class="form-control expiry_date" id="expiry_date" />
                        </div>
                        <div class="col-md-6 hidden lot-div">
                            <label><?php echo CommonLanguage::getMessage('lot') ?></label>
                            <input  type="text" name="lot_nb" class="form-control lot_nb" id="lot_nb" />
                        </div>

                        <div class="col-md-6 hidden serial-div">
                            <label><?php echo CommonLanguage::getMessage('serial') ?></label>
                            <input  type="text" name="serial_nb" class="form-control serial_nb" id="serial_nb" />
                        </div>
                    </div>
                    <div class="row"> 
                        <div class="form-group col-md-12 AddDiv form-group"> 
                            <div  class=" col-md-12 Damaged"> 
                                <label><?php echo CommonLanguage::getMessage('Damage_Reason') ?></label>
                                <textarea  name="Product_Damaged_Reason"  id="Product_Damaged_Reason" cols="3" class=" form-control Product_Damaged_Reason" ></textarea>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" id="CloseModal" ><?php print CommonLanguage::getMessage('Close') ?></button>
                <button type="submit" style="color:#fff" class="btn bg-complete-darker " id="SubmitDamaged"><?php print CommonLanguage::getMessage('Save') ?></button>
            </div>
        </div>
    </div>
</div>
<script>
    var is_depot_content = <?php echo json_encode($is_depot_content); ?>,
            Check_Inputs = <?php echo json_encode(CommonLanguage::getMessage('Check_Inputs')); ?>,
            Failed_Submit = <?php echo json_encode(CommonLanguage::getMessage('Failed_Submit')); ?>,
            Submitted_Successfully = <?php echo json_encode(CommonLanguage::getMessage('Submitted_Successfully')); ?>;
    $(function () {
        apply_autocomplete($("#Product_Damaged_Reason"), 'StockAjax/searchDamageReason', function (event, ui, who) {
            who.val(ui.item.Damaged_Reason);
        });
        build_select2($("#customer_id"), "xhr/customerSearch")

        build_select2($("#item_id"), ("xhr/ProductSearch?Status_ID=1&is_not_service=1"))
        build_select2($("input.Damaged_UOM"), "xhr/productuomSearch?pid=" + $("#item_id").val())
        build_select2($("#depot_id"), "xhr/depotSearch")
        $(".expiry_date").datepicker({autoclose: true})
        $("#item_id").on("change", function () {
            build_select2($("input.Damaged_UOM"), "xhr/productuomSearch?pid=" + $("#item_id").val());
            $.ajax({
                url: "StockAjax/check_product_expiry",
                method: "GET",
                dataType: "json",
                data: {id: $(this).val()},
                complete: function (v1, v2) {
                    if (v2 == "success") {
                        $("#item_id").attr("data-expiry", v1.responseJSON['is_expiry'])
                        if (v1.responseJSON['is_expiry'] == 1) {
                            $(".expiry-div").removeClass("hidden")
                            $(".expiry_date").attr("required", "required")
                        } else {
                            $(".expiry-div").addClass("hidden")
                            $(".expiry_date").removeAttr("required")
                        }
                        if (v1.responseJSON['is_lot'] == 1) {
                            $(".lot-div").removeClass("hidden")
                        } else {
                            $(".lot-div").addClass("hidden")
                        }
                        if (v1.responseJSON['is_serial'] == 1) {
                            $(".serial-div").removeClass("hidden")
                        } else {
                            $(".serial-div").addClass("hidden")
                        }
                    }
                }
            })
        })
        $("#SubmitDamaged").on("click", function () {
            $("#DamageExpiryQty").validate()
            if ($("#DamageExpiryQty").valid()) {
                var Data = {
                    Product_ID: $("#item_id").val(),
                    Depot_ID: $("#depot_id").val(),
                    customer_id: $("#customer_id").val(),
                    Damaged_Quantity: $('.Product_Damaged_Quantity').val(),
                    UOM_ID: $("input.Damaged_UOM").val(),
                    Damaged_Reason: $('.Product_Damaged_Reason').val(),
                    expiry_date: $(".expiry_date").val(),
                    lot_nb: $(".lot_nb").val(),
                    serial_nb: $(".serial_nb").val(),
                }
                $.ajax({
                    url: "StockAjax/DepotContentAjax",
                    method: "POST",
                    data: Data,
                    complete: function (v1, v2) {
                        if (v2 == "success" && v1.responseText == "OK") {
                            $("#ExpirySuccess").attr("class", "alert alert-success").html(Submitted_Successfully)
                            if (is_depot_content) {
                                build_table()
                                // RebuildDataTable(title, [0, 1, 2], 'StockAjax/DepotContentRequest', {Depot_ID: $("#Depot").val()});
                            } else {
                                build_damage_table()
                            }
                            setTimeout(function () {
                                $("#add_Damage").modal('hide')
                                $("#ExpirySuccess").addClass('hidden')
                                //                            $('.AddDiv').not('div:first').remove()
                                //                            $('.AddDiv > .fa-minus-circle').not('div:first').css("display", "none")
                                $('#Add  input').val('')
                            }, 800)
                        } else {
                            $("#ExpirySuccess").attr("class", "alert alert-danger").html(Failed_Submit)
                        }
                    }
                })
            } else {
                $("#ExpirySuccess").attr("class", "alert alert-danger").html(Check_Inputs)
            }
        })
        $("#CloseModal").on("click", function () {
            $('#add_Damage').modal('hide')
            $("#ExpirySuccess").remove()
        });
    });
</script>