Skip to content

任超 / js.portalStaticPage

Go to a project
Toggle navigation
Toggle navigation pinning
2e86acd6 by 焦小希
Options

在线预约数据渲染

1 parent e9f6566e
Inline Side-by-side
Showing 2 changed files with 152 additions and 123 deletions
...@@ -382,6 +382,7 @@ ...@@ -382,6 +382,7 @@
382 } */ 382 } */
383 .isAppoint { 383 .isAppoint {
384 cursor:not-allowed!important; 384 cursor:not-allowed!important;
385 background-color: #ccc;
385 } 386 }
386 .business_item ul li h3 { 387 .business_item ul li h3 {
387 margin-bottom: 5px; 388 margin-bottom: 5px;
......
1 <!DOCTYPE html 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <html xmlns="http://www.w3.org/1999/xhtml">
4 <head> 3 <head>
5 <style> 4 <style></style>
6 </style>
7 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
8 <title>我的预约-预约时间</title> 6 <title>我的预约-预约时间</title>
9 <script type="text/javascript" src="../staticJs/head.js"></script> 7 <script type="text/javascript" src="../staticJs/head.js"></script>
10 <link rel="stylesheet" href="../staticCss/swiper-bundle.min.css"> 8 <link rel="stylesheet" href="../staticCss/swiper-bundle.min.css" />
11 <link rel="stylesheet" type="text/css" href="../staticCss/progressBar.css"> 9 <link
12 <link rel="stylesheet" type="text/css" href="../staticCss/yysj.css"> 10 rel="stylesheet"
13 <link rel="stylesheet" type="text/css" href="../staticCss/layuiDialog.css"> 11 type="text/css"
14 </head> 12 href="../staticCss/progressBar.css"
13 />
14 <link rel="stylesheet" type="text/css" href="../staticCss/yysj.css" />
15 <link
16 rel="stylesheet"
17 type="text/css"
18 href="../staticCss/layuiDialog.css"
19 />
20 </head>
15 21
16 22 <body>
17 <body>
18 <div class="yysj_main"> 23 <div class="yysj_main">
19 <div class="navigation_crumbs"> 24 <div class="navigation_crumbs">
20 <div class="contentBox"> 25 <div class="contentBox">
21 <span class="layui-breadcrumb"> 26 <span class="layui-breadcrumb">
22 <a href="../index.html" title="首页">首页</a> 27 <a href="../index.html" title="首页">首页</a>
23 <a href="./grzx.html" title="个人中心">个人中心</a> 28 <a href="./grzx.html" title="个人中心">个人中心</a>
24 <a title="预约时间"><cite>预约时间</cite></a> 29 <a title="预约时间"><cite>预约时间</cite></a>
25 </span> 30 </span>
26 </div>
27 </div> 31 </div>
28 <!-- ----------------------------------内容模块的开始----------------------------------------------- --> 32 </div>
29 <div class="central_area"> 33 <!-- ----------------------------------内容模块的开始----------------------------------------------- -->
30 <div class="progressBar contentBox"> 34 <div class="central_area">
31 <ul class="app_progress"> 35 <div class="progressBar contentBox">
32 <li> 36 <ul class="app_progress">
33 <p class="active"></p> 37 <li>
34 <h5> 38 <p class="active"></p>
35 预约须知 39 <h5>预约须知</h5>
36 </h5> 40 </li>
37 </li> 41 <div class="layui-progress">
38 <div class="layui-progress"> 42 <div class="layui-progress-bar" lay-percent="100%"></div>
39 <div class="layui-progress-bar" lay-percent="100%"></div>
40 </div>
41 <li>
42 <p class="active"></p>
43 <h5>
44 选择区域
45 </h5>
46 </li>
47 <div class="layui-progress">
48 <div class="layui-progress-bar" lay-percent="100%"></div>
49 </div>
50 <li>
51 <p class="activeing"></p>
52 <h5 class="activeingtext">
53 预约时间
54 </h5>
55 </li>
56 <div class="layui-progress">
57 <div class="layui-progress-bar" lay-percent="50%"></div>
58 </div>
59 <li>
60 <p></p>
61 <h5>
62 预约结果
63 </h5>
64 </li>
65 </ul>
66 </div> 43 </div>
67 <div class="appoint_time"> 44 <li>
68 <div class="swiper-container"> 45 <p class="active"></p>
69 <div class="swiper-wrapper" id="swiperDate"></div> 46 <h5>选择区域</h5>
70 </div> 47 </li>
71 <!-- Add Arrows --> 48 <div class="layui-progress">
72 <div class="swiper-button-next"></div> 49 <div class="layui-progress-bar" lay-percent="100%"></div>
73 <div class="swiper-button-prev"></div>
74 </div> 50 </div>
75 <!-- ----------------------------------业务选择start----------------------------------------------- --> 51 <li>
76 <div class="business_choice contentBox"> 52 <p class="activeing"></p>
77 <div class="site-title"> 53 <h5 class="activeingtext">预约时间</h5>
78 <fieldset> 54 </li>
79 <legend> 55 <div class="layui-progress">
80 <a href="" name="fieldset"> 56 <div class="layui-progress-bar" lay-percent="50%"></div>
81 业务预约
82 </a>
83 </legend>
84 </fieldset>
85 </div>
86 <div id="business_list">
87 </div>
88 </div> 57 </div>
89 58 <li>
90 <div class="next_button"> 59 <p></p>
91 <button type="button" class="layui-btn layui-btn-normal"> 60 <h5>预约结果</h5>
92 <!-- <a href="./yyxz.html" title="上一步"> 61 </li>
62 </ul>
63 </div>
64 <div class="appoint_time">
65 <div class="swiper-container">
66 <div class="swiper-wrapper" id="swiperDate"></div>
67 </div>
68 <!-- Add Arrows -->
69 <div class="swiper-button-next"></div>
70 <div class="swiper-button-prev"></div>
71 </div>
72 <!-- ----------------------------------业务选择start----------------------------------------------- -->
73 <div class="business_choice contentBox">
74 <div class="site-title">
75 <fieldset>
76 <legend>
77 <a href="" name="fieldset"> 业务预约 </a>
78 </legend>
79 </fieldset>
80 </div>
81 <div id="business_list"></div>
82 </div>
83
84 <div class="next_button">
85 <button type="button" class="layui-btn layui-btn-normal">
86 <!-- <a href="./yyxz.html" title="上一步">
93 上一步 87 上一步
94 </a> --> 88 </a> -->
95 <a href="./xzqy.html" title="上一步"> 89 <a href="./xzqy.html" title="上一步"> 上一步 </a>
96 上一步 90 </button>
97 </a>
98 </button>
99 </div>
100 </div> 91 </div>
92 </div>
101 </div> 93 </div>
102 </body> 94 </body>
103
104 </html> 95 </html>
105 <script type="text/javascript" src="../staticJs/common.js"></script> 96 <script type="text/javascript" src="../staticJs/common.js"></script>
106 <script type="text/javascript" src="../staticJs/down.js"></script> 97 <script type="text/javascript" src="../staticJs/down.js"></script>
...@@ -108,41 +99,78 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD ...@@ -108,41 +99,78 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD
108 <script type="text/javascript" src="../staticJs/yysj.js"></script> 99 <script type="text/javascript" src="../staticJs/yysj.js"></script>
109 100
110 <script id="date" type="text/html"> 101 <script id="date" type="text/html">
111 {{# layui.each(d.dateList, function(index, item){ }} 102 {{# layui.each(d.dateList, function(index, item){ }} {{# if(item.isSelect){ }}
112 {{# if(item.isSelect){ }} 103 <ul class="swiper-slide layui-bg-gray active1">
113 <ul class="swiper-slide layui-bg-gray active1"> 104 <li>{{item.week}}</li>
114 <li>{{item.week}}</li> 105 <li>{{item.jyjh}}</li>
115 <li>{{item.jyjh}}</li> 106 </ul>
116 </ul> 107 {{# } }}
117 {{# } }} 108 {{# if(!item.isSelect){ }}
118 {{# if(!item.isSelect){ }} 109 <ul class="swiper-slide layui-bg-gray">
119 <ul class="swiper-slide layui-bg-gray"> 110 <li>{{item.week}}</li>
120 <li>{{item.week}}</li> 111 <li>{{item.jyjh}}</li>
121 <li>{{item.jyjh}}</li> 112 </ul>
122 </ul> 113 {{# } }} {{# }); }}
123 {{# } }}
124 {{# }); }}
125 </script> 114 </script>
126 115
127 <script id="business_item" type="text/html"> 116 <script id="business_item" type="text/html">
128 {{# layui.each(d.busList, function(index, item){ }} 117 {{# layui.each(d.busList, function(index, item){ }}
129 <div class="business_item"> 118 <div class="business_item">
130 <div class="item_time"> 119 <div class="item_time">
131 <span>上午</span> 120 <span>上午</span>
132 <span>{{item.startTime}}</span> 121 <span>{{item.startTime}}</span>
133 <span>-</span> 122 <span>-</span>
134 <span>{{item.endTime}}</span> 123 <span>{{item.endTime}}</span>
135 </div>
136 <ul >
137 {{# layui.each(item.orgBusinessList, function(index1, item1){ }}
138 <li class="item_appoint" data-id='{{item1.periodRulesId}}'>
139 <h3>
140 {{item1.shortName}}
141 </h3>
142 <p style="color:#5FB878">(剩{{item1.residueNumber}}票)</p>
143 </li>
144 {{# }) }}
145 </ul>
146 </div> 124 </div>
147 {{# }); }}
148 </script>
...\ No newline at end of file ...\ No newline at end of file
125 <ul>
126 {{# layui.each(item.orgBusinessList, function(index1, item1){ }}
127 {{# if(!item.choosePeriodRulesId && item1.residueNumber==0){ }}
128 <li class="isAppoint" data-id="{{item1.periodRulesId}}">
129 <h3>{{item1.shortName}}</h3>
130 <p style="color:#5FB878">(剩{{item1.residueNumber}}票)</p>
131 </li>
132 {{# } }}
133
134 {{# if(!item.choosePeriodRulesId && item1.residueNumber!=0){ }}
135 <li class="item_appoint" data-id="{{item1.periodRulesId}}">
136 <h3>{{item1.shortName}}</h3>
137 <p style="color:#5FB878">(剩{{item1.residueNumber}}票)</p>
138 </li>
139 {{# } }}
140 <!-- 表示预约的是该时间段 且是最后一个号 -->
141 {{# if(item.choosePeriodRulesId && item1.periodRulesId ==item.choosePeriodRulesId && item1.residueNumber==0){ }}
142 <li class="isAppoint" data-id="{{item1.periodRulesId}}">
143 <h3>{{item1.shortName}}</h3>
144 <input type="button" value='取消预约'>
145 <input type="button" value='查看详情'>
146 <p style="color:#5FB878">(剩{{item1.residueNumber}}票)</p>
147 </li>
148 {{# } }}
149 <!-- 表示预约的是该时间段，且该时间段的号不为0 -->
150 {{# if(item.choosePeriodRulesId && item1.periodRulesId ==item.choosePeriodRulesId && item1.residueNumber!=0){ }}
151 <li class="isAppoint" data-id="{{item1.periodRulesId}}">
152 <h3>{{item1.shortName}}</h3>
153 <input type="button" value='取消预约'>
154 <input type="button" value='查看详情'>
155 <p style="color:#5FB878">(剩{{item1.residueNumber}}票)</p>
156 </li>
157 {{# } }}
158 <!-- 表示预约的不是该时间段且剩余号为0 -->
159 {{# if(item.choosePeriodRulesId && item1.periodRulesId !=item.choosePeriodRulesId && item1.residueNumber==0){ }}
160 <li class="isAppoint" data-id="{{item1.periodRulesId}}">
161 <h3>{{item1.shortName}}</h3>
162 <p style="color:#5FB878">(剩{{item1.residueNumber}}票)</p>
163 </li>
164 {{# } }}
165 <!-- 表示预约的不是该时间段且剩余数不为0-->
166 {{# if(item.choosePeriodRulesId && item1.periodRulesId !=item.choosePeriodRulesId && item1.residueNumbe!=0){ }}
167 <li class="isAppoint" data-id="{{item1.periodRulesId}}">
168 <h3>{{item1.shortName}}</h3>
169 <p style="color:#5FB878">(剩{{item1.residueNumber}}票)</p>
170 </li>
171 {{# } }}
172 {{# }) }}
173 </ul>
174 </div>
175 {{# }); }}
176 </script>
......