IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

replaced old table with filter-table, removed edit button, made whole rows to links

Browse Source
This commit is contained in:
Patrick O'Carroll 2017-12-14 14:30:13 +01:00
parent 776c39fd79
commit 33f2e31393
8 changed files with 128 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/app/features/admin/partials/edit_org.html
View File

@ -16,7 +16,7 @@
<h3 class="page-heading">Organization Users</h3> <h3 class="page-heading">Organization Users</h3>
<table class="grafana-options-table"> <table class="filter-table">
<tr> <tr>
<th>Username</th> <th>Username</th>
<th>Email</th> <th>Email</th>

57
public/app/features/admin/partials/orgs.html
View File

@ -1,37 +1,40 @@
<page-header model="navModel"></page-header> <page-header model="navModel"></page-header>
<div class="page-container page-body"> <div class="page-container page-body">
<div class="page-action-bar"> <div class="page-action-bar">
<div class="page-action-bar__spacer"></div> <div class="page-action-bar__spacer"></div>
<a class="page-header__cta btn btn-success" href="org/new"> <a class="page-header__cta btn btn-success" href="org/new">
<i class="fa fa-plus"></i> <i class="fa fa-plus"></i>
New Org New Org
</a> </a>
</div> </div>
<table class="filter-table form-inline"> <table class="filter-table form-inline filter-table--hover">
<thead> <thead>
<tr> <tr>
<th>Id</th> <th>Id</th>
<th>Name</th> <th>Name</th>
<th></th> <th style="width:1%"></th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr ng-repeat="org in orgs"> <tr ng-repeat="org in orgs">
<td>{{org.id}}</td> <td class="link-td">
<td>{{org.name}}</td> <a href="admin/orgs/edit/{{org.id}}">
<td class="text-right"> {{org.id}}
<a href="admin/orgs/edit/{{org.id}}" class="btn btn-inverse btn-small"> </a>
<i class="fa fa-edit"></i> </td>
Edit <td class="link-td">
</a> <a href="admin/orgs/edit/{{org.id}}">
&nbsp;&nbsp; {{org.name}}
<a ng-click="deleteOrg(org)" class="btn btn-danger btn-small"> </a>
<i class="fa fa-remove"></i> </td>
</a> <td class="text-right">
</td> <a ng-click="deleteOrg(org)" class="btn btn-danger btn-small">
</tr> <i class="fa fa-remove"></i>
</tbody> </a>
</table> </td>
</tr>
</tbody>
</table>
</div> </div>

69
public/app/features/admin/partials/users.html
View File

@ -1,12 +1,13 @@
<page-header model="ctrl.navModel"></page-header> <page-header model="ctrl.navModel"></page-header>
<div class="page-container page-body"> <div class="page-container page-body">
<div class="page-action-bar"> <div class="page-action-bar">
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label">Search</label> <label class="gf-form-label">Search</label>
<input class="gf-form-input width-15" type="text" placeholder="Find user by name/login/email" tabindex="1" give-focus="true" ng-model="ctrl.query" ng-model-options="{ debounce: 500 }" spellcheck='false' ng-change="ctrl.getUsers()" /> <input class="gf-form-input width-15" type="text" placeholder="Find user by name/login/email" tabindex="1" give-focus="true"
</div> ng-model="ctrl.query" ng-model-options="{ debounce: 500 }" spellcheck='false' ng-change="ctrl.getUsers()" />
<div class="page-action-bar__spacer"></div> </div>
<div class="page-action-bar__spacer"></div>
<a class="btn btn-success" href="admin/users/create"> <a class="btn btn-success" href="admin/users/create">
<i class="fa fa-plus"></i> <i class="fa fa-plus"></i>
Add new user Add new user
@ -14,39 +15,48 @@
</div> </div>
<div class="admin-list-table"> <div class="admin-list-table">
<table class="filter-table form-inline"> <table class="filter-table form-inline filter-table--hover">
<thead> <thead>
<tr> <tr>
<th></th> <th></th>
<th>Login</th> <th>Login</th>
<th>Email</th> <th>Email</th>
<th> <th>
Seen Seen
<tip>Time since user was seen using Grafana</tip> <tip>Time since user was seen using Grafana</tip>
</th> </th>
<th></th>
<th></th> <th></th>
<th style="width: 1%"></th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr ng-repeat="user in ctrl.users"> <tr ng-repeat="user in ctrl.users">
<td class="width-4 text-center"> <td class="width-4 text-center link-td">
<img class="filter-table__avatar" ng-src="{{user.avatarUrl}}"></img> <a href="admin/users/edit/{{user.id}}">
</td> <img class="filter-table__avatar" ng-src="{{user.avatarUrl}}"></img>
<td>{{user.login}}</td>
<td>{{user.email}}</td>
<td>
{{user.lastSeenAtAge}}
</td>
<td>
<i class="fa fa-shield" ng-show="user.isAdmin" bs-tooltip="'Grafana Admin'"></i>
</td>
<td class="text-right">
<a href="admin/users/edit/{{user.id}}" class="btn btn-inverse btn-small">
<i class="fa fa-edit"></i>
Edit
</a> </a>
&nbsp;&nbsp; </td>
<td class="link-td">
<a href="admin/users/edit/{{user.id}}">
{{user.login}}
</a>
</td>
<td class="link-td">
<a href="admin/users/edit/{{user.id}}">
{{user.email}}
</a>
</td>
<td class="link-td">
<a href="admin/users/edit/{{user.id}}">
{{user.lastSeenAtAge}}
</a>
</td>
<td class="link-td">
<a href="admin/users/edit/{{user.id}}">
<i class="fa fa-shield" ng-show="user.isAdmin" bs-tooltip="'Grafana Admin'"></i>
</a>
</td>
<td class="text-right">
<a ng-click="ctrl.deleteUser(user)" class="btn btn-danger btn-small"> <a ng-click="ctrl.deleteUser(user)" class="btn btn-danger btn-small">
<i class="fa fa-remove"></i> <i class="fa fa-remove"></i>
</a> </a>
@ -60,10 +70,7 @@
<div class="admin-list-paging" ng-if="ctrl.showPaging"> <div class="admin-list-paging" ng-if="ctrl.showPaging">
<ol> <ol>
<li ng-repeat="page in ctrl.pages"> <li ng-repeat="page in ctrl.pages">
<button <button class="btn btn-small" ng-class="{'btn-secondary': page.current, 'btn-inverse': !page.current}" ng-click="ctrl.navigateToPage(page)">{{page.page}}</button>
class="btn btn-small"
ng-class="{'btn-secondary': page.current, 'btn-inverse': !page.current}"
ng-click="ctrl.navigateToPage(page)">{{page.page}}</button>
</li> </li>
</ol> </ol>
</div> </div>

63
public/app/features/alerting/partials/notifications_list.html
View File

@ -1,7 +1,7 @@
<page-header model="ctrl.navModel"></page-header> <page-header model="ctrl.navModel"></page-header>
<div class="page-container page-body"> <div class="page-container page-body">
<div class="page-action-bar"> <div class="page-action-bar">
<div class="page-action-bar__spacer"> <div class="page-action-bar__spacer">
</div> </div>
@ -11,34 +11,35 @@
</a> </a>
</div> </div>
<table class="grafana-options-table"> <table class="filter-table filter-table--hover">
<thead> <thead>
<th style="min-width: 200px"><strong>Name</strong></th> <th style="min-width: 200px">
<th style="min-width: 100px">Type</th> <strong>Name</strong>
<th style="width: 1%"></th> </th>
</thead> <th style="min-width: 100px">Type</th>
<tr ng-repeat="notification in ctrl.notifications"> <th style="width: 1%"></th>
<td> </thead>
<a href="alerting/notification/{{notification.id}}/edit"> <tbody>
{{notification.name}} <tr ng-repeat="notification in ctrl.notifications">
</a> <td class="link-td">
</td> <a href="alerting/notification/{{notification.id}}/edit">
<td> {{notification.name}}
{{notification.type}} </a>
</td> </td>
<td class="text-right"> <td class="link-td">
<span class="btn btn-secondary btn-small" ng-show="notification.isDefault == true"> <a href="alerting/notification/{{notification.id}}/edit">
default {{notification.type}}
</span> </a>
<a href="alerting/notification/{{notification.id}}/edit" class="btn btn-inverse btn-small"> </td>
<i class="fa fa-edit"></i> <td class="text-right">
edit <span class="btn btn-secondary btn-small" ng-show="notification.isDefault == true">
</a> default
<a ng-click="ctrl.deleteNotification(notification.id)" class="btn btn-danger btn-small"> </span>
<i class="fa fa-remove"></i> <a ng-click="ctrl.deleteNotification(notification.id)" class="btn btn-danger btn-small">
</a> <i class="fa fa-remove"></i>
</td> </a>
</tr> </td>
</table> </tr>
</tbody>
</table>
</div> </div>

2
public/app/features/org/partials/select_org.html
View File

@ -25,7 +25,7 @@
</div> </div>
<div style="display: inline-block; width: 400px; margin: 30px 0"> <div style="display: inline-block; width: 400px; margin: 30px 0">
<table class="grafana-options-table"> <table class="filter-table">
<tr ng-repeat="org in orgs"> <tr ng-repeat="org in orgs">
<td class="nobg max-width-btns"> <td class="nobg max-width-btns">
<a ng-click="setUsingOrg(org)" class="btn btn-inverse"> <a ng-click="setUsingOrg(org)" class="btn btn-inverse">

15
public/app/features/org/partials/teams.html
View File

@ -18,26 +18,23 @@
</div> </div>
<div class="admin-list-table"> <div class="admin-list-table">
<table class="filter-table form-inline" ng-show="ctrl.teams.length > 0"> <table class="filter-table filter-table--hover form-inline" ng-show="ctrl.teams.length > 0">
<thead> <thead>
<tr> <tr>
<th>Name</th> <th>Name</th>
<th>Members</th> <th>Members</th>
<th></th> <th style="width: 1%"></th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr ng-repeat="team in ctrl.teams"> <tr ng-repeat="team in ctrl.teams">
<td> <td class="link-td">
<a href="org/teams/edit/{{team.id}}">{{team.name}}</a> <a href="org/teams/edit/{{team.id}}">{{team.name}}</a>
</td> </td>
<td>#Count</td> <td class="link-td">
<a href="org/teams/edit/{{team.id}}">#Count</a>
</td>
<td class="text-right"> <td class="text-right">
<a href="org/teams/edit/{{team.id}}" class="btn btn-inverse btn-small">
<i class="fa fa-edit"></i>
Edit
</a>
&nbsp;&nbsp;
<a ng-click="ctrl.deleteTeam(team)" class="btn btn-danger btn-small"> <a ng-click="ctrl.deleteTeam(team)" class="btn btn-danger btn-small">
<i class="fa fa-remove"></i> <i class="fa fa-remove"></i>
</a> </a>

6
public/app/features/playlist/partials/playlist.html
View File

@ -34,7 +34,7 @@
</div> </div>
<div ng-if="ctrl.filteredDashboards.length > 0"> <div ng-if="ctrl.filteredDashboards.length > 0">
<table class="grafana-options-table playlist-available-list"> <table class="filter-table playlist-available-list">
<tr ng-repeat="playlistItem in ctrl.filteredDashboards"> <tr ng-repeat="playlistItem in ctrl.filteredDashboards">
<td> <td>
<i class="icon-gf icon-gf-dashboard"></i> <i class="icon-gf icon-gf-dashboard"></i>
@ -51,7 +51,7 @@
</table> </table>
</div> </div>
<div class="playlist-search-results-container" ng-if="ctrl.filteredTags.length > 0;"> <div class="playlist-search-results-container" ng-if="ctrl.filteredTags.length > 0;">
<table class="grafana-options-table playlist-available-list"> <table class="filter-table playlist-available-list">
<tr ng-repeat="tag in ctrl.filteredTags"> <tr ng-repeat="tag in ctrl.filteredTags">
<td> <td>
<a class="search-result-tag label label-tag" tag-color-from-name="tag.term"> <a class="search-result-tag label label-tag" tag-color-from-name="tag.term">
@ -72,7 +72,7 @@
<div class="col-lg-6"> <div class="col-lg-6">
<h5 class="page headering playlist-column-header">Selected</h5> <h5 class="page headering playlist-column-header">Selected</h5>
<table class="grafana-options-table playlist-available-list"> <table class="filter-table playlist-available-list">
<tr ng-repeat="playlistItem in ctrl.playlistItems"> <tr ng-repeat="playlistItem in ctrl.playlistItems">
<td ng-if="playlistItem.type === 'dashboard_by_id'"> <td ng-if="playlistItem.type === 'dashboard_by_id'">
<i class="icon-gf icon-gf-dashboard"></i>&nbsp;&nbsp;{{playlistItem.title}} <i class="icon-gf icon-gf-dashboard"></i>&nbsp;&nbsp;{{playlistItem.title}}

17
public/sass/components/_filter-table.scss
View File

@ -42,6 +42,23 @@
} }
} }
.link-td {
padding: 0;
line-height: 30px;
height: 30px;
white-space: nowrap;
&.filter-table__switch-cell {
padding: 0;
border-right: 3px solid $page-bg;
}
a {
display: block;
padding: $table-cell-padding;
}
}
.ellipsis { .ellipsis {
display: block; display: block;
width: 100%; width: 100%;