r102/app.js · 约 25273 字符
1/* ===== 小草二手车平台 H5 · 应用逻辑 ===== */2(function ($) {3 'use strict';45 var ROUTES = ['home', 'list', 'detail', 'book', 'sell', 'orders', 'me', 'finance', 'message', 'store'];6 var CUR = 'home';7 var LIST_FILTER = { brand: '全部', price: '全部', sort: '综合' };8 var ORD_TAB = '看车预约';910 // ---- 车源数据 ----11 var CARS = [12 { id:'c1', brand:'大众', emoji:'🚗', model:'朗逸 2019款 1.5L 自动风尚版', year:2019, mile:'3.2', price:'6.88', city:'西安',13 g1:'#2B5CFF', g2:'#7AA0FF', spec:'1.5L / 自动 / 汽油', tags:['准新一手','4S店保养','无重大事故'] },14 { id:'c2', brand:'丰田', emoji:'🚙', model:'卡罗拉 2020款 双擎 精英版', year:2020, mile:'2.1', price:'9.98', city:'西安',15 g1:'#16A34A', g2:'#86EFAC', spec:'1.8L混动 / 自动', tags:['混动省油','个人一手','质保1年'] },16 { id:'c3', brand:'本田', emoji:'🚐', model:'CR-V 2018款 240TURBO 两驱', year:2018, mile:'5.6', price:'11.50', city:'咸阳',17 g1:'#F97316', g2:'#FDBA74', spec:'1.5T / 自动 / SUV', tags:['空间大','准新','天窗'] },18 { id:'c4', brand:'宝马', emoji:'🏎️', model:'3系 2021款 320Li M运动', year:2021, mile:'1.8', price:'21.80', city:'西安',19 g1:'#1E3A8A', g2:'#60A5FA', spec:'2.0T / 自动 / 后驱', tags:['豪华品牌','准新一手','4S店'] },20 { id:'c5', brand:'比亚迪', emoji:'🔋', model:'秦PLUS DM-i 2022款 55KM', year:2022, mile:'1.2', price:'8.68', city:'西安',21 g1:'#0EA5E9', g2:'#7DD3FC', spec:'1.5L插混 / 自动', tags:['插混','绿牌','低油耗'] },22 { id:'c6', brand:'奔驰', emoji:'🚘', model:'C级 2020款 C200L 动感', year:2020, mile:'3.0', price:'19.80', city:'西安',23 g1:'#334155', g2:'#94A3B8', spec:'1.5T / 自动', tags:['豪华','一手','质保'] },24 { id:'c7', brand:'奥迪', emoji:'🚗', model:'A4L 2019款 40 TFSI 时尚', year:2019, mile:'4.5', price:'15.30', city:'宝鸡',25 g1:'#475569', g2:'#CBD5E1', spec:'2.0T / 自动 / 四驱', tags:['德系','四驱','准新'] },26 { id:'c8', brand:'特斯拉', emoji:'⚡', model:'Model 3 2021款 标准续航', year:2021, mile:'2.0', price:'17.50', city:'西安',27 g1:'#0F172A', g2:'#64748B', spec:'纯电 / 自动', tags:['纯电','准新','超充'] }28 ];29 function carById(id) { return CARS.filter(function (c) { return c.id === id; })[0] || CARS[0]; }3031 // ---- 我的预约/订单 ----32 var ORDERS = {33 '看车预约': [34 ['🚗', '预约看车 · 宝马3系 320Li', '周六 14:00 · 小草高新店', '07-29', '待看车', ''],35 ['🚙', '预约看车 · 丰田卡罗拉', '周日 10:30 · 小草雁塔店', '07-27', '已看车', '']36 ],37 '已付定金': [38 ['🚘', '大众朗逸 2019款 已付定金', '定金 ¥2000 · 待过户', '07-26', '交易中', '¥6.88万']39 ],40 '已完成': [41 ['🚐', '本田CR-V 2018款 已完成', '已过户 · 好评 ⭐⭐⭐⭐⭐', '07-20', '已完成', '¥11.50万']42 ],43 '已取消': [44 ['🚗', '预约看车 · 奥迪A4L', '时间冲突已取消', '07-15', '已取消', '']45 ]46 };4748 var MSG = {49 '交易动态': [50 ['🚗', '看车提醒', '您预约的宝马3系 周六 14:00 高新店', '07-29'],51 ['💰', '定金支付成功', '大众朗逸 定金 ¥2000 已到账', '07-26']52 ],53 '平台通知': [54 ['📢', '夏日购车主会场开启', '7月全场最高直降 1.5 万,含质保', '07-28'],55 ['🎉', '新用户专享补贴', '完成首单送 1 年延保', '07-25']56 ],57 '活动推送': [58 ['🔥', '0 首付开新车', '多款车型支持 0 首付分期', '07-24'],59 ['🏆', '免费估价有礼', '估价即送车载空气净化器', '07-22']60 ]61 };6263 // ---- 小工具 ----64 function go(h) { location.hash = h; }65 window.go = go;66 function goAttr(h) { return 'onclick="go(\'' + h + '\')"'; }67 function alertAttr(t) { return 'onclick="alert(\'' + t + '\')"'; }68 function chipTap(el) { $(el).siblings().removeClass('on'); $(el).addClass('on'); }6970 // ---- 顶部栏 ----71 function homeTop() {72 return '<div class="topbar home">'73 + '<div class="loc" ' + goAttr('store') + '>西安<span class="arr">▾</span></div>'74 + '<div class="search" ' + goAttr('list') + '>🔍 搜索品牌 / 车型 / 车系</div>'75 + '<div class="bell" ' + goAttr('message') + '>🔔</div>'76 + '</div>';77 }78 function innTop(title, back) {79 back = back || 'home';80 return '<div class="topbar">'81 + '<div class="back" ' + goAttr(back) + '>‹</div>'82 + '<div class="ttl">' + title + '</div>'83 + '<div class="right"></div>'84 + '</div>';85 }86 function tabbar(active) {87 var items = [['home','🏠','首页'],['list','🚗','车源'],['orders','📋','预约'],['me','👤','我的']];88 var h = '<div class="tabbar">';89 items.forEach(function (it) {90 var on = (it[0] === active) ? ' on' : '';91 h += '<div class="tb' + on + '" ' + goAttr(it[0]) + '><div class="ic">' + it[1] + '</div><div class="lb">' + it[2] + '</div></div>';92 });93 h += '</div>';94 return h;95 }9697 // ---- 首页 ----98 function banner() {99 return '<div class="banner">'100 + '<h3>夏日购车节 · 直降 1.5 万</h3>'101 + '<p>小草二手车 · 259 项检测 · 1 年质保</p>'102 + '<span class="tag">点击领取购车补贴</span>'103 + '</div>';104 }105 function grid() {106 var items = [107 ['🚗','我要买车','list'],['💰','我要卖车','sell'],['📊','免费估价','sell'],108 ['🏦','分期金融','finance'],['🏬','门店地址','store'],['🛡️','质保服务','store'],109 ['📑','车险报价','finance'],['❓','帮助中心','message']110 ];111 var h = '<div class="grid">';112 items.forEach(function (it) {113 h += '<div class="it" ' + goAttr(it[2]) + '><div class="ic">'+it[0]+'</div><div class="lb">'+it[1]+'</div></div>';114 });115 return h + '</div>';116 }117 function brands() {118 var bs = [['大众','🚗'],['丰田','🚙'],['本田','🚐'],['宝马','🏎️'],['奔驰','🚘'],['奥迪','🚗'],['比亚迪','🔋'],['特斯拉','⚡']];119 var h = '<div class="sec-h" style="margin-top:14px"><div class="t">热门品牌</div><div class="more" ' + goAttr('list') + '>全部 ›</div></div><div class="brands">';120 bs.forEach(function (b) {121 h += '<div class="b" ' + goAttr('list') + '><div class="lo">'+b[1]+'</div><div class="nm">'+b[0]+'</div></div>';122 });123 return h + '</div>';124 }125 function carCard(c) {126 var t = c.tags.map(function (x) { return '<span>'+x+'</span>'; }).join('');127 return '<div class="carcard" ' + goAttr('detail?id='+c.id) + '>'128 + '<div class="carimg" style="background:linear-gradient(135deg,'+c.g1+','+c.g2+')"><span class="yr">'+c.year+'</span>'+c.emoji+'</div>'129 + '<div class="carinfo"><div class="nm">'+c.model+'</div>'130 + '<div class="meta">'+c.mile+'万km · '+c.spec+'</div>'131 + '<div class="tags">'+t+'</div>'132 + '<div class="bot"><div class="price"><i>¥</i>'+c.price+'<i>万</i></div><div class="city">'+c.city+'</div></div>'133 + '</div></div>';134 }135 function featured() {136 var h = '<div class="sec-h" style="margin-top:14px"><div class="t">精选好车</div><div class="more" ' + goAttr('list') + '>更多 ›</div></div><div class="cars">';137 CARS.slice(0,3).forEach(function (c) { h += carCard(c); });138 return h + '</div>';139 }140 function guess() {141 var h = '<div class="sec-h" style="margin-top:14px"><div class="t">猜你喜欢</div></div><div class="cars">';142 CARS.slice(3).forEach(function (c) { h += carCard(c); });143 return h + '</div>';144 }145 function homeBody() { return banner() + grid() + brands() + featured() + guess(); }146147 // ---- 车源列表 ----148 function listBody() {149 var brands = ['全部','大众','丰田','本田','宝马','奔驰','奥迪','比亚迪','特斯拉'];150 var prices = ['全部','5万以下','5-10万','10-15万','15-20万','20万以上'];151 var sorts = ['综合','价格低','价格高','车龄新'];152 function chipsRow(keys, cur, kind) {153 var h = '<div class="chips" style="margin:8px 14px 0">';154 keys.forEach(function (k) {155 h += '<div class="chip'+(k===cur?' on':'')+'" onclick="setFilter(\''+kind+'\',\''+k+'\')">'+k+'</div>';156 });157 return h + '</div>';158 }159 var arr = filterCars();160 var list = arr.length ? arr.map(carCard).join('') : '<div class="empty">没有符合条件的车源</div>';161 return '<div style="background:#fff;padding-top:12px">'162 + '<div class="sec-h" style="margin:0 14px"><div class="t">车源筛选</div><div class="more">共 '+arr.length+' 辆</div></div>'163 + chipsRow(brands, LIST_FILTER.brand, 'brand')164 + '<div style="height:8px"></div>' + chipsRow(prices, LIST_FILTER.price, 'price')165 + '<div style="height:8px"></div>' + chipsRow(sorts, LIST_FILTER.sort, 'sort')166 + '</div><div class="cars" style="padding:0 14px">' + list + '</div>';167 }168 function filterCars() {169 var arr = CARS.slice();170 if (LIST_FILTER.brand !== '全部') arr = arr.filter(function (c) { return c.brand === LIST_FILTER.brand; });171 if (LIST_FILTER.price !== '全部') {172 arr = arr.filter(function (c) {173 var p = parseFloat(c.price);174 if (LIST_FILTER.price === '5万以下') return p < 5;175 if (LIST_FILTER.price === '5-10万') return p >= 5 && p < 10;176 if (LIST_FILTER.price === '10-15万') return p >= 10 && p < 15;177 if (LIST_FILTER.price === '15-20万') return p >= 15 && p < 20;178 if (LIST_FILTER.price === '20万以上') return p >= 20;179 return true;180 });181 }182 if (LIST_FILTER.sort === '价格低') arr.sort(function (a,b){return parseFloat(a.price)-parseFloat(b.price);});183 else if (LIST_FILTER.sort === '价格高') arr.sort(function (a,b){return parseFloat(b.price)-parseFloat(a.price);});184 else if (LIST_FILTER.sort === '车龄新') arr.sort(function (a,b){return b.year-a.year;});185 return arr;186 }187 window.setFilter = function (kind, val) {188 LIST_FILTER[kind] = val;189 render();190 };191192 // ---- 车辆详情 ----193 function detailBody(q) {194 var c = carById((q && q.id) || 'c1');195 var steps = ['看车预约','到店看车','支付定金','过户提车'];196 var h = '<div class="detail-img" style="background:linear-gradient(135deg,'+c.g1+','+c.g2+')">'+c.emoji197 + '<div class="price-tag"><span>'+c.brand+' · '+c.year+'年</span><b>¥'+c.price+'</b><i>万</i></div>'198 + '<div class="dot">1 / 6</div></div>';199 h += '<div style="margin:0 14px">';200 h += '<div class="card" style="margin-top:-12px;position:relative">'201 + '<div style="font-size:17px;font-weight:800">'+c.model+'</div>'202 + '<div style="font-size:12px;color:#9aa0ac;margin-top:4px">'+c.city+' · 上牌 '+c.year+' 年 · '+c.mile+' 万km</div>'203 + '<div class="tags" style="margin-top:8px">'+c.tags.map(function(x){return '<span>'+x+'</span>';}).join('')+'</div>'204 + '</div>';205 h += '<div class="detail-specs">'206 + '<div class="s"><b>'+c.year+'</b><span>上牌年份</span></div>'207 + '<div class="s"><b>'+c.mile+'万</b><span>表显里程</span></div>'208 + '<div class="s"><b>国六</b><span>排放标准</span></div>'209 + '<div class="s"><b>自动</b><span>变速箱</span></div>'210 + '<div class="s"><b>'+c.spec.split('/')[0].trim()+'</b><span>排量/动力</span></div>'211 + '<div class="s"><b>良好</b><span>车况评级</span></div>'212 + '</div>';213 h += '<div class="card"><div class="sec-h" style="margin:0"><div class="t" style="font-size:15px">购车流程</div></div><div class="steps">';214 steps.forEach(function (s, idx) {215 h += '<div class="s'+(idx<2?' on':'')+'"><div class="dot">'+(idx<2?'✓':(idx+1))+'</div><div class="lb">'+s+'</div></div>';216 });217 h += '</div></div>';218 h += '<div class="card"><div class="sec-h" style="margin:0"><div class="t" style="font-size:15px">车辆描述</div></div>'219 + '<div class="detail-desc">本车为 <b>'+c.brand+' '+c.model+'</b>,整体车况优秀,<b>无重大事故、无泡水、无火烧</b>,4S 店全程保养记录可查。内饰整洁、轮胎磨损正常,三大件工况良好,支持第三方检测与试驾。购车即享 <b>259 项检测报告 + 1 年或 2 万公里质保</b>。</div></div>';220 h += '<div class="card seller"><div class="av">🧑💼</div><div><div class="nm">小草严选顾问 · 李经理</div><div class="meta">从业 8 年 · 已服务 1200+ 客户</div></div><div class="go" ' + alertAttr('已为您接通顾问') + '>咨询</div></div>';221 h += '</div>';222 h += '<div class="btn" ' + goAttr('book?id='+c.id) + '>预约看车</div>';223 h += '<div class="btn orange" ' + alertAttr('已加入收藏') + '>收藏车辆</div>';224 return h;225 }226227 // ---- 预约看车 ----228 function bookBody(q) {229 var c = carById((q && q.id) || 'c1');230 return '<div class="card" style="margin:12px 14px 0;display:flex;gap:12px">'231 + '<div class="carimg" style="width:72px;height:56px;font-size:26px;background:linear-gradient(135deg,'+c.g1+','+c.g2+')">'+c.emoji+'</div>'232 + '<div><div style="font-weight:700;font-size:15px">'+c.model+'</div><div style="font-size:12px;color:#9aa0ac;margin-top:3px">¥'+c.price+'万 · '+c.city+'</div></div></div>'233 + '<div class="frm">'234 + fld('姓名', 'text', '请输入您的称呼')235 + fld('手机号', 'tel', '请输入 11 位手机号')236 + '<div class="fld"><label>期望时间</label><select><option>本周六 上午</option><option>本周六 下午</option><option>本周日 上午</option><option>本周日 下午</option><option>工作日 晚</option></select></div>'237 + '<div class="fld"><label>就近门店</label><select><option>小草高新店(科技路)</option><option>小草雁塔店(小寨)</option><option>小草未央店(凤城)</option></select></div>'238 + fld('备注', 'text', '如:想试驾、看车况细节')239 + '</div>'240 + '<div class="card" style="margin:12px 14px 0;font-size:13px;color:#8a8f9c;line-height:1.7">🛡️ 预约免费,到店由顾问陪同验车,全程透明、无强制消费。提交后顾问将在 30 分钟内电话联系您。</div>'241 + '<div class="btn" ' + alertAttr('预约提交成功,顾问将尽快联系您') + '>提交预约</div>';242 }243244 // ---- 卖车估价 ----245 function sellBody() {246 return '<div class="frm">'247 + fld('品牌车型', 'text', '如:大众 朗逸')248 + '<div class="fld"><label>上牌年份</label><select id="sy"><option>2019</option><option>2020</option><option>2021</option><option>2022</option><option>2018</option><option>2017</option></select></div>'249 + fld('表显里程', 'text', '如:3.2(单位万km)')250 + '<div class="fld"><label>所在城市</label><select><option>西安</option><option>咸阳</option><option>宝鸡</option><option>其他</option></select></div>'251 + '<div class="fld"><label>车况亮点</label><div class="chips" id="hl"><div class="chip" onclick="chipTap(this)">无事故</div><div class="chip" onclick="chipTap(this)">4S保养</div><div class="chip" onclick="chipTap(this)">一手车</div><div class="chip" onclick="chipTap(this)">原版原漆</div></div></div>'252 + '</div>'253 + '<div class="btn" onclick="doValuation()">免费估价</div>'254 + '<div id="valout"></div>';255 }256 window.doValuation = function () {257 var sy = parseInt($('#sy').val(), 10) || 2019;258 var mile = parseFloat($('#hl').closest('.frm').find('input[placeholder*="里程"]').val()) || 4;259 // 演示估价:基准价按年份与里程折旧260 var base = 12;261 var age = 2026 - sy;262 var price = base * Math.pow(0.86, age) - mile * 0.25;263 if (price < 1) price = 1.2;264 var low = (price * 0.92).toFixed(1);265 var high = (price * 1.08).toFixed(1);266 var h = '<div class="result"><div class="lab">根据您的信息,预估回收价</div>'267 + '<div class="rng"><i>¥</i>'+low+' - '+high+'<i> 万</i></div>'268 + '<div class="note">估价为系统参考价,最终以到店 259 项检测为准。提交信息即送 <b>免费上门验车 + 车载空气净化器</b>,成交再享 1 年延保。</div></div>'269 + '<div class="btn orange" onclick="alert(\'已提交,评估师将联系您\')">预约上门收车</div>';270 $('#valout').html(h);271 window.scrollTo(0, document.body.scrollHeight);272 };273274 // ---- 我的预约/订单 ----275 function ordList(tab) {276 var arr = ORDERS[tab] || [];277 if (!arr.length) return '<div class="empty">暂无'+tab+'记录</div>';278 var h = '';279 arr.forEach(function (o) {280 h += '<div class="ord" ' + goAttr('detail?id=c1') + '>'281 + '<div class="oic">'+o[0]+'</div>'282 + '<div class="mid"><div class="ti">'+o[1]+'</div><div class="ln">'+o[2]+'</div><div class="tm">'+o[3]+'</div></div>'283 + '<div class="rt"><div class="st">'+o[4]+'</div>'+(o[5]?'<div class="amt">'+o[5]+'</div>':'')+'</div>'284 + '</div>';285 });286 return h;287 }288 function ordersBody() {289 var keys = ['看车预约','已付定金','已完成','已取消'];290 var t = '<div class="tabs" id="otabs">';291 keys.forEach(function (k) { t += '<div class="tb'+(k===ORD_TAB?' on':'')+'" data-k="'+k+'">'+k+'</div>'; });292 t += '</div><div id="olist">' + ordList(ORD_TAB) + '</div>';293 return t;294 }295 function bindOrders() {296 $('#otabs .tb').off('click').on('click', function () {297 ORD_TAB = $(this).data('k');298 $('#otabs .tb').removeClass('on'); $(this).addClass('on');299 $('#olist').html(ordList(ORD_TAB));300 });301 }302303 // ---- 我的 ----304 function mg(ic, lb, to) { return '<div class="it" ' + goAttr(to) + '><div class="ic">'+ic+'</div><div class="lb">'+lb+'</div></div>'; }305 function meBody() {306 var h = '<div class="me-h"><div class="av">🧑</div><div><div class="nm">小草车友</div><div class="vip">👑 认证会员</div></div></div>';307 h += '<div class="me-grid">'308 + mg('🚗','我的爱车','list') + mg('⭐','我的收藏','list') + mg('📋','预约记录','orders') + mg('💰','我的订单','orders')309 + mg('🏦','金融服务','finance') + mg('🏬','门店地址','store') + mg('🔔','消息中心','message') + mg('⚙️','设置','me')310 + '</div>';311 h += '<div class="invite"><div class="em">🎁</div><div class="tx"><b>推荐卖车赚佣金</b><span>每成功成交 1 台,返现最高 ¥888</span></div><div class="btn2" ' + alertAttr('已复制专属海报') + '>立即推广</div></div>';312 return h;313 }314315 // ---- 分期金融 ----316 function financeBody() {317 var calc = '<div class="calc" id="fcalc">'318 + '<div class="row"><span>车辆总价(万)</span><span class="v" id="cPrice">12.0</span></div>'319 + '<div class="fld" style="padding:6px 0"><label>裸车价</label><input id="price" type="number" value="12" step="0.1" oninput="calcFinance()"></div>'320 + '<div class="fld" style="padding:6px 0"><label>首付比例</label><input id="down" type="number" value="30" step="5" oninput="calcFinance()"><span style="width:18px">%</span></div>'321 + '<div class="fld" style="padding:6px 0"><label>分期期数</label><select id="term" onchange="calcFinance()"><option>12</option><option>24</option><option selected>36</option><option>48</option></select><span style="width:18px">期</span></div>'322 + '<div class="out" id="fout"></div>'323 + '</div>';324 var prods = '<div class="fin">'325 + '<div class="f a"><h4>0 首付方案</h4><span>新人专享 · 先开后付</span></div>'326 + '<div class="f b"><h4>低息分期</h4><span>年化 3.8% 起 · 最长 48 期</span></div>'327 + '</div>';328 var h = calc + '<div class="sec-h" style="margin-top:14px"><div class="t">金融产品</div></div>' + prods329 + '<div class="card" style="margin-top:12px;font-size:13px;color:#8a8f9c;line-height:1.7">📄 申请需提供身份证、驾驶证及收入证明,最快 1 小时审批放款。本平台不收取任何金融服务费。</div>';330 return h;331 }332 window.calcFinance = function () {333 var p = parseFloat($('#price').val()) || 0;334 var dp = (parseFloat($('#down').val()) || 0) / 100;335 var term = parseInt($('#term').val(), 10) || 36;336 var loan = p * (1 - dp);337 var rate = 0.038 / 12;338 var monthly = loan * rate * Math.pow(1 + rate, term) / (Math.pow(1 + rate, term) - 1);339 var downPay = p * dp;340 $('#cPrice').text(p.toFixed(1));341 $('#fout').html(342 '<div class="o"><b>'+downPay.toFixed(2)+'万</b><span>首付</span></div>'343 + '<div class="o"><b>'+monthly.toFixed(2)+'万</b><span>月供('+term+'期)</span></div>'344 + '<div class="o"><b>'+loan.toFixed(2)+'万</b><span>贷款金额</span></div>'345 );346 };347 function bindFinance() { if ($('#fout').length) calcFinance(); }348349 // ---- 消息中心 ----350 function msgList(arr) {351 var h = '';352 arr.forEach(function (m) {353 var cls = m[0] === '📢' ? 'a' : (m[0] === '🚗' || m[0] === '💰' ? 'b' : 'c');354 h += '<div class="msg"><div class="mic '+cls+'">'+m[0]+'</div><div class="mid"><div class="ti">'+m[1]+'<span class="tm">'+m[3]+'</span></div><div class="sn">'+m[2]+'</div></div></div>';355 });356 return h;357 }358 function messageBody() {359 var keys = ['交易动态','平台通知','活动推送'];360 var t = '<div class="tabs" id="mtabs">';361 keys.forEach(function (k, i) { t += '<div class="tb'+(i===0?' on':'')+'" data-k="'+k+'">'+k+'</div>'; });362 t += '</div><div id="mlist">' + msgList(MSG[keys[0]]) + '</div>';363 return t;364 }365 function bindMessage() {366 $('#mtabs .tb').off('click').on('click', function () {367 $('#mtabs .tb').removeClass('on'); $(this).addClass('on');368 var k = $(this).data('k');369 $('#mlist').html(msgList(MSG[k]));370 });371 }372373 // ---- 门店/关于 ----374 function storeBody() {375 var stores = [376 ['🏬','小草高新店','科技路 18 号 高新万达 2 号楼 · 09:00-20:00'],377 ['🏬','小草雁塔店','小寨西路 26 号 赛格国际 8F · 09:30-21:00'],378 ['🏬','小草未央店','凤城二路 9 号 经发大厦 1F · 09:00-20:00']379 ];380 var h = '<div class="sec-h" style="margin-top:14px"><div class="t">门店地址</div><div class="more" ' + alertAttr('已为您导航') + '>导航 ›</div></div>';381 stores.forEach(function (s) {382 h += '<div class="store"><div class="lo">'+s[0]+'</div><div class="mid"><div class="nm">'+s[1]+'</div><div class="ln">'+s[2]+'</div></div><div class="op" ' + alertAttr('已致电门店') + '>电话</div></div>';383 });384 h += '<div class="sec-h" style="margin-top:14px"><div class="t">关于小草二手车</div></div>';385 h += '<div class="card about"><b>小草二手车平台</b> 是西安本地一站式二手车交易服务平台,提供'386 + '<b>免费估价、严选车源、到店验车、分期金融、质保延保</b> 全流程服务。'387 + '所有车辆均经过 <b>259 项专业检测</b>,杜绝重大事故、泡水、火烧车辆,'388 + '让每一位用户都能「放心买好车」。平台已服务超过 <b>10 万+</b> 车主,好评率 98.6%。</div>';389 return h;390 }391392 // ---- 表单通用 ----393 function fld(label, type, ph) {394 return '<div class="fld"><label>'+label+'</label><input type="'+type+'" placeholder="'+ph+'"></div>';395 }396397 // ---- 页面表 ----398 var PAGES = {399 home: function () { return { top: homeTop(), body: homeBody(), tab: true }; },400 list: function () { return { top: innTop('车源列表'), body: listBody() }; },401 detail: function (q) { return { top: innTop('车辆详情'), body: detailBody(q) }; },402 book: function (q) { return { top: innTop('预约看车'), body: bookBody(q) }; },403 sell: function () { return { top: innTop('卖车估价'), body: sellBody() }; },404 orders: function () { return { top: innTop('我的预约'), body: ordersBody(), bind: bindOrders, tab: true }; },405 me: function () { return { top: innTop('个人中心'), body: meBody(), tab: true }; },406 finance: function () { return { top: innTop('分期金融'), body: financeBody(), bind: bindFinance }; },407 message: function () { return { top: innTop('消息中心'), body: messageBody(), bind: bindMessage, tab: true }; },408 store: function () { return { top: innTop('门店 / 关于'), body: storeBody() }; }409 };410411 // ---- 路由 ----412 function parseHash() {413 var h = location.hash.replace(/^#/, '');414 if (!h) h = 'home';415 var q = {};416 var qi = h.indexOf('?');417 if (qi >= 0) {418 var qs = h.substr(qi + 1); h = h.substr(0, qi);419 qs.split('&').forEach(function (p) {420 var kv = p.split('=');421 q[decodeURIComponent(kv[0])] = decodeURIComponent(kv[1] || '');422 });423 }424 return { name: h, q: q };425 }426 function render() {427 var p = parseHash();428 var name = ROUTES.indexOf(p.name) >= 0 ? p.name : 'home';429 CUR = name;430 var v = PAGES[name](p.q);431 var html = (v.top || '') + '<div class="page">' + (v.body || '') + '</div>' + (v.tab ? tabbar(name) : '');432 $('#app').html(html);433 if (v.bind) v.bind();434 $('.page').scrollTop(0);435 }436437 $(window).on('hashchange', render);438 $(function () { render(); });439})(jQuery);440