style(webui): add icons to InspectTypeEditor
This commit is contained in:
parent
e4ec6a0b52
commit
85c613f09a
1 changed files with 8 additions and 1 deletions
|
@ -10,6 +10,8 @@
|
||||||
import { ATTR_OF } from '@upnd/upend/constants';
|
import { ATTR_OF } from '@upnd/upend/constants';
|
||||||
import { createEventDispatcher } from 'svelte';
|
import { createEventDispatcher } from 'svelte';
|
||||||
import LabelBorder from './utils/LabelBorder.svelte';
|
import LabelBorder from './utils/LabelBorder.svelte';
|
||||||
|
import Icon from '$lib/components/utils/Icon.svelte';
|
||||||
|
|
||||||
const dispatch = createEventDispatcher();
|
const dispatch = createEventDispatcher();
|
||||||
|
|
||||||
export let entity: Readable<UpObject | undefined>;
|
export let entity: Readable<UpObject | undefined>;
|
||||||
|
@ -21,6 +23,7 @@
|
||||||
|
|
||||||
let types: Array<{ address: string; entry: UpEntry; required: UpEntry | undefined }> = [];
|
let types: Array<{ address: string; entry: UpEntry; required: UpEntry | undefined }> = [];
|
||||||
$: updateTypes($entity?.attr[`~${ATTR_OF}`] || []);
|
$: updateTypes($entity?.attr[`~${ATTR_OF}`] || []);
|
||||||
|
|
||||||
async function updateTypes(entries: UpEntry[]) {
|
async function updateTypes(entries: UpEntry[]) {
|
||||||
types = [];
|
types = [];
|
||||||
const query = await api.query(
|
const query = await api.query(
|
||||||
|
@ -122,7 +125,11 @@
|
||||||
class:required={type.required}
|
class:required={type.required}
|
||||||
on:click={() => setRequired(type.entry, !type.required)}
|
on:click={() => setRequired(type.entry, !type.required)}
|
||||||
>
|
>
|
||||||
{type.required ? $i18n.t('Required') : $i18n.t('Optional')}
|
{#if type.required}
|
||||||
|
<Icon plain name="lock" /> {$i18n.t('Required')}
|
||||||
|
{:else}
|
||||||
|
<Icon plain name="lock-open" /> {$i18n.t('Optional')}
|
||||||
|
{/if}
|
||||||
</button>
|
</button>
|
||||||
<div class="controls">
|
<div class="controls">
|
||||||
<IconButton name="x-circle" on:click={() => remove(type.entry)} />
|
<IconButton name="x-circle" on:click={() => remove(type.entry)} />
|
||||||
|
|
Loading…
Reference in a new issue