aggiorna

src/views/ecommerce/cash/cash.scss

@@ -0,0 +1,14 @@
+$heightBtn: 100%;
+
+.card .product-image {
+  height: 300px;
+}
+
+.container{
+  margin-top: 4px;
+  margin-bottom: 4px;
+}
+
+.prod_trov{
+  font-style: italic;
+}

src/views/ecommerce/cash/cash.ts

@@ -0,0 +1,116 @@
+import { defineComponent, onMounted, ref, watch, computed } from 'vue'
+import { tools } from '@store/Modules/tools'
+import { useUserStore } from '@store/UserStore'
+import { useRouter } from 'vue-router'
+import { useGlobalStore } from '@store/globalStore'
+import { useProducts } from '@store/Products'
+import { useI18n } from '@/boot/i18n'
+import { toolsext } from '@store/Modules/toolsext'
+import { useQuasar } from 'quasar'
+import { costanti } from '@costanti'
+
+import { shared_consts } from '@/common/shared_vuejs'
+import { CProductCard } from '@src/components/CProductCard'
+import { IProduct } from '@src/model'
+
+
+export default defineComponent({
+  name: 'cash',
+  components: { CProductCard },
+  props: {},
+  setup() {
+    const userStore = useUserStore()
+    const globalStore = useGlobalStore()
+    const productStore = useProducts()
+    const $router = useRouter()
+    const $q = useQuasar()
+    const { t } = useI18n()
+
+    const search = ref('')
+
+    const cosa = ref(0)
+    const cat = ref('')
+    const loadpage = ref(false)
+
+    watch(() => cosa.value, (newval, oldval) => {
+      tools.setCookie(tools.COOK_COSA_PRODOTTI, cosa.value.toString())
+    })
+
+    const getArrProducts = computed(() => {
+      let arrprod = productStore.getProducts(cosa.value)
+      let catstr = cat.value;
+      let lowerSearchText = search.value.toLowerCase().trim();
+      if ((!lowerSearchText || (lowerSearchText && lowerSearchText.length < 2)) && !catstr) {
+        return arrprod
+      }
+
+      return arrprod.filter((product: IProduct) => {
+        let lowerName = product.productInfo.name!.toLowerCase();
+        let hasCategoria = !catstr || (catstr && product.productInfo.idCatProds?.includes(catstr));
+
+        // Use a regular expression to match whole words
+        let codeMatch = new RegExp(`\\b${lowerSearchText}\\b`, 'i');
+        let nameMatch = new RegExp(`\\b${lowerSearchText}`, 'i');
+
+        // Check if any word in lowerName starts with lowerSearchText
+        let anyWordStartsWithSearch = lowerName.split(/\s+/).some(word => nameMatch.test(word));
+
+        return (codeMatch.test(product.productInfo.code!) || anyWordStartsWithSearch) && hasCategoria;
+      });
+    })
+
+    /*function getProducts() {
+      let arrprod = productStore.getProducts(cosa.value)
+      if (!search.value) {
+        return arrprod
+      }
+    
+      let lowerSearchText = search.value.toLowerCase();
+      let catstr = cat.value;
+    
+      return arrprod.filter((product: IProduct) => {
+        let lowerName = product.productInfo.name!.toLowerCase();
+        const hasCategoria = !catstr || (catstr && product.productInfo.idCatProds?.includes(catstr));
+        return (product.productInfo.code!.includes(search.value) || lowerName.includes(lowerSearchText)) && hasCategoria
+      });
+    }*/
+
+    async function mounted() {
+      loadpage.value = false
+      await productStore.loadProducts()
+      cosa.value = tools.getCookie(tools.COOK_COSA_PRODOTTI, shared_consts.PROD.BOTTEGA, true)
+      // Inizializza
+      loadpage.value = true
+    }
+
+    function getCatProds() {
+      let arrcat = productStore.getCatProds()
+      let riscat: any = [{ label: 'Tutti', value: '', icon: undefined, color: undefined }]
+      for (const rec of arrcat) {
+        riscat.push({ label: rec.name, value: rec._id, icon: rec.icon, color: rec.color })
+      }
+
+      return riscat
+    }
+
+
+    onMounted(mounted)
+
+    return {
+      userStore,
+      costanti,
+      tools,
+      toolsext,
+      getArrProducts,
+      search,
+      cosa,
+      shared_consts,
+      getCatProds,
+      cat,
+      productStore,
+      t,
+      loadpage,
+    }
+  }
+})
+

src/views/ecommerce/cash/cash.vue

@@ -0,0 +1,116 @@
+<template>
+  <q-page>
+    <div class="text-center">
+      <q-spinner v-if="!loadpage" color="primary" size="3em" :thickness="2" />
+    </div>
+    <div v-if="loadpage" class="panel">
+      <div>
+        <div class="text-center">
+          <q-btn-toggle
+            v-model="cosa"
+            push
+            :size="tools.isMobile() ? '0.75rem' : '1rem'"
+            rounded
+            glossy
+            dense
+            toggle-color="purple"
+            :options="[
+              { value: shared_consts.PROD.BOTTEGA, slot: 'bottega' },
+              { value: shared_consts.PROD.GAS, slot: 'gas' },
+            ]"
+          >
+            <template v-slot:gas>
+              <div class="row items-center no-wrap">
+                <div class="text-center">
+                  {{ t('gas.ordina_sul_gas') }}
+                  <br />
+                  {{
+                    t('gas.x_prodotti_gas', {
+                      qta: productStore.getNumQtaGas(),
+                    })
+                  }}
+                </div>
+                <q-icon right name="fas fa-user-friends" />
+              </div>
+            </template>
+
+            <template v-slot:bottega>
+              <div class="row items-center no-wrap">
+                <div class="text-center">
+                  {{ t('gas.bottega') }}
+                  <br />
+                  {{
+                    t('gas.x_prodotti_bottega', {
+                      qta: productStore.getNumQtaBottega(),
+                    })
+                  }}
+                </div>
+                <q-icon right name="fas fa-store" />
+              </div>
+            </template>
+          </q-btn-toggle>
+        </div>
+      </div>
+      <div class="container">
+        <div
+          class="column text-center q-mx-auto q-py-sm q-mb-sm"
+          style="width: 350px; max-width: 100%"
+        >
+          <q-input
+            filled
+            stack-label
+            :dense="tools.isMobile() ? true : false"
+            :label="t('ecomm.code_o_text_search')"
+            v-model="search"
+            debounce="500"
+            class="q-ml-md"
+          >
+            <template v-slot:append>
+              <q-icon name="search" />
+            </template>
+          </q-input>
+        </div>
+        <div class="row q-gutter-xs justify-center q-mx-auto">
+          <div v-for="(reccat, index) in getCatProds()" :key="index">
+            <q-btn
+              :push="cat === reccat.value"
+              dense
+              :size="tools.isMobile() ? '0.70rem' : '1rem'"
+              :icon="reccat.icon ? reccat.icon : undefined"
+              :color="cat === reccat.value ? 'primary' : undefined"
+              :text-color="cat === reccat.value ? 'white' : 'black'"
+              rounded
+              :label="reccat.label"
+              @click="cat = reccat.value"
+            >
+            </q-btn>
+          </div>
+        </div>
+        <div class="text-center q-py-sm prod_trov">
+          {{
+            t('ecomm.prodotti_trovati', {
+              qta: getArrProducts.length,
+              qtatot: productStore.getNumProdTot(),
+            })
+          }}{{}}
+        </div>
+        <div class="row justify-around">
+          <div
+            class="q-pa-xs row items-start"
+            v-for="(product, index) in getArrProducts"
+            :key="index"
+          >
+            <CProductCard :id="product._id" :complete="false" :cosa="cosa" />
+          </div>
+        </div>
+      </div>
+    </div>
+  </q-page>
+</template>
+
+<script lang="ts" src="./cash.ts">
+</script>
+
+<style lang="scss" scoped>
+@import './cash';
+</style>

src/views/ecommerce/cash/index.ts

@@ -0,0 +1 @@
+export {default as ProductsList} from './cash.vue'

src/views/ecommerce/checkOut/checkOut.ts

@@ -13,209 +13,19 @@ import { ICart, IOrder, IOrderCart, IProduct, IShareWithUs } from '@src/model/Pr
 import { shared_consts } from '@src/common/shared_vuejs'
 
 import { CSingleCart } from '../../../components/CSingleCart'
+import { CCart } from '../../../components/CCart'
 import { CTitleBanner } from '@components'
 
 export default defineComponent({
   name: 'checkOut',
-  components: { CSingleCart, CTitleBanner },
+  components: { CSingleCart, CTitleBanner, CCart },
   props: {},
   setup() {
     const userStore = useUserStore()
-    const globalStore = useGlobalStore()
-    const productStore = useProducts()
-    const $router = useRouter()
-    const $q = useQuasar()
     const { t } = useI18n();
 
-    const mycart = ref(<ICart>{})
-    const myrec = ref(<any[string]>[])
-    const oldrec = ref(<any[string]>[])
-    const note = ref('')
-    const endload = ref(false)
-    const recOrderCart = ref(<IOrderCart>{})
-
-    const search = ref('')
-
-    const statusnow = computed(() => (): number => {
-      if (recOrderCart.value) {
-        return recOrderCart.value.status
-      }
-      return 0
-    })
-
     function mounted() {
-      // Inizializza
-      load()
-    }
-
-    function getItemsCart() {
-      const cart = productStore.getCart()
-      return cart.items || null
-    }
-
-    function getNumItems(): number {
-      const cart = productStore.getCart()
-      if (!!cart.items)
-        return cart.items.length || 0
-      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)
-      } else {
-        return '0'
-      }
-    }
-
-    function myTotalQty(): number {
-      if (productStore.cart) {
-        return productStore.cart.totalQty!
-      } else {
-        return 0
-      }
-    }
-
-    async function load() {
-      mycart.value = getCart()
-      myrec.value = Object.keys(mycart)
-      oldrec.value = myrec.value
-      note.value = mycart.value.note!
-
-      let options = {};
-
-      if (mycart.value) {
-        recOrderCart.value = await productStore.CreateOrdersCart({ cart_id: mycart.value._id, status: 0, note: note.value })
-      }
-
-      console.log('myrec', myrec.value)
-
-      endload.value = true
-    }
-
-    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: t('ecomm.conferma_acq', { qty: myTotalQty() }),
-        ok: {
-          label: t('dialog.yes'),
-          push: true
-        },
-        cancel: {
-          label: t('dialog.cancel')
-        },
-        title: t('ecomm.order')
-      }).onOk(async () => {
-        const status = shared_consts.OrderStatus.CHECKOUT_SENT
-
-        recOrderCart.value = await productStore.CreateOrdersCart({ cart_id: mycart.value._id, status, note: note.value })
-
-        // statusnow.value = myordercart ? myordercart.status : 0
-
-        if (recOrderCart.value.status === status) {
-          tools.showPositiveNotif($q, t('ecomm.ord_confirmed'))
-          setTimeout(() => {
-            $router.push('/orderinfo')
-          }, 2000)
-        } else {
-          tools.showNegativeNotif($q, t('ecomm.ord_not_confirmed'))
-        }
-        // change_field('status')
-        // change_field('status')
-      })
-    }
-
-    function getActualIdStorehouse(myprod: IProduct) {
-      // Ottieni il negozio attualmente selezionato:
-      // Se ce n'è solo 1 allora prendi quello !
-      if (myprod.storehouses.length === 1) {
-        return myprod.storehouses[0]._id
-      } else {
-        // Ottieni il negozio attualmente scelto !
-        return ''
-      }
-    }
-
-    function getActualGasordine(myprod: IProduct) {
-      // Ottieni il negozio attualmente selezionato:
-      // Se ce n'è solo 1 allora prendi quello !
-      if (myprod.gasordines.length === 1) {
-        return myprod.gasordines[0]._id
-      } else {
-        // Ottieni il gasordine attualmente scelto !
-        return ''
-      }
-    }
-
-    async function insertArticolo() {
-      let lowerSearchText = search.value.trim();
-
-      const myprod = productStore.getProductByCode(lowerSearchText);
-      if (myprod && myprod.active) {
-        let myorder: IOrder = { quantity: 1, quantitypreordered: 0, 
-          TotalPriceProduct: 0, price: 0,
-          idStorehouse: getActualIdStorehouse(myprod),
-          idGasordine: getActualGasordine(myprod),
-         }
-          await productStore.addtoCartBase({ $q, t, id: myprod._id, order: myorder, addqty: true })
-        search.value = ''
-        load()
-      }
+      // Inizializza      
     }
 
     onMounted(mounted)
@@ -225,21 +35,8 @@ export default defineComponent({
       costanti,
       tools,
       toolsext,
-      completeOrder,
-      getNumItems,
-      myTotalPrice,
-      getItemsCart,
-      getNote,
-      change_field,
-      note,
-      statusnow,
       shared_consts,
-      myTotalQty,
-      recOrderCart,
-      mycart,
-      endload,
-      search,
-      insertArticolo,
+      t,
     }
   }
 })

src/views/ecommerce/checkOut/checkOut.vue

@@ -1,82 +1,8 @@
 <template>
   <q-page>
-    <CTitleBanner :title="$t('ecomm.carrello')"></CTitleBanner>
-    <q-spinner v-if="!endload" color="primary" size="3em" :thickness="2" />
-    <div v-if="endload">
-      <div v-if="recOrderCart" class="panel">
-        <div>
-          <div class="container">
-            <div
-              class="q-pa-sm col items-start q-gutter-xs"
-              v-for="(itemorder, index) in getItemsCart()"
-              :key="index"
-            >
-              <CSingleCart :order="itemorder.order" :showall="true" />
-            </div>
-          </div>
-          <q-separator></q-separator>
-          <div class="col-6 q-mr-sm" style="text-align: right">
-            <span class="text-grey q-mr-xs">{{ $t('ecomm.totale') }}:</span>
-            <span class="text-subtitle1 q-mr-sm">€ {{ myTotalPrice() }}</span>
-          </div>
-
-          <q-input
-            v-if="getNumItems() > 0"
-            v-model="note"
-            style="max-width: 400px"
-            :label="$t('ecomm.note')"
-            filled
-            dense
-            debounce="1000"
-            autogrow
-            @input="change_field('note')"
-          >
-          </q-input>
-
-          <br />
-        </div>
-
-        <div class="text-center">
-          <q-btn
-            v-if="
-              recOrderCart &&
-              recOrderCart.status < shared_consts.OrderStatus.CHECKOUT_SENT
-            "
-            rounded
-            icon="fas fa-shopping-cart"
-            color="green"
-            :label="$t('ecomm.completa_ord')"
-            class="q-mb-sm"
-            :disabled="myTotalQty() < 1"
-            @click="completeOrder()"
-          ></q-btn>
-        </div>
-      </div>
-      <div v-else style="text-align: center" class="text-grey">
-        {{ $t('ecomm.carrello_vuoto') }}
-      </div>
-
-      <br >
-      <div
-          class="q-gutter-y-md column text-center q-mx-auto"
-          style="width: 350px; max-width: 100%"
-        >
-          <q-input
-            filled
-            stack-label
-            dense
-            :label="$t('ecomm.code_add_to_cart')"
-            v-model="search"
-            class="q-ml-md"
-            @keyup.enter="insertArticolo()"
-          >
-            <template v-slot:append>
-              <q-icon class="insert" name="fas fa-shopping-cart" color="green" @click="insertArticolo()"/>
-            </template>
-          </q-input>
-        </div>
-
-    </div>
+    <CTitleBanner :title="t('ecomm.carrello')"></CTitleBanner>
+    <CCart>
+    </CCart>
   </q-page>
 </template>
 

src/views/ecommerce/orderInfo/orderInfo.ts

@@ -48,6 +48,14 @@ export default defineComponent({
     const statusnow = ref(0)
     const arrnumstatus = ref(<any[]>[])
     const columns = ref(<any>[
+      {
+        name: 'apri',
+        align: 'center',
+        required: false,
+        label: 'Apri',
+        field: 'apri',
+        sortable: false
+      },
       {
         name: 'numorder',
         required: true,
@@ -89,6 +97,14 @@ export default defineComponent({
     ])
 
     const columns_Admin = ref(<any>[
+      {
+        name: 'apri',
+        align: 'center',
+        required: false,
+        label: 'Apri',
+        field: 'apri',
+        sortable: false
+      },
       {
         name: 'numorder',
         required: true,

src/views/ecommerce/orderInfo/orderInfo.vue

@@ -4,76 +4,58 @@
     <q-spinner v-if="!endload" color="primary" size="3em" :thickness="2" />
 
     <div class="q-gutter-md text-center">
-          <q-btn-toggle
-            v-model="cosa"
-            push
-            rounded
-            glossy
-            toggle-color="purple"
-            :options="[
-              { value: shared_consts.PROD.TUTTI, slot: 'tutti' },
-              { value: shared_consts.PROD.BOTTEGA, slot: 'bottega' },
-              { value: shared_consts.PROD.GAS, slot: 'gas' },
-            ]"
-          >
-            <template v-slot:tutti>
-              <div class="row items-center no-wrap">
-                <div class="text-center">
-                  {{ t('gas.tutti') }}
-                  <br />
-                  {{ t('gas.x_prodotti_gas', { qta: productStore.getNumQtaGas()+productStore.getNumQtaBottega() }) }}
-                </div>
-                <q-icon right name="fas fa-user-friends" />
-              </div>
-            </template>
-            <template v-slot:gas>
-              <div class="row items-center no-wrap">
-                <div class="text-center">
-                  {{ t('gas.ordina_sul_gas') }}
-                  <br />
-                  {{ t('gas.x_prodotti_gas', { qta: productStore.getNumQtaGas() }) }}
-                </div>
-                <q-icon right name="fas fa-user-friends" />
-              </div>
-            </template>
+      <q-btn-toggle v-model="cosa" push rounded glossy toggle-color="purple" :options="[
+        { value: shared_consts.PROD.TUTTI, slot: 'tutti' },
+        { value: shared_consts.PROD.BOTTEGA, slot: 'bottega' },
+        { value: shared_consts.PROD.GAS, slot: 'gas' },
+      ]">
+        <template v-slot:tutti>
+          <div class="row items-center no-wrap">
+            <div class="text-center">
+              {{ t('gas.tutti') }}
+              <br />
+              {{ t('gas.x_prodotti_gas', { qta: productStore.getNumQtaGas() + productStore.getNumQtaBottega() }) }}
+            </div>
+            <q-icon right name="fas fa-user-friends" />
+          </div>
+        </template>
+        <template v-slot:gas>
+          <div class="row items-center no-wrap">
+            <div class="text-center">
+              {{ t('gas.ordina_sul_gas') }}
+              <br />
+              {{ t('gas.x_prodotti_gas', { qta: productStore.getNumQtaGas() }) }}
+            </div>
+            <q-icon right name="fas fa-user-friends" />
+          </div>
+        </template>
 
-            <template v-slot:bottega>
-              <div class="row items-center no-wrap">
-                <div class="text-center">
-                  {{ t('gas.bottega') }}
-                  <br />
-                  {{
-                    t('gas.x_prodotti_bottega', { qta: productStore.getNumQtaBottega() })
-                  }}
-                </div>
-                <q-icon right name="fas fa-store" />
-              </div>
-            </template>
-          </q-btn-toggle>
-        </div>
-˚
+        <template v-slot:bottega>
+          <div class="row items-center no-wrap">
+            <div class="text-center">
+              {{ t('gas.bottega') }}
+              <br />
+              {{
+                t('gas.x_prodotti_bottega', { qta: productStore.getNumQtaBottega() })
+              }}
+            </div>
+            <q-icon right name="fas fa-store" />
+          </div>
+        </template>
+      </q-btn-toggle>
+    </div>
+    ˚
     <div v-if="endload" class="panel">
       <q-tabs v-model="taborders" inline-label class="text-blue">
         <span v-for="(stat, index) of shared_consts.OrderStat" :key="index">
-          <q-tab
-            v-if="arrnumstatus[stat.value] > 0"
-            :class="stat.color"
-            :name="stat.value"
-            :icon="stat.icon"
-            :label="`(` + arrnumstatus[stat.value] + `) ` + stat.label"
-          />
+          <q-tab v-if="arrnumstatus[stat.value] > 0" :class="stat.color" :name="stat.value" :icon="stat.icon"
+            :label="`(` + arrnumstatus[stat.value] + `) ` + stat.label" />
         </span>
       </q-tabs>
 
       <div class="q-pa-sm">
-        <q-table
-          :grid="$q.screen.lt.sm"
-          :hide-header="$q.screen.lt.sm"
-          :columns="columns"
-          row-key="numorder"
-          :pagination="initialPagination"
-          :rows="getOrdersCartWithTotals()"
-        >
+        <q-table :grid="$q.screen.lt.sm" :hide-header="$q.screen.lt.sm" :columns="columns" row-key="numorder"
+          :pagination="initialPagination" :rows="getOrdersCartWithTotals()">
           <template v-if="$q.screen.lt.sm" v-slot:item="props">
             <div class="q-pa-xs col-xs-12 col-sm-6 col-md-4">
               <q-card class="my-card-shadow yes_shadow">
@@ -83,70 +65,41 @@
                       <q-item-label>{{ col.label }}</q-item-label>
                     </q-item-section>
                     <q-item-section side>
-                      <q-item-label v-if="col.name === 'created_at'" caption
-                        >{{ tools.getstrDateTime(col.value) }}
+                      <q-item-label v-if="col.name === 'created_at'" caption>{{ tools.getstrDateTime(col.value) }}
                       </q-item-label>
-                      <q-item-label
-                        v-else-if="col.name === 'nameSurname'"
-                        caption
-                      >
+                      <q-item-label v-else-if="col.name === 'nameSurname'" caption>
                         <span v-if="props.row.user">
-                          <span
-                            :class="
-                              props.row.user.name !== 'TOTALI' ? '' : 'totali'
-                            "
-                            >{{ tools.getNomeUtenteByRecUser(props.row.user) }}
-                          </span></span
-                        >
+                          <span :class="props.row.user.name !== 'TOTALI' ? '' : 'totali'
+                            ">{{ tools.getNomeUtenteByRecUser(props.row.user) }}
+                          </span></span>
                       </q-item-label>
                       <q-item-label v-else-if="col.name === 'items'" caption>
-                        <div
-                          v-for="(item, index) of props.row.items"
-                          :key="index"
-                        >
-                          <div
-                            v-if="!!item && item.order && item.order.product && item.order.product.productInfo"
-                          >
+                        <div v-for="(item, index) of props.row.items" :key="index">
+                          <div v-if="!!item && item.order && item.order.product && item.order.product.productInfo">
                             {{ item.order.product.productInfo.name }} ({{
                               productStore.getQuantityByOrder(t, item.order)
                             }})<br />
                           </div>
                         </div>
                       </q-item-label>
-                      <q-item-label
-                        v-else-if="col.name === 'totalPrice'"
-                        caption
-                      >
+                      <q-item-label v-else-if="col.name === 'totalPrice'" caption>
                         {{ props.row.totalPrice }} €
                       </q-item-label>
                       <q-item-label v-else-if="col.name === 'status'" caption>
                         {{ shared_consts.getStatusStr(props.row.status) }}
                       </q-item-label>
                       <q-item-label v-else-if="col.name === 'comandi'" caption>
-                        <div
-                          v-if="
-                            tools.isManager() &&
-                            props.row.user.name !== 'TOTALI'
-                          "
-                          class="q-pa-sm"
-                        >
+                        <div v-if="tools.isManager() &&
+                          props.row.user.name !== 'TOTALI'
+                          " class="q-pa-sm">
                           <q-btn-dropdown rounded dense label="Azioni">
                             <q-list class="text-primary">
-                              <q-item
-                                v-for="(
+                              <q-item v-for="(
                                   cmd, index
-                                ) of shared_consts.OrderCmdStr"
-                                :key="index"
-                                clickable
-                                v-close-popup
-                                @click="clickFunz(props.row, cmd.value)"
-                              >
+                                ) of shared_consts.OrderCmdStr" :key="index" clickable v-close-popup
+                                @click="clickFunz(props.row, cmd.value)">
                                 <q-item-section avatar>
-                                  <q-avatar
-                                    :icon="cmd.icon"
-                                    :color="cmd.color"
-                                    text-color="white"
-                                  />
+                                  <q-avatar :icon="cmd.icon" :color="cmd.color" text-color="white" />
                                 </q-item-section>
                                 <q-item-section>
                                   <q-item-label>{{ cmd.label }}</q-item-label>
@@ -156,6 +109,13 @@
                           </q-btn-dropdown>
                         </div>
                       </q-item-label>
+                      <q-item-label v-else-if="col.name === 'apri'" caption>
+                        <div class="q-pa-sm">
+                          <q-btn size="sm" dense icon="fas fa-filter" :label="t('ecomm.apriordine')"
+                            :to="`/orderscart/{$idOrdersCart}`"></q-btn>
+
+                        </div>
+                      </q-item-label>
                       <q-item-label v-else caption>{{
                         col.value
                       }}</q-item-label>
@@ -167,24 +127,31 @@
           </template>
           <template v-else v-slot:body="props">
             <q-tr :props="props">
+              <q-td key="apri" :props="props">
+                <div class="q-pa-sm">
+                  <q-btn 
+                  color="primary"
+                  size="sm" dense icon="far fa-file-alt" :label="t('ecomm.apriordine')"
+                    :to="`/orderscart/${props.row._id}`"></q-btn>
+
+                </div>
+
+              </q-td>
               <q-td key="numorder" :props="props">
                 <span v-if="props.row.numorder">
-                  &nbsp; n. {{ props.row.numorder }}</span
-                >
+                  &nbsp; n. {{ props.row.numorder }}</span>
               </q-td>
               <q-td key="nameSurname" :props="props">
                 <span v-if="props.row.user">
-                  <span
-                    :class="props.row.user.name !== 'TOTALI' ? '' : 'totali'"
-                    >{{ tools.getNomeUtenteByRecUser(props.row.user) }}
-                  </span></span
-                >
+                  <span :class="props.row.user.name !== 'TOTALI' ? '' : 'totali'">{{
+                    tools.getNomeUtenteByRecUser(props.row.user) }}
+                  </span></span>
               </q-td>
               <q-td key="created_at" :props="props">
                 {{ tools.getstrDateTime(props.row.created_at) }}
                 <span v-if="taborders === shared_consts.OrderStat.COMPLETATI">
                   <br />Consegnato il:<br />{{
-                    tools.getstrDateTime(props.row.date_consegnato)
+                  tools.getstrDateTime(props.row.date_consegnato)
                   }}
                 </span>
               </q-td>
@@ -192,7 +159,7 @@
                 <div v-for="(item, index) of props.row.items" :key="index">
                   <div v-if="!!item.order && item.order.product && item.order.product.productInfo">
                     {{ item.order.product.productInfo.name }} ({{
-                      productStore.getQuantityByOrder($t, item.order)
+                    productStore.getQuantityByOrder($t, item.order)
                     }})<br />
                   </div>
                 </div>
@@ -201,14 +168,12 @@
                 </div>
               </q-td>
               <q-td key="totalPrice" :props="props">
-                <span :class="props.row.user.name !== 'TOTALI' ? '' : 'totali'"
-                  >{{ props.row.totalPrice }} €</span
-                >
+                <span :class="props.row.user.name !== 'TOTALI' ? '' : 'totali'">{{ props.row.totalPrice }} €</span>
               </q-td>
               <q-td key="status" :props="props">
                 <span :class="props.row.status">{{
                   shared_consts.getStatusStr(props.row.status)
-                }}</span>
+                  }}</span>
                 <br />
                 <div v-if="props.row.confermato" class="ordstat">
                   {{ tools.getstrDateTime(props.row.date_confermato) }}:
@@ -232,25 +197,13 @@
                 </div>
               </q-td>
               <q-td key="comandi" :props="props">
-                <div
-                  v-if="tools.isManager() && props.row.user.name !== 'TOTALI'"
-                  class="q-pa-sm"
-                >
+                <div v-if="tools.isManager() && props.row.user.name !== 'TOTALI'" class="q-pa-sm">
                   <q-btn-dropdown rounded dense label="Azioni">
                     <q-list class="text-primary">
-                      <q-item
-                        v-for="(cmd, index) of shared_consts.OrderCmdStr"
-                        :key="index"
-                        clickable
-                        v-close-popup
-                        @click="clickFunz(props.row, cmd.value)"
-                      >
+                      <q-item v-for="(cmd, index) of shared_consts.OrderCmdStr" :key="index" clickable v-close-popup
+                        @click="clickFunz(props.row, cmd.value)">
                         <q-item-section avatar>
-                          <q-avatar
-                            :icon="cmd.icon"
-                            :color="cmd.color"
-                            text-color="white"
-                          />
+                          <q-avatar :icon="cmd.icon" :color="cmd.color" text-color="white" />
                         </q-item-section>
                         <q-item-section>
                           <q-item-label>{{ cmd.label }}</q-item-label>

src/views/ecommerce/orderscart/index.ts

@@ -0,0 +1 @@
+export {default as orderscart} from './orderscart.vue'

src/views/ecommerce/orderscart/orderscart.scss

@@ -0,0 +1,5 @@
+$heightBtn: 100%;
+
+.card .product-image {
+  height: 300px;
+}

src/views/ecommerce/orderscart/orderscart.ts

@@ -0,0 +1,55 @@
+import { defineComponent, onMounted, ref } from 'vue'
+import { tools } from '@store/Modules/tools'
+import { useUserStore } from '@store/UserStore'
+import { useRouter } from 'vue-router'
+import { useRoute } from 'vue-router'
+import { useGlobalStore } from '@store/globalStore'
+import { useProducts } from '@store/Products'
+import { useI18n } from '@/boot/i18n'
+import { toolsext } from '@store/Modules/toolsext'
+import { useQuasar } from 'quasar'
+import { costanti } from '@costanti'
+import { shared_consts } from '@src/common/shared_vuejs'
+// import MixinBase from '@src/mixins/mixin-base'
+import { CProductCard } from '@src/components/CProductCard'
+import { COrdersCart } from '@src/components/COrdersCart'
+
+
+export default defineComponent({
+  name: 'orderscart',
+  components: { CProductCard, COrdersCart },
+  props: {},
+  setup() {
+    const userStore = useUserStore()
+    const globalStore = useGlobalStore()
+    const productStore = useProducts()
+    const $router = useRouter()
+    const $route = useRoute()
+    const $q = useQuasar()
+    const { t } = useI18n();
+    const idOrdersCart = ref('')
+    const cosa = ref(0)
+
+    // const { setValDb, getValDb } = MixinBase()
+
+    function mounted() {
+      // Inizializza
+      if (!!$route.params.idorderscart) {
+        idOrdersCart.value = $route.params.idorderscart.toString()
+      }
+  
+    }
+
+    onMounted(mounted)
+
+    return {
+      userStore,
+      costanti,
+      tools,
+      toolsext,
+      shared_consts,
+      idOrdersCart,
+      cosa,
+    }
+  }
+})

src/views/ecommerce/orderscart/orderscart.vue

@@ -0,0 +1,18 @@
+<template>
+  <q-page class="q-pa-md">
+    <div class="panel">
+      <div class="container">
+        <div v-if="!!idOrdersCart" class="row justify-center">
+          <COrdersCart :iscash="false" :idOrdersCart="idOrdersCart"/>
+        </div>
+      </div>
+    </div>
+  </q-page>
+</template>
+
+<script lang="ts" src="./orderscart.ts">
+</script>
+
+<style lang="scss" scoped>
+@import './orderscart';
+</style>

src/views/ecommerce/productsList/productsList.ts

@@ -22,7 +22,7 @@ export default defineComponent({
     const userStore = useUserStore()
     const globalStore = useGlobalStore()
     const productStore = useProducts()
-    const $router = useRouter()
+    const router = useRouter()
     const $q = useQuasar()
     const { t } = useI18n()