view.html
3.13 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<style type="text/css">
.ibox {background: #1ab394;}
</style>
<body class="gray-bg">
<div class="container-div">
<div class="row">
<div class="tabs-container">
<ul class="nav nav-tabs" style="padding-top:10px" >
<li th:each="date, stat:${localDateList}" class="" th:classappend="${stat.index == 0} ? 'active' : '' ">
<a data-toggle="tab" th:id="'tab0-'+${stat.index}" th:href="'tab-'+${stat.index}" aria-expanded="true" th:text="${date}"></a></li>
</ul>
</div>
<div class="tab-content" style="margin-top: 30px;overflow: hidden">
<div id="tab1-0" class="tab-pane active"></div>
<div id="tab1-1" class="tab-pane"></div>
<div id="tab1-2" class="tab-pane"></div>
<div id="tab1-3" class="tab-pane"></div>
<div id="tab1-4" class="tab-pane"></div>
<div id="tab1-5" class="tab-pane"></div>
<div id="tab1-6" class="tab-pane"></div>
</div>
</div>
</div>
</div>
<div th:include="include :: footer"></div>
<script th:inline="javascript">
let prefix = ctx+"reservation";
$(function () {
load();
})
function load(date, index) {
if ($.common.isEmpty(date)) {
date = $("#tab0-0").text();
}
if ($.common.isEmpty(index)) {
index = 0;
}
let option = {
url: prefix+"/reservation",
type: 'get',
dataType: "json",
data: {
localDate: date,
warehouseCode: [[${warehouseCode}]]
},
success: function (result) {
$("#tab1-"+index).empty();
for (let i=0; result.data.length;i++) {
let html = "<div class=\"col-sm-2\"><div class=\"ibox\"><a onclick='add(\""+result.data[i].beginTime+"\",\""+result.data[i].endTime+"\")'> <div class=\"ibox-content2";
if (!result.data[i].flag) {
html += " disable-order\">";
} else {
html += "\">\n"
}
html += "<p>"+result.data[i].beginTime+"-"+result.data[i].endTime+"</p>\n" +
"预约到达时间<div><span>当前已预约人数：</span><div class=\"stat-percent\">"+result.data[i].number+"/"+result.data[i].reservationsNumber+"</div>\n" +
"</div></div></a></div></div>";
$("#tab1-"+index).append(html);
}
}
}
$.ajax(option);
}
function add(date1, date2) {
let url = prefix+"/add/"+[[${warehouseCode}]]+"/"+date+"/"+date1+"/"+date2;
$.modal.open("预约", url);
}
$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
e.target // newly activated tab
e.relatedTarget // previous active tab
let date = e.target.innerText;
load(date);
})
</script>
</body>
</html>