Magento 2 - Add a column and mass action to admin order grid

In magento 2, the grid has been changed to another format. Now, we can add the complete grid in an xml file and it will get loaded in the admin. Let us try to add a column in admin order grid. Earlier, we can do that using block load observer and addblockafter function.

The view folder inside a module is used for theme related files. Check the blog post for explanation on the view folder files. Inside view/adminhtml folder add ui_component/sales_order_grid.xml, which is used to load the grid. It uses magneto/ui module to load the grid html. We will try to add a column and massaction to admin order grid. The below code adds a massaction option and an action column.

<?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">
    <container name="listing_top">
        <massaction name="listing_massaction">
            <action name="unique_name">
                <argument name="data" xsi:type="array">
                    <item name="config" xsi:type="array">
                        <item name="type" xsi:type="string">unique_name</item>
                        <item name="label" xsi:type="string" translate="true">Do massaction</item>
                        <item name="url" xsi:type="url" path="vendor_modulename/order/domassaction"/>
                    </item>
                </argument>
            </action>
        </massaction>
    </container>
    <columns name="sales_order_columns">
        <actionsColumn name="unique_name" class="VendorName\ModuleName\Ui\Component\Listing\Column\Order\PrintAction">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="indexField" xsi:type="string">entity_id</item>
                    <item name="viewUrlPath" xsi:type="string">vendor_modulename/order/index</item>
                    <item name="urlEntityParamName" xsi:type="string">order_id</item>
                </item>
            </argument>
        </actionsColumn>
    </columns>
</listing>

The massaction controller Domassaction.php will get the order ids and will process the data.

namespace VendorName\ModuleName\Controller\Adminhtml\Order;

class Domassaction extends \Magento\Sales\Controller\Adminhtml\Order\AbstractMassAction {

    protected function massAction(AbstractCollection $collection) {
        //$collection is the order collection data for the order ids selected
        $orderIds = $collection->getAllIds();
        //perform the required actions and redirect
    }

    protected function _isAllowed() {
        return $this->_authorization->isAllowed('VendorName_ModuleName::unique_name');
    }

}

The UI component PrintAction.php, will add an action to the grid. If you want to add a field value, then change actionColumns with column in the xml code above.

namespace VendorName\ModuleName\Ui\Component\Listing\Column\Order;

class PrintAction extends Column {
    
    public function prepareDataSource(array $dataSource) {
        if (isset($dataSource['data']['items'])) {
            foreach ($dataSource['data']['items'] as & $item) {

                $viewUrlPath = $this->getData('config/viewUrlPath') ? : '#';
                $urlEntityParamName = $this->getData('config/urlEntityParamName') ? : 'entity_id';

                $item[$this->getData('name')] = [
                    'ModuleName' => [
                        'href' => $this->context->getUrl(
                                $viewUrlPath, [$urlEntityParamName => $item['entity_id']]
                        ),
                        'label' => 'Print',
                    ]
                ];
            }
        }

        return $dataSource;
    }

}