Added division into Enterprise and SaaS, added reducer for payments
This commit is contained in:
parent
792f2368ce
commit
3a756ed4e9
@ -18,9 +18,7 @@ const About = lazy(() => import("./components/pages/About"));
|
|||||||
const Confirm = lazy(() => import("./components/pages/Confirm"));
|
const Confirm = lazy(() => import("./components/pages/Confirm"));
|
||||||
const Settings = lazy(() => import("./components/pages/Settings"));
|
const Settings = lazy(() => import("./components/pages/Settings"));
|
||||||
const Wizard = lazy(() => import("./components/pages/Wizard"));
|
const Wizard = lazy(() => import("./components/pages/Wizard"));
|
||||||
const PaymentsEnterprise = lazy(() =>
|
const Payments = lazy(() => import("./components/pages/Payments"));
|
||||||
import("./components/pages/PaymentsEnterprise")
|
|
||||||
);
|
|
||||||
|
|
||||||
const App = () => {
|
const App = () => {
|
||||||
return navigator.onLine ? (
|
return navigator.onLine ? (
|
||||||
@ -48,7 +46,7 @@ const App = () => {
|
|||||||
/>
|
/>
|
||||||
<PrivateRoute exact path="/about" component={About} />
|
<PrivateRoute exact path="/about" component={About} />
|
||||||
<PrivateRoute restricted path="/settings" component={Settings} />
|
<PrivateRoute restricted path="/settings" component={Settings} />
|
||||||
<PrivateRoute path="/payments" component={PaymentsEnterprise} />
|
<PrivateRoute path="/payments" component={Payments} />
|
||||||
<PrivateRoute
|
<PrivateRoute
|
||||||
exact
|
exact
|
||||||
path={["/coming-soon"]}
|
path={["/coming-soon"]}
|
||||||
|
20
web/ASC.Web.Client/src/components/pages/Payments/index.js
Normal file
20
web/ASC.Web.Client/src/components/pages/Payments/index.js
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
import React from "react";
|
||||||
|
|
||||||
|
import { withRouter } from "react-router";
|
||||||
|
import { connect } from "react-redux";
|
||||||
|
import PaymentsEnterprise from "../PaymentsEnterprise";
|
||||||
|
import PaymentsSaaS from "../PaymentsSaaS";
|
||||||
|
class Payments extends React.Component {
|
||||||
|
render() {
|
||||||
|
const { standAloneMode } = this.props;
|
||||||
|
return standAloneMode ? <PaymentsEnterprise /> : <PaymentsSaaS />;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function mapStateToProps(state) {
|
||||||
|
return {
|
||||||
|
standAloneMode: state.payments.standAloneMode,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(mapStateToProps)(withRouter(Payments));
|
@ -1,5 +1,5 @@
|
|||||||
import React, { useEffect } from "react";
|
import React, { useEffect } from "react";
|
||||||
import { PageLayout, utils } from "asc-web-common";
|
import { PageLayout, utils, Error404 } from "asc-web-common";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
|
|
||||||
import { Loader, utils as Utils } from "asc-web-components";
|
import { Loader, utils as Utils } from "asc-web-components";
|
||||||
@ -32,11 +32,11 @@ const StyledBody = styled.div`
|
|||||||
}
|
}
|
||||||
@media ${mobile} {
|
@media ${mobile} {
|
||||||
width: 343px;
|
width: 343px;
|
||||||
margin-right: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const Body = ({ standAloneMode, isLoaded }) => {
|
const Body = ({ standAloneMode, isLoaded, salesEmail, helpUrl, buyUrl }) => {
|
||||||
const { t } = useTranslation("translation", { i18n });
|
const { t } = useTranslation("translation", { i18n });
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
changeLanguage(i18n);
|
changeLanguage(i18n);
|
||||||
@ -49,8 +49,8 @@ const Body = ({ standAloneMode, isLoaded }) => {
|
|||||||
<StyledBody>
|
<StyledBody>
|
||||||
<HeaderContainer t={t} />
|
<HeaderContainer t={t} />
|
||||||
<AdvantagesContainer t={t} />
|
<AdvantagesContainer t={t} />
|
||||||
<ButtonContainer t={t} />
|
<ButtonContainer t={t} buyUrl={buyUrl} />
|
||||||
<ContactContainer t={t} />
|
<ContactContainer t={t} salesEmail={salesEmail} helpUrl={helpUrl} />
|
||||||
</StyledBody>
|
</StyledBody>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
@ -70,8 +70,11 @@ PaymentsEnterprise.propTypes = {
|
|||||||
|
|
||||||
function mapStateToProps(state) {
|
function mapStateToProps(state) {
|
||||||
return {
|
return {
|
||||||
standAloneMode: state.auth.settings.standAloneMode,
|
standAloneMode: state.payments.standAloneMode,
|
||||||
isLoaded: state.auth.isLoaded,
|
isLoaded: state.auth.isLoaded,
|
||||||
|
salesEmail: state.payments.salesEmail,
|
||||||
|
helpUrl: state.payments.helpUrl,
|
||||||
|
buyUrl: state.payments.buyUrl,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
export default connect(mapStateToProps)(withRouter(PaymentsEnterprise));
|
export default connect(mapStateToProps)(withRouter(PaymentsEnterprise));
|
||||||
|
@ -37,7 +37,7 @@ const StyledBodyAdvantages = styled.div`
|
|||||||
margin: 224px 864px 193px 32px;
|
margin: 224px 864px 193px 32px;
|
||||||
}
|
}
|
||||||
.payments-body {
|
.payments-body {
|
||||||
/* margin-right: 609px; */
|
margin-right: 609px;
|
||||||
margin-bottom: 22px;
|
margin-bottom: 22px;
|
||||||
margin-left: 64px;
|
margin-left: 64px;
|
||||||
|
|
||||||
@ -47,9 +47,9 @@ const StyledBodyAdvantages = styled.div`
|
|||||||
}
|
}
|
||||||
.first-advantages {
|
.first-advantages {
|
||||||
margin-top: 37px;
|
margin-top: 37px;
|
||||||
/* width: 247px; */
|
width: 247px;
|
||||||
}
|
}
|
||||||
/* .second-advantages {
|
.second-advantages {
|
||||||
width: 278px;
|
width: 278px;
|
||||||
}
|
}
|
||||||
.third-advantages {
|
.third-advantages {
|
||||||
@ -60,7 +60,7 @@ const StyledBodyAdvantages = styled.div`
|
|||||||
}
|
}
|
||||||
.five-advantages {
|
.five-advantages {
|
||||||
width: 276px;
|
width: 276px;
|
||||||
} */
|
}
|
||||||
.advantages-enterprise {
|
.advantages-enterprise {
|
||||||
width: 856px;
|
width: 856px;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
|
@ -4,12 +4,11 @@ import styled from "styled-components";
|
|||||||
|
|
||||||
import { Button, utils } from "asc-web-components";
|
import { Button, utils } from "asc-web-components";
|
||||||
import { store, history } from "asc-web-common";
|
import { store, history } from "asc-web-common";
|
||||||
const { getPortalSettings, setIsLoaded } = store.auth.actions;
|
// const { getPortalSettings, setIsLoaded } = store.auth.actions;
|
||||||
const { tablet, mobile } = utils.device;
|
const { tablet, mobile } = utils.device;
|
||||||
|
|
||||||
const onButtonClickBuy = (e) => {
|
const onButtonClickBuy = (e) => {
|
||||||
getPortalSettings(store.dispatch)
|
window.open(e.target.value, "_blank");
|
||||||
.then(() => store.dispatch(setIsLoaded(true)))
|
|
||||||
.catch((e) => history.push(`/login/error=${e}`));
|
|
||||||
};
|
};
|
||||||
const StyledButtonContainer = styled.div`
|
const StyledButtonContainer = styled.div`
|
||||||
position: static;
|
position: static;
|
||||||
@ -70,12 +69,13 @@ const StyledButtonContainer = styled.div`
|
|||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const ButtonContainer = ({ t }) => {
|
const ButtonContainer = ({ t, buyUrl }) => {
|
||||||
return (
|
return (
|
||||||
<StyledButtonContainer>
|
<StyledButtonContainer>
|
||||||
<Button
|
<Button
|
||||||
className="button-payments-enterprise button-buy"
|
className="button-payments-enterprise button-buy"
|
||||||
label="Buy now"
|
label="Buy now"
|
||||||
|
value={`${buyUrl}`}
|
||||||
onClick={onButtonClickBuy}
|
onClick={onButtonClickBuy}
|
||||||
/>
|
/>
|
||||||
<Button
|
<Button
|
||||||
|
@ -3,8 +3,7 @@ import PropTypes from "prop-types";
|
|||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
|
|
||||||
import { Text, Link, utils } from "asc-web-components";
|
import { Text, Link, utils } from "asc-web-components";
|
||||||
const supportLinkPurchaseQuestions = "sales@onlyoffice.com";
|
|
||||||
const supportLinkTechnicalIssues = "https://helpdesk.onlyoffice.com";
|
|
||||||
const { tablet, mobile } = utils.device;
|
const { tablet, mobile } = utils.device;
|
||||||
const StyledContactContainer = styled.div`
|
const StyledContactContainer = styled.div`
|
||||||
.contact-emails {
|
.contact-emails {
|
||||||
@ -24,25 +23,23 @@ const StyledContactContainer = styled.div`
|
|||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const ContactContainer = ({ t }) => {
|
const ContactContainer = ({ t, salesEmail, helpUrl }) => {
|
||||||
return (
|
return (
|
||||||
<StyledContactContainer>
|
<StyledContactContainer>
|
||||||
<Text className="contact-emails">
|
<Text className="contact-emails">
|
||||||
{t("PurchaseQuestions")}{" "}
|
{t("PurchaseQuestions")}{" "}
|
||||||
<Link
|
<Link className="contact-emails_link" href={`mailto:${salesEmail}`}>
|
||||||
className="contact-emails_link"
|
{salesEmail}
|
||||||
href={`mailto:${supportLinkPurchaseQuestions}`}
|
|
||||||
>
|
|
||||||
{supportLinkPurchaseQuestions}
|
|
||||||
</Link>
|
</Link>
|
||||||
</Text>
|
</Text>
|
||||||
<Text className="contact-emails">
|
<Text className="contact-emails">
|
||||||
{t("TechnicalIssues")}{" "}
|
{t("TechnicalIssues")}{" "}
|
||||||
<Link
|
<Link
|
||||||
|
target="\_blank"
|
||||||
className="contact-emails_link"
|
className="contact-emails_link"
|
||||||
href={`${supportLinkTechnicalIssues}`}
|
href={`${helpUrl}`}
|
||||||
>
|
>
|
||||||
{supportLinkTechnicalIssues}
|
{helpUrl}
|
||||||
</Link>
|
</Link>
|
||||||
</Text>
|
</Text>
|
||||||
</StyledContactContainer>
|
</StyledContactContainer>
|
||||||
|
@ -0,0 +1,10 @@
|
|||||||
|
import React from "react";
|
||||||
|
import { Text } from "asc-web-components";
|
||||||
|
|
||||||
|
class PaymentsSaaS extends React.Component {
|
||||||
|
render() {
|
||||||
|
return <Text>Comming soon</Text>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default PaymentsSaaS;
|
@ -0,0 +1,18 @@
|
|||||||
|
// import {} from "./actions";
|
||||||
|
|
||||||
|
const initialState = {
|
||||||
|
salesEmail: "sales@onlyoffice.com",
|
||||||
|
helpUrl: "https://helpdesk.onlyoffice.com",
|
||||||
|
buyUrl: "http://www.onlyoffice.com/post.ashx?type=buyenterprise",
|
||||||
|
standAloneMode: true,
|
||||||
|
};
|
||||||
|
|
||||||
|
const paymentsReducer = (state = initialState, action) => {
|
||||||
|
switch (action.type) {
|
||||||
|
// case
|
||||||
|
default:
|
||||||
|
return state;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
export default paymentsReducer;
|
@ -1,16 +1,18 @@
|
|||||||
import { combineReducers } from 'redux';
|
import { combineReducers } from "redux";
|
||||||
import settingsReducer from './settings/reducer';
|
import settingsReducer from "./settings/reducer";
|
||||||
import confirmReducer from './confirm/reducer';
|
import confirmReducer from "./confirm/reducer";
|
||||||
import { store } from 'asc-web-common';
|
import { store } from "asc-web-common";
|
||||||
import wizardReducer from './wizard/reducer';
|
import wizardReducer from "./wizard/reducer";
|
||||||
|
import paymentsReducer from "./payments/reducer";
|
||||||
|
|
||||||
const { reducer: authReducer } = store.auth;
|
const { reducer: authReducer } = store.auth;
|
||||||
|
|
||||||
const rootReducer = combineReducers({
|
const rootReducer = combineReducers({
|
||||||
auth: authReducer,
|
auth: authReducer,
|
||||||
settings: settingsReducer,
|
settings: settingsReducer,
|
||||||
confirm: confirmReducer,
|
confirm: confirmReducer,
|
||||||
wizard: wizardReducer
|
wizard: wizardReducer,
|
||||||
|
payments: paymentsReducer,
|
||||||
});
|
});
|
||||||
|
|
||||||
export default rootReducer;
|
export default rootReducer;
|
Loading…
Reference in New Issue
Block a user