fix(FinancialReport): BIG-205 Financial reports missing border final border bottom.

This commit is contained in:
a.bouhuolia
2022-01-02 17:24:35 +02:00
parent aba732724b
commit ecda9296b8
7 changed files with 107 additions and 57 deletions

View File

@@ -1,13 +1,12 @@
import React, { useMemo, useCallback } from 'react';
import React, { useMemo } from 'react';
import intl from 'react-intl-universal';
import classNames from 'classnames';
import FinancialSheet from 'components/FinancialSheet';
import DataTable from 'components/DataTable';
import { useCustomersTransactionsColumns } from './components';
import { useCustomersTransactionsContext } from './CustomersTransactionsProvider';
import { defaultExpanderReducer, getColumnWidth } from 'utils';
import { defaultExpanderReducer } from 'utils';
/**
* Customers transactions table.
@@ -16,19 +15,20 @@ export default function CustomersTransactionsTable({
// #ownProps
companyName,
}) {
// Customers transactions context.
const {
customersTransactions: { tableRows },
isCustomersTransactionsLoading,
query,
} = useCustomersTransactionsContext();
// Customers transactions table columns.
const columns = useCustomersTransactionsColumns();
const expandedRows = useMemo(() => defaultExpanderReducer(tableRows, 4), [
tableRows,
]);
const expandedRows = useMemo(
() => defaultExpanderReducer(tableRows, 4),
[tableRows],
);
const rowClassNames = (row) => {
return [`row-type--${row.original.row_types}`];

View File

@@ -18,6 +18,7 @@ const columnsMapper = (data, index, column) => ({
magicSpacing: 10,
}),
disableSortBy: true,
textOverview: true,
});
/**

View File

@@ -1,13 +1,12 @@
import React, { useMemo, useCallback } from 'react';
import React, { useMemo } from 'react';
import intl from 'react-intl-universal';
import classNames from 'classnames';
import FinancialSheet from 'components/FinancialSheet';
import DataTable from 'components/DataTable';
import { useVendorsTransactionsColumns } from './components';
import { useVendorsTransactionsContext } from './VendorsTransactionsProvider';
import { defaultExpanderReducer, getColumnWidth } from 'utils';
import { defaultExpanderReducer } from 'utils';
/**
* Vendors transactions table.
@@ -17,19 +16,20 @@ export default function VendorsTransactionsTable({
// #ownProps
companyName,
}) {
// Vendor transactions context.
const {
vendorsTransactions: { tableRows },
isVendorsTransactionsLoading,
query,
} = useVendorsTransactionsContext();
// Retireve vendor transactions table columns.
const columns = useVendorsTransactionsColumns();
const expandedRows = useMemo(() => defaultExpanderReducer(tableRows, 5), [
tableRows,
]);
const expandedRows = useMemo(
() => defaultExpanderReducer(tableRows, 5),
[tableRows],
);
const rowClassNames = (row) => {
return [`row-type--${row.original.row_types}`];

View File

@@ -1,25 +1,26 @@
.financial-sheet {
&--customers-balance-summary,
&--vendors-balance-summary {
.financial-sheet__table {
.thead,
.tbody {
.tr .td.customer_name ~ .td,
.tr .th.customer_name ~ .th {
.tr .td.customer_name~.td,
.tr .th.customer_name~.th {
text-align: right;
}
}
.tbody {
.tr:not(.no-results) {
&.row-type--CUSTOMER,
&.row-type--VENDOR {
border-top: 1px solid #BBB
}
.td {
border-bottom: 0;
padding-top: 0.4rem;
padding-bottom: 0.4rem;
}
&.row-type--TOTAL {
font-weight: 500;
@@ -33,6 +34,7 @@
}
}
}
.financial-statement--balance-summary {
.financial-header-drawer {
.bp3-drawer {
@@ -40,4 +42,4 @@
max-height: 415px;
}
}
}
}

View File

@@ -1,13 +1,17 @@
.financial-sheet {
&--customer-transactions,
&--vendor-transactions {
width: 100%;
.financial-sheet__table {
.tbody,
.thead {
.tr .td,
.tr .th {
&.credit,
&.debit,
&.running_balance {
@@ -15,6 +19,7 @@
}
}
}
.tbody {
.tr .td {
padding-top: 0.2rem;
@@ -24,39 +29,51 @@
&.customer_name,
&.vendor_name {
> div {
>div {
display: flex;
}
span.force-width {
position: relative;
}
}
}
.tr:not(.no-results) .td {
border-left: 1px solid #ececec;
}
.tr:last-child .td {
border-bottom: 1px solid #e0e0e0;
}
.tr.row-type {
&--CUSTOMER,
&--VENDOR {
.td {
&.customer_name,
&.vendor_name {
font-weight: 500;
}
&.name {
// border-left-color: transparent;
}
}
&:not(:first-child).is-expanded .td {
border-top: 1px solid #ddd;
}
}
&--OPENING_BALANCE,
// &--TRANSACTION,
&--CLOSING_BALANCE {
font-weight: 500;
}
&--CUSTOMER,
&--VENDOR {
&.is-expanded {
@@ -64,10 +81,12 @@
display: none;
}
}
&:not(:first-child).is-expanded .td {
border-top: 1px solid #ddd;
}
}
&--CUSTOMER:last-child,
&--VENDOR:last-child {
.td {
@@ -86,4 +105,4 @@
max-height: 450px;
}
}
}
}

View File

@@ -1,75 +1,88 @@
.financial-sheet {
&--general-ledger {
.financial-sheet__table {
.financial-sheet{
&--general-ledger{
.financial-sheet__table{
.tbody,
.thead{
.thead {
.tr .td,
.tr .th{
.tr .th {
&.credit,
&.debit,
&.running_balance,
&.amount{
&.amount {
text-align: right;
}
}
}
.tbody{
.tr .td{
.tbody {
.tr .td {
padding-top: 0.2rem;
padding-bottom: 0.2rem;
border-top-color: transparent;
border-bottom-color: transparent;
&.date{
> div{
&.date {
>div {
display: flex;
}
span.force-width{
span.force-width {
position: relative;
}
}
}
.tr:not(.no-results) .td{
.tr:not(.no-results) .td {
border-left: 1px solid #ececec;
}
.tr{
&.is-expanded{
.tr:last-child .td {
border-bottom: 1px solid #ececec;
}
.td.amount{
.tr {
&.is-expanded {
.cell-inner{
.td.amount {
.cell-inner {
display: none
}
}
}
}
.tr.row-type{
.tr.row-type {
&--ACCOUNT_ROW{
.td{
&.date{
&--ACCOUNT_ROW {
.td {
&.date {
font-weight: 500;
}
&.name{
&.name {
border-left-color: transparent;
}
}
&:not(:first-child).is-expanded .td{
&:not(:first-child).is-expanded .td {
border-top: 1px solid #DDD;
}
}
&--OPENING_BALANCE,
&--CLOSING_BALANCE{
.amount{
&--CLOSING_BALANCE {
.amount {
font-weight: 500;
}
}
&--CLOSING_BALANCE{
.name{
&--CLOSING_BALANCE {
.name {
font-weight: 500;
}
}

View File

@@ -3,21 +3,25 @@
width: 100%;
.financial-sheet__table {
.tbody,
.thead {
.tr .td.transaction_id ~ .td,
.tr .th.transaction_id ~ .th {
.tr .td.transaction_id~.td,
.tr .th.transaction_id~.th {
text-align: right;
}
}
.tbody {
.tr .td {
padding-top: 0.2rem;
padding-bottom: 0.2rem;
border-top-color: transparent;
border-bottom-color: transparent;
&.date {
> div {
>div {
display: flex;
}
@@ -26,10 +30,15 @@
}
}
}
.tr:not(.no-results) .td {
border-left: 1px solid #ececec;
}
.tr:last-child .td {
border-bottom: 1px solid #ddd;
}
.tr.row-type {
&--ITEM {
.td {
@@ -37,15 +46,18 @@
border-left-color: transparent;
}
}
&:not(:first-child).is-expanded .td {
border-top: 1px solid #ddd;
}
}
&--ITEM,
&--OPENING_ENTRY,
&--CLOSING_ENTRY {
font-weight: 500;
}
&--ITEM {
&.is-expanded {
.td.value .cell-inner {
@@ -58,20 +70,23 @@
}
}
}
.number-format-dropdown {
.toggles-fields {
.bp3-form-group:first-child {
display: none;
}
}
.form-group--money-format {
display: none;
}
}
.financial-statement--inventory-details {
.financial-header-drawer {
.bp3-drawer {
max-height: 350px;
}
}
}
}