create record wip
This commit is contained in:
@@ -1,15 +1,14 @@
|
||||
<script>
|
||||
import {createEventDispatcher, getContext} from "svelte";
|
||||
import Icon from "../../common/Icon.svelte";
|
||||
import { createEventDispatcher, getContext } from "svelte";
|
||||
import Icon from "../../../common/Icon.svelte";
|
||||
|
||||
const channel = getContext("channel");
|
||||
const channel = getContext("channel");
|
||||
const dispatch = createEventDispatcher();
|
||||
export let inModal;
|
||||
export let modalUrl;
|
||||
const url = new URL(modalUrl ?? window.location.href);
|
||||
|
||||
function removeFilter(k) {
|
||||
|
||||
const url = new URL(modalUrl ?? window.location.href);
|
||||
url.searchParams.set("skip", "0");
|
||||
url.searchParams.delete("notlinked");
|
||||
@@ -20,16 +19,17 @@
|
||||
}
|
||||
}
|
||||
</script>
|
||||
{#if url.searchParams.get("notlinked")}
|
||||
<span class="applied-filter">
|
||||
|
||||
{#if url.searchParams.get("notlinked")}
|
||||
<span class="applied-filter">
|
||||
Not linked
|
||||
|
||||
<button
|
||||
on:click|preventDefault={() => removeFilter()}
|
||||
type="button"
|
||||
class="button-text"
|
||||
aria-label="Close"
|
||||
><Icon width={12} height={12} icon="close"></Icon></button>
|
||||
</span>
|
||||
{/if}
|
||||
on:click|preventDefault={() => removeFilter()}
|
||||
type="button"
|
||||
class="button-text"
|
||||
aria-label="Close"
|
||||
><Icon width={12} height={12} icon="close"></Icon></button
|
||||
>
|
||||
</span>
|
||||
{/if}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<script>
|
||||
import Icon from "../../common/Icon.svelte";
|
||||
import {createEventDispatcher} from "svelte";
|
||||
import Icon from "../../../common/Icon.svelte";
|
||||
import { createEventDispatcher } from "svelte";
|
||||
import Dropdown from "../../common/Dropdown.svelte";
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
@@ -12,14 +12,22 @@
|
||||
export let systemFields = [];
|
||||
|
||||
$: sortableFields = schema.fields.filter(
|
||||
(f) => !["reference", "file", "json", "id", "rich", "markdown", "block"].includes(f.info.name)
|
||||
(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 triggerSortField(fieldSort) {
|
||||
const url = new URL(modalUrl ?? window.location.href);
|
||||
url.searchParams.set("sort", fieldSort);
|
||||
@@ -32,91 +40,91 @@
|
||||
|
||||
function sortAsc(e, field) {
|
||||
e.preventDefault();
|
||||
let prefix = systemFields.map((el) => el.name).includes(field.name) ? "" : "data.";
|
||||
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.map((el) => el.name).includes(field.name) ? "" : "data.";
|
||||
let prefix = systemFields.map((el) => el.name).includes(field.name)
|
||||
? ""
|
||||
: "data.";
|
||||
return triggerSortField("-" + prefix + field.name);
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<Dropdown>
|
||||
<div slot="button">
|
||||
{#if sortParam.startsWith("-")}
|
||||
<Icon icon="arrow-down-wide-short"/>
|
||||
<Icon icon="arrow-down-wide-short" />
|
||||
{:else}
|
||||
<Icon icon="arrow-up-short-wide"/>
|
||||
<Icon icon="arrow-up-short-wide" />
|
||||
{/if}
|
||||
<span class="ms-1">{sortField.label}</span>
|
||||
</div>
|
||||
<div>
|
||||
{#each sortableFields as field}
|
||||
<div class="dropdown-item">
|
||||
<button
|
||||
{#each sortableFields as field}
|
||||
<div class="dropdown-item">
|
||||
<button
|
||||
on:click={(e) => sortAsc(e, field)}
|
||||
title="Sort Ascending"
|
||||
class="button button-icon {field.name == sortField.name && !sortParam.startsWith("-")
|
||||
? 'active'
|
||||
: ''} "
|
||||
>
|
||||
|
||||
|
||||
<Icon icon="arrow-up-short-wide"/>
|
||||
</button>
|
||||
<button
|
||||
class="button button-icon {field.name == sortField.name &&
|
||||
!sortParam.startsWith('-')
|
||||
? 'active'
|
||||
: ''} "
|
||||
>
|
||||
<Icon icon="arrow-up-short-wide" />
|
||||
</button>
|
||||
<button
|
||||
on:click={(e) => sortDesc(e, field)}
|
||||
title="Sort Descending"
|
||||
class="button button-icon {field.name == sortField.name && sortParam.startsWith("-")
|
||||
? 'active'
|
||||
: ''} "
|
||||
>
|
||||
|
||||
|
||||
<Icon icon="arrow-down-wide-short"/>
|
||||
</button>
|
||||
<button
|
||||
class="button button-icon {field.name == sortField.name &&
|
||||
sortParam.startsWith('-')
|
||||
? 'active'
|
||||
: ''} "
|
||||
>
|
||||
<Icon icon="arrow-down-wide-short" />
|
||||
</button>
|
||||
<button
|
||||
title="Sort Ascending"
|
||||
on:click={(e) => sortAsc(e, field)}
|
||||
class="button"
|
||||
>
|
||||
{field.label}
|
||||
</button>
|
||||
</div>
|
||||
{/each}
|
||||
<h6 class="dropdown-header">System</h6>
|
||||
{#each systemFieldsFiltered as field}
|
||||
<div class="dropdown-item">
|
||||
|
||||
<button
|
||||
>
|
||||
{field.label}
|
||||
</button>
|
||||
</div>
|
||||
{/each}
|
||||
<h6 class="dropdown-header">System</h6>
|
||||
{#each systemFieldsFiltered as field}
|
||||
<div class="dropdown-item">
|
||||
<button
|
||||
on:click={(e) => sortAsc(e, field)}
|
||||
title="Sort Ascending"
|
||||
class="button button-icon {field.name == sortParam
|
||||
? 'active'
|
||||
: ''} "
|
||||
>
|
||||
<Icon icon="arrow-up-short-wide"/>
|
||||
</button>
|
||||
<button
|
||||
class="button button-icon {field.name == sortParam
|
||||
? 'active'
|
||||
: ''} "
|
||||
>
|
||||
<Icon icon="arrow-up-short-wide" />
|
||||
</button>
|
||||
<button
|
||||
on:click={(e) => sortDesc(e, field)}
|
||||
title="Sort Descending"
|
||||
class="button button-icon {'-' + field.name == sortParam
|
||||
? 'active'
|
||||
: ''} "
|
||||
>
|
||||
<Icon icon="arrow-down-wide-short"/>
|
||||
</button>
|
||||
<button
|
||||
class="button button-icon {'-' + field.name == sortParam
|
||||
? 'active'
|
||||
: ''} "
|
||||
>
|
||||
<Icon icon="arrow-down-wide-short" />
|
||||
</button>
|
||||
<button
|
||||
title="Sort Ascending"
|
||||
on:click={(e) => sortAsc(e, field)}
|
||||
class="button"
|
||||
>
|
||||
{field.label}
|
||||
</button>
|
||||
</div>
|
||||
{/each}
|
||||
>
|
||||
{field.label}
|
||||
</button>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
</Dropdown>
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
<script>
|
||||
import FilterFields from "./FilterFields.svelte";
|
||||
import Uploader from "../../files/Uploader.svelte";
|
||||
import Icon from "../../common/Icon.svelte";
|
||||
import Icon from "../../../common/Icon.svelte";
|
||||
import SortFields from "./SortFields.svelte";
|
||||
import AppliedFilter from "./AppliedFilter.svelte";
|
||||
import {createEventDispatcher, getContext} from "svelte";
|
||||
import { createEventDispatcher, getContext } from "svelte";
|
||||
import Dropdown from "../../common/Dropdown.svelte";
|
||||
import AppliedFilterNotLinked from "./AppliedFilterNotLinked.svelte";
|
||||
|
||||
@@ -41,7 +41,6 @@
|
||||
} else {
|
||||
window.location = url;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function uploadComplete(e) {
|
||||
@@ -51,110 +50,99 @@
|
||||
|
||||
<div class="toolbar">
|
||||
<div class="toolbar-filters">
|
||||
|
||||
<SortFields
|
||||
{schema}
|
||||
{sortParam}
|
||||
{sortField}
|
||||
{systemFields}
|
||||
{inModal}
|
||||
{modalUrl}
|
||||
on:refresh
|
||||
{schema}
|
||||
{sortParam}
|
||||
{sortField}
|
||||
{systemFields}
|
||||
{inModal}
|
||||
{modalUrl}
|
||||
on:refresh
|
||||
/>
|
||||
|
||||
|
||||
<FilterFields
|
||||
bind:schema
|
||||
{systemFields}
|
||||
{operators}
|
||||
{filter}
|
||||
{inModal}
|
||||
{modalUrl}
|
||||
on:refresh
|
||||
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>
|
||||
<input
|
||||
type="search"
|
||||
name="filter[search_regex]"
|
||||
placeholder="Search"
|
||||
class="search"
|
||||
required
|
||||
/>
|
||||
</form>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div style="display:flex;align-items: center;gap:4px">
|
||||
{#if schema.type === "collection"}
|
||||
{#if !inModal && isWritable}
|
||||
<a
|
||||
href="{channel.lucentUrl}/records/new?schema={schema.name}"
|
||||
class="button"
|
||||
href="{channel.lucentUrl}/records/new?schema={schema.name}"
|
||||
class="button"
|
||||
>
|
||||
New Record
|
||||
</a>
|
||||
{/if}
|
||||
{:else }
|
||||
{:else}
|
||||
<div>
|
||||
<Uploader {schema} on:uploadComplete={uploadComplete}/>
|
||||
<Uploader {schema} on:uploadComplete={uploadComplete} />
|
||||
</div>
|
||||
{/if}
|
||||
{#if !inModal}
|
||||
<Dropdown orientation="right">
|
||||
<div slot="button">
|
||||
<Icon icon="ellipsis-vertical"/>
|
||||
<Icon icon="ellipsis-vertical" />
|
||||
</div>
|
||||
{#if filter["status_in"] === "trashed"}
|
||||
{#if isWritable}
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="{channel.lucentUrl}/content/{schema.name}/emptyTrash"
|
||||
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={csvUrl}
|
||||
>Export to CSV</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}?filter[status_in]=trashed"
|
||||
>View trashed records</a
|
||||
>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="{channel.lucentUrl}/content/{schema.name}?notlinked=*"
|
||||
>View unlinked records</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 {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
|
||||
{schema}
|
||||
{operators}
|
||||
key={k}
|
||||
value={v}
|
||||
{inModal}
|
||||
{modalUrl}
|
||||
{graph}
|
||||
on:refresh
|
||||
/>
|
||||
{/each}
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user