Fixed select bug for sponsoring modal 🐞

ref #98
This commit is contained in:
Nicolai Ort 2021-03-18 16:04:20 +01:00
parent b1031e3115
commit 77662b9c19

View File

@ -15,7 +15,7 @@
option.firstname + " " + (option.middlename || "") + " " + option.lastname; option.firstname + " " + (option.middlename || "") + " " + option.lastname;
const filterDonors = (label, filterText, option) => const filterDonors = (label, filterText, option) =>
label.toLowerCase().includes(filterText.toLowerCase()) || label.toLowerCase().includes(filterText.toLowerCase()) ||
option.id.toString().startsWith(filterText.toLowerCase()); option.value.id.toString().startsWith(filterText.toLowerCase());
function focus(el) { function focus(el) {
el.focus(); el.focus();
} }
@ -25,12 +25,14 @@
$: runners = []; $: runners = [];
$: is_fixed = false; $: is_fixed = false;
DonorService.donorControllerGetAll().then((val) => { DonorService.donorControllerGetAll().then((val) => {
donors = val; donors = val.map((r) => {
donor = donors[0].id || 0; return { label: getDonorLabel(r), value: r };
});
}); });
RunnerService.runnerControllerGetAll().then((val) => { RunnerService.runnerControllerGetAll().then((val) => {
runners = val; runners = val.map((r) => {
runner = runners[0].id || 0; return { label: getDonorLabel(r), value: r };
});
}); });
$: amount_input = 0; $: amount_input = 0;
$: processed_last_submit = true; $: processed_last_submit = true;
@ -184,7 +186,6 @@
</div> </div>
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left"> <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"> <h3 class="text-lg leading-6 font-medium text-gray-900">
<!-- TODO: -->
{#if is_fixed} {#if is_fixed}
{$_('create-a-new-fixed-donation')} {$_('create-a-new-fixed-donation')}
{:else}{$_('create-a-new-distance-donation')}{/if} {:else}{$_('create-a-new-distance-donation')}{/if}
@ -213,15 +214,13 @@
class="block text-sm font-medium text-gray-700">{$_('donor')}</label> class="block text-sm font-medium text-gray-700">{$_('donor')}</label>
<Select <Select
containerClasses="rounded-l-md 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" containerClasses="rounded-l-md 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={(option) => getDonorLabel(option)}
getOptionLabel={(option) => getDonorLabel(option)}
itemFilter={(label, filterText, option) => filterDonors(label, filterText, option)} itemFilter={(label, filterText, option) => filterDonors(label, filterText, option)}
items={donors} items={donors}
showChevron={true} showChevron={true}
placeholder={$_('search-for-donor-name-or-id')} placeholder={$_('search-for-donor-name-or-id')}
noOptionsMessage={$_('no-donors-found')} noOptionsMessage={$_('no-donors-found')}
on:select={(selectedValue) => (donor = selectedValue.detail.id)} on:select={(selectedValue) => (donor = selectedValue.detail.value.id)}
on:clear={()=>(donors = null)} /> on:clear={() => (donors = null)} />
</div> </div>
{#if !is_fixed} {#if !is_fixed}
<div class="col-span-6"> <div class="col-span-6">
@ -230,15 +229,13 @@
class="block text-sm font-medium text-gray-700">{$_('runner')}</label> class="block text-sm font-medium text-gray-700">{$_('runner')}</label>
<Select <Select
containerClasses="rounded-l-md 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" containerClasses="rounded-l-md 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={(option) => getDonorLabel(option)}
getOptionLabel={(option) => getDonorLabel(option)}
itemFilter={(label, filterText, option) => filterDonors(label, filterText, option)} itemFilter={(label, filterText, option) => filterDonors(label, filterText, option)}
items={runners} items={runners}
showChevron={true} showChevron={true}
placeholder={$_('search-for-runner-by-name-or-id')} placeholder={$_('search-for-runner-by-name-or-id')}
noOptionsMessage={$_('no-runners-found')} noOptionsMessage={$_('no-runners-found')}
on:select={(selectedValue) => (runner = selectedValue.detail.id)} on:select={(selectedValue) => (runner = selectedValue.detail.value.id)}
on:clear={()=>(runner = null)} /> on:clear={() => (runner = null)} />
</div> </div>
{/if} {/if}
<div class="col-span-6"> <div class="col-span-6">