Commit 89ffffd8 authored by Maxym Borodenko's avatar Maxym Borodenko Committed by Matija Obreza

OrderRequest: Editing an existing request

parent 1a76dee5
......@@ -588,6 +588,9 @@
"title": "Request",
"items": "Items",
"actions": "Actions"
},
"edit": {
"title": "New Request"
}
},
"c": {
......
......@@ -4,7 +4,7 @@ import { sagaNavigate } from '@gringlobal/client/action/navigation';
// Constants
import {
SAGA_LIST_REQUESTS, RECEIVE_REQUESTS_LIST,
SAGA_RECEIVE_REQUEST, RECEIVE_REQUEST,
SAGA_RECEIVE_REQUEST, SAGA_EDIT_REQUEST, RECEIVE_REQUEST,
SAGA_RECEIVE_REQUEST_ITEMS, RECEIVE_REQUEST_ITEMS,
SAGA_CREATE_REQUEST, RECEIVE_NEW_REQUEST, CLEAR_REQUEST,
SAGA_RECEIVE_REQUEST_ACTIONS, RECEIVE_REQUEST_ACTIONS,
......@@ -26,6 +26,7 @@ export const requestPublicSagas = [
takeEvery(SAGA_LIST_REQUESTS, listOrderRequestsSaga),
takeEvery(SAGA_RECEIVE_REQUEST, getOrderRequestSaga),
takeEvery(SAGA_CREATE_REQUEST, createOrderRequestSaga),
takeEvery(SAGA_EDIT_REQUEST, editOrderRequestSaga),
takeEvery(RECEIVE_NEW_REQUEST, redirectToNewRequestSaga),
takeEvery(SAGA_RECEIVE_REQUEST_ITEMS, listOrderRequestItemsSaga),
takeEvery(SAGA_RECEIVE_REQUEST_ACTIONS, listOrderRequestActionsSaga),
......@@ -38,6 +39,10 @@ function* getOrderRequestSaga(action) {
method: RequestService.get,
params: [action.payload.id],
onSuccess: (request: OrderRequest) => {
dereferenceReferences3([request], {
coo: { id: [ 'ownedBy', 'finalRecipientCooperator', 'requestorCooperator', 'shipToCooperator' ] },
s: { id: [ 'ownedBy.site', 'finalRecipientCooperator.site', 'requestorCooperator.site', 'shipToCooperator.site' ] },
});
return request;
},
});
......@@ -143,6 +148,15 @@ export const createOrderRequestAction = (orderRequest: OrderRequest) => {
};
}
export const editOrderRequestAction = (orderRequest: OrderRequest) => {
return {
type: SAGA_EDIT_REQUEST,
payload: {
orderRequest,
},
};
}
function * createOrderRequestSaga(action) {
yield put({
type: 'API',
......@@ -152,6 +166,15 @@ function * createOrderRequestSaga(action) {
});
}
function * editOrderRequestSaga(action) {
yield put({
type: 'API',
target: RECEIVE_NEW_REQUEST,
method: RequestService.update,
params: [action.payload.orderRequest],
});
}
function * redirectToNewRequestSaga(action) {
// console.log('Redirect?', action.payload);
if (action.payload && action.payload.apiCall && action.payload.apiCall.data) {
......
......@@ -2,6 +2,7 @@ export const SAGA_RECEIVE_REQUEST = 'saga/request/public/RECEIVE_REQUEST';
export const SAGA_LIST_REQUESTS = 'saga/request/public/LIST';
export const SAGA_RECEIVE_REQUEST_ITEMS = 'saga/request/public/RECEIVE_ITEMS';
export const SAGA_CREATE_REQUEST = 'saga/request/public/CREATE';
export const SAGA_EDIT_REQUEST = 'saga/request/public/EDIT';
export const RECEIVE_NEW_REQUEST = 'saga/request/public/RECEIVE_NEW';
export const SAGA_RECEIVE_REQUEST_ACTIONS = 'saga/request/public/RECEIVE_ACTIONS';
......
......@@ -16,9 +16,17 @@ const publicRoutes: IRoute[] = [
exact: true,
auth: [ UserRole.USER ],
component: Loadable({
loader: () => import(/* webpackMode:"lazy", webpackChunkName: "request" */ 'request/ui/RequestAddPage'),
loader: () => import(/* webpackMode:"lazy", webpackChunkName: "request" */ 'request/ui/RequestEditPage'),
}),
path: '/request/new',
path: '/request/edit/:id(\\d+)',
},
{
exact: true,
auth: [ UserRole.USER ],
component: Loadable({
loader: () => import(/* webpackMode:"lazy", webpackChunkName: "request" */ 'request/ui/RequestEditPage'),
}),
path: '/request/edit',
},
{
exact: true,
......
......@@ -8,6 +8,9 @@
"title": "Request",
"items": "Items",
"actions": "Actions"
},
"edit": {
"title": "New Request"
}
},
"c": {
......
......@@ -124,7 +124,7 @@ class BrowsePage extends React.Component<IBrowsePageProps> {
/>
<AddNewButton
title="OrderRequest"
path="request/new"
path="request/edit"
/>
</>
);
......
......@@ -5,6 +5,7 @@ import { WithTranslation, withTranslation } from 'react-i18next';
// import update from 'immutability-helper';
// Action
import navigateTo from '@gringlobal/client/action/navigation';
import { ApiCall } from '@gringlobal/client/model/common';
import { getOrderRequestAction, listOrderRequestItemsAction, listOrderRequestActionsAction } from 'request/action/public';
import { RequestService } from '@gringlobal/client/service';
......@@ -63,6 +64,7 @@ interface IDetailsPageProps extends React.ClassAttributes<any>, WithTranslation,
requestCall: ApiCall<OrderRequest>;
requestItemsCall: ApiCall<FilteredPage<OrderRequestItem>>;
requestActionsCall: ApiCall<FilteredPage<OrderRequestAction>>;
navigateTo: (path: string, query?: object) => void;
}
class OrderRequestDetailsPage extends React.Component<IDetailsPageProps> {
......@@ -146,6 +148,11 @@ class OrderRequestDetailsPage extends React.Component<IDetailsPageProps> {
});
}
public handleEdit = () => {
const { navigateTo, id } = this.props;
navigateTo(`/request/edit/${id}`);
};
public render(): React.ReactNode {
const { requestCall, requestItemsCall, requestActionsCall, t, currentTab, onTabChange } = this.props;
const { selectedItems } = this.state;
......@@ -202,7 +209,7 @@ class OrderRequestDetailsPage extends React.Component<IDetailsPageProps> {
<ButtonBar>
<Link to={ `/request/${request.id}/add` }><Button variant="contained" color="primary">{ t('Add material...') }</Button></Link>
<Button variant="contained" color="primary" onClick={ this.verifyItemList }>{ t('Verify item list') }</Button>
<Button variant="contained" color="secondary">Edit</Button>
<Button variant="contained" color="secondary" onClick={ this.handleEdit }>Edit</Button>
<Button variant="outlined" color="secondary">Remove</Button>
<Button variant="text" color="secondary">Do something</Button>
</ButtonBar>
......@@ -248,7 +255,7 @@ class OrderRequestDetailsPage extends React.Component<IDetailsPageProps> {
}
</TabPanel>
<TabPanel value={ currentTab } index={ RequestTabs.ACTIONS }>
<RequestActionsTable actions={ requestActionsCall.data && requestActionsCall.data.content }/>
{ requestActionsCall && <RequestActionsTable actions={ requestActionsCall.data && requestActionsCall.data.content }/> }
</TabPanel>
</>
);
......@@ -266,6 +273,7 @@ const mapDispatchToProps = (dispatch) => bindActionCreators({
getOrderRequestAction,
listOrderRequestItemsAction,
listOrderRequestActionsAction,
navigateTo,
}, dispatch);
......
......@@ -4,19 +4,24 @@ import { bindActionCreators, compose } from 'redux';
import { WithTranslation, withTranslation } from 'react-i18next';
// Model
import OrderRequest from '@gringlobal/client/model/gringlobal/OrderRequest';
import { ApiCall } from '@gringlobal/client/model/common';
// Action
import { createOrderRequestAction } from 'request/action/public';
import { createOrderRequestAction, getOrderRequestAction, editOrderRequestAction } from 'request/action/public';
// UI
import ContentHeader from '@gringlobal/client/ui/common/heading/ContentHeader';
import { Card, CardContent } from '@material-ui/core';
import OrderRequestForm from 'request/ui/c/OrderRequestForm';
import PageTitle from '@gringlobal/client/ui/common/PageTitle';
interface IRequestAddPage extends React.ClassAttributes<any> {
interface IRequestEditPage extends React.ClassAttributes<any> {
id: number;
getOrderRequestAction: (id: number) => void;
requestCall: ApiCall<OrderRequest>;
createOrderRequestAction: (orderRequest: OrderRequest) => any;
editOrderRequestAction: (orderRequest: OrderRequest) => any;
}
class RequestAddPage extends React.Component<IRequestAddPage & WithTranslation> {
class RequestEditPage extends React.Component<IRequestEditPage & WithTranslation> {
protected static needs = [];
......@@ -24,25 +29,46 @@ class RequestAddPage extends React.Component<IRequestAddPage & WithTranslation>
super(props);
}
private addNewOrderRequest = (orderRequest: OrderRequest) => {
const { createOrderRequestAction } = this.props;
console.log('submit', orderRequest);
public componentDidMount(): void {
const { id, requestCall, getOrderRequestAction } = this.props;
if (!id) { return }
if (!requestCall || !requestCall.data || requestCall.data.id !== id) {
getOrderRequestAction(id);
}
}
public componentDidUpdate() {
const { requestCall, id, getOrderRequestAction } = this.props;
if (!id) { return }
if (!requestCall || !requestCall.loading && (!requestCall.error && id && (id !== requestCall.data.id))) {
getOrderRequestAction(id);
}
}
private saveOrderRequest = (orderRequest: OrderRequest) => {
const { createOrderRequestAction, editOrderRequestAction, id } = this.props;
if (id) {
return editOrderRequestAction(orderRequest);
}
createOrderRequestAction(orderRequest);
};
public render(): React.ReactNode {
const { t } = this.props;
const { t, requestCall } = this.props;
const initialValues = requestCall && requestCall.data ? { ...requestCall.data } : {};
return (
<>
<PageTitle title={ t('New OrderRequest') }/>
<PageTitle title={ t('request.public.p.edit.title') }/>
<ContentHeader
title={ t('New OrderRequest') }
title={ requestCall && requestCall.loading ? t('common:label.loadingData') : requestCall && requestCall.data ? requestCall.data.localNumber : t('request.public.p.edit.title') }
/>
<>
<Card>
<CardContent>
<OrderRequestForm onSubmit={ this.addNewOrderRequest } />
<OrderRequestForm initialValues={ initialValues } onSubmit={ this.saveOrderRequest } />
</CardContent>
</Card>
</>
......@@ -52,14 +78,18 @@ class RequestAddPage extends React.Component<IRequestAddPage & WithTranslation>
}
const mapStateToProps = (state, ownProps) => ({
id: +ownProps.match.params.id || null,
requestCall: ownProps.match.params.id ? state.request.public.request : null,
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
getOrderRequestAction,
createOrderRequestAction,
editOrderRequestAction,
}, dispatch);
export default compose(
connect(mapStateToProps, mapDispatchToProps),
withTranslation(),
)(RequestAddPage);
)(RequestEditPage);
......@@ -10,6 +10,8 @@ import { Grid, Button, CardActions } from '@material-ui/core';
import { withStyles, WithStyles } from '@material-ui/core/styles';
import { CodeValueField } from 'common/CodeValue';
import OrderRequest from '@gringlobal/client/model/gringlobal/OrderRequest';
// Utils
import { maxLength, required } from '@gringlobal/client/utilities/validators';
const styles = (theme) => ({
textField: {
......@@ -35,6 +37,7 @@ function orderRequestFormInternal(props: FormRenderProps & WithStyles) {
component={ TextField }
className={ classes.textField }
label={ t(`client:model.OrderRequest.${property}`, `client:model._.${property}`) }
validate={ maxLength(50) }
/>
</Grid>
)) }
......@@ -57,6 +60,8 @@ function orderRequestFormInternal(props: FormRenderProps & WithStyles) {
component={ CooperatorAutocomplete }
className={ classes.textField }
label={ t('client:model.OrderRequest.finalRecipientCooperator') }
required
validate={ required }
/>
</Grid>
<Grid item md={ 6 }>
......@@ -133,10 +138,10 @@ const OrderRequestFormInternal = withStyles(styles)(orderRequestFormInternal);
export default class OrderRequestForm extends React.Component<IOrderRequestForm, any> {
public render() {
const { onSubmit } = this.props;
const { initialValues, onSubmit } = this.props;
return (
<Form
initialValues={ { } }
initialValues={ initialValues }
onSubmit={ onSubmit }
render={ (props) => <OrderRequestFormInternal { ...props } /> }
/>
......
......@@ -76,7 +76,7 @@ class WelcomePage extends React.Component<WithTranslation & WithStyles> {
</Grid>
<Grid item xs={ 12 } sm={ 6 } md={ 4 } lg={ 3 }>
<Link to="/request/new">
<Link to="/request/edit">
<Card className={ classes.card }>
<CardHeader title={ t('welcome.p.cards.distribution.new.title') }/>
<CardContent>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment