import { ref, onMounted, onBeforeMount, PropType, reactive, watch } from 'vue';
import { CCardState } from '../CCardState';

import { computed, defineComponent } from 'vue';
import { useGlobalStore } from '@store/globalStore';
import { useProducts } from '@store/Products';
import { CCopyBtn } from '@src/components/CCopyBtn';
import { CSingleCart } from '@src/components/CSingleCart';
import { CTitleBanner } from '@src/components/CTitleBanner';

import { useI18n } from 'vue-i18n';

import MixinUsers from '../../mixins/mixin-users';

export default defineComponent({
  name: 'CMyCart',
  props: {},
  components: { CTitleBanner, CCardState, CCopyBtn, CSingleCart },

  setup() {
    const globalStore = useGlobalStore();
    const productStore = useProducts();
    const { t } = useI18n();

    const { getnumItemsCart } = MixinUsers();

    const myCart = computed(() => productStore.cart);
    const myTotalPrice = computed(() => {
      if (productStore.cart) {
        return productStore.cart.totalPrice.toFixed(2);
      } else {
        return 0;
      }
    });

    const totalPriceIntero = computed((): string => {
      if (productStore.cart && productStore.cart.totalPriceIntero) {
        return productStore.cart.totalPriceIntero.toFixed(2);
      } else {
        return '0';
      }
    });

    const ordersCart = computed(() => {
      if (!!productStore.cart) {
        return productStore.cart.items;
      } else {
        return null;
      }
    });

    const numOrders = computed(() => {
      if (!!productStore.cart && productStore.cart.items) {
        return productStore.cart.items.length;
      } else {
        return 0;
      }
    });

    function closecart() {
      globalStore.rightCartOpen = false;
    }

    function mounted() {
      productStore.loadOrders();
    }

    function existsOrders() {
      return productStore.getNumOrders() > 0;
    }

    onMounted(mounted);

    return {
      myCart,
      myTotalPrice,
      totalPriceIntero,
      ordersCart,
      numOrders,
      closecart,
      getnumItemsCart,
      existsOrders,
      globalStore,
      t,
    };
  },
});