develop #10
|
@ -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()
|
|
@ -4,7 +4,6 @@ class ContactController {
|
||||||
async Create(req, res) {
|
async Create(req, res) {
|
||||||
try {
|
try {
|
||||||
const { name, phone, email, message } = req.body;
|
const { name, phone, email, message } = req.body;
|
||||||
console.log(name, phone, email, message);
|
|
||||||
const contact = await db.contact_Request(name, phone, email, message);
|
const contact = await db.contact_Request(name, phone, email, message);
|
||||||
|
|
||||||
return res.status(200).send({
|
return res.status(200).send({
|
||||||
|
|
|
@ -1,21 +1,16 @@
|
||||||
const db = require("../../db/db");
|
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 {
|
class PaymentServices {
|
||||||
async Create(req, res) {
|
async Create(req, res) {
|
||||||
try {
|
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, 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({
|
return res.status(422).send({
|
||||||
data: {
|
data: {
|
||||||
message: "Uno de los productos no existe."
|
message: "Uno de los productos no existe."
|
||||||
|
@ -24,7 +19,7 @@ class PaymentServices {
|
||||||
}
|
}
|
||||||
|
|
||||||
let priceIntial = 0
|
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 = ''
|
let productsIds = ''
|
||||||
for (let i = 0; i < products.length; i++) {
|
for (let i = 0; i < products.length; i++) {
|
||||||
|
@ -37,12 +32,13 @@ class PaymentServices {
|
||||||
customerData: {
|
customerData: {
|
||||||
...customer.customerData,
|
...customer.customerData,
|
||||||
type: type,
|
type: type,
|
||||||
products: productsFilter
|
products: productsFilter[0][0]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
const order = await db.orderData_put(jsonOrderData);
|
const order = await db.orderData_put(jsonOrderData);
|
||||||
const orderFk = order[0][0].orderFk
|
const orderFk = productsFilter[0][0][0].id;
|
||||||
|
|
||||||
if (type === "paypal") {
|
if (type === "paypal") {
|
||||||
const data = await payPalProviders.New(orderFk, price)
|
const data = await payPalProviders.New(orderFk, price)
|
||||||
|
@ -56,16 +52,12 @@ class PaymentServices {
|
||||||
data: { ...data, orderId: orderFk }
|
data: { ...data, orderId: orderFk }
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
/* if (newOrder) {
|
|
||||||
return res.status(200).send({
|
|
||||||
data: { link: newOrder.links, orderId: orderFk }
|
|
||||||
})
|
|
||||||
} */
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.log(error);
|
|
||||||
return res.status(422).send({
|
return res.status(422).send({
|
||||||
data: {
|
data: {
|
||||||
message: "Error al iniciar el pago"
|
message: "Error al iniciar el pago",
|
||||||
|
error: error.message
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
@ -74,38 +66,33 @@ class PaymentServices {
|
||||||
async Success(req, res) {
|
async Success(req, res) {
|
||||||
try {
|
try {
|
||||||
//Parameters payment
|
//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) {
|
|
||||||
if (error) {
|
|
||||||
return res.status(422).send({
|
|
||||||
data: {
|
|
||||||
message: "payment not successful"
|
|
||||||
}
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
if (payment.state == 'approved') {
|
|
||||||
await db.order_confirm(orderId)
|
|
||||||
return res.status(200).send({
|
return res.status(200).send({
|
||||||
data: {
|
data: {
|
||||||
id: payment.id,
|
...data,
|
||||||
message: "payment completed successfully",
|
message: "Payment success"
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
} else {
|
}
|
||||||
return res.status(422).send({
|
if (type === "redsys") {
|
||||||
|
await redsysProviders.success(orderId)
|
||||||
|
return res.status(200).send({
|
||||||
data: {
|
data: {
|
||||||
message: "payment not successful"
|
message: "Payment success"
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
throw error;
|
return res.status(422).send({
|
||||||
|
data: {
|
||||||
|
message: "Payment Error"
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
const paypal = require('paypal-rest-sdk');
|
const paypal = require('paypal-rest-sdk');
|
||||||
|
const db = require("../../../db/db");
|
||||||
|
|
||||||
class PayPalProviders {
|
class PayPalProviders {
|
||||||
async New(orderFk, price) {
|
async New(orderFk, price) {
|
||||||
|
@ -6,7 +7,7 @@ class PayPalProviders {
|
||||||
const payReq = JSON.stringify({
|
const payReq = JSON.stringify({
|
||||||
'intent': 'sale',
|
'intent': 'sale',
|
||||||
'redirect_urls': {
|
'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`
|
'cancel_url': `${process.env.BASE_URL}/checkout/error`
|
||||||
},
|
},
|
||||||
'payer': {
|
'payer': {
|
||||||
|
@ -14,14 +15,13 @@ class PayPalProviders {
|
||||||
},
|
},
|
||||||
'transactions': [{
|
'transactions': [{
|
||||||
'amount': {
|
'amount': {
|
||||||
'total': 0.0000000001,
|
'total': price,
|
||||||
'currency': 'EUR'
|
'currency': 'EUR'
|
||||||
},
|
},
|
||||||
'description': 'This is the payment transaction description.'
|
'description': 'This is the payment transaction description.'
|
||||||
}]
|
}]
|
||||||
});
|
});
|
||||||
|
|
||||||
//Starting checkout process and returning sandbox url
|
|
||||||
const newOrder = await new Promise(async (resolve, reject) => {
|
const newOrder = await new Promise(async (resolve, reject) => {
|
||||||
paypal.payment.create(payReq, function (error, payment) {
|
paypal.payment.create(payReq, function (error, payment) {
|
||||||
if (error) {
|
if (error) {
|
||||||
|
@ -54,6 +54,28 @@ class PayPalProviders {
|
||||||
throw error;
|
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();
|
module.exports = new PayPalProviders();
|
|
@ -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();
|
|
|
@ -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();
|
|
|
@ -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();
|
|
|
@ -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();
|
|
@ -95,9 +95,10 @@ class ProductController {
|
||||||
}
|
}
|
||||||
|
|
||||||
async findById(req, res) {
|
async findById(req, res) {
|
||||||
|
const { dateExpired, postalCode } = req.query
|
||||||
const id = Number(req.params.id)
|
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({
|
return res.status(200).send({
|
||||||
data: filterProduct
|
data: filterProduct
|
||||||
|
|
|
@ -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();
|
|
32
api/db/db.js
32
api/db/db.js
|
@ -11,7 +11,7 @@ async function connect() {
|
||||||
|
|
||||||
|
|
||||||
const mysql = require("mysql2/promise");
|
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;
|
global.connection = connection;
|
||||||
return connection;
|
return connection;
|
||||||
}
|
}
|
||||||
|
@ -23,14 +23,20 @@ async function getProducts(dateExpired, postalCode) {
|
||||||
return rows;
|
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
|
//Procedure for create transactions, do not carry out any manipulation at the bank
|
||||||
async function orderData_put(jsonOrderData) {
|
async function orderData_put(jsonOrderData) {
|
||||||
const conn = await connect();
|
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) {
|
if (err) {
|
||||||
console.error(err);
|
console.error(err);
|
||||||
} else {
|
} else {
|
||||||
console.log('Result:', results);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
return rows;
|
return rows;
|
||||||
|
@ -68,9 +74,25 @@ async function deliveryDate_get(postalCode) {
|
||||||
|
|
||||||
async function contact_Request(name, phone, email, message) {
|
async function contact_Request(name, phone, email, message) {
|
||||||
const conn = await connect();
|
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;
|
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
|
||||||
|
}
|
|
@ -7,6 +7,7 @@ const paymengtController = require('./controller/Payment/payment.controller');
|
||||||
const provincesController = require('./controller/Provinces/provinces.controller');
|
const provincesController = require('./controller/Provinces/provinces.controller');
|
||||||
const deliveryController = require('./controller/Delivery/delivery.controller');
|
const deliveryController = require('./controller/Delivery/delivery.controller');
|
||||||
const contactController = require('./controller/Contact/contact.controller');
|
const contactController = require('./controller/Contact/contact.controller');
|
||||||
|
const bannersController = require('./controller/Banners/banners.controller');
|
||||||
|
|
||||||
paypal.configure({
|
paypal.configure({
|
||||||
'mode': 'sandbox',
|
'mode': 'sandbox',
|
||||||
|
@ -17,7 +18,7 @@ paypal.configure({
|
||||||
const app = express();
|
const app = express();
|
||||||
const port = 9999;
|
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 = {
|
const corsOptions = {
|
||||||
origin: allowedOrigins,
|
origin: allowedOrigins,
|
||||||
optionsSuccessStatus: 200,
|
optionsSuccessStatus: 200,
|
||||||
|
@ -46,7 +47,7 @@ app.get('/api/payment/cancel', paymengtController.Cancel)
|
||||||
app.get('/api/provinces', provincesController.findAll)
|
app.get('/api/provinces', provincesController.findAll)
|
||||||
app.get('/api/delivery/dates', deliveryController.findByPostalCode)
|
app.get('/api/delivery/dates', deliveryController.findByPostalCode)
|
||||||
app.post('/api/contact/save', contactController.Create)
|
app.post('/api/contact/save', contactController.Create)
|
||||||
|
app.get('/api/banners/', bannersController.findAll)
|
||||||
|
|
||||||
|
|
||||||
app.listen(port, () => {
|
app.listen(port, () => {
|
||||||
|
|
|
@ -157,14 +157,6 @@
|
||||||
"npm": ">=6.14.13"
|
"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": {
|
"node_modules/@floating-ui/core": {
|
||||||
"version": "1.6.0",
|
"version": "1.6.0",
|
||||||
"resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.0.tgz",
|
"resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.0.tgz",
|
||||||
|
@ -2162,6 +2154,118 @@
|
||||||
"esbuild-windows-arm64": "0.14.51"
|
"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": {
|
"node_modules/esbuild-linux-64": {
|
||||||
"version": "0.14.51",
|
"version": "0.14.51",
|
||||||
"resolved": "https://registry.npmjs.org/esbuild-linux-64/-/esbuild-linux-64-0.14.51.tgz",
|
"resolved": "https://registry.npmjs.org/esbuild-linux-64/-/esbuild-linux-64-0.14.51.tgz",
|
||||||
|
@ -2178,6 +2282,198 @@
|
||||||
"node": ">=12"
|
"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": {
|
"node_modules/escalade": {
|
||||||
"version": "3.1.2",
|
"version": "3.1.2",
|
||||||
"resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
|
"resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
|
||||||
|
@ -2819,6 +3115,20 @@
|
||||||
"integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==",
|
"integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==",
|
||||||
"dev": true
|
"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": {
|
"node_modules/function-bind": {
|
||||||
"version": "1.1.2",
|
"version": "1.1.2",
|
||||||
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
|
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
|
||||||
|
@ -5425,12 +5735,9 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/undici": {
|
"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": {
|
"engines": {
|
||||||
"node": ">=18.0"
|
"node": ">=18.0"
|
||||||
}
|
}
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 91 KiB |
Binary file not shown.
After Width: | Height: | Size: 127 KiB |
Binary file not shown.
After Width: | Height: | Size: 120 KiB |
|
@ -60,7 +60,7 @@ module.exports = configure(function (ctx) {
|
||||||
env: {
|
env: {
|
||||||
API: ctx.dev
|
API: ctx.dev
|
||||||
? "http://localhost:9999/api/"
|
? "http://localhost:9999/api/"
|
||||||
: "https://floranet-back.onecommerce.dev/api/",
|
: "https://api-staging.floranet.es/api/",
|
||||||
},
|
},
|
||||||
|
|
||||||
target: {
|
target: {
|
||||||
|
|
|
@ -10,17 +10,16 @@ import IconCalendar from "../icons/IconCalendar.vue";
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: "calendar-input",
|
name: "calendar-input",
|
||||||
components: { IconCalendar },
|
components: { IconCalendar },
|
||||||
props: ["modelValue", "bindValue", "setValues"],
|
props: ["modelValue", "bindValue", "setValues", "dateCookies"],
|
||||||
setup({ setValues }, { emit }) {
|
setup({ setValues, dateCookies, modelValue }, { emit }) {
|
||||||
const formStore = useFormStore();
|
const formStore = useFormStore();
|
||||||
const { availability, postalCodeValid } = storeToRefs(formStore);
|
const { availability, postalCodeValid } = storeToRefs(formStore);
|
||||||
|
|
||||||
const [year, month, day] = fullCurrentDate.replaceAll("/", "-").split("-");
|
const [year, month, day] = fullCurrentDate.replaceAll("/", "-").split("-");
|
||||||
const currentDate = `${day}-${month}-${year}`;
|
const currentDate = `${day}-${month}-${year}`;
|
||||||
const proxyDate = ref(invertDate(currentDate));
|
const proxyDate = ref(invertDate(modelValue));
|
||||||
|
|
||||||
function updateProxy() {
|
function updateProxy() {
|
||||||
proxyDate.value = invertDate(currentDate);
|
proxyDate.value = invertDate(proxyDate.value);
|
||||||
}
|
}
|
||||||
|
|
||||||
function optionsValidDates(date) {
|
function optionsValidDates(date) {
|
||||||
|
@ -37,6 +36,8 @@ export default defineComponent({
|
||||||
|
|
||||||
watch(proxyDate, (newProxy) => {
|
watch(proxyDate, (newProxy) => {
|
||||||
setValues({ date: invertDate(newProxy) });
|
setValues({ date: invertDate(newProxy) });
|
||||||
|
const btn = document.querySelector(".buttons-close-modal button")
|
||||||
|
if(btn) btn.click()
|
||||||
});
|
});
|
||||||
|
|
||||||
const LOCALE = {
|
const LOCALE = {
|
||||||
|
@ -71,7 +72,6 @@ export default defineComponent({
|
||||||
<IconCalendar />
|
<IconCalendar />
|
||||||
|
|
||||||
<q-popup-proxy
|
<q-popup-proxy
|
||||||
@before-show="updateProxy"
|
|
||||||
cover
|
cover
|
||||||
transition-show="scale"
|
transition-show="scale"
|
||||||
transition-hide="scale"
|
transition-hide="scale"
|
||||||
|
@ -83,9 +83,9 @@ export default defineComponent({
|
||||||
:readonly="!postalCodeValid.isValid"
|
:readonly="!postalCodeValid.isValid"
|
||||||
mask="YYYY-MM-DD"
|
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="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>
|
</div>
|
||||||
</q-date>
|
</q-date>
|
||||||
</q-popup-proxy>
|
</q-popup-proxy>
|
||||||
|
|
|
@ -43,8 +43,8 @@ export default defineComponent({
|
||||||
} = await apiBack.get(`/delivery/dates`, {
|
} = await apiBack.get(`/delivery/dates`, {
|
||||||
params: { postalCode: postalCodeInput.value },
|
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 day = getDate.getDate().toString().padStart(2, "0");
|
||||||
const month = (getDate.getMonth() + 1).toString().padStart(2, "0");
|
const month = (getDate.getMonth() + 1).toString().padStart(2, "0");
|
||||||
const year = getDate.getFullYear();
|
const year = getDate.getFullYear();
|
||||||
|
@ -53,6 +53,14 @@ export default defineComponent({
|
||||||
return formattedDate;
|
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.dataOptions = dates;
|
||||||
postalCodeValid.value.isValid = true;
|
postalCodeValid.value.isValid = true;
|
||||||
isPostalCodeLoading.value = false;
|
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",
|
"Se ha producido un error en el proceso de identificación del código postal",
|
||||||
});
|
});
|
||||||
isPostalCodeLoading.value = false;
|
isPostalCodeLoading.value = false;
|
||||||
console.error(`FATAL ERROR ::: ${error}`);
|
|
||||||
} finally {
|
} finally {
|
||||||
jsolis marked this conversation as resolved
|
|||||||
// console.log("click");
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -88,7 +95,7 @@ export default defineComponent({
|
||||||
:model-value="modelValue"
|
:model-value="modelValue"
|
||||||
@update:model-value="updateModel"
|
@update:model-value="updateModel"
|
||||||
v-bind="bindValue"
|
v-bind="bindValue"
|
||||||
class="custom-main-paragraph"
|
class="custom-main-paragraph field-postal-code"
|
||||||
:error="false"
|
:error="false"
|
||||||
placeholder="código postal"
|
placeholder="código postal"
|
||||||
mask="#####"
|
mask="#####"
|
||||||
|
|
|
@ -66,6 +66,8 @@ export default defineComponent({
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 34px;
|
gap: 34px;
|
||||||
|
min-width: 190px;
|
||||||
|
justify-content: flex-end;
|
||||||
|
|
||||||
& .user-area-link {
|
& .user-area-link {
|
||||||
color: $white;
|
color: $white;
|
||||||
|
@ -108,6 +110,8 @@ export default defineComponent({
|
||||||
|
|
||||||
@media only screen and (max-width: $med-md) {
|
@media only screen and (max-width: $med-md) {
|
||||||
gap: 27px;
|
gap: 27px;
|
||||||
|
min-width: auto;
|
||||||
|
|
||||||
& .user-area-link {
|
& .user-area-link {
|
||||||
&.help {
|
&.help {
|
||||||
display: none;
|
display: none;
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
<script>
|
<script>
|
||||||
|
import { storeToRefs } from "pinia";
|
||||||
import { defineComponent } from "vue";
|
import { defineComponent } from "vue";
|
||||||
|
|
||||||
import Calendar from "src/components/@inputs/Calendar.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 IconSearch from "src/components/icons/IconSearch.vue";
|
||||||
import { usePostalCalendar } from "src/hooks/usePostalCalendar";
|
import { usePostalCalendar } from "src/hooks/usePostalCalendar";
|
||||||
import { useVerticalCarouselImgs } from "src/hooks/useVerticalCarouselImgs";
|
import { useVerticalCarouselImgs } from "src/hooks/useVerticalCarouselImgs";
|
||||||
|
import { useFormStore } from "src/stores/forms";
|
||||||
|
import { onMounted } from "vue";
|
||||||
|
import { useLocalStorage } from "../../../hooks/useLocalStorage";
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: "vertical-carousel-imgs",
|
name: "vertical-carousel-imgs",
|
||||||
props: {
|
props: {
|
||||||
imgsArr: {
|
banners: {
|
||||||
type: Array,
|
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 },
|
components: { IconSearch, Calendar, PostalCode },
|
||||||
setup() {
|
setup() {
|
||||||
|
@ -26,6 +43,36 @@ export default defineComponent({
|
||||||
} = usePostalCalendar({ type: "home" });
|
} = usePostalCalendar({ type: "home" });
|
||||||
const { navPos, screenWidth, slide, target } = useVerticalCarouselImgs();
|
const { navPos, screenWidth, slide, target } = useVerticalCarouselImgs();
|
||||||
|
|
||||||
|
const formStore = useFormStore();
|
||||||
|
const { getItem } = useLocalStorage();
|
||||||
|
const localValues = getItem("availability");
|
||||||
|
const lengthCp = 5;
|
||||||
|
|
||||||
|
const { postalCodeValid } = storeToRefs(formStore);
|
||||||
jsolis marked this conversation as resolved
pablone
commented
falta ; falta ;
|
|||||||
|
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 => {
|
||||||
jsolis marked this conversation as resolved
pablone
commented
unificar el 5 en una constante unificar el 5 en una constante
|
|||||||
|
if (e.target.value.length === lengthCp && isEventKeyActive) {
|
||||||
|
if (e.key === 'Enter') {
|
||||||
|
e.preventDefault();
|
||||||
|
modalDate.click();
|
||||||
|
isEventKeyActive = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
onMounted(() => {
|
||||||
|
handleFormKeyPress();
|
||||||
|
})
|
||||||
|
|
||||||
return {
|
return {
|
||||||
slide,
|
slide,
|
||||||
navPos,
|
navPos,
|
||||||
|
@ -39,58 +86,35 @@ export default defineComponent({
|
||||||
postalCodeAttrs,
|
postalCodeAttrs,
|
||||||
calendar,
|
calendar,
|
||||||
calendarAttrs,
|
calendarAttrs,
|
||||||
|
localValues
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<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">
|
||||||
>
|
|
||||||
<q-carousel
|
|
||||||
navigation-position="right"
|
|
||||||
style="min-height: 100dvh"
|
|
||||||
v-model="slide"
|
|
||||||
navigation
|
|
||||||
autoplay
|
|
||||||
infinite
|
|
||||||
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="vertical-carousel-content">
|
||||||
<header class="carousel-content-header">
|
<header class="carousel-content-header">
|
||||||
<h1 class="carousel-header-title">
|
<h1 class="carousel-header-title">
|
||||||
Regala un verano lleno de flores y plantas
|
{{ item.longName }}
|
||||||
</h1>
|
</h1>
|
||||||
</header>
|
</header>
|
||||||
|
</div>
|
||||||
|
</q-carousel-slide>
|
||||||
|
</q-carousel>
|
||||||
|
|
||||||
<form @submit="onSubmit" class="carousel-content-body">
|
<div class="carousel-form">
|
||||||
<div class="carousel-content-item">
|
<form @submit="onSubmit" class="carousel-content-body" id="carousel-form">
|
||||||
<PostalCode
|
<div class="carousel-content-item postal-code-control">
|
||||||
v-model="postalCode"
|
<PostalCode v-model="postalCode" v-bind:bindValue="postalCodeAttrs" :setFieldError="setFieldError" />
|
||||||
v-bind:bindValue="postalCodeAttrs"
|
|
||||||
:setFieldError="setFieldError"
|
|
||||||
/>
|
|
||||||
</div>
|
</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>
|
</div>
|
||||||
|
|
||||||
<q-btn type="submit" class="btn carousel-content-item">
|
<q-btn type="submit" class="btn carousel-content-item">
|
||||||
|
@ -98,46 +122,26 @@ export default defineComponent({
|
||||||
</q-btn>
|
</q-btn>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.vertical-carousel-container {
|
.vertical-carousel-container {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
& .custom-carousel {
|
& .custom-carousel {
|
||||||
user-select: none;
|
user-select: none;
|
||||||
}
|
}
|
||||||
|
.carousel-form{
|
||||||
& .vertical-carousel-content {
|
max-width: 850px;
|
||||||
|
margin: 0 auto;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
min-height: fit-content;
|
bottom: 15vh;
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 110px;
|
|
||||||
width: min(100%, 845px);
|
|
||||||
margin: 0 auto;
|
|
||||||
& .carousel-content-header {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 17px;
|
|
||||||
color: $white;
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 27px;
|
|
||||||
& .carousel-header-title {
|
|
||||||
font-size: $font-35;
|
|
||||||
font-weight: 500;
|
|
||||||
line-height: 30px;
|
|
||||||
color: currentColor;
|
|
||||||
}
|
}
|
||||||
|
.carousel-content-body {
|
||||||
& .carousel-header-paragraph {
|
|
||||||
color: currentColor;
|
|
||||||
font-family: $font-lora;
|
|
||||||
line-height: 22px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
& .carousel-content-body {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
border-radius: 10px 0 0 10px;
|
border-radius: 10px 0 0 10px;
|
||||||
|
@ -161,6 +165,7 @@ export default defineComponent({
|
||||||
padding-inline: 53px 34px;
|
padding-inline: 53px 34px;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
&:first-child::after {
|
&:first-child::after {
|
||||||
content: "";
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -170,11 +175,14 @@ export default defineComponent({
|
||||||
right: 0;
|
right: 0;
|
||||||
top: 27px;
|
top: 27px;
|
||||||
bottom: 29px;
|
bottom: 29px;
|
||||||
|
|
||||||
@media only screen and (max-width: $med-md) {
|
@media only screen and (max-width: $med-md) {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.btn {
|
&.btn {
|
||||||
|
|
||||||
&:focus,
|
&:focus,
|
||||||
&:focus-visible {
|
&:focus-visible {
|
||||||
outline: none;
|
outline: none;
|
||||||
|
@ -191,6 +199,41 @@ export default defineComponent({
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
& .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 {
|
||||||
|
color: currentColor;
|
||||||
|
font-family: $font-lora;
|
||||||
|
line-height: 22px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
& .carousel-content-footer {
|
& .carousel-content-footer {
|
||||||
display: grid;
|
display: grid;
|
||||||
|
@ -199,12 +242,13 @@ export default defineComponent({
|
||||||
|
|
||||||
@media only screen and (max-width: $med-xmd) {
|
@media only screen and (max-width: $med-xmd) {
|
||||||
padding-inline: 20px;
|
padding-inline: 20px;
|
||||||
top: 50%;
|
|
||||||
transform: translateY(-50%);
|
|
||||||
|
|
||||||
& .carousel-content-header {
|
& .carousel-content-header {
|
||||||
gap: 15px;
|
gap: 15px;
|
||||||
margin-bottom: 49px;
|
margin-bottom: 20px;
|
||||||
|
bottom: initial;
|
||||||
|
top: calc(10dvh + 120px);
|
||||||
|
|
||||||
& .carousel-header-title {
|
& .carousel-header-title {
|
||||||
font-size: $font-28;
|
font-size: $font-28;
|
||||||
line-height: 34px;
|
line-height: 34px;
|
||||||
|
@ -215,33 +259,43 @@ export default defineComponent({
|
||||||
font-weight: 500;
|
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 {
|
& .carousel-content-footer {
|
||||||
display: none;
|
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) {
|
@media only screen and (max-height: 360px) {
|
||||||
/* background-color: tomato; */
|
/* 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>
|
</style>
|
||||||
|
|
|
@ -25,10 +25,10 @@ export default defineComponent({
|
||||||
<header class="question-content">
|
<header class="question-content">
|
||||||
<LogoWhite class="white-logo" />
|
<LogoWhite class="white-logo" />
|
||||||
|
|
||||||
<p class="question-paragraph">
|
<!--<p class="question-paragraph">
|
||||||
pablone
commented
código comentado código comentado
|
|||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||||
eiusmod tempor incididunt ut labore et dolore...
|
eiusmod tempor incididunt ut labore et dolore...
|
||||||
</p>
|
</p>-->
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div class="question-form">
|
<div class="question-form">
|
||||||
|
|
|
@ -34,6 +34,7 @@ export default defineComponent({
|
||||||
default: "",
|
default: "",
|
||||||
},
|
},
|
||||||
isNew: String,
|
isNew: String,
|
||||||
|
hasPostalCode: Boolean,
|
||||||
size: {
|
size: {
|
||||||
type: String,
|
type: String,
|
||||||
default: "md-card",
|
default: "md-card",
|
||||||
|
@ -77,7 +78,7 @@ export default defineComponent({
|
||||||
<template>
|
<template>
|
||||||
<div class="card-container" :class="size">
|
<div class="card-container" :class="size">
|
||||||
<RouterLink
|
<RouterLink
|
||||||
:to="`/product/${id}`"
|
:to="(hasPostalCode)?`/product/${id}`:''"
|
||||||
class="card-container-head"
|
class="card-container-head"
|
||||||
:class="[headClass]"
|
:class="[headClass]"
|
||||||
role="heading"
|
role="heading"
|
||||||
|
@ -112,7 +113,7 @@ export default defineComponent({
|
||||||
<div class="card-container-body">
|
<div class="card-container-body">
|
||||||
<p class="card-name" v-if="title">{{ title }}</p>
|
<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" v-if="finalValue">{{ finalValue }}€</p>
|
||||||
<p class="price offer tachado" v-if="+price !== finalValue">
|
<p class="price offer tachado" v-if="+price !== finalValue">
|
||||||
{{ price }}€
|
{{ price }}€
|
||||||
|
|
|
@ -20,8 +20,6 @@ export default defineComponent({
|
||||||
messageAttrs,
|
messageAttrs,
|
||||||
phone,
|
phone,
|
||||||
phoneAttrs,
|
phoneAttrs,
|
||||||
query,
|
|
||||||
queryAttrs,
|
|
||||||
secondName,
|
secondName,
|
||||||
secondNameAttrs,
|
secondNameAttrs,
|
||||||
terms,
|
terms,
|
||||||
|
@ -40,8 +38,6 @@ export default defineComponent({
|
||||||
emailAttrs,
|
emailAttrs,
|
||||||
phone,
|
phone,
|
||||||
phoneAttrs,
|
phoneAttrs,
|
||||||
query,
|
|
||||||
queryAttrs,
|
|
||||||
message,
|
message,
|
||||||
messageAttrs,
|
messageAttrs,
|
||||||
terms,
|
terms,
|
||||||
|
@ -107,16 +103,6 @@ export default defineComponent({
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</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
|
<q-input
|
||||||
v-model="message"
|
v-model="message"
|
||||||
v-bind="messageAttrs"
|
v-bind="messageAttrs"
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { Notify } from "quasar";
|
import { Notify } from "quasar";
|
||||||
|
|
||||||
export function quasarNotify({ message = "", type, timeout = 1000 }) {
|
export function quasarNotify({ message = "", type, timeout = 3000 }) {
|
||||||
const obj = {
|
const obj = {
|
||||||
success: () =>
|
success: () =>
|
||||||
Notify.create({
|
Notify.create({
|
||||||
|
|
|
@ -109,6 +109,14 @@ export function useCheckoutForm() {
|
||||||
isHidden.value = false;
|
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
|
// TODO hacer el await de las provincias
|
||||||
/**
|
/**
|
||||||
* const provinceOptions = getProvinces();
|
* const provinceOptions = getProvinces();
|
||||||
|
@ -241,7 +249,6 @@ export function useCheckoutForm() {
|
||||||
type: values.paymentMethod,
|
type: values.paymentMethod,
|
||||||
};
|
};
|
||||||
addItem("payment", values.paymentMethod);
|
addItem("payment", values.paymentMethod);
|
||||||
|
|
||||||
const typeObj = {
|
const typeObj = {
|
||||||
paypal: async () => {
|
paypal: async () => {
|
||||||
const {
|
const {
|
||||||
|
@ -254,8 +261,10 @@ export function useCheckoutForm() {
|
||||||
const {
|
const {
|
||||||
data: { data },
|
data: { data },
|
||||||
} = await apiBack.post("payment", productData);
|
} = 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();
|
redsysFormRef.value.click();
|
||||||
},
|
},
|
||||||
default: () => {
|
default: () => {
|
||||||
|
@ -328,6 +337,7 @@ export function useCheckoutForm() {
|
||||||
phoneInputRef,
|
phoneInputRef,
|
||||||
phoneSenderInputRef,
|
phoneSenderInputRef,
|
||||||
redsysFormRef,
|
redsysFormRef,
|
||||||
|
getFormatedDate,
|
||||||
|
|
||||||
phone: { phoneData, phoneSenderData },
|
phone: { phoneData, phoneSenderData },
|
||||||
|
|
||||||
|
|
|
@ -74,9 +74,17 @@ export function usePostalCalendar({ modalItem = "", type = "home" }) {
|
||||||
|
|
||||||
return isAvailabilityEmpty.value;
|
return isAvailabilityEmpty.value;
|
||||||
});
|
});
|
||||||
|
let DATE_INITIAL
|
||||||
const [YEAR, MONTH, DAY] = fullCurrentDate.replaceAll("/", "-").split("-");
|
const [YEAR, MONTH, DAY] = fullCurrentDate.replaceAll("/", "-").split("-");
|
||||||
const CURRENT_DATE = `${DAY}-${MONTH}-${YEAR}`;
|
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 {
|
const {
|
||||||
handleSubmit,
|
handleSubmit,
|
||||||
handleReset,
|
handleReset,
|
||||||
|
@ -94,11 +102,11 @@ export function usePostalCalendar({ modalItem = "", type = "home" }) {
|
||||||
min,
|
min,
|
||||||
max,
|
max,
|
||||||
},
|
},
|
||||||
postalCode: "",
|
postalCode: POSTAL_CODE_INITIAL,
|
||||||
date: CURRENT_DATE,
|
date: DATE_INITIAL,
|
||||||
},
|
},
|
||||||
initialTouched: {
|
initialTouched: {
|
||||||
date: false,
|
date: availability.value.dateExpired ? true : false,
|
||||||
postalCode: true,
|
postalCode: true,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
|
@ -41,7 +41,6 @@ export function useQuestionForm() {
|
||||||
const [phone, phoneAttrs] = defineField("phone", {
|
const [phone, phoneAttrs] = defineField("phone", {
|
||||||
validateOnModelUpdate: false,
|
validateOnModelUpdate: false,
|
||||||
});
|
});
|
||||||
const [query, queryAttrs] = defineField("query");
|
|
||||||
const [message, messageAttrs] = defineField("message");
|
const [message, messageAttrs] = defineField("message");
|
||||||
const [terms, termsAttrs] = defineField("terms");
|
const [terms, termsAttrs] = defineField("terms");
|
||||||
|
|
||||||
|
@ -102,8 +101,6 @@ export function useQuestionForm() {
|
||||||
emailAttrs,
|
emailAttrs,
|
||||||
phone,
|
phone,
|
||||||
phoneAttrs,
|
phoneAttrs,
|
||||||
query,
|
|
||||||
queryAttrs,
|
|
||||||
message,
|
message,
|
||||||
messageAttrs,
|
messageAttrs,
|
||||||
terms,
|
terms,
|
||||||
|
|
|
@ -283,6 +283,7 @@ export default defineComponent({
|
||||||
:imgSrc="item.image"
|
:imgSrc="item.image"
|
||||||
:isNew="item.isNew"
|
:isNew="item.isNew"
|
||||||
:id="item.id"
|
:id="item.id"
|
||||||
|
:hasPostalCode="(item.postalCode !== 'undefined')?true:false"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</Container>
|
</Container>
|
||||||
|
|
|
@ -16,6 +16,7 @@ export default defineComponent({
|
||||||
provinceOptions,
|
provinceOptions,
|
||||||
handleClickStep,
|
handleClickStep,
|
||||||
stepsFormated,
|
stepsFormated,
|
||||||
|
getFormatedDate,
|
||||||
stepList,
|
stepList,
|
||||||
checkoutBlock,
|
checkoutBlock,
|
||||||
cart,
|
cart,
|
||||||
|
@ -92,6 +93,7 @@ export default defineComponent({
|
||||||
|
|
||||||
checkoutBlock,
|
checkoutBlock,
|
||||||
stepsFormated,
|
stepsFormated,
|
||||||
|
getFormatedDate,
|
||||||
provinceOptions,
|
provinceOptions,
|
||||||
totalPrice,
|
totalPrice,
|
||||||
stepList,
|
stepList,
|
||||||
|
@ -141,39 +143,29 @@ export default defineComponent({
|
||||||
<q-page class="checkout-page">
|
<q-page class="checkout-page">
|
||||||
<Container tag="section">
|
<Container tag="section">
|
||||||
<header class="header-title">
|
<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">
|
||||||
pablone
commented
comentario comentario
jsolis
commented
Deje el comentario porque si más adelante queremos utilizar el subtitulo de la pagina ya esta maquetado. Deje el comentario porque si más adelante queremos utilizar el subtitulo de la pagina ya esta maquetado.
|
|||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||||
eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||||
</p>
|
</p>-->
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div class="checkout-container">
|
<div class="checkout-container">
|
||||||
<div class="checkout-steps">
|
<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="step-item">
|
||||||
<div class="circle-step-container">
|
<div class="circle-step-container">
|
||||||
<span class="border-step" :class="[i == 0 && 'transparent']" />
|
<span class="border-step" :class="[i == 0 && 'transparent']" />
|
||||||
|
|
||||||
<div
|
<div class="circle-step" :class="[
|
||||||
class="circle-step"
|
|
||||||
:class="[
|
|
||||||
(active || (meta.valid && i == 1) || !checkoutBlock) &&
|
(active || (meta.valid && i == 1) || !checkoutBlock) &&
|
||||||
'active',
|
'active',
|
||||||
]"
|
]">
|
||||||
>
|
|
||||||
<span class="step-value">{{ value }}</span>
|
<span class="step-value">{{ value }}</span>
|
||||||
</div>
|
</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>
|
||||||
|
|
||||||
<div class="step-content">
|
<div class="step-content">
|
||||||
|
@ -199,85 +191,37 @@ export default defineComponent({
|
||||||
|
|
||||||
<div class="checkout-fields">
|
<div class="checkout-fields">
|
||||||
<div class="field-control field-input">
|
<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>
|
||||||
|
|
||||||
<div class="field-control field-input">
|
<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>
|
||||||
|
|
||||||
<div class="field-control field-input">
|
<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>
|
||||||
|
|
||||||
<div class="field-control field-input">
|
<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>
|
<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>
|
</template>
|
||||||
</q-input>
|
</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">
|
<p class="paragraph-sm">
|
||||||
No se puede editar este campo
|
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?
|
¿No conoce su código postal?
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
|
@ -285,49 +229,23 @@ export default defineComponent({
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="field-control field-select">
|
<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>
|
||||||
|
|
||||||
<div class="field-control field-select">
|
<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>
|
||||||
|
|
||||||
<div class="field-control field-input telephone">
|
<div class="field-control field-input telephone">
|
||||||
<vue-tel-input
|
<vue-tel-input v-model="phone" v-bind="phoneAttrs" :styleClasses="[
|
||||||
v-model="phone"
|
|
||||||
v-bind="phoneAttrs"
|
|
||||||
:styleClasses="[
|
|
||||||
'custom-input',
|
'custom-input',
|
||||||
!!errors.phone && 'error',
|
!!errors.phone && 'error',
|
||||||
]"
|
]" ref="phoneInputRef" :inputOptions="{
|
||||||
ref="phoneInputRef"
|
|
||||||
:inputOptions="{
|
|
||||||
placeholder: 'Teléfono*',
|
placeholder: 'Teléfono*',
|
||||||
}"
|
}" />
|
||||||
/>
|
|
||||||
<p v-if="!!errors.phone" class="error">
|
<p v-if="!!errors.phone" class="error">
|
||||||
{{ errors.phone }}
|
{{ errors.phone }}
|
||||||
</p>
|
</p>
|
||||||
|
@ -342,57 +260,30 @@ export default defineComponent({
|
||||||
|
|
||||||
<div class="checkout-fields">
|
<div class="checkout-fields">
|
||||||
<div class="field-control field-input">
|
<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>
|
||||||
|
|
||||||
<div class="field-control field-input">
|
<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>
|
||||||
|
|
||||||
<div class="field-control field-input">
|
<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>
|
||||||
|
|
||||||
<div class="field-control field-input telephone">
|
<div class="field-control field-input telephone">
|
||||||
<vue-tel-input
|
<vue-tel-input v-model="senderPhone" v-bind="senderPhoneAttrs" :styleClasses="[
|
||||||
v-model="senderPhone"
|
|
||||||
v-bind="senderPhoneAttrs"
|
|
||||||
:styleClasses="[
|
|
||||||
'custom-input',
|
'custom-input',
|
||||||
!!errors.senderPhone && 'error',
|
!!errors.senderPhone && 'error',
|
||||||
]"
|
]" ref="phoneSenderInputRef" :inputOptions="{
|
||||||
ref="phoneSenderInputRef"
|
|
||||||
:inputOptions="{
|
|
||||||
placeholder: 'Teléfono*',
|
placeholder: 'Teléfono*',
|
||||||
}"
|
}" />
|
||||||
/>
|
|
||||||
<p v-if="!!errors.senderPhone" class="error">
|
<p v-if="!!errors.senderPhone" class="error">
|
||||||
{{ errors.senderPhone }}
|
{{ errors.senderPhone }}
|
||||||
</p>
|
</p>
|
||||||
|
@ -401,43 +292,19 @@ export default defineComponent({
|
||||||
<div class="field-control field-input">
|
<div class="field-control field-input">
|
||||||
<q-input
|
<q-input
|
||||||
placeholder="Notas sobre tu pedido (Opcional), por ejemplo, notas especiales para la entrega"
|
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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</q-form>
|
</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" />
|
<input ref="redsysFormRef" type="submit" value="Go to pay" />
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
@ -449,7 +316,7 @@ export default defineComponent({
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div class="checkout-delivery-body">
|
<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>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -462,11 +329,7 @@ export default defineComponent({
|
||||||
|
|
||||||
<div class="checkout-summary-body gray-bg">
|
<div class="checkout-summary-body gray-bg">
|
||||||
<ul class="checkout-summary-list">
|
<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>
|
<p>
|
||||||
{{ name }}
|
{{ name }}
|
||||||
<span>{{ price }}€</span>
|
<span>{{ price }}€</span>
|
||||||
|
@ -487,32 +350,19 @@ export default defineComponent({
|
||||||
|
|
||||||
<div class="checkout-payment-methods gray-bg">
|
<div class="checkout-payment-methods gray-bg">
|
||||||
<header class="checkout-aside-header">
|
<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
|
Método de pago
|
||||||
</strong>
|
</strong>
|
||||||
<p v-if="!!errors.paymentMethod"></p>
|
<p v-if="!!errors.paymentMethod"></p>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div class="checkout-payment-body">
|
<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>
|
<p>Paypal</p>
|
||||||
</q-radio>
|
</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>
|
</q-radio>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -525,13 +375,7 @@ export default defineComponent({
|
||||||
</p>
|
</p>
|
||||||
</q-checkbox>
|
</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
|
PROCEDER AL PAGO
|
||||||
</q-btn>
|
</q-btn>
|
||||||
</div>
|
</div>
|
||||||
|
@ -585,13 +429,16 @@ export default defineComponent({
|
||||||
align-items: center;
|
align-items: center;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
|
|
||||||
.step-value {
|
.step-value {
|
||||||
font-family: $font-questrial;
|
font-family: $font-questrial;
|
||||||
color: $primary-dark;
|
color: $primary-dark;
|
||||||
font-size: 1.25rem;
|
font-size: 1.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
background-color: $primary-dark;
|
background-color: $primary-dark;
|
||||||
|
|
||||||
.step-value {
|
.step-value {
|
||||||
color: $white;
|
color: $white;
|
||||||
}
|
}
|
||||||
|
@ -603,6 +450,7 @@ export default defineComponent({
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
font-family: $font-questrial;
|
font-family: $font-questrial;
|
||||||
|
|
||||||
h4 {
|
h4 {
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
|
@ -611,6 +459,7 @@ export default defineComponent({
|
||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
line-height: 1.3;
|
line-height: 1.3;
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
p {
|
||||||
font-size: 0.875rem;
|
font-size: 0.875rem;
|
||||||
color: $text-default;
|
color: $text-default;
|
||||||
|
@ -631,6 +480,7 @@ export default defineComponent({
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin-bottom: 21px;
|
margin-bottom: 21px;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
|
|
||||||
& h3 {
|
& h3 {
|
||||||
color: $text-default;
|
color: $text-default;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
@ -647,8 +497,10 @@ export default defineComponent({
|
||||||
& .checkout-form {
|
& .checkout-form {
|
||||||
flex: 1 0 min(100%, 795px);
|
flex: 1 0 min(100%, 795px);
|
||||||
}
|
}
|
||||||
|
|
||||||
& .checkout-aside {
|
& .checkout-aside {
|
||||||
flex: 1 0 min(100%, 329px);
|
flex: 1 0 min(100%, 329px);
|
||||||
|
|
||||||
& .checkout-delivery-date,
|
& .checkout-delivery-date,
|
||||||
& .checkout-summary,
|
& .checkout-summary,
|
||||||
& .checkout-payment-methods {
|
& .checkout-payment-methods {
|
||||||
|
@ -672,6 +524,7 @@ export default defineComponent({
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
height: 0;
|
height: 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
height: min-content;
|
height: min-content;
|
||||||
padding-block: 16px 18px;
|
padding-block: 16px 18px;
|
||||||
|
@ -683,6 +536,7 @@ export default defineComponent({
|
||||||
|
|
||||||
& .checkout-summary {
|
& .checkout-summary {
|
||||||
margin-bottom: 33px;
|
margin-bottom: 33px;
|
||||||
|
|
||||||
& .checkout-aside-header,
|
& .checkout-aside-header,
|
||||||
& .checkout-summary-body,
|
& .checkout-summary-body,
|
||||||
& .checkout-summary-footer {
|
& .checkout-summary-footer {
|
||||||
|
@ -691,6 +545,7 @@ export default defineComponent({
|
||||||
|
|
||||||
& .checkout-aside-header {
|
& .checkout-aside-header {
|
||||||
padding-block: 16px 17px;
|
padding-block: 16px 17px;
|
||||||
|
|
||||||
& .checkout-aside-title {
|
& .checkout-aside-title {
|
||||||
font-family: $font-lora;
|
font-family: $font-lora;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
@ -701,6 +556,7 @@ export default defineComponent({
|
||||||
|
|
||||||
& .checkout-summary-body {
|
& .checkout-summary-body {
|
||||||
padding-bottom: 23px;
|
padding-bottom: 23px;
|
||||||
|
|
||||||
& p {
|
& p {
|
||||||
font-size: $font-12;
|
font-size: $font-12;
|
||||||
line-height: 21px;
|
line-height: 21px;
|
||||||
|
@ -713,12 +569,14 @@ export default defineComponent({
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 4px;
|
gap: 4px;
|
||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
|
|
||||||
& .checkout-summary-item p {
|
& .checkout-summary-item p {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
& .checkout-summary-footer {
|
& .checkout-summary-footer {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
@ -737,19 +595,23 @@ export default defineComponent({
|
||||||
& .checkout-payment-methods {
|
& .checkout-payment-methods {
|
||||||
padding: 9px 16px 20px 21px;
|
padding: 9px 16px 20px 21px;
|
||||||
margin-bottom: 21px;
|
margin-bottom: 21px;
|
||||||
|
|
||||||
& .checkout-aside-header {
|
& .checkout-aside-header {
|
||||||
margin-bottom: 14px;
|
margin-bottom: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
& .checkout-payment-body {
|
& .checkout-payment-body {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 12px;
|
gap: 12px;
|
||||||
|
|
||||||
& p {
|
& p {
|
||||||
width: min(100%, 200px);
|
width: min(100%, 200px);
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
gap: 31px;
|
gap: 31px;
|
||||||
font-size: $font-12;
|
font-size: $font-12;
|
||||||
|
|
||||||
& .card-flags {
|
& .card-flags {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -773,6 +635,7 @@ export default defineComponent({
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 23px;
|
gap: 23px;
|
||||||
|
|
||||||
& .terms p {
|
& .terms p {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
font-size: $font-12;
|
font-size: $font-12;
|
||||||
|
@ -799,29 +662,36 @@ export default defineComponent({
|
||||||
width: min(100%, 499px);
|
width: min(100%, 499px);
|
||||||
margin: 122px auto 0;
|
margin: 122px auto 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
||||||
& .checkout-success-title {
|
& .checkout-success-title {
|
||||||
margin-bottom: 26px;
|
margin-bottom: 26px;
|
||||||
}
|
}
|
||||||
|
|
||||||
& .checkout-success-body {
|
& .checkout-success-body {
|
||||||
& .checkout-success-content {
|
& .checkout-success-content {
|
||||||
background-color: $secondary-5;
|
background-color: $secondary-5;
|
||||||
padding: 30px 46px 42px 38px;
|
padding: 30px 46px 42px 38px;
|
||||||
border-radius: 5px 5px 0px 0px;
|
border-radius: 5px 5px 0px 0px;
|
||||||
|
|
||||||
& .checkout-success-list {
|
& .checkout-success-list {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 28px;
|
gap: 28px;
|
||||||
|
|
||||||
& .checkout-success-item {
|
& .checkout-success-item {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
|
||||||
& .checkout-item-content {
|
& .checkout-item-content {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
min-height: 61px;
|
min-height: 61px;
|
||||||
|
|
||||||
& .checkout-product-details {
|
& .checkout-product-details {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 14px;
|
gap: 14px;
|
||||||
|
|
||||||
& .checkout-product-img {
|
& .checkout-product-img {
|
||||||
object-fit: cover;
|
object-fit: cover;
|
||||||
width: 54px;
|
width: 54px;
|
||||||
|
@ -875,8 +745,9 @@ export default defineComponent({
|
||||||
& .form-fields-container {
|
& .form-fields-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
&.delivery {
|
|
||||||
}
|
&.delivery {}
|
||||||
|
|
||||||
&.sender {
|
&.sender {
|
||||||
margin-top: 12px;
|
margin-top: 12px;
|
||||||
}
|
}
|
||||||
|
@ -886,6 +757,7 @@ export default defineComponent({
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
gap: 12px 9px;
|
gap: 12px 9px;
|
||||||
|
|
||||||
@media only screen and (max-width: $med-lg) {
|
@media only screen and (max-width: $med-lg) {
|
||||||
gap: 15px;
|
gap: 15px;
|
||||||
}
|
}
|
||||||
|
@ -896,6 +768,7 @@ export default defineComponent({
|
||||||
|
|
||||||
&.telephone {
|
&.telephone {
|
||||||
flex: 0 0 calc(50% - 5px);
|
flex: 0 0 calc(50% - 5px);
|
||||||
|
|
||||||
@media only screen and (max-width: $med-lg) {
|
@media only screen and (max-width: $med-lg) {
|
||||||
flex: 1 0 min(100%, 390px);
|
flex: 1 0 min(100%, 390px);
|
||||||
}
|
}
|
||||||
|
@ -905,10 +778,12 @@ export default defineComponent({
|
||||||
label {
|
label {
|
||||||
padding-bottom: 10px;
|
padding-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
& .q-field__control {
|
& .q-field__control {
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border: 1px solid $primary-light;
|
border: 1px solid $primary-light;
|
||||||
|
|
||||||
& input {
|
& input {
|
||||||
padding: 0px 0px 0px 20px;
|
padding: 0px 0px 0px 20px;
|
||||||
font-family: $font-questrial;
|
font-family: $font-questrial;
|
||||||
|
@ -923,20 +798,24 @@ export default defineComponent({
|
||||||
&.text-negative {
|
&.text-negative {
|
||||||
border-color: $negative;
|
border-color: $negative;
|
||||||
}
|
}
|
||||||
|
|
||||||
&::after,
|
&::after,
|
||||||
&::before {
|
&::before {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.q-field__marginal {
|
.q-field__marginal {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
padding-right: 30px;
|
padding-right: 30px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.q-field--error .q-field__bottom {
|
.q-field--error .q-field__bottom {
|
||||||
padding-top: 4px;
|
padding-top: 4px;
|
||||||
font-size: 0.675rem;
|
font-size: 0.675rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.field-select {
|
&.field-select {
|
||||||
.q-field__control {
|
.q-field__control {
|
||||||
min-height: initial;
|
min-height: initial;
|
||||||
|
@ -944,23 +823,28 @@ export default defineComponent({
|
||||||
height: 40px;
|
height: 40px;
|
||||||
padding: 0px 30px;
|
padding: 0px 30px;
|
||||||
border: 1px solid $primary-light;
|
border: 1px solid $primary-light;
|
||||||
|
|
||||||
.q-field__native span {
|
.q-field__native span {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.q-field__append {
|
.q-field__append {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.q-field__label {
|
.q-field__label {
|
||||||
font-family: $font-questrial;
|
font-family: $font-questrial;
|
||||||
color: $text-default !important;
|
color: $text-default !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.q-field__control-container {
|
.q-field__control-container {
|
||||||
padding-top: 0;
|
padding-top: 0;
|
||||||
height: 36px;
|
height: 36px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (max-width: $med-lg) {
|
@media only screen and (max-width: $med-lg) {
|
||||||
&.sender {
|
&.sender {
|
||||||
margin-top: 45px;
|
margin-top: 45px;
|
||||||
|
@ -972,6 +856,7 @@ export default defineComponent({
|
||||||
padding: 10.5px 1px;
|
padding: 10.5px 1px;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
transition: 200ms ease-in-out;
|
transition: 200ms ease-in-out;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
border-color: $black;
|
border-color: $black;
|
||||||
}
|
}
|
||||||
|
|
|
@ -55,7 +55,7 @@ export default defineComponent({
|
||||||
if (!value) return push("/");
|
if (!value) return push("/");
|
||||||
} */
|
} */
|
||||||
|
|
||||||
if (cart.length === 0) return push("/");
|
//if (cart.length === 0) return push("/");
|
||||||
|
|
||||||
await getSuccessData();
|
await getSuccessData();
|
||||||
});
|
});
|
||||||
|
@ -130,12 +130,12 @@ export default defineComponent({
|
||||||
|
|
||||||
<div class="checkout-success" id="success-block">
|
<div class="checkout-success" id="success-block">
|
||||||
<h6 class="checkout-success-title green-text">
|
<h6 class="checkout-success-title green-text">
|
||||||
Has efectuado la siguiente compra
|
Gracias por realizar tu compra
|
||||||
</h6>
|
</h6>
|
||||||
|
|
||||||
<div class="checkout-success-body">
|
<div class="checkout-success-body">
|
||||||
<div class="checkout-success-content">
|
<div class="checkout-success-content">
|
||||||
<ul class="checkout-success-list">
|
<!--<ul class="checkout-success-list">
|
||||||
<li
|
<li
|
||||||
v-for="({ name, price, image }, index) in cart"
|
v-for="({ name, price, image }, index) in cart"
|
||||||
:key="index"
|
:key="index"
|
||||||
|
@ -158,13 +158,13 @@ export default defineComponent({
|
||||||
<p class="checkout-product-price">{{ price }}€</p>
|
<p class="checkout-product-price">{{ price }}€</p>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>-->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer class="checkout-success-footer">
|
<!--<footer class="checkout-success-footer">
|
||||||
<p class="checkout-success-paragraph">Total</p>
|
<p class="checkout-success-paragraph">Total</p>
|
||||||
<p class="checkout-success-paragraph">{{ totalPrice.toFixed(2) }}€</p>
|
<p class="checkout-success-paragraph">{{ totalPrice.toFixed(2) }}€</p>
|
||||||
</footer>
|
</footer>-->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</q-page>
|
</q-page>
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
import { storeToRefs } from "pinia";
|
import { storeToRefs } from "pinia";
|
||||||
import { defineComponent, onBeforeMount, ref } from "vue";
|
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 VerticalCarouselImgs from "src/components/quasar-components/carousel/VerticalCarouselImgs.vue";
|
||||||
import Swiper from "src/components/swiper/Swiper.vue";
|
import Swiper from "src/components/swiper/Swiper.vue";
|
||||||
import Card from "src/components/ui/Card.vue";
|
import Card from "src/components/ui/Card.vue";
|
||||||
|
@ -18,6 +19,7 @@ export default defineComponent({
|
||||||
Card,
|
Card,
|
||||||
},
|
},
|
||||||
setup() {
|
setup() {
|
||||||
|
const banners = ref()
|
||||||
const mobileStore = useMobileStore();
|
const mobileStore = useMobileStore();
|
||||||
const { isCarouselVisible, isOpenNav, screenWidth } =
|
const { isCarouselVisible, isOpenNav, screenWidth } =
|
||||||
storeToRefs(mobileStore);
|
storeToRefs(mobileStore);
|
||||||
|
@ -26,35 +28,37 @@ export default defineComponent({
|
||||||
const { getProducts } = cartStore;
|
const { getProducts } = cartStore;
|
||||||
const { products, homeSection } = storeToRefs(cartStore);
|
const { products, homeSection } = storeToRefs(cartStore);
|
||||||
|
|
||||||
|
async function getBanners() {
|
||||||
pablone
commented
no se utiliza la función no se utiliza la función
jsolis
commented
Deje la función porque es la función que va a buscar los banners, entiendo que el día de mañana se utilizará. Deje la función porque es la función que va a buscar los banners, entiendo que el día de mañana se utilizará.
|
|||||||
|
//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 () => {
|
onBeforeMount(async () => {
|
||||||
|
//banners.value = await getBanners();
|
||||||
await getProducts();
|
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 {
|
return {
|
||||||
isCarouselVisible,
|
isCarouselVisible,
|
||||||
slidesContent,
|
|
||||||
screenWidth,
|
screenWidth,
|
||||||
homeSection,
|
homeSection,
|
||||||
isOpenNav,
|
isOpenNav,
|
||||||
products,
|
products,
|
||||||
|
banners
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
@ -63,7 +67,7 @@ export default defineComponent({
|
||||||
<template>
|
<template>
|
||||||
<q-page>
|
<q-page>
|
||||||
<q-no-ssr>
|
<q-no-ssr>
|
||||||
<VerticalCarouselImgs :imgsArr="slidesContent" class="home-carousel" />
|
<VerticalCarouselImgs class="home-carousel" />
|
||||||
</q-no-ssr>
|
</q-no-ssr>
|
||||||
|
|
||||||
<section class="products-section" ref="homeSection">
|
<section class="products-section" ref="homeSection">
|
||||||
|
@ -77,25 +81,15 @@ export default defineComponent({
|
||||||
|
|
||||||
<div class="products-body">
|
<div class="products-body">
|
||||||
<Container cardContainer>
|
<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>
|
</template>
|
||||||
</Container>
|
</Container>
|
||||||
|
|
||||||
<RouterLink class="btn rounded outlined" to="/categoria/all">
|
<RouterLink class="btn rounded outlined" to="/categoria/all">
|
||||||
Ver todos los diseños <IconArrowCircleFilledRight />
|
Ver todos los diseños
|
||||||
|
<IconArrowCircleFilledRight />
|
||||||
</RouterLink>
|
</RouterLink>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
@ -112,20 +106,10 @@ export default defineComponent({
|
||||||
<div class="products-selection-body">
|
<div class="products-selection-body">
|
||||||
<q-no-ssr>
|
<q-no-ssr>
|
||||||
<Swiper>
|
<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">
|
<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>
|
</swiper-slide>
|
||||||
</template>
|
</template>
|
||||||
</Swiper>
|
</Swiper>
|
||||||
|
@ -134,7 +118,8 @@ export default defineComponent({
|
||||||
|
|
||||||
<footer class="products-selection-footer">
|
<footer class="products-selection-footer">
|
||||||
<RouterLink class="btn rounded outlined pd-icon" to="/">
|
<RouterLink class="btn rounded outlined pd-icon" to="/">
|
||||||
Ver todas las plantas <IconArrowCircleFilledRight />
|
Ver todas las plantas
|
||||||
|
<IconArrowCircleFilledRight />
|
||||||
</RouterLink>
|
</RouterLink>
|
||||||
</footer>
|
</footer>
|
||||||
</section>
|
</section>
|
||||||
|
@ -177,11 +162,9 @@ export default defineComponent({
|
||||||
scroll-margin: 30px;
|
scroll-margin: 30px;
|
||||||
|
|
||||||
& .products-section-header {
|
& .products-section-header {
|
||||||
& .products-header-title {
|
& .products-header-title {}
|
||||||
}
|
|
||||||
|
|
||||||
& .products-header-paragraph {
|
& .products-header-paragraph {}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
& .products-body {
|
& .products-body {
|
||||||
|
@ -193,8 +176,7 @@ export default defineComponent({
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (max-width: $med-xmd) {
|
@media only screen and (max-width: $med-xmd) {
|
||||||
& .products-body {
|
& .products-body {}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -77,7 +77,7 @@ export default defineComponent({
|
||||||
const { products, addCartLoadingBtn } = storeToRefs(cartStore);
|
const { products, addCartLoadingBtn } = storeToRefs(cartStore);
|
||||||
|
|
||||||
onBeforeMount(async () => {
|
onBeforeMount(async () => {
|
||||||
await getProduct(route.params.id);
|
await getProduct(route.params.id, availability.value);
|
||||||
});
|
});
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
|
@ -128,10 +128,10 @@ export default defineComponent({
|
||||||
const checkImageValidity = (imageLink) => {
|
const checkImageValidity = (imageLink) => {
|
||||||
const validExtensions = [".jpg", ".jpeg", ".png"];
|
const validExtensions = [".jpg", ".jpeg", ".png"];
|
||||||
|
|
||||||
if (imageLink) {
|
/*if (imageLink) {
|
||||||
const extension = imageLink.substring(imageLink.lastIndexOf("."));
|
const extension = imageLink.substring(imageLink.lastIndexOf("."));
|
||||||
return validExtensions.includes(extension.toLowerCase());
|
return validExtensions.includes(extension.toLowerCase());
|
||||||
}
|
}*/
|
||||||
|
|
||||||
return true;
|
return true;
|
||||||
};
|
};
|
||||||
|
@ -268,8 +268,8 @@ export default defineComponent({
|
||||||
</div>
|
</div>
|
||||||
</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">
|
<div class="product-share-content">
|
||||||
<a href="#" class="product-share-item"><IconShare /></a>
|
<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"><IconEmail /></a>
|
||||||
<a href="#" class="product-share-item"><IconWhatsapp /></a>
|
<a href="#" class="product-share-item"><IconWhatsapp /></a>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>-->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
|
@ -336,7 +336,7 @@ export default defineComponent({
|
||||||
<Container cardContainer class="no-padding">
|
<Container cardContainer class="no-padding">
|
||||||
<template
|
<template
|
||||||
v-for="(
|
v-for="(
|
||||||
{ image, discount, isNew, name, price, id }, i
|
{ image, discount, isNew, name, price, id, postalCode }, i
|
||||||
) in products.data"
|
) in products.data"
|
||||||
:key="id"
|
:key="id"
|
||||||
>
|
>
|
||||||
|
@ -348,6 +348,7 @@ export default defineComponent({
|
||||||
:imgSrc="image"
|
:imgSrc="image"
|
||||||
:isNew="isNew"
|
:isNew="isNew"
|
||||||
:id="id"
|
:id="id"
|
||||||
|
:hasPostalCode="(postalCode !== 'undefined')?true:false"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</Container>
|
</Container>
|
||||||
|
|
|
@ -147,11 +147,10 @@ export const useCartStore = defineStore("cart", () => {
|
||||||
routeId.value = id;
|
routeId.value = id;
|
||||||
try {
|
try {
|
||||||
const params = transformOptionsToParams(options);
|
const params = transformOptionsToParams(options);
|
||||||
|
|
||||||
const promises = [
|
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 results = await Promise.allSettled(promises);
|
||||||
const [prev, current, next] = results.map((res) => {
|
const [prev, current, next] = results.map((res) => {
|
||||||
|
@ -195,13 +194,13 @@ export const useCartStore = defineStore("cart", () => {
|
||||||
const params = transformOptionsToParams(
|
const params = transformOptionsToParams(
|
||||||
availabilityForm.value || availability.value
|
availabilityForm.value || availability.value
|
||||||
);
|
);
|
||||||
await getProducts(params);
|
const correctProduct = await apiBack.get(`products/${product.id}`, { params });
|
||||||
|
|
||||||
const hasCurrentProduct = computed(() => {
|
const hasCurrentProduct = computed(() => {
|
||||||
return cart.value.find((p) => p.id === product.id);
|
return cart.value.find((p) => p.id === product.id);
|
||||||
});
|
});
|
||||||
|
|
||||||
if (isEmpty.value) {
|
if (correctProduct.data.length === 0) {
|
||||||
push("/");
|
push("/");
|
||||||
return quasarNotify({
|
return quasarNotify({
|
||||||
message:
|
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) {
|
if (hasCurrentProduct.value) {
|
||||||
return quasarNotify({
|
return quasarNotify({
|
||||||
message: "Este producto ya está en el carrito",
|
message: "Este producto ya está en el carrito",
|
||||||
|
|
|
@ -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,
|
|
||||||
};
|
|
||||||
});
|
|
|
@ -15,9 +15,6 @@ const questionObjVal = {
|
||||||
phone: z
|
phone: z
|
||||||
.string({ required_error: M.requiredMessage })
|
.string({ required_error: M.requiredMessage })
|
||||||
.min(1, M.requiredMessage),
|
.min(1, M.requiredMessage),
|
||||||
query: z
|
|
||||||
.string({ required_error: M.requiredMessage })
|
|
||||||
.min(1, M.requiredMessage),
|
|
||||||
message: z
|
message: z
|
||||||
.string({ required_error: M.requiredMessage })
|
.string({ required_error: M.requiredMessage })
|
||||||
.min(1, M.requiredMessage),
|
.min(1, M.requiredMessage),
|
||||||
|
|
Loading…
Reference in New Issue
revisar console.log