Merge "Add pagination to Security Groups table in Launch Instance wizard"
This commit is contained in:
commit
19de1f16ba
openstack_dashboard/dashboards/project/static/dashboard/project/workflow/launch-instance/security-groups
@ -1,4 +1,4 @@
|
|||||||
<table st-table="row.security_group_rules" class="table table-condensed table-rsp security-group-details">
|
<table st-table="item.security_group_rules" class="table table-condensed table-rsp security-group-details">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th st-sort="direction" st-sort-default translate>Direction</th>
|
<th st-sort="direction" st-sort-default translate>Direction</th>
|
||||||
@ -10,7 +10,7 @@
|
|||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr ng-repeat="d in row.security_group_rules">
|
<tr ng-repeat="d in item.security_group_rules">
|
||||||
<td>{$ d.direction | noValue $}</td>
|
<td>{$ d.direction | noValue $}</td>
|
||||||
<td>{$ d.ethertype | noValue $}</td>
|
<td>{$ d.ethertype | noValue $}</td>
|
||||||
<td>{$ d.protocol | noValue $}</td>
|
<td>{$ d.protocol | noValue $}</td>
|
||||||
|
@ -37,16 +37,24 @@
|
|||||||
|
|
||||||
ctrl.tableData = {
|
ctrl.tableData = {
|
||||||
available: launchInstanceModel.securityGroups,
|
available: launchInstanceModel.securityGroups,
|
||||||
allocated: launchInstanceModel.newInstanceSpec.security_groups,
|
allocated: launchInstanceModel.newInstanceSpec.security_groups
|
||||||
displayedAvailable: [],
|
|
||||||
displayedAllocated: []
|
|
||||||
};
|
};
|
||||||
|
|
||||||
ctrl.tableDetails = basePath + 'security-groups/security-group-details.html';
|
ctrl.availableTableConfig = {
|
||||||
|
selectAll: false,
|
||||||
|
trackId: 'id',
|
||||||
|
detailsTemplateUrl: basePath + 'security-groups/security-group-details.html',
|
||||||
|
columns: [
|
||||||
|
{id: 'name', title: gettext('Name'), priority: 1},
|
||||||
|
{id: 'description', title: gettext('Description'), priority: 2}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
ctrl.allocatedTableConfig = angular.copy(ctrl.availableTableConfig);
|
||||||
|
ctrl.allocatedTableConfig.noItemsMessage = gettext(
|
||||||
|
'Select one or more security groups from the available groups below.');
|
||||||
|
|
||||||
ctrl.tableHelp = {
|
ctrl.tableHelp = {
|
||||||
/*eslint-disable max-len */
|
|
||||||
noneAllocText: gettext('Select one or more security groups from the available groups below.'),
|
|
||||||
/*eslint-enable max-len */
|
/*eslint-enable max-len */
|
||||||
availHelpText: gettext('Select one or more')
|
availHelpText: gettext('Select one or more')
|
||||||
};
|
};
|
||||||
|
@ -1,106 +1,13 @@
|
|||||||
<div ng-controller="LaunchInstanceSecurityGroupsController as ctrl">
|
<div ng-controller="LaunchInstanceSecurityGroupsController as ctrl">
|
||||||
<p class="step-description" translate>Select the security groups to launch the instance in.</p>
|
<p class="step-description" translate>Select the security groups to launch the instance in.</p>
|
||||||
|
|
||||||
<transfer-table tr-model="ctrl.tableData"
|
<transfer-table tr-model="ctrl.tableData" help-text="ctrl.tableHelp" limits="ctrl.tableLimits" clone-content>
|
||||||
help-text="ctrl.tableHelp"
|
<hz-dynamic-table
|
||||||
limits="ctrl.tableLimits">
|
config="$isAvailableTable ? ctrl.availableTableConfig : ctrl.allocatedTableConfig"
|
||||||
|
items="$isAvailableTable ? ($sourceItems | filterAvailable:trCtrl.allocatedIds) : $sourceItems"
|
||||||
<!-- Security Groups Allocated -->
|
item-actions="trCtrl.itemActions"
|
||||||
<allocated>
|
filter-facets="$isAvailableTable && ctrl.filterFacets"
|
||||||
<table st-table="ctrl.tableData.displayedAllocated"
|
table="ctrl">
|
||||||
st-safe-src="ctrl.tableData.allocated" hz-table
|
</hz-dynamic-table>
|
||||||
class="table table-striped table-rsp table-detail">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th class="expander"></th>
|
|
||||||
<th st-sort="name" st-sort-default class="rsp-p1" translate>Name</th>
|
|
||||||
<th st-sort="description" class="rsp-p2" translate>Description</th>
|
|
||||||
<th></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr ng-if="ctrl.tableData.allocated.length === 0">
|
|
||||||
<td colspan="8">
|
|
||||||
<div class="no-rows-help">
|
|
||||||
{$ ::trCtrl.helpText.noneAllocText $}
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr ng-repeat-start="row in ctrl.tableData.displayedAllocated track by row.id">
|
|
||||||
<td class="expander">
|
|
||||||
<span class="fa fa-chevron-right" hz-expand-detail
|
|
||||||
title="{$ ::trCtrl.helpText.expandDetailsText $}"></span>
|
|
||||||
</td>
|
|
||||||
<td class="rsp-p1 word-break">{$ row.name $}</td>
|
|
||||||
<td class="rsp-p2">{$ row.description $}</td>
|
|
||||||
<td class="actions_column">
|
|
||||||
<action-list>
|
|
||||||
<action action-classes="'btn btn-default'"
|
|
||||||
callback="trCtrl.deallocate" item="row">
|
|
||||||
<span class="fa fa-arrow-down"></span>
|
|
||||||
</action>
|
|
||||||
</action-list>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr ng-repeat-end class="detail-row">
|
|
||||||
<td></td>
|
|
||||||
<td class="detail" colspan="3" ng-include="ctrl.tableDetails">
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</allocated>
|
|
||||||
|
|
||||||
<!-- Security Groups Available -->
|
|
||||||
<available>
|
|
||||||
<hz-magic-search-context filter-facets="ctrl.filterFacets">
|
|
||||||
<hz-magic-search-bar></hz-magic-search-bar>
|
|
||||||
<table st-table="ctrl.tableData.displayedAvailable"
|
|
||||||
st-magic-search
|
|
||||||
st-safe-src="ctrl.tableData.available"
|
|
||||||
hz-table class="table table-striped table-rsp table-detail">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th class="expander"></th>
|
|
||||||
<th st-sort="name" st-sort-default class="rsp-p1" translate>Name</th>
|
|
||||||
<th st-sort="description" class="rsp-p1" translate>Description</th>
|
|
||||||
<th></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr ng-if="trCtrl.numAvailable() === 0">
|
|
||||||
<td colspan="8">
|
|
||||||
<div class="no-rows-help">
|
|
||||||
{$ ::trCtrl.helpText.noneAvailText $}
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr ng-repeat-start="row in ctrl.tableData.displayedAvailable track by row.id"
|
|
||||||
ng-if="!trCtrl.allocatedIds[row.id]">
|
|
||||||
<td class="expander">
|
|
||||||
<span class="fa fa-chevron-right" hz-expand-detail
|
|
||||||
title="{$ ::trCtrl.helpText.expandDetailsText $}"></span>
|
|
||||||
</td>
|
|
||||||
<td class="rsp-p1 word-break">{$ row.name$}</td>
|
|
||||||
<td class="rsp-p1">{$ row.description $}</td>
|
|
||||||
<td class="actions_column">
|
|
||||||
<action-list>
|
|
||||||
<action action-classes="'btn btn-default'"
|
|
||||||
callback="trCtrl.allocate" item="row">
|
|
||||||
<span class="fa fa-arrow-up"></span>
|
|
||||||
</action>
|
|
||||||
</action-list>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr ng-repeat-end class="detail-row" ng-if="!trCtrl.allocatedIds[row.id]">
|
|
||||||
<td class="detail" colspan="4" ng-include="ctrl.tableDetails">
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</hz-magic-search-context>
|
|
||||||
</available>
|
|
||||||
|
|
||||||
</transfer-table> <!-- End Security Groups Transfer Table -->
|
</transfer-table> <!-- End Security Groups Transfer Table -->
|
||||||
|
|
||||||
</div> <!-- End Controller -->
|
</div> <!-- End Controller -->
|
||||||
|
@ -45,21 +45,22 @@
|
|||||||
|
|
||||||
it('sets table data to appropriate scoped items', function() {
|
it('sets table data to appropriate scoped items', function() {
|
||||||
expect(ctrl.tableData).toBeDefined();
|
expect(ctrl.tableData).toBeDefined();
|
||||||
expect(Object.keys(ctrl.tableData).length).toBe(4);
|
expect(Object.keys(ctrl.tableData).length).toBe(2);
|
||||||
expect(ctrl.tableData.available).toEqual([ 'group 1', 'group 2' ]);
|
expect(ctrl.tableData.available).toEqual([ 'group 1', 'group 2' ]);
|
||||||
expect(ctrl.tableData.allocated).toEqual([ 'group 1' ]);
|
expect(ctrl.tableData.allocated).toEqual([ 'group 1' ]);
|
||||||
expect(ctrl.tableData.displayedAvailable).toEqual([]);
|
|
||||||
expect(ctrl.tableData.displayedAllocated).toEqual([]);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
it('defines table details template', function() {
|
it('defines table details template', function() {
|
||||||
expect(ctrl.tableDetails).toBeDefined();
|
expect(ctrl.availableTableConfig.detailsTemplateUrl).toBeDefined();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('defines a custom no items message for allocated table', function() {
|
||||||
|
expect(ctrl.allocatedTableConfig.noItemsMessage).toBeDefined();
|
||||||
});
|
});
|
||||||
|
|
||||||
it('defines table help', function() {
|
it('defines table help', function() {
|
||||||
expect(ctrl.tableHelp).toBeDefined();
|
expect(ctrl.tableHelp).toBeDefined();
|
||||||
expect(Object.keys(ctrl.tableHelp).length).toBe(2);
|
expect(Object.keys(ctrl.tableHelp).length).toBe(1);
|
||||||
expect(ctrl.tableHelp.noneAllocText).toBeDefined();
|
|
||||||
expect(ctrl.tableHelp.availHelpText).toBeDefined();
|
expect(ctrl.tableHelp.availHelpText).toBeDefined();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user