Magento 2后端修改的自定义网格

Question

我是新手 Magento2 开发人员。 现在我正在制作一个小模块，但我被困在一个地方。 我用founded example 构建了管理网格，这是我的 di.xml：

<preference for="Magento\Catalog\Model\Product" type="Vendor\Module\Model\Product" /> 
<virtualType name="Vendor\Module\Model\ResourceModel\Grid\Grid\Collection" type="Magento\Framework\View\Element\UiComponent\DataProvider\SearchResult">
        <arguments>
            <argument name="mainTable" xsi:type="string">vendor_module</argument>
            <argument name="resourceModel" xsi:type="string">Vendor\Module\Model\ResourceModel\Grid</argument>
        </arguments> 
</virtualType> 
<type name="Magento\Framework\View\Element\UiComponent\DataProvider\CollectionFactory">
        <arguments>
            <argument name="collections" xsi:type="array">
                <item name="grid_record_grid_list_data_source" xsi:type="string">Vendor\Module\Model\ResourceModel\Grid\Grid\Collection</item>
            </argument>
        </arguments>
</type>

我还使用带有硬编码列的布局 XML 文件：

...
    <column name="customer" >
         <argument name="data" xsi:type="array">
             <item name="config" xsi:type="array">
                <item name="filter" xsi:type="string">false</item>
                <item name="label" xsi:type="string" translate="true">Customer</item>
              </item>
          </argument>
    </column>
...

我的表格有如下列：产品 ID、客户 ID、价格、状态

我的问题是：

• 如何将客户 ID 转换为名字+姓氏？
• “status” 列有 3 种不同的状态（0、1 和 2） - 如何将它们转换为人类可读的单词？ （未定义，好，坏）
• 如何在同一网格中添加另一列，例如 $price + 10%？

Answer 1

在组件 XML 中，您可以定义一个 UI 类来帮助在 Magento 2 中显示自定义/可读数据。核心中有许多示例，例如在目录网格视图上显示的缩略图。

以此为例，这是catalog/view/adminhtml/ui_component/product_listing.xml 中的列定义：

<column name="thumbnail" class="Magento\Catalog\Ui\Component\Listing\Columns\Thumbnail">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/thumbnail</item>
                <item name="add_field" xsi:type="boolean">true</item>
                <item name="sortable" xsi:type="boolean">false</item>
                <item name="altField" xsi:type="string">name</item>
                <item name="has_preview" xsi:type="string">1</item>
                <item name="label" xsi:type="string" translate="true">Thumbnail</item>
                <item name="sortOrder" xsi:type="number">20</item>
            </item>
        </argument>
    </column>

如您所见，有几个参数可以传递给列定义，包括一个取决于您要显示的数据类型的组件。在这种情况下，它是一个缩略图。查看该 JS 文件可以发现，将以下方法中设置的数据拉出以显示为实际缩略图是符合逻辑的。这不一定是要求。

在列标记上定义的类中，您会看到Magento\Catalog\Ui\Component\Listing\Columns\Thumbnail。这是一个类，它定义了数据显示方式的辅助方法，以及解析要显示的数据以使定义的列组件可以正确呈现它。

密切关注该类中的方法，prepareDataSource：

/**
 * Prepare Data Source
 *
 * @param array $dataSource
 * @return array
 */
public function prepareDataSource(array $dataSource)
{
    if (isset($dataSource['data']['items'])) {
        $fieldName = $this->getData('name');
        foreach ($dataSource['data']['items'] as & $item) {
            $product = new \Magento\Framework\DataObject($item);
            $imageHelper = $this->imageHelper->init($product, 'product_listing_thumbnail');
            $item[$fieldName . '_src'] = $imageHelper->getUrl();
            $item[$fieldName . '_alt'] = $this->getAlt($item) ?: $imageHelper->getLabel();
            $item[$fieldName . '_link'] = $this->urlBuilder->getUrl(
                'catalog/product/edit',
                ['id' => $product->getEntityId(), 'store' => $this->context->getRequestParam('store')]
            );
            $origImageHelper = $this->imageHelper->init($product, 'product_listing_thumbnail_preview');
            $item[$fieldName . '_orig_src'] = $origImageHelper->getUrl();
        }
    }

    return $dataSource;
}

您可以使用此方法将您显示的数据格式化为您需要的格式。

例如，价格通过其定义的列类显示在目录网格（格式化为适当的货币）上的方式是：

public function prepareDataSource(array $dataSource)
{
    if (isset($dataSource['data']['items'])) {
        $store = $this->storeManager->getStore(
            $this->context->getFilterParam('store_id', \Magento\Store\Model\Store::DEFAULT_STORE_ID)
        );
        $currency = $this->localeCurrency->getCurrency($store->getBaseCurrencyCode());

        $fieldName = $this->getData('name');
        foreach ($dataSource['data']['items'] as & $item) {
            if (isset($item[$fieldName])) {
                $item[$fieldName] = $currency->toCurrency(sprintf("%f", $item[$fieldName]));
            }
        }
    }

    return $dataSource;
}

我希望这有助于阐明如何格式化网格上的列中的数据。