From bd5a1839e849917a77fcd515e48b74f52858ddde Mon Sep 17 00:00:00 2001 From: lunarkid <4476442+dedywahyudi@users.noreply.github.com> Date: Wed, 24 Aug 2022 22:32:22 +0700 Subject: [PATCH 1/3] fix: missing select/deselect all --- css/reskin-2/paymentHistory.css | 8 +++++--- js/reskin/newTCScript.js | 19 ++++++++++++++----- 2 files changed, 19 insertions(+), 8 deletions(-) diff --git a/css/reskin-2/paymentHistory.css b/css/reskin-2/paymentHistory.css index 09e9de1ac..0030ed61a 100644 --- a/css/reskin-2/paymentHistory.css +++ b/css/reskin-2/paymentHistory.css @@ -4,7 +4,7 @@ body { background-color: var(--tc-white); } -.bigRed { +.bigRed { color: red; } @@ -286,7 +286,8 @@ body { .form-container { display: flex; flex-direction: column; - padding-top: 24px; + /* padding-top: 24px; */ + padding-top: 8px; } .form-container br { display: none; @@ -391,7 +392,8 @@ body { text-decoration: none; display: inline-flex; align-items: center; - padding: 0 16px 8px; + /* padding: 0 16px 8px; */ + padding: 16px; } .form-container .payment-table tbody tr.headerRow td a::after { content: url('/i/reskin-2/sortable.svg'); diff --git a/js/reskin/newTCScript.js b/js/reskin/newTCScript.js index 6af95d013..d9c787ba7 100644 --- a/js/reskin/newTCScript.js +++ b/js/reskin/newTCScript.js @@ -608,13 +608,22 @@ $(document).ready(function() { // payment page - $('.uncheckAll').click(function() { - $('.uncheckable').attr('checked', false); - updatePayMe(); - }); + // $('.uncheckAll').click(function() { + // $('.uncheckable').attr('checked', false); + // updatePayMe(); + // }); $('.checkAll').click(function () { - $('.checkable').attr('checked', true); + if (this.checked) { + $('.checkable').attr('checked', true); + var total = calcTotalPayment() + if (total > 25) { + $('.bigRed').prev().remove(); + $('.bigRed').remove(); + } + } else { + $('.uncheckable').attr('checked', false); + } updatePayMe(); }); From 9b248bf54621fab5d66f741594c85beaa60695aa Mon Sep 17 00:00:00 2001 From: lunarkid <4476442+dedywahyudi@users.noreply.github.com> Date: Fri, 26 Aug 2022 11:21:53 +0700 Subject: [PATCH 2/3] fix: quick pay button --- css/reskin-2/paymentHistory.css | 33 +++++++++++++++ js/reskin/newTCScript.js | 75 +++++++++++++++++++++++++++++++++ 2 files changed, 108 insertions(+) diff --git a/css/reskin-2/paymentHistory.css b/css/reskin-2/paymentHistory.css index 0030ed61a..9f3ab2c02 100644 --- a/css/reskin-2/paymentHistory.css +++ b/css/reskin-2/paymentHistory.css @@ -281,6 +281,39 @@ body { /* **************** View-All, View Pending **************** */ +.above-tabs { + width: 100%; +} + .above-tabs .pay-me-btn { + padding-bottom: 24px; + } + .above-tabs .pay-me-btn input[type="button"] { + text-transform: uppercase; + padding: 8px 24px; + border: 0; + border-radius: 24px; + cursor: pointer; + + font-family: Roboto; + font-weight: 700; + font-size: 14px; + line-height: 24px; + letter-spacing: 0.008em; + + color: var(--tc-white); + background-color: var(--green); + } + .above-tabs .pay-me-btn input[type="button"]:disabled { + color: var(--grey-1); + background-color: var(--black-5); + cursor: default; + } + @media (max-width: /* --sm-max */ 959px) { + .above-tabs .pay-me-btn { + padding-bottom: 16px; + } + } + #payments > br { display: none; } .form-container { diff --git a/js/reskin/newTCScript.js b/js/reskin/newTCScript.js index d9c787ba7..7b7167412 100644 --- a/js/reskin/newTCScript.js +++ b/js/reskin/newTCScript.js @@ -378,6 +378,19 @@ function updatePayMe() { } } +/** + * Updates the text of Quick Pay Me button with total amount of owed payments. + */ +function updateQuickPayMe() { + var total = totalOwedPayments; + $('#quickPayMe').val('Pay Me: $' + total.toFixed(2)); + if (total < MINIMUM_PAYMENT_ACCRUAL_AMOUNT) { + $('#quickPayMe').attr('disabled', 'disabled'); + } else { + $('#quickPayMe').removeAttr('disabled'); + } +} + /** * Calculates the total amount of payments selected by user. * @@ -687,6 +700,66 @@ $(document).ready(function() { } }); + $('#quickPayMe').click(function() { + var total = totalOwedPayments; + var confirmationMessage = PAY_ME_CONFIRMATION_TEMPLATE.replace('{0}', '$' + total.toFixed(2)); + + var isNativeDialog = $('#payment-confirm-modal-id').length === 0; + + if (isNativeDialog) { + if (confirm(confirmationMessage)) { + var myForm = document.f; + myForm.method = 'POST'; + myForm.module.value = 'PayMe'; + myForm.submit(); + } + } else { + var resultPromise = new Promise(function (resolve) { + $('#payment-confirm-modal-id .modal-body').text(confirmationMessage); + document.body.style.overflow = 'hidden'; + + function onCancel () { + document.body.style.overflow = ''; + $('#payment-confirm-modal-id').removeClass('show'); + $('#payment-confirm-modal-id .close-btn').off('click'); + $('#payment-confirm-modal-id .button-secondary').off('click'); + $('#payment-confirm-modal-id .button-primary').off('click'); + resolve(false); + } + function onOk () { + document.body.style.overflow = ''; + $('#payment-confirm-modal-id').removeClass('show'); + $('#payment-confirm-modal-id .close-btn').off('click'); + $('#payment-confirm-modal-id .button-secondary').off('click'); + $('#payment-confirm-modal-id .button-primary').off('click'); + resolve(true); + } + + $('#payment-confirm-modal-id').addClass('show'); + $('#payment-confirm-modal-id .close-btn').one('click', onCancel); + $('#payment-confirm-modal-id .button-secondary').one('click', onCancel); + $('#payment-confirm-modal-id .button-primary').one('click', onOk); + }); + + resultPromise.then(function (ok) { + if (ok) { + var myForm = document.f; + myForm.method = 'POST'; + myForm.module.value = 'PayMe'; + for (var i = 0; i < owedPayments.length; i++) { + var paymentId = owedPayments[i] + var input = document.createElement('input'); + input.type = 'hidden'; + input.value = paymentId; + input.name = 'paymentId'; + myForm.appendChild(input); + } + myForm.submit(); + } + }) + } + }); + $('.getable').click(function () { var myForm = document.f; myForm.method = 'GET'; @@ -697,6 +770,8 @@ $(document).ready(function() { updatePayMe(); + updateQuickPayMe(); + $('.buttonArea .register').click(function(){ // the 'isAnonymous' is defined in the projectDetails.jsp file if(!isAnonymous) { From c5fa2f975250b062c98a1a663cb0b460626d5231 Mon Sep 17 00:00:00 2001 From: lunarkid <4476442+dedywahyudi@users.noreply.github.com> Date: Thu, 8 Sep 2022 09:47:00 +0700 Subject: [PATCH 3/3] fix: select all mobile --- css/reskin-2/paymentHistory.css | 53 +++++++++++++++++++++++++++++++++ 1 file changed, 53 insertions(+) diff --git a/css/reskin-2/paymentHistory.css b/css/reskin-2/paymentHistory.css index 9f3ab2c02..761a0b460 100644 --- a/css/reskin-2/paymentHistory.css +++ b/css/reskin-2/paymentHistory.css @@ -1116,6 +1116,59 @@ body { } } +.mobile-select-all-checkbox { + display: inline-flex; + align-items: center; + justify-content: center; + width: 40px; + height: 40px; + background-color: var(--black-5); + border-radius: 4px; + box-sizing: border-box; +} + .mobile-select-all-checkbox .checkbox { + position: relative; + display: inline-flex; + align-items: center; + } + .mobile-select-all-checkbox .checkbox input[type="checkbox"] { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + opacity: 0; + cursor: pointer; + } + .mobile-select-all-checkbox .checkbox input[type="checkbox"] ~ .checkbox-label { + } + .mobile-select-all-checkbox .checkbox input[type="checkbox"] ~ .checkbox-label::before { + content: ''; + display: block; + width: 20px; + height: 20px; + background-color: #fff; + border: 1.52px solid #7f7f7f; + border-radius: 3px; + box-sizing: border-box; + } + .mobile-select-all-checkbox .checkbox input[type="checkbox"] ~ .checkbox-label::after { + content: url('/i/reskin-2/checkbox.svg'); + display: none; + box-sizing: border-box; + } + .mobile-select-all-checkbox .checkbox input[type="checkbox"]:checked ~ .checkbox-label::before { + display: none; + } + .mobile-select-all-checkbox .checkbox input[type="checkbox"]:checked ~ .checkbox-label::after { + display: block; + } + @media (min-width: /* --md-min */ 960px) { + .mobile-select-all-checkbox { + display: none; + } + } + .mobile-payments-sort-button { display: inline-flex; align-items: center;