wsh5485/carwash_order
Archived
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects 1 Releases 8 Wiki Activity

feat(预约表单): 添加价格编辑字段并改进表单验证逻辑

Browse Source 
添加可编辑的最终价格输入字段，支持自定义价格
根据客户类型实现不同的表单验证逻辑
改进套餐价格显示格式并添加价格自动填充功能
This commit is contained in:
吴展鹏
2025-11-19 12:35:14 +08:00
parent 76ba21f57a
commit e88ef332ff
1 changed files with 42 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.php
+42 -10
View File
@@ -437,9 +437,15 @@ $packages_json = json_encode(array_map(function($package) {
<h4 id="packageName"></h4> <h4 id="packageName"></h4>
<p id="packageDescription"></p> <p id="packageDescription"></p>
<div class="package-meta"> <div class="package-meta">
<span id="packageDuration"></span> <span id="packageDuration"></span>
<span id="packagePrice"></span> <span id="packagePrice"></span>
</div> </div>
<!-- 可编辑的价格输入字段 -->
<div class="form-group" style="margin-top: 15px;">
<label for="total_price">最终价格 (￥)</label>
<input type="number" id="total_price" name="total_price" min="0" step="0.01" value="0" placeholder="输入最终价格" required>
<input type="hidden" id="package_price" value="0">
</div>
<div id="packageServices"></div> <div id="packageServices"></div>
</div> </div>
</div> </div>
@@ -1144,7 +1150,7 @@ $packages_json = json_encode(array_map(function($package) {
document.getElementById('packageName').textContent = package.package_name; document.getElementById('packageName').textContent = package.package_name;
document.getElementById('packageDescription').textContent = package.description; document.getElementById('packageDescription').textContent = package.description;
document.getElementById('packageDuration').textContent = `基础时长: ${package.base_duration}分钟`; document.getElementById('packageDuration').textContent = `基础时长: ${package.base_duration}分钟`;
document.getElementById('packagePrice').textContent = `价格: ￥${package.price}`; document.getElementById('packagePrice').textContent = `套餐价格: ￥${package.price}`;
// 显示服务项目 // 显示服务项目
const servicesContainer = document.getElementById('packageServices'); const servicesContainer = document.getElementById('packageServices');
@@ -1158,9 +1164,17 @@ $packages_json = json_encode(array_map(function($package) {
// 自动设置基础时长 // 自动设置基础时长
document.getElementById('duration').value = package.base_duration; document.getElementById('duration').value = package.base_duration;
selectDuration(package.base_duration); selectDuration(package.base_duration);
// 设置价格输入字段的值为套餐价格
document.getElementById('package_price').value = package.price;
document.getElementById('total_price').value = package.price;
console.log('已设置价格:', package.price);
} }
} else { } else {
packageInfoDiv.style.display = 'none'; packageInfoDiv.style.display = 'none';
document.getElementById('package_price').value = 0;
document.getElementById('total_price').value = 0;
} }
updateSubmitButton(); updateSubmitButton();
@@ -1168,14 +1182,32 @@ $packages_json = json_encode(array_map(function($package) {
function updateSubmitButton() { function updateSubmitButton() {
const submitBtn = document.getElementById('submitBtn'); const submitBtn = document.getElementById('submitBtn');
const isFormValid = selectedDate && selectedTime && const customerType = document.getElementById('customer_type').value;
document.getElementById('customer_name').value &&
document.getElementById('phone').value && // 根据客户类型进行不同的验证
document.getElementById('car_model').value && let isFormValid;
document.getElementById('car_number').value &&
document.getElementById('package_id').value; if (customerType === 'vip') {
// VIP模式：验证VIP选择和其他必要字段，但不验证新客户字段
isFormValid = selectedDate && selectedTime &&
document.getElementById('vip_id').value &&
document.getElementById('car_model').value &&
document.getElementById('car_number').value &&
document.getElementById('package_id').value &&
document.getElementById('total_price').value;
} else {
// 新客户模式：验证所有必填字段
isFormValid = selectedDate && selectedTime &&
document.getElementById('customer_name').value &&
document.getElementById('phone').value &&
document.getElementById('car_model').value &&
document.getElementById('car_number').value &&
document.getElementById('package_id').value &&
document.getElementById('total_price').value;
}
submitBtn.disabled = !isFormValid; submitBtn.disabled = !isFormValid;
console.log('更新提交按钮状态:', isFormValid ? '可点击' : '禁用');
} }
function resetForm() { function resetForm() {