Proyectos de Subversion LeadersLinked - Backend

$this->headLink()->appendStylesheet($this->basePath('plugins/nprogress/nprogress.css'));

$this->inlineScript()->appendFile($this->basePath('plugins/nprogress/nprogress.js'));

$this->inlineScript()->appendFile($this->basePath('plugins/ckeditor/ckeditor.js'));

$this->inlineScript()->appendFile($this->basePath('plugins/jquery-validation/jquery.validate.js'));

$this->inlineScript()->appendFile($this->basePath('plugins/jquery-validation/additional-methods.js'));

$this->inlineScript()->appendFile($this->basePath('plugins/jquery-validation/localization/messages_es.js'));

$this->headLink()->appendStylesheet($this->basePath('plugins/datatables-bs4/css/dataTables.bootstrap4.min.css'));

$this->headLink()->appendStylesheet($this->basePath('plugins/datatables-responsive/css/responsive.bootstrap4.min.css'));

$this->inlineScript()->appendFile($this->basePath('plugins/datatables/jquery.dataTables.min.js'));

$this->inlineScript()->appendFile($this->basePath('plugins/datatables-bs4/js/dataTables.bootstrap4.min.js'));

$this->inlineScript()->appendFile($this->basePath('plugins/datatables-responsive/js/dataTables.responsive.min.js'));

$this->inlineScript()->appendFile($this->basePath('plugins/datatables-responsive/js/responsive.bootstrap4.min.js'));

$this->headLink()->appendStylesheet($this->basePath('plugins/bootstrap4-toggle/css/bootstrap4-toggle.min.css'));

$this->inlineScript()->appendFile($this->basePath('plugins/bootstrap4-toggle/js/bootstrap4-toggle.min.js'));

$this->headLink()->appendStylesheet($this->basePath('plugins/bootstrap-checkbox/awesome-bootstrap-checkbox.css'));

$this->inlineScript()->appendFile($this->basePath('plugins/select2/js/select2.js'));

$this->headLink()->appendStylesheet($this->basePath('plugins/select2/css/select2.css'));

$this->headLink()->appendStylesheet($this->basePath('plugins/select2-bootstrap4-theme/select2-bootstrap4.css'));

// bootbox Alert //

$this->inlineScript()->appendFile($this->basePath('plugins/bootbox/bootbox.min.js'));

// Page Styles

//$this->headLink()->appendStylesheet($this->basePath('css/pages/self-evaluation.css'));

$vars  = " var competencies_selected = new Array(); \r\n";

$vars .= " var subordinates_selected = new Array(); \r\n";

$vars .= " var behaviors = new Array(); \r\n";

$vars .= " var subordinates = new Array(); \r\n";

$i = 0;

foreach($behaviors as $record)

{

    $vars .= "  behaviors[$i] =  { uuid : '{$record['uuid']}', description :'{$record['description']}' }; \r\n ";

    $i++;

}

$vars .= " var competency_types = new Array(); \r\n";

$i = 0;

foreach($competency_types as $record)

{

    $vars .= "  competency_types[$i] = { uuid : '{$record['uuid']}' , name : '{$record['name']}' } ; \r\n ";

}

$vars .= " var competencies = new Array(); \r\n";

$i = 0;

{

    $vars .= "  competencies[$i] = new Object(); \r\n ";

    foreach($record['behaviors_by_competency'] as $behavior_uuid)

    {

        $vars .= "  competencies[$i].behaviors[$j] = '$behavior_uuid'; \r\n";

    }

    $i++;

}

$status_active = JobDescription::STATUS_ACTIVE;

$this->inlineScript()->captureStart();

echo <<<JS

jQuery(document).ready(function($) {

    $vars

    var allowEdit = $allowEdit;

    var allowDelete = $allowDelete;

    var allowReport = $allowReport;

    $.fn.renderCompetencies = function() {

        if(competencies_selected.length > 0) {

            $('#renderCompetencies').html($('#competencyTemplate').render(competencies_selected, {

                getCompetencyType: (uuid) => competency_types.filter((item) => item.uuid == uuid ? item : false)[0],

                getCompetency: (uuid) => competencies.filter((item) => item.uuid == uuid ? item : false)[0],

                getBehavior: (uuid) => behaviors.filter((item) => item.uuid == uuid ? item : false)[0]

            }));

        } else {

            $('#renderCompetencies').html('');

        }

    }

    $.fn.renderSubordinates = function() {

        if(subordinates_selected.length > 0) {

            $('#renderSubordinates').html($('#subordinateTemplate').render(subordinates_selected, {

                getSubordinate: (uuid) => subordinates.filter((item) => item.uuid == uuid ? item : false)[0],

            }));

        } else {

            $('#renderSubordinates').html('');

        }

    }

    $.fn.comboCompetencies = function() {

        $('#select-competency').children().remove();

        $.each(competency_types, function(i, competency_type) {

            competencies_filtered = competencies.filter((item) => item.competency_type_uuid == competency_type.uuid ? item : false)

            $.each(competencies_filtered, function(i, competency) {

                selected = competencies_selected.filter((item) => item.uuid == competency.uuid ? item : false)[0];

                if(!selected) {

                    $('#select-competency').append($('<option>', {

                        value: competency.uuid,

                        text: competency_type.name +  ' - ' + competency.name

                    }));

                }

            });

        });    

    }

    $.fn.comboSubordinates = function() {

        $('#select-subordinate').children().remove();

        $.each(subordinates, function(i, subordinate) {

            var subordinate_selected = subordinates_selected.filter((item) => item.uuid == subordinate.uuid ? item : false)[0];    

            if(!subordinate_selected) {

                $('#select-subordinate').append($('<option>', {

                    value: subordinate.uuid,

                    text: subordinate.name

                }));

            }

        });

    }

    $.validator.setDefaults({

        debug: true,

        highlight: function(element) {

            $(element).addClass('is-invalid');

        },

        unhighlight: function(element) {

            $(element).removeClass('is-invalid');

        },

        errorElement: 'span',

        errorClass: 'error invalid-feedback',

        errorPlacement: function(error, element) {

            if (element.parent('.form-group').length) {

                error.insertAfter(element);

            } else if (element.parent('.toggle').length) {

                error.insertAfter(element.parent().parent());

            } else {

                error.insertAfter(element.parent());

            }

        }

    });

    $.fn.showFormErrorValidator = function(fieldname, errors) {

        var field = $(fieldname);

        if (field) {

            $(field).addClass('is-invalid');

            var error = $('<span id="' + fieldname + '-error" class="error invalid-feedback">' + errors + '</div>');

            if (field.parent('.form-group').length) {

                error.insertAfter(field);

            } else if (field.parent('.toggle').length) {

                error.insertAfter(field.parent().parent());

            } else {

                error.insertAfter(field.parent());

            }

        }

    };

    var gridTable = $('#gridTable').dataTable({

        'processing': true,

        'serverSide': true,

        'searching': true,

        'order': [

            [0, 'asc']

        ],

        'ordering': true,

        'ordenable': true,

        'responsive': true,

        'select': false,

        'paging': true,

        'pagingType': 'simple_numbers',

        'ajax': {

            'url': '$routeDatatable',

            'type': 'get',

            'beforeSend': function(request) {

                NProgress.start();

            },

            'dataFilter': function(response) {

                var response = jQuery.parseJSON(response);

                var json = {};

                json.recordsTotal = 0;

                json.recordsFiltered = 0;

                json.data = [];

                if (response.success) {

                    json.recordsTotal = response.data.total;

                    json.recordsFiltered = response.data.total;

                    json.data = response.data.items;

                } else {

                    $.fn.showError(response.data)

                }

                return JSON.stringify(json);

            }

        },

        'language': {

            'sProcessing': 'LABEL_DATATABLE_SPROCESSING',

            'sLengthMenu': 'LABEL_DATATABLE_SLENGTHMENU',

            'sZeroRecords': 'LABEL_DATATABLE_SZERORECORDS',

            'sEmptyTable': 'LABEL_DATATABLE_SEMPTYTABLE',

            'sInfo': 'LABEL_DATATABLE_SINFO',

            'sInfoEmpty': 'LABEL_DATATABLE_SINFOEMPTY',

            'sInfoFiltered': 'LABEL_DATATABLE_SINFOFILTERED',

            'sInfoPostFix': '',

            'sSearch': 'LABEL_DATATABLE_SSEARCH',

            'sUrl': '',

            'sInfoThousands': ',',

            'sLoadingRecords': 'LABEL_DATATABLE_SLOADINGRECORDS',

            'oPaginate': {

                'sFirst': 'LABEL_DATATABLE_SFIRST',

                'sLast': 'LABEL_DATATABLE_SLAST',

                'sNext': 'LABEL_DATATABLE_SNEXT',

                'sPrevious': 'LABEL_DATATABLE_SPREVIOUS'

            },

            'oAria': {

                'sSortAscending': ': LABEL_DATATABLE_SSORTASCENDING',

                'sSortDescending': ':LABEL_DATATABLE_SSORTDESCENDING'

            },

        },

        'drawCallback': function(settings) {

            NProgress.done();

            $('button.btn-delete').confirmation({

                rootSelector: 'button.btn-delete',

                title: 'LABEL_ARE_YOU_SURE',

                singleton: true,

                btnOkLabel: 'LABEL_YES',

                btnCancelLabel: 'LABEL_NO',

                onConfirm: function(value) {

                    action = $(this).data('href');

                    NProgress.start();

                    $.ajax({

                        'dataType': 'json',

                        'accept': 'application/json',

                        'method': 'post',

                        'url': action,

                    }).done(function(response) {

                        if (response['success']) {

                            $.fn.showSuccess(response['data']);

                            gridTable.api().ajax.reload(null, false);

                        } else {

                            $.fn.showError(response['data']);

                        }

                    }).fail(function(jqXHR, textStatus, errorThrown) {

                        $.fn.showError(textStatus);

                    }).always(function() {

                        NProgress.done();

                    });

                },

            });

        },

        'aoColumns': [{

                'mDataProp': 'name'

            },

            {

                'mDataProp': 'status'

            },

            {

                'mDataProp': 'actions'

            },

        ],

        'columnDefs': [{

                'targets': 0,

                'className': 'text-vertical-middle',

            },

            {

                'targets': -2,

                'orderable': false,

                'className': 'text-center',

                'render': function(data, type, row) {

                    checked = data == 'a' ? ' checked="checked" ' : '';

                    return '<div class="checkbox checkbox-success">' +

                        '<input class="styled" type="checkbox" ' + checked + ' disabled="disabled">' +

                        '<label ></label></div>';

                }

            },

            {

                'targets': -1,

                'orderable': false,

                'render': function(data, type, row) {

                    s = '';

                    if (allowEdit) {

                        s = s + '<button class="btn btn-primary btn-edit" data-href="' + data['link_edit'] + '" data-toggle="tooltip" title="LABEL_EDIT"><i class="fa fa-pencil"></i> LABEL_EDIT </button>&nbsp;';

                    }

                    if (allowDelete) {

                        s = s + '<button class="btn btn-danger btn-delete" data-href="' + data['link_delete'] + '" data-toggle="tooltip" title="LABEL_DELETE"><i class="fa fa-trash"></i> LABEL_DELETE </button>&nbsp;';

                    }

                    if (allowReport) {

                        s = s + '<button class="btn btn-primary btn-pdf"  data-href="' + data['link_report'] + '"  data-toggle="tooltip" title="LABEL_PDF"><i class="fa fa-file-o"></i> LABEL_PDF </button>&nbsp;';

                    }

                    return s;

                }

            }

        ],

    });

    var validator = $('#form').validate({

        debug: true,

        onclick: false,

        onkeyup: false,

        ignore: [],

        rules: {

            'name': {

                required: true,

                maxlength: 64,

            },

            'functions': {

                updateCkeditor: function() {

                    CKEDITOR.instances.functions.updateElement();

                },

                required: true,

            },

            'objectives': {

                updateCkeditor: function() {

                    CKEDITOR.instances.objectives.updateElement();

                },

                required: true,

            },

            'status': {

                required: false,

            },

            'job_description_id_boss': {

                required: false,

            }

        },

        submitHandler: function(form) {

            var data = {

                name : $('#form #name').val(),

                functions : $('#form #functions').val(),

                objectives : $('#form #objectives').val(),

                status :  $('#form #status').val(),

                job_description_id_boss: $('#form #job_description_id_boss').val(),

                subordinates_selected : new Array(),

                competencies_selected : new Array(),

            };

            $.each(competencies_selected, function(i, c) {

                $.each(c.behaviors, function(i, b) {

                    data.competencies_selected.push({'competency_uuid' : c.uuid, 'behavior_uuid' : b.uuid, 'level' : b.level});

                });

            });

            $.each(subordinates_selected, function(i, subordinate_selected) {

                data.subordinates_selected.push(subordinate_selected.uuid);

            });

            NProgress.start();

            $.ajax({

                'dataType': 'json',

                'accept': 'application/json',

                'method': 'post',

                'url': $('#form').attr('action'),

                'data': data,

            }).done(function(response) {

                if (response['success']) {

                    $.fn.showSuccess(response['data']);

                    $('#row-lists').show();

                    $('#row-form').hide();

                    gridTable.api().ajax.reload(null, false);

                } else {

                    validator.resetForm();

                    if (jQuery.type(response['data']) == 'string') {

                        $.fn.showError(response['data']);

                    } else {

                        $.each(response['data'], function(fieldname, errors) {

                            $.fn.showFormErrorValidator('#form #' + fieldname, errors);

                        });

                    }

                }

            }).fail(function(jqXHR, textStatus, errorThrown) {

                $.fn.showError(textStatus);

            }).always(function() {

                NProgress.done();

            });

            return false;

        },

        invalidHandler: function(form, validator) {}

    });

    $('body').on('click', 'button.btn-add', function(e) {

        e.preventDefault();

        NProgress.start();

        $.ajax({

            'dataType': 'json',

            'accept': 'application/json',

            'method': 'get',

            'url': '$routeAdd',

        }).done(function(response) {

            if (response['success']) {

                competencies_selected = [];

                subordinates = [];

                $('#select-subordinate').children().remove();

                $('#job_description_id_boss').children().not(':first').remove();

                $.each(response['data']['jobs_description'], function(value, text) {

                    subordinates.push({uuid:  value, name: text});

                    $('#select-subordinate').append($('<option>', {

                        value: value,

                        text: text

                    }));

                    $('#job_description_id_boss').append($('<option>', {

                        value: value,

                        text: text

                    }));

                });

                $('#form #job_description_id_boss').val('').trigger('change');

                $.fn.renderSubordinates();

                $.fn.comboSubordinates();

                $.each(competencies, function(i, competency) {

                    $.each(competency.behaviors, function(j, behavior) {

                        competencies[i].behaviors[j].level = 0;

                    });

                });

                $.fn.renderCompetencies();

                $.fn.comboCompetencies();

                $('span[id="form-title"]').html('LABEL_ADD');

                $('#form').attr('action', '$routeAdd');

                $('#form #name').val('');

                $('#form #status').bootstrapToggle('on');

                CKEDITOR.instances.functions.setData('');

                CKEDITOR.instances.objectives.setData('');

                validator.resetForm();

                $('#custom-tabs #custom-tabs-general-tab').tab('show');

                $('#row-lists').hide();

                $('#row-form').show();

           } else   {                      

                $.fn.showError(response['data']);

            }

        }).fail(function(jqXHR, textStatus, errorThrown) {

            $.fn.showError(textStatus);

        }).always(function() {

            NProgress.done();

        });

        return false

    });

    $('body').on('click', 'button.btn-edit', function(e) {

        e.preventDefault();

        NProgress.start();

        var action = $(this).data('href');

        $.ajax({

            'dataType': 'json',

            'accept': 'application/json',

            'method': 'get',

            'url': action,

        }).done(function(response) {

            if (response['success']) {

                $('span[id="form-title"]').html('LABEL_EDIT');

                $('#form').attr('action', action);

                $('#form #name').val(response['data']['name']);

                $('#form #status').bootstrapToggle(response['data']['status'] == '$status_active' ? 'on' : 'off')

                CKEDITOR.instances.functions.setData(response['data']['functions']);

                CKEDITOR.instances.objectives.setData(response['data']['objectives']);

                subordinates = [];

                $('#select-subordinate').children().remove();

                $('#job_description_id_boss').children().not(':first').remove();

                $.each(response['data']['jobs_description'], function(value, text) {

                    subordinates.push({uuid:  value, name: text});

                    $('#select-subordinate').append($('<option>', {

                        value: value,

                        text: text

                    }));

                    $('#job_description_id_boss').append($('<option>', {

                        value: value,

                        text: text

                    }));

                });

                $('#form #job_description_id_boss').val(response['data']['job_description_id_boss']).trigger('change');

                competencies_selected = response['data']['competencies_selected'];

                subordinates_selected = response['data']['subordinates_selected'];                

                $.fn.renderCompetencies();

                $.fn.comboCompetencies();

                $.fn.renderSubordinates();

                $.fn.comboSubordinates();

                validator.resetForm();

                $('#custom-tabs #custom-tabs-general-tab').tab('show');

                $('#row-lists').hide();

                $('#row-form').show();

            } else {

                $.fn.showError(response['data']);

            }

        }).fail(function(jqXHR, textStatus, errorThrown) {

            $.fn.showError(textStatus);

        }).always(function() {

            NProgress.done();

        });

    });

    $('body').on('click', 'button.btn-refresh', function(e) {

        e.preventDefault();

        gridTable.api().ajax.reload(null, false);

    });

    $('body').on('click', 'button.btn-cancel', function(e) {

        e.preventDefault();

        $('#row-lists').show();

        $('#row-form').hide();

        $('#div-listing').show();

    });

    $('body').on('click', 'button.btn-import', function(e) {

        e.preventDefault();

        NProgress.start();

        $.ajax({

            'dataType': 'json',

            'method': 'post',

            'url': '$routeImport',

        }).done(function(response) {

            if (response['success']) {

                $.fn.showSuccess(response['data']);

                gridTable.api().ajax.reload(null, false);

            } else {

                $.fn.showError(response['data']);

            }

        }).fail(function(jqXHR, textStatus, errorThrown) {

            $.fn.showError(textStatus);

        }).always(function() {

            NProgress.done();

        });

        return false;

    });

    $('body').on('click', 'button.btn-pdf', function(e) {

        e.preventDefault();

        var action   = $(this).data('href');

        NProgress.start(); 

        $.ajax({

            'dataType'  : 'json',

            'method'    : 'get',

            'url'       :  action,

        }).done(function(response) {

            if(response['success']) {

                var anchor = window.document.createElement("a");

                anchor.href = 'data:application/octet-stream;charset=utf-8;base64,' + response['data']['content'] ;

                anchor.download = response['data']['basename'];

                document.body.appendChild(anchor);

                anchor.click();  // IE: "Access is denied"; see: https://connect.microsoft.com/IE/feedback/details/797361/ie-10-treats-blob-url-as-cross-origin-and-denies-access

                document.body.removeChild(anchor);

            } else {

                $.fn.showError(response['data']);

            }

        }).fail(function( jqXHR, textStatus, errorThrown) {

            showError(textStatus);

        }).always(function() {

            NProgress.done();

        });

    });

    $('body').on('click', 'button[id="btn-select-competency"]', function(e) {

        var competency_uuid = $('#select-competency').val();

        if (competency_uuid.length == '') {

            $.fn.showError('ERROR_SELECT_COMPETENCY_IS_EMPTY');

        } else {

            competency = competencies.filter((item) => item.uuid == competency_uuid ? item : false)[0];

            if(competency) {

                var competency_selected = {

                    uuid : competency.uuid, 

                    competency_type_uuid: competency.competency_type_uuid,

                    behaviors : new Array(),

                }

                $.each(competency.behaviors, function(index, uuid) {

                    competency_selected.behaviors.push({uuid: uuid, level: 0});

                })

                competencies_selected.push(competency_selected);

                $.fn.renderCompetencies();

                $.fn.comboCompetencies();

            }

        }

    });

    $('body').on('click', 'button[id="btn-select-subordinate"]', function(e) {

        e.preventDefault();

        var uuid = $("#select-subordinate").val();    

        if (uuid == "") {

            $.fn.showError('ERROR_SELECT_DEPENDENT_IS_EMPTY');

        } else {

            subordinate = subordinates.filter((item) => item.uuid == uuid ? item : false)[0];

            if(subordinate) {

                subordinates_selected.push({uuid: subordinate.uuid});

                $.fn.renderSubordinates();

                $.fn.comboSubordinates();

            }    

        }

    });

    $('body').on('click', 'button.btn-delete-subordinate', function(e) {

        var uuid = $(this).data('subordinate');

        bootbox.confirm({

            title: 'LABEL_DEPENDENT_DELETE_TITLE',

            message: 'LABEL_DEPENDENT_DELETE_MESSAGE',

            buttons: {

                cancel: {

                    label: '<i class="fa fa-times"></i> LABEL_CANCEL'

                },

                confirm: {

                    label: '<i class="fa fa-check"></i> LABEL_ACCEPT'

                }

            },

            callback: function(result) {

                if (result) {

                    subordinates_selected = subordinates_selected.filter((item) => item.uuid != uuid ? item : false); 

                    $.fn.renderSubordinates();

                    $.fn.comboSubordinates();

                }

            }

        });

    });

    $('body').on('click', 'button.btn-delete-competency', function(e) {

        e.preventDefault();

        var uuid = $(this).data('competency');

        bootbox.confirm({

             title: 'LABEL_COMPETENCY_DELETE_TITLE',

            message: 'LABEL_COMPETENCY_DELETE_MESSAGE',

            buttons: {

                cancel: {

                    label: '<i class="fa fa-times"></i> LABEL_CANCEL'

                },

                confirm: {

                    label: '<i class="fa fa-check"></i> LABEL_ACCEPT'

                }

            },

            callback: function(result) {

                if (result) {

                    competencies_selected = competencies_selected.filter((item) => item.uuid != uuid ? item : false);

                    $.fn.renderCompetencies();

                    $.fn.comboCompetencies();

                }

            }

        });

    });

    $('body').on('click','button.btn-edit-behavior', function(e) {

        e.preventDefault();

        var competency_uuid = $(this).closest('div.panel-competency').data('competency');

        var behavior_uuid = $(this).data('behavior');

        competency_selected = competencies_selected.filter((item) => item.uuid == competency_uuid ? item : false)[0];

        if(competency_selected) {

            console.log(competency_selected);

            behavior = competency_selected .behaviors.filter((item) => item.uuid  == behavior_uuid ? item : false)[0];

            if(behavior) {

                console.log(behavior);

                $('#form-behavior #competency-uuid').val(competency_uuid);

                $('#form-behavior #behavior-uuid').val(behavior_uuid);          

                $('#form-behavior #level').val(behavior.level);

                $('#modal-behavior').modal('show');

            }

        }

    });

    $('body').on('click','button.btn-behavior-submit', function(e) {

         e.preventDefault();

         $('#modal-behavior').modal('hide');

         var competency_uuid = $('#form-behavior #competency-uuid').val();

         var behavior_uuid = $('#form-behavior #behavior-uuid').val();          

         var level = $('#form-behavior #level').val();

        competency_selected = competencies_selected.filter((item) => item.uuid == competency_uuid ? item : false)[0];

        if(competency_selected) {

            behavior = competency_selected .behaviors.filter((item) => item.uuid  == behavior_uuid ? item : false)[0];

            if(behavior) {

                behavior.level = level;

                $.fn.renderCompetencies();

            }

        }

    });

    $('body').on('click', 'button.btn-edit-cancel', function(e) {

        $('#row-lists').show();

        $('#row-form').hide();

    });

    $('#form #status').bootstrapToggle({

        'on': 'LABEL_ACTIVE',

        'off': 'LABEL_INACTIVE',

        'width': '160px',

        'height': '40px'

    });

    CKEDITOR.replace('functions');

    CKEDITOR.replace('objectives');

    $('#form #job_description_id_boss').select2({

        theme: 'bootstrap4',

        width: '100%',

    });

    $('#select-subordinate').select2({

        theme: 'bootstrap4',

        width: '100%',

    });

    $('#select-competency').select2({

        theme: 'bootstrap4',

});

JS;

$this->inlineScript()->captureEnd();

?>

<section class="content" id="row-lists">

<!-- Content Header (Page header) -->

<div class="content-header">

   <div class="container-fluid">

      <div class="row mb-2">

         <div class="col-sm-12">

            <h1>LABEL_JOBS_DESCRIPTION</h1>

         </div>

      </div>

   </div>

   <!-- /.container-fluid -->

</div>

   <div class="container-fluid">

      <div class="row">

         <div class="col-12">

            <div class="card">

               <div class="card-body">

                  <table id="gridTable" class="table table-hover">

                     <thead>

                        <tr>

                           <th style= "width: 50%">LABEL_NAME</th>

                           <th style= "width: 15%">LABEL_ACTIVE</th>

                           <th style= "width: 35%">LABEL_ACTIONS</th>

                        </tr>

                     </thead>

                     <tbody>

                     </tbody>

                  </table>

               </div>

               <div class="card-footer clearfix">

                  <div style="float:right;">

                     <button type="button" class="btn btn-info btn-refresh"><i class="fa fa-refresh"></i> LABEL_REFRESH  </button>

                     <?php if($allowAdd) : ?>

                     <?php if($allowImport) : ?>

                     <button type="button" class="btn btn-primary btn-import"><i class="fa fa-upload"></i> LABEL_IMPORT </button>

                     <?php endif; ?>

                     <button type="button" class="btn btn-primary btn-add"><i class="fa fa-plus"></i> LABEL_ADD </button>

                     <?php endif; ?>

                  </div>

               </div>

            </div>

         </div>

      </div>

   </div>

</section>

<section id="row-form" style="display:none">

<div class="container">

      <!-- Modal Header -->

      <div class="modal-header">

         <h4 class="modal-title">LABEL_JOB_DESCRIPTION - <span id="form-title"></span></h4>

      </div>

      <!-- Modal body -->

      <div class="modal-body">

         <div class="card card-primary card-outline card-tabs">

            <div class="card-header p-0 pt-1 border-bottom-0">

               <ul class="nav nav-tabs" id="custom-tabs" role="tablist">

                  <li class="nav-item">

                     <a class="nav-link active" id="custom-tabs-general-tab" data-toggle="pill" href="#custom-tabs-general" role="tab" aria-controls="custom-tabs-general" aria-selected="true">LABEL_GENERAL</a>

                  </li>

                  <li class="nav-item">

                     <a class="nav-link" id="custom-tabs-compentencies-tab" data-toggle="pill" href="#custom-tabs-compentencies" role="tab" aria-controls="custom-tabs-compentencies" aria-selected="false">LABEL_COMPETENCIES</a>

                  </li>

                  <li class="nav-item">

                     <a class="nav-link" id="custom-tabs-subordinate-tab" data-toggle="pill" href="#custom-tabs-subordinate" role="tab" aria-controls="custom-tabs-subordinate" aria-selected="false">LABEL_SUBORDINATES</a>

                  </li>

               </ul>

            </div>

            <div class="card-body">

               <?php 

                  $form = $this->form;

                  $form->setAttributes([

                      'method'    => 'post',

                      'name'      => 'form',

                      'id'        => 'form'

                  ]);

                  $form->prepare();

                  echo $this->form()->openTag($form);

                  $element = $form->get('subordinates');

                  echo $this->formHidden($element);

                  $element = $form->get('competencies');

                  echo $this->formHidden($element);

                ?>            

               <div class="tab-content" id="custom-tabs-three-tabContent">

                  <div class="tab-pane fade show active" id="custom-tabs-general" role="tabpanel" aria-labelledby="custom-tabs-general-tab">

                     <div class="row">

                        <div class="col-md col-sm-12 col-12">

                           <div class="form-group m-0">

                              <?php 

                                 $element = $form->get('name');

                                 $element->setOptions(['label' => 'LABEL_NAME']);

                                 $element->setAttributes(['class' => 'form-control']); 

                                 echo $this->formLabel($element);

                                 echo $this->formText($element);

                                 ?>

                           </div>

                        </div>

                        <div class="col-md col-sm-12 col-12">

                           <div class="form-group m-0">

                              <?php 

                                 $element = $form->get('job_description_id_boss');

                                 $element->setOptions(['label' => 'LABEL_BOSS']);

                                 $element->setAttributes(['class' => 'form-control']); 

                                 echo $this->formLabel($element);

                                 echo $this->formSelect($element);

                                 ?>

                           </div>

                        </div>

                        <div

                           class="col-md col-sm-12 col-12 d-flex align-items-center justify-content-center"

                           >

                           <div class="form-group m-0">

                              <label>LABEL_STATUS</label>

                              <br />

                              <?php 

                                 $element = $form->get('status');

                                 $element->setOptions(['label' => 'LABEL_STATUS']);