Add a modal to create Teams
This adds a button to the Team admin view which opens a modal for creating a new team. Change-Id: I2f11056dc5fa8595f3835ea5f4199df6627793bf
This commit is contained in:
Adam Coldrick
@@ -18,7 +18,14 @@
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<view-title>Teams</view-title>
|
||||
<h1><i class="fa fa-sb-team"></i> Teams</h1>
|
||||
<button class="btn btn-primary btn-sm pull-bottom-right"
|
||||
ng-click="addTeam()">
|
||||
<i class="fa fa-plus"></i>
|
||||
<span class="hidden-xs">Create Team</span>
|
||||
</button>
|
||||
<h1 class="no-border no-margin-bottom">
|
||||
<i class="fa fa-sb-team"></i> Teams
|
||||
</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
|
||||
143
src/app/admin/template/team_new.html
Normal file
143
src/app/admin/template/team_new.html
Normal file
@@ -0,0 +1,143 @@
|
||||
<!--
|
||||
~ Copyright (c) 2016 Codethink Ltd
|
||||
~
|
||||
~ Licensed under the Apache License, Version 2.0 (the "License"); you may
|
||||
~ not use this file except in compliance with the License. You may obtain
|
||||
~ a copy of the License at
|
||||
~
|
||||
~ http://www.apache.org/licenses/LICENSE-2.0
|
||||
~
|
||||
~ Unless required by applicable law or agreed to in writing, software
|
||||
~ distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
||||
~ WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
||||
~ License for the specific language governing permissions and limitations
|
||||
~ under the License.
|
||||
-->
|
||||
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<button type="button" class="close" aria-hidden="true"
|
||||
ng-click="close()">×</button>
|
||||
<h3 class="panel-title">New Team</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<form class="form-horizontal"
|
||||
role="form"
|
||||
name="teamForm">
|
||||
<div class="form-group has-feedback"
|
||||
ng-class="{'has-error': teamForm.name.$invalid,
|
||||
'has-success': !teamForm.name.$invalid}">
|
||||
<label for="name" class="col-sm-3 control-label">
|
||||
Name
|
||||
</label>
|
||||
|
||||
<div class="col-sm-9">
|
||||
<input id="name"
|
||||
name="name"
|
||||
type="text"
|
||||
class="form-control"
|
||||
ng-model="team.name"
|
||||
autofocus
|
||||
required
|
||||
ng-disabled="isSaving"
|
||||
ng-pattern="PROJECT_NAME_REGEX"
|
||||
ng-minlength="3"
|
||||
maxlength="255"
|
||||
placeholder="The team name.">
|
||||
<span class="form-control-feedback"
|
||||
ng-show="teamForm.name.$invalid">
|
||||
<i class="fa fa-times fa-lg"></i>
|
||||
</span>
|
||||
<span class="form-control-feedback"
|
||||
ng-show="!teamForm.name.$invalid">
|
||||
<i class="fa fa-check fa-lg"></i>
|
||||
</span>
|
||||
<div class="help-block text-danger"
|
||||
ng-show="teamForm.name.$invalid">
|
||||
<span ng-show="teamForm.name.$error.required">
|
||||
A team name is required.
|
||||
</span>
|
||||
<span ng-show="teamForm.name.$error.pattern">
|
||||
A team name must begin with a letter, and may only
|
||||
contain letters, numbers, forward slashes, periods, and
|
||||
dashes. It should not start or end with a separator and
|
||||
must not contain two or more sequential separators.
|
||||
</span>
|
||||
<span ng-show="teamForm.name.$error.minlength">
|
||||
A team name must have at least 3 characters.
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Team Members</th>
|
||||
<th class="text-right">
|
||||
<a href ng-click="toggleAddMember()">
|
||||
<i class="fa fa-plus" ng-show="!adding"></i>
|
||||
<i class="fa fa-minus" ng-show="adding"></i>
|
||||
Add member
|
||||
</a>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-repeat="member in members">
|
||||
<td colspan="2">
|
||||
{{member.full_name}}
|
||||
<a href class="close"
|
||||
ng-click="removeUser(member)">
|
||||
×
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr ng-if="!adding && members.length < 1">
|
||||
<td colspan="2">This team has no members yet.</td>
|
||||
</tr>
|
||||
<tr ng-show="adding">
|
||||
<td colspan="2">
|
||||
<input id="user"
|
||||
type="text"
|
||||
placeholder="Click to add a user"
|
||||
ng-model="asyncUser"
|
||||
typeahead-wait-ms="200"
|
||||
typeahead-editable="false"
|
||||
typeahead="user as user.full_name for user in
|
||||
searchUsers($viewValue)"
|
||||
typeahead-loading="loadingUsers"
|
||||
typeahead-input-formatter="formatUserName($model)"
|
||||
typeahead-on-select="addUser($model)"
|
||||
class="form-control input-sm"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-12 text-right">
|
||||
<button type="button"
|
||||
class="btn btn-primary"
|
||||
ng-click="save()"
|
||||
ng-disabled="!teamForm.$valid || isSaving">
|
||||
Create Team
|
||||
</button>
|
||||
<button type="button"
|
||||
ng-click="close()"
|
||||
ng-disabled="isSaving"
|
||||
class="btn btn-default">
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user