124 lines
4.0 KiB
Svelte
124 lines
4.0 KiB
Svelte
<script>
|
|
import Icon from "../../common/Icon.svelte";
|
|
|
|
import {createEventDispatcher, getContext} from "svelte";
|
|
import Preview from "../../files/Preview.svelte";
|
|
import {previewTitle} from "./../Preview";
|
|
import {fileurl, htmlurl} from "../../files/imageserver.js"
|
|
import Status from "./../Status.svelte";
|
|
import Dropdown from "../../common/Dropdown.svelte";
|
|
|
|
const dispatch = createEventDispatcher();
|
|
const channel = getContext("channel");
|
|
export let record;
|
|
export let edge;
|
|
export let hasDelete = false;
|
|
export let hasInsert = false;
|
|
|
|
let schema = channel.schemas.find((aschema) => aschema.name === record.schema);
|
|
let cardTitle = previewTitle(channel.schemas, record);
|
|
let imagePresets = Object.keys(channel.imageFilters);
|
|
|
|
function remove(e) {
|
|
e.preventDefault();
|
|
dispatch("remove", record.id);
|
|
}
|
|
|
|
function restore(e) {
|
|
e.preventDefault();
|
|
dispatch("restore", record.id);
|
|
}
|
|
|
|
function fullDelete(e) {
|
|
e.preventDefault();
|
|
dispatch("fulldelete", record.id);
|
|
}
|
|
|
|
function insert(e, preset) {
|
|
e.preventDefault();
|
|
let html = htmlurl(channel, record, preset)
|
|
let url = !preset ? `/${record._file.path}` : `/templates/${preset}/${record._file.path}`;
|
|
dispatch("editor-insert", {
|
|
html: html,
|
|
url: channel.filesUrl + url,
|
|
originalUrl: channel.filesUrl + "/" + record._file.path,
|
|
record: record
|
|
});
|
|
}
|
|
|
|
</script>
|
|
|
|
<div class="preview-file" class:is-trashed={edge?._isTrashed}>
|
|
<div style="display: flex;align-items: center;gap: 10px;">
|
|
<div class="image">
|
|
<Preview {record} size="small"/>
|
|
</div>
|
|
<div class="title">
|
|
<div>
|
|
<a
|
|
class="record-title"
|
|
href="{channel.lucentUrl}/records/{record.id}"
|
|
>
|
|
{cardTitle}
|
|
{#if edge?._isTrashed}
|
|
<span class="trashed-text">will remove on save</span>
|
|
{/if}
|
|
</a>
|
|
<small class="d-block">
|
|
from {schema.label}
|
|
{#if record.status === "draft"}
|
|
<Status status={record.status}/>
|
|
{/if}
|
|
</small>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<div style="display: flex;gap:4px; align-items: center; margin-right: 10px;">
|
|
{#if hasInsert}
|
|
<div class="reference-action">
|
|
<Dropdown>
|
|
<div slot="button">
|
|
<Icon icon="photo-film"/>
|
|
</div>
|
|
<button class="dropdown-item button" on:click={e => insert(e,null)}>original</button>
|
|
{#each imagePresets as preset}
|
|
<button class="dropdown-item button" on:click={e => insert(e,preset)}>{preset}</button>
|
|
{/each}
|
|
</Dropdown>
|
|
|
|
</div>
|
|
{/if}
|
|
{#if hasDelete}
|
|
<div class="reference-action">
|
|
{#if edge?._isTrashed}
|
|
<button
|
|
title="Restore"
|
|
class="button"
|
|
on:click={restore}
|
|
>
|
|
<Icon icon="undo"/>
|
|
</button>
|
|
<button
|
|
title="Delete from everywhere"
|
|
class="button"
|
|
on:click={fullDelete}
|
|
>
|
|
<Icon icon="destroy"/>
|
|
</button>
|
|
{:else}
|
|
<button
|
|
title="Remove"
|
|
class="button"
|
|
on:click={remove}
|
|
>
|
|
<Icon icon="trash-can"/>
|
|
</button>
|
|
{/if}
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
|