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

Implemented svelt select bug workaround for scan detail🔥🔥🔥

Browse Source 
ref #92
This commit is contained in:
Nicolai Ort 2021-03-18 15:17:07 +01:00
parent eb6af4b4f0
commit cda4512822
1 changed files with 17 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/scans/ScanDetail.svelte
View File

@ -21,25 +21,32 @@
editable.runner != null && editable.runner != null &&
((original_data.responseType === "TRACKSCAN" && editable.track != null) || ((original_data.responseType === "TRACKSCAN" && editable.track != null) ||
original_data.responseType !== "TRACKSCAN"); original_data.responseType !== "TRACKSCAN");
$: runner = {};
$: changes_performed = !( $: changes_performed = !(
JSON.stringify(original_data) === JSON.stringify(editable) JSON.stringify(original_data) === JSON.stringify(editable)
); );
$: save_enabled = changes_performed && is_everything_set && is_distance_valid; $: save_enabled = changes_performed && is_everything_set && is_distance_valid;
const runner_promise = RunnerService.runnerControllerGetAll().then((val) => {
current_runners = val;
});
const promise = ScanService.scanControllerGetOne(params.scanid).then( const promise = ScanService.scanControllerGetOne(params.scanid).then(
(data) => { (data) => {
data_loaded = true; data_loaded = true;
original_data = Object.assign(original_data, data); original_data = Object.assign(original_data, data);
editable = Object.assign(editable, original_data); editable = Object.assign(editable, original_data);
RunnerService.runnerControllerGetAll().then(
(val) => {
current_runners = val.map((r) => {
return { label: getRunnerLabel(r), value: r };
});
runner = current_runners.find(r => r.value.id == editable.runner.id);
}
);
} }
); );
const getRunnerLabel = (option) => const getRunnerLabel = (option) =>
option.firstname + " " + (option.middlename || "") + " " + option.lastname; option.firstname + " " + (option.middlename || "") + " " + option.lastname;
const filterRunners = (label, filterText, option) => const filterRunners = (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 submit() { function submit() {
if (data_loaded === true && save_enabled) { if (data_loaded === true && save_enabled) {
@ -48,6 +55,7 @@
duration: 2500, duration: 2500,
}).showToast(); }).showToast();
let postdata = {}; let postdata = {};
console.log(editable.runner);
if (original_data.responseType === "TRACKSCAN") { if (original_data.responseType === "TRACKSCAN") {
postdata = Object.assign(postdata, editable); postdata = Object.assign(postdata, editable);
postdata.runner = postdata.runner.id; postdata.runner = postdata.runner.id;
@ -98,7 +106,7 @@
} }
</script> </script>
{#await runner_promise && promise} {#await promise}
Loading scan details Loading scan details
{:then} {:then}
<section class="container p-5 select-none"> <section class="container p-5 select-none">
@ -213,15 +221,16 @@
class="block font-medium text-gray-700">{$_('runner')}</label> class="block 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) => getRunnerLabel(option)}
getOptionLabel={(option) => getRunnerLabel(option)}
itemFilter={(label, filterText, option) => filterRunners(label, filterText, option)} itemFilter={(label, filterText, option) => filterRunners(label, filterText, option)}
items={current_runners} items={current_runners}
showChevron={true} showChevron={true}
isDisabled={editable.responseType === 'TRACKSCAN'} isDisabled={editable.responseType === 'TRACKSCAN'}
placeholder={$_('search-for-runner-by-name-or-id')} placeholder={$_('search-for-runner-by-name-or-id')}
noOptionsMessage={$_('no-runners-found')} noOptionsMessage={$_('no-runners-found')}
bind:selectedValue={editable.runner} bind:selectedValue={runner}
on:select={(selectedValue) => {
editable.runner = selectedValue.detail.value;
}}
on:clear={() => (editable.runner = null)} /> on:clear={() => (editable.runner = null)} />
</div> </div>
<div class=" w-full"> <div class=" w-full">