mirror of https://github.com/abpframework/abp.git
Browse Source
Added navigation property auto complete combobox for the extra propertiespull/6415/head
Bunyamin Coskuner
6 years ago
committed by
GitHub
GitHub
13 changed files with 466 additions and 88 deletions
@ -0,0 +1,37 @@ |
|||
// https://github.com/JamesNK/Newtonsoft.Json/blob/master/Src/Newtonsoft.Json/Utilities/StringUtils.cs#L155
|
|||
export function jsonNetCamelCase(str: string) { |
|||
if (!str || !isUpperCase(str[0])) return str; |
|||
|
|||
const chars = str.split(''); |
|||
const { length } = chars; |
|||
|
|||
for (let i = 0; i < length; i++) { |
|||
if (i === 1 && !isUpperCase(chars[i])) break; |
|||
|
|||
const hasNext = i + 1 < length; |
|||
|
|||
if (i > 0 && hasNext && !isUpperCase(chars[i + 1])) { |
|||
if (isSeparator(chars[i + 1])) { |
|||
chars[i] = toLowerCase(chars[i]); |
|||
} |
|||
|
|||
break; |
|||
} |
|||
|
|||
chars[i] = toLowerCase(chars[i]); |
|||
} |
|||
|
|||
return chars.join(''); |
|||
} |
|||
|
|||
function isSeparator(str = '') { |
|||
return /[\s\u2000-\u206F\u2E00-\u2E7F\\'!"#$%&()*+,\-.\/:;<=>?@\[\]^_`{|}~]+/.test(str); |
|||
} |
|||
|
|||
function isUpperCase(str = '') { |
|||
return /[A-Z]+/.test(str); |
|||
} |
|||
|
|||
function toLowerCase(str = '') { |
|||
return str.toLowerCase(); |
|||
} |
|||
@ -0,0 +1,43 @@ |
|||
import { ABP, ExtensionPropertyUiLookupDto, RestService } from '@abp/ng.core'; |
|||
import { Observable, of } from 'rxjs'; |
|||
import { map } from 'rxjs/operators'; |
|||
import { ePropType } from '../enums/props.enum'; |
|||
import { PropCallback } from '../models/props'; |
|||
|
|||
export function createTypeaheadOptions( |
|||
lookup: ExtensionPropertyUiLookupDto, |
|||
): PropCallback<any, Observable<ABP.Option<any>[]>> { |
|||
return (data, searchText) => |
|||
searchText |
|||
? data |
|||
.getInjected(RestService) |
|||
.request( |
|||
{ |
|||
method: 'GET', |
|||
url: lookup.url, |
|||
params: { |
|||
[lookup.filterParamName]: searchText, |
|||
}, |
|||
}, |
|||
{ apiName: 'Default' }, |
|||
) |
|||
.pipe( |
|||
map(response => { |
|||
const list = response[lookup.resultListPropertyName]; |
|||
const mapToOption = (item: any) => ({ |
|||
key: item[lookup.displayPropertyName], |
|||
value: item[lookup.valuePropertyName], |
|||
}); |
|||
return list.map(mapToOption); |
|||
}), |
|||
) |
|||
: of([]); |
|||
} |
|||
|
|||
export function getTypeaheadType(lookup: ExtensionPropertyUiLookupDto, name: string) { |
|||
return Boolean(lookup.url) |
|||
? ePropType.Typeahead |
|||
: name.endsWith('_Text') |
|||
? ePropType.Hidden |
|||
: undefined; |
|||
} |
|||
@ -0,0 +1,18 @@ |
|||
import { jsonNetCamelCase } from '../lib/utils/case.util'; |
|||
|
|||
describe('Case Utils', () => { |
|||
describe('#jsonNetCamelCase', () => { |
|||
test.each` |
|||
input | output |
|||
${'Primary'} | ${'primary'} |
|||
${'PrimaryRole'} | ${'primaryRole'} |
|||
${'Primary Role'} | ${'primary Role'} |
|||
${'PrimaryRole_Text'} | ${'primaryRole_Text'} |
|||
${'ISBN'} | ${'isbn'} |
|||
${''} | ${''} |
|||
${'iMDB'} | ${'iMDB'} |
|||
`('should return $output when input is $input', ({ input, output }) => {
|
|||
expect(jsonNetCamelCase(input)).toBe(output); |
|||
}); |
|||
}); |
|||
}); |
|||
@ -0,0 +1,72 @@ |
|||
import { ExtensionPropertyUiLookupDto } from '@abp/ng.core'; |
|||
import { of } from 'rxjs'; |
|||
import { createTypeaheadOptions } from '../lib/utils/typeahead.util'; |
|||
|
|||
const lookup: ExtensionPropertyUiLookupDto = { |
|||
url: 'url', |
|||
resultListPropertyName: 'list', |
|||
displayPropertyName: 'text', |
|||
valuePropertyName: 'id', |
|||
filterParamName: 'filter', |
|||
}; |
|||
|
|||
describe('Typeahead Utils', () => { |
|||
describe('#createTypeaheadOptions', () => { |
|||
it('should return observable empty array when search text does not exist', async () => { |
|||
const list = await createTypeaheadOptions(null)(null, null).toPromise(); |
|||
expect(list).toEqual([]); |
|||
}); |
|||
|
|||
it('should call request method of RestService with lookup url, filter param and search text', async () => { |
|||
const data = createData([]); |
|||
const service = data.getInjected(); |
|||
await createTypeaheadOptions(lookup)(data, 'x').toPromise(); |
|||
expect(service.request).toHaveBeenCalledTimes(1); |
|||
expect(service.request).toHaveBeenCalledWith( |
|||
{ |
|||
method: 'GET', |
|||
url: 'url', |
|||
params: { |
|||
filter: 'x', |
|||
}, |
|||
}, |
|||
{ apiName: 'Default' }, |
|||
); |
|||
}); |
|||
|
|||
it('should return options based on given lookup data', async () => { |
|||
const data = createData([ |
|||
{ |
|||
text: 'foo', |
|||
id: 'bar', |
|||
}, |
|||
{ |
|||
text: 'baz', |
|||
id: 'qux', |
|||
}, |
|||
]); |
|||
|
|||
const options = await createTypeaheadOptions(lookup)(data, 'x').toPromise(); |
|||
expect(options).toEqual([ |
|||
{ |
|||
key: 'foo', |
|||
value: 'bar', |
|||
}, |
|||
{ |
|||
key: 'baz', |
|||
value: 'qux', |
|||
}, |
|||
]); |
|||
}); |
|||
}); |
|||
}); |
|||
|
|||
function createData(list: { text: string; id: string }[]): any { |
|||
const service = { request: jest.fn(() => of({ list })) }; |
|||
|
|||
return { |
|||
getInjected: () => service, |
|||
index: 0, |
|||
record: null, |
|||
}; |
|||
} |
|||
Loading…
Reference in new issue