Cannot add new custom column to sales_order_grid. ...

victordiazd3e0 · ‎08-15-2021

Hello everyone I'm taking a Magento tutorial and got stuck on this topic "UI Components" I've been trying to add a new custom colum to this order sales grid (SALES > Orders) and I have failed so can anyone help me out on this? Thank you very much!!

My module:

app/code/Mageplaza/HolaMundo/etc/module.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Mageplaza_HolaMundo" setup_version="1.0.11">
        <sequence>
            <module name="Magento_Sales" />
        </sequence>
    </module>
</config>

Sales order grid xml path:

app/code/Mageplaza/HolaMundo/view/adminhtml/ui_component/sales_order_grid.xml

<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
   <columns name="sales_order_columns">
       <column name="base_tax_amount" class="Magento\Sales\Ui\Component\Listing\Column\Price">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">textRange</item>
                    <item name="label" xsi:type="string" translate="true">Base Tax Amount</item>                
                </item>
            </argument>
        </column>
    </columns>
</listing>

di.xml file path:

app/code/Mageplaza/HolaMundo/etc/adminhtml/di.xml

<?xml version="1.0" encoding="utf-8" ?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <virtualType name="Magento\Sales\Model\ResourceModel\Order\Grid">
        <arguments>
            <argument name="columns" xsi:type="array">
                <item name="base_tax_amount" xsi:type="string">sales_order.base_tax_amount</item>
            </argument>
        </arguments>
    </virtualType>
</config>

I think this is all I have to do for at least display this new empty column after running the next commands:

php bin/magento setup:upgrade

php bin/magento cache:flush

sudo chmod -R 777 var/ pub/ generated/

am I correct? Once again thank you!

Sanjay Jethva · ‎08-15-2021

@victordiazd3e0

Create di.xml file at app\code\Vendor\Module\etc\ with following code:

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <type name="Magento\Framework\View\Element\UiComponent\DataProvider\CollectionFactory">
        <arguments>
            <argument name="collections" xsi:type="array">
                <item name="sales_order_grid_data_source" xsi:type="string">Vendor\Module\Model\ResourceModel\Order\Grid\Collection</item>
            </argument>
        </arguments>
    </type>
    <type name="Vendor\Module\Model\ResourceModel\Order\Grid\Collection">
        <arguments>
            <argument name="mainTable" xsi:type="string">sales_order_grid</argument>
            <argument name="resourceModel" xsi:type="string">Magento\Sales\Model\ResourceModel\Order</argument>
        </arguments>
    </type>
</config>

Create Collection.php file at app\code\Vendor\Module\Model\ResourceModel\Order\Grid\ with the following code:

<?php

namespace Vendor\Module\Model\ResourceModel\Order\Grid;

use Magento\Framework\Data\Collection\Db\FetchStrategyInterface as FetchStrategy;
use Magento\Framework\Data\Collection\EntityFactoryInterface as EntityFactory;
use Magento\Framework\Event\ManagerInterface as EventManager;
use Magento\Sales\Model\ResourceModel\Order\Grid\Collection as OriginalCollection;
use Psr\Log\LoggerInterface as Logger;

/**
 * Order grid extended collection
 */
class Collection extends OriginalCollection
{
    protected $helper;

    public function __construct(
        EntityFactory $entityFactory,
        Logger $logger,
        FetchStrategy $fetchStrategy,
        EventManager $eventManager,
        $mainTable = 'sales_order_grid',
        $resourceModel = \Magento\Sales\Model\ResourceModel\Order::class
    )
    {
        parent::__construct($entityFactory, $logger, $fetchStrategy, $eventManager, $mainTable, $resourceModel);
    }

    protected function _renderFiltersBefore()
    {
        $joinTable = $this->getTable('sales_order');
        $this->getSelect()->joinLeft($joinTable, 'main_table.entity_id = sales_order.entity_id', ['tax_amount', 'discount_amount', 'coupon_code']);
        parent::_renderFiltersBefore();
    }
}

Create sales_order_grid.xml file app\code\Vendor\Module\view\adminhtml\ui_component\ with following code:

<?xml version="1.0" encoding="UTF-8"?>
<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <columns name="sales_order_columns">
        <column name="tax_amount" class="Magento\Sales\Ui\Component\Listing\Column\PurchasedPrice">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">textRange</item>
                    <item name="label" xsi:type="string" translate="true">Tax Amount</item>
                </item>
            </argument>
        </column>
        <column name="discount_amount" class="Magento\Sales\Ui\Component\Listing\Column\PurchasedPrice">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">textRange</item>
                    <item name="label" xsi:type="string" translate="true">Discount Amount</item>
                </item>
            </argument>
        </column>
        <column name="coupon_code">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">text</item>
                    <item name="label" xsi:type="string" translate="true">Coupon Code</item>
                </item>
            </argument>
        </column>
    </columns>
</listing>

Problem solved? Click Kudos and "Accept as Solution".
200+ Magento 2 Extensions for Enhanced Shopping Experience.