default sorting on schemas

This commit is contained in:
2023-10-23 19:43:59 +03:00
parent 868a97f68b
commit cd1d380483
11 changed files with 90 additions and 44 deletions
+15 -17
View File
@@ -4,24 +4,22 @@
const dispatch = createEventDispatcher();
export let schema;
export let sort;
export let sortParam;
export let sortField;
export let inModal;
export let modalUrl;
export let systemFields = [];
$: activeField = [...schema.fields, ...systemFields].find(
(f) => f.name === sort || "-" + f.name === sort || "data." + f.name === sort || "-data." + f.name === sort
);
$: sortableFields = schema.fields.filter(
(f) => !["reference", "file", "json", "id", "tab"].includes(f.ui)
(f) => !["reference", "file", "json", "id", "rich", "markdown", "block"].includes(f.info.name)
);
$: systemFieldsFiltered = systemFields;
$: if (schema.type === "collection") {
systemFieldsFiltered = systemFields.filter((f) => f.files === false);
}
function sortField(fieldSort) {
function triggerSortField(fieldSort) {
const url = new URL(modalUrl ?? window.location.href);
url.searchParams.set("sort", fieldSort);
if (inModal) {
@@ -33,14 +31,14 @@
function sortAsc(e, field) {
e.preventDefault();
let prefix = systemFields.includes(el => el.name === field.name) ? "" : "data.";
return sortField(prefix + field.name);
let prefix = systemFields.map((el) => el.name).includes(field.name) ? "" : "data.";
return triggerSortField(prefix + field.name);
}
function sortDesc(e, field) {
e.preventDefault();
let prefix = systemFields.includes(el => el.name === field.name) ? "" : "data.";
return sortField("-" + prefix + field.name);
let prefix = systemFields.map((el) => el.name).includes(field.name) ? "" : "data.";
return triggerSortField("-" + prefix + field.name);
}
</script>
@@ -52,12 +50,12 @@
data-bs-auto-close="outside"
aria-expanded="false"
>
{#if sort.startsWith("-")}
{#if sortParam.startsWith("-")}
<Icon icon="arrow-down-wide-short"/>
{:else}
<Icon icon="arrow-up-short-wide"/>
{/if}
<span class="ms-1">{activeField.label}</span>
<span class="ms-1">{sortField.label}</span>
</button>
<div class="dropdown-menu" style="width:auto;max-width:800px;">
<div class="row">
@@ -67,7 +65,7 @@
<button
on:click={(e) => sortAsc(e, field)}
title="Sort Ascending"
class="btn btn-sm {field.name == sort
class="btn btn-sm {field.name == sortField.name && !sortParam.startsWith("-")
? 'btn-primary'
: 'btn-outline-primary'} "
>
@@ -76,7 +74,7 @@
<button
on:click={(e) => sortDesc(e, field)}
title="Sort Descending"
class="btn btn-sm {'-' + field.name == sort
class="btn btn-sm {field.name == sortField.name && sortParam.startsWith("-")
? 'btn-primary'
: 'btn-outline-primary'} "
>
@@ -102,7 +100,7 @@
<button
on:click={(e) => sortAsc(e, field)}
title="Sort Ascending"
class="btn btn-sm {field.name == sort
class="btn btn-sm {field.name == sortParam
? 'btn-primary'
: 'btn-outline-primary'} "
>
@@ -111,7 +109,7 @@
<button
on:click={(e) => sortDesc(e, field)}
title="Sort Descending"
class="btn btn-sm {'-' + field.name == sort
class="btn btn-sm {'-' + field.name == sortParam
? 'btn-primary'
: 'btn-outline-primary'} "
>