From 6248a4117d06e60ee4f141dcb5b65969c590bfbe Mon Sep 17 00:00:00 2001
From: Jon <jon@verdnatura.es>
Date: Mon, 9 Sep 2024 13:52:41 +0200
Subject: [PATCH] refactor: refs #7553 requested changes

---
 src/components/CrudModel.vue                  |  2 +
 .../Ticket/Card/BasicData/TicketBasicData.vue | 12 ++--
 .../Card/BasicData/TicketBasicDataForm.vue    | 36 ++++++------
 .../Card/BasicData/TicketBasicDataView.vue    |  5 +-
 src/pages/Ticket/Card/TicketDescriptor.vue    | 56 ++++++++++++++++++-
 src/pages/Ticket/Card/TicketNotes.vue         |  7 ++-
 src/pages/Ticket/Card/TicketPackage.vue       | 25 +++++----
 src/pages/Ticket/Card/TicketSale.vue          |  6 +-
 src/pages/Ticket/Card/TicketSaleTracking.vue  | 40 ++++++++-----
 src/pages/Ticket/Card/TicketSummary.vue       | 53 ++++++++----------
 10 files changed, 150 insertions(+), 92 deletions(-)

diff --git a/src/components/CrudModel.vue b/src/components/CrudModel.vue
index 33c831e3f..f4797ffd4 100644
--- a/src/components/CrudModel.vue
+++ b/src/components/CrudModel.vue
@@ -234,6 +234,8 @@ async function remove(data) {
                 newData = newData.filter((form) => !ids.some((id) => id == form[pk]));
                 fetch(newData);
             });
+    } else {
+        reset();
     }
     emit('update:selected', []);
 }
diff --git a/src/pages/Ticket/Card/BasicData/TicketBasicData.vue b/src/pages/Ticket/Card/BasicData/TicketBasicData.vue
index 741231ca3..2ed84e50e 100644
--- a/src/pages/Ticket/Card/BasicData/TicketBasicData.vue
+++ b/src/pages/Ticket/Card/BasicData/TicketBasicData.vue
@@ -114,7 +114,7 @@ const totalNewPrice = computed(() => {
 const totalDifference = computed(() => {
     return rows.value.reduce((acc, item) => acc + item.component?.difference || 0, 0);
 });
-const showMovablecolumn = computed(() => (haveDifferences.value > 0 ? ['movable'] : []));
+const showMovableColumn = computed(() => (haveDifferences.value > 0 ? ['movable'] : []));
 const haveDifferences = computed(() => _ticketData.value.sale?.haveDifferences);
 const ticketHaveNegatives = () => {
     let _haveNegatives = false;
@@ -156,18 +156,18 @@ onUnmounted(() => (stateStore.rightDrawer = false));
                     {{ t('basicData.total') }}
                 </span>
             </QCardSection>
-            <QCardSection class="column items-center" horizontal>
+            <QCardSection class="column items-left" horizontal>
                 <span>
                     {{ t('basicData.price') }}:
                     {{ toCurrency(totalPrice) }}
                 </span>
             </QCardSection>
-            <QCardSection class="column items-center" horizontal>
+            <QCardSection class="column items-left" horizontal>
                 <span>
                     {{ t('basicData.newPrice') }}: {{ toCurrency(totalNewPrice) }}
                 </span>
             </QCardSection>
-            <QCardSection class="column items-center" horizontal>
+            <QCardSection class="column items-left" horizontal>
                 <span>
                     {{ t('basicData.difference') }}: {{ toCurrency(totalDifference) }}
                 </span>
@@ -220,7 +220,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
         </QCard>
     </QDrawer>
     <QTable
-        :visible-columns="showMovablecolumn"
+        :visible-columns="showMovableColumn"
         :rows="rows"
         :columns="columns"
         row-key="id"
@@ -238,7 +238,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
             </QTd>
         </template>
         <template #body-cell-description="{ row }">
-            <QTd>
+            <QTd style="display: contents">
                 <div class="column">
                     <span>{{ row.item.name }}</span>
                     <span class="color-vn-label">{{ row.item.subName }}</span>
diff --git a/src/pages/Ticket/Card/BasicData/TicketBasicDataForm.vue b/src/pages/Ticket/Card/BasicData/TicketBasicDataForm.vue
index 28c6fcf15..4b2e90a84 100644
--- a/src/pages/Ticket/Card/BasicData/TicketBasicDataForm.vue
+++ b/src/pages/Ticket/Card/BasicData/TicketBasicDataForm.vue
@@ -51,18 +51,18 @@ const agencyByWarehouseFilter = computed(() => ({
     },
 }));
 
-const zonesFilter = computed(() => ({
-    fields: ['id', 'name'],
-    order: 'name ASC',
-    where: formData.value?.agencyModeFk
-        ? {
-              shipped: formData.value?.shipped,
-              addressFk: formData.value?.addressFk,
-              agencyModeFk: formData.value?.agencyModeFk,
-              warehouseFk: formData.value?.warehouseFk,
-          }
-        : {},
-}));
+function zoneWhere() {
+    if (formData?.value?.agencyModeFk) {
+        return formData.value?.agencyModeFk
+            ? {
+                  shipped: formData.value?.shipped,
+                  addressFk: formData.value?.addressFk,
+                  agencyModeFk: formData.value?.agencyModeFk,
+                  warehouseFk: formData.value?.warehouseFk,
+              }
+            : {};
+    }
+}
 
 const getLanded = async (params) => {
     try {
@@ -293,13 +293,6 @@ onMounted(() => onFormModelInit());
         @on-fetch="(data) => (agenciesOptions = data)"
         auto-load
     />
-    <FetchData
-        ref="zonesFetchRef"
-        url="Zones/includingExpired"
-        :filter="zonesFilter"
-        @on-fetch="(data) => (zonesOptions = data)"
-        auto-load
-    />
     <QForm>
         <VnRow>
             <VnSelect
@@ -420,7 +413,10 @@ onMounted(() => onFormModelInit());
                 v-model="zoneId"
                 option-value="id"
                 option-label="name"
-                :options="zonesOptions"
+                url="Zones/includingExpired"
+                :fields="['id', 'name']"
+                sort-by="id"
+                :where="zoneWhere"
                 hide-selected
                 map-options
                 :required="true"
diff --git a/src/pages/Ticket/Card/BasicData/TicketBasicDataView.vue b/src/pages/Ticket/Card/BasicData/TicketBasicDataView.vue
index a88e5e6d6..92640f898 100644
--- a/src/pages/Ticket/Card/BasicData/TicketBasicDataView.vue
+++ b/src/pages/Ticket/Card/BasicData/TicketBasicDataView.vue
@@ -158,7 +158,10 @@ onBeforeMount(async () => await getTicketData());
         color="primary"
         animated
         keep-alive
-        style="max-width: 800px; margin: auto"
+        style="margin: auto"
+        :style="{
+            'max-width': step > 1 ? 'none' : '800px',
+        }"
     >
         <QStep :name="1" :title="t('globals.pageTitles.basicData')" :done="step > 1">
             <TicketBasicDataForm
diff --git a/src/pages/Ticket/Card/TicketDescriptor.vue b/src/pages/Ticket/Card/TicketDescriptor.vue
index b3dba2849..eef834cfa 100644
--- a/src/pages/Ticket/Card/TicketDescriptor.vue
+++ b/src/pages/Ticket/Card/TicketDescriptor.vue
@@ -2,13 +2,13 @@
 import { ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
-import { toDate } from 'src/filters';
 import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
 import CardDescriptor from 'components/ui/CardDescriptor.vue';
 import TicketDescriptorMenu from './TicketDescriptorMenu.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import useCardDescription from 'src/composables/useCardDescription';
 import VnUserLink from 'src/components/ui/VnUserLink.vue';
+import { toDateTimeFormat } from 'src/filters/date';
 
 const $props = defineProps({
     id: {
@@ -36,7 +36,18 @@ const filter = {
         {
             relation: 'client',
             scope: {
-                fields: ['id', 'name', 'salesPersonFk', 'phone', 'mobile', 'email'],
+                fields: [
+                    'id',
+                    'name',
+                    'salesPersonFk',
+                    'phone',
+                    'mobile',
+                    'email',
+                    'isActive',
+                    'isFreezed',
+                    'isTaxDataChecked',
+                    'hasElectronicInvoice',
+                ],
                 include: [
                     {
                         relation: 'user',
@@ -132,7 +143,10 @@ function ticketFilter(ticket) {
                     />
                 </template>
             </VnLv>
-            <VnLv :label="t('ticket.card.shipped')" :value="toDate(entity.shipped)" />
+            <VnLv
+                :label="t('ticket.card.shipped')"
+                :value="toDateTimeFormat(entity.shipped)"
+            />
             <VnLv
                 v-if="entity.agencyMode"
                 :label="t('ticket.card.agency')"
@@ -143,6 +157,38 @@ function ticketFilter(ticket) {
         </template>
         <template #icons="{ entity }">
             <QCardActions>
+                <QIcon
+                    v-if="entity.client.isActive == false"
+                    name="vn:disabled"
+                    size="xs"
+                    color="primary"
+                >
+                    <QTooltip>{{ t('Client inactive') }}</QTooltip>
+                </QIcon>
+                <QIcon
+                    v-if="entity.client.isFreezed == true"
+                    name="vn:frozen"
+                    size="xs"
+                    color="primary"
+                >
+                    <QTooltip>{{ t('Client Frozen') }}</QTooltip>
+                </QIcon>
+                <QIcon
+                    v-if="entity.problem.includes('hasRisk')"
+                    name="vn:risk"
+                    size="xs"
+                    color="primary"
+                >
+                    <QTooltip>{{ t('Client has debt') }}</QTooltip>
+                </QIcon>
+                <QIcon
+                    v-if="entity.client.isTaxDataChecked == false"
+                    name="vn:no036"
+                    size="xs"
+                    color="primary"
+                >
+                    <QTooltip>{{ t('Client not checked') }}</QTooltip>
+                </QIcon>
                 <QIcon
                     v-if="entity.isDeleted == true"
                     name="vn:deletedTicket"
@@ -188,4 +234,8 @@ function ticketFilter(ticket) {
 es:
     This ticket is deleted: Este ticket está eliminado
     Go to module index: Ir al índice del modulo
+    Client inactive: Cliente inactivo
+    Client not checked: Cliente no verificado
+    Client has debt: Cliente con deuda
+    Client Frozen: Cliente congelado
 </i18n>
diff --git a/src/pages/Ticket/Card/TicketNotes.vue b/src/pages/Ticket/Card/TicketNotes.vue
index cfc0c2431..881300399 100644
--- a/src/pages/Ticket/Card/TicketNotes.vue
+++ b/src/pages/Ticket/Card/TicketNotes.vue
@@ -33,6 +33,9 @@ watch(
         await ticketNotesCrudRef.value.reload();
     }
 );
+function handleDelete(row) {
+    ticketNotesCrudRef.value.remove([row]);
+}
 </script>
 
 <template>
@@ -74,12 +77,14 @@ watch(
                             v-model="row.description"
                             class="col"
                         />
+                        {{ index }},
+                        {{ row }}
                         <QIcon
                             name="delete"
                             size="sm"
                             class="cursor-pointer"
                             color="primary"
-                            @click="ticketNotesCrudRef.remove([row])"
+                            @click="handleDelete(row)"
                         >
                             <QTooltip>
                                 {{ t('ticketNotes.removeNote') }}
diff --git a/src/pages/Ticket/Card/TicketPackage.vue b/src/pages/Ticket/Card/TicketPackage.vue
index a76fce2b6..9dee76f8e 100644
--- a/src/pages/Ticket/Card/TicketPackage.vue
+++ b/src/pages/Ticket/Card/TicketPackage.vue
@@ -10,6 +10,7 @@ import FetchData from 'components/FetchData.vue';
 import VnInputDate from 'src/components/common/VnInputDate.vue';
 
 import { useArrayData } from 'src/composables/useArrayData';
+import VnRow from 'src/components/ui/VnRow.vue';
 
 const route = useRoute();
 const { t } = useI18n();
@@ -114,17 +115,19 @@ watch(
                             </QTooltip>
                         </QIcon>
                     </div>
-                    <QIcon
-                        name="add_circle"
-                        class="fill-icon-on-hover q-ml-md"
-                        size="sm"
-                        color="primary"
-                        @click="ticketPackagingsCrudRef.insert()"
-                    >
-                        <QTooltip>
-                            {{ t('package.addPackage') }}
-                        </QTooltip>
-                    </QIcon>
+                    <VnRow>
+                        <QIcon
+                            name="add_circle"
+                            class="fill-icon-on-hover q-ml-md"
+                            size="sm"
+                            color="primary"
+                            @click="ticketPackagingsCrudRef.insert()"
+                        >
+                            <QTooltip>
+                                {{ t('package.addPackage') }}
+                            </QTooltip>
+                        </QIcon>
+                    </VnRow>
                 </QCard>
             </template>
         </CrudModel>
diff --git a/src/pages/Ticket/Card/TicketSale.vue b/src/pages/Ticket/Card/TicketSale.vue
index 2d51ed8ca..71dd56960 100644
--- a/src/pages/Ticket/Card/TicketSale.vue
+++ b/src/pages/Ticket/Card/TicketSale.vue
@@ -100,7 +100,6 @@ const columns = computed(() => [
         align: 'left',
         label: t('ticketSale.quantity'),
         name: 'quantity',
-        cardVisible: true,
         format: (row) => toCurrency(row.quantity),
     },
     {
@@ -109,20 +108,17 @@ const columns = computed(() => [
         name: 'item',
         format: (row) => row?.item?.name,
         columnClass: 'expand',
-        cardVisible: true,
     },
     {
         align: 'left',
         label: t('ticketSale.price'),
         name: 'price',
-        cardVisible: true,
         format: (row) => toCurrency(row.price),
     },
     {
         align: 'left',
         label: t('ticketSale.discount'),
         name: 'discount',
-        cardVisible: true,
         format: (row) => toPercentage(row.discount),
     },
     {
@@ -135,7 +131,6 @@ const columns = computed(() => [
         align: 'left',
         label: t('ticketSale.packaging'),
         name: 'itemPackingTypeFk',
-        cardVisible: true,
         format: (row, dashIfEmpty) => dashIfEmpty(row?.item?.itemPackingTypeFk),
     },
     {
@@ -569,6 +564,7 @@ async function save(item) {
         }"
         :right-search="false"
         :column-search="false"
+        :disable-option="{ card: true }"
         auto-load
     >
         <template #column-statusIcons="{ row }">
diff --git a/src/pages/Ticket/Card/TicketSaleTracking.vue b/src/pages/Ticket/Card/TicketSaleTracking.vue
index d2fec97ac..e7830bf37 100644
--- a/src/pages/Ticket/Card/TicketSaleTracking.vue
+++ b/src/pages/Ticket/Card/TicketSaleTracking.vue
@@ -25,7 +25,7 @@ const saleTrackingFetchDataRef = ref(null);
 
 const sales = ref([]);
 const saleTrackings = ref([]);
-const itemShelvignsSales = ref([]);
+const itemShelvingsSales = ref([]);
 const saleTrackingUrl = computed(() => `SaleTrackings/${route.params.id}/filter`);
 const oldQuantity = ref(null);
 
@@ -88,7 +88,7 @@ const logTableColumns = computed(() => [
         label: t('ticketSaleTracking.original'),
         name: 'original',
         field: 'originalQuantity',
-        align: 'original',
+        align: 'left',
         sortable: true,
     },
     {
@@ -177,7 +177,7 @@ const getItemShelvingSales = async (sale) => {
         const { data } = await axios.get(`ItemShelvingSales/filter`, {
             params: { filter: JSON.stringify(filter) },
         });
-        itemShelvignsSales.value = data;
+        itemShelvingsSales.value = data;
     } catch (error) {
         console.error(error);
     }
@@ -464,12 +464,14 @@ const qCheckBoxController = (sale, action) => {
             data-key="saleTrackingLog"
             :rows="saleTrackings"
             :columns="logTableColumns"
-            class="q-pa-sm"
+            class="q-pa-sm full-width"
         >
             <template #body-cell-worker="{ row }">
-                <QTd auto-width>
-                    <QBtn flat dense color="primary">{{ row.name }}</QBtn>
-                    <WorkerDescriptorProxy :id="row.workerFk" />
+                <QTd>
+                    <QBtn flat class="link">
+                        {{ row.name }}
+                        <WorkerDescriptorProxy :id="row.workerFk" />
+                    </QBtn>
                 </QTd>
             </template>
         </QTable>
@@ -481,12 +483,12 @@ const qCheckBoxController = (sale, action) => {
     >
         <QTable
             data-key="itemShelvingsSales"
-            :rows="itemShelvignsSales"
+            :rows="itemShelvingsSales"
             :columns="shelvingsTableColumns"
-            class="q-pa-sm"
+            class="q-pa-sm full-width"
         >
             <template #body-cell-quantity="{ row }">
-                <QTd auto-width>
+                <QTd>
                     <VnInput
                         v-model.number="row.quantity"
                         @keyup.enter="updateQuantity(row)"
@@ -496,13 +498,15 @@ const qCheckBoxController = (sale, action) => {
                 </QTd>
             </template>
             <template #body-cell-worker="{ row }">
-                <QTd auto-width>
-                    <QBtn flat dense color="primary">{{ row.name }}</QBtn>
-                    <WorkerDescriptorProxy :id="row.userFk" />
+                <QTd>
+                    <QBtn flat class="link">
+                        {{ row.name }}
+                        <WorkerDescriptorProxy :id="row.userFk" />
+                    </QBtn>
                 </QTd>
             </template>
             <template #body-cell-shelving="{ row }">
-                <QTd auto-width>
+                <QTd>
                     <VnSelect
                         url="Shelvings"
                         hide-selected
@@ -515,7 +519,7 @@ const qCheckBoxController = (sale, action) => {
                 </QTd>
             </template>
             <template #body-cell-parking="{ row }">
-                <QTd auto-width>
+                <QTd>
                     <VnSelect
                         url="Parkings"
                         hide-selected
@@ -550,4 +554,10 @@ $estados: (
         }
     }
 }
+
+@media (min-width: 560px) {
+    .q-dialog__inner--minimized > div {
+        max-width: 900px;
+    }
+}
 </style>
diff --git a/src/pages/Ticket/Card/TicketSummary.vue b/src/pages/Ticket/Card/TicketSummary.vue
index 4562f2c60..8ad9a36d0 100644
--- a/src/pages/Ticket/Card/TicketSummary.vue
+++ b/src/pages/Ticket/Card/TicketSummary.vue
@@ -16,6 +16,7 @@ import VnUserLink from 'src/components/ui/VnUserLink.vue';
 import VnTitle from 'src/components/common/VnTitle.vue';
 import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
 import ZoneDescriptorProxy from 'src/pages/Zone/Card/ZoneDescriptorProxy.vue';
+import VnSelect from 'src/components/common/VnSelect.vue';
 
 const route = useRoute();
 const router = useRouter();
@@ -103,13 +104,18 @@ function getNoteValue(description) {
             return t('Sustitución');
     }
 }
+
+function toTicketUrl(section) {
+    return '#/ticket/' + entityId.value + '/' + section;
+}
 </script>
 
 <template>
     <FetchData
         url="States/editableStates"
-        @on-fetch="(data) => (editableStates = data)"
+        :filter="{ fields: ['code', 'name', 'id', 'alertLevel'], order: 'name ASC' }"
         auto-load
+        @on-fetch="(data) => (editableStates = data)"
     />
     <CardSummary
         ref="summaryRef"
@@ -127,39 +133,26 @@ function getNoteValue(description) {
         </template>
         <template #header-right>
             <QBtnDropdown
-                side
-                top
                 color="black"
                 text-color="white"
                 :label="t('ticket.summary.changeState')"
                 :disable="!isEditable()"
             >
-                <QList>
-                    <QVirtualScroll
-                        style="max-height: 300px"
-                        :items="editableStates"
-                        separator
-                        v-slot="{ item, index }"
-                    >
-                        <QItem
-                            :key="index"
-                            dense
-                            clickable
-                            v-close-popup
-                            @click="changeState(item.code)"
-                        >
-                            <QItemSection>
-                                <QItemLabel>{{ item.name }}</QItemLabel>
-                            </QItemSection>
-                        </QItem>
-                    </QVirtualScroll>
-                </QList>
+                <VnSelect
+                    :options="editableStates"
+                    hide-selected
+                    option-label="name"
+                    option-value="code"
+                    hide-dropdown-icon
+                    focus-on-mount
+                    @update:model-value="changeState(item.code)"
+                />
             </QBtnDropdown>
         </template>
         <template #body>
             <QCard class="vn-one">
                 <VnTitle
-                    :url="ticketUrl + 'basic-data/step-one'"
+                    :url="toTicketUrl('basic-data')"
                     :text="t('globals.summary.basicData')"
                 />
                 <VnLv v-if="ticket.ticketState" :label="t('ticket.summary.state')">
@@ -236,7 +229,7 @@ function getNoteValue(description) {
             </QCard>
             <QCard class="vn-one" style="flex: 2 1">
                 <VnTitle
-                    :url="ticketUrl + 'basic-data/step-one'"
+                    :url="toTicketUrl('basic-data')"
                     :text="t('globals.summary.basicData')"
                 />
                 <VnLv
@@ -288,7 +281,7 @@ function getNoteValue(description) {
             </QCard>
             <QCard class="vn-one" v-if="ticket.notes.length">
                 <VnTitle
-                    :url="ticketUrl + 'observation'"
+                    :url="toTicketUrl('observation')"
                     :text="t('ticket.pageTitles.notes')"
                 />
                 <VnLv
@@ -328,7 +321,7 @@ function getNoteValue(description) {
             </QCard>
             <QCard class="vn-max">
                 <VnTitle
-                    :url="ticketUrl + 'sale'"
+                    :url="toTicketUrl('sale')"
                     :text="t('ticket.summary.saleLines')"
                 />
                 <QTable :rows="ticket.sales" style="text-align: center">
@@ -488,7 +481,7 @@ function getNoteValue(description) {
                 </QTable>
             </QCard>
             <QCard class="vn-max" v-if="ticket.packagings.length != 0">
-                <VnTitle :url="ticketUrl + 'package'" :text="t('globals.packages')" />
+                <VnTitle :url="toTicketUrl('package')" :text="t('globals.packages')" />
                 <QTable :rows="ticket.packagings" flat style="text-align: center">
                     <template #header="props">
                         <QTr class="tr-header" :props="props">
@@ -508,7 +501,7 @@ function getNoteValue(description) {
             </QCard>
             <QCard class="vn-max" v-if="ticket.services.length != 0">
                 <VnTitle
-                    :url="ticketUrl + 'service'"
+                    :url="toTicketUrl('service')"
                     :text="t('ticket.summary.service')"
                 />
                 <QTable :rows="ticket.services" flat style="text-align: center">
@@ -536,7 +529,7 @@ function getNoteValue(description) {
             </QCard>
             <QCard class="vn-max" v-if="ticket.requests.length != 0">
                 <VnTitle
-                    :url="ticketUrl + 'request'"
+                    :url="toTicketUrl('request')"
                     :text="t('ticket.summary.purchaseRequest')"
                 />
                 <QTable :rows="ticket.requests" flat style="text-align: center">