Giới hạn giá trị đơn hàng cho phương thức Thanh toán khi nhận hàng (COD)

Phương thức Thanh toán khi nhận hàng (COD) được sử dụng khi người bán hàng muốn thu tiền thanh toán tại thời điểm người mua nhận hàng. Tuy nhiên, sẽ có rủi ro khi khách mua hàng đặt các đơn có giá trị cao và tỉ lệ những đơn hàng này có thể bị trả lại sẽ cao hơn so với đơn hàng đã được thanh toán trước do người mua có ít cam kết trong việc mua hàng. Trong bài viết này, chúng tôi sẽ hướng dẫn bạn cách giới hạn giá trị đơn hàng khi thanh toán COD để giảm thiểu rủi ro này.

Hướng dẫn

<script >
    	window.sbsdk.ready(function() {
    		window.sbsdk.page.onContextUpdate(function(context) {
    			if (context.type === 'checkout' || context.type === 'process_checkout') {
    				const maxItem = 3
    				const maxValue = 550
    
    				const type = 'semi'
    
    				var readyCheckInterval = setInterval(function() {
    					const btn = document.getElementsByClassName("step__continue-button")[0] || document.getElementsByClassName("step__complete-order")[0]
    
    					function addAlert() {
    					    console.log(btn)
    						btn.disabled = true
    						var text = ""
    						if (type === "value") {
    							text = `Your order reaches the maximum amount. It should be less than or equal to $${maxValue}. Please select another payment method or update your cart.`
    						}
    						if (type === "item") {
    							text = `Your order reaches the maximum quantity. It should be less than or equal to ${maxItem} items. Please select another payment method or update your cart.`
    						}
    						if (type === "semi") {
    							text = `Your order reaches the maximum quantity and/or amount. It should be less than or equal to ${maxItem} items and/or $${maxValue}. Please select another payment method or update your cart.`
    						}
    						document.getElementById('cod-cod-header').insertAdjacentHTML('afterend', `<div id="alert_cod" style="
                    /* padding-top: 10px; */
                    padding: 16px;
                    background: rgb(252,246,230);
                ">
                <div style="
                font-size: 12px;
                display: flex;
                width: 100%;
                justify-content: space-evenly;
                ">
                <img src="https://upload.wikimedia.org/wikipedia/commons/9/99/OOjs_UI_icon_alert-yellow.svg">
                <div style="
        padding-left: 20px;
    ">${text}</div>
        
                </div>
                </div>`)
    					}
    
    					function removeAlert() {
    						const alert = document.getElementById("alert_cod")
    						if (alert !== null) {
    							document.getElementById("alert_cod").remove()
    							btn.disabled = false
    						}
    
    					}
    
    					var a = document.getElementsByClassName("payment_method")
    					for (let i = 0; i < a.length; i++) {
    						if (a[i].id === "cod-cod-header") {
    							continue
    						}
    						a[i].addEventListener("click", removeAlert)
    					}
    
    					function validValue() {
    						const text = document.getElementsByClassName("payment-due__price")[0].innerHTML
    						let numb = text.match(/[0-9/(.)]/g);
    						numb = Number(numb.join(""));
    						return numb > maxValue
    					}
    
    					function validItem() {
    						let count = 0
    						const listItem = document.getElementsByClassName('checkout-product-thumbnail__quantity')
    						for (let item of listItem) {
    							count += parseInt(item.innerHTML)
    						}
    						return count > maxItem
    					}
    
    					function valid() {
    						if (type === "value") {
    							return validValue()
    						}
    						if (type === "item") {
    							return validItem()
    						}
    						if (type === "semi") {
    							return validValue() || validItem()
    						}
    
    					}
    					if (document.getElementById("cod-cod-header") !== null) {
    						document.getElementById("cod-cod-header").addEventListener("click", item => {
    							const alert = document.getElementById('alert_cod')
    							if (valid() && alert === null) {
    								addAlert()
    							}
    						})
    					}
    					setInterval(() => {
    					    if (document.getElementById("cod-cod-section")) {
        						if (!btn.disabled && document.getElementById("cod-cod-section").style.display === '' && document.getElementById("alert_cod") === null && valid()) {
        							addAlert()
        						}
        					}	
    					}, 500)
    
    				}, 500);
    			}
    		});
    	}); 
    	</script>

Để giới hạn số lượng mặt hàng:

Để giới hạn giá trị đơn hàng:

Để xác định giá trị đơn hàng bạn muốn giới hạn:

Logic sẽ được áp dụng ngay lập tức và bạn có thể xem trang thanh toán như ảnh bên dưới.

Logic này không áp dụng cho ưu đãi sau khi mua hàng vì khách hàng có thể thêm mặt hàng bổ sung sau khi mua hàng. Bạn có thể tắt ưu đãi sau khi mua hàng bằng cách làm theo các bước trong bài viết này.

Bài viết liên quan