refactor: use Salix in BasketView.vue

src/pages/Ecomerce/BasketView.vue

@@ -7,7 +7,7 @@ import TicketDetails from 'src/pages/Ecomerce/TicketDetails.vue';
 import { storeToRefs } from 'pinia';
 import { useRoute } from 'vue-router';
 
-const jApi = inject('jApi');
+const api = inject('api');
 const { t } = useI18n();
 const appStore = useAppStore();
 const route = useRoute();
@@ -24,74 +24,107 @@ onBeforeMount(async () => {
 });
 
 const getOrder = async () => {
-    try {
-        const [data] = await jApi.query(
-            `SELECT o.id, o.sent,
-            ag.description agency, v.code method,
-            ad.nickname, ad.postalCode, ad.city, ad.street
-            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
-            WHERE o.id = #id;`,
-            { id: orderId.value }
-        );
-        const { sent, method, agency, id, nickname, street, postalCode, city } =
-            data;
-        const taxBase = rows.value.reduce(
-            (acc, row) => acc + row.price * row.quantity,
-            0
-        );
-        const formattedData = {
-            id,
-            landed: new Date(sent),
-            agency,
-            method,
-            nickname,
-            street,
-            postalCode,
-            city,
-            taxBase
-        };
-        ticket.value = formattedData;
-    } catch (error) {
-        console.error(error);
-    }
-};
+  try {
+    const filter = {
+      include: [
+        {
+          relation: 'address',
+          scope: {
+            fields: ['nickname', 'city', 'postalCode', 'street'],
+          }
+        },
+        {
+          relation: 'agencyMode',
+          scope: {
+            fields: ['description']
+          }
+        },
+        {
+          relation: 'deliveryMethod',
+          scope: {
+            fields: ['code'],
+          },
+        },
+        {
+          relation: 'rows',
+          scope: {
+            fields: ['id', 'quantity', 'price', 'itemFk'],
+            include: [
+              {
+                relation: 'item',
+                scope: {
+                  fields: [
+                    'longName',
+                    'tag5',
+                    'value5',
+                    'tag6',
+                    'value6',
+                    'tag7',
+                    'value7',
+                    'image',
+                  ],
+                }
+              },
+            ],
+          },
+        },
+      ],
+      fields: [
+        'id',
+        'landed',
+        'delivery_method_id',
+        'addressFk',
+        'agencyModeFk',
+        'rows',
+      ]
+    };
 
-const getItems = async () => {
-    try {
-        const data = await jApi.query(
-            `SELECT bi.id, bi.amount, bi.price, i.longName item,
-            i.tag5, i.value5, i.tag6, i.value6, i.tag7, i.value7,
-            i.image, im.updated
-						FROM myOrderRow bi
-            JOIN vn.item i ON i.id = bi.itemFk
-            LEFT JOIN image im
-            ON im.collectionFk = 'catalog'
-            AND im.name = i.image
-						WHERE orderFk = #id`,
-            { id: orderId.value }
-        );
+    const { data: order } = await api.get(`Orders/${orderId.value}`, {
+      params: {
+        filter: JSON.stringify(filter)
+      }
+    });
 
-        const formattedData = data.map(i => {
-            const { amount: quantity, ...item } = i;
+    const taxBase = order.rows.reduce(
+      (acc, row) => acc + row.price * row.quantity,
+      0
+    );
+    const formattedData = {
+      id: order.id,
+      landed: new Date(order.landed),
+      agency: order.agencyMode.description,
+      method: order.deliveryMethod.code,
+      nickname: order.address.nickname,
+      street: order.address.street,
+      postalCode: order.address.postalCode,
+      city: order.address.city,
 
-            const formattedItem = {
-                quantity,
-                ...item
-            };
-            return formattedItem;
-        });
+      taxBase
+    };
+    ticket.value = formattedData;
 
-        rows.value = formattedData;
-    } catch (error) {
-        console.error(error);
-    }
+    const orderRows = order.rows.map(row => ({
+      id: row.id,
+      quantity: row.quantity,
+      price: row.price,
+
+      item: row.item.longName,
+      tag5: row.item.tag5,
+      value5: row.item.value5,
+      tag6: row.item.tag6,
+      value6: row.item.value6,
+      tag7: row.item.tag7,
+      value7: row.item.value7,
+      image: row.item.image,
+    }));
+    rows.value = orderRows;
+
+  } catch (error) {
+    console.error('Error getting orders:', error);
+  }
 };
 
 const fetchData = async () => {
-    await getItems();
     await getOrder();
 };
 </script>