<!DOCTYPE html>
|
<html lang="zh-CN">
|
<head>
|
<meta charset="utf-8"/>
|
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1"/>
|
<title>预约</title>
|
<link rel="stylesheet" href="css.css"/>
|
</head>
|
<body>
|
<div class="wrap">
|
<div class="page-head">
|
<h1>预约订单</h1>
|
<a class="back-link" href="home.html">返回工作台</a>
|
</div>
|
<div class="card">
|
<input id="kw" placeholder="姓名/电话/预约号"/>
|
<button class="btn ghost" onclick="search()">查询</button>
|
<div id="searchList"></div>
|
</div>
|
<div class="card">
|
<div class="sec-title">新增预约(待领取)</div>
|
<div id="newList" class="muted">加载中…</div>
|
</div>
|
<div class="card">
|
<div class="sec-title">我的未完成预约</div>
|
<div id="mineList" class="muted">加载中…</div>
|
</div>
|
</div>
|
<script src="app.js"></script>
|
<script>
|
function rowHtml(a, action) {
|
return "<div class='item'><b>" + (a.contactName || "") + "</b> " + (a.contactPhone || "") +
|
"<div class='muted'>" + (a.appointmentNo || "") + " · " + (a.status || "") + "</div>" +
|
"<div class='muted'>" + (a.address || "") + "</div>" +
|
"<div class='muted'>" + (a.appointmentDate || "") + " " + (a.appointmentSlot || "") + "</div>" +
|
action + "</div>";
|
}
|
function renderList(el, list, empty, btnText, fn) {
|
if (!list.length) { $(el).innerHTML = "<div class='muted'>" + empty + "</div>"; return; }
|
$(el).innerHTML = list.map(function (a) {
|
var action = btnText ? "<button class='btn sm' onclick='" + fn + "(" + a.id + ")'>" + btnText + "</button>" : "";
|
return rowHtml(a, action);
|
}).join("");
|
}
|
function loadNew() {
|
api("/app/shop/sorter/appointmentPage", { page: 1, size: 50, pool: "new" }).then(function (res) {
|
renderList("newList", (res && res.list) || [], "暂无新增预约", "领取到我名下", "claimApt");
|
}).catch(function (e) { $("newList").innerHTML = "<div class='err'>" + (e.message || "加载失败") + "</div>"; });
|
}
|
function loadMine() {
|
api("/app/shop/sorter/appointmentPage", { page: 1, size: 50, pool: "mine" }).then(function (res) {
|
renderList("mineList", (res && res.list) || [], "暂无未完成预约", "", "");
|
}).catch(function (e) { $("mineList").innerHTML = "<div class='err'>" + (e.message || "加载失败") + "</div>"; });
|
}
|
function search() {
|
api("/app/shop/sorter/appointmentPage", { page: 1, size: 50, keyWord: $("kw").value }).then(function (res) {
|
var list = (res && res.list) || [];
|
if (!list.length) { $("searchList").innerHTML = "<div class='muted'>没有匹配结果</div>"; return; }
|
$("searchList").innerHTML = list.map(function (a) { return rowHtml(a, ""); }).join("");
|
}).catch(function (e) { toast(e.message); });
|
}
|
function claimApt(id) {
|
api("/app/shop/sorter/claimAppointment", { id: id }).then(function () {
|
toast("已领取");
|
loadNew();
|
loadMine();
|
}).catch(function (e) { toast(e.message); });
|
}
|
loadNew();
|
loadMine();
|
</script>
|
</body>
|
</html>
|