magento 2 วิธีอัปโหลดรูปภาพและวิดีโอในโมดูลที่กำหนดเอง


15

ฉันใช้ magento 2.1

ฉันต้องอัปโหลดรูปภาพและวิดีโอหลายรายการโดยใช้องค์ประกอบ UI

เช่นmagento-admin -> ผลิตภัณฑ์ -> caralog -> ผลิตภัณฑ์

ป้อนคำอธิบายรูปภาพที่นี่

ฉันต้องทำอะไรเพื่อให้บรรลุผลนี้


M2 ยังใช้รหัสแบบเก่าสำหรับ 'รูปภาพและวิดีโอ' ที่ไม่มี UI_Component หรือไม่ คุณต้องการสิ่งนี้หรือไม่?
Sohel Rana

คำตอบ:


7

ในที่สุดฉันก็ได้รับคำตอบ

ฉันอ้างถึงโมดูลนี้และนำไปใช้ในโมดูลที่กำหนดเองของฉัน

ค้นหารหัสที่เป็นประโยชน์ด้านล่าง:

ทำตามขั้นตอนด้านล่าง

1) สร้าง layout.xml

[vendor]/[module]/operation/view/adminhtml/layout/layout_edit.xml

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">

    <body>
            <referenceContainer name="content">
                <uiComponent name="sample_form"/>
            </referenceContainer>
            <referenceContainer name="sample_form">
                <block name="gallery" class="[vendor]\[module]\Block\Adminhtml\Grid\Helper\Form\Gallery">
                    <arguments>
                        <argument name="config" xsi:type="array">
                            <item name="label" xsi:type="string" translate="true">Images</item>
                            <item name="collapsible" xsi:type="boolean">true</item>
                            <item name="opened" xsi:type="boolean">false</item>
                            <item name="sortOrder" xsi:type="string">22</item>
                            <item name="canShow" xsi:type="boolean">true</item>
                            <item name="componentType" xsi:type="string">fieldset</item>
                        </argument>
                    </arguments>
                    <block class="[vendor]\[module]\Block\Adminhtml\Grid\Helper\Form\Gallery\Content" as="content" template="[vendor]_[[module]::helper/gallery.phtml">
                        <arguments>
                            <argument name="config" xsi:type="array">
                                <item name="parentComponent" xsi:type="string">sample_form.sample_form.block_gallery.block_gallery</item>

                            </argument>
                        </arguments>

                    </block>
                </block>
            </referenceContainer>

    </body>
</page>

2) สร้างบล็อคผู้ช่วยเหลือ

[vendor]/[module]/Block/Adminhtml/Grid/Helper/Form/Gallery.php

namespace [vendor]\[module]\Block\Adminhtml\Grid\Helper\Form;

use Magento\Framework\Registry;
use Magento\Catalog\Model\Product;
use Magento\Eav\Model\Entity\Attribute;
use Magento\Catalog\Api\Data\ProductInterface;

class Gallery extends \Magento\Catalog\Block\Adminhtml\Product\Helper\Form\Gallery
{
    /**
     * @var here you set your ui form 
     */
    protected $formName = 'sample_form';

}

3) สร้างบล็อกของผู้ช่วยเหลือ

[vendor]\[module]\Block\Adminhtml\Grid\Helper\Form\Gallery\Content.php

namespace [vendor]\[module]\Block\Adminhtml\Grid\Helper\Form\Gallery;

use Magento\Framework\Data\Form\Element\AbstractElement;
use Magento\Backend\Block\Media\Uploader;
use Magento\Framework\View\Element\AbstractBlock;
use Magento\Framework\App\Filesystem\DirectoryList;

class Content extends \Magento\Catalog\Block\Adminhtml\Product\Helper\Form\Gallery\Content
{


    protected function _prepareLayout()
    {
        $this->addChild('uploader', 'Magento\Backend\Block\Media\Uploader');

        $a = $this->getUploader()->getConfig()->setUrl(
            $this->_urlBuilder->addSessionParam()->getUrl('[vendor]/grid_gallery/upload')/* here set you upload Controller */
        )->setFileField(
            'image'
        )->setFilters(
            [
                'images' => [
                    'label' => __('Images (.gif, .jpg, .png)'),
                    'files' => ['*.gif', '*.jpg', '*.jpeg', '*.png'],
                ],
            ]
        );

    }


    public function getImageTypes()
    {
        return '[]';
    }

    public function getMediaAttributes()
    {
        return '[]';
    }

}

หมายเหตุ : - คุณควรขยายเหนือบล็อกทั้งสองอย่างถูกต้อง

4) สร้างเทมเพลต

คุณควรคัดลอกแบบฟอร์ม gallery.phtml vendor/magento/module-product-video/view/adminhtml/templates/helper/gallery.phtml และแก้ไขตามความต้องการและศัตรูพืชในโมดูลของคุณ[vendor]/[module]/view/adminhtml/templates/helper/gallery.phtml

กรุณาแจ้งให้เราทราบในความคิดเห็นหากคุณต้องการความช่วยเหลือใด ๆ


ฉันได้รับข้อผิดพลาดเนื่องจากควรสร้างเอกสาร OBJECT DOM
vijay b

@vijayb คุณช่วยกรุณาใส่ข้อผิดพลาดนี้ได้ที่นี่
Deexit Sanghani


@vijayb ฉันหวังว่าคุณจะทำงานในแบบฟอร์ม ui ดังนั้นให้ตั้งชื่อแบบฟอร์ม ui ของคุณที่นี่protected $formName = 'your_ui_form
Deexit Sanghani

ฉันทำตามทุกขั้นตอนตรงตามที่อธิบายไว้ใน answer.do เราต้องสร้างไฟล์อื่น ๆ เพื่อกำหนดว่า Ui Component ??
vijay b

0

ในการเพิ่มวิดีโอใน Magento 2 คุณต้องทำตามขั้นตอนเหล่านี้:

  1. สร้างรหัส Youtube API
  2. บูรณาการของปุ่ม Youtube API ไปที่
  3. Magento 2. การรวม URL วิดีโอ Youtube เข้ากับผลิตภัณฑ์

0

คำตอบจาก Deexit Sanghani อาจจะล้าสมัยเพราะฉันใช้ magento2.2.2 v และตำแหน่งของ xml ไม่ทำงานสำหรับฉัน[vendor]/[module]/operation/view/adminhtml/layout/layout_edit.xmlแต่ทุกอย่างเกี่ยวกับสิทธิในการโหวต และริคือสิ่งที่ทำงานให้ฉันจะดูใน../vendor/magento/module-product-video/view/adminhtml/ui_component/product_form.xmlและคุณตั้งโมดูล: ../app/code/[vendor]/[module]/view/adminhtml/ui_component/your_ layout_edit.xmlภายใน<form></form>เพิ่ม:

    <htmlContent name="gallery" sortOrder="22">
        <argument name="data" xsi:type="array">
            <item name="wrapper" xsi:type="array">
                <item name="label" xsi:type="string" translate="true">My Custom Images And Videos</item>
                <item name="collapsible" xsi:type="boolean">true</item>
                <item name="opened" xsi:type="boolean">false</item>
            </item>
        </argument>
        <settings>
            <wrapper>
                <canShow>true</canShow>
                <componentType>fieldset</componentType>
            </wrapper>
        </settings>
        <block name="gallery" class="[vendor]\[module]\Block\Adminhtml\[Entity]\Helper\Form\Gallery">
            <!--<arguments>
                <argument name="config" xsi:type="array">
                    <item name="label" xsi:type="string" translate="true">Images And Videos</item>
                    <item name="collapsible" xsi:type="boolean">true</item>
                    <item name="opened" xsi:type="boolean">false</item>
                    <item name="sortOrder" xsi:type="string">22</item>
                    <item name="canShow" xsi:type="boolean">true</item>
                    <item name="componentType" xsi:type="string">fieldset</item>
                </argument>
            </arguments>-->
            <block class="[vendor]\[module]\Block\Adminhtml\[Entity]\Helper\Form\Gallery\Content" as="content">
                <arguments>
                    <argument name="config" xsi:type="array">
                        <item name="parentComponent" xsi:type="string">ui_component_form.ui_component_form.block_gallery.block_gallery</item>
                    </argument>
                </arguments>
                <block class="Magento\ProductVideo\Block\Adminhtml\Product\Edit\NewVideo" name="new-video" template="Magento_ProductVideo::product/edit/slideout/form.phtml"/>
            </block>
        </block>
    </htmlContent> 

ฉันมีการจัดการที่จะอัปโหลดรูปภาพเพิ่มบทบาทที่กำหนดเอง ฯลฯ .. แต่ไม่ได้บันทึกในฐานข้อมูลยังกับแถวหมายเหตุ:มันต้องการความสนใจมากที่จะทำให้มันเหมาะกับความต้องการของคุณเขียนทับที่คุณต้องการเช่นgallery.pthml, getImagesJson(), getImageTypes(), getMediaAttributesวิธีการ ฯลฯ .. . แล้วจะต้องใกล้เคียงกับโครงสร้างฐานข้อมูลที่เป็นไปตามรูปแบบที่เหมือนกันหรือคล้ายกับตารางดูวีโอไอพีพื้นเมือง: catalog_product_entity_media_gallery_value, catalog_product_entity_media_gallery, catalog_product_entity_media_gallery_valueฯลฯ ... ยังไม่ได้ทำงานในวิดีโอ ๆ !

หวังว่าจะช่วยใครซักคน!

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.