104 lines
		
	
	
		
			3.9 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			104 lines
		
	
	
		
			3.9 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
// 库存调整页面的JavaScript功能
 | 
						|
document.addEventListener('DOMContentLoaded', function() {
 | 
						|
    const changeTypeSelect = document.getElementById('change_type');
 | 
						|
    const changeAmountInput = document.getElementById('change_amount');
 | 
						|
    const stockHint = document.getElementById('stock-hint');
 | 
						|
 | 
						|
    // 当前库存数量通过HTML中的全局变量CURRENT_STOCK获取
 | 
						|
    const currentStock = CURRENT_STOCK;
 | 
						|
 | 
						|
    // 当改变调整类型时,更新提示信息
 | 
						|
    changeTypeSelect.addEventListener('change', updateStockHint);
 | 
						|
    changeAmountInput.addEventListener('input', updateStockHint);
 | 
						|
 | 
						|
    function updateStockHint() {
 | 
						|
        const changeType = changeTypeSelect.value;
 | 
						|
        const changeAmount = parseInt(changeAmountInput.value) || 0;
 | 
						|
 | 
						|
        if (changeType === 'out') {
 | 
						|
            // 出库检查
 | 
						|
            if (changeAmount > currentStock) {
 | 
						|
                stockHint.textContent = `警告: 出库数量(${changeAmount})超过当前库存(${currentStock})!`;
 | 
						|
                stockHint.className = 'form-text stock-hint danger';
 | 
						|
                changeAmountInput.setCustomValidity('出库数量不能超过当前库存');
 | 
						|
            } else {
 | 
						|
                const newStock = currentStock - changeAmount;
 | 
						|
                stockHint.textContent = `出库后库存将变为: ${newStock}`;
 | 
						|
                stockHint.className = 'form-text stock-hint';
 | 
						|
                changeAmountInput.setCustomValidity('');
 | 
						|
 | 
						|
                if (newStock <= 5 && newStock > 0) {
 | 
						|
                    stockHint.classList.add('warning');
 | 
						|
                } else if (newStock <= 0) {
 | 
						|
                    stockHint.classList.add('danger');
 | 
						|
                }
 | 
						|
            }
 | 
						|
        } else {
 | 
						|
            // 入库提示
 | 
						|
            const newStock = currentStock + changeAmount;
 | 
						|
            stockHint.textContent = `入库后库存将变为: ${newStock}`;
 | 
						|
            stockHint.className = 'form-text stock-hint';
 | 
						|
            changeAmountInput.setCustomValidity('');
 | 
						|
        }
 | 
						|
 | 
						|
        // 添加一些迪士尼风格的交互效果
 | 
						|
        addDisneyInteractions();
 | 
						|
    }
 | 
						|
 | 
						|
    // 添加迪士尼风格的交互效果
 | 
						|
    function addDisneyInteractions() {
 | 
						|
        // 闪光效果
 | 
						|
        const sparkleEffect = document.querySelector('.disney-sparkles');
 | 
						|
        if (sparkleEffect) {
 | 
						|
            sparkleEffect.style.opacity = '0.7';
 | 
						|
            setTimeout(() => { sparkleEffect.style.opacity = '0'; }, 800);
 | 
						|
        }
 | 
						|
 | 
						|
        // 按钮动画效果
 | 
						|
        const confirmBtn = document.querySelector('.disney-confirm-btn');
 | 
						|
        if (confirmBtn) {
 | 
						|
            confirmBtn.classList.add('active');
 | 
						|
            setTimeout(() => { confirmBtn.classList.remove('active'); }, 300);
 | 
						|
        }
 | 
						|
    }
 | 
						|
 | 
						|
    // 初始化提示
 | 
						|
    updateStockHint();
 | 
						|
 | 
						|
    // 表单提交前验证
 | 
						|
    document.querySelector('form').addEventListener('submit', function(event) {
 | 
						|
        const changeType = changeTypeSelect.value;
 | 
						|
        const changeAmount = parseInt(changeAmountInput.value) || 0;
 | 
						|
 | 
						|
        if (changeType === 'out' && changeAmount > currentStock) {
 | 
						|
            event.preventDefault();
 | 
						|
            alert('出库数量不能超过当前库存!');
 | 
						|
            return false;
 | 
						|
        }
 | 
						|
 | 
						|
        if (changeAmount <= 0) {
 | 
						|
            event.preventDefault();
 | 
						|
            alert('调整数量必须大于0!');
 | 
						|
            return false;
 | 
						|
        }
 | 
						|
 | 
						|
        // 添加提交成功的动画效果
 | 
						|
        const card = document.querySelector('.disney-inventory-card');
 | 
						|
        if (card) {
 | 
						|
            card.classList.add('submitting');
 | 
						|
        }
 | 
						|
    });
 | 
						|
 | 
						|
    // 为表单元素添加迪士尼风格的交互效果
 | 
						|
    const formElements = document.querySelectorAll('.disney-select, .disney-input, .disney-textarea');
 | 
						|
    formElements.forEach(element => {
 | 
						|
        element.addEventListener('focus', function() {
 | 
						|
            this.parentNode.classList.add('focused');
 | 
						|
        });
 | 
						|
 | 
						|
        element.addEventListener('blur', function() {
 | 
						|
            this.parentNode.classList.remove('focused');
 | 
						|
        });
 | 
						|
    });
 | 
						|
});
 |