busqueda functionality amend

pages/busqueda.vue

@@ -17,7 +17,7 @@
       <div v-if="!loadingProducts" class="col-md-9">
         <div class="carousel">
           <h2 class="title">Últimos productos</h2>
-          <ItemsRow class="items" :type="`product`" :items="carouselProducts" />
+          <ItemsRow class="items" :type="`product`" :items="carouselProducts.results" />
         </div>
         <div v-if="hasFilterTags" class="applied-filters">
           <h2 class="title">FILTROS APLICADOS</h2>
@@ -82,14 +82,14 @@
       </div>
     </div>
   </div>
-  appliedFilters: {{appliedFilters}} <br>
+  <!-- appliedFilters: {{appliedFilters}} <br>
     filters: {{filters}} <br>
     prices: {{prices}} <br>
     coordinates: {{coordinates}} <br>
     products: {{products}} <br>
     defaultProducts: {{defaultProducts}} <br>
-    <!-- carouselProducts: {{carouselProducts}} <br> -->
-    count: {{count}}
+     carouselProducts: {{carouselProducts}} <br>
+    count: {{count}} -->
 </template>
 
 <script>
@@ -151,29 +151,25 @@ export default {
   async beforeCreate() {
     const config = useRuntimeConfig()
     const params = import.meta.client ? clientSearch(this.$route.query) : serverSearch(this.$route.query)
-
     const data = await $fetch(`/search_products/?`, {
       baseURL: config.public.baseURL,
       method: 'GET',
-      query: {
-        q: params.q || '',
-        limit: 10,
-        offset: 0
-      },
+      params: params,
       headers: {
         Authorization: '/',
       },
     })
-    console.log('data', data)
+    //console.log('data', data)
 
     const products = data.products
+    //console.log('products', products)
     let defaultProducts = []
     if (products.length === 0) {
-      console.log('no products, fetching default')
+      //console.log('no products, fetching default')
       const data = await $fetch(`/search_products/?q=${params.q}`, {
         baseURL: config.public.baseURL,
         method: 'GET',
-        query: {
+        params: {
           order: 'newest',
           limit: 10,
           offset: 0
@@ -188,11 +184,15 @@ export default {
     const carouselProducts = await $fetch(`/products/`, {
       baseURL: config.public.baseURL,
       method: 'GET',
+      params: {
+          limit: 10,
+          offset: 0
+        },
       headers: {
         Authorization: '/',
       },
     })
-    console.log('carouselProducts', carouselProducts)
+    //console.log('carouselProducts', carouselProducts)
 
     let coordinates
     if (params.latitude && params.longitude) {
@@ -210,7 +210,7 @@ export default {
     } else {
       prices = { max: null, min: null }
     }
-    //TODO: Implement filtering logic
+
     this.appliedFilters = params.q
     this.filters = data.filters
     this.prices = prices
@@ -234,10 +234,18 @@ export default {
     },
 
     async getMoreProducts(offset) {
-      const data = await this.$api.get(`/search_products/?limit=10&offset=${offset}`, {
+      const config = useRuntimeConfig()
+      const data = await $fetch(`/search_products/`, {
         baseURL: config.public.baseURL,
         method: 'GET',
-        body: { params: this.appliedFilters },
+        params: {
+          ...this.appliedFilters,
+          limit: 10,
+          offset: offset
+        },
+        headers: {
+          Authorization: '/',
+        },
       })
       return data.products
     },