การปรับแต่งตัวเลือกผลิตภัณฑ์ขั้นสูง Mageworx

เผยแพร่แล้ว: 2020-06-09

ไม่ว่าโซลูชันจะแข็งแกร่งเพียงใด การปรับแต่งอาจจำเป็นเพื่อให้บรรลุวัตถุประสงค์หรือการตั้งค่าเฉพาะธุรกิจ

ตามคำขอบางอย่างที่ทีมสนับสนุนของเราได้รับเกี่ยวกับความสามารถในการใช้ฟิลด์ Weight และ WeightType จากหน้าต่าง Modal ในส่วนขยาย Magento 2 Advanced Product Options เรายินดีที่จะแบ่งปันคำแนะนำอย่างรวดเร็วเกี่ยวกับวิธีการบรรลุวัตถุประสงค์นั้นอย่างง่ายดาย อ่านต่อเพื่อดูแนวทางปฏิบัติที่ง่ายต่อการปฏิบัติ

สารบัญ

  • คำแนะนำทีละขั้นตอนเกี่ยวกับการปรับแต่งตัวเลือกผลิตภัณฑ์ขั้นสูง
    • ขั้นตอนที่ 1. การสร้างโมดูลใหม่
    • ขั้นตอนที่ 2. คัดลอกชั้นเรียน
    • ขั้นตอนที่ #3 การปรับเปลี่ยนคลาส
    • ขั้นตอนที่ #4 เอาชนะชั้นเรียน
    • ขั้นตอนที่ #5 การติดตั้งโมดูลใหม่
  • บรรทัดล่าง

คำแนะนำทีละขั้นตอนเกี่ยวกับการปรับแต่งตัวเลือกผลิตภัณฑ์ขั้นสูง

นี่คือลักษณะของฟิลด์ ประเภทน้ำหนักและน้ำหนัก ใน ส่วนขยายตัวเลือกผลิตภัณฑ์ขั้นสูงแบบสำเร็จรูป:

การปรับแต่งตัวเลือกผลิตภัณฑ์ขั้นสูงของ MageWorx | บล็อก MageWorx

หากต้องการแสดงฟิลด์เหล่านี้นอกหน้าต่างโมดอล คุณจะต้องปฏิบัติตามห้าขั้นตอนง่ายๆ เหล่านี้:

ขั้นตอนที่ 1. การสร้างโมดูลใหม่

เริ่มต้นด้วยการสร้างโมดูลใหม่: VendorName_OptionCustomFieldWeight

สำหรับการที่,

  1. สร้างไดเร็กทอรี app/code/VendorName/OptionCustomFieldWeight
  2. สร้างและกรอกข้อมูลในไฟล์มาตรฐานสามไฟล์ที่ปกติใช้ในการลง registration.php โมดูล เช่น composer.json etc/module.xml , register.php

1) composer.json

 "name": "vendorname/module-optioncustomfieldweight", "description": "N/A", "require": { "magento/framework" : ">=101.0.0 <103", "mageworx/module-optionfeatures" : ">=2.16.1" }, "type": "magento2-module", "version": "1.0.0", "license": [ "OSL-3.0", "AFL-3.0" ], "autoload": { "files": [ "registration.php" ], "psr-4": { "VendorName\\OptionCustomFieldWeight\\": "" } } }

2) etc/module.xml

 <?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd"> <module name="VendorName_OptionCustomFieldWeight" setup_version="2.0.0"> <sequence> <module name="Magento_Catalog"/> <module name="MageWorx_OptionBase"/> <module name="MageWorx_OptionFeatures"/> </sequence> </module> </config>

3) registration.php

 <?php \Magento\Framework\Component\ComponentRegistrar::register( \Magento\Framework\Component\ComponentRegistrar::MODULE, 'VendorName_OptionCustomFieldWeight', __DIR__ );

ขั้นตอนที่ 2. คัดลอกชั้นเรียน

ถัดไป คุณต้องค้นหาและคัดลอกคลาสต่อไปนี้: /app/code/MageWorx/OptionFeatures/Ui/DataProvider/Product/Form/Modifier/Features.php   ไปยัง /app/code/VendorName/OptionCustomFieldWight/Ui/DataProvider/Product/Form/Modifier/Features.php

ขั้นตอนที่ #3 การปรับเปลี่ยนคลาส

ตอนนี้ มาแก้ไขคลาสที่คัดลอก ในการทำเช่นนั้น คุณต้อง:

a) เปลี่ยน namespace ของคลาสของเราเป็น VendorName\OptionCustomFieldWeight\Ui\DataProvider\Product\Form\Modifier;

และเพิ่มคลาสที่เราจำเป็นต้องใช้ในภายหลัง ชั้นเรียนเหล่านี้คือ

use MageWorx\OptionFeatures\Model\Config\Source\Product\Options\Weight as ProductOptionsWeight;

และ

use Magento\Ui\Component\Form\Element\Input;

หากทำทุกอย่างถูกต้องควรมีลักษณะดังนี้:

 …. namespace VendorName\OptionCustomFieldWeight\Ui\DataProvider\Product\Form\Modifier; use MageWorx\OptionBase\Ui\DataProvider\Product\Form\Modifier\ModifierInterface; use MageWorx\OptionFeatures\Helper\Data as Helper; use Magento\Ui\Component\Form\Element\Hidden; use Magento\Ui\Component\Modal; use Magento\Framework\UrlInterface; use Magento\Framework\App\Request\Http; use MageWorx\OptionFeatures\Model\Config\Source\ShareableLinkMode as SourceConfig; use MageWorx\OptionFeatures\Model\Config\Source\Product\Options\Weight as ProductOptionsWeight; use Magento\Ui\Component\Form\Element\Input; class Features extends AbstractModifier implements ModifierInterface { ….

b) เพิ่ม MageWorx\OptionFeatures\Model\Config\Source\Product\Options\Weight ให้กับ Constructor ของเรา:

 …. /** * @var ProductOptionsWeight */ protected $productOptionsWeight; /** * @param ArrayManager $arrayManager * @param StoreManagerInterface $storeManager * @param LocatorInterface $locator * @param Helper $helper * @param Http $request * @param UrlInterface $urlBuilder * @param SourceConfig $sourceConfig * @param ProductOptionsWeight $productOptionsWeight */ public function __construct( ArrayManager $arrayManager, StoreManagerInterface $storeManager, LocatorInterface $locator, Helper $helper, Http $request, SourceConfig $sourceConfig, UrlInterface $urlBuilder, ProductOptionsWeight $productOptionsWeight ) { $this->arrayManager = $arrayManager; $this->storeManager = $storeManager; $this->locator = $locator; $this->helper = $helper; $this->request = $request; $this->sourceConfig = $sourceConfig; $this->urlBuilder = $urlBuilder; $this->productOptionsWeight = $productOptionsWeight; } …..

c) ค้นหาเมธอด getValueFeaturesFieldsConfig()

 /** * The custom option value fields config * * @return array */ protected function getValueFeaturesFieldsConfig() { $fields = []; $fields[Helper::KEY_IS_DEFAULT] = $this->getIsDefaultConfig(148); return $fields; }

และเพิ่ม getWeightConfig() และ getWeightTypeConfig() ลงในอาร์เรย์ด้วยฟิลด์ที่กำหนดเองสำหรับค่าตัวเลือกที่กำหนดเอง วิธีการเหล่านี้จะใช้การกำหนดค่าที่สอดคล้องกัน ตอนนี้เมธอด getValueFeaturesFieldsConfig() จะต้องมีลักษณะดังนี้:

 /** * The custom option value fields config * * @return array */ protected function getValueFeaturesFieldsConfig() { $fields = []; $fields[Helper::KEY_IS_DEFAULT] = $this->getIsDefaultConfig(148); if ($this->helper->isWeightEnabled()) { $fields[Helper::KEY_WEIGHT] = $this->getWeightConfig(34); $fields[Helper::KEY_WEIGHT_TYPE] = $this->getWeightTypeConfig(35); } return $fields; }

d) หลังจากเมธอด getValueFeaturesFieldsConfig() ให้ใช้ getWeightConfig() และ getWeightTypeConfig() วิธีการของการกำหนดค่าฟิลด์:

 /** * Get weight unit name * * @return mixed */ protected function getWeightUnit() { try { $unit = $this->locator->getStore()->getConfig('general/locale/weight_unit'); } catch (\Exception $e) { $unit = $this->storeManager->getStore()->getConfig('general/locale/weight_unit'); } return $unit; } /** * Weight field config * * @param $sortOrder * @return array */ protected function getWeightConfig($sortOrder) { return [ 'arguments' => [ 'data' => [ 'config' => [ 'label' => __('Weight'), 'componentType' => Field::NAME, 'component' => 'Magento_Catalog/js/components/custom-options-component', 'template' => 'Magento_Catalog/form/field', 'formElement' => Input::NAME, 'dataScope' => Helper::KEY_WEIGHT, 'dataType' => Number::NAME, 'validation' => [ 'validate-number' => true, 'validate-zero-or-greater' => true, ], 'sortOrder' => $sortOrder, 'additionalClasses' => 'admin__field-small', 'addbefore' => $this->getWeightUnit(), 'addbeforePool' => $this->productOptionsWeight ->prefixesToOptionArray($this->getWeightUnit()), 'imports' => [ 'disabled' => '!${$.provider}:' . self::DATA_SCOPE_PRODUCT . '.product_has_weight:value', ], ], ], ], ]; } /** * Weight field config * * @param $sortOrder * @return array */ protected function getWeightTypeConfig($sortOrder) { return [ 'arguments' => [ 'data' => [ 'config' => [ 'label' => __('Weight Type'), 'component' => 'MageWorx_OptionFeatures/js/component/custom-options-weight-type', 'componentType' => Field::NAME, 'formElement' => Select::NAME, 'dataScope' => Helper::KEY_WEIGHT_TYPE, 'dataType' => Text::NAME, 'sortOrder' => $sortOrder, 'options' => $this->productOptionsWeight->toOptionArray(), 'imports' => [ 'weightIndex' => Helper::KEY_WEIGHT, ], ], ], ], ]; }

ขั้นตอนที่ #4 เอาชนะชั้นเรียน

ถึงเวลาแล้วที่คลาสที่แก้ไข /app/code/VendorName/OptionCustomFieldWight/Ui/DataProvider/Product/Form/Modifier/Features.php ของเราเริ่มทำงานแทน /app/code/VendorName/OptionCustomFieldWight/Ui/DataProvider/Product/Form/Modifier/Features.php . เพื่อให้บรรลุเป้าหมายนั้น เราจำเป็นต้องแทนที่มันในไฟล์การกำหนดค่าการพึ่งพา สำหรับสิ่งนั้น ให้สร้างไฟล์ /app/code/VendorName/OptionCustomFieldWeight/etc/adminhtml/di.xml และเพิ่มรหัสต่อไปนี้:

 <?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd"> <preference for="MageWorx\OptionFeatures\Ui\DataProvider\Product\Form\Modifier\Features" type="VendorName\OptionCustomFieldWeight\Ui\DataProvider\Product\Form\Modifier\Features"/> </config>

ขั้นตอนที่ #5 การติดตั้งโมดูลใหม่

เราเกือบจะอยู่ที่นั่นแล้ว! สิ่งเดียวที่เหลือคือการติดตั้งโมดูลใหม่ของเรา

ในการเริ่มต้น ให้รันคำสั่งต่อไปนี้:

php bin/magento module:status

คุณจะเห็นรายการโมดูลที่เปิดใช้งานและปิดใช้งาน โมดูล VendorName_OptionCustomFieldWight ใหม่ของเราควรอยู่ภายในโมดูลที่ปิดใช้งาน

มาเปิดใช้งานกันเถอะ:

php bin/magento module:enable VendorName_OptionCustomFieldWeight

หลังจากที่คุณอัพเดทฐานข้อมูล

php bin/magento setup:upgrade

คุณจะเห็นผลลัพธ์ต่อไปนี้:

การปรับแต่งตัวเลือกผลิตภัณฑ์ขั้นสูงของ MageWorx | บล็อก MageWorx

ยินดีด้วย! คุณได้ลบฟิลด์ ประเภทน้ำหนักและน้ำหนัก ออก จากหน้าต่างโมดอลเรียบร้อยแล้ว

บรรทัดล่าง

เราหวังว่าคำแนะนำแบบทีละขั้นตอนนี้จะช่วยให้คุณปรับแต่งส่วนขยายตัวเลือกผลิตภัณฑ์ขั้นสูงได้อย่างง่ายดายและบรรลุความต้องการของคุณ หากคุณมีคำถามหรือปัญหาใด ๆ โปรดแสดงความคิดเห็นในช่องแสดงความคิดเห็นด้านล่าง มิฉะนั้น ทีมสนับสนุนของเรายินดีให้ความช่วยเหลือเสมอที่ [ป้องกันอีเมล] ! =)

จองการสาธิตสดกับ Mageworx