загрузить компонент пользовательского интерфейса сетки продуктов


Я хочу загрузить сетку продуктов через ui_component.

 <fieldset name="fieldset_name">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="label" xsi:type="string" translate="true">Label Bane</item>
        </item>
    </argument>

    <!-- This field represents form id and is hidden -->
    <field name="id">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="visible" xsi:type="boolean">false</item>
                <item name="dataType" xsi:type="string">text</item>
                <item name="formElement" xsi:type="string">input</item>
                <item name="source" xsi:type="string">model</item>
            </item>
        </argument>
    </field>


    <!-- This field has data type 'text' and standard 'input' form element and looks like input -->
    <field name="product_name">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="label" xsi:type="string">Product Name</item>
                <item name="dataType" xsi:type="string">text</item>
                <item name="visible" xsi:type="boolean">true</item>
                <item name="formElement" xsi:type="string">input</item>
                <item name="source" xsi:type="string">model</item>
            </item>
        </argument>
    </field>

    <!-- Source: https://magento.stackexchange.com/questions/180037/magento-2-how-to-add-custom-grid-using-ui-component-in-admin-form-tab -->
    <insertListing>
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="autoRender" xsi:type="boolean">true</item>
                 <!-- ui_component name -->
                <item name="ns" xsi:type="string">modulename_productgrid_listing</item>
            </item>
        </argument>
    </insertListing>

</fieldset>

Как вы можете видеть, я использую вставку для загрузки "пользовательской" сетки продуктов. (если на самом деле это на 100 % совпадает с /vendor/magento/module-catalog/view/adminhtml/ui_component/product_listing.xml ).

Когда я проверяю свою консоль в разделе XHR, я вижу продукты, но когда я проверяю экран, сетка продолжает загружаться. другие поля показаны, и их нет ошибки

Редактировать: добавлено имя модуля_продуктгрид_листинг:

<?xml version="1.0" encoding="UTF-8"?>
<!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <argument name="data" xsi:type="array">
        <item name="js_config" xsi:type="array">
            <item name="provider" xsi:type="string">product_listing.product_listing_data_source</item>
        </item>
    </argument>
    <settings>
        <spinner>product_columns</spinner>
        <deps>
            <dep>product_listing.product_listing_data_source</dep>
        </deps>
    </settings>
    <dataSource name="product_listing_data_source" component="Magento_Ui/js/grid/provider">
        <settings>
            <storageConfig>
                <param name="dataScope" xsi:type="string">filters.store_id</param>
            </storageConfig>
            <updateUrl path="mui/index/render"/>
        </settings>
        <aclResource>Magento_Catalog::products</aclResource>
        <dataProvider class="Magento\Catalog\Ui\DataProvider\Product\ProductDataProvider" name="product_listing_data_source">
            <settings>
                <requestFieldName>id</requestFieldName>
                <primaryFieldName>entity_id</primaryFieldName>
            </settings>
        </dataProvider>
    </dataSource>
    <listingToolbar name="listing_top">
        <settings>
            <sticky>true</sticky>
        </settings>
        <bookmark name="bookmarks"/>
        <columnsControls name="columns_controls"/>
        <filters name="listing_filters">
            <filterSelect name="store_id" provider="${ $.parentName }">
                <settings>
                    <options class="Magento\Store\Ui\Component\Listing\Column\Store\Options"/>
                    <caption translate="true">All Store Views</caption>
                    <label translate="true">Store View</label>
                    <dataScope>store_id</dataScope>
                </settings>
            </filterSelect>
        </filters>
        <paging name="listing_paging"/>
    </listingToolbar>
    <columns name="product_columns" class="Magento\Catalog\Ui\Component\Listing\Columns">
        <settings>
            <childDefaults>
                <param name="fieldAction" xsi:type="array">
                    <item name="provider" xsi:type="string">product_listing.product_listing.product_columns.actions</item>
                    <item name="target" xsi:type="string">applyAction</item>
                    <item name="params" xsi:type="array">
                        <item name="0" xsi:type="string">edit</item>
                        <item name="1" xsi:type="string">${ $.$data.rowIndex }</item>
                    </item>
                </param>
            </childDefaults>
        </settings>
        <selectionsColumn name="ids" sortOrder="0">
            <settings>
                <indexField>entity_id</indexField>
            </settings>
        </selectionsColumn>
        <column name="entity_id" sortOrder="10">
            <settings>
                <filter>textRange</filter>
                <label translate="true">ID</label>
                <sorting>asc</sorting>
            </settings>
        </column>
        <column name="thumbnail" class="Magento\Catalog\Ui\Component\Listing\Columns\Thumbnail" component="Magento_Ui/js/grid/columns/thumbnail" sortOrder="20">
            <settings>
                <altField>name</altField>
                <hasPreview>1</hasPreview>
                <addField>true</addField>
                <label translate="true">Thumbnail</label>
                <sortable>false</sortable>
            </settings>
        </column>
        <column name="name" sortOrder="30">
            <settings>
                <addField>true</addField>
                <filter>text</filter>
                <label translate="true">Name</label>
            </settings>
        </column>
        <column name="type_id" component="Magento_Ui/js/grid/columns/select" sortOrder="40">
            <settings>
                <options class="Magento\Catalog\Model\Product\Type"/>
                <filter>select</filter>
                <dataType>select</dataType>
                <label translate="true">Type</label>
            </settings>
        </column>
        <column name="attribute_set_id" component="Magento_Ui/js/grid/columns/select" sortOrder="50">
            <settings>
                <options class="Magento\Catalog\Model\Product\AttributeSet\Options"/>
                <filter>select</filter>
                <dataType>select</dataType>
                <label translate="true">Attribute Set</label>
            </settings>
        </column>
        <column name="sku" sortOrder="60">
            <settings>
                <filter>text</filter>
                <label translate="true">SKU</label>
            </settings>
        </column>
        <column name="price" class="Magento\Catalog\Ui\Component\Listing\Columns\Price" sortOrder="70">
            <settings>
                <addField>true</addField>
                <filter>textRange</filter>
                <label translate="true">Price</label>
            </settings>
        </column>
        <column name="visibility" component="Magento_Ui/js/grid/columns/select" sortOrder="80">
            <settings>
                <addField>true</addField>
                <options class="Magento\Catalog\Model\Product\Visibility"/>
                <filter>select</filter>
                <dataType>select</dataType>
                <label translate="true">Visibility</label>
            </settings>
        </column>
        <column name="status" component="Magento_Ui/js/grid/columns/select" sortOrder="90">
            <settings>
                <addField>true</addField>
                <options class="Magento\Catalog\Model\Product\Attribute\Source\Status"/>
                <filter>select</filter>
                <dataType>select</dataType>
                <label translate="true">Status</label>
            </settings>
        </column>
        <column name="websites" class="Magento\Catalog\Ui\Component\Listing\Columns\Websites" sortOrder="100">
            <settings>
                <addField>true</addField>
                <options class="Magento\Store\Model\ResourceModel\Website\Collection"/>
                <dataType>text</dataType>
                <label translate="true">Websites</label>
            </settings>
        </column>
        <actionsColumn name="actions" class="Magento\Catalog\Ui\Component\Listing\Columns\ProductActions" sortOrder="200">
            <settings>
                <indexField>entity_id</indexField>
            </settings>
        </actionsColumn>
    </columns>
</listing>
Author: Nagaraju K, 2018-12-16

1 answers

Пожалуйста, замените имя списка во всем файле

Product_listing к имени файла вашего списка имя модуля_продуктгрид_листинг

Пример:

<argument name="data" xsi:type="array">
    <item name="js_config" xsi:type="array">
        <item name="provider" xsi:type="string">**product_listing**.product_listing_data_source</item>
    </item>
</argument>

Product_listing это нужно изменить с именем вашей сетки продуктов

 2
Author: Rutvee Sojitra, 2018-12-19 04:12:43