feature/FOUR-12396: New Menu Proccesses

ProcessMaker/Http/Controllers/ProcessesCatalogueController.php

@@ -0,0 +1,14 @@
+<?php
+
+namespace ProcessMaker\Http\Controllers;
+
+use Illuminate\Http\Request;
+use ProcessMaker\Http\Controllers\Controller;
+
+class ProcessesCatalogueController extends Controller
+{
+    public function index(Request $request)
+    {
+        return view('processes-catalogue.index');
+    }
+}

ProcessMaker/Http/Middleware/GenerateMenus.php

@@ -33,6 +33,12 @@ public function handle(Request $request, Closure $next)
                     ['route' => 'requests.index', 'id' => 'requests']
                 )->active('requests/*');
             });
+            $menu->group(['prefix' => 'processes'], function ($request_items) {
+                $request_items->add(
+                    __('Processes'),
+                    ['route' => 'processes.catalogue.index', 'id' => 'processes-catalogue']
+                )->active('processes-catalogue/*');
+            });
             //@TODO change the index to the correct blade
             $menu->group(['prefix' => 'tasks'], function ($request_items) {
                 $request_items->add(
@@ -127,6 +133,9 @@ public function handle(Request $request, Closure $next)
                 'id' => 'homeid',
             ]);
         });
+        Menu::make('sidebar_processes_catalogue', function ($menu) {
+            $submenu = $menu->add(__('Processes'));
+        });
         Menu::make('sidebar_request', function ($menu) {
             $submenu = $menu->add(__('Request'));
             $submenu->add(__('My Requests'), [

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

@@ -0,0 +1,48 @@
+<template>
+  <div class="d-flex w-100">
+    <div class="w-25">
+      <h4> {{ $t('Processes Browser') }} </h4>
+    </div>
+    <div class="w-100">
+      <div v-if="!fields.length" class="d-flex justify-content-center py-5 w-100">
+        <div>
+          <div class="d-flex justify-content-center my-5">
+            <img
+              class="image d-flex"
+              src="/img/processes-catalogue-empty.svg"
+              alt="recent projects"
+            >
+          </div>
+          <h4 class="text-center">
+            {{ $t('Currently you dont have processes created') }}
+          </h4>
+          <p class="text-center">
+            {{ $t('We encourage you to create new processes using our templates') }}
+          </p>
+          <p class="text-center my-4">
+            <button
+              type="button"
+              class="btn btn-primary text-capitalize"
+            >
+              {{ $t("Show Me The Templates") }}
+            </button>
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+
+export default {
+  data() {
+    return {
+      fields: [],
+    };
+  },
+  methods: {
+  },
+};
+</script>
+

resources/js/processes-catalogue/index.js

@@ -0,0 +1,11 @@
+import Vue from "vue";
+import ProcessesCatalogue from "./components/ProcessesCatalogue";
+
+new Vue({
+  el: "#processes-catalogue",
+  components: { ProcessesCatalogue },
+  data: {
+  },
+  methods: {
+  },
+});

resources/views/processes-catalogue/index.blade.php

@@ -0,0 +1,19 @@
+@extends('layouts.layout')
+
+@section('title')
+    {{__('Processes Catalogue')}}
+@endsection
+
+@section('sidebar')
+    @include('layouts.sidebar', ['sidebar' => Menu::get('sidebar_processes_catalogue')])
+@endsection
+
+@section('content')
+  <div class="px-3 page-content mb-0" id="processes-catalogue">
+    <processes-catalogue></processes-catalogue>
+  </div>
+@endsection
+
+@section('js')
+    <script src="{{mix('js/processes-catalogue/index.js')}}"></script>
+@endsection

routes/web.php

@@ -27,6 +27,7 @@
 use ProcessMaker\Http\Controllers\Process\ScriptController;
 use ProcessMaker\Http\Controllers\Process\SignalController;
 use ProcessMaker\Http\Controllers\ProcessController;
+use ProcessMaker\Http\Controllers\ProcessesCatalogueController;
 use ProcessMaker\Http\Controllers\ProfileController;
 use ProcessMaker\Http\Controllers\RequestController;
 use ProcessMaker\Http\Controllers\TaskController;
@@ -89,6 +90,9 @@
 
     Route::get('designer/scripts/categories', [ScriptController::class, 'index'])->name('script-categories.index')->middleware('can:view-script-categories');
     Route::get('designer', [DesignerController::class, 'index'])->name('designer.index');
+
+    Route::get('processes-catalogue', [ProcessesCatalogueController::class, 'index'])->name('processes.catalogue.index');
+
     Route::get('processes', [ProcessController::class, 'index'])->name('processes.index');
     Route::get('processes/{process}/edit', [ProcessController::class, 'edit'])->name('processes.edit')->middleware('can:edit-processes');
     Route::get('processes/{process}/export/{page?}', [ProcessController::class, 'export'])->name('processes.export')->middleware('can:export-processes');

webpack.mix.js

@@ -116,6 +116,8 @@ mix.js("resources/js/app-layout.js", "public/js")
 
   .js("resources/js/processes/translations/import.js", "public/js/processes/translations")
 
+  .js("resources/js/processes-catalogue/index.js", "public/js/processes-catalogue/index.js")
+
   .js("resources/js/tasks/index.js", "public/js/tasks/index.js")
   .js("resources/js/tasks/mobile.js", "public/js/tasks/mobile.js")
   .js("resources/js/tasks/show.js", "public/js/tasks/show.js")