Add new tables to storage and project edit

This commit is contained in:
Westly Wright 2017-03-07 14:02:58 -07:00
parent 148a555957
commit b34104b4cd
No known key found for this signature in database
GPG Key ID: 90C6F54EB2513CAE
6 changed files with 135 additions and 121 deletions

View File

@ -2,7 +2,7 @@ import Ember from 'ember';
export default Ember.Component.extend({
model: null,
tagName: 'TR',
tagName: '',
projects: Ember.inject.service(),

View File

@ -2,5 +2,5 @@ import Ember from 'ember';
export default Ember.Component.extend({
model: null,
tagName: 'TR',
tagName: '',
});

View File

@ -12,6 +12,27 @@ export default Ember.Component.extend(Sortable, {
name: ['displayName','id'],
mounts: ['mounts.length','displayName','id'],
},
headers: [
{
name: 'state',
sort: ['state','displayName','id'],
translationKey: 'generic.state',
width: '115',
},
{
name: 'name',
sort: ['displayName','id'],
translationKey: 'storagePoolSection.models.table.header.volumeName',
width: '350',
},
{
translationKey: 'storagePoolSection.models.table.header.mounts',
},
{
isActions: true,
width: '75',
},
],
init: function() {

View File

@ -39,72 +39,54 @@
{{#if model.volumes.length}}
<div class="subsection gutter col span-9 col-full-height">
<h6>{{t 'storagePoolSection.volumes.header'}}</h6>
<table class="grid" style="margin-bottom: 0">
<thead>
<tr>
{{sortable-th sortable=this action="changeSort" name="state" width="115" label="generic.state"}}
{{sortable-th sortable=this action="changeSort" name="name" width="350" label="storagePoolSection.models.table.header.volumeName"}}
<th>{{t 'storagePoolSection.models.table.header.mounts'}}</th>
<th width="75">&nbsp;</th>
</tr>
</thead>
<tbody>
{{#each arranged as |vol|}}
<tr>
<td class="state">
{{badge-state model=vol}}
</td>
<td class="force-wrap">
{{#tooltip-element type="tooltip-basic" model=vol tooltipTemplate="tooltip-storage" tooltipFor="storagePoolSection"}}
<p class="hand force-wrap clip m-0">{{vol.displayName}}</p> <i classs="icon icon-info"></i>
{{/tooltip-element}}
</td>
<td class="force-wrap">
{{#if vol.mounts.length}}
{{#each vol.mounts as |mount|}}
<div>
{{~#if mount.instance.isVm~}}
{{#link-to "virtualmachine" mount.instanceId}}{{mount.instance.displayName}}{{/link-to}}
{{~else~}}
{{#link-to "container" mount.instanceId}}{{mount.instance.displayName}}{{/link-to}}
{{~/if~}}
: {{mount.path}}
{{#if (eq mount.permissions "ro")}}
<span class="text-muted">{{t 'storagePoolSection.readOnly'}}</span>
{{/if}}
</div>
{{/each}}
{{else}}
<span class="text-muted">{{t 'generic.none'}}</span>
{{/if}}
</td>
<td class="actions wide">
{{action-menu model=vol}}
</td>
</tr>
{{#if vol.snapshots.length}}
<tr class="nohover">
<td colspan="4" class="subtable pl-10">
<table class="grid fixed no-lines">
<thead>
<tr>
<th width="125">{{t 'storagePoolSection.models.table.header.snapshotState'}}</th>
<th>{{t 'storagePoolSection.models.table.header.snapshotName'}}</th>
<th width="70">&nbsp;</th>
</tr>
</thead>
<tbody>
{{#each vol.snapshots as |snapshot|}}
{{snapshot-section volume=vol snapshot=snapshot}}
{{/each}}
</tbody>
</table>
</td>
</tr>
{{#sortable-table
classNames="grid mb-0 sortable-table"
bulkActions=false
paging=false
search=false
sortBy=sortBy
descending=descending
headers=headers
body=model
as |sortable kind vol|
}}
{{#if (eq kind "row")}}
<td class="state">
{{badge-state model=vol}}
</td>
<td class="force-wrap">
{{#tooltip-element type="tooltip-basic" model=vol tooltipTemplate="tooltip-storage" tooltipFor="storagePoolSection"}}
<p class="hand force-wrap clip m-0">{{vol.displayName}}</p> <i classs="icon icon-info"></i>
{{/tooltip-element}}
</td>
<td class="force-wrap">
{{#if vol.mounts.length}}
{{#each vol.mounts as |mount|}}
<div>
{{~#if mount.instance.isVm~}}
{{#link-to "virtualmachine" mount.instanceId}}{{mount.instance.displayName}}{{/link-to}}
{{~else~}}
{{#link-to "container" mount.instanceId}}{{mount.instance.displayName}}{{/link-to}}
{{~/if~}}
: {{mount.path}}
{{#if (eq mount.permissions "ro")}}
<span class="text-muted">{{t 'storagePoolSection.readOnly'}}</span>
{{/if}}
</div>
{{/each}}
{{else}}
<span class="text-muted">{{t 'generic.none'}}</span>
{{/if}}
{{/each}}
</tbody>
</table>
</td>
<td class="actions wide">
{{action-menu model=vol}}
</td>
{{else if (eq kind "norows")}}
<tr>
<td colspan="{{headers.length}}" class="text-center text-muted">{{t 'storagePoolSection.volumes.none'}}</td>
</tr>
{{/if}}
{{/sortable-table}}
</div>
{{else}}
<div class="text-muted text-center pl-10">{{t 'storagePoolSection.volumes.none'}}</div>

View File

@ -1,10 +1,9 @@
import Ember from 'ember';
import Sortable from 'ui/mixins/sortable';
import C from 'ui/utils/constants';
import NewOrEdit from 'ui/mixins/new-or-edit';
import { sortInsensitiveBy } from 'ui/utils/sort';
export default Ember.Component.extend(NewOrEdit, Sortable, {
export default Ember.Component.extend(NewOrEdit, {
projects: Ember.inject.service(),
access: Ember.inject.service(),
growl: Ember.inject.service(),
@ -18,15 +17,30 @@ export default Ember.Component.extend(NewOrEdit, Sortable, {
editing: false,
tab: 'access',
primaryResource: Ember.computed.alias('project'),
sortableContent: Ember.computed.alias('project.projectMembers'),
sortBy: 'name',
sorts: {
name: ['name', 'externalId'],
type: ['externalIdType','externalId'],
role: ['role','externalId'],
},
headers: [
{
name: 'name',
sort: ['name', 'externalId'],
translationKey: 'generic.name',
},
{
name: 'type',
sort: ['externalIdType','externalId'],
translationKey: 'generic.type',
},
{
name: 'role',
sort: ['role','externalId'],
translationKey: 'generic.role',
width: '',
},
{
sort: [],
translationKey: '',
width: '40',
},
],
stacks: null,
actions: {

View File

@ -64,59 +64,56 @@
<hr/>
<div class="well">
{{#if (and accessEnabled showEdit)}}
<div class="inline-form">
<div class="inline-form mb-20">
{{input-identity action="checkMember" onError="error"}}
</div>
{{/if}}
{{#if accessEnabled}}
<table class="grid fixed" style="margin-bottom: 0;">
<thead>
<tr>
{{sortable-th sortable=this action="changeSort" name="name" label="generic.name"}}
{{sortable-th sortable=this action="changeSort" name="type" label="generic.type"}}
{{sortable-th sortable=this action="changeSort" name="role" label="generic.role"}}
{{#if showEdit}}<th width="40">&nbsp;</th>{{/if}}
</tr>
</thead>
<tbody>
{{#each arranged as |member|}}
<tr>
{{#sortable-table
classNames="grid fixed mb-0 sortable-table"
bulkActions=false
paging=false
search=false
sortBy=sortBy
headers=headers
body=project.projectMembers
as |sortable kind member|
}}
{{#if (eq kind "row")}}
<td>
{{identity-block identity=member}}
</td>
<td>{{member.displayType}}</td>
<td>
{{#if showEdit}}
<select class="form-control input-sm" onchange={{action (mut member.role) value="target.value"}}>
{{#each roleOptions as |choice|}}
<option value={{choice.value}} selected={{eq member.role choice.value}}>{{t choice.label}}</option>
{{/each}}
</select>
{{else}}
{{uc-first member.role}}
{{/if}}
</td>
{{#if showEdit}}
<td>
{{identity-block identity=member}}
</td>
<td>{{member.displayType}}</td>
<td>
{{#if showEdit}}
<select class="form-control input-sm" onchange={{action (mut member.role) value="target.value"}}>
{{#each roleOptions as |choice|}}
<option value={{choice.value}} selected={{eq member.role choice.value}}>{{t choice.label}}</option>
{{/each}}
</select>
{{#if accessEnabled}}
<button class="btn bg-primary btn-sm pull-right gh-action" {{action "removeMember" member}}><i class="icon icon-minus"/></button>
{{else}}
{{uc-first member.role}}
&nbsp;
{{/if}}
</td>
{{#if showEdit}}
<td>
{{#if accessEnabled}}
<button class="btn bg-primary btn-sm pull-right gh-action" {{action "removeMember" member}}><i class="icon icon-minus"/></button>
{{else}}
&nbsp;
{{/if}}
</td>
{{/if}}
</tr>
{{else}}
<tr>
<td colspan="3" class="text-center text-muted">
{{t 'viewEditProject.showEdit.noMembers'}}
</td>
</tr>
{{/each}}
</tbody>
</table>
<hr class="m-0" />
{{/if}}
{{else if (eq kind "norows")}}
<tr>
<td colspan="{{headers.length}}" class="text-center text-muted">
{{t 'viewEditProject.showEdit.noMembers'}}
</td>
</tr>
{{/if}}
{{/sortable-table}}
<hr />
{{else}}
<p class="text-info text-center">
{{format-html-message 'viewEditProject.helpBlock'}}