src/i18n/locale/en.yml

@@ -446,6 +446,7 @@ ticket:
         sale: Sale
         ticketAdvance: Advance tickets
         futureTickets: Future tickets
+        expedition: Expedition
     list:
         nickname: Nickname
         state: State

src/i18n/locale/es.yml

@@ -445,6 +445,7 @@ ticket:
         sale: Lineas del pedido
         ticketAdvance: Adelantar tickets
         futureTickets: Tickets a futuro
+        expedition: Expedición
     list:
         nickname: Alias
         state: Estado

src/pages/Ticket/Card/TicketExpedition.vue

@@ -0,0 +1,244 @@
+<script setup>
+import { onMounted, ref, computed, onUnmounted, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRouter, useRoute } from 'vue-router';
+
+import FetchData from 'components/FetchData.vue';
+import FetchedTags from 'components/ui/FetchedTags.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+import VnSelect from 'src/components/common/VnSelect.vue';
+import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
+import TicketEditManaProxy from './TicketEditMana.vue';
+import TableVisibleColumns from 'src/components/common/TableVisibleColumns.vue';
+import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+
+import { useStateStore } from 'stores/useStateStore';
+import { toCurrency, toPercentage } from 'src/filters';
+import { useArrayData } from 'composables/useArrayData';
+import { useVnConfirm } from 'composables/useVnConfirm';
+import useNotify from 'src/composables/useNotify.js';
+import { toDateTimeFormat } from 'src/filters/date';
+import axios from 'axios';
+
+const route = useRoute();
+const router = useRouter();
+const stateStore = useStateStore();
+const { t } = useI18n();
+const { notify } = useNotify();
+const { openConfirmationModal } = useVnConfirm();
+const editPriceProxyRef = ref(null);
+
+const expeditions = ref([]);
+const selectedExpeditions = ref([]);
+const allColumnNames = ref([]);
+
+// const arrayData = useArrayData('ticketData');
+// const { store } = arrayData;
+
+// watch(
+//     () => route.params.id,
+//     async () => await getSales()
+// );
+
+const columns = computed(() => [
+    {
+        label: t('expedition.id'),
+        name: 'id',
+        field: 'id',
+        align: 'left',
+        sortable: true,
+        // columnFilter: {
+        //     component: VnInput,
+        //     type: 'text',
+        //     filterValue: null,
+        //     event: getInputEvents,
+        //     attrs: {
+        //         dense: true,
+        //     },
+        // },
+    },
+    {
+        label: t('expedition.item'),
+        name: 'item',
+        align: 'left',
+        columnFilter: null,
+    },
+    {
+        label: t('expedition.name'),
+        name: 'name',
+        field: 'packageItemName',
+        align: 'left',
+        columnFilter: null,
+    },
+    {
+        label: t('expedition.packageType'),
+        name: 'packageType',
+        field: 'freightItemName',
+        align: 'left',
+        columnFilter: null,
+    },
+    {
+        label: t('expedition.counter'),
+        name: 'counter',
+        field: 'counter',
+        align: 'left',
+        columnFilter: null,
+    },
+    {
+        label: t('expedition.externalId'),
+        name: 'externalId',
+        field: 'externalId',
+        align: 'left',
+        columnFilter: null,
+    },
+    {
+        label: t('expedition.created'),
+        name: 'created',
+        field: 'created',
+        align: 'left',
+        columnFilter: null,
+        format: (value) => toDateTimeFormat(value),
+    },
+    {
+        label: t('expedition.state'),
+        name: 'state',
+        field: 'state',
+        align: 'left',
+        columnFilter: null,
+    },
+    {
+        label: '',
+        name: 'history',
+        align: 'left',
+        columnFilter: null,
+    },
+]);
+
+const showLog = (expedition) => {};
+
+onMounted(async () => {
+    stateStore.rightDrawer = true;
+    const filteredColumns = columns.value.filter((col) => col.name !== 'history');
+    allColumnNames.value = filteredColumns.map((col) => col.name);
+    console.log('allColumnNames', allColumnNames.value);
+});
+
+onUnmounted(() => (stateStore.rightDrawer = false));
+</script>
+
+<template>
+    <FetchData
+        url="Expeditions/filter"
+        auto-load
+        :filter="{ where: { ticketFk: route.params.id }, order: ['created DESC'] }"
+        @on-fetch="(data) => (expeditions = data)"
+    />
+
+    <VnSubToolbar>
+        <template #st-data>
+            <TableVisibleColumns
+                :all-columns="allColumnNames"
+                table-code="expeditionIndex"
+                labels-traductions-path="expedition"
+                @on-config-saved="visibleColumns = [...$event, 'history']"
+            />
+        </template>
+    </VnSubToolbar>
+
+    <QTable
+        :rows="expeditions"
+        :columns="columns"
+        row-key="id"
+        :pagination="{ rowsPerPage: 0 }"
+        class="full-width q-mt-md"
+        selection="multiple"
+        v-model:selected="selectedExpeditions"
+        :visible-columns="visibleColumns"
+        :no-data-label="t('globals.noResults')"
+    >
+        <template #body-cell-item="{ row }">
+            <QTd auto-width @click.stop>
+                <QBtn flat color="primary">{{ row.packagingItemFk }}</QBtn>
+                <ItemDescriptorProxy :id="row.packagingItemFk" />
+            </QTd>
+        </template>
+        <template #body-cell-available="{ row }">
+            <QTd @click.stop>
+                <QBadge :color="row.available < 0 ? 'alert' : 'transparent'" dense>
+                    {{ row.available }}
+                </QBadge>
+            </QTd>
+        </template>
+
+        <template #body-cell-price="{ row }">
+            <QTd>
+                <template v-if="isTicketEditable && row.id">
+                    <QBtn flat color="primary" dense @click="onOpenEditPricePopover(row)">
+                        {{ toCurrency(row.price) }}
+                    </QBtn>
+                    <TicketEditManaProxy
+                        ref="editPriceProxyRef"
+                        :mana="mana"
+                        :new-price="getNewPrice"
+                        @save="updatePrice(row)"
+                    >
+                        <VnInput
+                            v-model.number="edit.price"
+                            :label="t('ticketSale.price')"
+                            type="number"
+                        />
+                    </TicketEditManaProxy>
+                </template>
+                <span v-else>{{ toCurrency(row.price) }}</span>
+            </QTd>
+        </template>
+        <template #body-cell-discount="{ row }">
+            <QTd>
+                <template v-if="!isLocked && row.id">
+                    <QBtn
+                        flat
+                        color="primary"
+                        dense
+                        @click="onOpenEditDiscountPopover(row)"
+                    >
+                        {{ toPercentage(row.discount / 100) }}
+                    </QBtn>
+                    <TicketEditManaProxy
+                        :mana="mana"
+                        :new-price="getNewPrice"
+                        @save="changeDiscount(row)"
+                    >
+                        <VnInput
+                            v-model.number="edit.discount"
+                            :label="t('ticketSale.discount')"
+                            type="number"
+                        />
+                    </TicketEditManaProxy>
+                </template>
+                <span v-else>{{ toPercentage(row.discount / 100) }}</span>
+            </QTd>
+        </template>
+        <template #body-cell-history="{ row }">
+            <QTd>
+                <QBtn
+                    @click.stop="showLog(row)"
+                    color="primary"
+                    icon="history"
+                    size="md"
+                    flat
+                >
+                    <QTooltip class="text-no-wrap">
+                        {{ t('expedition.historyAction') }}
+                    </QTooltip>
+                </QBtn>
+            </QTd>
+        </template>
+    </QTable>
+
+    <!-- <QPageSticky :offset="[20, 20]">
+        <QBtn @click="newOrderFromTicket()" color="primary" fab icon="add" />
+        <QTooltip class="text-no-wrap">
+            {{ t('Add item to basket') }}
+        </QTooltip>
+    </QPageSticky> -->
+</template>

src/pages/Ticket/locale/en.yml

@@ -80,3 +80,13 @@ futureTickets:
     moveTicketSuccess: Tickets moved successfully!
     searchInfo: Search future tickets by date
     futureTicket: Future tickets
+expedition:
+    id: Expedition
+    item: Item
+    name: Name
+    packageType: Package type
+    counter: Counter
+    externalId: externalId
+    created: Created
+    state: State
+    historyAction: Status log

src/pages/Ticket/locale/es.yml

@@ -79,6 +79,16 @@ ticketSale:
     shipped: F. Envío
     agency: Agencia
     address: Consignatario
+expedition:
+    id: Expedición
+    item: Artículo
+    name: Nombre
+    packageType: Package type
+    counter: Contador
+    externalId: externalId
+    created: Fecha creación
+    state: Estado
+    historyAction: Historial de estados
 card:
     search: Buscar tickets
     searchInfo: Buscar tickets por identificador o alias

src/router/modules/ticket.js

@@ -12,7 +12,13 @@ export default {
     redirect: { name: 'TicketMain' },
     menus: {
         main: ['TicketList', 'TicketAdvance', 'TicketFuture'],
-        card: ['TicketBoxing', 'TicketSms', 'TicketSale', 'TicketLog'],
+        card: [
+            'TicketBoxing',
+            'TicketSms',
+            'TicketSale',
+            'TicketLog',
+            'TicketExpedition',
+        ],
     },
     children: [
         {
@@ -94,13 +100,13 @@ export default {
                     component: () => import('src/pages/Ticket/Card/TicketSale.vue'),
                 },
                 {
-                    path: 'boxing',
+                    path: 'expedition',
-                    name: 'TicketBoxing',
+                    name: 'TicketExpedition',
                     meta: {
-                        title: 'boxing',
+                        title: 'expedition',
                         icon: 'vn:package',
                     },
-                    component: () => import('src/pages/Ticket/Card/TicketBoxing.vue'),
+                    component: () => import('src/pages/Ticket/Card/TicketExpedition.vue'),
                 },
                 {
                     path: 'sms',
@@ -120,6 +126,15 @@ export default {
                     },
                     component: () => import('src/pages/Ticket/Card/TicketLog.vue'),
                 },
+                {
+                    path: 'boxing',
+                    name: 'TicketBoxing',
+                    meta: {
+                        title: 'boxing',
+                        icon: 'vn:science',
+                    },
+                    component: () => import('src/pages/Ticket/Card/TicketBoxing.vue'),
+                },
             ],
         },
     ],