Merge pull request #14 from openimis/feature/OP-501

OP-501: Redesign of the bill and invoice payment
openimis · Apr 22, 2022 · 0f0c3e0 · 0f0c3e0
2 parents aad2cb1 + 1eb6416
commit 0f0c3e0
Show file tree

Hide file tree

Showing 11 changed files with 616 additions and 297 deletions.
diff --git a/src/actions.js b/src/actions.js
@@ -128,6 +128,30 @@ const BILL_PAYMENT_FULL_PROJECTION = [
   "paymentOrigin",
 ];
 
+// new payment design
+const PAYMENT_INVOICE_FULL_PROJECTION = [
+  "id",
+  "reconciliationStatus",
+  "codeExt",
+  "codeTp",
+  "codeReceipt",
+  "label",
+  "fees",
+  "amountReceived",
+  "datePayment",
+  "paymentOrigin",
+  "payerRef"
+];
+
+const DETAIL_PAYMENT_INVOICE_FULL_PROJECTION = [
+  "id",
+  "status",
+  "fees",
+  "amount",
+  "reconciliationId",
+  "reconciliationDate",
+];
+
 const INVOICE_EVENT_FULL_PROJECTION = ["eventType", "message"];
 
 const formatInvoicePaymentGQL = (payment) =>
@@ -176,6 +200,24 @@ const formatBillEventMessageGQL = (eventMessage) =>
     ${!!eventMessage.message ? `message: "${eventMessage.message}"` : ""}
   `;
 
+const formatPaymentInvoiceGQL = (payment, subjectId, subjectType) =>
+  `
+    ${!!payment.id ? `id: "${payment.id}"` : ""}
+    ${!!subjectId ? `subjectId: "${subjectId}"` : ""}
+    ${!!subjectType ? `subjectType: "${subjectType}"` : ""}
+    ${!!payment.status ? `status: ${payment.status}` : ""}
+    ${!!payment.reconciliationStatus ? `reconciliationStatus: ${payment.reconciliationStatus}` : ""}
+    ${!!payment.codeExt ? `codeExt: "${payment.codeExt}"` : ""}
+    ${!!payment.label ? `label: "${payment.label}"` : ""}
+    ${!!payment.codeTp ? `codeTp: "${payment.codeTp}"` : ""}
+    ${!!payment.codeReceipt ? `codeReceipt: "${payment.codeReceipt}"` : ""}
+    ${!!payment.fees ? `fees: "${payment.fees}"` : ""}
+    ${!!payment.amountReceived ? `amountReceived: "${payment.amountReceived}"` : ""}
+    ${!!payment.datePayment ? `datePayment: "${payment.datePayment}"` : ""}
+    ${!!payment.paymentOrigin ? `paymentOrigin: "${payment.paymentOrigin}"` : ""}
+    ${!!payment.payerRef ? `payerRef: "${payment.payerRef}"` : ""}
+  `;
+
 export function fetchInvoices(params) {
   const payload = formatPageQueryWithCount("invoice", params, INVOICE_FULL_PROJECTION);
   return graphql(payload, ACTION_TYPE.SEARCH_INVOICES);
@@ -396,3 +438,49 @@ export function createBillEventType(billEvent, clientMutationLabel) {
     },
   );
 }
+
+//payment new design
+export function fetchPaymentInvoices(params) {
+  const payload = formatPageQueryWithCount("paymentInvoice", params, PAYMENT_INVOICE_FULL_PROJECTION);
+  return graphql(payload, ACTION_TYPE.SEARCH_PAYMENT_INVOICE);
+}
+
+export function fetchDetailPaymentInvoices(params) {
+  const payload = formatPageQueryWithCount("detailPaymentInvoice", params, DETAIL_PAYMENT_INVOICE_FULL_PROJECTION);
+  return graphql(payload, ACTION_TYPE.SEARCH_DETAIL_PAYMENT_INVOICE);
+}
+
+export function createPaymentInvoiceWithDetail(paymentInvoice, subjectId, subjectType, clientMutationLabel) {
+  const mutation = formatMutation(
+    "createPaymentWithDetailInvoice", 
+    formatPaymentInvoiceGQL(paymentInvoice, subjectId, subjectType), 
+    clientMutationLabel
+  );
+  const requestedDateTime = new Date();
+  return graphql(
+    mutation.payload,
+    [REQUEST(ACTION_TYPE.MUTATION), SUCCESS(ACTION_TYPE.CREATE_PAYMENT_INVOICE_WITH_DETAIL), ERROR(ACTION_TYPE.MUTATION)],
+    {
+      actionType: ACTION_TYPE.CREATE_PAYMENT_INVOICE_WITH_DETAIL,
+      clientMutationId: mutation.clientMutationId,
+      clientMutationLabel,
+      requestedDateTime,
+    },
+  );
+}
+
+export function deletePaymentInvoice(paymentInvoice, clientMutationLabel) {
+  const paymentInvoiceUuids = `uuids: ["${paymentInvoice?.id}"]`;
+  const mutation = formatMutation("deletePaymentInvoice", paymentInvoiceUuids, clientMutationLabel);
+  const requestedDateTime = new Date();
+  return graphql(
+    mutation.payload,
+    [REQUEST(ACTION_TYPE.MUTATION), SUCCESS(ACTION_TYPE.DELETE_PAYMENT_INVOICE), ERROR(ACTION_TYPE.MUTATION)],
+    {
+      actionType: ACTION_TYPE.DELETE_PAYMENT_INVOICE,
+      clientMutationId: mutation.clientMutationId,
+      clientMutationLabel,
+      requestedDateTime,
+    },
+  );
+}
diff --git a/src/components/BillPaymentsFilter.js b/src/components/BillPaymentsFilter.js
@@ -5,7 +5,7 @@ import { Grid } from "@material-ui/core";
 import { withTheme, withStyles } from "@material-ui/core/styles";
 import { CONTAINS_LOOKUP, DEFUALT_DEBOUNCE_TIME, STARTS_WITH_LOOKUP } from "../constants";
 import _debounce from "lodash/debounce";
-import InvoicePaymentStatusPicker from "../pickers/InvoicePaymentStatusPicker";
+import PaymentInvoiceStatusPicker from "../pickers/PaymentInvoiceStatusPicker";
 
 const styles = (theme) => ({
     form: {
@@ -54,76 +54,67 @@ const styles = (theme) => ({
     return (
       <Grid container className={classes.form}>
         <Grid item xs={2} className={classes.item}>
-          <InvoicePaymentStatusPicker
-            label="invoicePayment.status.label"
+          <PaymentInvoiceStatusPicker
+            label="paymentInvoice.reconciliationStatus.label"
             withNull
-            nullLabel={formatMessage(intl, "bill", "any")}
-            value={filterValue("status")}
+            nullLabel={formatMessage(intl, "invoice", "any")}
+            value={filterValue("reconciliationStatus")}
             onChange={(value) =>
               onChangeFilters([
                 {
-                  id: "status",
+                  id: "reconciliationStatus",
                   value: value,
-                  filter: `status: "${value}"`,
+                  filter: `reconciliationStatus: "${value}"`,
                 },
               ])
             }
           />
-        </Grid>  
+        </Grid> 
         <Grid item xs={2} className={classes.item}>
           <TextInput
-            module="bill"
-            label="billPayment.codeExt"
+            module="invoice"
+            label="paymentInvoice.codeExt"
             value={filterValue("codeExt")}
             onChange={onChangeStringFilter("codeExt", CONTAINS_LOOKUP)}
           />
         </Grid>
         <Grid item xs={2} className={classes.item}>
           <TextInput
-            module="bill"
-            label="billPayment.label"
+            module="invoice"
+            label="paymentInvoice.label"
             value={filterValue("label")}
             onChange={onChangeStringFilter("label", STARTS_WITH_LOOKUP)}
           />
         </Grid>
         <Grid item xs={2} className={classes.item}>
           <TextInput
-            module="bill"
-            label="billPayment.codeTp"
+            module="invoice"
+            label="paymentInvoice.codeTp"
             value={filterValue("codeTp")}
             onChange={onChangeStringFilter("codeTp", CONTAINS_LOOKUP)}
           />
         </Grid>
         <Grid item xs={2} className={classes.item}>
           <TextInput
-            module="bill"
-            label="billPayment.codeReceipt"
+            module="invoice"
+            label="paymentInvoice.codeReceipt"
             value={filterValue("codeReceipt")}
             onChange={onChangeStringFilter("codeReceipt", CONTAINS_LOOKUP)}
           />
         </Grid>
         <Grid item xs={2} className={classes.item}>
           <NumberInput
-            module="bill"
-            label="billPayment.amountPayed"
-            min={0}
-            value={filterValue("amountPayed")}
-            onChange={onChangeFilter("amountPayed")}
-          />
-        </Grid>
-        <Grid item xs={2} className={classes.item}>
-          <NumberInput
-            module="bill"
-            label="billPayment.fees"
+            module="invoice"
+            label="paymentInvoice.fees"
             min={0}
             value={filterValue("fees")}
             onChange={onChangeFilter("fees")}
           />
         </Grid>
         <Grid item xs={2} className={classes.item}>
           <NumberInput
-            module="bill"
-            label="billPayment.amountReceived"
+            module="invoice"
+            label="paymentInvoice.amountReceived"
             min={0}
             value={filterValue("amountReceived")}
             onChange={onChangeFilter("amountReceived")}
@@ -132,20 +123,28 @@ const styles = (theme) => ({
         <Grid item xs={2} className={classes.item}>
           <PublishedComponent
             pubRef="core.DatePicker"
-            module="bill"
-            label="billPayment.datePayment"
+            module="invoice"
+            label="paymentInvoice.datePayment"
             value={filterValue("datePayment")}
             onChange={onChangeStringFilter("datePayment")}
           />
       </Grid>
         <Grid item xs={2} className={classes.item}>
           <TextInput
-            module="bill"
-            label="billPayment.paymentOrigin"
+            module="invoice"
+            label="paymentInvoice.paymentOrigin"
             value={filterValue("paymentOrigin")}
             onChange={onChangeStringFilter("paymentOrigin", CONTAINS_LOOKUP)}
           />
         </Grid>
+        <Grid item xs={2} className={classes.item}>
+          <TextInput
+            module="invoice"
+            label="paymentInvoice.payerRef"
+            value={filterValue("payerRef")}
+            onChange={onChangeStringFilter("payerRef", CONTAINS_LOOKUP)}
+          />
+        </Grid>
       </Grid>
     );
   };