Biểu mẫu trải rộng Magento 2 adminhtml trên nhiều tab

Tôi đang cố gắng tạo một mô-đun phụ trợ, trong đó trên trang chỉnh sửa của tôi, tôi sử dụng admin-2column-leftbố cục.

Tôi muốn có một biểu mẫu trên mỗi tab, nhưng tôi không hiểu làm thế nào tôi có thể làm điều này.
Lý tưởng nhất, tôi muốn biết cách gán biểu mẫu khác nhau uiComponentscho các tab khác nhau hoặc cách tôi có thể xác định một uiComponentbiểu mẫu cho biểu mẫu của mình, nhưng có thể chỉ định tập hợp trường nào đi trên tab nào.

Tình huống cụ thể của tôi, gây ra câu hỏi này, là tôi muốn có một hình thức tiêu chuẩn trên một tab (nhiều kiểu nhập văn bản) và trên một tab khác, tôi muốn có một dynamicRowsthành phần UI. Chúng tôi đã gọi các tab này là Main và Line Item.

Hiện tại, tôi đang thực hiện điều này như sau: Main được định nghĩa trong _prepareFormphương thức trong khối của nó, đó là một phần mở rộng lớp Form\Generic. Biểu mẫu này xuất hiện và hoạt động tốt cho đến khi tôi thêm các hàng động.

Tệp bố cục của tôi có mã để thêm tab Chính và gán khối nội dung. Ngoài ra, nó có một thùng chứa có tên line_items, chứa một uiComponentbiểu mẫu chứa các hàng động.

Tab Mục hàng được tạo theo _beforeToHtmlphương thức Widget\Tabvà nội dung của nó được chỉ định bằng cách sử dụng lệnh gọi đến getChildHtmltrên bộ chứa line_items.

Tab hoạt động và được điền với cấu trúc chính xác, cho phép tôi thêm và xóa hàng.

Vấn đề là khi tôi gửi trang, chỉ có các đầu vào trong tab Mục hàng được gửi.

Vì vậy, tôi biết rằng tôi đã không thiết lập chính xác điều này và cần một số cách để hướng dẫn nó theo dõi và gửi tất cả các yếu tố biểu mẫu. Hầu hết việc triển khai này bắt nguồn từ những nỗ lực của tôi nhằm thiết kế đảo ngược việc thiết lập biểu mẫu Thuộc tính sản phẩm danh mục, tương tự như những gì tôi muốn làm.

Bất cứ ai có ý tưởng về nó?

Sử dụng mã sau đây để tạo các tab với dạng đơn bằng UI-Thành phần

<argument name="data" xsi:type="array">
    <item name="js_config" xsi:type="array">
        <item name="provider" xsi:type="string">custom_form.custom_form_data_source</item>
        <!--This is for tab -->
        <item name="deps" xsi:type="string">custom_form.custom_form_data_source</item>
    </item>

    <!--following tag add the tab into form-->
    <item name="label" xsi:type="string" translate="true">Test Details</item>
    <item name="reverseMetadataMerge" xsi:type="boolean">true</item>
   <item name="layout" xsi:type="array">
        <item name="type" xsi:type="string">tabs</item>
        <item name="navContainerName" xsi:type="string">left</item>
    </item>

</argument>

Tạo một phần tử biểu mẫu

 <fieldset name="general">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="label" xsi:type="string">General Information</item>
        </item>
    </argument>

    <field name="name">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="source" xsi:type="string">general</item>
                <item name="label" xsi:type="string">Name</item>
                <item name="formElement" xsi:type="string">input</item>
                <item name="dataType" xsi:type="string">text</item>
                <item name="dataScope" xsi:type="string">name</item>
                <item name="validation" xsi:type="array">
                    <item name="required-entry" xsi:type="boolean">true</item>
                </item>
            </item>
        </argument>
    </field>
 </fieldset>
 <fieldset name="address">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="label" xsi:type="string">Address and Contact</item>
        </item>
    </argument>
    <field name="address_line1">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="source" xsi:type="string">address</item>
                <item name="label" xsi:type="string">Address Line1</item>
                <item name="formElement" xsi:type="string">input</item>
                <item name="datatype" xsi:type="string">text</item>
                <item name="datascope" xsi:type="string">address_line1</item>
            </item>
        </argument>
    </field>

    <field name="address_line2">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="source" xsi:type="string">address</item>
                <item name="label" xsi:type="string">Address Line2</item>
                <item name="formElement" xsi:type="string">input</item>
                <item name="datatype" xsi:type="string">text</item>
                <item name="datascope" xsi:type="string">address_line2</item>
            </item>
        </argument>
    </field>
  </fieldset>

Mã này sẽ hiển thị 2 tab trên biểu mẫu với các trường biểu mẫu được liên kết.

Hy vọng giải pháp này hiệu quả với bạn