Merge pull request 'develop' (#10) from develop into master

Reviewed-on: #10
Reviewed-by: Pablo Natek <pablone@verdnatura.es>

api/controller/Banners/banners.controller.js

@@ -0,0 +1,16 @@
+const db = require("../../db/db");
+const fs = require('fs');
+const path = require('path');
+
+class BannersController {
+  async findAll(req, res) {
+    const rows = await db.findAll_banner()
+    return res.status(200).send({
+      data: rows
+    })
+  }
+
+}
+
+
+module.exports = new BannersController()

api/controller/Contact/contact.controller.js

@@ -4,7 +4,6 @@ class ContactController {
   async Create(req, res) {
     try {
       const { name, phone, email, message } = req.body;
-      console.log(name, phone, email, message);
       const contact = await db.contact_Request(name, phone, email, message);
 
       return res.status(200).send({

api/controller/Payment/payment.services.js

@@ -1,21 +1,16 @@
 const db = require("../../db/db");
-const payPalProviders = require('./paypal.providers')
+const payPalProviders = require('./paypal/paypal.providers')
-const redsysProviders = require('./redsys.providers')
+const redsysProviders = require('./redsys/redsys.providers')
 
 class PaymentServices {
   async Create(req, res) {
     try {
-      //parâmetros para retornar os produtos que serão comprados
+      //parameters to return the products that will be purchased
       const { products, dateExpired, postalCode, customer, type } = req.body
-      const _products = await db.getProducts(dateExpired, postalCode)
 
-      const productsFilter = _products[0].filter((item) => {
+      const productsFilter = await db.getProductById(products[0]);
-        if (products.includes(item.id)) {
-          return item
-        }
-      });
 
-      if (productsFilter.length !== products.length) {
+      if (productsFilter[0][0].length !== products.length) {
         return res.status(422).send({
           data: {
             message: "Uno de los productos no existe."
@@ -24,7 +19,7 @@ class PaymentServices {
       }
 
       let priceIntial = 0
-      let price = productsFilter.reduce((accumulator, curValue) => accumulator + Number(curValue.price), priceIntial)
+      let price = productsFilter[0][0].reduce((accumulator, curValue) => accumulator + Number(curValue.price), priceIntial)
 
       let productsIds = ''
       for (let i = 0; i < products.length; i++) {
@@ -37,12 +32,13 @@ class PaymentServices {
           customerData: {
             ...customer.customerData,
             type: type,
-            products: productsFilter
+            products: productsFilter[0][0]
           }
         },
       })
+
       const order = await db.orderData_put(jsonOrderData);
-      const orderFk = order[0][0].orderFk
+      const orderFk = productsFilter[0][0][0].id;
 
       if (type === "paypal") {
         const data = await payPalProviders.New(orderFk, price)
@@ -56,16 +52,12 @@ class PaymentServices {
           data: { ...data, orderId: orderFk }
         })
       }
-      /* if (newOrder) {
+
-        return res.status(200).send({
-          data: { link: newOrder.links, orderId: orderFk }
-        })
-      } */
     } catch (error) {
-      console.log(error);
       return res.status(422).send({
         data: {
-          message: "Error al iniciar el pago"
+          message: "Error al iniciar el pago",
+          error: error.message
         }
       })
     }
@@ -74,40 +66,35 @@ class PaymentServices {
   async Success(req, res) {
     try {
       //Parameters payment
-      const { paymentId, PayerID, orderId } = req.body
+      const { orderId, type, ...paramns } = req.body
-      const payerId = { 'payer_id': PayerID };
+      if (type === "paypal") {
-
+        const payerId = { 'payer_id': paramns.PayerID };
-      //API validation payent and confirnm order
+        const data = await payPalProviders.success(paramns.paymentId, payerId, orderId)
-      paypal.payment.execute(paymentId, payerId, async function (error, payment) {
+        return res.status(200).send({
-        if (error) {
+          data: {
-          return res.status(422).send({
+            ...data,
-            data: {
+            message: "Payment success"
-              message: "payment not successful"
-            }
-          })
-        } else {
-          if (payment.state == 'approved') {
-            await db.order_confirm(orderId)
-            return res.status(200).send({
-              data: {
-                id: payment.id,
-                message: "payment completed successfully",
-              }
-            })
-          } else {
-            return res.status(422).send({
-              data: {
-                message: "payment not successful"
-              }
-            })
           }
-        }
+        })
-      });
+      }
+      if (type === "redsys") {
+        await redsysProviders.success(orderId)
+        return res.status(200).send({
+          data: {
+            message: "Payment success"
+          }
+        })
+      }
+
 
     } catch (error) {
-      throw error;
+      return res.status(422).send({
+        data: {
+          message: "Payment Error"
+        }
+      })
     }
   }
 }
 
-module.exports = new PaymentServices();
+module.exports = new PaymentServices();

api/controller/Payment/paypal/paypal.providers.js

@@ -1,4 +1,5 @@
 const paypal = require('paypal-rest-sdk');
+const db = require("../../../db/db");
 
 class PayPalProviders {
   async New(orderFk, price) {
@@ -6,7 +7,7 @@ class PayPalProviders {
       const payReq = JSON.stringify({
         'intent': 'sale',
         'redirect_urls': {
-          'return_url': `${process.env.BASE_URL}/checkout/success?orderId=${orderFk}`,
+          'return_url': `${process.env.BASE_URL}/checkout/success?orderId=${orderFk}&type=paypal`,
           'cancel_url': `${process.env.BASE_URL}/checkout/error`
         },
         'payer': {
@@ -14,14 +15,13 @@ class PayPalProviders {
         },
         'transactions': [{
           'amount': {
-            'total': 0.0000000001,
+            'total': price,
             'currency': 'EUR'
           },
           'description': 'This is the payment transaction description.'
         }]
       });
 
-      //Starting checkout process and returning sandbox url
       const newOrder = await new Promise(async (resolve, reject) => {
         paypal.payment.create(payReq, function (error, payment) {
           if (error) {
@@ -54,6 +54,28 @@ class PayPalProviders {
       throw error;
     }
   }
+
+  async success(paymentId, payerId, orderId) {
+    try {
+      return new Promise(async (resolve, reject) => {
+        paypal.payment.execute(paymentId, payerId, async function (error, payment) {
+          if (error) {
+            reject()
+          } else {
+            if (payment.state == 'approved') {
+              await db.order_confirm(orderId)
+              resolve({ id: payment.id })
+            } else {
+              reject()
+            }
+          }
+        });
+      }).then(res => res)
+    } catch (error) {
+      throw error
+    }
+
+  }
 }
 
 module.exports = new PayPalProviders();

api/controller/Payment/redsys-easy.text

@@ -1,39 +0,0 @@
-const Redsys = require('redsys-easy');
-const {
-  SANDBOX_URLS,
-  PRODUCTION_URLS,
-  TRANSACTION_TYPES
-} = Redsys
-
-class RedsysProviders {
-  async New(orderFk, price) {
-    console.log("Chama");
-    try {
-      const redsys = new Redsys({
-        secretKey: 'sq7HjrUOBfKmC576ILgskD5srU870gJ7',
-        urls: SANDBOX_URLS, // Also PRODUCTION_URLS
-      });
-      const obj = {
-        amount: price,
-        currency: 'EUR',
-        order: orderFk,
-        merchantName: 'Floraner',
-        merchantCode: '999008881',
-        transactionType: TRANSACTION_TYPES.AUTHORIZATION, // '0'
-        terminal: '001',
-        merchantURL: `${process.env.BASE_URL}/payments/redsys/notification`,
-        successURL: `${process.env.BASE_URL}/checkout/success?orderId=${orderFk}`,
-        errorURL: `${process.env.BASE_URL}/checkout/error`
-      }
-
-      const form = redsys.redirectPetition(obj)
-
-      console.log(form);
-      return true
-    } catch (error) {
-      throw error;
-    }
-  }
-}
-
-module.exports = new RedsysProviders();

api/controller/Payment/redsys-pos.text

@@ -1,34 +0,0 @@
-const RedsysPos = require('redsys-pos');
-const {
-  CURRENCIES, TRANSACTION_TYPES
-} = RedsysPos;
-
-class RedsysProviders {
-  async New(orderFk, price) {
-    console.log("Chama");
-    try {
-      const MERCHANT_KEY = "sq7HjrUOBfKmC576ILgskD5srU870gJ7";
-      const redsys = new RedsysPos(MERCHANT_KEY);
-      const obj = JSON.stringify({
-        amount: 100, // 100 euros
-        orderReference: orderFk,
-        merchantName: "Floranet",
-        merchantCode: "999008881",
-        currency: CURRENCIES.EUR,
-        transactionType: TRANSACTION_TYPES.AUTHORIZATION, // '0'
-        terminal: "001",
-        merchantURL: `${process.env.BASE_URL}/payments/redsys/notification`,
-        successURL: `${process.env.BASE_URL}/checkout/success?orderId=${orderFk}`,
-        errorURL: `${process.env.BASE_URL}/checkout/error`
-      });
-
-      console.log(obj);
-      const result = redsys.makePaymentParameters(obj);
-      return ""
-    } catch (error) {
-      throw error;
-    }
-  }
-}
-
-module.exports = new RedsysProviders();

api/controller/Payment/redsys.providers.js

@@ -1,33 +0,0 @@
-const RedsysPos = require('redsys-pos');
-const {
-  CURRENCIES, TRANSACTION_TYPES
-} = RedsysPos;
-
-class RedsysProviders {
-  async New(orderFk, price) {
-    try {
-      const MERCHANT_KEY = "sq7HjrUOBfKmC576ILgskD5srU870gJ7";
-      const redsys = new RedsysPos(MERCHANT_KEY);
-      const obj = {
-        amount: String(price),
-        orderReference: String(orderFk),
-        merchantName: "Floranet",
-        merchantCode: "999008881",
-        currency: CURRENCIES.EUR,
-        transactionType: TRANSACTION_TYPES.AUTHORIZATION, // '0'
-        terminal: "001",
-        merchantURL: `${process.env.BASE_URL}/payments/redsys/notification`,
-        successURL: `${process.env.BASE_URL}/checkout/success?orderId=${orderFk}`,
-        errorURL: `${process.env.BASE_URL}/checkout/error`
-      };
-
-      const result = redsys.makePaymentParameters(obj);
-      console.log(result);
-      return result
-    } catch (error) {
-      throw error;
-    }
-  }
-}
-
-module.exports = new RedsysProviders();

api/controller/Payment/redsys/redsys.providers.js

@@ -0,0 +1,53 @@
+const db = require("../../../db/db");
+
+const RedsysPos = require('redsys-pos');
+const {
+  CURRENCIES, TRANSACTION_TYPES
+} = RedsysPos;
+
+class RedsysProviders {
+  async New(orderFk, price) {
+    try {
+      const MERCHANT_KEY = process.env.REDSYS_MERCHANT_KEY;
+      const redsys = new RedsysPos(MERCHANT_KEY);
+
+      let orderValue = String(orderFk)
+      while (true) {
+        if (orderValue.length == 4) {
+          break
+        }
+        orderValue = '0' + orderValue
+      }
+      const regexAmount = /[,.]/
+      const amountValue = regexAmount.test(String(price)) ? String(price).replace(/[,.]/g, '') : String(price + '00')
+
+      const obj = {
+        amount: amountValue,
+        orderReference: orderValue,
+        merchantName: process.env.REDSYS_MERCHANT_NAME,
+        merchantCode: process.env.REDSYS_MERCHANT_CODE,
+        currency: "978",
+        transactionType: "0", // '0'
+        terminal: process.env.REDSYS_MERCHANT_TERMINAL,
+        merchantURL: `${process.env.BASE_URL}/payments/redsys/notification`,
+        successURL: `${process.env.BASE_URL}/checkout/success?orderId=${orderFk}&type=redsys`,
+        errorURL: `${process.env.BASE_URL}/checkout/error`
+      };
+
+      const result = redsys.makePaymentParameters(obj);
+      return { ...result, DS_MERCHANT_ORDER: obj.orderReference }
+    } catch (error) {
+      throw error;
+    }
+  }
+
+  async success(orderId) {
+    try {
+      return await db.order_confirm(orderId)
+    } catch (error) {
+      throw error
+    }
+  }
+}
+
+module.exports = new RedsysProviders();

api/controller/Product/product.controller.js

@@ -95,9 +95,10 @@ class ProductController {
   }
 
   async findById(req, res) {
+    const { dateExpired, postalCode } = req.query
     const id = Number(req.params.id)
-    const _products = await db.getProducts();
+    const product = await db.getProductById(req.params.id);
-    const filterProduct = _products[0].filter(item => item.id === id)
+    const filterProduct = (product[0][0] && product[0][0])?product[0][0]:{};
 
     return res.status(200).send({
       data: filterProduct

api/controller/product/product.controller.js

@@ -1,113 +0,0 @@
-const db = require("../../db/db");
-<<<<<<<< HEAD:api/controller/product/product.controller.js
-
-const productsJson = require("./products.json")
-========
->>>>>>>> master:api/controller/Product/product.controller.js
-
-class ProductController {
-  async findAll(req, res) {
-
-    const params = req.query;
-    const _products = await db.getProducts(params.dateExpired, params.postalCode);
-    let productsFilter = _products[0]
-
-    if (Number(params.recommend)) {
-      productsFilter = productsFilter.filter(item => item.recommend == params.recommend)
-    }
-    if (params.type) {
-      productsFilter = productsFilter.filter(item => item.type === params.type)
-    }
-
-    if (params.minPrice && !params.maxPrice) {
-      productsFilter = productsFilter.filter(item => {
-        const price = Number(item.price)
-        if (price >= Number(params.minPrice)) {
-          return item
-        }
-      })
-    }
-    if (params.maxPrice && !params.minPrice) {
-      productsFilter = productsFilter.filter(item => {
-        const price = Number(item.price)
-        if (price <= Number(params.maxPrice)) {
-          return item
-        }
-      })
-    }
-    if (params.maxPrice && params.minPrice) {
-      productsFilter = productsFilter.filter(item => {
-        const price = Number(item.price)
-        if (price >= Number(params.minPrice) && price <= Number(params.maxPrice)) {
-          return item
-        }
-      })
-    }
-
-
-    if (Number(params.bigPrice)) {
-      productsFilter.sort((a, b) => {
-        const itemA = Number(a.price)
-        const itemB = Number(b.price)
-        return itemB - itemA;
-      })
-    }
-
-    if (Number(params.lowPrice)) {
-      productsFilter.sort((a, b) => {
-        const itemA = Number(a.price)
-        const itemB = Number(b.price)
-        return itemA - itemB;
-      })
-    }
-
-    if (Number(params.order_descending)) {
-      productsFilter.sort((a, b) => {
-        const itemA = a.order_position
-        const itemB = b.order_position
-        return itemB - itemA;
-      })
-    }
-
-    if (Number(params.order_crescent)) {
-      productsFilter.sort((a, b) => {
-        const itemA = a.order_position
-        const itemB = b.order_position
-        return itemA - itemB;
-      })
-    }
-
-    if (Number(params.isNew)) {
-      productsFilter = productsFilter.filter(item => item.isNew == Number(params.isNew))
-    }
-
-    /*   let productsFilterPages = []
-      const totalItens = params?.itens ? Number(params.itens) : 200
-      const page = params.page ? Number(params.page) : 1
-      const startIndex = (totalItens * page) - totalItens
-      const lastIndex = (totalItens * page)
-      const products = productsFilter.slice(startIndex, lastIndex)
-      productsFilterPages.push({
-        page: page,
-        productsPerPage: products.length,
-        products: products
-      }) */
-
-
-    return res.status(200).send({
-      data: productsFilter
-    })
-  }
-
-  async findById(req, res) {
-    const id = Number(req.params.id)
-    const _products = await db.getProducts();
-    const filterProduct = _products[0].filter(item => item.id === id)
-
-    return res.status(200).send({
-      data: filterProduct
-    })
-  }
-}
-
-module.exports = new ProductController();

api/db/db.js

@@ -11,7 +11,7 @@ async function connect() {
 
 
   const mysql = require("mysql2/promise");
-  const connection = await mysql.createConnection("mysql://" + user + ":" + password + "@" + host + ":" + port + "/" + database + "");
+  const connection = await mysql.createConnection({host: host,port: port,user: user,password: password,database: database});
   global.connection = connection;
   return connection;
 }
@@ -23,14 +23,20 @@ async function getProducts(dateExpired, postalCode) {
   return rows;
 }
 
+async function getProductById(id) {
+  const conn = await connect();
+  const rows = await conn.query(`CALL catalogue_findById(${id})`);
+  return rows;
+}
+
 //Procedure for create transactions, do not carry out any manipulation at the bank
 async function orderData_put(jsonOrderData) {
   const conn = await connect();
-  const [rows] = await conn.query(`CALL orderData_put(?)`, [jsonOrderData], (err, results) => {
+  const [rows] = await conn.query(`CALL order_put(?)`, [jsonOrderData], (err, results) => {
     if (err) {
       console.error(err);
     } else {
-      console.log('Result:', results);
+
     }
   });
   return rows;
@@ -68,9 +74,25 @@ async function deliveryDate_get(postalCode) {
 
 async function contact_Request(name, phone, email, message) {
   const conn = await connect();
-  const [rows] = await conn.query(`CALL contact_Request("${name}", "${phone}", "${email}", "${message}")`);
+  const [rows] = await conn.query(`CALL contact_request("${name}", "${phone}", "${email}", "${message}")`);
+  return rows;
+}
+
+async function findAll_banner() {
+  const conn = await connect();
+  const [rows] = await conn.query(`CALL sliders_get`);
   return rows;
 }
 
 
-module.exports = { getProducts, orderData_get, orderData_put, getProvinces, deliveryDate_get, contact_Request, order_confirm }
+module.exports = {
+  getProducts,
+  getProductById,
+  orderData_get,
+  orderData_put,
+  getProvinces,
+  deliveryDate_get,
+  contact_Request,
+  order_confirm,
+  findAll_banner
+}

api/index.js

@@ -7,6 +7,7 @@ const paymengtController = require('./controller/Payment/payment.controller');
 const provincesController = require('./controller/Provinces/provinces.controller');
 const deliveryController = require('./controller/Delivery/delivery.controller');
 const contactController = require('./controller/Contact/contact.controller');
+const bannersController = require('./controller/Banners/banners.controller');
 
 paypal.configure({
   'mode': 'sandbox',
@@ -17,7 +18,7 @@ paypal.configure({
 const app = express();
 const port = 9999;
 
-const allowedOrigins = ['http://localhost:9100', 'https://floranet.onecommerce.dev','http://49.13.85.117','http://floranet.onecommerce.dev'];
+const allowedOrigins = ['https://staging.floranet.es','http://localhost:9100', 'https://floranet.onecommerce.dev', 'http://49.13.85.117', 'http://floranet.onecommerce.dev'];
 const corsOptions = {
   origin: allowedOrigins,
   optionsSuccessStatus: 200,
@@ -46,7 +47,7 @@ app.get('/api/payment/cancel', paymengtController.Cancel)
 app.get('/api/provinces', provincesController.findAll)
 app.get('/api/delivery/dates', deliveryController.findByPostalCode)
 app.post('/api/contact/save', contactController.Create)
-
+app.get('/api/banners/', bannersController.findAll)
 
 
 app.listen(port, () => {

package-lock.json

@@ -157,14 +157,6 @@
         "npm": ">=6.14.13"
       }
     },
-    "node_modules/@fastify/busboy": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/@fastify/busboy/-/busboy-2.1.1.tgz",
-      "integrity": "sha512-vBZP4NlzfOlerQTnba4aqZoMhE/a9HY7HRqoOPaETQcSQuWEIyZMHGfVu6w9wGtGK5fED5qRs2DteVCjOH60sA==",
-      "engines": {
-        "node": ">=14"
-      }
-    },
     "node_modules/@floating-ui/core": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.0.tgz",
@@ -2162,6 +2154,118 @@
         "esbuild-windows-arm64": "0.14.51"
       }
     },
+    "node_modules/esbuild-android-64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-android-64/-/esbuild-android-64-0.14.51.tgz",
+      "integrity": "sha512-6FOuKTHnC86dtrKDmdSj2CkcKF8PnqkaIXqvgydqfJmqBazCPdw+relrMlhGjkvVdiiGV70rpdnyFmA65ekBCQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-android-arm64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-android-arm64/-/esbuild-android-arm64-0.14.51.tgz",
+      "integrity": "sha512-vBtp//5VVkZWmYYvHsqBRCMMi1MzKuMIn5XDScmnykMTu9+TD9v0NMEDqQxvtFToeYmojdo5UCV2vzMQWJcJ4A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-darwin-64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-darwin-64/-/esbuild-darwin-64-0.14.51.tgz",
+      "integrity": "sha512-YFmXPIOvuagDcwCejMRtCDjgPfnDu+bNeh5FU2Ryi68ADDVlWEpbtpAbrtf/lvFTWPexbgyKgzppNgsmLPr8PA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-darwin-arm64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.14.51.tgz",
+      "integrity": "sha512-juYD0QnSKwAMfzwKdIF6YbueXzS6N7y4GXPDeDkApz/1RzlT42mvX9jgNmyOlWKN7YzQAYbcUEJmZJYQGdf2ow==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-freebsd-64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-freebsd-64/-/esbuild-freebsd-64-0.14.51.tgz",
+      "integrity": "sha512-cLEI/aXjb6vo5O2Y8rvVSQ7smgLldwYY5xMxqh/dQGfWO+R1NJOFsiax3IS4Ng300SVp7Gz3czxT6d6qf2cw0g==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-freebsd-arm64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.14.51.tgz",
+      "integrity": "sha512-TcWVw/rCL2F+jUgRkgLa3qltd5gzKjIMGhkVybkjk6PJadYInPtgtUBp1/hG+mxyigaT7ib+od1Xb84b+L+1Mg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-linux-32": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-32/-/esbuild-linux-32-0.14.51.tgz",
+      "integrity": "sha512-RFqpyC5ChyWrjx8Xj2K0EC1aN0A37H6OJfmUXIASEqJoHcntuV3j2Efr9RNmUhMfNE6yEj2VpYuDteZLGDMr0w==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/esbuild-linux-64": {
       "version": "0.14.51",
       "resolved": "https://registry.npmjs.org/esbuild-linux-64/-/esbuild-linux-64-0.14.51.tgz",
@@ -2178,6 +2282,198 @@
         "node": ">=12"
       }
     },
+    "node_modules/esbuild-linux-arm": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-arm/-/esbuild-linux-arm-0.14.51.tgz",
+      "integrity": "sha512-LsJynDxYF6Neg7ZC7748yweCDD+N8ByCv22/7IAZglIEniEkqdF4HCaa49JNDLw1UQGlYuhOB8ZT/MmcSWzcWg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-linux-arm64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-arm64/-/esbuild-linux-arm64-0.14.51.tgz",
+      "integrity": "sha512-D9rFxGutoqQX3xJPxqd6o+kvYKeIbM0ifW2y0bgKk5HPgQQOo2k9/2Vpto3ybGYaFPCE5qTGtqQta9PoP6ZEzw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-linux-mips64le": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.14.51.tgz",
+      "integrity": "sha512-vS54wQjy4IinLSlb5EIlLoln8buh1yDgliP4CuEHumrPk4PvvP4kTRIG4SzMXm6t19N0rIfT4bNdAxzJLg2k6A==",
+      "cpu": [
+        "mips64el"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-linux-ppc64le": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.14.51.tgz",
+      "integrity": "sha512-xcdd62Y3VfGoyphNP/aIV9LP+RzFw5M5Z7ja+zdpQHHvokJM7d0rlDRMN+iSSwvUymQkqZO+G/xjb4/75du8BQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-linux-riscv64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.14.51.tgz",
+      "integrity": "sha512-syXHGak9wkAnFz0gMmRBoy44JV0rp4kVCEA36P5MCeZcxFq8+fllBC2t6sKI23w3qd8Vwo9pTADCgjTSf3L3rA==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-linux-s390x": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-s390x/-/esbuild-linux-s390x-0.14.51.tgz",
+      "integrity": "sha512-kFAJY3dv+Wq8o28K/C7xkZk/X34rgTwhknSsElIqoEo8armCOjMJ6NsMxm48KaWY2h2RUYGtQmr+RGuUPKBhyw==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-netbsd-64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-netbsd-64/-/esbuild-netbsd-64-0.14.51.tgz",
+      "integrity": "sha512-ZZBI7qrR1FevdPBVHz/1GSk1x5GDL/iy42Zy8+neEm/HA7ma+hH/bwPEjeHXKWUDvM36CZpSL/fn1/y9/Hb+1A==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-openbsd-64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-openbsd-64/-/esbuild-openbsd-64-0.14.51.tgz",
+      "integrity": "sha512-7R1/p39M+LSVQVgDVlcY1KKm6kFKjERSX1lipMG51NPcspJD1tmiZSmmBXoY5jhHIu6JL1QkFDTx94gMYK6vfA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-sunos-64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-sunos-64/-/esbuild-sunos-64-0.14.51.tgz",
+      "integrity": "sha512-HoHaCswHxLEYN8eBTtyO0bFEWvA3Kdb++hSQ/lLG7TyKF69TeSG0RNoBRAs45x/oCeWaTDntEZlYwAfQlhEtJA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "sunos"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-windows-32": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-windows-32/-/esbuild-windows-32-0.14.51.tgz",
+      "integrity": "sha512-4rtwSAM35A07CBt1/X8RWieDj3ZUHQqUOaEo5ZBs69rt5WAFjP4aqCIobdqOy4FdhYw1yF8Z0xFBTyc9lgPtEg==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-windows-64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-windows-64/-/esbuild-windows-64-0.14.51.tgz",
+      "integrity": "sha512-HoN/5HGRXJpWODprGCgKbdMvrC3A2gqvzewu2eECRw2sYxOUoh2TV1tS+G7bHNapPGI79woQJGV6pFH7GH7qnA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-windows-arm64": {
+      "version": "0.14.51",
+      "resolved": "https://registry.npmjs.org/esbuild-windows-arm64/-/esbuild-windows-arm64-0.14.51.tgz",
+      "integrity": "sha512-JQDqPjuOH7o+BsKMSddMfmVJXrnYZxXDHsoLHc0xgmAZkOOCflRmC43q31pk79F9xuyWY45jDBPolb5ZgGOf9g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/escalade": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
@@ -2819,6 +3115,20 @@
       "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==",
       "dev": true
     },
+    "node_modules/fsevents": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
+      "hasInstallScript": true,
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
     "node_modules/function-bind": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
@@ -5425,12 +5735,9 @@
       }
     },
     "node_modules/undici": {
-      "version": "6.6.2",
+      "version": "6.9.0",
-      "resolved": "https://registry.npmjs.org/undici/-/undici-6.6.2.tgz",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-6.9.0.tgz",
-      "integrity": "sha512-vSqvUE5skSxQJ5sztTZ/CdeJb1Wq0Hf44hlYMciqHghvz+K88U0l7D6u1VsndoFgskDcnU+nG3gYmMzJVzd9Qg==",
+      "integrity": "sha512-XPWfXzJedevUziHwun70EKNvGnxv4CnfraFZ4f/JV01+fcvMYzHE26r/j8AY/9c/70nkN4B1zX7E2Oyuqwz4+Q==",
-      "dependencies": {
-        "@fastify/busboy": "^2.0.0"
-      },
       "engines": {
         "node": ">=18.0"
       }

quasar.config.js

@@ -60,7 +60,7 @@ module.exports = configure(function (ctx) {
       env: {
         API: ctx.dev
           ? "http://localhost:9999/api/"
-          : "https://floranet-back.onecommerce.dev/api/",
+          : "https://api-staging.floranet.es/api/",
       },
 
       target: {

src/components/@inputs/Calendar.vue

@@ -10,17 +10,16 @@ import IconCalendar from "../icons/IconCalendar.vue";
 export default defineComponent({
   name: "calendar-input",
   components: { IconCalendar },
-  props: ["modelValue", "bindValue", "setValues"],
+  props: ["modelValue", "bindValue", "setValues", "dateCookies"],
-  setup({ setValues }, { emit }) {
+  setup({ setValues, dateCookies, modelValue }, { emit }) {
     const formStore = useFormStore();
     const { availability, postalCodeValid } = storeToRefs(formStore);
 
     const [year, month, day] = fullCurrentDate.replaceAll("/", "-").split("-");
     const currentDate = `${day}-${month}-${year}`;
-    const proxyDate = ref(invertDate(currentDate));
+    const proxyDate = ref(invertDate(modelValue));
-
     function updateProxy() {
-      proxyDate.value = invertDate(currentDate);
+      proxyDate.value = invertDate(proxyDate.value);
     }
 
     function optionsValidDates(date) {
@@ -37,6 +36,8 @@ export default defineComponent({
 
     watch(proxyDate, (newProxy) => {
       setValues({ date: invertDate(newProxy) });
+      const btn = document.querySelector(".buttons-close-modal button")
+      if(btn) btn.click()
     });
 
     const LOCALE = {
@@ -71,7 +72,6 @@ export default defineComponent({
       <IconCalendar />
 
       <q-popup-proxy
-        @before-show="updateProxy"
         cover
         transition-show="scale"
         transition-hide="scale"
@@ -83,9 +83,9 @@ export default defineComponent({
           :readonly="!postalCodeValid.isValid"
           mask="YYYY-MM-DD"
         >
-          <div class="row items-center justify-end q-gutter-sm">
+          <div class="row items-center justify-end q-gutter-sm buttons-close-modal">
             <q-btn label="Cancel" color="primary" flat v-close-popup />
-            <q-btn label="OK" color="primary" flat v-close-popup />
+            <q-btn label="OK" color="primary" flat v-close-popup class="modal-close"/>
           </div>
         </q-date>
       </q-popup-proxy>
@@ -108,4 +108,4 @@ export default defineComponent({
       />
     </div>
   </div>
-</template>
+</template>

src/components/@inputs/PostalCode.vue

@@ -43,8 +43,8 @@ export default defineComponent({
         } = await apiBack.get(`/delivery/dates`, {
           params: { postalCode: postalCodeInput.value },
         });
-        const dates = data.map(({ dated }) => {
+        const dates = data.map(({ nextDay }) => {
-          const getDate = new Date(dated);
+          const getDate = new Date(nextDay);
           const day = getDate.getDate().toString().padStart(2, "0");
           const month = (getDate.getMonth() + 1).toString().padStart(2, "0");
           const year = getDate.getFullYear();
@@ -53,6 +53,14 @@ export default defineComponent({
           return formattedDate;
         });
 
+        if(!dates.length) {
+          quasarNotify({
+            type: "erro",
+            message: `No tenemos fechas de entrega posibles para este código postal`,
+          });
+          setFieldError("postalCode", M.fiveLength);
+        }
+
         postalCodeValid.value.dataOptions = dates;
         postalCodeValid.value.isValid = true;
         isPostalCodeLoading.value = false;
@@ -63,9 +71,8 @@ export default defineComponent({
             "Se ha producido un error en el proceso de identificación del código postal",
         });
         isPostalCodeLoading.value = false;
-        console.error(`FATAL ERROR ::: ${error}`);
       } finally {
-        // console.log("click");
+
       }
     }
 
@@ -88,7 +95,7 @@ export default defineComponent({
         :model-value="modelValue"
         @update:model-value="updateModel"
         v-bind="bindValue"
-        class="custom-main-paragraph"
+        class="custom-main-paragraph field-postal-code"
         :error="false"
         placeholder="código postal"
         mask="#####"
@@ -110,4 +117,4 @@ export default defineComponent({
     }
   }
 }
-</style>
+</style>

src/components/header/UserArea.vue

@@ -66,6 +66,8 @@ export default defineComponent({
   display: flex;
   align-items: center;
   gap: 34px;
+  min-width: 190px;
+  justify-content: flex-end;
 
   & .user-area-link {
     color: $white;
@@ -108,6 +110,8 @@ export default defineComponent({
 
   @media only screen and (max-width: $med-md) {
     gap: 27px;
+    min-width: auto;
+
     & .user-area-link {
       &.help {
         display: none;

src/components/quasar-components/carousel/VerticalCarouselImgs.vue

@@ -1,4 +1,5 @@
 <script>
+import { storeToRefs } from "pinia";
 import { defineComponent } from "vue";
 
 import Calendar from "src/components/@inputs/Calendar.vue";
@@ -6,14 +7,30 @@ import PostalCode from "src/components/@inputs/PostalCode.vue";
 import IconSearch from "src/components/icons/IconSearch.vue";
 import { usePostalCalendar } from "src/hooks/usePostalCalendar";
 import { useVerticalCarouselImgs } from "src/hooks/useVerticalCarouselImgs";
+import { useFormStore } from "src/stores/forms";
+import { onMounted } from "vue";
+import { useLocalStorage } from "../../../hooks/useLocalStorage";
 
 export default defineComponent({
   name: "vertical-carousel-imgs",
   props: {
-    imgsArr: {
+    banners: {
       type: Array,
-      default: () => [""],
+      default: () => [
-    },
+        {
+            "url": "/assets/Cabecera-flornatura-1.jpg",
+            "longName": "Regala un verano lleno de flores y plantas"
+        },
+        {
+            "url": "/assets/Cabecera-flornatura-2.jpg",
+            "longName": "Regala un verano lleno de flores y plantas"
+        },
+        {
+            "url": "/assets/Cabecera-flornatura-3.jpg",
+            "longName": "Regala un verano lleno de flores y plantas"
+        }
+      ],
+    }
   },
   components: { IconSearch, Calendar, PostalCode },
   setup() {
@@ -26,6 +43,36 @@ export default defineComponent({
     } = usePostalCalendar({ type: "home" });
     const { navPos, screenWidth, slide, target } = useVerticalCarouselImgs();
 
+    const formStore = useFormStore();
+    const { getItem } = useLocalStorage();
+    const localValues = getItem("availability");
+    const lengthCp = 5;
+
+    const { postalCodeValid } = storeToRefs(formStore);
+    let isEventKeyActive = false;
+
+    function handleFormKeyPress() {
+      const postalCodeField = document.querySelector("#carousel-form .postal-code-control input");
+      const modalDate = document.querySelector("#carousel-form .calendar .custom-date-btn");
+      postalCodeField.addEventListener('input', (e) =>{
+        if (e.target.value.length === lengthCp) {
+          isEventKeyActive = true;
+        }
+      })
+      postalCodeField.addEventListener('keypress', e => {
+        if (e.target.value.length === lengthCp && isEventKeyActive) {
+          if (e.key === 'Enter') {
+            e.preventDefault();
+            modalDate.click();
+            isEventKeyActive = false;
+          }
+        }
+      })
+    }
+    onMounted(() => {
+      handleFormKeyPress();
+    })
+
     return {
       slide,
       navPos,
@@ -39,58 +86,35 @@ export default defineComponent({
       postalCodeAttrs,
       calendar,
       calendarAttrs,
+      localValues
     };
   },
 });
 </script>
 
 <template>
-  <div
+  <div ref="target" class="vertical-carousel-container" style="min-height: 100dvh">
-    ref="target"
+    <q-carousel navigation-position="right" style="min-height: 100dvh" v-model="slide" navigation autoplay infinite
-    class="vertical-carousel-container"
+      animated v-if="!!banners.length" class="custom-carousel">
-    style="min-height: 100dvh"
+      <q-carousel-slide v-for="(item, i) in banners" :key="`banner-${i}`" :name="`banner-${i}`" :img-src="item.url">
-  >
+        <div class="vertical-carousel-content">
-    <q-carousel
+          <header class="carousel-content-header">
-      navigation-position="right"
+            <h1 class="carousel-header-title">
-      style="min-height: 100dvh"
+              {{ item.longName }}
-      v-model="slide"
+            </h1>
-      navigation
+          </header>
-      autoplay
+        </div>
-      infinite
+      </q-carousel-slide>
-      animated
-      v-if="!!imgsArr.length"
-      class="custom-carousel"
-    >
-      <q-carousel-slide
-        v-for="(img, i) in imgsArr"
-        :key="i"
-        :name="img"
-        :img-src="img"
-      />
     </q-carousel>
 
-    <div class="vertical-carousel-content">
+    <div class="carousel-form">
-      <header class="carousel-content-header">
+      <form @submit="onSubmit" class="carousel-content-body" id="carousel-form">
-        <h1 class="carousel-header-title">
+        <div class="carousel-content-item postal-code-control">
-          Regala un verano lleno de flores y plantas
+          <PostalCode v-model="postalCode" v-bind:bindValue="postalCodeAttrs" :setFieldError="setFieldError" />
-        </h1>
-      </header>
-
-      <form @submit="onSubmit" class="carousel-content-body">
-        <div class="carousel-content-item">
-          <PostalCode
-            v-model="postalCode"
-            v-bind:bindValue="postalCodeAttrs"
-            :setFieldError="setFieldError"
-          />
         </div>
 
-        <div class="carousel-content-item">
+        <div class="carousel-content-item date-expired-control">
-          <Calendar
+          <Calendar v-model="calendar" v-bind:bindValue="calendarAttrs" :setValues="setValues" :dateCookies="localValues.dateExpired"/>
-            v-model="calendar"
-            v-bind:bindValue="calendarAttrs"
-            :setValues="setValues"
-          />
         </div>
 
         <q-btn type="submit" class="btn carousel-content-item">
@@ -98,36 +122,110 @@ export default defineComponent({
         </q-btn>
       </form>
     </div>
+
   </div>
 </template>
 
 <style lang="scss" scoped>
 .vertical-carousel-container {
   position: relative;
+
   & .custom-carousel {
     user-select: none;
   }
-
+  .carousel-form{
-  & .vertical-carousel-content {
+    max-width: 850px;
+    margin: 0 auto;
     position: absolute;
-    min-height: fit-content;
+    bottom: 15vh;
     left: 0;
     right: 0;
-    bottom: 110px;
+  }
+  .carousel-content-body {
+    display: flex;
+    flex-wrap: wrap;
+    border-radius: 10px 0 0 10px;
+    overflow: hidden;
+    min-height: 96px;
+
+    /* & .carousel-content {
+      border-radius: 10px 10px 0 0;
+      overflow: hidden;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      display: flex;
+      flex: 2;
+      background-color: $white;
+    } */
+
+    & .carousel-content-item {
+      display: flex;
+      align-items: center;
+      padding-inline: 53px 34px;
+      flex: 1;
+      position: relative;
+
+      &:first-child::after {
+        content: "";
+        position: absolute;
+        width: 1px;
+        opacity: 0.2;
+        background-color: $text-normal-100;
+        right: 0;
+        top: 27px;
+        bottom: 29px;
+
+        @media only screen and (max-width: $med-md) {
+          display: none;
+        }
+      }
+
+      &.btn {
+
+        &:focus,
+        &:focus-visible {
+          outline: none;
+        }
+      }
+
+      &:not(:last-child) {
+        background-color: $white;
+      }
+
+      &:last-child {
+        border-radius: 0 10px 10px 0;
+        padding-inline: 56px;
+      }
+    }
+  }
+  & .vertical-carousel-content {
+    min-height: fit-content;
     width: min(100%, 845px);
     margin: 0 auto;
+
     & .carousel-content-header {
       display: flex;
       flex-direction: column;
       gap: 17px;
       color: $white;
       text-align: center;
+      position: absolute;
+      bottom: 30vh;
+      left: 0;
+      width: 100%;
       margin-bottom: 27px;
+
       & .carousel-header-title {
         font-size: $font-35;
         font-weight: 500;
         line-height: 30px;
         color: currentColor;
+
+        @media only screen and (max-width: $med-xmd) {
+          padding-left: 20px;
+          padding-right: 20px;
+        }
       }
 
       & .carousel-header-paragraph {
@@ -137,61 +235,6 @@ export default defineComponent({
       }
     }
 
-    & .carousel-content-body {
-      display: flex;
-      flex-wrap: wrap;
-      border-radius: 10px 0 0 10px;
-      overflow: hidden;
-      min-height: 96px;
-
-      /* & .carousel-content {
-        border-radius: 10px 10px 0 0;
-        overflow: hidden;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-        display: flex;
-        flex: 2;
-        background-color: $white;
-      } */
-
-      & .carousel-content-item {
-        display: flex;
-        align-items: center;
-        padding-inline: 53px 34px;
-        flex: 1;
-        position: relative;
-        &:first-child::after {
-          content: "";
-          position: absolute;
-          width: 1px;
-          opacity: 0.2;
-          background-color: $text-normal-100;
-          right: 0;
-          top: 27px;
-          bottom: 29px;
-          @media only screen and (max-width: $med-md) {
-            display: none;
-          }
-        }
-        &.btn {
-          &:focus,
-          &:focus-visible {
-            outline: none;
-          }
-        }
-
-        &:not(:last-child) {
-          background-color: $white;
-        }
-
-        &:last-child {
-          border-radius: 0 10px 10px 0;
-          padding-inline: 56px;
-        }
-      }
-    }
-
     & .carousel-content-footer {
       display: grid;
       place-items: center;
@@ -199,12 +242,13 @@ export default defineComponent({
 
     @media only screen and (max-width: $med-xmd) {
       padding-inline: 20px;
-      top: 50%;
-      transform: translateY(-50%);
 
       & .carousel-content-header {
         gap: 15px;
-        margin-bottom: 49px;
+        margin-bottom: 20px;
+        bottom: initial;
+        top: calc(10dvh + 120px);
+
         & .carousel-header-title {
           font-size: $font-28;
           line-height: 34px;
@@ -215,33 +259,43 @@ export default defineComponent({
           font-weight: 500;
         }
       }
-      & .carousel-content-body {
-        margin-bottom: initial;
-        flex-direction: column;
-        width: min(100%, 276px);
-        margin: 0 auto;
-        & .carousel-content-item {
-          padding-block: 24px;
-          &:first-child {
-            border-radius: 10px 10px 0px 0px;
-          }
-          &:last-child {
-            border-radius: 0 0 10px 10px;
-          }
-        }
-      }
 
       & .carousel-content-footer {
         display: none;
       }
     }
 
-    @media only screen and (max-width: $med-md) {
+    @media only screen and (max-width: $med-md) {}
-    }
 
     @media only screen and (max-height: 360px) {
       /* background-color: tomato; */
     }
   }
+  @media only screen and (max-width: $med-xmd) {
+    .carousel-form{
+      bottom: 0;
+      top: 120px;
+      display: flex;
+      align-items: center;
+    }
+    & .carousel-content-body {
+      margin-bottom: initial;
+      flex-direction: column;
+      width: min(100%, 276px);
+      margin: 0 auto;
+
+      & .carousel-content-item {
+        padding-block: 24px;
+
+        &:first-child {
+          border-radius: 10px 10px 0px 0px;
+        }
+
+        &:last-child {
+          border-radius: 0 0 10px 10px;
+        }
+      }
+    }
+  }
 }
 </style>

src/components/sections/QuestionSection.vue

@@ -25,10 +25,10 @@ export default defineComponent({
       <header class="question-content">
         <LogoWhite class="white-logo" />
 
-        <p class="question-paragraph">
+        <!--<p class="question-paragraph">
           Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
           eiusmod tempor incididunt ut labore et dolore...
-        </p>
+        </p>-->
       </header>
 
       <div class="question-form">

src/components/ui/Card.vue

@@ -34,6 +34,7 @@ export default defineComponent({
       default: "",
     },
     isNew: String,
+    hasPostalCode: Boolean,
     size: {
       type: String,
       default: "md-card",
@@ -77,7 +78,7 @@ export default defineComponent({
 <template>
   <div class="card-container" :class="size">
     <RouterLink
-      :to="`/product/${id}`"
+      :to="(hasPostalCode)?`/product/${id}`:''"
       class="card-container-head"
       :class="[headClass]"
       role="heading"
@@ -112,7 +113,7 @@ export default defineComponent({
     <div class="card-container-body">
       <p class="card-name" v-if="title">{{ title }}</p>
 
-      <div class="card-values">
+      <div class="card-values" v-if="hasPostalCode">
         <p class="price" v-if="finalValue">{{ finalValue }}€</p>
         <p class="price offer tachado" v-if="+price !== finalValue">
           {{ price }}€

src/components/ui/QuestionForm.vue

@@ -20,8 +20,6 @@ export default defineComponent({
         messageAttrs,
         phone,
         phoneAttrs,
-        query,
-        queryAttrs,
         secondName,
         secondNameAttrs,
         terms,
@@ -40,8 +38,6 @@ export default defineComponent({
       emailAttrs,
       phone,
       phoneAttrs,
-      query,
-      queryAttrs,
       message,
       messageAttrs,
       terms,
@@ -107,16 +103,6 @@ export default defineComponent({
         </p>
       </div>
 
-      <q-input
-        v-model="query"
-        v-bind="queryAttrs"
-        :error-message="errors.query"
-        :error="!!errors.query"
-        bg-color="white"
-        label="Motivo de consulta"
-        class="consult"
-        outlined
-      />
       <q-input
         v-model="message"
         v-bind="messageAttrs"

src/functions/quasarNotify.js

@@ -1,6 +1,6 @@
 import { Notify } from "quasar";
 
-export function quasarNotify({ message = "", type, timeout = 1000 }) {
+export function quasarNotify({ message = "", type, timeout = 3000 }) {
   const obj = {
     success: () =>
       Notify.create({

src/hooks/useCheckoutForm.js

@@ -109,6 +109,14 @@ export function useCheckoutForm() {
     isHidden.value = false;
   };
 
+  const getFormatedDate = (date) => {
+    if(date){
+      let dated = new Date(date.replace('Z', ''));
+      return `${dated.toLocaleString('es-ES', { day: "numeric" })} de ${dated.toLocaleString('es-ES', { month: "short" })}`;
+    }
+    return '';
+  }
+
   // TODO hacer el await de las provincias
   /**
    * const provinceOptions = getProvinces();
@@ -241,7 +249,6 @@ export function useCheckoutForm() {
         type: values.paymentMethod,
       };
       addItem("payment", values.paymentMethod);
-
       const typeObj = {
         paypal: async () => {
           const {
@@ -254,8 +261,10 @@ export function useCheckoutForm() {
           const {
             data: { data },
           } = await apiBack.post("payment", productData);
-          redsysData.value = data;
+          redsysData.value = await data;
-
+          document.querySelector("input[name='Ds_SignatureVersion']").value = redsysData.value.Ds_SignatureVersion;
+          document.querySelector("input[name='Ds_MerchantParameters']").value = redsysData.value.Ds_MerchantParameters;
+          document.querySelector("input[name='Ds_Signature']").value = redsysData.value.Ds_Signature;
           redsysFormRef.value.click();
         },
         default: () => {
@@ -328,6 +337,7 @@ export function useCheckoutForm() {
     phoneInputRef,
     phoneSenderInputRef,
     redsysFormRef,
+    getFormatedDate,
 
     phone: { phoneData, phoneSenderData },
 

src/hooks/usePostalCalendar.js

@@ -74,9 +74,17 @@ export function usePostalCalendar({ modalItem = "", type = "home" }) {
 
     return isAvailabilityEmpty.value;
   });
-
+  let DATE_INITIAL
   const [YEAR, MONTH, DAY] = fullCurrentDate.replaceAll("/", "-").split("-");
   const CURRENT_DATE = `${DAY}-${MONTH}-${YEAR}`;
+  DATE_INITIAL = CURRENT_DATE
+  if (availability.value.dateExpired) {
+    const [yearStorage, monthStorage, dayStorage] = availability.value.dateExpired.replaceAll("/", "-").split("-");
+    const STORAGE_DATE = `${dayStorage}-${monthStorage}-${yearStorage}`;
+    DATE_INITIAL = STORAGE_DATE
+  }
+  const POSTAL_CODE_INITIAL = availability.value.postalCode ? availability.value.postalCode : ""
+
   const {
     handleSubmit,
     handleReset,
@@ -94,11 +102,11 @@ export function usePostalCalendar({ modalItem = "", type = "home" }) {
         min,
         max,
       },
-      postalCode: "",
+      postalCode: POSTAL_CODE_INITIAL,
-      date: CURRENT_DATE,
+      date: DATE_INITIAL,
     },
     initialTouched: {
-      date: false,
+      date: availability.value.dateExpired ? true : false,
       postalCode: true,
     },
   });

src/hooks/useQuestionForm.js

@@ -41,7 +41,6 @@ export function useQuestionForm() {
   const [phone, phoneAttrs] = defineField("phone", {
     validateOnModelUpdate: false,
   });
-  const [query, queryAttrs] = defineField("query");
   const [message, messageAttrs] = defineField("message");
   const [terms, termsAttrs] = defineField("terms");
 
@@ -102,8 +101,6 @@ export function useQuestionForm() {
       emailAttrs,
       phone,
       phoneAttrs,
-      query,
-      queryAttrs,
       message,
       messageAttrs,
       terms,

src/pages/CategoryPage.vue

@@ -283,6 +283,7 @@ export default defineComponent({
               :imgSrc="item.image"
               :isNew="item.isNew"
               :id="item.id"
+              :hasPostalCode="(item.postalCode !== 'undefined')?true:false"
             />
           </template>
         </Container>

src/pages/CheckoutPage.vue

@@ -16,6 +16,7 @@ export default defineComponent({
       provinceOptions,
       handleClickStep,
       stepsFormated,
+      getFormatedDate,
       stepList,
       checkoutBlock,
       cart,
@@ -92,6 +93,7 @@ export default defineComponent({
 
       checkoutBlock,
       stepsFormated,
+      getFormatedDate,
       provinceOptions,
       totalPrice,
       stepList,
@@ -141,39 +143,29 @@ export default defineComponent({
   <q-page class="checkout-page">
     <Container tag="section">
       <header class="header-title">
-        <h1 class="pege-title">¿A quién y dónde lo entregamos"</h1>
+        <h1 class="pege-title">¿A quién y dónde lo entregamos?</h1>
 
-        <p class="page-subtitle checkout">
+        <!--<p class="page-subtitle checkout">
           Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
           eiusmod tempor incididunt ut labore et dolore magna aliqua.
-        </p>
+        </p>-->
       </header>
 
       <div class="checkout-container">
         <div class="checkout-steps">
-          <div
+          <div v-for="({ active, description, name, value }, i) in stepsFormated" class="step-item-container" :key="i">
-            v-for="({ active, description, name, value }, i) in stepsFormated"
-            class="step-item-container"
-            :key="i"
-          >
             <div class="step-item">
               <div class="circle-step-container">
                 <span class="border-step" :class="[i == 0 && 'transparent']" />
 
-                <div
+                <div class="circle-step" :class="[
-                  class="circle-step"
+            (active || (meta.valid && i == 1) || !checkoutBlock) &&
-                  :class="[
+            'active',
-                    (active || (meta.valid && i == 1) || !checkoutBlock) &&
+          ]">
-                      'active',
-                  ]"
-                >
                   <span class="step-value">{{ value }}</span>
                 </div>
 
-                <span
+                <span class="border-step" :class="[i == stepList['data'].length - 1 && 'transparent']" />
-                  class="border-step"
-                  :class="[i == stepList['data'].length - 1 && 'transparent']"
-                />
               </div>
 
               <div class="step-content">
@@ -199,85 +191,37 @@ export default defineComponent({
 
                 <div class="checkout-fields">
                   <div class="field-control field-input">
-                    <q-input
+                    <q-input placeholder="Nombre*" name="name" type="text" v-model="name" v-bind:="nameAttrs"
-                      placeholder="Nombre*"
+                      :error="!!errors.name" :error-message="errors.name" outlined />
-                      name="name"
-                      type="text"
-                      v-model="name"
-                      v-bind:="nameAttrs"
-                      :error="!!errors.name"
-                      :error-message="errors.name"
-                      outlined
-                    />
                   </div>
 
                   <div class="field-control field-input">
-                    <q-input
+                    <q-input placeholder="Apellidos*" name="surname" type="text" v-model="surname"
-                      placeholder="Apellidos*"
+                      v-bind:="surnameAttrs" :error="!!errors.surname" :error-message="errors.surname" outlined />
-                      name="surname"
-                      type="text"
-                      v-model="surname"
-                      v-bind:="surnameAttrs"
-                      :error="!!errors.surname"
-                      :error-message="errors.surname"
-                      outlined
-                    />
                   </div>
 
                   <div class="field-control field-input">
-                    <q-input
+                    <q-input placeholder="Dirección*" name="address" type="text" v-model="address"
-                      placeholder="Dirección*"
+                      v-bind:="addressAttrs" :error="!!errors.address" :error-message="errors.address" outlined />
-                      name="address"
-                      type="text"
-                      v-model="address"
-                      v-bind:="addressAttrs"
-                      :error="!!errors.address"
-                      :error-message="errors.address"
-                      outlined
-                    />
                   </div>
 
                   <div class="field-control field-input">
-                    <q-input
+                    <q-input placeholder="Código postal*" name="postalCode" type="text" mask="#####"
-                      placeholder="Código postal*"
+                      v-model="postalCode" v-bind:="postalCodeAttrs" :error="!!errors.postalCode"
-                      name="postalCode"
+                      :error-message="errors.postalCode" ref="postalCodeRef" readonly outlined @mouseenter="showTooltip"
-                      type="text"
+                      @mouseleave="hideTooltip">
-                      mask="#####"
-                      v-model="postalCode"
-                      v-bind:="postalCodeAttrs"
-                      :error="!!errors.postalCode"
-                      :error-message="errors.postalCode"
-                      ref="postalCodeRef"
-                      readonly
-                      outlined
-                      @mouseenter="showTooltip"
-                      @mouseleave="hideTooltip"
-                    >
                       <template #after>
-                        <q-btn
+                        <q-btn to="/" :style="'--clr: #ffffff'" class="btn custom-btn-input paragraph-sm"
-                          to="/"
+                          label="EDITAR" />
-                          :style="'--clr: #ffffff'"
-                          class="btn custom-btn-input paragraph-sm"
-                          label="EDITAR"
-                        />
                       </template>
                     </q-input>
 
-                    <div
+                    <div ref="postalCodeTooltip" :style="[floatingStyles, '--clr: #117564']"
-                      ref="postalCodeTooltip"
+                      :class="['tooltip ', isHidden && 'hidden']" @mouseenter="showTooltip" @mouseleave="hideTooltip">
-                      :style="[floatingStyles, '--clr: #117564']"
-                      :class="['tooltip ', isHidden && 'hidden']"
-                      @mouseenter="showTooltip"
-                      @mouseleave="hideTooltip"
-                    >
                       <p class="paragraph-sm">
                         No se puede editar este campo
-                        <a
+                        <a href="https://www.google.com/maps" rel="noreferrer noopener" target="_blank"
-                          href="https://www.google.com/maps"
+                          class="paragraph-sm link">
-                          rel="noreferrer noopener"
-                          target="_blank"
-                          class="paragraph-sm link"
-                        >
                           ¿No conoce su código postal?
                         </a>
                       </p>
@@ -285,49 +229,23 @@ export default defineComponent({
                   </div>
 
                   <div class="field-control field-select">
-                    <q-select
+                    <q-select name="province" v-model="province" v-bind:="provinceAttrs" :error="!!errors.province"
-                      name="province"
+                      :error-message="errors.province" :options="provinceOptions" option-value="code"
-                      v-model="province"
+                      option-label="name" label="País*" stack-label map-options emit-value outlined />
-                      v-bind:="provinceAttrs"
-                      :error="!!errors.province"
-                      :error-message="errors.province"
-                      :options="provinceOptions"
-                      option-value="code"
-                      option-label="name"
-                      label="País*"
-                      stack-label
-                      map-options
-                      emit-value
-                      outlined
-                    />
                   </div>
 
                   <div class="field-control field-select">
-                    <q-input
+                    <q-input placeholder="Ciudad*" name="city" type="text" v-model="city" v-bind:="cityAttrs"
-                      placeholder="Ciudad*"
+                      :error="!!errors.city" :error-message="errors.city" outlined />
-                      name="city"
-                      type="text"
-                      v-model="city"
-                      v-bind:="cityAttrs"
-                      :error="!!errors.city"
-                      :error-message="errors.city"
-                      outlined
-                    />
                   </div>
 
                   <div class="field-control field-input telephone">
-                    <vue-tel-input
+                    <vue-tel-input v-model="phone" v-bind="phoneAttrs" :styleClasses="[
-                      v-model="phone"
+            'custom-input',
-                      v-bind="phoneAttrs"
+            !!errors.phone && 'error',
-                      :styleClasses="[
+          ]" ref="phoneInputRef" :inputOptions="{
-                        'custom-input',
+            placeholder: 'Teléfono*',
-                        !!errors.phone && 'error',
+          }" />
-                      ]"
-                      ref="phoneInputRef"
-                      :inputOptions="{
-                        placeholder: 'Teléfono*',
-                      }"
-                    />
                     <p v-if="!!errors.phone" class="error">
                       {{ errors.phone }}
                     </p>
@@ -342,57 +260,30 @@ export default defineComponent({
 
                 <div class="checkout-fields">
                   <div class="field-control field-input">
-                    <q-input
+                    <q-input placeholder="Nombre y apellidos o nombre de empresa" name="senderName" type="text"
-                      placeholder="Nombre y apellidos o nombre de empresa"
+                      v-model="senderName" v-bind:="senderNameAttrs" :error="!!errors.senderName"
-                      name="senderName"
+                      :error-message="errors.senderName" outlined />
-                      type="text"
-                      v-model="senderName"
-                      v-bind:="senderNameAttrs"
-                      :error="!!errors.senderName"
-                      :error-message="errors.senderName"
-                      outlined
-                    />
                   </div>
 
                   <div class="field-control field-input">
-                    <q-input
+                    <q-input placeholder="CIF / NIF" name="senderCifNif" type="text" v-model="senderCifNif"
-                      placeholder="CIF / NIF"
+                      v-bind:="senderCifNifAttrs" :error="!!errors.senderCifNif" :error-message="errors.senderCifNif"
-                      name="senderCifNif"
+                      outlined />
-                      type="text"
-                      v-model="senderCifNif"
-                      v-bind:="senderCifNifAttrs"
-                      :error="!!errors.senderCifNif"
-                      :error-message="errors.senderCifNif"
-                      outlined
-                    />
                   </div>
 
                   <div class="field-control field-input">
-                    <q-input
+                    <q-input placeholder="Email" name="senderEmail" type="email" v-model="senderEmail"
-                      placeholder="Email"
+                      v-bind:="senderEmailAttrs" :error="!!errors.senderEmail" :error-message="errors.senderEmail"
-                      name="senderEmail"
+                      outlined />
-                      type="email"
-                      v-model="senderEmail"
-                      v-bind:="senderEmailAttrs"
-                      :error="!!errors.senderEmail"
-                      :error-message="errors.senderEmail"
-                      outlined
-                    />
                   </div>
 
                   <div class="field-control field-input telephone">
-                    <vue-tel-input
+                    <vue-tel-input v-model="senderPhone" v-bind="senderPhoneAttrs" :styleClasses="[
-                      v-model="senderPhone"
+            'custom-input',
-                      v-bind="senderPhoneAttrs"
+            !!errors.senderPhone && 'error',
-                      :styleClasses="[
+          ]" ref="phoneSenderInputRef" :inputOptions="{
-                        'custom-input',
+            placeholder: 'Teléfono*',
-                        !!errors.senderPhone && 'error',
+          }" />
-                      ]"
-                      ref="phoneSenderInputRef"
-                      :inputOptions="{
-                        placeholder: 'Teléfono*',
-                      }"
-                    />
                     <p v-if="!!errors.senderPhone" class="error">
                       {{ errors.senderPhone }}
                     </p>
@@ -401,43 +292,19 @@ export default defineComponent({
                   <div class="field-control field-input">
                     <q-input
                       placeholder="Notas sobre tu pedido (Opcional), por ejemplo, notas especiales para la entrega"
-                      name="senderNotes"
+                      name="senderNotes" type="textarea" v-model="senderNotes" v-bind:="senderNotesAttrs"
-                      type="textarea"
+                      :error="!!errors.senderNotes" :error-message="errors.senderNotes" class="message" autogrow
-                      v-model="senderNotes"
+                      outlined />
-                      v-bind:="senderNotesAttrs"
-                      :error="!!errors.senderNotes"
-                      :error-message="errors.senderNotes"
-                      class="message"
-                      autogrow
-                      outlined
-                    />
                   </div>
                 </div>
               </div>
             </q-form>
 
-            <form
+            <form v-if="paymentMethod === 'redsys' && meta.valid" name="from"
-              v-if="paymentMethod === 'redsys' && meta.valid"
+              action="https://sis-t.redsys.es:25443/sis/realizarPago" method="POST" class="hide">
-              name="from"
+              <input type="text" name="Ds_SignatureVersion" :value="redsysData.Ds_SignatureVersion" />
-              action="https://sis-t.redsys.es:25443/sis/realizarPago"
+              <input type="text" name="Ds_MerchantParameters" :value="redsysData.Ds_MerchantParameters" />
-              method="POST"
+              <input type="text" name="Ds_Signature" :value="redsysData.Ds_Signature" />
-              class="hide"
-            >
-              <input
-                type="hidden"
-                name="Ds_SignatureVersion"
-                :value="redsysData.Ds_SignatureVersion"
-              />
-              <input
-                type="hidden"
-                name="Ds_MerchantParameters"
-                :value="redsysData.Ds_MerchantParameters"
-              />
-              <input
-                type="hidden"
-                name="Ds_Signature"
-                :value="redsysData.Ds_Signature"
-              />
               <input ref="redsysFormRef" type="submit" value="Go to pay" />
             </form>
           </div>
@@ -449,7 +316,7 @@ export default defineComponent({
               </header>
 
               <div class="checkout-delivery-body">
-                <p class="green-text">13 de julio - De 11h - 12 h</p>
+                <p class="green-text">{{ getFormatedDate((cart.length > 0)?cart[0].dated:'') }}</p>
               </div>
             </div>
 
@@ -462,11 +329,7 @@ export default defineComponent({
 
               <div class="checkout-summary-body gray-bg">
                 <ul class="checkout-summary-list">
-                  <li
+                  <li class="checkout-summary-item" v-for="({ name, price }, index) in cart" :key="index">
-                    class="checkout-summary-item"
-                    v-for="({ name, price }, index) in cart"
-                    :key="index"
-                  >
                     <p>
                       {{ name }}
                       <span>{{ price }}€</span>
@@ -487,32 +350,19 @@ export default defineComponent({
 
             <div class="checkout-payment-methods gray-bg">
               <header class="checkout-aside-header">
-                <strong
+                <strong class="checkout-aside-title" :style="!!errors.paymentMethod && 'color: red'">
-                  class="checkout-aside-title"
-                  :style="!!errors.paymentMethod && 'color: red'"
-                >
                   Método de pago
                 </strong>
                 <p v-if="!!errors.paymentMethod"></p>
               </header>
 
               <div class="checkout-payment-body">
-                <q-radio
+                <q-radio v-model="paymentMethod" v-bind="paymentMethodAttrs" val="paypal" color="primary">
-                  v-model="paymentMethod"
-                  v-bind="paymentMethodAttrs"
-                  val="paypal"
-                  color="primary"
-                >
                   <p>Paypal</p>
                 </q-radio>
 
-                <q-radio
+                <q-radio v-model="paymentMethod" v-bind="paymentMethodAttrs" val="redsys" color="primary">
-                  v-model="paymentMethod"
+                  <p>Tarjeta de crédito</p>
-                  v-bind="paymentMethodAttrs"
-                  val="redsys"
-                  color="primary"
-                >
-                  <p>Redsys</p>
                 </q-radio>
               </div>
             </div>
@@ -525,13 +375,7 @@ export default defineComponent({
                 </p>
               </q-checkbox>
 
-              <q-btn
+              <q-btn flat class="btn" type="submit" form="checkout-form" :loading="isLoadingSubmit">
-                flat
-                class="btn"
-                type="submit"
-                form="checkout-form"
-                :loading="isLoadingSubmit"
-              >
                 PROCEDER AL PAGO
               </q-btn>
             </div>
@@ -585,13 +429,16 @@ export default defineComponent({
     align-items: center;
     border-radius: 50%;
     user-select: none;
+
     .step-value {
       font-family: $font-questrial;
       color: $primary-dark;
       font-size: 1.25rem;
     }
+
     &.active {
       background-color: $primary-dark;
+
       .step-value {
         color: $white;
       }
@@ -603,6 +450,7 @@ export default defineComponent({
     flex-direction: column;
     align-items: center;
     font-family: $font-questrial;
+
     h4 {
       font-size: 1rem;
       font-weight: 700;
@@ -611,6 +459,7 @@ export default defineComponent({
       margin-bottom: 4px;
       line-height: 1.3;
     }
+
     p {
       font-size: 0.875rem;
       color: $text-default;
@@ -631,6 +480,7 @@ export default defineComponent({
       width: 100%;
       margin-bottom: 21px;
       border-radius: 5px;
+
       & h3 {
         color: $text-default;
         font-weight: 600;
@@ -647,8 +497,10 @@ export default defineComponent({
     & .checkout-form {
       flex: 1 0 min(100%, 795px);
     }
+
     & .checkout-aside {
       flex: 1 0 min(100%, 329px);
+
       & .checkout-delivery-date,
       & .checkout-summary,
       & .checkout-payment-methods {
@@ -672,6 +524,7 @@ export default defineComponent({
         visibility: hidden;
         height: 0;
         overflow: hidden;
+
         &.active {
           height: min-content;
           padding-block: 16px 18px;
@@ -683,6 +536,7 @@ export default defineComponent({
 
       & .checkout-summary {
         margin-bottom: 33px;
+
         & .checkout-aside-header,
         & .checkout-summary-body,
         & .checkout-summary-footer {
@@ -691,6 +545,7 @@ export default defineComponent({
 
         & .checkout-aside-header {
           padding-block: 16px 17px;
+
           & .checkout-aside-title {
             font-family: $font-lora;
             font-weight: 600;
@@ -701,6 +556,7 @@ export default defineComponent({
 
         & .checkout-summary-body {
           padding-bottom: 23px;
+
           & p {
             font-size: $font-12;
             line-height: 21px;
@@ -713,12 +569,14 @@ export default defineComponent({
             flex-direction: column;
             gap: 4px;
             margin-bottom: 4px;
+
             & .checkout-summary-item p {
               display: flex;
               justify-content: space-between;
             }
           }
         }
+
         & .checkout-summary-footer {
           display: flex;
           justify-content: space-between;
@@ -737,19 +595,23 @@ export default defineComponent({
       & .checkout-payment-methods {
         padding: 9px 16px 20px 21px;
         margin-bottom: 21px;
+
         & .checkout-aside-header {
           margin-bottom: 14px;
         }
+
         & .checkout-payment-body {
           display: flex;
           flex-direction: column;
           gap: 12px;
+
           & p {
             width: min(100%, 200px);
             display: inline-flex;
             justify-content: space-between;
             gap: 31px;
             font-size: $font-12;
+
             & .card-flags {
               display: inline-flex;
               align-items: center;
@@ -773,6 +635,7 @@ export default defineComponent({
         display: flex;
         flex-direction: column;
         gap: 23px;
+
         & .terms p {
           margin-left: 10px;
           font-size: $font-12;
@@ -799,29 +662,36 @@ export default defineComponent({
     width: min(100%, 499px);
     margin: 122px auto 0;
     text-align: center;
+
     & .checkout-success-title {
       margin-bottom: 26px;
     }
+
     & .checkout-success-body {
       & .checkout-success-content {
         background-color: $secondary-5;
         padding: 30px 46px 42px 38px;
         border-radius: 5px 5px 0px 0px;
+
         & .checkout-success-list {
           display: flex;
           flex-direction: column;
           gap: 28px;
+
           & .checkout-success-item {
             display: flex;
             flex: 1;
+
             & .checkout-item-content {
               display: flex;
               justify-content: space-between;
               flex: 1;
               min-height: 61px;
+
               & .checkout-product-details {
                 display: flex;
                 gap: 14px;
+
                 & .checkout-product-img {
                   object-fit: cover;
                   width: 54px;
@@ -875,8 +745,9 @@ export default defineComponent({
   & .form-fields-container {
     display: flex;
     flex-wrap: wrap;
-    &.delivery {
+
-    }
+    &.delivery {}
+
     &.sender {
       margin-top: 12px;
     }
@@ -886,6 +757,7 @@ export default defineComponent({
       display: flex;
       flex-wrap: wrap;
       gap: 12px 9px;
+
       @media only screen and (max-width: $med-lg) {
         gap: 15px;
       }
@@ -896,6 +768,7 @@ export default defineComponent({
 
       &.telephone {
         flex: 0 0 calc(50% - 5px);
+
         @media only screen and (max-width: $med-lg) {
           flex: 1 0 min(100%, 390px);
         }
@@ -905,10 +778,12 @@ export default defineComponent({
         label {
           padding-bottom: 10px;
         }
+
         & .q-field__control {
           background-color: #fff;
           height: 40px;
           border: 1px solid $primary-light;
+
           & input {
             padding: 0px 0px 0px 20px;
             font-family: $font-questrial;
@@ -923,20 +798,24 @@ export default defineComponent({
           &.text-negative {
             border-color: $negative;
           }
+
           &::after,
           &::before {
             display: none;
           }
         }
+
         .q-field__marginal {
           height: 40px;
           padding-right: 30px;
         }
       }
+
       .q-field--error .q-field__bottom {
         padding-top: 4px;
         font-size: 0.675rem;
       }
+
       &.field-select {
         .q-field__control {
           min-height: initial;
@@ -944,23 +823,28 @@ export default defineComponent({
           height: 40px;
           padding: 0px 30px;
           border: 1px solid $primary-light;
+
           .q-field__native span {
             display: none;
           }
         }
+
         .q-field__append {
           height: 40px;
         }
+
         .q-field__label {
           font-family: $font-questrial;
           color: $text-default !important;
         }
+
         .q-field__control-container {
           padding-top: 0;
           height: 36px;
         }
       }
     }
+
     @media only screen and (max-width: $med-lg) {
       &.sender {
         margin-top: 45px;
@@ -972,6 +856,7 @@ export default defineComponent({
     padding: 10.5px 1px;
     border-radius: 4px;
     transition: 200ms ease-in-out;
+
     &:hover {
       border-color: $black;
     }
@@ -1007,4 +892,4 @@ export default defineComponent({
     font-family: "Roboto" !important;
   }
 }
-</style>
+</style>

src/pages/CheckoutSuccessPage.vue

@@ -55,7 +55,7 @@ export default defineComponent({
         if (!value) return push("/");
       } */
 
-      if (cart.length === 0) return push("/");
+      //if (cart.length === 0) return push("/");
 
       await getSuccessData();
     });
@@ -130,12 +130,12 @@ export default defineComponent({
 
     <div class="checkout-success" id="success-block">
       <h6 class="checkout-success-title green-text">
-        Has efectuado la siguiente compra
+        Gracias por realizar tu compra
       </h6>
 
       <div class="checkout-success-body">
         <div class="checkout-success-content">
-          <ul class="checkout-success-list">
+          <!--<ul class="checkout-success-list">
             <li
               v-for="({ name, price, image }, index) in cart"
               :key="index"
@@ -158,13 +158,13 @@ export default defineComponent({
                 <p class="checkout-product-price">{{ price }}€</p>
               </div>
             </li>
-          </ul>
+          </ul>-->
         </div>
 
-        <footer class="checkout-success-footer">
+        <!--<footer class="checkout-success-footer">
           <p class="checkout-success-paragraph">Total</p>
           <p class="checkout-success-paragraph">{{ totalPrice.toFixed(2) }}€</p>
-        </footer>
+        </footer>-->
       </div>
     </div>
   </q-page>

src/pages/HomePage.vue

@@ -2,6 +2,7 @@
 import { storeToRefs } from "pinia";
 import { defineComponent, onBeforeMount, ref } from "vue";
 
+import IconArrowCircleFilledRight from "src/components/icons/IconArrowCircleFilledRight.vue";
 import VerticalCarouselImgs from "src/components/quasar-components/carousel/VerticalCarouselImgs.vue";
 import Swiper from "src/components/swiper/Swiper.vue";
 import Card from "src/components/ui/Card.vue";
@@ -18,6 +19,7 @@ export default defineComponent({
     Card,
   },
   setup() {
+    const banners = ref()
     const mobileStore = useMobileStore();
     const { isCarouselVisible, isOpenNav, screenWidth } =
       storeToRefs(mobileStore);
@@ -26,35 +28,37 @@ export default defineComponent({
     const { getProducts } = cartStore;
     const { products, homeSection } = storeToRefs(cartStore);
 
+    async function getBanners() {
+      //const { data: { data } } = await apiBack("/banners/")
+      return [
+      {
+          "url": "/assets/Cabecera-flornatura-1.jpg",
+          "longName": "Regala un verano lleno de flores y plantas"
+      },
+      {
+          "url": "/assets/Cabecera-flornatura-2.jpg",
+          "longName": "Regala un verano lleno de flores y plantas"
+      },
+      {
+          "url": "/assets/Cabecera-flornatura-3.jpg",
+          "longName": "Regala un verano lleno de flores y plantas"
+      }
+    ]
+    }
+
+
     onBeforeMount(async () => {
+      //banners.value = await getBanners();
       await getProducts();
     });
 
-    const slidesContent = ref([]);
-
-    onBeforeMount(async () => {
-      const images = await new Promise((resolve) => {
-        setTimeout(() => {
-          resolve([
-            "assets/1.jpg",
-            "assets/2.jpg",
-            "assets/3.jpg",
-            "assets/4.jpg",
-            "assets/5.jpg",
-          ]);
-        }, 1000);
-      });
-
-      slidesContent.value = images;
-    });
-
     return {
       isCarouselVisible,
-      slidesContent,
       screenWidth,
       homeSection,
       isOpenNav,
       products,
+      banners
     };
   },
 });
@@ -63,7 +67,7 @@ export default defineComponent({
 <template>
   <q-page>
     <q-no-ssr>
-      <VerticalCarouselImgs :imgsArr="slidesContent" class="home-carousel" />
+      <VerticalCarouselImgs class="home-carousel" />
     </q-no-ssr>
 
     <section class="products-section" ref="homeSection">
@@ -77,25 +81,15 @@ export default defineComponent({
 
       <div class="products-body">
         <Container cardContainer>
-          <template
+          <template v-for="({ id, name, price, image, isNew, postalCode }, i) in products?.data" :key="id">
-            v-for="({ id, name, price, image, isNew }, i) in products?.data"
+            <Card v-if="i < 8" :id="id" :price="price" :title="name" :imgSrc="image" :isNew="isNew" :hasPostalCode="(postalCode !== 'undefined')?true:false"
-            :key="id"
+              imgClass="list-products" size="md-card" />
-          >
-            <Card
-              v-if="i < 8"
-              :id="id"
-              :price="price"
-              :title="name"
-              :imgSrc="image"
-              :isNew="isNew"
-              imgClass="list-products"
-              size="md-card"
-            />
           </template>
         </Container>
 
         <RouterLink class="btn rounded outlined" to="/categoria/all">
-          Ver todos los diseños <IconArrowCircleFilledRight />
+          Ver todos los diseños
+          <IconArrowCircleFilledRight />
         </RouterLink>
       </div>
     </section>
@@ -112,20 +106,10 @@ export default defineComponent({
       <div class="products-selection-body">
         <q-no-ssr>
           <Swiper>
-            <template
+            <template v-for="({ id, isNew, price, name, image }, i) in products.data" :key="id">
-              v-for="({ id, isNew, price, name, image }, i) in products.data"
-              :key="id"
-            >
               <swiper-slide class="swiper-slide" v-if="i < 10">
-                <Card
+                <Card :id="id" :price="price" :title="name" :imgSrc="image" :isNew="isNew" imgClass="carousel"
-                  :id="id"
+                  size="lg-card" />
-                  :price="price"
-                  :title="name"
-                  :imgSrc="image"
-                  :isNew="isNew"
-                  imgClass="carousel"
-                  size="lg-card"
-                />
               </swiper-slide>
             </template>
           </Swiper>
@@ -134,7 +118,8 @@ export default defineComponent({
 
       <footer class="products-selection-footer">
         <RouterLink class="btn rounded outlined pd-icon" to="/">
-          Ver todas las plantas <IconArrowCircleFilledRight />
+          Ver todas las plantas
+          <IconArrowCircleFilledRight />
         </RouterLink>
       </footer>
     </section>
@@ -177,11 +162,9 @@ export default defineComponent({
   scroll-margin: 30px;
 
   & .products-section-header {
-    & .products-header-title {
+    & .products-header-title {}
-    }
 
-    & .products-header-paragraph {
+    & .products-header-paragraph {}
-    }
   }
 
   & .products-body {
@@ -193,8 +176,7 @@ export default defineComponent({
   }
 
   @media only screen and (max-width: $med-xmd) {
-    & .products-body {
+    & .products-body {}
-    }
   }
 }
 

src/pages/ProductPage.vue

@@ -28,11 +28,11 @@ export default defineComponent({
   name: "ProductPage",
   components: {
     IconPencilGreen,
-    IconWhatsapp,
+   IconWhatsapp,
-    IconLinkedin,
+   IconLinkedin,
-    IconTwitter,
+   IconTwitter,
-    IconShare,
+   IconShare,
-    IconEmail,
+   IconEmail,
     DudasSection,
     Container,
     Card,
@@ -77,7 +77,7 @@ export default defineComponent({
     const { products, addCartLoadingBtn } = storeToRefs(cartStore);
 
     onBeforeMount(async () => {
-      await getProduct(route.params.id);
+      await getProduct(route.params.id, availability.value);
     });
 
     watch(
@@ -128,10 +128,10 @@ export default defineComponent({
     const checkImageValidity = (imageLink) => {
       const validExtensions = [".jpg", ".jpeg", ".png"];
 
-      if (imageLink) {
+      /*if (imageLink) {
         const extension = imageLink.substring(imageLink.lastIndexOf("."));
         return validExtensions.includes(extension.toLowerCase());
-      }
+      }*/
 
       return true;
     };
@@ -268,8 +268,8 @@ export default defineComponent({
           </div>
         </div>
 
-        <footer class="product-content-footer">
+        <!--<footer class="product-content-footer">
-          <p class="product-share-paragraph">Conmparte con tus amigos</p>
+          <p class="product-share-paragraph">Comparte con tus amigos</p>
 
           <div class="product-share-content">
             <a href="#" class="product-share-item"><IconShare /></a>
@@ -278,7 +278,7 @@ export default defineComponent({
             <a href="#" class="product-share-item"><IconEmail /></a>
             <a href="#" class="product-share-item"><IconWhatsapp /></a>
           </div>
-        </footer>
+        </footer>-->
       </div>
 
       <div
@@ -336,7 +336,7 @@ export default defineComponent({
       <Container cardContainer class="no-padding">
         <template
           v-for="(
-            { image, discount, isNew, name, price, id }, i
+            { image, discount, isNew, name, price, id, postalCode }, i
           ) in products.data"
           :key="id"
         >
@@ -348,6 +348,7 @@ export default defineComponent({
             :imgSrc="image"
             :isNew="isNew"
             :id="id"
+            :hasPostalCode="(postalCode !== 'undefined')?true:false"
           />
         </template>
       </Container>

src/stores/cart.js

@@ -147,11 +147,10 @@ export const useCartStore = defineStore("cart", () => {
       routeId.value = id;
       try {
         const params = transformOptionsToParams(options);
-
         const promises = [
-          apiBack.get(`products/${+id - 1}`),
+          apiBack.get(`products/${+id - 1}`, { params }),
-          apiBack.get(`products/${+id}`),
+          apiBack.get(`products/${+id}`, { params }),
-          apiBack.get(`products/${+id + 1}`),
+          apiBack.get(`products/${+id + 1}`, { params }),
         ];
         const results = await Promise.allSettled(promises);
         const [prev, current, next] = results.map((res) => {
@@ -195,13 +194,13 @@ export const useCartStore = defineStore("cart", () => {
     const params = transformOptionsToParams(
       availabilityForm.value || availability.value
     );
-    await getProducts(params);
+    const correctProduct = await apiBack.get(`products/${product.id}`, { params });
 
     const hasCurrentProduct = computed(() => {
       return cart.value.find((p) => p.id === product.id);
     });
 
-    if (isEmpty.value) {
+    if (correctProduct.data.length === 0) {
       push("/");
       return quasarNotify({
         message:
@@ -210,15 +209,6 @@ export const useCartStore = defineStore("cart", () => {
       });
     }
 
-    if (!products.value.data.some((item) => item.id === product.id)) {
-      push("/");
-      return quasarNotify({
-        message:
-          "Este producto no está disponible en su zona, intente añadir un nuevo código postal",
-        type: "erro",
-      });
-    }
-
     if (hasCurrentProduct.value) {
       return quasarNotify({
         message: "Este producto ya está en el carrito",

src/stores/textInput.js

@@ -1,14 +0,0 @@
-import { defineStore } from "pinia";
-
-export const useTextInputStore = defineStore("text-input", () => {
-  const dedication = ref("");
-
-  function handleDedicationSubmit() {
-    console.log(dedication);
-  }
-
-  return {
-    dedication,
-    handleDedicationSubmit,
-  };
-});

src/utils/zod/schemas/questionSchema.js

@@ -15,9 +15,6 @@ const questionObjVal = {
   phone: z
     .string({ required_error: M.requiredMessage })
     .min(1, M.requiredMessage),
-  query: z
-    .string({ required_error: M.requiredMessage })
-    .min(1, M.requiredMessage),
   message: z
     .string({ required_error: M.requiredMessage })
     .min(1, M.requiredMessage),