From bdcf5d3fc08d250377226a253642d79b2e82d624 Mon Sep 17 00:00:00 2001
From: Nicolai Ort <info@nicolai-ort.com>
Date: Thu, 15 Apr 2021 15:54:14 +0200
Subject: [PATCH] Added payment updating via detail

ref #133
---
 src/components/auth/Login.svelte              |  2 +-
 .../donations/AddDonationPaymentModal.svelte  | 22 +++++------
 .../donations/DonationDetail.svelte           | 37 +++++++++++++++++++
 .../donations/DonationsOverview.svelte        |  6 +--
 src/components/orgs/ConfirmOrgDeletion.svelte |  2 +-
 5 files changed, 53 insertions(+), 16 deletions(-)

diff --git a/src/components/auth/Login.svelte b/src/components/auth/Login.svelte
index 6be88339..54ccffbc 100644
--- a/src/components/auth/Login.svelte
+++ b/src/components/auth/Login.svelte
@@ -76,7 +76,7 @@
       // last login was not processed yet
     } else {
       Toastify({
-        text: "chill...",
+        text: $_('please-wait-a-moment-your-login-is-still-being-processed'),
         duration: 1500,
         backgroundColor:
           "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
diff --git a/src/components/donations/AddDonationPaymentModal.svelte b/src/components/donations/AddDonationPaymentModal.svelte
index 8c85e633..45f952e9 100644
--- a/src/components/donations/AddDonationPaymentModal.svelte
+++ b/src/components/donations/AddDonationPaymentModal.svelte
@@ -8,13 +8,13 @@
   export let current_donations = [];
   export let editable = {};
   export let original_data = {};
-  export let amount_input = 0;
+  export let paid_amount_input = 0;
   $:processed_last_submit=true;
   function focus(el) {
     el.focus();
   }
-  $: createbtnenabled = is_amount_valid && !(amount_input*100 == original_data.paidAmount)
-  $: is_amount_valid = amount_input > 0;
+  $: createbtnenabled = is_paid_amount_valid && !(paid_amount_input*100 == original_data.paidAmount)
+  $: is_paid_amount_valid = paid_amount_input > 0;
   (() => {
     document.onkeydown = (e) => {
       e = e || window.event;
@@ -37,7 +37,7 @@
         duration: -1,
       }).showToast();
       editable.donor = editable.donor.id;
-      editable.paidAmount = amount_input*100;
+      editable.paidAmount = paid_amount_input*100;
       if(editable.responseType == "DISTANCEDONATION" || editable.runner){
         editable.runner = editable.runner.id;
         DonationService.donationControllerPutDistance(original_data.id, editable)
@@ -144,14 +144,14 @@
                 <div class="w-full">
                   <label
                   for="token"
-                  class="block text-sm font-medium text-gray-700">Paid amount</label>
+                  class="block text-sm font-medium text-gray-700">{$_('paid-amount')}</label>
                 <div class="inline-flex border-gray-300 border rounded-l-md rounded-r-md bg-gray-50 text-gray-500 w-full">
                   <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}
+                      class:border-red-500={!is_paid_amount_valid}
+                      class:focus:border-red-500={!is_paid_amount_valid}
+                      class:focus:ring-red-500={!is_paid_amount_valid}
+                      bind:value={paid_amount_input}
                       type="number"
                       step="0.01"
                       name="donation_amount_eur"
@@ -160,14 +160,14 @@
                     <button
                       on:click={
                         ()=>{
-                          amount_input=amount_input = (original_data.amount/100).toFixed(2);
+                          paid_amount_input=paid_amount_input = (original_data.amount/100).toFixed(2);
                         }
                       }
                       class="inline-flex items-center p-r-2 text-indigo-300 hover:text-indigo-700 text-sm">MAX</button>
                     <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}
+                  {#if !is_paid_amount_valid}
                     <span
                       class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
                       {$_('payment-amount-must-be-greater-than-0-00eur')}
diff --git a/src/components/donations/DonationDetail.svelte b/src/components/donations/DonationDetail.svelte
index 5dd6e089..e16c1091 100644
--- a/src/components/donations/DonationDetail.svelte
+++ b/src/components/donations/DonationDetail.svelte
@@ -20,6 +20,8 @@
   $: current_runners = [];
   $: amount_input = 0;
   $: is_amount_valid = amount_input > 0;
+  $: paid_amount_input = 0;
+  $: is_paid_amount_valid = paid_amount_input > 0;
   $: is_everything_set =
     editable.donor != null &&
     ((original_data.responseType == "DISTANCEDONATION" &&
@@ -39,6 +41,7 @@
     data_loaded = true;
     original_data = Object.assign(original_data, data);
     editable = Object.assign(editable, original_data);
+    paid_amount_input = data.paidAmount / 100;
     if (data.responseType == "DISTANCEDONATION") {
       amount_input = data.amountPerDistance / 100;
       RunnerService.runnerControllerGetAll().then((val) => {
@@ -70,6 +73,7 @@
         duration: 2500,
       }).showToast();
       let postdata = {};
+      editable.paidAmount = paid_amount_input*100;
       if (original_data.responseType === "DISTANCEDONATION") {
         editable.amountPerDistance = Math.floor(amount_input * 100);
         postdata = Object.assign(postdata, editable);
@@ -297,6 +301,39 @@
         </span>
       {/if}
     </div>
+    <div class="w-full">
+      <label
+        for="token"
+        class="block text-sm font-medium text-gray-700">{$_('paid-amount')}</label>
+      <div class="inline-flex border-gray-300 border rounded-l-md rounded-r-md bg-gray-50 text-gray-500 w-full">
+        <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={paid_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 p-2"
+            placeholder="2.00" />
+          <button
+            on:click={
+              ()=>{
+                paid_amount_input=paid_amount_input = (original_data.amount/100).toFixed(2);
+              }
+            }
+            class="inline-flex items-center p-r-2 text-indigo-300 hover:text-indigo-700 text-sm">MAX</button>
+          <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_paid_amount_valid}
+          <span
+            class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
+            {$_('payment-amount-must-be-greater-than-0-00eur')}
+          </span>
+        {/if}
+    </div>
   </section>
 {:catch error}
   <PromiseError {error} />
diff --git a/src/components/donations/DonationsOverview.svelte b/src/components/donations/DonationsOverview.svelte
index 9184f6bf..667da7db 100644
--- a/src/components/donations/DonationsOverview.svelte
+++ b/src/components/donations/DonationsOverview.svelte
@@ -11,7 +11,7 @@
   export let payment_modal_open = false;
   export let editable = {};
   export let original_data = {};
-  export let amount_input = 0;
+  export let paid_amount_input = 0;
   const donations_promise = DonationService.donationControllerGetAll().then(
     (val) => {
       current_donations = val;
@@ -26,12 +26,12 @@
   function open_payment_modal(donation) {
     editable = Object.assign({}, donation);
     original_data = Object.assign({}, donation);
-    amount_input = (donation.paidAmount/100).toFixed(2);
+    paid_amount_input = (donation.paidAmount/100).toFixed(2);
     payment_modal_open = true;
   }
 </script>
 
-<AddDonationPaymentModal bind:current_donations bind:original_data bind:editable bind:amount_input bind:payment_modal_open />
+<AddDonationPaymentModal bind:current_donations bind:original_data bind:editable bind:paid_amount_input bind:payment_modal_open />
 {#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:GET')}
   {#await donations_promise}
     <div
diff --git a/src/components/orgs/ConfirmOrgDeletion.svelte b/src/components/orgs/ConfirmOrgDeletion.svelte
index 7fb936d8..449f0568 100644
--- a/src/components/orgs/ConfirmOrgDeletion.svelte
+++ b/src/components/orgs/ConfirmOrgDeletion.svelte
@@ -19,7 +19,7 @@
     )
       .then((resp) => {
         Toastify({
-          text: "Organization deleted",
+          text: $_('organization-deleted'),
           duration: 500,
           backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
         }).showToast();