dev_oa/app/home/view/admin/log_list.html

{extend name="common/base"/}
{block name="style"}
<style type="text/css">
.latest-news{padding-top: 12px; padding-bottom:30px; padding-left: 20px; position: relative;}
.latest-news .layui-timeline-title{padding-bottom:0; font-size: 14px;}
.latest-news .layui-timeline-item{padding-bottom:5px;}
.layui-timeline-title span{color:#999}
.panel-more{width: 100%; height:48px; line-height: 48px; text-align: center; position: absolute; bottom: 0; left:0;}
.panel-more a{color:#0088FF}
</style>
{/block}
<!-- 主体 -->
{block name="body"}
<div class="body-content" style="padding: 20px;">
<div class="h3-title">员工动态</div>
	<div class="latest-news">
		<ul class="layui-timeline" id="logs"></ul>
		<div class="panel-more"><a href="javascript:getLogs();">查看更多动态</a></div>
	</div>
</div>
{/block}
<!-- /主体 -->

<!-- 脚本 -->
{block name="script"}
<script>
	var page=1,limit=20;
	function getLogs() {
		$.ajax({
			url: "/home/api/get_log_list",
			type: 'post',
			data: {
				page:page,
				limit: limit
			},
			success: function(e) {
				if (e.code == 0) {
					var html = '';
					if(e.data.length>0){
						page++;
						$.each(e.data, function(key, value) {
							html += '<li class="layui-timeline-item">\
										<i class="layui-icon layui-timeline-axis"></i>\
										<div class="layui-timeline-content layui-text">\
										  <div class="layui-timeline-title"><span title="'+value.id+'">'+value.times+'</span>，'+value.content+'</div>\
										</div>\
									  </li>';
						});
						$('#logs').append(html);
					}else{
						$('.panel-more').remove();
					}
				}
			}
		})
	}
	getLogs();
</script>
{/block}
<!-- /脚本 -->