WebSVN – LeadersLinked - Backend – Diff – /module/LeadersLinked/view/leaders-linked/jobs-description/index_jquery.phtml

 $currentUser    = $this->currentUserHelper();
 $roleName = $currentUser->getUserTypeId();
-$routeAdd       = $this->url('settings/jobs-description/add');
+$routeAdd       = $this->url('jobs-description/add');
-$routeDatatable = $this->url('settings/jobs-description');
+$routeDatatable = $this->url('jobs-description');
-$routeImport    = $this->url('settings/jobs-description/import');
+$routeImport    = $this->url('jobs-description/import');
 $routeDashboard = $this->url('dashboard');
-$allowAdd               = $acl->isAllowed($roleName, 'settings/jobs-description/add') ? 1 : 0;
+$allowAdd               = $acl->isAllowed($roleName, 'jobs-description/add') ? 1 : 0;
-$allowEdit              = $acl->isAllowed($roleName, 'settings/jobs-description/edit') ? 1 : 0;
+$allowEdit              = $acl->isAllowed($roleName, 'jobs-description/edit') ? 1 : 0;
-$allowDelete            = $acl->isAllowed($roleName, 'settings/jobs-description/delete') ? 1 : 0;
+$allowDelete            = $acl->isAllowed($roleName, 'jobs-description/delete') ? 1 : 0;
-$allowReport            = $acl->isAllowed($roleName, 'settings/jobs-description/report') ? 1 : 0;
+$allowReport            = $acl->isAllowed($roleName, 'jobs-description/report') ? 1 : 0;
-$allowImport            = $acl->isAllowed($roleName, 'settings/jobs-description/import') ? 1 : 0;
+$allowImport            = $acl->isAllowed($roleName, 'jobs-description/import') ? 1 : 0;
 // JsRender //
 $this->inlineScript()->appendFile($this->basePath('plugins/jsrender/jsrender.min.js'));
+// Page Styles
+//$this->headLink()->appendStylesheet($this->basePath('css/pages/self-evaluation.css'));
 // Page Styles
 $this->headLink()->appendStylesheet($this->basePath('css/pages/self-evaluation.css'));
-$status_active = JobDescription::STATUS_ACTIVE;
-$this->inlineScript()->captureStart();
-echo <<<JS
 $status_active = JobDescription::STATUS_ACTIVE;
+$this->inlineScript()->captureStart();
+echo <<<JS
+jQuery(document).ready(function($) {
+    var competencies_selected = new Array();
+    var subordinates_selected = new Array();
+    var behaviors = new Array();
+    var subordinates = new Array();
+    var competency_types = new Array();
+    var competencies = new Array();
+    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
-var competencies = [];
+                }));
 var competencies_type = [];
-var subordinates = [];
+        });
 var competencies_selected = [];
 var subordinates_selected = [];
             } 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>');
             } else {
                 error.insertAfter(field.parent());
+            }
+        }
     };
-    var allowEdit = $allowEdit;
-    var allowDelete = $allowDelete;
-    var allowReport = $allowReport;
     var gridTable = $('#gridTable').dataTable({
         'processing': true,
         'serverSide': true,
         'searching': true,
         'order': [
+            {
                 'targets': -1,
                 'orderable': false,
                 'render': function(data, type, row) {
                     s = '';
-                    if (allowEdit) {
+                    if (allowEdit && data['link_edit']) {
                         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) {
+                    if (allowDelete && data['link_delete']) {
                         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) {
+                    if (allowReport && data['link_report']) {
-                        s = s + '<a class="btn btn-default btn-pdf" href="' + data['link_report'] + '" target="_blank" data-toggle="tooltip" title="LABEL_PDF"><i class="fa fa-file-o"></i> LABEL_PDF </button>&nbsp;';
+                        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: [],
             'name': {
                 required: true,
                 maxlength: 64,
             },
             'functions': {
-                updateCkeditor: function() {
-                    CKEDITOR.instances.functions.updateElement();
-                },
                 required: true,
+                maxlength: 1024,
             },
             'objectives': {
-                updateCkeditor: function() {
-                    CKEDITOR.instances.objectives.updateElement();
-                },
+               required: true,
-                required: true,
+                maxlength: 1024,
             },
             '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(),
+            };
-            $("#competencies_selected").val(JSON.stringify(competencies_selected));
+            $.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});
+                });
+            });
-            $("#subordinates_selected").val(JSON.stringify(subordinates_selected));
+            $.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': $('#form').serialize()
+                'data': data,
             }).done(function(response) {
-                NProgress.start();
                 if (response['success']) {
                     $.fn.showSuccess(response['data']);
                     $('#row-lists').show();
-        $('#row-form').hide();
+                    $('#row-form').hide();
                     gridTable.api().ajax.reload(null, false);
                 } else {
                     validator.resetForm();
                     if (jQuery.type(response['data']) == 'string') {
                         $.fn.showError(response['data']);
             });
             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']) {
+                behaviors = response['data']['behaviors'];
+                competency_types = response['data']['competency_types'];
+                competencies = response['data']['competencies'];
+                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('');
+                $('#form #functions').val('');
-                CKEDITOR.instances.objectives.setData('');
+                $('#form #objectives').val('');
-                subordinates_selected = [];
-                competencies_selected = [];
-                competencies = response['data']['competencies'];
-                competencies_type = response['data']['competency_types'];
-                subordinates = response['data']['jobs_description'];
-                renderData([]);
-                renderSubordinateData([]);
-                setCompetencySelect();
-                setSubordinateSelect();
                 validator.resetForm();
                 $('#custom-tabs #custom-tabs-general-tab').tab('show');
                 $('#row-lists').hide();
-        $('#row-form').show();
+                $('#row-form').show();
-            } else {
+           } 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({
             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']);
+                $('#form #functions').val(response['data']['functions']);
-                CKEDITOR.instances.objectives.setData(response['data']['objectives']);
+                $('#form #objectives').val(response['data']['objectives']);
-                $('#tableCompetencies tbody').empty();
+                behaviors = response['data']['behaviors'];
+                competency_types = response['data']['competency_types'];
                 competencies = response['data']['competencies'];
+                subordinates = [];
-                competencies_type = response['data']['competency_types'];
+                $('#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'];
-                subordinates = response['data']['jobs_description'];
-                renderData(competencies_selected);
+                $.fn.renderCompetencies();
-                renderSubordinateData(subordinates_selected);
+                $.fn.comboCompetencies();
-                setCompetencySelect();
+                $.fn.renderSubordinates();
-                setSubordinateSelect();
+                $.fn.comboSubordinates();
-                $('#job_description_id_boss').val(response['data']['job_description_id_boss']);
                 validator.resetForm();
                 $('#custom-tabs #custom-tabs-general-tab').tab('show');
                 $('#row-lists').hide();
-        $('#row-form').show();
+                $('#row-form').show();
             } else {
                 $.fn.showError(response['data']);
+            }
         }).fail(function(jqXHR, textStatus, errorThrown) {
             $.fn.showError(textStatus);
     });
     $('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',
         }).always(function() {
             NProgress.done();
         });
         return false;
     });
+    $('body').on('click', 'button.btn-pdf', function(e) {
+        e.preventDefault();
-    $('#form #status').bootstrapToggle({
+        var action   = $(this).data('href');
-        'on': 'LABEL_ACTIVE',
+        NProgress.start();
+        $.ajax({
-        'off': 'LABEL_INACTIVE',
+            'dataType'  : 'json',
-        'width': '160px',
+            '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);
-        'height': '40px'
+            } else {
+                $.fn.showError(response['data']);
+            }
+        }).fail(function( jqXHR, textStatus, errorThrown) {
+            $.fn.showError(textStatus);
+        }).always(function() {
+            NProgress.done();
+        });
     });
-    CKEDITOR.replace('functions');
-    CKEDITOR.replace('objectives');
-    /**
-     * Clicked select competency
      */
+    $('body').on('click', 'button[id="btn-select-competency"]', function(e) {
+        var competency_uuid = $('#select-competency').val();
-    $('body').on('click', 'button[id="btn-select-competency"]', function(e) {
-        if ($("#select-competency").val() == "") {
+        if (competency_uuid.length == '') {
-            $.fn.showError('LABEL_ERROR_SELECT_COMPETENCY');
+            $.fn.showError('ERROR_SELECT_COMPETENCY_IS_EMPTY');
+        } else {
-        } else {
+            competency = competencies.filter((item) => item.uuid == competency_uuid ? item : false)[0];
+            if(competency) {
+                var competency_selected = {
+                    uuid : competency.uuid,
-            competencies_selected.push(competencies.filter((item) => item.competency_id == $("#select-competency").val() ? item : false)[0]);
+                    competency_type_uuid: competency.competency_type_uuid,
+                    behaviors : new Array(),
+                }
+                $.each(competency.behaviors, function(index, uuid) {
+                    competency_selected.behaviors.push({uuid: uuid, level: 0});
+                })
-            $("#select-subordinate").val('');
+                competencies_selected.push(competency_selected);
-            renderData(competencies_selected);
+                $.fn.renderCompetencies();
+                $.fn.comboCompetencies();
             setCompetencySelect();
+        }
     });
-    /**
-     * Clicked select subordinate
      */
+    $('body').on('click', 'button[id="btn-select-subordinate"]', function(e) {
+        e.preventDefault();
-    $('body').on('click', 'button[id="btn-select-subordinate"]', function(e) {
+        var uuid = $("#select-subordinate").val();
-        if ($("#select-subordinate").val() == "") {
+        if (uuid == "") {
-            $.fn.showError('LABEL_ERROR_SELECT_DEPENDENT');
+            $.fn.showError('ERROR_SELECT_DEPENDENT_IS_EMPTY');
         } else {
+            subordinate = subordinates.filter((item) => item.uuid == uuid ? item : false)[0];
+            if(subordinate) {
-            subordinates_selected.push(subordinates.filter((item) => item.job_description_id == $("#select-subordinate").val() ? item : false)[0]);
+                subordinates_selected.push({uuid: subordinate.uuid});
-            renderSubordinateData(subordinates_selected);
+                $.fn.renderSubordinates();
+                $.fn.comboSubordinates();
             setSubordinateSelect();
+        }
-    });
-    /**
-     * Clicked remove subordinate
+    });
      */
     $('body').on('click', 'button.btn-delete-subordinate', function(e) {
-        var job_description_id = $(this).data('subordinate');
+        var uuid = $(this).data('subordinate');
         bootbox.confirm({
-            title: "LABEL_DELETE LABEL_DEPENDENT",
+            title: 'LABEL_DEPENDENT_DELETE_TITLE',
-            message: "LABEL_QUESTION_DELETE",
+            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);
-                    subordinates_selected = subordinates_selected.filter((item) => item.job_description_id != job_description_id);
-                    renderSubordinateData(subordinates_selected);
+                    $.fn.renderSubordinates();
-                    return setSubordinateSelect();
+                    $.fn.comboSubordinates();
+                }
+            }
         });
-    });
-    const setCompetencySelect = () => {
-        $('#select-competency').children().remove();
-        $('#select-competency').append($('<option>', {
-            value: '',
-            text: 'LABEL_SELECT'
-        }));
-        $.each(competencies, function(i, item) {
-            if (!filterItemById(item.competency_id)) {
-                var type = filterTypeById(item.competency_type_id);
-                $('#select-competency').append($('<option>', {
-                    value: item.competency_id,
-                    text: type.name + ' - ' + item.name
-                }));
-            }
-        });
+    });
-    }
-    const setSubordinateSelect = () => {
-        $('#select-subordinate').children().remove();
-        $('#select-subordinate').append($('<option>', {
-            value: '',
-            text: 'LABEL_SELECT'
-        }));
-        $.each(subordinates, function(i, item) {
-            if (!filterDependedItemById(item.job_description_id)) {
-                $('#select-subordinate').append($('<option>', {
-                    value: item.job_description_id,
-                    text: item.name
-                }));
-            }
-        });
-    }
-    /**
-     * Render Competencies data
-     */
-    const renderData = (data) => {
-        data.length > 0 ?
-            $("#competencies-job").html($("#sectionTemplate").render(data, {
-                getType: filterTypeById
-            })) :
-            $("#competencies-job").html('');
-    }
-    /**
-     * Render Subordinate data
-     */
-    const renderSubordinateData = (data) => {
-        data.length > 0 ?
-            $("#subordinate").html($("#sectionJob").render(data)) :
-            $("#subordinate").html('');
-    }
-    /**
-     * Filter competencies selected
-     */
-    const filterItemById = (id) => competencies_selected.filter((item) => item.competency_id == id ? item : false)[0];
-    /**
-     * Filter depended selected
-     */
-    const filterDependedItemById = (id) => subordinates_selected.filter((item) => item.job_description_id == id ? item : false)[0];
-    /**
-     * Filter competencie type
-     */
-    const filterTypeById = (id) => competencies_type.filter((item) => item.competency_type_id == id ? item : false)[0];
-    /**
-     * Clicked remove competency
      */
+    $('body').on('click', 'button.btn-delete-competency', function(e) {
+        e.preventDefault();
-    $('body').on('click', 'button.btn-delete-competency', function(e) {
-        var id_competency = $(this).data('competency');
+        var uuid = $(this).data('competency');
         bootbox.confirm({
-            title: "LABEL_DELETE LABEL_COMPETENCY",
+             title: 'LABEL_COMPETENCY_DELETE_TITLE',
-            message: "LABEL_QUESTION_DELETE",
+            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);
-                if (result) {
+                    $.fn.renderCompetencies();
+                    $.fn.comboCompetencies();
                     removeCompetency(id_competency);
+                }
+            }
         });
-    });
-    /**
-     * Clicked on edit behavior
+    });
-     */
-    $('body').on('click', 'button.btn-edit-behavior', function(e) {
+    $('body').on('click','button.btn-edit-behavior', function(e) {
+        e.preventDefault();
-        e.preventDefault();
-        var competency_id = $(this).data('competency');
+        var competency_uuid = $(this).closest('div.panel-competency').data('competency');
+        var behavior_uuid = $(this).data('behavior');
-        var behavior_id = $(this).data('behavior');
+        competency_selected = competencies_selected.filter((item) => item.uuid == competency_uuid ? item : false)[0];
-        competencies_selected.map((item) => {
+        if(competency_selected) {
+            console.log(competency_selected);
-            if (item.competency_id == competency_id) {
+            behavior = competency_selected .behaviors.filter((item) => item.uuid  == behavior_uuid ? item : false)[0];
+            if(behavior) {
-                item.behaviors.map((b) => {
-                    if (b.behavior_id == behavior_id) {
+                console.log(behavior);
-                        $('#form-behavior #behavior-id').val(b.behavior_id);
+                $('#form-behavior #competency-uuid').val(competency_uuid);
-                        $('#form-behavior #behavior-competency').val(b.competency_id);
+                $('#form-behavior #behavior-uuid').val(behavior_uuid);
-                        $('#form-behavior #behavior-level').val(b.level);
+                $('#form-behavior #level').val(behavior.level);
-                        $('#modal-behavior h4[class="modal-title"]').html('LABEL_EDIT LABEL_CONDUCT');
-                        $('#modal-behavior').modal('show');
-                        return;
-                    }
-                });
+                $('#modal-behavior').modal('show');
+            }
-            }
         });
     });
-    /**
+    $('body').on('click','button.btn-behavior-submit', function(e) {
-     * Remove Competency
-     */
+         e.preventDefault();
+         $('#modal-behavior').modal('hide');
-    const removeCompetency = (competency_id) => {
-        competencies_selected = competencies_selected.filter((item) => item.competency_id != competency_id);
+         var competency_uuid = $('#form-behavior #competency-uuid').val();
-        return renderData(competencies_selected);
-    }
-    /**
+         var behavior_uuid = $('#form-behavior #behavior-uuid').val();
-     * Edit item Behavior
+         var level = $('#form-behavior #level').val();
-     */
-    const editBehavior = (competency_id, behavior_id, level) => {
+        competency_selected = competencies_selected.filter((item) => item.uuid == competency_uuid ? item : false)[0];
-        competencies_selected.map((item) => {
+        if(competency_selected) {
-            if (item.competency_id == competency_id) {
+            behavior = competency_selected .behaviors.filter((item) => item.uuid  == behavior_uuid ? item : false)[0];
-                item.behaviors.map((opt) => {
-                    if (opt.behavior_id == behavior_id) {
+            if(behavior) {
-                        opt.level = level
-                    }
+                behavior.level = level;
-                });
+                $.fn.renderCompetencies();
-            }
-        });
-        return renderData(competencies_selected);
+            }
-    }
-    /**
-     * Clicked cancel new/edit Form
-     */
-    $('button.btn-behavior-submit').click(function(e) {
-        if ($("#behavior-description").val() == "") {
-            $.fn.showError('ERROR_ENTER_DESCRIPTION');
-            return;
-        } else {
-            editBehavior($("#behavior-competency").val(), $("#behavior-id").val(), $("#behavior-level").val())
-            $('#modal-behavior').modal('hide');
             return;
+        }
+    });
+    $('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'
+    });
+    $('#form #functions').maxlength({
+        alwaysShow: true,
+         validate: true
+    });
+    $('#form #objectives').maxlength({
+        alwaysShow: true,
+        validate: true
+    });
+    $('#form #job_description_id_boss').select2({
+        theme: 'bootstrap4',
         width: '100%',
+    });
     });
     $('#select-subordinate').select2({
         theme: 'bootstrap4',
+        width: '100%',
+    });
         width: '100%',
     });
     $('#select-competency').select2({
+        theme: 'bootstrap4',
-        theme: 'bootstrap4',
-        width: '100%',
-    });
-    /**
-     * Clicked cancel new/edit Form
-     */
-    $('body').on('click', 'button.btn-edit-cancel', function(e) {
+        width: '100%',
-        $('#row-lists').show();
+    });
         $('#row-form').hide();
     });
     <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">
+                        <table id="gridTable" class="table table-hover">
                             <thead>
                                 <tr>
-                                    <th>LABEL_NAME</th>
+                                    <th style="width: 50%">LABEL_NAME</th>
-                                    <th>LABEL_ACTIVE</th>
+                                    <th style="width: 15%">LABEL_ACTIVE</th>
-                                    <th>LABEL_ACTIONS</th>
+                                    <th style="width: 35%">LABEL_ACTIONS</th>
                                 </tr>
                             </thead>
                             <tbody>
                             </tbody>
                         </table>
                         '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);
                     echo $this->form()->openTag($form);
-                    ?>
-                    <input type="hidden" id="subordinates_selected" name="subordinates_selected" value="">
+                    ?>
                     <input type="hidden" id="competencies_selected" name="competencies_selected" value="">
                     <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">
                                     <button type="button" class="btn btn-primary" id="btn-select-competency" data-toggle="tooltip" title="LABEL_ADD LABEL_COMPETENCY">LABEL_ADD LABEL_COMPETENCY</button>
                                 </div>
                             </div>
                             <div class="row">
                                 <br>
-                                <div class="col-md-12 col-sm-12 col-xs-12" id="competencies-job" style="margin-top: 10px;">
+                                <div class="col-md-12 col-sm-12 col-xs-12" id="renderCompetencies" style="margin-top: 10px;">
                                 </div>
                             </div>
                         </div>
                         <div class="tab-pane fade" id="custom-tabs-subordinate" role="tabpanel" aria-labelledby="custom-tabs-subordinate-tab">
                             <div class="row">
                                             <tr>
                                                 <th style="width: 60%;">LABEL_NAME</th>
                                                 <th style="width: 20%;">LABEL_ACTIONS</th>
                                             </tr>
                                         </thead>
-                                        <tbody id="subordinate"></tbody>
+                                        <tbody id="renderSubordinates"></tbody>
                                     </table>
                                 </div>
                             </div>
                         </div>
                     </div>
 <!--start modal behavior-->
 <div id="modal-behavior" class="modal" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" role="document">
         <form action="#" name="form-behavior" id="form-behavior">
-            <input type="hidden" name="behavior-id" id="behavior-id" value="" />
+            <input type="hidden" id="behavior-uuid" name="behavior-uuid" value="" />
-            <input type="hidden" name="behavior-competency" id="behavior-competency" value="" />
+            <input type="hidden" id="competency-uuid" name="competency-uuid value="" />
-            <div class="modal-content">
+         <div class=" modal-content">
-                <div class="modal-header">
+            <div class="modal-header">
-                    <h4 class="modal-title">LABEL_EDIT LABEL_LEVEL</h4>
+                <h4 class="modal-title">LABEL_EDIT LABEL_LEVEL</h4>
-                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                        <span aria-hidden="true">&times;</span>
+                    <span aria-hidden="true">&times;</span>
-                    </button>
+                </button>
-                </div>
+            </div>
-                <div class="modal-body">
+            <div class="modal-body">
-                    <div class="form-group">
+               <div class="form-group">
-                        <label for="behavior-value">LABEL_LEVEL</label>
+                  <label for="behavior-value">LABEL_LEVEL</label>
-                        <select class="form-control" id="behavior-level" name="behavior-level">
-                            <option value="0">LABEL_NA</option>
-                            <option value="1">LABEL_LEVEL_ONE</option>
-                            <option value="2">LABEL_LEVEL_TWO</option>
-                            <option value="3">LABEL_LEVEL_THREE</option>
-                            <option value="4">LABEL_LEVEL_FOUR</option>
-                        </select>
-                    </div>
+                  <input type="number" step="1" min="0" max="100" id="level" name="level">
-                </div>
+            </div>
-                <div class="modal-footer">
+            <div class="modal-footer">
-                    <button type="button" class="btn btn-primary btn-behavior-submit">LABEL_SAVE</button>
+                <button type="button" class="btn btn-primary btn-behavior-submit">LABEL_SAVE</button>
-                    <button type="button" class="btn btn-secondary" data-dismiss="modal">LABEL_CLOSE</button>
-                </div>
+                <button type="button" class="btn btn-secondary" data-dismiss="modal">LABEL_CLOSE</button>
-            </div>
-        </form>
+            </div>
+    </div>
+    </form>
-    </div>
+</div>
-</div>
+</div>
 <!---end modal behavior --->
+<!---Template Competencies --->
+<script id="competencyTemplate" type="text/x-jsrender">
+    <div class="panel panel-default panel-competency" id="panel-{{:uuid}}" data-competency="{{:uuid}}">
+   <div class="panel-heading">
+      <h4 class="panel-title" style="    font-size: 18px;">
+         <a class="accordion-toggle" data-toggle="collapse" aria-expanded="true" data-parent="#panel-{{:uuid}}" href="#collapse-{{:uuid}}">
+         <span class="section-name{{:uuid}}">
+            {{:~getCompetencyType(competency_type_uuid).name}} - {{:~getCompetency(uuid).name}}
+         </span>
+         </a>
+      </h4>
+   </div>
+   <div id="collapse-{{:uuid}}" class="panel-collapse in collapse show">
+      <div class="panel-body">
+         <div class="table-responsive">
+            <table class="table table-bordered">
+               <thead>
+                  <tr>
+                     <th style="width: 20%;">LABEL_ELEMENT</th>
+                     <th style="width: 50%;">LABEL_TITLE</th>
+                     <th style="width: 10%;">LABEL_LEVEL</th>
+                     <th style="width: 20%;">LABEL_ACTIONS</th>
+                  </tr>
+               </thead>
+               <tbody>
+                  <tr>
+                     <td class="text-left">LABEL_COMPETENCY</td>
+                     <td class="text-left">{{:name}}</td>
+                     <td>
-<!---Template Competencies --->
+                     </td>
+                     <td>
+                        <button  type="button" class="btn btn-default btn-delete-competency" data-competency="{{:uuid}}" data-toggle="tooltip"  data-original-title="LABEL_DELETE LABEL_COMPETENCY"><i class="fa fa-ban" aria-hidden="true"></i> LABEL_DELETE LABEL_COMPETENCY </button>
+                     </td>
+                  </tr>
+                  {{for behaviors}}
+                  <tr >
+                     <td class="text-left">--LABEL_BEHAVIOR</td>
+                     <td class="text-left">
+                       {{:~getBehavior(uuid).description}}
+                     </td>
+                     <td class="text-right">
+                        {{:level}}
+                     </td>
+                     <td>
+                        <button type="button"  class="btn btn-default btn-edit-behavior" data-behavior="{{:uuid}}" data-toggle="tooltip"  data-original-title="LABEL_EDIT LABEL_LEVEL"><i class="fa fa-edit" aria-hidden="true"></i> LABEL_EDIT LABEL_LEVEL</button>
+                     </td>
+                  </tr>
+                  {{/for}}
+               </tbody>
+            </table>
+         </div>
+      </div>
+   </div>
+</div>
+</script>
-<script id="sectionTemplate" type="text/x-jsrender">
+<script id="competencyTemplateWithLevel" type="text/x-jsrender">
-    <div class="panel panel-default" id="panel-{{:competency_id}}">
+ <div class="panel panel-default panel-competency" id="panel-{{:uuid}}" data-competency="{{:uuid}}">
    <div class="panel-heading">
       <h4 class="panel-title" style="    font-size: 18px;">
-         <a class="accordion-toggle" data-toggle="collapse" aria-expanded="true" data-parent="#panel-{{:competency_id}}" href="#collapse-{{:competency_id}}">
+         <a class="accordion-toggle" data-toggle="collapse" aria-expanded="true" data-parent="#panel-{{:uuid}}" href="#collapse-{{:uuid}}">
-         <span class="section-name{{:competency_id}}">
+         <span class="section-name{{:uuid}}">
-         {{:~getType(competency_type_id).name}} - {{:name}}
+            {{:~getCompetencyType(competency_type_uuid).name}} - {{:~getCompetency(uuid).name}}
          </span>
          </a>
       </h4>
    </div>
-   <div id="collapse-{{:competency_id}}" class="panel-collapse in collapse show">
+   <div id="collapse-{{:uuid}}" class="panel-collapse in collapse show">
       <div class="panel-body">
          <div class="table-responsive">
             <table class="table table-bordered">
                      <td class="text-left">LABEL_COMPETENCY</td>
                      <td class="text-left">{{:name}}</td>
                      <td>
                      </td>
                      <td>
-                        <button  type="button" class="btn btn-default btn-delete-competency" data-competency="{{:competency_id}}" data-toggle="tooltip"  data-original-title="LABEL_DELETE LABEL_COMPETENCY"><i class="fa fa-ban" aria-hidden="true"></i> LABEL_DELETE LABEL_COMPETENCY </button>
+                        <button  type="button" class="btn btn-default btn-delete-competency" data-competency="{{:uuid}}" data-toggle="tooltip"  data-original-title="LABEL_DELETE LABEL_COMPETENCY"><i class="fa fa-ban" aria-hidden="true"></i> LABEL_DELETE LABEL_COMPETENCY </button>
                      </td>
                   </tr>
                   {{for behaviors}}
                   <tr >
-                     <td class="text-left">--LABEL_CONDUCT</td>
+                     <td class="text-left">--LABEL_BEHAVIOR</td>
                      <td class="text-left">
-                        {{:description}}
+                       {{:~getBehavior(uuid).description}}
                      </td>
                      <td>
                         {{if level == '0'}} LABEL_NA {{/if}}
                         {{if level == '1' }} LABEL_LEVEL_ONE {{/if}}
                         {{if level == '2' }} LABEL_LEVEL_TWO {{/if}}
                         {{if level == '3' }} LABEL_LEVEL_THREE {{/if}}
                         {{if level == '4' }} LABEL_LEVEL_FOUR {{/if}}
                      </td>
                      <td>
-                        <button type="button"  class="btn btn-default btn-edit-behavior" data-competency="{{:competency_id}}" data-behavior="{{:behavior_id}}" data-toggle="tooltip"  data-original-title="LABEL_EDIT LABEL_LEVEL"><i class="fa fa-edit" aria-hidden="true"></i> LABEL_EDIT LABEL_LEVEL</button>
+                        <button type="button"  class="btn btn-default btn-edit-behavior" data-behavior="{{:uuid}}" data-toggle="tooltip"  data-original-title="LABEL_EDIT LABEL_LEVEL"><i class="fa fa-edit" aria-hidden="true"></i> LABEL_EDIT LABEL_LEVEL</button>
                      </td>
                   </tr>
                   {{/for}}
                </tbody>
             </table>
          </div>
       </div>
    </div>
 </div>
-   </script>
+</script>
-<script id="sectionJob" type="text/x-jsrender">
+<script id="subordinateTemplate" type="text/x-jsrender">
     <tr>
-   <td class="text-left">{{:name}}</td>
+        <td class="text-left"> {{:~getSubordinate(uuid).name}}</td>
-   <td>
+        <td>
-      <button type="button" class="btn btn-default btn-delete-subordinate" data-subordinate="{{:job_description_id}}" data-toggle="tooltip"  data-original-title="LABEL_DELETE"><i class="fa fa-ban" aria-hidden="true"></i> LABEL_DELETE</button>
+            <button type="button" class="btn btn-default btn-delete-subordinate" data-subordinate="{{:uuid}}" data-toggle="tooltip"  data-original-title="LABEL_DELETE"><i class="fa fa-ban" aria-hidden="true"></i> LABEL_DELETE</button>
-   </td>
+        </td>
-</tr>
+    </tr>
     </script>

Proyectos de Subversion LeadersLinked - Backend

(root)/module/LeadersLinked/view/leaders-linked/jobs-description/index_jquery.phtml – Rev 15431 → 15443