139 lines
4.1 KiB
Svelte
139 lines
4.1 KiB
Svelte
<script>
|
|
import FilterFields from "./FilterFields.svelte";
|
|
import Icon from "../../common/Icon.svelte";
|
|
import SortFields from "./SortFields.svelte";
|
|
import AppliedFilter from "./AppliedFilter.svelte";
|
|
import { createEventDispatcher, getContext } from "svelte";
|
|
import Dropdown from "../../common/Dropdown.svelte";
|
|
import AppliedFilterNotLinked from "./AppliedFilterNotLinked.svelte";
|
|
|
|
const channel = getContext("channel");
|
|
|
|
const dispatch = createEventDispatcher();
|
|
export let sortParam;
|
|
export let sortField;
|
|
export let schema;
|
|
export let operators;
|
|
export let filter;
|
|
export let inModal;
|
|
export let modalUrl;
|
|
export let isWritable;
|
|
export let records;
|
|
export let graph;
|
|
export let systemFields = [];
|
|
// export let visibleFields = [];
|
|
|
|
let url = new URL(window.location.href);
|
|
|
|
let csvUrl = url.pathname + "/csv?" + url.searchParams.toString();
|
|
|
|
function search(e) {
|
|
e.preventDefault();
|
|
const data = new FormData(e.target);
|
|
let filterKey = data.keys().next().value;
|
|
let filterValue = data.values().next().value;
|
|
const url = new URL(modalUrl ?? window.location.href);
|
|
url.searchParams.set("skip", "0");
|
|
url.searchParams.set(filterKey, filterValue);
|
|
if (inModal) {
|
|
dispatch("refresh", url);
|
|
} else {
|
|
window.location = url;
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<div class="toolbar">
|
|
<div class="toolbar-filters">
|
|
<SortFields
|
|
{schema}
|
|
{sortParam}
|
|
{sortField}
|
|
{systemFields}
|
|
{inModal}
|
|
{modalUrl}
|
|
on:refresh
|
|
/>
|
|
|
|
<FilterFields
|
|
bind:schema
|
|
{systemFields}
|
|
{operators}
|
|
{filter}
|
|
{inModal}
|
|
{modalUrl}
|
|
on:refresh
|
|
/>
|
|
|
|
<form method="GET" on:submit={search}>
|
|
<input
|
|
type="search"
|
|
name="filter[search_regex]"
|
|
placeholder="Search"
|
|
class="search"
|
|
required
|
|
/>
|
|
</form>
|
|
</div>
|
|
|
|
<div style="display:flex;align-items: center;gap:4px">
|
|
{#if !inModal && isWritable}
|
|
<a
|
|
href="{channel.lucentUrl}/records/new?schema={schema.name}"
|
|
class="button"
|
|
>
|
|
New Record
|
|
</a>
|
|
{/if}
|
|
|
|
{#if !inModal}
|
|
<Dropdown orientation="right">
|
|
<div slot="button">
|
|
<Icon icon="ellipsis-vertical" />
|
|
</div>
|
|
{#if filter["status_in"] === "trashed"}
|
|
{#if isWritable}
|
|
<a
|
|
class="dropdown-item"
|
|
href="{channel.lucentUrl}/content/{schema.name}/emptyTrash"
|
|
>
|
|
Empty trash
|
|
</a>
|
|
{/if}
|
|
{:else}
|
|
<a class="dropdown-item" href={csvUrl}>Export to CSV</a>
|
|
<a
|
|
class="dropdown-item"
|
|
href="{channel.lucentUrl}/content/{schema.name}?filter[status_in]=trashed"
|
|
>View trashed records</a
|
|
>
|
|
<a
|
|
class="dropdown-item"
|
|
href="{channel.lucentUrl}/content/{schema.name}?notlinked=*"
|
|
>View unlinked records</a
|
|
>
|
|
{/if}
|
|
</Dropdown>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="applied-filters">
|
|
<AppliedFilterNotLinked {inModal} {modalUrl} on:refresh
|
|
></AppliedFilterNotLinked>
|
|
{#if Object.entries(filter).length > 0}
|
|
{#each Object.entries(filter) as [k, v]}
|
|
<AppliedFilter
|
|
{schema}
|
|
{operators}
|
|
key={k}
|
|
value={v}
|
|
{inModal}
|
|
{modalUrl}
|
|
{graph}
|
|
on:refresh
|
|
/>
|
|
{/each}
|
|
{/if}
|
|
</div>
|