common.macro.ftl 9.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240
  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.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/js/common.1.js"></script>
  39. </#macro>
  40. <#macro commonHeader>
  41. <header class="main-header">
  42. <a href="${request.contextPath}/" class="logo">
  43. <span class="logo-mini"><b>X</b>XL</span>
  44. <span class="logo-lg"><b>任务调度</b>中心</span>
  45. </a>
  46. <nav class="navbar navbar-static-top" role="navigation">
  47. <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button"><span class="sr-only">切换导航</span></a>
  48. <div class="navbar-custom-menu"></div>
  49. </nav>
  50. </header>
  51. </#macro>
  52. <#macro commonLeft>
  53. <!-- Left side column. contains the logo and sidebar -->
  54. <aside class="main-sidebar">
  55. <!-- sidebar: style can be found in sidebar.less -->
  56. <section class="sidebar">
  57. <!-- sidebar menu: : style can be found in sidebar.less -->
  58. <ul class="sidebar-menu">
  59. <li class="header">常用模块</li>
  60. <li class="nav-click" ><a href="${request.contextPath}//"><i class="fa fa-circle-o text-red"></i> <span>调度中心</span></a></li>
  61. <li class="nav-click" ><a href="${request.contextPath}/help"><i class="fa fa-circle-o text-yellow"></i><span>使用教程</span></a></li>
  62. </ul>
  63. </section>
  64. <!-- /.sidebar -->
  65. </aside>
  66. </#macro>
  67. <#macro commonControl >
  68. <!-- Control Sidebar -->
  69. <aside class="control-sidebar control-sidebar-dark">
  70. <!-- Create the tabs -->
  71. <ul class="nav nav-tabs nav-justified control-sidebar-tabs">
  72. <li class="active"><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
  73. <li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
  74. </ul>
  75. <!-- Tab panes -->
  76. <div class="tab-content">
  77. <!-- Home tab content -->
  78. <div class="tab-pane active" id="control-sidebar-home-tab">
  79. <h3 class="control-sidebar-heading">近期活动</h3>
  80. <ul class="control-sidebar-menu">
  81. <li>
  82. <a href="javascript::;">
  83. <i class="menu-icon fa fa-birthday-cake bg-red"></i>
  84. <div class="menu-info">
  85. <h4 class="control-sidebar-subheading">张三今天过生日</h4>
  86. <p>2015-09-10</p>
  87. </div>
  88. </a>
  89. </li>
  90. <li>
  91. <a href="javascript::;">
  92. <i class="menu-icon fa fa-user bg-yellow"></i>
  93. <div class="menu-info">
  94. <h4 class="control-sidebar-subheading">Frodo 更新了资料</h4>
  95. <p>更新手机号码 +1(800)555-1234</p>
  96. </div>
  97. </a>
  98. </li>
  99. <li>
  100. <a href="javascript::;">
  101. <i class="menu-icon fa fa-envelope-o bg-light-blue"></i>
  102. <div class="menu-info">
  103. <h4 class="control-sidebar-subheading">Nora 加入邮件列表</h4>
  104. <p>nora@example.com</p>
  105. </div>
  106. </a>
  107. </li>
  108. <li>
  109. <a href="javascript::;">
  110. <i class="menu-icon fa fa-file-code-o bg-green"></i>
  111. <div class="menu-info">
  112. <h4 class="control-sidebar-subheading">001号定时作业调度</h4>
  113. <p>5秒前执行</p>
  114. </div>
  115. </a>
  116. </li>
  117. </ul>
  118. <!-- /.control-sidebar-menu -->
  119. </div>
  120. <!-- /.tab-pane -->
  121. <!-- Settings tab content -->
  122. <div class="tab-pane" id="control-sidebar-settings-tab">
  123. <form method="post">
  124. <h3 class="control-sidebar-heading">个人设置</h3>
  125. <div class="form-group">
  126. <label class="control-sidebar-subheading"> 左侧菜单自适应
  127. <input type="checkbox" class="pull-right" checked>
  128. </label>
  129. <p>左侧菜单栏样式自适应</p>
  130. </div>
  131. <!-- /.form-group -->
  132. </form>
  133. </div>
  134. <!-- /.tab-pane -->
  135. </div>
  136. </aside>
  137. <!-- /.control-sidebar -->
  138. <!-- Add the sidebar's background. This div must be placed immediately after the control sidebar -->
  139. <div class="control-sidebar-bg"></div>
  140. </#macro>
  141. <#macro commonFooter >
  142. <footer class="main-footer">
  143. <div class="pull-right hidden-xs">
  144. <b>Version</b> 1.0
  145. </div>
  146. <strong>Copyright &copy; 2015-2015 &nbsp;
  147. <a href="https://github.com/xuxueli/xxl-job" target="_blank" >github</a>&nbsp;
  148. <a href="http://www.cnblogs.com/xuxueli/p/5021979.html" target="_blank" >cnblog</a>.
  149. </strong> All rights reserved.
  150. </footer>
  151. </#macro>
  152. <#macro comAlert >
  153. <!-- ComAlert.模态框Modal -->
  154. <div class="modal fade" id="ComAlert" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  155. <div class="modal-dialog">
  156. <div class="modal-content">
  157. <!-- <div class="modal-header"><h4 class="modal-title"><strong>提示:</strong></h4></div> -->
  158. <div class="modal-body"><div class="alert alert-success"></div></div>
  159. <div class="modal-footer">
  160. <div class="text-center" >
  161. <button type="button" class="btn btn-default ok" data-dismiss="modal" >确认</button>
  162. </div>
  163. </div>
  164. </div>
  165. </div>
  166. </div>
  167. <!-- ComConfirm.模态框Modal -->
  168. <div class="modal fade" id="ComConfirm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  169. <div class="modal-dialog">
  170. <div class="modal-content">
  171. <div class="modal-body"><div class="alert alert-success"></div></div>
  172. <div class="modal-footer">
  173. <div class="text-center" >
  174. <button type="button" class="btn btn-primary ok" data-dismiss="modal" >确认</button>
  175. <button type="button" class="btn btn-default cancel" data-dismiss="modal" >取消</button>
  176. </div>
  177. </div>
  178. </div>
  179. </div>
  180. </div>
  181. <script>
  182. // 通用提示
  183. var ComAlert = {
  184. show:function(type, msg, callback){
  185. // 弹框初始
  186. if (type == 1) {
  187. $('#ComAlert .alert').attr('class', 'alert alert-success');
  188. } else {
  189. $('#ComAlert .alert').attr('class', 'alert alert-warning');
  190. }
  191. $('#ComAlert .alert').html(msg);
  192. $('#ComAlert').modal('show');
  193. $('#ComAlert .ok').click(function(){
  194. $('#ComAlert').modal('hide');
  195. if(typeof callback == 'function') {
  196. callback();
  197. }
  198. });
  199. // $("#ComAlert").on('hide.bs.modal', function () { }); // 监听关闭
  200. }
  201. };
  202. // 通用确认弹框
  203. var ComConfirm = {
  204. show:function(msg, callback){
  205. // 弹框初始
  206. $('#ComConfirm .alert').attr('class', 'alert alert-warning');
  207. $('#ComConfirm .alert').html(msg);
  208. $('#ComConfirm').modal('show');
  209. $('#ComConfirm .ok').unbind("click"); // 解绑陈旧事件
  210. $('#ComConfirm .ok').click(function(){
  211. $('#ComConfirm').modal('hide');
  212. if(typeof callback == 'function') {
  213. callback();
  214. return;
  215. }
  216. });
  217. $('#ComConfirm .cancel').click(function(){
  218. $('#ComConfirm').modal('hide');
  219. return;
  220. });
  221. }
  222. };
  223. </script>
  224. </#macro>