import AdmVue from "@assets/js/adm-vue";
import axiosApi from "@assets/js/axios-api";

import initVue from "@assets/js/initVue";
import param from "@assets/js/param";

import html2pdf from 'html2pdf.js';

const vm = new AdmVue({
  components: {
    BaseCard: () => import(/* webpackChunkName: "BaseCard" */ "@elements/BaseCard/index.vue"),
    BaseInputFile: () => import(/* webpackChunkName: "BaseInputFile" */ '@elements/BaseInputFile/index.vue'),
    BaseTabs: () => import(/* webpackChunkName: "BaseTabs" */ '@components/BaseTabs/index.vue'),
    BaseTextarea: () => import(/* webpackChunkName: "BaseTextarea" */ '@elements/BaseTextarea/index.vue'),
    GroupInput: () => import(/* webpackChunkName: "BaseTabs" */ '@components/GroupInput/index.vue'),
    BaseSelect: () => import(/* webpackChunkName: "BaseTabs" */ '@elements/BaseSelect/index.vue'), 
    BaseButton: () => import(/* webpackChunkName: "Basebutton" */ '@elements/BaseButton/index.vue'),
  },
  data() {
    return {
    list:{

    },
    filters:{
      filterCart: '0',
      greaterthan:'',
      search:'',
    },
    btnSubmitLoading: false,
    btnSubmitLoading2: false,
    disableForm: false,

    };
  },
  computed: {
    sendData() {
        
      return { ...this.list, ...this.filters

      };
      
    },
  },
  methods:{
    setErrors(errors) {
      this.$refs.validationObserver.setErrors(errors);
    },
    formError(data) {
      const { errors } = data;
      this.$refs.validationObserver.setErrors(errors);
      if (errors.warning) {
        this.alert = {
          type: 'warning',
          message: errors.warning,
        };
      }
    },
    filter(){
      this.btnSubmitLoading = true;
      this.disableForm = true;

     
      axiosApi({
        method: 'POST',
        url: this.actionFilter,
        data: param({filters: this.filters}),
      
      })
        .then(({data}) => {
          if(data.list){
            this.list = data.list;
            
          }
          this.btnSubmitLoading = false;
          this.disableForm = false;
        })
        .catch((err) => console.log(err, err.response))
    },

  generatePdf() {

    alert("Serão impressos apenas produtos com mais de 1 carrinho ou mais de 1 quantidade, clique em OK para continuar");

    if (Object.keys(this.list).length === 0) {
      alert("Por favor, carregue os dados antes de gerar o PDF.");
      return;
    }

  this.btnSubmitLoading2 = true;

  const element = document.getElementById('relatorio_pdf');
  
  
  //clona tabela
  const cloneElement = element.cloneNode(true);

  const rows = Array.from(cloneElement.querySelectorAll('.content-box.background-white.padding-medium.bottom-border-gray'));
 

  //remove 1 pra 1
  rows.forEach((row) => {
     
    const quantityElement = row.querySelector('.col-xs-2:nth-child(4) span');
    const cartsElement = row.querySelector('.col-xs-2:nth-child(5) span');
    

    const totalQuantity = quantityElement ? parseInt(quantityElement.textContent, 10) : null;
    const totalCarts = cartsElement ? parseInt(cartsElement.textContent, 10) : null;

   if(totalQuantity !== null && totalCarts !== null){ 
    if(totalQuantity === 1 && totalCarts === 1){
      row.remove()
    }
   }
  });

    
      const options = {
        margin: [10, 10, 10, 10],
        filename: "Relatorio.pdf",
        html2pdf: {scale: 2},
        jsPDF: {unit: "mm", format: "a4", orientation: "portrait"},
        pagebreak: {mode: ['avoid-all', 'css', 'legacy']}
      };
    
      // gera o PDF com o conteúdo do clone  
      html2pdf().from(cloneElement).set(options).outputPdf().then(() => {
        this.btnSubmitLoading2 = false; 
      }).save();
      
    }
    
  },
});

initVue(vm);

