import type {
  PropType} from 'vue';
import {
  computed,
  defineComponent, onBeforeMount, onBeforeUnmount, onMounted, ref, toRef, toRefs, watch,
} from 'vue'

import { tools } from '@tools'
import type { IOptCatalogo, IMyScheda, IProduct, IText } from '@src/model';
import { ISchedaSingola } from '@src/model'

import { useProducts } from '@store/Products'
import { useGlobalStore } from '@src/store/globalStore'

import { costanti } from '@costanti'

export default defineComponent({
  name: 'CText',
  props: {
    rectext: {
      type: Object as PropType<IText>,
      required: true,
    },
    myproduct: {
      type: Object as PropType<IProduct>,
      required: true,
    },
    optcatalogo: {
      type: Object as PropType<IOptCatalogo>,
      required: true,
    },
    scheda: {
      type: Object as PropType<IMyScheda>,
      required: true,
    },
    show_at_right: {
      type: Boolean,
      required: false,
      default: false,
    },
    idPage: {
      type: String,
      required: false,
      default: '',
    },
  },

  setup(props, { attrs, slots, emit }) {

    const globalStore = useGlobalStore()
    const products = useProducts()

    const getTesto = computed(() => {
      return products.replaceKeyWordsByProduct(
        props.optcatalogo,
        props.myproduct,
        props.rectext,
        props.idPage,
      )
    })

    return {
      tools,
      getTesto,
      globalStore,
      costanti,
    }
  },
})
