mirror of https://github.com/rancher/ui.git
Add new tables to storage and project edit
This commit is contained in:
parent
148a555957
commit
b34104b4cd
|
|
@ -2,7 +2,7 @@ import Ember from 'ember';
|
|||
|
||||
export default Ember.Component.extend({
|
||||
model: null,
|
||||
tagName: 'TR',
|
||||
tagName: '',
|
||||
|
||||
projects: Ember.inject.service(),
|
||||
|
||||
|
|
|
|||
|
|
@ -2,5 +2,5 @@ import Ember from 'ember';
|
|||
|
||||
export default Ember.Component.extend({
|
||||
model: null,
|
||||
tagName: 'TR',
|
||||
tagName: '',
|
||||
});
|
||||
|
|
|
|||
|
|
@ -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() {
|
||||
|
|
|
|||
|
|
@ -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"> </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"> </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>
|
||||
|
|
|
|||
|
|
@ -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: {
|
||||
|
|
|
|||
|
|
@ -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"> </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}}
|
||||
|
||||
{{/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}}
|
||||
|
||||
{{/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'}}
|
||||
|
|
|
|||
Loading…
Reference in New Issue