grafana/src/app/features/account/partials/account.html

<topnav toggle="toggleSideMenu()" icon="fa fa-shield" title="Account" show-menu-btn="!grafana.sidemenu">
</topnav>

<div class="admin-page">
	<h2>
		Account Info
	</h2>

	<div class="gf-box">
		<div class="gf-box-body">
			<div class="editor-row">
				<div class="section">
			<form name="accountForm">
				<div>
					<div class="tight-form">
						<ul class="tight-form-list">
							<li class="tight-form-item" style="width: 120px">
								<strong>Account name</strong>
							</li>
							<li>
								<input type="text" required ng-model="account.name" class="input-xxlarge tight-form-input last" >
							</li>
						</ul>
						<div class="clearfix"></div>
					</div>
				</div>
				<br>
				<button type="submit" class="pull-right btn btn-success" ng-click="update()">Update</button>
			</form>
			</div>
			</div>
		</div>
	</div>

	<h2>
		Account users
	</h2>

	<div class="gf-box" ng-controller="AccountUsersCtrl">
		<div class="gf-box-body">
			<div class="editor-row">
				<div class="section">
					<form name="form">
						<div class="tight-form">
							<ul class="tight-form-list">
								<li class="tight-form-item" style="width: 160px">
									<strong>Username or Email</strong>
								</li>
								<li>
									<input type="text" ng-model="user.loginOrEmail" required class="input-xlarge tight-form-input" placeholder="user@email.com or username">
								</li>
								<li class="tight-form-item">
									role
								</li>
								<li>
									<select type="text" ng-model="user.role" class="input-small tight-form-input" ng-options="f for f in ['Viewer', 'Editor', 'Admin']">
									</select>
								</li>
								<li>
									<button class="btn btn-success tight-form-btn" ng-click="addUser()">Add</button>
								</li>
							</ul>
							<div class="clearfix"></div>
						</div>
					</form>
				</div>
			</div>


			<div class="editor-row row">
				<table class="grafana-options-table span5">
					<tr ng-repeat="user in users">
						<td>{{user.email}}</td>
						<td>
							{{user.role}}
						</td>
						<td style="width: 1%">
							<a ng-click="removeUser(user)" class="btn btn-danger btn-mini">
								<i class="fa fa-remove"></i>
							</a>
						</td>
					</tr>
				</table>
			</div>

		</div>
	</div>

	<h2>
		API Keys
	</h2>

	<div class="gf-box" ng-controller="ApiKeysCtrl">
		<div class="gf-box-body">
			<div class="editor-row">
				<div class="section">
					<form name="addTokenrForm" class="form-inline tight-form">
						<ul class="tight-form-list">
							<li class="tight-form-item">
								Add a key
							</li>
							<li>
								<input type="text" class="input-xlarge tight-form-input" ng-model='token.name' placeholder="Name"></input>
							</li>
							<li class="tight-form-item">
								Role
							</li>
							<li>
								<select class="input-small tight-form-input" ng-model="token.role" ng-options="r for r in roleTypes"></select>
							</li>
							<li>
								<button class="btn btn-success tight-form-btn" ng-click="addToken()">Add</button>
							</li>
						</ul>
						<div class="clearfix"></div>
					</form>
				</div>
			</div>

			<div class="editor-row">
				<div class="section">
					<table class="grafana-options-table">
						<tr ng-repeat="t in tokens">
							<td>{{t.name}}</td>
							<td>{{t.role}}</td>
							<td>{{t.key}}</td>
							<td style="width: 1%">
								<a ng-click="removeToken(t.id)" class="btn btn-danger btn-mini">
									<i class="fa fa-remove"></i>
								</a>
							</td>
						</tr>
					</table>
				</div>
			</div>
		</div>
	</div>

	<h2>Import dashboards</h2>
	<div class="gf-box" ng-controller="ImportCtrl">
		<div class="gf-box-body">
			<div class="editor-row">
				<div class="section">
					<div class="tight-form">
						<ul class="tight-form-list">
							<li class="tight-form-item" style="width: 150px">
								<strong>Dashboard source</strong>
							</li>
							<li>
								<select type="text" ng-model="sourceName" class="input-medium tight-form-input" ng-options="f for f in datasources">
								</select>
							</li>
							<li class="tight-form-item">
								<strong>Destination</strong>
							</li>
							<li>
								<select type="text" ng-model="destName" class="input-medium tight-form-input" ng-options="f for f in datasources">
								</select>
							</li>
							<li>
								<button class="btn btn-success tight-form-btn" ng-click="startImport()">Import</button>
							</li>
						</ul>
						<div class="clearfix"></div>
					</div>
				</div>
			</div>

			<div class="editor-row" ng-if="importing">
				<section class="section">
					<h5>{{infoText}}</h5>

					<div class="editor-row row">
						<table class="grafana-options-table span5">
							<tr ng-repeat="dash in imported">
								<td>{{dash.name}}</td>
								<td>
									{{dash.info}}
								</td>
							</tr>
						</table>
					</div>
				</section>
			</div>
		</div>
	</div>
</div>