From 59c03f28f2b677f715fb55b8fe5c8fb9d3564080 Mon Sep 17 00:00:00 2001 From: Surya Paolo Date: Sat, 9 Dec 2023 19:38:30 +0100 Subject: [PATCH] aggiornamento visualizzazione Ordini e Carrello --- src/common/shared_vuejs.ts | 8 + src/components/CProductCard/CProductCard.ts | 221 ++++++++++--------- src/components/CProductCard/CProductCard.vue | 128 ++++++++--- src/components/CSingleCart/CSingleCart.vue | 4 +- src/rootgen/admin/orders/orders.vue | 10 +- src/router/routesECommerce.ts | 8 +- src/statics/lang/it.js | 12 +- src/store/Products.ts | 66 ++++-- src/store/globalStore.ts | 9 +- src/views/ecommerce/checkOut/checkOut.ts | 54 ++--- src/views/ecommerce/checkOut/checkOut.vue | 46 ++-- src/views/ecommerce/orderInfo/orderInfo.ts | 12 +- src/views/ecommerce/orderInfo/orderInfo.vue | 19 +- 13 files changed, 371 insertions(+), 226 deletions(-) diff --git a/src/common/shared_vuejs.ts b/src/common/shared_vuejs.ts index 66fea476..43aa2327 100755 --- a/src/common/shared_vuejs.ts +++ b/src/common/shared_vuejs.ts @@ -1032,6 +1032,14 @@ export const shared_consts = { CANCELED: 10, }, + OrderStatStr: { + IN_CORSO: 1, + CONFERMATI: 2, + PAGATI: 3, + COMPLETATI: 4, + CANCELLATI: 5, + }, + OrderStatusView: [ 2, 3, diff --git a/src/components/CProductCard/CProductCard.ts b/src/components/CProductCard/CProductCard.ts index 2fe08b04..4f80e0d2 100755 --- a/src/components/CProductCard/CProductCard.ts +++ b/src/components/CProductCard/CProductCard.ts @@ -31,17 +31,6 @@ export default defineComponent({ required: false, default: false, }, - order: { - type: Object as PropType, - required: false, - default: () => { - return { - idapp: process.env.APP_ID, - quantity: 1, - idStorehouse: '' - } - }, - }, }, components: { CTitleBanner, CCardState, CCopyBtn }, setup(props, { emit }) { @@ -51,9 +40,13 @@ export default defineComponent({ const globalStore = useGlobalStore() const products = useProducts() - const myorder = toRef(props, 'order') + const myorder = ref({ + idapp: process.env.APP_ID, + quantity: 1, + idStorehouse: '' + }) - const myproduct = ref( {}) + const myproduct = ref({}) const storeSelected = ref('') @@ -75,7 +68,7 @@ export default defineComponent({ myorder.value.quantity++ } - function addtoCart() { + function addtoCart(add: boolean) { if (!userStore.isLogged) { tools.showNeutralNotif($q, t('ecomm.area_personale')) @@ -83,113 +76,127 @@ export default defineComponent({ return false } - // Controlla se esiste già nel carrello il prodotto - if (products.existProductInCart(myproduct.value._id)) { - tools.showNegativeNotif($q, t('ecomm.already_in_cart')) - } else { - products.addToCart({ product: myproduct.value, order: props.order }).then((ris) => { - let strprod = t('ecomm.prodotto') - if (myorder.value.quantity > 1) - strprod = t('ecomm.prodotti') - if (ris) - tools.showPositiveNotif($q, t('ecomm.haveadded') + ' ' + myorder.value.quantity + ' ' + strprod + ' ' + t('ecomm.tocart')) - else - tools.showNegativeNotif($q, t('ecomm.error_cart')) - }) - } + products.addToCart({ product: myproduct.value, order: myorder.value, addqty: add }).then((ris) => { + let strprod = t('ecomm.prodotto') + if (myorder.value.quantity > 1 || myorder.value.quantity === 0) + strprod = t('ecomm.prodotti') + + let msg = '' + if (ris === null) + msg = t('ecomm.error_cart') + else { + if (myorder.value.quantity === 0) { + msg = t('ecomm.prodotto_tolto') + } else { + msg = t('ecomm.prod_sul_carrello', { strprod, qty: myorder.value.quantity }) + } + + } + + if (ris === null || myorder.value.quantity === 0) + tools.showNotif($q, msg) + else + tools.showPositiveNotif($q, msg) + + }) } - function getnumstore() { - if (myproduct.value.storehouses) - return myproduct.value.storehouses.length - else - return 0 - } +function getnumstore() { + if (myproduct.value.storehouses) + return myproduct.value.storehouses.length + else + return 0 +} - function getSingleStorehouse() { - const mystore = myproduct.value.storehouses[0] - if (mystore) - return mystore.name + ' (' + mystore.city + ')' - else - return '' - } +function getSingleStorehouse() { + const mystore = myproduct.value.storehouses[0] + if (mystore) + return mystore.name + ' (' + mystore.city + ')' + else + return '' +} - function getStorehouses() { +function getStorehouses() { - const myarr: any = [] - let ind = 1 - myproduct.value.storehouses.forEach((store) => { - myarr.push( - { - id: ind, - label: store.name + ' (' + store.city + ')', - value: store._id - }) - - ind++ + const myarr: any = [] + let ind = 1 + myproduct.value.storehouses.forEach((store) => { + myarr.push( + { + id: ind, + label: store.name + ' (' + store.city + ')', + value: store._id }) - // console.log('arraystore', myarr) - return myarr - } + ind++ + }) - function checkifCartDisable() { - return !myorder.value.idStorehouse - } + // console.log('arraystore', myarr) + return myarr +} - watch(() => props.code, (newval, oldval) => { - console.log('change code') - load() - }) +function checkifCartDisable() { + return !myorder.value.idStorehouse +} - watch(() => storeSelected.value, (newval, oldval) => { - myorder.value.idStorehouse = newval - }) +watch(() => props.code, (newval, oldval) => { + console.log('change code') + load() +}) - async function load() { - // console.log('created Cproductcard', code) - if (props.code) { - myproduct.value = await products.loadProduct({ code: props.code }) - } else { - // @ts-ignore - myproduct.value = props.product - } +watch(() => storeSelected.value, (newval, oldval) => { + myorder.value.idStorehouse = newval +}) - console.log('myproduct', myproduct, 'product', props.product) +async function load() { + // console.log('created Cproductcard', code) + if (props.code) { + myproduct.value = await products.loadProduct({ code: props.code }) + } else { + // @ts-ignore + myproduct.value = props.product + } - if (!!myproduct.value) { - if (myproduct.value.storehouses.length === 1) { - myorder.value.idStorehouse = myproduct.value.storehouses[0]._id - } - } - } + console.log('myproduct', myproduct, 'product', props.product) - function getmycardcl() { - return (props.complete) ? 'my-card-big' : 'my-card' - } - - function getclimg() { - return (props.complete) ? 'myimgtitle centermydiv' : 'centermydiv' - } - - load() - - return { - decqty, - addqty, - addtoCart, - iconWhishlist, - getmycardcl, - getclimg, - getnumstore, - getSingleStorehouse, - getStorehouses, - checkifCartDisable, - myproduct, - myorder, - tools, - t, - storeSelected, + if (!!myproduct.value) { + if (myproduct.value.storehouses.length === 1) { + myorder.value.idStorehouse = myproduct.value.storehouses[0]._id } } +} + +function getmycardcl() { + return (props.complete) ? 'my-card-big' : 'my-card' +} + +function getclimg() { + return (props.complete) ? 'myimgtitle centermydiv' : 'centermydiv' +} + +function enableSubQty() { + return myorder.value ? myorder.value.quantity > 0 : true +} + +load() + +return { + decqty, + addqty, + addtoCart, + iconWhishlist, + getmycardcl, + getclimg, + getnumstore, + getSingleStorehouse, + getStorehouses, + checkifCartDisable, + myproduct, + myorder, + tools, + t, + storeSelected, + enableSubQty, +} + } }) diff --git a/src/components/CProductCard/CProductCard.vue b/src/components/CProductCard/CProductCard.vue index 2281dae2..bf76c7c4 100755 --- a/src/components/CProductCard/CProductCard.vue +++ b/src/components/CProductCard/CProductCard.vue @@ -1,14 +1,23 @@ diff --git a/src/router/routesECommerce.ts b/src/router/routesECommerce.ts index ba29fecc..ca8ee578 100644 --- a/src/router/routesECommerce.ts +++ b/src/router/routesECommerce.ts @@ -39,7 +39,7 @@ function getRoutesEcomm(site: ISites) { level_parent: 0, level_child: 0.5, }, - { + /*{ active: true, order: 35, path: '/admin/ecommerce/orders', @@ -51,7 +51,7 @@ function getRoutesEcomm(site: ISites) { level_parent: 0, level_child: 0.5, onlyDepartment: true - }, + },*/ ] const routes_admin_ecommerce: IListRoutes[] = [ @@ -111,7 +111,7 @@ function getRoutesEcomm(site: ISites) { onlyManager: true, onlyEditor: true }, - { + /*{ active: true, order: 31, path: '/admin/ecommerce/orders', @@ -124,7 +124,7 @@ function getRoutesEcomm(site: ISites) { level_child: 0.5, onlyManager: true, onlyEditor: true - }, + },*/ { active: true, order: 32, diff --git a/src/statics/lang/it.js b/src/statics/lang/it.js index b854be2b..ccf23f17 100755 --- a/src/statics/lang/it.js +++ b/src/statics/lang/it.js @@ -69,7 +69,8 @@ const msg_it = { theme: 'Tema', ritiro_presso: 'Ritiro presso', magazzino: 'Magazzino', - addcart: 'Aggiungi {qta} al Carrello', + addcart: '+{qta}', + subcart: '-{qta}', origine: 'Origine', ingredienti: 'ingredienti', valori_nutrizionali: 'Valori Nutrizionali', @@ -1611,9 +1612,14 @@ const msg_it = { area_personale: 'Devi prima accedere alla tua Area Personale', prodotto: 'prodotto', prodotti: 'prodotti', - haveadded: 'Hai Aggiunto', + prod_sul_carrello: '{qty} {strprod} sul Carrello', + prodotto_tolto: 'Il prodotto è stato tolto dal Carrello', error_cart: 'Errore durante l\'inserimento del prodotto sul carrello, riprovare.', - tocart: 'al Carrello', + completa_ord: 'Completa l\'Ordine', + conferma_acq: 'Confermare l\'ordine di acquisto di {qty} prodotti ?', + order: 'Ordine', + ord_confirmed: 'Ordine Confermato', + }, install: { Installazione_Sito: 'Installazione Sito', diff --git a/src/store/Products.ts b/src/store/Products.ts index af5b1e37..d584c401 100755 --- a/src/store/Products.ts +++ b/src/store/Products.ts @@ -32,17 +32,17 @@ export const useProducts = defineStore('Products', { return state.orders }, - getOrdersCart: (state: IProductsState) => (tipoord: string): IOrderCart[] | undefined => { + getOrdersCart: (state: IProductsState) => (tipoord: number): IOrderCart[] | undefined => { console.log('state.orders', state.orders) - if (tipoord === 'incorso') + if (tipoord === shared_consts.OrderStatStr.IN_CORSO) return state.orders.filter((rec: IOrderCart) => (rec.status ? rec.status : 0) <= shared_consts.OrderStatus.CHECKOUT_SENT) - else if (tipoord === 'confermati') + else if (tipoord === shared_consts.OrderStatStr.CONFERMATI) return state.orders.filter((rec: IOrderCart) => rec.status === shared_consts.OrderStatus.ORDER_CONFIRMED) - else if (tipoord === 'pagati') + else if (tipoord === shared_consts.OrderStatStr.PAGATI) return state.orders.filter((rec: IOrderCart) => rec.status === shared_consts.OrderStatus.PAYED) - else if (tipoord === 'completati') + else if (tipoord === shared_consts.OrderStatStr.COMPLETATI) return state.orders.filter((rec: IOrderCart) => rec.status === shared_consts.OrderStatus.RECEIVED) - else if (tipoord === 'cancellati') + else if (tipoord === shared_consts.OrderStatStr.CANCELLATI) return state.orders.filter((rec: IOrderCart) => rec.status === shared_consts.OrderStatus.CANCELED) }, @@ -54,6 +54,14 @@ export const useProducts = defineStore('Products', { } return false }, + getOrderProductInCart: (state: IProductsState) => (idproduct: string): IOrder | null => { + // console.log('.cart.items', this.cart.items) + if (state.cart.items) { + const ris = state.cart.items.find((item: IBaseOrder) => item.order.idProduct === idproduct) + return ris ? ris.order : null + } + return null + }, getRecordEmpty: (state: IProductsState) => (): IProduct => { @@ -258,7 +266,7 @@ export const useProducts = defineStore('Products', { }) }, - async addToCart({ product, order }: { product: IProduct, order: IOrder }) { + async addToCart({ product, order, addqty }: { product: IProduct, order: IOrder, addqty: boolean }) { const userStore = useUserStore() const globalStore = useGlobalStore() @@ -266,9 +274,41 @@ export const useProducts = defineStore('Products', { if (!globalStore.site.confpages.enableEcommerce) return null - const neworder = this.createOrderByProduct(product, order) + let neworder = null; - if (!neworder.idStorehouse) + // Controlla se esiste già nel carrello, allora semplicemente aggiungerò la quantità: + if (this.existProductInCart(product._id)) { + const ordcart = this.getOrderProductInCart(product._id) + if (ordcart) { + + if (!addqty && ordcart.quantity === 1) { + // sto per rimuovere l'ultimo pezzo, quindi cancello direttamente + const risrem = await this.removeFromCart({ order: ordcart }) + + if (risrem) { + order.quantity = 0 + return true + } else { + return false + } + } + + return await this.addSubQtyToItem({ + addqty, + subqty: !addqty, + order: ordcart, + }).then((newqty) => { + order.quantity = newqty + }) + } + } else { + if (order.quantity === 0) + order.quantity = 1 + + neworder = this.createOrderByProduct(product, order) + } + + if (neworder && !neworder.idStorehouse) return new Types.AxiosError(serv_constants.RIS_CODE_ERR, null, toolsext.ERR_GENERICO, 'Nessuno Store') console.log('addToCart', 'userid=', userStore.my._id, neworder) @@ -296,7 +336,7 @@ export const useProducts = defineStore('Products', { return ris }, - async addSubQtyToItem({ addqty, subqty, order } : { addqty: boolean, subqty: boolean, order: IOrder }) { + async addSubQtyToItem({ addqty, subqty, order }: { addqty: boolean, subqty: boolean, order: IOrder }) { const userStore = useUserStore() const globalStore = useGlobalStore() @@ -331,7 +371,7 @@ export const useProducts = defineStore('Products', { return ris }, - async UpdateStatusCart({ cart_id, status }: { cart_id:string, status: number }) { + async UpdateStatusCart({ cart_id, status }: { cart_id: string, status: number }) { const userStore = useUserStore() const globalStore = useGlobalStore() @@ -339,8 +379,6 @@ export const useProducts = defineStore('Products', { if (!globalStore.site.confpages.enableEcommerce) return null - // console.log('addSubQtyToItem', 'userid=', userStore.my._id, order) - let ris = null ris = await Api.SendReq('/cart/' + userStore.my._id + '/cartstatus', 'POST', { cart_id, status }) @@ -370,8 +408,6 @@ export const useProducts = defineStore('Products', { if (!globalStore.site.confpages.enableEcommerce) return null - // console.log('addSubQtyToItem', 'userid=', userStore.my._id, order) - let ris = null ris = await Api.SendReq('/cart/' + userStore.my._id + '/orderstatus', 'POST', { order_id, status }) diff --git a/src/store/globalStore.ts b/src/store/globalStore.ts index f46812de..35798171 100644 --- a/src/store/globalStore.ts +++ b/src/store/globalStore.ts @@ -37,7 +37,7 @@ import { useCircuitStore } from '@store/CircuitStore' import { routesAdmin } from '@src/router/routesAdmin' import { routesECommerce } from '@src/router/routesECommerce' import LandingFooter from '@src/components/LandingFooter/LandingFooter' - +import { useProducts } from '@store/Products' const stateConnDefault = 'online' @@ -283,6 +283,7 @@ export const useGlobalStore = defineStore('GlobalStore', { const userStore = useUserStore() const messageStore = useMessageStore() const notifStore = useNotifStore() + if (table === costanti.TABEVENTS) return calendarStore.eventlist @@ -1498,6 +1499,8 @@ export const useGlobalStore = defineStore('GlobalStore', { const userStore = useUserStore() const calendarStore = useCalendarStore() const circuitStore = useCircuitStore() + const Products = useProducts() + // console.log('calendarStore: loadAfterLogin') // Load local data const showall = userStore.isAdmin || userStore.isManager ? '1' : '0' @@ -1550,13 +1553,13 @@ export const useGlobalStore = defineStore('GlobalStore', { // console.log('res.data.cart', res.data.cart) - /* if (res.data.cart) + if (res.data.cart) Products.cart = (res.data.cart) ? { ...res.data.cart } : {} else Products.cart = { items: [], totalPrice: 0, totalQty: 0, userId: '' } Products.orders = (res.data.orders) ? [...res.data.orders] : [] - */ + if (showall) { this.newstosent = (res.data.newstosent) ? [...res.data.newstosent] : [] diff --git a/src/views/ecommerce/checkOut/checkOut.ts b/src/views/ecommerce/checkOut/checkOut.ts index 8dcded59..24155355 100755 --- a/src/views/ecommerce/checkOut/checkOut.ts +++ b/src/views/ecommerce/checkOut/checkOut.ts @@ -27,12 +27,12 @@ export default defineComponent({ const $q = useQuasar() const { t } = useI18n(); - const mycart = ref({}) + const mycart = ref({}) const myrec = ref([]) const oldrec = ref([]) const note = ref('') const statusnow = ref(shared_consts.OrderStatus.NONE) - + function mounted() { // Inizializza load() @@ -42,7 +42,7 @@ export default defineComponent({ const cart = productStore.getCart() return cart.items || null } - + function getNumItems(): number { const cart = productStore.getCart() if (!!cart.items) @@ -50,30 +50,30 @@ export default defineComponent({ else return 0 } - + function getCart(): ICart { return productStore.getCart() } - + function getNote() { const cart = productStore.getCart() return cart.note } - + function change_field(fieldname: string) { if (myrec.value[fieldname] !== oldrec.value[fieldname]) { myrec.value[fieldname] = oldrec.value[fieldname] - + const mydata = { [fieldname]: myrec.value[fieldname] } - + const aggiorna = fieldname !== 'status' tools.saveFieldToServer($q, 'carts', mycart.value._id, mydata, aggiorna) oldrec.value[fieldname] = myrec.value[fieldname] } } - + function myTotalPrice(): string { if (productStore.cart && productStore.cart.totalPrice) { return productStore.cart.totalPrice.toFixed(2) @@ -81,7 +81,7 @@ export default defineComponent({ return '0' } } - + function myTotalQty(): number { if (productStore.cart) { return productStore.cart.totalQty! @@ -89,7 +89,7 @@ export default defineComponent({ return 0 } } - + async function load() { mycart.value = getCart() myrec.value = Object.keys(mycart) @@ -98,45 +98,45 @@ export default defineComponent({ if (mycart.value) statusnow.value = await productStore.UpdateStatusCart({ cart_id: mycart.value._id, status: 0 }) - + console.log('myrec', myrec.value) } - + function CanBeShipped() { return productStore.cart.items ? productStore.cart.items.filter((rec: any) => rec.order.product.canBeShipped).length : false } - + function CanBeBuyOnline() { return productStore.cart.items ? productStore.cart.items.filter((rec: any) => rec.order.product.canBeBuyOnline).length : false } - + function getnumsteps() { let numsteps = 1 - + if (CanBeShipped()) numsteps++ if (CanBeBuyOnline()) numsteps++ - + return numsteps } - + function docheckout() { - + // Può essere spedito? - + if (CanBeShipped()) { // mostra form di spedizione } - + if (CanBeBuyOnline()) { // mostra form di acquisto Online } } - + function completeOrder() { $q.dialog({ - message: 'Confermare l\'ordine di acquisto di ' + myTotalQty() + ' prodotti ?', + message: t('ecomm.conferma_acq', { qty: myTotalQty() }), ok: { label: t('dialog.yes'), push: true @@ -144,13 +144,13 @@ export default defineComponent({ cancel: { label: t('dialog.cancel') }, - title: 'Ordine' + title: t('ecomm.order') }).onOk(async () => { const status = shared_consts.OrderStatus.CHECKOUT_SENT statusnow.value = await productStore.UpdateStatusCart({ cart_id: mycart.value._id, status }) - + if (statusnow.value === status) { - tools.showPositiveNotif($q, 'Ordine Confermato') + tools.showPositiveNotif($q, t('ecomm.ord_confirmed')) setTimeout(() => { $router.push('/orderinfo') }, 2000) @@ -159,7 +159,7 @@ export default defineComponent({ // change_field('status') }) } - + onMounted(mounted) diff --git a/src/views/ecommerce/checkOut/checkOut.vue b/src/views/ecommerce/checkOut/checkOut.vue index fedbec77..2b679649 100755 --- a/src/views/ecommerce/checkOut/checkOut.vue +++ b/src/views/ecommerce/checkOut/checkOut.vue @@ -4,39 +4,53 @@
-
- - +
+
- Totale: € {{ (myTotalPrice()) }} + Totale: + € {{ myTotalPrice() }}
- + -
+
- + -