[WIP] Launchpad updates

ProcessMaker/Helpers/MobileHelper.php

@@ -13,4 +13,9 @@ public static function isMobile($userAgent)
 
         return false;
     }
+
+    public static function detectMobile()
+    {
+        return isset($_SERVER['HTTP_USER_AGENT']) && self::isMobile($_SERVER['HTTP_USER_AGENT']);
+    }
 }

ProcessMaker/Http/Controllers/Api/ProcessLaunchpadController.php

@@ -24,7 +24,9 @@ public function getProcesses(Request $request)
         $processes = Process::nonSystem()->active();
         // Filter by category
         $category = $request->input('category', null);
-        if (!empty($category)) {
+        if ($category === 'recent') {
+            $processes->orderByRecentRequests();
+        } elseif (!empty($category)) {
             $processes->processCategory($category);
         }
         // Filter pmql
@@ -44,6 +46,7 @@ public function getProcesses(Request $request)
         // Get the processes
         $processes = $processes
             ->select('processes.*')
+            ->withRequestCount()
             ->orderBy('processes.name', 'asc')
             ->paginate($perPage);
 
@@ -120,9 +123,9 @@ public function destroy(ProcessLaunchpad $launch)
         return response([], 204);
     }
 
-   /**
-    * Store the elements related to the carousel [IMAGE, EMBED URL]
-    */
+    /**
+     * Store the elements related to the carousel [IMAGE, EMBED URL]
+     */
     public function saveContentCarousel(Request $request, Process $process)
     {
         $contentCarousel = $request->input('imagesCarousel');
@@ -144,7 +147,6 @@ public function saveContentCarousel(Request $request, Process $process)
                         // Nothing
                         break;
                 }
-
             }
         }
     }

ProcessMaker/Http/Controllers/ProcessesCatalogueController.php

@@ -5,12 +5,13 @@
 use Illuminate\Http\Request;
 use Illuminate\Support\Facades\Auth;
 use ProcessMaker\Events\ScreenBuilderStarting;
+use ProcessMaker\Helpers\MobileHelper;
 use ProcessMaker\Http\Controllers\Controller;
 use ProcessMaker\Managers\ScreenBuilderManager;
-use ProcessMaker\Models\Process;
 use ProcessMaker\Models\Bookmark;
-use ProcessMaker\Models\ProcessLaunchpad;
+use ProcessMaker\Models\Process;
 use ProcessMaker\Models\ProcessCategory;
+use ProcessMaker\Models\ProcessLaunchpad;
 use ProcessMaker\Traits\HasControllerAddons;
 
 /**
@@ -22,7 +23,7 @@
 class ProcessesCatalogueController extends Controller
 {
     use HasControllerAddons;
-    
+
     public function index(Request $request, Process $process = null)
     {
         $manager = app(ScreenBuilderManager::class);
@@ -33,6 +34,13 @@ public function index(Request $request, Process $process = null)
             $process->launchpad = ProcessLaunchpad::getLaunchpad(true, $process->id);
             $process->bookmark_id = Bookmark::getBookmarked(true, $process->id, $currentUser['id']);
         }
+
+        if (MobileHelper::detectMobile()) {
+            $title = __('Process Browser');
+
+            return view('processes-catalogue.mobile', compact('title', 'process', 'currentUser', 'manager'));
+        }
+
         return view('processes-catalogue.index', compact('process', 'currentUser', 'manager'));
     }
 }

ProcessMaker/Models/Process.php

@@ -1162,29 +1162,34 @@ public function manageCustomRoutes()
                         break;
 
                     default:
-                        if ($webEntryProperties->webentryRouteConfig->firstUrlSegment !== '') {
-                            $webentryRouteConfig = $webEntryProperties->webentryRouteConfig;
-                            try {
-                                WebentryRoute::updateOrCreate(
-                                    [
-                                        'process_id' => $this->id,
-                                        'node_id' => $webentryRouteConfig->nodeId,
-                                    ],
-                                    [
-                                        'first_segment' => $webentryRouteConfig->firstUrlSegment,
-                                        'params' => $webentryRouteConfig->parameters,
-                                    ]
-                                );
-                            } catch (\Exception $e) {
-                                \Log::info('*** Error: ' . $e->getMessage());
-                            }
-                        }
+                        $this->manageWebentryRoute($webEntryProperties);
                         break;
                 }
             }
         }
     }
 
+    private function manageWebentryRoute($webEntryProperties)
+    {
+        if ($webEntryProperties->webentryRouteConfig->firstUrlSegment !== '') {
+            $webentryRouteConfig = $webEntryProperties->webentryRouteConfig;
+            try {
+                WebentryRoute::updateOrCreate(
+                    [
+                        'process_id' => $this->id,
+                        'node_id' => $webentryRouteConfig->nodeId,
+                    ],
+                    [
+                        'first_segment' => $webentryRouteConfig->firstUrlSegment,
+                        'params' => $webentryRouteConfig->parameters,
+                    ]
+                );
+            } catch (Exception $e) {
+                \Log::info('*** Error: ' . $e->getMessage());
+            }
+        }
+    }
+
     /**
      * Get node element attributes
      *
@@ -1250,7 +1255,7 @@ private function getStartEventPermissions(User $user)
     /**
      * Process events relationship.
      *
-     * @return \ProcessMaker\Models\ProcessEvents
+     * @return ProcessEvents
      */
     public function events()
     {
@@ -1287,7 +1292,7 @@ public function launchpad()
     /**
      * Assignments of the process.
      *
-     * @return \Illuminate\Database\Eloquent\Relations\HasMany
+     * @return HasMany
      */
     public function assignments()
     {
@@ -1616,7 +1621,7 @@ private function validateSchema(BpmnDocument $document)
     private function deleteUnusedCustomRoutes($url, $processId, $nodeId)
     {
         // Delete unused custom routes
-        $customRoute = webentryRoute::where('process_id', $processId)->where('node_id', $nodeId)->first();
+        $customRoute = WebentryRoute::where('process_id', $processId)->where('node_id', $nodeId)->first();
         if ($customRoute) {
             $customRoute->delete();
         }
@@ -1751,9 +1756,9 @@ public function scopeFilter($query, $filterStr)
                  ->orWhere('processes.description', 'like', $filter)
                  ->orWhere('processes.status', '=', $filterStr)
                  ->orWhereHas('user', function ($query) use ($filter) {
-                    $query->where('firstname', 'like', $filter)
-                        ->orWhere('lastname', 'like', $filter);
-                })
+                     $query->where('firstname', 'like', $filter)
+                         ->orWhere('lastname', 'like', $filter);
+                 })
                  ->orWhereIn('processes.id', function ($qry) use ($filter) {
                      $qry->select('assignable_id')
                          ->from('category_assignments')
@@ -1797,4 +1802,29 @@ public function hasAlternative()
     {
         return true;
     }
+
+    public function scopeOrderByRecentRequests($query)
+    {
+        return $query->orderByDesc(
+            ProcessRequest::select('id')
+                // User has participated
+                ->whereHas('tokens', function ($q) {
+                    $q->where('user_id', Auth::user()->id);
+                })
+                ->whereColumn('process_id', 'processes.id')
+                ->orderByDesc('id') // using ID because created_at is not indexed
+                ->limit(1)
+        );
+    }
+
+    public function scopeWithRequestCount($query)
+    {
+        return $query->withCount(['requests' => function ($query) {
+            return $query->where('status', 'ACTIVE')
+                // User has participated
+                ->whereHas('tokens', function ($q) {
+                    $q->where('user_id', Auth::user()->id);
+                });
+        }]);
+    }
 }

resources/js/app-layout.js

@@ -222,6 +222,17 @@ if (isMobileNavbar === "true") {
       return {
       };
     },
+    computed: {
+      visible() {
+
+
+
+// wont work because of replaceState. Maybe replace state listener???
+
+        // Do not show on process details page
+        return !(/process-browser\/\d+/.test(window.location.href));
+      }
+    },
     mounted() {
       if (this.$cookies.get("firstMounted") === "true") {
         $("#welcomeModal").modal("show");

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

@@ -154,10 +154,16 @@ export default {
 };
 </script>
 
-<style>
+<style scoped lang="scss">
+
+@import '~styles/variables';
 .processList {
   display: flex;
   flex-wrap: wrap;
+
+  @media (max-width: $lp-breakpoint) {
+    display: block;
+  }
 }
 .text-custom {
   color: #1572C2;

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

@@ -64,30 +64,6 @@
       >
         <div class="info-collapse">
           <div class="row">
-            <div class="col-sm-9">
-              <p class="title-process">
-                {{ process.name }}
-              </p>
-              <p
-                v-if="readActivated || !largeDescription"
-                class="description"
-              >
-                {{ process.description }}
-              </p>
-              <p
-                v-if="!readActivated && largeDescription"
-                class="description"
-              >
-                {{ process.description.slice(0,300) }}
-                <a
-                  v-if="!readActivated"
-                  class="read-more"
-                  @click="activateReadMore"
-                >
-                  ...
-                </a>
-              </p>
-            </div>
             <div class="wizard-container col-sm-3">
               <div class="wizard">
                 <b-button
@@ -106,18 +82,20 @@
             </div>
           </div>
           <b-row>
-            <b-col class="process-carousel col-sm-12 col-md-12 col-lg-12 col-xl-9 col-pm-9 col-9">
+            <b-col class="process-carousel col-12">
               <processes-carousel
                 :process="process"
+                :full-carousel="{ url: null, hideLaunchpad: false }"
               />
             </b-col>
-            <b-col class="process-options col-sm-12 col-md-12 col-lg-12 col-xl-3 col-pm-3 col-2">
+            <b-col class="process-options col-12">
               <process-options :process="process" />
             </b-col>
           </b-row>
         </div>
       </div>
     </div>
+
     <create-template-modal
       id="create-template-modal"
       ref="create-template-modal"

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

@@ -1,41 +1,76 @@
 <template>
   <div class="process-info-main">
     <process-collapse-info
+      v-show="hideLaunchpad"
       :process="process"
       :permission="permission"
       :current-user-id="currentUserId"
       :is-documenter-installed="isDocumenterInstalled"
       @goBackCategory="goBackCategory"
     />
     <process-tab
+      v-show="hideLaunchpad"
       :current-user="currentUser"
       :process="process"
     />
+
+    <div w-100 h-100 v-show="!hideLaunchpad">
+      <div class="card card-body">
+      <div class="d-flex justify-content-between">
+        <div class="d-flex align-items-center">
+          <i class="fas fa-angle-left"
+          @click="closeFullCarousel"
+          />
+          <span style="margin-left: 10px;">{{ process.name }} {{ this.firstImage }} of {{ this.lastImage }}</span>
+        </div>
+      </div>
+      </div>
+      <processes-carousel
+        :process="process"
+        :full-carousel="{ url: null, hideLaunchpad: true }"
+        :index-selected-image="indexSelectedImage"
+      />
+    </div>
   </div>
 </template>
 
 <script>
 import ProcessCollapseInfo from "./ProcessCollapseInfo.vue";
 import ProcessTab from "./ProcessTab.vue";
+import ProcessesCarousel from "./ProcessesCarousel.vue";
 
 export default {
   components: {
     ProcessCollapseInfo,
     ProcessTab,
+    ProcessesCarousel,
   },
   props: ["process", "permission", "isDocumenterInstalled", "currentUserId", "currentUser"],
   data() {
     return {
       listCategories: [],
       selectCategory: 0,
       dataOptions: {},
+      hideLaunchpad: true,
+      firstImage: 0,
+      lastImage: null,
+      indexSelectedImage: 0,
     };
   },
   mounted() {
     this.dataOptions = {
       id: this.process.id.toString(),
       type: "Process",
     };
+    this.$root.$on("clickCarouselImage", (val) => {
+      this.hideLaunchpad = !val.hideLaunchpad;
+      this.lastImage = val.countImages;
+      this.indexSelectedImage = val.imagePosition;
+      this.firstImage = this.indexSelectedImage + 1;
+    });
+    this.$root.$on("carouselImageSelected", (pos) => {
+      this.firstImage = pos + 1;
+    });
   },
   methods: {
     /**
@@ -44,6 +79,9 @@ export default {
     goBackCategory() {
       this.$emit("goBackCategory");
     },
+    closeFullCarousel() {
+      this.$root.$emit("clickCarouselImage", false);
+    }
   },
 };
 </script>