<style>
    #screen[index] {
        
        top: 10%;
        right: 0;
        bottom: 0;
        left: 4%;
    }

    .input-group .date {
        z-index: 1110;
    }

    label {
        word-wrap: break-word;
    }
</style>

<div id="screen[index]" > 
<!-- begin:: Content -->
    <!--begin::Portlet-->
    <div class="kt-portlet kt-portlet--tabs kt-portlet--responsive-mobile" id="kt_page_portlet">
        <!-- <div class="kt-portlet kt-portlet--tabs kt-portlet--height-fluid" style="background-color: #cceeff!important;"> -->
            <div class="kt-portlet__head" style="background-color: #fff!important">
                <div class="kt-portlet__head-toolbar">
                    <ul class="nav nav-tabs nav-tabs-space-xl nav-tabs-line nav-tabs-bold nav-tabs-line-3x nav-tabs-line-brand" role="tablist">
                        <li class="nav-item">
                            <a class="nav-link " data-toggle="tab" href="#job_screen" role="tab">
                                <i class="la la-briefcase"></i><b>Job</b>
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link " data-toggle="tab" href="#resources" role="tab">
                                <i class="la la-users"></i><b>Resources</b>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>

            <div class="kt-portlet__body" style="clear: both;padding-bottom: 0px;padding-top:0px;">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="card-body row" style="padding-bottom:0px">
                            <div class="col-lg-9">
                                <div class="form-group row" style="display: none;">
                                    <label class="col-lg-3 col-form-label" >Plan ID:</label>
                                    <div class="col-lg-3">
                                        <input type="text" class="form-control" id="txtJobQuotationId">
                                        <span class="form-text text-muted"></span>
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label class="col-lg-1 col-form-label" >BU:</label>
                                    <div class="col-lg-2">
                                        <select  class="form-control" id="cobJobQuotationBU">
                                             <?php echo $this->getCompanyOption(); ?>
                                        </select>
                                        <span class="form-text text-muted"></span>
                                    </div>
                                    <div style="width:50px;">&nbsp;</div>
                                    <label class="col-lg-1 col-form-label" >Cust. Code<span class="text-danger">*</span>:</label>
                                    <div class="col-lg-2">
                                        <select class="form-control" id="cobJobQuotationCustCode" onchange="populateCustDetailQuotation();">
                                            <?php echo $this->getCustomerOption(); ?>
                                        </select>
                                        <span class="form-text text-muted"></span>
                                    </div>
                                    <div style="width:50px;">&nbsp;</div>
                                    <label class="col-lg-1 col-form-label" >Cust. Name:</label>
                                    <div class="col-lg-3">
                                        <input type="text" class="form-control" id="txtJobQuotationCoyName" disabled>
                                        <span class="form-text text-muted"></span>
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label class="col-lg-1 col-form-label">Quotation #:</label>
                                    <div class="col-lg-2">                                       
                                        <input type="text" class="form-control" id="txtQuotationJobNumber" disabled>
                                        <span class="form-text text-muted"></span>
                                    </div>
                                    <div style="width:50px;">&nbsp;</div>
                                    <label class="col-lg-1 col-form-label">Type:</label>
                                    <div class="col-lg-2">
                                        <select class="form-control" id="txtQuotationJobType">
                                            <?php echo $this->getJobTypeOption(); ?>
                                        </select>
                                        <span class="form-text text-muted"></span>
                                    </div>
                                    <div style="width:50px;">&nbsp;</div>
                                    <label class="col-lg-1 col-form-label">Title<span class="text-danger">*</span>:</label>
                                    <div class="col-lg-3">
                                        <input type="text" class="form-control" id="txtQuotationJobName">
                                        <span class="form-text text-muted"></span>
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label class="col-lg-1 col-form-label">Start Date:</label>
                                    <div class="col-lg-2">                                       
                                        <div class="input-group date">                                            
                                            <input type="text" class="form-control"  placeholder="Select date" id="txtQuotationJobStartDate" maxlength="10"/>
                                            <div class="input-group-append">
                                                <span class="input-group-text">
                                                    <i class="la la-calendar-check-o"></i>
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                    <div style="width:50px;">&nbsp;</div>
                                    <label class="col-lg-1 col-form-label">End Date:</label>
                                    <div class="col-lg-2">
                                        <div class="input-group date">
                                            <input type="text" class="form-control"  placeholder="Select date" id="txtQuotationJobEndDate" maxlength="10"/>
                                            <div class="input-group-append">
                                                <span class="input-group-text">
                                                    <i class="la la-calendar-check-o"></i>
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                    <div style="width:50px;">&nbsp;</div>
                                    <label class="col-lg-1 col-form-label">PM Name:</label>
                                    <div class="col-lg-3">
                                        <select class="form-control" id="txtJobQuotationPMName">
                                           
                                        </select>
                                        <span class="form-text text-muted"></span>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-3">
                                <div class="form-group row">
                                    <label class="col-lg-3 col-form-label" >Total Mandays:</label>
                                    <div class="col-lg-3">
                                        <input type="text" class="form-control text-right" id="txtJobQuotationTotalMandays" onkeyup="calculateMandaysToHours()" value="0">
                                        <span class="form-text text-muted"></span>
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label class="col-lg-3 col-form-label">Total Hours:</label>
                                    <div class="col-lg-3">
                                        <input type="text" class="form-control text-right" id="txtJobQuotationTotalHours" onkeyup="calculateHoursToMandays()" value="0">
                                        <span class="form-text text-muted"></span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="tab-content" style="margin-top:0px;">
                    <div class="tab-pane active" id="job_screen">
                        <div class="kt-section kt-section--first">
                            <div class="kt-section__body">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="card-body row">
                                            <br>
                                            <div class="col-lg-12 kt-separator kt-separator--dashed"></div>
                                                <div class="col-sm-2" style="display: none" id="txtConsultantCombDiv">
                                                    <select id="txtConsultantComb" class="form-control txtConsultantComb">
                                                        <?php echo $this->getUserOption(); ?>
                                                    </select>
                                                </div>
                                                <div class="col-lg-12">
                                                    <div class=" kt-datatable kt-datatable--default kt-datatable--brand kt-datatable--loaded">
                                                    <table class="kt-datatable__table">
                                                        <thead class="kt-datatable__head" style="background-color: #E0E0E0">
                                                            <tr class="kt-datatable__row" style="left: 0px;">
                                                                <th data-field="id" class="kt-datatable__cell" style="display: none;"></th>
                                                                <th data-field="phase" class="kt-datatable__cell" id="col_phase" colspan="3">
                                                                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#quotationTemplateModal" onclick="populateTemplateList();">Save As Template</button>
                                                                <button class="btn btn-success ml-2" onclick="return popupLoadTemplateQuotation();">Load Template</button>
                                                                </th>
                                                                <th style="width:10%" class="kt-datatable__cell" ></th>
                                                                <th style="width:10%" class="kt-datatable__cell" colspan="1">Total Allocated Hours</th>
                                                                <th style="width:5%" class="kt-datatable__cell"><input type="text" class="col-lg-12 form-control text-right" id="txtAllocatedHours"></th>
                                                                <th style="width:15%" colspan="4" class="kt-datatable__cell">&nbsp;</th>
                                                            </tr>
                                                            <tr class="kt-datatable__row" style="left: 0px;">
                                                                <th data-field="id" class="kt-datatable__cell" id="col_id" onclick="sortColumn(this,'col_id','asc');" style="display: none;">
                                                                    <span>ID <i class="fa"></i></span>
                                                                </th>
                                                                <th style="width:5%" data-field="phase" class="kt-datatable__cell" id="col_phase">Phase</th>
                                                                <th style="width:15%" class="kt-datatable__cell">Task</th>
                                                                <th style="width:25%" class="kt-datatable__cell">Description</th>
                                                                <th style="width:10%" class="kt-datatable__cell">Start Date</th>
                                                                <th style="width:10%" class="kt-datatable__cell">End Date</th>
                                                                <th style="width:5%" class="kt-datatable__cell">Allocated Hours</th>
                                                                <th style="width:6%" class="kt-datatable__cell">Venue
                                                                <div style="display:none;">
                                                                    <select id="cmbJobVenue" class="form-control">
                                                                        <?php echo $this->getJobVenueOption(); ?>
                                                                    </select>
                                                                </div>
                                                                </th>
                                                                <th style="width:15%;" colspan="3" class="kt-datatable__cell">Action</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody class="kt-datatable__body" id="job-task-table">
                                                        </tbody>
                                                    </table>
                                                    <br>
                                                    <div class="col-lg-12 text-right">
                                                        <button type="button" class="btn btn-success btn-sm btn-icon btn-icon-md btnAddDetail" id="btnAddItem" onclick="javascript:addJobTask(this);"><i class="fa fa-plus"></i></button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="tab-pane" id="resources">
                        <div class="kt-section kt-section--first">
                            <div class="kt-section__body">
                                <div class="row">
                                    <div class="col-lg-12">
                                    <div class="card-body row">
                                        <br>
                                            <div class="col-lg-12 kt-separator kt-separator--dashed"></div>
                                                <div class="col-lg-5" style="margin-right:25px;">
                                                     <div class="kt-datatable kt-datatable--default kt-datatable--brand kt-datatable--loaded" style="overflow-x:auto;margin-bottom:15px;">
                                                        <table style="width:100%;">
                                                            <tbody class="kt-datatable__body" id="acc-mgr-table">
                                                                <tr id="trAccountManager-0" class="kt-datatable__row" style="left: 0px;">
                                                                    <td class="kt-datatable__cell" style="display: none;">
                                                                        <input type="text" class="form-control" id="txtIdAccountManager0" value="-1" />
                                                                    </td>
                                                                    <td width="25%" class="kt-datatable__cell">Account Manager</td>
                                                                    <td width="8%" class="kt-datatable__cell">(AM)</td>
                                                                    <td width="35%" class="kt-datatable__cell">
                                                                        <select id="cmbAccountManager0" class="form-control">
                                                                            <?php echo $this->getUserOption(); ?>
                                                                        </select>
                                                                    </td>
                                                                    <td class="kt-datatable__cell">
                                                                        <button type="button" class="btn btn-success btn-sm btn-icon btn-icon-md" id="btnAddAccountManager" onclick="javascript:addAccountManager(this);"><i class="fa fa-plus"></i>
                                                                        </button>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                    <div class="kt-datatable kt-datatable--default kt-datatable--brand kt-datatable--loaded" style="overflow-x:auto;margin-bottom:15px;">
                                                        <table style="width:100%;">
                                                            <tbody class="kt-datatable__body" id="proj-mgr-table">
                                                                <tr id="trProjectManager-0" class="kt-datatable__row" style="left: 0px;">
                                                                    <td class="kt-datatable__cell" style="display: none;">
                                                                        <input type="text" class="form-control" id="txtIdProjectManager0" value="-1" />
                                                                    </td>
                                                                    <td width="25%" class="kt-datatable__cell">Project Manager</td>
                                                                    <td width="8%" class="kt-datatable__cell">(PM)</td>
                                                                    <td width="35%" class="kt-datatable__cell">
                                                                        <select id="cmbProjectManager0" class="form-control">
                                                                            <?php echo $this->getUserOption(); ?>
                                                                        </select>
                                                                    </td>
                                                                    <td class="kt-datatable__cell">
                                                                        <button type="button" class="btn btn-success btn-sm btn-icon btn-icon-md" id="btnAddProjectManager" onclick="javascript:addProjectManager(this);"><i class="fa fa-plus"></i>
                                                                        </button>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                    <div class="kt-datatable kt-datatable--default kt-datatable--brand kt-datatable--loaded" style="overflow-x:auto;margin-bottom:15px;">
                                                        <table style="width:100%;">
                                                            <tbody class="kt-datatable__body" id="tech-consultant-table">
                                                                <tr id="trTechnicalConsultant-0" class="kt-datatable__row" style="left: 0px;">
                                                                    <td class="kt-datatable__cell" style="display: none;">
                                                                        <input type="text" class="form-control" id="txtIdTechnicalConsultant0" value="-1" />
                                                                    </td>
                                                                    <td width="25%" class="kt-datatable__cell">Technical Consultant</td>
                                                                    <td width="8%" class="kt-datatable__cell">(TC)</td>
                                                                    <td width="35%" class="kt-datatable__cell">
                                                                        <select id="cmbTechnicalConsultant0" class="form-control">
                                                                            <?php echo $this->getUserOption(); ?>
                                                                        </select>
                                                                    </td>
                                                                    <td class="kt-datatable__cell">
                                                                        <button type="button" class="btn btn-success btn-sm btn-icon btn-icon-md" id="btnAddTechnicalConsultant" onclick="javascript:addTechnicalConsultant(this);"><i class="fa fa-plus"></i>
                                                                        </button>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                    <div class="kt-datatable kt-datatable--default kt-datatable--brand kt-datatable--loaded" style="overflow-x:auto;margin-bottom:15px;">
                                                        <table style="width:100%;">
                                                            <tbody class="kt-datatable__body" id="app-consultant-table">
                                                                <tr id="trApplicationConsultant-0" class="kt-datatable__row" style="left: 0px;">
                                                                    <td class="kt-datatable__cell" style="display: none;">
                                                                        <input type="text" class="form-control" id="txtIdApplicationConsultant0" value="-1" />
                                                                    </td>
                                                                    <td width="25%" class="kt-datatable__cell">Application Consultant</td>
                                                                    <td width="8%" class="kt-datatable__cell">(AC)</td>
                                                                    <td width="35%" class="kt-datatable__cell">
                                                                        <select id="cmbApplicationConsultant0" class="form-control">
                                                                            <?php echo $this->getUserOption(); ?>
                                                                        </select>
                                                                    </td>
                                                                    <td class="kt-datatable__cell">
                                                                        <button type="button" class="btn btn-success btn-sm btn-icon btn-icon-md" id="btnAddApplicationConsultant" onclick="javascript:addApplicationConsultant(this);"><i class="fa fa-plus"></i>
                                                                        </button>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                    <div class="kt-datatable kt-datatable--default kt-datatable--brand kt-datatable--loaded" style="overflow-x:auto;margin-bottom:15px;">
                                                        <table style="width:100%;">
                                                            <tbody class="kt-datatable__body" id="developer-table">
                                                                <tr id="trProjectDeveloper-0" class="kt-datatable__row" style="left: 0px;">
                                                                    <td class="kt-datatable__cell" style="display: none;">
                                                                        <input type="text" class="form-control" id="txtIdProjectDeveloper0" value="-1" />
                                                                    </td>
                                                                    <td width="25%" class="kt-datatable__cell">ProjectDeveloper</td>
                                                                    <td width="8%" class="kt-datatable__cell">(DV)</td>
                                                                    <td width="35%" class="kt-datatable__cell">
                                                                        <select id="cmbProjectDeveloper0" class="form-control">
                                                                            <?php echo $this->getUserOption(); ?>
                                                                        </select>
                                                                    </td>
                                                                    <td class="kt-datatable__cell">
                                                                        <button type="button" class="btn btn-success btn-sm btn-icon btn-icon-md" id="btnAddProjectDeveloper" onclick="javascript:addProjectDeveloper(this);"><i class="fa fa-plus"></i>
                                                                        </button>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                                <div class="col-lg-5" style="margin-right:25px;">
                                                    <div class="kt-datatable kt-datatable--default kt-datatable--brand kt-datatable--loaded" style="overflow-x:auto;margin-bottom:15px;">
                                                        <table style="width:100%;">
                                                            <tbody class="kt-datatable__body" id="cust-proj-sponsor-table">
                                                                <tr id="trCustProjectSponsor-0" class="kt-datatable__row" style="left: 0px;">
                                                                    <td class="kt-datatable__cell" style="display: none;">
                                                                        <input type="text" class="form-control" id="txtIdCustProjectSponsor0" value="-1" />
                                                                    </td>
                                                                    <td width="25%" class="kt-datatable__cell">Project Sponsor</td>
                                                                    <td width="8%" class="kt-datatable__cell">&nbsp;</td>
                                                                    <td width="35%" class="kt-datatable__cell">
                                                                        <select id="cmbCustProjectSponsor0" class="form-control">
                                                                        </select>
                                                                    </td>
                                                                    <td class="kt-datatable__cell">
                                                                        <button type="button" class="btn btn-success btn-sm btn-icon btn-icon-md" id="btnAddCustProjectSponsor" onclick="javascript:addCustProjectSponsor(this);"><i class="fa fa-plus"></i>
                                                                        </button>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                    <div class="kt-datatable kt-datatable--default kt-datatable--brand kt-datatable--loaded" style="overflow-x:auto;margin-bottom:15px;">
                                                        <table style="width:100%;">
                                                            <tbody class="kt-datatable__body" id="cust-proj-advisor-table">
                                                                <tr id="trCustProjectAdvisor-0" class="kt-datatable__row" style="left: 0px;">
                                                                    <td class="kt-datatable__cell" style="display: none;">
                                                                        <input type="text" class="form-control" id="txtIdCustProjectAdvisor0" value="-1" />
                                                                    </td>
                                                                    <td width="25%" class="kt-datatable__cell">Project Advisor</td>
                                                                    <td width="8%" class="kt-datatable__cell">&nbsp;</td>
                                                                    <td width="35%" class="kt-datatable__cell">
                                                                        <select id="cmbCustProjectAdvisor0" class="form-control">
                                                                        </select>
                                                                    </td>
                                                                    <td class="kt-datatable__cell">
                                                                        <button type="button" class="btn btn-success btn-sm btn-icon btn-icon-md" id="btnAddCustProjectAdvisor" onclick="javascript:addCustProjectAdvisor(this);"><i class="fa fa-plus"></i>
                                                                        </button>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                    <div class="kt-datatable kt-datatable--default kt-datatable--brand kt-datatable--loaded" style="overflow-x:auto;margin-bottom:15px;">
                                                        <table style="width:100%;">
                                                            <tbody class="kt-datatable__body" id="cust-proj-mgr-table">
                                                                <tr id="trCustProjectManager-0" class="kt-datatable__row" style="left: 0px;">
                                                                    <td class="kt-datatable__cell" style="display: none;">
                                                                        <input type="text" class="form-control" id="txtIdCustProjectManager0" value="-1" />
                                                                    </td>
                                                                    <td width="25%" class="kt-datatable__cell">Project Manager</td>
                                                                    <td width="8%" class="kt-datatable__cell">&nbsp;</td>
                                                                    <td width="35%" class="kt-datatable__cell">
                                                                        <select id="cmbCustProjectManager0" class="form-control">
                                                                        </select>
                                                                    </td>
                                                                    <td class="kt-datatable__cell">
                                                                        <button type="button" class="btn btn-success btn-sm btn-icon btn-icon-md" id="btnAddCustProjectManager" onclick="javascript:addCustProjectManager(this);"><i class="fa fa-plus"></i>
                                                                        </button>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                    <div class="kt-datatable kt-datatable--default kt-datatable--brand kt-datatable--loaded" style="overflow-x:auto;margin-bottom:15px;">
                                                        <table style="width:100%;">
                                                            <tbody class="kt-datatable__body" id="cust-proj-member-table">
                                                                <tr id="trCustProjectMember-0" class="kt-datatable__row" style="left: 0px;">
                                                                    <td class="kt-datatable__cell" style="display: none;">
                                                                        <input type="text" class="form-control" id="txtIdCustProjectMember0" value="-1" />
                                                                    </td>
                                                                    <td width="25%" class="kt-datatable__cell">Project Member</td>
                                                                    <td width="8%" class="kt-datatable__cell">&nbsp;</td>
                                                                    <td width="35%" class="kt-datatable__cell">
                                                                        <select id="cmbCustProjectMember0" class="form-control">
                                                                        </select>
                                                                    </td>
                                                                    <td class="kt-datatable__cell">
                                                                        <button type="button" class="btn btn-success btn-sm btn-icon btn-icon-md" id="btnAddCustProjectMember" onclick="javascript:addCustProjectMember(this);"><i class="fa fa-plus"></i>
                                                                        </button>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>  
            </div>

        <div class="col-lg-12 text-right" id="btnJobQuotation" style="padding-right: 50px;padding-bottom:20px">
        </div>

    </div>
    <!--end::Portlet-->

    <!-- Modal -->
    <div class="modal fade" id="quotationTemplateModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLongTitle">Template</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    </button>
                </div>
                <div class="modal-body">
                    <div class="col-md-9">
                        <input data-switch="true" type="checkbox" checked="checked" id="chkTempOption" data-on-text="New" data-off-text="Update" onchange="changeTempOption()">
                        <input type="text" class="form-control" id="txtChkTempOption" style="display: none;">
                    </div>
                    <br>
                    <div class="col-md-12" id="divTemplateName">
                        <input type="text" class="form-control" id="quotationTemplateName" placeholder="Template Name...">
                    </div>
                    <div class="col-md-12" id="divTemplateList" style="display: none;">
                        <select class="form-control" name="QuotationTemplateList" id="QuotationTemplateList"></select>
                        <!-- <input style="margin-top:10px;" type="text" class="form-control" id="quotationTemplateNewName" placeholder="New Name..."> -->
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary" onclick="saveTemplateQuotation();">Save changes</button>
                </div>
            </div>
        </div>
    </div>
    <!-- End Modal -->

    <!-- Modal -->
    <div class="modal fade" id="quotationTemplateLoadModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="quotationTemplateLoadModalTitle">Template</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    </button>
                </div>
                <div class="modal-body">
                            <div class="col-md-12" id="quotationTemplateLoadModalBody">
                                <select class="form-control" name="QuotationTemplateLoad" id="QuotationTemplateLoad"></select>
                            </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-danger" onclick="DeleteTemplateQuotation();">Delete</button>
                    <button type="button" class="btn btn-primary" onclick="LoadTemplateQuotation();">Load</button>
                </div>
            </div>
        </div>
    </div>
    <!-- End Modal -->

    <!-- Line Remarks pop up Modal HTML -->
    <div class="modal fade" id="lineRemakrsJobTaskView" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modalLineRemakrsJobTaskTitle">Line Remarks</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    </button>
                </div>
                <div class="modal-body">
                    <div class="col-md-12" id="modalLineRemakrsJobTaskContent">
                    </div>
                </div>
                <div class="modal-footer">
                    <div id="modalLineRemakrsJobTaskButton">
                   </div>
                </div>
            </div>
        </div>
    </div>
    <!-- End Line Remarks pop up Modal HTML -->
</div>
<!-- end:: screen -->

<div id="screen[index]a" > 

</div>

<script>
  $(function() {
    $('#chkTempOption').bootstrapSwitch();
  })
</script>

<script type="text/javascript">
 $(document).ready(function(){
    var dteopt = {
            todayHighlight: true,
            orientation: "bottom left",
            autoclose: true,
            format: 'dd/mm/yyyy',
            templates: {
                leftArrow: '<i class="la la-angle-left"></i>',
                rightArrow: '<i class="la la-angle-right"></i>'
            }
        }

    $("#txtQuotationJobStartDate").datepicker(dteopt) ;
    $("#txtQuotationJobEndDate").datepicker(dteopt) ;

    //template
    if($('#chkTempOption').is(':checked')){
        $('#divTemplateList').hide();
        $('#divTemplateName').show();

        $('#txtChkTempOption').val("1");
    }else{
        $('#divTemplateList').show();
        $('#divTemplateName').hide();

        $('#txtChkTempOption').val("0");
    }
});
</script>