fix(searchbar): smart-table.tableQ integration
gitea/salix/pipeline/head There was a failure building this commit
Details
gitea/salix/pipeline/head There was a failure building this commit
Details
This commit is contained in:
parent
4df99a82e1
commit
84003ab09c
|
@ -392,10 +392,16 @@ export default {
|
||||||
originCheckbox: '.vn-popover.shown vn-horizontal:nth-child(3) > vn-check[label="Origin"]',
|
originCheckbox: '.vn-popover.shown vn-horizontal:nth-child(3) > vn-check[label="Origin"]',
|
||||||
buyerCheckbox: '.vn-popover.shown vn-horizontal:nth-child(3) > vn-check[label="Buyer"]',
|
buyerCheckbox: '.vn-popover.shown vn-horizontal:nth-child(3) > vn-check[label="Buyer"]',
|
||||||
densityCheckbox: '.vn-popover.shown vn-horizontal:nth-child(3) > vn-check[label="Density"]',
|
densityCheckbox: '.vn-popover.shown vn-horizontal:nth-child(3) > vn-check[label="Density"]',
|
||||||
saveFieldsButton: '.vn-popover.shown vn-button[label="Save"] > button'
|
saveFieldsButton: '.vn-popover.shown vn-button[label="Save"] > button',
|
||||||
|
openAdvancedSearchButton: 'vn-searchbar .append vn-icon[icon="arrow_drop_down"]',
|
||||||
|
advancedSearchItemType: 'vn-item-search-panel vn-autocomplete[ng-model="filter.typeFk"]',
|
||||||
|
advancedSearchButton: 'vn-item-search-panel button[type=submit]',
|
||||||
|
advancedSmartTableButton: 'vn-item-index vn-button[icon="search"]',
|
||||||
|
advancedSmartTableGrouping: 'vn-item-index vn-textfield[name=grouping]',
|
||||||
},
|
},
|
||||||
itemFixedPrice: {
|
itemFixedPrice: {
|
||||||
add: 'vn-fixed-price vn-icon-button[icon="add_circle"]',
|
add: 'vn-fixed-price vn-icon-button[icon="add_circle"]',
|
||||||
|
firstItemID: 'vn-fixed-price tr:nth-child(2) vn-autocomplete[ng-model="price.itemFk"]',
|
||||||
fourthFixedPrice: 'vn-fixed-price tr:nth-child(5)',
|
fourthFixedPrice: 'vn-fixed-price tr:nth-child(5)',
|
||||||
fourthItemID: 'vn-fixed-price tr:nth-child(5) vn-autocomplete[ng-model="price.itemFk"]',
|
fourthItemID: 'vn-fixed-price tr:nth-child(5) vn-autocomplete[ng-model="price.itemFk"]',
|
||||||
fourthWarehouse: 'vn-fixed-price tr:nth-child(5) vn-autocomplete[ng-model="price.warehouseFk"]',
|
fourthWarehouse: 'vn-fixed-price tr:nth-child(5) vn-autocomplete[ng-model="price.warehouseFk"]',
|
||||||
|
@ -405,7 +411,8 @@ export default {
|
||||||
fourthMinPrice: 'vn-fixed-price tr:nth-child(5) > td:nth-child(6) > vn-input-number[ng-model="price.minPrice"]',
|
fourthMinPrice: 'vn-fixed-price tr:nth-child(5) > td:nth-child(6) > vn-input-number[ng-model="price.minPrice"]',
|
||||||
fourthStarted: 'vn-fixed-price tr:nth-child(5) vn-date-picker[ng-model="price.started"]',
|
fourthStarted: 'vn-fixed-price tr:nth-child(5) vn-date-picker[ng-model="price.started"]',
|
||||||
fourthEnded: 'vn-fixed-price tr:nth-child(5) vn-date-picker[ng-model="price.ended"]',
|
fourthEnded: 'vn-fixed-price tr:nth-child(5) vn-date-picker[ng-model="price.ended"]',
|
||||||
fourthDeleteIcon: 'vn-fixed-price tr:nth-child(5) > td:nth-child(9) > vn-icon-button[icon="delete"]'
|
fourthDeleteIcon: 'vn-fixed-price tr:nth-child(5) > td:nth-child(9) > vn-icon-button[icon="delete"]',
|
||||||
|
orderColumnId: 'vn-fixed-price th[field="itemFk"]'
|
||||||
},
|
},
|
||||||
itemCreateView: {
|
itemCreateView: {
|
||||||
temporalName: 'vn-item-create vn-textfield[ng-model="$ctrl.item.provisionalName"]',
|
temporalName: 'vn-item-create vn-textfield[ng-model="$ctrl.item.provisionalName"]',
|
||||||
|
|
|
@ -0,0 +1,77 @@
|
||||||
|
import selectors from '../../helpers/selectors.js';
|
||||||
|
import getBrowser from '../../helpers/puppeteer';
|
||||||
|
|
||||||
|
describe('SmartTable SearchBar integration', () => {
|
||||||
|
let browser;
|
||||||
|
let page;
|
||||||
|
beforeAll(async() => {
|
||||||
|
browser = await getBrowser();
|
||||||
|
page = browser.page;
|
||||||
|
await page.loginAndModule('salesPerson', 'item');
|
||||||
|
await page.waitToClick(selectors.globalItems.searchButton);
|
||||||
|
});
|
||||||
|
|
||||||
|
afterAll(async() => {
|
||||||
|
await browser.close();
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('as filters', () => {
|
||||||
|
it('should search by type in searchBar', async() => {
|
||||||
|
await page.waitToClick(selectors.itemsIndex.openAdvancedSearchButton);
|
||||||
|
await page.autocompleteSearch(selectors.itemsIndex.advancedSearchItemType, 'Anthurium');
|
||||||
|
await page.waitToClick(selectors.itemsIndex.advancedSearchButton);
|
||||||
|
await page.waitForNumberOfElements(selectors.itemsIndex.searchResult, 3);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should reload page and have same results', async() => {
|
||||||
|
await page.reload({
|
||||||
|
waitUntil: 'networkidle2'
|
||||||
|
});
|
||||||
|
|
||||||
|
await page.waitForNumberOfElements(selectors.itemsIndex.searchResult, 3);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should search by grouping in smartTable', async() => {
|
||||||
|
await page.waitToClick(selectors.itemsIndex.advancedSmartTableButton);
|
||||||
|
await page.write(selectors.itemsIndex.advancedSmartTableGrouping, '1');
|
||||||
|
await page.keyboard.press('Enter');
|
||||||
|
await page.waitForNumberOfElements(selectors.itemsIndex.searchResult, 2);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should now reload page and have same results', async() => {
|
||||||
|
await page.reload({
|
||||||
|
waitUntil: 'networkidle2'
|
||||||
|
});
|
||||||
|
|
||||||
|
await page.waitForNumberOfElements(selectors.itemsIndex.searchResult, 2);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('as orders', () => {
|
||||||
|
it('should order by first id', async() => {
|
||||||
|
await page.loginAndModule('developer', 'item');
|
||||||
|
await page.accessToSection('item.fixedPrice');
|
||||||
|
await page.doSearch();
|
||||||
|
|
||||||
|
const result = await page.waitToGetProperty(selectors.itemFixedPrice.firstItemID, 'value');
|
||||||
|
|
||||||
|
expect(result).toEqual('1');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should order by last id', async() => {
|
||||||
|
await page.waitToClick(selectors.itemFixedPrice.orderColumnId);
|
||||||
|
const result = await page.waitToGetProperty(selectors.itemFixedPrice.firstItemID, 'value');
|
||||||
|
|
||||||
|
expect(result).toEqual('13');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should reload page and have same order', async() => {
|
||||||
|
await page.reload({
|
||||||
|
waitUntil: 'networkidle2'
|
||||||
|
});
|
||||||
|
const result = await page.waitToGetProperty(selectors.itemFixedPrice.firstItemID, 'value');
|
||||||
|
|
||||||
|
expect(result).toEqual('13');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
|
@ -1,7 +1,7 @@
|
||||||
import selectors from '../../helpers/selectors.js';
|
import selectors from '../../helpers/selectors.js';
|
||||||
import getBrowser from '../../helpers/puppeteer';
|
import getBrowser from '../../helpers/puppeteer';
|
||||||
|
|
||||||
fdescribe('Item summary path', () => {
|
describe('Item summary path', () => {
|
||||||
let browser;
|
let browser;
|
||||||
let page;
|
let page;
|
||||||
beforeAll(async() => {
|
beforeAll(async() => {
|
||||||
|
|
|
@ -99,6 +99,18 @@ export default class CrudModel extends ModelProxy {
|
||||||
return this.refresh();
|
return this.refresh();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Applies a new filter to the model.
|
||||||
|
*
|
||||||
|
* @param {Object} params Custom parameters
|
||||||
|
* @return {Promise} The request promise
|
||||||
|
*/
|
||||||
|
|
||||||
|
applyParams(params) {
|
||||||
|
this.userParams = params;
|
||||||
|
return this.refresh();
|
||||||
|
}
|
||||||
|
|
||||||
removeFilter() {
|
removeFilter() {
|
||||||
return this.applyFilter(null, null);
|
return this.applyFilter(null, null);
|
||||||
}
|
}
|
||||||
|
|
|
@ -199,7 +199,7 @@ export default class Searchbar extends Component {
|
||||||
|
|
||||||
doSearch(filter, source) {
|
doSearch(filter, source) {
|
||||||
if (filter === this.filter && source != 'state') return;
|
if (filter === this.filter && source != 'state') return;
|
||||||
let promise = this.onSearch({$params: filter}, source);
|
let promise = this.onSearch({$params: filter});
|
||||||
promise = promise || this.$q.resolve();
|
promise = promise || this.$q.resolve();
|
||||||
promise.then(data => this.onFilter(filter, source, data));
|
promise.then(data => this.onFilter(filter, source, data));
|
||||||
this.toBar(filter);
|
this.toBar(filter);
|
||||||
|
@ -243,8 +243,11 @@ export default class Searchbar extends Component {
|
||||||
} else {
|
} else {
|
||||||
state = this.searchState;
|
state = this.searchState;
|
||||||
|
|
||||||
if (filter)
|
if (filter) {
|
||||||
|
if (this.tableQ)
|
||||||
|
filter.tableQ = this.tableQ;
|
||||||
params = {q: JSON.stringify(filter)};
|
params = {q: JSON.stringify(filter)};
|
||||||
|
}
|
||||||
if (this.$state.is(state))
|
if (this.$state.is(state))
|
||||||
opts = {location: 'replace'};
|
opts = {location: 'replace'};
|
||||||
}
|
}
|
||||||
|
@ -253,6 +256,7 @@ export default class Searchbar extends Component {
|
||||||
this.filter = filter;
|
this.filter = filter;
|
||||||
|
|
||||||
if (source == 'removeBar') {
|
if (source == 'removeBar') {
|
||||||
|
console.log(params);
|
||||||
delete params[this.toRemove];
|
delete params[this.toRemove];
|
||||||
delete this.model.userParams[this.toRemove];
|
delete this.model.userParams[this.toRemove];
|
||||||
this.model.refresh();
|
this.model.refresh();
|
||||||
|
@ -260,7 +264,6 @@ export default class Searchbar extends Component {
|
||||||
|
|
||||||
if (!filter && this.model)
|
if (!filter && this.model)
|
||||||
this.model.clear();
|
this.model.clear();
|
||||||
|
|
||||||
if (source != 'state')
|
if (source != 'state')
|
||||||
this.transition = this.$state.go(state, params, opts).transition;
|
this.transition = this.$state.go(state, params, opts).transition;
|
||||||
if (source != 'bar' && (source != 'state' || this.$state.is(this.baseState)))
|
if (source != 'bar' && (source != 'state' || this.$state.is(this.baseState)))
|
||||||
|
@ -296,26 +299,66 @@ export default class Searchbar extends Component {
|
||||||
} else {
|
} else {
|
||||||
params = Object.assign({}, filter);
|
params = Object.assign({}, filter);
|
||||||
|
|
||||||
|
console.log('pre', params);
|
||||||
if (this.fetchParams)
|
if (this.fetchParams)
|
||||||
params = this.fetchParams({$params: params});
|
params = this.fetchParams({$params: params});
|
||||||
|
console.log('post', params);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.$params.q) {
|
/* console.log(params);
|
||||||
Object.assign(params, JSON.parse(this.$params.q));
|
const paramsKeys = Object.keys(params);
|
||||||
return this.model.addFilter(where ? {where} : null, params)
|
const suggestedKeys = Object.keys(this.suggestedFilter);
|
||||||
|
if (params != this.suggestedFilter) {
|
||||||
|
for (let suggested in this.suggestedFilter)
|
||||||
|
delete this.model.userParams[suggested];
|
||||||
|
}*/
|
||||||
|
console.log('this.fromBar()', this.fromBar());
|
||||||
|
console.log('this.$params.q', this.$params.q);
|
||||||
|
console.log('param', params);
|
||||||
|
console.log('userParams', this.model.userParams);
|
||||||
|
console.log('userFilter', this.model.userFilter);
|
||||||
|
console.log('suggestedFilter', this.suggestedFilter);
|
||||||
|
console.log('fetch-params', this.fetchParams);
|
||||||
|
/* if (this.fromBar()) {
|
||||||
|
for (let param in params)
|
||||||
|
delete this.model.userParams[param];
|
||||||
|
}*/
|
||||||
|
this.tableQ = null;
|
||||||
|
if (this.$params.q && Object.keys(JSON.parse(this.$params.q)).length) {
|
||||||
|
const stateFilter = JSON.parse(this.$params.q);
|
||||||
|
for (let param in stateFilter) {
|
||||||
|
if (param != 'tableQ' && param != 'orderQ')
|
||||||
|
this.filterSanitizer(param);
|
||||||
|
}
|
||||||
|
|
||||||
|
for (let param in this.suggestedFilter) {
|
||||||
|
this.filterSanitizer(param);
|
||||||
|
delete stateFilter[param];
|
||||||
|
}
|
||||||
|
|
||||||
|
this.tableQ = stateFilter.tableQ;
|
||||||
|
for (let param in stateFilter.tableQ)
|
||||||
|
params[param] = stateFilter.tableQ[param];
|
||||||
|
|
||||||
|
Object.assign(stateFilter, params);
|
||||||
|
console.log('PRE FINAL PARAMS: ', params);
|
||||||
|
return this.model.applyParams(params)
|
||||||
.then(() => this.model.data);
|
.then(() => this.model.data);
|
||||||
}
|
}
|
||||||
|
console.log('FINAL PARAMS: ', params);
|
||||||
|
|
||||||
return this.model.applyFilter(where ? {where} : null, params)
|
return this.model.applyFilter(where ? {where} : null, params)
|
||||||
.then(() => this.model.data);
|
.then(() => this.model.data);
|
||||||
}
|
}
|
||||||
|
|
||||||
filterSanitizer(field) {
|
filterSanitizer(field) {
|
||||||
|
if (!field) return;
|
||||||
const userFilter = this.model.userFilter;
|
const userFilter = this.model.userFilter;
|
||||||
const userParams = this.model.userParams;
|
const userParams = this.model.userParams;
|
||||||
const where = userFilter && userFilter.where;
|
const where = userFilter && userFilter.where;
|
||||||
|
|
||||||
if (this.$params.q)
|
if (this.model.userParams)
|
||||||
delete this.$params.q[field];
|
delete this.model.userParams[field];
|
||||||
|
|
||||||
if (this.exprBuilder) {
|
if (this.exprBuilder) {
|
||||||
const param = this.exprBuilder({
|
const param = this.exprBuilder({
|
||||||
|
|
|
@ -172,13 +172,18 @@ describe('Component vnSearchbar', () => {
|
||||||
describe('removeParam()', () => {
|
describe('removeParam()', () => {
|
||||||
it(`should remove the parameter from the filter`, () => {
|
it(`should remove the parameter from the filter`, () => {
|
||||||
jest.spyOn(controller, 'doSearch');
|
jest.spyOn(controller, 'doSearch');
|
||||||
|
controller.model = {
|
||||||
|
applyParams: () => {
|
||||||
|
return new Promise(resolve => resolve());
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
controller.filter = filter;
|
controller.filter = filter;
|
||||||
controller.removeParam(0);
|
controller.removeParam(0);
|
||||||
|
|
||||||
expect(controller.doSearch).toHaveBeenCalledWith({
|
expect(controller.doSearch).toHaveBeenCalledWith({
|
||||||
search: 'needle'
|
search: 'needle'
|
||||||
}, 'bar');
|
}, 'removeBar');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue