SPFx-Projekte/Accordion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Füge Filter für die angezeigte Kategorie hinzu und aktualisiere die WebPart-Einstellungen

Browse Source
This commit is contained in:
Torsten Brendgen
2026-08-23 22:51:28 +02:00
parent bf9781d043
commit 6cc80b7d72
9 changed files with 103 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/webparts/accordion/AccordionDataService.ts
+39 -8
View File
@@ -36,7 +36,8 @@ export class AccordionDataService {
contentField: string,
categoryField: string,
sortField: string,
sortAscending: boolean
sortAscending: boolean,
categoryValue: string
): Promise<IAccordionItem[]> {
if (!this.isGuid(listId)) { return Promise.reject(new Error('Invalid list ID.')); }
const fields: string[] = this.uniqueFields(['Id', titleField, contentField, categoryField]);
@@ -48,12 +49,36 @@ export class AccordionDataService {
'?$select=' + fields.join(',') + '&$orderby=' + orderField + (sortAscending ? ' asc' : ' desc') + '&$top=5000';
return this.context.spHttpClient.get(url, SPHttpClient.configurations.v1, { headers: this.headers })
.then((response: SPHttpClientResponse): Promise<any> => this.ensureJson(response)) // tslint:disable-line:no-any
.then((payload: any): IAccordionItem[] => this.results(payload).map((item: any): IAccordionItem => ({ // tslint:disable-line:no-any
id: Number(item.Id),
title: this.toText(item[titleField]),
content: this.toText(item[contentField]),
category: categoryField ? this.toText(item[categoryField]) : ''
})));
.then((payload: any): IAccordionItem[] => this.results(payload) // tslint:disable-line:no-any
.filter((item: any): boolean => !categoryValue || // tslint:disable-line:no-any
this.toValues(item[categoryField]).indexOf(categoryValue) >= 0)
.map((item: any): IAccordionItem => ({ // tslint:disable-line:no-any
id: Number(item.Id),
title: this.toText(item[titleField]),
content: this.toText(item[contentField]),
category: categoryField ? this.toText(item[categoryField]) : ''
})));
}
public getCategoryValues(listId: string, categoryField: string): Promise<string[]> {
if (!this.isGuid(listId) || !this.isFieldName(categoryField)) { return Promise.resolve([]); }
const url: string = this.webUrl + "/_api/web/lists(guid'" + this.cleanGuid(listId) + "')/items" +
'?$select=' + categoryField + '&$top=5000';
return this.context.spHttpClient.get(url, SPHttpClient.configurations.v1, { headers: this.headers })
.then((response: SPHttpClientResponse): Promise<any> => this.ensureJson(response)) // tslint:disable-line:no-any
.then((payload: any): string[] => { // tslint:disable-line:no-any
const values: string[] = [];
const keys: { [key: string]: boolean } = {};
const items: any[] = this.results(payload); // tslint:disable-line:no-any
for (let i: number = 0; i < items.length; i++) {
const current: string[] = this.toValues(items[i][categoryField]);
for (let valueIndex: number = 0; valueIndex < current.length; valueIndex++) {
const key: string = current[valueIndex].toLocaleLowerCase();
if (!keys[key]) { keys[key] = true; values.push(current[valueIndex]); }
}
}
return values.sort((left: string, right: string): number => left.localeCompare(right));
});
}
private get webUrl(): string { return this.context.pageContext.web.absoluteUrl.replace(/\/$/, ''); }
@@ -88,6 +113,13 @@ export class AccordionDataService {
return '';
}
private toValues(value: any): string[] { // tslint:disable-line:no-any
if (value === undefined || value === null) { return []; }
const source: any[] = value && Array.isArray(value.results) ? value.results : [value]; // tslint:disable-line:no-any
return source.map((entry: any): string => this.toText(entry).trim()) // tslint:disable-line:no-any
.filter((entry: string): boolean => !!entry);
}
private isSupportedField(type: string): boolean {
return ['Text', 'Note', 'Choice', 'MultiChoice', 'Number', 'Integer', 'Boolean', 'DateTime', 'Computed'].indexOf(String(type)) >= 0;
}
@@ -95,4 +127,3 @@ export class AccordionDataService {
private isGuid(value: string): boolean { return /^[0-9a-f]{8}-[0-9a-f-]{27}$/i.test(this.cleanGuid(value)); }
private cleanGuid(value: string): string { return String(value || '').replace(/[{}]/g, '').toLowerCase(); }
}