kecheng.html 52 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <!-- Meta, title, CSS, favicons, etc. -->
  6. <meta charset="utf-8">
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  8. <meta name="viewport" content="width=device-width, initial-scale=1">
  9. <title>后台管理系统 </title>
  10. <!-- Bootstrap -->
  11. <link href="../vendors/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
  12. <!-- Font Awesome -->
  13. <link href="../vendors/font-awesome/css/font-awesome.min.css" rel="stylesheet">
  14. <!-- iCheck -->
  15. <link href="../vendors/iCheck/skins/flat/blue.css" rel="stylesheet">
  16. <!-- bootstrap-daterangepicker -->
  17. <link href="../vendors/bootstrap-daterangepicker/daterangepicker.css" rel="stylesheet">
  18. <!-- bootstrap-datetimepicker -->
  19. <link href="../vendors/bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.css" rel="stylesheet">
  20. <!-- Datatables -->
  21. <link href="../vendors/datatables.net-bs/css/dataTables.bootstrap.min.css" rel="stylesheet">
  22. <!-- Custom Theme Style -->
  23. <link href="../src/css/common.css" rel="stylesheet">
  24. </head>
  25. <body class="container child_body">
  26. <div class="row">
  27. <div class="col-md-12">
  28. <!-- 搜索条件 -->
  29. <div class="x_panel">
  30. <div class="x_title">
  31. <h2>搜索条件</h2>
  32. <ul class="nav navbar-right panel_toolbox">
  33. <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
  34. </li>
  35. </ul>
  36. <div class="clearfix"></div>
  37. </div>
  38. <div class="x_content">
  39. <div class="col-xs-1" style="min-width: 100px;">
  40. <!-- required for floating -->
  41. <!-- Nav tabs -->
  42. <ul class="nav nav-tabs tabs-left">
  43. <li class="active"><a href="#home" data-toggle="tab">学年</a>
  44. </li>
  45. <li><a href="#dataTime" data-toggle="tab">时间段</a>
  46. </li>
  47. </ul>
  48. </div>
  49. <div class="col-xs-9">
  50. <!-- Tab panes -->
  51. <div class="tab-content">
  52. <div class="tab-pane active" id="home">
  53. <form class="form-horizontal form-label-left" id="demo-form" data-parsley-validate>
  54. <div class="col-md-10 col-md-offset-1">
  55. <div class="col-md-6">
  56. <div class="form-group">
  57. <label class="control-label col-md-3 col-sm-3 col-xs-12">学年:</label>
  58. <div class="col-md-8 col-sm-8 col-xs-12">
  59. <select id="xuenian" class="form-control" required>
  60. <option value="2017-2018">2017-2018</option>
  61. <option value="2016-2017">2016-2017</option>
  62. <option value="2015-2016">2015-2016</option>
  63. <option value="2014-2015">2014-2015</option>
  64. </select>
  65. </div>
  66. </div>
  67. </div>
  68. <div class="col-md-6">
  69. <div class="form-group">
  70. <label class="control-label col-md-3 col-sm-3 col-xs-12">学期:</label>
  71. <div class="col-md-8 col-sm-8 col-xs-12">
  72. <select id="xueqi" class="form-control" required>
  73. <option value="1">1</option>
  74. <option value="2">2</option>
  75. </select>
  76. </div>
  77. </div>
  78. </div>
  79. <div class="clearfix"></div>
  80. <div class="col-md-6">
  81. </div>
  82. <div class="col-md-6"></div>
  83. <div class="clearfix"></div>
  84. </div>
  85. <div class="clearfix"></div>
  86. <div class="ln_solid"></div>
  87. <div class="form-group no-margin-bottom">
  88. <div class="col-md-12 col-sm-12 col-xs-12 text-center">
  89. <button class="btn btn-primary submit" type="submit">提交</button>
  90. <button class="btn btn-default" type="reset">重置</button>
  91. </div>
  92. </div>
  93. </form>
  94. </div>
  95. <div class="tab-pane" id="dataTime">
  96. <form class="form-horizontal form-label-left" id="demo-form2" data-parsley-validate>
  97. <div class="col-md-10 col-md-offset-1">
  98. <div class="col-md-6">
  99. <div class="form-group">
  100. <label for="heard" class="control-label col-md-3 col-sm-3 col-xs-12"> 开始时间:</label>
  101. <div class="col-md-5 col-sm-5 col-xs-12">
  102. <div class='input-group date' id='myDatepicker1'>
  103. <input type='text' class="form-control" />
  104. <span class="input-group-addon">
  105. <span class="glyphicon glyphicon-calendar"></span>
  106. </span>
  107. </div>
  108. </div>
  109. </div>
  110. </div>
  111. <div class="col-md-6">
  112. <div class="form-group">
  113. <label for="heard" class="control-label col-md-3 col-sm-3 col-xs-12"> 结束时间:</label>
  114. <div class="col-md-5 col-sm-5 col-xs-12">
  115. <div class='input-group date' id='myDatepicker2'>
  116. <input type='text' class="form-control" />
  117. <span class="input-group-addon">
  118. <span class="glyphicon glyphicon-calendar"></span>
  119. </span>
  120. </div>
  121. </div>
  122. </div>
  123. </div>
  124. </div>
  125. <div class="clearfix"></div>
  126. <div class="ln_solid"></div>
  127. <div class="form-group no-margin-bottom">
  128. <div class="col-md-12 col-sm-12 col-xs-12 text-center">
  129. <button class="btn btn-primary submit">提交</button>
  130. <button class="btn btn-default">重置</button>
  131. </div>
  132. </div>
  133. </form>
  134. </div>
  135. </div>
  136. </div>
  137. <div class="clearfix"></div>
  138. </div>
  139. </div>
  140. <!-- 搜索结果 -->
  141. <div class="row">
  142. <div class="col-md-12 col-sm-12 col-xs-24">
  143. <div class="x_panel" id="resultLists">
  144. <div class="x_title">
  145. <h2>搜索结果列表 </h2>
  146. <div class="nav navbar-right">
  147. <ul class="nav navbar-right panel_toolbox">
  148. <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
  149. </li>
  150. </ul>
  151. </div>
  152. <div class="clearfix"></div>
  153. </div>
  154. <div class="x_content">
  155. <div class="table_toolbox table_toolbox-top row">
  156. <div class="col-md-12 col-sm-12 col-xs-12">
  157. <button type="button" class="btn btn-primary btn-sm addBtn" data-toggle="modal"><i class="fa fa-plus"></i> 增加</button>
  158. <button type="button" class="btn btn-info btn-sm editBtn" data-toggle="modal" disabled><i class="fa fa-pencil"></i> 修改</button>
  159. <button type="button" class="btn btn-danger btn-sm delBtn" data-toggle="modal" data-target=".bs-del-modal" disabled><i class="fa fa-minus"></i> 删除</button>
  160. <span class="ln_solid-vertical">|</span>
  161. <button type="button" class="btn btn-info btn-sm" data-toggle="modal" data-target=".bs-paike-modal"><i class="fa fa-sitemap"></i> 排课</button>
  162. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  163. </div>
  164. </div>
  165. <table id="datatable-demo" class="table table-hover table-striped table-bordered bulk_action">
  166. <thead>
  167. <tr>
  168. <th><!-- <input type="radio" id="check-all" class="flat"> --></th>
  169. <th>Name</th>
  170. <th>Position</th>
  171. <th>Office</th>
  172. <th>Age</th>
  173. <th>Start date</th>
  174. <th>Start date</th>
  175. <th>Start date</th>
  176. <th>Start date</th>
  177. <th>Salary</th>
  178. <th>操作</th>
  179. </tr>
  180. </thead>
  181. <tbody>
  182. <tr>
  183. <td>
  184. <input type="radio" id="check-child" name="isCheck" class="flat">
  185. </td>
  186. <td>Tiger Nixon</td>
  187. <td>System ArchitectSenior Javascript Developer</td>
  188. <td>System Architect</td>
  189. <td>System Architect</td>
  190. <td>System Architect</td>
  191. <td>Edinburgh</td>
  192. <td>61</td>
  193. <td>2011/04/25</td>
  194. <td>$320,800</td>
  195. <td>
  196. <button type="button" class="btn btn-default btn-sm" disabled><i class="fa fa-sitemap"></i> 已排课</button>
  197. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  198. </td>
  199. </tr>
  200. <tr>
  201. <td>
  202. <input type="radio" id="check-child" name="isCheck" class="flat">
  203. </td>
  204. <td>System Architect</td>
  205. <td>System Architect</td>
  206. <td>System Architect</td>
  207. <td>Garrett Winters</td>
  208. <td>Accountant</td>
  209. <td>Tokyo</td>
  210. <td>63</td>
  211. <td>2011/07/25</td>
  212. <td>$170,750</td>
  213. <td>
  214. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  215. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  216. </td>
  217. </tr>
  218. <tr>
  219. <td>
  220. <input type="radio" id="check-child" name="isCheck" class="flat">
  221. </td>
  222. <td>Ashton Cox</td>
  223. <td>System Architect</td>
  224. <td>System Architect</td>
  225. <td>System Architect</td>
  226. <td>Junior Technical Author</td>
  227. <td>San Francisco</td>
  228. <td>66</td>
  229. <td>2009/01/12</td>
  230. <td>$86,000</td>
  231. <td>
  232. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  233. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  234. </td>
  235. </tr>
  236. <tr>
  237. <td>
  238. <input type="radio" id="check-child" name="isCheck" class="flat">
  239. </td>
  240. <td>Cedric Kelly</td>
  241. <td>Senior Javascript Developer</td>
  242. <td>Senior Javascript Developer</td>
  243. <td>Senior Javascript Developer</td>
  244. <td>Senior Javascript Developer</td>
  245. <td>Edinburgh</td>
  246. <td>22</td>
  247. <td>2012/03/29</td>
  248. <td>$433,060</td>
  249. <td>
  250. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  251. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  252. </td>
  253. </tr>
  254. <tr>
  255. <td>
  256. <input type="radio" id="check-child" name="isCheck" class="flat">
  257. </td>
  258. <td>Airi Satou</td>
  259. <td>Senior Javascript Developer</td>
  260. <td>Senior Javascript Developer</td>
  261. <td>Senior Javascript Developer</td>
  262. <td>Accountant</td>
  263. <td>Tokyo</td>
  264. <td>33</td>
  265. <td>2008/11/28</td>
  266. <td>$162,700</td>
  267. <td>
  268. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  269. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  270. </td>
  271. </tr>
  272. <tr>
  273. <td>
  274. <input type="radio" id="check-child" name="isCheck" class="flat">
  275. </td>
  276. <td>Brielle Williamson</td>
  277. <td>Senior Javascript Developer</td>
  278. <td>Senior Javascript Developer</td>
  279. <td>Senior Javascript Developer</td>
  280. <td>Integration Specialist</td>
  281. <td>New York</td>
  282. <td>61</td>
  283. <td>2012/12/02</td>
  284. <td>$372,000</td>
  285. <td>
  286. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  287. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  288. </td>
  289. </tr>
  290. <tr>
  291. <td>
  292. <input type="radio" id="check-child" name="isCheck" class="flat">
  293. </td>
  294. <td>Herrod Chandler</td>
  295. <td>Sales Assistant</td>
  296. <td>Senior Javascript Developer</td>
  297. <td>Senior Javascript Developer</td>
  298. <td>Senior Javascript Developer</td>
  299. <td>San Francisco</td>
  300. <td>59</td>
  301. <td>2012/08/06</td>
  302. <td>$137,500</td>
  303. <td>
  304. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  305. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  306. </td>
  307. </tr>
  308. <tr>
  309. <td>
  310. <input type="radio" id="check-child" name="isCheck" class="flat">
  311. </td>
  312. <td>Rhona Davidson</td>
  313. <td>Integration Specialist</td>
  314. <td>Senior Javascript Developer</td>
  315. <td>Senior Javascript Developer</td>
  316. <td>Senior Javascript Developer</td>
  317. <td>Tokyo</td>
  318. <td>55</td>
  319. <td>2010/10/14</td>
  320. <td>$327,900</td>
  321. <td>
  322. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  323. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  324. </td>
  325. </tr>
  326. <tr>
  327. <td>
  328. <input type="radio" id="check-child" name="isCheck" class="flat">
  329. </td>
  330. <td>Colleen Hurst</td>
  331. <td>Senior Javascript Developer</td>
  332. <td>Senior Javascript Developer</td>
  333. <td>Senior Javascript Developer</td>
  334. <td>Javascript Developer</td>
  335. <td>San Francisco</td>
  336. <td>39</td>
  337. <td>2009/09/15</td>
  338. <td>$205,500</td>
  339. <td>
  340. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  341. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  342. </td>
  343. </tr>
  344. <tr>
  345. <td>
  346. <input type="radio" id="check-child" name="isCheck" class="flat">
  347. </td>
  348. <td>Sonya Frost</td>
  349. <td>Software Engineer</td>
  350. <td>Senior Javascript Developer</td>
  351. <td>Senior Javascript Developer</td>
  352. <td>Senior Javascript Developer</td>
  353. <td>Edinburgh</td>
  354. <td>23</td>
  355. <td>2008/12/13</td>
  356. <td>$103,600</td>
  357. <td>
  358. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  359. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  360. </td>
  361. </tr>
  362. <tr>
  363. <td>
  364. <input type="radio" id="check-child" name="isCheck" class="flat">
  365. </td>
  366. <td>Jena Gaines</td>
  367. <td>Office Manager</td>
  368. <td>Senior Javascript Developer</td>
  369. <td>Senior Javascript Developer</td>
  370. <td>Senior Javascript Developer</td>
  371. <td>London</td>
  372. <td>30</td>
  373. <td>2008/12/19</td>
  374. <td>$90,560</td>
  375. <td>
  376. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  377. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  378. </td>
  379. </tr>
  380. <tr>
  381. <td>
  382. <input type="radio" id="check-child" name="isCheck" class="flat">
  383. </td>
  384. <td>Quinn Flynn</td>
  385. <td>Support Lead</td>
  386. <td>Senior Javascript Developer</td>
  387. <td>Senior Javascript Developer</td>
  388. <td>Senior Javascript Developer</td>
  389. <td>Edinburgh</td>
  390. <td>22</td>
  391. <td>2013/03/03</td>
  392. <td>$342,000</td>
  393. <td>
  394. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  395. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  396. </td>
  397. </tr>
  398. <tr>
  399. <td>
  400. <input type="radio" id="check-child" name="isCheck" class="flat">
  401. </td>
  402. <td>Charde Marshall</td>
  403. <td>Senior Javascript Developer</td>
  404. <td>Senior Javascript Developer</td>
  405. <td>Senior Javascript Developer</td>
  406. <td>Regional Director</td>
  407. <td>San Francisco</td>
  408. <td>36</td>
  409. <td>2008/10/16</td>
  410. <td>$470,600</td>
  411. <td>
  412. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  413. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  414. </td>
  415. </tr>
  416. <tr>
  417. <td>
  418. <input type="radio" id="check-child" name="isCheck" class="flat">
  419. </td>
  420. <td>Haley Kennedy</td>
  421. <td>Senior Javascript Developer</td>
  422. <td>Senior Javascript Developer</td>
  423. <td>Senior Javascript Developer</td>
  424. <td>Senior Marketing Designer</td>
  425. <td>London</td>
  426. <td>43</td>
  427. <td>2012/12/18</td>
  428. <td>$313,500</td>
  429. <td>
  430. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  431. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  432. </td>
  433. </tr>
  434. <tr>
  435. <td>
  436. <input type="radio" id="check-child" name="isCheck" class="flat">
  437. </td>
  438. <td>Tatyana Fitzpatrick</td>
  439. <td>Senior Javascript Developer</td>
  440. <td>Senior Javascript DeveloperSenior Javascript DeveloperSenior Javascript </td>
  441. <td>Senior Javascript Developer</td>
  442. <td>Regional Director</td>
  443. <td>London</td>
  444. <td>19</td>
  445. <td>2010/03/17</td>
  446. <td>$385,750</td>
  447. <td>
  448. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排课</button>
  449. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  450. </td>
  451. </tr>
  452. </tbody>
  453. </table>
  454. <div class="table_toolbox table_toolbox-bottom row">
  455. <div class="col-md-12 col-sm-12 col-xs-12">
  456. <button type="button" class="btn btn-primary btn-sm addBtn" data-toggle="modal"><i class="fa fa-plus"></i> 增加</button>
  457. <button type="button" class="btn btn-info btn-sm editBtn" data-toggle="modal" disabled><i class="fa fa-pencil"></i> 修改</button>
  458. <button type="button" class="btn btn-danger btn-sm delBtn" data-toggle="modal" data-target=".bs-del-modal" disabled><i class="fa fa-minus"></i> 删除</button>
  459. <span class="ln_solid-vertical">|</span>
  460. <button type="button" class="btn btn-info btn-sm" data-toggle="modal" data-target=".bs-paike-modal"><i class="fa fa-sitemap"></i> 排课</button>
  461. <button type="button" class="btn btn-info btn-sm"><i class="fa fa-sitemap"></i> 排考试</button>
  462. </div>
  463. </div>
  464. </div>
  465. </div>
  466. </div>
  467. </div>
  468. <!-- 新增、修改 modal -->
  469. <div class="modal fade bs-add-modal-lg" tabindex="-1" role="dialog" aria-hidden="true">
  470. <div class="modal-dialog modal-lg">
  471. <div class="modal-content">
  472. <div class="modal-header">
  473. <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span>
  474. </button>
  475. <h4 class="modal-title" id="myModalTitle">增加</h4>
  476. </div>
  477. <div class="modal-body">
  478. <form class="form-horizontal form-label-left" id="add-form" data-parsley-validate>
  479. <div class="col-md-6 col-sm-6 col-xs-12">
  480. <div class="form-group">
  481. <label class="control-label col-md-3 col-sm-3 col-xs-12"><span class="required">*</span>班级编号:</label>
  482. <div class="col-md-8 col-sm-8 col-xs-12">
  483. <input type="text" class="form-control" name="" placeholder="">
  484. </div>
  485. </div>
  486. </div>
  487. <div class="col-md-6 col-sm-6 col-xs-12">
  488. <div class="form-group">
  489. <label class="control-label col-md-3 col-sm-3 col-xs-12"><span class="required">*</span>班级名称:</label>
  490. <div class="col-md-8 col-sm-8 col-xs-12">
  491. <input type="text" class="form-control" name="" placeholder="">
  492. </div>
  493. </div>
  494. </div>
  495. <div class="col-md-6 col-sm-6 col-xs-12">
  496. <div class="form-group">
  497. <label class="control-label col-md-3 col-sm-3 col-xs-12">班级主任编号:</label>
  498. <div class="col-md-8 col-sm-8 col-xs-12">
  499. <input type="text" class="form-control" name="" placeholder="">
  500. </div>
  501. </div>
  502. </div>
  503. <div class="clearfix"></div>
  504. </form>
  505. </div>
  506. <div class="modal-footer">
  507. <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
  508. <button type="button" class="btn btn-primary">保存</button>
  509. </div>
  510. </div>
  511. </div>
  512. </div>
  513. <!-- 删除提示 -->
  514. <div class="modal fade bs-del-modal" tabindex="-1" role="dialog" aria-hidden="true">
  515. <div class="modal-dialog modal-sm" role="document">
  516. <div class="modal-content">
  517. <div class="modal-header">
  518. <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span>
  519. </button>
  520. <h4 class="modal-title" id="myModalTitle">是否真的要删除该选项?</h4>
  521. </div>
  522. <!-- <div class="modal-body"></div> -->
  523. <div class="modal-footer">
  524. <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
  525. <button type="button" class="btn btn-primary">确定</button>
  526. </div>
  527. </div>
  528. </div>
  529. </div>
  530. <!-- 排课 modal -->
  531. <div class="modal fade bs-paike-modal" tabindex="-1" role="dialog" aria-hidden="true">
  532. <div class="modal-dialog modal-costum" role="document">
  533. <div class="modal-content">
  534. <div class="modal-header">
  535. <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span>
  536. </button>
  537. <h4 class="modal-title" id="myModalTitle">《15移动互联3-2(Android) - 毕业设计》 排课</h4>
  538. </div>
  539. <div class="modal-body">
  540. <div id="wizard" class="form_wizard wizard_horizontal">
  541. <ul class="wizard_steps">
  542. <li>
  543. <a href="#step-1">
  544. <span class="step_no">1</span>
  545. <span class="step_descr">
  546. 设置课时<br />
  547. <small>填选上课时间</small>
  548. </span>
  549. </a>
  550. </li>
  551. <li>
  552. <a href="#step-2">
  553. <span class="step_no">2</span>
  554. <span class="step_descr">
  555. 设置日期<br />
  556. <small>填选日期时间段</small>
  557. </span>
  558. </a>
  559. </li>
  560. <li>
  561. <a href="#step-3">
  562. <span class="step_no">3</span>
  563. <span class="step_descr">
  564. 生成课表<br />
  565. <small>利用课表,直观管理排课</small>
  566. </span>
  567. </a>
  568. </li>
  569. </ul>
  570. <div id="step-1" style="display: none;">
  571. <form class="form-horizontal form-label-left">
  572. <div class="col-md-6">
  573. <div class="form-group">
  574. <label class="control-label col-md-3 col-sm-3 col-xs-12" for="">第一节课时间:</label>
  575. <div class="col-md-6 col-sm-6 col-xs-12">
  576. <input type="text" class="form-control inputTime" data-inputmask="'mask': '99-99'" />
  577. </div>
  578. </div>
  579. </div>
  580. <div class="col-md-6">
  581. <div class="form-group">
  582. <label class="control-label col-md-3 col-sm-3 col-xs-12" for="">第二节课时间:</label>
  583. <div class="col-md-6 col-sm-6 col-xs-12">
  584. <input type="text" class="form-control col-md-7 col-xs-12">
  585. </div>
  586. </div>
  587. </div>
  588. <div class="clearfix"></div>
  589. </form>
  590. </div>
  591. <div id="step-2" style="display: none;">
  592. <form class="form-horizontal form-label-left">
  593. <div class="col-md-6">
  594. <div class="form-group">
  595. <label for="heard" class="control-label col-md-3 col-sm-3 col-xs-12"> 开始时间:</label>
  596. <div class="col-md-5 col-sm-5 col-xs-12">
  597. <div class='input-group date' id='step_st1'>
  598. <input type='text' class="form-control" />
  599. <span class="input-group-addon">
  600. <span class="glyphicon glyphicon-calendar"></span>
  601. </span>
  602. </div>
  603. </div>
  604. </div>
  605. </div>
  606. <div class="col-md-6">
  607. <div class="form-group">
  608. <label for="heard" class="control-label col-md-3 col-sm-3 col-xs-12"> 结束时间:</label>
  609. <div class="col-md-5 col-sm-5 col-xs-12">
  610. <div class='input-group date' id='step_st2'>
  611. <input type='text' class="form-control" />
  612. <span class="input-group-addon">
  613. <span class="glyphicon glyphicon-calendar"></span>
  614. </span>
  615. </div>
  616. </div>
  617. </div>
  618. </div>
  619. <div class="clearfix"></div>
  620. </form>
  621. </div>
  622. <div id="step-3" class="kebiao" style="display: none;">
  623. <div class="msg row">
  624. <div class="col-md-8 col-md-sm-8 col-xs-12">
  625. <p class="explain">班级: <span>15移动互联3-2(Android)</span> 课程: <span>毕业设计</span> 日期段: 从<span>2017-09-04</span>到<span>2018-01-19</span></p>
  626. </div>
  627. <div class="col-md-4 col-sm-4 col-xs-12 text-right">
  628. <span class="icon operated"></span><span>已排课</span>
  629. <span class="icon repeat"></span><span>课时冲突</span>
  630. <span class="icon empty"></span><span>空闲课时</span>
  631. </div>
  632. </div>
  633. <table id="datatable-paike" class="table table-bordered kebiaoTable">
  634. <thead>
  635. <tr>
  636. <th>节次</th>
  637. <th>时间</th>
  638. <th>星期一</th>
  639. <th>星期二</th>
  640. <th>星期三</th>
  641. <th>星期四</th>
  642. <th>星期五</th>
  643. <th>星期六</th>
  644. <th>星期天</th>
  645. </tr>
  646. </thead>
  647. <tbody>
  648. <tr>
  649. <td>第1节</td>
  650. <td>
  651. 08:30<br>
  652. 09:10
  653. </td>
  654. <td class="operated">
  655. 毕业设计<br>
  656. 知行楼4-507
  657. </td>
  658. <td class="operated">
  659. 毕业设计<br>
  660. 知行楼4-507
  661. </td>
  662. <td class="operated">
  663. 毕业设计<br>
  664. 知行楼4-507
  665. </td>
  666. <td class="repeat">9</td>
  667. <td class="repeat">10</td>
  668. <td class="empty"></td>
  669. <td class="empty"></td>
  670. </tr>
  671. <tr>
  672. <td>第2节</td>
  673. <td>
  674. 08:30<br>
  675. 09:10
  676. </td>
  677. <td class="operated">
  678. 毕业设计<br>
  679. 知行楼4-507
  680. </td>
  681. <td class="operated">
  682. 毕业设计<br>
  683. 知行楼4-507
  684. </td>
  685. <td class="operated">
  686. 毕业设计<br>
  687. 知行楼4-507
  688. </td>
  689. <td class="repeat">9</td>
  690. <td class="repeat">10</td>
  691. <td class="empty"></td>
  692. <td class="empty"></td>
  693. </tr>
  694. <tr>
  695. <td>第3节</td>
  696. <td>
  697. 08:30<br>
  698. 09:10
  699. </td>
  700. <td class="operated">
  701. 毕业设计<br>
  702. 知行楼4-507
  703. </td>
  704. <td class="operated">
  705. 毕业设计<br>
  706. 知行楼4-507
  707. </td>
  708. <td class="operated">
  709. 毕业设计<br>
  710. 知行楼4-507
  711. </td>
  712. <td class="repeat">9</td>
  713. <td class="repeat">10</td>
  714. <td class="empty"></td>
  715. <td class="empty"></td>
  716. </tr>
  717. <tr>
  718. <td>第4节</td>
  719. <td>
  720. 08:30<br>
  721. 09:10
  722. </td>
  723. <td class="operated">
  724. 毕业设计<br>
  725. 知行楼4-507
  726. </td>
  727. <td class="operated">
  728. 毕业设计<br>
  729. 知行楼4-507
  730. </td>
  731. <td class="operated">
  732. 毕业设计<br>
  733. 知行楼4-507
  734. </td>
  735. <td class="repeat">9</td>
  736. <td class="repeat">10</td>
  737. <td class="empty"></td>
  738. <td class="empty"></td>
  739. </tr>
  740. <tr>
  741. <td>第5节</td>
  742. <td>
  743. 08:30<br>
  744. 09:10
  745. </td>
  746. <td class="empty"></td>
  747. <td class="empty"></td>
  748. <td class="empty"></td>
  749. <td class="empty"></td>
  750. <td class="repeat">9</td>
  751. <td class="empty"></td>
  752. <td class="empty"></td>
  753. </tr>
  754. <tr>
  755. <td>第6节</td>
  756. <td>
  757. 08:30<br>
  758. 09:10
  759. </td>
  760. <td class="empty"></td>
  761. <td class="empty"></td>
  762. <td class="empty"></td>
  763. <td class="repeat">9</td>
  764. <td class="repeat">10</td>
  765. <td class="empty"></td>
  766. <td class="empty"></td>
  767. </tr>
  768. <tr>
  769. <td>第7节</td>
  770. <td>
  771. 08:30<br>
  772. 09:10
  773. </td>
  774. <td class="empty"></td>
  775. <td class="empty"></td>
  776. <td class="empty"></td>
  777. <td class="empty"></td>
  778. <td class="repeat">9</td>
  779. <td class="empty"></td>
  780. <td class="empty"></td>
  781. </tr>
  782. <tr>
  783. <td>第8节</td>
  784. <td>
  785. 08:30<br>
  786. 09:10
  787. </td>
  788. <td class="empty"></td>
  789. <td class="empty"></td>
  790. <td class="empty"></td>
  791. <td class="empty"></td>
  792. <td class="repeat">10</td>
  793. <td class="empty"></td>
  794. <td class="empty"></td>
  795. </tr>
  796. <tr>
  797. <td>第9节</td>
  798. <td>
  799. 08:30<br>
  800. 09:10
  801. </td>
  802. <td class="empty">
  803. </td>
  804. <td class="empty">
  805. </td>
  806. <td class="empty"></td>
  807. <td class="empty"></td>
  808. <td class="empty"></td>
  809. <td class="empty"></td>
  810. <td class="empty"></td>
  811. </tr>
  812. <tr>
  813. <td>第10节</td>
  814. <td>
  815. 08:30<br>
  816. 09:10
  817. </td>
  818. <td class="empty">
  819. </td>
  820. <td class="empty">
  821. </td>
  822. <td class="empty"></td>
  823. <td class="empty"></td>
  824. <td class="empty"></td>
  825. <td class="empty"></td>
  826. <td class="empty"></td>
  827. </tr>
  828. </tbody>
  829. </table>
  830. </div>
  831. </div>
  832. </div>
  833. <!-- <div class="modal-footer">
  834. <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
  835. <button type="button" class="btn btn-primary">确定</button>
  836. </div> -->
  837. </div>
  838. </div>
  839. </div>
  840. <div class="modal fade bs-paike-tools" id="bs-paike-tools" tabindex="9" role="dialog" aria-hidden="true">
  841. <div class="modal-dialog modal-sm" role="body">
  842. <div class="modal-content">
  843. <div class="modal-header">
  844. <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span>
  845. </button>
  846. <h4 class="modal-title">选教室</h4>
  847. </div>
  848. <div class="modal-body">
  849. </div>
  850. </div>
  851. </div>
  852. </div>
  853. </div>
  854. </div>
  855. <!-- jQuery -->
  856. <script src="../vendors/jquery/dist/jquery.min.js"></script>
  857. <!-- Bootstrap -->
  858. <script src="../vendors/bootstrap/dist/js/bootstrap.min.js"></script>
  859. <!-- FastClick -->
  860. <script src="../vendors/fastclick/lib/fastclick.js"></script>
  861. <!-- iCheck -->
  862. <script src="../vendors/iCheck/icheck.min.js"></script>
  863. <!-- jQuery Tags Input -->
  864. <script src="../vendors/jquery.tagsinput/src/jquery.tagsinput.js"></script>
  865. <!-- Parsley -->
  866. <script src="../vendors/parsleyjs/dist/parsley.min.js"></script>
  867. <script src="../vendors/parsleyjs/dist/i18n/zh_cn.js"></script>
  868. <!-- bootstrap-daterangepicker -->
  869. <script src="../vendors/moment/min/moment.min.js"></script>
  870. <script src="../vendors/moment/locale/zh-cn.js"></script>
  871. <script src="../vendors/bootstrap-daterangepicker/daterangepicker.js"></script>
  872. <!-- bootstrap-datetimepicker -->
  873. <script src="../vendors/bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js"></script>
  874. <!-- Datatables -->
  875. <script src="../vendors/datatables.net/js/jquery.dataTables.min.js"></script>
  876. <script src="../vendors/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
  877. <script src="../vendors/datatables.net-fixedheader/js/dataTables.fixedHeader.min.js"></script>
  878. <script src="../vendors/datatables.net-fixedcolumns/js/dataTables.fixedcolumns.min.js"></script>
  879. <script src="../vendors/datatables.net-keytable/js/dataTables.keyTable.min.js"></script>
  880. <!-- jQuery Smart Wizard -->
  881. <script src="../vendors/jQuery-Smart-Wizard/js/jquery.smartWizard.js"></script>
  882. <!-- jquery.inputmask -->
  883. <script src="../vendors/jquery.inputmask/dist/min/jquery.inputmask.bundle.min.js"></script>
  884. <!-- common -->
  885. <script src="../src/js/common.js"></script>
  886. <script type="text/javascript">
  887. /* PARSLEY */
  888. /* 参考 http://parsleyjs.org/ */
  889. function init_parsley() {
  890. if( typeof (parsley) === 'undefined'){ return; }
  891. console.log('init_parsley');
  892. $('parsley:field:validate', function() {
  893. validateFront();
  894. });
  895. $('#demo-form .submit').on('click', function() {
  896. $('#demo-form').parsley().validate();
  897. validateFront();
  898. });
  899. var validateFront = function() {
  900. // 验证做
  901. console.log('validateFront');
  902. };
  903. // 监听验证成功
  904. $('parsley:field:success', function() {
  905. /* form submit */
  906. $('#demo-form').submit(function() {
  907. console.log('form submit!');
  908. // 显示结果
  909. $('#resultLists').addClass('show');
  910. // init_datatable();
  911. // 阻止跳转
  912. return false;
  913. })
  914. });
  915. };
  916. // Datatable
  917. function init_datatable() {
  918. console.log('init_datatable');
  919. var $datatable = $('#datatable-demo');
  920. var $checkAll = $datatable.find('input#check-all');
  921. var $checkChild = $datatable.find('input#check-child');
  922. $datatable.dataTable({
  923. dom: 'frt<"dataTables_ftools"pil>',
  924. fixedHeader: false,
  925. order: [],
  926. 'columnDefs': [
  927. { orderable: false, targets: [0] }
  928. ],
  929. pageLength: 10,
  930. language: {
  931. lengthMenu: '显示 _MENU_ 条',
  932. search: '过滤:',
  933. info: "_PAGE_ / _PAGES_ 页,共有 _TOTAL_ 条记录",
  934. processing: '正在处理中...',
  935. emptyTable: '表格数据为空',
  936. paginate: {
  937. previous: '上一页',
  938. next: '下一页'
  939. }
  940. },
  941. // fixedColumns: { //固定列的配置项
  942. // leftColumns: 1, //固定左边第一列
  943. // rightColumns: 1 //固定右边第一列
  944. // }, renderer: "bootstrap"
  945. });
  946. // 监听重绘dt
  947. $datatable.on('draw.dt', function() {
  948. console.log('datatabel draw dt again');
  949. $('input.flat').iCheck({
  950. radioClass: 'iradio_flat-blue',
  951. radioClass: 'iradio_flat-blue'
  952. });
  953. $checkAll.iCheck('uncheck');
  954. $checkChild.iCheck('uncheck');
  955. table_init();
  956. });
  957. table_init();
  958. function table_init() {
  959. var $datatable = $('#datatable-demo');
  960. var $checkAll = $datatable.find('input#check-all');
  961. var $checkChild = $datatable.find('input#check-child');
  962. // 全选改变监听
  963. $checkAll.on('ifChecked', function() {
  964. $checkChild.iCheck('check');
  965. });
  966. $checkAll.on('ifUnchecked', function() {
  967. $checkChild.iCheck('uncheck');
  968. });
  969. $checkChild.on('ifChecked', function() {
  970. $(this).parent().parent().parent().addClass('selected');
  971. // 激活修改删除按钮
  972. $('.editBtn, .delBtn').attr('disabled', false);
  973. })
  974. $checkChild.on('ifUnchecked', function() {
  975. $checkAll.iCheck('uncheck');
  976. $(this).parent().parent().parent().removeClass('selected');
  977. })
  978. }
  979. }
  980. // 时间段样例
  981. function date2() {
  982. var picker1 = $('#myDatepicker1').datetimepicker({
  983. format: 'YYYY-MM-DD',
  984. locale: moment.locale('zh-cn'),
  985. allowInputToggle: true
  986. //minDate: '2016-7-1'
  987. });
  988. var picker2 = $('#myDatepicker2').datetimepicker({
  989. format: 'YYYY-MM-DD',
  990. locale: moment.locale('zh-cn'),
  991. allowInputToggle: true
  992. });
  993. //动态设置最小值
  994. picker1.on('dp.change', function (e) {
  995. picker2.data('DateTimePicker').minDate(e.date);
  996. });
  997. //动态设置最大值
  998. picker2.on('dp.change', function (e) {
  999. picker1.data('DateTimePicker').maxDate(e.date);
  1000. });
  1001. }
  1002. // 增加 model
  1003. function addModal() {
  1004. var $this = $('.addBtn');
  1005. $this.click(function() {
  1006. console.log('add btn click');
  1007. if ($this.attr('disabled')) return;
  1008. $('.bs-add-modal-lg').modal('show');
  1009. $('#myModalTitle').text('增加XXX');
  1010. });
  1011. }
  1012. // 修改 model
  1013. function editModal() {
  1014. var $this = $('.editBtn');
  1015. $this.click(function() {
  1016. console.log('edit btn click');
  1017. if ($this.attr('disabled')) return;
  1018. $('.bs-add-modal-lg').modal('show');
  1019. $('#myModalTitle').text('修改');
  1020. // ajax 请求数据
  1021. });
  1022. }
  1023. /* SMART WIZARD */
  1024. function init_SmartWizard() {
  1025. if( typeof ($.fn.smartWizard) === 'undefined'){ return; }
  1026. console.log('init_SmartWizard');
  1027. // https://github.com/mstratman/jQuery-Smart-Wizard
  1028. $('#wizard').smartWizard({
  1029. selected: 0,
  1030. labelNext: '下一步',
  1031. labelPrevious: '上一步',
  1032. labelFinish: '完成',
  1033. buttonOrder: ['prev', 'next', 'finish']
  1034. });
  1035. $('.buttonNext').addClass('btn btn-success');
  1036. $('.buttonPrevious').addClass('btn btn-primary');
  1037. $('.buttonFinish').addClass('btn btn-default');
  1038. };
  1039. /* INPUT MASK */
  1040. // https://github.com/RobinHerbots/Inputmask
  1041. function init_InputMask() {
  1042. if( typeof ($.fn.inputmask) === 'undefined'){ return; }
  1043. console.log('init_InputMask');
  1044. $("input.inputTime").inputmask();
  1045. };
  1046. $(document).ready(function() {
  1047. // 通过该方法来为每次弹出的模态框设置最新的zIndex值,从而使最新的modal显示在最前面
  1048. $(document).on('show.bs.modal', '.modal', function (event) {
  1049. var zIndex = 1040 + (10 * $('.modal:visible').length);
  1050. $(this).css('z-index', zIndex);
  1051. setTimeout(function() {
  1052. $('.modal-backdrop').not('.modal-stack').css('z-index', zIndex - 1).addClass('modal-stack');
  1053. }, 0);
  1054. });
  1055. init_parsley();
  1056. init_datatable();
  1057. $('#myDatepicker').datetimepicker({
  1058. locale: moment.locale('zh-cn'),
  1059. format: 'YYYY-MM-DD',
  1060. defaultDate: new Date(),
  1061. allowInputToggle: true
  1062. });
  1063. date2();
  1064. addModal();
  1065. editModal();
  1066. var oTable;
  1067. $('.bs-paike-modal').on('shown.bs.modal', function() {
  1068. init_SmartWizard();
  1069. init_InputMask();
  1070. if (oTable) return;
  1071. oTable = $('#datatable-paike').DataTable({
  1072. // dom: '',
  1073. ordering: false
  1074. })
  1075. var keysTable = new $.fn.dataTable.KeyTable(oTable, {
  1076. focus: null, // 默认被关注。如 [1, 0]
  1077. columns: '2,3,4,5,6,7,8', // 可focus列
  1078. });
  1079. oTable.on('key-focus', function(e, datatable, cell) {
  1080. // console.log(cell, $(cell.nodes()));
  1081. var width = 160;
  1082. var html = `<div class="td_tools" style="right:-${width}px">
  1083. <div class="td_tools-title"></div>
  1084. <div class="td_tools-cotent">
  1085. <a class="btn btn-primary btn-sm"><i class="fa fa-sitemap"></i>排课</a>
  1086. <a class="btn btn-danger btn-sm"><i class="fa fa-eye"></i>查看冲突学生</a>
  1087. <a class="btn btn-primary btn-sm" id="onClassroom"><i class="fa fa-building"></i>排教室</a>
  1088. <a class="btn btn-primary btn-sm"><i class="fa fa-user"></i>老师代课</a>
  1089. </div>
  1090. </div>`
  1091. $(cell.nodes()).append(html);
  1092. // 排教室 (查看冲突学生等弹窗都可以用这个)
  1093. $('#onClassroom').on('click', function () {
  1094. var $modelDiv = $('#bs-paike-tools');
  1095. $modelDiv.find('.modal-title').text('选教室');
  1096. $modelDiv.find('.modal-body').html(`<div class="row">
  1097. <div class="col-md-12 col-sm-12 col-xs-24">
  1098. <select class="form-control"><option>请选择教室</option></select>
  1099. </div>
  1100. </div>`);
  1101. $modelDiv.modal({
  1102. backdrop: true
  1103. });
  1104. // 多层modal关闭滚动问题
  1105. $modelDiv.on('hidden.bs.modal',function(){
  1106. $(document.body).addClass("modal-open");
  1107. });
  1108. })
  1109. })
  1110. oTable.on('key-blur', function(e, datatable, cell) {
  1111. $(cell.nodes()).find('.td_tools').remove();
  1112. })
  1113. })
  1114. })
  1115. </script>
  1116. </body>
  1117. </html>