<template>
    <div class="row m-t-10">
        <div class="col">
            <div class="row no-margin">
                <div class="col bg-white">
                    <div class="row align-items-center justify-content-center fs-11 p-t-10 p-b-10">
                        <div class="col">
                            <div class="row">
                                <div class="col bold"><span class="text-complete">{{this.account.role}}</span> - <span class="text-capitalize">{{this.account.full_name}}</span></div>
                            </div>
                            <div class="row">
                                <div class="col muted">{{this.account.email}}</div>
                            </div>
                        </div>
                        <div class="col-auto text-right">
                            <div class="btn-group">
                                <button class="btn btn-secondary btn-xs b-rad-none p-r-0 muted" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                    <span class="muted">Action</span><i class="fa fa-angle-down m-l-5 p-l-5 p-r-5 muted"></i>
                                </button>
                                <div class="dropdown-menu">
                                    <div class="row">
                                        <div class="col">

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        props: ['data'],
        data() {
            return {
                account: this.data
            }
        }
    }
</script>
