ff00ff/milestones
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added sorting, started on paging

Browse Source
This commit is contained in:
James Fusia
2024-09-10 21:58:24 -04:00
parent 1e3dc2938b
commit 7a525930db
18 changed files with 558 additions and 177 deletions
Download Patch File Download Diff File Expand all files Collapse all files

205
src/components/query/query.component.ts
View File

@@ -8,9 +8,14 @@ import {
faArrowDown,
faArrowUp,
faRemove,
faSort,
faSortAsc,
faSortDesc,
faSortDown,
} from '@fortawesome/free-solid-svg-icons';
import { ExecuteService } from '../../services/execute.service';
import { Header } from '../../models/header';
import { SORT } from '../../enums/sort';
@Component({
selector: 'fbi-query',
@@ -26,54 +31,34 @@ export class QueryComponent {
private queryService: QueryService,
executeService: ExecuteService
) {
queryService.Query.subscribe((query: Query) => {
executeService.headers(query).subscribe((headers: Header[]) => {
this.node = new TreeNode({
hidden: true,
expanded: true,
children: [
{
label: 'Fields',
leaf: false,
expanded: true,
children: (query?.fields ?? []).map(
(field: string, index: number, array: string[]) => {
const actions = [];
if (index !== 0) {
actions.push({
label: 'Move Up',
icon: faArrowUp,
data: { cmd: ACTIONS.UP, data: index - 1 },
});
}
if (index !== array.length - 1) {
actions.push({
label: 'Move Down',
icon: faArrowDown,
data: { cmd: ACTIONS.DOWN, data: index + 1 },
});
}
actions.push({
label: 'Remove',
icon: faRemove,
data: { cmd: ACTIONS.REMOVE },
});
const label =
headers.find((header: Header) => header.source === field)
?.label ?? 'unknown';
return {
label: label,
data: field,
actions: actions,
};
}
),
},
{ label: 'Filters', expanded: true, leaf: false },
] as TreeNode[],
});
queryService.Query$.subscribe((query: Query) => {
const headers = executeService.headers(query);
const fields = this.getFields(query, headers);
const filters = this.getFilters(query, headers);
const sort = this.getSorts(query, headers);
this.node = new TreeNode({
hidden: true,
expanded: true,
children: [
{
label: 'Fields',
leaf: false,
expanded: true,
children: fields,
},
{
label: 'Filters',
expanded: true,
leaf: false,
children: filters,
},
{
label: 'Sort',
expanded: true,
leaf: false,
children: sort,
},
] as TreeNode[],
});
});
}
@@ -85,19 +70,139 @@ export class QueryComponent {
this.queryService.remove(event.node.data);
break;
case ACTIONS.UP:
this.queryService.add(event.node.data, data.data);
break;
case ACTIONS.DOWN:
this.queryService.add(event.node.data, data.data);
break;
case ACTIONS.SORTASC:
case ACTIONS.SORTDSC:
case ACTIONS.SORTDEL:
this.queryService.sort(data.data);
break;
}
}
private getFields(query: Query, headers: Header[]): Partial<TreeNode>[] {
return (query?.fields ?? []).map(
(field: string, index: number, array: string[]) => {
const sort = query?.sort?.field ?? '';
const sdir = query?.sort?.dir ?? SORT.NONE;
const actions = [];
// move
if (index !== 0) {
actions.push({
label: 'Move Up',
icon: faArrowUp,
data: { cmd: ACTIONS.UP, data: index - 1 },
});
}
if (index !== array.length - 1) {
actions.push({
label: 'Move Down',
icon: faArrowDown,
data: { cmd: ACTIONS.DOWN, data: index + 1 },
});
}
// sort
if (sort === field) {
switch (sdir) {
case SORT.ASC:
actions.push({
label: 'Sort Dsc',
icon: faSortDown,
data: { cmd: ACTIONS.SORTDSC, data: field },
});
break;
case SORT.DSC:
actions.push({
label: 'Clear Sort',
icon: faSort,
data: { cmd: ACTIONS.SORTDEL, data: field },
});
break;
default:
actions.push({
label: 'Sort Asc',
icon: faSortAsc,
data: { cmd: ACTIONS.SORTASC, data: field },
});
break;
}
} else {
actions.push({
label: 'Sort Asc',
icon: faSortAsc,
data: { cmd: ACTIONS.SORTASC, data: field },
});
}
// remove
actions.push({
label: 'Remove',
icon: faRemove,
data: { cmd: ACTIONS.REMOVE },
});
const label =
headers.find((header: Header) => header.source === field)?.label ??
'unknown';
return {
label: label,
data: field,
actions: actions,
};
}
);
}
private getFilters(query: Query, headers: Header[]): Partial<TreeNode>[] {
return [];
}
private getSorts(query: Query, headers: Header[]): Partial<TreeNode>[] {
const result: Partial<TreeNode>[] = [];
if (query?.sort?.isValid?.()) {
const s = query.sort;
const label =
headers.find((header: Header) => header.source === s.field)?.label ??
'unknown';
const actions = [];
if (s.dir === SORT.ASC) {
actions.push({
label: 'Sort Dsc',
icon: faSortDesc,
data: { cmd: ACTIONS.SORTDSC, data: s.field },
});
} else if (s.dir === SORT.DSC) {
actions.push({
label: 'Clear Sort',
icon: faSort,
data: { cmd: ACTIONS.SORTDEL, data: s.field },
});
}
result.push({
label: label,
data: s.field,
actions: actions,
});
}
return result;
}
}
enum ACTIONS {
REMOVE = 'del',
UP = 'up',
DOWN = 'down',
SORTDSC = 'dsc',
SORTASC = 'asc',
SORTDEL = 'nne',
}
type ActionData = {