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

Added payment updating via detail

Browse Source 
ref #133
This commit is contained in:
Nicolai Ort
2021-04-15 15:54:14 +02:00
parent c7a858eed7
commit bdcf5d3fc0
5 changed files with 53 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/donations/AddDonationPaymentModal.svelte
View File

@@ -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')}

37
src/components/donations/DonationDetail.svelte
View File

@@ -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} />

6
src/components/donations/DonationsOverview.svelte
View File

@@ -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