Skip to content

N
nexpie-grafana-theme
Commit 500e0006 by Torkel Ödegaard
Options

Add collaborator now handles roles, added macaron-binding for binding and validation

parent 4c73d970
Showing with 51 additions and 23 deletions
src/app/features/account/collaboratorsCtrl.js
...@@ -8,7 +8,10 @@ function (angular) { ...@@ -8,7 +8,10 @@ function (angular) {
module.controller('CollaboratorsCtrl', function($scope, $http, backendSrv) { module.controller('CollaboratorsCtrl', function($scope, $http, backendSrv) {
$scope.collaborator = {}; $scope.collaborator = {
loginOrEmail: '',
role: 'Viewer',
};
$scope.init = function() { $scope.init = function() {
$scope.get(); $scope.get();
...@@ -17,7 +20,6 @@ function (angular) { ...@@ -17,7 +20,6 @@ function (angular) {
$scope.get = function() { $scope.get = function() {
backendSrv.get('/api/account/collaborators').then(function(collaborators) { backendSrv.get('/api/account/collaborators').then(function(collaborators) {
$scope.collaborators = collaborators; $scope.collaborators = collaborators;
console.log(collaborators);
}); });
}; };
...@@ -30,7 +32,7 @@ function (angular) { ...@@ -30,7 +32,7 @@ function (angular) {
}; };
$scope.addCollaborator = function() { $scope.addCollaborator = function() {
if (!$scope.addCollaboratorForm.$valid) { if (!$scope.form.$valid) {
return; return;
} }
......
src/app/features/account/partials/account.html
...@@ -16,41 +16,39 @@ ...@@ -16,41 +16,39 @@
<form name="accountForm"> <form name="accountForm">
<div class="grafana-target"> <div class="tight-form">
<div class="grafana-target-inner"> <ul class="tight-form-list">
<ul class="grafana-segment-list"> <li class="tight-form-item" style="width: 80px">
<li class="grafana-target-segment" style="width: 80px">
<strong>Name</strong> <strong>Name</strong>
</li> </li>
<li> <li>
<input type="text" ng-model="account.name" class="input-xxlarge grafana-target-segment-input last" > <input type="text" ng-model="account.name" class="input-xxlarge tight-form-input last" >
</li> </li>
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div class="grafana-target-inner" style="margin-top: 10px"> <div class="tight-form" style="margin-top: 10px">
<ul class="grafana-segment-list"> <ul class="tight-form-list">
<li class="grafana-target-segment" style="width: 80px"> <li class="tight-form-item" style="width: 80px">
<strong>Email</strong> <strong>Email</strong>
</li> </li>
<li> <li>
<input type="text" ng-model="account.email" class="input-xxlarge grafana-target-segment-input last" > <input type="text" ng-model="account.email" class="input-xxlarge tight-form-input last" >
</li> </li>
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div class="grafana-target-inner" style="margin-top: 10px"> <div class="tight-form" style="margin-top: 10px">
<ul class="grafana-segment-list"> <ul class="tight-form-list">
<li class="grafana-target-segment" style="width: 80px"> <li class="tight-form-item" style="width: 80px">
<strong>Username</strong> <strong>Username</strong>
</li> </li>
<li> <li>
<input type="text" ng-model="account.login" class="input-xxlarge grafana-target-segment-input last" > <input type="text" ng-model="account.login" class="input-xxlarge tight-form-input last" >
</li> </li>
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
</div>
<br> <br>
<button type="submit" class="btn btn-success" ng-click="update()">Update</button> <button type="submit" class="btn btn-success" ng-click="update()">Update</button>
......
src/app/features/account/partials/collaborators.html
<div ng-include="'app/partials/navbar.html'" ng-init="pageTitle='Account > Collaborators'"></div> <div ng-include="'app/partials/navbar.html'" ng-init="pageTitle='Account > Collaborators'"></div>
<div class="dashboard-edit-view"> <div class="dashboard-edit-view" style="min-height: 500px">
<div class="dashboard-editor-header"> <div class="dashboard-editor-header">
<div class="dashboard-editor-title"> <div class="dashboard-editor-title">
...@@ -12,15 +12,34 @@ ...@@ -12,15 +12,34 @@
<div class="dashboard-editor-body"> <div class="dashboard-editor-body">
<div class="editor-row"> <div class="editor-row">
<div class="editor-option"> <div class="section">
<form name="addCollaboratorForm" class="form-inline"> <form name="form">
<label class="small">Add a collaborator</label> <div class="tight-form">
<input type="text" class="input-xxlarge" ng-model='collaborator.email' placeholder="collaborator@email.com"></input> <ul class="tight-form-list">
<button class="btn btn-success" ng-click="addCollaborator()">Add</button> <li class="tight-form-item" style="width: 160px">
<strong>Username or Email</strong>
</li>
<li>
<input type="text" ng-model="collaborator.loginOrEmail" required class="input-xlarge tight-form-input" placeholder="collaborator@email.com">
</li>
<li class="tight-form-item">
Role
</li>
<li>
<select type="text" ng-model="collaborator.role" class="input-small tight-form-input" ng-options="f for f in ['Viewer', 'Editor2', 'Admin']">
</select>
</li>
<li>
<button class="btn btn-success tight-form-btn" ng-click="addCollaborator()">Add</button>
</li>
</ul>
<div class="clearfix"></div>
</div>
</form> </form>
</div> </div>
</div> </div>
<div class="editor-row row"> <div class="editor-row row">
<table class="grafana-options-table span5"> <table class="grafana-options-table span5">
<tr ng-repeat="collaborator in collaborators"> <tr ng-repeat="collaborator in collaborators">
......
src/app/services/backendSrv.js
...@@ -42,6 +42,11 @@ function (angular, _, config) { ...@@ -42,6 +42,11 @@ function (angular, _, config) {
} }
return results.data; return results.data;
}, function(err) { }, function(err) {
if (err.status === 422) {
alertSrv.set("Validation failed", "", "warning", 4000);
throw err.data;
}
var data = err.data || { message: 'Unexpected error' }; var data = err.data || { message: 'Unexpected error' };
if (_.isString(data)) { if (_.isString(data)) {
......
src/css/less/tightform.less
...@@ -23,6 +23,10 @@ ...@@ -23,6 +23,10 @@
} }
} }
.tight-form-btn {
padding: 8px 12px;
}
// old graphite-segment-list // old graphite-segment-list
.tight-form-list { .tight-form-list {
list-style: none; list-style: none;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment