feature : Puschases & Sales / fix : tasks

client/src/containers/Sales/PaymentReceive/PaymentReceives.js

@@ -1,4 +1,4 @@
-import React, { useCallback } from 'react';
+import React, { useCallback, useState, useEffect, useMemo } from 'react';
 import { useParams, useHistory } from 'react-router-dom';
 import { useQuery } from 'react-query';
 
@@ -8,7 +8,9 @@ import DashboardInsider from 'components/Dashboard/DashboardInsider';
 import withCustomersActions from 'containers/Customers/withCustomersActions';
 import withAccountsActions from 'containers/Accounts/withAccountsActions';
 import withItemsActions from 'containers/Items/withItemsActions';
-//#withInvoiceActions
+import withPaymentReceivesActions from './withPaymentReceivesActions';
+import withInvoiceActions from '../Invoice/withInvoiceActions';
+import withInvoices from '../Invoice/withInvoices';
 
 import { compose } from 'utils';
 
@@ -22,9 +24,16 @@ function PaymentReceives({
   //#withItemsActions
   requestFetchItems,
 
-  //#withInvoiceActions
+  //#withPaymentReceivesActions
+  requestFetchPaymentReceive,
+
+  //#withInvoicesActions
+  requestFetchDueInvoices,
 }) {
   const history = useHistory();
+  const { id } = useParams();
+  const [customerId, setCustomerId] = useState(null);
+  const [payload, setPayload] = useState(false);
 
   // Handle fetch accounts data
   const fetchAccounts = useQuery('accounts-list', (key) =>
@@ -32,30 +41,59 @@ function PaymentReceives({
   );
 
   // Handle fetch Items data table or list
-  const fetchItems = useQuery('items-table', () => requestFetchItems({}));
+  const fetchItems = useQuery('items-list', () => requestFetchItems({}));
 
   // Handle fetch customers data table or list
-  const fetchCustomers = useQuery('customers-table', () =>
+  const fetchCustomers = useQuery('customers-list', () =>
     requestFetchCustomers({}),
   );
 
-  const handleFormSubmit = useCallback((payload) => {}, [history]);
+  const fetchPaymentReceive = useQuery(
+    ['payment-receive', id],
+    (key, _id) => requestFetchPaymentReceive(_id),
+    { enabled: !!id },
+  );
 
+  const fetchDueInvoices = useQuery(
+    ['due-invoies', customerId],
+    (key, query) => requestFetchDueInvoices(query),
+    { enabled: !!customerId },
+  );
+
+  const handleFormSubmit = useCallback(
+    (payload) => {
+      payload.redirect && history.push('/payment-receives');
+    },
+    [history],
+  );
   const handleCancel = useCallback(() => {
     history.goBack();
   }, [history]);
 
+  const handleCustomerChange = (customerId) => {
+    if (id) {
+      setCustomerId(!customerId);
+    } else {
+      setCustomerId(customerId);
+    }
+  };
+
   return (
     <DashboardInsider
       loading={
         fetchCustomers.isFetching ||
         fetchItems.isFetching ||
-        fetchAccounts.isFetching
+        fetchAccounts.isFetching ||
+        fetchPaymentReceive.isFetching
       }
+      name={'payment-receive'}
     >
       <PaymentReceiveForm
         onFormSubmit={handleFormSubmit}
+        paymentReceiveId={id}
+        paymentReceiveInvoices={id}
         onCancelForm={handleCancel}
+        onCustomerChange={handleCustomerChange}
       />
     </DashboardInsider>
   );
@@ -65,5 +103,6 @@ export default compose(
   withCustomersActions,
   withItemsActions,
   withAccountsActions,
-  // withInvoiceActions
+  withPaymentReceivesActions,
+  withInvoiceActions,
 )(PaymentReceives);