Compare commits
No commits in common. "b3bd61c89eaab5c452a7d409dcd38e0e82f0db46" and "aa6348a29a6e9ecb9789681b7195527c4eef19e4" have entirely different histories.
b3bd61c89e
...
aa6348a29a
10
.gitignore
vendored
10
.gitignore
vendored
@ -1,10 +1,8 @@
|
|||||||
node_modules
|
node_modules
|
||||||
build
|
|
||||||
package-lock.json
|
|
||||||
yarn.lock
|
|
||||||
*.map
|
|
||||||
public/env.js
|
public/env.js
|
||||||
public/sw.js
|
build
|
||||||
|
yarn.lock
|
||||||
|
package-lock.json
|
||||||
|
*.map
|
||||||
public/index.html
|
public/index.html
|
||||||
public/workbox-*.js
|
|
||||||
svelte.config.js
|
svelte.config.js
|
@ -12,7 +12,7 @@
|
|||||||
"licenses:export": "license-exporter --json -o public"
|
"licenses:export": "license-exporter --json -o public"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@odit/lfk-client-js": "0.1.1",
|
"@odit/lfk-client-js": "0.0.12",
|
||||||
"filepond": "4.25.1",
|
"filepond": "4.25.1",
|
||||||
"gridjs": "3.2.2",
|
"gridjs": "3.2.2",
|
||||||
"localforage": "1.9.0",
|
"localforage": "1.9.0",
|
||||||
@ -21,20 +21,20 @@
|
|||||||
"svelte-focus-trap": "1.0.1",
|
"svelte-focus-trap": "1.0.1",
|
||||||
"svelte-i18n": "3.3.0",
|
"svelte-i18n": "3.3.0",
|
||||||
"tailwindcss": "2.0.2",
|
"tailwindcss": "2.0.2",
|
||||||
"tinro": "0.5.7",
|
"tinro": "0.5.6",
|
||||||
"toastify-js": "1.9.3",
|
"toastify-js": "1.9.3",
|
||||||
"validator": "13.5.2"
|
"validator": "13.5.2"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@odit/license-exporter": "0.0.9",
|
"@odit/license-exporter": "0.0.9",
|
||||||
"@snowpack/plugin-svelte": "3.5.2",
|
"@snowpack/plugin-svelte": "3.5.1",
|
||||||
"auto-changelog": "^2.2.1",
|
"auto-changelog": "^2.2.1",
|
||||||
"autoprefixer": "10.2.1",
|
"autoprefixer": "10.2.1",
|
||||||
"cross-env": "^7.0.3",
|
"cross-env": "^7.0.3",
|
||||||
"postcss": "8.2.4",
|
"postcss": "8.2.4",
|
||||||
"postcss-load-config": "3.0.0",
|
"postcss-load-config": "3.0.0",
|
||||||
"release-it": "^14.2.2",
|
"release-it": "^14.2.2",
|
||||||
"snowpack": "3.0.11",
|
"snowpack": "3.0.10",
|
||||||
"svelte": "3.31.2",
|
"svelte": "3.31.2",
|
||||||
"svelte-preprocess": "4.6.1",
|
"svelte-preprocess": "4.6.1",
|
||||||
"workbox-cli": "6.0.2"
|
"workbox-cli": "6.0.2"
|
||||||
|
@ -1,292 +0,0 @@
|
|||||||
<script>
|
|
||||||
import { _ } from "svelte-i18n";
|
|
||||||
import { clickOutside } from "./outsideclick";
|
|
||||||
import { focusTrap } from "svelte-focus-trap";
|
|
||||||
import { RunnerService, RunnerTeamService } from "@odit/lfk-client-js";
|
|
||||||
import isEmail from "validator/es/lib/isEmail";
|
|
||||||
import isMobilePhone from "validator/es/lib/isMobilePhone";
|
|
||||||
import Toastify from "toastify-js";
|
|
||||||
export let modal_open;
|
|
||||||
export let current_runners;
|
|
||||||
$: selected_team = undefined;
|
|
||||||
let firstname_input;
|
|
||||||
let lastname_input;
|
|
||||||
let middlename_input;
|
|
||||||
let phone_input;
|
|
||||||
let email_input;
|
|
||||||
let groups = [];
|
|
||||||
RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
|
|
||||||
groups = val;
|
|
||||||
});
|
|
||||||
function focus(el) {
|
|
||||||
el.focus();
|
|
||||||
}
|
|
||||||
$: middlename_input_value = "";
|
|
||||||
$: phone_input_value = "";
|
|
||||||
$: email_input_value = "";
|
|
||||||
$: lastname_input_value = "";
|
|
||||||
$: firstname_input_value = "";
|
|
||||||
$: processed_last_submit = true;
|
|
||||||
$: isPhoneValidOrEmpty =
|
|
||||||
isMobilePhone(phone_input_value) || phone_input_value === "";
|
|
||||||
$: isEmailValidOrEmpty =
|
|
||||||
isEmail(email_input_value) || email_input_value === "";
|
|
||||||
$: isLastnameValid = lastname_input_value.trim().length !== 0;
|
|
||||||
$: isFirstnameValid = firstname_input_value.trim().length !== 0;
|
|
||||||
$: createbtnenabled =
|
|
||||||
isFirstnameValid &&
|
|
||||||
isLastnameValid &&
|
|
||||||
isEmailValidOrEmpty &&
|
|
||||||
isPhoneValidOrEmpty;
|
|
||||||
(() => {
|
|
||||||
document.onkeydown = (e) => {
|
|
||||||
e = e || window.event;
|
|
||||||
if (e.key === "Escape") {
|
|
||||||
modal_open = false;
|
|
||||||
}
|
|
||||||
if (e.keyCode === 13) {
|
|
||||||
if (createbtnenabled === true) {
|
|
||||||
createbtnenabled = false;
|
|
||||||
submit();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
})();
|
|
||||||
function submit() {
|
|
||||||
if (processed_last_submit === true) {
|
|
||||||
processed_last_submit = false;
|
|
||||||
const toast = Toastify({
|
|
||||||
text: "Runner is being added...",
|
|
||||||
duration: -1,
|
|
||||||
}).showToast();
|
|
||||||
let postdata = {
|
|
||||||
group: selected_team,
|
|
||||||
firstname: firstname_input_value,
|
|
||||||
lastname: lastname_input_value,
|
|
||||||
};
|
|
||||||
if (middlename_input_value) {
|
|
||||||
postdata.middlename = middlename_input_value;
|
|
||||||
}
|
|
||||||
if (phone_input_value) {
|
|
||||||
postdata.phone = phone_input_value;
|
|
||||||
}
|
|
||||||
if (email_input_value) {
|
|
||||||
postdata.email = email_input_value;
|
|
||||||
}
|
|
||||||
RunnerService.runnerControllerPost(postdata)
|
|
||||||
.then((result) => {
|
|
||||||
firstname_input_value = "";
|
|
||||||
lastname_input_value = "";
|
|
||||||
middlename_input_value = "";
|
|
||||||
email_input_value = "";
|
|
||||||
modal_open = false;
|
|
||||||
//
|
|
||||||
Toastify({
|
|
||||||
text: "Runner added",
|
|
||||||
duration: 500,
|
|
||||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
|
||||||
}).showToast();
|
|
||||||
current_runners.push(result);
|
|
||||||
current_runners = current_runners;
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
//
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
processed_last_submit = true;
|
|
||||||
//
|
|
||||||
toast.hideToast();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
{#if modal_open}
|
|
||||||
<div
|
|
||||||
class="fixed z-10 inset-0 overflow-y-auto"
|
|
||||||
use:focusTrap
|
|
||||||
use:clickOutside
|
|
||||||
on:click_outside={() => {
|
|
||||||
modal_open = false;
|
|
||||||
}}>
|
|
||||||
<div
|
|
||||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
|
|
||||||
<div class="fixed inset-0 transition-opacity" aria-hidden="true">
|
|
||||||
<div
|
|
||||||
class="absolute inset-0 bg-gray-500 opacity-75"
|
|
||||||
data-id="modal_backdrop" />
|
|
||||||
</div>
|
|
||||||
<span
|
|
||||||
class="hidden sm:inline-block sm:align-middle sm:h-screen"
|
|
||||||
aria-hidden="true">​</span>
|
|
||||||
<div
|
|
||||||
class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
|
|
||||||
role="dialog"
|
|
||||||
aria-modal="true"
|
|
||||||
aria-labelledby="modal-headline">
|
|
||||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
|
||||||
<div class="sm:flex sm:items-start">
|
|
||||||
<div
|
|
||||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
class="h-6 w-6 text-blue-600"
|
|
||||||
fill="currentColor"
|
|
||||||
width="24"
|
|
||||||
height="24"><path fill="none" d="M0 0h24v24H0z" />
|
|
||||||
<path
|
|
||||||
d="M9.83 8.79L8 9.456V13H6V8.05h.015l5.268-1.918c.244-.093.51-.14.782-.131a2.616 2.616 0 0 1 2.427 1.82c.186.583.356.977.51 1.182A4.992 4.992 0 0 0 19 11v2a6.986 6.986 0 0 1-5.402-2.547l-.581 3.297L15 15.67V23h-2v-5.986l-2.05-1.987-.947 4.298-6.894-1.215.348-1.97 4.924.868L9.83 8.79zM13.5 5.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4z" /></svg>
|
|
||||||
</div>
|
|
||||||
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
|
|
||||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
|
||||||
Create a new Runner
|
|
||||||
</h3>
|
|
||||||
<div class="mt-2 mb-6">
|
|
||||||
<p class="text-sm text-gray-500">
|
|
||||||
Please provide the required information to add a new runner.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div class="grid grid-cols-6 gap-6">
|
|
||||||
<div class="col-span-6">
|
|
||||||
<label
|
|
||||||
for="firstname"
|
|
||||||
class="block text-sm font-medium text-gray-700">{$_('first-name')}</label>
|
|
||||||
<input
|
|
||||||
use:focus
|
|
||||||
autocomplete="off"
|
|
||||||
placeholder={$_('first-name')}
|
|
||||||
class:border-red-500={!isFirstnameValid}
|
|
||||||
class:focus:border-red-500={!isFirstnameValid}
|
|
||||||
class:focus:ring-red-500={!isFirstnameValid}
|
|
||||||
bind:value={firstname_input_value}
|
|
||||||
bind:this={firstname_input}
|
|
||||||
type="text"
|
|
||||||
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" />
|
|
||||||
{#if !isFirstnameValid}
|
|
||||||
<span
|
|
||||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
|
||||||
{$_('first-name-is-required')}
|
|
||||||
</span>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
<div class="col-span-6">
|
|
||||||
<label
|
|
||||||
for="trackname"
|
|
||||||
class="block text-sm font-medium text-gray-700">{$_('middle-name')}</label>
|
|
||||||
<input
|
|
||||||
autocomplete="off"
|
|
||||||
placeholder={$_('middle-name')}
|
|
||||||
bind:value={middlename_input_value}
|
|
||||||
bind:this={middlename_input}
|
|
||||||
type="text"
|
|
||||||
name="trackname"
|
|
||||||
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 class="col-span-6">
|
|
||||||
<label
|
|
||||||
for="lastname"
|
|
||||||
class="block text-sm font-medium text-gray-700">Last Name</label>
|
|
||||||
<input
|
|
||||||
autocomplete="off"
|
|
||||||
placeholder="Last Name"
|
|
||||||
class:border-red-500={!isLastnameValid}
|
|
||||||
class:focus:border-red-500={!isLastnameValid}
|
|
||||||
class:focus:ring-red-500={!isLastnameValid}
|
|
||||||
bind:value={lastname_input_value}
|
|
||||||
bind:this={lastname_input}
|
|
||||||
type="text"
|
|
||||||
name="lastname"
|
|
||||||
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 !isLastnameValid}
|
|
||||||
<span
|
|
||||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
|
||||||
{$_('last-name-is-required')}
|
|
||||||
</span>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
<div class="col-span-6">
|
|
||||||
<label
|
|
||||||
for="team"
|
|
||||||
class="block text-sm font-medium text-gray-700">Team</label>
|
|
||||||
<select
|
|
||||||
name="team"
|
|
||||||
bind:value={selected_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 dark:bg-gray-900 dark:text-gray-100 rounded-md p-2">
|
|
||||||
{#each groups as g}
|
|
||||||
<option value={g.id}>{g.name}</option>
|
|
||||||
{/each}
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="col-span-6">
|
|
||||||
<label
|
|
||||||
for="phone"
|
|
||||||
class="block text-sm font-medium text-gray-700">Phone</label>
|
|
||||||
<input
|
|
||||||
autocomplete="off"
|
|
||||||
placeholder="Phone"
|
|
||||||
class:border-red-500={!isPhoneValidOrEmpty}
|
|
||||||
class:focus:border-red-500={!isPhoneValidOrEmpty}
|
|
||||||
class:focus:ring-red-500={!isPhoneValidOrEmpty}
|
|
||||||
bind:value={phone_input_value}
|
|
||||||
bind:this={phone_input}
|
|
||||||
type="tel"
|
|
||||||
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" />
|
|
||||||
{#if !isPhoneValidOrEmpty}
|
|
||||||
<span
|
|
||||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
|
||||||
the provided phone number is invalid.<br />please enter a
|
|
||||||
valid international number...
|
|
||||||
</span>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
<div class="col-span-6">
|
|
||||||
<label
|
|
||||||
for="email"
|
|
||||||
class="block text-sm font-medium text-gray-700">{$_('e-mail-adress')}</label>
|
|
||||||
<input
|
|
||||||
autocomplete="off"
|
|
||||||
placeholder={$_('e-mail-adress')}
|
|
||||||
class:border-red-500={!isEmailValidOrEmpty}
|
|
||||||
class:focus:border-red-500={!isEmailValidOrEmpty}
|
|
||||||
class:focus:ring-red-500={!isEmailValidOrEmpty}
|
|
||||||
bind:value={email_input_value}
|
|
||||||
bind:this={email_input}
|
|
||||||
type="email"
|
|
||||||
name="email"
|
|
||||||
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 !isEmailValidOrEmpty}
|
|
||||||
<span
|
|
||||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
|
||||||
{$_('valid-email-is-required')}
|
|
||||||
</span>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
|
|
||||||
<button
|
|
||||||
disabled={!createbtnenabled}
|
|
||||||
class:opacity-50={!createbtnenabled}
|
|
||||||
on:click={submit}
|
|
||||||
type="button"
|
|
||||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
|
|
||||||
{$_('create')}
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
on:click={() => {
|
|
||||||
modal_open = false;
|
|
||||||
}}
|
|
||||||
type="button"
|
|
||||||
class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
|
|
||||||
{$_('cancel')}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
@ -1,30 +1,12 @@
|
|||||||
<script>
|
<script>
|
||||||
import { _ } from "svelte-i18n";
|
import { _ } from "svelte-i18n";
|
||||||
import store from "../store";
|
import RunnersEmptyState from "./RunnersEmptyState.svelte";
|
||||||
import AddRunnerModal from "./AddRunnerModal.svelte";
|
|
||||||
import RunnersOverview from "./RunnersOverview.svelte";
|
|
||||||
export let modal_open = false;
|
|
||||||
let current_runners = [];
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<section class="container p-5">
|
<section class="container p-5">
|
||||||
<span class="mb-1 text-3xl font-extrabold leading-tight">
|
<span class="mb-1 text-3xl font-extrabold leading-tight">
|
||||||
{$_('runners')}
|
{$_('runners')}
|
||||||
{#if store.state.jwtinfo.userdetails.permissions.includes('USER:CREATE')}
|
|
||||||
<button
|
|
||||||
on:click={() => {
|
|
||||||
modal_open = true;
|
|
||||||
}}
|
|
||||||
type="button"
|
|
||||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
|
|
||||||
Läufer hinzufügen
|
|
||||||
</button>
|
|
||||||
{/if}
|
|
||||||
</span>
|
</span>
|
||||||
<p class="mb-8 text-lg text-gray-500">läuft bei ihnen</p>
|
<p class="mb-8 text-lg text-gray-500">läuft bei ihnen</p>
|
||||||
<RunnersOverview bind:current_runners />
|
|
||||||
</section>
|
</section>
|
||||||
|
<RunnersEmptyState />
|
||||||
{#if store.state.jwtinfo.userdetails.permissions.includes('USER:CREATE')}
|
|
||||||
<AddRunnerModal bind:current_runners bind:modal_open />
|
|
||||||
{/if}
|
|
||||||
|
@ -1,148 +0,0 @@
|
|||||||
<script>
|
|
||||||
import { _ } from "svelte-i18n";
|
|
||||||
import { RunnerService } from "@odit/lfk-client-js";
|
|
||||||
import store from "../store";
|
|
||||||
import RunnersEmptyState from "./RunnersEmptyState.svelte";
|
|
||||||
$: searchvalue = "";
|
|
||||||
$: active_deletes = [];
|
|
||||||
export let current_runners = [];
|
|
||||||
const runners_promise = RunnerService.runnerControllerGetAll().then((val) => {
|
|
||||||
current_runners = val;
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
{#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')}
|
|
||||||
{#await runners_promise}
|
|
||||||
<div
|
|
||||||
class="bg-teal-lightest border-t-4 border-teal rounded-b text-teal-darkest px-4 py-3 shadow-md my-2"
|
|
||||||
role="alert">
|
|
||||||
<p class="font-bold">runners are being loaded...</p>
|
|
||||||
<p class="text-sm">{$_('this-might-take-a-moment')}</p>
|
|
||||||
</div>
|
|
||||||
{:then}
|
|
||||||
{#if current_runners.length === 0}
|
|
||||||
<RunnersEmptyState />
|
|
||||||
{:else}
|
|
||||||
<input
|
|
||||||
type="search"
|
|
||||||
bind:value={searchvalue}
|
|
||||||
placeholder={$_('datatable.search')}
|
|
||||||
aria-label={$_('datatable.search')}
|
|
||||||
class="gridjs-input gridjs-search-input mb-4" />
|
|
||||||
<div
|
|
||||||
class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">
|
|
||||||
<table class="divide-y divide-gray-200 w-full">
|
|
||||||
<thead class="bg-gray-50">
|
|
||||||
<tr>
|
|
||||||
<th
|
|
||||||
scope="col"
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
|
||||||
Name
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
scope="col"
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
|
||||||
Contact Information
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
scope="col"
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
|
||||||
Group
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
scope="col"
|
|
||||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
|
||||||
Distance in km
|
|
||||||
</th>
|
|
||||||
<th scope="col" class="relative px-6 py-3">
|
|
||||||
<span class="sr-only">Action</span>
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody class="divide-y divide-gray-200">
|
|
||||||
{#each current_runners as runner}
|
|
||||||
{#if Object.values(runner)
|
|
||||||
.toString()
|
|
||||||
.toLowerCase()
|
|
||||||
.includes(searchvalue)}
|
|
||||||
<tr data-rowid="user_{runner.id}">
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
|
||||||
<div class="flex items-center">
|
|
||||||
<div class="ml-4">
|
|
||||||
<div
|
|
||||||
class="text-sm font-medium text-gray-900 dark:text-gray-100">
|
|
||||||
{runner.firstname}
|
|
||||||
{runner.middlename || ''}
|
|
||||||
{runner.lastname}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
|
||||||
{#if runner.email}
|
|
||||||
<div class="text-sm text-gray-500">{runner.email}</div>
|
|
||||||
{/if}
|
|
||||||
{#if runner.phone}
|
|
||||||
<div class="text-sm text-gray-500">{runner.phone}</div>
|
|
||||||
{/if}
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
|
||||||
{runner.group.name}
|
|
||||||
</td>
|
|
||||||
<td class="px-6 py-4 whitespace-nowrap">{runner.distance}</td>
|
|
||||||
{#if active_deletes[runner.id] === true}
|
|
||||||
<td
|
|
||||||
class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
|
||||||
<button
|
|
||||||
on:click={() => {
|
|
||||||
active_deletes[runner.id] = false;
|
|
||||||
}}
|
|
||||||
tabindex="0"
|
|
||||||
class="ml-4 text-indigo-600 hover:text-indigo-900 cursor-pointer">Cancel
|
|
||||||
Delete</button>
|
|
||||||
<button
|
|
||||||
on:click={() => {
|
|
||||||
RunnerService.runnerControllerRemove(runner.id, true)
|
|
||||||
.then((resp) => {
|
|
||||||
current_runners = current_runners.filter((obj) => obj.id !== runner.id);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
// error deleting user
|
|
||||||
});
|
|
||||||
}}
|
|
||||||
tabindex="0"
|
|
||||||
class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">Confirm
|
|
||||||
Delete</button>
|
|
||||||
</td>
|
|
||||||
{:else}
|
|
||||||
<td
|
|
||||||
class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
|
||||||
<a
|
|
||||||
href="./{runner.id}"
|
|
||||||
class="text-indigo-600 hover:text-indigo-900">Edit</a>
|
|
||||||
{#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
|
|
||||||
<button
|
|
||||||
on:click={() => {
|
|
||||||
active_deletes[runner.id] = true;
|
|
||||||
}}
|
|
||||||
tabindex="0"
|
|
||||||
class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">Delete</button>
|
|
||||||
{/if}
|
|
||||||
</td>
|
|
||||||
{/if}
|
|
||||||
</tr>
|
|
||||||
{/if}
|
|
||||||
{/each}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
{:catch error}
|
|
||||||
<div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
|
|
||||||
<span class="inline-block align-middle mr-8">
|
|
||||||
<b class="capitalize">{$_('general_promise_error')}</b>
|
|
||||||
{error}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
{/await}
|
|
||||||
{/if}
|
|
Loading…
x
Reference in New Issue
Block a user