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

Merge branch 'feature/13-runner-management' of git.odit.services:lfk/frontend into feature/13-runner-management

Browse Source
This commit is contained in:
Nicolai Ort 2021-01-24 17:23:18 +01:00
commit 7baaf2cff3
2 changed files with 31 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
src/components/RunnerDetail.svelte
View File

@ -5,39 +5,38 @@
import { RunnerService } from "@odit/lfk-client-js"; import { RunnerService } from "@odit/lfk-client-js";
import Toastify from "toastify-js"; import Toastify from "toastify-js";
import PromiseError from "./PromiseError.svelte"; import PromiseError from "./PromiseError.svelte";
export let params; import isEmail from "validator/es/lib/isEmail";
const runner_promise = RunnerService.runnerControllerGetOne(params.runnerid); const runner_promise = RunnerService.runnerControllerGetOne(params.runnerid);
let data_loaded = false; let data_loaded = false;
export let params;
$: delete_triggered = false; $: delete_triggered = false;
$: original_data = {}; $: original_data = {};
$: editable_userdata = {}; $: editable = {};
runner_promise.then((data) => { $: changes_performed = !lodashIsEqual(original_data, editable);
console.log(data);
data_loaded = true;
original_data = Object.assign(original_data, data);
editable_userdata = data;
});
$: changes_performed = !lodashIsEqual(original_data, editable_userdata);
import isEmail from "validator/es/lib/isEmail";
$: isEmailValid = $: isEmailValid =
(editable_userdata.email || "") === "" || (editable.email || "") === "" ||
(editable_userdata.email && isEmail(editable_userdata.email || "")); (editable.email && isEmail(editable.email || ""));
$: isFirstnameValid = editable_userdata.firstname !== ""; $: isFirstnameValid = editable.firstname !== "";
$: isLastnameValid = editable_userdata.lastname !== ""; $: isLastnameValid = editable.lastname !== "";
$: save_enabled = $: save_enabled =
changes_performed && isFirstnameValid && isLastnameValid && isEmailValid; changes_performed && isFirstnameValid && isLastnameValid && isEmailValid;
runner_promise.then((data) => {
data_loaded = true;
original_data = Object.assign(original_data, data);
editable = data;
});
function submit() { function submit() {
if (data_loaded === true && save_enabled) { if (data_loaded === true && save_enabled) {
Toastify({ Toastify({
text: "Updating runner...", text: "Updating runner...",
duration: 2500, duration: 2500,
}).showToast(); }).showToast();
RunnerService.runnerControllerPut(original_data.id, editable_userdata) editable.group = editable.group.id;
RunnerService.runnerControllerPut(original_data.id, editable)
.then((resp) => { .then((resp) => {
Object.assign(original_data, editable_userdata); Object.assign(original_data, editable);
original_data = editable_userdata; original_data = editable;
Object.assign(original_data, editable_userdata); Object.assign(original_data, editable);
// //
Toastify({ Toastify({
text: "Runner updated!", text: "Runner updated!",
@ -60,7 +59,7 @@
{#await runner_promise} {#await runner_promise}
<!-- --> <!-- -->
{:then user} {:then}
<section class="container p-5 select-none"> <section class="container p-5 select-none">
<div class="flex flex-row mb-4"> <div class="flex flex-row mb-4">
<div class="w-full"> <div class="w-full">
@ -108,13 +107,12 @@
{original_data.firstname} {original_data.firstname}
{original_data.middlename || ''} {original_data.middlename || ''}
{original_data.lastname} {original_data.lastname}
<span data-id="user_actions_${editable_userdata.id}"> <span data-id="runner_actions_${editable.id}">
{#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')} {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
{#if delete_triggered} {#if delete_triggered}
<button <button
on:click={deleteRunner} on:click={deleteRunner}
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">Confirm class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('confirm-deletion')}</button>
Deletion</button>
<button <button
on:click={() => { on:click={() => {
delete_triggered = !delete_triggered; delete_triggered = !delete_triggered;
@ -127,8 +125,7 @@
delete_triggered = true; delete_triggered = true;
}} }}
type="button" type="button"
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">Delete class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('delete-runner')}</button>
Runner</button>
{/if} {/if}
{/if} {/if}
{#if !delete_triggered} {#if !delete_triggered}
@ -153,7 +150,7 @@
class:border-red-500={!isFirstnameValid} class:border-red-500={!isFirstnameValid}
class:focus:border-red-500={!isFirstnameValid} class:focus:border-red-500={!isFirstnameValid}
class:focus:ring-red-500={!isFirstnameValid} class:focus:ring-red-500={!isFirstnameValid}
bind:value={editable_userdata.firstname} bind:value={editable.firstname}
name="firstname" name="firstname"
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" /> 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" />
{#if !isFirstnameValid} {#if !isFirstnameValid}
@ -171,7 +168,7 @@
autocomplete="off" autocomplete="off"
placeholder={$_('middle-name')} placeholder={$_('middle-name')}
type="text" type="text"
bind:value={editable_userdata.middlename} bind:value={editable.middlename}
name="middlename" name="middlename"
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" /> 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" />
</div> </div>
@ -183,7 +180,7 @@
autocomplete="off" autocomplete="off"
placeholder={$_('last-name')} placeholder={$_('last-name')}
type="text" type="text"
bind:value={editable_userdata.lastname} bind:value={editable.lastname}
class:border-red-500={!isLastnameValid} class:border-red-500={!isLastnameValid}
class:focus:border-red-500={!isLastnameValid} class:focus:border-red-500={!isLastnameValid}
class:focus:ring-red-500={!isLastnameValid} class:focus:ring-red-500={!isLastnameValid}
@ -204,7 +201,7 @@
autocomplete="off" autocomplete="off"
placeholder={$_('e-mail-adress')} placeholder={$_('e-mail-adress')}
type="email" type="email"
bind:value={editable_userdata.email} bind:value={editable.email}
class:border-red-500={!isEmailValid} class:border-red-500={!isEmailValid}
class:focus:border-red-500={!isEmailValid} class:focus:border-red-500={!isEmailValid}
class:focus:ring-red-500={!isEmailValid} class:focus:ring-red-500={!isEmailValid}
@ -223,12 +220,12 @@
autocomplete="off" autocomplete="off"
placeholder={$_('phone')} placeholder={$_('phone')}
type="tel" type="tel"
bind:value={editable_userdata.phone} bind:value={editable.phone}
name="phone" name="phone"
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" /> 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" />
</div> </div>
<div class="text-sm w-full"> <div class="text-sm w-full">
<span class="font-medium text-gray-700">Distance</span> <span class="font-medium text-gray-700">{$_('distance')}</span>
<br /> <br />
<span class="text-gray-700">{original_data.distance} km</span> <span class="text-gray-700">{original_data.distance} km</span>
</div> </div>

3
src/locales/en.json
View File

@ -14,6 +14,7 @@
"changelog": "Changelog", "changelog": "Changelog",
"close": "Close", "close": "Close",
"confirm-delete": "Confirm Delete", "confirm-delete": "Confirm Delete",
"confirm-deletion": "Confirm Deletion",
"contact": "Contact", "contact": "Contact",
"count_organizations": "# Organizations", "count_organizations": "# Organizations",
"count_teams": "# Teams", "count_teams": "# Teams",
@ -45,9 +46,11 @@
"an_error_happened_while_fetching_the_data": "An error happened while fetching the data" "an_error_happened_while_fetching_the_data": "An error happened while fetching the data"
}, },
"delete-organization": "Delete Organization", "delete-organization": "Delete Organization",
"delete-runner": "Delete Runner",
"delete-team": "Delete Team", "delete-team": "Delete Team",
"delete-user": "Delete User", "delete-user": "Delete User",
"dependency_name": "Name", "dependency_name": "Name",
"distance": "Distance",
"dont-have-your-email-connected": "Don't have your email connected?", "dont-have-your-email-connected": "Don't have your email connected?",
"dont-panic-were-resetting-it": "Don't panic, we're resetting it ✌", "dont-panic-were-resetting-it": "Don't panic, we're resetting it ✌",
"drag-and-drop-your-files-or": "Drag & Drop your files or", "drag-and-drop-your-files-or": "Drag & Drop your files or",