Checkout Magento 2 - tambahkan bidang khusus antara alamat pengiriman dan metode pengiriman


21

Saya mencoba menambahkan bidang khusus di antara bagian alamat pengiriman dan metode pengiriman . Dan saya ingin nilai-nilai bidang ini disimpan dalam tabel quotedan keduanya sales_orderpada akhirnya. Ini adalah sesuatu yang mirip dengan menambahkan bidang "komentar pesanan" tetapi bidang ini akan muncul tepat setelah bagian alamat pengiriman dan sebelum bagian metode pengiriman.

Saya membaca panduan dev Magento tentang cara menambahkan bidang khusus dan formulir khusus ke checkout dan menerapkan solusi sampai batas tertentu.

Apa yang telah saya lakukan sejauh ini:

  1. Memperbarui checkout_index_index.xmltata letak, menambahkan baru uiComponent(wadah) di bawah item "shippingAddress".
  2. Menambahkan elemen (bidang) yang saya butuhkan di dalam wadah.
  3. Ganti /js/view/shipping.jsdan shipping.phtmldalam modul khusus saya.
  4. Meminta wadah yang dibuat di atas shipping.phtmldi dalam di antara alamat pengiriman checkout dan metode pengiriman (sesuatu yang mirip dengan menambahkan formulir statis baru)

Sekarang bidang yang saya inginkan sedang ditampilkan di checkout di tempat persis seperti yang saya inginkan. Namun saya telah menemui masalah di bawah ini.

  1. Bagaimana cara mengakses nilai bidang khusus yang telah saya tambahkan di atas? Saya mencoba menyimpan nilai ke atribut ekstensi shippingAddress. Saya menambahkan mixin ke setShippingInformationActiondalam yang mencoba melakukan di bawah ini

    shippingAddress['extension_attributes']['custom_field'] = shippingAddress.customAttributes['custom_field'];

Tetapi kode di atas sebenarnya gagal karena elemen tidak ada dalam shipping-address-fieldset. Saya mungkin bisa mendapatkan nilai melalui windowelemen. Tetapi apakah ada cara untuk mengakses ini melalui Magento?

  1. Apakah ada cara untuk menyimpan nilai elemen ini dalam penyimpanan cache lokal ( Magento_Checkout/js/checkout-data) sehingga nilainya akan tetap bertahan bahkan setelah refresh halaman?


Silakan lihat tautan di bawah ini, saya harap ini akan membantu Anda magento.stackexchange.com/questions/187847/…
Pradeep Kumar

Jawaban:


1

Berdasarkan pertanyaan Anda, saya berasumsi Anda sudah menyiapkan atribut ekstensi. Saya telah melakukan modifikasi serupa dan semoga jawaban saya membantu.

Dalam modul Kustom Anda buat file requirejs-config untuk memperpanjang prosesor pengiriman default / default

Namespace / CustomModule / view / frontend / requireejs-config.js
var config = {
    "map": {
        "*": {
            'Magento_Checkout / js / model / pengiriman-save-processor / default': 'Namespace_CustomModule / js / model / pengiriman-save-processor / default'
        }
    }
};

Tambahkan atribut ekstensi Anda ke payload.

/ * global define, waspada * /
menetapkan(
    [
        'jquery',
        'ko',
        'Magento_Checkout / js / model / quote',
        'Magento_Checkout / js / model / resource-url-manager',
        'penyihir / penyimpanan',
        'Magento_Checkout / js / model / layanan pembayaran',
        'Magento_Checkout / js / model / payment / method-converter',
        'Magento_Checkout / js / model / error-processor',
        'Magento_Checkout / js / model / full-screen-loader',
        'Magento_Checkout / js / action / select-billing-address'
    ],
    fungsi (
        $,
        ko,
        mengutip,
        resourceUrlManager,
        penyimpanan,
        layanan pembayaran,
        metodeConverter,
        pengolah kesalahan,
        fullScreenLoader,
        pilihBillingAddressAction
    ) {
        'gunakan yang ketat';

        kembali {
            saveShippingInformation: function () {
                var payload;

                if (! quote.billingAddress ()) {
                    selectBillingAddressAction (quote.shippingAddress ());
                }
                // Menambahkan atribut ekstensi ke alamat pengiriman Anda
                payload = {
                    Informasi alamat: {
                        shipping_address: quote.shippingAddress (),
                        billing_address: quote.billingAddress (),
                        shipping_method_code: quote.shippingMethod (). method_code,
                        shipping_carrier_code: quote.shippingMethod (). carrier_code,
                        extension_attributes: {
                            custom_field: $ ('# custom_field'). val (), 
                        }
                    }
                };

                fullScreenLoader.startLoader ();

                return storage.post (
                    resourceUrlManager.getUrlForSetShippingInformation (quote),
                    JSON.stringify (payload)
                ). dilakukan (
                    fungsi (respons) {
                        quote.setTotals (response.totals);
                        paymentService.setPaymentMethods (methodConverter (response.payment_methods));
                        fullScreenLoader.stopLoader ();
                    }
                ).gagal(
                    fungsi (respons) {
                        errorProcessor.process (response);
                        fullScreenLoader.stopLoader ();
                    }
                );
            }
        };
    }
);

Simpan Atribut ke Kutipan Anda dengan sebuah plugin (Tidak yakin apakah Anda bisa menggunakan pengamat di sini yang belum saya periksa).

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">
    <type name="Magento\Checkout\Model\ShippingInformationManagement">
        <plugin name="Namespace_CustomModule_save_delivery_date_in_quote" type="Namespace\CustomModule\Plugin\Checkout\SaveAddressInformation" />
    </type>

</config>

SaveAddressInformation.php

kelas SaveAddressInformation
{
    protected $ quoteRepository;
    fungsi publik __construct (
        \ Magento \ Penawaran \ Model \ QuoteRepository $ quoteRepository
    ) {
        $ this-> quoteRepository = $ quoteRepository;
    }
    / **
     * @param \ Magento \ Checkout \ Model \ ShippingInformationManagement $ subject
     * @param $ cartId
     * @param \ Magento \ Checkout \ Api \ Data \ ShippingInformationInterface $ addressInformation
     * /
    fungsi publik sebelumSimpanAddressInformation (
        \ Magento \ Checkout \ Model \ ShippingInformationManagement $ subjek,
        $ cartId,
        \ Magento \ Checkout \ Api \ Data \ ShippingInformationInterface $ addressInformation
    ) {
        $ extensionAttributes = $ addressInformation-> getExtensionAttributes ();
        $ customField = $ extensionAttributes-> getCustomField ();
        $ quote = $ this-> quoteRepository-> getActive ($ cartId);
        $ quote-> setCustomField ($ customField);

    }
}

Simpan atribut ke pesanan Anda dengan Observer events.xml

<?xml version="1.0" encoding="UTF-8"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Event/etc/events.xsd">
    <event name="sales_model_service_quote_submit_before">
        <observer name="unique_observer_name" instance="Namespace\CustomModule\Observer\SaveCustomFieldToOrder"/>
    </event>
</config>

SaveCustomFieldToOrder.php

class SaveCustomFieldToOrder mengimplementasikan ObserverInterface
{
    / **
     * @var \ Magento \ Framework \ ObjectManagerInterface
     * /
    protected $ _objectManager;

    / **
     * @param \ Magento \ Framework \ ObjectManagerInterface $ objectmanager
     * /
    fungsi publik __construct (\ Magento \ Framework \ ObjectManagerInterface $ objectmanager)
    {
        $ this -> _ objectManager = $ objectmanager;
    }

    mengeksekusi fungsi publik (EventObserver $ observer)
    {
        $ order = $ observer-> getOrder ();
        $ quoteRepository = $ this -> _ objectManager-> create ('Magento \ Quote \ Model \ QuoteRepository');
        / ** @var \ Magento \ Penawaran \ Model \ Penawaran $ quote * /
        $ quote = $ quoteRepository-> get ($ order-> getQuoteId ());
        $ order-> setCustomField ($ quote-> getCustomField ());

        mengembalikan $ this;
    }
}


Mengganti metode inti tidak terlalu beruntung. Bagaimana jika modul lain menimpa Anda? magento.stackexchange.com/questions/135969/…
vaso123

Poin yang baik, tidak menyadari metode alternatif. terima kasih telah menunjukkannya.
NathanielR

@ vaso123 Sepertinya saya juga tidak mengetahui sesuatu karena di sini Nathaniel telah membuat plugin dan satu pengamat acara sehingga fungsi intinya ditimpa di sini. Bisakah Anda jelaskan sedikit lagi, itu akan sangat membantu ... Terima kasih
Sarvagya

@Sarvagya Ketika Anda menggunakan membutuhkan js, jangan gunakan map *, gunakan mixin saja.
vaso123

@ vaso123 Saya percaya dia mengacu pada Magento_Checkout / js / model / pengiriman-save-prosesor / default ':' Namespace_CustomModule / js / model / pengiriman-save-processor / default 'yang ketika saya mengerti mengganti Magento_Checkout / js / model / pengiriman -simpan-prosesor / default. } sudah lama sejak saya menulis ini jadi Sarvagya tolong perbaiki saya jika saya salah.
NathanielR

0

Buat plugin untuk \Magento\Checkout\Block\Checkout\LayoutProcessor::processmetode ini .

Buat entri di di.xml di jalur ini

app/code/CompanyName/Module/etc/frontend/di.xml

Buat kelas plugin di Direktori ini.

app/code/CompanyName\Module\Model\Plugin\Checkout

2 => Buat kelas plugin pada Direktori ini. app/code/CompanyName\Module\Model\Plugin\Checkout

    $jsLayout['components']['checkout']['children']['steps']['children']['shipping-step']['children']
    ['shippingAddress']['children']['shipping-address-fieldset']['children']['custom_field'] = [
        'component' => 'Magento_Ui/js/form/element/abstract',
        'config' => [
            'customScope' => 'shippingAddress.custom_attributes',
            'template' => 'ui/form/field',
            'elementTmpl' => 'ui/form/element/input',
            'options' => [],
            'id' => 'custom-field'
        ],
        'dataScope' => 'shippingAddress.custom_attributes.custom_field',
        'label' => 'Custom Field',
        'provider' => 'checkoutProvider',
        'visible' => true,
        'validation' => [],
        'sortOrder' => 250,
        'id' => 'custom-field'
    ];


    return $jsLayout;
}

}

Setelah ini selesai, periksa halaman checkout.

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.