feature/FOUR-15730 Pagination

ProcessMaker/Http/Controllers/Api/ProcessController.php

@@ -45,7 +45,7 @@ class ProcessController extends Controller
 {
     const CAROUSEL_TYPES = [
         'IMAGE' => 'image',
-        'EMBED' => 'embed'
+        'EMBED' => 'embed',
     ];
 
     /**
@@ -128,6 +128,7 @@ public function index(Request $request)
                     'id' => $item['id'],
                     'events'=> $item['start_events']];
             });
+
             return new ApiCollection($modifiedCollection);
         }
 
@@ -402,7 +403,7 @@ public function store(Request $request)
      * @param Process $process
      * @return ResponseFactory|Response
      *
-     * @throws \Throwable
+     * @throws Throwable
      *
      * @OA\Put(
      *     path="/processes/{processId}",
@@ -520,7 +521,7 @@ public function update(Request $request, Process $process)
     public function updateBpmn(Request $request, Process $process)
     {
         $request->validate(Process::rules($process));
-        
+
         // bpmn validation
         if ($schemaErrors = $this->validateBpmn($request)) {
             $warnings = [];
@@ -557,7 +558,8 @@ public function updateBpmn(Request $request, Process $process)
         ], 200);
     }
 
-    private function updateSubprocessElement($parentProcess, $request, $process) {
+    private function updateSubprocessElement($parentProcess, $request, $process)
+    {
         $definitions = $parentProcess->getDefinitions();
         $elements = $definitions->getElementsByTagName('callActivity');
         foreach ($elements as $element) {
@@ -584,7 +586,7 @@ private function updateSubprocessElement($parentProcess, $request, $process) {
      * @param Process $process
      * @return ResponseFactory|Response
      *
-     * @throws \Throwable
+     * @throws Throwable
      *
      * @OA\Put(
      *     path="/processes/{processId}/draft",
@@ -948,7 +950,7 @@ public function startProcesses(Request $request)
      * @param Process $process
      * @return ResponseFactory|Response
      *
-     * @throws \Throwable
+     * @throws Throwable
      *
      * @OA\Put(
      *     path="/processes/{processId}/restore",
@@ -1294,7 +1296,7 @@ public function import_ready($code)
      *
      * @return resource
      *
-     * @throws \Throwable
+     * @throws Throwable
      *
      * @OA\Post(
      *     path="/processes/{process_id}/import/assignments",
@@ -1440,7 +1442,7 @@ public function importAssignments(Process $process, Request $request)
      * @param Process $process
      * @param Request $request
      *
-     * @return \ProcessMaker\Http\Resources\ProcessRequests
+     * @return ProcessRequests
      *
      * @OA\Post(
      *     path="/process_events/{process_id}",
@@ -1778,7 +1780,7 @@ public function deleteMediaImages(Request $request, Process $process)
      * @param string $uuid
      * @param string $collectionName
      * @return bool
-    */
+     */
     private function deleteImage(Process $process, $uuid, $collectionName)
     {
         // Retrieve the media image by UUID and collection name
@@ -1788,6 +1790,7 @@ private function deleteImage(Process $process, $uuid, $collectionName)
         // If the media image exists, delete it and return true
         if ($mediaImagen) {
             $mediaImagen->delete();
+
             return true;
         } else {
             // Otherwise, return false

ProcessMaker/Http/Controllers/Auth/LoginController.php

@@ -277,11 +277,11 @@ public function loggedOut(Request $request)
      * Handle a login request to the application.
      * Overrides the original login action.
      *
-     * @param  \Illuminate\Http\Request $request
-     * @param  \ProcessMaker\Models\User $user
+     * @param  Request $request
+     * @param  User $user
      * @return \Illuminate\Http\RedirectResponse|\Illuminate\Http\Response|\Illuminate\Http\JsonResponse
      *
-     * @throws \Illuminate\Validation\ValidationException
+     * @throws ValidationException
      */
     public function login(Request $request, User $user)
     {
@@ -340,7 +340,7 @@ public function login(Request $request, User $user)
     /**
      * Throws locked error message
      *
-     * @throws \Illuminate\Validation\ValidationException
+     * @throws ValidationException
      */
     protected function throwLockedLoginResponse()
     {

ProcessMaker/Http/Controllers/ProcessController.php

@@ -124,7 +124,7 @@ public function edit(Process $process)
             'canEditData',
             'addons',
             'assignedProjects',
-            'isDraft'
+            'isDraft',
         ]));
     }
 

ProcessMaker/Models/ProcessRequest.php

@@ -527,10 +527,11 @@ public function summary()
                 $result[] = [
                     'key' => $key,
                     'value' => $value,
-                    'type' => $type
+                    'type' => $type,
                 ];
             }
         }
+
         return $result;
     }
 

resources/js/components/shared/FilterTableBodyMixin.js

@@ -34,7 +34,8 @@ export default {
       this.page = page;
       this.fetch();
     },
-    changePerPage(value) {
+    changePerPage(value, page) {
+      this.page = page;
       this.perPage = value;
       this.fetch();
     },
@@ -81,6 +82,6 @@ export default {
       if (e.target.offsetWidth >= e.target.scrollWidth) {
         e.preventDefault();
       }
-    }
+    },
   },
 };

resources/js/components/shared/PaginationTable.vue

@@ -169,8 +169,7 @@ export default {
       this.$emit("page-change", page);
     },
     changePerPage(value) {
-      this.goToPage(this.defaultPage);
-      this.$emit("per-page-change", value);
+      this.$emit("per-page-change", value, this.defaultPage);
     },
     redirectPage(value) {
       this.$emit("page-change", value);
@@ -234,7 +233,6 @@ export default {
     font-weight: 700;
 }
 .pagination-total {
-  margin-left: 10px;
   padding: 0px 8px 0px 8px;
 }
 .pagination-dropup {

resources/js/components/shared/UtilsTable.js

@@ -0,0 +1,30 @@
+export const ellipsisSortClick = (categoryColumn, context)=>{
+    context.fields.forEach(column => {
+        if (column.field !== categoryColumn.field) {
+        column.direction = "none";
+        column.filterApplied = false;
+        }
+    });
+
+    if (categoryColumn.direction === "asc") {
+        categoryColumn.direction = "desc";
+    } else if (categoryColumn.direction === "desc") {
+        categoryColumn.direction = "none";
+        categoryColumn.filterApplied = false;
+    } else {
+        categoryColumn.direction = "asc";
+        categoryColumn.filterApplied = true;
+    }
+
+    if (categoryColumn.direction !== "none") {
+        const sortOrder = [
+        {
+            sortField: categoryColumn.sortField || categoryColumn.field,
+            direction: categoryColumn.direction,
+        },
+        ];
+        context.dataManager(sortOrder);
+    } else {
+        context.fetch();
+    }
+}

resources/js/components/shared/index.js

@@ -54,6 +54,7 @@ import DataLoading from '../../components/common/DataLoading';
 import AvatarImage from '../../components/AvatarImage';
 import FilterTableBodyMixin from "./FilterTableBodyMixin";
 import PaginationTable from "./PaginationTable.vue";
+import { ellipsisSortClick } from "./UtilsTable";
 import TaskTooltip from "../../tasks/components/TaskTooltip.vue";
 
 export {
@@ -113,5 +114,6 @@ export {
   AvatarImage,
   FilterTableBodyMixin,
   PaginationTable,
+  ellipsisSortClick,
   TaskTooltip,
 };

resources/js/processes-catalogue/components/RequestTab.vue

@@ -132,7 +132,8 @@ export default {
       this.page = page;
       this.queryBuilder();
     },
-    changePerPage(value) {
+    changePerPage(value, page) {
+      this.page = page;
       this.perPage = value;
       this.queryBuilder();
     },

resources/js/processes-catalogue/components/TaskTab.vue

@@ -133,7 +133,8 @@ export default {
       this.page = page;
       this.queryBuilder();
     },
-    changePerPage(value) {
+    changePerPage(value, page) {
+      this.page = page;
       this.perPage = value;
       this.queryBuilder();
     },

resources/js/processes/categories/components/CategoriesListing.vue

@@ -19,7 +19,7 @@
               <div
                 v-if="column.sortable"
                 :key="index"
-                @click="handleEllipsisClick(column)"
+                @click="onClickEllipsis(column)"
               >
                 <i
                   :class="['fas', {
@@ -112,6 +112,8 @@
   import EllipsisMenu from "../../../components/shared/EllipsisMenu.vue";
   import paginationTable from "../../../components/shared/PaginationTable.vue";
   import FilterTableBodyMixin from "../../../components/shared/FilterTableBodyMixin";
+  import { ellipsisSortClick } from "../../../components/shared/UtilsTable";
+
   const uniqIdsMixin = createUniqIdsMixin();
 
   export default {
@@ -292,35 +294,8 @@
         };
         return bubbleColor[status];
       },
-      handleEllipsisClick(categoryColumn) {
-        this.fields.forEach(column => {
-          if (column.field !== categoryColumn.field) {
-            column.direction = "none";
-            column.filterApplied = false;
-          }
-        });
-
-        if (categoryColumn.direction === "asc") {
-          categoryColumn.direction = "desc";
-        } else if (categoryColumn.direction === "desc") {
-          categoryColumn.direction = "none";
-          categoryColumn.filterApplied = false;
-        } else {
-          categoryColumn.direction = "asc";
-          categoryColumn.filterApplied = true;
-        }
-
-        if (categoryColumn.direction !== "none") {
-          const sortOrder = [
-            {
-              sortField: categoryColumn.sortField || categoryColumn.field,
-              direction: categoryColumn.direction,
-            },
-          ];
-          this.dataManager(sortOrder);
-        } else {
-          this.fetch();
-        }
+      onClickEllipsis(column) {
+        ellipsisSortClick(column, this);
       },
     }
   };