From 037b30904fb87ca304bd4492007f55dc28f551ea Mon Sep 17 00:00:00 2001
From: Rodrigo Quelca <rodrigo@processmaker.com>
Date: Mon, 20 Sep 2021 19:26:02 +0000
Subject: [PATCH] PMCORE-3320: The case notes in tasks is opening the Case
 Details instead of the popup of cases notes PMCORE_3.7.0 build

---
 resources/assets/js/home/Draft/Draft.vue      | 60 ++++++++++++++++++-
 resources/assets/js/home/Inbox/Inbox.vue      | 58 +++++++++++++++++-
 resources/assets/js/home/Paused/Paused.vue    | 58 +++++++++++++++++-
 .../assets/js/home/Unassigned/Unassigned.vue  | 58 +++++++++++++++++-
 4 files changed, 229 insertions(+), 5 deletions(-)

diff --git a/resources/assets/js/home/Draft/Draft.vue b/resources/assets/js/home/Draft/Draft.vue
index 2bea8e1f0..0ccbce242 100644
--- a/resources/assets/js/home/Draft/Draft.vue
+++ b/resources/assets/js/home/Draft/Draft.vue
@@ -2,6 +2,15 @@
   <div id="v-draft" ref="v-draft" class="v-container-draft">
     <button-fleft :data="newCase"></button-fleft>
     <modal-new-request ref="newRequest"></modal-new-request>
+    <b-alert
+        :show="dataAlert.dismissCountDown"
+        dismissible
+        :variant="dataAlert.variant"
+        @dismissed="dataAlert.dismissCountDown = 0"
+        @dismiss-count-down="countDownChanged"
+    >
+        {{ dataAlert.message }}
+    </b-alert>
     <CasesFilter
       :filters="filters"
       :title="$t('ID_DRAFT')"
@@ -186,6 +195,10 @@
         </span>
       </div>
     </VueListView>
+    <ModalComments
+        ref="modal-comments"
+        @postNotes="onPostNotes"
+    ></ModalComments>
   </div>
 </template>
 
@@ -193,6 +206,7 @@
 import HeaderCounter from "../../components/home/HeaderCounter.vue";
 import ButtonFleft from "../../components/home/ButtonFleft.vue";
 import ModalNewRequest from "../ModalNewRequest.vue";
+import ModalComments from "../modal/ModalComments.vue";
 import CasesFilter from "../../components/search/CasesFilter";
 import TaskCell from "../../components/vuetable/TaskCell.vue";
 import api from "../../api/index";
@@ -216,12 +230,19 @@ export default {
     Ellipsis,
     MultiviewHeader,
     VueCardView,
-    VueListView
+    VueListView,
+    ModalComments
   },
   props: ["defaultOption", "settings"],
   data() {
     let that = this;
     return {
+      dataAlert: {
+          dismissSecs: 5,
+          dismissCountDown: 0,
+          message: "",
+          variant: "info",
+      },
       columMap: {
           case_number: "APP_NUMBER",
           case_title: "DEL_TITLE",
@@ -624,13 +645,48 @@ export default {
               name: "case note",
               icon: "far fa-comments",
               fn: function() {
-                that.openCaseDetail(data);
+                that.openComments(data);
               }
             },
           }
         }
       }
     },
+    /**
+     * Show the alert message
+     * @param {string} message - message to be displayen in the body
+     * @param {string} type - alert type
+     */
+    showAlert(message, type) {
+        this.dataAlert.message = message;
+        this.dataAlert.variant = type || "info";
+        this.dataAlert.dismissCountDown = this.dataAlert.dismissSecs;
+    },
+    /**
+     * Updates the alert dismiss value to update
+     * dismissCountDown and decrease
+     * @param {mumber}
+     */
+    countDownChanged(dismissCountDown) {
+        this.dataAlert.dismissCountDown = dismissCountDown;
+    },
+    /**
+     * Open the case notes modal
+     * @param {object} data - needed to create the data
+     */
+    openComments(data) {
+        let that = this;
+        api.cases.open(_.extend({ ACTION: "todo" }, data)).then(() => {
+            that.$refs["modal-comments"].dataCase = data;
+            that.$refs["modal-comments"].show();
+        });
+    },
+    /**
+     * Post notes event handler
+     */
+    onPostNotes() {
+        this.$refs["vueTable"].getData();
+    },
   },
 };
 </script>
diff --git a/resources/assets/js/home/Inbox/Inbox.vue b/resources/assets/js/home/Inbox/Inbox.vue
index 42155e9b7..6a4c0acd3 100644
--- a/resources/assets/js/home/Inbox/Inbox.vue
+++ b/resources/assets/js/home/Inbox/Inbox.vue
@@ -4,6 +4,15 @@
     <modal-new-request ref="newRequest"></modal-new-request>
     <ModalPauseCase ref="modal-pause-case"></ModalPauseCase>
     <ModalReassignCase ref="modal-reassign-case"></ModalReassignCase>
+    <b-alert
+        :show="dataAlert.dismissCountDown"
+        dismissible
+        :variant="dataAlert.variant"
+        @dismissed="dataAlert.dismissCountDown = 0"
+        @dismiss-count-down="countDownChanged"
+    >
+        {{ dataAlert.message }}
+    </b-alert>
     <CasesFilter
       :filters="filters"
       :title="$t('ID_INBOX')"
@@ -209,6 +218,10 @@
         </span>
       </div>
     </VueListView>
+    <ModalComments
+        ref="modal-comments"
+        @postNotes="onPostNotes"
+    ></ModalComments>
   </div>
 </template>
 
@@ -227,6 +240,7 @@ import defaultMixins from "./defaultMixins";
 import Ellipsis from '../../components/utils/ellipsis.vue';
 import ModalPauseCase from '../modal/ModalPauseCase.vue';
 import ModalReassignCase from '../modal/ModalReassignCase.vue';
+import ModalComments from "../modal/ModalComments.vue";
 import { Event } from 'vue-tables-2';
 import CurrentUserCell from "../../components/vuetable/CurrentUserCell.vue";
 
@@ -246,11 +260,18 @@ export default {
     ModalPauseCase,
     ModalReassignCase,
     CurrentUserCell,
+    ModalComments
   },
   props: ["defaultOption", "settings"],
   data() {
     let that = this;
     return {
+      dataAlert: {
+          dismissSecs: 5,
+          dismissCountDown: 0,
+          message: "",
+          variant: "info",
+      },
       columMap: {
           case_number: "APP_NUMBER",
           case_title: "DEL_TITLE",
@@ -712,7 +733,7 @@ export default {
                 name: "case note",
                 icon: "far fa-comments",
                 fn: function() {
-                  that.openCaseDetail(data);
+                  that.openComments(data);
                 }
               },
               reassign: {
@@ -733,6 +754,41 @@ export default {
           }
         }
       },
+      /**
+       * Show the alert message
+       * @param {string} message - message to be displayen in the body
+       * @param {string} type - alert type
+       */
+      showAlert(message, type) {
+          this.dataAlert.message = message;
+          this.dataAlert.variant = type || "info";
+          this.dataAlert.dismissCountDown = this.dataAlert.dismissSecs;
+      },
+      /**
+       * Updates the alert dismiss value to update
+       * dismissCountDown and decrease
+       * @param {mumber}
+       */
+      countDownChanged(dismissCountDown) {
+          this.dataAlert.dismissCountDown = dismissCountDown;
+      },
+      /**
+       * Open the case notes modal
+       * @param {object} data - needed to create the data
+       */
+      openComments(data) {
+          let that = this;
+          api.cases.open(_.extend({ ACTION: "todo" }, data)).then(() => {
+              that.$refs["modal-comments"].dataCase = data;
+              that.$refs["modal-comments"].show();
+          });
+      },
+      /**
+       * Post notes event handler
+       */
+      onPostNotes() {
+          this.$refs["vueTable"].getData();
+      },
   },
 };
 </script>
diff --git a/resources/assets/js/home/Paused/Paused.vue b/resources/assets/js/home/Paused/Paused.vue
index 16d42471b..9c2d61b32 100644
--- a/resources/assets/js/home/Paused/Paused.vue
+++ b/resources/assets/js/home/Paused/Paused.vue
@@ -3,6 +3,15 @@
     <button-fleft :data="newCase"></button-fleft>
     <modal-new-request ref="newRequest"></modal-new-request>
     <ModalReassignCase ref="modal-reassign-case"></ModalReassignCase>
+    <b-alert
+        :show="dataAlert.dismissCountDown"
+        dismissible
+        :variant="dataAlert.variant"
+        @dismissed="dataAlert.dismissCountDown = 0"
+        @dismiss-count-down="countDownChanged"
+    >
+        {{ dataAlert.message }}
+    </b-alert>
     <CasesFilter
       :filters="filters"
       :title="$t('ID_PAUSED')"
@@ -208,6 +217,10 @@
         </span>
       </div>
     </VueListView>
+     <ModalComments
+        ref="modal-comments"
+        @postNotes="onPostNotes"
+    ></ModalComments>
     <ModalUnpauseCase ref="modal-unpause-case"></ModalUnpauseCase>
   </div>
 </template>
@@ -227,6 +240,7 @@ import VueListView from "../../components/dataViews/vueListView/VueListView.vue"
 import defaultMixins from "./defaultMixins";
 import Ellipsis from '../../components/utils/ellipsis.vue';
 import ModalReassignCase from '../modal/ModalReassignCase.vue';
+import ModalComments from "../modal/ModalComments.vue";
 import { Event } from 'vue-tables-2';
 import CurrentUserCell from "../../components/vuetable/CurrentUserCell.vue";
 
@@ -246,11 +260,18 @@ export default {
     VueListView,
     ModalReassignCase,
     CurrentUserCell,
+    ModalComments
   },
   props: ["defaultOption", "settings"],
   data() {
     let that = this;
     return {
+      dataAlert: {
+          dismissSecs: 5,
+          dismissCountDown: 0,
+          message: "",
+          variant: "info",
+      },
       columMap: {
           case_number: "APP_NUMBER",
           case_title: "DEL_TITLE",
@@ -695,7 +716,7 @@ export default {
               name: "case note",
               icon: "far fa-comments",
               fn: function() {
-                that.openCaseDetail(data);
+                that.openComments(data);
               }
             },
             play: {
@@ -716,6 +737,41 @@ export default {
         }
       }
     },
+    /**
+     * Show the alert message
+     * @param {string} message - message to be displayen in the body
+     * @param {string} type - alert type
+     */
+    showAlert(message, type) {
+        this.dataAlert.message = message;
+        this.dataAlert.variant = type || "info";
+        this.dataAlert.dismissCountDown = this.dataAlert.dismissSecs;
+    },
+    /**
+     * Updates the alert dismiss value to update
+     * dismissCountDown and decrease
+     * @param {mumber}
+     */
+    countDownChanged(dismissCountDown) {
+        this.dataAlert.dismissCountDown = dismissCountDown;
+    },
+    /**
+     * Open the case notes modal
+     * @param {object} data - needed to create the data
+     */
+    openComments(data) {
+        let that = this;
+        api.cases.open(_.extend({ ACTION: "todo" }, data)).then(() => {
+            that.$refs["modal-comments"].dataCase = data;
+            that.$refs["modal-comments"].show();
+        });
+    },
+    /**
+     * Post notes event handler
+     */
+    onPostNotes() {
+        this.$refs["vueTable"].getData();
+    },
   },
 };
 </script>
diff --git a/resources/assets/js/home/Unassigned/Unassigned.vue b/resources/assets/js/home/Unassigned/Unassigned.vue
index f6d347401..713f62991 100644
--- a/resources/assets/js/home/Unassigned/Unassigned.vue
+++ b/resources/assets/js/home/Unassigned/Unassigned.vue
@@ -9,6 +9,15 @@
       @onRemoveFilter="onRemoveFilter"
       @onUpdateFilters="onUpdateFilters"
     />
+     <b-alert
+        :show="dataAlert.dismissCountDown"
+        dismissible
+        :variant="dataAlert.variant"
+        @dismissed="dataAlert.dismissCountDown = 0"
+        @dismiss-count-down="countDownChanged"
+    >
+        {{ dataAlert.message }}
+    </b-alert>
     <multiview-header
       :data="dataMultiviewHeader"
       :dataSubtitle="dataSubtitle"
@@ -203,6 +212,10 @@
         </span>
       </div>
     </VueListView>
+    <ModalComments
+        ref="modal-comments"
+        @postNotes="onPostNotes"
+    ></ModalComments>
     <ModalClaimCase ref="modal-claim-case"></ModalClaimCase>
     <ModalPauseCase ref="modal-pause-case"></ModalPauseCase>
   </div>
@@ -223,6 +236,7 @@ import VueCardView from "../../components/dataViews/vueCardView/VueCardView.vue"
 import VueListView from "../../components/dataViews/vueListView/VueListView.vue";
 import defaultMixins from "./defaultMixins";
 import ModalPauseCase from '../modal/ModalPauseCase.vue';
+import ModalComments from "../modal/ModalComments.vue";
 import { Event } from 'vue-tables-2';
 import CurrentUserCell from "../../components/vuetable/CurrentUserCell.vue";
 
@@ -242,11 +256,18 @@ export default {
     VueListView,
     ModalPauseCase,
     CurrentUserCell,
+    ModalComments
   },
   props: ["defaultOption", "settings"],
   data() {
     let that = this;
     return {
+      dataAlert: {
+          dismissSecs: 5,
+          dismissCountDown: 0,
+          message: "",
+          variant: "info",
+      },
       columMap: {
           case_number: "APP_NUMBER",
           case_title: "DEL_TITLE",
@@ -665,7 +686,7 @@ export default {
               name: "case note",
               icon: "far fa-comments",
               fn: function() {
-                that.openCaseDetail(data);
+                that.openComments(data);
               }
             },
             pause: {
@@ -686,6 +707,41 @@ export default {
         }
       }
     },
+    /**
+     * Show the alert message
+     * @param {string} message - message to be displayen in the body
+     * @param {string} type - alert type
+     */
+    showAlert(message, type) {
+        this.dataAlert.message = message;
+        this.dataAlert.variant = type || "info";
+        this.dataAlert.dismissCountDown = this.dataAlert.dismissSecs;
+    },
+    /**
+     * Updates the alert dismiss value to update
+     * dismissCountDown and decrease
+     * @param {mumber}
+     */
+    countDownChanged(dismissCountDown) {
+        this.dataAlert.dismissCountDown = dismissCountDown;
+    },
+    /**
+     * Open the case notes modal
+     * @param {object} data - needed to create the data
+     */
+    openComments(data) {
+        let that = this;
+        api.cases.open(_.extend({ ACTION: "todo" }, data)).then(() => {
+            that.$refs["modal-comments"].dataCase = data;
+            that.$refs["modal-comments"].show();
+        });
+    },
+    /**
+     * Post notes event handler
+     */
+    onPostNotes() {
+        this.$refs["vueTable"].getData();
+    },
   },
 };
 </script>