Magento 2 Ajouter une entrée de rendu d'arbre de catégorie avec bouton modal

J'essaie de placer l'entrée de catégorie pour mon formulaire personnalisé en utilisant le formulaire uicomponent.

Je peux créer une liste déroulante, mais comment créer le bouton et en ouvrir un nouveau modal?

Puis-je créer un bouton en utilisant uicomponent et en ouvrir un modal . Je veux un bouton au lieu d'une nouvelle catégorie Je veux ajouter un bouton de sélection de produits et je veux afficher la liste des produits des catégories sélectionnées dans la grille.

Voici le xml pour créer l'entrée de catégorie

<field name="parent">
    <argument name="data" xsi:type="array">
    <item name="options" xsi:type="object">Magento\Catalog\Ui\Component\Product\Form\Categories\Options</item>
     <item name="config" xsi:type="array">
          <item name="label" xsi:type="string" translate="true">Parent Category</item>
          <item name="componentType" xsi:type="string">field</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="component" xsi:type="string">Magento_Catalog/js/components/new-category</item>
           <item name="elementTmpl" xsi:type="string">ui/grid/filters/elements/ui-select</item>
           <item name="dataScope" xsi:type="string">data.parent</item>
           <item name="filterOptions" xsi:type="boolean">true</item>
           <item name="showCheckbox" xsi:type="boolean">false</item>
           <item name="disableLabel" xsi:type="boolean">true</item>
           <item name="multiple" xsi:type="boolean">false</item>
           <item name="levelsVisibility" xsi:type="number">1</item>
           <item name="sortOrder" xsi:type="number">20</item>
           <item name="required" xsi:type="boolean">true</item>
           <item name="validation" xsi:type="array">
                  <item name="required-entry" xsi:type="boolean">true</item>
            </item>
            <item name="listens" xsi:type="array">
                  <item name="${ $.namespace }.${ $.namespace }:responseData" xsi:type="string">setParsed</item>
             </item>
      </item>
     </argument>
</field>

— Priyank
source

Jusqu'à ce que je puisse comprendre ce qui s'y trouve et peut-être trouver une réponse, je peux vous recommander de jeter un coup d'œil au Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\Categoriescours. C'est celui qui ajoute le sélecteur d'arborescence des catégories à l'écran d'ajout / modification de produit. Vous avez peut-être plus de chance de comprendre ce qui s'y trouve.

— Marius

@Marius Ya regardant la même chose semble que c'est la meilleure façon de le faire.

— Priyank

Hé, je pense que l'ajout de modificateurs n'est utilisé que pour la forme du produit et il est très difficile de l'ajouter pour un modèle personnalisé après l'avoir cherché pendant environ 3 jours, je suis devenu fou. Je reçois simplement le nom de l'élément de composant d'interface utilisateur non valide: 'category_mapping_form'

— Priyank

Comment fonctionnent les options sélectionnées ici?

— Amrit Pal Singh

Ce code ci-dessous fonctionne avec moi:

     <container>
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
            <item name="formElement" xsi:type="string">container</item>
            <item name="component" xsi:type="string">Magento_Ui/js/form/components/group</item>
        </item>
        </argument>
        <field name="category_ids">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="filterOptions" xsi:type="boolean">true</item>
                    <item name="chipsEnabled" xsi:type="boolean">true</item>
                    <item name="label" xsi:type="string">Categories</item>
                    <item name="disableLabel" xsi:type="boolean">true</item>
                    <item name="component" xsi:type="string">Magento_Catalog/js/components/new-category</item>
                    <item name="formElement" xsi:type="string">select</item>
                    <item name="levelsVisibility" xsi:type="number">1</item>
                    <item name="elementTmpl" xsi:type="string">ui/grid/filters/elements/ui-select</item>
                    <item name="options" xsi:type="array">
                            <item name="0" xsi:type="array">
                                <item name="value" xsi:type="number">1</item>
                                <item name="label" xsi:type="string" translate="true">Category 1</item>
                                <item name="optgroup" xsi:type="array">
                                    <item name="0" xsi:type="array">
                                        <item name="value" xsi:type="number">2</item>
                                        <item name="is_active" xsi:type="boolean">true</item>
                                        <item name="label" xsi:type="string" translate="true">Category 1.1</item>
                                    </item>
                                </item>
                            </item>
                            <item name="1" xsi:type="array">
                                <item name="value" xsi:type="number">2</item>
                                <item name="is_active" xsi:type="boolean">true</item>
                                <item name="label" xsi:type="string" translate="true">Category 2</item>
                            </item>
                    </item>
                   <item name="config" xsi:type="array">
                       <item name="dataScope" xsi:type="string">category_ids</item>
                   </item>
                </item>
            </argument>
        </field>
    </container>

C'est le résultat:

Remarque: Avec les options d'article, vous devez modifier xsi:type="object"et déclarer une classe pour elle.

J'espère que cela vous a été utile!

— Thao Pham
source

mon souci n'est pas de savoir comment créer l'arbre. Ma question est de créer un bouton à côté du menu déroulant comme indiqué dans ma capture d'écran et d'ouvrir un modal à partir de celui-ci et d'y afficher la liste des produits.

— Priyank

Comment obtenir des options sélectionnées dans ce domaine?

— Amrit Pal Singh