
<section
        ng-controller="CompetitionControllerStandings"
        class="tab-section" layout="vertical" layout-fill layout-align="center center">
    <div
            of-in-view
            of-tag-screen
            screen-name="{{ pages.find('table').screenName }}">
    </div>
    <select
            ng-if="competition.hasHomeAwayStandings"
            ng-model="selectedStandingsTable"
            ng-options="(v.label | translate) for (k, v) in standingsTables"
            ng-change="onStandingsTablesChange(selectedStandingsTable)"
            id="standings-select">
    </select>
    <div class="card" ng-class="{'select-table':!hasKnockouts(competition.competitionId)}">
        <div
                loading
                class="card-body"
                ng-if="isLoadingTable">
        </div>
        <div ng-if="!isLoadingTable && !groups.length" of-coming-soon></div>
        <div ng-if="!isLoadingTable && groups.length">
            <of-competition-table group="group" ng-repeat="group in ::groups"></of-competition-table>
        </div>
    </div>
</section>