mirror of https://github.com/nocodb/nocodb
github-actions[bot]
11 months ago
committed by
GitHub
1349 changed files with 1989 additions and 7107 deletions
@ -1,97 +0,0 @@ |
|||||||
import type { ColumnType, GridColumnReqType, GridColumnType, ViewType } from 'nocodb-sdk' |
|
||||||
import type { Ref } from 'vue' |
|
||||||
import { IsPublicInj, computed, inject, ref, useMetas, useNuxtApp, useRoles, useUndoRedo, watch } from '#imports' |
|
||||||
|
|
||||||
const [useProvideGridViewColumn, useGridViewColumn] = useInjectionState( |
|
||||||
(view: Ref<(ViewType & { columns?: GridColumnType[] }) | undefined>, statePublic = false) => { |
|
||||||
const { isUIAllowed } = useRoles() |
|
||||||
|
|
||||||
const { $api } = useNuxtApp() |
|
||||||
|
|
||||||
const { metas } = useMetas() |
|
||||||
|
|
||||||
const { addUndo, defineViewScope } = useUndoRedo() |
|
||||||
|
|
||||||
const gridViewCols = ref<Record<string, GridColumnType>>({}) |
|
||||||
const resizingColOldWith = ref('200px') |
|
||||||
const isPublic = inject(IsPublicInj, ref(statePublic)) |
|
||||||
|
|
||||||
const columns = computed<ColumnType[]>(() => metas.value?.[view.value?.fk_model_id as string]?.columns || []) |
|
||||||
|
|
||||||
const loadGridViewColumns = async () => { |
|
||||||
if (!view.value?.id && !isPublic.value) return |
|
||||||
|
|
||||||
const colsData: GridColumnType[] = |
|
||||||
(isPublic.value ? view.value?.columns : await $api.dbView.gridColumnsList(view.value!.id!)) ?? [] |
|
||||||
|
|
||||||
gridViewCols.value = colsData.reduce<Record<string, GridColumnType>>( |
|
||||||
(o, col) => ({ |
|
||||||
...o, |
|
||||||
[col.fk_column_id as string]: col, |
|
||||||
}), |
|
||||||
{}, |
|
||||||
) |
|
||||||
} |
|
||||||
|
|
||||||
/** when columns changes(create/delete) reload grid columns |
|
||||||
* or when view changes reload columns width */ |
|
||||||
watch( |
|
||||||
[() => columns.value?.length, () => view.value?.id], |
|
||||||
async (n) => { |
|
||||||
if (n[1]) await loadGridViewColumns() |
|
||||||
}, |
|
||||||
{ immediate: true }, |
|
||||||
) |
|
||||||
|
|
||||||
const updateGridViewColumn = async (id: string, props: Partial<GridColumnReqType>, undo = false) => { |
|
||||||
if (!undo) { |
|
||||||
const oldProps = Object.keys(props).reduce<Partial<GridColumnReqType>>((o: any, k) => { |
|
||||||
if (gridViewCols.value[id][k as keyof GridColumnType]) { |
|
||||||
if (k === 'width') o[k] = `${resizingColOldWith.value}px` |
|
||||||
else o[k] = gridViewCols.value[id][k as keyof GridColumnType] |
|
||||||
} |
|
||||||
return o |
|
||||||
}, {}) |
|
||||||
addUndo({ |
|
||||||
redo: { |
|
||||||
fn: (w: Partial<GridColumnReqType>) => updateGridViewColumn(id, w, true), |
|
||||||
args: [props], |
|
||||||
}, |
|
||||||
undo: { |
|
||||||
fn: (w: Partial<GridColumnReqType>) => updateGridViewColumn(id, w, true), |
|
||||||
args: [oldProps], |
|
||||||
}, |
|
||||||
scope: defineViewScope({ view: view.value }), |
|
||||||
}) |
|
||||||
} |
|
||||||
|
|
||||||
// sync with server if allowed
|
|
||||||
if (!isPublic.value && isUIAllowed('viewFieldEdit') && gridViewCols.value[id]?.id) { |
|
||||||
await $api.dbView.gridColumnUpdate(gridViewCols.value[id].id as string, { |
|
||||||
...props, |
|
||||||
}) |
|
||||||
} |
|
||||||
|
|
||||||
if (gridViewCols.value?.[id]) { |
|
||||||
Object.assign(gridViewCols.value[id], { |
|
||||||
...gridViewCols.value[id], |
|
||||||
...props, |
|
||||||
}) |
|
||||||
} else { |
|
||||||
// fallback to reload
|
|
||||||
await loadGridViewColumns() |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
return { loadGridViewColumns, updateGridViewColumn, gridViewCols, resizingColOldWith } |
|
||||||
}, |
|
||||||
'useGridViewColumn', |
|
||||||
) |
|
||||||
|
|
||||||
export { useProvideGridViewColumn } |
|
||||||
|
|
||||||
export function useGridViewColumnOrThrow() { |
|
||||||
const gridViewColumn = useGridViewColumn() |
|
||||||
if (gridViewColumn == null) throw new Error('Please call `useProvideGridViewColumn` on the appropriate parent component') |
|
||||||
return gridViewColumn |
|
||||||
} |
|
@ -1,296 +1,363 @@ |
|||||||
import { ViewTypes, isSystemColumn } from 'nocodb-sdk' |
import { ViewTypes, isSystemColumn } from 'nocodb-sdk' |
||||||
import type { ColumnType, MapType, TableType, ViewType } from 'nocodb-sdk' |
import type { ColumnType, GridColumnReqType, GridColumnType, MapType, TableType, ViewType } from 'nocodb-sdk' |
||||||
import type { ComputedRef, Ref } from 'vue' |
import type { ComputedRef, Ref } from 'vue' |
||||||
import { IsPublicInj, computed, inject, ref, storeToRefs, useBase, useNuxtApp, useRoles, useUndoRedo, watch } from '#imports' |
import { computed, ref, storeToRefs, useBase, useNuxtApp, useRoles, useUndoRedo, watch } from '#imports' |
||||||
import type { Field } from '#imports' |
import type { Field } from '#imports' |
||||||
|
|
||||||
export function useViewColumns( |
const [useProvideViewColumns, useViewColumns] = useInjectionState( |
||||||
view: Ref<ViewType | undefined>, |
( |
||||||
meta: Ref<TableType | undefined> | ComputedRef<TableType | undefined>, |
view: Ref<ViewType | undefined>, |
||||||
reloadData?: () => void, |
meta: Ref<TableType | undefined> | ComputedRef<TableType | undefined>, |
||||||
) { |
reloadData?: () => void, |
||||||
const isPublic = inject(IsPublicInj, ref(false)) |
isPublic = false, |
||||||
|
) => { |
||||||
|
const fields = ref<Field[]>() |
||||||
|
|
||||||
const fields = ref<Field[]>() |
const filterQuery = ref('') |
||||||
|
|
||||||
const filterQuery = ref('') |
const { $api, $e } = useNuxtApp() |
||||||
|
|
||||||
const { $api, $e } = useNuxtApp() |
const { isUIAllowed } = useRoles() |
||||||
|
|
||||||
const { isUIAllowed } = useRoles() |
const { isSharedBase } = storeToRefs(useBase()) |
||||||
|
|
||||||
const { isSharedBase } = storeToRefs(useBase()) |
const isViewColumnsLoading = ref(false) |
||||||
|
|
||||||
const isViewColumnsLoading = ref(false) |
const { addUndo, defineViewScope } = useUndoRedo() |
||||||
|
|
||||||
const { addUndo, defineViewScope } = useUndoRedo() |
const isLocalMode = computed( |
||||||
|
() => isPublic || !isUIAllowed('viewFieldEdit') || !isUIAllowed('viewFieldEdit') || isSharedBase.value, |
||||||
|
) |
||||||
|
|
||||||
const isLocalMode = computed( |
const localChanges = ref<Field[]>([]) |
||||||
() => isPublic.value || !isUIAllowed('viewFieldEdit') || !isUIAllowed('viewFieldEdit') || isSharedBase.value, |
|
||||||
) |
|
||||||
|
|
||||||
const localChanges = ref<Field[]>([]) |
const isColumnViewEssential = (column: ColumnType) => { |
||||||
|
// TODO: consider at some point ti delegate this via a cleaner design pattern to view specific check logic
|
||||||
|
// which could be inside of a view specific helper class (and generalized via an interface)
|
||||||
|
// (on the other hand, the logic complexity is still very low atm - might be overkill)
|
||||||
|
return view.value?.type === ViewTypes.MAP && (view.value?.view as MapType)?.fk_geo_data_col_id === column.id |
||||||
|
} |
||||||
|
|
||||||
const isColumnViewEssential = (column: ColumnType) => { |
const metaColumnById = computed<Record<string, ColumnType>>(() => { |
||||||
// TODO: consider at some point ti delegate this via a cleaner design pattern to view specific check logic
|
if (!meta.value?.columns) return {} |
||||||
// which could be inside of a view specific helper class (and generalized via an interface)
|
|
||||||
// (on the other hand, the logic complexity is still very low atm - might be overkill)
|
|
||||||
return view.value?.type === ViewTypes.MAP && (view.value?.view as MapType)?.fk_geo_data_col_id === column.id |
|
||||||
} |
|
||||||
|
|
||||||
const metaColumnById = computed<Record<string, ColumnType>>(() => { |
return (meta.value.columns as ColumnType[]).reduce( |
||||||
if (!meta.value?.columns) return {} |
(acc, curr) => ({ |
||||||
|
...acc, |
||||||
|
[curr.id!]: curr, |
||||||
|
}), |
||||||
|
{}, |
||||||
|
) as Record<string, ColumnType> |
||||||
|
}) |
||||||
|
|
||||||
return (meta.value.columns as ColumnType[]).reduce( |
const gridViewCols = ref<Record<string, GridColumnType>>({}) |
||||||
(acc, curr) => ({ |
|
||||||
...acc, |
|
||||||
[curr.id!]: curr, |
|
||||||
}), |
|
||||||
{}, |
|
||||||
) as Record<string, ColumnType> |
|
||||||
}) |
|
||||||
|
|
||||||
const loadViewColumns = async () => { |
const loadViewColumns = async () => { |
||||||
if (!meta || !view) return |
if (!meta || !view) return |
||||||
|
|
||||||
let order = 1 |
let order = 1 |
||||||
|
|
||||||
if (view.value?.id) { |
if (view.value?.id) { |
||||||
const data = (isPublic.value ? meta.value?.columns : (await $api.dbViewColumn.list(view.value.id)).list) as any[] |
const data = (isPublic ? meta.value?.columns : (await $api.dbViewColumn.list(view.value.id)).list) as any[] |
||||||
|
|
||||||
const fieldById = data.reduce<Record<string, any>>((acc, curr) => { |
const fieldById = data.reduce<Record<string, any>>((acc, curr) => { |
||||||
curr.show = !!curr.show |
curr.show = !!curr.show |
||||||
|
|
||||||
return { |
|
||||||
...acc, |
|
||||||
[curr.fk_column_id]: curr, |
|
||||||
} |
|
||||||
}, {}) |
|
||||||
|
|
||||||
fields.value = meta.value?.columns |
|
||||||
?.map((column: ColumnType) => { |
|
||||||
const currentColumnField = fieldById[column.id!] || {} |
|
||||||
|
|
||||||
return { |
return { |
||||||
title: column.title, |
...acc, |
||||||
fk_column_id: column.id, |
[curr.fk_column_id]: curr, |
||||||
...currentColumnField, |
|
||||||
show: currentColumnField.show || isColumnViewEssential(currentColumnField), |
|
||||||
order: currentColumnField.order || order++, |
|
||||||
system: isSystemColumn(metaColumnById?.value?.[currentColumnField.fk_column_id!]), |
|
||||||
isViewEssentialField: isColumnViewEssential(column), |
|
||||||
} |
} |
||||||
}) |
}, {}) |
||||||
.sort((a: Field, b: Field) => a.order - b.order) |
|
||||||
|
fields.value = meta.value?.columns |
||||||
if (isLocalMode.value && fields.value) { |
?.map((column: ColumnType) => { |
||||||
for (const field of localChanges.value) { |
const currentColumnField = fieldById[column.id!] || {} |
||||||
const fieldIndex = fields.value.findIndex((f) => f.fk_column_id === field.fk_column_id) |
|
||||||
if (fieldIndex !== undefined && fieldIndex > -1) { |
return { |
||||||
fields.value[fieldIndex] = field |
title: column.title, |
||||||
fields.value = fields.value.sort((a: Field, b: Field) => a.order - b.order) |
fk_column_id: column.id, |
||||||
|
...currentColumnField, |
||||||
|
show: currentColumnField.show || isColumnViewEssential(currentColumnField), |
||||||
|
order: currentColumnField.order || order++, |
||||||
|
system: isSystemColumn(metaColumnById?.value?.[currentColumnField.fk_column_id!]), |
||||||
|
isViewEssentialField: isColumnViewEssential(column), |
||||||
|
} |
||||||
|
}) |
||||||
|
.sort((a: Field, b: Field) => a.order - b.order) |
||||||
|
|
||||||
|
if (isLocalMode.value && fields.value) { |
||||||
|
for (const field of localChanges.value) { |
||||||
|
const fieldIndex = fields.value.findIndex((f) => f.fk_column_id === field.fk_column_id) |
||||||
|
if (fieldIndex !== undefined && fieldIndex > -1) { |
||||||
|
fields.value[fieldIndex] = field |
||||||
|
fields.value = fields.value.sort((a: Field, b: Field) => a.order - b.order) |
||||||
|
} |
||||||
} |
} |
||||||
} |
} |
||||||
|
|
||||||
|
const colsData: GridColumnType[] = (isPublic.value ? view.value?.columns : fields.value) ?? [] |
||||||
|
|
||||||
|
gridViewCols.value = colsData.reduce<Record<string, GridColumnType>>( |
||||||
|
(o, col) => ({ |
||||||
|
...o, |
||||||
|
[col.fk_column_id as string]: col, |
||||||
|
}), |
||||||
|
{}, |
||||||
|
) |
||||||
} |
} |
||||||
} |
} |
||||||
} |
|
||||||
|
|
||||||
const showAll = async (ignoreIds?: any) => { |
|
||||||
if (isLocalMode.value) { |
|
||||||
fields.value = fields.value?.map((field: Field) => ({ |
|
||||||
...field, |
|
||||||
show: true, |
|
||||||
})) |
|
||||||
reloadData?.() |
|
||||||
return |
|
||||||
} |
|
||||||
|
|
||||||
if (view?.value?.id) { |
const showAll = async (ignoreIds?: any) => { |
||||||
if (ignoreIds) { |
if (isLocalMode.value) { |
||||||
await $api.dbView.showAllColumn(view.value.id, { |
fields.value = fields.value?.map((field: Field) => ({ |
||||||
ignoreIds, |
...field, |
||||||
}) |
show: true, |
||||||
} else { |
})) |
||||||
await $api.dbView.showAllColumn(view.value.id) |
reloadData?.() |
||||||
|
return |
||||||
|
} |
||||||
|
|
||||||
|
if (view?.value?.id) { |
||||||
|
if (ignoreIds) { |
||||||
|
await $api.dbView.showAllColumn(view.value.id, { |
||||||
|
ignoreIds, |
||||||
|
}) |
||||||
|
} else { |
||||||
|
await $api.dbView.showAllColumn(view.value.id) |
||||||
|
} |
||||||
} |
} |
||||||
|
|
||||||
|
await loadViewColumns() |
||||||
|
reloadData?.() |
||||||
|
$e('a:fields:show-all') |
||||||
} |
} |
||||||
|
const hideAll = async (ignoreIds?: any) => { |
||||||
|
if (isLocalMode.value) { |
||||||
|
fields.value = fields.value?.map((field: Field) => ({ |
||||||
|
...field, |
||||||
|
show: !!field.isViewEssentialField, |
||||||
|
})) |
||||||
|
reloadData?.() |
||||||
|
return |
||||||
|
} |
||||||
|
if (view?.value?.id) { |
||||||
|
if (ignoreIds) { |
||||||
|
await $api.dbView.hideAllColumn(view.value.id, { |
||||||
|
ignoreIds, |
||||||
|
}) |
||||||
|
} else { |
||||||
|
await $api.dbView.hideAllColumn(view.value.id) |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
await loadViewColumns() |
await loadViewColumns() |
||||||
reloadData?.() |
|
||||||
$e('a:fields:show-all') |
|
||||||
} |
|
||||||
const hideAll = async (ignoreIds?: any) => { |
|
||||||
if (isLocalMode.value) { |
|
||||||
fields.value = fields.value?.map((field: Field) => ({ |
|
||||||
...field, |
|
||||||
show: !!field.isViewEssentialField, |
|
||||||
})) |
|
||||||
reloadData?.() |
reloadData?.() |
||||||
return |
$e('a:fields:show-all') |
||||||
} |
} |
||||||
if (view?.value?.id) { |
|
||||||
if (ignoreIds) { |
const saveOrUpdate = async (field: any, index: number) => { |
||||||
await $api.dbView.hideAllColumn(view.value.id, { |
if (isLocalMode.value && fields.value) { |
||||||
ignoreIds, |
fields.value[index] = field |
||||||
|
meta.value!.columns = meta.value!.columns?.map((column: ColumnType) => { |
||||||
|
if (column.id === field.fk_column_id) { |
||||||
|
return { |
||||||
|
...column, |
||||||
|
...field, |
||||||
|
id: field.fk_column_id, |
||||||
|
} |
||||||
|
} |
||||||
|
return column |
||||||
}) |
}) |
||||||
} else { |
|
||||||
await $api.dbView.hideAllColumn(view.value.id) |
localChanges.value.push(field) |
||||||
} |
} |
||||||
} |
|
||||||
|
|
||||||
await loadViewColumns() |
if (isUIAllowed('viewFieldEdit')) { |
||||||
reloadData?.() |
if (field.id && view?.value?.id) { |
||||||
$e('a:fields:show-all') |
await $api.dbViewColumn.update(view.value.id, field.id, field) |
||||||
} |
} else if (view.value?.id) { |
||||||
|
const insertedField = (await $api.dbViewColumn.create(view.value.id, field)) as any |
||||||
|
|
||||||
const saveOrUpdate = async (field: any, index: number) => { |
/** update the field in fields if defined */ |
||||||
if (isLocalMode.value && fields.value) { |
if (fields.value) fields.value[index] = insertedField |
||||||
fields.value[index] = field |
|
||||||
meta.value!.columns = meta.value!.columns?.map((column: ColumnType) => { |
return insertedField |
||||||
if (column.id === field.fk_column_id) { |
|
||||||
return { |
|
||||||
...column, |
|
||||||
...field, |
|
||||||
id: field.fk_column_id, |
|
||||||
} |
|
||||||
} |
} |
||||||
return column |
} |
||||||
}) |
|
||||||
|
|
||||||
localChanges.value.push(field) |
await loadViewColumns() |
||||||
|
reloadData?.() |
||||||
} |
} |
||||||
|
|
||||||
if (isUIAllowed('viewFieldEdit')) { |
const showSystemFields = computed({ |
||||||
if (field.id && view?.value?.id) { |
get() { |
||||||
await $api.dbViewColumn.update(view.value.id, field.id, field) |
return (view.value?.show_system_fields as boolean) || false |
||||||
} else if (view.value?.id) { |
}, |
||||||
const insertedField = (await $api.dbViewColumn.create(view.value.id, field)) as any |
set(v: boolean) { |
||||||
|
if (view?.value?.id) { |
||||||
|
if (!isLocalMode.value) { |
||||||
|
$api.dbView |
||||||
|
.update(view.value.id, { |
||||||
|
show_system_fields: v, |
||||||
|
}) |
||||||
|
.finally(() => { |
||||||
|
loadViewColumns() |
||||||
|
reloadData?.() |
||||||
|
}) |
||||||
|
} |
||||||
|
view.value.show_system_fields = v |
||||||
|
} |
||||||
|
$e('a:fields:system-fields') |
||||||
|
}, |
||||||
|
}) |
||||||
|
|
||||||
/** update the field in fields if defined */ |
const filteredFieldList = computed(() => { |
||||||
if (fields.value) fields.value[index] = insertedField |
return ( |
||||||
|
fields.value?.filter((field: Field) => { |
||||||
|
if (metaColumnById?.value?.[field.fk_column_id!]?.pv) return true |
||||||
|
|
||||||
return insertedField |
// hide system columns if not enabled
|
||||||
} |
if (!showSystemFields.value && isSystemColumn(metaColumnById?.value?.[field.fk_column_id!])) { |
||||||
} |
return false |
||||||
|
} |
||||||
|
|
||||||
await loadViewColumns() |
if (filterQuery.value === '') { |
||||||
reloadData?.() |
return true |
||||||
} |
} else { |
||||||
|
return field.title.toLowerCase().includes(filterQuery.value.toLowerCase()) |
||||||
|
} |
||||||
|
}) || [] |
||||||
|
) |
||||||
|
}) |
||||||
|
|
||||||
const showSystemFields = computed({ |
const sortedAndFilteredFields = computed<ColumnType[]>(() => { |
||||||
get() { |
return (fields?.value |
||||||
return (view.value?.show_system_fields as boolean) || false |
?.filter((field: Field) => { |
||||||
}, |
// hide system columns if not enabled
|
||||||
set(v: boolean) { |
if ( |
||||||
if (view?.value?.id) { |
!showSystemFields.value && |
||||||
if (!isLocalMode.value) { |
metaColumnById.value && |
||||||
$api.dbView |
metaColumnById?.value?.[field.fk_column_id!] && |
||||||
.update(view.value.id, { |
isSystemColumn(metaColumnById.value?.[field.fk_column_id!]) && |
||||||
show_system_fields: v, |
!metaColumnById.value?.[field.fk_column_id!]?.pv |
||||||
}) |
) { |
||||||
.finally(() => { |
return false |
||||||
loadViewColumns() |
} |
||||||
reloadData?.() |
return field.show && metaColumnById?.value?.[field.fk_column_id!] |
||||||
}) |
}) |
||||||
} |
?.sort((a: Field, b: Field) => a.order - b.order) |
||||||
view.value.show_system_fields = v |
?.map((field: Field) => metaColumnById?.value?.[field.fk_column_id!]) || []) as ColumnType[] |
||||||
} |
}) |
||||||
$e('a:fields:system-fields') |
|
||||||
}, |
|
||||||
}) |
|
||||||
|
|
||||||
const filteredFieldList = computed(() => { |
|
||||||
return ( |
|
||||||
fields.value?.filter((field: Field) => { |
|
||||||
if (metaColumnById?.value?.[field.fk_column_id!]?.pv) return true |
|
||||||
|
|
||||||
// hide system columns if not enabled
|
|
||||||
if (!showSystemFields.value && isSystemColumn(metaColumnById?.value?.[field.fk_column_id!])) { |
|
||||||
return false |
|
||||||
} |
|
||||||
|
|
||||||
if (filterQuery.value === '') { |
const toggleFieldVisibility = (checked: boolean, field: any) => { |
||||||
return true |
const fieldIndex = fields.value?.findIndex((f) => f.fk_column_id === field.fk_column_id) |
||||||
} else { |
if (!fieldIndex && fieldIndex !== 0) return |
||||||
return field.title.toLowerCase().includes(filterQuery.value.toLowerCase()) |
addUndo({ |
||||||
} |
undo: { |
||||||
}) || [] |
fn: (v: boolean) => { |
||||||
) |
field.show = !v |
||||||
}) |
saveOrUpdate(field, fieldIndex) |
||||||
|
}, |
||||||
const sortedAndFilteredFields = computed<ColumnType[]>(() => { |
args: [checked], |
||||||
return (fields?.value |
|
||||||
?.filter((field: Field) => { |
|
||||||
// hide system columns if not enabled
|
|
||||||
if ( |
|
||||||
!showSystemFields.value && |
|
||||||
metaColumnById.value && |
|
||||||
metaColumnById?.value?.[field.fk_column_id!] && |
|
||||||
isSystemColumn(metaColumnById.value?.[field.fk_column_id!]) && |
|
||||||
!metaColumnById.value?.[field.fk_column_id!]?.pv |
|
||||||
) { |
|
||||||
return false |
|
||||||
} |
|
||||||
return field.show && metaColumnById?.value?.[field.fk_column_id!] |
|
||||||
}) |
|
||||||
?.sort((a: Field, b: Field) => a.order - b.order) |
|
||||||
?.map((field: Field) => metaColumnById?.value?.[field.fk_column_id!]) || []) as ColumnType[] |
|
||||||
}) |
|
||||||
|
|
||||||
const toggleFieldVisibility = (checked: boolean, field: any) => { |
|
||||||
const fieldIndex = fields.value?.findIndex((f) => f.fk_column_id === field.fk_column_id) |
|
||||||
if (!fieldIndex && fieldIndex !== 0) return |
|
||||||
addUndo({ |
|
||||||
undo: { |
|
||||||
fn: (v: boolean) => { |
|
||||||
field.show = !v |
|
||||||
saveOrUpdate(field, fieldIndex) |
|
||||||
}, |
}, |
||||||
args: [checked], |
redo: { |
||||||
}, |
fn: (v: boolean) => { |
||||||
redo: { |
field.show = v |
||||||
fn: (v: boolean) => { |
saveOrUpdate(field, fieldIndex) |
||||||
field.show = v |
}, |
||||||
saveOrUpdate(field, fieldIndex) |
args: [checked], |
||||||
}, |
}, |
||||||
args: [checked], |
scope: defineViewScope({ view: view.value }), |
||||||
}, |
}) |
||||||
scope: defineViewScope({ view: view.value }), |
saveOrUpdate(field, fieldIndex) |
||||||
}) |
} |
||||||
saveOrUpdate(field, fieldIndex) |
|
||||||
} |
// reload view columns when active view changes
|
||||||
|
// or when columns count changes(delete/add)
|
||||||
// reload view columns when active view changes
|
watch( |
||||||
// or when columns count changes(delete/add)
|
[() => view?.value?.id, () => meta.value?.columns?.length], |
||||||
watch( |
async ([newViewId]) => { |
||||||
[() => view?.value?.id, () => meta.value?.columns?.length], |
// reload only if view belongs to current table
|
||||||
async ([newViewId]) => { |
if (newViewId && view.value?.fk_model_id === meta.value?.id) { |
||||||
// reload only if view belongs to current table
|
isViewColumnsLoading.value = true |
||||||
if (newViewId && view.value?.fk_model_id === meta.value?.id) { |
try { |
||||||
isViewColumnsLoading.value = true |
await loadViewColumns() |
||||||
try { |
} catch (e) { |
||||||
await loadViewColumns() |
console.error(e) |
||||||
} catch (e) { |
} |
||||||
console.error(e) |
isViewColumnsLoading.value = false |
||||||
} |
} |
||||||
isViewColumnsLoading.value = false |
}, |
||||||
|
{ immediate: true }, |
||||||
|
) |
||||||
|
|
||||||
|
const resizingColOldWith = ref('200px') |
||||||
|
|
||||||
|
const updateGridViewColumn = async (id: string, props: Partial<GridColumnReqType>, undo = false) => { |
||||||
|
if (!undo) { |
||||||
|
const oldProps = Object.keys(props).reduce<Partial<GridColumnReqType>>((o: any, k) => { |
||||||
|
if (gridViewCols.value[id][k as keyof GridColumnType]) { |
||||||
|
if (k === 'width') o[k] = `${resizingColOldWith.value}px` |
||||||
|
else o[k] = gridViewCols.value[id][k as keyof GridColumnType] |
||||||
|
} |
||||||
|
return o |
||||||
|
}, {}) |
||||||
|
addUndo({ |
||||||
|
redo: { |
||||||
|
fn: (w: Partial<GridColumnReqType>) => updateGridViewColumn(id, w, true), |
||||||
|
args: [props], |
||||||
|
}, |
||||||
|
undo: { |
||||||
|
fn: (w: Partial<GridColumnReqType>) => updateGridViewColumn(id, w, true), |
||||||
|
args: [oldProps], |
||||||
|
}, |
||||||
|
scope: defineViewScope({ view: view.value }), |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
// sync with server if allowed
|
||||||
|
if (!isPublic.value && isUIAllowed('viewFieldEdit') && gridViewCols.value[id]?.id) { |
||||||
|
await $api.dbView.gridColumnUpdate(gridViewCols.value[id].id as string, { |
||||||
|
...props, |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
if (gridViewCols.value?.[id]) { |
||||||
|
Object.assign(gridViewCols.value[id], { |
||||||
|
...gridViewCols.value[id], |
||||||
|
...props, |
||||||
|
}) |
||||||
|
} else { |
||||||
|
// fallback to reload
|
||||||
|
await loadViewColumns() |
||||||
} |
} |
||||||
}, |
} |
||||||
{ immediate: true }, |
|
||||||
) |
return { |
||||||
|
fields, |
||||||
return { |
loadViewColumns, |
||||||
fields, |
filteredFieldList, |
||||||
loadViewColumns, |
filterQuery, |
||||||
filteredFieldList, |
showAll, |
||||||
filterQuery, |
hideAll, |
||||||
showAll, |
saveOrUpdate, |
||||||
hideAll, |
sortedAndFilteredFields, |
||||||
saveOrUpdate, |
showSystemFields, |
||||||
sortedAndFilteredFields, |
metaColumnById, |
||||||
showSystemFields, |
toggleFieldVisibility, |
||||||
metaColumnById, |
isViewColumnsLoading, |
||||||
toggleFieldVisibility, |
updateGridViewColumn, |
||||||
isViewColumnsLoading, |
gridViewCols, |
||||||
} |
resizingColOldWith, |
||||||
|
} |
||||||
|
}, |
||||||
|
'useViewColumnsOrThrow', |
||||||
|
) |
||||||
|
|
||||||
|
export { useProvideViewColumns } |
||||||
|
|
||||||
|
export function useViewColumnsOrThrow() { |
||||||
|
const viewColumns = useViewColumns() |
||||||
|
if (viewColumns == null) throw new Error('Please call `useProvideViewColumns` on the appropriate parent component') |
||||||
|
return viewColumns |
||||||
} |
} |
||||||
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue