energylink/public/app/features/org/partials/orgUsers.html

<topnav title="Organization" icon="fa fa-fw fa-users" subnav="true">
	<ul class="nav">
		<li class="active"><a href="org/users">Users</a></li>
	</ul>
</topnav>

<div class="page-container" style="background: transparent; border: 0;">
	<div class="page">

		<h2>Organization users</h2>

		<button class="btn btn-success pull-right" ng-click="openInviteModal()">
			<i class="fa fa-plus"></i>
			Add or Invite
		</button>

		<br>

		<tabset>
			<tab heading="Users ({{users.length}})">

				<div class="filter-controls-filters">
		      <div class="tight-form last">
		        <ul class="tight-form-list">
		          <li class="tight-form-item">Filters:</li>
		          <li class="tight-form-item">Login</li>
		          <li><!-- <value-select-dropdown></value-select-dropdown> --></li>
		          <li class="tight-form-item">Role</li>
		          <li><!-- <value-select-dropdown></value-select-dropdown> --></li>
		          <li class="tight-form-item">
		            <a class="pointer">
		              <i class="fa fa-pencil"></i>
		            </a>
		          </li>
		        </ul>
		        <div class="clearfix"></div>
		      </div>
		    </div>

		    <ul class="filter-controls-actions">
		      <li>
		        <div class="dropdown">
		          <button class="btn btn-inverse dropdown-toggle" data-toggle="dropdown">
		            <input class="cr1" id="state-enabled" type="checkbox">
		            <label for="state-enabled" class="cr1"></label> <span class="caret"></span>
		          </button>
		          <ul class="dropdown-menu" role="menu">
		            <li><a>All</a></li>
		          </ul>
		        </div>
		      </li>
		      <li>
		        <div class="dropdown">
		          <button class="btn btn-inverse dropdown-toggle" data-toggle="dropdown">
		            Bulk Actions &nbsp; <span class="caret"></span>
		          </button>
		          <ul class="dropdown-menu" role="menu">
		            <li><a>Update notifications</a></li>
		          </ul>
		        </div>
		      </li>
		      <li>
		        <span class="filter-controls-actions-selected">0 selected, showing 1 of 1 total</span>
		      </li>
		    </ul>

				<table class="filter-table form-inline">
					<thead>
						<tr>
							<th>Login</th>
							<th>Email</th>
							<th>Role</th>
							<th style="width: 34px;"></th>
						</tr>
					</thead>
					<tr ng-repeat="user in users">
						<td>{{user.login}}</td>
						<td><span class="ellipsis">{{user.email}}</span></td>
						<td>
							<select type="text" ng-model="user.role" class="input-medium" ng-options="f for f in ['Viewer', 'Editor', 'Read Only Editor', 'Admin']" ng-change="updateOrgUser(user)">
							</select>
						</td>
						<td>
							<a ng-click="removeUser(user)" class="btn btn-danger btn-mini">
								<i class="fa fa-remove"></i>
							</a>
						</td>
					</tr>
				</table>
			</tab>
			<tab heading="Pending Invitations ({{pendingInvites.length}})">
				<div class="grafana-list-item" ng-repeat="invite in pendingInvites" ng-click="invite.expanded = !invite.expanded">
					{{invite.email}}
					<span ng-show="invite.name" style="padding-left: 20px"> {{invite.name}}</span>
					<span class="pull-right">
						<button class="btn btn-inverse btn-mini " data-clipboard-text="{{invite.url}}" clipboard-button ng-click="copyInviteToClipboard($event)"
							<i class="fa fa-clipboard"></i> Copy Invite
						</button>
						&nbsp;
						<a class="pointer">
							<i ng-show="!invite.expanded" class="fa fa-caret-right"></i>
							<i ng-show="invite.expanded" class="fa fa-caret-down"></i>
						</a>
					</span>
					<div ng-show="invite.expanded">
						<a href="{{invite.url}}">{{invite.url}}</a><br>
						<button class="btn btn-inverse btn-mini">
							<i class="fa fa-envelope-o"></i> Resend invite
						</button>
						&nbsp;
						<button class="btn btn-inverse btn-mini" ng-click="revokeInvite(invite, $event)">
							<i class="fa fa-remove" style="color: red"></i> Revoke invite
						</button>
						<span style="padding-left: 15px">
							Invited: <em> {{invite.createdOn | date: 'shortDate'}} by {{invite.invitedBy}} </em>
						</span>
					<div>
				</div>
			</tab>
		</tabset>

	</div>
</div>