Updated Add modal

ref #143

src/App.svelte

@@ -72,6 +72,7 @@
   import Scans from "./components/scans/Scans.svelte";
   import ScanDetail from "./components/scans/ScanDetail.svelte";
   import Cards from "./components/cards/Cards.svelte";
+	import StatsClients from "./components/statsclients/StatsClients.svelte";
   store.init();
 </script>
 
@@ -206,6 +207,14 @@
             <ScanStationDetail {params} />
           </Route>
         </Route>
+        <Route path="/statsclients/*">
+          <Route path="/">
+            <StatsClients />
+          </Route>
+          <Route path="/:clientid" let:params>
+            <ScanStationDetail {params} />
+          </Route>
+        </Route>
         <Route path="/about">
           <About />
         </Route>

src/components/statsclients/AddStatsClientModal.svelte

@@ -2,26 +2,17 @@
   import { _ } from "svelte-i18n";
   import { clickOutside } from "../base/outsideclick";
   import { focusTrap } from "svelte-focus-trap";
-  import { ScanStationService, TrackService } from "@odit/lfk-client-js";
+  import { StatsClientService } from "@odit/lfk-client-js";
   import Toastify from "toastify-js";
-  import Select from "svelte-select";
   export let modal_open;
-  export let new_station;
-  export let current_stations;
+  export let new_client;
+  export let current_clients;
   export let copy_modal_open;
-  let tracks = [];
-  TrackService.trackControllerGetAll().then((val) => {
-    tracks = val.map((t) => {
-      return { label: t.name || `#${t.id}`, value: t };
-    });
-  });
   function focus(el) {
     el.focus();
   }
   $: description = "";
-  $: track = null;
-  $: enabled = true;
-  $: createbtnenabled = track != null;
+  $: createbtnenabled = description != "";
   $: processed_last_submit = true;
   (() => {
     document.onkeydown = (e) => {
@@ -41,19 +32,13 @@
     if (processed_last_submit === true) {
       processed_last_submit = false;
       const toast = Toastify({
-        text: $_("scanstation-is-being-added"),
+        text: $_("statsclient-is-being-added"),
         duration: -1,
       }).showToast();
-      let postdata = {
-        description,
-        enabled,
-        track,
-      };
-      ScanStationService.scanStationControllerPost(postdata)
+
+      StatsClientService.statsClientControllerPost({description})
         .then((result) => {
           description = "";
-          track = tracks[0].id;
-          enabled = true;
           modal_open = false;
           //
           Toastify({
@@ -61,9 +46,9 @@
             duration: 500,
             backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
           }).showToast();
-          current_stations.push(result);
-          current_stations = current_stations;
-          new_station = result;
+          current_clients.push(result);
+          current_clients = current_clients;
+          new_client = result;
           copy_modal_open = true;
         })
         .catch((err) => {
@@ -117,34 +102,14 @@
             </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-scanstation')}
+                {$_('create-a-new-statsclient')}
               </h3>
               <div class="mt-2 mb-6">
                 <p class="text-sm text-gray-500">
-                  {$_('please-provide-the-required-information-to-create-a-new-scanstation')}
+                  {$_('please-provide-the-required-information-to-create-a-new-statsclient')}
                 </p>
               </div>
               <div class="grid grid-cols-6 gap-6">
-                <div class="col-span-6">
-                  <label
-                    for="track"
-                    class="block text-sm font-medium text-gray-700">Track</label>
-                  <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
-                    itemFilter={(label, filterText, option) => label
-                        .toLowerCase()
-                        .includes(
-                          filterText.toLowerCase()
-                        ) || option.value.id
-                        .toString()
-                        .startsWith(filterText.toLowerCase())}
-                    items={tracks}
-                    showChevron={true}
-                    placeholder="Search for a track (by name or id)."
-                    noOptionsMessage="No track found"
-                    on:select={(selectedValue) => (track = selectedValue.detail.value.id)}
-                    on:clear={() => (track = null)} />
-                </div>
                 <div class="col-span-6">
                   <label
                     for="description"
@@ -158,25 +123,6 @@
                     name="description"
                     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="enabled"
-                    class="font-medium text-gray-700">{$_('enabled_large')}</label>
-                  <br />
-                  <p class="text-gray-500">
-                    <input
-                      id="enabled"
-                      on:change={() => {
-                        enabled = !enabled;
-                      }}
-                      name="enabled"
-                      type="checkbox"
-                      checked={enabled}
-                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
-                    {$_('this-scanstation-is')}
-                    {#if enabled}{$_('enabled')}{:else}{$_('disabled')}{/if}
-                  </p>
-                </div>
               </div>
             </div>
           </div>

src/components/statsclients/StatsClientsEmptyState.svelte

@@ -1,6 +1,6 @@
 <script>
   import { _ } from "svelte-i18n";
-import AddScanStationModal from "./AddScanStationModal.svelte";
+import AddScanStationModal from "./AddStatsClientModal.svelte";
 import CopyScanStationTokenModal from "./CopyScanStationTokenModal.svelte";
   import scanstations_empty from "./scanstations_empty.svg";
   let modal_open = false;

src/locales/de.json

@@ -465,5 +465,7 @@
   "key": "Schlüssel",
   "statsclient-deleted": "Statsclient wurde gelöscht",
   "cancel-keep-statsclient": "Abbrechen und Statsclient behalten",
-  "confirm-delete-statsclient": "Bestätigung, Statsclient löschen"
+  "confirm-delete-statsclient": "Bestätigung, Statsclient löschen",
+  "statsclient-is-being-added": "Statsclient wird angelegt...",
+  "please-provide-the-required-information-to-create-a-new-statsclient": "Bitte gebe alle für einen Statsclient notwendigen Informationen an"
 }

src/locales/en.json

@@ -466,5 +466,7 @@
   "key": "Key",
   "statsclient-deleted": "Deleted statsclient",
   "cancel-keep-statsclient": "Cancel and keep statsclient",
-  "confirm-delete-statsclient": "Confirm, delete statsclient"
+  "confirm-delete-statsclient": "Confirm, delete statsclient",
+  "statsclient-is-being-added": "Statsclient is being added...",
+  "please-provide-the-required-information-to-create-a-new-statsclient": "Please provide the required information to create a new statsclient"
 }