WebSVN – LeadersLinked - Antes de SPA – Diff – /module/LeadersLinked/view/leaders-linked/knowledge-area/index.phtml

 <?php
 $acl            = $this->viewModel()->getRoot()->getVariable('acl');
 $currentUser    = $this->currentUserHelper();
 $roleName       = $currentUser->getUserTypeId();
+$routeAdd = $this->url('knowledge-area/add');
+$allowAdd       = $acl->isAllowed($roleName, 'knowledge-area/add') ? 1 : 0;
+$route    = $this->url('knowledge-area');
+$this->inlineScript()->appendFile($this->basePath('vendors/ckeditor/ckeditor.js'));
+$this->headLink()->appendStylesheet($this->basePath('vendors/nprogress/nprogress.css'));
-$routeMyConnections    = $this->url('connection/my-connections');
+$this->inlineScript()->appendFile($this->basePath('vendors/nprogress/nprogress.js'));
-$this->headLink()->appendStylesheet($this->basePath('vendors/select2/dist/css/select2.min.css'));
+$this->headLink()->appendStylesheet($this->basePath('vendors/select2/css/select2.min.css'));
-$this->headLink()->appendStylesheet($this->basePath('vendors/select2-bootstrap4/dist/select2-bootstrap4.min.css'));
+$this->headLink()->appendStylesheet($this->basePath('vendors/select2-bootstrap4-theme/select2-bootstrap4.min.css'));
+$this->inlineScript()->appendFile($this->basePath('vendors/select2/js/select2.min.js'));
+$this->inlineScript()->appendFile($this->basePath('vendors/bootstrap-confirmation/dist/bootstrap-confirmation.js'));
+$this->inlineScript()->appendFile($this->basePath('vendors/jsrender/jsrender.min.js'));
+$this->headLink()->appendStylesheet($this->basePath('vendors/bootstrap-fileinput/css/fileinput.min.css'));
+$this->headLink()->appendStylesheet($this->basePath('vendors/bootstrap-fileinput/themes/explorer-fa/theme.css'));
+$this->inlineScript()->appendFile($this->basePath('vendors/bootstrap-fileinput/js/plugins/piexif.js'));
+$this->inlineScript()->appendFile($this->basePath('vendors/bootstrap-fileinput/js/plugins/sortable.js'));
+$this->inlineScript()->appendFile($this->basePath('vendors/bootstrap-fileinput/js/fileinput.js'));
+$this->inlineScript()->appendFile($this->basePath('vendors/bootstrap-fileinput/js/locales/es.js'));
+$this->inlineScript()->appendFile($this->basePath('vendors/bootstrap-fileinput/themes/fa/theme.js'));
+$this->inlineScript()->appendFile($this->basePath('vendors/bootstrap-fileinput/themes/explorer-fa/theme.js'));
+$this->inlineScript()->appendFile($this->basePath('vendors/jquery-validation/jquery.validate.js'));
-$this->inlineScript()->appendFile($this->basePath('vendors/select2/dist/js/select2.min.js'));
+$this->inlineScript()->appendFile($this->basePath('vendors/jquery-validation/additional-methods.js'));
 $this->inlineScript()->appendFile($this->basePath('vendors/jquery-validation/localization/messages_es.js'));
 $this->inlineScript()->appendFile($this->basePath('vendors/bootstrap-confirmation/dist/bootstrap-confirmation.js'));
-$this->inlineScript()->appendFile($this->basePath('vendors/jsrender/jsrender.min.js'));
-$this->inlineScript()->captureStart();
-echo <<<JS
-jQuery( document ).ready(function( $ ) {
+$this->inlineScript()->captureStart();
 echo <<<JS
     $('body').on('click', 'a.btn-send-message', function(e) {
         e.preventDefault();
-        window.location.href = $(this).data('link');
+jQuery( document ).ready(function( $ ) {
-    })
+    $.fn.reload = function() {
         NProgress.start();
-    $.fn.reload = function(search) {
+        $.ajax({
-        NProgress.start();
+            'dataType'  : 'json',
-        $.ajax({
+            'accept'    : 'application/json',
+            'method'    : 'get',
+            'url'       :  '$route',
-            'dataType'  : 'json',
+            'data'      : {
+                'search' : $('#form-filter #search').val(),
+                'category_id' : $('li.knowledge-category-li-selected > a.knowledge-category-a').data('uuid') ,
-            'accept'    : 'application/json',
+            }
-            'method'    : 'get',
+        }).done(function(response) {
-            'url'       :  '$routeMyConnections',
+            if(response['success']) {
-            'data'      : {
+                $('#knowledge-record-list').empty();
                 'search' : search
-            }
-        }).done(function(response) {
+                if(response['data']['items'].length > 0) {
-            if(response['success']) {
-                $('#profiles-container').empty();
-                if(response['data'].length > 0) {
-                    $( "#profiles-container" ).html(
-                		$( "#profileTemplate" ).render( response['data'] )
-                	);
-                } else {
-                    var html = '<div class="company-title"><div class="widget widget-jobs"><div class="sd-title">ERROR_NO_RECORD_MATCHED_YOUR_QUERY</div></div></div>';
-                    $( "#profiles-container" ).html(html);
-                }
-                $('a.btn-connection-cancel').confirmation({
-                    rootSelector: 'button.btn-connection-cancel',
-                    title : 'LABEL_ARE_YOU_SURE',
-                    singleton : true,
-                    btnOkLabel: 'LABEL_YES',
-                    btnCancelLabel: 'LABEL_NO',
-                    onConfirm: function(value) {
-                        var action = $(this).data('link');
-                        NProgress.start();
-                        $.ajax({
-                            'dataType'  : 'json',
-                            'accept'    : 'application/json',
-                            'method'    : 'post',
-                            'url'       :  action,
-                        }).done(function(response) {
-                            if(response['success']) {
-                                $.fn.showSuccess(response['data']);
-                                var search = $('#form-connection-search #search').val().trim()
-                                $.fn.reload(search);
-                            } else {
-                                $.fn.showError(response['data']);
-                            }
                         }).fail(function( jqXHR, textStatus, errorThrown) {
-                            $.fn.showError(textStatus);
+                    $( "#knowledge-record-list" ).html(
-                        }).always(function() {
+                		$( "#recordTemplate" ).render( response['data']['items'] )
-                            NProgress.done();
+                	);
-                        });
+                } else {
                             'url'       :  action,
                         }).done(function(response) {
                             if(response['success']) {
                                 $.fn.showSuccess(response['data']);
-                                var search = $('#form-connection-search #search').val().trim()
-                                $.fn.reload(search);
+                                $.fn.reload();
                             } else {
                                 $.fn.showError(response['data']);
+                            }
                         }).fail(function( jqXHR, textStatus, errorThrown) {
             $.fn.reload('');
+        }
+    });
+    $.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('.btn-file').length) {
+                error.insertAfter(element.parent().parent());
+            } 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(element.parent('.btn-file').length) {
+                error.insertAfter(element.parent().parent());
+            } else if(element.parent('.toggle').length) {
+                error.insertAfter(element.parent().parent());
+            } else {
+                error.insertAfter(element.parent());
+            }
+        }
+    };
+    var validatorAdd = $('#form-add').validate({
+        debug: true,
+        onclick: false,
+        onkeyup: false,
+        ignore: [],
+        rules: {
+            'category_id': {
+                required: true,
+            },
+            'title': {
+                required: true,
+                maxlength: 128,
+            },
+            'description': {
+                updateCkeditor:function() {
+                        CKEDITOR.instances.description_add.updateElement();
+                },
+                required: true
+            },
+           'image': {
+                required: true,
+                extension: 'jpg|jpeg|png',
+                accept: 'image/jpg,image/jpeg,image/png'
+            },
+            'attachment': {
+                required: false,
+                extension: 'pdf|wav|mp3|webm,mp4,webm',
+                accept: 'application/pdf, audio/wav, audio/mpeg, video/webm,video/mpeg,video/mp4'
+            },
+            'link': {
+                required: false,
+                maxlength: 250,
+                url: true,
+            },
+        },
+        submitHandler: function(form)
+        {
+            var formdata = false;
+            if (window.FormData){
+                formdata = new FormData(form); //form[0]);
+            }
+			NProgress.start();
+            $.ajax({
+                'dataType'  : 'json',
+                'accept'    : 'application/json',
+                'method'    : 'post',
+                'url'       :  '$routeAdd',
+                'data'      :  formdata,
+                'processData': false,
+                'contentType': false,
+            }).done(function(response) {
+				console.log(response)
+				if(response['success']) {
+                    $.fn.showSuccess(response['data']);
+                    $.fn.reload();
+                    $('#row-add').hide();
+                    $('#row-list').show();
+                } else {
+                    validatorAdd.resetForm();
+                    if(jQuery.type(response['data']) == 'string') {
+                        $.fn.showError(response['data']);
+                    } else  {
+                        $.each(response['data'], function( fieldname, errors ) {
+                            $.fn.showFormErrorValidator('#form-add #' + fieldname, errors);
+                        });
+                    }
+                }
+            }).fail(function( jqXHR, textStatus, errorThrown) {
+                $.fn.showError(textStatus);
+            }).always(function() {
+                NProgress.done();
+            });
+            return false;
+        },
+        invalidHandler: function(form, validator) {
+        }
+    });
+    var validatorEdit = $('#form-edit').validate({
+        debug: true,
+        onclick: false,
+        onkeyup: false,
+        ignore: [],
+        rules: {
+            'category_id': {
+                required: true,
+            },
+            'title': {
+                required: true,
+                maxlength: 128,
+            },
+            'description': {
+                updateCkeditor:function() {
+                        CKEDITOR.instances.description_edit.updateElement();
+                },
+                required: true
+            },
+           'image': {
+                required: false,
+                extension: 'jpg|jpeg|png',
+                accept: 'image/jpg,image/jpeg,image/png'
+            },
+            'attachment': {
+                required: false,
+                extension: 'pdf|wav|mp3|webm,mp4,webm',
+                accept: 'application/pdf, audio/wav, audio/mpeg, video/webm,video/mpeg,video/mp4'
+            },
+            'link': {
+                required: false,
+                maxlength: 250,
+                url: true,
+            },
+        },
+        submitHandler: function(form)
+        {
+            var formdata = false;
+            if (window.FormData){
+                formdata = new FormData(form); //form[0]);
+            }
+			NProgress.start();
+            $.ajax({
+                'dataType'  : 'json',
+                'accept'    : 'application/json',
+                'method'    : 'post',
+                'url'       :  $('#form-edit').attr('action'),
+                'data'      :  formdata,
+                'processData': false,
+                'contentType': false,
+            }).done(function(response) {
+				console.log(response)
+				if(response['success']) {
+                    $.fn.showSuccess(response['data']);
+                    $.fn.reload();
+                    $('#row-edit').hide();
+                    $('#row-list').show();
+                } else {
+                    validatorAdd.resetForm();
+                    if(jQuery.type(response['data']) == 'string') {
+                        $.fn.showError(response['data']);
+                    } else  {
+                        $.each(response['data'], function( fieldname, errors ) {
+                            $.fn.showFormErrorValidator('#form-edit #' + fieldname, errors);
+                        });
+                    }
+                }
+            }).fail(function( jqXHR, textStatus, errorThrown) {
+                $.fn.showError(textStatus);
+            }).always(function() {
+                NProgress.done();
+            });
+            return false;
+        },
+        invalidHandler: function(form, validator) {
-    });
+        }
     });
+    $('a.knowledge-category-a').click(function(e) {
-    $('body').on('click', 'a.btn-profile-view', function(e) {
+        e.preventDefault();
+        $('li.knowledge-category-li').removeClass('knowledge-category-li-selected');
-        e.preventDefault();
+        $(this).closest('li.knowledge-category-li').addClass('knowledge-category-li-selected');
+        $.fn.reload();
-        window.location.href = $(this).data('link');
-    });
+    });
-    $.fn.reload('');
-});
-JS;
-$this->inlineScript()->captureEnd();
+    $('#form-filter #search').keyup(function(e) {
-$this->headStyle()->captureStart();
-echo <<<EOT
-.profile_info {
-    width: 100%;
-    padding: 25px 20px;
-    border: 1px solid var(--border-primary);
-    background-color: var(--bg-color);
+        e.preventDefault();
-    text-align: center;
-    border-radius: 10px
-}
-.profile_info h3 {
-    justify-content: flex-start;
+        $.fn.reload();
-    font-weight: 700;
+    })
-    font-size: 1.3rem;
+    $('button.btn-search').click(function(e) {
-    text-align: left
+        e.preventDefault();
+        $.fn.reload();
+    });
-}
+    $('body').on('click', 'button.btn-knowledge-edit', function(e) {
-.profile_info h4 {
-    position: absolute;
+        e.preventDefault();
-    bottom: 0
+        var action = $(this).data('link');
-}
+        NProgress.start();
+        $.ajax({
+            'dataType'  : 'json',
+            'accept'    : 'application/json',
+            'method'    : 'get',
+            'url'       :  action,
+        }).done(function(response) {
+            if(response['success']) {
+                $('#form-edit').attr('action', action);
+                $('#form-edit #category_id').val(response['data']['category_id']).trigger('change');
+                $('#form-edit #title').val(response['data']['title']);
+                $('#form-edit #link').val(response['data']['link']);
-.profile_info ul {
+                CKEDITOR.instances.description_edit.setData(response['data']['description']);
+                $('#form-edit #image').fileinput('reset');
+                $('#form-edit #image').val('');
-    display: flex;
+                $('#form-edit #attachment').fileinput('reset');
-    gap: 5px;
+                $('#form-edt #attachment').val('');
-    justify-content: space-around
-}
-.profile_info hr {
-    width: 80%;
-    margin: 1rem auto
-}
-.profile_info_header {
-    display: flex;
-    position: relative
-}
-.profile_info_header_imgContainer {
-    overflow: hidden;
-    border-radius: 100px;
+                $('#row-list').hide();
-    margin: 0 auto
-}
+                $('#row-edit').show();
-.profile_info_header_imgContainer img {
-    background: #fff
-}
-.profile-info {
-    background: var(--bg-color);
-    border: 1px solid var(--border-primary);
+            } else {
-    border-radius: var(--border-radius);
-    height: fit-content;
+                $.fn.showError(response['data']);
-    box-shadow: var(--light-shadow);
-    width: 100%;
-    align-items: center;
-    display: flex;
-    flex-direction: column;
-    gap: .5rem;
-    padding: 1rem;
-    text-align: center
-}
+            }
+        }).fail(function( jqXHR, textStatus, errorThrown) {
-@media(max-width: 767px) {
+            $.fn.showError(textStatus);
-    .profile-info {
-        border-radius:0;
-        border-left: 0;
+        }).always(function() {
-        border-right: 0
+            NProgress.done();
-    }
-}
-.profile-info img {
+        });
-    border-radius: 50%;
-    border: 2px solid var(--font-color);
-    height: 150px;
+    });
-    width: 150px
-}
+    $('body').on('click', 'button.btn-knowledge-open-attachment', function(e) {
+        e.preventDefault();
-.profile-info h3 {
+        var action = $(this).data('link');
-    color: var(--title-color);
+        window.open(action)
-    font-size: 1.1rem;
-    font-weight: 600
-}
-.profile-info span {
-    color: var(--subtitle-color)
+    });
-}
-.profile-info svg,.profile-info b {
+    $('body').on('click', 'button.btn-knowledge-open-link', function(e) {
-    color: var(--font-color)
-}
+        e.preventDefault();
-.profile-info .row {
-    gap: .5rem
-}
+        var action = $(this).data('link');
+        window.open(action)
-.profile-info .social-network-header {
+    });
-    display: flex;
-    align-items: center;
+    $('a.knowledge-add-a').click(function(e) {
-    justify-content: center;
+        e.preventDefault();
-    position: relative;
+        $('#form-add #title').val('');
+        $('#form-add #link').val('');
+        CKEDITOR.instances.description_add.setData('');
-    width: 100%
+        $('#form-add #image').fileinput('reset');
-}
+        $('#form-add #image').val('');
+        $('#form-add #attachment').fileinput('reset');
+        $('#form-add #attachment').val('');
+        $('#row-list').hide();
+        $('#row-add').show();
+    });
-.profile-info .social-network-header button {
-    position: absolute;
-    right: 15%
-}
+    $('button.btn-cancel').click(function(e) {
+        e.preventDefault();
-.profile-info .social-network-header button svg {
-    font-size: 1.2rem
-}
-.profile-info .social-links {
-    display: flex;
-    flex-direction: column;
-    gap: .5rem;
-    width: 100%
-}
-.profile-info .social-links li {
-    border-bottom: 1px solid var(--border-primary)
-}
-.profile-info .social-links li a {
-    display: flex;
-    align-items: center;
-    gap: .5rem
-}
-.profile-info .social-links li a svg {
+        $('#row-add').hide();
+        $('#row-edit').hide();
+        $('#row-list').show();
+    });
-    color: var(--font-color)
+    $('#form-add #image').fileinput({
+        theme: 'fa',
-}
+        language: 'es',
+        showUpload: false,
+        dropZoneEnabled: false,
-.profile-info .social-links li a span {
+        maxFileCount: 1,
-    white-space: nowrap;
+        allowedFileExtensions: ['jpg', 'jpeg', 'png'],
+        msgPlaceholder: 'LABEL_RECOMMENDED_SIZE $image_size',
-    max-width: -webkit-fill-available;
+    });
+    $('#form-add #attachment').fileinput({
-    text-overflow: ellipsis;
+        theme: 'fa',
-    overflow: hidden
-}
+        language: 'es',
+        showUpload: false,
-.profile-attr {
+        dropZoneEnabled: false,
-    background: var(--bg-color);
-    border: 1px solid var(--border-primary);
-    border-radius: var(--border-radius);
-    height: fit-content;
-    box-shadow: var(--light-shadow);
-    width: 100%;
-    padding: 1rem;
-    display: flex;
-    flex-direction: column;
-    gap: .5rem
+        maxFileCount: 1,
-}
+        allowedFileExtensions: ['jpg', 'jpeg', 'png', 'pdf', 'wav', 'mp3', 'mp4', 'mpeg','webm'],
+        msgPlaceholder: 'LABEL_EXTENSIONS_ALLOWED jpg, jpeg, png, pdf, wav, mp3, mp4, mpeg, webm',
+    });
+    $('#form-add #category_id').select2({
+        theme: 'bootstrap4',
+    });
+    $('#form-edit #image').fileinput({
-@media(max-width: 767px) {
+        theme: 'fa',
-    .profile-attr {
+        language: 'es',
+        showUpload: false,
-        border-radius:0;
+        dropZoneEnabled: false,
+        maxFileCount: 1,
+        allowedFileExtensions: ['jpg', 'jpeg', 'png'],
+        msgPlaceholder: 'LABEL_RECOMMENDED_SIZE $image_size',
+    });
-        border-left: 0;
+    $('#form-edit #attachment').fileinput({
+        theme: 'fa',
+        language: 'es',
-        border-right: 0
+        showUpload: false,
+        dropZoneEnabled: false,
-    }
+        maxFileCount: 1,
-}
+        allowedFileExtensions: ['jpg', 'jpeg', 'png', 'pdf', 'wav', 'mp3', 'mp4', 'mpeg','webm'],
-.profile-attr span,.profile-attr p {
-    color: var(--font-color)
-}
+        msgPlaceholder: 'LABEL_EXTENSIONS_ALLOWED jpg, jpeg, png, pdf, wav, mp3, mp4, mpeg, webm',
-.profile-attr ul {
-    display: flex;
-    flex-wrap: wrap;
-    gap: .5rem
-}
-.profile-attr ul li {
+    });
-    display: inline-flex;
-    width: fit-content
+    $('#form-edit #category_id').select2({
-}
-.profile-attr ul li span {
-    background-color: var(--font-color);
-    border-radius: 30px;
-    color: var(--bg-color);
-    font-size: 14px;
-    font-weight: 600;
-    padding: .5rem 1rem;
+        theme: 'bootstrap4',
-    width: fit-content
-}
-.profile-attr-header {
+    });
-    display: flex;
-    align-items: center;
-    justify-content: space-between
+    CKEDITOR.replace('description_add', {
         toolbar: [
                     { name: 'editing', items: ['Scayt'] },
-.profile-attr-header h2 {
+                    { name: 'links', items: ['Link', 'Unlink'] },
-    color: var(--title-color);
+                    { name: 'paragraph', items: ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', 'Blockquote'] },
-    font-size: 18px;
+                    { name: 'basicstyles', items: ['Bold', 'Italic', 'Strike', 'RemoveFormat'] },
-    font-weight: 600
+                    '/',
-}
+                    { name: 'insert', items: ['Image', 'Table', 'HorizontalRule', 'SpecialChar'] },
                     { name: 'styles', items: ['Styles', 'Format'] },
-.experience-item,.education-item {
+                    { name: 'tools', items: ['Maximize'] }
-    display: flex;
+                ],
-    flex-direction: column;
+                removePlugins: 'elementspath,Anchor',
-    gap: .5rem
+                heigth: 100
     color: #16283C;
     margin-top: 10px;
+}
+.knowledge-category-li-selected {
+    background-color: var(--bg-color-secondary);
 }
-.add-knowledge-container {
+.knowledge-add-container {
     padding-top: 10px;
     padding-bottom: 10px;
     text-align: center;
+}
+.knowledge-add-a {
+    font-family: 'Roboto';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 16px;
+    line-height: 19px;
+    color: #666666;
+}
+.knowledge-record-card {
+    width: 100%;
+    padding: 25px 20px;
+    border: 1px solid var(--border-primary);
+    background-color: var(--bg-color);
+    text-align: center;
+    border-radius: 10px;
+}
-.add-knowledge {
+.knowledge-record-card-category {
     font-family: 'Roboto';
     font-style: normal;
+    font-weight: 400;
+    font-size: 16px;
+    line-height: 19px;
+    display: flex;
+    align-items: center;
+    color: #666666;
+    margin-top: 3px;
+}
+.knowledge-record-card-title {
+    font-family: 'Roboto';
+    font-style: normal;
+    font-weight: 800;
+    font-size: 16px;
+    line-height: 19px;
+    /* identical to box height */
+    display: flex;
+    align-items: center;
+    color: #666666;
+    margin-top: 3px;
+}
+.knowledge-record-card-description {
+    font-family: 'Roboto';
+    font-style: normal;
+    font-weight: 400;
-    font-weight: 400;
+    font-size: 14px;
+    line-height: 16px;
+    text-align: justify;
+    text-justify: inter-word;
+    color: #666666;
+    margin-top: 3px;
+}
+.knowledge-record-card-image  img {
+    width: 100%;
+    height: auto;
+}
+.knowledge-record-card-actions {
+    line-height: 20px;
+}
-    font-size: 16px;
+.knowledge-record-card-actions-edit {
-    line-height: 19px;
+  float: left;
+}
 <section class="companies-info container">
 	<div class="company-title">
 		<h1 class="title mx-auto">LABEL_KNOWLEDGE_AREA_TITLE</h1>
 	</div>
-	<div class="row">
+	<div class="row" id="row-list">
-		<div class="col-3 category_list">
+		<div class="col-3 knowledge-category-list">
+			<ul>
+				<li class="knowledge-category-li knowledge-category-li-selected" >
+					<a  class="knowledge-category-a" href="" data-uuid="">LABEL_KNOWLEDGE_AREA_CATEGORY_ALL</a>
-			<ul>
+				</li>
-			<?php
+    			<?php
-			 foreach($categories as $categorie) :
+    			 foreach($categories as $categorie) :
+    			?>
-			?>
+    			<li class="knowledge-category-li" >
+    				<a class="knowledge-category-a" href="" data-uuid="<?php echo $categorie['uuid']?>"><?php echo $categorie['name']?></a>
-			<li><a class="category_uuid" href="" data-uuid="<?php echo $categorie['uuid']?>"><?php echo $categorie['name']?></a></li>
+    			</li>
-			<?php endforeach; ?>
+    			<?php endforeach; ?>
 			</ul>
 		</div>
+		<div class="col-9">
+			<div class="search-box">
-		<div class="col-9">
+				<form id="form-filter" name="form-filter">
+        			<input type="text" name="search"  id="search" class="form-control"><button class="btn btn-search">LABEL_SEARCH</button>
+        		</form>
-			<div class="search-box">
+        	</div>
-        		<input type="text" name="search" class="form-control"><button class="btn btn-search">LABEL_SEARCH</button>
-        	</div>
+        	<?php if($content_edit && $allowAdd) : ?>
-			<div class="add-knowledge-container" >
-				<a href="" class="add-knowledge">Añadir Conocimiento</a>
+			<div class="knowledge-add-container" >
-			</div>
+				<a href="" id="knowledge-add-a" class="knowledge-add-a"> LABEL_KNOWLEDGE_AREA_ADD </a>
+			</div>
+			<?php endif; ?>
+			<div id="knowledge-record-list">
+			</div>
+			<div id="knowledge-record-pagination">
+			</div>
+		</div>
+	</div>
+	<div class="row" id="row-add" style="display: none">
+		<div class="col-12">
+			<div class="card">
+				 <?php
+                $form = $this->formAdd;
+                $form->setAttributes([
+                    'method'    => 'post',
+                    'name'      => 'form-add',
+                    'id'        => 'form-add',
+                    //'action'    => $routeAdd,
+                ]);
+                $form->prepare();
+                echo $this->form()->openTag($form);
+                ?>
+                <div class="card-header">
+                    <h4 class="modal-title">LABEL_ADD</h4>
+                    <button type="button" class="close" data-dismiss="modal">&times;</button>
+                </div>
+                <!-- Modal body -->
+                <div class="card-body">
+                    <div class="form-group">
+                        <?php
+                        $element = $form->get('category_id');
+                        $element->setOptions(['label' => 'LABEL_CATEGORY']);
+                        $element->setAttributes(['class' => 'form-control']);
+                        echo $this->formLabel($element);
+                        echo $this->formSelect($element);
+                        ?>
+                    </div>
+                  	<div class="form-group">
+                        <?php
+                        $element = $form->get('title');
+                        $element->setOptions(['label' => 'LABEL_TITLE']);
+                        $element->setAttributes(['class' => 'form-control']);
+                        echo $this->formLabel($element);
+                        echo $this->formText($element);
+                        ?>
+                    </div>
+                  	<div class="form-group">
+                        <?php
+                        $element = $form->get('description');
+                        $element->setOptions(['label' => 'LABEL_DESCRIPTION']);
+                        $element->setAttributes(['class' => 'form-control', 'id' => 'description_add']);
+                        echo $this->formLabel($element);
+                        echo $this->formTextArea($element);
+                        ?>
+                    </div>
+                  	<div class="form-group">
+                        <?php
+                        $element = $form->get('image');
+                        $element->setOptions(['label' => 'LABEL_IMAGE']);
+                        $element->setAttributes(['class' => 'form-control']);
+                        echo $this->formLabel($element);
+                        echo $this->formFile($element);
+                        ?>
+                    </div>
+                  	<div class="form-group">
+                        <?php
+                        $element = $form->get('attachment');
+                        $element->setOptions(['label' => 'LABEL_ATTACHMENT']);
+                        $element->setAttributes(['class' => 'form-control']);
+                        echo $this->formLabel($element);
+                        echo $this->formFile($element);
+                        ?>
+                    </div>
+                 	<div class="form-group">
+                        <?php
+                        $element = $form->get('link');
+                        $element->setOptions(['label' => 'LABEL_LINK']);
+                        $element->setAttributes(['class' => 'form-control']);
-			<div class="companies-list">
-				<div class="profile_info"><div class="d-flex position-relative"><div class="profile_info_header_imgContainer"><img src="/storage/type/user/code/a0a8330e-1d4c-4f7c-aa85-f95186b5b597/" class="object-fit-contain" alt="group image" style="max-height: 100px;"></div><div class="col-8 d-flex flex-column align-items-start justify-content-end"><h3 class="w-100 text-left mb-2 w-100">Agustín Coronado</h3><ul><li><a href="/profile/view/a0a8330e-1d4c-4f7c-aa85-f95186b5b597" data-link="/profile/view/a0a8330e-1d4c-4f7c-aa85-f95186b5b597" class="btn btn-secondary ellipsis">Ver perfil</a></li><li><a href="/inmail/a0a8330e-1d4c-4f7c-aa85-f95186b5b597" data-link="/inmail/a0a8330e-1d4c-4f7c-aa85-f95186b5b597" class="btn btn-primary">Mensaje</a></li></ul></div></div><hr><ul><li><a href="#" class="btn btn-tertiary">Bloquear</a></li><li><a href="#" class="btn btn-tertiary">Cancelar</a></li></ul><div style="position: relative;"><div class="popover confirmation fade bs-popover-top show" id="confirmation937427" x-placement="top" style="position: absolute; top: -2.5rem; left: 50%; transform: translate(-50%, -100%); width: 120px; display: none;"><div class="arrow" style="left: 46px;"></div><p class="popover-header">Está seguro?</p><div class="popover-body"><p class="confirmation-content" style="display: none;"></p><div class="confirmation-buttons text-center"><div class="btn-group"><button type="button" class="h-100 d-flex align-items-center btn btn-sm btn-primary">Si</button><button type="button" class="h-100 d-flex align-items-center btn btn-sm btn-secondary">No</button></div></div></div></div></div><div style="position: relative;"><div class="popover confirmation fade bs-popover-top show" id="confirmation937427" x-placement="top" style="position: absolute; top: -2.5rem; left: 50%; transform: translate(-50%, -100%); width: 120px; display: none;"><div class="arrow" style="left: 46px;"></div><p class="popover-header">Está seguro?</p><div class="popover-body"><p class="confirmation-content" style="display: none;"></p><div class="confirmation-buttons text-center"><div class="btn-group"><button type="button" class="h-100 d-flex align-items-center btn btn-sm btn-primary">Si</button><button type="button" class="h-100 d-flex align-items-center btn btn-sm btn-secondary">No</button></div></div></div></div></div></div>
-			</div>
-		</div>
-	</div>
-</section>
-<script id="profileTemplate" type="text/x-jsrender">
     <div class="col-lg-3 col-md-3 col-sm-6">
+                        echo $this->formLabel($element);
+                        echo $this->formText($element);
+                        ?>
+                    </div>
+                </div>
+                <div class="card-footer">
+                		<button type="submit" class="btn btn-primary">LABEL_SAVE</button>
+                        <button type="button" class="btn btn-light btn-cancel">LABEL_CANCEL</button>
+                </div>
+    			<?php echo $this->form()->closeTag($form); ?>
+            </div>
+        </div>
+    </div>
+	<div class="row" id="row-edit" style="display: none">
+		<div class="col-12">
+			<div class="card">
+				 <?php
+                $form = $this->formEdit;
+                $form->setAttributes([
+                    'method'    => 'post',
+                    'name'      => 'form-edit',
+                    'id'        => 'form-edit',
-        <div class="company_profile_info">
+                    //'action'    => $routeAdd,
+                ]);
+                $form->prepare();
+                echo $this->form()->openTag($form);
+                ?>
+                <div class="card-header">
+                    <h4 class="modal-title">LABEL_EDIT</h4>
+                    <button type="button" class="close" data-dismiss="modal">&times;</button>
+                </div>
+                <!-- Modal body -->
+                <div class="card-body">
+                    <div class="form-group">
+                        <?php
+                        $element = $form->get('category_id');
+                        $element->setOptions(['label' => 'LABEL_CATEGORY']);
+                        $element->setAttributes(['class' => 'form-control']);
+                        echo $this->formLabel($element);
+                        echo $this->formSelect($element);
+                        ?>
+                    </div>
+                  	<div class="form-group">
+                        <?php
+                        $element = $form->get('title');
+                        $element->setOptions(['label' => 'LABEL_TITLE']);
+                        $element->setAttributes(['class' => 'form-control']);
+                        echo $this->formLabel($element);
+                        echo $this->formText($element);
+                        ?>
+                    </div>
+                  	<div class="form-group">
+                        <?php
+                        $element = $form->get('description');
+                        $element->setOptions(['label' => 'LABEL_DESCRIPTION']);
+                        $element->setAttributes(['class' => 'form-control', 'id' => 'description_edit']);
+                        echo $this->formLabel($element);
+                        echo $this->formTextArea($element);
+                        ?>
+                    </div>
+                  	<div class="form-group">
+                        <?php
+                        $element = $form->get('image');
+                        $element->setOptions(['label' => 'LABEL_IMAGE']);
+                        $element->setAttributes(['class' => 'form-control']);
+                        echo $this->formLabel($element);
+                        echo $this->formFile($element);
+                        ?>
+                    </div>
+                  	<div class="form-group">
+                        <?php
+                        $element = $form->get('attachment');
+                        $element->setOptions(['label' => 'LABEL_ATTACHMENT']);
+                        $element->setAttributes(['class' => 'form-control']);
+                        echo $this->formLabel($element);
+                        echo $this->formFile($element);
-            <div class="company-up-info">
+                        ?>
+                    </div>
-                <img src="{{>image}}" alt="">
+                 	<div class="form-group">
-                <h3>{{>name}}</h3>
+                        <?php
-                <h4>{{>status}}</h4>
+                        $element = $form->get('link');
+                        $element->setOptions(['label' => 'LABEL_LINK']);
+                        $element->setAttributes(['class' => 'form-control']);
+                        echo $this->formLabel($element);
+                        echo $this->formText($element);
+                        ?>
+                    </div>
+                </div>
+                <div class="card-footer">
+                		<button type="submit" class="btn btn-primary">LABEL_SAVE</button>
+                        <button type="button" class="btn btn-light btn-cancel">LABEL_CANCEL</button>
+                </div>
+    			<?php echo $this->form()->closeTag($form); ?>
+            </div>
+        </div>
+    </div>
+</section>
+<script id="recordTemplate" type="text/x-jsrender">
+    <div class="col-4 ">
+        <div class="knowledge-record-card">
+            <div class="knowledge-record-card-image">
+                <a href="{{>link_view}}"  target="_blank" class="knowledge-record-card-actions-view">
+                    <img src="{{>image}}" alt="">
+                </a>
+            </div>
+            <div class="knowledge-record-card-category">
+                {{>category}}
+            </div>
+            <div class="knowledge-record-card-title">
+                {{>title}}
+            </div>
+            <div class="knowledge-record-card-description">
+                {{>description}}
-                <ul>
+            </div>
-                    <li><a href="#" data-link="{{>link_view}}" title="" class="follow btn-profile-view">LABEL_VIEW_PROFILE</a></li>
+            <div class="knowledge-record-card-actions">
-				    <li><a href="#" data-link="{{>link_inmail}}" title="" class="message-us btn-send-message">LABEL_MESSAGE</a></li>
+                {{if link_edit }}
+                <div class="knowledge-record-card-actions-edit">

Proyectos de Subversion LeadersLinked - Antes de SPA

(root)/module/LeadersLinked/view/leaders-linked/knowledge-area/index.phtml – Rev 6001 → 6056