编辑页面

修改后将从当前时间重新计算过期时间
`; } if (type === "vehicle") { title.textContent = "切换车辆"; sub.textContent = "按车架号匹配可购买配件"; confirm.textContent = "确认车辆"; body.innerHTML = `
系统将根据 VIN 过滤适配配件,并同步到订单信息。
`; } if (type === "profileEdit") { title.textContent = "编辑个人资料"; sub.textContent = "维护联系人和到店服务信息"; confirm.textContent = "保存"; body.innerHTML = `
`; } if (type === "orderDetail") { const order = orders.find(item => item.no === payload.no); title.textContent = "订单详情"; sub.textContent = order.no; confirm.textContent = "知道了"; body.innerHTML = `

${order.status}

${money(order.amount)}
下单时间${order.time}
服务门店${order.store}
车辆沪A8K26P / 别克 GL8
配件${order.lines.join(",")}
`; } document.getElementById("drawerMask").classList.add("open"); refreshIcons(); } function closeDrawer() { document.getElementById("drawerMask").classList.remove("open"); } function switchView(view) { document.querySelectorAll(".view").forEach(el => el.classList.toggle("active", el.id === view)); document.querySelectorAll(".bottom-nav button").forEach(btn => btn.classList.toggle("active", btn.dataset.view === view)); if (view === "orders") renderOrders(); if (view === "claims") renderClaims(); } /* ---------- 索赔数据 ---------- */ const claims = [ { no: "CLM202607001", vin: "LSGDC82C5KE123456", part: "前刹车片", qty: 1, amount: 520, status: "审核中", time: "2026-07-20 14:30" }, { no: "CLM202607002", vin: "LSGDC82C5KE123456", part: "机油滤清器", qty: 1, amount: 85, status: "已赔付", time: "2026-07-15 09:12" }, { no: "CLM202606003", vin: "LSGDC82C5KE123456", part: "空调压缩机总成", qty: 1, amount: 2480, status: "已到账", time: "2026-06-28 16:45" }, { no: "CLM202606004", vin: "LSGWR52C8LE789012", part: "点火线圈", qty: 2, amount: 640, status: "已驳回", time: "2026-06-12 11:20" }, { no: "CLM202605005", vin: "LSGWR52C8LE789012", part: "后雨刮片", qty: 1, amount: 98, status: "已到账", time: "2026-05-30 10:08" }, ]; function renderClaims(vin = null) { const container = document.getElementById("claimList"); // 首次进入页面(vin为null)不显示数据 if (vin === null) { container.innerHTML = ``; return; } const filtered = vin ? claims.filter(c => c.vin.toUpperCase().includes(vin.toUpperCase())) : claims; if (!filtered.length) { container.innerHTML = vin ? `
未找到 VIN「${vin}」的索赔记录
` : `
暂无历史索赔记录
`; return; } container.innerHTML = filtered.map(c => `
${c.no}${c.time} · VIN: ${c.vin}
${c.status}
${c.part} x${c.qty} ¥${c.amount.toFixed(2)}
`).join(""); } document.addEventListener("click", event => { const nav = event.target.closest("[data-view]"); if (nav) switchView(nav.dataset.view); const category = event.target.closest("[data-category]"); if (category) { currentCategory = category.dataset.category; document.querySelectorAll("[data-category]").forEach(btn => btn.classList.toggle("active", btn === category)); renderParts(); } const plus = event.target.closest("[data-qty-plus], [data-quick-add]"); if (plus) { const id = plus.dataset.qtyPlus || plus.dataset.quickAdd; cart[id] = (cart[id] || 0) + 1; renderParts(); showToast("已加入订单"); } const minus = event.target.closest("[data-qty-minus]"); if (minus) { const id = minus.dataset.qtyMinus; cart[id] = Math.max((cart[id] || 0) - 1, 0); if (cart[id] === 0) delete cart[id]; renderParts(); } const drawerButton = event.target.closest("[data-open-drawer]"); if (drawerButton) openDrawer(drawerButton.dataset.openDrawer); if (event.target.closest("[data-close-drawer]")) closeDrawer(); const toastButton = event.target.closest("[data-toast]"); if (toastButton) { showToast(toastButton.dataset.toast); if (toastButton.closest("[data-stop-order]")) return; } const orderDetail = event.target.closest("[data-order-detail]"); if (orderDetail) openDrawer("orderDetail", { no: orderDetail.dataset.orderDetail }); }); document.getElementById("searchBtn").addEventListener("click", renderParts); document.getElementById("partSearch").addEventListener("keydown", event => { if (event.key === "Enter") renderParts(); }); document.getElementById("vinSearchBtn").addEventListener("click", () => { renderClaims(document.getElementById("vinSearch").value.trim()); }); document.getElementById("vinSearch").addEventListener("keydown", event => { if (event.key === "Enter") renderClaims(document.getElementById("vinSearch").value.trim()); }); document.getElementById("checkoutBtn").addEventListener("click", () => { if (!cartCount()) { showToast("请先选择配件"); return; } openDrawer("checkout"); }); document.getElementById("drawerConfirm").addEventListener("click", () => { closeDrawer(); if (currentDrawer === "checkout") { orders.unshift({ no: "PO20260723018", status: "待确认", time: "2026-07-23 11:36", amount: cartTotal(), lines: parts.filter(part => cart[part.id]).map(part => `${part.name} x${cart[part.id]}`), store: "上海徐汇店" }); Object.keys(cart).forEach(key => delete cart[key]); renderParts(); switchView("orders"); showToast("订单已提交"); return; } showToast(currentDrawer === "profileEdit" ? "资料已保存" : "操作已确认"); }); /* 索赔抽屉 */ const claimDrawerMask = document.getElementById("claimDrawerMask"); document.getElementById("newClaimBtn").addEventListener("click", () => { claimDrawerMask.classList.add("open"); }); claimDrawerMask.querySelectorAll("[data-close-claim-drawer]").forEach(btn => { btn.addEventListener("click", () => claimDrawerMask.classList.remove("open")); }); claimDrawerMask.addEventListener("click", event => { if (event.target === claimDrawerMask) claimDrawerMask.classList.remove("open"); }); document.getElementById("claimSubmitBtn").addEventListener("click", () => { const vin = document.getElementById("claimVin").value.trim(); const owner = document.getElementById("claimOwner").value.trim(); const phone = document.getElementById("claimPhone").value.trim(); const part = document.getElementById("claimPart").value.trim(); const price = document.getElementById("claimPrice").value.trim(); const hours = document.getElementById("claimHours").value.trim(); if (!vin || !owner || !phone || !part || !price || !hours) { showToast("请填写完整信息"); return; } claimDrawerMask.classList.remove("open"); showToast("索赔订单已提交"); }); renderParts(); renderOrders(); refreshIcons();
取消
访问码: bjt8ecc7