Order View Page

New hooks are available for this page. Check them out here 1.7.7.0

This page can be reached by visiting Sell -> Orders -> Orders -> View (grid row action). It allows the Back Office user to view the details of selected order and edit it. The related code can be found in following locations:

Once opened, the page will show following blocks:

Page blocks

Actions block

Order actions block

This block contains following actions:

Customer block

Order customer block

Contains information like customer email, addresses, orders count, total spent sum. Click the View full details link to see more information about the customer (it redirects to Customers -> Customers -> View customer page). This block also allows following actions:

Products block

Order products block

Contains a list of ordered products and prices summary. The list is rendered using javascript ajax by calling OrderController::getProductsListAction in order-view-page.ts. The response of this action is not a json, but a rendered template.

The product list has a pagination feature, but it is only a front-end pagination (not the database level) - all the products are loaded into the memory and handled by javascript. See admin-dev/themes/new-theme/js/pages/order/view/order-product-renderer.ts.

The following actions can be done in this block (most of these actions are related to OrderDetail - one OrderDetail is equivalent to one row in a products list):

It is possible to have multiple invoices related to same order, therefore when editing a product or adding a discount you can select which invoice to use.

Order invoice select

Messages block

Order messages in Back Office

This block shows order messages (relies on OrderMessage). These messages can be visible for the customer in Front Office order details or can stay hidden - that depends on the checkbox Display to customer.

Order messages in Front Office

Predefined message can be chosen in a dropdown which contains a list of message templates from Sell -> Customer service -> Order messages. This page can be quickly reached by clicking a shortcut link Configure predefined messages. Message sending is handled by OrderController::sendMessageAction, while the related javascript code is located in order-view-page-messages-handler.ts.

History block

Order history block

This block doesn’t have an actual title like others, but let’s just call it “History block” for now - it’s the one containing following tabs:

  • Status - you can see transitions of this order statuses and update the status, you can also add an Order note in this tab. (Order->note). See OrderController::setInternalNoteAction.
  • Documents - this tab contains invoices list.
  • Carriers - contains carriers information. You can change the current carrier and add a tracking number. See OrderController::updateShippingAction.
  • Merchandise returns - information about refunds history.

Payments block

Order payments block

Shows a list of payments done for this order and allows manually adding a payment. See OrderController::addPaymentAction.

If order total and payments amount sum differs, then a warning in this block will notify the Back Office user about the difference.

Payment difference warning