sent.html 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287
  1. {extend name="public/layout" /} {block name="title"}日报{/block} {block name="body"}
  2. <link rel="stylesheet" type="text/css" href="__STATIC__/css/csspc.css"/>
  3. <link rel="stylesheet" type="text/css" href="__STATIC__/css/redesign.css"/>
  4. <style type="text/css">
  5. html,
  6. body {
  7. display: block;
  8. min-width: 1100px;
  9. width: 100%;
  10. height: 100%;
  11. overflow: hidden;
  12. }
  13. body{
  14. padding: 15px;
  15. box-sizing: border-box;
  16. }
  17. .layui-fluid {
  18. max-height: 100%;
  19. display: block;
  20. box-shadow: 0 0 4px 0 #B6CADE;
  21. border-radius: 5px;
  22. margin: 0;
  23. background-color: #ffffff;
  24. overflow: hidden;
  25. padding: 0;
  26. box-sizing: border-box;
  27. position: relative;
  28. }
  29. .layui-tab {
  30. padding: 28px 24px 0px 30px;
  31. position: absolute;
  32. top: 0;
  33. left: 0;
  34. width: 100%;
  35. margin: 0;
  36. height: auto;
  37. background-color: #ffffff;
  38. z-index: 10;
  39. font-size: 16px;
  40. line-height: 16px;
  41. }
  42. .layui-tab-title{
  43. display: block;
  44. border-color:#eee;
  45. padding-bottom: 5px;
  46. height: auto;
  47. }
  48. .layui-tab-title li{
  49. font-size: 16px;
  50. position: relative;
  51. line-height: 16px;
  52. padding: 0;
  53. margin-left: 30px;
  54. min-width: auto;
  55. padding-bottom: 0;
  56. }
  57. .layui-tab-title li:first-child{
  58. margin-left: 0;
  59. }
  60. .layui-tab-title .layui-this:after{
  61. border-width: 0;
  62. }
  63. .layui-tab-title .layui-this{
  64. color: #41abfc;
  65. position: relative;
  66. padding-bottom: 11px;
  67. }
  68. .layui-tab-title li a{
  69. display: block;
  70. width: 100%;
  71. height: 100%;
  72. padding-bottom: 11px;
  73. position: relative;
  74. }
  75. .layui-tab-title .layui-this::before{
  76. content: ' ';
  77. display: block;
  78. width: 100%;
  79. height: 3px;
  80. background-color: #249efb;
  81. position: absolute;
  82. left: 0;
  83. bottom: 4px;
  84. }
  85. .layui-card-body{
  86. display: block;
  87. width: 100%;
  88. height: 100%;
  89. padding: 0;
  90. padding-top: 61px;
  91. }
  92. #LAY_demo1{
  93. display: block;
  94. width: 100%;
  95. height: 100%;
  96. overflow: auto;
  97. padding: 0 24px 0 30px;
  98. }
  99. p.daytext{
  100. padding-bottom: 8px;
  101. border-bottom: 1px solid #eee;
  102. }
  103. #LAY_demo1 ul{
  104. padding: 0 20px;
  105. }
  106. /*webkit内核*/
  107. .scroll_content::-webkit-scrollbar {
  108. width:0px;
  109. height:0px;
  110. }
  111. .scroll_content::-webkit-scrollbar-button {
  112. background-color:rgba(0,0,0,0);
  113. }
  114. .scroll_content::-webkit-scrollbar-track {
  115. background-color:rgba(0,0,0,0);
  116. }
  117. .scroll_content::-webkit-scrollbar-track-piece {
  118. background-color:rgba(0,0,0,0);
  119. }
  120. /* 滚动条 */
  121. .scroll_content::-webkit-scrollbar-thumb{
  122. background-color:#aaa;
  123. border-radius: 3px;
  124. }
  125. .scroll_content::-webkit-scrollbar-corner {
  126. background-color:rgba(0,0,0,0);
  127. }
  128. .scroll_content::-webkit-scrollbar-resizer {
  129. background-color:rgba(0,0,0,0);
  130. }
  131. .scroll_content::-webkit-scrollbar {
  132. width:7px;
  133. border-radius: 3px;
  134. }
  135. /*o内核*/
  136. .scroll_content::-o-scrollbar{
  137. -moz-appearance: none !important;
  138. background: rgba(0,255,0,0) !important;
  139. }
  140. .scroll_content::-o-scrollbar-button {
  141. background-color:rgba(0,0,0,0);
  142. }
  143. .scroll_content::-o-scrollbar-track {
  144. background-color:rgba(0,0,0,0);
  145. }
  146. .scroll_content::-o-scrollbar-track-piece {
  147. background-color:rgba(0,0,0,0);
  148. }
  149. /* 滚动条 */
  150. .scroll_content::-o-scrollbar-thumb{
  151. background-color:#aaa;
  152. border-radius: 3px;
  153. }
  154. .scroll_content::-o-scrollbar-corner {
  155. background-color:rgba(0,0,0,0);
  156. }
  157. .scroll_content::-o-scrollbar-resizer {
  158. background-color:rgba(0,0,0,0);
  159. }
  160. /*IE10,IE11,IE12*/
  161. .scroll_content{
  162. -ms-scroll-chaining: chained;
  163. -ms-overflow-style: none;
  164. -ms-content-zooming: zoom;
  165. -ms-scroll-rails: none;
  166. -ms-content-zoom-limit-min: 100%;
  167. -ms-content-zoom-limit-max: 500%;
  168. -ms-scroll-snap-type: proximity;
  169. -ms-scroll-snap-points-x: snapList(100%, 200%, 300%, 400%, 500%);
  170. -ms-overflow-style: none;
  171. overflow: auto;
  172. }
  173. </style>
  174. <body>
  175. <div class="layui-fluid">
  176. <div class="layui-tab">
  177. <ul class="layui-tab-title">
  178. <li style="padding-bottom: 0;">
  179. <a href="{:url('dailyWork/work')}">汇报</a>
  180. </li>
  181. <li class="layui-this" style="padding-bottom: 11px;">
  182. 我发送的
  183. </li>
  184. <li style="padding-bottom: 0;">
  185. <a href="{:url('dailyWork/received')}">我收到的</a>
  186. </li>
  187. </ul>
  188. </div>
  189. <div class="layui-card-body">
  190. <ul class="flow-default scroll_content" id="LAY_demo1" ></ul>
  191. </div>
  192. </div>
  193. </body>
  194. {/block} {block name="js"}
  195. <script>
  196. layui.config({
  197. base: '__LAYUI__/',
  198. urlbase: '/sys'
  199. }).extend({
  200. index: 'lib/index' //主入口模块
  201. }).use(['index', 'table', 'flow'], function() {
  202. var $ = layui.$,
  203. flow = layui.flow,
  204. form = layui.form;
  205. flow.load({
  206. elem: '#LAY_demo1',
  207. scrollElem: '#LAY_demo1',
  208. done: function(page, next) { //执行下一页的回调
  209. //模拟数据插入
  210. setTimeout(function() {
  211. var lis = [];
  212. var count = 0;
  213. $.ajax({
  214. type:"get",
  215. url:"{:url('dailyWork/list')}?page="+page+"&option=sent",
  216. async:true,
  217. success:function(rs){
  218. var listhtml='';
  219. for( var i in rs.data)
  220. {
  221. listhtml+='<dd>';
  222. listhtml+='<p class="daytext font24 mdt26 huise333">'+i+'</p>';
  223. listhtml+='<ul class="mdt11 ">';
  224. for(var j = 0;j<rs.data[i].length;j++ ){
  225. listhtml+='<li data-id="'+rs.data[i][j].id+'" class="wpsr mdt15 everydailybox">';
  226. listhtml+='<div class="width80_"><div class="woverflow">';
  227. listhtml+='<p class="wleft font18 textb huise333">'+rs.data[i][j].name+'</p></div>';
  228. if(rs.data[i][j].type == 'day')
  229. {
  230. listhtml+='<p class="font16 mdt03 huise666 lh24 ">今日工作计划:'+rs.data[i][j].current_work+'</p>';
  231. listhtml+='<p class="font16 mdt08 huise666 lh24 ">明日工作计划:'+rs.data[i][j].next_plan+'</p>';
  232. }else if(rs.data[i][j].type == 'week'){
  233. listhtml+='<p class="font16 mdt03 huise666 lh24 ">本周工作计划:'+rs.data[i][j].current_work+'</p>';
  234. listhtml+='<p class="font16 mdt08 huise666 lh24 ">下周工作计划:'+rs.data[i][j].next_plan+'</p>';
  235. }else{
  236. listhtml+='<p class="font16 mdt03 huise666 lh24 ">本月工作计划:'+rs.data[i][j].current_work+'</p>';
  237. listhtml+='<p class="font16 mdt08 huise666 lh24 ">下月工作计划:'+rs.data[i][j].next_plan+'</p>';
  238. }
  239. listhtml+='</div><p class="wpsa layui-send-tiem huiseaaa font16">'+ rs.data[i][j].addtime.split(' ')[1]+'</p>';
  240. listhtml+='</li>';
  241. }
  242. listhtml+='</ul>';
  243. listhtml+='</dd>';
  244. }
  245. lis.push(listhtml);
  246. next(lis.join(''), page < rs.page); //假设总页数为 10
  247. opendaily();
  248. $("#LAY_demo1").height($('.layui-fluid').height()-61)
  249. }
  250. });
  251. //执行下一页渲染,第二参数为:满足“加载更多”的条件,即后面仍有分页
  252. //pages为Ajax返回的总页数,只有当前页小于总页数的情况下,才会继续出现加载更多
  253. }, 500);
  254. }
  255. });
  256. function opendaily(){
  257. $('.everydailybox').click(function(){
  258. var id = $(this).data('id');
  259. layer.open({
  260. type: 2,
  261. title: false,
  262. content: '{:url("dailyWork/details")}?category=sent&id='+id,
  263. maxmin: true,
  264. area: ['50%', '80%'],
  265. });
  266. })
  267. }
  268. });
  269. </script>
  270. {/block}