Runner detail now uses svelte select🔥🔥

ref #91
This commit is contained in:
Nicolai Ort 2021-03-17 10:55:25 +01:00
parent 9d0c6b9ef4
commit cee1ab1347

View File

@ -10,6 +10,7 @@
import Toastify from "toastify-js";
import PromiseError from "../base/PromiseError.svelte";
import isEmail from "validator/es/lib/isEmail";
import Select from "svelte-select";
let data_loaded = false;
export let params;
const runner_promise = RunnerService.runnerControllerGetOne(params.runnerid);
@ -30,7 +31,6 @@
data_loaded = true;
original_data_pdf = Object.assign(original_data_pdf, data);
original_data = Object.assign(original_data, data);
original_data.group = original_data.group.id;
editable = Object.assign(editable, original_data);
});
document.addEventListener("click", function (e) {
@ -55,11 +55,13 @@
text: $_("updating-runner"),
duration: 2500,
}).showToast();
RunnerService.runnerControllerPut(original_data.id, editable)
let postdata = {};
postdata = Object.assign(postdata, editable);
postdata.group = postdata.group.id;
RunnerService.runnerControllerPut(original_data.id, postdata)
.then((resp) => {
Object.assign(original_data, editable);
original_data = editable;
Object.assign(original_data, editable);
original_data = original_data;
Toastify({
text: $_("runner-updated"),
duration: 2500,
@ -206,7 +208,17 @@
aria-haspopup="true"
aria-expanded="true">
{$_('generate-sponsoring-contract')}
<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,21 +361,31 @@
</div>
<div class="text-sm w-full">
<span class="font-medium text-gray-700">{$_('group')}</span>
<select
bind:value={editable.group}
name="team"
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 teams as team}
<option value={team.id}>
{team.parentGroup.name}
&gt;
{team.name}
</option>
{/each}
{#each orgs as org}
<option value={org.id}>{org.name}</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) => {
if (option.responseType == 'RUNNERORGANIZATION') {
return option.name;
}
return `${option.parentGroup.name} &gt; ${option.name}`;
}}
getOptionLabel={(option) => {
if (option.responseType == 'RUNNERORGANIZATION') {
return option.name;
}
return `${option.parentGroup.name} &gt; ${option.name}`;
}}
itemFilter={(label, filterText, option) => label
.toLowerCase()
.includes(
filterText.toLowerCase()
) || option.id.toString().startsWith(filterText.toLowerCase())}
items={orgs.concat(orgs, teams)}
showChevron={true}
placeholder={$_('search-for-an-organization-or-team-by-name-or-id')}
noOptionsMessage={$_('no-organization-or-team-found')}
bind:selectedValue={editable.group}
on:clear={() => (editable.group = null)} />
</div>
<div class="text-sm w-full">
<span class="font-medium text-gray-700">{$_('distance')}</span>