agile_board.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>H+ 后台主题UI框架 - 任务清单</title>
  7. <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
  8. <meta name="description" content="H+是一个完全响应式,基于Bootstrap3最新版本开发的扁平化主题,她采用了主流的左右两栏式布局,使用了Html5+CSS3等现代技术">
  9. <link rel="shortcut icon" href="favicon.ico"> <link href="../css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
  10. <link href="../css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
  11. <link href="../css/animate.min.css" rel="stylesheet">
  12. <link href="../css/style.min.css?v=4.1.0" rel="stylesheet">
  13. </head>
  14. <body class="gray-bg">
  15. <div class="wrapper wrapper-content animated fadeInRight">
  16. <div class="row">
  17. <div class="col-sm-4">
  18. <div class="ibox">
  19. <div class="ibox-content">
  20. <h3>任务列表</h3>
  21. <p class="small"><i class="fa fa-hand-o-up"></i> 在列表之间拖动任务面板</p>
  22. <div class="input-group">
  23. <input type="text" placeholder="添加新任务" class="input input-sm form-control">
  24. <span class="input-group-btn">
  25. <button type="button" class="btn btn-sm btn-white"> <i class="fa fa-plus"></i> 添加</button>
  26. </span>
  27. </div>
  28. <ul class="sortable-list connectList agile-list">
  29. <li class="warning-element">
  30. 加强过程管理,及时统计教育经费使用情况,做到底码清楚,
  31. <div class="agile-detail">
  32. <a href="#" class="pull-right btn btn-xs btn-white">标签</a>
  33. <i class="fa fa-clock-o"></i> 2015.09.01
  34. </div>
  35. </li>
  36. <li class="success-element">
  37. 支持财会人员的继续培训工作。
  38. <div class="agile-detail">
  39. <a href="#" class="pull-right btn btn-xs btn-white">标记</a>
  40. <i class="fa fa-clock-o"></i> 2015.05.12
  41. </div>
  42. </li>
  43. <li class="info-element">
  44. 协同教导处搞好助学金、减免教科书费的工作。
  45. <div class="agile-detail">
  46. <a href="#" class="pull-right btn btn-xs btn-white">标记</a>
  47. <i class="fa fa-clock-o"></i> 2015.09.10
  48. </div>
  49. </li>
  50. <li class="danger-element">
  51. 要求会计、出纳人员严格执行财务制度,遵守岗位职责,按时上报各种资料。
  52. <div class="agile-detail">
  53. <a href="#" class="pull-right btn btn-xs btn-primary">确定</a>
  54. <i class="fa fa-clock-o"></i> 2015.06.10
  55. </div>
  56. </li>
  57. <li class="warning-element">
  58. 做好职工公费医疗工作,按时发放门诊费。
  59. <div class="agile-detail">
  60. <a href="#" class="pull-right btn btn-xs btn-white">标签</a>
  61. <i class="fa fa-clock-o"></i> 2015.09.09
  62. </div>
  63. </li>
  64. <li class="warning-element">
  65. 有计划地把课本复习三至五遍。
  66. <div class="agile-detail">
  67. <a href="#" class="pull-right btn btn-xs btn-primary">确定</a>
  68. <i class="fa fa-clock-o"></i> 2015.08.04
  69. </div>
  70. </li>
  71. <li class="success-element">
  72. 看一本高质量的高中语法书
  73. <div class="agile-detail">
  74. <a href="#" class="pull-right btn btn-xs btn-white">标记</a>
  75. <i class="fa fa-clock-o"></i> 2015.05.12
  76. </div>
  77. </li>
  78. <li class="info-element">
  79. 选择一份较好的英语报纸,通过阅读提高英语学习效果。
  80. <div class="agile-detail">
  81. <a href="#" class="pull-right btn btn-xs btn-white">标记</a>
  82. <i class="fa fa-clock-o"></i> 2015.09.10
  83. </div>
  84. </li>
  85. </ul>
  86. </div>
  87. </div>
  88. </div>
  89. <div class="col-sm-4">
  90. <div class="ibox">
  91. <div class="ibox-content">
  92. <h3>进行中</h3>
  93. <p class="small"><i class="fa fa-hand-o-up"></i> 在列表之间拖动任务面板</p>
  94. <ul class="sortable-list connectList agile-list">
  95. <li class="success-element">
  96. 全面、较深入地掌握我们“产品”的功能、特色和优势并做到应用自如。
  97. <div class="agile-detail">
  98. <a href="#" class="pull-right btn btn-xs btn-white">标签</a>
  99. <i class="fa fa-clock-o"></i> 2015.09.01
  100. </div>
  101. </li>
  102. <li class="success-element">
  103. 根据自己以前所了解的和从其他途径搜索到的信息,录入客户资料150家。
  104. <div class="agile-detail">
  105. <a href="#" class="pull-right btn btn-xs btn-white">标记</a>
  106. <i class="fa fa-clock-o"></i> 2015.05.12
  107. </div>
  108. </li>
  109. <li class="warning-element">
  110. 锁定有意向客户20家。
  111. <div class="agile-detail">
  112. <a href="#" class="pull-right btn btn-xs btn-white">标记</a>
  113. <i class="fa fa-clock-o"></i> 2015.09.10
  114. </div>
  115. </li>
  116. <li class="warning-element">
  117. 力争完成销售指标。
  118. <div class="agile-detail">
  119. <a href="#" class="pull-right btn btn-xs btn-white">标签</a>
  120. <i class="fa fa-clock-o"></i> 2015.09.09
  121. </div>
  122. </li>
  123. <li class="info-element">
  124. 在总结和摸索中前进。
  125. <div class="agile-detail">
  126. <a href="#" class="pull-right btn btn-xs btn-primary">确定</a>
  127. <i class="fa fa-clock-o"></i> 2015.08.04
  128. </div>
  129. </li>
  130. <li class="success-element">
  131. 不断学习行业知识、产品知识,为客户带来实用介绍内容
  132. <div class="agile-detail">
  133. <a href="#" class="pull-right btn btn-xs btn-white">标记</a>
  134. <i class="fa fa-clock-o"></i> 2015.05.12
  135. </div>
  136. </li>
  137. <li class="danger-element">
  138. 先友后单:与客户发展良好友谊,转换销售员角色,处处为客户着想
  139. <div class="agile-detail">
  140. <a href="#" class="pull-right btn btn-xs btn-white">标记</a>
  141. <i class="fa fa-clock-o"></i> 2015.11.04
  142. </div>
  143. </li>
  144. </ul>
  145. </div>
  146. </div>
  147. </div>
  148. <div class="col-sm-4">
  149. <div class="ibox">
  150. <div class="ibox-content">
  151. <h3>已完成</h3>
  152. <p class="small"><i class="fa fa-hand-o-up"></i> 在列表之间拖动任务面板</p>
  153. <ul class="sortable-list connectList agile-list">
  154. <li class="info-element">
  155. 制定工作日程表
  156. <div class="agile-detail">
  157. <a href="#" class="pull-right btn btn-xs btn-white">标记</a>
  158. <i class="fa fa-clock-o"></i> 2015.09.10
  159. </div>
  160. </li>
  161. <li class="warning-element">
  162. 每天坚持打40个有效电话,挖掘潜在客户
  163. <div class="agile-detail">
  164. <a href="#" class="pull-right btn btn-xs btn-white">标签</a>
  165. <i class="fa fa-clock-o"></i> 2015.09.09
  166. </div>
  167. </li>
  168. <li class="warning-element">
  169. 拜访客户之前要对该客户做全面的了解(客户的潜在需求、职位、权限以及个人性格和爱好)
  170. <div class="agile-detail">
  171. <a href="#" class="pull-right btn btn-xs btn-white">标签</a>
  172. <i class="fa fa-clock-o"></i> 2015.09.09
  173. </div>
  174. </li>
  175. <li class="warning-element">
  176. 提高自己电话营销技巧,灵活专业地与客户进行电话交流
  177. <div class="agile-detail">
  178. <a href="#" class="pull-right btn btn-xs btn-primary">确定</a>
  179. <i class="fa fa-clock-o"></i> 2015.08.04
  180. </div>
  181. </li>
  182. <li class="success-element">
  183. 通过电话销售过程中了解各盛市的设备仪器使用、采购情况及相关重要追踪人
  184. <div class="agile-detail">
  185. <a href="#" class="pull-right btn btn-xs btn-white">标记</a>
  186. <i class="fa fa-clock-o"></i> 2015.05.12
  187. </div>
  188. </li>
  189. </ul>
  190. </div>
  191. </div>
  192. </div>
  193. </div>
  194. </div>
  195. <script src="../js/jquery.min.js?v=2.1.4"></script>
  196. <script src="../js/bootstrap.min.js?v=3.3.6"></script>
  197. <script src="../js/jquery-ui-1.10.4.min.js"></script>
  198. <script src="../js/content.min.js?v=1.0.0"></script>
  199. <script>
  200. $(document).ready(function(){$(".sortable-list").sortable({connectWith:".connectList"}).disableSelection()});
  201. </script>
  202. </body>
  203. </html>