@spotinst/spinnaker-deck/app/scripts/modules/appengine/src/loadBalancer/details/details.html

Spinnaker-Deck service, forked with support to Spotinst

<div class="details-panel">
  <div ng-if="ctrl.state.loading" class="header">
    <div class="close-button">
      <a class="btn btn-link" ui-sref="^">
        <span class="glyphicon glyphicon-remove"></span>
      </a>
    </div>
    <div class="horizontal center middle">
      <loading-spinner size="'small'"></loading-spinner>
    </div>
  </div>

  <div ng-if="!ctrl.state.loading" class="header">
    <div class="close-button">
      <a class="btn btn-link" ui-sref="^">
        <span class="glyphicon glyphicon-remove"></span>
      </a>
    </div>
    <div class="header-text horizontal middle">
      <i class="fa icon-sitemap"></i>
      <h3 class="horizontal middle space-between flex-1" select-on-dbl-click>{{ctrl.loadBalancer.name}}</h3>
    </div>
    <div>
      <div class="actions">
        <div class="dropdown" uib-dropdown dropdown-append-to-body>
          <button type="button" class="btn btn-sm btn-primary dropdown-toggle" uib-dropdown-toggle>
            Load Balancer Actions <span class="caret"></span>
          </button>
          <ul class="dropdown-menu" uib-dropdown-menu role="menu">
            <li><a href ng-click="ctrl.editLoadBalancer()">Edit Load Balancer</a></li>
            <li ng-if="ctrl.canDeleteLoadBalancer()">
              <a href ng-click="ctrl.deleteLoadBalancer()">Delete Load Balancer</a>
            </li>
            <li
              ng-if="!ctrl.canDeleteLoadBalancer()"
              uib-tooltip="You cannot delete a default service."
              class="disabled"
            >
              <a href>Delete Load Balancer</a>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>

  <div ng-if="!ctrl.state.loading" class="content">
    <collapsible-section heading="Load Balancer Details" expanded="true">
      <dl class="dl-horizontal dl-narrow">
        <dt>In</dt>
        <dd><account-tag account="ctrl.loadBalancer.account" pad="right"></account-tag></dd>
        <dt>Region</dt>
        <dd>{{ctrl.loadBalancer.region}}</dd>
        <dt ng-if="ctrl.loadBalancer.serverGroups.length">Server Groups</dt>
        <dd ng-if="ctrl.loadBalancer.serverGroups.length">
          <ul>
            <li ng-repeat="serverGroup in ctrl.loadBalancer.serverGroups | orderBy: ['isDisabled', '-name']">
              <a
                ui-sref="^.serverGroup({region: serverGroup.region,
                                         accountId: serverGroup.account,
                                         serverGroup: serverGroup.name,
                                         provider: 'appengine'})"
              >
                {{serverGroup.name}}
              </a>
            </li>
          </ul>
        </dd>
      </dl>
    </collapsible-section>
    <collapsible-section heading="Status" expanded="true">
      <health-counts class="pull-left" container="ctrl.loadBalancer.instanceCounts"></health-counts>
    </collapsible-section>
    <collapsible-section heading="Traffic Split" expanded="true">
      <dl class="dl-horizontal dl-narrow">
        <dt ng-if="ctrl.loadBalancer.split.shardBy">Shard By</dt>
        <dd ng-if="ctrl.loadBalancer.split.shardBy">
          {{ctrl.loadBalancer.split.shardBy}}
          <help-field
            key="appengine.loadBalancer.shardBy.{{ctrl.loadBalancer.split.shardBy.toLowerCase()}}"
          ></help-field>
        </dd>
        <hr ng-if="ctrl.loadBalancer.split.shardBy" />
        <ul>
          <li ng-repeat="(serverGroup, percent) in ctrl.loadBalancer.split.allocations">
            {{serverGroup}}:<span class="pull-right">{{percent | decimalToPercent}}</span>
          </li>
        </ul>
      </dl>
    </collapsible-section>
    <collapsible-section heading="DNS" expanded="true">
      <dl class="dl-narrow">
        <appengine-component-url-details component="ctrl.loadBalancer"></appengine-component-url-details>
      </dl>
    </collapsible-section>
    <collapsible-section heading="Dispatch Rules" expanded="true" ng-if="ctrl.dispatchRules.length > 0">
      <dl class="dl-horizontal dl-narrow">
        <span ng-repeat-start="rule in ctrl.dispatchRules">{{rule}}</span><br ng-repeat-end />
      </dl>
    </collapsible-section>
  </div>
</div>