<div class="head-title">
    รายละเอียดสาขาและหน่วยธุรกิจ
</div>
<div class="body-content">
    <ul class="nav-tabs">
        <li class="nav-item" *ngFor="let item of [{id:'tab1',text:'ทะเบียนฝ่าย'},
            {id:'tab2',text:'ทะเบียนแผนก'},
            {id:'tab3',text:'ทะเบียนส่วน'},
            {id:'tab4',text:'ส่วนย่อย1'},
            {id:'tab5',text:'ส่วนย่อย2'},
            {id:'tab6',text:'ส่วนย่อย3'},
            {id:'tab7',text:'ส่วนย่อย4'}]" (click)="changeTab(item)">
            <a [class.active]="activeTab === item.id" class="nav-link">{{item.text}}</a>
        </li>
    </ul>
    <div class="tab-content">
        <div *ngIf="activeTab === 'tab1'" class="tab-pane">
            <app-department-register></app-department-register>
        </div>
        <div *ngIf="activeTab === 'tab2'" class="tab-pane">
            <app-department-list></app-department-list>
        </div>
    </div>
</div>