wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

Merge pull request 'feat(VnTable): add slots for columns' (!512) from 6825-vnTable-column-slots into dev 

Reviewed-on: verdnatura/salix-front#512
Reviewed-by: Javier Segarra <jsegarra@verdnatura.es>
This commit is contained in:
Javier Segarra 2024-07-02 13:03:26 +00:00
parent 73ec367987 6d12c0f00c
commit 07f76de8b7
1 changed files with 41 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
src/components/VnTable/VnTable.vue
View File

@ -59,6 +59,10 @@ const $props = defineProps({
type: Boolean,
default: false,
},
hasSubtoolbar: {
type: Boolean,
default: true,
},
});
const { t } = useI18n();
const stateStore = useStateStore();
@ -175,11 +179,14 @@ function columnName(col) {
}
function getColAlign(col) {
return 'text-' + (col.align ?? 'left')
return 'text-' + (col.align ?? 'left');
}
const emit = defineEmits(['onFetch', 'update:selected', 'saveChanges']);
defineExpose({
reload,
redirect: redirectFn,
selected,
});
</script>
<template>
@ -225,11 +232,18 @@ defineExpose({
:search-url="searchUrl"
:disable-infinite-scroll="mode == TABLE_MODE"
@save-changes="reload"
:has-subtoolbar="isEditable"
:has-subtoolbar="$attrs['hasSubtoolbar'] ?? isEditable"
>
<template
v-for="(_, slotName) in $slots"
#[slotName]="slotData"
:key="slotName"
>
<slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" />
</template>
<template #body="{ rows }">
<QTable
v-bind="$attrs['QTable']"
v-bind="$attrs['q-table']"
class="vnTable"
:columns="splittedColumns.columns"
:rows="rows"
@ -246,6 +260,7 @@ defineExpose({
CrudModelRef.vnPaginateRef.paginate()
"
@row-click="(_, row) => rowClickFunction(row)"
@update:selected="emit('update:selected', $event)"
>
<template #top-left>
<slot name="top-left"></slot>
@ -310,13 +325,15 @@ defineExpose({
class="no-margin q-px-xs"
:class="getColAlign(col)"
>
<VnTableColumn
:column="col"
:row="row"
:is-editable="false"
v-model="row[col.name]"
component-prop="columnField"
/>
<slot :name="`column-${col.name}`" :col="col" :row="row">
<VnTableColumn
:column="col"
:row="row"
:is-editable="false"
v-model="row[col.name]"
component-prop="columnField"
/>
</slot>
</QTd>
</template>
<template #body-cell-tableActions="{ col, row }">
@ -412,14 +429,20 @@ defineExpose({
stopEventPropagation($event)
"
>
<VnTableColumn
:column="col"
<slot
:name="`column-${col.name}`"
:col="col"
:row="row"
:is-editable="false"
v-model="row[col.name]"
component-prop="columnField"
:show-label="true"
/>
>
<VnTableColumn
:column="col"
:row="row"
:is-editable="false"
v-model="row[col.name]"
component-prop="columnField"
:show-label="true"
/>
</slot>
</span>
</template>
</VnLv>
@ -477,6 +500,7 @@ defineExpose({
default="input"
v-model="data[column.name]"
:show-label="true"
component-prop="columnCreate"
/>
<slot name="more-create-dialog" :data="data" />
</div>