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

Fix : setupSubScription & BillingForm & setupOrganizationForm

Browse Source
This commit is contained in:
elforjani3
2020-10-12 17:40:39 +02:00
parent ecc814ab61
commit 5b95ea4047
8 changed files with 101 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
client/src/containers/Preferences/General/General.js
View File

@@ -40,7 +40,6 @@ function GeneralPreferences({
}) {
const { formatMessage } = useIntl();
const [selectedItems, setSelectedItems] = useState({});
const [timeZone, setTimeZone] = useState('');
const fetchHook = useQuery(
['settings'],
@@ -65,67 +64,89 @@ function GeneralPreferences({
{ id: 1, name: 'Libyan Dinar ', value: 'LYD' },
];
// @todo @mohamed - Translate the months.
// eg. > `${formatMessage({ id: 'january' })} - ${formatMessage({ id: 'december' })}`
const fiscalYear = [
{
id: 0,
name: `${formatMessage({ id: 'january' })} - ${formatMessage({ id: 'december' })}`,
name: `${formatMessage({ id: 'january' })} - ${formatMessage({
id: 'december',
})}`,
value: 'january',
},
{
id: 1,
name: `${formatMessage({ id: 'february' })} - ${formatMessage({ id: 'january' })}`,
name: `${formatMessage({ id: 'february' })} - ${formatMessage({
id: 'january',
})}`,
value: 'february',
},
{
id: 2,
name: `${formatMessage({ id: 'march' })} - ${formatMessage({ id: 'february' })}`,
name: `${formatMessage({ id: 'march' })} - ${formatMessage({
id: 'february',
})}`,
value: 'March',
},
{
id: 3,
name: `${formatMessage({ id: 'april' })} - ${formatMessage({ id: 'march' })}`,
name: `${formatMessage({ id: 'april' })} - ${formatMessage({
id: 'march',
})}`,
value: 'april',
},
{
id: 4,
name: `${formatMessage({ id: 'may' })} - ${formatMessage({ id: 'april' })}`,
name: `${formatMessage({ id: 'may' })} - ${formatMessage({
id: 'april',
})}`,
value: 'may',
},
{
id: 5,
name: `${formatMessage({ id: 'june' })} - ${formatMessage({ id: 'may' })}`,
name: `${formatMessage({ id: 'june' })} - ${formatMessage({
id: 'may',
})}`,
value: 'june',
},
{
id: 6,
name: `${formatMessage({ id: 'july' })} - ${formatMessage({ id: 'june' })}`,
name: `${formatMessage({ id: 'july' })} - ${formatMessage({
id: 'june',
})}`,
value: 'july',
},
{
id: 7,
name: `${formatMessage({ id: 'august' })} - ${formatMessage({ id: 'july' })}`,
name: `${formatMessage({ id: 'august' })} - ${formatMessage({
id: 'july',
})}`,
value: 'August',
},
{
id: 8,
name: `${formatMessage({ id: 'september' })} - ${formatMessage({ id: 'august' })}`,
name: `${formatMessage({ id: 'september' })} - ${formatMessage({
id: 'august',
})}`,
value: 'september',
},
{
id: 9,
name: `${formatMessage({ id: 'october' })} - ${formatMessage({ id: 'november' })}`,
name: `${formatMessage({ id: 'october' })} - ${formatMessage({
id: 'november',
})}`,
value: 'october',
},
{
id: 10,
name: `${formatMessage({ id: 'november' })} - ${formatMessage({ id: 'october' })}`,
name: `${formatMessage({ id: 'november' })} - ${formatMessage({
id: 'october',
})}`,
value: 'november',
},
{
id: 11,
name: `${formatMessage({ id: 'december' })} - ${formatMessage({ id: 'november' })}`,
name: `${formatMessage({ id: 'december' })} - ${formatMessage({
id: 'november',
})}`,
value: 'december',
},
];
@@ -185,9 +206,9 @@ function GeneralPreferences({
language: Yup.string()
.required()
.label(formatMessage({ id: 'language' })),
// time_zone: Yup.string()
// .required()
// .label(formatMessage({ id: 'time_zone' })),
time_zone: Yup.string()
.required()
.label(formatMessage({ id: 'time_zone_' })),
date_format: Yup.string()
.required()
.label(formatMessage({ id: 'date_format_' })),
@@ -230,15 +251,8 @@ function GeneralPreferences({
},
});
// @todo @mohamed remove duplicate functions.
const onItemRenderer = (item, { handleClick }) => (
<MenuItem
key={item.id}
text={item.name}
onClick={handleClick}
/>
<MenuItem key={item.id} text={item.name} onClick={handleClick} />
);
const currencyItem = (item, { handleClick }) => (
@@ -280,8 +294,12 @@ function GeneralPreferences({
}
};
const handleTimezoneChange = (timezone) => setTimeZone(timezone);
const handleTimezoneChange = useCallback(
(timezone) => {
setFieldValue('time_zone', timezone);
},
[setFieldValue],
);
return (
<div
className={classNames({
@@ -437,7 +455,7 @@ function GeneralPreferences({
}
>
<TimezonePicker
value={timeZone}
value={values.time_zone}
onChange={handleTimezoneChange}
valueDisplayFormat="composite"
placeholder={<T id={'select_time_zone'} />}

21
client/src/containers/Setup/SetupOrganizationForm.js
View File

@@ -26,10 +26,7 @@ import withOrganizationActions from 'containers/Organization/withOrganizationAct
import { compose, optionsMapToArray } from 'utils';
function SetupOrganizationForm({
requestSubmitOptions,
requestSeedTenant
}) {
function SetupOrganizationForm({ requestSubmitOptions, requestSeedTenant }) {
const { formatMessage } = useIntl();
const [selected, setSelected] = useState();
const history = useHistory();
@@ -180,11 +177,10 @@ function SetupOrganizationForm({
const options = optionsMapToArray(values).map((option) => {
return { key: option.key, ...option, group: 'organization' };
});
console.log(options, 'Op');
requestSubmitOptions({ options })
.then((response) => {
requestSeedTenant().then(() => {
setSubmitting(false);
});
setSubmitting(false);
})
.catch((erros) => {
setSubmitting(false);
@@ -306,8 +302,7 @@ function SetupOrganizationForm({
itemPredicate={filterItems}
selectedItem={values.base_currency}
selectedItemProp={'value'}
// defaultText={<T id={'select_base_currency'} />}
defaultText={'LYD - Libyan Dinar'}
defaultText={<T id={'select_base_currency'} />}
labelProp={'name'}
/>
</FormGroup>
@@ -337,8 +332,7 @@ function SetupOrganizationForm({
itemPredicate={filterItems}
selectedItem={values.language}
selectedItemProp={'value'}
defaultText={'English'}
// defaultText={<T id={'select_language'} />}
defaultText={<T id={'select_language'} />}
labelProp={'name'}
/>
</FormGroup>
@@ -367,8 +361,7 @@ function SetupOrganizationForm({
itemPredicate={filterItems}
selectedItem={values.fiscal_year}
selectedItemProp={'value'}
defaultText={'January - December'}
// defaultText={<T id={'select_fiscal_year'} />}
defaultText={<T id={'select_fiscal_year'} />}
labelProp={'name'}
/>
</FormGroup>
@@ -407,7 +400,7 @@ function SetupOrganizationForm({
intent={Intent.PRIMARY}
loading={isSubmitting}
type="submit"
// loading={isSubmitting}
loading={isSubmitting}
>
<T id={'save_continue'} />
</Button>

52
client/src/containers/Setup/SetupSubscriptionForm.js
View File

@@ -1,33 +1,61 @@
import React, { useMemo } from 'react';
import * as Yup from 'yup';
import { useFormik } from 'formik';
import { FormattedMessage as T } from 'react-intl';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { Button, Intent } from '@blueprintjs/core';
import BillingTab from 'containers/Subscriptions/BillingTab';
import BillingPlans from 'containers/Subscriptions/billingPlans';
import BillingPeriods from 'containers/Subscriptions/billingPeriods';
import { BillingPaymentmethod } from 'containers/Subscriptions/billingPaymentmethod';
import withBillingActions from 'containers/Subscriptions/withBillingActions';
import { compose } from 'utils';
/**
* Subscription step of wizard setup.
*/
export default function SetupSubscriptionForm({
function SetupSubscriptionForm({
//#withBillingActions
requestSubmitBilling,
}) {
const ValidationSchema = Yup.object().shape({});
const { formatMessage } = useIntl();
const initialValues = useMemo(() => ({}), []);
const validationSchema = Yup.object().shape({
plan_slug: Yup.string()
.required()
.label(formatMessage({ id: 'plan_slug' })),
license_code: Yup.string().trim(),
});
const initialValues = useMemo(
() => ({
plan_slug: '',
license_code: '',
}),
[],
);
const formik = useFormik({
enableReinitialize: true,
validationSchema: ValidationSchema,
validationSchema: validationSchema,
initialValues: {
...initialValues,
},
onSubmit: (values, { setSubmitting, setErrors }) => {},
onSubmit: (values, { setSubmitting, setErrors }) => {
requestSubmitBilling(values)
.then((response) => {
setSubmitting(false);
})
.catch((errors) => {
setSubmitting(false);
});
},
});
return (
<div className={'register-subscription-form'}>
<form className={'billing-form'}>
<BillingTab formik={formik} />
<form onSubmit={formik.handleSubmit} className={'billing-form'}>
<BillingPlans title={'a_select_a_plan'} formik={formik} />
<BillingPeriods title={'b_choose_your_billing'} formik={formik} />
<BillingPaymentmethod title={'c_payment_methods'} formik={formik} />
<div className={'subscribe-button'}>
<Button
intent={Intent.PRIMARY}
@@ -41,3 +69,5 @@ export default function SetupSubscriptionForm({
</div>
);
}
export default compose(withBillingActions)(SetupSubscriptionForm);

37
client/src/containers/Subscriptions/BillingForm.js
View File

@@ -3,16 +3,9 @@ import * as Yup from 'yup';
import { useFormik } from 'formik';
import { Button, Intent } from '@blueprintjs/core';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { useHistory } from 'react-router-dom';
import { pick } from 'lodash';
import AppToaster from 'components/AppToaster';
import ErrorMessage from 'components/ErrorMessage';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import { MeteredBillingTabs, PaymentMethodTabs } from './SubscriptionTabs';
import withBillingActions from './withBillingActions';
import withRegisterOrganizationActions from 'containers/Authentication/withRegisterOrganizationActions';
import { compose } from 'utils';
function BillingForm({
@@ -21,17 +14,7 @@ function BillingForm({
//#withBillingActions
requestSubmitBilling,
//#withRegisterOrganizationActions
requestBuildTenant,
}) {
// const defaultPlan = useMemo(() => ({
// plan_slug: [
// { name: 'Basic', value: 'basic' },
// { name: 'Pro', value: 'pro' },
// ],
// }));
const { formatMessage } = useIntl();
useEffect(() => {
@@ -43,14 +26,12 @@ function BillingForm({
.required()
.label(formatMessage({ id: 'plan_slug' })),
license_code: Yup.string().trim(),
period: Yup.string(),
});
const initialValues = useMemo(
() => ({
plan_slug: 'basic',
plan_slug: 'free',
license_code: '',
period: '',
}),
[],
);
@@ -64,15 +45,7 @@ function BillingForm({
onSubmit: (values, { setSubmitting, resetForm, setErrors }) => {
requestSubmitBilling(values)
.then((response) => {
requestBuildTenant().then(() => {
setSubmitting(false);
});
// AppToaster.show({
// message: formatMessage({
// id: 'the_biling_has_been_successfully_created',
// }),
// intent: Intent.SUCCESS,
// });
setSubmitting(false);
})
.catch((errors) => {
setSubmitting(false);
@@ -98,8 +71,4 @@ function BillingForm({
);
}
export default compose(
withDashboardActions,
withRegisterOrganizationActions,
withBillingActions,
)(BillingForm);
export default compose(withDashboardActions, withBillingActions)(BillingForm);

1
client/src/containers/Subscriptions/BillingTab.js
View File

@@ -4,7 +4,6 @@ import BillingPeriods from 'containers/Subscriptions/billingPeriods';
import { BillingPaymentmethod } from 'containers/Subscriptions/billingPaymentmethod';
function BillingTab({ formik }) {
console.log(formik.values, 'val');
return (
<div>
<BillingPlans title={'a_select_a_plan'} formik={formik} />

2
client/src/containers/Subscriptions/billingPlans.js
View File

@@ -76,7 +76,7 @@ function BillingPlans({ formik, title, selected = 1 }) {
slug={plan.slug}
price={plan.price}
currency={plan.currency}
onSelected={() => formik.setFieldValue('plan_slug', plan.name)}
onSelected={() => formik.setFieldValue('plan_slug', plan.slug)}
selected={selected == index + 1}
/>
))}