From 8e95e904904884834f1283bc0d3c12aa93a32b1d Mon Sep 17 00:00:00 2001 From: Gustavo Bascope Date: Mon, 20 May 2024 14:37:07 -0400 Subject: [PATCH 01/94] Change style for status, case title and links on tasks listing --- .../js/components/shared/FilterTable.vue | 32 +++++++++++++------ resources/js/tasks/components/TasksList.vue | 19 ++++++++--- 2 files changed, 37 insertions(+), 14 deletions(-) diff --git a/resources/js/components/shared/FilterTable.vue b/resources/js/components/shared/FilterTable.vue index 3889be6e99..c76569e947 100644 --- a/resources/js/components/shared/FilterTable.vue +++ b/resources/js/components/shared/FilterTable.vue @@ -325,8 +325,13 @@ export default { color: #1572C2; } .pm-table-filter tbody tr:hover { - background-color: #FAFBFC; - color: #1572C2; + background-color: #EFF5FB; +} +.pm-table-filter tbody tr a { + color: #566877; +} +.pm-table-filter tbody tr a:hover { + color: #1990FF; } .pm-table-filter thead { position: sticky; @@ -402,25 +407,34 @@ export default { background-color: #F2F8FE !important; } .pm-table-unread-row { - font-weight: bold; + background-color: #FFFDEA; } .status-success { - background-color: rgba(78, 160, 117, 0.2); - color: rgba(78, 160, 117, 1); + background-color: rgba(200, 240, 207, 1); + color: rgba(0, 0, 0, 0.75); width: 100px; border-radius: 5px; + padding: 7px; } .status-danger { - background-color:rgba(237, 72, 88, 0.2); - color: rgba(237, 72, 88, 1); + background-color:rgba(255, 199, 199, 1); + color: rgba(0, 0, 0, 0.75); width: 100px; border-radius: 5px; + padding: 7px; } .status-primary { - background: rgba(21, 114, 194, 0.2); - color: rgba(21, 114, 194, 1); + background: rgba(184, 220, 247, 1); + color: rgba(0, 0, 0, 0.75); width: 100px; border-radius: 5px; + padding: 7px; +} +.status-warning { + background: rgba(249, 232, 195, 1); + color: rgba(0, 0, 0, 0.75); + border-radius: 5px; + padding: 7px; } @-moz-document url-prefix() { .pm-table-truncate { diff --git a/resources/js/tasks/components/TasksList.vue b/resources/js/tasks/components/TasksList.vue index b27f874437..78508a776a 100644 --- a/resources/js/tasks/components/TasksList.vue +++ b/resources/js/tasks/components/TasksList.vue @@ -435,7 +435,14 @@ export default { `; }, formatCaseTitle(processRequest, record) { + let draftBadge = ""; + if (record.draft) { + draftBadge = ` + ${this.$t("Draft")} + `; + } return ` + ${draftBadge} ${ @@ -788,15 +795,17 @@ export default { } .due-danger { background-color: rgba(237, 72, 88, 0.2); - color: rgba(237, 72, 88, 1); - font-weight: 600; + color: rgba(0, 0, 0, 0.75); + font-weight: 700; border-radius: 5px; + padding: 7px; } .due-primary { - background: rgba(205, 221, 238, 1); - color: rgba(86, 104, 119, 1); - font-weight: 600; + background: rgba(224, 229, 233, 1); + color: rgba(0, 0, 0, 0.75); + font-weight: 700; border-radius: 5px; + padding: 7px; } .btn-this-data { background-color: #1572c2; From a3e8f9e22528ec1d8fdd9442b18575d63a0e678c Mon Sep 17 00:00:00 2001 From: CarliPinell Date: Wed, 22 May 2024 01:40:30 +0000 Subject: [PATCH 02/94] Saving progress working fine --- .../Controllers/Api/TaskDraftController.php | 14 +++- .../js/tasks/components/QuickFillPreview.vue | 82 ++++++++++++++++--- resources/views/tasks/preview.blade.php | 13 ++- routes/api.php | 1 + 4 files changed, 98 insertions(+), 12 deletions(-) diff --git a/ProcessMaker/Http/Controllers/Api/TaskDraftController.php b/ProcessMaker/Http/Controllers/Api/TaskDraftController.php index d9b4c6bae8..a721e6c434 100644 --- a/ProcessMaker/Http/Controllers/Api/TaskDraftController.php +++ b/ProcessMaker/Http/Controllers/Api/TaskDraftController.php @@ -12,6 +12,19 @@ class TaskDraftController extends Controller { + public function index(Request $request, ProcessRequestToken $task) + { + $search = ['task_id' => $task->id]; + $draft = TaskDraft::where($search)->first(); + + if ($draft) { + $draftData = $draft->data; + return new ApiResource($draftData); + } + + return new ApiResource(null); + } + public function update(Request $request, ProcessRequestToken $task) { $search = ['task_id' => $task->id]; @@ -24,7 +37,6 @@ public function update(Request $request, ProcessRequestToken $task) } $draft->data = $data; $draft->saveOrFail(); - return new ApiResource($draft); } diff --git a/resources/js/tasks/components/QuickFillPreview.vue b/resources/js/tasks/components/QuickFillPreview.vue index 4356c1ee60..6f4df64f13 100644 --- a/resources/js/tasks/components/QuickFillPreview.vue +++ b/resources/js/tasks/components/QuickFillPreview.vue @@ -270,16 +270,78 @@ export default { this.$emit("close"); }, buttonThisDataFromFullTask(data) { - return ProcessMaker.apiClient - .put("drafts/" + this.task.id, data) - .then((response) => { - this.task.draft = _.merge({}, this.task.draft, response.data); - window.location.href = `/tasks/${this.task.id}/edit`; - ProcessMaker.alert(this.$t("Task Filled successfully."), "success"); - }) - .catch((error) => { - console.error("Error", error); - }); + // return ProcessMaker.apiClient + // .put("drafts/" + this.task.id, data) + // .then((response) => { + // this.task.draft = _.merge({}, this.task.draft, response.data); + // window.location.href = `/tasks/${this.task.id}/edit`; + // ProcessMaker.alert(this.$t("Task Filled successfully."), "success"); + // }) + // .catch((error) => { + // console.error("Error", error); + // }); + + if (this.propFromButton === "fullTask") { + return new Promise((resolve, reject) => { + ProcessMaker.apiClient.get("drafts/" + this.task.id) + .then(responseGet => { + const dataFromGet = responseGet.data; + if (Array.isArray(dataFromGet) && dataFromGet.length === 0) { + console.log("devuelve array vacio: ", dataFromGet); + // Si dataFromGet es un array vacío, mantén la variable data original + resolve(data); + } else { + console.log("devuelve objeto"); + // Si dataFromGet no es un array vacío, asigna su valor a data + //const newData = dataFromGet; + const newData = _.mergeWith( + _.cloneDeep(dataFromGet), + data, + (objValue, srcValue) => { + // If object value is falsy returns value from source(event.detail) + if (!objValue) { + return srcValue; + } + // Otherwise, keeps object value(this.formData) + return objValue; + } + ); + resolve(newData); + } + }) + .catch(errorGet => { + reject(errorGet); + }); + }) + .then(dataToUse => { + return ProcessMaker.apiClient.put("drafts/" + this.task.id, dataToUse) + .then(responsePut => { + this.task.draft = _.merge({}, this.task.draft, responsePut.data); + window.location.href = `/tasks/${this.task.id}/edit`; + ProcessMaker.alert(this.$t("Task Filled successfully."), "success"); + }) + .catch(errorPut => { + console.error("Error", errorPut); + }); + }) + .catch(error => { + console.error("Error", error); + }); + } else { + return ProcessMaker.apiClient + .put("drafts/" + this.task.id, data) + .then((response) => { + this.task.draft = _.merge({}, this.task.draft, response.data); + window.location.href = `/tasks/${this.task.id}/edit`; + ProcessMaker.alert(this.$t("Task Filled successfully."), "success"); + }) + .catch((error) => { + console.error("Error", error); + }); + + } + + }, /* * To do: There's a global-search-bar class with a large z-index. We added a class diff --git a/resources/views/tasks/preview.blade.php b/resources/views/tasks/preview.blade.php index 0e7a734d77..7a8b876683 100644 --- a/resources/views/tasks/preview.blade.php +++ b/resources/views/tasks/preview.blade.php @@ -437,7 +437,18 @@ class="card border-0" }); window.addEventListener('fillData', event => { - this.formData = _.merge(_.cloneDeep(this.formData), event.detail); + this.formData = _.mergeWith( + _.cloneDeep(this.formData), + event.detail, + (objValue, srcValue) => { + // If object value is falsy returns value from source(event.detail) + if (!objValue) { + return srcValue; + } + // Otherwise, keeps object value(this.formData) + return objValue; + } + ); }); window.addEventListener('eraseData', event => { diff --git a/routes/api.php b/routes/api.php index 7ca9f54b60..f19aa4f79a 100644 --- a/routes/api.php +++ b/routes/api.php @@ -196,6 +196,7 @@ Route::put('tasks/{task}/setPriority', [TaskController::class, 'setPriority'])->name('tasks.priority'); // TaskDrafts + Route::get('drafts/{task}', [TaskDraftController::class, 'index'])->name('taskdraft.index'); Route::put('drafts/{task}', [TaskDraftController::class, 'update'])->name('taskdraft.update'); Route::delete('drafts/{task}', [TaskDraftController::class, 'delete'])->name('taskdraft.delete'); From a795af01bb9be96873db011b6be0b8d0f8330f95 Mon Sep 17 00:00:00 2001 From: CarliPinell Date: Wed, 22 May 2024 14:22:22 +0000 Subject: [PATCH 03/94] Ready for PR1 --- .../components/InboxRuleFillData.vue | 13 ++++++++++++- .../js/tasks/components/QuickFillPreview.vue | 18 ++---------------- 2 files changed, 14 insertions(+), 17 deletions(-) diff --git a/resources/js/inbox-rules/components/InboxRuleFillData.vue b/resources/js/inbox-rules/components/InboxRuleFillData.vue index ce5a5f0364..b9ff5e4afa 100644 --- a/resources/js/inbox-rules/components/InboxRuleFillData.vue +++ b/resources/js/inbox-rules/components/InboxRuleFillData.vue @@ -44,7 +44,18 @@ this.$emit("data", this.formData); }, propInboxQuickFill() { - this.formData = _.merge({}, this.formData, this.propInboxQuickFill); + console.log("InboxRuleFillData this.formData: ",this.formData); + console.log("InboxRuleFillData this.propInboxQuickFill: ",this.propInboxQuickFill); + //this.formData = _.merge({}, this.formData, this.propInboxQuickFill); + this.formData = _.mergeWith(this.formData, this.propInboxQuickFill, + (objValue, srcValue) => { + // If object value is falsy returns value from source(event.detail) + if (!objValue) { + return srcValue; + } + // Otherwise, keeps object value(this.formData) + return objValue; + }); this.iframeContentWindow.location.reload(); } }, diff --git a/resources/js/tasks/components/QuickFillPreview.vue b/resources/js/tasks/components/QuickFillPreview.vue index 6f4df64f13..b91ac091b2 100644 --- a/resources/js/tasks/components/QuickFillPreview.vue +++ b/resources/js/tasks/components/QuickFillPreview.vue @@ -270,30 +270,16 @@ export default { this.$emit("close"); }, buttonThisDataFromFullTask(data) { - // return ProcessMaker.apiClient - // .put("drafts/" + this.task.id, data) - // .then((response) => { - // this.task.draft = _.merge({}, this.task.draft, response.data); - // window.location.href = `/tasks/${this.task.id}/edit`; - // ProcessMaker.alert(this.$t("Task Filled successfully."), "success"); - // }) - // .catch((error) => { - // console.error("Error", error); - // }); - if (this.propFromButton === "fullTask") { return new Promise((resolve, reject) => { ProcessMaker.apiClient.get("drafts/" + this.task.id) .then(responseGet => { const dataFromGet = responseGet.data; if (Array.isArray(dataFromGet) && dataFromGet.length === 0) { - console.log("devuelve array vacio: ", dataFromGet); - // Si dataFromGet es un array vacío, mantén la variable data original + // If dataFromGet is an empty array keeps original form data resolve(data); } else { - console.log("devuelve objeto"); - // Si dataFromGet no es un array vacío, asigna su valor a data - //const newData = dataFromGet; + // If dataFromGet is an object asigns its value to form data const newData = _.mergeWith( _.cloneDeep(dataFromGet), data, From 83e35f9a13a46c917017cf812226cefc5e253e41 Mon Sep 17 00:00:00 2001 From: CarliPinell Date: Wed, 22 May 2024 14:42:49 +0000 Subject: [PATCH 04/94] Ready for PR 2 --- resources/js/inbox-rules/components/InboxRuleFillData.vue | 3 --- 1 file changed, 3 deletions(-) diff --git a/resources/js/inbox-rules/components/InboxRuleFillData.vue b/resources/js/inbox-rules/components/InboxRuleFillData.vue index b9ff5e4afa..82f627bbab 100644 --- a/resources/js/inbox-rules/components/InboxRuleFillData.vue +++ b/resources/js/inbox-rules/components/InboxRuleFillData.vue @@ -44,9 +44,6 @@ this.$emit("data", this.formData); }, propInboxQuickFill() { - console.log("InboxRuleFillData this.formData: ",this.formData); - console.log("InboxRuleFillData this.propInboxQuickFill: ",this.propInboxQuickFill); - //this.formData = _.merge({}, this.formData, this.propInboxQuickFill); this.formData = _.mergeWith(this.formData, this.propInboxQuickFill, (objValue, srcValue) => { // If object value is falsy returns value from source(event.detail) From 4be573aa15d6a1ce0433aebfb985bd88128abf58 Mon Sep 17 00:00:00 2001 From: CarliPinell Date: Wed, 22 May 2024 14:57:27 +0000 Subject: [PATCH 05/94] Ready for PR 3 --- .../js/tasks/components/QuickFillPreview.vue | 86 ++++++++----------- 1 file changed, 35 insertions(+), 51 deletions(-) diff --git a/resources/js/tasks/components/QuickFillPreview.vue b/resources/js/tasks/components/QuickFillPreview.vue index b91ac091b2..044e2871c2 100644 --- a/resources/js/tasks/components/QuickFillPreview.vue +++ b/resources/js/tasks/components/QuickFillPreview.vue @@ -270,64 +270,48 @@ export default { this.$emit("close"); }, buttonThisDataFromFullTask(data) { - if (this.propFromButton === "fullTask") { - return new Promise((resolve, reject) => { - ProcessMaker.apiClient.get("drafts/" + this.task.id) - .then(responseGet => { - const dataFromGet = responseGet.data; - if (Array.isArray(dataFromGet) && dataFromGet.length === 0) { - // If dataFromGet is an empty array keeps original form data - resolve(data); - } else { - // If dataFromGet is an object asigns its value to form data - const newData = _.mergeWith( - _.cloneDeep(dataFromGet), - data, - (objValue, srcValue) => { - // If object value is falsy returns value from source(event.detail) - if (!objValue) { - return srcValue; - } - // Otherwise, keeps object value(this.formData) - return objValue; - } - ); - resolve(newData); + return new Promise((resolve, reject) => { + ProcessMaker.apiClient.get("drafts/" + this.task.id) + .then(responseGet => { + const dataFromGet = responseGet.data; + if (Array.isArray(dataFromGet) && dataFromGet.length === 0) { + // If dataFromGet is an empty array keeps original form data + resolve(data); + } else { + // If dataFromGet is an object asigns its value to form data + const newData = _.mergeWith( + _.cloneDeep(dataFromGet), + data, + (objValue, srcValue) => { + // If object value is falsy returns value from source(data) + if (!objValue) { + return srcValue; + } + // Otherwise, keeps object value(dataFromGet) + return objValue; } - }) - .catch(errorGet => { - reject(errorGet); - }); + ); + resolve(newData); + } }) - .then(dataToUse => { - return ProcessMaker.apiClient.put("drafts/" + this.task.id, dataToUse) - .then(responsePut => { - this.task.draft = _.merge({}, this.task.draft, responsePut.data); - window.location.href = `/tasks/${this.task.id}/edit`; - ProcessMaker.alert(this.$t("Task Filled successfully."), "success"); - }) - .catch(errorPut => { - console.error("Error", errorPut); - }); + .catch(errorGet => { + reject(errorGet); + }); + }) + .then(dataToUse => { + return ProcessMaker.apiClient.put("drafts/" + this.task.id, dataToUse) + .then(responsePut => { + this.task.draft = _.merge({}, this.task.draft, responsePut.data); + window.location.href = `/tasks/${this.task.id}/edit`; + ProcessMaker.alert(this.$t("Task Filled successfully."), "success"); }) - .catch(error => { - console.error("Error", error); + .catch(errorPut => { + console.error("Error", errorPut); }); - } else { - return ProcessMaker.apiClient - .put("drafts/" + this.task.id, data) - .then((response) => { - this.task.draft = _.merge({}, this.task.draft, response.data); - window.location.href = `/tasks/${this.task.id}/edit`; - ProcessMaker.alert(this.$t("Task Filled successfully."), "success"); }) - .catch((error) => { + .catch(error => { console.error("Error", error); }); - - } - - }, /* * To do: There's a global-search-bar class with a large z-index. We added a class From 8b0140ccd38586930594181afcd164aab59c8f14 Mon Sep 17 00:00:00 2001 From: Gustavo Bascope Date: Wed, 22 May 2024 15:43:51 -0400 Subject: [PATCH 06/94] adjust the size of the priority column --- resources/js/components/shared/FilterTable.vue | 9 +++++++-- resources/js/tasks/components/TasksList.vue | 13 ++++++++++--- 2 files changed, 17 insertions(+), 5 deletions(-) diff --git a/resources/js/components/shared/FilterTable.vue b/resources/js/components/shared/FilterTable.vue index c76569e947..a92309bd5b 100644 --- a/resources/js/components/shared/FilterTable.vue +++ b/resources/js/components/shared/FilterTable.vue @@ -22,6 +22,7 @@ :key="index" class="pm-table-ellipsis-column" :class="{ 'pm-table-filter-applied': column.filterApplied }" + :style="{ width: column.fixed_width + 'px' }" >
# ${processRequest.case_number || record.case_number} `; @@ -443,7 +443,7 @@ export default { } return ` ${draftBadge} - ${ processRequest.case_title_formatted || @@ -503,7 +503,8 @@ export default { field: "is_priority", sortable: false, default: true, - width: 40, + fixed_width: 20, + resizable: false, }, { label: "Process", @@ -723,9 +724,15 @@ export default { } this.isTooltipVisible = false; }, + removeBadgeSpan(html) { + const badgeSpanRegex = /([^<]+)<\/span>/g; + console.log(html.replace(badgeSpanRegex, "")); + return html.replace(badgeSpanRegex, ""); + }, sanitizeTooltip(html) { let cleanHtml = html.replace(/[\s\S]*?<\/script>/gi, ""); cleanHtml = cleanHtml.replace(/[\s\S]*?<\/style>/gi, ""); + cleanHtml = this.removeBadgeSpan(cleanHtml); cleanHtml = cleanHtml.replace( /<(?!img|input|meta|time|button|select|textarea|datalist|progress|meter)[^>]*>/gi, "" From f0b91f5956e3d0866965e83af442d6fb4e401f30 Mon Sep 17 00:00:00 2001 From: Nolan Ehrstrom Date: Wed, 22 May 2024 14:12:03 -0700 Subject: [PATCH 07/94] Refactor quickfill from full screen --- .../Http/Controllers/TaskController.php | 4 ++ .../js/tasks/components/QuickFillPreview.vue | 72 ++++++++----------- resources/views/tasks/editQuickFill.blade.php | 8 ++- 3 files changed, 40 insertions(+), 44 deletions(-) diff --git a/ProcessMaker/Http/Controllers/TaskController.php b/ProcessMaker/Http/Controllers/TaskController.php index f66d143828..cb8ccdc17d 100644 --- a/ProcessMaker/Http/Controllers/TaskController.php +++ b/ProcessMaker/Http/Controllers/TaskController.php @@ -165,8 +165,12 @@ public function edit(ProcessRequestToken $task, string $preview = '') public function quickFillEdit(ProcessRequestToken $task) { + $screenVersion = $task->getScreenVersion(); + $screenFields = $screenVersion ? $screenVersion->screenFilteredFields() : []; + return view('tasks.editQuickFill', [ 'task' => $task, + 'screenFields' => $screenFields, ]); } } diff --git a/resources/js/tasks/components/QuickFillPreview.vue b/resources/js/tasks/components/QuickFillPreview.vue index 044e2871c2..5cdc27e8a0 100644 --- a/resources/js/tasks/components/QuickFillPreview.vue +++ b/resources/js/tasks/components/QuickFillPreview.vue @@ -175,7 +175,7 @@ @@ -825,6 +855,14 @@ export default { width: 32px; height: 32px; } +.vertical-separator { + display: inline-block; + width: 1px; + height: 24px; + background-color: #ccc; /* Color del separador */ + margin: 0 8px; /* Espaciado alrededor del separador */ + vertical-align: middle; /* Alinear verticalmente con los botones */ +} diff --git a/resources/js/processes-catalogue/components/menuCatologue.vue b/resources/js/processes-catalogue/components/menuCatologue.vue index 83a4aec20f..103bafa69f 100644 --- a/resources/js/processes-catalogue/components/menuCatologue.vue +++ b/resources/js/processes-catalogue/components/menuCatologue.vue @@ -3,6 +3,7 @@
+
+
@import url("../../../sass/_scrollbar.scss"); +@import "~styles/variables"; i { font-size: 20px; color: #6a7888; @@ -313,4 +326,10 @@ i { padding: 12px 18px; gap: 16px; } + +.hide-on-mobile { + @media (max-width: $lp-breakpoint) { + display: none; + } +} diff --git a/resources/js/processes-catalogue/components/utils/Card.vue b/resources/js/processes-catalogue/components/utils/Card.vue index bd6731d64a..8afd51b6f0 100644 --- a/resources/js/processes-catalogue/components/utils/Card.vue +++ b/resources/js/processes-catalogue/components/utils/Card.vue @@ -4,15 +4,6 @@ class="card-process" > -
- -
+
+ +
@@ -101,7 +101,10 @@ export default { }; - + From 9609dd80435dc208d92fc92766a00cdc300f560e Mon Sep 17 00:00:00 2001 From: CarliPinell Date: Mon, 27 May 2024 16:39:57 -0400 Subject: [PATCH 21/94] Saving progress 1 --- .../components/ProcessCollapseInfo.vue | 25 +- .../components/ProcessOptions.vue | 20 +- .../components/ProcessesCarousel.vue | 306 +++++++++--------- .../optionsMenu/ChartSaveSearch.vue | 10 + .../optionsMenu/ProcessDescription.vue | 81 +++++ 5 files changed, 288 insertions(+), 154 deletions(-) create mode 100644 resources/js/processes-catalogue/components/optionsMenu/ProcessDescription.vue diff --git a/resources/js/processes-catalogue/components/ProcessCollapseInfo.vue b/resources/js/processes-catalogue/components/ProcessCollapseInfo.vue index a56527e5fa..6b35486343 100644 --- a/resources/js/processes-catalogue/components/ProcessCollapseInfo.vue +++ b/resources/js/processes-catalogue/components/ProcessCollapseInfo.vue @@ -64,7 +64,7 @@ >
-
+
- + - + @@ -285,4 +285,21 @@ export default { max-width: 100%; } } +.prev, +.next { + position: absolute; + top: 50%; + transform: translateY(-50%); + background-color: #333; + color: #fff; + border: none; + padding: 10px; + cursor: pointer; +} +.prev { + left: 0; +} +.next { + right: 0; +} diff --git a/resources/js/processes-catalogue/components/ProcessOptions.vue b/resources/js/processes-catalogue/components/ProcessOptions.vue index 8b028937da..016d9073b5 100644 --- a/resources/js/processes-catalogue/components/ProcessOptions.vue +++ b/resources/js/processes-catalogue/components/ProcessOptions.vue @@ -1,6 +1,9 @@ @@ -8,9 +11,10 @@ @@ -19,12 +23,18 @@ export default { .section-options { display: flex; flex-direction: column; - align-items: center; + width: 98.5%; + margin-top: 20px; } -@media (width < 1200px) { +.left-column { + display: flex; + flex-direction: column; + align-items: flex-start; +} +@media (max-width: 2560px) { .section-options { - align-items: flex-start; flex-direction: row; + justify-content: space-between; } } diff --git a/resources/js/processes-catalogue/components/ProcessesCarousel.vue b/resources/js/processes-catalogue/components/ProcessesCarousel.vue index 8b406bd790..d118d31126 100644 --- a/resources/js/processes-catalogue/components/ProcessesCarousel.vue +++ b/resources/js/processes-catalogue/components/ProcessesCarousel.vue @@ -1,48 +1,59 @@