Updates to account and admin views

This commit is contained in:
Torkel Ödegaard 2015-02-08 10:23:35 +01:00
parent b1a95cacff
commit 2c5828528f
5 changed files with 157 additions and 189 deletions

View File

@ -6,87 +6,71 @@
</ul>
</topnav>
<div class="admin-page">
<h2>
Account Info
</h2>
<div class="page-container">
<div class="page">
<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>
<h2>Account Info</h2>
<form name="accountForm">
<div>
<div class="tight-form">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 100px">
<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>
<br>
<button type="submit" class="pull-right btn btn-success" ng-click="update()">Update</button>
</div>
<br>
<button type="submit" class="pull-right btn btn-success" ng-click="update()">Update</button>
</form>
<h2>
API Keys
</h2>
<div ng-controller="ApiKeysCtrl">
<form name="addTokenrForm" class="form-inline tight-form">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 100px">
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 style="float: right">
<button class="btn btn-success tight-form-btn" ng-click="addToken()">Add</button>
</li>
<div class="clearfix"></div>
</ul>
</form>
</div>
</div>
</div>
<br>
<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>
<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>
</div>

View File

@ -6,42 +6,31 @@
</ul>
</topnav>
<div class="gf-box" style="min-height: 500px">
<div class="page-container">
<div class="page">
<h2>Import dashboards</h2>
<div class="gf-box-header">
<div class="gf-box-title">
<i class="fa fa-th-large"></i>
Import Dashboards
</div>
</div>
<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 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>
<div class="clearfix"></div>
</ul>
</div>
<div class="editor-row" ng-if="importing">

View File

@ -6,55 +6,51 @@
</ul>
</topnav>
<div class="page-container">
<div class="page">
<div class="gf-box" style="min-height: 500px">
<h2>Account users</h2>
<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>
<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>
<div class="clearfix"></div>
</ul>
</div>
</div>
</form>
<br>
<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>
<table class="grafana-options-table">
<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>

View File

@ -5,42 +5,36 @@
</ul>
</topnav>
<div class="admin-page">
<h2>Users</h2>
<div class="gf-box" style="min-height: 500px">
<div class="page-container">
<div class="page">
<h2>Users</h2>
<div class="gf-box-body">
<div class="editor-row row">
<div class="section span6">
<table class="grafana-options-table">
<tr>
<th style="text-align:left">Id</th>
<th>Login</th>
<th>Email</th>
<th>Name</th>
<th>Admin</th>
<th></th>
</tr>
<tr ng-repeat="user in users">
<td>{{user.id}}</td>
<td>{{user.login}}</td>
<td>{{user.email}}</td>
<td>{{user.name}}</td>
<td>{{user.isAdmin}}</td>
<td style="width: 1%">
<a ng-click="edit(variable)" class="btn btn-success btn-small">
<i class="fa fa-edit"></i>
Edit
</a>
&nbsp;&nbsp;
<a ng-click="delete(variable)" class="btn btn-danger btn-small">
<i class="fa fa-remove"></i>
</a>
</td>
</tr>
</table>
</div>
</div>
</div>
<table class="grafana-options-table">
<tr>
<th style="text-align:left">Id</th>
<th>Login</th>
<th>Email</th>
<th>Name</th>
<th>Admin</th>
<th></th>
</tr>
<tr ng-repeat="user in users">
<td>{{user.id}}</td>
<td>{{user.login}}</td>
<td>{{user.email}}</td>
<td>{{user.name}}</td>
<td>{{user.isAdmin}}</td>
<td style="width: 1%">
<a ng-click="edit(variable)" class="btn btn-success btn-small">
<i class="fa fa-edit"></i>
Edit
</a>
&nbsp;&nbsp;
<a ng-click="delete(variable)" class="btn btn-danger btn-small">
<i class="fa fa-remove"></i>
</a>
</td>
</tr>
</table>
</div>
</div>

View File

@ -1,6 +1,11 @@
.grafana-options-table {
width: 100%;
th {
padding: 5px 10px;
border-bottom: 4px solid @grafanaPanelBackground;
}
tr td {
background-color: @grafanaListBackground;
padding: 5px 10px;