<template>
    <div class="flx-align-center" style="padding-bottom: 16px; background: #f2f3f5">
        <template v-for="item in comps" :key="item">
            <!-- @getType="getType" -->
            <component
                :is="item"
                @handleChildBtnCallback="handleChildCallback"
                :ruleForm="ruleForm"
                :isPrint="isPrint"
                :isGenerate="isGenerate"
                :isNumberSwitch="isNumberSwitch"
                :isNumberCode="isNumberCode"
            ></component>
        </template>
    </div>
</template>

<script setup lang="ts">
const $router = useRouter();
const routeName: any = ref($router.currentRoute.value.name);
import Add from "./components/Add.vue";
import Generate from "./components/Generate.vue";
import Print from "./components/Print.vue";
import Switch from "./components/Switch.vue";
import numberCode from "./components/numberCode.vue";
defineProps<{
    handleParentCallback?: () => void;
    ruleForm?: any;
    isPrint?: any;
    isGenerate?: any;
    isNumberSwitch?: any;
    isNumberCode?: any;
}>();

const emits = defineEmits<{
    (e: "handleParentCallback", result: Record<string, any>): void;
}>();

const BTNS_ROUTE: any = {
    boxMarkDetails: [Add, Generate, Print, Switch, numberCode]
};
const comps = computed(() => {
    // let BTNS_RULEST = BTNS_ROUTE();
    return BTNS_ROUTE[routeName.value];
    // return BTNS_ROUTE[routeName.value];
});
const handleChildCallback = (result: Record<string, any>) => {
    emits("handleParentCallback", result);
};
</script>

<style scoped></style>
