<template>
    <li class="nav-item">
        <a class="nav-link" :class="[aClass, (Status == 'Active' ? 'active' : '')]" data-toggle="tab" :href="TabHref">
            <div class="WM-Font-18"> {{ TitleFa }} </div> {{ TitleEn }}
        </a>
    </li>
</template>

<script>
export default {
    props: {
        TitleFa:   { default: "دسترسی سریع" },
        TitleEn:   { default: "Title" },
        Color:     { default: "Black" },
        TabContent:   { default: '' },
        Status:   { default: '' },
    },
    data: function ()  {
        return {
            aClass: 'WM-' + this.Color,
            TabHref: '#' + this.TabContent,
        }
    },
};

</script>
