Magento 2 चेकआउट - शिपिंग पते और शिपिंग विधि के बीच एक कस्टम फ़ील्ड जोड़ें


21

मैं शिपिंग पते और शिपिंग विधि अनुभागों के बीच एक कस्टम फ़ील्ड जोड़ने का प्रयास कर रहा हूं । और मैं चाहता हूं कि इस क्षेत्र के मूल्यों को अंततः quoteऔर sales_orderतालिकाओं में संग्रहीत किया जाए । यह "ऑर्डर टिप्पणी" फ़ील्ड को जोड़ने के समान है, लेकिन यह फ़ील्ड शिपिंग एड्रेस सेक्शन के बाद और शिपिंग विधि अनुभाग से पहले दिखाई देनी चाहिए।

मैं मैगेंटो देव गाइडों के माध्यम से गया कि कैसे एक कस्टम फ़ील्ड और एक कस्टम फॉर्म को चेकआउट में जोड़ा जाए और एक निश्चित सीमा तक समाधान लागू किया जाए।

मैंने अब तक क्या किया है:

  1. checkout_index_index.xmlलेआउट को अपडेट किया गया , uiComponentआइटम "शिपिंगएड्रेस" के तहत एक नया (एक कंटेनर) जोड़ा गया ।
  2. उस तत्व (फ़ील्ड) को जोड़ा गया है जिसकी मुझे कंटेनर में आवश्यकता है।
  3. मेरे कस्टम मॉड्यूल में ओवरराइड /js/view/shipping.jsऔर shipping.phtml
  4. shipping.phtmlचेकआउट शिपिंग पते और शिपिंग विधि के बीच में ऊपर दिए गए कंटेनर को अंदर लाया (कुछ नया स्थिर रूप जोड़ने के समान)

अब मैं जिस क्षेत्र को चाहता हूं, उसे उसी स्थान पर चेकआउट पर प्रस्तुत किया जा रहा है, जहां मैं चाहता हूं। लेकिन मैं नीचे समस्याओं के साथ मुलाकात की है।

  1. मैंने ऊपर जोड़े गए कस्टम फ़ील्ड के मूल्य का उपयोग कैसे किया? मैं एक शिपिंग एक्सटेंशन एक्सटेंशन विशेषता के लिए मूल्य को बचाने की कोशिश कर रहा हूं। मैंने setShippingInformationActionअंदर एक मिक्सिन मिलाया जो नीचे करने की कोशिश करता है

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

लेकिन उपरोक्त कोड वास्तव में विफल रहता है क्योंकि तत्व अंदर नहीं है shipping-address-fieldset। मैं windowतत्व के माध्यम से मूल्य प्राप्त करने में सक्षम हो सकता हूं । लेकिन क्या Magento के माध्यम से इसे एक्सेस करने का कोई तरीका है?

  1. क्या स्थानीय कैश संग्रहण में इस तत्व के मूल्य को बचाने का एक तरीका है ( Magento_Checkout/js/checkout-data) तो मूल्य पृष्ठ ताज़ा होने के बाद भी बना रहेगा?

2
इस पर एक नज़र डालें - magento.stackexchange.com/questions/135969/…
igloczek

कृपया नीचे दिए गए लिंक को देखें मुझे आशा है कि यह आपको magento.stackexchange.com/questions/187847/…
प्रदीप कुमार

जवाबों:


1

आपके प्रश्न के आधार पर मैं इस धारणा के तहत हूं कि आपके पास पहले से ही अपनी एक्सटेंशन विशेषताएँ हैं। मैंने एक समान संशोधन किया है और उम्मीद है कि मेरा जवाब मदद करता है।

अपने कस्टम मॉड्यूल में डिफ़ॉल्ट शिपिंग प्रोसेसर / डिफ़ॉल्ट का विस्तार करने के लिए एक आवश्यकता-विन्यास फ़ाइल बनाएँ

नाम स्थान / CustomModule / देखें / दृश्यपटल / requirejs-config.js
var config = {
    "नक्शा": {
        "*": {
            'Magento_Checkout / js / मॉडल / शिपिंग-सेव-प्रोसेसर / डिफ़ॉल्ट': 'Namespace_CustomModule / js / मॉडल / शिपिंग-सेव-प्रोसेसर / डिफ़ॉल्ट'
        }
    }
};

पेलोड में अपनी एक्सटेंशन विशेषता जोड़ें।

/ * वैश्विक परिभाषित, सतर्क * /
परिभाषित करते हैं (
    [
        'JQuery',
        'Ko',
        'Magento_Checkout / js / मॉडल / उद्धरण',
        'Magento_Checkout / js / मॉडल / संसाधन यूआरएल-प्रबंधक',
        'दाना / भंडारण',
        'Magento_Checkout / js / मॉडल / भुगतान सेवा',
        'Magento_Checkout / js / मॉडल / भुगतान / विधि कनवर्टर',
        'Magento_Checkout / js / मॉडल / त्रुटि प्रोसेसर',
        'Magento_Checkout / js / मॉडल / पूर्ण स्क्रीन-लोडर',
        'Magento_Checkout / js / कार्रवाई / चयन-बिलिंग-पता'
    ],
    समारोह (
        $,
        ko,
        बोली,
        resourceUrlManager,
        भंडारण,
        paymentService,
        methodConverter,
        errorProcessor,
        fullScreenLoader,
        selectBillingAddressAction
    ) {
        'सख्त का उपयोग करें';

        वापसी {
            saveShippingInformation: फ़ंक्शन () {
                var पेलोड;

                अगर (भाव.बिलिंगअड्रेस ()) {
                    selectBillingAddressAction (quote.shippingAddress ());
                }
                // अपने शिपिंग पते पर एक्सटेंशन विशेषताओं को जोड़ना
                पेलोड = {
                    पते की जानकारी: {
                        shipping_address: quote.shippingAddress (),
                        बिलिंग_अदालत: quot.billingAddress (),
                        shipping_method_code: quot.shippingMethod ()। method_code,
                        shipping_carrier_code: quot.shippingMethod ()। वाहक_कोड,
                        extension_attributes: {
                            custom_field: $ ('# custom_field')। val (), 
                        }
                    }
                };

                fullScreenLoader.startLoader ();

                वापसी भंडारण। पोस्ट (
                    resourceUrlManager.getUrlForSetShippingInformation (उद्धरण),
                    JSON.stringify (पेलोड)
                )।किया हुआ(
                    समारोह (प्रतिक्रिया) {
                        quote.setTotals (response.totals);
                        paymentService.setPaymentMethods (methodConverter (response.payment_methods));
                        fullScreenLoader.stopLoader ();
                    }
                ) .Fail (
                    समारोह (प्रतिक्रिया) {
                        errorProcessor.process (प्रतिक्रिया);
                        fullScreenLoader.stopLoader ();
                    }
                );
            }
        };
    }
);

अपने उद्धरण के लिए एक प्लगइन के साथ विशेषता को बचाएं (यह सुनिश्चित नहीं करें कि क्या आप एक पर्यवेक्षक का उपयोग कर सकते हैं यहां मैंने जांच नहीं की है)।

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

वर्ग SaveAddressInformation
{
    संरक्षित $ भावप्रणाली;
    सार्वजनिक समारोह __construct (
        \ Magento \ Quote \ Model \ QuoteRepository $ quotRepository
    ) {
        $ यह-> उद्धरणप्रतिसत्ता = $ बोलीप्रतिश्रेणी;
    }
    / **
     * @param \ Magento \ Checkout \ Model \ ShippingInformationManagement $ विषय
     * @ अपर $ कार्टआईड
     * @param \ Magento \ Checkout \ Api \ Data \ ShippingInformationInterface $ addressInformation
     * /
    सार्वजनिक समारोह से पहले
        \ Magento \ Checkout \ Model \ ShippingInformationManagement $ विषय,
        $ CartId,
        \ Magento \ Checkout \ Api \ Data \ ShippingInformationInterface $ addressInformation
    ) {
        $ एक्सटेंशनएट्यूएंट्स = $ एड्रेसइन्फॉर्मेशन-> getExtensionAttributes ();
        $ customField = $ extensionAttributes-> getCustomField ();
        $ बोली = $ यह-> बोलीप्रतिश्रेणी-> getActive ($ cartId);
        $ Quote-> setCustomField ($ customField);

    }
}

एक ऑब्जर्वर घटनाओं के साथ अपने आदेश में गुण सहेजें। 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

वर्ग SaveCustomFieldToOrder ऑब्जर्वरइंटरफेस लागू करता है
{
    / **
     * @var \ Magento \ Framework \ ObjectManagerInterface
     * /
    संरक्षित $ _objectManager;

    / **
     * @param \ Magento \ फ्रेमवर्क \ ObjectManagerInterface $ ऑब्जेक्टमैन
     * /
    सार्वजनिक समारोह __construct (\ Magento \ फ्रेमवर्क \ ObjectManagerInterface $ objectmanager)
    {
        $ यह -> _ objectManager = $ objectmanager;
    }

    सार्वजनिक समारोह निष्पादित (EventObserver $ पर्यवेक्षक)
    {
        $ आदेश = $ प्रेक्षक-> getOrder ();
        $ quotRepository = $ this -> _ objectManager-> create ('Magento \ Quote \ Model \ QuoteRepository');
        / ** @वर \ _ मैगेंटो \ _
        $ भाव = $ भावप्रतिष्ठित-> प्राप्त ($ आदेश-> getQuoteId ());
        $ आदेश-> setCustomField ($ बोली-> getCustomField ());

        यह $ वापस करो;
    }
}


मुख्य तरीकों को ओवरराइड करना बहुत भाग्यशाली नहीं है। क्या होगा अगर एक और मॉड्यूल आपका ओवरराइड करता है? magento.stackexchange.com/questions/135969/…
vaso123

अच्छा बिंदु, वैकल्पिक विधि के बारे में पता नहीं था। इस पर ध्यान दिलाने के लिए धन्यवाद।
नथानिएल

@ vaso123 ऐसा लगता है कि मुझे भी कुछ पता नहीं चल रहा है क्योंकि यहाँ पर नथानिएल ने एक प्लगइन और एक ईवेंट-ऑब्जर्वर बनाया है, जिससे यहाँ पर कोर फंक्शन ओवरराइड होता है। क्या आप इसे थोड़ा और समझा सकते हैं, यह वास्तव में मददगार होगा ... धन्यवाद
सर्वग्य

@ सार्वाग्य जब आप जेएस की आवश्यकता का उपयोग करते हैं, तो उपयोग न करें map *, इसके बजाय मिक्सिन का उपयोग करें।
vaso123

@ vaso123 मुझे विश्वास है कि वह Magento_Checkout / js / मॉडल / शिपिंग-सेव-प्रोसेसर / डिफॉल्ट 'का उल्लेख कर रहा है:' Namespace_CustomModule / js / model / shipping-save-processor / डिफ़ॉल्ट जो Ii के रूप में समझता है Magento_Checkout / js / मॉडल / शिपिंग / शिपिंग उपयोग करना चाहिए पृष्ठभूमि प्रोसेसर / डिफ़ॉल्ट। } इसकी थोड़ी देर हो गई है क्योंकि मैंने यह लिखा है इसलिए अगर मैं गलत हूं तो कृपया मुझे सुधारें।
नथानिएल

0

इस \Magento\Checkout\Block\Checkout\LayoutProcessor::processविधि के लिए एक प्लगइन बनाएँ ।

इस पथ पर di.xml में एक प्रविष्टि करें

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

इस निर्देशिका पर प्लगइन वर्ग बनाएँ।

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

2 => इस डायरेक्टरी पर प्लगइन क्लास बनाएं। 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;
}

}

यह हो जाने के बाद, चेकआउट पृष्ठ देखें।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.