From 1a68f31362292047f73f74706eae5ec97e845438 Mon Sep 17 00:00:00 2001
From: fabio <fabio.guachalla@processmaker.com>
Date: Wed, 1 Sep 2021 16:14:42 -0400
Subject: [PATCH] PMCORE-3268:Preview does not work in mode edit

Correction ellipsis

CR
---
 .../js/admin/Modals/ModalDeleteCaseList.vue   |  1 +
 .../assets/js/admin/Modals/ModalPreview.vue   | 86 +++++++++++--------
 .../customCaseList/CaseListSketch.vue         | 55 ++++++++++--
 .../admin/settings/customCaseList/Tables.vue  |  5 +-
 resources/assets/js/api/Cases.js              |  2 +-
 5 files changed, 103 insertions(+), 46 deletions(-)

diff --git a/resources/assets/js/admin/Modals/ModalDeleteCaseList.vue b/resources/assets/js/admin/Modals/ModalDeleteCaseList.vue
index 48cda9943..9c3e14721 100644
--- a/resources/assets/js/admin/Modals/ModalDeleteCaseList.vue
+++ b/resources/assets/js/admin/Modals/ModalDeleteCaseList.vue
@@ -58,6 +58,7 @@ export default {
                 if (response.statusText === "OK") {
                     that.$refs["modal-delete-list"].hide();
                     that.$parent.$refs["table"].getData();
+                    that.$parent.$refs['ellipsis-' + that.data.id].hideActionButtons();
                 }
             });
         }
diff --git a/resources/assets/js/admin/Modals/ModalPreview.vue b/resources/assets/js/admin/Modals/ModalPreview.vue
index 837dd74f9..1b6a94958 100644
--- a/resources/assets/js/admin/Modals/ModalPreview.vue
+++ b/resources/assets/js/admin/Modals/ModalPreview.vue
@@ -98,6 +98,14 @@ export default {
                     return this.$parent.$parent.$parent.$parent.getCasesForPreview(data)
                 },
             },
+            customCaseId: '',
+            statusTitle: {
+                ON_TIME: this.$i18n.t("ID_IN_PROGRESS"),
+                OVERDUE: this.$i18n.t("ID_TASK_OVERDUE"),
+                DRAFT: this.$i18n.t("ID_IN_DRAFT"),
+                PAUSED: this.$i18n.t("ID_PAUSED"),
+                UNASSIGNED: this.$i18n.t("ID_UNASSIGNED"),
+            },
         }
     },
     mounted() {
@@ -119,25 +127,19 @@ export default {
                 paged,
                 limit = data.limit,
                 start = data.page === 1 ? 0 : limit * (data.page - 1),
-                filters = {},
-                sort = "";
+                filters = {};
             paged = start + "," + limit;
             filters = {
                 paged: paged,
             }
-            _.forIn(this.filters, function (item, key) {
-                if(filters && item.value) {
-                    filters[item.filterVar] = item.value;
-                }
-            });
-            if (sort) {
-              filters["sort"] = sort;
+            if (this.customCaseId !== '') {
+                filters['id'] = this.customCaseId;
             }
             return new Promise((resolutionFunc, rejectionFunc) => {
                 switch (that.type) {
                     case 'inbox':
                         api.cases
-                        .todo(filters)
+                        .inbox(filters)
                         .then((response) => {
                             dt = that.formatDataResponse(response.data.data);
                             resolutionFunc({
@@ -195,39 +197,47 @@ export default {
             });
         },
         /**
-         * Format Response API to grid todo and columns
+         * Format Response API custom case list to grid todo and columns
+         * @param {object} response
+         * @returns {object}
          */
         formatDataResponse(response) {
             let data = [];
             _.forEach(response, (v) => {
                 data.push({
-                    CASE_NUMBER: v.APP_NUMBER,
-                    CASE_TITLE: v.DEL_TITLE,
-                    PROCESS_NAME: v.PRO_TITLE,
-                    TASK: [{
-                        TITLE: v.TAS_TITLE,
-                        CODE_COLOR: v.TAS_COLOR,
-                        COLOR: v.TAS_COLOR_LABEL,
-                        DELAYED_TITLE:
-                        v.TAS_STATUS === "OVERDUE"
-                            ? this.$i18n.t("ID_DELAYED") + ":"
-                            : this.statusTitle[v.TAS_STATUS],
-                        DELAYED_MSG: v.TAS_STATUS === "OVERDUE" ? v.DELAY : "",
-                    }],
-                    USER_DATA: this.formatUser(v.SEND_BY_INFO),
-                    USERNAME_DISPLAY_FORMAT: utils.userNameDisplayFormat({
-                        userName: v.USR_LASTNAME,
-                        firstName: v.USR_LASTNAME,
-                        lastName: v.USR_LASTNAME,
-                        format: window.config.FORMATS.format || null,
-                    }),
-                    DUE_DATE: v.DEL_TASK_DUE_DATE_LABEL,
-                    DELEGATION_DATE: v.DEL_DELEGATE_DATE_LABEL,
-                    PRIORITY: v.DEL_PRIORITY_LABEL,
-                    DEL_INDEX: v.DEL_INDEX,
-                    APP_UID: v.APP_UID,
-                    PRO_UID: v.PRO_UID,
-                    TAS_UID: v.TAS_UID,
+                    ...v,
+                    ...{
+                        CASE_NUMBER: v.APP_NUMBER,
+                        CASE_TITLE: v.DEL_TITLE,
+                        PROCESS_NAME: v.PRO_TITLE,
+                        TASK: [
+                            {
+                                TITLE: v.TAS_TITLE,
+                                CODE_COLOR: v.TAS_COLOR,
+                                COLOR: v.TAS_COLOR_LABEL,
+                                DELAYED_TITLE:
+                                    v.TAS_STATUS === "OVERDUE"
+                                        ? this.$i18n.t("ID_DELAYED") + ":"
+                                        : this.statusTitle[v.TAS_STATUS],
+                                DELAYED_MSG:
+                                    v.TAS_STATUS === "OVERDUE" ? v.DELAY : "",
+                            },
+                        ],
+                        USER_DATA: this.formatUser(v.SEND_BY_INFO),
+                        USERNAME_DISPLAY_FORMAT: utils.userNameDisplayFormat({
+                            userName: v.USR_LASTNAME,
+                            firstName: v.USR_LASTNAME,
+                            lastName: v.USR_LASTNAME,
+                            format: window.config.FORMATS.format || null,
+                        }),
+                        DUE_DATE: v.DEL_TASK_DUE_DATE_LABEL,
+                        DELEGATION_DATE: v.DEL_DELEGATE_DATE_LABEL,
+                        PRIORITY: v.DEL_PRIORITY_LABEL,
+                        DEL_INDEX: v.DEL_INDEX,
+                        APP_UID: v.APP_UID,
+                        PRO_UID: v.PRO_UID,
+                        TAS_UID: v.TAS_UID,
+                    }
                 });
             });
             return data;
diff --git a/resources/assets/js/admin/settings/customCaseList/CaseListSketch.vue b/resources/assets/js/admin/settings/customCaseList/CaseListSketch.vue
index 8ded71460..def7983f7 100644
--- a/resources/assets/js/admin/settings/customCaseList/CaseListSketch.vue
+++ b/resources/assets/js/admin/settings/customCaseList/CaseListSketch.vue
@@ -1,5 +1,6 @@
 <template>
     <div id="home">
+        <ModalPreview ref="modal-preview"></ModalPreview>
         <div class="demo">
             <div class="container">
                 <h5>{{ $t("ID_NEW_CASES_LISTS") }} ({{ module.title }})</h5>
@@ -284,7 +285,7 @@
                         <b-button tvariant="danger" @click="onCancel">{{
                             $t("ID_CANCEL")
                         }}</b-button>
-                        <b-button variant="outline-primary">{{
+                        <b-button variant="outline-primary" @click="showPreview">{{
                             $t("ID_PREVIEW")
                         }}</b-button>
                         <b-button type="submit" variant="primary">{{
@@ -301,6 +302,7 @@ import utils from "../../../utils/utils";
 import Multiselect from "vue-multiselect";
 import Api from "./Api/CaseList";
 import IconPicker from "../../../components/iconPicker/IconPicker.vue";
+import ModalPreview from "../../Modals/ModalPreview.vue";
 
 export default {
     name: "CaseListSketh",
@@ -308,6 +310,7 @@ export default {
         Multiselect,
         IconPicker,
         IconPicker,
+        ModalPreview,
     },
     props: ["params", "module"],
     data() {
@@ -370,7 +373,8 @@ export default {
             defaultCaseList: [],
             isValidName: null,
             isValidTable: null,
-            pmTable: null
+            pmTable: null,
+            isPreview: false
         };
     },
     computed: {
@@ -603,6 +607,7 @@ export default {
          * On submit event handler
          */
         onSubmit() {
+            let that = this;
             this.isValidName = true;
             this.isValidTable = true;
             if (!this.params.name) {
@@ -621,7 +626,15 @@ export default {
                 delete this.params["tableName"];
                 Api.updateCaseList(this.params)
                 .then((response) => {
-                    this.$emit("closeSketch");
+                    if (that.isPreview) {
+                        that.$refs["modal-preview"].columns = that.getColumns();
+                        that.$refs["modal-preview"].type = that.params.type;
+                        that.$refs["modal-preview"].customCaseId = that.params.id;
+                        that.$refs["modal-preview"].show();
+                        that.isPreview = false;
+                    } else {
+                        this.$emit("closeSketch");
+                    }
                 })
                 .catch((err) => {
                     this.makeToast('danger', this.$i18n.t('ID_ERROR'), err.response.statusText);
@@ -630,8 +643,16 @@ export default {
             } else {
                 Api.createCaseList(this.params)
                 .then((response) => {
-                    this.$emit("closeSketch");
-                
+                    if (that.isPreview) {
+                        that.params.id = response.data.id;
+                        that.$refs["modal-preview"].columns = that.getColumns();
+                        that.$refs["modal-preview"].type = that.params.type;
+                        that.$refs["modal-preview"].customCaseId = that.params.id;
+                        that.$refs["modal-preview"].show();
+                        that.isPreview = false;
+                    } else {
+                        this.$emit("closeSketch");
+                    }
                 })
                 .catch((err) => {
                     this.makeToast('danger',this.$i18n.t('ID_ERROR') ,err.response.statusText);
@@ -691,6 +712,30 @@ export default {
             .catch((e) => {
                 console.error(e);
             })
+        },
+        /**
+         * Show modal preview
+         */
+        showPreview() {
+            this.isPreview = true;
+            this.onSubmit();
+        },
+        /**
+         * Get columns to show in the preview
+         */
+        getColumns() {
+            var columns = [],
+                auxColumn,
+                i;
+            for (i = 0; i < this.dataCaseList.length; i += 1) {
+                auxColumn = this.dataCaseList[i];
+                if (auxColumn.set) {
+                    columns.push(auxColumn.field);
+                }
+            }
+            columns.push('actions');
+            columns.unshift('detail');
+            return columns
         }
     },
 };
diff --git a/resources/assets/js/admin/settings/customCaseList/Tables.vue b/resources/assets/js/admin/settings/customCaseList/Tables.vue
index 50cc6fb31..2fa03fb0c 100644
--- a/resources/assets/js/admin/settings/customCaseList/Tables.vue
+++ b/resources/assets/js/admin/settings/customCaseList/Tables.vue
@@ -13,7 +13,7 @@
     >
         <div slot="actions" slot-scope="props">
             <div @click="updateDataEllipsis(props.row)">
-                <ellipsis ref="ellipsis" v-if="dataEllipsis" :data="dataEllipsis"> </ellipsis>
+                <ellipsis :ref="`ellipsis-${props.row.id}`" v-if="dataEllipsis" :data="dataEllipsis"> </ellipsis>
             </div>
         </div>
         <div slot="owner" slot-scope="props">
@@ -196,6 +196,7 @@ export default {
         showPreview(data) {
             this.$refs["modal-preview"].columns = this.getColumns(data);
             this.$refs["modal-preview"].type = data.type;
+            this.$refs["modal-preview"].customCaseId = data.id;
             this.$refs["modal-preview"].show();
         },
         /**
@@ -297,7 +298,7 @@ export default {
                                 that.downloadCaseList(data);
                             }
                         },
-                        pause: {
+                        preview: {
                             name: "preview",
                             icon: "fas fa-tv",
                             color: "green",
diff --git a/resources/assets/js/api/Cases.js b/resources/assets/js/api/Cases.js
index 8af5e4dac..a6e3ce1a8 100644
--- a/resources/assets/js/api/Cases.js
+++ b/resources/assets/js/api/Cases.js
@@ -27,7 +27,7 @@ export let cases = {
         }
         return Api.get({
             service,
-            params: data.filters,
+            params: data,
             keys
         });
     },