<div class="rielta-wired-devices">
  <div class="swap-devices-buttons">
    <div class="button-up" ng-click="$ctrl.onClickUpButton()"></div>
    <div class="button-down" ng-click="$ctrl.onClickDownButton()"></div>
  </div>

  <div class="row row-no-gutters">
    <div class="col-md-11">
      <label translate>ID:</label> {[ $ctrl.id ]}
      <label translate>Модель:</label> {[ $ctrl.modelName ]}
    </div>
  </div>

  <div class="row">
    <div class="col-md-11">
      <div class="row">
        <div class="col-md-3 bottom-10" ng-repeat="chan in $ctrl.channels">
          <enable-zone-button index="chan.zone" disabled="false">
            <on-button><strong>{[ chan.zone + 1 ]}</strong> {[  chan.name ]}</on-button>
            <off-button><strong>{[ chan.zone + 1 ]}</strong> {[  chan.name ]}</off-button>
          </enable-zone-button>
        </div>
      </div>
    </div>

    <div class="col-md-1" style="position: relative; display: inline-block; float: none">
      <a href="" ng-show="$ctrl.showDeleteButton" ng-click="$ctrl.onClickDeleteButton()">
        <img ng-src="{[ '/images/glyph-delete.svg' | augeasStatic ]}"
             style="top: 50%; position: absolute; transform: translateY(-50%)"/>
      </a>
    </div>
  </div>
</div>
