lfk/frontend
2
0
Fork 0
Code Issues 3 Pull Requests Actions Projects Releases Wiki Activity

New select

Browse Source 
ref #91
This commit is contained in:
Nicolai Ort 2021-03-13 14:45:27 +01:00
parent 65111e87c1
commit fe16c66cf2
1 changed files with 21 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/donations/AddDonationModal.svelte
View File

@ -7,9 +7,13 @@
DonorService,
RunnerService,
} from "@odit/lfk-client-js";
import Select from "svelte-select";
import Toastify from "toastify-js";
export let modal_open;
export let current_donations;
const getOptionLabel = (option) =>
option.firstname + " " + (option.middlename || "") + " " + option.lastname;
const getSelectionLabel = getOptionLabel;
function focus(el) {
el.focus();
}
@ -179,7 +183,9 @@
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
<h3 class="text-lg leading-6 font-medium text-gray-900">
<!-- TODO: -->
{#if is_fixed}{$_('create-a-new-fixed-donation')}{:else}{$_('create-a-new-distance-donation')}{/if}
{#if is_fixed}
{$_('create-a-new-fixed-donation')}
{:else}{$_('create-a-new-distance-donation')}{/if}
</h3>
<label class="content-center align-middle object-center">
<span
@ -203,7 +209,16 @@
<label
for="donor"
class="block text-sm font-medium text-gray-700">{$_('donor')}</label>
<select
<Select
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
{getSelectionLabel}
{getOptionLabel}
items={donors}
showChevron={true}
placeholder="Search for donor..."
on:select={(selected) => (donor = selected.detail.id)} />
<!-- <select
bind:value={donor}
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2">
{#each donors as d}
@ -213,7 +228,7 @@
{d.lastname}
</option>
{/each}
</select>
</select> -->
</div>
{#if !is_fixed}
<div class="col-span-6">
@ -237,7 +252,9 @@
<label
for="donation_amount_eur"
class="block text-sm font-medium text-gray-700">
{#if !is_fixed}{$_('amount-per-kilometer')}{:else}{$_('donation-amount')}{/if}</label>
{#if !is_fixed}
{$_('amount-per-kilometer')}
{:else}{$_('donation-amount')}{/if}</label>
<div class="mt-1 flex rounded-md shadow-sm">
<input
autocomplete="off"