newfreeplanet_OLD/src/components/COrdersCart/COrdersCart.vue

<template>
  <q-spinner v-if="!endload" color="primary" size="3em" :thickness="2" />
  <div v-if="endload && recOrderCart.numorder > 0">
    <div v-if="recOrderCart" class="panel">
      <q-toggle
        v-if="tools.isManager()"
        v-model="editOn"
        class="absolute-top-left"
        color="green"
        icon="fas fa-pencil-alt"
        dense
      >
      </q-toggle>
      <div class="numorder">
        {{ t('orderscart.numero_ordine') }}: {{ recOrderCart.numorder }}
      </div>
      <div class="user">
        {{ t('orderscart.nome') }}:
        {{
          recOrderCart.user
            ? tools.getNomeUtenteByRecUser(recOrderCart.user)
            : ''
        }}
      </div>
      <div
        v-if="recOrderCart.items && recOrderCart.items.length > 0"
        class="container"
      >
        <div
          class="q-pa-sm col items-start q-gutter-xs"
          v-for="(itemorder, index) in recOrderCart.items"
          :key="index"
        >
          <CSingleCart
            :order="itemorder.order"
            :showall="false"
            :idOrdersCart="recOrderCart._id"
            :editmode="editOn"
            :nomodif="true"
            @update="ordersUpdated()"
          />
        </div>
      </div>
      <q-separator></q-separator>

      <div
        v-if="myTotalPriceCalc() !== myTotalPrice() && myTotalPriceCalc() !== ''"
        class="col-6 q-mr-sm"
        style="text-align: right"
      >
        <span class="text-grey q-mr-xs">{{ t('ecomm.calcolato') }}:</span>
        <span class="text-subtitle1 q-mr-sm"
          >€ {{ myTotalPriceCalc() }}</span
        >
      </div>
      <div class="col-6 q-mr-sm" style="text-align: right">
        <q-input
          v-if="editOn && getNumItems() > 0"
          v-model="allTotalPrice"
          :label="t('ecomm.totalPrice')"
          filled
          dense
          style="width: 150px;"
          debounce="1000"
          @change="changeTotalPrice"
        >
        </q-input>
        <span class="text-grey q-mr-xs">{{ t('ecomm.totale') }}:</span>
        <span class="text-subtitle1 q-mr-sm">€ {{ myTotalPrice() }}</span>
      </div>
      <div>
        <q-btn
          v-if="editOn"
          outline
          rounded
          dense
          color="green"
          icon="fas fa-redo"
          :label="t('orderscart.update_TotalPrice')"
          @click="updateTotalPrice"
        >
        </q-btn>
      </div>

      <q-input
        v-if="editOn && tools.isManager() && getNumItems() > 0"
        v-model="myrec.note"
        style="max-width: 400px"
        :label="t('ecomm.note')"
        filled
        dense
        debounce="1000"
        autogrow
        @update:model-value="change_field('note')"
      >
      </q-input>
      <q-field v-else> Note: {{ myrec.note }} </q-field>
      
      <q-input
        v-if="editOn && tools.isManager() && getNumItems() > 0"
        v-model="myrec.note_per_gestore"
        style="max-width: 400px"
        :label="t('ecomm.note_per_gestore')"
        filled
        dense
        debounce="1000"
        autogrow
        @update:model-value="change_field('note_per_gestore')"
      >
      </q-input>
      <q-input
        v-if="editOn && tools.isAdmin() && getNumItems() > 0"
        v-model="myrec.note_per_admin"
        style="max-width: 400px"
        :label="t('ecomm.note_per_admin')"
        filled
        dense
        debounce="1000"
        autogrow
        @update:model-value="change_field('note_per_admin')"
      >
      </q-input>

      <br />
    </div>
  </div>
  <div v-else style="text-align: center" class="text-grey">
    {{ t('ecomm.carrello_vuoto') }}
  </div>

  <br />
  <div
    v-if="tools.isManager()"
    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>
</template>

<script lang="ts" src="./COrdersCart.ts">
</script>

<style lang="scss" scoped>
@import './COrdersCart';
</style>