QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-18 13:50:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: homepage.

Browse Source
This commit is contained in:
elforjani3
2021-02-23 17:41:05 +02:00
parent dab43faff2
commit c1f7e498b4
9 changed files with 203 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
client/src/containers/Homepage/AccountsPayableSection.js Normal file
View File

@@ -0,0 +1,7 @@
import React from 'react';
import ShortcutBoxesSection from './ShortcutBoxesSection';
import { accountsPayable } from 'common/homepageOptions';
export default function AccountsPayableSection() {
return <ShortcutBoxesSection section={accountsPayable} />;
}

7
client/src/containers/Homepage/AccountsReceivableSection.js Normal file
View File

@@ -0,0 +1,7 @@
import React from 'react';
import ShortcutBoxesSection from './ShortcutBoxesSection';
import { accountsReceivable } from 'common/homepageOptions';
export default function AccountsReceivableSection() {
return <ShortcutBoxesSection section={accountsReceivable} />;
}

7
client/src/containers/Homepage/FinancialAccountingSection.js Normal file
View File

@@ -0,0 +1,7 @@
import React from 'react';
import ShortcutBoxesSection from './ShortcutBoxesSection';
import { financialAccounting } from 'common/homepageOptions';
export default function FinancialAccountingSection() {
return <ShortcutBoxesSection section={financialAccounting} />;
}

15
client/src/containers/Homepage/HomepageContent.js
View File

@@ -1,14 +1,17 @@
import React from 'react';
import ShortcutBoxes from './ShortcutBoxes';
import AnnouncementList from './AnnouncementList';
import AccountsReceivableSection from './AccountsReceivableSection';
import AccountsPayableSection from './AccountsPayableSection';
import FinancialAccountingSection from './FinancialAccountingSection';
import ProductsServicesSection from './ProductsServicesSection';
import 'style/pages/HomePage/HomePage.scss';
function HomepageContent() {
return (
<div className={'homepage__container'}>
<ShortcutBoxes />
<AnnouncementList />
<div>
<AccountsReceivableSection />
<AccountsPayableSection />
<FinancialAccountingSection />
<ProductsServicesSection />
</div>
);
}

7
client/src/containers/Homepage/ProductsServicesSection.js Normal file
View File

@@ -0,0 +1,7 @@
import React from 'react';
import ShortcutBoxesSection from './ShortcutBoxesSection';
import { productsServices } from 'common/homepageOptions';
export default function ProductsServicesSection() {
return <ShortcutBoxesSection section={productsServices} />;
}

45
client/src/containers/Homepage/ShortcutBoxes.js
View File

@@ -1,45 +0,0 @@
import React from 'react';
import { FormattedMessage as T, useIntl } from 'react-intl';
import classNames from 'classnames';
import { shortcutBox } from 'common/homepageOptions';
import { Icon } from 'components';
function ShortcutBox({ title, iconColor, description }) {
return (
<div className={'shortcut-box'}>
<div className={'shortcut-box__header'}>
<span
className={'header--icon'}
style={{ backgroundColor: `${iconColor}` }}
>
<Icon icon={'clock'} iconSize={24} />
</span>
<span>
<a href={'#'}>
<Icon icon={'arrow-top-right'} iconSize={24} />
</a>
</span>
</div>
<div className={'shortcut-box__title'}>{title}</div>
<div className={'shortcut-box__description'}>{description}</div>
</div>
);
}
function ShortcutBoxes() {
return (
<section className={'shortcut-boxes'}>
{shortcutBox.map(({ title, description, iconColor }) => {
return (
<ShortcutBox
title={title}
description={description}
iconColor={iconColor}
/>
);
})}
</section>
);
}
export default ShortcutBoxes;

39
client/src/containers/Homepage/ShortcutBoxesSection.js Normal file
View File

@@ -0,0 +1,39 @@
import React from 'react';
import { Link } from 'react-router-dom';
import { For } from 'components';
import 'style/pages/FinancialStatements/FinancialSheets.scss';
function ShortcutBox({ title, link, description }) {
return (
<div className={'financial-reports__item'}>
<Link className="title" to={link}>
{title}
</Link>
<p className="desc">{description}</p>
</div>
);
}
function ShortcutBoxes({ sectionTitle, shortcuts }) {
return (
<div className="financial-reports__section">
<div className="section-title">{sectionTitle}</div>
<div className="financial-reports__list">
<For render={ShortcutBox} of={shortcuts} />
{/* {shortcuts.map(({ title, link, description }) => (
<ShortcutBox title={title} description={description} link={link} />
))} */}
</div>
</div>
);
}
export default function ShortcutBoxesSection({ section }) {
return (
<div className="financial-reports">
<For render={ShortcutBoxes} of={section} />
</div>
);
}