[UI] Reimplement calendar views (#8933)

* Add deps for @fullcalendar

* Basic calendar setup

* Add locale support

* Add custom <SegmentedIconControl> component

* optional 'control' for panel

* Scaffolding out build index page

* Fetch build orders based on calendar dates

* Display builds

* Click to navigate to build

* Working on custom header

* Implement button functionality

* Display current month name

* Implement datepicker dropdown

* Adjust layout

* Custom rendering

* Include part detail

* Implement hook to track calendar state

* Clearing search causes immediate update

* Offload core functionality into hook

- Adds search input

* Spread props correctly

* Cleanup

* Allow build orders to be edited directly from calendar view

* Cleanup

* Fix for InvenTreeCalendarProps

* Improve date range filtering for Build model

* Simplify BuildFilter

* Refactoring

* PurchaseOrder calendar implementation

* Allow edit of purchase orders

* Refactor and implement for all order types

- Add missing "issue_date" field for SalesOrder
- Refactor API for other order types
- Fix rendering issues

* Bump API version

* Add playwright tests for calendar (simple)

* Fix migrations

* Simplify notifications

* Refactor filter components

- Make them more generic

* Enable custom filters for calendars

* Custom filters per table

* Display status label

* Refactoring

* Update playwright tests

* Update build order docs

* Bug fix for order date editing

* Update purchase order docs

* Return Order docs

* Update date formatting

docs/docs/build/build.md

@@ -12,12 +12,16 @@ A *Build Order* uses the BOM to allocate stock items to the assembly process. As
 
 ### View Build Orders
 
-To navigate to the Build Order display, select *Build* from the main navigation menu:
+To navigate to the Build Order display, select *Manufacturing* from the main navigation menu, and *Build Orders* from the sidebar.
+
+The *Build Order Index Page* allows the user to view all build orders:
 
 {% with id="build_display", url="build/build_display.png", description="Display Builds" %}
 {% include "img.html" %}
 {% endwith %}
 
+The following view modes are available:
+
 #### Table View
 
 *Table View* provides a table of Build Orders, which can be filtered to only show the orders you are interested in.
@@ -28,7 +32,13 @@ To navigate to the Build Order display, select *Build* from the main navigation
 
 #### Calendar View
 
-*Calendar View* shows a calendar display with upcoming build orders, based on the various dates specified for each build.
+*Calendar View* shows a calendar display with outstanding build orders, based on the various dates specified for each order.
+
+{% with id="build_calendar", url="build/build_calendar.png", description="Build Calendar" %}
+{% include "img.html" %}
+{% endwith %}
+
+The build calendar allows the user to navigate month-by-month and display the filtered build orders
 
 ## Build Order Details
 

docs/docs/order/purchase_order.md

@@ -6,12 +6,32 @@ title: Purchase Order
 
 Purchase orders allow to track which parts are bought from suppliers and manufacturers, therefore converting externally bought items into stock items / inventory.
 
-To access the purchase order page, click on the <span class="badge inventree nav main"><span class='fas fa-shopping-cart'></span> Buy</span> navigation tab and click on <span class="badge inventree nav main"><span class='fas fa-list'></span> Purchase Orders</span> option in the dropdown list.
+### View Purchase Orders
+
+To navigate to the Purchase Order display, select *Purchasing* from the main navigation menu, and *Build Orders* from the sidebar:
+
+{% with id="purchase_order_display", url="order/po_display.png", description="Purchase Order Display" %}
+{% include "img.html" %}
+{% endwith %}
+
+The following view modes are available:
+
+#### Table View
+
+*Table View* provides a list of Purchase Orders, which can be filtered to display a subset of orders according to user supplied parameters.
 
 {% with id="purchase_order_list", url="order/po_list.png", description="Purchase Order List" %}
 {% include "img.html" %}
 {% endwith %}
 
+#### Calendar View
+
+*Calendar View* shows a calendar display with outstanding purchase orders, based on the various dates specified for each order.
+
+{% with id="purchase_order_calendar", url="order/po_calendar.png", description="Purchase Order Calendar" %}
+{% include "img.html" %}
+{% endwith %}
+
 ### Purchase Order Status Codes
 
 Each Purchase Order has a specific status code which indicates the current state of the order:

docs/docs/order/return_order.md

@@ -9,6 +9,32 @@ Return Orders allow stock items (which have been sold or allocated to a customer
 !!! tip "An Order By Any Other Name"
     A Return Order may also be known as an [RMA](https://en.wikipedia.org/wiki/Return_merchandise_authorization)
 
+### View Return Orders
+
+To navigate to the Return Order display, select *Sales* from the main navigation menu, and *Return Orders* from the sidebar:
+
+{% with id="return_order_display", url="order/ro_display.png", description="Return Order Display" %}
+{% include "img.html" %}
+{% endwith %}
+
+The following view modes are available:
+
+#### Table View
+
+*Table View* provides a list of Return Orders, which can be filtered to display a subset of orders according to user supplied parameters.
+
+{% with id="purchase_order_list", url="order/po_list.png", description="Return Order List" %}
+{% include "img.html" %}
+{% endwith %}
+
+#### Calendar View
+
+*Calendar View* shows a calendar display with outstanding return orders, based on the various dates specified for each order.
+
+{% with id="return_order_calendar", url="order/ro_calendar.png", description="Return Order Calendar" %}
+{% include "img.html" %}
+{% endwith %}
+
 ### Enable Return Order Functionality
 
 By default, Return Order functionality is not enabled - it must be enabled by a *staff* user from the settings page:

docs/docs/order/sales_order.md

@@ -6,12 +6,32 @@ title: Sales Orders
 
 Sales orders allow tracking of which stock items are sold to customers, therefore converting stock items / inventory into externally sold items.
 
-To access the sales order page, click on the <span class="badge inventree nav main"><span class='fas fa-truck'></span> Sell</span> navigation tab and click on <span class="badge inventree nav main"><span class='fas fa-list'></span> Sales Orders</span> option in the dropdown list.
+### View Sales Orders
+
+To navigate to the Sales Order display, select *Sales* from the main navigation menu, and *Sales Orders* from the sidebar:
+
+{% with id="sales_order_display", url="order/so_display.png", description="Sales Order Display" %}
+{% include "img.html" %}
+{% endwith %}
+
+The following view modes are available:
+
+#### Table View
+
+*Table View* provides a list of Sales Orders, which can be filtered to display a subset of orders according to user supplied parameters.
 
 {% with id="sales_order_list", url="order/so_list.png", description="Sales Order List" %}
 {% include "img.html" %}
 {% endwith %}
 
+#### Calendar View
+
+*Calendar View* shows a calendar display with outstanding sales orders.
+
+{% with id="sales_order_calendar", url="order/so_calendar.png", description="Sales Order Calendar" %}
+{% include "img.html" %}
+{% endwith %}
+
 ### Sales Order Status Codes
 
 Each Sales Order has a specific status code, which represents the state of the order: