From dab43faff2e1c9fe1dd78fc1f566c59fde812864 Mon Sep 17 00:00:00 2001 From: elforjani3 Date: Mon, 22 Feb 2021 20:45:17 +0200 Subject: [PATCH] refactoring : paper template. --- .../src/containers/Drawers/PaperTemplate.js | 123 ------------------ .../Drawers/PaperTemplate/PaperTemplate.js | 27 ++++ .../PaperTemplate/PaperTemplateFooter.js | 16 +++ .../PaperTemplate/PaperTemplateHeader.js | 44 +++++++ .../PaperTemplate/PaperTemplateTable.js | 55 ++++++++ .../Drawers/PaymentPaperTemplate.js | 102 --------------- .../PaymentPaperTemplate.js | 26 ++++ .../PaymentPaperTemplateHeader.js | 43 ++++++ .../PaymentPaperTemplateTable.js | 51 ++++++++ .../EstimateDetails/EstimateDrawer.js | 5 +- .../Invoices/InvoiceDetails/InvoiceDrawer.js | 2 +- .../PaymentDetails/PaymentDrawer.js | 2 +- .../Receipts/ReceiptDetails/ReceiptDrawer.js | 2 +- 13 files changed, 268 insertions(+), 230 deletions(-) delete mode 100644 client/src/containers/Drawers/PaperTemplate.js create mode 100644 client/src/containers/Drawers/PaperTemplate/PaperTemplate.js create mode 100644 client/src/containers/Drawers/PaperTemplate/PaperTemplateFooter.js create mode 100644 client/src/containers/Drawers/PaperTemplate/PaperTemplateHeader.js create mode 100644 client/src/containers/Drawers/PaperTemplate/PaperTemplateTable.js delete mode 100644 client/src/containers/Drawers/PaymentPaperTemplate.js create mode 100644 client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplate.js create mode 100644 client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplateHeader.js create mode 100644 client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplateTable.js diff --git a/client/src/containers/Drawers/PaperTemplate.js b/client/src/containers/Drawers/PaperTemplate.js deleted file mode 100644 index 037ccd4d3..000000000 --- a/client/src/containers/Drawers/PaperTemplate.js +++ /dev/null @@ -1,123 +0,0 @@ -import React from 'react'; -import { Icon } from 'components'; -import 'style/components/Drawer/DrawerTemplate.scss'; - -export default function PaperTemplate({ labels: propLabels }) { - const labels = { - name: 'Estimate', - billedTo: 'Billed to', - date: 'Estimate date', - refNo: 'Estimate No.', - billedFrom: 'Billed from', - amount: 'Estimate amount', - dueDate: 'Due date', - ...propLabels, - }; - - return ( -
-
-
-
-

{labels.name}

-

info@bigcapital.ly

-
- -
- -
-
- {labels.billedTo} -

Joe Biden

-
-
- {labels.date} - -

1/1/2022

-
-
- {labels.refNo} -

IN-2022

-
-
- {labels.amount} -

6,000 LYD

-
-
- {labels.billedFrom} -

Donald Trump

-
-
- {labels.dueDate} -

25/03/2022

-
-
- -
-
- Description - Rate - Qty - Total -
-
- - Nulla commodo magnanon dolor excepteur nisi aute laborum. - - 1 - 1 - 100 LYD -
- -
- - Nulla comm non dolor excepteur elit dolore eiusmod nisi aute - laborum. - - 1 - 1 - 100 LYD -
-
- - Nulla comm non dolor excepteur elit dolore eiusmod nisi aute - laborum. - - 1 - 1 - 100 LYD -
-
- - Nulla comm non dolor excepteur elit dolore eiusmod nisi aute - laborum. - - 1 - 1 - 100 LYD -
-
- - Nulla comm non dolor excepteur elit dolore eiusmod nisi aute - laborum. - - 1 - 1 - 100 LYD -
-
- -
-
-

Conditions and terms

-
-
    -
  • Est excepteur laboris do sit dolore sit exercitation non.
    • -
  • Lorem duis aliqua minim elit cillum.
    • -
  • Dolor ad quis Lorem ut mollit consectetur.
    • -
-
-
-
- ); -} diff --git a/client/src/containers/Drawers/PaperTemplate/PaperTemplate.js b/client/src/containers/Drawers/PaperTemplate/PaperTemplate.js new file mode 100644 index 000000000..f520dc9e1 --- /dev/null +++ b/client/src/containers/Drawers/PaperTemplate/PaperTemplate.js @@ -0,0 +1,27 @@ +import React from 'react'; +import PaperTemplateHeader from './PaperTemplateHeader'; +import PaperTemplateTable from './PaperTemplateTable'; +import PaperTemplateFooter from './PaperTemplateFooter'; +import 'style/components/Drawer/DrawerTemplate.scss'; + +export default function PaperTemplate({ labels: propLabels }) { + const labels = { + name: 'Estimate', + billedTo: 'Billed to', + date: 'Estimate date', + refNo: 'Estimate No.', + billedFrom: 'Billed from', + amount: 'Estimate amount', + dueDate: 'Due date', + ...propLabels, + }; + return ( +
+
+ + + +
+
+ ); +} diff --git a/client/src/containers/Drawers/PaperTemplate/PaperTemplateFooter.js b/client/src/containers/Drawers/PaperTemplate/PaperTemplateFooter.js new file mode 100644 index 000000000..b270005e2 --- /dev/null +++ b/client/src/containers/Drawers/PaperTemplate/PaperTemplateFooter.js @@ -0,0 +1,16 @@ +import React from 'react'; + +export default function PaperTemplateFooter() { + return ( +
+
+

Conditions and terms

+
+ +
+ ); +} diff --git a/client/src/containers/Drawers/PaperTemplate/PaperTemplateHeader.js b/client/src/containers/Drawers/PaperTemplate/PaperTemplateHeader.js new file mode 100644 index 000000000..0413f5397 --- /dev/null +++ b/client/src/containers/Drawers/PaperTemplate/PaperTemplateHeader.js @@ -0,0 +1,44 @@ +import React from 'react'; +import { Icon } from 'components'; + +export default function PaperTemplateHeader({ defaultLabels }) { + return ( + <> +
+
+

{defaultLabels.name}

+

info@bigcapital.ly

+
+ +
+ +
+
+ {defaultLabels.billedTo} +

Joe Biden

+
+
+ {defaultLabels.date} + +

1/1/2022

+
+
+ {defaultLabels.refNo} +

IN-2022

+
+
+ {defaultLabels.amount} +

6,000 LYD

+
+
+ {defaultLabels.billedFrom} +

Donald Trump

+
+
+ {defaultLabels.dueDate} +

25/03/2022

+
+
+ + ); +} diff --git a/client/src/containers/Drawers/PaperTemplate/PaperTemplateTable.js b/client/src/containers/Drawers/PaperTemplate/PaperTemplateTable.js new file mode 100644 index 000000000..e54454533 --- /dev/null +++ b/client/src/containers/Drawers/PaperTemplate/PaperTemplateTable.js @@ -0,0 +1,55 @@ +import React from 'react'; + +export default function DrawerTemplateTable() { + return ( +
+
+ Description + Rate + Qty + Total +
+
+ + Nulla commodo magnanon dolor excepteur nisi aute laborum. + + 1 + 1 + 100 LYD +
+ +
+ + Nulla comm non dolor excepteur elit dolore eiusmod nisi aute laborum. + + 1 + 1 + 100 LYD +
+
+ + Nulla comm non dolor excepteur elit dolore eiusmod nisi aute laborum. + + 1 + 1 + 100 LYD +
+
+ + Nulla comm non dolor excepteur elit dolore eiusmod nisi aute laborum. + + 1 + 1 + 100 LYD +
+
+ + Nulla comm non dolor excepteur elit dolore eiusmod nisi aute laborum. + + 1 + 1 + 100 LYD +
+
+ ); +} diff --git a/client/src/containers/Drawers/PaymentPaperTemplate.js b/client/src/containers/Drawers/PaymentPaperTemplate.js deleted file mode 100644 index c5eb4a3e5..000000000 --- a/client/src/containers/Drawers/PaymentPaperTemplate.js +++ /dev/null @@ -1,102 +0,0 @@ -import React from 'react'; -import { Icon } from 'components'; -import 'style/components/Drawer/DrawerTemplate.scss'; - -export default function PaymentPaperTemplate({ labels: propLabels }) { - const labels = { - title: 'Payment receive', - billedTo: 'Billed to', - paymentDate: 'Payment date', - paymentNo: 'Payment No.', - billedFrom: 'Billed from', - referenceNo: 'Reference No', - amountReceived: 'Amount received', - ...propLabels, - }; - - return ( -
-
-
-
-

{labels.title}

-

info@bigcapital.ly

-
- -
- -
-
- {labels.billedTo} -

Step Currency

-
-
- {labels.paymentDate} -

1/1/2022

-
-
- {labels.paymentNo} -

IN-2022

-
-
- {labels.amountReceived} -

60,000 USD

-
-
- {labels.billedFrom} -

Klay Thompson

-
-
- {labels.referenceNo} -

-
-
-
-
- - Invoice number - - - Invoice date - - - Invoice amount - - - Payment amount - -
- -
- - INV-1 - - - 12 Jan 2021 - - - 50,000 USD - - - 1000 USD - -
-
- - INV-2{' '} - - - 12 Jan 2021 - - - 50,000 USD - - - 1000 USD - -
-
-
-
- ); -} diff --git a/client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplate.js b/client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplate.js new file mode 100644 index 000000000..9fdf6ba31 --- /dev/null +++ b/client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplate.js @@ -0,0 +1,26 @@ +import React from 'react'; +import PaymentPaperTemplateHeader from './PaymentPaperTemplateHeader'; +import PaymentPaperTemplateTable from './PaymentPaperTemplateTable'; +import 'style/components/Drawer/DrawerTemplate.scss'; + +export default function PaymentPaperTemplate({ labels: propLabels }) { + const labels = { + title: 'Payment receive', + billedTo: 'Billed to', + paymentDate: 'Payment date', + paymentNo: 'Payment No.', + billedFrom: 'Billed from', + referenceNo: 'Reference No', + amountReceived: 'Amount received', + ...propLabels, + }; + + return ( +
+
+ + +
+
+ ); +} diff --git a/client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplateHeader.js b/client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplateHeader.js new file mode 100644 index 000000000..7143158c2 --- /dev/null +++ b/client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplateHeader.js @@ -0,0 +1,43 @@ +import React from 'react'; +import { Icon } from 'components'; + +export default function PaymentPaperTemplateHeader({ defaultLabels }) { + return ( + <> +
+
+

{defaultLabels.title}

+

info@bigcapital.ly

+
+ +
+ +
+
+ {defaultLabels.billedTo} +

Step Currency

+
+
+ {defaultLabels.paymentDate} +

1/1/2022

+
+
+ {defaultLabels.paymentNo} +

IN-2022

+
+
+ {defaultLabels.amountReceived} +

60,000 USD

+
+
+ {defaultLabels.billedFrom} +

Klay Thompson

+
+
+ {defaultLabels.referenceNo} +

+
+
+ + ); +} diff --git a/client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplateTable.js b/client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplateTable.js new file mode 100644 index 000000000..8e189ef22 --- /dev/null +++ b/client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplateTable.js @@ -0,0 +1,51 @@ +import React from 'react'; + +export default function PaymentPaperTemplateTable() { + return ( +
+
+ + Invoice number + + + Invoice date + + + Invoice amount + + + Payment amount + +
+ +
+ + INV-1 + + + 12 Jan 2021 + + + 50,000 USD + + + 1000 USD + +
+
+ + INV-2 + + + 12 Jan 2021 + + + 50,000 USD + + + 1000 USD + +
+
+ ); +} diff --git a/client/src/containers/Sales/Estimates/EstimateDetails/EstimateDrawer.js b/client/src/containers/Sales/Estimates/EstimateDetails/EstimateDrawer.js index 1b6c8b2cc..5ada55f73 100644 --- a/client/src/containers/Sales/Estimates/EstimateDetails/EstimateDrawer.js +++ b/client/src/containers/Sales/Estimates/EstimateDetails/EstimateDrawer.js @@ -1,6 +1,6 @@ import React from 'react'; import DrawerTemplate from 'containers/Drawers/DrawerTemplate'; -import PaperTemplate from 'containers/Drawers/PaperTemplate'; +import PaperTemplate from 'containers/Drawers/PaperTemplate/PaperTemplate'; import withDrawers from 'containers/Drawer/withDrawers'; import withDrawerActions from 'containers/Drawer/withDrawerActions'; @@ -18,10 +18,11 @@ function EstimateDrawer({ const handleDrawerClose = () => { closeDrawer(name); }; + return ( - + ); } diff --git a/client/src/containers/Sales/Invoices/InvoiceDetails/InvoiceDrawer.js b/client/src/containers/Sales/Invoices/InvoiceDetails/InvoiceDrawer.js index 58de80ad8..ffeadb9e3 100644 --- a/client/src/containers/Sales/Invoices/InvoiceDetails/InvoiceDrawer.js +++ b/client/src/containers/Sales/Invoices/InvoiceDetails/InvoiceDrawer.js @@ -1,6 +1,6 @@ import React from 'react'; import DrawerTemplate from 'containers/Drawers/DrawerTemplate'; -import PaperTemplate from 'containers/Drawers/PaperTemplate'; +import PaperTemplate from 'containers/Drawers/PaperTemplate/PaperTemplate'; import withDrawers from 'containers/Drawer/withDrawers'; import withDrawerActions from 'containers/Drawer/withDrawerActions'; diff --git a/client/src/containers/Sales/PaymentReceives/PaymentDetails/PaymentDrawer.js b/client/src/containers/Sales/PaymentReceives/PaymentDetails/PaymentDrawer.js index a2cf23a5d..974926d40 100644 --- a/client/src/containers/Sales/PaymentReceives/PaymentDetails/PaymentDrawer.js +++ b/client/src/containers/Sales/PaymentReceives/PaymentDetails/PaymentDrawer.js @@ -1,6 +1,6 @@ import React from 'react'; import DrawerTemplate from 'containers/Drawers/DrawerTemplate'; -import PaymentPaperTemplate from 'containers/Drawers/PaymentPaperTemplate'; +import PaymentPaperTemplate from 'containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplate'; import withDrawers from 'containers/Drawer/withDrawers'; import withDrawerActions from 'containers/Drawer/withDrawerActions'; diff --git a/client/src/containers/Sales/Receipts/ReceiptDetails/ReceiptDrawer.js b/client/src/containers/Sales/Receipts/ReceiptDetails/ReceiptDrawer.js index 9434e4a38..3c1d3079e 100644 --- a/client/src/containers/Sales/Receipts/ReceiptDetails/ReceiptDrawer.js +++ b/client/src/containers/Sales/Receipts/ReceiptDetails/ReceiptDrawer.js @@ -1,6 +1,6 @@ import React from 'react'; import DrawerTemplate from 'containers/Drawers/DrawerTemplate'; -import PaperTemplate from 'containers/Drawers/PaperTemplate'; +import PaperTemplate from 'containers/Drawers/PaperTemplate/PaperTemplate'; import withDrawers from 'containers/Drawer/withDrawers'; import withDrawerActions from 'containers/Drawer/withDrawerActions';