+ 
+
+
+
+ {title}
+
+
+
+
+
+
+
+ );
+ }}
+ />
+);
+
+export default Error;
diff --git a/front/odiparpack/app/containers/Pages/HelpSupport/ContactForm.js b/front/odiparpack/app/containers/Pages/HelpSupport/ContactForm.js
new file mode 100644
index 0000000..2568943
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/HelpSupport/ContactForm.js
@@ -0,0 +1,115 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import { Field, reduxForm } from 'redux-form/immutable';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import { PapperBlock } from 'ba-components';
+import { initAction, clearAction } from 'ba-actions/ReduxFormActions';
+import { TextFieldRedux } from 'ba-components/Forms/ReduxFormMUI';
+import { Button } from '@material-ui/core';
+import styles from './helpSupport-jss';
+
+// validation functions
+const required = value => (value == null ? 'Required' : undefined);
+const email = value => (
+ value && !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(value)
+ ? 'Invalid email'
+ : undefined
+);
+
+class ContactForm extends Component {
+ render() {
+ const trueBool = true;
+ const {
+ classes,
+ handleSubmit,
+ pristine,
+ reset,
+ submitting,
+ } = this.props;
+ return (
+
+
+
+
+
+ );
+ }
+}
+
+ContactForm.propTypes = {
+ classes: PropTypes.object.isRequired,
+ handleSubmit: PropTypes.func.isRequired,
+ reset: PropTypes.func.isRequired,
+ pristine: PropTypes.bool.isRequired,
+ submitting: PropTypes.bool.isRequired,
+};
+
+const mapDispatchToProps = dispatch => ({
+ init: bindActionCreators(initAction, dispatch),
+ clear: () => dispatch(clearAction),
+});
+
+const ContactFormMapped = reduxForm({
+ form: 'immutableExample',
+})(ContactForm);
+
+const reducer = 'initval';
+const FormInit = connect(
+ state => ({
+ force: state,
+ initialValues: state.getIn([reducer, 'formValues'])
+ }),
+ mapDispatchToProps,
+)(ContactFormMapped);
+
+export default withStyles(styles)(FormInit);
diff --git a/front/odiparpack/app/containers/Pages/HelpSupport/Qna.js b/front/odiparpack/app/containers/Pages/HelpSupport/Qna.js
new file mode 100644
index 0000000..bb8a6ae
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/HelpSupport/Qna.js
@@ -0,0 +1,141 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
+import { ExpansionPanel, ExpansionPanelDetails, ExpansionPanelSummary, Typography } from '@material-ui/core';
+import styles from './helpSupport-jss';
+
+
+class Qna extends React.Component {
+ state = {
+ expanded: null,
+ };
+
+ handleChange = panel => (event, expanded) => {
+ this.setState({
+ expanded: expanded ? panel : false,
+ });
+ };
+
+ render() {
+ const { classes } = this.props;
+ const { expanded } = this.state;
+
+ return (
+
+
+ Pellentesque ac bibendum tortor?
+
+
+
+ Nulla facilisi. Phasellus sollicitudin nulla et quam mattis feugiat. Aliquam eget
+ maximus est, id dignissim quam.
+
+
+
+
+ Vivamus sit amet interdum elit?
+
+
+
+ Donec placerat, lectus sed mattis semper, neque lectus feugiat lectus, varius pulvinar
+ diam eros in elit. Pellentesque convallis laoreet laoreet.
+
+
+
+
+ Vestibulum nec mi suscipit?
+
+
+
+ Nunc vitae orci ultricies, auctor nunc in, volutpat nisl. Integer sit amet egestas
+ eros, vitae egestas augue. Duis vel est augue.
+
+
+
+
+ Cras convallis lacus orci?
+
+
+
+ Nunc vitae orci ultricies, auctor nunc in, volutpat nisl. Integer sit amet egestas
+ eros, vitae egestas augue. Duis vel est augue.
+
+
+
+
+ Quisque ut metus sit amet?
+
+
+
+ enean sit amet magna vel magna fringilla fermentum. Donec sit amet nulla sed arcu pulvinar ultricies commodo id ligula.
+
+
+
+
+ Nulla vehicula leo ut augue tincidunt?
+
+
+
+ Curabitur egestas consequat lorem, vel fermentum augue porta id. Aliquam lobortis magna neque, gravida consequat velit venenatis at.
+
+
+
+
+ Vivamus sit amet interdum elit?
+
+
+
+ Donec dignissim, odio ac imperdiet luctus, ante nisl accumsan justo, et venenatis ante metus pellentesque sem.
+
+
+
+
+ Maecenas nisl libero, tincidunt id odio id?
+
+
+
+ Ut sed eros finibus, placerat orci id, dapibus mauris. Vestibulum consequat hendrerit lacus. In id nisi id neque venenatis molestie.
+
+
+
+
+ Vestibulum nec mi suscipit?
+
+
+
+ Nunc vitae orci ultricies, auctor nunc in, volutpat nisl. Integer sit amet egestas
+ eros, vitae egestas augue. Duis vel est augue.
+
+
+
+
+ Cras convallis lacus orci?
+
+
+
+ Nunc vitae orci ultricies, auctor nunc in, volutpat nisl. Integer sit amet egestas
+ eros, vitae egestas augue. Duis vel est augue.
+
+
+
+
+ );
+ }
+}
+
+Qna.propTypes = {
+ classes: PropTypes.object.isRequired,
+};
+
+export default withStyles(styles)(Qna);
diff --git a/front/odiparpack/app/containers/Pages/HelpSupport/helpSupport-jss.js b/front/odiparpack/app/containers/Pages/HelpSupport/helpSupport-jss.js
new file mode 100644
index 0000000..5c954cb
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/HelpSupport/helpSupport-jss.js
@@ -0,0 +1,49 @@
+const styles = theme => ({
+ title: {
+ display: 'block',
+ margin: `${theme.spacing(3)}px 0`,
+ color: theme.palette.common.white,
+ },
+ iconTitle: {
+ position: 'relative',
+ top: theme.spacing(0.5),
+ marginRight: theme.spacing(0.5),
+ },
+ heading: {
+ fontSize: theme.typography.pxToRem(15),
+ flexBasis: '100%',
+ fontWeight: 700,
+ flexShrink: 0,
+ },
+ secondaryHeading: {
+ fontSize: theme.typography.pxToRem(15),
+ color: theme.palette.text.secondary,
+ },
+ root: {
+ width: '100%',
+ flexGrow: 1,
+ padding: 30
+ },
+ field: {
+ width: '100%',
+ marginBottom: 20
+ },
+ fieldBasic: {
+ width: '100%',
+ marginBottom: 20,
+ marginTop: 10
+ },
+ inlineWrap: {
+ display: 'flex',
+ flexDirection: 'row'
+ },
+ buttonInit: {
+ margin: theme.spacing(4),
+ textAlign: 'center'
+ },
+ frmWrap: {
+ marginTop: theme.spacing(1) * -3
+ }
+});
+
+export default styles;
diff --git a/front/odiparpack/app/containers/Pages/HelpSupport/index.js b/front/odiparpack/app/containers/Pages/HelpSupport/index.js
new file mode 100644
index 0000000..68df97b
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/HelpSupport/index.js
@@ -0,0 +1,58 @@
+import React from 'react';
+import { PropTypes } from 'prop-types';
+import { Helmet } from 'react-helmet';
+import brand from 'ba-api/brand';
+import LiveHelp from '@material-ui/icons/LiveHelp';
+import { isWidthUp } from '@material-ui/core/withWidth';
+import { withStyles } from '@material-ui/core/styles';
+import { Typography, withWidth, Grid } from '@material-ui/core';
+import styles from './helpSupport-jss';
+import Qna from './Qna';
+import ContactForm from './ContactForm';
+
+
+class Settings extends React.Component {
+ showResult(values) {
+ setTimeout(() => {
+ this.setState({ valueForm: values });
+ window.alert(`You submitted:\n\n${this.state.valueForm}`);
+ }, 500); // simulate server latency
+ }
+
+ render() {
+ const title = brand.name;
+ const description = brand.desc;
+ const { classes, width } = this.props;
+ return (
+
+
+ {title}
+
+
+
+
+
+
+
+
+
+
+
+
+ this.showResult(values)} />
+
+
+
+ );
+ }
+}
+
+Settings.propTypes = {
+ classes: PropTypes.object.isRequired,
+ width: PropTypes.string.isRequired,
+};
+
+export default withStyles(styles)(withWidth()(Settings));
diff --git a/front/odiparpack/app/containers/Pages/Maintenance/index.js b/front/odiparpack/app/containers/Pages/Maintenance/index.js
new file mode 100644
index 0000000..8771e51
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/Maintenance/index.js
@@ -0,0 +1,88 @@
+import React from 'react';
+import { Helmet } from 'react-helmet';
+import brand from 'ba-api/brand';
+import PropTypes from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import Build from '@material-ui/icons/Build';
+import Settings from '@material-ui/icons/SettingsApplications';
+import Warning from '@material-ui/icons/Warning';
+import { Typography, Avatar, Hidden, Paper } from '@material-ui/core';
+
+const styles = theme => ({
+ root: {
+ display: 'flex',
+ justifyContent: 'center',
+ alignItems: 'center',
+ height: '100%'
+ },
+ paper: {
+ margin: 'auto',
+ padding: 40,
+ width: '90%',
+ [theme.breakpoints.up('sm')]: {
+ width: 600,
+ height: 300,
+ },
+ textAlign: 'center'
+ },
+ artwork: {
+ display: 'flex',
+ justifyContent: 'center',
+ marginBottom: 30
+ },
+ icon: {
+ margin: '10px 20px',
+ background: theme.palette.secondary.main,
+ color: theme.palette.common.white,
+ width: 100,
+ height: 100,
+ '& svg': {
+ fontSize: 64,
+ },
+ },
+});
+
+class Maintenance extends React.Component {
+ render() {
+ const title = brand.name + ' - Maintenance';
+ const description = brand.desc;
+ const { classes } = this.props;
+ return (
+
+
+ {title}
+
+
+
+
+
+
+
+ );
+ }
+}
+
+Maintenance.propTypes = {
+ classes: PropTypes.object.isRequired,
+};
+
+export default withStyles(styles)(Maintenance);
diff --git a/front/odiparpack/app/containers/Pages/Photos/index.js b/front/odiparpack/app/containers/Pages/Photos/index.js
new file mode 100644
index 0000000..7068ed5
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/Photos/index.js
@@ -0,0 +1,27 @@
+import React from 'react';
+import { Helmet } from 'react-helmet';
+import brand from 'ba-api/brand';
+import imgData from 'ba-api/imgDataMasonry';
+import { PhotoGallery } from 'ba-components';
+
+class Photos extends React.Component {
+ render() {
+ const title = brand.name + ' - Photo Gallery';
+ const description = brand.desc;
+ return (
+
+
+ Website under maintenance
+
+Our website is under maintenance. We
+ {"'"}
+ll be back shortly
+
+
+
+
+
+
+
+
+
+
+
+ {title}
+
+
+
+
+
+
+
+ );
+ }
+}
+
+export default Photos;
diff --git a/front/odiparpack/app/containers/Pages/Settings/DetailSettings.js b/front/odiparpack/app/containers/Pages/Settings/DetailSettings.js
new file mode 100644
index 0000000..25bad64
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/Settings/DetailSettings.js
@@ -0,0 +1,203 @@
+import React from 'react';
+import { PropTypes } from 'prop-types';
+import classNames from 'classnames';
+import SettingsIcon from '@material-ui/icons/SettingsApplications';
+import CloseIcon from '@material-ui/icons/Close';
+import { withStyles } from '@material-ui/core/styles';
+import {
+ AppBar,
+ Grid,
+ Dialog,
+ Toolbar,
+ ListItemText,
+ ListItem,
+ List,
+ ListItemSecondaryAction,
+ Divider,
+ IconButton,
+ Typography,
+ Button,
+ Switch,
+ Slide,
+ InputLabel,
+ MenuItem,
+ FormControl,
+ Select,
+ Checkbox,
+ TextField,
+} from '@material-ui/core';
+import styles from './settings-jss';
+
+
+const Transition = React.forwardRef(function Transition(props, ref) { // eslint-disable-line
+ return
+
+ {title}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {settingList.map(menu => {
+ const rawKey = menu.name + menu.caption;
+ if (rawKey.toLowerCase().indexOf(keyword) === -1) {
+ return false;
+ }
+ return (
+
+
+
+ );
+ })}
+
+
+
+ );
+ }
+}
+
+Settings.propTypes = {
+ classes: PropTypes.object.isRequired,
+};
+
+export default withStyles(styles)(Settings);
diff --git a/front/odiparpack/app/containers/Pages/Settings/settings-jss.js b/front/odiparpack/app/containers/Pages/Settings/settings-jss.js
new file mode 100644
index 0000000..5424d4e
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/Settings/settings-jss.js
@@ -0,0 +1,87 @@
+const styles = theme => ({
+ appBar: {
+ position: 'relative',
+ },
+ flex: {
+ flex: 1,
+ },
+ title: {
+ display: 'block',
+ margin: `${theme.spacing(3)}px 0`,
+ color: theme.palette.common.white,
+ },
+ searchSettings: {
+ marginBottom: theme.spacing(4),
+ },
+ wrapper: {
+ fontFamily: theme.typography.fontFamily,
+ position: 'relative',
+ marginRight: theme.spacing(2),
+ marginLeft: theme.spacing(1),
+ borderRadius: 2,
+ display: 'block',
+ },
+ search: {
+ width: 'auto',
+ height: '100%',
+ position: 'absolute',
+ pointerEvents: 'none',
+ display: 'flex',
+ alignItems: 'center',
+ justifyContent: 'center',
+ },
+ input: {
+ font: 'inherit',
+ padding: `${theme.spacing(1)}px ${theme.spacing(1)}px ${theme.spacing(1)}px ${theme.spacing(4)}px`,
+ border: 0,
+ display: 'block',
+ verticalAlign: 'middle',
+ whiteSpace: 'normal',
+ background: 'none',
+ margin: 0, // Reset for Safari
+ color: 'inherit',
+ width: '100%',
+ '&:focus': {
+ outline: 0,
+ },
+ },
+ iconTitle: {
+ position: 'relative',
+ marginRight: theme.spacing(0.5),
+ },
+ button: {
+ display: 'block',
+ width: '100%',
+ background: theme.palette.grey[50],
+ '&:hover': {
+ background: theme.palette.secondary.light
+ },
+ '& $icon': {
+ margin: '0 auto',
+ display: 'block',
+ fontSize: 64
+ },
+ '& $info': {
+ display: 'block',
+ textTransform: 'none',
+ color: theme.palette.grey[500]
+ }
+ },
+ info: {},
+ icon: {},
+ formControl: {
+ margin: theme.spacing(1),
+ minWidth: 120,
+ },
+ selectEmpty: {
+ marginTop: theme.spacing(2),
+ },
+ iconSmall: {
+ fontSize: 20,
+ },
+ leftIcon: {
+ marginRight: theme.spacing(1),
+ },
+});
+
+export default styles;
diff --git a/front/odiparpack/app/containers/Pages/SocialMedia/index.js b/front/odiparpack/app/containers/Pages/SocialMedia/index.js
new file mode 100644
index 0000000..3a5ae2c
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/SocialMedia/index.js
@@ -0,0 +1,110 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Helmet } from 'react-helmet';
+import brand from 'ba-api/brand';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import data from 'ba-api/timelineData';
+import {
+ fetchAction,
+ postAction,
+ toggleLikeAction,
+ fetchCommentAction,
+ postCommentAction,
+ closeNotifAction
+} from 'ba-actions/SocmedActions';
+import { Timeline, WritePost, SideSection, Notification } from 'ba-components';
+import { Grid } from '@material-ui/core';
+
+class SocialMedia extends React.Component {
+ componentDidMount() {
+ this.props.fetchData(data);
+ }
+
+ render() {
+ const title = brand.name + ' - Social Media';
+ const description = brand.desc;
+ const {
+ dataProps,
+ submitPost,
+ submitLike,
+ submitComment,
+ fetchComment,
+ commentIndex,
+ closeNotif,
+ messageNotif,
+ } = this.props;
+ return (
+
+
+
+
+
+
+ this.handleSearch(event)} />
+
+
+ {title}
+
+
+
+
+
+
+ closeNotif()} message={messageNotif} />
+
+
+
+
+
+
+
+ );
+ }
+}
+
+SocialMedia.propTypes = {
+ fetchData: PropTypes.func.isRequired,
+ submitPost: PropTypes.func.isRequired,
+ submitLike: PropTypes.func.isRequired,
+ submitComment: PropTypes.func.isRequired,
+ dataProps: PropTypes.object.isRequired,
+ fetchComment: PropTypes.func.isRequired,
+ commentIndex: PropTypes.number.isRequired,
+ closeNotif: PropTypes.func.isRequired,
+ messageNotif: PropTypes.string.isRequired,
+};
+
+const reducer = 'socmed';
+const mapStateToProps = state => ({
+ force: state, // force state from reducer
+ dataProps: state.getIn([reducer, 'dataTimeline']),
+ commentIndex: state.getIn([reducer, 'commentIndex']),
+ messageNotif: state.getIn([reducer, 'notifMsg']),
+});
+
+const constDispatchToProps = dispatch => ({
+ fetchData: bindActionCreators(fetchAction, dispatch),
+ submitPost: bindActionCreators(postAction, dispatch),
+ submitComment: bindActionCreators(postCommentAction, dispatch),
+ submitLike: bindActionCreators(toggleLikeAction, dispatch),
+ fetchComment: bindActionCreators(fetchCommentAction, dispatch),
+ closeNotif: () => dispatch(closeNotifAction),
+});
+
+const SocialMediaMapped = connect(
+ mapStateToProps,
+ constDispatchToProps
+)(SocialMedia);
+
+export default SocialMediaMapped;
diff --git a/front/odiparpack/app/containers/Pages/Standalone/LoginDedicated.js b/front/odiparpack/app/containers/Pages/Standalone/LoginDedicated.js
new file mode 100644
index 0000000..9cba8fb
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/Standalone/LoginDedicated.js
@@ -0,0 +1,33 @@
+import React from 'react';
+import { PropTypes } from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import brand from 'ba-api/brand';
+import logo from 'ba-images/logo.svg';
+import styles from 'ba-containers/Templates/appStyles-jss';
+import { Hidden } from '@material-ui/core';
+import Login from '../Users/Login';
+
+class LoginDedicated extends React.Component {
+ render() {
+ const { classes } = this.props;
+ return (
+
+
+
+
+
+
+
+
+ );
+ }
+}
+
+LoginDedicated.propTypes = {
+ classes: PropTypes.object.isRequired,
+};
+
+export default (withStyles(styles)(LoginDedicated));
diff --git a/front/odiparpack/app/containers/Pages/Standalone/NotFoundDedicated.js b/front/odiparpack/app/containers/Pages/Standalone/NotFoundDedicated.js
new file mode 100644
index 0000000..3d78b32
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/Standalone/NotFoundDedicated.js
@@ -0,0 +1,24 @@
+import React from 'react';
+import { PropTypes } from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import styles from 'ba-containers/Templates/appStyles-jss';
+import Error from './../Error';
+
+class NotFoundDedicated extends React.Component {
+ render() {
+ const { classes } = this.props;
+ return (
+
+
+
+
+ );
+ }
+}
+
+NotFoundDedicated.propTypes = {
+ classes: PropTypes.object.isRequired,
+};
+
+export default (withStyles(styles)(NotFoundDedicated));
diff --git a/front/odiparpack/app/containers/Pages/UserProfile/index.js b/front/odiparpack/app/containers/Pages/UserProfile/index.js
new file mode 100644
index 0000000..2065f68
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/UserProfile/index.js
@@ -0,0 +1,131 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Helmet } from 'react-helmet';
+import brand from 'ba-api/brand';
+import dummy from 'ba-api/dummyContents';
+import AccountCircle from '@material-ui/icons/AccountCircle';
+import SupervisorAccount from '@material-ui/icons/SupervisorAccount';
+import Favorite from '@material-ui/icons/Favorite';
+import PhotoLibrary from '@material-ui/icons/PhotoLibrary';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import data from 'ba-api/timelineData';
+import { fetchAction } from 'ba-actions/SocmedActions';
+import {
+ Cover,
+ About,
+ Connection,
+ Favorites,
+ Albums
+} from 'ba-components';
+
+import { AppBar, Tabs, Tab, Hidden } from '@material-ui/core';
+
+function TabContainer(props) {
+ return (
+
+ {props.children}
+
+ );
+}
+
+TabContainer.propTypes = {
+ children: PropTypes.node.isRequired,
+};
+
+class UserProfile extends React.Component {
+ state = {
+ value: 0,
+ };
+
+ componentDidMount() {
+ this.props.fetchData(data);
+ }
+
+ handleChange = (event, value) => {
+ this.setState({ value });
+ };
+
+ render() {
+ const title = brand.name + ' - Profile';
+ const description = brand.desc;
+ const { dataProps } = this.props;
+ const { value } = this.state;
+ return (
+
+
+ {title}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {value === 0 &&
+ );
+ }
+}
+
+UserProfile.propTypes = {
+ dataProps: PropTypes.object.isRequired,
+ fetchData: PropTypes.func.isRequired,
+};
+
+const reducer = 'socmed';
+const mapStateToProps = state => ({
+ force: state, // force state from reducer
+ dataProps: state.getIn([reducer, 'dataTimeline'])
+});
+
+const constDispatchToProps = dispatch => ({
+ fetchData: bindActionCreators(fetchAction, dispatch)
+});
+
+const UserProfileMapped = connect(
+ mapStateToProps,
+ constDispatchToProps
+)(UserProfile);
+
+export default UserProfileMapped;
diff --git a/front/odiparpack/app/containers/Pages/Users/LockScreen.js b/front/odiparpack/app/containers/Pages/Users/LockScreen.js
new file mode 100644
index 0000000..2752ae6
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/Users/LockScreen.js
@@ -0,0 +1,55 @@
+import React from 'react';
+import { Helmet } from 'react-helmet';
+import brand from 'ba-api/brand';
+import PropTypes from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import { LockForm } from 'ba-components';
+import styles from 'ba-components/Forms/user-jss';
+import { Grid } from '@material-ui/core';
+
+class ResetPassword extends React.Component {
+ state = {
+ valueForm: []
+ }
+
+ submitForm(values) {
+ setTimeout(() => {
+ this.setState({ valueForm: values });
+ console.log(`You submitted:\n\n${this.state.valueForm}`);
+ window.location.href = '/app';
+ }, 500); // simulate server latency
+ }
+
+ render() {
+ const title = brand.name + ' - Lock Screen';
+ const description = brand.desc;
+ const { classes } = this.props;
+ return (
+
+
+ {title}
+
+
+
+
+
+
+
+ );
+ }
+}
+
+ResetPassword.propTypes = {
+ classes: PropTypes.object.isRequired,
+};
+
+export default withStyles(styles)(ResetPassword);
diff --git a/front/odiparpack/app/containers/Pages/Users/Login.js b/front/odiparpack/app/containers/Pages/Users/Login.js
new file mode 100644
index 0000000..300f7b4
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/Users/Login.js
@@ -0,0 +1,85 @@
+import React from 'react';
+import { Helmet } from 'react-helmet';
+import brand from 'ba-api/brand';
+import PropTypes from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import Type from 'ba-styles/Typography.scss';
+import ArrowForward from '@material-ui/icons/ArrowForward';
+import logo from 'ba-images/logo.svg';
+import { LoginForm } from 'ba-components';
+import styles from 'ba-components/Forms/user-jss';
+
+import { Grid, Hidden, Typography } from '@material-ui/core';
+
+class Login extends React.Component {
+ state = {
+ valueForm: []
+ }
+
+ submitForm(values) {
+ setTimeout(() => {
+ this.setState({ valueForm: values });
+ console.log(`You submitted:\n\n${this.state.valueForm}`);
+ window.location.href = '/app';
+ }, 500); // simulate server latency
+ }
+
+ render() {
+ const title = brand.name + ' - Login';
+ const description = brand.desc;
+ const { classes } = this.props;
+ return (
+
+
+
+ {/* ----------------------------------------------------------------------*/}
+ {/* Load Login Form */}
+ this.submitForm(values)} />
+
+
+
+
+
+ {title}
+
+
+
+
+
+
+
+ );
+ }
+}
+
+Login.propTypes = {
+ classes: PropTypes.object.isRequired,
+};
+
+export default withStyles(styles)(Login);
diff --git a/front/odiparpack/app/containers/Pages/Users/Register.js b/front/odiparpack/app/containers/Pages/Users/Register.js
new file mode 100644
index 0000000..c139068
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/Users/Register.js
@@ -0,0 +1,78 @@
+import React from 'react';
+import { Helmet } from 'react-helmet';
+import PropTypes from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import Type from 'ba-styles/Typography.scss';
+import ArrowForward from '@material-ui/icons/ArrowForward';
+import brand from 'ba-api/brand';
+import logo from 'ba-images/logo.svg';
+import { RegisterForm } from 'ba-components';
+import styles from 'ba-components/Forms/user-jss';
+
+import { Grid, Hidden, Typography } from '@material-ui/core';
+
+class Login extends React.Component {
+ state = {
+ valueForm: []
+ }
+
+ submitForm(values) {
+ setTimeout(() => {
+ this.setState({ valueForm: values });
+ console.log(`You submitted:\n\n${this.state.valueForm}`);
+ window.location.href = '/app';
+ }, 500); // simulate server latency
+ }
+
+ render() {
+ const title = brand.name + ' - Register';
+ const description = brand.desc;
+ const { classes } = this.props;
+ return (
+
+
+
+
+
+ {/* Welcome Login */}
+
+
+
+ {/* ----------------------------------------------------------------------*/}
+ {/* Load Login Form */}
+ this.submitForm(values)} />
+
+
+
+
+
+
+
+
+ Hello there,
+
+
+
+ welcome to
+ {' '}
+ {brand.name}
+
+
+
+
+
+
+ {brand.name}
+
+
+ {title}
+
+
+
+
+
+
+
+ );
+ }
+}
+
+Login.propTypes = {
+ classes: PropTypes.object.isRequired,
+};
+
+export default withStyles(styles)(Login);
diff --git a/front/odiparpack/app/containers/Pages/Users/ResetPassword.js b/front/odiparpack/app/containers/Pages/Users/ResetPassword.js
new file mode 100644
index 0000000..e80253d
--- /dev/null
+++ b/front/odiparpack/app/containers/Pages/Users/ResetPassword.js
@@ -0,0 +1,54 @@
+import React from 'react';
+import { Helmet } from 'react-helmet';
+import brand from 'ba-api/brand';
+import PropTypes from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import { ResetForm } from 'ba-components';
+import styles from 'ba-components/Forms/user-jss';
+import { Grid } from '@material-ui/core';
+
+class ResetPassword extends React.Component {
+ state = {
+ valueForm: []
+ }
+
+ submitForm(values) {
+ setTimeout(() => {
+ this.setState({ valueForm: values });
+ console.log(`You submitted:\n\n${this.state.valueForm}`);
+ }, 500); // simulate server latency
+ }
+
+ render() {
+ const title = brand.name + ' - Reset Password';
+ const description = brand.desc;
+ const { classes } = this.props;
+ return (
+
+
+
+
+
+ {/* Welcome Login */}
+
+
+
+ {/* ----------------------------------------------------------------------*/}
+ {/* Load Register Form */}
+ this.submitForm(values)} />
+
+
+
+
+
+
+
+
+ Nice to meet You :)
+
+
+
+
+
+ {brand.name}
+
+
+ {title}
+
+
+
+
+
+
+
+ );
+ }
+}
+
+ResetPassword.propTypes = {
+ classes: PropTypes.object.isRequired,
+};
+
+export default withStyles(styles)(ResetPassword);
--
cgit v1.2.3
+
+
+ {/* ----------------------------------------------------------------------*/}
+ {/* Load Login Form */}
+ this.submitForm(values)} />
+
+
+
+