ปัญหาการรีเฟรชหน้าเช็คเอาต์

ก่อนอื่นฉันต้องการให้ภาพหน้าจอเพื่อทำความเข้าใจปัญหาของฉัน

ตอนนี้ฉันต้องการเพิ่มรหัสที่เกี่ยวข้องที่นี่

etc / ส่วนหน้า / 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\CompositeConfigProvider">
            <arguments>
                <argument name="configProviders" xsi:type="array">
                    <item name="checkout_deliverysign_block" xsi:type="object">Kensium\DeliverySign\Model\DeliverySignConfigProvider</item>
                </argument>
            </arguments>
        </type>
    </config>

DeliverySignConfigProvider

<?php
namespace Kensium\DeliverySign\Model;

use Magento\Checkout\Model\ConfigProviderInterface;
use Magento\Store\Model\ScopeInterface;

class DeliverySignConfigProvider implements ConfigProviderInterface
{
    /**
     * @var \Magento\Framework\App\Config\ScopeConfigInterface
     */
    protected $scopeConfiguration;

    protected $checkoutSession;

    protected $logger;

    /**
     * @param \Magento\Framework\App\Config\ScopeConfigInterface $scopeConfiguration
     * @codeCoverageIgnore
     */
    public function __construct(
        \Magento\Framework\App\Config\ScopeConfigInterface $scopeConfiguration,
        \Magento\Checkout\Model\Session $checkoutSession,
        \Psr\Log\LoggerInterface $logger

    )
    {
        $this->scopeConfiguration = $scopeConfiguration;
        $this->checkoutSession=$checkoutSession;
        $this->logger=$logger;
    }

    /**
     * {@inheritdoc}
     */
    public function getConfig()
    {
        $deliverySignConfig = [];
        $enabled = $this->scopeConfiguration->getValue('deliverysign/deliverysign/status', ScopeInterface::SCOPE_STORE);
        $minimumOrderAmount = $this->scopeConfiguration->getValue('deliverysign/deliverysign/minimum_order_amount', ScopeInterface::SCOPE_STORE);
        $quote=$this->checkoutSession->getQuote();
        $subtotal=$quote->getSubtotal();
        $this->logger->addDebug($subtotal);
        $deliverySignConfig['delivery_sign_amount'] = $this->scopeConfiguration->getValue('deliverysign/deliverysign/deliverysign_amount', ScopeInterface::SCOPE_STORE);
        $deliverySignConfig['show_hide_deliverysign_block'] = ($enabled && ($minimumOrderAmount<$subtotal) && $quote->getFee()) ? true : false;
        $deliverySignConfig['show_hide_deliverysign_shipblock'] = ($enabled && ($minimumOrderAmount<$subtotal)) ? true : false;
        return $deliverySignConfig;
    }
}

โปรดค้นหารายละเอียดเพิ่มเติมด้านล่าง

https://github.com/sivajik34/Delivery-Signature-Magento2

การสังเกตของฉันคือDeliverySignConfigProviderวัตถุไม่ได้ถูกเรียกเมื่อคุณคลิกปุ่มถัดไปเฉพาะการโทรของมันเมื่อคุณกำลังโหลดหน้านี้อีกครั้ง มีใครช่วยฉันได้ไหม

ฉันคิดว่าเราไม่จำเป็นต้องโหลดซ้ำข้อมูลสรุปทั้งหมด เพราะเมื่อคลิกปุ่มถัดไปวีโอไอพีจะสร้างคำขอ (API) V1/carts/mine/shipping-informationเพื่อคำนวณผลรวมใหม่และส่งออกข้อมูลผลรวมไปยังเทมเพลตของเรา

ดังนั้นถ้าเราต้องการตรวจสอบค่าธรรมเนียมเราควรตรวจสอบคำตอบ total_segments

เมื่อคลิกถัดจากขั้นตอนการชำระเงินจะมีคำขอให้ตั้งค่าผู้ขายข้อมูลการจัดส่ง / magento / module-checkout / view / frontend / web / js / view / shipping.js

             /**
             * Set shipping information handler
             */
            setShippingInformation: function () {
                if (this.validateShippingInformation()) {
                    setShippingInformationAction().done(
                        function () {
                            stepNavigator.next();
                        }
                    );
                }
            }

คำขอนี้จะคำนวณผลรวมอีกครั้ง

ในกรณีของคุณในเทมเพลต html ของเราควรมีisDisplayed()ฟังก์ชั่น:

Kensium / DeliverySign / view / ส่วนหน้า / เว็บ / แม่แบบ / ชำระเงิน / รถเข็น / ผลรวม / fee.html

<!-- ko if: isDisplayed() -->
<tr class="totals fee excl" data-bind="visible: canVisibleDeliverySignBlock">
    <th class="mark" colspan="1" scope="row" data-bind="text: title"></th>
    <td class="amount">
        <span class="price" data-bind="text: getValue()"></span>
    </td>
</tr>
<!-- /ko -->

ตรวจสอบisDisplayed()ฟังก์ชั่น:

Kensium / DeliverySign / view / ส่วนหน้า / เว็บ / js / view / ชำระเงิน / รถเข็น / ผลรวม / fee.js

define([
    'ko',
    'uiComponent',
    'Magento_Checkout/js/model/quote',
    'Magento_Catalog/js/price-utils',
    'Magento_Checkout/js/model/totals'

], function (ko, Component, quote, priceUtils, totals) {
    'use strict';
    var show_hide_deliverysign_blockConfig = window.checkoutConfig.show_hide_deliverysign_block;
    var delivery_sign_amount = window.checkoutConfig.delivery_sign_amount;

    return Component.extend({

        totals: quote.getTotals(),
        canVisibleDeliverySignBlock: show_hide_deliverysign_blockConfig,
        getFormattedPrice: ko.observable(priceUtils.formatPrice(delivery_sign_amount, quote.getPriceFormat())),

        isDisplayed: function () {
            return this.getValue() != 0;
        },
        getValue: function() {
            var price = 0;
            if (this.totals() && totals.getSegment('fee')) {
                price = totals.getSegment('fee').value;
            }
            return this.getFormattedPrice(price);
        }
    });
});

ฟังก์ชันนี้จะตรวจสอบfeeส่วนผลรวมจากการตอบกลับ

ฉันจะทำให้ดึงคอมไพล์ที่นี่

หมายเหตุ:ตรวจสอบให้แน่ใจว่าค่าธรรมเนียมของคุณคำนวณอย่างถูกวิธี ในขั้นตอนการชำระเงินโปรดตรวจสอบการตอบสนองที่มีค่าธรรมเนียมของเรา

คุณต้องเขียนทับโมเดลคลาสการชำระเงิน 'payment-service.js' คุณสามารถทำได้ด้วยวิธีต่อไปนี้:

# Kensium / DeliverySign / view / ส่วนหน้า / requirejs-config.js
var config = {
    "map": {
        "*": {
            'Magento_Checkout / js / model / shipping-save-processor / default': 'Kensium_DeliverySign / js / model / shipping-save-processor / default',
            'Magento_Checkout / js / model / payment-service': 'Kensium_DeliverySign / js / model / payment-service'
        }
    }
};

ดังนั้นควรสร้างKensium / DeliverySign / view / frontend / web / js / model / payment-service.jsและเนื้อหา

/ **
 * ลิขสิทธิ์© 2016 Magento สงวนลิขสิทธิ์.
 * ดู COPYING.txt สำหรับรายละเอียดใบอนุญาต
 * /
กำหนด(
    [
        'ขีด'
        'Magento_Checkout / js / รุ่น / quote'
        'Magento_Checkout / js / รุ่น / ชำระเงิน / วิธีการรายการ'
        'Magento_Checkout / js / / การกระทำที่เลือกชำระเงินวิธีการ'
        'Magento_Checkout / js / รุ่น / ผลรวม'
    ]
    function (_, quote, methodList, selectPaymentMethod, totals) {
        'ใช้อย่างเข้มงวด';
        var freeMethodCode = 'ฟรี';

        กลับ {
            isFreeAvailable: false,
            / **
             * เติมรายการวิธีการชำระเงิน
             * วิธีการ @param {Array}
             * /
            setPaymentMethods: function (methods) {
                var self = สิ่งนี้
                    freeMethod,
                    filteredMethods,
                    methodIsAvailable;

                freeMethod = _.find (เมธอด, ฟังก์ชัน (เมธอด) {
                    return method.method === freeMethodCode;
                });
                this.isFreeAvailable = freeMethod? ถูกผิด;

                ถ้า (self.isFreeAvailable && freeMethod && quote.totals (). grand_total <= 0) {
                    methods.splice (0, methods.length, freeMethod)
                    selectPaymentMethod (freeMethod);
                }
                filteredMethods = _.without (เมธอด, freeMethod)

                if (filteredMethods.length === 1) {
                    selectPaymentMethod (filteredMethods [0]);
                } อื่น ๆ หาก (quote.paymentMethod ()) {
                    methodIsAvailable = methods.some (ฟังก์ชั่น (รายการ) {
                        คืน item.method === quote.paymentMethod (). method;
                    });
                    // ยกเลิกการตั้งค่าวิธีการชำระเงินที่เลือกถ้าไม่มี
                    if (! methodIsAvailable) {
                        selectPaymentMethod (null);
                    }
                }
                methodList (วิธีการ);
                totals.isLoading (จริง);
                window.checkoutConfig.show_hide_deliverysign_block = 1;
                totals.isLoading (false);
            }
            / **
             * รับรายการวิธีการชำระเงินที่มีอยู่
             * @returns {Array}
             * /
            getAvailablePaymentMethods: function () {
                วิธีการ var = [],
                    ตนเอง = นี่;
                _.each (methodList (), function (method) {
                    ถ้า (self.isFreeAvailable && (
                            quote.totals (). grand_total 0 && method.method! == freeMethodCode
                        ) || ! self.isFreeAvailable
                    ) {
                        methods.push (วิธีการ);
                    }
                });

                วิธีการคืนสินค้า
            }
        };
    }
);

ลบpub / static / frontend / Magento / luma / en_US / Kensium_DeliverySignถ้ามีอยู่แล้ว

รันคำสั่งปรับใช้ต่อไปนี้

การตั้งค่า php bin / magento: static-content: deploy

คุณควรสร้างชื่อเซสชันในเครื่องหมายการจัดส่งด้วย ดังนั้นสิ่งนี้จะโหลดการเปลี่ยนแปลงรถเข็นในแต่ละคำขอ POST ไปยังตัวควบคุมของคุณ โดยทั่วไปแล้วโหนดการดำเนินการบ่งชี้พา ธ ของตัวควบคุมและโหนดส่วนกำหนดว่าควรปรับปรุงเนื้อหาของฝั่งไคลเอ็นต์ใด แคชต้องถูกลบทิ้งเพื่อให้การเปลี่ยนแปลงนี้มีผล ตรวจสอบCheckout/etc/frontend/sections.xml ตัวอย่างเช่นsections.xmlในetc/frontend

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Customer:etc/sections.xsd">
    <action name="youraction/process/observer">
        <section name="cart"/>
    </action>
</config>