<div class="modal-header">
    <h3>
        <span translate>admin.correspondenceManagement.templates.modal.navigationBar</span>
    </h3>
</div>
<tabset justified="true">
    <tab heading="{{'admin.correspondenceManagement.templates.tabs.firstTab' | translate}}">
        <div class="modal-body" context-menu="contextMenuOptions()">
            <abn-tree tree-data="myData" tree-control="myTree"></abn-tree>
        </div>
    </tab>
    <tab heading="{{'admin.correspondenceManagement.templates.tabs.secondTab' | translate}}">
    <div class="table-responsive">
        <table class="table">
            <thead>
            <tr>
                <th scope="col" translate>admin.correspondenceManagement.mergefields.addModal.fieldValue</th>
                <th scope="col" translate>admin.correspondenceManagement.mergefields.addModal.fieldDescription</th>
            </tr>
            </thead>
            <tr ng-repeat="mergeField in mergeFieldsByType">
                <td context-menu="contextMenuMergeFields(mergeField.fieldId)">{{ mergeField.fieldId }}</td>
                <td>{{ mergeField.fieldDescription }}</td>
            </tr>
        </table>
    </div>
    </tab>
</tabset>
<div class="modal-footer">
    <button class="btn btn-secondary" ng-click="onClickCancel()">
        <span translate>admin.correspondenceManagement.templates.modal.btnCancel.text</span>
    </button>
</div>