rancher
/
ui
mirror of https://github.com/rancher/ui.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

add correct returns to sortable search matches 

also cleaned up code style

rancher/rancher#18288
This commit is contained in:
Westly Wright 2019-02-22 15:39:30 -07:00
parent 7537421efc
commit 4f0ad7ecbe
No known key found for this signature in database
GPG Key ID: 4FAB3D8673DC54A3
2 changed files with 94 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
lib/shared/addon/components/sortable-table/component.js
View File

@ -33,6 +33,7 @@ function toggleInput(node, on) {
} }
} }
} }
export function matches(fields, token, item) { export function matches(fields, token, item) {
let tokenMayBeIp = /^[0-9a-f\.:]+$/i.test(token); let tokenMayBeIp = /^[0-9a-f\.:]+$/i.test(token);
@ -66,8 +67,8 @@ export function matches(fields, token, item) {
if ( val === token ) { if ( val === token ) {
return true; return true;
} }
break;
return false;
case 'ip': case 'ip':
if ( tokenMayBeIp ) { if ( tokenMayBeIp ) {
let re = new RegExp(`(?:^|\.)${ token }(?:\.|$)`); let re = new RegExp(`(?:^|\.)${ token }(?:\.|$)`);
@ -76,18 +77,20 @@ export function matches(fields, token, item) {
return true; return true;
} }
} }
break;
return false;
case 'prefix': case 'prefix':
if ( val.indexOf(token) === 0) { if ( val.indexOf(token) === 0) {
return true; return true;
} }
break;
return false;
default: default:
if ( val.indexOf(token) >= 0) { if ( val.indexOf(token) >= 0) {
return true; return true;
} }
return false;
} }
} }
} }
@ -136,7 +139,8 @@ export default Component.extend(Sortable, StickyHeader, {
init() { init() {
this._super(...arguments); this._super(...arguments);
this.set('selectedNodes', []); set(this, 'selectedNodes', []);
if (get(this, 'bulkActions')) { if (get(this, 'bulkActions')) {
this.actionsChanged(); this.actionsChanged();
} }
@ -184,7 +188,9 @@ export default Component.extend(Sortable, StickyHeader, {
ref, ref,
items: [obj] items: [obj]
}; };
map[group] = entry; map[group] = entry;
ary.push(entry); ary.push(entry);
} }
if ( get(this, 'selectedNodes').includes(obj) ) { if ( get(this, 'selectedNodes').includes(obj) ) {
@ -199,7 +205,6 @@ export default Component.extend(Sortable, StickyHeader, {
}, },
didReceiveAttrs() { didReceiveAttrs() {
this._super(...arguments);
if (get(this, 'isVisible')) { if (get(this, 'isVisible')) {
this.triggerResize(); this.triggerResize();
} }
@ -207,11 +212,12 @@ export default Component.extend(Sortable, StickyHeader, {
actions: { actions: {
clearSearch() { clearSearch() {
this.set('searchText', ''); set(this, 'searchText', '');
}, },
executeBulkAction(name, e) { executeBulkAction(name, e) {
e.preventDefault(); e.preventDefault();
let handler = get(this, 'bulkActionHandler'); let handler = get(this, 'bulkActionHandler');
let nodes = get(this, 'selectedNodes'); let nodes = get(this, 'selectedNodes');
@ -270,12 +276,12 @@ export default Component.extend(Sortable, StickyHeader, {
if ( get(this, 'page') > 1 && from > last) { if ( get(this, 'page') > 1 && from > last) {
let page = Math.ceil(last / perPage); let page = Math.ceil(last / perPage);
this.set('page', page); set(this, 'page', page);
} }
}), }),
sortKeyChanged: observer('sortBy', function() { sortKeyChanged: observer('sortBy', function() {
this.set('page', 1); set(this, 'page', 1);
}), }),
actionsChanged: observer('selectedNodes.@each._availableActions', 'pagedContent.@each._availableActions', function() { actionsChanged: observer('selectedNodes.@each._availableActions', 'pagedContent.@each._availableActions', function() {
@ -288,6 +294,7 @@ export default Component.extend(Sortable, StickyHeader, {
if ( !nodes.length ) { if ( !nodes.length ) {
disableAll = true; disableAll = true;
let firstNode = get(this, 'pagedContent.firstObject'); let firstNode = get(this, 'pagedContent.firstObject');
if ( firstNode ) { if ( firstNode ) {
@ -307,6 +314,7 @@ export default Component.extend(Sortable, StickyHeader, {
if ( !obj ) { if ( !obj ) {
obj = $().extend(true, {}, act);// eslint-disable-line obj = $().extend(true, {}, act);// eslint-disable-line
map[act.action] = obj; map[act.action] = obj;
} }
@ -326,6 +334,7 @@ export default Component.extend(Sortable, StickyHeader, {
if ( !obj ) { if ( !obj ) {
obj = $().extend(true, {}, act); // eslint-disable-line obj = $().extend(true, {}, act); // eslint-disable-line
map[act.action] = obj; map[act.action] = obj;
} }
@ -350,7 +359,7 @@ export default Component.extend(Sortable, StickyHeader, {
}); });
} }
this.set('availableActions', out); set(this, 'availableActions', out);
}), }),
searchInPlace: computed('search', 'searchToWormhole', function() { searchInPlace: computed('search', 'searchToWormhole', function() {
return get(this, 'search') && !get(this, 'searchToWormhole'); return get(this, 'search') && !get(this, 'searchToWormhole');
@ -435,6 +444,7 @@ export default Component.extend(Sortable, StickyHeader, {
if ( searchText.length ) { if ( searchText.length ) {
subMatches = {}; subMatches = {};
let searchTokens = searchText.split(/\s*[, ]\s*/); let searchTokens = searchText.split(/\s*[, ]\s*/);
for ( let i = out.length - 1 ; i >= 0 ; i-- ) { for ( let i = out.length - 1 ; i >= 0 ; i-- ) {
@ -453,6 +463,7 @@ export default Component.extend(Sortable, StickyHeader, {
if ( token && matches(searchFields, token, row) !== expect ) { if ( token && matches(searchFields, token, row) !== expect ) {
mainFound = false; mainFound = false;
break; break;
} }
} }
@ -474,6 +485,7 @@ export default Component.extend(Sortable, StickyHeader, {
if ( matches(subFields, token, subRows[k]) !== expect ) { if ( matches(subFields, token, subRows[k]) !== expect ) {
subFound = false; subFound = false;
break; break;
} }
} }
@ -492,7 +504,7 @@ export default Component.extend(Sortable, StickyHeader, {
} }
} }
this.set('subMatches', subMatches); set(this, 'subMatches', subMatches);
return out; return out;
}), }),
@ -530,7 +542,7 @@ export default Component.extend(Sortable, StickyHeader, {
}, },
set(key, value) { set(key, value) {
var content = this.get('pagedContent').filterBy('canBulkRemove'); var content = get(this, 'pagedContent').filterBy('canBulkRemove');
if ( value ) { if ( value ) {
this.toggleMulti(content, []); this.toggleMulti(content, []);
@ -625,7 +637,7 @@ export default Component.extend(Sortable, StickyHeader, {
this.toggleMulti([node], content); this.toggleMulti([node], content);
} }
this.set('prevNode', node); set(this, 'prevNode', node);
}, },
nodesBetween(a, b) { nodesBetween(a, b) {
@ -635,7 +647,6 @@ export default Component.extend(Sortable, StickyHeader, {
if ( key ) { if ( key ) {
// Grouped has 2 levels to look through // Grouped has 2 levels to look through
let grouped = get(this, 'groupedContent'); let grouped = get(this, 'groupedContent');
let from = this.groupIdx(a); let from = this.groupIdx(a);
let to = this.groupIdx(b); let to = this.groupIdx(b);

32
lib/shared/addon/components/sortable-table/template.hbs
View File

@ -1,4 +1,4 @@
<table class="fixed grid sortable-table {{if internalBulkActions 'has-actions'}} {{if groupByKey 'bordered'}} {{if subRows 'has-sub-rows bordered'}} {{tableClassNames}}"> <table class="fixed grid sortable-table {{if internalBulkActions "has-actions"}} {{if groupByKey "bordered"}} {{if subRows "has-sub-rows bordered"}} {{tableClassNames}}">
<thead> <thead>
<tr class="fixed-header-placeholder"> <tr class="fixed-header-placeholder">
{{#if internalBulkActions}} {{#if internalBulkActions}}
@ -17,7 +17,7 @@
<div class="bulk-actions pull-left"> <div class="bulk-actions pull-left">
{{#each availableActions as |action index|}} {{#each availableActions as |action index|}}
{{#if action.enabled}} {{#if action.enabled}}
<a class="btn btn-sm bg-primary" href="#" onclick={{action 'executeBulkAction' action.action}} tabindex={{index}}> <a class="btn btn-sm bg-primary" href="#" onclick={{action "executeBulkAction" action.action}} tabindex={{index}}>
{{t action.label}} {{t action.label}}
<i class="{{action.icon}}"></i> <i class="{{action.icon}}"></i>
</a> </a>
@ -37,7 +37,7 @@
<div class="pull-left"> <div class="pull-left">
{{#if leftActions}} {{#if leftActions}}
<div class="vertical-middle pr-20"> <div class="vertical-middle pr-20">
{{yield this 'left-actions'}} {{yield this "left-actions"}}
</div> </div>
{{/if}} {{/if}}
</div> </div>
@ -46,11 +46,11 @@
{{#if search}} {{#if search}}
<div class="vertical-middle"> <div class="vertical-middle">
{{#ember-wormhole to=searchToWormhole renderInPlace=(not searchToWormhole)}} {{#ember-wormhole to=searchToWormhole renderInPlace=(not searchToWormhole)}}
<div class="{{unless searchToWormhole 'pull-right'}} search-group input-group"> <div class="{{unless searchToWormhole "pull-right"}} search-group input-group">
{{input value=searchText aria-title=(t 'generic.search') type="search" class="input-sm pull-right" placeholder=(t 'generic.search')}} {{input value=searchText aria-title=(t "generic.search") type="search" class="input-sm pull-right" placeholder=(t "generic.search")}}
{{#if searchText}} {{#if searchText}}
<span class="input-group-btn"> <span class="input-group-btn">
<button class="btn bg-transparent text-info pl-10 pr-10" {{action 'clearSearch'}}><i class="icon icon-close"/></button> <button class="btn bg-transparent text-info pl-10 pr-10" {{action "clearSearch"}}><i class="icon icon-close"/></button>
</span> </span>
{{/if}} {{/if}}
</div> </div>
@ -60,7 +60,7 @@
{{#if rightActions}} {{#if rightActions}}
<div class="vertical-middle pl-20"> <div class="vertical-middle pl-20">
{{yield this 'right-actions'}} {{yield this "right-actions"}}
</div> </div>
{{/if}} {{/if}}
</div> </div>
@ -89,7 +89,7 @@
</thead> </thead>
{{#if prefix}} {{#if prefix}}
<tbody> <tbody>
{{yield this 'prefix'}} {{yield this "prefix"}}
</tbody> </tbody>
{{/if}} {{/if}}
@ -97,33 +97,33 @@
{{#if extraGroups.length}} {{#if extraGroups.length}}
{{#each extraGroups as |group|}} {{#each extraGroups as |group|}}
<tbody class="group"> <tbody class="group">
{{yield this 'group' group}} {{yield this "group" group}}
{{yield this 'norows'}} {{yield this "norows"}}
</tbody> </tbody>
{{/each}} {{/each}}
{{/if}} {{/if}}
{{#each groupedContent as |group|}} {{#each groupedContent as |group|}}
<tbody class="group"> <tbody class="group">
{{yield this 'group' group}} {{yield this "group" group}}
{{#each group.items as |row|}} {{#each group.items as |row|}}
{{yield this 'row' row dt (array-includes childFilterNodes row.id)}} {{yield this "row" row dt (array-includes childFilterNodes row.id)}}
{{/each}} {{/each}}
</tbody> </tbody>
{{else}} {{else}}
{{yield this (if arranged.length 'nomatch' 'norows')}} {{yield this (if arranged.length "nomatch" "norows")}}
{{/each}} {{/each}}
{{else}} {{else}}
<tbody> <tbody>
{{#each pagedContent as |row|}} {{#each pagedContent as |row|}}
{{yield this 'row' row dt (array-includes childFilterNodes row.id)}} {{yield this "row" row dt (array-includes childFilterNodes row.id)}}
{{else}} {{else}}
{{yield this (if arranged.length 'nomatch' 'norows')}} {{yield this (if arranged.length "nomatch" "norows")}}
{{/each}} {{/each}}
</tbody> </tbody>
{{/if}} {{/if}}
{{#if suffix}} {{#if suffix}}
{{yield this 'suffix'}} {{yield this "suffix"}}
{{/if}} {{/if}}
</table> </table>