From 8e538fb4638f705656d7544a3d2578373cffa3b5 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 25 Jun 2024 08:27:25 -0300
Subject: [PATCH] WIP

---
 src/i18n/locale/en.yml                        |   4 -
 src/i18n/locale/es.yml                        |   4 -
 .../Ticket/Card/TicketCreateServiceType.vue   |  49 +++++++
 src/pages/Ticket/Card/TicketService.vue       | 138 +++++++++++++++++-
 src/pages/Ticket/locale/en.yml                |   1 +
 src/pages/Ticket/locale/es.yml                |   1 +
 src/router/modules/ticket.js                  |  19 +--
 7 files changed, 190 insertions(+), 26 deletions(-)
 create mode 100644 src/pages/Ticket/Card/TicketCreateServiceType.vue

diff --git a/src/i18n/locale/en.yml b/src/i18n/locale/en.yml
index 347543092..5e7b3621b 100644
--- a/src/i18n/locale/en.yml
+++ b/src/i18n/locale/en.yml
@@ -443,11 +443,7 @@ ticket:
         sms: Sms
         notes: Notes
         sale: Sale
-<<<<<<< Updated upstream
-=======
-        dms: File management
         services: Service
->>>>>>> Stashed changes
     list:
         nickname: Nickname
         state: State
diff --git a/src/i18n/locale/es.yml b/src/i18n/locale/es.yml
index 3151d72bf..fd3dad952 100644
--- a/src/i18n/locale/es.yml
+++ b/src/i18n/locale/es.yml
@@ -441,11 +441,7 @@ ticket:
         sms: Sms
         notes: Notas
         sale: Lineas del pedido
-<<<<<<< Updated upstream
-=======
-        dms: Gestión documental
         service: Servicios
->>>>>>> Stashed changes
     list:
         nickname: Alias
         state: Estado
diff --git a/src/pages/Ticket/Card/TicketCreateServiceType.vue b/src/pages/Ticket/Card/TicketCreateServiceType.vue
new file mode 100644
index 000000000..d392ec206
--- /dev/null
+++ b/src/pages/Ticket/Card/TicketCreateServiceType.vue
@@ -0,0 +1,49 @@
+<script setup>
+import { reactive, ref, onMounted, nextTick } from 'vue';
+import { useI18n } from 'vue-i18n';
+import VnInput from 'src/components/common/VnInput.vue';
+
+import VnRow from 'components/ui/VnRow.vue';
+import FormModelPopup from 'components/FormModelPopup.vue';
+
+const { t } = useI18n();
+const emit = defineEmits(['onDataSaved']);
+
+const nameInputRef = ref(null);
+const serviceFormData = reactive({});
+
+const onDataSaved = (formData, requestResponse) => {
+    emit('onDataSaved', formData, requestResponse);
+};
+
+onMounted(async () => {
+    await nextTick();
+    nameInputRef.value.focus();
+});
+</script>
+
+<template>
+    <FormModelPopup
+        url-create="TicketServiceTypes"
+        model="TicketServiceType"
+        :title="t('New service type')"
+        :form-initial-data="serviceFormData"
+        @on-data-saved="onDataSaved"
+    >
+        <template #form-inputs="{ data }">
+            <VnRow class="row q-gutter-md q-mb-md">
+                <VnInput
+                    ref="nameInputRef"
+                    :label="t('service.description')"
+                    v-model="data.name"
+                    :required="true"
+                />
+            </VnRow>
+        </template>
+    </FormModelPopup>
+</template>
+
+<i18n>
+es:
+    New service type: Nuevo tipo de servicio
+</i18n>
diff --git a/src/pages/Ticket/Card/TicketService.vue b/src/pages/Ticket/Card/TicketService.vue
index 25e345de0..af2a5c664 100644
--- a/src/pages/Ticket/Card/TicketService.vue
+++ b/src/pages/Ticket/Card/TicketService.vue
@@ -1 +1,137 @@
-<template>Ticket service</template>
+<script setup>
+import { ref, watch, computed } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+
+import CrudModel from 'components/CrudModel.vue';
+import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
+import FetchData from 'components/FetchData.vue';
+import TicketCreateServiceType from './TicketCreateServiceType.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+
+import { useArrayData } from 'src/composables/useArrayData';
+
+const route = useRoute();
+const { t } = useI18n();
+const ticketServiceTypeFetchRef = ref(null);
+const ticketServiceCrudRef = ref(null);
+const ticketServiceOptions = ref([]);
+const arrayData = useArrayData('TicketNotes');
+const { store } = arrayData;
+
+const selectedServices = ref(new Set());
+
+const toggleCheckSelection = (id) => {
+    if (selectedServices.value.has(id)) selectedServices.value.delete(id);
+    else selectedServices.value.add(id);
+};
+
+const crudModelFilter = computed(() => ({
+    where: { ticketFk: route.params.id },
+}));
+
+const crudModelRequiredData = computed(() => ({ ticketFk: route.params.id }));
+
+watch(
+    () => route.params.id,
+    async () => {
+        store.filter = crudModelFilter.value;
+        await ticketServiceCrudRef.value.reload();
+    }
+);
+</script>
+
+<template>
+    <FetchData
+        ref="ticketServiceTypeFetchRef"
+        @on-fetch="(data) => (ticketServiceOptions = data)"
+        auto-load
+        url="TicketServiceTypes"
+    />
+    <!-- <Teleport v-if="" to="#st-actions">
+        <QBtn
+            color="primary"
+            :label="t('service.pay')"
+            :disabled="!selectedServices.size"
+            @click.stop="viewAddObservation(selected)"
+        />
+    </Teleport> -->
+    <CrudModel
+        ref="ticketServiceCrudRef"
+        data-key="TicketService"
+        url="TicketServices"
+        model="TicketService"
+        :filter="crudModelFilter"
+        :data-required="crudModelRequiredData"
+        :default-remove="false"
+        auto-load
+    >
+        <template #body="{ rows }">
+            <QCard class="q-px-lg q-py-md">
+                <div
+                    v-for="(row, index) in rows"
+                    :key="index"
+                    class="q-mb-md row items-center q-gutter-x-md"
+                >
+                    <QCheckbox
+                        size="sm"
+                        @update:model-value="toggleCheckSelection(row.id)"
+                        :model-value="selectedServices.has(row.id)"
+                        :toggle-indeterminate="false"
+                    />
+                    <VnSelectDialog
+                        :label="t('service.description')"
+                        v-model="row.ticketServiceTypeFk"
+                        :options="ticketServiceOptions"
+                        option-label="name"
+                        option-value="id"
+                        hide-selected
+                    >
+                        <template #form>
+                            <TicketCreateServiceType
+                                @on-data-saved="ticketServiceTypeFetchRef.fetch()"
+                            />
+                        </template>
+                    </VnSelectDialog>
+                    <VnInput
+                        :label="t('service.quantity')"
+                        v-model="row.quantity"
+                        type="number"
+                        min="0"
+                        :info="t('service.quantityInfo')"
+                    />
+                    <VnInput
+                        :label="t('service.price')"
+                        v-model="row.price"
+                        type="number"
+                        min="0"
+                    />
+                    <QIcon
+                        name="delete"
+                        size="sm"
+                        class="cursor-pointer"
+                        color="primary"
+                        @click="ticketServiceCrudRef.remove([row])"
+                    >
+                        <QTooltip>
+                            {{ t('service.removeNote') }}
+                        </QTooltip>
+                    </QIcon>
+                </div>
+                <QIcon
+                    name="add_circle"
+                    class="fill-icon-on-hover q-ml-md"
+                    size="sm"
+                    color="primary"
+                    @click="ticketServiceCrudRef.insert()"
+                >
+                    <QTooltip>
+                        {{ t('service.addService') }}
+                    </QTooltip>
+                </QIcon>
+            </QCard>
+        </template>
+    </CrudModel>
+    <pre>checkeds: {{ selectedServices }}</pre>
+</template>
diff --git a/src/pages/Ticket/locale/en.yml b/src/pages/Ticket/locale/en.yml
index b8c21600d..ff928c492 100644
--- a/src/pages/Ticket/locale/en.yml
+++ b/src/pages/Ticket/locale/en.yml
@@ -6,3 +6,4 @@ service:
     removeService: Remove service
     newService: New service type
     addService: Add service
+    quantityInfo: To create services with negative amounts mark the service on the source ticket and press the pay button.
diff --git a/src/pages/Ticket/locale/es.yml b/src/pages/Ticket/locale/es.yml
index a8ef0347b..f1326e502 100644
--- a/src/pages/Ticket/locale/es.yml
+++ b/src/pages/Ticket/locale/es.yml
@@ -6,5 +6,6 @@ service:
     removeService: Quitar servicio
     newService: Nuevo tipo de servicio
     addService: Añadir servicio
+    quantityInfo: Para crear sevicios con cantidades negativas marcar servicio en el ticket origen y apretar el boton abonar.
 Search ticket: Buscar ticket
 You can search by ticket id or alias: Puedes buscar por id o alias del ticket
diff --git a/src/router/modules/ticket.js b/src/router/modules/ticket.js
index cbcc4b762..eadaa1cab 100644
--- a/src/router/modules/ticket.js
+++ b/src/router/modules/ticket.js
@@ -12,11 +12,7 @@ export default {
     redirect: { name: 'TicketMain' },
     menus: {
         main: ['TicketList'],
-<<<<<<< Updated upstream
-        card: ['TicketBoxing', 'TicketSms', 'TicketSale'],
-=======
-        card: ['TicketBoxing', 'TicketSms', 'TicketSale', 'TicketDms', 'TicketService'],
->>>>>>> Stashed changes
+        card: ['TicketBoxing', 'TicketSms', 'TicketSale', 'TicketService'],
     },
     children: [
         {
@@ -97,17 +93,7 @@ export default {
                     },
                     component: () => import('src/pages/Ticket/Card/TicketSms.vue'),
                 },
-<<<<<<< Updated upstream
-=======
-                {
-                    path: 'dms',
-                    name: 'TicketDms',
-                    meta: {
-                        title: 'dms',
-                        icon: 'cloud_upload',
-                    },
-                    component: () => import('src/pages/Ticket/Card/TicketDms.vue'),
-                },
+
                 {
                     path: 'service',
                     name: 'TicketService',
@@ -117,7 +103,6 @@ export default {
                     },
                     component: () => import('src/pages/Ticket/Card/TicketService.vue'),
                 },
->>>>>>> Stashed changes
             ],
         },
     ],