<div class="container-fluid container-fixed-lg bg-white">
    <div class="panel panel-transparent">
        <div class="panel-heading">
            <div class="panel-title"> <?php print CommonLanguage::getMessage('product_sections'); ?></div>
            <?php
            if ($permissions->hasPermission('add_product_sections')) {
                echo Forms::FloatingAddButton('4c0870', '#add_product_section', CommonLanguage::getMessage('add'));
            }
            ?>
        </div>
        <div class="panel-body">
            <div class="row">
                <div class="col-md-12 table-responsive">
                    <table class="table table-bordered inventory" id="tableWithSearch" >
                        <thead>
                            <tr>
                                <th class="text-center" style="width:15%" ><?php print CommonLanguage::getMessage('Name'); ?></th>
                                <th class="text-center" style="width:15%" ><?php print CommonLanguage::getMessage('Action'); ?></th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade bs-example-modal-md " data-backdrop="static" id="add_product_section" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-sm"  >
        <div class="modal-content">
            <div class="modal-header clearfix text-left">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="pg-close fs-20"></i>
                </button>
                <h5 class="add-label bold"><?php echo CommonLanguage::getMessage('product_sections');?></h5>
                <div id="assignAlert"></div>
            </div>
            <div class="modal-body">
                <form id="assignForm">
                    <div class="row m-t-10">
                        <div class=" col-md-12  " >
                            <label class="labelText"><?php print CommonLanguage::getMessage('Name'); ?><span class="red-star">*</span></label>
                            <input type="text" class="form-control" id="section_name" name="section_name" required/>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><?php print CommonLanguage::getMessage('Close') ?></button>
                <button type="button" class="btn btn-primary white" id="assignBtn"><?php print CommonLanguage::getMessage('Save') ?></button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="ConfirmDeleteRow" data-backdrop="static" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title"><?php print CommonLanguage::getMessage('Confirm_Delete') ?></h4>
                <div id="delete_alert"></div>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12 m-t-10">
                        <p><?php print CommonLanguage::getMessage('About_To_Delete') ?></p>
                        <p><?php print CommonLanguage::getMessage('Proceed_Delete') ?></p>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><?php print CommonLanguage::getMessage('Close') ?></button>
                <button type="button" class="btn btn-danger width-auto" id="Row_Delete"><?php print CommonLanguage::getMessage('delete') ?></button>
            </div>
        </div>
    </div>
</div>
<script>
    var title = <?php echo json_encode(CommonLanguage::getMessage('product_sections')); ?>,
        Submitted_Successfully = <?php echo json_encode(CommonLanguage::getMessage('Submitted_Successfully')); ?>,
            Required_Fields = <?php echo json_encode(CommonLanguage::getMessage('Required_Fields')); ?>,
                Deleted_Successfully = <?php echo json_encode(CommonLanguage::getMessage('Deleted_Successfully')); ?>,
                    Failed_Submit = <?php echo json_encode(CommonLanguage::getMessage('Failed_Submit')); ?>;
                    var IsEdit = false, IDToEdit = 0, IDToDelete = 0;
    $(function () {
        $(".floatingContainer").on("click", function () {
            IsEdit = false;
            IDToEdit = 0;
        })
        RebuildDataTable(title, [0], "InventoryAjax/product_sections_ajax")
        $("#assignBtn").on("click", function () {
            $("#assignAlert").removeClass('hidden')
            if ($("#section_name").val() == '') {
                $("#assignAlert").attr("class", "alert alert-danger").html(Required_Fields)
                return false;
            }
            var DataArr = new FormData(document.getElementById("assignForm"));
            DataArr.append("section_id", IDToEdit)
            DataArr.append("is_edit", (IsEdit ? 1 : 0))
            $.ajax({
                url: "InventoryAjax/add_edit_product_section",
                method: "POST",
                dataType: 'json',
                data: DataArr,
                processData: false,
                contentType: false,
                complete: function (v1, v2) {
                    if (v2 == "success" && v1.responseJSON == 'OK') {
                        $("#assignAlert").attr("class", "alert alert-success").html(Submitted_Successfully)
                        RebuildDataTable(title, [0], "InventoryAjax/product_sections_ajax")
                        setTimeout(function () {
                            $("#assignAlert").addClass('hidden')
                            $("#add_product_section").modal("hide")
                        }, 5000)
                    } else {
                        $("#assignAlert").attr("class", "alert alert-danger").html(v1.responseJSON)
                    }
                }
            })
        })
        $("#tableWithSearch tbody").on('click', '.edit_section', function () {
            IsEdit = true;
            IDToEdit = $(this).attr('data-id');
            $("#section_name").val($(this).parents("tr").find("td:eq(0)").text())
            $("#add_product_section").modal("show")
        })
        $("#tableWithSearch tbody").on('click', '.delete_section', function () {
            IDToDelete = $(this).attr('data-id');
            $("#ConfirmDeleteRow").modal("show")
        })
        $("#Row_Delete").on('click', function () {
            $.ajax({
                url: "InventoryAjax/delete_product_section",
                method: "GET",
                data: {id: IDToDelete},
                complete: function (v1, v2) {
                    if (v2 == "success" && v1.responseText == 'OK') {
                        $("#delete_alert").attr("class", "alert alert-success").html(Deleted_Successfully)
                        RebuildDataTable(title, [0], "InventoryAjax/product_sections_ajax")
                        $("#ConfirmDeleteRow").modal("hide")
                    } else {
                        $("#delete_alert").attr("class", "alert alert-danger").html(v1.responseText)
                    }
                }
            })
        })
        $("#ConfirmDeleteRow").on("hidden.bs.modal",function(){
            $("#delete_alert").addClass("hidden")
        })
    })
</script>
