Initial board settings work - new component

This commit is contained in:
kiswa 2016-08-03 20:46:01 +00:00
parent 76c39e8ab6
commit 32bd9246a5
6 changed files with 135 additions and 97 deletions

View File

@ -0,0 +1,99 @@
<section>
<h2>Board Administration</h2>
<div class="row">
<h3>Current Boards</h3>
<div class="small right filters">
<label class="inline right">
Show By User:
<select class="autosize">
<option>Any User</option>
<option>admin</option>
</select>
</label>
<label class="inline right">
Filter By:
<select class="autosize">
<option>All Boards</option>
<option>Active</option>
<option>Inactive</option>
</select>
</label>
<label class="inline right">
Sort By:
<select class="autosize">
<option>Board Name</option>
<option>Creation Date</option>
</select>
</label>
</div>
<table class="alternating">
<thead>
<tr>
<th>Name</th>
<th>Columns</th>
<th>Categories</th>
<th>Users</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="boards/1">Example Board</a></td>
<td>
<ul>
<li>Col1<span class="badge" title="Item Count">3</span></li>
<li>Col2<span class="badge" title="Item Count">0</span></li>
<li>Col3<span class="badge" title="Item Count">5</span></li>
</ul>
</td>
<td>
<ul>
<li>Cat1<span class="badge" title="Default Task Color" style="background-color:#debee8">&nbsp;</span></li>
<li>Cat2<span class="badge" title="Default Task Color" style="background-color:#bee7f4">&nbsp;</span></li>
<li>Cat3<span class="badge" title="Default Task Color" style="background-color:#ffffe0">&nbsp;</span></li>
</ul>
</td>
<td>
<ul>
<li>admin</li>
<li>other_guy</li>
</ul>
</td>
<td>
<a href=""><i class="icon icon-edit"></i></a>
<a href=""><i class="icon icon-trash-empty"></i></a>
<label><input type="checkbox" checked> Active</label>
</td>
</tr>
<tr>
<td><a href="boards/2">Other Board</a></td>
<td>
<ul>
<li>One<span class="badge">0</span></li>
</ul>
</td>
<td></td>
<td>
<ul>
<li>admin</li>
</ul>
</td>
<td>
<a href=""><i class="icon icon-edit"></i></a>
<a href=""><i class="icon icon-trash-empty"></i></a>
<label><input type="checkbox" checked> Active</label>
</td>
</tr>
</tbody>
</table>
<button>
<i class="icon icon-plus"></i>
Add Board
</button>
</div>
</section>

View File

@ -0,0 +1,18 @@
import { Component } from '@angular/core';
import {
ApiResponse,
Modal,
Notification,
ModalService,
NotificationsService
} from '../../shared/index';
@Component({
selector: 'tb-board-settings',
templateUrl: 'app/settings/board-settings/board-settings.component.html',
directives: [ Modal ]
})
export class BoardSettings {
}

View File

@ -1,3 +1,4 @@
export * from './user-admin/user-admin.component';
export * from './user-settings/user-settings.component';
export * from './board-settings/board-settings.component';

View File

@ -7,101 +7,7 @@
</div>
<div class="half-page">
<section>
<h2>Board Administration</h2>
<div class="row">
<h3>Current Boards</h3>
<div class="small right">
<label class="inline">
Sort By:
<select class="autosize">
<option>Board Name</option>
<option>Creation Date</option>
</select>
</label>
<label class="inline">
Filter By:
<select class="autosize">
<option>All Boards</option>
<option>Active</option>
<option>Inactive</option>
</select>
</label>
<label class="inline">
Show By User:
<select class="autosize">
<option>Any User</option>
<option>admin</option>
</select>
</label>
</div>
<table class="alternating">
<thead>
<tr>
<th>Name</th>
<th>Columns</th>
<th>Categories</th>
<th>Users</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="boards/1">Example Board</a></td>
<td>
<ul>
<li>Col1<span class="badge" title="Item Count">3</span></li>
<li>Col2<span class="badge" title="Item Count">0</span></li>
<li>Col3<span class="badge" title="Item Count">5</span></li>
</ul>
</td>
<td>
<ul>
<li>Cat1<span class="badge" title="Default Task Color" style="background-color:#debee8">&nbsp;</span></li>
<li>Cat2<span class="badge" title="Default Task Color" style="background-color:#bee7f4">&nbsp;</span></li>
<li>Cat3<span class="badge" title="Default Task Color" style="background-color:#ffffe0">&nbsp;</span></li>
</ul>
</td>
<td>
<ul>
<li>admin</li>
<li>other_guy</li>
</ul>
</td>
<td>
<a href=""><i class="icon icon-edit"></i></a>
<a href=""><i class="icon icon-trash-empty"></i></a>
<label><input type="checkbox" checked> Active</label>
</td>
</tr>
<tr>
<td><a href="boards/2">Other Board</a></td>
<td>
<ul>
<li>One<span class="badge">0</span></li>
</ul>
</td>
<td></td>
<td>
<ul>
<li>admin</li>
</ul>
</td>
<td>
<a href=""><i class="icon icon-edit"></i></a>
<a href=""><i class="icon icon-trash-empty"></i></a>
<label><input type="checkbox" checked> Active</label>
</td>
</tr>
</tbody>
</table>
<button>Add Board</button>
</div>
</section>
<tb-board-settings></tb-board-settings>
<section>
<h2>Automatic Actions</h2>

View File

@ -1,12 +1,21 @@
import { Component } from '@angular/core';
import { TopNav } from '../shared/index';
import { UserSettings, UserAdmin } from './index';
import {
UserSettings,
UserAdmin,
BoardSettings
} from './index';
@Component({
selector: 'tb-settings',
templateUrl: 'app/settings/settings.component.html',
directives: [ TopNav, UserSettings, UserAdmin ]
directives: [
TopNav,
UserSettings,
UserAdmin,
BoardSettings
]
})
export class Settings {
}

View File

@ -74,6 +74,11 @@
}
}
.filters {
margin-top: -2.5em;
max-width: 75%;
}
.hold-bottom {
bottom: 7px;
position: absolute;