<template>
    <div class="dic-header">
        <div>
            <i class="mc-icon mc-icon-printer"></i>
            {{ appName }}
        </div>

        <div class="dic-header-menu">
            <div
                class="dic-header-button"
                v-for="(menu, index) in menus"
                :key="index"
                :id="menu.id"
                :xid="menu.xid"
                :title="menu.title"
            >
                <template v-if="menu.icon">
                    <i :class="getClassName(menu.icon)"></i>
                    {{ menu.label }}
                </template>
                <div v-else class="tmpl-save-button">{{ menu.label }}</div>
            </div>
        </div>
    </div>
</template>

<script>
import header from '../../../../config/renderSet/header';
export default {
    name: 'dic-header',
    data: () => ({ ...header }),
    methods: {
        getClassName: (className) => `mc-icon ${className}`,
    },
};
</script>

<style lang="scss">
@import './_dicHeader.scss';
</style>
