From 0508e40494d38c8315ff7002f817217f52a9acbb Mon Sep 17 00:00:00 2001 From: Julian Krauser Date: Thu, 12 Dec 2024 16:34:03 +0100 Subject: [PATCH 01/15] query views, router and store --- src/components/Pagination.vue | 5 ++- src/router/index.ts | 41 +++++++++++++++++---- src/stores/admin/navigation.ts | 6 ++-- src/stores/admin/queryBuilder.ts | 50 ++++++++++++++++++++++++++ src/types/dynamicQueries.ts | 44 +++++++++++++++++++++++ src/types/permissionTypes.ts | 22 +++++++++--- src/viewmodels/admin/query.models.ts | 5 +++ src/views/admin/club/query/Builder.vue | 49 +++++++++++++++++++++++++ 8 files changed, 208 insertions(+), 14 deletions(-) create mode 100644 src/stores/admin/queryBuilder.ts create mode 100644 src/types/dynamicQueries.ts create mode 100644 src/viewmodels/admin/query.models.ts create mode 100644 src/views/admin/club/query/Builder.vue diff --git a/src/components/Pagination.vue b/src/components/Pagination.vue index a0f198c..f021f76 100644 --- a/src/components/Pagination.vue +++ b/src/components/Pagination.vue @@ -64,7 +64,7 @@ - + + -- 2.45.2 From 2f60cc51a304a5cfa15189c6ccb8628f1d4ba9ec Mon Sep 17 00:00:00 2001 From: Julian Krauser Date: Fri, 13 Dec 2024 16:24:20 +0100 Subject: [PATCH 02/15] type change --- src/types/dynamicQueries.ts | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/src/types/dynamicQueries.ts b/src/types/dynamicQueries.ts index 841d8aa..7a72342 100644 --- a/src/types/dynamicQueries.ts +++ b/src/types/dynamicQueries.ts @@ -3,16 +3,18 @@ export interface DynamicQueryStructure { table: string; where?: Array; join?: Array; - orderBy?: { [key: string]: "ASC" | "DESC" }; + orderBy?: Array; } export type ConditionStructure = ( | { + structureType: "condition"; column: string; operation: WhereOperation; value: ConditionValue; } | { + structureType: "nested"; invert?: boolean; condition: Array; } @@ -42,3 +44,10 @@ export type WhereOperation = | "between" // Is between | "startsWith" // Starts with | "endsWith"; // Ends with + +export type OrderByStructure = { + column: string; + order: OrderByType; +}; + +export type OrderByType = "ASC" | "DESC"; -- 2.45.2 From 1b93b28258bf28aef3804837f3f016c586267897 Mon Sep 17 00:00:00 2001 From: Julian Krauser Date: Sat, 14 Dec 2024 15:44:29 +0100 Subject: [PATCH 03/15] type change --- src/types/dynamicQueries.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/types/dynamicQueries.ts b/src/types/dynamicQueries.ts index 7a72342..2e3bc06 100644 --- a/src/types/dynamicQueries.ts +++ b/src/types/dynamicQueries.ts @@ -16,7 +16,7 @@ export type ConditionStructure = ( | { structureType: "nested"; invert?: boolean; - condition: Array; + conditions: Array; } ) & { concat: WhereType; -- 2.45.2 From 4cf5b989e0bf60f9f365d00f265ed6cf667a9d54 Mon Sep 17 00:00:00 2001 From: Julian Krauser Date: Sat, 14 Dec 2024 17:02:34 +0100 Subject: [PATCH 04/15] builder layout start --- src/components/queryBuilder/BuilderHost.vue | 55 +++++++++++++++++++++ src/viewmodels/admin/query.models.ts | 5 ++ src/views/admin/club/query/Builder.vue | 4 +- 3 files changed, 63 insertions(+), 1 deletion(-) create mode 100644 src/components/queryBuilder/BuilderHost.vue diff --git a/src/components/queryBuilder/BuilderHost.vue b/src/components/queryBuilder/BuilderHost.vue new file mode 100644 index 0000000..b2924de --- /dev/null +++ b/src/components/queryBuilder/BuilderHost.vue @@ -0,0 +1,55 @@ + + + + + diff --git a/src/viewmodels/admin/query.models.ts b/src/viewmodels/admin/query.models.ts index d9a6887..f3d9616 100644 --- a/src/viewmodels/admin/query.models.ts +++ b/src/viewmodels/admin/query.models.ts @@ -3,3 +3,8 @@ export interface TableMeta { columns: Array<{ column: string; type: string }>; relations: Array<{ column: string; relationType: string; referencedTableName: string }>; } + +export interface QueryViewModel { + id: number; + query: string; +} diff --git a/src/views/admin/club/query/Builder.vue b/src/views/admin/club/query/Builder.vue index e846866..0c8d8ce 100644 --- a/src/views/admin/club/query/Builder.vue +++ b/src/views/admin/club/query/Builder.vue @@ -7,7 +7,8 @@ diff --git a/src/components/queryBuilder/Where.vue b/src/components/queryBuilder/Where.vue index 2b4332a..ddc2e9f 100644 --- a/src/components/queryBuilder/Where.vue +++ b/src/components/queryBuilder/Where.vue @@ -1,6 +1,32 @@ @@ -9,6 +35,9 @@ import { defineComponent, type PropType } from "vue"; import { mapActions, mapState } from "pinia"; import type { ConditionStructure } from "../../types/dynamicQueries"; import { useQueryBuilderStore } from "../../stores/admin/queryBuilder"; +import NestedCondition from "./NestedCondition.vue"; +import Condition from "./Condition.vue"; +import { PlusIcon, RectangleStackIcon } from "@heroicons/vue/24/outline"; diff --git a/src/types/dynamicQueries.ts b/src/types/dynamicQueries.ts index 2e3bc06..460b158 100644 --- a/src/types/dynamicQueries.ts +++ b/src/types/dynamicQueries.ts @@ -44,6 +44,7 @@ export type WhereOperation = | "between" // Is between | "startsWith" // Starts with | "endsWith"; // Ends with +// TODO: age between | age equals | age greater | age smaller export type OrderByStructure = { column: string; -- 2.45.2 From ff253c73f049ccf558b2b15e1b7afc3f219f7730 Mon Sep 17 00:00:00 2001 From: Julian Krauser Date: Mon, 16 Dec 2024 17:49:18 +0100 Subject: [PATCH 08/15] condition building --- src/components/queryBuilder/BuilderHost.vue | 15 ++++++++- src/components/queryBuilder/Condition.vue | 31 +++++++++++++++++-- .../queryBuilder/NestedCondition.vue | 2 +- src/components/queryBuilder/NestedWhere.vue | 3 +- src/components/queryBuilder/Table.vue | 8 ++--- src/components/queryBuilder/Where.vue | 2 +- src/stores/admin/queryBuilder.ts | 19 ++++++++---- src/types/dynamicQueries.ts | 22 ++++++++++++- src/views/admin/club/query/Builder.vue | 29 +++++++++++++++-- 9 files changed, 112 insertions(+), 19 deletions(-) diff --git a/src/components/queryBuilder/BuilderHost.vue b/src/components/queryBuilder/BuilderHost.vue index 4d1c0a4..f2cb3e3 100644 --- a/src/components/queryBuilder/BuilderHost.vue +++ b/src/components/queryBuilder/BuilderHost.vue @@ -29,6 +29,13 @@ > +
+ +
@@ -40,7 +47,13 @@ import { defineComponent, type PropType } from "vue"; import { mapActions, mapState } from "pinia"; import type { DynamicQueryStructure } from "../../types/dynamicQueries"; -import { ArchiveBoxArrowDownIcon, InboxArrowDownIcon, NoSymbolIcon, PlayIcon } from "@heroicons/vue/24/outline"; +import { + ArchiveBoxArrowDownIcon, + InboxArrowDownIcon, + NoSymbolIcon, + PlayIcon, + TrashIcon, +} from "@heroicons/vue/24/outline"; import { useQueryBuilderStore } from "../../stores/admin/queryBuilder"; import Table from "./Table.vue"; diff --git a/src/components/queryBuilder/Condition.vue b/src/components/queryBuilder/Condition.vue index f686a9b..66c62d9 100644 --- a/src/components/queryBuilder/Condition.vue +++ b/src/components/queryBuilder/Condition.vue @@ -8,10 +8,17 @@ + +
@@ -21,7 +28,13 @@ @@ -50,6 +63,20 @@ export default defineComponent({ foreignColumns() { return this.activeTable?.relations.map((r) => r.column); }, + inputType() { + let type = this.activeTable?.columns.find((c) => c.column == this.column)?.type; + if (this.operation.includes("timespan")) return "number"; + switch (type) { + case "int": + return "number"; + case "varchar": + return "text"; + case "date": + return "date"; + default: + return "text"; + } + }, concat: { get() { return this.modelValue.concat; diff --git a/src/components/queryBuilder/NestedCondition.vue b/src/components/queryBuilder/NestedCondition.vue index 44cbb26..dde4d9c 100644 --- a/src/components/queryBuilder/NestedCondition.vue +++ b/src/components/queryBuilder/NestedCondition.vue @@ -1,6 +1,6 @@