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

Added custom placeholders

Browse Source 
ref #91
This commit is contained in:
Nicolai Ort 2021-03-14 17:20:18 +01:00
parent 47f0cd0b58
commit 1c330d0301
1 changed files with 13 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -13,7 +13,9 @@
export let current_donations; export let current_donations;
const getDonorLabel = (option) => const getDonorLabel = (option) =>
option.firstname + " " + (option.middlename || "") + " " + option.lastname; option.firstname + " " + (option.middlename || "") + " " + option.lastname;
const filterDonors = (label, filterText, option) => (label.toLowerCase().includes(filterText.toLowerCase()) || option.id.toString().startsWith(filterText.toLowerCase())); const filterDonors = (label, filterText, option) =>
label.toLowerCase().includes(filterText.toLowerCase()) ||
option.id.toString().startsWith(filterText.toLowerCase());
function focus(el) { function focus(el) {
el.focus(); el.focus();
} }
@ -209,15 +211,16 @@
<label <label
for="donor" for="donor"
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))} getSelectionLabel={(option) => getDonorLabel(option)}
getOptionLabel= {(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..." placeholder={$_('search-for-donor-name-or-id')}
on:select={(selected) => (donor = selected.detail.id)} /> noOptionsMessage={$_('no-donors-found')}
on:select={(selectedValue) => (donor = selectedValue.detail.id)} />
</div> </div>
{#if !is_fixed} {#if !is_fixed}
<div class="col-span-6"> <div class="col-span-6">