_service-instance-row.html

<div class="list-pf-item provisioned-service" ng-class="{ active: row.expanded }">
  <div class="list-pf-container" ng-click="row.toggleExpand($event)">
    <div class="list-pf-chevron">
      <div ng-include src=" 'views/overview/_list-row-chevron.html' " class="list-pf-content"></div>
    </div>
    <div class="list-pf-content">
      <div class="list-pf-name">
        <h3>
          <a ng-href="{{row.apiObject | navigateResourceURL}}" ng-bind-html="row.displayName | highlightKeywords : row.state.filterKeywords"></a>
          <div ng-bind-html="row.apiObject.metadata.name | highlightKeywords : row.state.filterKeywords" class="list-row-longname"></div>
        </h3>
        <div class="status-icons" ng-if="!row.expanded">
          <notification-icon alerts="row.notifications"></notification-icon>
          <div ng-switch="row.instanceStatus">
            <span ng-switch-when="failed"
                  dynamic-content="{{row.apiObject | serviceInstanceFailedMessage}}"
                  data-toggle="tooltip"
                  data-trigger="hover"
                  class="notification-icon-count">
              <span class="pficon pficon-error-circle-o" aria-hidden="true"></span>
              <span>Error</span>
            </span>
            <span ng-switch-when="deleted" class="notification-icon-count">
              <span class="pficon pficon-warning-triangle-o" aria-hidden="true"></span>
              Marked for Deletion
            </span>
            <span ng-switch-when="pending" class="notification-icon-count">
              <span class="spinner spinner-xs spinner-inline" aria-hidden="true"></span>
              <span>Pending</span>
            </span>
          </div>
        </div>
      </div>
      <div class="list-pf-details" ng-if="!row.expanded">
        <span ng-if="!row.bindings.length
                    && row.isBindable
                    && ({resource: 'serviceinstancecredentials', group: 'servicecatalog.k8s.io'} | canI : 'create')"
              class="hidden-xs hidden-sm">
          <a href="" ng-click="row.showOverlayPanel('bindService', {target: row.apiObject})">
            <span class="pficon pficon-add-circle-o" aria-hidden="true"></span>
            Create Binding
          </a>
        </span>
        <div ng-if="row.bindings.length" class="hidden-xs hidden-sm">
          <span class="component-label">Bindings</span>
          <p ng-if="firstBinding = row.bindings[0]" class="bindings">
            <span ng-if="application = row.state.applicationsByBinding[firstBinding.metadata.name][0]">
              {{application.metadata.name}}
            </span>
            <span ng-if="!application">
              {{firstBinding.spec.secretName}}
            </span>
            <span ng-if="row.bindings.length > 1">
              and
              <a
                ng-if="row.bindings.length > 1"
                ng-click="row.toggleExpand($event, true)">
                {{row.bindings.length -1}} other<span ng-if="row.bindings.length > 2">s</span></a>
            </span>
          </p>
        </div>
        <div
          class="hidden-xs"
          ng-if="(!row.instanceStatus || row.instanceStatus === 'ready') && row.apiObject.status.dashboardURL">
          <a ng-href="{{row.apiObject.status.dashboardURL}}" target="_blank">
            Console
          </a> <i class="fa fa-external-link small" aria-hidden="true"></i>
        </div>
      </div>
    </div>
    <div class="list-pf-actions">
      <div uib-dropdown ng-if="row.actionsDropdownVisible()">
        <a href=""
        uib-dropdown-toggle
        class="actions-dropdown-kebab"><i class="fa fa-ellipsis-v"></i><span class="sr-only">Actions</span></a>
        <ul class="dropdown-menu dropdown-menu-right" uib-dropdown-menu role="menu">
          <li role="menuitem" ng-if="row.isBindable && ({resource: 'serviceinstancecredentials', group: 'servicecatalog.k8s.io'} | canI : 'create')">
            <a href="" ng-click="row.showOverlayPanel('bindService', {target: row.apiObject})">
              Create Binding
            </a>
          </li>
          <li role="menuitem" ng-if="row.deleteableBindings.length && ({resource: 'serviceinstancecredentials', group: 'servicecatalog.k8s.io'} | canI : 'delete')">
            <a href="" ng-click="row.showOverlayPanel('unbindService', {target: row.apiObject})">Delete Binding</a>
          </li>
          <li role="menuitem">
            <a href="" ng-click="row.deprovision()" role="button" ng-if="{resource: 'serviceinstances', group: 'servicecatalog.k8s.io'} | canI : 'delete'">Delete</a>
          </li>
        </ul>
      </div>
    </div>
  </div>
  <div
    class="list-pf-expansion collapse"
    ng-if="row.expanded"
    ng-class="{ in: row.expanded }">
    <div class="list-pf-container">
      <div class="expanded-section">
        <alerts alerts="row.notifications"></alerts>
        <div ng-switch="row.instanceStatus">
          <div ng-switch-when="deleted" class="row">
            <div class="col-sm-12">
              <div class="alert word-break alert-warning">
                <span class="pficon pficon-warning-triangle-o" aria-hidden="true"></span>
                <span class="sr-only">warning</span>
                <span class="strong">The service was marked for deletion</span>
                <span class="strong" am-time-ago="row.apiObject.metadata.deletionTimestamp"></span>.
              </div>
            </div>
          </div>
          <div ng-switch-when="failed" class="row">
            <div class="col-sm-12">
              <div class="alert word-break alert-danger">
                <span class="pficon pficon-error-circle-o" aria-hidden="true"></span>
                <span class="sr-only">error</span>
                <span class="strong">{{row.apiObject | serviceInstanceFailedMessage}}</span>
              </div>
            </div>
          </div>
          <div ng-switch-when="pending" class="row">
            <div class="col-sm-12">
              <div class="alert word-break alert-info">
                <span class="pficon pficon-info" aria-hidden="true"></span>
                <span class="sr-only">info</span>
                <span>The service is not yet ready.</span>
                <span>{{row.pendingMessage}}</span>
              </div>
            </div>
          </div>
        </div>
        <div>
          <div class="row">
            <div class="col-sm-12" ng-if="row.description">
              <p class="pre-wrap" ng-bind-html="row.description | linky"></p>
            </div>
          </div>
          <overview-service-bindings
            ng-if="row.isBindable || row.bindings"
            section-title="Bindings"
            namespace="row.apiObject.metadata.namespace"
            bindings="row.bindings"
            bindable-service-instances="row.state.bindableServiceInstances"
            service-classes="row.state.serviceClasses"
            create-binding="row.showOverlayPanel('bindService', {target: row.apiObject})">
          </overview-service-bindings>
        </div>
      </div>
    </div>
  </div>
</div>
<overlay-panel show-panel="row.overlay.panelVisible" handle-close="row.closeOverlayPanel">
  <div ng-if="row.overlay.panelName === 'bindService'">
    <bind-service target="row.overlay.state.target"
                  project="row.state.project"
                  on-close="row.closeOverlayPanel"></bind-service>
  </div>
  <div ng-if="row.overlay.panelName === 'unbindService'">
    <unbind-service
      target="row.overlay.state.target"
      bindings="row.deleteableBindings"
      applications-by-binding="row.state.applicationsByBinding"
      on-close="row.closeOverlayPanel"></unbind-service>
  </div>
</overlay-panel>