import {computed, ref} from 'vue';
import {
  HiprintPrintOption,
  PrintElementType,
  PrintElementTypes,
  PrintPanelOptions,
  TextPrintElementType,
} from '../types';
import {defineStore} from 'pinia';
import defaultPrintElement from 'yh-hiprint/store/defaultPrintElement';

export default defineStore('useHiprintStore', () => {
  const printElements = ref<PrintElementType[]>([]);
  const panelOption = ref<PrintPanelOptions>();
  const watermarkOptions = ref<PrintPanelOptions['watermarkOptions']>();

  const activeElements = ref<PrintElementType[]>([]);

  const activeElement = computed<PrintElementType | null>(() => {
    if (activeElements.value.length && activeElements.value.length === 1) {
      return activeElements.value[0];
    } else {
      return null;
    }
  });

  const panelType = computed<PrintElementTypes>(() => {
    if (activeElement.value === null) {
      return PrintElementTypes.PANEL;
    } else {
      if (activeElement.value.printElementType.type === PrintElementTypes.TEXT) {
        if ((activeElement.value as TextPrintElementType).options.textType === 'qrcode') {
          return PrintElementTypes.QRCODE;
        } else if ((activeElement.value as TextPrintElementType).options.textType === 'barcode') {
          return PrintElementTypes.BARCODE;
        } else {
          return PrintElementTypes.TEXT;
        }
      } else {
        switch (activeElement.value.printElementType.type) {
          case PrintElementTypes.IMAGE:
            return PrintElementTypes.IMAGE;
          case PrintElementTypes.TABLE:
            return PrintElementTypes.TABLE;
          case PrintElementTypes.HLINE:
            return PrintElementTypes.HLINE;
          case PrintElementTypes.VLINE:
            return PrintElementTypes.VLINE;
          case PrintElementTypes.RECT:
            return PrintElementTypes.RECT;
          case PrintElementTypes.OVAL:
            return PrintElementTypes.OVAL;
          case PrintElementTypes.LONGTEXT:
            return PrintElementTypes.LONGTEXT;
          case PrintElementTypes.HTML:
            return PrintElementTypes.HTML;
          default:
            return PrintElementTypes.PANEL;
        }
      }
    }
  });

  const hiprontPrintOption = computed<string>(() => {
    return JSON.stringify({
      panels: [
        {
          ...panelOption.value,
          printElements: printElements.value,
        },
      ],
    });
  });

  const setPaperOption = (width, height) => {
    if (panelOption.value) {
      panelOption.value.width = width;
      panelOption.value.height = height;
    }
  };

  return {
    hiprontPrintOption,
    panelType,
    panelOption,
    setPaperOption,
    watermarkOptions,
    printElements,
    activeElement,
    activeElements,
  };
});