diff --git a/src/ui/client/dashboard/components/Widget/Tabulator.vue b/src/ui/client/dashboard/components/Widget/Tabulator.vue index 713716eac..9cfd821e2 100644 --- a/src/ui/client/dashboard/components/Widget/Tabulator.vue +++ b/src/ui/client/dashboard/components/Widget/Tabulator.vue @@ -12,12 +12,20 @@ import { addColumnsWidth, a18yTable, } from "@utils/tabulator.js"; +import { useTableStore } from "@store/global.js"; + +const tableStore = useTableStore(); // TODO : ADD JSDOC COMPONENT const customComponents = ["Icons", "Text", "Fields", "Button", "ButtonGroup"]; const props = defineProps({ + id: { + type: String, + required: true, + default: "table-component", + }, columns: { type: Array, required: true, @@ -160,6 +168,8 @@ onMounted(() => { table.instance.on("tableBuilt", () => { table.instance.redraw(); a18yTable(table.instance); + // Add table instance to store in order to use it in other components + tableStore.setTable(props.id, table.instance); }); }); diff --git a/src/ui/client/dashboard/pages/test/Test.vue b/src/ui/client/dashboard/pages/test/Test.vue index ac250c866..401a28e5a 100644 --- a/src/ui/client/dashboard/pages/test/Test.vue +++ b/src/ui/client/dashboard/pages/test/Test.vue @@ -5,6 +5,10 @@ import GridLayout from "@components/Widget/GridLayout.vue"; import DashboardLayout from "@components/Dashboard/Layout.vue"; import Tabulator from "@components/Widget/Tabulator.vue"; import { useEqualStr } from "@utils/global.js"; +import { useTableStore } from "@store/global.js"; +import { onMounted } from "vue"; + +const tableStore = useTableStore(); /** * @name Builder/Bans.vue * @description This component is lightweight builder containing only the necessary components to create the bans page. @@ -104,6 +108,7 @@ const builder = [ { type: "Tabulator", data: { + id: "table-test", columns: columns, items: items, }, @@ -111,6 +116,14 @@ const builder = [ ], }, ]; + +onMounted(() => { + setTimeout(() => { + const table = tableStore.getTableById("table-test"); + console.log(table); + table.setFilter("text", "keywords", "fesfs"); + }, 1000); +});