39 lines
1.1 KiB
Svelte
39 lines
1.1 KiB
Svelte
<script>
|
|
import {onMount} from 'svelte';
|
|
import {api} from '../urls.svelte.js';
|
|
import {t} from '../translations.svelte.js';
|
|
|
|
const icons = {
|
|
10 : '',
|
|
20 : '',
|
|
40 : '',
|
|
60 : '',
|
|
100: ''
|
|
}
|
|
|
|
let {
|
|
caption = t('select_state'),
|
|
selected = $bindable(0),
|
|
onchange = (val) => console.log('changed to '+val),
|
|
project = null
|
|
} = $props();
|
|
</script>
|
|
|
|
{#if project?.allowed_states}
|
|
<!--<select bind:value={selected} onchange={() => onchange(selected)}>
|
|
{#each Object.entries(project.allowed_states) as [code,name]}
|
|
<option value={+code}>{code%10?name:t('state_'+name.toLowerCase())}</option>
|
|
{/each}
|
|
</select>-->
|
|
<span class="states">
|
|
{#each Object.entries(project.allowed_states) as [code,name]}
|
|
<button onclick={e => onchange(code)} title={code%10?name:t('state_'+name.toLowerCase())} class={selected == code?'active':null}>
|
|
{#if icons[code]}
|
|
<span class="symbol">{icons[code]}</span>
|
|
{:else}
|
|
{code%10?name:t('state_'+name.toLowerCase())}
|
|
{/if}
|
|
</button>
|
|
{/each}
|
|
</span>
|
|
{/if} |