CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-09-28 15:21:28 +12:00
Code Issues Projects Releases Wiki Activity

Add tablecolumns

Browse source
This commit is contained in:
Adria Navarro 2024-09-09 10:18:43 +02:00
parent 4272b614e2
commit 6d8505cee6
2 changed files with 43 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
packages/frontend-core/src/components/grid/controls/ColumnsSettingButton.svelte
View file

@ -4,13 +4,15 @@
import ColumnsSettingContent from "./ColumnsSettingContent.svelte"
import { FieldPermissions } from "../../../constants"
const { columns, datasource } = getContext("grid")
const { tableColumns, datasource } = getContext("grid")
let open = false
let anchor
$: anyRestricted = $columns.filter(col => !col.visible || col.readonly).length
$: text = anyRestricted ? `Columns: (${anyRestricted} restricted)` : "Columns"
$: anyRestricted = $tableColumns.filter(
col => !col.visible || col.readonly
).length
$: text = anyRestricted ? `Columns (${anyRestricted} restricted)` : "Columns"
$: permissions =
$datasource.type === "viewV2"
? [
@ -28,12 +30,12 @@
size="M"
on:click={() => (open = !open)}
selected={open || anyRestricted}
disabled={!$columns.length}
disabled={!$tableColumns.length}
>
{text}
</ActionButton>
</div>
<Popover bind:open {anchor} align="left">
<ColumnsSettingContent columns={$columns} {permissions} />
<ColumnsSettingContent columns={$tableColumns} {permissions} />
</Popover>

69
packages/frontend-core/src/components/grid/stores/columns.js
View file

@ -31,7 +31,7 @@ export const createStores = () => {
}
export const deriveStores = context => {
const { columns, enrichedSchema } = context
const { columns } = context
// Derive a lookup map for all columns by name
const columnLookupMap = derived(columns, $columns => {
@ -42,39 +42,15 @@ export const deriveStores = context => {
return map
})
// Derived list of columns which are direct part of the table
const tableColumns = derived(columns, $columns => {
return $columns.filter(col => !col.related)
})
// Derived list of columns which have not been explicitly hidden
const visibleColumns = derived(
[columns, enrichedSchema],
([$columns, $enrichedSchema]) => {
return $columns
.filter(col => col.visible)
.flatMap(c => {
const relatedColumns = []
const schemaColumns = $enrichedSchema?.[c.name]?.columns
if (schemaColumns) {
for (const relColumn of Object.keys(schemaColumns)) {
const relFieldSchema = schemaColumns[relColumn]
if (!relFieldSchema.visible) {
continue
}
relatedColumns.push({
name: `${c.name}.${relColumn}`,
label: `${relColumn} (${c.name})`,
schema: relFieldSchema,
width: relFieldSchema.width || DefaultColumnWidth,
visible: relFieldSchema.visible ?? true,
readonly: relFieldSchema.readonly,
order: relFieldSchema.order,
conditions: relFieldSchema.conditions,
})
}
}
return [c, ...relatedColumns]
})
}
)
const visibleColumns = derived(columns, $columns => {
return $columns.filter(col => col.visible)
})
// Split visible columns into their discrete types
const displayColumn = derived(visibleColumns, $visibleColumns => {
@ -93,6 +69,7 @@ export const deriveStores = context => {
})
return {
tableColumns,
displayColumn,
columnLookupMap,
visibleColumns,
@ -183,6 +160,32 @@ export const initialise = context => {
}
return column
})
.flatMap(field => {
const relatedColumns = []
const schemaColumns = $enrichedSchema?.[field.name]?.columns
if (field.visible && schemaColumns) {
for (const relColumn of Object.keys(schemaColumns)) {
const relFieldSchema = schemaColumns[relColumn]
if (!relFieldSchema.visible) {
continue
}
relatedColumns.push({
name: `${field.name}.${relColumn}`,
label: `${relColumn} (${field.name})`,
schema: relFieldSchema,
width: relFieldSchema.width || DefaultColumnWidth,
visible: relFieldSchema.visible ?? true,
readonly: relFieldSchema.readonly,
order: relFieldSchema.order,
conditions: relFieldSchema.conditions,
related: true,
})
}
}
return [field, ...relatedColumns]
})
.sort((a, b) => {
// Display column should always come first
if (a.name === primaryDisplay) {