<?php
if ($is_edit && $check_lock != '') { ?>
    <div class="alert alert-danger" role="alert">
        <button class="close" data-dismiss="alert"></button>
        <strong>Danger: </strong><?php echo $check_lock ?>
    </div>
    <?php
    return;
}
?>
<link href="<?php echo THEME_PATH; ?>css/pipeline.css" rel="stylesheet" type="text/css"/>
<link href="<?php echo THEME_PATH; ?>plugins/tooltipster/tooltipster.bundle.min.css" rel="stylesheet" type="text/css"/>
<script src="<?php echo THEME_PATH; ?>plugins/tooltipster/tooltipster.bundle.min.js" type="text/javascript"></script>
<style type="text/css">
    .AddRow{
        background: #e5e5e5;
        padding-top: 10px;
        padding-bottom: 30px;
        border-radius: 6px;
        margin-bottom: 10px;
    }
    .NoteTextArea{
        background-color:#E2DEEF !important;
    }
    input[type=checkbox]{
        display: initial !important;
    }
    .stages .stageOptionWrapper label.empty_stage,.stages .stageOptionWrapper label.empty_stage::before{
        background-color: #e0e4e7 !important;
    }
    .fa.fa-close{
        cursor:pointer;
    }
    label.sub_type_label{
        font-weight: 900!important;
    }
    input.option_detail_name{
        width: 75% !important;
        height: 27px !important;
    }
    div.option_row_values{
        display:flex;
    }
    .option_clickable,.delete_main_block{
        cursor:pointer !important;
    }
    .semi-bold{
        font-weight: 500 !important;
    }
</style>
<form method="POST" action="" onsubmit="return false" id="job_order_form">
    <div class="container-fluid container-fixed-lg">
        <div class="panel panel-default">
            <div class="panel-body">
                <?php echo Forms::ModalLoader('job_order_loader') ?>
                <div class="job_order">
                    <div class="row"><?php echo Forms::AlertDiv('job_order_alert'); ?></div>
                    <input type="hidden" name="job_order_id" value="<?php echo $is_edit ? $edit_arr['main']['job_order_id'] : 0; ?>" id ="job_order_id" />
                    <div class="container-sm-height">
                        <div class="row-sm-height">
                            <div class="col-md-9 col-sm-height sm-no-padding">
                                <div class="row form-group">
                                    <div class="input-group  col-md-4 center-margin pull-left" >
                                        <div class="sm-m-t-20">
                                            <h2 class="font-montserrat all-caps hint-text"><?php print $title; ?></h2>
                                        </div>
                                    </div>
                                    <div class="col-md-3 <?php echo $is_edit ? '' : 'hidden'; ?>">
                                        <input class="" id="is_published" <?php echo $is_edit ? ($edit_arr['main']['is_published'] == 1 ? 'checked' : '' ) : ''; ?>  type="checkbox"/>
                                        <label for="is_published"><?php print CommonLanguage::getMessage('is_published'); ?>
                                        </label>
                                    </div>
                                </div>
                                <div class="row form-group">
                                    <div class="col-md-3" >
                                        <label><?php print CommonLanguage::getMessage('choose_customer'); ?>
                                            <span class="fa fa-plus-circle m-l-5 openFrame" data-src="crm/customers?is_pop=1" style="color:#8a7dbe;cursor:pointer"></span>
                                            <span class="red-star">*</span>
                                        </label>
                                        <input class="customer_id full-width" id="customer_id" name="customer_id" type="hidden" value="<?php echo $is_edit ? $edit_arr['main']['customer_id'] : ''; ?>" data-select-name='<?php echo $is_edit ? $edit_arr['main']['customer_name'] : ''; ?>' required/>
                                    </div>  
                                    <div class="col-md-3" >
                                        <label><?php print CommonLanguage::getMessage('company'); ?>
                                            <span class="red-star">*</span>
                                        </label>
                                        <input class="company form-control" value="<?php echo $is_edit ? $edit_arr['main']['company'] : ''; ?>" id="company" name="company" type="text" required />
                                    </div>
                                    <div class="col-md-3" >
                                        <label><?php print CommonLanguage::getMessage('person_in_charge'); ?>
                                            <span class="red-star">*</span>
                                        </label>
                                        <input class="company form-control" value="<?php echo $is_edit ? $edit_arr['main']['person_in_charge'] : ''; ?>" id="person_in_charge" name="person_in_charge" type="text" required />
                                    </div> 
                                    <div class="col-md-3" >
                                        <label><?php print CommonLanguage::getMessage('print_ref'); ?>
                                            <span class="red-star">*</span>
                                        </label>
                                        <input class="print_ref form-control" id="print_ref" name="print_ref" value="<?php echo $is_edit ? $edit_arr['main']['print_ref'] : ''; ?>" type="text" required />
                                    </div> 
                                </div>
                                <div class="row form-group">
                                    <div class="col-md-3" >
                                        <label><?php print CommonLanguage::getMessage('block'); ?>
                                            <span class="red-star">*</span>
                                        </label>
                                        <select id="block_id" class="full-width" data-init-plugin="select2">
                                            <option value="" ><?php  echo CommonLanguage::getMessage('select');?></option>
                                            <?php  foreach($blocks as $block){?>
                                            <option value="<?php  echo $block['block_id'];?>" ><?php  echo $block['block_name'];?></option>
                                            <?php }?>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-4 col-sm-height col-bottom sm-no-padding sm-p-b-20" style="vertical-align: top;">
                                <div class="form-group form-group-default input-group">
                                    <label class=""><?php print CommonLanguage::getMessage('job_order_date'); ?>
                                        <span class="red-star">*</span>
                                    </label>
                                    <input id="job_order_date" name="job_order_date" class="form-control" aria-required="true" aria-invalid="false" autocomplete="off" value="<?php echo $is_edit ? $edit_arr['main']['job_order_date'] : $today; ?>" required>
                                    <span class="input-group-addon bg-primary"><i class="fa fa-calendar"></i></span>
                                </div>
                                <div class="form-group form-group-default input-group">
                                    <label class=""><?php print CommonLanguage::getMessage('confirm_date'); ?>
                                        <span class="red-star">*</span>
                                    </label>
                                    <input id="conform_date" name="conform_date" class="form-control"  aria-required="true" aria-invalid="false" autocomplete="off" value="<?php echo $is_edit ? $edit_arr['main']['conform_date'] : ''; ?>" required>
                                    <span class="input-group-addon bg-primary"><i class="fa fa-calendar"></i></span>
                                </div>
                                <div class="form-group form-group-default input-group">
                                    <label class=""><?php print CommonLanguage::getMessage('Delivery_Date'); ?>
                                        <span class="red-star">*</span>
                                    </label>
                                    <input id="delivery_date" name="delivery_date" class="form-control" aria-required="true" aria-invalid="false" autocomplete="off" value="<?php echo $is_edit ? $edit_arr['main']['delivery_date'] : ''; ?>" required>
                                    <span class="input-group-addon bg-primary"><i class="fa fa-calendar"></i></span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="table-responsive job_order_details">
                        <?php if(!empty($edit_arr['details'])){ 
    foreach($edit_arr['details'] as $blocks){?>
                        <div class="main_div_row">
                            <h5 class="bold"><?php  echo $blocks['block_name'];?> <span class="fa fa-minus delete_main_block" style="color:#ed9421;margin-top:15px;"></span></h5>
                            <div class="col-md-12 AddRow m-b-10" data-block-id = "<?php echo $blocks['block_id'];?>" data-index-id ="<?php echo $blocks['detail_index'];?>" >
                                <?php  foreach($blocks['options'] as $job_order_option){ 
        if($job_order_option['is_published'] == 0 ){?>
                                <div class="row main_option_row <?php  echo $job_order_option['is_title_hidden'] == 1 ? 'm-t-5' : '' ;?>" >
                                    <h5 class="semi-bold <?php  echo $job_order_option['is_title_hidden'] == 1 ? 'hidden' : '' ;?> <?php  echo $job_order_option['is_content_hidden'] == 1 ? 'option_clickable' : '' ;?>"><?php  echo $job_order_option['option_title'].' : ';?></h5>
                                    <div class=" main_div_options <?php  echo $job_order_option['is_content_hidden'] == 1 ? 'hidden' : '' ;?>">
                                        <div class="row">
                                            <?php $i=1; foreach($job_order_option['options'] as $option){?>
                                            <div class="col-md-4  option_row_values <?php  echo ($option['type_id'] == 2  || $option['type_id'] == 3) ? 'm-t-20' : '';?>" data-option-detail-id="<?php echo $option['option_detail_id'];?>" data-is-required="<?php  echo $option['is_required'];?>" data-type="<?php  echo $option['type_id'];?>" data-id="<?php  echo $option['option_detail_id'];?>" data-is-published="<?php  echo $job_order_option['is_published'];?>">
                                                <div class="col-md-4">
                                                    <label class="sub_type_label">
                                                        <?php  echo $option['option_detail_name'];?>
                                                    </label>
                                                    <?php  if($option['is_required'] == 1){?>
                                                    <span class="red-star">*</span>
                                                    <?php }?>
                                                </div>
                                                <div class="col-md-8">
                                                    <?php if($option['type_id'] == 1 || $option['type_id'] == 5 || $option['type_id'] == 6){?>
                                                    <input type="<?php echo $option['type_id'] == 6 ? 'number' : 'text' ;?>" class="option_detail_name form-control <?php  echo $option['type_id'] == 5 ? 'autocomplete' : '';?>" style="width:200px;" value="<?php echo !empty($option['current_value']) ? $option['current_value'] : ''; ?>" />

                                                    <?php }else if($option['type_id'] == 3){ 
            $checkbox_options = !empty($option['current_value']) ? explode(",",$option['current_value']) : array();
            foreach($option['detail_value_title']  as $detail_value){?>
                                                    <input type="checkbox" class="option_detail_name_checkbox"  name="option_detail_name_checkbox" value="<?php  echo $detail_value;?>"  <?php echo (in_array($detail_value,$checkbox_options) && !empty($checkbox_options)) ? 'checked' : '';?> />
                                                    <label><?php  echo $detail_value;?></label>

                                                    <?php } }else if($option['type_id'] == 4){?>
                                                    <input type="file" class="option_detail_name_image  form-control" name="option_detail_name_file_<?php echo $blocks['block_id'];?>_<?php  echo $blocks['detail_index'];?>_<?php echo $option['option_detail_id'];?>[]" multiple data-old-image="<?php  echo !empty($option['current_value']) ? $option['current_value'] : '';?>" deleted-image-data=""  onchange="ValidateForNewImage(this, 'Picture')"/>
                                                    <?php  if(!empty($option['current_value'])){ 
            $images_array = explode("##",$option['current_value']);?>
                                                    <div class="images_list display-flex" >
                                                        <?php  foreach($images_array as $current_image){?>
                                                        <div class="sub_image_div display-flex" data-image-name="<?php  echo $current_image;?>">
                                                            <img class="image_popup" popup-src="<?php  echo SITE_LINK.'uploads/job_order/'.$edit_arr['main']['job_order_id'].'/sub/'.$current_image;?>" src="<?php  echo SITE_LINK.'uploads/job_order/'.$edit_arr['main']['job_order_id'].'/sub/'.$current_image;?>" style="max-width:50px;max-height:50px;cursor:pointer;">
                                                            <i class="fa fa-trash delete_sub_image red-star" style="cursor:pointer;"></i>
                                                        </div>
                                                        <?php }?>
                                                    </div>
                                                    <?php  } } else if($option['type_id'] == 2){?>
                                                    &nbsp;<span class="fa fa-close"></span>&nbsp;
                                                    <?php 
            foreach($option['detail_value_title']  as $detail_value){?>
                                                    <input type="radio" class="option_detail_name_radio" data-attribute-name="<?php  echo $detail_value;?>" name="option_detail_name_radio_<?php echo $blocks['block_id'].'_'.$blocks['detail_index'].'_'.$option['option_detail_id'];?>" <?php  echo (!empty($option['current_value']) && $detail_value == $option['current_value']) ? 'checked' : '';?>   />
                                                    <label><?php  echo $detail_value;?></label>

                                                    <?php } } else{?>
                                                    <select name="option_detail_select" class="option_detail_select full-width" data-init-plugin="select2">
                                                        <option value="" ><?php  echo CommonLanguage::getMessage('select');?></option>
                                                        <?php  foreach($option['detail_value_title']  as $detail_value){?>
                                                        <option value="<?php  echo $detail_value;?>" <?php  echo  ((!empty($details['detail_values'][$option['option_detail_id']]['option_detail_value']) && $detail_value == $option['current_value']) ? 'selected' : '');?>><?php  echo $detail_value;?></option>
                                                        <?php }?>
                                                    </select>
                                                    <?php }?>
                                                </div>
                                            </div>
                                            <?php ?><?php if ($i % 3 == 0) { ?>
                                        </div><div class="row">
                                        <?php } $i++; }?>
                                        </div>
                                    </div>
                                </div>
                                <?php }  }?>
                            </div>
                            <?php } }?>
                        </div>
                    </div>
                    <div class="container-sm-height m-b-10 stage_main_div <?php echo $is_edit ? ($edit_arr['main']['is_published'] == 1 ? '' : 'hidden' ) : 'hidden'; ?>">
                        <div class="stages">
                            <div class="field">
                                <h5 class="font-montserrat all-caps small  hint-text bold m-r-5 m-l-5"><?php print CommonLanguage::getMessage('change_job_order_stage'); ?></h5>
                                <span class="input stageOptionWrapper">
                                    <div class="plainStages">
                                        <span class="options" id="pipe_stage">
                                            <?php
                                            for ($i = 0; $i < count($job_order_stages); $i++) {
                                                $stage = $job_order_stages[$i];
                                            ?>
                                            <label class="widget-radio tooltip <?php echo $is_edit ? ($edit_arr['main']['stage_id'] == $stage['stage_id'] ? 'active' : (($edit_arr['main']['stage_id'] == 0 ) ? 'empty_stage' : '')) : ''; ?>"   title="<?php echo $stage['stage_title']; ?>">
                                                <?php echo $stage['stage_title']; ?>
                                                <input type="radio" name="stage_id" value="<?php echo $stage['stage_id']; ?>"  data-title="<?php echo $stage['stage_title']; ?>">
                                            </label>
                                            <?php } ?>
                                        </span>
                                    </div>
                                </span>
                                <input type="file" class="job_order_main_images  form-control" name="job_order_main_images[]" id="job_order_main_images" multiple />
                                <div class="display-flex" id="main_image_div">
                                    <?php
                                    if ($is_edit) {
                                        $dir = scandir(dirBase . "uploads/job_order/" . $edit_arr['main']['job_order_id'] . "/main");
                                        foreach ($dir as $file_name) {
                                            if (substr($file_name, 0, 1) != '..' && substr($file_name, 0, 1) != '.' && $file_name) {
                                    ?>
                                    <div class=" main_image_row display-flex m-r-10"  data-image-name="<?php echo $file_name; ?>">
                                        <img class="image_popup" popup-src="<?php echo SITE_LINK . 'uploads/job_order/' . $edit_arr['main']['job_order_id'] . '/main/' . $file_name; ?>" src="<?php echo SITE_LINK . 'uploads/job_order/' . $edit_arr['main']['job_order_id'] . '/main/' . $file_name; ?>" style="max-width:50px;max-height:50px;cursor:pointer;">
                                        <i class="fa fa-trash delete_main_image red-star" style="cursor:pointer;"></i>
                                    </div>
                                    <?php
                                            }
                                        }
                                    }
                                    ?>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="container-sm-height ">
                        <div class="row  b-a b-grey">
                            <div class="col-md-9 form-group clearfix" style="border-right: 1px solid #eee;padding:0px;">
                                <h5 class="font-montserrat all-caps small  hint-text bold m-r-5 m-l-5">
                                    <?php echo CommonLanguage::getMessage('notes'); ?>
                                    <textarea id="note" name="note" class="form-control NoteTextArea"  aria-invalid="false" autocomplete="off"><?php echo $is_edit ? $edit_arr['main']['note'] : ''; ?></textarea>
                                </h5>
                            </div>
                            <div class="col-md-3  ">
                                <h5 class="font-montserrat all-caps small  hint-text bold m-r-5">
                                    <?php echo CommonLanguage::getMessage('Price'); ?>
                                    <span class="red-star">*</span>
                                    <input type="number" class="form-control" id="price" value="<?php echo $is_edit ? $edit_arr['main']['price'] : ''; ?>" name="price" required> 
                                </h5>
                                <h5 class="font-montserrat all-caps small  hint-text bold m-r-5">
                                    <?php echo CommonLanguage::getMessage('first_payment'); ?>
                                    <span class="red-star">*</span>
                                    <input type="number" class="form-control " value="<?php echo $is_edit ? $edit_arr['main']['first_payment'] : ''; ?>" name="first_payment" id="first_payment" required>
                                </h5>
                            </div>
                        </div>
                    </div>
                    <div class="container-sm-height m-t-10" >
                        <button class=" btn  btn-primary btn-cons pull-right " id="submit_job_order" style="min-width:253px;" type="button">
                            <i class="pg-form"></i>
                            <span class="bold"><?php print CommonLanguage::getMessage('Save'); ?></span>
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>
<div class="modal fade" id="delete_image_modal" data-backdrop="static" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <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="text-left bold"><?php echo CommonLanguage::getMessage('Confirm_Delete'); ?></h5>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12 m-t-10 form-group">
                        <p class=""><?php echo CommonLanguage::getMessage('About_To_Delete'); ?></p>
                        <p><?php echo CommonLanguage::getMessage('Proceed_Delete'); ?></p>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-default" data-dismiss="modal"><?php print CommonLanguage::getMessage('Close'); ?></button>
                <button class="btn btn-primary text-white" id="delete_current_image"><?php print CommonLanguage::getMessage('Save'); ?></button>
            </div>
        </div>
    </div>
</div>
<script>
    var deleted_main_images = [], parent_image = null, image_type = null;
    var have_not_finish = <?php echo json_encode(CommonLanguage::getMessage('have_not_finish')); ?>, have_not_saved = <?php echo json_encode(CommonLanguage::getMessage('have_not_saved')); ?>;
    $(function () {
        $(".stages .widget-radio ").on('click', function () {
            var stage_id = $("input[name=stage_id]", $(this)).val()
            $(".stages label").removeClass('empty_stage');
            $("#job_order_loader").removeClass("hidden")
            $.ajax({
                url: "InventoryAjax/updateJobOrderStage",
                method: "POST",
                dataType: "json",
                data: {job_order_id: $("#job_order_id").val(), stage_id: stage_id},
                complete: function (jqXHR, v2) {
                    if (v2 == 'success') {
                        if (jqXHR.responseJSON[1] == "success") {
                        }
                        AddAlert("#job_order_alert", jqXHR.responseJSON[0], jqXHR.responseJSON[1]);
                    }
                    $("#job_order_loader").addClass("hidden")
                }
            });
            removeclassactive();
            $(this).addClass("active");
        });
        $('.tooltip').tooltipster();
        $('.tooltip').removeClass('tooltip tooltipster');
        build_select2($("#customer_id"), "xhr/getOrganizations");
        apply_autocomplete($("#company"), 'xhr/companyJobOrderSearch', function (event, ui, who) {
            who.val(ui.item.text);
        });
        enable_job_order_autocomplete($('.option_detail_name.autocomplete'));
        $("#conform_date,#delivery_date,#job_order_date").datepicker({autoclose: true});

        $('#is_published').on('click', function () {
            $(this).is(':checked') ? $('.stage_main_div,.main_option_row[data-is-published=1]').removeClass('hidden') : $('.stage_main_div,.main_option_row[data-is-published=1]').addClass('hidden');
        });
        $(".job_order_details").on("click", ".delete_main_block", function (e) {
            $(this).closest(".main_div_row").empty().remove();
        });
        $('#main_image_div').on('click', '.delete_main_image', function () {
            $('#delete_image_modal').modal('show');
            image_type = 2;
            parent_image = $(this);
        });
        $('.job_order_details').on('click', '.fa-close', function () {
            var parent = $(this).parents('.option_row_values');
            $('input.option_detail_name_radio', parent).prop('checked', false);
        });
        $('.job_order_details').on('click', '.delete_sub_image', function () {
            $('#delete_image_modal').modal('show');
            image_type = 1;
            parent_image = $(this);
        });
        $('#delete_current_image').on('click', function () {
            if (image_type == 1) {
                var deleted_image_name = parent_image.closest('.sub_image_div').attr('data-image-name');
                var deleted_image_data = parent_image.closest('.images_list').prev().attr('deleted-image-data');
                parent_image.closest('.images_list').prev().attr('deleted-image-data', deleted_image_name + (deleted_image_data == '' ? '' : ('##' + deleted_image_data)));
                parent_image.closest('.sub_image_div').remove();
            } else {
                deleted_main_images.push(parent_image.closest('.main_image_row').attr('data-image-name'));
                parent_image.closest('.main_image_row').remove();
            }
            $('#delete_image_modal').modal('hide');
        });
        $('#submit_job_order').on('click', function () {
            submitted = true;
            if (!$("#job_order_form").valid()) {
                $(document.body).animate({scrollTop: 0}, 800);
                return;
            }
            var Data = new FormData(document.getElementById("job_order_form")),
                option_details = [], is_required_field_empty = false;
            $('.AddRow').each(function () {
                var option_values = [];
                $('.main_option_row .option_row_values', $(this)).each(function () {
                    if ($(this).attr('data-is-published') == 0 || ($(this).attr('data-is-published') == 1 && $('#is_published').is(":checked"))) {
                        var type = $(this).attr('data-type'), option_detail_id = $(this).attr('data-id'),
                            option_detail_value = '', old_image_data = '', deleted_image_data = '';
                        if (type == 1 || type == 5 || type == 6) {
                            option_detail_value = $('.option_detail_name', $(this)).val()
                            if ($(this).attr('data-is-required') == 1 && !$('.option_detail_name', $(this)).val())
                                is_required_field_empty = true
                        } else if (type == 7) {
                            option_detail_value = $('select.option_detail_select', $(this)).val()
                            if ($(this).attr('data-is-required') == 1 && !$('select.option_detail_select', $(this)).val())
                                is_required_field_empty = true
                        } else if (type == 2) {
                            option_detail_value = $('input.option_detail_name_radio', $(this)).is(":checked") ? $('input.option_detail_name_radio', $(this)).attr('data-attribute-name') : '';
                        } else if (type == 3) {
                            $('input[name=option_detail_name_checkbox]:checked', $(this)).each(function () {
                                var attribute_name = $(this).val();
                                option_detail_value += (option_detail_value == '' ? '' : ',') + attribute_name;
                            });
                            if ($(this).attr('data-is-required') == 1 && $('input.option_detail_name_checkbox:checked', $(this)).length == 0)
                                is_required_field_empty = true
                        } else {
                            option_detail_value = $('input.option_detail_name_image', $(this)).val()
                            var main_parent = $('input.option_detail_name_image', $(this)).next();
                            old_image_data = $('input.option_detail_name_image', $(this)).attr('data-old-image');
                            deleted_image_data = $('input.option_detail_name_image', $(this)).attr('deleted-image-data');
                            if ($(this).attr('data-is-required') == 1 && !$('input.option_detail_name_image', $(this)).val() && $('.sub_image_div', main_parent).length == 0) {
                                is_required_field_empty = true
                            }
                        }
                        option_values.push({option_detail_id: option_detail_id,
                                            type_id: type,
                                            option_detail_value: option_detail_value,
                                            old_image_data: old_image_data,
                                            deleted_image_data: deleted_image_data,
                                           });
                    }

                });
                option_details.push({block_id: $(this).attr('data-block-id'),
                                     option_values: option_values,
                                     index: $(this).attr('data-index-id')});

            });
            console.log(option_details);
            //                return;
            if (option_details.length == 0) {
                $(document.body).animate({scrollTop: 0}, 800);
                AddAlert("#job_order_alert", '<?php echo CommonLanguage::getMessage('input_option'); ?>', 'danger')
                return;
            }
            if (is_required_field_empty) {
                $(document.body).animate({scrollTop: 0}, 800);
                AddAlert("#job_order_alert", '<?php echo CommonLanguage::getMessage('Required_Fields'); ?>', 'danger')
                return;
            }
            //            return;
            Data.append('deleted_main_images', JSON.stringify(deleted_main_images));
            Data.append('option_details', JSON.stringify(option_details));
            Data.append('is_published', $('#is_published').is(":checked") ? 1 : 0)
            $("#job_order_loader").removeClass('hidden');
            $.ajax({
                url: "InventoryAjax/submitJobOrder",
                method: "POST",
                data: Data,
                processData: false,
                contentType: false,
                dataType: "JSON",
                complete: function (jqXHR, status) {
                    if (status == 'success') {
                        if (jqXHR.responseJSON[1] == "success") {
                            $(document.body).animate({scrollTop: 0}, 800);
                            $('#submit_job_order').attr('disabled', true);
                        }
                        AddAlert("#job_order_alert", jqXHR.responseJSON[0], jqXHR.responseJSON[1]);
                    }
                    $("#job_order_loader").addClass('hidden');
                }
            });
        });
        $("#delete_image_modal").on("hidden.bs.modal", function () {
            parent_image = null, image_type = null;
        });
        $('.job_order_details').on('click','.option_clickable',function(){
            var parent = $(this).closest('.main_option_row');
            if($('.main_div_options',parent).hasClass('hidden')){
                $('.main_div_options',parent).removeClass('hidden')
            }else{
                $('.main_div_options',parent).addClass('hidden')
            }


        });
        $('#block_id').on('change',function(){
            var max_index = 0,current_max_index;
            $(".AddRow").each(function () {
                var value = parseInt($(this).attr('data-index-id'));
                max_index = (value > max_index) ? value : max_index;
            });
            current_max_index = max_index + 1;
            if($('#block_id').val()){
                CommonViewById('InventoryAjax/getJobOrderBlock', {block_id: $(this).val(),index:current_max_index},
                               '#job_order_loader', function (response) {
                    var NewItem = $('.job_order_details').prepend($(response)),
                        block_id = $('#block_id').val();
                    $(".select2-container", NewItem).empty().remove()
                    NewItem.find(".option_detail_select").show().select2()
                    $('#block_id').val('').trigger('change');
                }); 
            }
        })
    });
    function enable_job_order_autocomplete(element) {
        apply_autocomplete(element, 'xhr/autocompleteJoborderOptionSearch', function (event, ui, who) {
            who.val(ui.item.text);
        });
    }
    function removeclassactive() {
        $(".stages label").each(function () {
            $(this).removeClass("active");
        });
    }
    function ValidateForNewImage(input) {
        var FileUploadError = '', maxAllowedSizeKB = 10000, allowedExtensions = ['.jpg', '.png'], is_not_validated = false;
        $.each(input.files, function (index) {
            var FileSizeKB = input.files[index].size / 1024,
                FileName = $.trim(input.files[index].name),
                FileType = FileName.substring(FileName.lastIndexOf(".")).toLowerCase(),
                specific_image_error = '';
            if (FileSizeKB > maxAllowedSizeKB) {
                specific_image_error += 'File Size Exceed (' + maxAllowedSizeKB + ' KB) for image (' + (index + 1) + ')  ';
                is_not_validated = true;
            }
            if (allowedExtensions.indexOf(FileType) == -1) {
                specific_image_error += 'File Extension (' + FileType + ') not Supported (Supported Extensions: ' + allowedExtensions.join() + ' ) for image (' + (index + 1) + ')';
                is_not_validated = true;
            }
            FileUploadError += specific_image_error + (specific_image_error != '' ? '<br>' : '');
        });
        if (is_not_validated) {
            $(input).val('');
            $(document.body).animate({scrollTop: 0}, 800);
            AddAlert("#job_order_alert", FileUploadError, "danger");
        }
        return false;
    }
    window.onbeforeunload = function (e) {
        return have_not_finish;
    }
    var submitted = false;
    $(document).ready(function () {
        window.onbeforeunload = function (e) {
            if (!submitted) {
                var message = have_not_saved, e = e || window.event;
                if (e) {
                    e.returnValue = message;
                }
                return message;
            }
        }
    });
</script>
