import AdmVue from '@assets/js/adm-vue';
import initVue from "@assets/js/initVue";

const vm = new AdmVue({
    components: {
      BaseCard: () => import(/* webpackChunkName: "BaseCard" */ '@elements/BaseCard/index.vue'),
      BaseTabs: () => import(/* webpackChunkName: "BaseTabs" */ '@components/BaseTabs/index.vue'),
    },
    data() {
      return {
        configurations: {
          random_title: '',
          random_subtitle: '',
          random_module: []
        },
        layouts: [],
        disableForm: false,
        loadingBtn: false,
      };
    },
    methods:{
      onAddModule(){
        const { configurations } = this;
        const randomModule = configurations.random_module;

        let sortOrder = 0;
        if (randomModule[randomModule.length - 1]) {
          const { sort_order } = randomModule[randomModule.length - 1];
          sortOrder = Number(sort_order) + 1;
        }

        this.configurations.random_module.push({
          limit: '24',
          sort_order: sortOrder,
          status: 1
        });

        
        this.configurations = {...configurations};

      },
      onRemoveModule(moduleIndex){
        const { configurations } = this;
        const randomModule = configurations.random_module;
        randomModule.splice(moduleIndex, 1);
        this.configurations = {...configurations};
      },
      onPositionChange(moduleIndex) {
        
        const module = this.configurations.random_module[moduleIndex];

        if(module.position === Type_ModulePosition.Tp_ColumnLeft){
          this.configurations.random_module[moduleIndex].entry_type = 0;
        }
        else{
          this.configurations.random_module[moduleIndex].limit = '24';
        }

      },
      onTypeChange(type, moduleIndex){
        if(type == 0) this.configurations.random_module[moduleIndex].limit = '24';
      },
      convertToArray(value) {
        if(Array.isArray(value)) {
          return value
        }
  
        return Object.values(value)
      }
    },
    mounted(){
      if (this.configurations.random_module){ 
        this.configurations.random_module = this.convertToArray(this.configurations.random_module).map(item => ({
          ...item, 
          limit: item.limit || '24',
        }));
      }
    }
});

initVue(vm);

