diff --git a/components/geojson-table-window-content.vue b/components/geojson-table-window-content.vue index ac9cdb3..23c85e8 100644 --- a/components/geojson-table-window-content.vue +++ b/components/geojson-table-window-content.vue @@ -3,6 +3,7 @@ import { type CellContext, type ColumnDef, createColumnHelper, + type GroupColumnDef, type Row, type Table, } from "@tanstack/vue-table"; @@ -17,10 +18,11 @@ const url = "https://raw.githubusercontent.com/wibarab/wibarab-data/main/wibarab const { isPending } = GeojsonStore.fetchGeojson(url); const { fetchedData, tables } = storeToRefs(GeojsonStore); const { data: projectData } = useProjectInfo(); +const columnHelper = createColumnHelper(); const columns = computed(() => { const columnHeadings = fetchedData.value.get(url)?.properties.column_headings; - const columnHelper = createColumnHelper(); + const categories = projectData.value!.projectConfig?.staticData?.table?.[1] as Record< string, Record @@ -30,12 +32,12 @@ const columns = computed(() => { { header: "-", enableHiding: false, - columns: [] as Array>, + columns: [] as Array>, }, ...Object.keys(categories).map((categoryName) => { return { header: categoryName, - columns: [] as Array>, + columns: [] as Array>, }; }), ]; @@ -48,6 +50,7 @@ const columns = computed(() => { ).map(([categoryName, categoryLabel]) => { return columnHelper.group({ header: String(categoryLabel), + id: String(categoryName), //@ts-expect-error type mismatch in accessorFn columns: columnHeadings .filter((heading) => heading.category === categoryName) @@ -86,6 +89,7 @@ const columns = computed(() => { subcategoryColumns = [ columnHelper.group({ header: "-", + id: "-", enableHiding: false, //@ts-expect-error type mismatch in accessorFn columns: columnHeadings @@ -112,9 +116,10 @@ const columns = computed(() => { }), ]; } - col.columns = subcategoryColumns; + col.columns = subcategoryColumns as Array>; }); const groupedColumns = topLevelColumns + .filter((col) => col.columns.some((col) => (col.columns?.length ?? -1) > 0)) .map((col) => columnHelper.group(col)) .sort((a, b) => String(a.header).localeCompare(String(b.header))); return groupedColumns;