<!-- Bread crumb is created dynamically -->
<!--
	The ID "widget-grid" will start to initialize all widgets below 
	You do not need to use widgets if you dont want to. Simply remove 
	the <section></section> and you can use wells or panels instead 
	-->

<!-- widget grid -->
<section id="widget-grid" class="">

	<!-- row -->
	<div class="row">

		<!-- NEW WIDGET START -->
		<article class="col-xs-12 col-sm-12 col-md-12 col-lg-12">

			<!-- Widget ID (each widget will need unique ID)-->
			<div class="jarviswidget" id="wid-id-4">
				<!-- widget options:
                usage: <div class="jarviswidget" id="wid-id-0" data-widget-editbutton="false">

                data-widget-colorbutton="false"
                data-widget-editbutton="false"
                data-widget-togglebutton="false"
                data-widget-deletebutton="false"
                data-widget-fullscreenbutton="false"
                data-widget-custombutton="false"
                data-widget-collapsed="true"
                data-widget-sortable="false"

                -->
				<header>
					<span class="widget-icon"> <i class="fa fa-table"></i> </span>
					<h2>消息列表555555555555555</h2>
				</header>
				<!-- widget div-->
				<div>
					<!-- widget edit box -->
					<div class="jarviswidget-editbox">
						<!-- This area used as dropdown edit box -->
					</div>
					<!-- end widget edit box -->
					<!-- widget content -->
					<div class="widget-body no-padding">
						<div class="table-responsive">
							<table class="table table-striped table-condensed table-hover smart-form has-tickbox">
								<thead>
									<tr>
										<th>
											<label class="checkbox">
												<input type="checkbox" name="checkbox-inline">
												<i></i>
											</label>
										</th>
										<th>标题内容</th>
										<th>提交时间</th>
										<th>消息类型</th>
									</tr>
								</thead>
								<tbody>
									<tr ng-repeat="msg in messageList"  ng-if="messageList.length > 0">
										<td>
											<label class="checkbox">
												<input type="checkbox" name="checkbox-inline">
												<i></i>
											</label>
										</td>
										<td ng-bind="msg.title"></td>
										<td ng-bind="msg.createDateTime | date : 'yyyy-MM-dd hh:mm:ss'"></td>
										<td ng-bind="msg.categoryName"></td>
									</tr>
									<tr ng-if="messageList == null || messageList.length == 0">
										<td colspan="4">
											<div>暂无消息数据</div>
										</td>
									</tr>
								</tbody>
							</table>
							<div class="dt-toolbar-footer">
								<div class="col-xs-12 col-sm-6">
									<div class="dataTables_info" id="dt_basic_info" role="status" aria-live="polite">
										Showing <span class="txt-color-darken">1</span> to <span class="txt-color-darken">10</span> of <span class="text-primary">100</span> entries</div></div>
								<div class="col-xs-12 col-sm-6">
									<div class="dataTables_paginate paging_simple_numbers" id="dt_basic_paginate">
										<ul class="pagination pagination-sm">
											<li class="paginate_button previous disabled" aria-controls="dt_basic" tabindex="0" id="dt_basic_previous">
												<a href="#">Previous</a></li>
											<li class="paginate_button active" aria-controls="dt_basic" tabindex="0">
												<a href="#">1</a>
											</li>
											<li class="paginate_button " aria-controls="dt_basic" tabindex="0"><a href="#">2</a></li>
											<li class="paginate_button " aria-controls="dt_basic" tabindex="0"><a href="#">3</a></li>
											<li class="paginate_button " aria-controls="dt_basic" tabindex="0"><a href="#">4</a></li>
											<li class="paginate_button " aria-controls="dt_basic" tabindex="0"><a href="#">5</a></li>
											<li class="paginate_button disabled" aria-controls="dt_basic" tabindex="0" id="dt_basic_ellipsis"><a href="#">…</a></li>
											<li class="paginate_button " aria-controls="dt_basic" tabindex="0"><a href="#">10</a></li>
											<li class="paginate_button next" aria-controls="dt_basic" tabindex="0" id="dt_basic_next"><a href="#">Next</a></li>
										</ul>
									</div>
								</div>
							</div>
						</div>
					</div>
					<!-- end widget content -->
				</div>
				<!-- end widget div -->
			</div>
			<!-- end widget -->
		</article>
		<!-- WIDGET END -->
	</div>
	<!-- end row -->
</section>
<!-- end widget grid -->