fix: corregir formato de columnas UTable para compatibilidad con Nuxt UI v4
- Cambiar estructura de columnas de {key, label} a {accessorKey, header, id}
- Cambiar prop :rows a :data en componente UTable
- Actualizar referencias en selector de columnas
This commit is contained in:
@@ -122,23 +122,23 @@
|
||||
<div class="grid grid-cols-2 md:grid-cols-4 gap-2">
|
||||
<label
|
||||
v-for="column in tableColumns"
|
||||
:key="column.key"
|
||||
:key="column.id"
|
||||
class="flex items-center gap-2 text-sm cursor-pointer hover:text-[var(--brand-text)]"
|
||||
>
|
||||
<input
|
||||
type="checkbox"
|
||||
:checked="visibleColumns.includes(column.key)"
|
||||
@change="toggleColumn(column.key)"
|
||||
:checked="visibleColumns.includes(column.id)"
|
||||
@change="toggleColumn(column.id)"
|
||||
class="rounded"
|
||||
/>
|
||||
<span>{{ column.label }}</span>
|
||||
<span>{{ column.header }}</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Table -->
|
||||
<UTable
|
||||
:rows="paginatedData"
|
||||
:data="paginatedData"
|
||||
:columns="displayColumns"
|
||||
:loading="loadingData"
|
||||
/>
|
||||
@@ -252,8 +252,9 @@ const tableColumns = computed(() => {
|
||||
|
||||
const firstRow = tableData.value[0]
|
||||
const cols = Object.keys(firstRow).map(key => ({
|
||||
key,
|
||||
label: upperFirst(key)
|
||||
accessorKey: key,
|
||||
header: upperFirst(key),
|
||||
id: key
|
||||
}))
|
||||
console.log('📊 tableColumns computed:', cols.length, 'columns')
|
||||
return cols
|
||||
@@ -261,10 +262,11 @@ const tableColumns = computed(() => {
|
||||
|
||||
const displayColumns = computed(() => {
|
||||
const filtered = tableColumns.value
|
||||
.filter(col => visibleColumns.value.includes(col.key))
|
||||
.filter(col => visibleColumns.value.includes(col.id))
|
||||
.map(col => ({
|
||||
key: col.key,
|
||||
label: col.label
|
||||
accessorKey: col.accessorKey,
|
||||
header: col.header,
|
||||
id: col.id
|
||||
}))
|
||||
console.log('📊 displayColumns computed:', filtered.length, 'visible columns')
|
||||
return filtered
|
||||
|
||||
Reference in New Issue
Block a user