From 0c88efc291a5a1af06af0f248a3d5a96812fb4d7 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Fri, 29 Mar 2024 01:29:45 +0100
Subject: [PATCH] refs #6321 feat: status response after split

---
 src/css/app.scss                              |  7 +-
 src/css/quasar.variables.scss                 |  2 +-
 .../Ticket/Negative/TicketLackDialog.vue      | 77 ++++++++++++++-----
 .../Ticket/Negative/TicketLackDialogProxy.vue |  2 +-
 4 files changed, 66 insertions(+), 22 deletions(-)

diff --git a/src/css/app.scss b/src/css/app.scss
index 540fad175..757a4a2c0 100644
--- a/src/css/app.scss
+++ b/src/css/app.scss
@@ -130,4 +130,9 @@ input::-webkit-inner-spin-button {
     appearance: none;
     -webkit-appearance: none;
     -moz-appearance: none;
-}
\ No newline at end of file
+}
+
+.remove-bg {
+    filter: brightness(1.1);
+    mix-blend-mode: multiply;
+}
diff --git a/src/css/quasar.variables.scss b/src/css/quasar.variables.scss
index 8423a9a35..1960d7ccc 100644
--- a/src/css/quasar.variables.scss
+++ b/src/css/quasar.variables.scss
@@ -13,7 +13,7 @@
 // Tip: Use the "Theme Builder" on Quasar's documentation website.
 // Tip: to add new colors https://quasar.dev/style/color-palette/#adding-your-own-colors
 $primary: #ec8916;
-$secondary: $primary;
+$secondary: #89be34;
 $positive: #c8e484;
 $negative: #fb5252;
 $info: #84d0e2;
diff --git a/src/pages/Ticket/Negative/TicketLackDialog.vue b/src/pages/Ticket/Negative/TicketLackDialog.vue
index 173cf0ce3..d40c6ee99 100644
--- a/src/pages/Ticket/Negative/TicketLackDialog.vue
+++ b/src/pages/Ticket/Negative/TicketLackDialog.vue
@@ -221,11 +221,11 @@ const tableColumnComponents = computed(() => ({
         },
         event: getInputEvents,
     },
-    actions: {
-        component: QBtn,
-        props: {},
-        event: getInputEvents,
-    },
+    // actions: {
+    //     component: QBtn,
+    //     props: {},
+    //     event: getInputEvents,
+    // },
 }));
 
 const columns = computed(() => [
@@ -316,11 +316,11 @@ const columns = computed(() => [
         field: 'peticionCompra',
         align: 'center',
     },
-    {
-        name: 'actions',
-        label: t('claim.summary.actions'),
-        align: 'center',
-    },
+    // {
+    //     name: 'actions',
+    //     label: t('claim.summary.actions'),
+    //     align: 'center',
+    // },
 ]);
 
 const emit = defineEmits([...useDialogPluginComponent.emits, 'selection']);
@@ -328,6 +328,7 @@ function rowsHasSelected({ keys }) {
     emit('selection', keys);
 }
 // const confirmationModal = ref(false);
+const resultSplit = ref([]);
 const split = async ({ simple }, data = []) => {
     openConfirmationModal(
         t('Confirm splitAll'),
@@ -335,7 +336,10 @@ const split = async ({ simple }, data = []) => {
         null,
         () => {
             const body = simple ? data : selectedRows.value;
-            axios.post(`Tickets/split`, body);
+            // axios.post(`Tickets/split`, body).then((data) => {
+            //     resultSplit.value = data;
+            // });
+            resultSplit.value = [{ ticketFk: 14, message: 'split' }];
         }
     );
     // confirmationModal.value = true;
@@ -361,6 +365,23 @@ defineExpose({ split });
 
     await axios.post(`TicketTrackings/changeState`, formData);*/
 // }
+
+function getIcon(key, prop) {
+    const ticket = resultSplit.value.find((val) => val.ticketFk === key);
+    if (!ticket) return;
+    const { message } = ticket;
+    const icons = {
+        split: {
+            name: 'check_circle',
+            color: 'secondary',
+        },
+        noSplit: {
+            name: 'warning',
+            color: 'primary',
+        },
+    };
+    return icons[message][prop];
+}
 </script>
 
 <template>
@@ -396,10 +417,33 @@ defineExpose({ split });
                 <template #body="props">
                     <QTr>
                         <QTd>
+                            <QIcon
+                                v-if="resultSplit.length > 0"
+                                :name="getIcon(props.key, 'name')"
+                                :color="getIcon(props.key, 'color')"
+                                class="fill-icon q-mr-sm"
+                                size="xs"
+                                style="font-weight: bold"
+                            />
+                            <!-- <QIcon
+                                name="warning"
+                                color="primary"
+                                class="fill-icon q-mr-sm"
+                                size="xs"
+                                style="font-weight: bold"
+                            />
+                            <QIcon
+                                name="check_circle"
+                                class="fill-icon q-mr-sm"
+                                size="xs"
+                                color="secondary"
+                                style="font-weight: bold"
+                            /> -->
+
                             <QCheckbox v-model="props.selected" />
                         </QTd>
                         <QTd v-for="col in props.cols" :key="col.name">
-                            <template v-if="col.name == 'actions'">
+                            <!-- <template v-if="col.name == 'actions'">
                                 <QBtn
                                     round
                                     color="primary"
@@ -410,13 +454,8 @@ defineExpose({ split });
                                         {{ t('globals.split') }}
                                     </QTooltip>
                                 </QBtn>
-                            </template>
-                            <template
-                                v-if="
-                                    col.name !== 'actions' &&
-                                    tableColumnComponents[col.name]?.component
-                                "
-                            >
+                            </template> -->
+                            <template v-if="tableColumnComponents[col.name]?.component">
                                 <component
                                     :is="tableColumnComponents[col.name].component"
                                     v-bind="tableColumnComponents[col.name].props"
diff --git a/src/pages/Ticket/Negative/TicketLackDialogProxy.vue b/src/pages/Ticket/Negative/TicketLackDialogProxy.vue
index 5f557fbdf..57946472a 100644
--- a/src/pages/Ticket/Negative/TicketLackDialogProxy.vue
+++ b/src/pages/Ticket/Negative/TicketLackDialogProxy.vue
@@ -40,7 +40,7 @@ async function splitAll() {
                     :ratio="1"
                     height="50px"
                     width="50px"
-                    class="image"
+                    class="image remove-bg"
                 />
 
                 <span class="text-h6 text-grey">{{ ticket.longName }}</span>