77 lines
1.5 KiB
Svelte
77 lines
1.5 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";
|
|
|
|
const selectedWidgets = [
|
|
{
|
|
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>
|