'; const res = await get('/home'); if (!res || res.status !== 'ok') { el.innerHTML = '
😵
加载失败,请刷新重试
'; return; } state.homeData = res.data; renderHome(res.data); } catch(e) { const el = document.querySelector('#pageHome .page-content'); el.innerHTML = '
😵
网络异常,请检查后刷新
'; console.error(e); } } function renderHome(data) { const el = document.querySelector('#pageHome .page-content'); let html = ''; // Banner if (data.banners && data.banners.length) { html += '
'; data.banners.forEach((b, i) => { html += `
${b.title}
`; }); html += '
'; data.banners.forEach((_, i) => { html += ``; }); html += '
'; // Auto slide let idx = 0; setInterval(() => { const slides = document.querySelectorAll('#homeBanner .swiper-slide'); const dots = document.querySelectorAll('#homeBanner .swiper-dots span'); if (!slides.length) return; slides[idx].classList.remove('active'); dots[idx].classList.remove('active'); idx = (idx + 1) % slides.length; slides[idx].classList.add('active'); dots[idx].classList.add('active'); }, 3000); } // Categories if (data.categories && data.categories.length) { html += '
服务分类
'; html += '
'; data.categories.forEach(c => { const colors = ['#E94560','#26A69A','#5C6BC0','#FF8A65','#AB47BC','#66BB6A']; const icons = ['🤱','🍼','👶','🏋️','💆','💜']; const color = colors[(c.id-1) % colors.length]; const icon = icons[(c.id-1) % icons.length]; html += ``; }); html += '
'; } // Recommended Services if (data.services && data.services.length) { html += '
推荐服务
更多 ›
'; html += renderServiceGrid(data.services); } // Technicians if (data.technicians && data.technicians.length) { html += '
金牌技师
'; html += '
'; const techIcons = ['👩‍⚕️','👩‍🔬','👩‍🏫','👩‍🍳']; data.technicians.forEach((t, i) => { html += `
${techIcons[i%techIcons.length]}
${t.name}
${t.title||''}
⭐ ${t.score||'5.0'}
`; }); html += '
'; } el.innerHTML = html; } function renderServiceGrid(services) { if (!services || !services.length) return '
暂无服务
'; let html = '
'; services.forEach(s => { html += `
`; html += `${s.title}`; html += `
${s.title}
`; html += `
${s.subtitle||''}
`; html += `
¥${s.price}`; if (s.original_price && s.original_price > s.price) html += `¥${s.original_price}`; html += `已售${s.sales||0}
`; }); html += '
'; return html; } // Category Page async function loadCategoryPage() { const el = document.querySelector('#pageCategory .page-content'); el.innerHTML = '
加载中...
'; const res = await get('/categories'); if (res.status !== 'ok' || !res.data.length) { el.innerHTML = '
📋
暂无分类
'; return; } const cats = res.data; let sidebar = '
'; cats.forEach((c, i) => { sidebar += ``; }); sidebar += '
'; el.innerHTML = `
${sidebar}
`; state.currentCatId = cats[0].id; loadCatServices(cats[0].id); } async function switchCat(catId) { state.currentCatId = catId; document.querySelectorAll('.cat-sidebar-item').forEach(b => b.classList.remove('active')); document.querySelector(`.cat-sidebar-item[data-cid="${catId}"]`).classList.add('active'); loadCatServices(catId); } async function loadCatServices(catId) { const el = document.getElementById('catMain'); el.innerHTML = '
加载中...
'; const res = await get(`/services?cat_id=${catId}`); if (res.status !== 'ok') { el.innerHTML = '
加载失败
'; return; } el.innerHTML = renderServiceGrid(res.data.items) || '
📋
该分类暂无服务
'; } // Service Detail async function goService(id) { document.getElementById('tabbar').style.display = 'none'; showPage('service'); showHeader('服务详情', true); const el = document.querySelector('#pageService .page-content'); el.innerHTML = '
加载中...
'; const res = await get(`/services/${id}`); if (res.status !== 'ok') { el.innerHTML = '
服务不存在
'; return; } const s = res.data; state.currentService = s; renderServiceDetail(s); } function renderServiceDetail(s) { const el = document.querySelector('#pageService .page-content'); let html = ``; html += '
'; html += `
${s.title}
`; html += `
${s.subtitle||''}
`; html += `
¥${s.price}`; if (s.original_price && s.original_price > s.price) html += `¥${s.original_price}`; html += `已售${s.sales||0}
`; html += '
'; html += '

服务介绍

' + (s.desc || s.detail || '暂无详细介绍') + '
'; html += '
'; html += `
合计 ¥${s.price}
`; el.innerHTML = html; } // Submit Order function goSubmit(serviceId) { if (!serviceId && state.currentService) serviceId = state.currentService.id; if (!serviceId) return; document.getElementById('tabbar').style.display = 'none'; showPage('submit'); showHeader('填写预约信息', true); const s = state.currentService; const el = document.querySelector('#pageSubmit .page-content'); el.innerHTML = `
${s.title}
¥${s.price}
联系人
联系电话
服务地址
期望服务时间
备注
`; } async function createOrder(serviceId) { const name = document.getElementById('orderName').value.trim(); const phone = document.getElementById('orderPhone').value.trim(); if (!name || !phone) { showToast('请填写联系人和电话'); return; } const res = await post('/order/create', { service_id: serviceId, contact_name: name, contact_phone: phone, address: document.getElementById('orderAddr').value.trim(), service_time: document.getElementById('orderTime').value, remark: document.getElementById('orderRemark').value.trim(), }); if (res.status === 'ok') { showToast('预约成功!'); setTimeout(() => { state.currentTab = 'order'; document.querySelectorAll('.tabbar-item').forEach(b => b.classList.remove('active')); document.querySelector('.tabbar-item[data-tab="order"]').classList.add('active'); document.getElementById('tabbar').style.display = 'flex'; showHeader('', false); showPage('order'); loadOrders(); }, 1000); } else { showToast(res.message || '提交失败'); } } // Orders async function loadOrders() { const el = document.querySelector('#pageOrder .page-content'); el.innerHTML = '
加载中...
'; const res = await get('/orders'); if (res.status !== 'ok') { el.innerHTML = '
📄
加载失败
'; return; } const orders = res.data; if (!orders.length) { el.innerHTML = '
📄
暂无订单
'; setTimeout(function(){var b=document.getElementById("goHomeBtn");if(b)b.onclick=function(){document.querySelector(".tabbar-item[data-tab=home]").click()}},0); return; } const statusMap = {'pending':'待确认','confirmed':'已确认','in_progress':'服务中','completed':'已完成','cancelled':'已取消'}; let html = '
'; orders.forEach(o => { html += '
'; html += `
${o.order_no}${statusMap[o.status]||o.status}
`; html += '
'; html += ``; html += '
'; html += `
${o.service_name}
`; html += `
¥${o.total}
`; html += '
'; html += ``; html += '
'; }); html += '
'; el.innerHTML = html; } // My Page function renderMy() { const el = document.querySelector('#pageMy .page-content'); const user = state.user; el.innerHTML = `
${user ? '👤' : '👤'}
${user ? user.nickname||'用户' : '未登录'}
${user ? user.phone||'' : '登录体验更多功能'}
📄我的订单
📍收货地址
我的收藏
💬联系客服
`; } // Category shortcut from home function goCategory(catId) { document.querySelectorAll('.tabbar-item').forEach(b => b.classList.remove('active')); document.querySelector('.tabbar-item[data-tab="category"]').classList.add('active'); state.currentTab = 'category'; showHeader('', false); showPage('category'); loadCategoryPage().then(() => { if (catId > 0) switchCat(catId); }); } // ─── Tab Click Handler ─── document.getElementById('tabbar').addEventListener('click', function(e) { var btn = e.target.closest('.tabbar-item'); if (!btn) return; var tab = btn.dataset.tab; document.querySelectorAll('.tabbar-item').forEach(function(b) { b.classList.remove('active'); }); btn.classList.add('active'); state.currentTab = tab; showHeader('', false); showPage(tab); if (tab === 'home' && !state.homeData) loadHome(); if (tab === 'category') loadCategoryPage(); if (tab === 'tech') loadTechPage(); if (tab === 'order') loadOrders(); if (tab === 'my') renderMy(); }); // ─── Technician Page ─── var currentTechType = ''; async function loadTechPage(type) { currentTechType = type || ''; showHeader('选择技师', false); document.getElementById('tabbar').style.display = 'flex'; var el = document.querySelector('#pageTech .page-content'); el.innerHTML = '
加载中...
'; var typesRes = await get('/tech_types'); var types = typesRes.status === 'ok' ? typesRes.data : []; var techsRes = await get('/technicians?tech_type=' + encodeURIComponent(currentTechType)); var techs = techsRes.status === 'ok' ? techsRes.data : []; var html = '
'; html += '全部'; types.forEach(function(t) { html += '' + t + ''; }); html += '
'; if (!techs.length) { html += '
👩‍⚕️
暂无技师
'; } else { html += '
'; var colors = ['#E94560','#26A69A','#5C6BC0','#FF8A65','#AB47BC','#66BB6A','#FF7043','#42A5F5']; techs.forEach(function(t, i) { var c = colors[i % colors.length]; html += '
'; html += '
' + (t.name ? t.name.charAt(0) : '?') + '
'; html += '
'; html += '
' + t.name + '' + (t.tech_type||'') + '
'; html += '
' + (t.title||'') + '
'; html += '
⭐ ' + (t.score||'5.0') + '已服务 ' + (t.order_count||0) + ' 人
'; html += '
'; html += ''; html += '
'; }); html += '
'; } el.innerHTML = html; } window.loadTechTag = function(type) { loadTechPage(type); }; // ─── Initialize ─── document.addEventListener('DOMContentLoaded', function() { loadHome().catch(function(e) { console.error('Home load error:', e); }); renderMy(); });