WIP

src/pages/Ecomerce/BasketView.vue

@@ -128,9 +128,7 @@ onMounted(async () => {
         <TicketDetails
             :rows="rows"
             :ticket="ticket"
-            is-basket
             :show-tax="false"
-            can-delete-items
             @on-row-deleted="fetchData"
         />
     </QPage>

src/pages/Ecomerce/ConfirmView.vue

@@ -1 +1,174 @@
-<template>Confirm view</template>
+<script setup>
+import { onBeforeMount, ref, inject, onMounted } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+import { useAppStore } from 'stores/app';
+import TicketDetails from 'src/pages/Ecomerce/TicketDetails.vue';
+import { storeToRefs } from 'pinia';
+import { useRoute } from 'vue-router';
+import useNotify from 'src/composables/useNotify.js';
+import { currency } from 'src/lib/filters.js';
+
+const jApi = inject('jApi');
+const { notify } = useNotify();
+const { t } = useI18n();
+const appStore = useAppStore();
+const route = useRoute();
+const { basketOrderId, isHeaderMounted } = storeToRefs(appStore);
+
+const rows = ref([]);
+const order = ref({});
+const orderId = ref(null);
+
+const getOrder = async () => {
+    try {
+        const { results } = await jApi.execQuery(
+            `CALL myOrder_getTax(#id);
+            SELECT o.id, o.sent, o.notes, o.companyFk,
+            ag.description agency, v.code method,
+            ad.nickname, ad.postalCode, ad.city, ad.street,
+            t.*, c.credit, myClient_getDebt(NULL) debt
+            FROM myOrder o
+            JOIN vn.agencyMode ag ON ag.id = o.agencyModeFk
+            LEFT JOIN myAddress ad ON ad.id = o.addressFk
+            JOIN vn.deliveryMethod v ON v.id = o.deliveryMethodFk
+            JOIN myClient c
+            JOIN (
+            SELECT
+            IFNULL(SUM(taxableBase), 0) taxableBase,
+            IFNULL(SUM(tax), 0) tax
+            FROM tmp.orderAmount
+            ) t
+            WHERE o.id = #id;
+            DROP TEMPORARY TABLE
+            tmp.orderAmount,
+            tmp.orderTax;`,
+            { id: orderId.value }
+        );
+
+        const orderData = results[1]?.data[0];
+
+        const { sent, ...restOfData } = orderData;
+        const total = orderData.taxableBase + orderData.tax || 0;
+        const exceededCredit = orderData.debt + total;
+        const creditExceededCond = exceededCredit > 0;
+
+        if (creditExceededCond) {
+            notify(t('creditExceeded'), 'warning');
+        }
+
+        const formattedData = {
+            landed: new Date(sent),
+            total,
+            debt: orderData.debt || 0,
+            ...restOfData
+        };
+        order.value = formattedData;
+
+        console.log('orderData', order.value);
+    } catch (error) {
+        console.error(error);
+    }
+};
+
+const fetchData = async () => {
+    await getOrder();
+};
+
+onBeforeMount(() => {
+    appStore.check();
+});
+
+onMounted(async () => {
+    orderId.value = route.params.id || basketOrderId.value;
+    await fetchData();
+});
+</script>
+
+<template>
+    <Teleport v-if="isHeaderMounted" to="#actions">
+        <QBtn
+            icon="settings"
+            :label="t('configureOrder')"
+            :to="{ name: 'checkout', params: { id: orderId } }"
+            rounded
+            no-caps
+        />
+        <QBtn
+            icon="shopping_bag"
+            :label="t('catalog')"
+            :to="{ name: 'catalog' }"
+            rounded
+            no-caps
+        />
+        <QBtn
+            icon="shopping_cart_checkout"
+            :label="t('checkout')"
+            :to="{ name: 'confirm', params: { id: orderId } }"
+            rounded
+            no-caps
+        />
+    </Teleport>
+    <QPage class="vn-w-sm">
+        <TicketDetails
+            :rows="rows"
+            :ticket="order"
+            :show-tax="false"
+            :show-items="false"
+            :show-total="false"
+            can-delete-items
+            class="q-mb-md"
+        />
+        <QCard style="padding: 32px">
+            <div class="row justify-between">
+                <span>{{ t('previousBalance') }}</span>
+                <span>{{ currency(order.debt) }}</span>
+            </div>
+            <div class="row justify-between">
+                <span>{{ t('orderTotal') }}</span>
+                <span>{{ currency(order.taxableBase) }}</span>
+            </div>
+            <div class="row justify-between">
+                <span>{{ t('orderVat') }}</span>
+                <span>{{ currency(order.tax) }}</span>
+            </div>
+            <div class="row justify-between">
+                <span>{{ t('totalDebt') }}</span>
+                <span>{{ currency() }}</span>
+            </div>
+        </QCard>
+    </QPage>
+</template>
+
+<i18n lang="yaml">
+en-US:
+    previousBalance: Previous balance
+    orderTotal: Order total
+    orderVat: Order VAT
+    totalDebt: Total debt
+    creditExceeded: You have exceeded your credit, in order to prepare your order please pay your debt.
+es-ES:
+    previousBalance: Saldo anterior
+    orderTotal: Total pedido
+    orderVat: IVA pedido
+    totalDebt: Deuda total
+    creditExceeded: Has excedido tu crédito, por favor realiza el pago para que podamos preparar tu pedido.
+ca-ES:
+    previousBalance: Saldo anterior
+    orderTotal: Total comanda
+    orderVat: IVA comanda
+    totalDebt: Total deute
+    creditExceeded: Has excedit el teu crèdit, si us plau realitza el pagament perquè puguem preparar la teva comanda.
+fr-FR:
+    previousBalance: Solde précédent
+    orderTotal: Total de la commande
+    orderVat: TVA de la commande
+    totalDebt: Total de la dette
+    creditExceeded: Vous avez dépassé votre crédit, s'il vous plaît effectuer le paiement afin que nous puissions préparer votre commande.
+pt-PT:
+    previousBalance: Saldo anterior
+    orderTotal: Total pedido
+    orderVat: IVA
+    totalDebt: Total dívida
+    creditExceeded: Ultrapassastes seu crédito, por favor, faça o pagamento para que possamos preparar sua encomenda.
+</i18n>

src/pages/Ecomerce/TicketDetails.vue

@@ -16,10 +16,18 @@ defineProps({
         type: Array,
         default: () => []
     },
+    showTotal: {
+        type: Boolean,
+        default: true
+    },
     showTax: {
         type: Boolean,
         default: true
     },
+    showItems: {
+        type: Boolean,
+        default: true
+    },
     canDeleteItems: {
         type: Boolean,
         default: false
@@ -77,7 +85,7 @@ const deleteRow = id => {
                 {{ ticket.agency }}
             </div>
         </QCardSection>
-        <QCardSection class="no-padding q-mb-md q-gutter-y-xs">
+        <QCardSection class="no-padding q-gutter-y-xs">
             <div class="text-subtitle1 text-bold">
                 {{ t('deliveryAddress') }}
             </div>
@@ -91,7 +99,8 @@ const deleteRow = id => {
             </div>
         </QCardSection>
         <QCardSection
-            class="no-padding q-mb-md text-subtitle1 text-bold column"
+            v-if="showTotal"
+            class="no-padding q-my-md text-subtitle1 text-bold column"
         >
             <span class="text-right">
                 {{ t('total') }} {{ currency(ticket.taxBase) }}
@@ -100,7 +109,7 @@ const deleteRow = id => {
                 {{ t('totalTax') }} {{ currency(ticket.total) }}
             </span>
         </QCardSection>
-        <QSeparator inset />
+        <QSeparator v-if="showItems" inset />
         <QList v-for="(row, index) in rows" :key="index">
             <QItem v-if="row">
                 <QItemSection v-if="canDeleteItems" avatar>