Merge branch 'dev' into feature/48-usergroup-management
# Conflicts: # src/components/dashboard/Dashboard.svelte
This commit is contained in:
		@@ -27,12 +27,13 @@
 | 
			
		||||
    storeName: "lfk_admin",
 | 
			
		||||
    description: "LfK! admin dashbaord",
 | 
			
		||||
  });
 | 
			
		||||
  window.onunhandledrejection = event => {
 | 
			
		||||
  if(event.reason.toString() == "Error: Unauthorized"){
 | 
			
		||||
    console.log("Found 1")
 | 
			
		||||
    localForage.clear();
 | 
			
		||||
    location.replace("/");
 | 
			
		||||
  }};
 | 
			
		||||
  window.onunhandledrejection = (event) => {
 | 
			
		||||
    if (event.reason.toString() == "Error: Unauthorized") {
 | 
			
		||||
      console.log("Found 1");
 | 
			
		||||
      localForage.clear();
 | 
			
		||||
      location.replace("/");
 | 
			
		||||
    }
 | 
			
		||||
  };
 | 
			
		||||
  //
 | 
			
		||||
  import Login from "./components/auth/Login.svelte";
 | 
			
		||||
  import Dashboard from "./components/dashboard/Dashboard.svelte";
 | 
			
		||||
@@ -61,6 +62,10 @@
 | 
			
		||||
  import ResetPassword from "./components/auth/ResetPassword.svelte";
 | 
			
		||||
  import Contacts from "./components/contacts/Contacts.svelte";
 | 
			
		||||
  import ContactDetail from "./components/contacts/ContactDetail.svelte";
 | 
			
		||||
  import Donors from "./components/donors/Donors.svelte";
 | 
			
		||||
  import DonorDetail from "./components/donors/DonorDetail.svelte";
 | 
			
		||||
  import Donations from "./components/donations/Donations.svelte";
 | 
			
		||||
  import DonationDetail from "./components/donations/DonationDetail.svelte";
 | 
			
		||||
  store.init();
 | 
			
		||||
  registerSW();
 | 
			
		||||
</script>
 | 
			
		||||
@@ -143,6 +148,22 @@
 | 
			
		||||
            <OrgDetail {params} />
 | 
			
		||||
          </Route>
 | 
			
		||||
        </Route>
 | 
			
		||||
        <Route path="/donors/*">
 | 
			
		||||
          <Route path="/">
 | 
			
		||||
            <Donors />
 | 
			
		||||
          </Route>
 | 
			
		||||
          <Route path="/:donorid" let:params>
 | 
			
		||||
            <DonorDetail {params} />
 | 
			
		||||
          </Route>
 | 
			
		||||
        </Route>
 | 
			
		||||
        <Route path="/donations/*">
 | 
			
		||||
          <Route path="/">
 | 
			
		||||
            <Donations />
 | 
			
		||||
          </Route>
 | 
			
		||||
          <Route path="/:donationid" let:params>
 | 
			
		||||
            <DonationDetail {params} />
 | 
			
		||||
          </Route>
 | 
			
		||||
        </Route>
 | 
			
		||||
        <Route path="/about">
 | 
			
		||||
          <About />
 | 
			
		||||
        </Route>
 | 
			
		||||
 
 | 
			
		||||
@@ -228,10 +228,10 @@
 | 
			
		||||
                <div class="col-span-6">
 | 
			
		||||
                  <label
 | 
			
		||||
                    for="lastname"
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">Last Name</label>
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">{$_('last-name')}</label>
 | 
			
		||||
                  <input
 | 
			
		||||
                    autocomplete="off"
 | 
			
		||||
                    placeholder="Last Name"
 | 
			
		||||
                    placeholder="{$_('last-name')}"
 | 
			
		||||
                    class:border-red-500={!isLastnameValid}
 | 
			
		||||
                    class:focus:border-red-500={!isLastnameValid}
 | 
			
		||||
                    class:focus:ring-red-500={!isLastnameValid}
 | 
			
		||||
@@ -250,7 +250,7 @@
 | 
			
		||||
                <div class="col-span-6">
 | 
			
		||||
                  <label
 | 
			
		||||
                    for="team"
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">{$_('team')}</label>
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">{$_('teams')}</label>
 | 
			
		||||
                  <select
 | 
			
		||||
                    name="team"
 | 
			
		||||
                    multiple
 | 
			
		||||
@@ -334,7 +334,7 @@
 | 
			
		||||
                      class="block text-sm font-medium text-gray-700">{$_('address')}</label>
 | 
			
		||||
                    <input
 | 
			
		||||
                      autocomplete="off"
 | 
			
		||||
                      placeholder="Address"
 | 
			
		||||
                      placeholder="{$_('address')}"
 | 
			
		||||
                      class:border-red-500={!isAddress1Valid}
 | 
			
		||||
                      class:focus:border-red-500={!isAddress1Valid}
 | 
			
		||||
                      class:focus:ring-red-500={!isAddress1Valid}
 | 
			
		||||
@@ -388,10 +388,10 @@
 | 
			
		||||
                  <div class="col-span-6">
 | 
			
		||||
                    <label
 | 
			
		||||
                      for="city"
 | 
			
		||||
                      class="block text-sm font-medium text-gray-700">City</label>
 | 
			
		||||
                      class="block text-sm font-medium text-gray-700">{$_('city')}</label>
 | 
			
		||||
                    <input
 | 
			
		||||
                      autocomplete="off"
 | 
			
		||||
                      placeholder="City"
 | 
			
		||||
                      placeholder="{$_('city')}"
 | 
			
		||||
                      class:border-red-500={!iscityvalid}
 | 
			
		||||
                      class:focus:border-red-500={!iscityvalid}
 | 
			
		||||
                      class:focus:ring-red-500={!iscityvalid}
 | 
			
		||||
 
 | 
			
		||||
@@ -148,7 +148,7 @@
 | 
			
		||||
                      class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
 | 
			
		||||
                      <a
 | 
			
		||||
                        href="./{t.id}"
 | 
			
		||||
                        class="text-indigo-600 hover:text-indigo-900">{$_('edit')}</a>
 | 
			
		||||
                        class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
 | 
			
		||||
                      {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:DELETE')}
 | 
			
		||||
                        <button
 | 
			
		||||
                          on:click={() => {
 | 
			
		||||
 
 | 
			
		||||
@@ -70,6 +70,23 @@
 | 
			
		||||
          <span>{$_('users')}</span>
 | 
			
		||||
        </a>
 | 
			
		||||
      {/if}
 | 
			
		||||
      {#if store.state.jwtinfo.userdetails.permissions.includes('USERGROUP:GET')}
 | 
			
		||||
        <a
 | 
			
		||||
          class:bg-gray-100={$router.path === '/groups/'}
 | 
			
		||||
          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
 | 
			
		||||
          href="/groups/">
 | 
			
		||||
          <svg
 | 
			
		||||
            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
 | 
			
		||||
            fill="currentColor"
 | 
			
		||||
            width="24"
 | 
			
		||||
            height="24"
 | 
			
		||||
            xmlns="http://www.w3.org/2000/svg"
 | 
			
		||||
            viewBox="0 0 640 512"><path
 | 
			
		||||
              fill="currentColor"
 | 
			
		||||
              d="M610.5 341.3c2.6-14.1 2.6-28.5 0-42.6l25.8-14.9c3-1.7 4.3-5.2 3.3-8.5-6.7-21.6-18.2-41.2-33.2-57.4-2.3-2.5-6-3.1-9-1.4l-25.8 14.9c-10.9-9.3-23.4-16.5-36.9-21.3v-29.8c0-3.4-2.4-6.4-5.7-7.1-22.3-5-45-4.8-66.2 0-3.3.7-5.7 3.7-5.7 7.1v29.8c-13.5 4.8-26 12-36.9 21.3l-25.8-14.9c-2.9-1.7-6.7-1.1-9 1.4-15 16.2-26.5 35.8-33.2 57.4-1 3.3.4 6.8 3.3 8.5l25.8 14.9c-2.6 14.1-2.6 28.5 0 42.6l-25.8 14.9c-3 1.7-4.3 5.2-3.3 8.5 6.7 21.6 18.2 41.1 33.2 57.4 2.3 2.5 6 3.1 9 1.4l25.8-14.9c10.9 9.3 23.4 16.5 36.9 21.3v29.8c0 3.4 2.4 6.4 5.7 7.1 22.3 5 45 4.8 66.2 0 3.3-.7 5.7-3.7 5.7-7.1v-29.8c13.5-4.8 26-12 36.9-21.3l25.8 14.9c2.9 1.7 6.7 1.1 9-1.4 15-16.2 26.5-35.8 33.2-57.4 1-3.3-.4-6.8-3.3-8.5l-25.8-14.9zM496 368.5c-26.8 0-48.5-21.8-48.5-48.5s21.8-48.5 48.5-48.5 48.5 21.8 48.5 48.5-21.7 48.5-48.5 48.5zM96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm224 32c1.9 0 3.7-.5 5.6-.6 8.3-21.7 20.5-42.1 36.3-59.2 7.4-8 17.9-12.6 28.9-12.6 6.9 0 13.7 1.8 19.6 5.3l7.9 4.6c.8-.5 1.6-.9 2.4-1.4 7-14.6 11.2-30.8 11.2-48 0-61.9-50.1-112-112-112S208 82.1 208 144c0 61.9 50.1 112 112 112zm105.2 194.5c-2.3-1.2-4.6-2.6-6.8-3.9-8.2 4.8-15.3 9.8-27.5 9.8-10.9 0-21.4-4.6-28.9-12.6-18.3-19.8-32.3-43.9-40.2-69.6-10.7-34.5 24.9-49.7 25.8-50.3-.1-2.6-.1-5.2 0-7.8l-7.9-4.6c-3.8-2.2-7-5-9.8-8.1-3.3.2-6.5.6-9.8.6-24.6 0-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h255.4c-3.7-6-6.2-12.8-6.2-20.3v-9.2zM173.1 274.6C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
 | 
			
		||||
          <span>UserGroups</span>
 | 
			
		||||
        </a>
 | 
			
		||||
      {/if}
 | 
			
		||||
      {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')}
 | 
			
		||||
        <a
 | 
			
		||||
          class:bg-gray-100={$router.path === '/runners/'}
 | 
			
		||||
@@ -104,6 +121,40 @@
 | 
			
		||||
          <span>{$_('teams')}</span>
 | 
			
		||||
        </a>
 | 
			
		||||
      {/if}
 | 
			
		||||
      {#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:GET')}
 | 
			
		||||
        <a
 | 
			
		||||
          class:bg-gray-100={$router.path.includes('/donors/')}
 | 
			
		||||
          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
 | 
			
		||||
          href="/donors/">
 | 
			
		||||
          <svg
 | 
			
		||||
            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
 | 
			
		||||
            fill="currentColor"
 | 
			
		||||
            xmlns="http://www.w3.org/2000/svg"
 | 
			
		||||
            viewBox="0 0 24 24"
 | 
			
		||||
            width="24"
 | 
			
		||||
            height="24"><path fill="none" d="M0 0h24v24H0z" />
 | 
			
		||||
            <path
 | 
			
		||||
              d="M9.33 11.5h2.17A4.5 4.5 0 0 1 16 16H8.999L9 17h8v-1a5.578 5.578 0 0 0-.886-3H19a5 5 0 0 1 4.516 2.851C21.151 18.972 17.322 21 13 21c-2.761 0-5.1-.59-7-1.625L6 10.071A6.967 6.967 0 0 1 9.33 11.5zM5 19a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v9zM18 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm-7-3a3 3 0 1 1 0 6 3 3 0 0 1 0-6z" /></svg>
 | 
			
		||||
          <span>{$_('donors')}</span>
 | 
			
		||||
        </a>
 | 
			
		||||
      {/if}
 | 
			
		||||
      {#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:GET')}
 | 
			
		||||
        <a
 | 
			
		||||
          class:bg-gray-100={$router.path.includes('/donations/')}
 | 
			
		||||
          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
 | 
			
		||||
          href="/donations/">
 | 
			
		||||
          <svg
 | 
			
		||||
            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
 | 
			
		||||
            fill="currentColor"
 | 
			
		||||
            xmlns="http://www.w3.org/2000/svg"
 | 
			
		||||
            viewBox="0 0 24 24"
 | 
			
		||||
            width="24"
 | 
			
		||||
            height="24"><path fill="none" d="M0 0h24v24H0z" />
 | 
			
		||||
            <path
 | 
			
		||||
              d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 4z" /></svg>
 | 
			
		||||
          <span>{$_('donations')}</span>
 | 
			
		||||
        </a>
 | 
			
		||||
      {/if}
 | 
			
		||||
      {#if store.state.jwtinfo.userdetails.permissions.includes('TRACK:GET')}
 | 
			
		||||
        <a
 | 
			
		||||
          class:bg-gray-100={$router.path === '/tracks/'}
 | 
			
		||||
@@ -121,20 +172,19 @@
 | 
			
		||||
          <span>{$_('tracks')}</span>
 | 
			
		||||
        </a>
 | 
			
		||||
      {/if}
 | 
			
		||||
      {#if store.state.jwtinfo.userdetails.permissions.includes('USERGROUP:GET')}
 | 
			
		||||
        <a
 | 
			
		||||
          class:bg-gray-100={$router.path === '/groups/'}
 | 
			
		||||
          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
 | 
			
		||||
          href="/groups/">
 | 
			
		||||
          <svg class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600" fill="currentColor" width="24" height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><path fill="currentColor" d="M610.5 341.3c2.6-14.1 2.6-28.5 0-42.6l25.8-14.9c3-1.7 4.3-5.2 3.3-8.5-6.7-21.6-18.2-41.2-33.2-57.4-2.3-2.5-6-3.1-9-1.4l-25.8 14.9c-10.9-9.3-23.4-16.5-36.9-21.3v-29.8c0-3.4-2.4-6.4-5.7-7.1-22.3-5-45-4.8-66.2 0-3.3.7-5.7 3.7-5.7 7.1v29.8c-13.5 4.8-26 12-36.9 21.3l-25.8-14.9c-2.9-1.7-6.7-1.1-9 1.4-15 16.2-26.5 35.8-33.2 57.4-1 3.3.4 6.8 3.3 8.5l25.8 14.9c-2.6 14.1-2.6 28.5 0 42.6l-25.8 14.9c-3 1.7-4.3 5.2-3.3 8.5 6.7 21.6 18.2 41.1 33.2 57.4 2.3 2.5 6 3.1 9 1.4l25.8-14.9c10.9 9.3 23.4 16.5 36.9 21.3v29.8c0 3.4 2.4 6.4 5.7 7.1 22.3 5 45 4.8 66.2 0 3.3-.7 5.7-3.7 5.7-7.1v-29.8c13.5-4.8 26-12 36.9-21.3l25.8 14.9c2.9 1.7 6.7 1.1 9-1.4 15-16.2 26.5-35.8 33.2-57.4 1-3.3-.4-6.8-3.3-8.5l-25.8-14.9zM496 368.5c-26.8 0-48.5-21.8-48.5-48.5s21.8-48.5 48.5-48.5 48.5 21.8 48.5 48.5-21.7 48.5-48.5 48.5zM96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm224 32c1.9 0 3.7-.5 5.6-.6 8.3-21.7 20.5-42.1 36.3-59.2 7.4-8 17.9-12.6 28.9-12.6 6.9 0 13.7 1.8 19.6 5.3l7.9 4.6c.8-.5 1.6-.9 2.4-1.4 7-14.6 11.2-30.8 11.2-48 0-61.9-50.1-112-112-112S208 82.1 208 144c0 61.9 50.1 112 112 112zm105.2 194.5c-2.3-1.2-4.6-2.6-6.8-3.9-8.2 4.8-15.3 9.8-27.5 9.8-10.9 0-21.4-4.6-28.9-12.6-18.3-19.8-32.3-43.9-40.2-69.6-10.7-34.5 24.9-49.7 25.8-50.3-.1-2.6-.1-5.2 0-7.8l-7.9-4.6c-3.8-2.2-7-5-9.8-8.1-3.3.2-6.5.6-9.8.6-24.6 0-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h255.4c-3.7-6-6.2-12.8-6.2-20.3v-9.2zM173.1 274.6C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z"></path></svg>
 | 
			
		||||
          <span>UserGroups</span>
 | 
			
		||||
        </a>
 | 
			
		||||
      {/if}
 | 
			
		||||
      <a
 | 
			
		||||
        class:bg-gray-100={$router.path === '/contacts/'}
 | 
			
		||||
        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
 | 
			
		||||
        href="/contacts/">
 | 
			
		||||
        <svg fill="currentColor" class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M2 22a8 8 0 1 1 16 0H2zm8-9c-3.315 0-6-2.685-6-6s2.685-6 6-6 6 2.685 6 6-2.685 6-6 6zm10 4h4v2h-4v-2zm-3-5h7v2h-7v-2zm2-5h5v2h-5V7z"/></svg>
 | 
			
		||||
        <svg
 | 
			
		||||
          fill="currentColor"
 | 
			
		||||
          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
 | 
			
		||||
          xmlns="http://www.w3.org/2000/svg"
 | 
			
		||||
          viewBox="0 0 24 24"
 | 
			
		||||
          width="24"
 | 
			
		||||
          height="24"><path fill="none" d="M0 0h24v24H0z" />
 | 
			
		||||
          <path
 | 
			
		||||
            d="M2 22a8 8 0 1 1 16 0H2zm8-9c-3.315 0-6-2.685-6-6s2.685-6 6-6 6 2.685 6 6-2.685 6-6 6zm10 4h4v2h-4v-2zm-3-5h7v2h-7v-2zm2-5h5v2h-5V7z" /></svg>
 | 
			
		||||
        <span>{$_('contacts')}</span>
 | 
			
		||||
      </a>
 | 
			
		||||
      <a
 | 
			
		||||
@@ -190,10 +240,21 @@
 | 
			
		||||
    </nav>
 | 
			
		||||
  </nav>
 | 
			
		||||
  <div class="ml-0 transition md:ml-60">
 | 
			
		||||
    <header on:click={() => {
 | 
			
		||||
      navOpen = true;
 | 
			
		||||
    }} class="flex items-center justify-between w-full px-4 bg-white border-b h-14 md:hidden"><button class="block btn btn-light md:hidden">
 | 
			
		||||
      <span class="sr-only">Menu</span><svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentcolor"><path fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4A1 1 0 013 5zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z" clip-rule="evenodd"></path></svg></button></header>
 | 
			
		||||
    <header
 | 
			
		||||
      on:click={() => {
 | 
			
		||||
        navOpen = true;
 | 
			
		||||
      }}
 | 
			
		||||
      class="flex items-center justify-between w-full px-4 bg-white border-b h-14 md:hidden">
 | 
			
		||||
      <button class="block btn btn-light md:hidden">
 | 
			
		||||
        <span class="sr-only">Menu</span><svg
 | 
			
		||||
          class="w-4 h-4"
 | 
			
		||||
          xmlns="http://www.w3.org/2000/svg"
 | 
			
		||||
          viewBox="0 0 20 20"
 | 
			
		||||
          fill="currentcolor"><path
 | 
			
		||||
            fill-rule="evenodd"
 | 
			
		||||
            d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4A1 1 0 013 5zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
 | 
			
		||||
            clip-rule="evenodd" /></svg></button>
 | 
			
		||||
    </header>
 | 
			
		||||
    <slot>
 | 
			
		||||
      <NoComponentLoaded />
 | 
			
		||||
    </slot>
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										288
									
								
								src/components/donations/AddDonationModal.svelte
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										288
									
								
								src/components/donations/AddDonationModal.svelte
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,288 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import { clickOutside } from "../base/outsideclick";
 | 
			
		||||
  import { focusTrap } from "svelte-focus-trap";
 | 
			
		||||
  import {
 | 
			
		||||
    DonationService,
 | 
			
		||||
    DonorService,
 | 
			
		||||
    RunnerService,
 | 
			
		||||
  } from "@odit/lfk-client-js";
 | 
			
		||||
  import Toastify from "toastify-js";
 | 
			
		||||
  export let modal_open;
 | 
			
		||||
  export let current_donations;
 | 
			
		||||
  function focus(el) {
 | 
			
		||||
    el.focus();
 | 
			
		||||
  }
 | 
			
		||||
  $: donor = 0;
 | 
			
		||||
  $: runner = 0;
 | 
			
		||||
  $: donors = [];
 | 
			
		||||
  $: runners = [];
 | 
			
		||||
  $: is_fixed = false;
 | 
			
		||||
  DonorService.donorControllerGetAll().then((val) => {
 | 
			
		||||
    donors = val;
 | 
			
		||||
    donor = donors[0].id || 0;
 | 
			
		||||
  });
 | 
			
		||||
  RunnerService.runnerControllerGetAll().then((val) => {
 | 
			
		||||
    runners = val;
 | 
			
		||||
    runner = runners[0].id || 0;
 | 
			
		||||
  });
 | 
			
		||||
  $: amount_input = 0;
 | 
			
		||||
  $: processed_last_submit = true;
 | 
			
		||||
  $: is_amount_valid = amount_input > 0;
 | 
			
		||||
  $: createbtnenabled = is_amount_valid;
 | 
			
		||||
  (() => {
 | 
			
		||||
    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) {
 | 
			
		||||
      let amount_cent = Math.floor(amount_input * 100);
 | 
			
		||||
      processed_last_submit = false;
 | 
			
		||||
      const toast = Toastify({
 | 
			
		||||
        text: "adding donation",
 | 
			
		||||
        duration: -1,
 | 
			
		||||
      }).showToast();
 | 
			
		||||
      if (is_fixed) {
 | 
			
		||||
        let postdata = {
 | 
			
		||||
          donor,
 | 
			
		||||
          amount: amount_cent,
 | 
			
		||||
        };
 | 
			
		||||
        DonationService.donationControllerPostFixed(postdata)
 | 
			
		||||
          .then((result) => {
 | 
			
		||||
            donor = donors[0].id || 0;
 | 
			
		||||
            runner = runners[0].id || 0;
 | 
			
		||||
            amount_input = 0;
 | 
			
		||||
            modal_open = false;
 | 
			
		||||
            //
 | 
			
		||||
            Toastify({
 | 
			
		||||
              text: "donation_added",
 | 
			
		||||
              duration: 500,
 | 
			
		||||
              backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
 | 
			
		||||
            }).showToast();
 | 
			
		||||
            current_donations.push(result);
 | 
			
		||||
            current_donations = current_donations;
 | 
			
		||||
          })
 | 
			
		||||
          .catch((err) => {
 | 
			
		||||
            //
 | 
			
		||||
          })
 | 
			
		||||
          .finally(() => {
 | 
			
		||||
            processed_last_submit = true;
 | 
			
		||||
            //
 | 
			
		||||
            toast.hideToast();
 | 
			
		||||
          });
 | 
			
		||||
      } else {
 | 
			
		||||
        let postdata = {
 | 
			
		||||
          donor,
 | 
			
		||||
          runner,
 | 
			
		||||
          amountPerDistance: amount_cent,
 | 
			
		||||
        };
 | 
			
		||||
        DonationService.donationControllerPostDistance(postdata)
 | 
			
		||||
          .then((result) => {
 | 
			
		||||
            donor = donors[0].id || 0;
 | 
			
		||||
            runner = runners[0].id || 0;
 | 
			
		||||
            amount_input = 0;
 | 
			
		||||
            modal_open = false;
 | 
			
		||||
            //
 | 
			
		||||
            Toastify({
 | 
			
		||||
              text: "donation_added",
 | 
			
		||||
              duration: 500,
 | 
			
		||||
              backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
 | 
			
		||||
            }).showToast();
 | 
			
		||||
            current_donations.push(result);
 | 
			
		||||
            current_donations = current_donations;
 | 
			
		||||
          })
 | 
			
		||||
          .catch((err) => {
 | 
			
		||||
            //
 | 
			
		||||
          })
 | 
			
		||||
          .finally(() => {
 | 
			
		||||
            processed_last_submit = true;
 | 
			
		||||
            //
 | 
			
		||||
            toast.hideToast();
 | 
			
		||||
          });
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style>
 | 
			
		||||
  input:before {
 | 
			
		||||
    content: "";
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    width: 1.25rem;
 | 
			
		||||
    height: 1.25rem;
 | 
			
		||||
    border-radius: 50%;
 | 
			
		||||
    top: 0;
 | 
			
		||||
    left: 0;
 | 
			
		||||
    transform: scale(1.1);
 | 
			
		||||
    box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.2);
 | 
			
		||||
    background-color: white;
 | 
			
		||||
    transition: 0.2s ease-in-out;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  input:checked {
 | 
			
		||||
    /* @apply: bg-indigo-400; */
 | 
			
		||||
    background-color: #7f9cf5;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  input:checked:before {
 | 
			
		||||
    left: 1.25rem;
 | 
			
		||||
  }
 | 
			
		||||
</style>
 | 
			
		||||
 | 
			
		||||
{#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
 | 
			
		||||
                class="h-6 w-6 text-blue-600"
 | 
			
		||||
                fill="currentColor"
 | 
			
		||||
                xmlns="http://www.w3.org/2000/svg"
 | 
			
		||||
                viewBox="0 0 24 24"
 | 
			
		||||
                width="24"
 | 
			
		||||
                height="24"><path fill="none" d="M0 0h24v24H0z" />
 | 
			
		||||
                <path
 | 
			
		||||
                  d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 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">
 | 
			
		||||
                <!-- TODO: -->
 | 
			
		||||
                {#if is_fixed}{$_('create-a-new-fixed-donation')}{:else}{$_('create-a-new-distance-donation')}{/if}
 | 
			
		||||
              </h3>
 | 
			
		||||
              <label class="content-center align-middle object-center">
 | 
			
		||||
                <span
 | 
			
		||||
                  class="ml-2 text-base"
 | 
			
		||||
                  class:text-gray-300={is_fixed}>{$_('distance-donation')}</span>
 | 
			
		||||
                <input
 | 
			
		||||
                  class="relative w-10 h-5 transition-all duration-200 ease-in-out bg-gray-400 rounded-full shadow-inner outline-none appearance-none align-middle"
 | 
			
		||||
                  type="checkbox"
 | 
			
		||||
                  bind:checked={is_fixed} />
 | 
			
		||||
                <span
 | 
			
		||||
                  class="ml-2 text-base	"
 | 
			
		||||
                  class:text-gray-300={!is_fixed}>{$_('fixed-donation')}</span>
 | 
			
		||||
              </label>
 | 
			
		||||
              <div class="mt-2 mb-6">
 | 
			
		||||
                <p class="text-sm text-gray-500">
 | 
			
		||||
                  {$_('please-provide-the-nessecary-information-to-create-a-new-donation')}
 | 
			
		||||
                </p>
 | 
			
		||||
              </div>
 | 
			
		||||
              <div class="grid grid-cols-6 gap-6">
 | 
			
		||||
                <div class="col-span-6">
 | 
			
		||||
                  <label
 | 
			
		||||
                    for="donor"
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">{$_('donor')}</label>
 | 
			
		||||
                  <select
 | 
			
		||||
                    bind:value={donor}
 | 
			
		||||
                    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 donors as d}
 | 
			
		||||
                      <option value={d.id}>
 | 
			
		||||
                        {d.firstname}
 | 
			
		||||
                        {d.middlename || ''}
 | 
			
		||||
                        {d.lastname}
 | 
			
		||||
                      </option>
 | 
			
		||||
                    {/each}
 | 
			
		||||
                  </select>
 | 
			
		||||
                </div>
 | 
			
		||||
                {#if !is_fixed}
 | 
			
		||||
                  <div class="col-span-6">
 | 
			
		||||
                    <label
 | 
			
		||||
                      for="donor"
 | 
			
		||||
                      class="block text-sm font-medium text-gray-700">{$_('runner')}</label>
 | 
			
		||||
                    <select
 | 
			
		||||
                      bind:value={runner}
 | 
			
		||||
                      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 runners as r}
 | 
			
		||||
                        <option value={r.id}>
 | 
			
		||||
                          {r.firstname}
 | 
			
		||||
                          {r.middlename || ''}
 | 
			
		||||
                          {r.lastname}
 | 
			
		||||
                        </option>
 | 
			
		||||
                      {/each}
 | 
			
		||||
                    </select>
 | 
			
		||||
                  </div>
 | 
			
		||||
                {/if}
 | 
			
		||||
                <div class="col-span-6">
 | 
			
		||||
                  <label
 | 
			
		||||
                    for="donation_amount_eur"
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">
 | 
			
		||||
                    {#if !is_fixed}{$_('amount-per-kilometer')}{:else}{$_('donation-amount')}{/if}</label>
 | 
			
		||||
                  <div class="mt-1 flex rounded-md shadow-sm">
 | 
			
		||||
                    <input
 | 
			
		||||
                      autocomplete="off"
 | 
			
		||||
                      class:border-red-500={!is_amount_valid}
 | 
			
		||||
                      class:focus:border-red-500={!is_amount_valid}
 | 
			
		||||
                      class:focus:ring-red-500={!is_amount_valid}
 | 
			
		||||
                      bind:value={amount_input}
 | 
			
		||||
                      type="number"
 | 
			
		||||
                      step="0.01"
 | 
			
		||||
                      name="donation_amount_eur"
 | 
			
		||||
                      class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 p-2"
 | 
			
		||||
                      placeholder="2.00" />
 | 
			
		||||
                    <span
 | 
			
		||||
                      class="inline-flex items-center px-3 rounded-r-md border border-gray-300 bg-gray-50 text-gray-500 text-sm">€</span>
 | 
			
		||||
                  </div>
 | 
			
		||||
                  {#if !is_amount_valid}
 | 
			
		||||
                    <span
 | 
			
		||||
                      class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
 | 
			
		||||
                      {$_('donation-amount-must-be-greater-that-0-00eur')}
 | 
			
		||||
                    </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}
 | 
			
		||||
							
								
								
									
										265
									
								
								src/components/donations/DonationDetail.svelte
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										265
									
								
								src/components/donations/DonationDetail.svelte
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,265 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import store from "../../store";
 | 
			
		||||
  import {
 | 
			
		||||
    DonationService,
 | 
			
		||||
    DonorService,
 | 
			
		||||
    RunnerService,
 | 
			
		||||
  } from "@odit/lfk-client-js";
 | 
			
		||||
  import Toastify from "toastify-js";
 | 
			
		||||
  import PromiseError from "../base/PromiseError.svelte";
 | 
			
		||||
  let data_loaded = false;
 | 
			
		||||
  export let params;
 | 
			
		||||
  $: delete_triggered = false;
 | 
			
		||||
  $: original_data = {};
 | 
			
		||||
  $: original_comparison_string = "";
 | 
			
		||||
  $: editable = {};
 | 
			
		||||
  $: current_donors = [];
 | 
			
		||||
  $: current_runners = [];
 | 
			
		||||
  $: amount_input = 0;
 | 
			
		||||
  $: is_amount_valid = amount_input > 0;
 | 
			
		||||
  $: changes_performed =
 | 
			
		||||
    !(original_comparison_string === JSON.stringify(editable)) ||
 | 
			
		||||
    (original_data.responseType == "DISTANCEDONATION" &&
 | 
			
		||||
      !(Math.floor(amount_input * 100) === original_data.amountPerDistance)) ||
 | 
			
		||||
    (original_data.responseType !== "DISTANCEDONATION" &&
 | 
			
		||||
      !(Math.floor(amount_input * 100) === original_data.amount));
 | 
			
		||||
  $: save_enabled = changes_performed && is_amount_valid;
 | 
			
		||||
  const donor_promise = DonorService.donorControllerGetAll().then((val) => {
 | 
			
		||||
    current_donors = val;
 | 
			
		||||
  });
 | 
			
		||||
  const runner_promise = RunnerService.runnerControllerGetAll().then((val) => {
 | 
			
		||||
    current_runners = val;
 | 
			
		||||
  });
 | 
			
		||||
  const promise = DonationService.donationControllerGetOne(
 | 
			
		||||
    params.donationid
 | 
			
		||||
  ).then((data) => {
 | 
			
		||||
    data_loaded = true;
 | 
			
		||||
    original_data = Object.assign(original_data, data);
 | 
			
		||||
    editable = Object.assign(editable, original_data);
 | 
			
		||||
    editable.donor = data.donor.id;
 | 
			
		||||
    if (data.responseType == "DISTANCEDONATION") {
 | 
			
		||||
      editable.runner = data.runner.id;
 | 
			
		||||
      amount_input = data.amountPerDistance / 100;
 | 
			
		||||
    } else {
 | 
			
		||||
      amount_input = data.amount / 100;
 | 
			
		||||
    }
 | 
			
		||||
    original_comparison_string = JSON.stringify(editable);
 | 
			
		||||
  });
 | 
			
		||||
 | 
			
		||||
  function submit() {
 | 
			
		||||
    if (data_loaded === true && save_enabled) {
 | 
			
		||||
      Toastify({
 | 
			
		||||
        text: "Donation is being updated",
 | 
			
		||||
        duration: 2500,
 | 
			
		||||
      }).showToast();
 | 
			
		||||
      if (original_data.responseType === "DISTANCEDONATION") {
 | 
			
		||||
        editable.amountPerDistance = Math.floor(amount_input * 100);
 | 
			
		||||
        DonationService.donationControllerPutDistance(
 | 
			
		||||
          original_data.id,
 | 
			
		||||
          editable
 | 
			
		||||
        )
 | 
			
		||||
          .then((resp) => {
 | 
			
		||||
            Object.assign(original_data, resp);
 | 
			
		||||
            original_data = original_data;
 | 
			
		||||
            Toastify({
 | 
			
		||||
              text: "updated donation",
 | 
			
		||||
              duration: 2500,
 | 
			
		||||
              backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
 | 
			
		||||
            }).showToast();
 | 
			
		||||
          })
 | 
			
		||||
          .catch((err) => {});
 | 
			
		||||
      } else {
 | 
			
		||||
        editable.amount = Math.floor(amount_input * 100);
 | 
			
		||||
        DonationService.donationControllerPutFixed(original_data.id, editable)
 | 
			
		||||
          .then((resp) => {
 | 
			
		||||
            Object.assign(original_data, editable);
 | 
			
		||||
            original_data = original_data;
 | 
			
		||||
            Toastify({
 | 
			
		||||
              text: "updated donation",
 | 
			
		||||
              duration: 2500,
 | 
			
		||||
              backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
 | 
			
		||||
            }).showToast();
 | 
			
		||||
          })
 | 
			
		||||
          .catch((err) => {});
 | 
			
		||||
      }
 | 
			
		||||
    } else {
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
  function deleteDonation() {
 | 
			
		||||
    DonationService.donationControllerRemove(original_data.id, false)
 | 
			
		||||
      .then((resp) => {
 | 
			
		||||
        Toastify({
 | 
			
		||||
          text: "Donation delete",
 | 
			
		||||
          duration: 500,
 | 
			
		||||
          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
 | 
			
		||||
        }).showToast();
 | 
			
		||||
        location.replace("./");
 | 
			
		||||
      })
 | 
			
		||||
      .catch((err) => {
 | 
			
		||||
        modal_open = true;
 | 
			
		||||
        delete_donor = original_data;
 | 
			
		||||
      });
 | 
			
		||||
  }
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
{#await donor_promise && runner_promise && promise}
 | 
			
		||||
  {$_('loading-donation-details')}
 | 
			
		||||
{:then}
 | 
			
		||||
  <section class="container p-5 select-none">
 | 
			
		||||
    <div class="flex flex-row mb-4">
 | 
			
		||||
      <div class="w-full">
 | 
			
		||||
        <nav class="w-full flex">
 | 
			
		||||
          <ol class="list-none flex flex-row items-center justify-start">
 | 
			
		||||
            <li class="flex items-center">
 | 
			
		||||
              <svg
 | 
			
		||||
                fill="currentColor"
 | 
			
		||||
                xmlns="http://www.w3.org/2000/svg"
 | 
			
		||||
                viewBox="0 0 24 24"
 | 
			
		||||
                width="24"
 | 
			
		||||
                height="24"><path fill="none" d="M0 0h24v24H0z" />
 | 
			
		||||
                <path
 | 
			
		||||
                  d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 4z" /></svg>
 | 
			
		||||
            </li>
 | 
			
		||||
            <li class="flex items-center ml-2">
 | 
			
		||||
              <a class="mr-2" href="./">{$_('donations')}</a><svg
 | 
			
		||||
                stroke="currentColor"
 | 
			
		||||
                fill="none"
 | 
			
		||||
                stroke-width="2"
 | 
			
		||||
                viewBox="0 0 24 24"
 | 
			
		||||
                stroke-linecap="round"
 | 
			
		||||
                stroke-linejoin="round"
 | 
			
		||||
                class="h-3 w-3 mr-2 stroke-current"
 | 
			
		||||
                height="1em"
 | 
			
		||||
                width="1em"
 | 
			
		||||
                xmlns="http://www.w3.org/2000/svg"><line
 | 
			
		||||
                  x1="5"
 | 
			
		||||
                  y1="12"
 | 
			
		||||
                  x2="19"
 | 
			
		||||
                  y2="12" />
 | 
			
		||||
                <polyline points="12 5 19 12 12 19" /></svg>
 | 
			
		||||
            </li>
 | 
			
		||||
            <li class="flex items-center">
 | 
			
		||||
              <span class="mr-2">{original_data.id}</span>
 | 
			
		||||
            </li>
 | 
			
		||||
          </ol>
 | 
			
		||||
        </nav>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="mb-8 text-3xl font-extrabold leading-tight">
 | 
			
		||||
      {original_data.donor.firstname}
 | 
			
		||||
      {original_data.donor.middlename || ''}
 | 
			
		||||
      {original_data.donor.lastname}
 | 
			
		||||
      >
 | 
			
		||||
      {#if original_data.responseType == 'DISTANCEDONATION'}
 | 
			
		||||
        {original_data.runner.firstname}
 | 
			
		||||
        {original_data.runner.middlename || ''}
 | 
			
		||||
        {original_data.runner.lastname}
 | 
			
		||||
      {:else}
 | 
			
		||||
        {$_('fixed-donation')}:
 | 
			
		||||
        {amount_input.toFixed(2).toLocaleString('de-DE', { valute: 'EUR' })}€
 | 
			
		||||
      {/if}
 | 
			
		||||
      <span data-id="donation_actions_${original_data.id}">
 | 
			
		||||
        {#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:DELETE')}
 | 
			
		||||
          {#if delete_triggered}
 | 
			
		||||
            <button
 | 
			
		||||
              on:click={deleteDonation}
 | 
			
		||||
              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:">{$_('confirm-deletion')}</button>
 | 
			
		||||
            <button
 | 
			
		||||
              on:click={() => {
 | 
			
		||||
                delete_triggered = !delete_triggered;
 | 
			
		||||
              }}
 | 
			
		||||
              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:">{$_('cancel')}</button>
 | 
			
		||||
          {/if}
 | 
			
		||||
          {#if !delete_triggered}
 | 
			
		||||
            <button
 | 
			
		||||
              on:click={() => {
 | 
			
		||||
                delete_triggered = true;
 | 
			
		||||
              }}
 | 
			
		||||
              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:">{$_('delete-donation')}</button>
 | 
			
		||||
          {/if}
 | 
			
		||||
        {/if}
 | 
			
		||||
        {#if !delete_triggered}
 | 
			
		||||
          <button
 | 
			
		||||
            disabled={!save_enabled}
 | 
			
		||||
            class:opacity-50={!save_enabled}
 | 
			
		||||
            type="button"
 | 
			
		||||
            on:click={submit}
 | 
			
		||||
            class="w-full 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:">{$_('save-changes')}</button>
 | 
			
		||||
        {/if}
 | 
			
		||||
      </span>
 | 
			
		||||
    </div>
 | 
			
		||||
    <!--  -->
 | 
			
		||||
    <div>
 | 
			
		||||
      <span class="font-medium text-gray-700">{$_('total-donation-amount')}:</span>
 | 
			
		||||
      <span>{(editable.amount / 100)
 | 
			
		||||
          .toFixed(2)
 | 
			
		||||
          .toLocaleString('de-DE', { valute: 'EUR' })}€</span>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class=" w-full">
 | 
			
		||||
      <label
 | 
			
		||||
        for="donor"
 | 
			
		||||
        class="block  font-medium text-gray-700">{$_('donor')}</label>
 | 
			
		||||
      <select
 | 
			
		||||
        bind:value={editable.donor}
 | 
			
		||||
        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm: border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2">
 | 
			
		||||
        {#each current_donors as d}
 | 
			
		||||
          <option value={d.id}>
 | 
			
		||||
            {d.firstname}
 | 
			
		||||
            {d.middlename || ''}
 | 
			
		||||
            {d.lastname}
 | 
			
		||||
          </option>
 | 
			
		||||
        {/each}
 | 
			
		||||
      </select>
 | 
			
		||||
    </div>
 | 
			
		||||
    {#if original_data.responseType == 'DISTANCEDONATION'}
 | 
			
		||||
      <div class=" w-full">
 | 
			
		||||
        <label
 | 
			
		||||
          for="donor"
 | 
			
		||||
          class="block  font-medium text-gray-700">{$_('runner')}</label>
 | 
			
		||||
        <select
 | 
			
		||||
          bind:value={editable.runner}
 | 
			
		||||
          class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm: border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2">
 | 
			
		||||
          {#each current_runners as r}
 | 
			
		||||
            <option value={r.id}>
 | 
			
		||||
              {r.firstname}
 | 
			
		||||
              {r.middlename || ''}
 | 
			
		||||
              {r.lastname}
 | 
			
		||||
            </option>
 | 
			
		||||
          {/each}
 | 
			
		||||
        </select>
 | 
			
		||||
      </div>
 | 
			
		||||
    {/if}
 | 
			
		||||
    <div class=" w-full">
 | 
			
		||||
      <label for="lastname" class="font-medium text-gray-700">
 | 
			
		||||
        {#if original_data.responseType == 'DISTANCEDONATION'}
 | 
			
		||||
          {$_('amount-per-kilometer')}
 | 
			
		||||
        {:else}{$_('donation-amount')}{/if}
 | 
			
		||||
      </label>
 | 
			
		||||
      <div class="mt-1 flex rounded-md shadow-sm">
 | 
			
		||||
        <input
 | 
			
		||||
          autocomplete="off"
 | 
			
		||||
          class:border-red-500={!is_amount_valid}
 | 
			
		||||
          class:focus:border-red-500={!is_amount_valid}
 | 
			
		||||
          class:focus:ring-red-500={!is_amount_valid}
 | 
			
		||||
          bind:value={amount_input}
 | 
			
		||||
          type="number"
 | 
			
		||||
          step="0.01"
 | 
			
		||||
          name="donation_amount_eur"
 | 
			
		||||
          class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-l-md sm: border-gray-300 border bg-gray-50 text-gray-500 p-2"
 | 
			
		||||
          placeholder="2.00" />
 | 
			
		||||
        <span
 | 
			
		||||
          class="inline-flex items-center px-3 rounded-r-md border border-gray-300 bg-gray-50 text-gray-500 ">€</span>
 | 
			
		||||
      </div>
 | 
			
		||||
      {#if !is_amount_valid}
 | 
			
		||||
        <span
 | 
			
		||||
          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
 | 
			
		||||
          {$_('donation-amount-must-be-greater-that-0-00eur')}
 | 
			
		||||
        </span>
 | 
			
		||||
      {/if}
 | 
			
		||||
    </div>
 | 
			
		||||
  </section>
 | 
			
		||||
{:catch error}
 | 
			
		||||
  <PromiseError {error} />
 | 
			
		||||
{/await}
 | 
			
		||||
							
								
								
									
										29
									
								
								src/components/donations/Donations.svelte
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										29
									
								
								src/components/donations/Donations.svelte
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,29 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import store from "../../store";
 | 
			
		||||
  import AddDonationModal from "./AddDonationModal.svelte";
 | 
			
		||||
  import DonationsOverview from "./DonationsOverview.svelte";
 | 
			
		||||
  $: current_donations = [];
 | 
			
		||||
  export let modal_open = false;
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<section class="container p-5">
 | 
			
		||||
  <span class="mb-1 text-3xl font-extrabold leading-tight">
 | 
			
		||||
    {$_('donations')}
 | 
			
		||||
    {#if store.state.jwtinfo.userdetails.permissions.includes('DONATION: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">
 | 
			
		||||
        {$_('add-donation')}
 | 
			
		||||
      </button>
 | 
			
		||||
    {/if}
 | 
			
		||||
  </span>
 | 
			
		||||
  <DonationsOverview bind:current_donations />
 | 
			
		||||
</section>
 | 
			
		||||
 | 
			
		||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:CREATE')}
 | 
			
		||||
  <AddDonationModal bind:current_donations bind:modal_open />
 | 
			
		||||
{/if}
 | 
			
		||||
							
								
								
									
										12
									
								
								src/components/donations/DonationsEmptyState.svelte
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										12
									
								
								src/components/donations/DonationsEmptyState.svelte
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,12 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import donations_empty from "./donations.svg";
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<div class="text-center items-center justify-center">
 | 
			
		||||
  <p class="mb-16 text-lg text-gray-500">
 | 
			
		||||
    <img class="w-full" style="height:15rem" src={donations_empty} alt="" />
 | 
			
		||||
    <span class="font-bold">There are no donations yet</span><br />
 | 
			
		||||
    <span>add your fist donation</span>
 | 
			
		||||
  </p>
 | 
			
		||||
</div>
 | 
			
		||||
							
								
								
									
										202
									
								
								src/components/donations/DonationsOverview.svelte
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										202
									
								
								src/components/donations/DonationsOverview.svelte
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,202 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { getLocaleFromNavigator, _ } from "svelte-i18n";
 | 
			
		||||
  import { DonationService, DonorService } from "@odit/lfk-client-js";
 | 
			
		||||
  import store from "../../store";
 | 
			
		||||
  import Toastify from "toastify-js";
 | 
			
		||||
  import DonationsEmptyState from "./DonationsEmptyState.svelte";
 | 
			
		||||
  $: searchvalue = "";
 | 
			
		||||
  $: active_deletes = [];
 | 
			
		||||
  export let current_donations = [];
 | 
			
		||||
  const donations_promise = DonationService.donationControllerGetAll().then(
 | 
			
		||||
    (val) => {
 | 
			
		||||
      current_donations = val;
 | 
			
		||||
    }
 | 
			
		||||
  );
 | 
			
		||||
  function should_display_based_on_id(id) {
 | 
			
		||||
    if (searchvalue.toString().slice(-1) === "*") {
 | 
			
		||||
      return id.toString().startsWith(searchvalue.replace("*", ""));
 | 
			
		||||
    }
 | 
			
		||||
    return id.toString() === searchvalue;
 | 
			
		||||
  }
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:GET')}
 | 
			
		||||
  {#await donations_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">donations are being loaded</p>
 | 
			
		||||
      <p class="text-sm">{$_('this-might-take-a-moment')}</p>
 | 
			
		||||
    </div>
 | 
			
		||||
  {:then}
 | 
			
		||||
    {#if current_donations.length === 0}
 | 
			
		||||
      <DonationsEmptyState />
 | 
			
		||||
    {: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">
 | 
			
		||||
                {$_('donor')}
 | 
			
		||||
              </th>
 | 
			
		||||
              <th
 | 
			
		||||
                scope="col"
 | 
			
		||||
                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
 | 
			
		||||
                {$_('runner')}
 | 
			
		||||
              </th>
 | 
			
		||||
              <th
 | 
			
		||||
                scope="col"
 | 
			
		||||
                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
 | 
			
		||||
                {$_('amount-per-kilometer')}
 | 
			
		||||
              </th>
 | 
			
		||||
              <th
 | 
			
		||||
                scope="col"
 | 
			
		||||
                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
 | 
			
		||||
                {$_('donation-amount')}
 | 
			
		||||
              </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_donations as donation}
 | 
			
		||||
              {#if donation.donor.firstname
 | 
			
		||||
                .toLowerCase()
 | 
			
		||||
                .includes(
 | 
			
		||||
                  searchvalue.toLowerCase()
 | 
			
		||||
                ) || donation.donor.middlename
 | 
			
		||||
                  .toLowerCase()
 | 
			
		||||
                  .includes(
 | 
			
		||||
                    searchvalue.toLowerCase()
 | 
			
		||||
                  ) || donation.donor.lastname
 | 
			
		||||
                  .toLowerCase()
 | 
			
		||||
                  .includes(
 | 
			
		||||
                    searchvalue.toLowerCase()
 | 
			
		||||
                  ) || donation.runner?.firstname
 | 
			
		||||
                  .toLowerCase()
 | 
			
		||||
                  .includes(
 | 
			
		||||
                    searchvalue.toLowerCase()
 | 
			
		||||
                  ) || donation.runner?.middlename
 | 
			
		||||
                  .toLowerCase()
 | 
			
		||||
                  .includes(
 | 
			
		||||
                    searchvalue.toLowerCase()
 | 
			
		||||
                  ) || donation.runner?.lastname
 | 
			
		||||
                  .toLowerCase()
 | 
			
		||||
                  .includes(
 | 
			
		||||
                    searchvalue.toLowerCase()
 | 
			
		||||
                  ) || should_display_based_on_id(donation.id)}
 | 
			
		||||
                <tr data-rowid="donation_{donation.id}">
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    <div class="flex items-center">
 | 
			
		||||
                      <a
 | 
			
		||||
                        href="../donors/{donation.donor.id}"
 | 
			
		||||
                        class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{donation.donor.firstname}
 | 
			
		||||
                        {donation.donor.middlename || ''}
 | 
			
		||||
                        {donation.donor.lastname}</a>
 | 
			
		||||
                    </div>
 | 
			
		||||
                  </td>
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    {#if donation.runner}
 | 
			
		||||
                      <div class="text-sm font-medium text-gray-900">
 | 
			
		||||
                        <a
 | 
			
		||||
                          href="../runners/{donation.runner.id}"
 | 
			
		||||
                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{donation.runner.firstname}
 | 
			
		||||
                          {donation.runner.middlename || ''}
 | 
			
		||||
                          {donation.runner.lastname}</a>
 | 
			
		||||
                      </div>
 | 
			
		||||
                    {:else}
 | 
			
		||||
                      <div class="text-sm font-medium text-gray-900">
 | 
			
		||||
                        {$_('fixed-donation')}
 | 
			
		||||
                      </div>
 | 
			
		||||
                    {/if}
 | 
			
		||||
                  </td>
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    {#if donation.amountPerDistance}
 | 
			
		||||
                      <div class="text-sm font-medium text-gray-900">
 | 
			
		||||
                        {(donation.amountPerDistance / 100)
 | 
			
		||||
                          .toFixed(2)
 | 
			
		||||
                          .toLocaleString('de-DE', { valute: 'EUR' })}€
 | 
			
		||||
                      </div>
 | 
			
		||||
                    {:else}
 | 
			
		||||
                      <div class="text-sm font-medium text-gray-900">
 | 
			
		||||
                        {$_('fixed-donation')}
 | 
			
		||||
                      </div>
 | 
			
		||||
                    {/if}
 | 
			
		||||
                  </td>
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    <div class="text-sm font-medium text-gray-900">
 | 
			
		||||
                      {(donation.amount / 100)
 | 
			
		||||
                        .toFixed(2)
 | 
			
		||||
                        .toLocaleString('de-DE', { valute: 'EUR' })}€
 | 
			
		||||
                    </div>
 | 
			
		||||
                  </td>
 | 
			
		||||
                  {#if active_deletes[donation.id] === true}
 | 
			
		||||
                    <td
 | 
			
		||||
                      class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
 | 
			
		||||
                      <button
 | 
			
		||||
                        on:click={() => {
 | 
			
		||||
                          active_deletes[donation.id] = false;
 | 
			
		||||
                        }}
 | 
			
		||||
                        tabindex="0"
 | 
			
		||||
                        class="ml-4 text-indigo-600 hover:text-indigo-900 cursor-pointer">{$_('cancel-delete')}</button>
 | 
			
		||||
                      <button
 | 
			
		||||
                        on:click={() => {
 | 
			
		||||
                          DonationService.donationControllerRemove(donation.id, false).then(
 | 
			
		||||
                            (resp) => {
 | 
			
		||||
                              current_donations = current_donations.filter(
 | 
			
		||||
                                (obj) => obj.id !== donation.id
 | 
			
		||||
                              );
 | 
			
		||||
                              Toastify({
 | 
			
		||||
                                text: 'Donation deleted',
 | 
			
		||||
                                duration: 500,
 | 
			
		||||
                                backgroundColor:
 | 
			
		||||
                                  'linear-gradient(to right, #00b09b, #96c93d)',
 | 
			
		||||
                              }).showToast();
 | 
			
		||||
                            }
 | 
			
		||||
                          );
 | 
			
		||||
                        }}
 | 
			
		||||
                        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="./{donation.id}"
 | 
			
		||||
                        class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
 | 
			
		||||
                      {#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:DELETE')}
 | 
			
		||||
                        <button
 | 
			
		||||
                          on:click={() => {
 | 
			
		||||
                            active_deletes[donation.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}
 | 
			
		||||
							
								
								
									
										1
									
								
								src/components/donations/donations.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										1
									
								
								src/components/donations/donations.svg
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1 @@
 | 
			
		||||
<svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="598.11" height="535.11"><path d="M3.35 120.07a4.6 4.6 0 00-3.18 5.66l76.72 273.98a4.6 4.6 0 005.65 3.18l282.82-79.19a4.6 4.6 0 003.18-5.66L291.82 44.07a4.6 4.6 0 00-5.65-3.19z" fill="#e6e6e6"/><path d="M86.1 389.95l269.5-75.46-72.99-260.67-269.5 75.46z" fill="#fff"/><path d="M48.74 164.1c-1.8.5-2.54 3.48-1.65 6.65s3.07 5.33 4.87 4.83l122.91-34.42c1.8-.5 2.54-3.49 1.66-6.65s-3.08-5.34-4.87-4.84zM58.64 199.44c-1.8.5-2.54 3.5-1.65 6.66s3.07 5.34 4.87 4.83l122.91-34.42c1.8-.5 2.54-3.49 1.65-6.65s-3.07-5.34-4.86-4.83zM68.42 234.39c-1.8.5-2.54 3.49-1.65 6.66s3.07 5.33 4.87 4.83l122.92-34.42c1.8-.5 2.54-3.5 1.65-6.66s-3.07-5.33-4.87-4.83zM78.32 269.74c-1.8.5-2.54 3.49-1.65 6.66s3.07 5.33 4.87 4.83l122.92-34.42c1.8-.5 2.54-3.49 1.65-6.66s-3.07-5.33-4.87-4.83zM234.04 112.61a5.97 5.97 0 103.21 11.5l22.98-6.44a5.97 5.97 0 00-3.22-11.49zM243.74 147.28a5.97 5.97 0 103.22 11.49l22.98-6.43a5.97 5.97 0 00-3.22-11.5zM253.45 181.95a5.97 5.97 0 103.22 11.49l22.98-6.44a5.97 5.97 0 00-3.22-11.49zM263.16 216.61a5.97 5.97 0 003.21 11.5l22.98-6.44a5.97 5.97 0 00-3.21-11.49z" fill="#e6e6e6"/><path d="M272.43 276.7a7.6 7.6 0 104.1 14.64l29.28-8.2a7.6 7.6 0 00-4.1-14.64z" fill="#6c63ff"/><path fill="#e6e6e6" d="M85.9 307.81l216.66-60.67.54 1.93-216.67 60.67z"/><path fill="#a0616a" d="M520.2 506.07l-17.38 4.2-24.47-65.02 25.65-6.2 16.2 67.02z"/><path d="M472.85 535.11l-.12-.48a22.23 22.23 0 0116.37-26.8l34-8.23 5.33 22.08z" fill="#2f2e41"/><path fill="#a0616a" d="M443.28 517.91H425.4l-8.5-68.96h26.38v68.96z"/><path d="M447.6 535.01h-57.18v-.5a22.2 22.2 0 0122.2-22.2h34.99zM416.88 490.99l-17.36-206.87 71.86-13.25.28-.05 21.03 13.52-7.32 76.14 33.7 118.7-29.1 7.65-33.75-110.08-7.73-33.48-3.96 43.5 2.94 107.28z" fill="#2f2e41"/><path d="M397.3 288.81l-.2-.24 24.84-186.96.03-.24.17-.18c.37-.36 9.07-8.96 18.02-8.96 1.3 0 2.52-.03 3.7-.06 6.85-.18 12.26-.32 18.69 6.1 6.55 6.56 27.92 30.47 27.92 63.23 0 31.7 2.88 130.22 2.91 131.21l.04 1.4-1.16-.76c-.3-.19-29.03-18.49-53.14-1.48-7.53 5.32-14.3 7.18-20.09 7.18-13.47 0-21.62-10.1-21.73-10.24z" fill="#6c63ff"/><circle cx="737.3" cy="227.82" r="35.82" transform="rotate(-28.66 229.78 725.57)" fill="#a0616a"/><path d="M381.53 328.99a14.66 14.66 0 00.85-22.47l20.34-47.97-26.63 4.9-15.23 44.8A14.74 14.74 0 00381.53 329z" fill="#a0616a"/><path d="M361.88 291.67l6.55-13.83a2.7 2.7 0 01-.97-1c-6.12-10.6 30.84-98.67 33.3-104.51-.37-3.18-4.25-36.85-1.41-48.2 3.34-13.35 10.2-19.58 22.93-20.81 14.04-1.32 17.83 17.75 17.86 17.94l.02 49.02-16.12 56.43-36.75 74.97z" fill="#6c63ff"/><path d="M440.94 58.87c-4.3.56-7.54-3.83-9.04-7.9s-2.64-8.78-6.38-10.98c-5.1-3-11.62.61-17.45-.38-6.59-1.11-10.87-8.1-11.2-14.76s2.31-13.1 4.92-19.24l.9 7.64A15.16 15.16 0 01409.33 0l-1.17 11.22c.73-6.29 7.5-11.16 13.7-9.85l-.19 6.68c7.6-.9 15.28-1.81 22.91-1.12s15.31 3.1 21.1 8.13c8.64 7.51 11.8 19.89 10.74 31.3s-5.77 22.13-10.68 32.48c-1.23 2.6-2.94 5.54-5.8 5.88-2.58.3-4.93-1.86-5.73-4.32s-.41-5.14.07-7.69c.72-3.84 1.63-7.77.95-11.63s-3.45-7.66-7.33-8.13-7.86 3.97-6 7.4z" fill="#2f2e41"/><path fill="#3f3d56" d="M597.73 535.1H339.99v-2.11h258.12l-.38 2.1z"/></svg>
 | 
			
		||||
| 
		 After Width: | Height: | Size: 3.1 KiB  | 
							
								
								
									
										404
									
								
								src/components/donors/AddDonorModal.svelte
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										404
									
								
								src/components/donors/AddDonorModal.svelte
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,404 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import { clickOutside } from "../base/outsideclick";
 | 
			
		||||
  import { focusTrap } from "svelte-focus-trap";
 | 
			
		||||
  import {
 | 
			
		||||
    DonorService
 | 
			
		||||
  } 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_donors;
 | 
			
		||||
  let firstname_input;
 | 
			
		||||
  let lastname_input;
 | 
			
		||||
  let middlename_input;
 | 
			
		||||
  let phone_input;
 | 
			
		||||
  let email_input;
 | 
			
		||||
  let address_input1;
 | 
			
		||||
  let address_input2;
 | 
			
		||||
  let address_zipcode;
 | 
			
		||||
  let address_city;
 | 
			
		||||
  function focus(el) {
 | 
			
		||||
    el.focus();
 | 
			
		||||
  }
 | 
			
		||||
  $: middlename_input_value = "";
 | 
			
		||||
  $: phone_input_value = "";
 | 
			
		||||
  $: email_input_value = "";
 | 
			
		||||
  $: lastname_input_value = "";
 | 
			
		||||
  $: firstname_input_value = "";
 | 
			
		||||
  $: address_input1_value = "";
 | 
			
		||||
  $: address_input2_value = "";
 | 
			
		||||
  $: address_zipcode_value = "";
 | 
			
		||||
  $: address_city_value = "";
 | 
			
		||||
  $: processed_last_submit = true;
 | 
			
		||||
  $: address_checked = false;
 | 
			
		||||
  $: isPhoneValidOrEmpty =
 | 
			
		||||
    (phone_input_value.includes("+") &&
 | 
			
		||||
      isMobilePhone(
 | 
			
		||||
        phone_input_value
 | 
			
		||||
          .replaceAll("(", "")
 | 
			
		||||
          .replaceAll(")", "")
 | 
			
		||||
          .replaceAll("-", "")
 | 
			
		||||
          .replaceAll(" ", "")
 | 
			
		||||
      )) ||
 | 
			
		||||
    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;
 | 
			
		||||
  $: isAddress1Valid = address_input1_value.trim().length !== 0;
 | 
			
		||||
  $: iszipcodevalid = address_zipcode_value.trim().length !== 0;
 | 
			
		||||
  $: iscityvalid = address_city_value.trim().length !== 0;
 | 
			
		||||
  $: createbtnenabled =
 | 
			
		||||
    isFirstnameValid &&
 | 
			
		||||
    isLastnameValid &&
 | 
			
		||||
    isEmailValidOrEmpty &&
 | 
			
		||||
    isPhoneValidOrEmpty &&
 | 
			
		||||
    ((isAddress1Valid && iszipcodevalid && iscityvalid) ||
 | 
			
		||||
      address_checked === false);
 | 
			
		||||
  (() => {
 | 
			
		||||
    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: $_('donor-is-being-added'),
 | 
			
		||||
        duration: -1,
 | 
			
		||||
      }).showToast();
 | 
			
		||||
      let address = {};
 | 
			
		||||
      if (address_checked === true) {
 | 
			
		||||
        address = {
 | 
			
		||||
          address1: address_input1_value,
 | 
			
		||||
          address2: address_input2_value || "",
 | 
			
		||||
          postalcode: address_zipcode_value,
 | 
			
		||||
          city: address_city_value,
 | 
			
		||||
          country: "DE",
 | 
			
		||||
        };
 | 
			
		||||
      }
 | 
			
		||||
      let postdata = {
 | 
			
		||||
        firstname: firstname_input_value,
 | 
			
		||||
        lastname: lastname_input_value,
 | 
			
		||||
        address,
 | 
			
		||||
        receiptNeeded: address_checked
 | 
			
		||||
      };
 | 
			
		||||
      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;
 | 
			
		||||
      }
 | 
			
		||||
      DonorService.donorControllerPost(postdata)
 | 
			
		||||
        .then((result) => {
 | 
			
		||||
          firstname_input_value = "";
 | 
			
		||||
          lastname_input_value = "";
 | 
			
		||||
          middlename_input_value = "";
 | 
			
		||||
          email_input_value = "";
 | 
			
		||||
          modal_open = false;
 | 
			
		||||
          //
 | 
			
		||||
          Toastify({
 | 
			
		||||
            text: $_('donor-added'),
 | 
			
		||||
            duration: 500,
 | 
			
		||||
            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
 | 
			
		||||
          }).showToast();
 | 
			
		||||
          current_donors.push(result);
 | 
			
		||||
          current_donors = current_donors;
 | 
			
		||||
        })
 | 
			
		||||
        .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
 | 
			
		||||
                class="h-6 w-6 text-blue-600"
 | 
			
		||||
                fill="currentColor"
 | 
			
		||||
                xmlns="http://www.w3.org/2000/svg"
 | 
			
		||||
                viewBox="0 0 24 24"
 | 
			
		||||
                width="24"
 | 
			
		||||
                height="24"><path fill="none" d="M0 0h24v24H0z" />
 | 
			
		||||
                <path
 | 
			
		||||
        d="M9.33 11.5h2.17A4.5 4.5 0 0 1 16 16H8.999L9 17h8v-1a5.578 5.578 0 0 0-.886-3H19a5 5 0 0 1 4.516 2.851C21.151 18.972 17.322 21 13 21c-2.761 0-5.1-.59-7-1.625L6 10.071A6.967 6.967 0 0 1 9.33 11.5zM5 19a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v9zM18 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm-7-3a3 3 0 1 1 0 6 3 3 0 0 1 0-6z" /></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-donor')}
 | 
			
		||||
              </h3>
 | 
			
		||||
              <div class="mt-2 mb-6">
 | 
			
		||||
                <p class="text-sm text-gray-500">
 | 
			
		||||
                  {$_('please-provide-the-nessecary-information-to-add-a-new-donor')}
 | 
			
		||||
                </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="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">
 | 
			
		||||
                      {@html $_('the-provided-phone-number-is-invalid-less-than-br-greater-than-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 class="flex items-start">
 | 
			
		||||
                  <div class="flex items-center h-5">
 | 
			
		||||
                    <input
 | 
			
		||||
                      bind:checked={address_checked}
 | 
			
		||||
                      id="comments"
 | 
			
		||||
                      name="comments"
 | 
			
		||||
                      type="checkbox"
 | 
			
		||||
                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
 | 
			
		||||
                  </div>
 | 
			
		||||
                  <div class="ml-3 text-sm">
 | 
			
		||||
                    <label
 | 
			
		||||
                      for="comments"
 | 
			
		||||
                      class="font-medium text-gray-700">{$_('receipt-needed')}</label>
 | 
			
		||||
                  </div>
 | 
			
		||||
                </div>
 | 
			
		||||
                {#if address_checked === true}
 | 
			
		||||
                  <div class="col-span-6">
 | 
			
		||||
                    <label
 | 
			
		||||
                      for="address1"
 | 
			
		||||
                      class="block text-sm font-medium text-gray-700">{$_('address')}</label>
 | 
			
		||||
                    <input
 | 
			
		||||
                      autocomplete="off"
 | 
			
		||||
                      placeholder="Address"
 | 
			
		||||
                      class:border-red-500={!isAddress1Valid}
 | 
			
		||||
                      class:focus:border-red-500={!isAddress1Valid}
 | 
			
		||||
                      class:focus:ring-red-500={!isAddress1Valid}
 | 
			
		||||
                      bind:value={address_input1_value}
 | 
			
		||||
                      bind:this={address_input1}
 | 
			
		||||
                      type="text"
 | 
			
		||||
                      name="address1"
 | 
			
		||||
                      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 !isAddress1Valid}
 | 
			
		||||
                      <span
 | 
			
		||||
                        class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
 | 
			
		||||
                        {$_('address-is-required')}
 | 
			
		||||
                      </span>
 | 
			
		||||
                    {/if}
 | 
			
		||||
                  </div>
 | 
			
		||||
                  <div class="col-span-6">
 | 
			
		||||
                    <label
 | 
			
		||||
                      for="address2"
 | 
			
		||||
                      class="block text-sm font-medium text-gray-700">{$_('apartment-suite-etc')}</label>
 | 
			
		||||
                    <input
 | 
			
		||||
                      autocomplete="off"
 | 
			
		||||
                      placeholder={$_('apartment-suite-etc')}
 | 
			
		||||
                      bind:value={address_input2_value}
 | 
			
		||||
                      bind:this={address_input2}
 | 
			
		||||
                      type="text"
 | 
			
		||||
                      name="address2"
 | 
			
		||||
                      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="zipcode"
 | 
			
		||||
                      class="block text-sm font-medium text-gray-700">{$_('zip-postal-code')}</label>
 | 
			
		||||
                    <input
 | 
			
		||||
                      autocomplete="off"
 | 
			
		||||
                      placeholder={$_('zip-postal-code')}
 | 
			
		||||
                      class:border-red-500={!iszipcodevalid}
 | 
			
		||||
                      class:focus:border-red-500={!iszipcodevalid}
 | 
			
		||||
                      class:focus:ring-red-500={!iszipcodevalid}
 | 
			
		||||
                      bind:value={address_zipcode_value}
 | 
			
		||||
                      bind:this={address_zipcode}
 | 
			
		||||
                      type="text"
 | 
			
		||||
                      name="zipcode"
 | 
			
		||||
                      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 !iszipcodevalid}
 | 
			
		||||
                      <span
 | 
			
		||||
                        class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
 | 
			
		||||
                        {$_('valid-zipcode-postal-code-is-required')}
 | 
			
		||||
                      </span>
 | 
			
		||||
                    {/if}
 | 
			
		||||
                  </div>
 | 
			
		||||
                  <div class="col-span-6">
 | 
			
		||||
                    <label
 | 
			
		||||
                      for="city"
 | 
			
		||||
                      class="block text-sm font-medium text-gray-700">City</label>
 | 
			
		||||
                    <input
 | 
			
		||||
                      autocomplete="off"
 | 
			
		||||
                      placeholder="City"
 | 
			
		||||
                      class:border-red-500={!iscityvalid}
 | 
			
		||||
                      class:focus:border-red-500={!iscityvalid}
 | 
			
		||||
                      class:focus:ring-red-500={!iscityvalid}
 | 
			
		||||
                      bind:value={address_city_value}
 | 
			
		||||
                      bind:this={address_city}
 | 
			
		||||
                      type="text"
 | 
			
		||||
                      name="city"
 | 
			
		||||
                      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 !iscityvalid}
 | 
			
		||||
                      <span
 | 
			
		||||
                        class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
 | 
			
		||||
                        {$_('valid-city-is-required')}
 | 
			
		||||
                      </span>
 | 
			
		||||
                    {/if}
 | 
			
		||||
                  </div>
 | 
			
		||||
                {/if}
 | 
			
		||||
              </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}
 | 
			
		||||
							
								
								
									
										92
									
								
								src/components/donors/ConfirmDonorDeletion.svelte
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										92
									
								
								src/components/donors/ConfirmDonorDeletion.svelte
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,92 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import { clickOutside } from "../base/outsideclick";
 | 
			
		||||
  import { focusTrap } from "svelte-focus-trap";
 | 
			
		||||
  import { DonorService } from "@odit/lfk-client-js";
 | 
			
		||||
  import Toastify from "toastify-js";
 | 
			
		||||
  import { createEventDispatcher } from "svelte";
 | 
			
		||||
  export let modal_open;
 | 
			
		||||
  export let delete_donor;
 | 
			
		||||
  const dispatch = createEventDispatcher();
 | 
			
		||||
  function cancelDelete() {
 | 
			
		||||
    modal_open = false;
 | 
			
		||||
    dispatch("cancelDelete", { id: delete_donor.id });
 | 
			
		||||
  }
 | 
			
		||||
  function deleteDonor() {
 | 
			
		||||
    DonorService.donorControllerRemove(
 | 
			
		||||
      delete_donor.id,
 | 
			
		||||
      true
 | 
			
		||||
    )
 | 
			
		||||
      .then((resp) => {
 | 
			
		||||
        Toastify({
 | 
			
		||||
          text: "Donor deleted",
 | 
			
		||||
          duration: 500,
 | 
			
		||||
          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
 | 
			
		||||
        }).showToast();
 | 
			
		||||
        location.replace("./");
 | 
			
		||||
      })
 | 
			
		||||
      .catch((err) => {});
 | 
			
		||||
  }
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
{#if modal_open}
 | 
			
		||||
  <div
 | 
			
		||||
    class="fixed z-10 inset-0 overflow-y-auto"
 | 
			
		||||
    use:focusTrap
 | 
			
		||||
    use:clickOutside
 | 
			
		||||
    on:click_outside={cancelDelete}>
 | 
			
		||||
    <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 class="h-6 w-6 text-blue-600" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M9.33 11.5h2.17A4.5 4.5 0 0116 16H9v1h8v-1a5.58 5.58 0 00-.89-3H19a5 5 0 014.52 2.85A13.15 13.15 0 0113 21c-2.76 0-5.1-.59-7-1.63v-9.3a6.97 6.97 0 013.33 1.43zM5 19a1 1 0 01-1 1H2a1 1 0 01-1-1v-9a1 1 0 011-1h2a1 1 0 011 1v9zM18 5a3 3 0 110 6 3 3 0 010-6zm-7-3a3 3 0 110 6 3 3 0 010-6z"/></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">
 | 
			
		||||
                {$_('attention')}
 | 
			
		||||
              </h3>
 | 
			
		||||
              <div class="mt-2 mb-6">
 | 
			
		||||
                <p class="text-sm text-gray-500">
 | 
			
		||||
                  {$_(
 | 
			
		||||
                    'do-you-want-to-delete-this-donor-with-all-related-donations'
 | 
			
		||||
                  )}
 | 
			
		||||
                  <br /> 
 | 
			
		||||
                  {$_('all-associated-donations-will-get-deleted-as-well')}
 | 
			
		||||
                </p>
 | 
			
		||||
              </div>
 | 
			
		||||
            </div>
 | 
			
		||||
          </div>
 | 
			
		||||
        </div>
 | 
			
		||||
        <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
 | 
			
		||||
          <button
 | 
			
		||||
            on:click={deleteDonor}
 | 
			
		||||
            type="button"
 | 
			
		||||
            class="w-full inline-flex 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-delete-donor-with-all-donations')}
 | 
			
		||||
          </button>
 | 
			
		||||
          <button
 | 
			
		||||
            on:click={cancelDelete}
 | 
			
		||||
            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-keep-donor')}
 | 
			
		||||
          </button>
 | 
			
		||||
        </div>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
  </div>
 | 
			
		||||
{/if}
 | 
			
		||||
							
								
								
									
										406
									
								
								src/components/donors/DonorDetail.svelte
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										406
									
								
								src/components/donors/DonorDetail.svelte
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,406 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import store from "../../store";
 | 
			
		||||
  import { DonorService, DonationService } from "@odit/lfk-client-js";
 | 
			
		||||
  import Toastify from "toastify-js";
 | 
			
		||||
  import PromiseError from "../base/PromiseError.svelte";
 | 
			
		||||
  import isEmail from "validator/es/lib/isEmail";
 | 
			
		||||
  import ConfirmDonorDeletion from "./ConfirmDonorDeletion.svelte";
 | 
			
		||||
  let data_loaded = false;
 | 
			
		||||
  export let params;
 | 
			
		||||
  $: delete_triggered = false;
 | 
			
		||||
  $: original_data = {};
 | 
			
		||||
  $: editable = {};
 | 
			
		||||
  $: current_donations = [];
 | 
			
		||||
  $: changes_performed = !(
 | 
			
		||||
    JSON.stringify(original_data) === JSON.stringify(editable)
 | 
			
		||||
  );
 | 
			
		||||
  $: isEmailValid =
 | 
			
		||||
    (editable.email || "") === "" ||
 | 
			
		||||
    (editable.email && isEmail(editable.email || ""));
 | 
			
		||||
  $: isFirstnameValid = editable.firstname !== "";
 | 
			
		||||
  $: isLastnameValid = editable.lastname !== "";
 | 
			
		||||
  $: save_enabled =
 | 
			
		||||
    changes_performed &&
 | 
			
		||||
    isFirstnameValid &&
 | 
			
		||||
    isLastnameValid &&
 | 
			
		||||
    isEmailValid &&
 | 
			
		||||
    isPhoneValidOrEmpty &&
 | 
			
		||||
    ((isAddress1Valid && iszipcodevalid && iscityvalid) ||
 | 
			
		||||
      editable.address_checked === false);
 | 
			
		||||
  const donation_promise = DonationService.donationControllerGetAll().then(
 | 
			
		||||
    (val) => {
 | 
			
		||||
      current_donations = val;
 | 
			
		||||
    }
 | 
			
		||||
  );
 | 
			
		||||
  const promise = DonorService.donorControllerGetOne(params.donorid).then(
 | 
			
		||||
    (data) => {
 | 
			
		||||
      data_loaded = true;
 | 
			
		||||
      original_data = Object.assign(original_data, data);
 | 
			
		||||
      editable = Object.assign(editable, original_data);
 | 
			
		||||
      editable.address_checked = editable.address.address1 !== null;
 | 
			
		||||
      original_data.address_checked = editable.address.address1 !== null;
 | 
			
		||||
      if (editable.address_checked === false) {
 | 
			
		||||
        editable.address = {
 | 
			
		||||
          address1: "",
 | 
			
		||||
          address2: "",
 | 
			
		||||
          city: "",
 | 
			
		||||
          postalcode: "",
 | 
			
		||||
          country: "",
 | 
			
		||||
        };
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  );
 | 
			
		||||
  $: isPhoneValidOrEmpty =
 | 
			
		||||
    editable.phone?.includes("+") ||
 | 
			
		||||
    editable.phone === "" ||
 | 
			
		||||
    editable.phone === null;
 | 
			
		||||
  $: isAddress1Valid = editable.address?.address1?.trim().length !== 0;
 | 
			
		||||
  $: iszipcodevalid = editable.address?.postalcode?.trim().length !== 0;
 | 
			
		||||
  $: iscityvalid = editable.address?.city?.trim().length !== 0;
 | 
			
		||||
  let modal_open = false;
 | 
			
		||||
  let delete_donor = {};
 | 
			
		||||
  function submit() {
 | 
			
		||||
    if (data_loaded === true && save_enabled) {
 | 
			
		||||
      Toastify({
 | 
			
		||||
        text: $_("donor-is-being-updated"),
 | 
			
		||||
        duration: 2500,
 | 
			
		||||
      }).showToast();
 | 
			
		||||
      editable.address.country = "DE";
 | 
			
		||||
      if (editable.address_checked === false) {
 | 
			
		||||
        editable.address = null;
 | 
			
		||||
      }
 | 
			
		||||
      if (editable.email) editable.email = editable.email;
 | 
			
		||||
      if (editable.phone) editable.phone = editable.phone;
 | 
			
		||||
      if (editable.middlename) editable.middlename = editable.middlename;
 | 
			
		||||
      editable.receiptNeeded = editable.address_checked;
 | 
			
		||||
      DonorService.donorControllerPut(original_data.id, editable)
 | 
			
		||||
        .then((resp) => {
 | 
			
		||||
          Object.assign(original_data, editable);
 | 
			
		||||
          original_data = original_data;
 | 
			
		||||
          Toastify({
 | 
			
		||||
            text: $_("updated-donor"),
 | 
			
		||||
            duration: 2500,
 | 
			
		||||
            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
 | 
			
		||||
          }).showToast();
 | 
			
		||||
        })
 | 
			
		||||
        .catch((err) => {});
 | 
			
		||||
    } else {
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
  function deleteDonor() {
 | 
			
		||||
    DonorService.donorControllerRemove(original_data.id, false)
 | 
			
		||||
      .then((resp) => {
 | 
			
		||||
        Toastify({
 | 
			
		||||
          text: $_("donor-deleted"),
 | 
			
		||||
          duration: 500,
 | 
			
		||||
          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
 | 
			
		||||
        }).showToast();
 | 
			
		||||
        location.replace("./");
 | 
			
		||||
      })
 | 
			
		||||
      .catch((err) => {
 | 
			
		||||
        modal_open = true;
 | 
			
		||||
        delete_donor = original_data;
 | 
			
		||||
      });
 | 
			
		||||
  }
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<ConfirmDonorDeletion bind:modal_open bind:delete_donor />
 | 
			
		||||
{#await promise && donation_promise}
 | 
			
		||||
  {$_('loading-donor-details')}
 | 
			
		||||
{:then}
 | 
			
		||||
  <section class="container p-5 select-none">
 | 
			
		||||
    <div class="flex flex-row mb-4">
 | 
			
		||||
      <div class="w-full">
 | 
			
		||||
        <nav class="w-full flex">
 | 
			
		||||
          <ol class="list-none flex flex-row items-center justify-start">
 | 
			
		||||
            <li class="flex items-center">
 | 
			
		||||
              <svg
 | 
			
		||||
                fill="currentColor"
 | 
			
		||||
                xmlns="http://www.w3.org/2000/svg"
 | 
			
		||||
                viewBox="0 0 24 24"
 | 
			
		||||
                width="24"
 | 
			
		||||
                height="24"><path fill="none" d="M0 0h24v24H0z" />
 | 
			
		||||
                <path
 | 
			
		||||
                  d="M9.33 11.5h2.17A4.5 4.5 0 0 1 16 16H8.999L9 17h8v-1a5.578 5.578 0 0 0-.886-3H19a5 5 0 0 1 4.516 2.851C21.151 18.972 17.322 21 13 21c-2.761 0-5.1-.59-7-1.625L6 10.071A6.967 6.967 0 0 1 9.33 11.5zM5 19a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v9zM18 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm-7-3a3 3 0 1 1 0 6 3 3 0 0 1 0-6z" /></svg>
 | 
			
		||||
            </li>
 | 
			
		||||
            <li class="flex items-center ml-2">
 | 
			
		||||
              <a class="mr-2" href="./">{$_('donors')}</a><svg
 | 
			
		||||
                stroke="currentColor"
 | 
			
		||||
                fill="none"
 | 
			
		||||
                stroke-width="2"
 | 
			
		||||
                viewBox="0 0 24 24"
 | 
			
		||||
                stroke-linecap="round"
 | 
			
		||||
                stroke-linejoin="round"
 | 
			
		||||
                class="h-3 w-3 mr-2 stroke-current"
 | 
			
		||||
                height="1em"
 | 
			
		||||
                width="1em"
 | 
			
		||||
                xmlns="http://www.w3.org/2000/svg"><line
 | 
			
		||||
                  x1="5"
 | 
			
		||||
                  y1="12"
 | 
			
		||||
                  x2="19"
 | 
			
		||||
                  y2="12" />
 | 
			
		||||
                <polyline points="12 5 19 12 12 19" /></svg>
 | 
			
		||||
            </li>
 | 
			
		||||
            <li class="flex items-center">
 | 
			
		||||
              <span class="mr-2">{original_data.firstname}
 | 
			
		||||
                {original_data.middlename || ''}
 | 
			
		||||
                {original_data.lastname}</span>
 | 
			
		||||
            </li>
 | 
			
		||||
          </ol>
 | 
			
		||||
        </nav>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="mb-8 text-3xl font-extrabold leading-tight">
 | 
			
		||||
      {original_data.firstname}
 | 
			
		||||
      {original_data.middlename || ''}
 | 
			
		||||
      {original_data.lastname}
 | 
			
		||||
      <span data-id="donor_actions_${editable.id}">
 | 
			
		||||
        {#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:DELETE')}
 | 
			
		||||
          {#if delete_triggered}
 | 
			
		||||
            <button
 | 
			
		||||
              on:click={deleteDonor}
 | 
			
		||||
              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:">{$_('confirm-deletion')}</button>
 | 
			
		||||
            <button
 | 
			
		||||
              on:click={() => {
 | 
			
		||||
                delete_triggered = !delete_triggered;
 | 
			
		||||
              }}
 | 
			
		||||
              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:">{$_('cancel')}</button>
 | 
			
		||||
          {/if}
 | 
			
		||||
          {#if !delete_triggered}
 | 
			
		||||
            <button
 | 
			
		||||
              on:click={() => {
 | 
			
		||||
                delete_triggered = true;
 | 
			
		||||
              }}
 | 
			
		||||
              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:">{$_('delete-donor')}</button>
 | 
			
		||||
          {/if}
 | 
			
		||||
        {/if}
 | 
			
		||||
        {#if !delete_triggered}
 | 
			
		||||
          <button
 | 
			
		||||
            disabled={!save_enabled}
 | 
			
		||||
            class:opacity-50={!save_enabled}
 | 
			
		||||
            type="button"
 | 
			
		||||
            on:click={submit}
 | 
			
		||||
            class="w-full 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:">{$_('save-changes')}</button>
 | 
			
		||||
        {/if}
 | 
			
		||||
      </span>
 | 
			
		||||
    </div>
 | 
			
		||||
    <!--  -->
 | 
			
		||||
    <div>
 | 
			
		||||
      <span
 | 
			
		||||
        class="font-medium text-gray-700">{$_('total-donation-amount')}:</span>
 | 
			
		||||
      <span>{(editable.donationAmount / 100)
 | 
			
		||||
          .toFixed(2)
 | 
			
		||||
          .toLocaleString('de-DE', { valute: 'EUR' })}€</span>
 | 
			
		||||
      <br />
 | 
			
		||||
      <span class="font-medium text-gray-700">{$_('donations')}:</span>
 | 
			
		||||
      {#if current_donations.filter((d) => d.donor.id == editable.id).length > 0}
 | 
			
		||||
        {#each current_donations.filter((o) => o.donor.id == editable.id) as d}
 | 
			
		||||
          {#if d.responseType === 'DISTANCEDONATION'}
 | 
			
		||||
            <a
 | 
			
		||||
              href="../donations/{d.id}"
 | 
			
		||||
              class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-blue-600 text-white mr-1">{d.runner.firstname}
 | 
			
		||||
              {d.runner.middlename}
 | 
			
		||||
              {d.runner.lastname}</a>
 | 
			
		||||
          {:else}
 | 
			
		||||
            <a
 | 
			
		||||
              href="../donations/{d.id}"
 | 
			
		||||
              class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-700 text-white mr-1">{$_('fixed-donation')}:
 | 
			
		||||
              {(d.amount / 100)
 | 
			
		||||
                .toFixed(2)
 | 
			
		||||
                .toLocaleString('de-DE', { valute: 'EUR' })}€</a>
 | 
			
		||||
          {/if}
 | 
			
		||||
        {/each}
 | 
			
		||||
      {:else}{$_('donor-has-no-associated-donations')}{/if}
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class=" w-full">
 | 
			
		||||
      <label
 | 
			
		||||
        for="firstname"
 | 
			
		||||
        class="font-medium text-gray-700">{$_('first-name')}</label>
 | 
			
		||||
      <input
 | 
			
		||||
        autocomplete="off"
 | 
			
		||||
        placeholder={$_('first-name')}
 | 
			
		||||
        type="text"
 | 
			
		||||
        class:border-red-500={!isFirstnameValid}
 | 
			
		||||
        class:focus:border-red-500={!isFirstnameValid}
 | 
			
		||||
        class:focus:ring-red-500={!isFirstnameValid}
 | 
			
		||||
        bind:value={editable.firstname}
 | 
			
		||||
        name="firstname"
 | 
			
		||||
        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md 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=" w-full">
 | 
			
		||||
      <label
 | 
			
		||||
        for="middlename"
 | 
			
		||||
        class="font-medium text-gray-700">{$_('middle-name')}</label>
 | 
			
		||||
      <input
 | 
			
		||||
        autocomplete="off"
 | 
			
		||||
        placeholder={$_('middle-name')}
 | 
			
		||||
        type="text"
 | 
			
		||||
        bind:value={editable.middlename}
 | 
			
		||||
        name="middlename"
 | 
			
		||||
        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm: border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class=" w-full">
 | 
			
		||||
      <label
 | 
			
		||||
        for="lastname"
 | 
			
		||||
        class="font-medium text-gray-700">{$_('last-name')}</label>
 | 
			
		||||
      <input
 | 
			
		||||
        autocomplete="off"
 | 
			
		||||
        placeholder={$_('last-name')}
 | 
			
		||||
        type="text"
 | 
			
		||||
        bind:value={editable.lastname}
 | 
			
		||||
        class:border-red-500={!isLastnameValid}
 | 
			
		||||
        class:focus:border-red-500={!isLastnameValid}
 | 
			
		||||
        class:focus:ring-red-500={!isLastnameValid}
 | 
			
		||||
        name="lastname"
 | 
			
		||||
        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md 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=" w-full">
 | 
			
		||||
      <label
 | 
			
		||||
        for="email"
 | 
			
		||||
        class="font-medium text-gray-700">{$_('e-mail-adress')}</label>
 | 
			
		||||
      <input
 | 
			
		||||
        autocomplete="off"
 | 
			
		||||
        placeholder={$_('e-mail-adress')}
 | 
			
		||||
        type="email"
 | 
			
		||||
        bind:value={editable.email}
 | 
			
		||||
        class:border-red-500={!isEmailValid}
 | 
			
		||||
        class:focus:border-red-500={!isEmailValid}
 | 
			
		||||
        class:focus:ring-red-500={!isEmailValid}
 | 
			
		||||
        name="email"
 | 
			
		||||
        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm: border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
 | 
			
		||||
      {#if !isEmailValid}
 | 
			
		||||
        <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 class=" w-full">
 | 
			
		||||
      <label for="phone" class="font-medium text-gray-700">{$_('phone')}</label>
 | 
			
		||||
      <input
 | 
			
		||||
        autocomplete="off"
 | 
			
		||||
        placeholder={$_('phone')}
 | 
			
		||||
        type="tel"
 | 
			
		||||
        class:border-red-500={!isPhoneValidOrEmpty}
 | 
			
		||||
        class:focus:border-red-500={!isPhoneValidOrEmpty}
 | 
			
		||||
        class:focus:ring-red-500={!isPhoneValidOrEmpty}
 | 
			
		||||
        bind:value={editable.phone}
 | 
			
		||||
        name="phone"
 | 
			
		||||
        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md 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">
 | 
			
		||||
          {$_('valid-international-phone-number-is-required')}
 | 
			
		||||
        </span>
 | 
			
		||||
      {/if}
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="flex items-start mt-2">
 | 
			
		||||
      <div class="flex items-center h-5">
 | 
			
		||||
        <input
 | 
			
		||||
          bind:checked={editable.address_checked}
 | 
			
		||||
          id="comments"
 | 
			
		||||
          name="comments"
 | 
			
		||||
          type="checkbox"
 | 
			
		||||
          class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="ml-3 ">
 | 
			
		||||
        <label
 | 
			
		||||
          for="comments"
 | 
			
		||||
          class="font-medium text-gray-700">{$_('receipt-needed')}</label>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
    {#if editable.address_checked === true}
 | 
			
		||||
      <div class="col-span-6">
 | 
			
		||||
        <label
 | 
			
		||||
          for="address1"
 | 
			
		||||
          class="block  font-medium text-gray-700">{$_('address')}</label>
 | 
			
		||||
        <input
 | 
			
		||||
          autocomplete="off"
 | 
			
		||||
          placeholder="Address"
 | 
			
		||||
          class:border-red-500={!isAddress1Valid}
 | 
			
		||||
          class:focus:border-red-500={!isAddress1Valid}
 | 
			
		||||
          class:focus:ring-red-500={!isAddress1Valid}
 | 
			
		||||
          bind:value={editable.address.address1}
 | 
			
		||||
          type="text"
 | 
			
		||||
          name="address1"
 | 
			
		||||
          class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm: border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
 | 
			
		||||
        {#if !isAddress1Valid}
 | 
			
		||||
          <span
 | 
			
		||||
            class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
 | 
			
		||||
            {$_('address-is-required')}
 | 
			
		||||
          </span>
 | 
			
		||||
        {/if}
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="col-span-6">
 | 
			
		||||
        <label
 | 
			
		||||
          for="address2"
 | 
			
		||||
          class="block  font-medium text-gray-700">{$_('apartment-suite-etc')}</label>
 | 
			
		||||
        <input
 | 
			
		||||
          autocomplete="off"
 | 
			
		||||
          placeholder={$_('apartment-suite-etc')}
 | 
			
		||||
          bind:value={editable.address.address2}
 | 
			
		||||
          type="text"
 | 
			
		||||
          name="address2"
 | 
			
		||||
          class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm: border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="col-span-6">
 | 
			
		||||
        <label
 | 
			
		||||
          for="zipcode"
 | 
			
		||||
          class="block  font-medium text-gray-700">{$_('zip-postal-code')}</label>
 | 
			
		||||
        <input
 | 
			
		||||
          autocomplete="off"
 | 
			
		||||
          placeholder={$_('zip-postal-code')}
 | 
			
		||||
          class:border-red-500={!iszipcodevalid}
 | 
			
		||||
          class:focus:border-red-500={!iszipcodevalid}
 | 
			
		||||
          class:focus:ring-red-500={!iszipcodevalid}
 | 
			
		||||
          bind:value={editable.address.postalcode}
 | 
			
		||||
          type="text"
 | 
			
		||||
          name="zipcode"
 | 
			
		||||
          class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm: border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
 | 
			
		||||
        {#if !iszipcodevalid}
 | 
			
		||||
          <span
 | 
			
		||||
            class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
 | 
			
		||||
            {$_('valid-zipcode-postal-code-is-required')}
 | 
			
		||||
          </span>
 | 
			
		||||
        {/if}
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="col-span-6">
 | 
			
		||||
        <label
 | 
			
		||||
          for="city"
 | 
			
		||||
          class="block  font-medium text-gray-700">{$_('city')}</label>
 | 
			
		||||
        <input
 | 
			
		||||
          autocomplete="off"
 | 
			
		||||
          placeholder={$_('city')}
 | 
			
		||||
          class:border-red-500={!iscityvalid}
 | 
			
		||||
          class:focus:border-red-500={!iscityvalid}
 | 
			
		||||
          class:focus:ring-red-500={!iscityvalid}
 | 
			
		||||
          bind:value={editable.address.city}
 | 
			
		||||
          type="text"
 | 
			
		||||
          name="city"
 | 
			
		||||
          class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm: border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
 | 
			
		||||
        {#if !iscityvalid}
 | 
			
		||||
          <span
 | 
			
		||||
            class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
 | 
			
		||||
            {$_('valid-city-is-required')}
 | 
			
		||||
          </span>
 | 
			
		||||
        {/if}
 | 
			
		||||
      </div>
 | 
			
		||||
    {/if}
 | 
			
		||||
  </section>
 | 
			
		||||
{:catch error}
 | 
			
		||||
  <PromiseError {error} />
 | 
			
		||||
{/await}
 | 
			
		||||
							
								
								
									
										29
									
								
								src/components/donors/Donors.svelte
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										29
									
								
								src/components/donors/Donors.svelte
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,29 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import store from "../../store";
 | 
			
		||||
  import AddDonorModal from "./AddDonorModal.svelte";
 | 
			
		||||
  import DonorsOverview from "./DonorsOverview.svelte";
 | 
			
		||||
  $: current_donors = [];
 | 
			
		||||
  export let modal_open = false;
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<section class="container p-5">
 | 
			
		||||
  <span class="mb-1 text-3xl font-extrabold leading-tight">
 | 
			
		||||
    {$_('donors')}
 | 
			
		||||
    {#if store.state.jwtinfo.userdetails.permissions.includes('DONOR: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">
 | 
			
		||||
        {$_('add-donor')}
 | 
			
		||||
      </button>
 | 
			
		||||
    {/if}
 | 
			
		||||
  </span>
 | 
			
		||||
  <DonorsOverview bind:current_donors />
 | 
			
		||||
</section>
 | 
			
		||||
 | 
			
		||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:CREATE')}
 | 
			
		||||
  <AddDonorModal bind:current_donors bind:modal_open />
 | 
			
		||||
{/if}
 | 
			
		||||
							
								
								
									
										12
									
								
								src/components/donors/DonorsEmptyState.svelte
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										12
									
								
								src/components/donors/DonorsEmptyState.svelte
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,12 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import donors_empty from "./donors_empty.svg";
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<div class="text-center items-center justify-center">
 | 
			
		||||
  <p class="mb-16 text-lg text-gray-500">
 | 
			
		||||
    <img class="w-full" style="height:15rem" src={donors_empty} alt="" />
 | 
			
		||||
    <span class="font-bold">{$_('there-are-no-donors-yet')}</span><br />
 | 
			
		||||
    <span>{$_('add-your-first-donor')}</span>
 | 
			
		||||
  </p>
 | 
			
		||||
</div>
 | 
			
		||||
							
								
								
									
										212
									
								
								src/components/donors/DonorsOverview.svelte
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										212
									
								
								src/components/donors/DonorsOverview.svelte
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,212 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { getLocaleFromNavigator, _ } from "svelte-i18n";
 | 
			
		||||
  import { DonationService, DonorService } from "@odit/lfk-client-js";
 | 
			
		||||
  import store from "../../store";
 | 
			
		||||
  import DonorsEmptyState from "./DonorsEmptyState.svelte";
 | 
			
		||||
  import ConfirmDonorDeletion from "./ConfirmDonorDeletion.svelte";
 | 
			
		||||
  import Toastify from "toastify-js";
 | 
			
		||||
  $: searchvalue = "";
 | 
			
		||||
  $: active_deletes = [];
 | 
			
		||||
  $: current_donations = [];
 | 
			
		||||
  let modal_open = false;
 | 
			
		||||
  let delete_donor = {};
 | 
			
		||||
  export let current_donors = [];
 | 
			
		||||
  const donors_promise = DonorService.donorControllerGetAll().then((val) => {
 | 
			
		||||
    current_donors = val;
 | 
			
		||||
  });
 | 
			
		||||
  const donation_promise = DonationService.donationControllerGetAll().then(
 | 
			
		||||
    (val) => {
 | 
			
		||||
      current_donations = val;
 | 
			
		||||
    }
 | 
			
		||||
  );
 | 
			
		||||
  function should_display_based_on_id(id) {
 | 
			
		||||
    if (searchvalue.toString().slice(-1) === "*") {
 | 
			
		||||
      return id.toString().startsWith(searchvalue.replace("*", ""));
 | 
			
		||||
    }
 | 
			
		||||
    return id.toString() === searchvalue;
 | 
			
		||||
  }
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<ConfirmDonorDeletion
 | 
			
		||||
  on:cancelDelete={(event) => {
 | 
			
		||||
    modal_open = false;
 | 
			
		||||
    active_deletes[event.detail.id] = false;
 | 
			
		||||
  }}
 | 
			
		||||
  bind:modal_open
 | 
			
		||||
  bind:delete_donor />
 | 
			
		||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:GET')}
 | 
			
		||||
  {#await donors_promise && donation_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">{$_('donors-are-being-loaded')}</p>
 | 
			
		||||
      <p class="text-sm">{$_('this-might-take-a-moment')}</p>
 | 
			
		||||
    </div>
 | 
			
		||||
  {:then}
 | 
			
		||||
    {#if current_donors.length === 0}
 | 
			
		||||
      <DonorsEmptyState />
 | 
			
		||||
    {: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">
 | 
			
		||||
                {$_('donations')}
 | 
			
		||||
              </th>
 | 
			
		||||
              <th
 | 
			
		||||
                scope="col"
 | 
			
		||||
                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
 | 
			
		||||
                {$_('total-donation-amount')}
 | 
			
		||||
              </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_donors as donor}
 | 
			
		||||
              {#if donor.firstname
 | 
			
		||||
                .toLowerCase()
 | 
			
		||||
                .includes(
 | 
			
		||||
                  searchvalue.toLowerCase()
 | 
			
		||||
                ) || donor.middlename
 | 
			
		||||
                  .toLowerCase()
 | 
			
		||||
                  .includes(
 | 
			
		||||
                    searchvalue.toLowerCase()
 | 
			
		||||
                  ) || donor.lastname
 | 
			
		||||
                  .toLowerCase()
 | 
			
		||||
                  .includes(
 | 
			
		||||
                    searchvalue.toLowerCase()
 | 
			
		||||
                  ) || should_display_based_on_id(donor.id)}
 | 
			
		||||
                <tr data-rowid="donor_{donor.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">
 | 
			
		||||
                          {donor.firstname}
 | 
			
		||||
                          {donor.middlename || ''}
 | 
			
		||||
                          {donor.lastname}
 | 
			
		||||
                        </div>
 | 
			
		||||
                      </div>
 | 
			
		||||
                    </div>
 | 
			
		||||
                  </td>
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    {#if donor.email}
 | 
			
		||||
                      <div class="text-sm text-gray-500">{donor.email}</div>
 | 
			
		||||
                    {/if}
 | 
			
		||||
                    {#if donor.phone}
 | 
			
		||||
                      <div class="text-sm text-gray-500">{donor.phone}</div>
 | 
			
		||||
                    {/if}
 | 
			
		||||
                    {#if donor.address.address1 !== null}
 | 
			
		||||
                      {donor.address.address1}<br />
 | 
			
		||||
                      {donor.address.address2 || ''}<br />
 | 
			
		||||
                      {donor.address.postalcode}
 | 
			
		||||
                      {donor.address.city}
 | 
			
		||||
                      {donor.address.country}
 | 
			
		||||
                    {/if}
 | 
			
		||||
                  </td>
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    {#if current_donations.filter((d) => d.donor.id == donor.id).length > 0}
 | 
			
		||||
                      {#each current_donations.filter((o) => o.donor.id == donor.id) as d}
 | 
			
		||||
                        {#if d.responseType === 'DISTANCEDONATION'}
 | 
			
		||||
                          <a
 | 
			
		||||
                            href="../donations/{d.id}"
 | 
			
		||||
                            class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-blue-600 text-white mr-1">{d.runner.firstname}
 | 
			
		||||
                            {d.runner.middlename}
 | 
			
		||||
                            {d.runner.lastname}</a>
 | 
			
		||||
                        {:else}
 | 
			
		||||
                          <a
 | 
			
		||||
                            href="../donations/{d.id}"
 | 
			
		||||
                            class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-700 text-white mr-1">{$_('fixed-donation')}:
 | 
			
		||||
                            {(d.amount / 100)
 | 
			
		||||
                              .toFixed(2)
 | 
			
		||||
                              .toLocaleString('de-DE', { valute: 'EUR' })}€</a>
 | 
			
		||||
                        {/if}
 | 
			
		||||
                      {/each}
 | 
			
		||||
                    {:else}{$_('donor-has-no-associated-donations')}{/if}
 | 
			
		||||
                  </td>
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    {(donor.donationAmount / 100)
 | 
			
		||||
                      .toFixed(2)
 | 
			
		||||
                      .toLocaleString('de-DE', { valute: 'EUR' })}€
 | 
			
		||||
                  </td>
 | 
			
		||||
                  {#if active_deletes[donor.id] === true}
 | 
			
		||||
                    <td
 | 
			
		||||
                      class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
 | 
			
		||||
                      <button
 | 
			
		||||
                        on:click={() => {
 | 
			
		||||
                          active_deletes[donor.id] = false;
 | 
			
		||||
                        }}
 | 
			
		||||
                        tabindex="0"
 | 
			
		||||
                        class="ml-4 text-indigo-600 hover:text-indigo-900 cursor-pointer">{$_('cancel-delete')}</button>
 | 
			
		||||
                      <button
 | 
			
		||||
                        on:click={() => {
 | 
			
		||||
                          DonorService.donorControllerRemove(donor.id, false)
 | 
			
		||||
                            .then((resp) => {
 | 
			
		||||
                              current_donors = current_donors.filter((obj) => obj.id !== donor.id);
 | 
			
		||||
                              Toastify({
 | 
			
		||||
                                text: 'Donor deleted',
 | 
			
		||||
                                duration: 500,
 | 
			
		||||
                                backgroundColor:
 | 
			
		||||
                                  'linear-gradient(to right, #00b09b, #96c93d)',
 | 
			
		||||
                              }).showToast();
 | 
			
		||||
                            })
 | 
			
		||||
                            .catch((err) => {
 | 
			
		||||
                              modal_open = true;
 | 
			
		||||
                              delete_donor = donor;
 | 
			
		||||
                            });
 | 
			
		||||
                        }}
 | 
			
		||||
                        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="./{donor.id}"
 | 
			
		||||
                        class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
 | 
			
		||||
                      {#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:DELETE')}
 | 
			
		||||
                        <button
 | 
			
		||||
                          on:click={() => {
 | 
			
		||||
                            active_deletes[donor.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}
 | 
			
		||||
							
								
								
									
										1
									
								
								src/components/donors/donors_empty.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										1
									
								
								src/components/donors/donors_empty.svg
									
									
									
									
									
										Normal file
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							| 
		 After Width: | Height: | Size: 40 KiB  | 
@@ -167,17 +167,17 @@
 | 
			
		||||
                  <div class="ml-3 text-sm">
 | 
			
		||||
                    <label
 | 
			
		||||
                      for="comments"
 | 
			
		||||
                      class="font-medium text-gray-700">Address</label>
 | 
			
		||||
                      class="font-medium text-gray-700">{$_('address')}</label>
 | 
			
		||||
                  </div>
 | 
			
		||||
                </div>
 | 
			
		||||
              {#if address_checked === true}
 | 
			
		||||
                <div class="col-span-6">
 | 
			
		||||
                  <label
 | 
			
		||||
                    for="address1"
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">Address</label>
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">{$_('address')}</label>
 | 
			
		||||
                  <input
 | 
			
		||||
                    autocomplete="off"
 | 
			
		||||
                    placeholder="Address"
 | 
			
		||||
                    placeholder="{$_('address')}"
 | 
			
		||||
                    class:border-red-500={!isAddress1Valid}
 | 
			
		||||
                    class:focus:border-red-500={!isAddress1Valid}
 | 
			
		||||
                    class:focus:ring-red-500={!isAddress1Valid}
 | 
			
		||||
@@ -189,18 +189,17 @@
 | 
			
		||||
                  {#if !isAddress1Valid}
 | 
			
		||||
                    <span
 | 
			
		||||
                      class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
 | 
			
		||||
                      Address is required
 | 
			
		||||
                      {$_('address-is-required')}
 | 
			
		||||
                    </span>
 | 
			
		||||
                  {/if}
 | 
			
		||||
                </div>
 | 
			
		||||
                <div class="col-span-6">
 | 
			
		||||
                  <label
 | 
			
		||||
                    for="address2"
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">Apartment,
 | 
			
		||||
                    suite, etc.</label>
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">{$_('apartment-suite-etc')}</label>
 | 
			
		||||
                  <input
 | 
			
		||||
                    autocomplete="off"
 | 
			
		||||
                    placeholder="Apartment, suite, etc."
 | 
			
		||||
                    placeholder="{$_('apartment-suite-etc')}"
 | 
			
		||||
                    bind:value={address_input2_value}
 | 
			
		||||
                    bind:this={address_input2}
 | 
			
		||||
                    type="text"
 | 
			
		||||
@@ -210,11 +209,10 @@
 | 
			
		||||
                <div class="col-span-6">
 | 
			
		||||
                  <label
 | 
			
		||||
                    for="zipcode"
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">ZIP/ postal
 | 
			
		||||
                    code</label>
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">{$_('zip-postal-code')}</label>
 | 
			
		||||
                  <input
 | 
			
		||||
                    autocomplete="off"
 | 
			
		||||
                    placeholder="ZIP/ postal code"
 | 
			
		||||
                    placeholder="{$_('zip-postal-code')}"
 | 
			
		||||
                    class:border-red-500={!iszipcodevalid}
 | 
			
		||||
                    class:focus:border-red-500={!iszipcodevalid}
 | 
			
		||||
                    class:focus:ring-red-500={!iszipcodevalid}
 | 
			
		||||
@@ -226,17 +224,17 @@
 | 
			
		||||
                  {#if !iszipcodevalid}
 | 
			
		||||
                    <span
 | 
			
		||||
                      class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
 | 
			
		||||
                      Valid zipcode/ postal code is required
 | 
			
		||||
                      {$_('valid-zipcode-postal-code-is-required')}
 | 
			
		||||
                    </span>
 | 
			
		||||
                  {/if}
 | 
			
		||||
                </div>
 | 
			
		||||
                <div class="col-span-6">
 | 
			
		||||
                  <label
 | 
			
		||||
                    for="city"
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">City</label>
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">{$_('city')}</label>
 | 
			
		||||
                  <input
 | 
			
		||||
                    autocomplete="off"
 | 
			
		||||
                    placeholder="City"
 | 
			
		||||
                    placeholder="{$_('city')}"
 | 
			
		||||
                    class:border-red-500={!iscityvalid}
 | 
			
		||||
                    class:focus:border-red-500={!iscityvalid}
 | 
			
		||||
                    class:focus:ring-red-500={!iscityvalid}
 | 
			
		||||
@@ -248,7 +246,7 @@
 | 
			
		||||
                  {#if !iscityvalid}
 | 
			
		||||
                    <span
 | 
			
		||||
                      class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
 | 
			
		||||
                      Valid city is required
 | 
			
		||||
                      {$_('valid-city-is-required')}
 | 
			
		||||
                    </span>
 | 
			
		||||
                  {/if}
 | 
			
		||||
                </div>
 | 
			
		||||
 
 | 
			
		||||
@@ -3,7 +3,7 @@
 | 
			
		||||
    GroupContactService,
 | 
			
		||||
    RunnerOrganizationService,
 | 
			
		||||
  } from "@odit/lfk-client-js";
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import { getLocaleFromNavigator, _ } from "svelte-i18n";
 | 
			
		||||
  import Toastify from "toastify-js";
 | 
			
		||||
  import store from "../../store";
 | 
			
		||||
  import ConfirmOrgDeletion from "./ConfirmOrgDeletion.svelte";
 | 
			
		||||
@@ -35,14 +35,14 @@
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
    value.address_checked = value.address.address1 !== null;
 | 
			
		||||
    if(value.address_checked===false){
 | 
			
		||||
    if (value.address_checked === false) {
 | 
			
		||||
      value.address = {
 | 
			
		||||
        address1: "",
 | 
			
		||||
        address2: "",
 | 
			
		||||
        city: "",
 | 
			
		||||
        postalcode: "",
 | 
			
		||||
        country: ""
 | 
			
		||||
      }
 | 
			
		||||
        country: "",
 | 
			
		||||
      };
 | 
			
		||||
    }
 | 
			
		||||
    editable = Object.assign(editable, value);
 | 
			
		||||
    editable = editable;
 | 
			
		||||
@@ -82,7 +82,6 @@
 | 
			
		||||
      if (postdata.address_checked === false) {
 | 
			
		||||
        postdata.address = null;
 | 
			
		||||
      }
 | 
			
		||||
      console.log(postdata)
 | 
			
		||||
      postdata.contact = postdata.contact === "null" ? null : postdata.contact;
 | 
			
		||||
      RunnerOrganizationService.runnerOrganizationControllerPut(
 | 
			
		||||
        original_object.id,
 | 
			
		||||
@@ -119,6 +118,57 @@
 | 
			
		||||
    <div class="mb-8 text-3xl font-extrabold leading-tight">
 | 
			
		||||
      {original_object.name}
 | 
			
		||||
      <span data-id="org_actions_${editable.id}">
 | 
			
		||||
        <button
 | 
			
		||||
          on:click={async () => {
 | 
			
		||||
            const locale = getLocaleFromNavigator();
 | 
			
		||||
            const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(original_object.id);
 | 
			
		||||
            const toast = Toastify({
 | 
			
		||||
              text: $_('generating-pdf'),
 | 
			
		||||
              duration: -1,
 | 
			
		||||
            }).showToast();
 | 
			
		||||
            fetch(
 | 
			
		||||
              `https://dev.lauf-fuer-kaya.de/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
 | 
			
		||||
              {
 | 
			
		||||
                method: 'POST',
 | 
			
		||||
                headers: {
 | 
			
		||||
                  'Content-Type': 'application/json',
 | 
			
		||||
                },
 | 
			
		||||
                body: JSON.stringify(runners),
 | 
			
		||||
              }
 | 
			
		||||
            )
 | 
			
		||||
              .then((response) => {
 | 
			
		||||
                if (response.status != '200') {
 | 
			
		||||
                  toast.hideToast();
 | 
			
		||||
                  Toastify({
 | 
			
		||||
                    text: $_('pdf-generation-failed'),
 | 
			
		||||
                    duration: 3500,
 | 
			
		||||
                    backgroundColor:
 | 
			
		||||
                      'linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)',
 | 
			
		||||
                  }).showToast();
 | 
			
		||||
                } else {
 | 
			
		||||
                  return response.blob();
 | 
			
		||||
                }
 | 
			
		||||
              })
 | 
			
		||||
              .then((blob) => {
 | 
			
		||||
                const url = window.URL.createObjectURL(blob);
 | 
			
		||||
                let a = document.createElement('a');
 | 
			
		||||
                a.href = url;
 | 
			
		||||
                a.download = 'Sponsorings_' + original_object.name + '.pdf';
 | 
			
		||||
                document.body.appendChild(a);
 | 
			
		||||
                a.click();
 | 
			
		||||
                a.remove();
 | 
			
		||||
                toast.hideToast();
 | 
			
		||||
                Toastify({
 | 
			
		||||
                  text: $_('pdf-successfully-generated'),
 | 
			
		||||
                  duration: 3500,
 | 
			
		||||
                  backgroundColor:
 | 
			
		||||
                    'linear-gradient(to right, #00b09b, #96c93d)',
 | 
			
		||||
                }).showToast();
 | 
			
		||||
              })
 | 
			
		||||
              .catch((err) => {});
 | 
			
		||||
          }}
 | 
			
		||||
          type="button"
 | 
			
		||||
          class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('generate-sponsoring-contracts')}</button>
 | 
			
		||||
        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:IMPORT')}
 | 
			
		||||
          <button
 | 
			
		||||
            on:click={() => {
 | 
			
		||||
 
 | 
			
		||||
@@ -1,5 +1,5 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import { getLocaleFromNavigator, _ } from "svelte-i18n";
 | 
			
		||||
  let modal_open = false;
 | 
			
		||||
  let delete_org = {};
 | 
			
		||||
  import { RunnerOrganizationService } from "@odit/lfk-client-js";
 | 
			
		||||
@@ -43,11 +43,91 @@
 | 
			
		||||
        placeholder={$_('datatable.search')}
 | 
			
		||||
        aria-label={$_('datatable.search')}
 | 
			
		||||
        class="gridjs-input gridjs-search-input mb-4" />
 | 
			
		||||
      <div class="h-12">
 | 
			
		||||
        {#if current_organizations.some((r) => r.is_selected === true)}
 | 
			
		||||
          <button
 | 
			
		||||
            on:click={async () => {
 | 
			
		||||
              const locale = getLocaleFromNavigator();
 | 
			
		||||
              const orgs = current_organizations.filter((r) => r.is_selected === true);
 | 
			
		||||
              const toast = Toastify({
 | 
			
		||||
                text: $_('generating-pdfs'),
 | 
			
		||||
                duration: -1,
 | 
			
		||||
              }).showToast();
 | 
			
		||||
              let count = 0;
 | 
			
		||||
              for await (const o of orgs) {
 | 
			
		||||
                const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(o.id);
 | 
			
		||||
                fetch(
 | 
			
		||||
                  `https://dev.lauf-fuer-kaya.de/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
 | 
			
		||||
                  {
 | 
			
		||||
                    method: 'POST',
 | 
			
		||||
                    headers: {
 | 
			
		||||
                      'Content-Type': 'application/json',
 | 
			
		||||
                    },
 | 
			
		||||
                    body: JSON.stringify(runners),
 | 
			
		||||
                  }
 | 
			
		||||
                )
 | 
			
		||||
                  .then((response) => {
 | 
			
		||||
                    if (response.status != '200') {
 | 
			
		||||
                      toast.hideToast();
 | 
			
		||||
                      Toastify({
 | 
			
		||||
                        text: $_('pdf-generation-failed'),
 | 
			
		||||
                        duration: 3500,
 | 
			
		||||
                        backgroundColor:
 | 
			
		||||
                          'linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)',
 | 
			
		||||
                      }).showToast();
 | 
			
		||||
                    } else {
 | 
			
		||||
                      return response.blob();
 | 
			
		||||
                    }
 | 
			
		||||
                  })
 | 
			
		||||
                  .then((blob) => {
 | 
			
		||||
                    count++;
 | 
			
		||||
                    const url = window.URL.createObjectURL(blob);
 | 
			
		||||
                    let a = document.createElement('a');
 | 
			
		||||
                    a.href = url;
 | 
			
		||||
                    a.download = 'Sponsorings_' + o.name + '.pdf';
 | 
			
		||||
                    document.body.appendChild(a);
 | 
			
		||||
                    a.click();
 | 
			
		||||
                    a.remove();
 | 
			
		||||
                    if (count === orgs.length) {
 | 
			
		||||
                      toast.hideToast();
 | 
			
		||||
                      Toastify({
 | 
			
		||||
                        text: $_('pdfs-successfully-generated'),
 | 
			
		||||
                        duration: 3500,
 | 
			
		||||
                        backgroundColor:
 | 
			
		||||
                          'linear-gradient(to right, #00b09b, #96c93d)',
 | 
			
		||||
                      }).showToast();
 | 
			
		||||
                    }
 | 
			
		||||
                  })
 | 
			
		||||
                  .catch((err) => {});
 | 
			
		||||
              }
 | 
			
		||||
            }}
 | 
			
		||||
            type="button"
 | 
			
		||||
            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:w-auto sm:text-sm">
 | 
			
		||||
            {$_('generate-sponsoring-contracts')}
 | 
			
		||||
          </button>
 | 
			
		||||
        {/if}
 | 
			
		||||
      </div>
 | 
			
		||||
      <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">
 | 
			
		||||
                <span
 | 
			
		||||
                  on:click={() => {
 | 
			
		||||
                    const newstate = !current_organizations.some((r) => r.is_selected === true);
 | 
			
		||||
                    current_organizations = current_organizations.map((r) => {
 | 
			
		||||
                      r.is_selected = newstate;
 | 
			
		||||
                      return r;
 | 
			
		||||
                    });
 | 
			
		||||
                  }}
 | 
			
		||||
                  class="underline cursor-pointer select-none">{#if current_organizations.some((r) => r.is_selected === true)}
 | 
			
		||||
                    {$_('deselect-all')}
 | 
			
		||||
                  {:else}{$_('select-all')}{/if}
 | 
			
		||||
                </span>
 | 
			
		||||
              </th>
 | 
			
		||||
              <th
 | 
			
		||||
                scope="col"
 | 
			
		||||
                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
 | 
			
		||||
@@ -75,6 +155,12 @@
 | 
			
		||||
                .toLowerCase()
 | 
			
		||||
                .includes(searchvalue)}
 | 
			
		||||
                <tr data-rowid="org_{o.id}">
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    <input
 | 
			
		||||
                      bind:checked={o.is_selected}
 | 
			
		||||
                      type="checkbox"
 | 
			
		||||
                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
 | 
			
		||||
                  </td>
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    <div class="flex items-center">
 | 
			
		||||
                      <div class="ml-4">
 | 
			
		||||
@@ -148,7 +234,7 @@
 | 
			
		||||
                      class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
 | 
			
		||||
                      <a
 | 
			
		||||
                        href="./{o.id}"
 | 
			
		||||
                        class="text-indigo-600 hover:text-indigo-900">{$_('edit')}</a>
 | 
			
		||||
                        class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
 | 
			
		||||
                      {#if store.state.jwtinfo.userdetails.permissions.includes('ORGANIZATION:DELETE')}
 | 
			
		||||
                        <button
 | 
			
		||||
                          on:click={() => {
 | 
			
		||||
 
 | 
			
		||||
@@ -203,10 +203,10 @@
 | 
			
		||||
                <div class="col-span-6">
 | 
			
		||||
                  <label
 | 
			
		||||
                    for="lastname"
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">Last Name</label>
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">{$_('last-name')}</label>
 | 
			
		||||
                  <input
 | 
			
		||||
                    autocomplete="off"
 | 
			
		||||
                    placeholder="Last Name"
 | 
			
		||||
                    placeholder="{$_('last-name')}"
 | 
			
		||||
                    class:border-red-500={!isLastnameValid}
 | 
			
		||||
                    class:focus:border-red-500={!isLastnameValid}
 | 
			
		||||
                    class:focus:ring-red-500={!isLastnameValid}
 | 
			
		||||
@@ -245,10 +245,10 @@
 | 
			
		||||
                <div class="col-span-6">
 | 
			
		||||
                  <label
 | 
			
		||||
                    for="phone"
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">Phone</label>
 | 
			
		||||
                    class="block text-sm font-medium text-gray-700">{$_('phone')}</label>
 | 
			
		||||
                  <input
 | 
			
		||||
                    autocomplete="off"
 | 
			
		||||
                    placeholder="Phone"
 | 
			
		||||
                    placeholder="{$_('phone')}"
 | 
			
		||||
                    class:border-red-500={!isPhoneValidOrEmpty}
 | 
			
		||||
                    class:focus:border-red-500={!isPhoneValidOrEmpty}
 | 
			
		||||
                    class:focus:ring-red-500={!isPhoneValidOrEmpty}
 | 
			
		||||
 
 | 
			
		||||
@@ -20,6 +20,7 @@
 | 
			
		||||
  $: searchvalue = "";
 | 
			
		||||
  const dispatch = createEventDispatcher();
 | 
			
		||||
  function cancelModal() {
 | 
			
		||||
    json_output = [];
 | 
			
		||||
    import_modal_open = false;
 | 
			
		||||
    dispatch("cancel");
 | 
			
		||||
  }
 | 
			
		||||
@@ -37,10 +38,19 @@
 | 
			
		||||
  let orgs = [];
 | 
			
		||||
  RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
 | 
			
		||||
    orgs = val;
 | 
			
		||||
    if(opened_from === 'OrgOverview'){
 | 
			
		||||
    selected_org = orgs[0].id
 | 
			
		||||
  }
 | 
			
		||||
  });
 | 
			
		||||
  let teams = [];
 | 
			
		||||
  RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
 | 
			
		||||
    teams = val;
 | 
			
		||||
    if (opened_from === "RunnerOverview" && teams.length>0) {
 | 
			
		||||
      selected_org_or_team = "TEAM_" + teams[0].id;
 | 
			
		||||
    }
 | 
			
		||||
    if(teams.length==0 && orgs.length>0){
 | 
			
		||||
      selected_org_or_team = "ORG_" + orgs[0].id
 | 
			
		||||
    }
 | 
			
		||||
  });
 | 
			
		||||
  let selected_org;
 | 
			
		||||
  $: selected_org_or_team = "";
 | 
			
		||||
@@ -347,7 +357,6 @@
 | 
			
		||||
                </button>
 | 
			
		||||
                <button
 | 
			
		||||
                  on:click={() => {
 | 
			
		||||
                    json_output = [];
 | 
			
		||||
                    cancelModal();
 | 
			
		||||
                  }}
 | 
			
		||||
                  type="button"
 | 
			
		||||
 
 | 
			
		||||
@@ -1,5 +1,5 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import { getLocaleFromNavigator, _ } from "svelte-i18n";
 | 
			
		||||
  import lodashIsEqual from "lodash.isequal";
 | 
			
		||||
  import store from "../../store";
 | 
			
		||||
  import {
 | 
			
		||||
@@ -14,6 +14,7 @@
 | 
			
		||||
  export let params;
 | 
			
		||||
  const runner_promise = RunnerService.runnerControllerGetOne(params.runnerid);
 | 
			
		||||
  $: delete_triggered = false;
 | 
			
		||||
  $: original_data_pdf = {};
 | 
			
		||||
  $: original_data = {};
 | 
			
		||||
  $: editable = {};
 | 
			
		||||
  $: changes_performed = !lodashIsEqual(original_data, editable);
 | 
			
		||||
@@ -26,6 +27,7 @@
 | 
			
		||||
    changes_performed && isFirstnameValid && isLastnameValid && isEmailValid;
 | 
			
		||||
  runner_promise.then((data) => {
 | 
			
		||||
    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);
 | 
			
		||||
@@ -130,6 +132,58 @@
 | 
			
		||||
              }}
 | 
			
		||||
              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:text-sm">{$_('cancel')}</button>
 | 
			
		||||
          {/if}
 | 
			
		||||
          <button
 | 
			
		||||
            on:click={() => {
 | 
			
		||||
              const locale = getLocaleFromNavigator();
 | 
			
		||||
              const toast = Toastify({
 | 
			
		||||
                text: $_('generating-pdf'),
 | 
			
		||||
                duration: -1,
 | 
			
		||||
              }).showToast();
 | 
			
		||||
              fetch(
 | 
			
		||||
                `https://dev.lauf-fuer-kaya.de/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
 | 
			
		||||
                {
 | 
			
		||||
                  method: 'POST',
 | 
			
		||||
                  headers: {
 | 
			
		||||
                    'Content-Type': 'application/json',
 | 
			
		||||
                  },
 | 
			
		||||
                  body: JSON.stringify([original_data_pdf]),
 | 
			
		||||
                }
 | 
			
		||||
              )
 | 
			
		||||
                .then((response) => {
 | 
			
		||||
                  if (response.status != '200') {
 | 
			
		||||
                    toast.hideToast();
 | 
			
		||||
                    Toastify({
 | 
			
		||||
                      text: $_('pdf-generation-failed'),
 | 
			
		||||
                      duration: 3500,
 | 
			
		||||
                      backgroundColor:
 | 
			
		||||
                        'linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)',
 | 
			
		||||
                    }).showToast();
 | 
			
		||||
                  } else {
 | 
			
		||||
                    return response.blob();
 | 
			
		||||
                  }
 | 
			
		||||
                })
 | 
			
		||||
                .then((blob) => {
 | 
			
		||||
                  const url = window.URL.createObjectURL(blob);
 | 
			
		||||
                  let a = document.createElement('a');
 | 
			
		||||
                  a.href = url;
 | 
			
		||||
                  a.download = 'Sponsoring_' + original_data.firstname + (original_data.middlename || '') + original_data.lastname + '.pdf';
 | 
			
		||||
                  document.body.appendChild(a);
 | 
			
		||||
                  a.click();
 | 
			
		||||
                  a.remove();
 | 
			
		||||
                  toast.hideToast();
 | 
			
		||||
                  Toastify({
 | 
			
		||||
                    text: $_('pdf-successfully-generated'),
 | 
			
		||||
                    duration: 3500,
 | 
			
		||||
                    backgroundColor:
 | 
			
		||||
                      'linear-gradient(to right, #00b09b, #96c93d)',
 | 
			
		||||
                  }).showToast();
 | 
			
		||||
                })
 | 
			
		||||
                .catch((err) => {
 | 
			
		||||
                  console.error(err);
 | 
			
		||||
                });
 | 
			
		||||
            }}
 | 
			
		||||
            type="button"
 | 
			
		||||
            class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('generate-sponsoring-contract')}</button>
 | 
			
		||||
          {#if !delete_triggered}
 | 
			
		||||
            <button
 | 
			
		||||
              on:click={() => {
 | 
			
		||||
 
 | 
			
		||||
@@ -27,7 +27,7 @@
 | 
			
		||||
        }}
 | 
			
		||||
        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">
 | 
			
		||||
        {$_('laeufer-importieren')}
 | 
			
		||||
        {$_('import-runners')}
 | 
			
		||||
      </button>
 | 
			
		||||
    {/if}
 | 
			
		||||
  </span>
 | 
			
		||||
 
 | 
			
		||||
@@ -1,5 +1,5 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import { getLocaleFromNavigator, _ } from "svelte-i18n";
 | 
			
		||||
  import {
 | 
			
		||||
    RunnerService,
 | 
			
		||||
    RunnerTeamService,
 | 
			
		||||
@@ -8,6 +8,7 @@
 | 
			
		||||
  import store from "../../store";
 | 
			
		||||
  import RunnersEmptyState from "./RunnersEmptyState.svelte";
 | 
			
		||||
  import Select from "svelte-select";
 | 
			
		||||
  import Toastify from "toastify-js";
 | 
			
		||||
  $: searchvalue = "";
 | 
			
		||||
  $: active_deletes = [];
 | 
			
		||||
  export let current_runners = [];
 | 
			
		||||
@@ -61,7 +62,7 @@
 | 
			
		||||
        placeholder={$_('datatable.search')}
 | 
			
		||||
        aria-label={$_('datatable.search')}
 | 
			
		||||
        class="gridjs-input gridjs-search-input mb-4" />
 | 
			
		||||
      <div class="block mb-1">
 | 
			
		||||
      <div class="block mb-6">
 | 
			
		||||
        <label
 | 
			
		||||
          for="country"
 | 
			
		||||
          class="text-sm font-medium text-gray-700">{$_('filter-by-organization-team')}</label>
 | 
			
		||||
@@ -75,11 +76,87 @@
 | 
			
		||||
          items={selectgroups}
 | 
			
		||||
          isMulti={true} />
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="h-12">
 | 
			
		||||
        {#if current_runners.some((r) => r.is_selected === true)}
 | 
			
		||||
          <button
 | 
			
		||||
            on:click={() => {
 | 
			
		||||
              const locale = getLocaleFromNavigator();
 | 
			
		||||
              const toast = Toastify({
 | 
			
		||||
                text: $_('generating-pdf'),
 | 
			
		||||
                duration: -1,
 | 
			
		||||
              }).showToast();
 | 
			
		||||
              fetch(
 | 
			
		||||
                `https://dev.lauf-fuer-kaya.de/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
 | 
			
		||||
                {
 | 
			
		||||
                  method: 'POST',
 | 
			
		||||
                  headers: {
 | 
			
		||||
                    'Content-Type': 'application/json',
 | 
			
		||||
                  },
 | 
			
		||||
                  body: JSON.stringify(
 | 
			
		||||
                    current_runners.filter((r) => r.is_selected === true)
 | 
			
		||||
                  ),
 | 
			
		||||
                }
 | 
			
		||||
              )
 | 
			
		||||
                .then((response) => {
 | 
			
		||||
                  if (response.status != '200') {
 | 
			
		||||
                    toast.hideToast();
 | 
			
		||||
                    Toastify({
 | 
			
		||||
                      text: $_('pdf-generation-failed'),
 | 
			
		||||
                      duration: 3500,
 | 
			
		||||
                      backgroundColor:
 | 
			
		||||
                        'linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)',
 | 
			
		||||
                    }).showToast();
 | 
			
		||||
                  } else {
 | 
			
		||||
                    return response.blob();
 | 
			
		||||
                  }
 | 
			
		||||
                })
 | 
			
		||||
                .then((blob) => {
 | 
			
		||||
                  const url = window.URL.createObjectURL(blob);
 | 
			
		||||
                  let a = document.createElement('a');
 | 
			
		||||
                  a.href = url;
 | 
			
		||||
                  a.download = 'Sponsoring.pdf';
 | 
			
		||||
                  document.body.appendChild(a);
 | 
			
		||||
                  a.click();
 | 
			
		||||
                  a.remove();
 | 
			
		||||
                  toast.hideToast();
 | 
			
		||||
                  Toastify({
 | 
			
		||||
                    text: $_('pdf-successfully-generated'),
 | 
			
		||||
                    duration: 3500,
 | 
			
		||||
                    backgroundColor:
 | 
			
		||||
                      'linear-gradient(to right, #00b09b, #96c93d)',
 | 
			
		||||
                  }).showToast();
 | 
			
		||||
                })
 | 
			
		||||
                .catch((err) => {
 | 
			
		||||
                  console.error(err);
 | 
			
		||||
                });
 | 
			
		||||
            }}
 | 
			
		||||
            type="button"
 | 
			
		||||
            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:w-auto sm:text-sm">
 | 
			
		||||
            {$_('generate-sponsoring-contracts')}
 | 
			
		||||
          </button>
 | 
			
		||||
        {/if}
 | 
			
		||||
      </div>
 | 
			
		||||
      <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">
 | 
			
		||||
                <span
 | 
			
		||||
                  on:click={() => {
 | 
			
		||||
                    const newstate = !current_runners.some((r) => r.is_selected === true);
 | 
			
		||||
                    current_runners = current_runners.map((r) => {
 | 
			
		||||
                      r.is_selected = newstate;
 | 
			
		||||
                      return r;
 | 
			
		||||
                    });
 | 
			
		||||
                  }}
 | 
			
		||||
                  class="underline cursor-pointer select-none">{#if current_runners.some((r) => r.is_selected === true)}
 | 
			
		||||
                    {$_('deselect-all')}
 | 
			
		||||
                  {:else}{$_('select-all')}{/if}
 | 
			
		||||
                </span>
 | 
			
		||||
              </th>
 | 
			
		||||
              <th
 | 
			
		||||
                scope="col"
 | 
			
		||||
                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
 | 
			
		||||
@@ -124,6 +201,12 @@
 | 
			
		||||
                  <tr
 | 
			
		||||
                    data-rowid="user_{runner.id}"
 | 
			
		||||
                    data-groupid={runner.group.id}>
 | 
			
		||||
                    <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                      <input
 | 
			
		||||
                        bind:checked={runner.is_selected}
 | 
			
		||||
                        type="checkbox"
 | 
			
		||||
                        class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
 | 
			
		||||
                    </td>
 | 
			
		||||
                    <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                      <div class="flex items-center">
 | 
			
		||||
                        <div class="ml-4">
 | 
			
		||||
@@ -135,63 +218,62 @@
 | 
			
		||||
                        </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}
 | 
			
		||||
                    {#if runner.address.address1 !== null}
 | 
			
		||||
                      {runner.address.address1}<br />
 | 
			
		||||
                      {runner.address.address2 || ''}<br />
 | 
			
		||||
                      {runner.address.postalcode}
 | 
			
		||||
                      {runner.address.city}
 | 
			
		||||
                      {runner.address.country}
 | 
			
		||||
                    {/if}
 | 
			
		||||
                  </td>
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    {#if runner.group.responseType === 'RUNNERTEAM'}
 | 
			
		||||
                      <a
 | 
			
		||||
                        href="../teams/{runner.group.id}"
 | 
			
		||||
                        class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
 | 
			
		||||
                    {/if}
 | 
			
		||||
                    {#if runner.group.responseType === 'RUNNERORGANIZATION'}
 | 
			
		||||
                      <a
 | 
			
		||||
                        href="../orgs/{runner.group.id}"
 | 
			
		||||
                        class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
 | 
			
		||||
                    {/if}
 | 
			
		||||
                  </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 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}
 | 
			
		||||
                      {#if runner.address.address1 !== null}
 | 
			
		||||
                        {runner.address.address1}<br />
 | 
			
		||||
                        {runner.address.address2 || ''}<br />
 | 
			
		||||
                        {runner.address.postalcode}
 | 
			
		||||
                        {runner.address.city}
 | 
			
		||||
                        {runner.address.country}
 | 
			
		||||
                      {/if}
 | 
			
		||||
                    </td>
 | 
			
		||||
                    <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                      {#if runner.group.responseType === 'RUNNERTEAM'}
 | 
			
		||||
                        <a
 | 
			
		||||
                          href="../teams/{runner.group.id}"
 | 
			
		||||
                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
 | 
			
		||||
                      {/if}
 | 
			
		||||
                      {#if runner.group.responseType === 'RUNNERORGANIZATION'}
 | 
			
		||||
                        <a
 | 
			
		||||
                          href="../orgs/{runner.group.id}"
 | 
			
		||||
                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
 | 
			
		||||
                      {/if}
 | 
			
		||||
                    </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) => {});
 | 
			
		||||
                          }}
 | 
			
		||||
                          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>
 | 
			
		||||
                          class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
 | 
			
		||||
                        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
 | 
			
		||||
                          <button
 | 
			
		||||
                            on:click={() => {
 | 
			
		||||
 
 | 
			
		||||
@@ -4,7 +4,7 @@
 | 
			
		||||
    RunnerOrganizationService,
 | 
			
		||||
    RunnerTeamService,
 | 
			
		||||
  } from "@odit/lfk-client-js";
 | 
			
		||||
  import { _ } from "svelte-i18n";
 | 
			
		||||
  import { getLocaleFromNavigator, _ } from "svelte-i18n";
 | 
			
		||||
  import Toastify from "toastify-js";
 | 
			
		||||
  import store from "../../store";
 | 
			
		||||
  import ImportRunnerModal from "../runners/ImportRunnerModal.svelte";
 | 
			
		||||
@@ -100,6 +100,57 @@
 | 
			
		||||
    <div class="mb-8 text-3xl font-extrabold leading-tight">
 | 
			
		||||
      {original.name}
 | 
			
		||||
      <span data-id="org_actions_${teamdata.id}">
 | 
			
		||||
        <button
 | 
			
		||||
          on:click={async () => {
 | 
			
		||||
            const locale = getLocaleFromNavigator();
 | 
			
		||||
            const runners = await RunnerTeamService.runnerTeamControllerGetRunners(teamdata.id);
 | 
			
		||||
            const toast = Toastify({
 | 
			
		||||
              text: $_('generating-pdf'),
 | 
			
		||||
              duration: -1,
 | 
			
		||||
            }).showToast();
 | 
			
		||||
            fetch(
 | 
			
		||||
              `https://dev.lauf-fuer-kaya.de/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
 | 
			
		||||
              {
 | 
			
		||||
                method: 'POST',
 | 
			
		||||
                headers: {
 | 
			
		||||
                  'Content-Type': 'application/json',
 | 
			
		||||
                },
 | 
			
		||||
                body: JSON.stringify(runners),
 | 
			
		||||
              }
 | 
			
		||||
            )
 | 
			
		||||
              .then((response) => {
 | 
			
		||||
                if (response.status != '200') {
 | 
			
		||||
                  toast.hideToast();
 | 
			
		||||
                  Toastify({
 | 
			
		||||
                    text: $_('pdf-generation-failed'),
 | 
			
		||||
                    duration: 3500,
 | 
			
		||||
                    backgroundColor:
 | 
			
		||||
                      'linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)',
 | 
			
		||||
                  }).showToast();
 | 
			
		||||
                } else {
 | 
			
		||||
                  return response.blob();
 | 
			
		||||
                }
 | 
			
		||||
              })
 | 
			
		||||
              .then((blob) => {
 | 
			
		||||
                const url = window.URL.createObjectURL(blob);
 | 
			
		||||
                let a = document.createElement('a');
 | 
			
		||||
                a.href = url;
 | 
			
		||||
                a.download = 'Sponsorings_' + teamdata.name + '.pdf';
 | 
			
		||||
                document.body.appendChild(a);
 | 
			
		||||
                a.click();
 | 
			
		||||
                a.remove();
 | 
			
		||||
                toast.hideToast();
 | 
			
		||||
                Toastify({
 | 
			
		||||
                  text: $_('pdf-successfully-generated'),
 | 
			
		||||
                  duration: 3500,
 | 
			
		||||
                  backgroundColor:
 | 
			
		||||
                    'linear-gradient(to right, #00b09b, #96c93d)',
 | 
			
		||||
                }).showToast();
 | 
			
		||||
              })
 | 
			
		||||
              .catch((err) => {});
 | 
			
		||||
          }}
 | 
			
		||||
          type="button"
 | 
			
		||||
          class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('generate-sponsoring-contracts')}</button>
 | 
			
		||||
        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:IMPORT')}
 | 
			
		||||
          <button
 | 
			
		||||
            on:click={() => {
 | 
			
		||||
@@ -242,7 +293,7 @@
 | 
			
		||||
      </select>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="text-sm w-full">
 | 
			
		||||
      <label for="org" class="font-medium text-gray-700">Parent Organization</label>
 | 
			
		||||
      <label for="org" class="font-medium text-gray-700">{$_('organization')}</label>
 | 
			
		||||
      <select
 | 
			
		||||
        name="org"
 | 
			
		||||
        bind:value={teamdata.parentGroup}
 | 
			
		||||
@@ -255,7 +306,7 @@
 | 
			
		||||
  </section>
 | 
			
		||||
{:else}
 | 
			
		||||
  {#await promise}
 | 
			
		||||
    team detail is being loaded...
 | 
			
		||||
    {$_('team-detail-is-being-loaded')}
 | 
			
		||||
  {:catch error}
 | 
			
		||||
    <PromiseError />
 | 
			
		||||
  {/await}
 | 
			
		||||
 
 | 
			
		||||
@@ -1,5 +1,5 @@
 | 
			
		||||
<script>
 | 
			
		||||
  import { t, _ } from "svelte-i18n";
 | 
			
		||||
  import { getLocaleFromNavigator, t, _ } from "svelte-i18n";
 | 
			
		||||
  import Toastify from "toastify-js";
 | 
			
		||||
  import { RunnerTeamService } from "@odit/lfk-client-js";
 | 
			
		||||
  const teams_promise = RunnerTeamService.runnerTeamControllerGetAll();
 | 
			
		||||
@@ -44,11 +44,91 @@
 | 
			
		||||
        placeholder={$_('datatable.search')}
 | 
			
		||||
        aria-label={$_('datatable.search')}
 | 
			
		||||
        class="gridjs-input gridjs-search-input mb-4" />
 | 
			
		||||
      <div class="h-12">
 | 
			
		||||
        {#if current_teams.some((r) => r.is_selected === true)}
 | 
			
		||||
          <button
 | 
			
		||||
            on:click={async () => {
 | 
			
		||||
              const locale = getLocaleFromNavigator();
 | 
			
		||||
              const teams = current_teams.filter((r) => r.is_selected === true);
 | 
			
		||||
              const toast = Toastify({
 | 
			
		||||
                text: $_('generating-pdfs'),
 | 
			
		||||
                duration: -1,
 | 
			
		||||
              }).showToast();
 | 
			
		||||
              let count = 0;
 | 
			
		||||
              for await (const t of teams) {
 | 
			
		||||
                count++;
 | 
			
		||||
                const runners = await RunnerTeamService.runnerTeamControllerGetRunners(t.id);
 | 
			
		||||
                fetch(
 | 
			
		||||
                  `https://dev.lauf-fuer-kaya.de/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
 | 
			
		||||
                  {
 | 
			
		||||
                    method: 'POST',
 | 
			
		||||
                    headers: {
 | 
			
		||||
                      'Content-Type': 'application/json',
 | 
			
		||||
                    },
 | 
			
		||||
                    body: JSON.stringify(runners),
 | 
			
		||||
                  }
 | 
			
		||||
                )
 | 
			
		||||
                  .then((response) => {
 | 
			
		||||
                    if (response.status != '200') {
 | 
			
		||||
                      toast.hideToast();
 | 
			
		||||
                      Toastify({
 | 
			
		||||
                        text: $_('pdf-generation-failed'),
 | 
			
		||||
                        duration: 3500,
 | 
			
		||||
                        backgroundColor:
 | 
			
		||||
                          'linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)',
 | 
			
		||||
                      }).showToast();
 | 
			
		||||
                    } else {
 | 
			
		||||
                      return response.blob();
 | 
			
		||||
                    }
 | 
			
		||||
                  })
 | 
			
		||||
                  .then((blob) => {
 | 
			
		||||
                    const url = window.URL.createObjectURL(blob);
 | 
			
		||||
                    let a = document.createElement('a');
 | 
			
		||||
                    a.href = url;
 | 
			
		||||
                    a.download = 'Sponsorings_' + t.name + '.pdf';
 | 
			
		||||
                    document.body.appendChild(a);
 | 
			
		||||
                    a.click();
 | 
			
		||||
                    a.remove();
 | 
			
		||||
                    if (count === teams.length) {
 | 
			
		||||
                      toast.hideToast();
 | 
			
		||||
                      Toastify({
 | 
			
		||||
                        text: $_('pdfs-successfully-generated'),
 | 
			
		||||
                        duration: 3500,
 | 
			
		||||
                        backgroundColor:
 | 
			
		||||
                          'linear-gradient(to right, #00b09b, #96c93d)',
 | 
			
		||||
                      }).showToast();
 | 
			
		||||
                    }
 | 
			
		||||
                  })
 | 
			
		||||
                  .catch((err) => {});
 | 
			
		||||
              }
 | 
			
		||||
            }}
 | 
			
		||||
            type="button"
 | 
			
		||||
            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:w-auto sm:text-sm">
 | 
			
		||||
            {$_('generate-sponsoring-contracts')}
 | 
			
		||||
          </button>
 | 
			
		||||
        {/if}
 | 
			
		||||
      </div>
 | 
			
		||||
      <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">
 | 
			
		||||
                <span
 | 
			
		||||
                  on:click={() => {
 | 
			
		||||
                    const newstate = !current_teams.some((r) => r.is_selected === true);
 | 
			
		||||
                    current_teams = current_teams.map((r) => {
 | 
			
		||||
                      r.is_selected = newstate;
 | 
			
		||||
                      return r;
 | 
			
		||||
                    });
 | 
			
		||||
                  }}
 | 
			
		||||
                  class="underline cursor-pointer select-none">{#if current_teams.some((r) => r.is_selected === true)}
 | 
			
		||||
                    {$_('deselect-all')}
 | 
			
		||||
                  {:else}{$_('select-all')}{/if}
 | 
			
		||||
                </span>
 | 
			
		||||
              </th>
 | 
			
		||||
              <th
 | 
			
		||||
                scope="col"
 | 
			
		||||
                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
 | 
			
		||||
@@ -76,6 +156,12 @@
 | 
			
		||||
                .toLowerCase()
 | 
			
		||||
                .includes(searchvalue)}
 | 
			
		||||
                <tr data-rowid="team_{t.id}">
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    <input
 | 
			
		||||
                      bind:checked={t.is_selected}
 | 
			
		||||
                      type="checkbox"
 | 
			
		||||
                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
 | 
			
		||||
                  </td>
 | 
			
		||||
                  <td class="px-6 py-4 whitespace-nowrap">
 | 
			
		||||
                    <div class="flex items-center">
 | 
			
		||||
                      <div class="ml-4">
 | 
			
		||||
@@ -148,7 +234,7 @@
 | 
			
		||||
                      class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
 | 
			
		||||
                      <a
 | 
			
		||||
                        href="./{t.id}"
 | 
			
		||||
                        class="text-indigo-600 hover:text-indigo-900">{$_('edit')}</a>
 | 
			
		||||
                        class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
 | 
			
		||||
                      {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:DELETE')}
 | 
			
		||||
                        <button
 | 
			
		||||
                          on:click={() => {
 | 
			
		||||
 
 | 
			
		||||
@@ -143,7 +143,7 @@
 | 
			
		||||
                      class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
 | 
			
		||||
                      <a
 | 
			
		||||
                        href="./{u.id}"
 | 
			
		||||
                        class="text-indigo-600 hover:text-indigo-900">{$_('edit')}</a>
 | 
			
		||||
                        class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
 | 
			
		||||
                      {#if store.state.jwtinfo.userdetails.permissions.includes('USER:DELETE')}
 | 
			
		||||
                        <button
 | 
			
		||||
                          on:click={() => {
 | 
			
		||||
 
 | 
			
		||||
@@ -4,7 +4,10 @@
 | 
			
		||||
    "about": "Über",
 | 
			
		||||
    "action": "Aktionen",
 | 
			
		||||
    "active": "Aktiv",
 | 
			
		||||
    "add-donation": "Sponsoring erstellen",
 | 
			
		||||
    "add-donor": "Sponsor:in erstellen",
 | 
			
		||||
    "add-your-first-contact": "Erstelle den ersten Kontakt",
 | 
			
		||||
    "add-your-first-donor": "Erstelle die erste Sponsor:in",
 | 
			
		||||
    "add-your-first-organization": "Erstelle die erste Organisation",
 | 
			
		||||
    "add-your-first-runner": "Erstelle die erste Läufer:in",
 | 
			
		||||
    "add-your-first-team": "Erstelle das erste Team",
 | 
			
		||||
@@ -12,8 +15,10 @@
 | 
			
		||||
    "add-your-first-user": "Erstelle die erste Benutzer:in",
 | 
			
		||||
    "address": "Adresse",
 | 
			
		||||
    "address-is-required": "Du musst eine Adresse angeben",
 | 
			
		||||
    "all-associated-donations-will-get-deleted-as-well": "Alle Sponsorings dieser Sponsor:in werden ebenfalls gelöscht",
 | 
			
		||||
    "all-associated-runners-will-be-deleted-too": "Alle zugehörigen Läufer:innen werden auch gelöscht!",
 | 
			
		||||
    "all-associated-teams-and-runners-will-be-deleted-too": "Alle assoziierten Teams und Läufer:innen werden auch gelöscht!",
 | 
			
		||||
    "amount-per-kilometer": "Betrag pro Kilometer",
 | 
			
		||||
    "apartment-suite-etc": "Apartment, Wohnung, etc.",
 | 
			
		||||
    "application_name": "Lauf für Kaya! - Admin",
 | 
			
		||||
    "applying-changes": "Änderungen anwenden",
 | 
			
		||||
@@ -23,6 +28,7 @@
 | 
			
		||||
    "by": "von",
 | 
			
		||||
    "cancel": "Abbrechen",
 | 
			
		||||
    "cancel-delete": "Löschen abbrechen",
 | 
			
		||||
    "cancel-keep-donor": "Abbrechen, Sponsor:in behalten",
 | 
			
		||||
    "cancel-keep-organization": "Abbrechen und Organisation bearbeiten",
 | 
			
		||||
    "cancel-keep-team": "Abbrechen, Team behalten",
 | 
			
		||||
    "cannot-reset-your-password-directly": "Schade. \nWir können das Passwort leider nicht direkt zurücksetzen.\nBitte sende uns eine Mail in der du deine Identität bestätigst.",
 | 
			
		||||
@@ -31,6 +37,7 @@
 | 
			
		||||
    "configure-the-tracks-and-minimum-lap-times": "Bearbeite die Tracks und ihre minimale Rundenzeit",
 | 
			
		||||
    "confirm": "Bestätigen",
 | 
			
		||||
    "confirm-delete": "Löschung Bestätigen",
 | 
			
		||||
    "confirm-delete-donor-with-all-donations": "Bestätigen, Sponsor:in mit allen Sponsorings löschen",
 | 
			
		||||
    "confirm-delete-organization-and-associated-teams-runners": "Bestätugung, lösche die Organisation und alle zugehörigen Teams und Läufer:innen.",
 | 
			
		||||
    "confirm-delete-team-and-associated-runners": "Bestätigung, lösche das Team mitsamt seinen Läufer:innen.",
 | 
			
		||||
    "confirm-deletion": "Löschung Bestätigen",
 | 
			
		||||
@@ -44,8 +51,12 @@
 | 
			
		||||
    "count_organizations": "Organisationen (Anzahl)",
 | 
			
		||||
    "count_teams": "Teams (Anzahl)",
 | 
			
		||||
    "create": "Erstellen",
 | 
			
		||||
    "create-a-new": "Erstelle eine neue",
 | 
			
		||||
    "create-a-new-contact": "Kontakt erstellen",
 | 
			
		||||
    "create-a-new-organization": "Neue Organisatio anlegen",
 | 
			
		||||
    "create-a-new-distance-donation": "Erstelle ein neues Sponsoring",
 | 
			
		||||
    "create-a-new-donor": "Neue Sponsor:in erstellen",
 | 
			
		||||
    "create-a-new-fixed-donation": "Erstelle eine neue Festbetragsspende",
 | 
			
		||||
    "create-a-new-organization": "Neue Organisation anlegen",
 | 
			
		||||
    "create-a-new-runner": "Neue Läufer:in erstellen",
 | 
			
		||||
    "create-a-new-team": "Erstelle ein neues Team",
 | 
			
		||||
    "create-a-new-track": "Neuen Track erstellen",
 | 
			
		||||
@@ -79,15 +90,32 @@
 | 
			
		||||
    },
 | 
			
		||||
    "delete": "Löschen",
 | 
			
		||||
    "delete-contact": "Kontakt löschen",
 | 
			
		||||
    "delete-donation": "Sponsporing löschen",
 | 
			
		||||
    "delete-donor": "Sponsor:in löschen",
 | 
			
		||||
    "delete-organization": "Organisation löschen",
 | 
			
		||||
    "delete-runner": "Läufer:in löschen",
 | 
			
		||||
    "delete-team": "Team Löschen",
 | 
			
		||||
    "delete-user": "Benutzer:in löschen",
 | 
			
		||||
    "dependency_name": "Name",
 | 
			
		||||
    "deselect-all": "Alle abwählen",
 | 
			
		||||
    "details": "Details",
 | 
			
		||||
    "distance": "Distanz",
 | 
			
		||||
    "distance-donation": "Sponsoring",
 | 
			
		||||
    "distance-in-km": "Distanz (in KM)",
 | 
			
		||||
    "do-you-want-to-delete-the-organization-delete_org-name": "Möchtest du die Organisation {orgname} löschen?",
 | 
			
		||||
    "do-you-want-to-delete-the-team-delete_team-name": "Möchtest du das Team {teamname} löschen?",
 | 
			
		||||
    "do-you-want-to-delete-this-donor-with-all-related-donations": "Möchtest du diese Sponsor:in mit all ihren Sponsorings löschen?",
 | 
			
		||||
    "donation-amount": "Sponsoringbetrag",
 | 
			
		||||
    "donation-amount-must-be-greater-that-0-00eur": "Der Sponsoringbetrag muss größer als 0.00€ sein.",
 | 
			
		||||
    "donations": "Sponsorings",
 | 
			
		||||
    "donor": "Sponsor:in",
 | 
			
		||||
    "donor-added": "Sponsor:in hinzugefügt",
 | 
			
		||||
    "donor-deleted": "Sponsor:in gelöscht",
 | 
			
		||||
    "donor-has-no-associated-donations": "Zur Sponsor:in gibt es noch keine Sponsorings",
 | 
			
		||||
    "donor-is-being-added": "Sponsor:in wird hinzugefügt...",
 | 
			
		||||
    "donor-is-being-updated": "Sponsor:in wird aktualisiert",
 | 
			
		||||
    "donors": "Sponsor:innen",
 | 
			
		||||
    "donors-are-being-loaded": "Sponsor:innen werden geladen",
 | 
			
		||||
    "dont-have-your-email-connected": "Deine E-Mail ist nicht verknüpft?",
 | 
			
		||||
    "dont-panic-were-resetting-it": "Keine Panik, wir setzen es zurück ✌",
 | 
			
		||||
    "e-mail-adress": "E-Mail-Adresse",
 | 
			
		||||
@@ -101,10 +129,15 @@
 | 
			
		||||
    "filter-by-organization-team": "Filtern nach Organisation / Team",
 | 
			
		||||
    "first-name": "Vorname",
 | 
			
		||||
    "first-name-is-required": "Vorname muss angegeben werden",
 | 
			
		||||
    "fixed-donation": "Festbetragsspende",
 | 
			
		||||
    "forgot_password": "Passwort vergessen?",
 | 
			
		||||
    "geerbte": "geerbte",
 | 
			
		||||
    "general-stats": "Allgemeine Statistiken",
 | 
			
		||||
    "general_promise_error": "😢 Ein unbekannter Fehler ist aufgetreten",
 | 
			
		||||
    "generate-sponsoring-contract": "Sponsoringvertrag generieren",
 | 
			
		||||
    "generate-sponsoring-contracts": "Sponsoringverträge generieren",
 | 
			
		||||
    "generating-pdf": "Pdf wird generiert...",
 | 
			
		||||
    "generating-pdfs": "PDFs werden generiert...",
 | 
			
		||||
    "generic-ui-logic-error": "Etwas ist in der Benutzeroberfläche schiefgelaufen.",
 | 
			
		||||
    "go-to-login": "Zum Login",
 | 
			
		||||
    "goback": "Zur Startseite",
 | 
			
		||||
@@ -129,6 +162,8 @@
 | 
			
		||||
    "license": "Lizenz",
 | 
			
		||||
    "licenses-are-being-loaded": "Lizenzen werden geladen...",
 | 
			
		||||
    "loading-contact-details": "Kontaktdaten werden geladen ...",
 | 
			
		||||
    "loading-donation-details": "Lade Sponsoringdetails",
 | 
			
		||||
    "loading-donor-details": "Lade Details",
 | 
			
		||||
    "loading-runners": "Läufer:innen werden geladen...",
 | 
			
		||||
    "log_in": "Anmelden",
 | 
			
		||||
    "log_in_to_your_account": "Bitte melde dich an",
 | 
			
		||||
@@ -161,10 +196,16 @@
 | 
			
		||||
    "password-reset-in-progress": "Passwort wird zurückgesetzt...",
 | 
			
		||||
    "password-reset-mail-sent": "Passwort-Reset Mail wurde an \"{usersEmail}\" geschickt.",
 | 
			
		||||
    "password-reset-successful": "Passwort erfolgreich zurückgesetzt!",
 | 
			
		||||
    "pdf-generation-failed": "PDF Generierung fehlgeschlagen!",
 | 
			
		||||
    "pdf-successfully-generated": "PDF wurde erfolgreich generiert!",
 | 
			
		||||
    "pdfs-successfully-generated": "Alle PDFs wurden generiert!",
 | 
			
		||||
    "per-kilometer": "pro Kilometer",
 | 
			
		||||
    "permissions": "Berechtigungen",
 | 
			
		||||
    "permissions-updated": "Berechtigungen aktualisiert!",
 | 
			
		||||
    "phone": "Telefon",
 | 
			
		||||
    "please-provide-a-password": "Bitte gebe ein Passwort an...",
 | 
			
		||||
    "please-provide-the-nessecary-information-to-add-a-new-donor": "Bitte mach die Notwendigen Angaben, um eine neue Sponsor:in zu erstellen",
 | 
			
		||||
    "please-provide-the-nessecary-information-to-create-a-new-donation": "Bitte gebe alle für das Sponsoring notwendigen Daten an.",
 | 
			
		||||
    "please-provide-the-required-csv-xlsx-file": "Bitte eine CSV oder XLSX Datei hochladen.",
 | 
			
		||||
    "please-provide-the-required-information-to-add-a-new-contact": "Bitte gebe alle nötigen Informationen an, im den neuen Kontakt zu erstellen.",
 | 
			
		||||
    "please-provide-the-required-information-to-add-a-new-organization": "Bitte gebe alle nötigen Informationen an, im die neue Organisation zu erstellen.",
 | 
			
		||||
@@ -177,10 +218,12 @@
 | 
			
		||||
    "privacy-loading": "Datenschutzerklärung lädt...",
 | 
			
		||||
    "profile-picture": "Profilbild",
 | 
			
		||||
    "read-license": "Lizenz-Text lesen",
 | 
			
		||||
    "receipt-needed": "Spendenquittung benötigt",
 | 
			
		||||
    "repo_link": "Link",
 | 
			
		||||
    "request-a-new-reset-mail": "Neue Reset-Mail anfordern",
 | 
			
		||||
    "reset-my-password": "Passwort zurücksetzen",
 | 
			
		||||
    "reset-password": "Passwort zurücksetzen",
 | 
			
		||||
    "runner": "Läufer:in",
 | 
			
		||||
    "runner-added": "Läufer:in hinzugefügt",
 | 
			
		||||
    "runner-import": "Läufer:innen Import",
 | 
			
		||||
    "runner-is-being-added": "Läufer:in wird hinzugefügt...",
 | 
			
		||||
@@ -191,24 +234,28 @@
 | 
			
		||||
    "runners-are-being-loaded": "Läufer:innen werden geladen ...",
 | 
			
		||||
    "save": "Speichern",
 | 
			
		||||
    "save-changes": "Änderungen speichern",
 | 
			
		||||
    "select-all": "Alle auswählen",
 | 
			
		||||
    "send-a-mail-to-lfk-odit-services": "Sende eine Mail an lfk@odit.services",
 | 
			
		||||
    "settings": "Einstellungen",
 | 
			
		||||
    "stats-are-being-loaded": "Die Statistiken werden geladen...",
 | 
			
		||||
    "status": "Status",
 | 
			
		||||
    "successful-password-reset": "Passwort erfolgreich zurückgesetzt!",
 | 
			
		||||
    "team": "Team",
 | 
			
		||||
    "team-detail-is-being-loaded": "Team wird geladen...",
 | 
			
		||||
    "team-name": "Teamname",
 | 
			
		||||
    "team-name-is-required": "Teamname ist erforderlich",
 | 
			
		||||
    "teams": "Teams",
 | 
			
		||||
    "teams-are-being-loaded": "Teams werden geladen ...",
 | 
			
		||||
    "the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number": "Die angegebene Telefonnummer ist nicht korrekt. <br /> Bitte gebe eine Telefonnummer im internationalen Format an...",
 | 
			
		||||
    "there-are-no-contacts-added-yet": "Es wurden noch keine Kontakte hinzugefügt.",
 | 
			
		||||
    "there-are-no-donors-yet": "Es gibt noch keine Sponsor:innen",
 | 
			
		||||
    "there-are-no-organizations-added-yet": "Es wurden noch keine Organisationen hinzugefügt.",
 | 
			
		||||
    "there-are-no-runners-added-yet": "Es wurden noch keine Läufer:innen hinzugefügt.",
 | 
			
		||||
    "there-are-no-teams-added-yet": "Es wurden noch keine Teams hinzugefügt.",
 | 
			
		||||
    "there-are-no-users-added-yet": "Es wurden noch keine Benutzer hinzugefügt.",
 | 
			
		||||
    "this-might-take-a-moment": "Das könnte einen kleinen Moment dauern",
 | 
			
		||||
    "total-distance": "gelaufene Strecke",
 | 
			
		||||
    "total-donation-amount": "Gesamtbetrag",
 | 
			
		||||
    "total-donations": "Spendensumme",
 | 
			
		||||
    "total-scans": "gesamte Scans",
 | 
			
		||||
    "track-added": "Track hinzugefügt",
 | 
			
		||||
@@ -220,6 +267,7 @@
 | 
			
		||||
    "track-name-must-not-be-empty": "Der Name muss angegeben werden",
 | 
			
		||||
    "tracks": "Tracks",
 | 
			
		||||
    "updated-contact": "Kontakt aktualisiert!",
 | 
			
		||||
    "updated-donor": "Sponsor:in wurde aktualisiert",
 | 
			
		||||
    "updated-organization": "Organisation wurde aktualisiert",
 | 
			
		||||
    "updating-organization": "Organisation wird aktualisiert",
 | 
			
		||||
    "updating-runner": "Läufer:in wird aktualisiert.",
 | 
			
		||||
 
 | 
			
		||||
@@ -4,7 +4,10 @@
 | 
			
		||||
    "about": "About",
 | 
			
		||||
    "action": "Action",
 | 
			
		||||
    "active": "Active",
 | 
			
		||||
    "add-donation": "Add donation",
 | 
			
		||||
    "add-donor": "add donor",
 | 
			
		||||
    "add-your-first-contact": "Add your first contact",
 | 
			
		||||
    "add-your-first-donor": "add your first donor",
 | 
			
		||||
    "add-your-first-organization": "Add your first organization",
 | 
			
		||||
    "add-your-first-runner": "Add your first runner",
 | 
			
		||||
    "add-your-first-team": "Add your first team",
 | 
			
		||||
@@ -12,8 +15,10 @@
 | 
			
		||||
    "add-your-first-user": "Add your first user",
 | 
			
		||||
    "address": "Address",
 | 
			
		||||
    "address-is-required": "Address is required",
 | 
			
		||||
    "all-associated-donations-will-get-deleted-as-well": "All associated donations will get deleted as well",
 | 
			
		||||
    "all-associated-runners-will-be-deleted-too": "All associated runners will be deleted too!",
 | 
			
		||||
    "all-associated-teams-and-runners-will-be-deleted-too": "All associated teams and runners will be deleted too!",
 | 
			
		||||
    "amount-per-kilometer": "Amount per kilometer",
 | 
			
		||||
    "apartment-suite-etc": "Apartment, suite, etc.",
 | 
			
		||||
    "application_name": "Lauf für Kaya! - Admin",
 | 
			
		||||
    "applying-changes": "Applying Changes",
 | 
			
		||||
@@ -23,6 +28,7 @@
 | 
			
		||||
    "by": "by",
 | 
			
		||||
    "cancel": "Cancel",
 | 
			
		||||
    "cancel-delete": "Cancel Delete",
 | 
			
		||||
    "cancel-keep-donor": "Cancel, keep donor",
 | 
			
		||||
    "cancel-keep-organization": "Cancel, keep organization",
 | 
			
		||||
    "cancel-keep-team": "Cancel, keep team",
 | 
			
		||||
    "cannot-reset-your-password-directly": "Bummer. We unfortunately cannot reset your password directly. Please send us a mail and confirm your identity",
 | 
			
		||||
@@ -31,6 +37,7 @@
 | 
			
		||||
    "configure-the-tracks-and-minimum-lap-times": "configure the tracks & minimum lap times",
 | 
			
		||||
    "confirm": "Confirm",
 | 
			
		||||
    "confirm-delete": "Confirm Delete",
 | 
			
		||||
    "confirm-delete-donor-with-all-donations": "Confirm, delete donor with all donations",
 | 
			
		||||
    "confirm-delete-organization-and-associated-teams-runners": "Confirm, delete organization and associated teams+runners.",
 | 
			
		||||
    "confirm-delete-team-and-associated-runners": "Confirm, delete team and associated runners.",
 | 
			
		||||
    "confirm-deletion": "Confirm Deletion",
 | 
			
		||||
@@ -44,7 +51,11 @@
 | 
			
		||||
    "count_organizations": "# Organizations",
 | 
			
		||||
    "count_teams": "# Teams",
 | 
			
		||||
    "create": "Create",
 | 
			
		||||
    "create-a-new": "Create a new",
 | 
			
		||||
    "create-a-new-contact": "Create a new contact",
 | 
			
		||||
    "create-a-new-distance-donation": "Create a new distance donation",
 | 
			
		||||
    "create-a-new-donor": "Create a new donor",
 | 
			
		||||
    "create-a-new-fixed-donation": "Create a new fixed donation",
 | 
			
		||||
    "create-a-new-organization": "Create a new Organization",
 | 
			
		||||
    "create-a-new-runner": "Create a new Runner",
 | 
			
		||||
    "create-a-new-team": "Create a new team",
 | 
			
		||||
@@ -79,15 +90,32 @@
 | 
			
		||||
    },
 | 
			
		||||
    "delete": "Delete",
 | 
			
		||||
    "delete-contact": "Delete Contact",
 | 
			
		||||
    "delete-donation": "Delete Donation",
 | 
			
		||||
    "delete-donor": "Delete donor",
 | 
			
		||||
    "delete-organization": "Delete Organization",
 | 
			
		||||
    "delete-runner": "Delete Runner",
 | 
			
		||||
    "delete-team": "Delete Team",
 | 
			
		||||
    "delete-user": "Delete User",
 | 
			
		||||
    "dependency_name": "Name",
 | 
			
		||||
    "deselect-all": "deselect all",
 | 
			
		||||
    "details": "Details",
 | 
			
		||||
    "distance": "Distance",
 | 
			
		||||
    "distance-donation": "distance donation",
 | 
			
		||||
    "distance-in-km": "Distance in km",
 | 
			
		||||
    "do-you-want-to-delete-the-organization-delete_org-name": "Do you want to delete the organization {orgname}?",
 | 
			
		||||
    "do-you-want-to-delete-the-team-delete_team-name": "Do you want to delete the team {teamname}?",
 | 
			
		||||
    "do-you-want-to-delete-this-donor-with-all-related-donations": "Do you want to delete this donor with all related donations",
 | 
			
		||||
    "donation-amount": "Donation amount",
 | 
			
		||||
    "donation-amount-must-be-greater-that-0-00eur": "Donation amount must be greater that 0.00€",
 | 
			
		||||
    "donations": "Donations",
 | 
			
		||||
    "donor": "Donor",
 | 
			
		||||
    "donor-added": "Donor added",
 | 
			
		||||
    "donor-deleted": "donor deleted",
 | 
			
		||||
    "donor-has-no-associated-donations": "Donor has no associated donations.",
 | 
			
		||||
    "donor-is-being-added": "Donor is being added...",
 | 
			
		||||
    "donor-is-being-updated": "Donor is being updated",
 | 
			
		||||
    "donors": "Donors",
 | 
			
		||||
    "donors-are-being-loaded": "donors are being loaded",
 | 
			
		||||
    "dont-have-your-email-connected": "Don't have your email connected?",
 | 
			
		||||
    "dont-panic-were-resetting-it": "Don't panic, we're resetting it ✌",
 | 
			
		||||
    "e-mail-adress": "E-Mail Adress",
 | 
			
		||||
@@ -101,10 +129,15 @@
 | 
			
		||||
    "filter-by-organization-team": "Filter by Organization/ Team",
 | 
			
		||||
    "first-name": "First name",
 | 
			
		||||
    "first-name-is-required": "First Name is required",
 | 
			
		||||
    "fixed-donation": "fixed donation",
 | 
			
		||||
    "forgot_password": "Forgot your password?",
 | 
			
		||||
    "geerbte": "inherited",
 | 
			
		||||
    "general-stats": "General Stats",
 | 
			
		||||
    "general_promise_error": "😢 Error",
 | 
			
		||||
    "generate-sponsoring-contract": "generate sponsoring contract",
 | 
			
		||||
    "generate-sponsoring-contracts": "generate sponsoring contracts",
 | 
			
		||||
    "generating-pdf": "generating PDF...",
 | 
			
		||||
    "generating-pdfs": "generating PDFs...",
 | 
			
		||||
    "generic-ui-logic-error": "Something went wrong in the UI logic",
 | 
			
		||||
    "go-to-login": "Go To Login",
 | 
			
		||||
    "goback": "Go Home",
 | 
			
		||||
@@ -129,6 +162,8 @@
 | 
			
		||||
    "license": "License",
 | 
			
		||||
    "licenses-are-being-loaded": "Licenses are being loaded...",
 | 
			
		||||
    "loading-contact-details": "Loading contact details...",
 | 
			
		||||
    "loading-donation-details": "Loading donation details",
 | 
			
		||||
    "loading-donor-details": "Loading donor details",
 | 
			
		||||
    "loading-runners": "loading runners...",
 | 
			
		||||
    "log_in": "Log in",
 | 
			
		||||
    "log_in_to_your_account": "Log in to your account",
 | 
			
		||||
@@ -161,10 +196,16 @@
 | 
			
		||||
    "password-reset-in-progress": "Password Reset in Progress...",
 | 
			
		||||
    "password-reset-mail-sent": "Password reset mail was sent to \"{usersEmail}\".",
 | 
			
		||||
    "password-reset-successful": "Password Reset successful!",
 | 
			
		||||
    "pdf-generation-failed": "PDF generation failed!",
 | 
			
		||||
    "pdf-successfully-generated": "PDF successfully generated!",
 | 
			
		||||
    "pdfs-successfully-generated": "PDFs successfully generated!",
 | 
			
		||||
    "per-kilometer": "per Kilometer",
 | 
			
		||||
    "permissions": "Permissions",
 | 
			
		||||
    "permissions-updated": "Permissions updated!",
 | 
			
		||||
    "phone": "Phone",
 | 
			
		||||
    "please-provide-a-password": "Please provide a password...",
 | 
			
		||||
    "please-provide-the-nessecary-information-to-add-a-new-donor": "Please provide the nessecary information to add a new donor",
 | 
			
		||||
    "please-provide-the-nessecary-information-to-create-a-new-donation": "Please provide the nessecary information to create a new donation",
 | 
			
		||||
    "please-provide-the-required-csv-xlsx-file": "Please provide the required csv/ xlsx file",
 | 
			
		||||
    "please-provide-the-required-information-to-add-a-new-contact": "Please provide the required information to add a new contact.",
 | 
			
		||||
    "please-provide-the-required-information-to-add-a-new-organization": "Please provide the required information to add a new organization.",
 | 
			
		||||
@@ -177,10 +218,12 @@
 | 
			
		||||
    "privacy-loading": "Privacy loading...",
 | 
			
		||||
    "profile-picture": "Profile Picture",
 | 
			
		||||
    "read-license": "Read License",
 | 
			
		||||
    "receipt-needed": "Receipt needed",
 | 
			
		||||
    "repo_link": "Link",
 | 
			
		||||
    "request-a-new-reset-mail": "Request a new reset mail",
 | 
			
		||||
    "reset-my-password": "Reset my password",
 | 
			
		||||
    "reset-password": "Reset your password",
 | 
			
		||||
    "runner": "Runner",
 | 
			
		||||
    "runner-added": "Runner added",
 | 
			
		||||
    "runner-import": "Runner Import",
 | 
			
		||||
    "runner-is-being-added": "Runner is being added...",
 | 
			
		||||
@@ -191,24 +234,28 @@
 | 
			
		||||
    "runners-are-being-loaded": "runners are being loaded...",
 | 
			
		||||
    "save": "Save",
 | 
			
		||||
    "save-changes": "Save Changes",
 | 
			
		||||
    "select-all": "select all",
 | 
			
		||||
    "send-a-mail-to-lfk-odit-services": "send a mail to lfk@odit.services",
 | 
			
		||||
    "settings": "Settings",
 | 
			
		||||
    "stats-are-being-loaded": "stats are being loaded...",
 | 
			
		||||
    "status": "Status",
 | 
			
		||||
    "successful-password-reset": "Successful password reset!",
 | 
			
		||||
    "team": "Team",
 | 
			
		||||
    "team-detail-is-being-loaded": "team detail is being loaded...",
 | 
			
		||||
    "team-name": "Team name",
 | 
			
		||||
    "team-name-is-required": "team name is required",
 | 
			
		||||
    "teams": "Teams",
 | 
			
		||||
    "teams-are-being-loaded": "teams are being loaded...",
 | 
			
		||||
    "the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number": "the provided phone number is invalid.<br />please enter a valid international number...",
 | 
			
		||||
    "there-are-no-contacts-added-yet": "There are no contacts added yet.",
 | 
			
		||||
    "there-are-no-donors-yet": "There are no donors yet",
 | 
			
		||||
    "there-are-no-organizations-added-yet": "There are no organizations added yet.",
 | 
			
		||||
    "there-are-no-runners-added-yet": "There are no runners added yet.",
 | 
			
		||||
    "there-are-no-teams-added-yet": "There are no teams added yet.",
 | 
			
		||||
    "there-are-no-users-added-yet": "There are no users added yet.",
 | 
			
		||||
    "this-might-take-a-moment": "This might take a moment 👀",
 | 
			
		||||
    "total-distance": "total distance",
 | 
			
		||||
    "total-donation-amount": "total donation amount",
 | 
			
		||||
    "total-donations": "total donations",
 | 
			
		||||
    "total-scans": "total scans",
 | 
			
		||||
    "track-added": "Track added",
 | 
			
		||||
@@ -220,6 +267,7 @@
 | 
			
		||||
    "track-name-must-not-be-empty": "Track name must not be empty",
 | 
			
		||||
    "tracks": "Tracks",
 | 
			
		||||
    "updated-contact": "Updated contact!",
 | 
			
		||||
    "updated-donor": "updated donor",
 | 
			
		||||
    "updated-organization": "updated organization",
 | 
			
		||||
    "updating-organization": "updating organization",
 | 
			
		||||
    "updating-runner": "Updating runner...",
 | 
			
		||||
 
 | 
			
		||||
@@ -28,7 +28,7 @@ const store = () => {
 | 
			
		||||
				const jwtinfo = JSON.parse(atob(auth.access_token.split('.')[1]));
 | 
			
		||||
				state.jwtinfo = jwtinfo;
 | 
			
		||||
				localForage.setItem('logindata', auth);
 | 
			
		||||
			}).catch(this.logout());
 | 
			
		||||
			}).catch(()=>{this.logout();});
 | 
			
		||||
		},
 | 
			
		||||
		login(auth, jwtinfo) {
 | 
			
		||||
			update((state) => {
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user