@@ -136,7 +136,7 @@
@click="showQuickFillPreview = true"
>
@@ -286,6 +286,8 @@ export default {
props: ["tooltipButton", "propPreview"],
data() {
return {
+ eraserImage: '/img/smartinbox-images/eraser.svg',
+ fillImage: '/img/smartinbox-images/fill.svg',
};
},
watch: {
diff --git a/resources/js/tasks/router.js b/resources/js/tasks/router.js
index 1444aba313..064197e5ea 100644
--- a/resources/js/tasks/router.js
+++ b/resources/js/tasks/router.js
@@ -1,7 +1,7 @@
import Vue from "vue";
import VueRouter from "vue-router";
import DashboardViewer from "./components/DashboardViewer.vue";
-import Process from "../processes-catalogue/components/Process";
+import Process from "../processes-catalogue/components/Process.vue";
Vue.use(VueRouter);
const screen = JSON.parse(sessionStorage.getItem('dashboard_screen'));
diff --git a/resources/js/vite/tasks/loaderTasks.js b/resources/js/vite/tasks/loaderTasks.js
new file mode 100644
index 0000000000..20787250f8
--- /dev/null
+++ b/resources/js/vite/tasks/loaderTasks.js
@@ -0,0 +1,34 @@
+import { setupMain } from "../../../js/next/setupMain";
+import vueFormElements from "../../../js/next/libraries/vueFormElements";
+import modelerInspector from "../../../js/next/libraries/modelerInspector";
+import modeler from "../../../js/next/modeler";
+import screenBuilderNext from "../../../js/next/screenBuilder";
+// Load screen-builder for PMBLOCKs
+import * as ScreenBuilder from "@processmaker/screen-builder";
+
+window.ScreenBuilder = ScreenBuilder;
+
+setupMain();
+screenBuilderNext();
+modeler();
+
+window.ProcessMaker.taskDraftsEnabled = window.temporal.taskDraftsEnabled;
+window.ProcessMaker.advanced_filter = window.temporal.advanced_filter;
+window.ProcessMaker.defaultColumns = window.temporal.defaultColumns;
+window.ProcessMaker.isDefaultColumns = window.temporal.isDefaultColumns;
+window.ProcessMaker.userConfiguration = window.temporal.userConfiguration;
+window.ProcessMaker.showOldTaskScreen = window.temporal.showOldTaskScreen;
+window.ProcessMaker.user = window.temporal.user;
+window.ProcessMaker.selectedProcess = window.temporal.selectedProcess;
+window.ProcessMaker.defaultSavedSearchId = window.temporal.defaultSavedSearchId;
+window.ProcessMaker.isTceCustomization = window.temporal.isTceCustomization;
+window.ProcessMaker.metricsApiEndpoint = window.temporal.metricsApiEndpoint;
+window.ProcessMaker.ellipsisPermission = window.temporal.ellipsisPermission;
+window.ProcessMaker.packages = window.temporal.packages;
+
+// Legacy Mix keys (lowercase "m") used by TasksMixin / ParticipantHomeScreen
+window.Processmaker = window.Processmaker || {};
+window.Processmaker.defaultColumns = window.temporal.defaultColumns;
+window.Processmaker.user = window.temporal.user;
+window.Processmaker.selectedProcess = window.temporal.selectedProcess;
+window.Processmaker.defaultSavedSearchId = window.temporal.defaultSavedSearchId;
diff --git a/resources/js/vite/tasks/tasks.js b/resources/js/vite/tasks/tasks.js
new file mode 100644
index 0000000000..f49c98ef1e
--- /dev/null
+++ b/resources/js/vite/tasks/tasks.js
@@ -0,0 +1,207 @@
+import Vue from "vue";
+import TasksList from "../../tasks/components/TasksList.vue";
+import TasksListCounter from "../../tasks/components/TasksListCounter.vue";
+import setDefaultAdvancedFilterStatus from "../../common/setDefaultAdvancedFilterStatus";
+import ParticipantHomeScreen from "../../tasks/components/ParticipantHomeScreen.vue";
+import PmqlInput from "../../components/shared/PmqlInput.vue";
+
+Vue.component("TasksList", TasksList);
+Vue.component("participant-home-screen", ParticipantHomeScreen);
+
+// Component used in the tasks list
+Vue.component("PmqlInput", PmqlInput);
+
+const main = new Vue({
+ el: "#tasks",
+ components: {
+ TasksList,
+ TasksListCounter,
+ },
+ data: {
+ showOldTaskScreen: window.ProcessMaker.showOldTaskScreen,
+ userConfiguration: window.ProcessMaker.userConfiguration,
+ urlConfiguration: "users/configuration",
+ showMenu: true,
+ // Legacy Mix spelling used by TasksMixin / ParticipantHomeScreen
+ columns: window.Processmaker?.defaultColumns || window.ProcessMaker?.defaultColumns || null,
+ filter: "",
+ pmql: "",
+ urlPmql: "",
+ filtersPmql: "",
+ fullPmql: "",
+ status: [],
+ inOverdueMessage: "",
+ additions: [],
+ priorityField: "is_priority",
+ draftField: "draft",
+ isDataLoading: false,
+ inbox: true,
+ priority: false,
+ draft: false,
+ tab: "inbox",
+ inboxCount: null,
+ draftCount: null,
+ priorityCount: null,
+ priorityFilter: [
+ {
+ subject: {
+ type: "Field",
+ value: "is_priority",
+ },
+ operator: "=",
+ value: true,
+ _column_field: "is_priority",
+ _column_label: "Priority",
+ _hide_badge: true,
+ },
+ ],
+ draftFilter: [
+ {
+ subject: {
+ type: "Relationship",
+ value: "draft.id",
+ },
+ operator: ">",
+ value: 0,
+ _column_field: "draft",
+ _column_label: "Draft",
+ _hide_badge: true,
+ },
+ ],
+ taskDraftsEnabled: window.ProcessMaker.taskDraftsEnabled,
+ },
+ created() {
+ const params = new URL(document.location).searchParams;
+ const statusParam = params.get("status");
+ this.urlPmql = params.get("pmql");
+
+ let status = "";
+
+ switch (statusParam) {
+ case "CLOSED":
+ status = "Completed";
+ break;
+ case "SELF_SERVICE":
+ status = "Self Service";
+ break;
+ default:
+ status = "In Progress";
+ break;
+ }
+ setDefaultAdvancedFilterStatus(status);
+
+ if (this.urlPmql && this.urlPmql !== "") {
+ this.onSearch();
+ }
+ },
+ mounted() {
+ window.ProcessMaker.EventBus.$on("advanced-search-addition", (component) => {
+ this.additions.push(component);
+ });
+
+ // Blade uses :fetch-on-created="false"; list only loads when we fetch here.
+ if (!window.location.search.includes("filter_user_recommendation")) {
+ this.$nextTick(() => {
+ if (this.$refs.taskList) {
+ this.$refs.taskList.fetch();
+ }
+ });
+ }
+ },
+ methods: {
+ switchTab(tab) {
+ this.tab = tab;
+ const taskListComponent = this.$refs.taskList;
+ taskListComponent.advancedFilter[this.priorityField] = [];
+ taskListComponent.advancedFilter[this.draftField] = [];
+ switch (tab) {
+ case "priority":
+ taskListComponent.advancedFilter.is_priority = this.priorityFilter;
+ break;
+ case "draft":
+ taskListComponent.advancedFilter.draft = this.draftFilter;
+ break;
+ }
+ taskListComponent.markStyleWhenColumnSetAFilter();
+ taskListComponent.storeFilterConfiguration();
+ taskListComponent.fetch(true);
+ },
+ dataLoading(value) {
+ this.isDataLoading = value;
+ },
+ onFetchTask() {
+ this.inbox = true;
+ this.priority = this.draft = false;
+ let filters = window.ProcessMaker.advanced_filter?.filters;
+ if (!Array.isArray(filters)) {
+ filters = [];
+ }
+ filters.forEach((item) => {
+ if (item._column_field === "is_priority") {
+ this.priority = true;
+ this.inbox = this.draft = false;
+ }
+ if (item._column_field === "draft") {
+ this.draft = true;
+ this.inbox = this.priority = false;
+ }
+ });
+ },
+ handleTabCount(value) {
+ if (this.tab === "inbox") {
+ this.inboxCount = value;
+ }
+ if (this.tab === "draft") {
+ this.draftCount = value;
+ }
+ if (this.tab === "priority") {
+ this.priorityCount = value;
+ }
+ },
+ onFiltersPmqlChange(value) {
+ this.filtersPmql = value[0];
+ this.fullPmql = this.getFullPmql();
+ },
+ onNLQConversion(query) {
+ this.onChange(query);
+ this.onSearch();
+ },
+ onChange(query) {
+ this.pmql = query;
+ this.fullPmql = this.getFullPmql();
+ },
+ onSearch() {
+ if (this.$refs.taskList) {
+ this.$refs.taskList.fetch(true);
+ }
+ },
+ onInboxRules() {
+ window.location.href = "/tasks/rules";
+ },
+ setInOverdueMessage(inOverdue) {
+ let inOverdueMessage = "";
+ if (inOverdue) {
+ const taskText = (inOverdue > 1) ? this.$t("Tasks").toLowerCase() : this.$t("Task").toLowerCase();
+ inOverdueMessage = this.$t("You have {{ inOverDue }} overdue {{ taskText }} pending", { inOverDue: inOverdue, taskText });
+ }
+ this.inOverdueMessage = inOverdueMessage;
+ },
+ getFullPmql() {
+ let fullPmqlString = "";
+
+ if (this.filtersPmql && this.filtersPmql !== "") {
+ fullPmqlString = this.filtersPmql;
+ }
+
+ if (fullPmqlString !== "" && this.pmql && this.pmql !== "") {
+ fullPmqlString = `${fullPmqlString} AND ${this.pmql}`;
+ }
+
+ if (fullPmqlString === "" && this.pmql && this.pmql !== "") {
+ fullPmqlString = this.pmql;
+ }
+
+ return fullPmqlString;
+ },
+ },
+});
diff --git a/resources/views/layouts/layoutnext.blade.php b/resources/views/layouts/layoutnext.blade.php
index a78ca97aee..5516ab138b 100644
--- a/resources/views/layouts/layoutnext.blade.php
+++ b/resources/views/layouts/layoutnext.blade.php
@@ -135,7 +135,9 @@ class="main flex-grow-1 h-100
@yield('js')
@stack('scripts')
-
+@foreach(GlobalScripts::getScripts() as $script)
+
+@endforeach
@isset($addons)
@foreach ($addons as $addon)
@if (!empty($addon['script_mix']))
diff --git a/resources/views/vite/tasks/index.blade.php b/resources/views/vite/tasks/index.blade.php
new file mode 100644
index 0000000000..b60ae83dee
--- /dev/null
+++ b/resources/views/vite/tasks/index.blade.php
@@ -0,0 +1,462 @@
+@extends('layouts.layoutnext', ['content_margin' => '', 'overflow-auto' => ''])
+
+@section('title')
+ {{ __($title) }}
+@endsection
+
+@section('sidebar')
+ @include('layouts.sidebar', ['sidebar' => Menu::get('sidebar_task')])
+@endsection
+
+@section('breadcrumbs')
+ @include('shared.breadcrumbs', [
+ 'routes' => [
+ Route::currentRouteName() === 'inbox' ? __('Inbox') : __('Tasks') => Route::currentRouteName() === 'inbox' ? route('inbox') : route('tasks.index')
+ ],
+ ])
+@endsection
+
+@section('content')
+
+
+
+
+
+ @{{ inOverdueMessage }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ __('Inbox Rules') }}
+
+
+
+ @if (
+ (Auth::user()->is_administrator || Auth::user()->hasPermission('edit-screens')) &&
+ Route::has('package.savedsearch.defaults.edit'))
+
+
+
+ @endif
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ {!! __(
+ 'Inbox Rules act as your personal task manager. You tell them what to look for, and they take care of things automatically.',
+ ) !!}
+
+
+