[IMP] (sale_)stock: review forecasted information

Remove the json_forecast of the sale order line,
it was a duplicate of information with the qty_at_date_widget.
But improve this one:
- Use the forecasted move information in case of confirmed SO.
- Change the icon (i) to chart.
- Link to the forcasted change to target new forcasted report
(Unfortunately we loose the feature to see components product forcasted
of a kit)
- Change information print in the popover in case of confirmed SO.

Also refactor the json_forcasted of `stock.move` into multiple fields
to avoid to dump/loads for other model who needed the forcasted data.

task-2324039

closes odoo/odoo#56425

Related: odoo/enterprise#13063
Signed-off-by: Arnold Moyaux <amoyaux@users.noreply.github.com>

2 files changed, 35 insertions, 14 deletions

diff --git a/addons/stock/static/src/js/forecast_widget.js b/addons/stock/static/src/js/forecast_widget.js
index 6cbf4986774..b3535121268 100644
--- a/addons/stock/static/src/js/forecast_widget.js
+++ b/addons/stock/static/src/js/forecast_widget.js
@@ -3,22 +3,42 @@ odoo.define('stock.forecast_widget', function (require) {
 
 const AbstractField = require('web.AbstractField');
 const fieldRegistry = require('web.field_registry');
+const field_utils = require('web.field_utils');
+const utils = require('web.utils');
 const core = require('web.core');
 const QWeb = core.qweb;
 
 const ForecastWidgetField = AbstractField.extend({
-    supportedFieldTypes: ['char'],
+    supportedFieldTypes: ['float'],
 
     _render: function () {
-        const forecastData = JSON.parse(this.value);
-        if (!forecastData) {
-            this.$el.html('');
-        } else {
-            // Don't display the graph button for non-storable products or if was explicited.
-            forecastData.hideReportButton = this.recordData.product_type !== 'product';
-            this.$el.html(QWeb.render('stock.forecastWidget', forecastData));
-            this.$el.on('click', this._onOpenReport.bind(this));
+        var data = Object.assign({}, this.record.data, {
+            forecast_availability_str: field_utils.format.float(
+                this.record.data.forecast_availability,
+                this.record.fields.forecast_availability,
+                this.nodeOptions
+            ),
+            reserved_availability_str: field_utils.format.float(
+                this.record.data.reserved_availability,
+                this.record.fields.reserved_availability,
+                this.nodeOptions
+            ),
+            forecast_expected_date_str: field_utils.format.date(
+                this.record.data.forecast_expected_date,
+                this.record.fields.forecast_expected_date
+            ),
+        });
+        if (data.forecast_expected_date && data.date_deadline) {
+            data.forecast_is_late = data.forecast_expected_date > data.date_deadline;
         }
+        data.will_be_fulfilled = utils.round_decimals(data.forecast_availability, this.record.fields.forecast_availability.digits[1]) >= utils.round_decimals(data.product_qty, this.record.fields.product_qty.digits[1]);
+
+        this.$el.html(QWeb.render('stock.forecastWidget', data));
+        this.$el.on('click', this._onOpenReport.bind(this));
+    },
+
+    isSet: function () {
+        return true;
     },
 
     //--------------------------------------------------------------------------
diff --git a/addons/stock/static/src/xml/forecast_widget.xml b/addons/stock/static/src/xml/forecast_widget.xml
index 2e53943803c..2f2f14b2ec5 100644
--- a/addons/stock/static/src/xml/forecast_widget.xml
+++ b/addons/stock/static/src/xml/forecast_widget.xml
@@ -1,11 +1,12 @@
 <?xml version="1.0" encoding="utf-8"?>
 <templates id="template" xml:space="preserve">
     <t t-name="stock.forecastWidget">
-        <span t-if="reservedAvailability" t-esc="reservedAvailability"/>
-        <span t-elif="!expectedDate" style="color: red;">Not Available</span>
-        <span t-else="" t-att-style="'color: ' + (isLate ? 'red;' : 'orange;')">Exp <t t-esc="expectedDate"/></span>
-        <button t-if="!hideReportButton" class="o_forecast_report_button btn btn-link o_icon_button ml-2" title="Forecasted Report">
-            <i class="fa fa-fw fa-area-chart"/>
+        <span t-if="['draft', 'partially_available', 'assigned'].includes(state)" t-esc="reserved_availability_str"/>
+        <span t-elif="!forecast_expected_date_str and will_be_fulfilled" class="text-success">Available</span>
+        <span t-elif="forecast_expected_date_str" t-att-class="forecast_is_late ? 'text-danger' : 'text-warning'">Exp <t t-esc="forecast_expected_date_str"/></span>
+        <span t-else="" class="text-danger">Not Available</span>
+        <button t-if="product_type == 'product'" class="o_forecast_report_button btn btn-link o_icon_button ml-2" title="Forecasted Report">
+            <i t-attf-class="fa fa-fw fa-area-chart {{ state != 'draft' and (!will_be_fulfilled or forecast_is_late) ? 'text-danger' : '' }}"/>
         </button>
     </t>
 </templates>