WooCommerce: Display the discounted amount per product on the Order Details table.

functions.php

<?php

/*
* Snippet: Display the discounted amount per product on the Order Details in WooCommerce.
* Full Explanation: https://obijuan.dev/display-the-discounted-amount-per-product-on-the-order-details-in-woocommerce/.
* Author: Obi Juan
* Author URI: https://obijuan.dev
* License: GPL V2 or later.
*/

add_action('woocommerce_order_item_meta_end', 'display_product_discount', 10, 3);
function display_product_discount($item_id, $item, $order) {
    // Get the original product price from the order item data
    $original_price = (float) $item->get_subtotal() / $item->get_quantity();

    // Get the actual price the customer paid for the product in the order
    $order_price_per_item = (float) $item->get_total() / $item->get_quantity();

    // Check if the product was discounted
    if ($order_price_per_item < $original_price) {
        // Calculate the discount per product
        $discount_per_product = $original_price - $order_price_per_item;

        // Display discount per product and discounted price with inline CSS
        echo '<div class="product-discount">';
        echo 'Discount: ' . wc_price($discount_per_product) . '<br>';
        echo '<span style="color: green; font-weight: bold;">Price after discount: ' . wc_price($order_price_per_item) . '</span>';
        echo '</div>';
    }
}