Magento 2 Kategorie hinzufügen Tree Renderer-Eingabe mit modaler Schaltfläche

Ich versuche, die Kategorieeingabe für mein benutzerdefiniertes Formular mithilfe eines UIComponent-Formulars zu platzieren.

Ich kann Dropdown erstellen, aber wie kann ich die Schaltfläche erstellen und ein neues Modal daraus öffnen?

Kann ich einen erstellen Schaltfläche mit UIComponent und öffnen Sie eine modale von ihm. Ich möchte eine Schaltfläche anstelle einer neuen Kategorie. Ich möchte eine Schaltfläche zum Hinzufügen ausgewählter Produkte und eine Liste der Produkte aus ausgewählten Kategorien im Raster anzeigen.

Hier ist die XML-Datei zum Erstellen der Kategorieeingabe

<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
quelle

Bis ich verstehe, was da drin ist, und vielleicht eine Antwort finde, kann ich Ihnen empfehlen, sich den Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\CategoriesUnterricht anzuschauen . Hiermit wird die Kategoriebaumauswahl zum Bildschirm zum Hinzufügen / Bearbeiten von Produkten hinzugefügt. Vielleicht haben Sie mehr Glück zu verstehen, was da drin ist.

— Marius

@ Marius Ya auf der Suche nach dem gleichen Ding sieht so aus, als wäre das der beste Weg, es zu tun.

— Priyank

Hey, ich denke, das Hinzufügen von Modifikatoren wird nur für die Produktform verwendet und es ist sehr schwierig, sie für ein benutzerdefiniertes Modell hinzuzufügen, nachdem ich es 3 Tage lang durchgesehen habe. Ich erhalte gerade den ungültigen Namen des UI-Komponentenelements: 'category_mapping_form'

— Priyank

Wie funktionieren die ausgewählten Optionen hier?

— Amrit Pal Singh

Dieser Code unten arbeitet mit mir:

     <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>

Dies ist das Ergebnis:

Hinweis: Mit den Elementoptionen sollten Sie xsi:type="object"eine Klasse dafür ändern und deklarieren.

Ich hoffe es war hilfreich!

— Thao Pham
quelle

Es geht mir nicht darum, wie ich den Baum erstellen soll. Meine Frage ist, eine Schaltfläche neben dem Dropdown-Menü zu erstellen, wie in meinem Screenshot gezeigt, und ein Modal daraus zu öffnen und eine Liste der darin enthaltenen Produkte anzuzeigen.

— Priyank

Wie bekomme ich ausgewählte Optionen?

— Amrit Pal Singh