holidayIndexDetail.html 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  5. <meta charset=utf-8>
  6. <title>CLD.System</title>
  7. <link rel="shortcut icon" href="images/favicon.ico">
  8. <meta name=copyright content=smartcost.com.cn>
  9. <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
  10. <meta name="apple-mobile-web-app-capable" content="yes">
  11. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  12. <link rel="stylesheet" href="css/sui/sm.css">
  13. <link rel="stylesheet" href="css/sui/sm-extend.css">
  14. <link rel="stylesheet" href="css/sui/global.css">
  15. <link rel="stylesheet" href="css/AirDate/datepicker.min.css">
  16. </head>
  17. <body>
  18. <div class="page-group">
  19. <div class="page page-current">
  20. <header class="bar bar-nav">
  21. <a class="icon icon-left pull-left" href="mainIndex.html"></a>
  22. <h1 class="title holidayTBg">请假</h1>
  23. </header>
  24. <nav class="bar bar-tab">
  25. <a class="tab-item external active" href="holidayIndexDetail.html">
  26. <!-- <span class="icon icon-edit"></span> -->
  27. <span class="tab-label">请假申请</span>
  28. </a>
  29. <a class="tab-item external " href="holidayDetail.html">
  30. <!-- <span class="icon icon-me"></span> -->
  31. <span class="tab-label">我的假条</span>
  32. </a>
  33. <a class="tab-item external " href="holidayListDetail.html">
  34. <!-- <span class="icon icon-menu"></span> -->
  35. <span class="tab-label">假条审批</span>
  36. <span class="badge">2</span>
  37. </a>
  38. </nav>
  39. <div class="content">
  40. <p class="bg-danger">对不起,你的年假不足!</p>
  41. <p class="bg-danger">对不起,你没有年假!</p>
  42. <p class="bg-danger">对不起,你没有存假!</p>
  43. <div class="list-block">
  44. <ul>
  45. <li>
  46. <div class="item-content create-actions">
  47. <div class="item-inner">
  48. <div class="item-title label">假期类型</div>
  49. <div class="item-input">
  50. <input type="text" readonly="readonly" placeholder="假期类型 [ 事假 ]">
  51. </div>
  52. </div>
  53. </div>
  54. </li>
  55. </ul>
  56. </div>
  57. <div class="content-block-title">事假详情</div>
  58. <div class="list-block">
  59. <ul>
  60. <li class="align-top">
  61. <div class="item-content">
  62. <div class="item-inner">
  63. <div class="item-title label">事假原因</div>
  64. <div class="item-input">
  65. <textarea class="myinput" id="myinput"></textarea>
  66. </div>
  67. </div>
  68. </div>
  69. </li>
  70. <li>
  71. <div class="item-content">
  72. <div class="item-inner">
  73. <div class="item-title label">请假时间</div>
  74. <div class="item-input">
  75. <input data-popup=".popup-about" class="open-about" readonly="readonly" type="text" placeholder="请选择请假时间">
  76. </div>
  77. </div>
  78. </div>
  79. </li>
  80. <li>
  81. <div class="item-content">
  82. <div class="item-inner">
  83. <div class="item-title label">合计天数</div>
  84. <div class="item-input">
  85. <input type="tel" placeholder="合计天数" value="0天">
  86. </div>
  87. </div>
  88. </div>
  89. </li>
  90. </ul>
  91. </div>
  92. <div class="content-block-title">请假日期列表</div>
  93. <div class="list-block">
  94. <ul>
  95. <li>
  96. <div class="item-content">
  97. <div class="item-inner">
  98. <div class="item-title label">2017-02-27</div>
  99. <div class="item-input">
  100. <div class="row">
  101. <div class="col-50">上午&nbsp;&nbsp;<label class="label-switch toast1">
  102. <input type="checkbox" name="my-checkbox" checked>
  103. <div class="checkbox"></div>
  104. </label></div>
  105. <div class="col-50">下午&nbsp;&nbsp;<label class="label-switch toast1">
  106. <input type="checkbox" name="my-checkbox">
  107. <div class="checkbox"></div>
  108. </label></div>
  109. </div>
  110. </div>
  111. </div>
  112. </div>
  113. </li>
  114. <li>
  115. <div class="item-content">
  116. <div class="item-inner">
  117. <div class="item-title label">2017-02-28</div>
  118. <div class="item-input">
  119. <div class="row">
  120. <div class="col-50">上午&nbsp;&nbsp;<label class="label-switch toast1">
  121. <input type="checkbox" name="my-checkbox">
  122. <div class="checkbox"></div>
  123. </label></div>
  124. <div class="col-50">下午&nbsp;&nbsp;<label class="label-switch toast1">
  125. <input type="checkbox" name="my-checkbox">
  126. <div class="checkbox"></div>
  127. </label></div>
  128. </div>
  129. </div>
  130. </div>
  131. </div>
  132. </li>
  133. </ul>
  134. </div>
  135. <div class="list-block">
  136. <ul>
  137. <li>
  138. <a class="formlabel" href="holidayApproverDetail.html">
  139. <div class="item-content">
  140. <div class="item-inner">
  141. <div class="item-title label">审批人</div>
  142. <div class="item-input">
  143. <input type="text" placeholder="请选择">
  144. </div>
  145. </div>
  146. </div>
  147. </a>
  148. </li>
  149. </ul>
  150. </div>
  151. <div class="content-block-title">病假详情</div>
  152. <div class="list-block">
  153. <ul>
  154. <li class="align-top">
  155. <div class="item-content">
  156. <div class="item-inner">
  157. <div class="item-title label">事假原因</div>
  158. <div class="item-input">
  159. <textarea class="myinput" id="myinput"></textarea>
  160. </div>
  161. </div>
  162. </div>
  163. </li>
  164. <li>
  165. <div class="item-content datetime-picker-star">
  166. <div class="item-inner">
  167. <div class="item-title label">开始时间</div>
  168. <div class="item-input">
  169. <input type="text" readonly="readonly" placeholder="开始时间">
  170. </div>
  171. </div>
  172. </div>
  173. </li>
  174. <li>
  175. <div class="item-content datetime-picker-end">
  176. <div class="item-inner">
  177. <div class="item-title label">结束时间</div>
  178. <div class="item-input">
  179. <input type="text" readonly="readonly" placeholder="结束时间">
  180. </div>
  181. </div>
  182. </div>
  183. </li>
  184. <li>
  185. <div class="item-content">
  186. <div class="item-inner">
  187. <div class="item-title label">合计天数</div>
  188. <div class="item-input">
  189. <input type="tel" placeholder="合计天数">
  190. </div>
  191. </div>
  192. </div>
  193. </li>
  194. </ul>
  195. </div>
  196. <div class="list-block">
  197. <ul>
  198. <li>
  199. <a class="formlabel" href="holidayApproverDetail.html">
  200. <div class="item-content">
  201. <div class="item-inner">
  202. <div class="item-title label">审批人</div>
  203. <div class="item-input">
  204. <input type="text" placeholder="请选择">
  205. </div>
  206. </div>
  207. </div>
  208. </a>
  209. </li>
  210. </ul>
  211. </div>
  212. <div class="list-block">
  213. <ul>
  214. <li>
  215. <div class="item-content create-actions">
  216. <div class="item-inner">
  217. <div class="item-title label">假期类型</div>
  218. <div class="item-input">
  219. <input type="text" readonly="readonly" placeholder="假期类型 [ 加班 ]">
  220. </div>
  221. </div>
  222. </div>
  223. </li>
  224. </ul>
  225. </div>
  226. <div class="content-block-title">加班详情</div>
  227. <div class="list-block">
  228. <ul>
  229. <li class="align-top">
  230. <div class="item-content">
  231. <div class="item-inner">
  232. <div class="item-title label">加班原因</div>
  233. <div class="item-input">
  234. <textarea class="myinput" id="myinput"></textarea>
  235. </div>
  236. </div>
  237. </div>
  238. </li>
  239. <li>
  240. <div class="item-content datetime-picker-star">
  241. <div class="item-inner">
  242. <div class="item-title label">开始时间</div>
  243. <div class="item-input">
  244. <input type="text" readonly="readonly" placeholder="开始时间">
  245. </div>
  246. </div>
  247. </div>
  248. </li>
  249. <li>
  250. <div class="item-content datetime-picker-end">
  251. <div class="item-inner">
  252. <div class="item-title label">结束时间</div>
  253. <div class="item-input">
  254. <input type="text" readonly="readonly" placeholder="结束时间">
  255. </div>
  256. </div>
  257. </div>
  258. </li>
  259. <li>
  260. <div class="item-content">
  261. <div class="item-inner">
  262. <div class="item-title label">合计天数</div>
  263. <div class="item-input">
  264. <input type="tel" placeholder="合计天数">
  265. </div>
  266. </div>
  267. </div>
  268. </li>
  269. </ul>
  270. </div>
  271. <div class="list-block">
  272. <ul>
  273. <li>
  274. <a class="formlabel" href="holidayApproverDetail.html">
  275. <div class="item-content">
  276. <div class="item-inner">
  277. <div class="item-title label">审批人</div>
  278. <div class="item-input">
  279. <input type="text" placeholder="请选择">
  280. </div>
  281. </div>
  282. </div>
  283. </a>
  284. </li>
  285. </ul>
  286. </div>
  287. <div class="list-block">
  288. <ul>
  289. <li>
  290. <div class="item-content create-actions">
  291. <div class="item-inner">
  292. <div class="item-title label">假期类型</div>
  293. <div class="item-input">
  294. <input type="text" readonly="readonly" placeholder="假期类型 [ 年假 ]">
  295. </div>
  296. </div>
  297. </div>
  298. </li>
  299. </ul>
  300. </div>
  301. <div class="content-block-title">年假详情</div>
  302. <div class="list-block">
  303. <ul>
  304. <li>
  305. <div class="item-content">
  306. <div class="item-inner">
  307. <div class="item-title label">可用年假</div>
  308. <div class="item-input">
  309. <input type="tel" value="你的年假 5 天">
  310. </div>
  311. </div>
  312. </div>
  313. </li>
  314. <li>
  315. <div class="item-content datetime-picker-star">
  316. <div class="item-inner">
  317. <div class="item-title label">开始时间</div>
  318. <div class="item-input">
  319. <input type="text" readonly="readonly" placeholder="开始时间">
  320. </div>
  321. </div>
  322. </div>
  323. </li>
  324. <li>
  325. <div class="item-content datetime-picker-end">
  326. <div class="item-inner">
  327. <div class="item-title label">结束时间</div>
  328. <div class="item-input">
  329. <input type="text" readonly="readonly" placeholder="结束时间">
  330. </div>
  331. </div>
  332. </div>
  333. </li>
  334. <li>
  335. <div class="item-content">
  336. <div class="item-inner">
  337. <div class="item-title label">合计天数</div>
  338. <div class="item-input">
  339. <input type="tel" placeholder="合计天数" value="6天">
  340. </div>
  341. </div>
  342. </div>
  343. </li>
  344. </ul>
  345. </div>
  346. <div class="list-block">
  347. <ul>
  348. <li>
  349. <a class="formlabel" href="holidayApproverDetail.html">
  350. <div class="item-content">
  351. <div class="item-inner">
  352. <div class="item-title label">审批人</div>
  353. <div class="item-input">
  354. <input type="text" placeholder="请选择">
  355. </div>
  356. </div>
  357. </div>
  358. </a>
  359. </li>
  360. </ul>
  361. </div>
  362. <div class="list-block">
  363. <ul>
  364. <li>
  365. <div class="item-content create-actions">
  366. <div class="item-inner">
  367. <div class="item-title label">假期类型</div>
  368. <div class="item-input">
  369. <input type="text" readonly="readonly" placeholder="假期类型 [ 补休 ]">
  370. </div>
  371. </div>
  372. </div>
  373. </li>
  374. </ul>
  375. </div>
  376. <div class="content-block-title">补休详情</div>
  377. <div class="list-block">
  378. <ul>
  379. <li class="align-top">
  380. <div class="item-content">
  381. <div class="item-inner">
  382. <div class="item-title label">补休原因</div>
  383. <div class="item-input">
  384. <textarea class="myinput" id="myinput"></textarea>
  385. </div>
  386. </div>
  387. </div>
  388. </li>
  389. <li>
  390. <div class="item-content">
  391. <div class="item-inner">
  392. <div class="item-title label">可用存假</div>
  393. <div class="item-input">
  394. <input type="tel" value="你的存假 8 天">
  395. </div>
  396. </div>
  397. </div>
  398. </li>
  399. <li>
  400. <div class="item-content datetime-picker-star">
  401. <div class="item-inner">
  402. <div class="item-title label">开始时间</div>
  403. <div class="item-input">
  404. <input type="text" readonly="readonly" placeholder="开始时间">
  405. </div>
  406. </div>
  407. </div>
  408. </li>
  409. <li>
  410. <div class="item-content datetime-picker-end">
  411. <div class="item-inner">
  412. <div class="item-title label">结束时间</div>
  413. <div class="item-input">
  414. <input type="text" readonly="readonly" placeholder="结束时间">
  415. </div>
  416. </div>
  417. </div>
  418. </li>
  419. <li>
  420. <div class="item-content">
  421. <div class="item-inner">
  422. <div class="item-title label">合计天数</div>
  423. <div class="item-input">
  424. <input type="tel" placeholder="合计天数">
  425. </div>
  426. </div>
  427. </div>
  428. </li>
  429. </ul>
  430. </div>
  431. <div class="list-block">
  432. <ul>
  433. <li>
  434. <a class="formlabel" href="holidayApproverDetail.html">
  435. <div class="item-content">
  436. <div class="item-inner">
  437. <div class="item-title label">审批人</div>
  438. <div class="item-input">
  439. <input type="text" placeholder="请选择">
  440. </div>
  441. </div>
  442. </div>
  443. </a>
  444. </li>
  445. </ul>
  446. </div>
  447. <div class="content-block">
  448. <p><a href="holidayDetail.html" class="button button-fill button-big holidayBtn">提交申请</a></p>
  449. <p><a href="holidayDetail.html" class="button button-fill button-big holidayBtnGray">提交申请</a></p>
  450. </div>
  451. </div>
  452. </div>
  453. <div class="popup popup-aboutTime">
  454. <div class="content-block m-0">
  455. <p>请选择请假时间</p>
  456. <div class="datepicker-here" data-language='zh' data-multiple-dates="3"></div>
  457. <div class="row p-1">
  458. <div class="col-50"><a href="#" class="button button-fill btnGray btnSelf close-popup">取消</a></div>
  459. <div class="col-50"><a href="#" class="button button-fill btnSelf close-popup">提交</a></div>
  460. </div>
  461. </div>
  462. </div>
  463. </div>
  464. <script src="js/jquery-1.7.1.min.js"></script>
  465. <script type="text/javascript">$.noConflict();</script>
  466. <script type='text/javascript' src='js/sui/zepto.js' charset='utf-8'></script>
  467. <script type='text/javascript' src='js/sui/sm.js' charset='utf-8'></script>
  468. <script type='text/javascript' src='js/sui/sm-extend.js' charset='utf-8'></script>
  469. <script type='text/javascript' src='js/sui/global.js'></script>
  470. <script type='text/javascript' src="js/AirDate/datepicker.js"></script>
  471. <script type='text/javascript' src="js/AirDate/datepicker.zh.js"></script>
  472. </body>
  473. </html>