fix user_list

assets/css/scss/_base.scss

@@ -99,7 +99,15 @@ hr {
 }
 
 /****** BOOTSTRAP SELECT ******/
-
+.custom-select::-ms-expand {
+  display: none;
+}
+.custom-select{
+  /* for Firefox */
+  -moz-appearance: none;
+  /* for Chrome */
+  -webkit-appearance: none;
+}
 .bootstrap-select{
   .dropdown-toggle{
     &:after{
@@ -134,25 +142,23 @@ hr {
 }
 
 // ---------------------------------------------------------
-// MAIN CONTAINER
+// TABLES
 // ---------------------------------------------------------
 
-.main-content {
+.table{
-  padding: 75px 20px 20px;
+  .avatar{
-  min-height: calc(100vh - 61px);
+    border: 1px solid #cdcdcd;
-  &.bg-content{
-    background-color: $page-background;
   }
-  .box-body{
+  .actions-btn{
-    background-color: transparent;
+    img{
+      border: 1px solid #cdcdcd;
+      padding: 4px;
+      border-radius: 5px;
+    }
+    .blackboard_hide{
+      display: none;
     }
-  @include to($breakpoint-md) {
-    padding: 85px 5px 5px;
   }
-}
-
-.remain-height {
-  height: calc(100vh - 126px);
 }
 
 // ---------------------------------------------------------

assets/js/vendor.js

@@ -23,6 +23,7 @@ require("jquery.scrollbar");
 require("blueimp-file-upload");
 require("select2");
 require("timeago");
+require("datatables/media/js/jquery.dataTables");
 require('bootstrap-select/dist/js/bootstrap-select.js');
 
 require("bootstrap-daterangepicker");

index.php

@@ -180,4 +180,4 @@ if (isset($_GET['firstpage'])) {
     api_delete_firstpage_parameter();
 }
 $controller->setGradeBookDependencyBar(api_get_user_id());
-$controller->tpl->display_two_col_template();
+$controller->tpl->display_one_col_template();

main/admin/user_list.php

@@ -464,7 +464,7 @@ function get_user_data($from, $number_of_items, $column, $direction)
             USER_IMAGE_SIZE_SMALL
         );
         $photo = '<img 
-            src="'.$userPicture.'" width="22" height="22" 
+            src="'.$userPicture.'" class="rounded-circle avatar" 
             alt="'.api_get_person_name($user[2], $user[3]).'" 
             title="'.api_get_person_name($user[2], $user[3]).'" />';
 
@@ -544,7 +544,7 @@ function modify_filter($user_id, $url_params, $row)
     if ($current_user_status_label == $statusname[ANONYMOUS]) {
         $user_is_anonymous = true;
     }
-    $result = '';
+    $result = '<div class="actions-btn">';
     if (!$user_is_anonymous) {
         $icon = Display::return_icon(
             'course.png',
@@ -779,6 +779,7 @@ function modify_filter($user_id, $url_params, $row)
                 );
             }
         }
+        $result.='</div>';
     }
 
     return $result;
@@ -1098,9 +1099,9 @@ if (api_is_western_name_order()) {
 $table->set_header(5, get_lang('LoginName'));
 $table->set_header(6, get_lang('Email'));
 $table->set_header(7, get_lang('Profile'));
-$table->set_header(8, get_lang('Active'), true, 'width="15px"');
+$table->set_header(8, get_lang('Active'), true);
-$table->set_header(9, get_lang('RegistrationDate'), true, 'width="90px"');
+$table->set_header(9, get_lang('RegistrationDate'), true);
-$table->set_header(10, get_lang('Action'), false, 'width="220px"');
+$table->set_header(10, get_lang('Action'), false);
 
 $table->set_column_filter(3, 'user_filter');
 $table->set_column_filter(4, 'user_filter');
@@ -1202,5 +1203,7 @@ $toolbarActions = Display::toolbarAction(
 $tpl = new Template($tool_name);
 $tpl->assign('actions', $toolbarActions);
 $tpl->assign('message', $message);
-$tpl->assign('content', $form.$table_result.$extra_search_options);
+$tpl->assign('form_search', $form);
-$tpl->display_one_col_template();
+$tpl->assign('table', $table_result);
+$tpl->assign('extra', $extra_search_options);
+$tpl->display_table_template();

main/inc/lib/template.lib.php

@@ -298,9 +298,9 @@ class Template
     /**
      * Shortcut to display a 2 col layout (userportal.php).
      */
-    public function display_two_col_template()
+    public function display_table_template()
     {
-        $template = '@ChamiloTheme/Layout/layout_content.html.twig';
+        $template = '@ChamiloTheme/Layout/layout_table.html.twig';
         $this->returnResponse($this->params, $template);
     }
 

main/social/myfiles.php

@@ -123,5 +123,5 @@ if (api_get_setting('allow_social_tool') == 'true') {
     $tpl->assign('profile_block', $controller->return_profile_block());
     $tpl->assign('user_image_block', $controller->return_user_image_block());
     $tpl->assign('course_block', $controller->return_course_block());
-    $tpl->display_two_col_template();
+    $tpl->display_one_col_template();
 }

package.json

@@ -21,6 +21,7 @@
     "bootstrap-select": "^1.13",
     "chosen-js": "^1.8.7",
     "cropper": "^4.0",
+    "datatables": "^1.10.18",
     "datepair.js": "^0.4.16",
     "easy-pie-chart": "^2.1.7",
     "flag-icon-css": "^3.0",

src/ThemeBundle/Resources/views/Layout/layout_one_col_no_content.html.twig

@@ -1,20 +0,0 @@
-{% extends "@ChamiloTheme/Layout/base-layout.html.twig" %}
-
-{% block chamilo_wrap %}
-    {% if js is defined %}
-        {% autoescape false %}
-            {% for item in js %}
-                {{ item }}
-            {% endfor %}
-        {% endautoescape %}
-    {% endif %}
-    {% block content %}
-    {% autoescape false %}
-        {{ content }}
-    {% endautoescape %}
-    {% endblock %}
-{% endblock %}
-
-{# Some how twig does not override completely a block that used an "include" call #}
-{% block chamilo_footer %}
-{% endblock %}

src/ThemeBundle/Resources/views/Layout/layout_table.html.twig

@@ -0,0 +1,43 @@
+{% extends '@ChamiloTheme/Layout/base-layout.html.twig' %}
+
+{% block page_content %}
+    {% autoescape false %}
+
+        {% if js is defined %}
+            {% for item in js %}
+                {{ item }}
+            {% endfor %}
+        {% endif %}
+
+        <section class="section-content">
+
+            {% autoescape false %}
+
+                <section class="container-fluid">
+                    {% if actions != '' %}
+                        {{ actions }}
+                    {% endif %}
+                </section>
+
+                {% block chamilo_messages %}
+                    {% include '@ChamiloTheme/FlashMessage/render.html.twig' %}
+                {% endblock %}
+
+                {# Content #}
+                {% block content %}
+                    <section class="container-fluid">
+                        {{ form_search }}
+                        <div class="card mb-4">
+                            <div class="card-body">
+                                {{ table }}
+                            </div>
+                        </div>
+                        {{ extra }}
+                    </section>
+                {% endblock %}
+            {% endautoescape %}
+
+        </section>
+
+    {% endautoescape %}
+{% endblock %}