senaduka/old-new-wiaas
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Handle additional orders info for wiaas

Browse Source
This commit is contained in:
Almira Krdzic
2018-08-09 12:20:20 +02:00
parent b8653ad18b 5d84f53ea7
commit b9b1181bf4
46 changed files with 381 additions and 364 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/actions/cart/cartActions.js
View File

@@ -56,14 +56,18 @@ export const receiveCustomerDetails = (json) => ({
export const fetchCartCount = () => {
return dispatch => {
dispatch(requestShopCartCount());
//TODO : fetch cart count from woocommerce (requires plugin)
dispatch(receiveShopCartCount(0));
/*return client.fetch({url: `${API_SERVER}/cart/api/getCartCount`}).then(response => {
/*
return client.fetch({url: `${API_SERVER}/cart/api/getCartCount`}).then(response => {
if (typeof response.data !== 'undefined' && 'cartItemsCount' in response.data) {
dispatch(receiveShopCartCount(response.data.cartItemsCount));
}
}).catch(error => {
client.onError(error, dispatch);
});*/
});
*/
}
}

30
frontend/src/actions/dashboard/dashboardActions.js
View File

@@ -1,7 +1,4 @@
import {API_SERVER} from '../../config';
import HtmlClient from '../../helpers/HtmlClient';
import {REQUEST_GADGETS, RECIEVE_GADGETS} from '../../constants/dashboardConstants';
const htmlClient = new HtmlClient();
const requestGadgets = () => ({type: REQUEST_GADGETS});
const recieveGadgets = (json) => ({
@@ -12,7 +9,30 @@ const recieveGadgets = (json) => ({
export const fetchGadgets = () => {
return dispatch => {
dispatch(requestGadgets());
const data = {"info":{"idDashboard":"23","name":"Customer Basic Dashboard","isOwner":"0"},"gadgets":[{"idGadget":"3","name":"Customer Order Central","module":"gadget-order-central","position":"1"},{"idGadget":"5","name":"Customer Next Actions","module":"gadget-next-actions","position":"2"}]};
dispatch(recieveGadgets(data.gadgets))
//TODO : check how to solve gadgets, don't use hardcoded values
const gadgets = [
{
name: 'CustomerOrderCentral',
idGadget: 0,
},
{
name: 'CustomerNextActions',
idGadget: 1,
}
]
dispatch(recieveGadgets(gadgets));
/*
return htmlClient.fetch({
url: `${API_SERVER}/dashboards/api/getMyDashboard`
})
.then(response => {
if(response.data && response.data.gadgets){
dispatch(recieveGadgets(response.data.gadgets))
}
})
.catch(error => {
htmlClient.onError(error, dispatch);
});
*/
}
}

7
frontend/src/actions/dashboard/nextActionsActions.js
View File

@@ -1,6 +1,7 @@
import {API_SERVER} from '../../config';
import HtmlClient from '../../helpers/HtmlClient';
import {REQUEST_NEXT_ACTIONS, RECIEVE_NEXT_ACTIONS} from '../../constants/dashboardConstants';
import { API_SERVER } from '../../config';
import HtmlClient from '../../helpers/HtmlClient';
const client = new HtmlClient();
export const requestNextActions = () => ({
@@ -23,6 +24,6 @@ export const fetchNextActions = () => {
.then(response => dispatch(recieveNextActions(response.data)))
.catch(error => {
client.onError(error, dispatch);
});
});
}
}

19
frontend/src/actions/dashboard/ordersActions.js
View File

@@ -4,6 +4,8 @@ import {
REQUEST_ORDERS,
RECEIVE_ORDERS
} from '../../constants/dashboardConstants';
import {fromWCOrder} from '../../helpers/OrderHelper';
import { MAX_ORDER_COUNT } from '../../constants/ordersConstants';
const htmlClient = new HtmlClient();
export const requestOrders = () => ({
@@ -19,17 +21,16 @@ export const recieveOrders = (json) => ({
export const fetchOrders = (viewAllOrders) => {
return dispatch => {
dispatch(recieveOrders([]));
/*return htmlClient.fetch({
url: `${API_SERVER}/dashboards/api/getOrderCentralInfo`,
method: 'post',
data: {
viewAllOrders
}
dispatch(requestOrders());
return htmlClient.fetch({
url: `${API_SERVER}/wp-json/wc/v2/orders?per_page=${MAX_ORDER_COUNT}&wiaas_is_active=1`,
method: 'get',
})
.then(response => {
dispatch(recieveOrders(response.data.map(wcOrder => fromWCOrder(wcOrder))));
})
.then(response => dispatch(recieveOrders(response.data)))
.catch(error => {
htmlClient.onError(error, dispatch);
});*/
});
}
}

93
frontend/src/actions/login/authActions.js
View File

@@ -160,68 +160,70 @@ const validateRefreshToken = () => {
export const getModules = () => {
return dispatch => {
const data = {
"modules": {
"modules": [
dispatch(requestModules());
//TODO : check how to solve modules, don't hardocde values
const modules={
modules:{
modules:[
{
"id": "14",
"name": "ProfileSettings",
"menuName": "ProfileSettings",
"url": "profileSettings",
"isInMenu": "0"
id:"19",
isInMenu:"0",
menuName:"Cart",
name:"Cart",
url:"cart",
},
{
"id": "23",
"name": "OrderProjects",
"menuName": "OrderProjects",
"url": "orderProjects",
"isInMenu": "0"
id:"14",
isInMenu:"0",
menuName:"ProfileSettings",
name:"ProfileSettings",
url:"profileSettings",
},
{
"id": "15",
"name": "Terms",
"menuName": "Terms",
"url": "terms",
"isInMenu": "0"
id:"23",
isInMenu:"0",
menuName:"OrderProjects",
name:"OrderProjects",
url:"orderProjects",
},
{
"id": "19",
"name": "Cart",
"menuName": "Cart",
"url": "cart",
"isInMenu": "0"
id:"15",
isInMenu:"0",
menuName:"Terms",
name:"Terms",
url:"terms",
},
{
"id": "1",
"name": "Dashboards",
"menuName": "Overview",
"url": "dashboards",
"isInMenu": "1"
id:"1",
isInMenu:"1",
menuName:"Overview",
name:"Dashboards",
url:"dashboards",
},
{
"id": "18",
"name": "CoMarket",
"menuName": "Co-Market",
"url": "co-market",
"isInMenu": "1"
id:"18",
isInMenu:"1",
menuName:"Co-Market",
name:"CoMarket",
url:"co-market",
}
],
"subModules": {
"co-market": [
subModules:{
"co-market":[
{
"moduleUrl": "co-market",
"menuName": "Orders",
"name": "Orders",
"url": "orders"
menuName:"Orders",
name:"Orders",
url:"orders",
moduleUrl:"co-market",
}
]
}
}
};
dispatch(recieveModules(data));
dispatch(requestModules());
/**return htmlClient.fetch({
}
dispatch(recieveModules(modules));
/*
return htmlClient.fetch({
url: `${API_SERVER}/login/api/getModules`,
})
.then(response => {
@@ -229,7 +231,8 @@ export const getModules = () => {
})
.catch(error => {
htmlClient.onError(error, dispatch);
});**/
});
*/
}
}

11
frontend/src/actions/orders/ordersActions.js
View File

@@ -7,13 +7,14 @@ import {
RECEIVE_HISTORY_ORDERS,
SET_VIEW_ALL_ORDERS
} from '../../constants/ordersConstants';
import {fromWCOrder} from '../../helpers/OrderHelper';
const htmlClient = new HtmlClient();
const requestActiveOrders = () => ({
type: REQUEST_ACTIVE_ORDERS,
isLoading: true
});
const recieveActiveOrders = (json) => ({
const receiveActiveOrders = (json) => ({
type: RECEIVE_ACTIVE_ORDERS,
isLoading: false,
activeOrders: json
@@ -23,10 +24,10 @@ export const getActiveOrders = () => {
return dispatch => {
dispatch(requestActiveOrders());
return htmlClient.fetch({
url: `${API_SERVER}/wp-json/wc/v2/orders?status=processing`
url: `${API_SERVER}/wp-json/wc/v2/orders?wiaas_is_active=1`
})
.then(response => {
dispatch(recieveActiveOrders(response.data));
dispatch(receiveActiveOrders(response.data.map(wcOrder => fromWCOrder(wcOrder))));
})
.catch(error => {
htmlClient.onError(error, dispatch);
@@ -48,10 +49,10 @@ export const getHistoryOrders = () => {
return dispatch => {
dispatch(requestHistoryOrders());
return htmlClient.fetch({
url: `${API_SERVER}/wp-json/wc/v2/orders?status=completed`
url: `${API_SERVER}/wp-json/wc/v2/orders?wiaas_is_active=0`
})
.then(response => {
dispatch(recieveHistoryOrders(response.data));
dispatch(recieveHistoryOrders(response.data.map(wcOrder => fromWCOrder(wcOrder))));
})
.catch(error => {
htmlClient.onError(error, dispatch);

3
frontend/src/config.js
View File

@@ -3,5 +3,6 @@ const API_VERSION = 'v2';
const API_SERVER_BASE = process.env.REACT_APP_API_URL;
const API_SERVER = API_SERVER_BASE;
const API_SERVER_LOGIN = API_SERVER + "/wp-admin";
export {API_SERVER_BASE, API_SERVER, APPLICATION_NAME}
export {API_SERVER_BASE, API_SERVER, APPLICATION_NAME, API_SERVER_LOGIN}

4
frontend/src/constants/authConstants.js
View File

@@ -1,4 +1,4 @@
import {API_SERVER_BASE} from '../config.js';
import {API_SERVER_LOGIN} from '../config.js';
const MODULE = 'AUTH_';
@@ -36,7 +36,7 @@ export const loginMessages = {
CHANGE_LATER: 'You can change your password in 5 minutes!',
INVALID_REFRESH_TOKEN: 'Your session has expired!',
EXPIRED_SESSION : 'Your session has expired!',
INVALID_USER_TYPE: 'Users with other roles than "customer" must use this url for login: ' + API_SERVER_BASE,
INVALID_USER_TYPE: 'Users with other roles than "customer" must use this url for login: ' + API_SERVER_LOGIN,
INVALID_CHANGE_TOKEN: 'Invalid change token value!',
PASSWORDS_MISSING: 'Password can not be empty',
WRONG_USERNAME: 'Invalid username!',

6
frontend/src/constants/dashboardConstants.js
View File

@@ -30,10 +30,10 @@ export const dashboardTexts = {
},
statuses: {
open: 'Open',
'in-progress': 'In Progress',
production: 'Production',
processing: 'In Progress',
completed: 'Production',
'end-of-life': 'End Of Life',
canceled: 'Canceled',
cancelled: 'Cancelled',
'not-accepted': 'Not Accepted',
invalid: 'Invalid',
pending: 'Pending'

4
frontend/src/constants/ordersConstants.js
View File

@@ -186,7 +186,7 @@ export const orderTexts = {
},
statuses: {
open: 'Open',
'processing': 'Processing',
'processing': 'In progress',
completed: 'Completed',
'end-of-life': 'Completed',
cancelled: 'Cancelled',
@@ -207,3 +207,5 @@ export const orderTexts = {
PLACED_BY: 'Placed by'
}
};
export const MAX_ORDER_COUNT = 5;

4
frontend/src/containers/dashboard/NextActions.scss
View File

@@ -36,8 +36,8 @@
background: $not-accepted-status-color;
}
.in-progress {
background: $in-progress-status-color;
.processing {
background: $processing-status-color;
}
.next-action-details{

8
frontend/src/containers/dashboard/OrderCentral.scss
View File

@@ -31,15 +31,15 @@
background: $open-status-color;
}
.in-progress {
background: $in-progress-status-color;
.processing {
background: $processing-status-color;
}
.line-open {
border-left: 3px $open-status-color solid;
}
.line-in-progress {
border-left: 3px $in-progress-status-color solid;
.line-processing {
border-left: 3px $processing-status-color solid;
}
}

4
frontend/src/containers/dashboard/components/NextActionItem.jsx
View File

@@ -10,10 +10,10 @@ class NextActionItem extends Component {
return (
<Row className="next-actions-row">
<Col xl="8">
{nextAction.stepAction}
{nextAction.step_action}
</Col>
<Col xl="4">
<Link to={'orders/'+ nextAction.idOrder}>
<Link to={'orders/'+ nextAction.order_id}>
<div className={'next-actions-status ' + nextAction.status}>{dashboardTexts.statuses[nextAction.status]}</div>
</Link>
</Col>

2
frontend/src/containers/dashboard/components/NextActionsList.jsx
View File

@@ -14,7 +14,7 @@ class NextActionsList extends Component {
{
nextActions &&
nextActions.map((nextAction, index) =>
<NextActionItem key={'action-' + nextAction.orderNumber + index} nextAction={nextAction}/>
<NextActionItem key={'action-' + nextAction.order_number + index} nextAction={nextAction}/>
)
}
</WiaasTableBody>

8
frontend/src/containers/dashboard/components/OrderItem.jsx
View File

@@ -12,12 +12,12 @@ class OrderItem extends Component {
<WiaasTableRow className={'order-central-row line-' + order.status}>
<WiaasTableCol header="#">
<i className="fa fa-list-alt package-photo" aria-hidden="true" />
<div className="orderNumber">{order.orderNumber}</div>
<div className="orderNumber">{order.number}</div>
</WiaasTableCol>
<WiaasTableCol header={dashboardTexts.tableHeaders.ORDER_DATE}>{order.orderDate}</WiaasTableCol>
<WiaasTableCol header={dashboardTexts.tableHeaders.ORDER_DATE}>{order.dateCreated}</WiaasTableCol>
{
isViewAllOrdersChecked &&
<WiaasTableCol header={dashboardTexts.tableHeaders.PLACED_BY}>{order.placedBy}</WiaasTableCol>
<WiaasTableCol header={dashboardTexts.tableHeaders.PLACED_BY}>{order.customer ? order.customer.name : ''}</WiaasTableCol>
}
<WiaasTableCol header={dashboardTexts.tableHeaders.REFERENCE}>{order.reference}</WiaasTableCol>
<WiaasTableCol header={dashboardTexts.tableHeaders.ON_DELIVERY}>{order.fixedPrice.toLocaleString()} {order.currency}</WiaasTableCol>
@@ -25,7 +25,7 @@ class OrderItem extends Component {
<WiaasTableCol header={dashboardTexts.tableHeaders.STATUS}>
<div className={'status-icon ' + order.status}></div>{dashboardTexts.statuses[order.status]}
</WiaasTableCol>
<WiaasTableCol><Link to={'orders/'+ order.idOrder}><Button className="wiaas-button">{dashboardTexts.buttons.DETAILS}</Button></Link></WiaasTableCol>
<WiaasTableCol><Link to={'orders/'+ order.id}><Button className="wiaas-button">{dashboardTexts.buttons.DETAILS}</Button></Link></WiaasTableCol>
</WiaasTableRow>
);
}

2
frontend/src/containers/dashboard/components/OrdersList.jsx
View File

@@ -46,7 +46,7 @@ class OrdersList extends Component {
{
orders &&
orders.map((order, index) =>
<OrderItem key={'order-' + order.orderNumber} order={order} isViewAllOrdersChecked={isViewAllOrdersChecked}/>
<OrderItem key={'order-' + order.number} order={order} isViewAllOrdersChecked={isViewAllOrdersChecked}/>
)
}
</WiaasTableBody>

8
frontend/src/containers/orders/OrdersDataContainer.jsx
View File

@@ -13,10 +13,8 @@ class OrdersDataContainer extends Component {
this.props.dispatch(getHistoryOrders());
}
checkIfOrdersExistForUser(orders) {
return orders.every((order) => {
return true;//'isMyOrder' in order && !order.isMyOrder;
})
hasCurrentCustomerOrders(orders) {
return orders.some((order) => order.isMyOrder);
}
render() {
@@ -38,7 +36,7 @@ class OrdersDataContainer extends Component {
<OrderList orders={orders} type={type}/>
}
{
((orders && orders.length === 0 && !isLoading) || (orders && !this.checkIfOrdersExistForUser(orders))) &&
((orders && orders.length === 0 && !isLoading) || (orders && !this.hasCurrentCustomerOrders(orders))) &&
<Alert color="info">{orderTexts.labels.NO_RECORDS}</Alert>
}
</WiaasBox>

2
frontend/src/containers/orders/components/HistoryOrderButtons.jsx
View File

@@ -42,7 +42,7 @@ class HistoryOrdersButtons extends Component {
],
header: orderTexts.labels.SUPPORT_MESSAGE_HEADER,
TagName: SupportMail,
params: {orderInfo: this.props.order, orderPackages: this.props.order.line_items}
params: {orderInfo: this.props.order, orderPackages: this.props.order.packages}
};
this.props.dispatch(setDialogOpenFlag(true));

77
frontend/src/containers/orders/components/HistoryOrderItem.jsx
View File

@@ -1,77 +0,0 @@
import React, {Component} from 'react';
import {connect} from 'react-redux';
import {WiaasTableRow, WiaasTableCol} from '../../../mainComponents/table/WiaasTable.jsx';
import {orderTexts} from '../../../constants/ordersConstants';
import '../style/Orders.css';
import OrderPackage from './OrderPackage.jsx';
import HistoryOrderButtons from './HistoryOrderButtons.jsx';
class HistoryOrdersItem extends Component {
constructor(props) {
super(props);
this.state = {
showPackages: false
};
this.toggle = this.toggle.bind(this);
}
toggle() {
this.setState({
showPackages: !this.state.showPackages
});
}
getIconClass(type) {
return 'fa fa-angle-' + type + ' toggle-view-packages';
}
render() {
const {order, isViewAllOrdersChecked} = this.props;
return (
<div>
<WiaasTableRow className={"order-central-row order-border-" + order.status}>
<WiaasTableCol header="#">
{!this.state.showPackages && <i className={this.getIconClass('down')} aria-hidden="true" onClick={this.toggle}></i>}
{this.state.showPackages && <i className={this.getIconClass('up')} aria-hidden="true" onClick={this.toggle}></i>}
<i className="fa fa-list-alt package-photo" aria-hidden="true" />
<div className="order-number">{order.number}</div>
</WiaasTableCol>
<WiaasTableCol header={orderTexts.labels.REFERENCE}>{order.reference ? order.reference : '-'}</WiaasTableCol>
{isViewAllOrdersChecked['history'] && <WiaasTableCol header={orderTexts.labels.PLACED_BY}>{order.customer ? order.customer.name : ''}</WiaasTableCol>}
<WiaasTableCol header={orderTexts.labels.ORDER_DATE}>{order.date_created ? order.date_created : '-'}</WiaasTableCol>
<WiaasTableCol header={orderTexts.labels.DELIVERY_DATE}>{order.deliveryDate}</WiaasTableCol>
<WiaasTableCol header="Catalogue">
<div className="order-item-cl">
<img className="cl-photo" src="static/img/man-icon.png" alt="Catalogue" />
<div className="cl-details">
<div className="cl-contact-name">{order.commercial_lead ? order.commercial_lead.contact_name : ''}</div>
<div className="cl-name">{order.commercial_lead ? order.commercial_lead.name : ''}</div>
</div>
</div>
</WiaasTableCol>
<WiaasTableCol header={orderTexts.labels.AMOUNT}>
{order.currency
? order.total.toLocaleString() + ' ' + order.currency
: parseFloat(order.total).toLocaleString()}
</WiaasTableCol>
<WiaasTableCol header={orderTexts.labels.STATUS}>
<div className={'status-icon ' + order.status}></div>{orderTexts.statuses[order.status]}
</WiaasTableCol>
<WiaasTableCol header="End of life">{order.date_completed}</WiaasTableCol>
<WiaasTableCol header="Buttons details">
<HistoryOrderButtons order={order}/>
</WiaasTableCol>
</WiaasTableRow>
{ this.state.showPackages && <OrderPackage order={order} type="history"/> }
</div>
);
}
}
const mapStateToProps = (state) => ({
isViewAllOrdersChecked: state.ordersReducer.isViewAllOrdersChecked
});
export default connect(mapStateToProps)(HistoryOrdersItem);

8
frontend/src/containers/orders/components/OrderList.jsx
View File

@@ -1,7 +1,6 @@
import React, {Component} from 'react';
import {connect} from 'react-redux';
import ActiveOrderItem from './ActiveOrderItem.jsx';
import HistoryOrderItem from './HistoryOrderItem.jsx';
import OrderListItem from './OrderListItem.jsx';
import {WiaasTable, WiaasTableHeader, WiaasTableBody} from '../../../mainComponents/table/WiaasTable.jsx';
import {orderTexts} from '../../../constants/ordersConstants';
@@ -47,7 +46,6 @@ class OrderList extends Component {
render() {
const {orders, type, isCompanyAdmin, isViewAllOrdersChecked} = this.props;
const TagName = type && type === 'active' ? ActiveOrderItem : HistoryOrderItem;
return (
<div>
@@ -57,8 +55,8 @@ class OrderList extends Component {
{
orders &&
orders.map((order, index) =>
((true) || (isCompanyAdmin && isViewAllOrdersChecked[type])) &&
<TagName key={order.id} order={order} />
(order.isMyOrder || (isCompanyAdmin && isViewAllOrdersChecked[type])) &&
<OrderListItem key={order.id} order={order} type={type} />
)
}
</WiaasTableBody>

40
frontend/src/containers/orders/components/ActiveOrderItem.jsx → frontend/src/containers/orders/components/OrderListItem.jsx
View File

@@ -6,8 +6,9 @@ import {WiaasTableRow, WiaasTableCol} from '../../../mainComponents/table/WiaasT
import {orderTexts} from '../../../constants/ordersConstants';
import '../style/Orders.css';
import OrderPackage from './OrderPackage.jsx';
import HistoryOrderButtons from './HistoryOrderButtons.jsx';
class ActiveOrderItem extends Component {
class OrderListItem extends Component {
constructor(props) {
super(props);
this.state = {
@@ -29,6 +30,16 @@ class ActiveOrderItem extends Component {
render() {
const {order, isViewAllOrdersChecked} = this.props;
const isActive = this.props.type === 'active';
let orderButtons;
if (isActive) {
orderButtons = ( <Link to={'/orders/' + order.id} className="actions-link">
<Button color="secondary" className="actions-button">{orderTexts.buttons.DELIVERY_DETAILS}</Button>
</Link>);
} else {
orderButtons = <HistoryOrderButtons order={order}/>;
}
return (
<div>
@@ -40,34 +51,37 @@ class ActiveOrderItem extends Component {
<div className="order-number">{order.number}</div>
</WiaasTableCol>
<WiaasTableCol header={orderTexts.labels.REFERENCE}>{order.reference ? order.reference : '-'}</WiaasTableCol>
{isViewAllOrdersChecked['active'] && <WiaasTableCol header={orderTexts.labels.PLACED_BY}>{order.customer ? order.customer.name : ''}</WiaasTableCol>}
<WiaasTableCol header={orderTexts.labels.ORDER_DATE}>{order.date_created ? order.date_created : '-'}</WiaasTableCol>
{
isViewAllOrdersChecked[this.props.type] &&
<WiaasTableCol header={orderTexts.labels.PLACED_BY}>{order.customer ? order.customer.name : ''}</WiaasTableCol>
}
<WiaasTableCol header={orderTexts.labels.ORDER_DATE}>{order.dateCreated ? order.dateCreated : '-'}</WiaasTableCol>
<WiaasTableCol header={orderTexts.labels.EST_DELIVERY}>{order.estimatedDeliveryDate ? order.estimatedDeliveryDate : '-'}</WiaasTableCol>
<WiaasTableCol header="Catalogue">
<div className="order-item-cl">
<img className="cl-photo" src="static/img/man-icon.png" alt="Catalogue" />
<div className="cl-details">
<div className="cl-contact-name">{order.commercial_lead ? order.commercial_lead.contact_name : ''}</div>
<div className="cl-name">{order.commercial_lead ? order.commercial_lead.name : ''}</div>
<div className="cl-contact-name">{order.commercialLead ? order.commercialLead.contact : ''}</div>
<div className="cl-name">{order.commercialLead ? order.commercialLead.name : ''}</div>
</div>
</div>
</WiaasTableCol>
<WiaasTableCol header={orderTexts.labels.AMOUNT}>
{order.currency
? order.total.toLocaleString() + ' ' + order.currency
: parseFloat(order.total).toLocaleString()}
? order.fixedPrice.toLocaleString() + ' ' + order.currency
: parseFloat(order.fixedPrice).toLocaleString()}
</WiaasTableCol>
<WiaasTableCol header={orderTexts.labels.STATUS}>
<div className={'status-icon ' + order.status}></div>{orderTexts.statuses[order.status]}
</WiaasTableCol>
{
!isActive && <WiaasTableCol header="End of life">{order.dateCompleted}</WiaasTableCol>
}
<WiaasTableCol header="Buttons details">
<Link to={'/orders/' + order.id} className="actions-link">
<Button color="secondary" className="actions-button">{orderTexts.buttons.DELIVERY_DETAILS}</Button>
</Link>
{orderButtons}
</WiaasTableCol>
</WiaasTableRow>
{ this.state.showPackages && <OrderPackage order={order} type="active"/> }
{ this.state.showPackages && <OrderPackage order={order} type={this.props.type}/> }
</div>
);
}
@@ -76,4 +90,4 @@ class ActiveOrderItem extends Component {
const mapStateToProps = (state) => ({
isViewAllOrdersChecked: state.ordersReducer.isViewAllOrdersChecked
});
export default connect(mapStateToProps)(ActiveOrderItem);
export default connect(mapStateToProps)(OrderListItem);

24
frontend/src/containers/orders/components/OrderPackage.jsx
View File

@@ -32,7 +32,7 @@ class OrderPackage extends Component {
<div className="order-details-container">
<WiaasTableRow id={'delivery-address-' + order.id}>
<Col lg="4" sm="4" xs="4">{orderTexts.labels.DELIVERY_ADDRESS}:</Col>
<Col lg="8" sm="8" xs="8">{order.shipping.address_1}, {order.shipping.city}, {order.shipping.country}, {order.shipping.postcode}</Col>
<Col lg="8" sm="8" xs="8">{order.deliveryAddress}</Col>
</WiaasTableRow>
<WiaasTableRow id={'phone-' + order.id}>
<Col lg="4" sm="4" xs="4">{orderTexts.labels.PHONE_NUMBER}:</Col>
@@ -43,12 +43,12 @@ class OrderPackage extends Component {
<Col lg="8" sm="8" xs="8">{order.customer.email}</Col>
</WiaasTableRow>
<WiaasTableRow id={'commercial-lead-phone-' + order.id}>
<Col lg="4" sm="4" xs="4">{order.commercial_lead ? order.commercial_lead.name : ''} {orderTexts.labels.PHONE_NUMBER}:</Col>
<Col lg="8" sm="8" xs="8">{order.commercial_lead ? order.commercial_lead.phone : ''}</Col>
<Col lg="4" sm="4" xs="4">{order.commercialLead ? order.commercialLead.name : ''} {orderTexts.labels.PHONE_NUMBER}:</Col>
<Col lg="8" sm="8" xs="8">{order.commercialLead ? order.commercialLead.phone : ''}</Col>
</WiaasTableRow>
<WiaasTableRow id={'mail-' + order.id}>
<Col lg="4" sm="4" xs="4">{order.commercial_lead ? order.commercial_lead.name : ''} {orderTexts.labels.MAIL}:</Col>
<Col lg="8" sm="8" xs="8">{order.commercial_lead ? order.commercial_lead.email : ''}</Col>
<Col lg="4" sm="4" xs="4">{order.commercialLead ? order.commercialLead.name : ''} {orderTexts.labels.MAIL}:</Col>
<Col lg="8" sm="8" xs="8">{order.commercialLead ? order.commercialLead.email : ''}</Col>
</WiaasTableRow>
</div>
</WiaasBox>
@@ -58,24 +58,24 @@ class OrderPackage extends Component {
<WiaasTable>
<WiaasTableHeader headers={this.getHeadersByType(type)}/>
<WiaasTableBody>
{order.line_items.map((orderPackage, index) =>
<WiaasTableRow className="order-central-row" key={orderPackage.id + '-' + orderPackage.product_id}>
{order.packages.map((orderPackage, index) =>
<WiaasTableRow className="order-central-row" key={orderPackage.id}>
<WiaasTableCol header="Package" className="package-info-col">
<div className="package-name">{orderPackage.quantity} x {orderPackage.name}</div>
</WiaasTableCol>
<WiaasTableCol header="Price">
{this.calculateQuantityPrice(orderPackage.quantity, orderPackage.price).toLocaleString()} {orderPackage.packageCurrency && orderPackage.packageCurrency.currency} {' '}
({orderPackage.payment_type})
({orderPackage.paymentType})
</WiaasTableCol>
<WiaasTableCol header="Services and support">
{this.calculateQuantityPrice(orderPackage.quantity, orderPackage.service_price, orderPackage.recurring_price).toLocaleString() + ' / ' + orderPackage.period_unit + ' '}
{orderTexts.labels.EXTEND} {orderPackage.period_unit} (Max {orderPackage.max_contract_period})
{this.calculateQuantityPrice(orderPackage.quantity, orderPackage.servicePrice, orderPackage.recurringPrice).toLocaleString() + ' / ' + orderPackage.periodUnit + ' '}
{orderTexts.labels.EXTEND} {orderPackage.periodUnit} (Max {orderPackage.maxContractPeriod})
</WiaasTableCol>
<WiaasTableCol>
{
type === 'active'
? orderPackage.short_desc || '-'
: orderPackage.date_completed || '-'
? orderPackage.shortDesc || '-'
: orderPackage.dateCompleted || '-'
}
</WiaasTableCol>
</WiaasTableRow>

4
frontend/src/containers/orders/components/SupportMail.jsx
View File

@@ -75,13 +75,13 @@ class SupportMail extends Component {
</Col>
</Row>
{orderInfo.date_modified &&
{orderPackage.dateCompleted &&
<Row>
<Col>
<span className="subtitle">{orderTexts.labels.END_OF_LIFE}:</span>
</Col>
<Col xl="8">
<span>{orderPackage.date_completed}</span>
<span>{orderPackage.dateCompleted}</span>
</Col>
</Row>
}

4
frontend/src/containers/orders/style/Orders.scss
View File

@@ -18,7 +18,7 @@ $borderWidth: 3px;
border-left: $borderWidth $in-progress-status-color solid;
}
.order-border-production {
.order-border-completed {
border-left: $borderWidth $production-status-color solid;
}
@@ -26,7 +26,7 @@ $borderWidth: 3px;
border-left: $borderWidth $end-of-life-status-color solid;
}
.order-border-canceled {
.order-border-cancelled {
border-left: $borderWidth $canceled-status-color solid;
}

6
frontend/src/containers/orders/style/ProcessContainer.scss
View File

@@ -20,11 +20,11 @@ $link-line-height: 1.5rem;
border-left: $border-width $processing-status-color solid;
}
.canceled {
.cancelled {
border-left: $border-width $canceled-status-color solid;
}
.production {
.completed {
border-left: $border-width $production-status-color solid;
}
@@ -127,7 +127,7 @@ $link-line-height: 1.5rem;
background: $end-of-life-status-color;
}
.canceled {
.cancelled {
background: $canceled-status-color;
}

47
frontend/src/helpers/OrderHelper.js Normal file
View File

@@ -0,0 +1,47 @@
import moment from 'moment';
function formatDate(date) {
return date ? moment(date).format("Do MMM, YYYY") : undefined;
}
function formatAddress(addressObject) {
return `${addressObject.address_1}, ${addressObject.city}, ${addressObject.country}, ${addressObject.postcode}`;
}
export const fromWCOrder = (WCOrder) => {
return {
id: WCOrder.id,
number: WCOrder.number,
isMyOrder: WCOrder['is_my_order'],
dateCreated: formatDate(WCOrder['date_created']),
dateCompleted: formatDate(WCOrder['date_completed']),
estimatedDeliveryDate: undefined,
reference: 'reference field',
assignedTo: 'assigned to',
fixedPrice: WCOrder.total,
recurringPrice: 0,
status: WCOrder.status,
currency: WCOrder.currency,
packages: WCOrder['line_items'].map(packageLine => {
return {
id: packageLine['product_id'],
name: packageLine.name,
quantity: packageLine.quantity,
price: packageLine.price,
status: packageLine.status,
paymentType: packageLine['payment_type'],
servicePrice: packageLine['service_price'],
serviceContractPeriod: packageLine['service_contract_period'],
maxContractPeriod: packageLine['max_contract_period'],
periodUnit: packageLine['period_unit'],
recurringPrice: packageLine['recurring_price'],
payPeriod: packageLine['pay_period'],
shortDesc: packageLine['short_desc'],
dateCompleted: formatDate(packageLine['date_completed']),
};
}),
deliveryAddress: formatAddress(WCOrder.shipping),
customer: WCOrder.customer,
commercialLead: WCOrder['commercial_lead']
}
};