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

Org detail now uses svelte select

Browse Source 
ref #91
This commit is contained in:
Nicolai Ort 2021-03-17 11:02:43 +01:00
parent cee1ab1347
commit 6b590671bc
1 changed files with 32 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/components/orgs/OrgDetail.svelte
View File

@ -9,6 +9,7 @@
import ConfirmOrgDeletion from "./ConfirmOrgDeletion.svelte";
import ImportRunnerModal from "../runners/ImportRunnerModal.svelte";
import PromiseError from "../base/PromiseError.svelte";
import Select from "svelte-select";
$: delete_triggered = false;
$: address_valid_or_none =
(isAddress1Valid && iszipcodevalid && iscityvalid) ||
@ -25,16 +26,12 @@
$: iszipcodevalid = editable.address?.postalcode?.trim().length !== 0;
$: iscityvalid = editable.address?.city?.trim().length !== 0;
$: sponsoring_contracts_download_open = false;
const getContactLabel = (option) =>
option.firstname + " " + (option.middlename || "") + " " + option.lastname;
const promise = RunnerOrganizationService.runnerOrganizationControllerGetOne(
params.orgid
).then((value) => {
data_loaded = true;
if (value.contact) {
if (value.contact !== "null") {
value.contact = value.contact.id;
}
}
value.address_checked = value.address.address1 !== null;
if (value.address_checked === false) {
value.address = {
@ -91,13 +88,14 @@
if (postdata.address_checked === false) {
postdata.address = null;
}
postdata.contact = postdata.contact === "null" ? null : postdata.contact;
postdata.contact = postdata.contact?.id;
RunnerOrganizationService.runnerOrganizationControllerPut(
original_object.id,
postdata
)
.then((resp) => {
original = JSON.stringify(editable);
original_object = Object.assign({}, editable);
original = JSON.stringify(original_object);
Toastify({
text: $_("updated-organization"),
duration: 2500,
@ -188,7 +186,17 @@
aria-haspopup="true"
aria-expanded="true">
{$_('generate-sponsoring-contracts')}
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" class="-mr-1 ml-2 h-5 w-5"><path fill="none" d="M0 0h24v24H0z"/><path fill="currentColor" d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z"/></svg>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
class="-mr-1 ml-2 h-5 w-5"><path
fill="none"
d="M0 0h24v24H0z" />
<path
fill="currentColor"
d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
</button>
</div>
{#if sponsoring_contracts_download_open}
@ -349,19 +357,21 @@
<label
for="contact"
class="font-medium text-gray-700">{$_('contact')}</label>
<select
name="contact"
bind:value={editable.contact}
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">
<option value="null">no contact</option>
{#each contacts as c}
<option value={c.id}>
{c.firstname}
{c.middlename || ''}
{c.lastname}
</option>
{/each}
</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"
getSelectionLabel={(option) => getContactLabel(option)}
getOptionLabel={(option) => getContactLabel(option)}
itemFilter={(label, filterText, option) => label
.toLowerCase()
.includes(
filterText.toLowerCase()
) || option.id.toString().startsWith(filterText.toLowerCase())}
items={contacts}
showChevron={true}
placeholder={$_('no-contact-selected')}
noOptionsMessage={$_('no-contact-found')}
bind:selectedValue={editable.contact}
on:clear={() => (editable.contact = null)} />
</div>
<!-- -->
<div class="flex items-start mt-2">