common.macro.ftl 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270
  1. <#macro commonStyle>
  2. <meta charset="utf-8">
  3. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  4. <!-- Tell the browser to be responsive to screen width -->
  5. <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  6. <!-- Bootstrap 3.3.5 -->
  7. <link rel="stylesheet" href="${request.contextPath}/static/adminlte/bootstrap/css/bootstrap.min.css">
  8. <!-- Font Awesome -->
  9. <!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"> -->
  10. <link rel="stylesheet" href="${request.contextPath}/static/plugins/font-awesome-4.3.0/css/font-awesome.min.css">
  11. <!-- Ionicons -->
  12. <!-- <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css"> -->
  13. <link rel="stylesheet" href="${request.contextPath}/static/plugins/ionicons-2.0.1/css/ionicons.min.css">
  14. <!-- Theme style -->
  15. <link rel="stylesheet" href="${request.contextPath}/static/adminlte/dist/css/AdminLTE-local.min.css">
  16. <!-- AdminLTE Skins. Choose a skin from the css/skins folder instead of downloading all of them to reduce the load. -->
  17. <link rel="stylesheet" href="${request.contextPath}/static/adminlte/dist/css/skins/_all-skins.min.css">
  18. <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  19. <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  20. <!--[if lt IE 9]>
  21. <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  22. <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  23. <![endif]-->
  24. <!-- scrollup -->
  25. <link rel="stylesheet" href="${request.contextPath}/static/plugins/scrollup/image.css">
  26. </#macro>
  27. <#macro commonScript>
  28. <!-- jQuery 2.1.4 -->
  29. <script src="${request.contextPath}/static/adminlte/plugins/jQuery/jQuery-2.1.4.min.js"></script>
  30. <!-- Bootstrap 3.3.5 -->
  31. <script src="${request.contextPath}/static/adminlte/bootstrap/js/bootstrap.min.js"></script>
  32. <!-- FastClick -->
  33. <script src="${request.contextPath}/static/adminlte/plugins/fastclick/fastclick.js"></script>
  34. <!-- AdminLTE App -->
  35. <script src="${request.contextPath}/static/adminlte/dist/js/app.min.js"></script>
  36. <!-- scrollup -->
  37. <script src="${request.contextPath}/static/plugins/scrollup/jquery.scrollUp.min.js"></script>
  38. <script src="${request.contextPath}/static/plugins/jquery/jquery.cookie.js"></script>
  39. <script src="${request.contextPath}/static/js/common.1.js"></script>
  40. </#macro>
  41. <#macro commonHeader>
  42. <header class="main-header">
  43. <a href="${request.contextPath}/" class="logo">
  44. <span class="logo-mini"><b>X</b>XL</span>
  45. <span class="logo-lg"><b>任务调度</b>中心</span>
  46. </a>
  47. <nav class="navbar navbar-static-top" role="navigation">
  48. <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button"><span class="sr-only">切换导航</span></a>
  49. <div class="navbar-custom-menu"></div>
  50. </nav>
  51. </header>
  52. </#macro>
  53. <#macro commonLeft>
  54. <!-- Left side column. contains the logo and sidebar -->
  55. <aside class="main-sidebar">
  56. <!-- sidebar: style can be found in sidebar.less -->
  57. <section class="sidebar">
  58. <!-- sidebar menu: : style can be found in sidebar.less -->
  59. <ul class="sidebar-menu">
  60. <li class="header">常用模块</li>
  61. <li class="nav-click" ><a href="${request.contextPath}/jobinfo"><i class="fa fa-circle-o text-red"></i> <span>调度管理</span></a></li>
  62. <li class="nav-click" ><a href="${request.contextPath}/joblog"><i class="fa fa-circle-o text-yellow"></i><span>调度日志</span></a></li>
  63. <li class="nav-click" ><a href="${request.contextPath}/help"><i class="fa fa-circle-o text-yellow"></i><span>使用教程</span></a></li>
  64. </ul>
  65. </section>
  66. <!-- /.sidebar -->
  67. </aside>
  68. </#macro>
  69. <#macro commonControl >
  70. <!-- Control Sidebar -->
  71. <aside class="control-sidebar control-sidebar-dark">
  72. <!-- Create the tabs -->
  73. <ul class="nav nav-tabs nav-justified control-sidebar-tabs">
  74. <li class="active"><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
  75. <li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
  76. </ul>
  77. <!-- Tab panes -->
  78. <div class="tab-content">
  79. <!-- Home tab content -->
  80. <div class="tab-pane active" id="control-sidebar-home-tab">
  81. <h3 class="control-sidebar-heading">近期活动</h3>
  82. <ul class="control-sidebar-menu">
  83. <li>
  84. <a href="javascript::;">
  85. <i class="menu-icon fa fa-birthday-cake bg-red"></i>
  86. <div class="menu-info">
  87. <h4 class="control-sidebar-subheading">张三今天过生日</h4>
  88. <p>2015-09-10</p>
  89. </div>
  90. </a>
  91. </li>
  92. <li>
  93. <a href="javascript::;">
  94. <i class="menu-icon fa fa-user bg-yellow"></i>
  95. <div class="menu-info">
  96. <h4 class="control-sidebar-subheading">Frodo 更新了资料</h4>
  97. <p>更新手机号码 +1(800)555-1234</p>
  98. </div>
  99. </a>
  100. </li>
  101. <li>
  102. <a href="javascript::;">
  103. <i class="menu-icon fa fa-envelope-o bg-light-blue"></i>
  104. <div class="menu-info">
  105. <h4 class="control-sidebar-subheading">Nora 加入邮件列表</h4>
  106. <p>nora@example.com</p>
  107. </div>
  108. </a>
  109. </li>
  110. <li>
  111. <a href="javascript::;">
  112. <i class="menu-icon fa fa-file-code-o bg-green"></i>
  113. <div class="menu-info">
  114. <h4 class="control-sidebar-subheading">001号定时作业调度</h4>
  115. <p>5秒前执行</p>
  116. </div>
  117. </a>
  118. </li>
  119. </ul>
  120. <!-- /.control-sidebar-menu -->
  121. </div>
  122. <!-- /.tab-pane -->
  123. <!-- Settings tab content -->
  124. <div class="tab-pane" id="control-sidebar-settings-tab">
  125. <form method="post">
  126. <h3 class="control-sidebar-heading">个人设置</h3>
  127. <div class="form-group">
  128. <label class="control-sidebar-subheading"> 左侧菜单自适应
  129. <input type="checkbox" class="pull-right" checked>
  130. </label>
  131. <p>左侧菜单栏样式自适应</p>
  132. </div>
  133. <!-- /.form-group -->
  134. </form>
  135. </div>
  136. <!-- /.tab-pane -->
  137. </div>
  138. </aside>
  139. <!-- /.control-sidebar -->
  140. <!-- Add the sidebar's background. This div must be placed immediately after the control sidebar -->
  141. <div class="control-sidebar-bg"></div>
  142. </#macro>
  143. <#macro commonFooter >
  144. <footer class="main-footer">
  145. <div class="pull-right hidden-xs">
  146. <b>Version</b> 1.0
  147. </div>
  148. <strong>Copyright &copy; 2015-2015 &nbsp;
  149. <a href="https://github.com/xuxueli/xxl-job" target="_blank" >github</a>&nbsp;
  150. <a href="http://www.cnblogs.com/xuxueli/p/5021979.html" target="_blank" >cnblog</a>.
  151. </strong> All rights reserved.
  152. </footer>
  153. </#macro>
  154. <#macro comAlert >
  155. <!-- ComAlert.模态框Modal -->
  156. <div class="modal fade" id="ComAlert" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  157. <div class="modal-dialog">
  158. <div class="modal-content">
  159. <!-- <div class="modal-header"><h4 class="modal-title"><strong>提示:</strong></h4></div> -->
  160. <div class="modal-body"><div class="alert alert-success"></div></div>
  161. <div class="modal-footer">
  162. <div class="text-center" >
  163. <button type="button" class="btn btn-default ok" data-dismiss="modal" >确认</button>
  164. </div>
  165. </div>
  166. </div>
  167. </div>
  168. </div>
  169. <!-- ComConfirm.模态框Modal -->
  170. <div class="modal fade" id="ComConfirm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  171. <div class="modal-dialog">
  172. <div class="modal-content">
  173. <div class="modal-body"><div class="alert alert-success"></div></div>
  174. <div class="modal-footer">
  175. <div class="text-center" >
  176. <button type="button" class="btn btn-primary ok" data-dismiss="modal" >确认</button>
  177. <button type="button" class="btn btn-default cancel" data-dismiss="modal" >取消</button>
  178. </div>
  179. </div>
  180. </div>
  181. </div>
  182. </div>
  183. <!-- ComAlertTec.模态框Modal-科技感 -->
  184. <div class="modal fade" id="ComAlertTec" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  185. <div class="modal-dialog">
  186. <div class="modal-content-tec">
  187. <div class="modal-body"><div class="alert" style="color:#fff;"></div></div>
  188. <div class="modal-footer">
  189. <div class="text-center" >
  190. <button type="button" class="btn btn-info ok" data-dismiss="modal" >确认</button>
  191. </div>
  192. </div>
  193. </div>
  194. </div>
  195. </div>
  196. <script>
  197. // 通用提示
  198. var ComAlert = {
  199. show:function(type, msg, callback){
  200. // 弹框初始
  201. if (type == 1) {
  202. $('#ComAlert .alert').attr('class', 'alert alert-success');
  203. } else {
  204. $('#ComAlert .alert').attr('class', 'alert alert-warning');
  205. }
  206. $('#ComAlert .alert').html(msg);
  207. $('#ComAlert').modal('show');
  208. $('#ComAlert .ok').click(function(){
  209. $('#ComAlert').modal('hide');
  210. if(typeof callback == 'function') {
  211. callback();
  212. }
  213. });
  214. // $("#ComAlert").on('hide.bs.modal', function () { }); // 监听关闭
  215. }
  216. };
  217. // 通用确认弹框
  218. var ComConfirm = {
  219. show:function(msg, callback){
  220. // 弹框初始
  221. $('#ComConfirm .alert').attr('class', 'alert alert-warning');
  222. $('#ComConfirm .alert').html(msg);
  223. $('#ComConfirm').modal('show');
  224. $('#ComConfirm .ok').unbind("click"); // 解绑陈旧事件
  225. $('#ComConfirm .ok').click(function(){
  226. $('#ComConfirm').modal('hide');
  227. if(typeof callback == 'function') {
  228. callback();
  229. return;
  230. }
  231. });
  232. $('#ComConfirm .cancel').click(function(){
  233. $('#ComConfirm').modal('hide');
  234. return;
  235. });
  236. }
  237. };
  238. // 提示-科技主题
  239. var ComAlertTec = {
  240. show:function(msg, callback){
  241. // 弹框初始
  242. $('#ComAlertTec .alert').html(msg);
  243. $('#ComAlertTec').modal('show');
  244. $('#ComAlertTec .ok').click(function(){
  245. $('#ComAlertTec').modal('hide');
  246. if(typeof callback == 'function') {
  247. callback();
  248. }
  249. });
  250. }
  251. };
  252. </script>
  253. </#macro>