@if (currentUserS() && isAuth == true)
{
<div class="flex flex-column justify-between md:flex-row rounded" style="background-color:transparent">
    <div style="margin-top:5px;padding-right:35px; cursor: pointer;width:400px;">
        <img (click)="onHome()" src="images/application_image.png" alt="Banner" style="height:80px;width:100%" />
    </div>
    
    <div class="flex justify-end items-end flex-row">
        <div class="flex-column">
            <label class=" flex justify-end items-end mr-1 mb-2 myname">{{loginUser}}</label>
            <div>
               
                <span class="hidden md:inline-flex"> <!--hidden when small screen-->
                 <p-buttonGroup >
                    <button type="button" pButton icon="pi pi-slack" label="Home" (click)="onHome()"
                        class="p-button-sm " [attr.disabled]="isHome?true:null"></button>
                    <!--button *ngIf="hasRoleAdmin" type="button" pButton icon="pi pi-file" label="Report" (click)="onReport()"
                    [attr.disabled]="isReport?true:null" class="p-button-sm "></button-->

                    <p-menu #reportmenu [popup]="true" [model]="reportMenu"></p-menu>
                    <p-menu #sysmenu [popup]="true" [model]="systemMenu"></p-menu>

                    @if (hasRoleAdmin)
                    {
                    <button type="button" pButton icon="pi pi-chevron-down" iconPos="right" label="System"
                        (click)="sysmenu.toggle($event);" class="p-button-sm ">
                        <!--i class="pi pi-cog mr-2" style="font-size: 1rem"></i-->
                    </button>
                    }
                    <button pButton type="button" icon="pi pi-power-off" iconPos="left" label="Logout"
                        (click)="logout()" class="p-button-sm p"></button>
                </p-buttonGroup>
                </span>

            </div>
        </div>
    </div>
</div>
<!--put in the left new row if in mobile not much room-->
<span class="md:hidden flex justify-start"> <!--hidden on md screen show on small-->
                    <button type="button" pButton icon="pi pi-align-justify" (click)="onemenu.toggle($event);"></button>
                    <p-menu #onemenu [popup]="true" [model]="oneMenu"></p-menu>
</span>
}