有时我们需要修改Magento中的交易总数,以添加额外费用或额外折扣。合计是产品、运输成本、税费、折扣等的计算。
在本文中,我们将向您展示如何通过在计算过程中添加总计收集器来修改总计。
从声明到显示,在报价汇总计算中创建新项目的步骤包括以下步骤:
步骤1:声明总收集器
步骤2:实现总收集器类
步骤3:修改购物车布局
步骤4:修改布局
步骤5:为Total Item创建Js组件
步骤6:为合计项目创建模板
1 声明收集器
app/code/Vendor/Module/etc/sales.xml
<?xml version="1.0"?>
<config>
<section name="quote">
<group name="totals">
<item name="discount" instance="Vendor\Module\Model\Total\Quote\Custom" sort_order="300"/>
</group>
</section>
</config>
2 实现总收集器类
class Custom extends \Magento\Quote\Model\Quote\Address\Total\AbstractTotal {
public function collect(
\Magento\Quote\Model\Quote $quote,
\Magento\Quote\Api\Data\ShippingAssignmentInterface $shippingAssignment,
\Magento\Quote\Model\Quote\Address\Total $total
) {
parent::collect($quote, $shippingAssignment, $total);
$discount = 0.1 * $quote->getGrandTotal();
$total->addTotalAmount($this->getCode(), -$discount);
$total->addBaseTotalAmount($this->getCode(), -$discount);
$quote->setDiscount($discount);
return $this;
}
public function fetch(
\Magento\Quote\Model\Quote $quote,
\Magento\Quote\Model\Quote\Address\Total $total
) {
$discount = 0.1 * $quote->getGrandTotal();
return [
'code' => $this->getCode(),
'title' => $this->getLabel(),
'value' => -$discount //You can change the reduced amount, or replace it with your own variable
];
}
}
3 修改购物车布局
Vendor/Module/view/frontend/layout/checkout_cart_index.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock name="checkout.cart.totals">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
<item name="block-totals" xsi:type="array">
<item name="children" xsi:type="array">
<!-- Start of the main content that needs to be added-->
<item name="discount" xsi:type="array">
<!-- The path to our js file-->
<item name="component" xsi:type="string">Vendor_Module/js/view/checkout/summary/discount-fee</item>
<item name="sortOrder" xsi:type="string">20</item>
<item name="config" xsi:type="array">
<!-- Show custom discount on order summary-->
<item name="discount" xsi:type="string" translate="true">Custom Discount</item>
</item>
</item>
<!-- End-->
</item>
</item>
</item>
</argument>
</arguments>
</referenceBlock>
</body>
</page>
4:修改布局
Vendor/Module/view/frontend/layout/checkout_index_index.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock name="checkout.root">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
<item name="checkout" xsi:type="array">
<item name="children" xsi:type="array">
<item name="sidebar" xsi:type="array">
<item name="children" xsi:type="array">
<item name="summary" xsi:type="array">
<item name="children" xsi:type="array">
<item name="totals" xsi:type="array">
<item name="children" xsi:type="array">
<!-- Start of the main content that needs to be added-->
<item name="discount" xsi:type="array">
<!-- The path to our js file-->
<item name="component" xsi:type="string">Vendor_Module/js/view/checkout/cart/totals/discount</item>
<item name="sortOrder" xsi:type="string">20</item>
<item name="config" xsi:type="array">
<item name="template" xsi:type="string">Vendor_Module/checkout/cart/totals/discount</item>
<!-- Show custom discount on order summary-->
<item name="title" xsi:type="string" translate="true">Custom Discount</item>
</item>
</item>
</item>
</item>
<item name="cart_items" xsi:type="array">
<item name="children" xsi:type="array">
<item name="details" xsi:type="array">
<item name="children" xsi:type="array">
<item name="subtotal" xsi:type="array">
<item name="component" xsi:type="string">Magento_Tax/js/view/checkout/summary/item/details/subtotal</item>
</item>
</item>
</item>
</item>
</item>
<!-- End-->
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</argument>
</arguments>
</referenceBlock>
</body>
</page>
步骤5:为Total Item创建Js组件
Vendor/Module/view/frontend/web/js/view/checkout/cart/totals/discount.js
define(
[
‘Vendor_Module’/js/view/checkout/summary/discount-fee'
],
function (Component) {
'use strict';
return Component.extend({
/**
* @override
*/
isDisplayed: function () {
return true;
}
});
}
);
Vendor/Module/view/frontend/web/js/view/checkout/summary/discount-fee.js
define(
[
'jquery',
'Magento_Checkout/js/view/summary/abstract-total',
'Magento_Checkout/js/model/quote',
'Magento_Checkout/js/model/totals',
'Magento_Catalog/js/price-utils'
],
function ($,Component,quote,totals,priceUtils) {
"use strict";
return Component.extend({
defaults: {
template: ‘Vendor_Module’/checkout/summary/discount-fee'
},
totals: quote.getTotals(),
isDisplayedDiscountTotal : function () {
return true;
},
getDiscountTotal : function () {
var price = totals.getSegment('discount').value;
return this.getFormattedPrice(price);
}
});
}
);
步骤6:为合计项目创建模板
Vendor/Module/view/frontend/web/template/checkout/cart/totals/discount.html
<!-- ko if: isDisplayedDiscountTotal() -->
<tr class="totals discount excl">
<th class="mark" colspan="1" scope="row" data-bind="text: title"></th>
<td class="amount">
<span class="price" data-bind="text: getDiscountTotal()"></span>
</td>
</tr>
<!-- /ko -->
Vendor/Module/view/frontend/web/template/checkout/summary/discount-fee.html
<!-- ko if: isDisplayedDiscountTotal() -->
<tr class="totals coupon-fee excl">
<th class="mark" colspan="1" scope="row" data-bind="text: discount"></th>
<td class="amount">
<span class="price" data-bind="text: getDiscountTotal(), attr: {'data-th': discount}"></span>
</td>
</tr>
<!-- /ko -->