fix: load more in kanban
This commit is contained in:
Shariq Ansari
parent
9da7693d34
commit
cfc2d9ea94
@ -331,14 +331,24 @@ def get_data(
|
||||
column_data = []
|
||||
else:
|
||||
column_filters.update(filters.copy())
|
||||
page_length = 20
|
||||
|
||||
if kc.get("page_length"):
|
||||
page_length = kc.get("page_length")
|
||||
|
||||
column_data = frappe.get_list(
|
||||
doctype,
|
||||
fields=rows,
|
||||
filters=column_filters,
|
||||
order_by=order_by,
|
||||
page_length=20,
|
||||
page_length=page_length,
|
||||
)
|
||||
|
||||
all_count = len(frappe.get_list(doctype, filters={ column_field: kc.get('name') }))
|
||||
|
||||
kc["all_count"] = all_count
|
||||
kc["count"] = len(column_data)
|
||||
|
||||
for d in column_data:
|
||||
getCounts(d, doctype)
|
||||
|
||||
@ -348,7 +358,7 @@ def get_data(
|
||||
if x.get("name") in kc.get("order") else 0
|
||||
)
|
||||
|
||||
data.append({"column": kc, "fields": kanban_fields, "data": column_data, "count": len(column_data)})
|
||||
data.append({"column": kc, "fields": kanban_fields, "data": column_data})
|
||||
|
||||
fields = frappe.get_meta(doctype).fields
|
||||
fields = [field for field in fields if field.fieldtype not in no_value_fields]
|
||||
|
||||
@ -65,63 +65,76 @@
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<Draggable
|
||||
:list="column.data"
|
||||
group="fields"
|
||||
item-key="name"
|
||||
class="flex flex-col gap-3.5 overflow-y-auto h-full"
|
||||
@end="updateColumn"
|
||||
:data-column="column.column.name"
|
||||
>
|
||||
<template #item="{ element: fields }">
|
||||
<component
|
||||
:is="options.getRoute ? 'router-link' : 'div'"
|
||||
class="pt-3 px-3.5 pb-2.5 rounded-lg border bg-white text-base flex flex-col"
|
||||
:data-name="fields.name"
|
||||
v-bind="{
|
||||
to: options.getRoute ? options.getRoute(fields) : undefined,
|
||||
onClick: options.onClick
|
||||
? () => options.onClick(fields)
|
||||
: undefined,
|
||||
}"
|
||||
>
|
||||
<slot
|
||||
name="title"
|
||||
v-bind="{ fields, titleField, itemName: fields.name }"
|
||||
<div class="overflow-y-auto flex flex-col gap-2">
|
||||
<Draggable
|
||||
:list="column.data"
|
||||
group="fields"
|
||||
item-key="name"
|
||||
class="flex flex-col gap-3.5"
|
||||
@end="updateColumn"
|
||||
:data-column="column.column.name"
|
||||
>
|
||||
<template #item="{ element: fields }">
|
||||
<component
|
||||
:is="options.getRoute ? 'router-link' : 'div'"
|
||||
class="pt-3 px-3.5 pb-2.5 rounded-lg border bg-white text-base flex flex-col"
|
||||
:data-name="fields.name"
|
||||
v-bind="{
|
||||
to: options.getRoute ? options.getRoute(fields) : undefined,
|
||||
onClick: options.onClick
|
||||
? () => options.onClick(fields)
|
||||
: undefined,
|
||||
}"
|
||||
>
|
||||
<div class="h-5 flex items-center">
|
||||
<div v-if="fields[titleField]">{{ fields[titleField] }}</div>
|
||||
<div class="text-gray-500" v-else>{{ __('No Title') }}</div>
|
||||
</div>
|
||||
</slot>
|
||||
<div class="border-b h-px my-2.5" />
|
||||
|
||||
<div class="flex flex-col gap-3.5">
|
||||
<template v-for="value in column.fields" :key="value">
|
||||
<slot
|
||||
name="fields"
|
||||
v-bind="{
|
||||
fields,
|
||||
fieldName: value,
|
||||
itemName: fields.name,
|
||||
}"
|
||||
>
|
||||
<div v-if="fields[value]" class="truncate">
|
||||
{{ fields[value] }}
|
||||
<slot
|
||||
name="title"
|
||||
v-bind="{ fields, titleField, itemName: fields.name }"
|
||||
>
|
||||
<div class="h-5 flex items-center">
|
||||
<div v-if="fields[titleField]">
|
||||
{{ fields[titleField] }}
|
||||
</div>
|
||||
</slot>
|
||||
</template>
|
||||
</div>
|
||||
<div class="border-b h-px mt-2.5 mb-2" />
|
||||
<slot name="actions" v-bind="{ itemName: fields.name }">
|
||||
<div class="flex gap-2 items-center justify-between">
|
||||
<div></div>
|
||||
<Button icon="plus" variant="ghost" @click.stop.prevent />
|
||||
<div class="text-gray-500" v-else>{{ __('No Title') }}</div>
|
||||
</div>
|
||||
</slot>
|
||||
<div class="border-b h-px my-2.5" />
|
||||
|
||||
<div class="flex flex-col gap-3.5">
|
||||
<template v-for="value in column.fields" :key="value">
|
||||
<slot
|
||||
name="fields"
|
||||
v-bind="{
|
||||
fields,
|
||||
fieldName: value,
|
||||
itemName: fields.name,
|
||||
}"
|
||||
>
|
||||
<div v-if="fields[value]" class="truncate">
|
||||
{{ fields[value] }}
|
||||
</div>
|
||||
</slot>
|
||||
</template>
|
||||
</div>
|
||||
</slot>
|
||||
</component>
|
||||
</template>
|
||||
</Draggable>
|
||||
<div class="border-b h-px mt-2.5 mb-2" />
|
||||
<slot name="actions" v-bind="{ itemName: fields.name }">
|
||||
<div class="flex gap-2 items-center justify-between">
|
||||
<div></div>
|
||||
<Button icon="plus" variant="ghost" @click.stop.prevent />
|
||||
</div>
|
||||
</slot>
|
||||
</component>
|
||||
</template>
|
||||
</Draggable>
|
||||
<div
|
||||
v-if="column.column.count < column.column.all_count"
|
||||
class="flex items-center justify-center"
|
||||
>
|
||||
<Button
|
||||
:label="__('Load More')"
|
||||
@click="emit('loadMore', column.column.name)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</Draggable>
|
||||
@ -144,7 +157,7 @@ const props = defineProps({
|
||||
},
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update'])
|
||||
const emit = defineEmits(['update', 'loadMore'])
|
||||
|
||||
const kanban = defineModel()
|
||||
|
||||
|
||||
@ -796,6 +796,25 @@ async function updateKanbanSettings(data) {
|
||||
}
|
||||
}
|
||||
|
||||
function loadMoreKanban(columnName) {
|
||||
let columns = list.value.params.kanban_columns
|
||||
|
||||
if (typeof columns === 'string') {
|
||||
columns = JSON.parse(columns)
|
||||
}
|
||||
|
||||
let column = columns.find((c) => c.name == columnName)
|
||||
|
||||
if (!column.page_length) {
|
||||
column.page_length = 40
|
||||
} else {
|
||||
column.page_length += 20
|
||||
}
|
||||
list.value.params.kanban_columns = columns
|
||||
view.value.kanban_columns = columns
|
||||
list.value.reload()
|
||||
}
|
||||
|
||||
function create_or_update_default_view() {
|
||||
if (route.query.view) return
|
||||
view.value.doctype = props.doctype
|
||||
@ -1073,7 +1092,13 @@ function likeDoc({ name, liked }) {
|
||||
})
|
||||
}
|
||||
|
||||
defineExpose({ applyFilter, applyLikeFilter, likeDoc, updateKanbanSettings })
|
||||
defineExpose({
|
||||
applyFilter,
|
||||
applyLikeFilter,
|
||||
likeDoc,
|
||||
updateKanbanSettings,
|
||||
loadMoreKanban,
|
||||
})
|
||||
|
||||
// Watchers
|
||||
watch(
|
||||
|
||||
@ -36,6 +36,7 @@
|
||||
onNewClick: (column) => onNewClick(column),
|
||||
}"
|
||||
@update="(data) => viewControls.updateKanbanSettings(data)"
|
||||
@loadMore="(columnName) => viewControls.loadMoreKanban(columnName)"
|
||||
>
|
||||
<template #title="{ titleField, itemName }">
|
||||
<div class="flex gap-2 items-center">
|
||||
|
||||
@ -37,6 +37,7 @@
|
||||
onNewClick: (column) => onNewClick(column),
|
||||
}"
|
||||
@update="(data) => viewControls.updateKanbanSettings(data)"
|
||||
@loadMore="(columnName) => viewControls.loadMoreKanban(columnName)"
|
||||
>
|
||||
<template #title="{ titleField, itemName }">
|
||||
<div class="flex items-center gap-2">
|
||||
|
||||
@ -32,6 +32,7 @@
|
||||
onNewClick: (column) => createTask(column),
|
||||
}"
|
||||
@update="(data) => viewControls.updateKanbanSettings(data)"
|
||||
@loadMore="(columnName) => viewControls.loadMoreKanban(columnName)"
|
||||
>
|
||||
<template #title="{ titleField, itemName }">
|
||||
<div class="flex items-center gap-2">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user