78 lines
1.4 KiB
Svelte
78 lines
1.4 KiB
Svelte
<script lang="ts">
|
|
import { i18n } from '../i18n';
|
|
import { selected } from './EntitySelect.svelte';
|
|
import EntryView from './EntryView.svelte';
|
|
import MultiGroupEditor from './MultiGroupEditor.svelte';
|
|
import Icon from './utils/Icon.svelte';
|
|
import EntityList from './widgets/EntityList.svelte';
|
|
import type { Widget } from '$lib/components/EntryView.svelte';
|
|
|
|
const selectedWidgets: Widget[] = [
|
|
{
|
|
name: 'List',
|
|
icon: 'list-check',
|
|
components: ({ entities }) => [
|
|
{
|
|
component: EntityList,
|
|
props: {
|
|
entities,
|
|
thumbnails: false,
|
|
select: 'remove'
|
|
}
|
|
}
|
|
]
|
|
},
|
|
{
|
|
name: 'EntityList',
|
|
icon: 'image',
|
|
components: ({ entities }) => [
|
|
{
|
|
component: EntityList,
|
|
props: {
|
|
entities,
|
|
thumbnails: true,
|
|
select: 'remove'
|
|
}
|
|
}
|
|
]
|
|
}
|
|
];
|
|
</script>
|
|
|
|
<div class="view">
|
|
<h2>
|
|
<Icon plain name="select-multiple" />
|
|
{$i18n.t('Selected')}: {$selected.length}
|
|
</h2>
|
|
<div class="actions">
|
|
<MultiGroupEditor entities={$selected} />
|
|
</div>
|
|
<div class="entities">
|
|
<EntryView
|
|
title={$i18n.t('Selected entities') || ''}
|
|
entities={$selected}
|
|
widgets={selectedWidgets}
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<style lang="scss">
|
|
.view {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
}
|
|
|
|
h2 {
|
|
text-align: center;
|
|
margin: 0;
|
|
margin-top: -0.66em;
|
|
}
|
|
|
|
.entities {
|
|
flex-grow: 1;
|
|
overflow-y: auto;
|
|
height: 0;
|
|
}
|
|
</style>
|