duhongyu
/
ShuangHui_UI


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254
							<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="./js/laydate/laydate.js"></script>
		<script src="./Script/Common/huayi.load.js"></script>
		<script src="./Script/Common/huayi.config.js"></script>
		<link rel="stylesheet" href="./css/init.css" />
		<title>微信多客服聊天</title>
		<style>
			.clearfix:after {
				content: "";
				display: block;
				clear: both;
			}
			
			.toolBar {
				padding: 15px 0;
				border-bottom: 1px solid #ccc;
				margin-bottom: 25px;
				padding-right: 45px;
			}
			
			.toolBar input {
				width: 145px;
				padding: 2px 2PX 2PX 10PX;
				height: 28px;
				border: 1px solid #ebebeb;
				color: #1ab394;
				outline: none;
				vertical-align: middle;
			}
			
			.model {
				position: fixed;
				top: 0;
				right: 0;
				bottom: 0;
				left: 0;
				height: 100%;
				width: 100%;
				background: rgba(0, 0, 0, 0.48);
				z-index: 100;
				display: none;
			}
			
			.delModel .box {
				width: 22%;
			}
			
			.box {
				width: 30%;
				margin: 0 auto;
				margin-top: 5%;
			}
			
			.box .btop {
				height: 35px;
				background: #1ab394;
				color: #fff;
				line-height: 35px;
				padding: 0 15px;
				/*margin-bottom: 15px;*/
			}
			
			.box .btop p.btl {
				float: left;
				margin: 0;
			}
			
			.box .btop p.btr {
				float: right;
				cursor: pointer;
				margin: 0;
				font-size: 20px;
			}
			
			.box>input {
				display: block;
				height: 34px;
				padding: 6px 12px;
				font-size: 14px;
				line-height: 1.42857143;
				color: #555;
				background-color: #fff;
				background-image: none;
				border: 1px solid #ccc;
				border-radius: 4px;
				margin: 35px auto;
			}
			
			.boxCon {
				width: 100%;
				background: #fff;
				text-align: center;
				padding: 10px 15px;
				height: auto;
				overflow-y: auto;
			}
			
			.boxCon>div {
				padding: 15px 0;
			}
			
			.boxCon table th {
				padding: 5px 8px 5px 0;
				text-align: right;
				width: 32%;
			}
			
			.boxCon table td {
				padding: 6px 0 5px 10px;
				text-align: left;
				color: #717171;
				line-height: 200%;
			}
			
			.kong {
				display: none;
			}
		</style>
	</head>

	<body>
		<div class="container-fluid">
			<div class="daoHang clearfix">
				<div class="dhLeft">
					<sapn><i class="syIcon"></i>位置：
						<a href="../index.html">首页</a>&gt;
						<!--<a href="javaScript:;">客户管理</a>&gt;-->
						<a href="" style="color: #000;">微信多客服聊天</a>
					</sapn>
				</div>
			</div>
			<div class="toolBar clearfix">
				<div class="toolRight" style="float: right;">

					<span>开始时间：<input type="text"  id="startTime"/></span>
					<span>结束时间：<input type="text"  id="endTime"/></span>
					<button class="btns search">搜索</button>
				</div>
			</div>
			<div class="tableBox">
				<table id="table1" class="table table-hover table-striped table-bordered table-condensed">
					<thead>
						<tr>
							<th>ID</th>
							<th>粉丝openID</th>
							<th>发送方</th>
							<th>接收方</th>
							<th>消息时间</th>
							<th>消息内容</th>
						</tr>
					</thead>
					<tbody>

					</tbody>

				</table>
				<button class="btns pageLast" onclick="goLast(0);"><i class="fa fa-angle-left" style="margin-right: 5px;"></i>上一页</button>
				<button class="btns pageNext" onclick="goLast(1);">下一页<i class="fa fa-angle-right" style="margin-left: 5px;"></i></button>
			</div>
		</div>

		<script>
			var token = $.cookie("token");
			var pageIndex = 1;//页数
			var page_count;//请求后数据条数
			var starttime;
			var endtime;
			var start;
			laydate.render({
				elem: '#startTime',
				event: 'focus',
				type: 'datetime',
				theme: 'molv'
			});
			laydate.render({
				elem: '#endTime',
				event: 'focus',
				type: 'datetime',
				theme: 'molv'
//				change: function(value, date, endDate){
//				    console.log(value); //得到日期生成的值，如：2017-08-18
//				    console.log(date); //得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
//				    start=$('#startTime').val();  
//				}
			});
			$('.search').click(function(){
				getTR(pageIndex); 
			})
			
			var table = $('#table1');
			getTR(pageIndex)
			function getTR(pageIndex) {
				
				$.ajax({
					type: "get",
					url: huayi.config.callcenter_url + "WxCustom/GetRecordList",
					async: true,
					dataType: 'json',
					data: {
						token: $.cookie("token"),
						starttime: $('#startTime').val(),
						endtime: $('#endTime').val(),
						pagesize: 10,
						pageindex: pageIndex
					},
					success: function(data) {
						var con = data.rows;
						$('#table1 tbody').html('');
						$(con).each(function(i, n) {
							$('<tr>' +
								'<td>' + parseInt(i + 1) + '</td>' +
								'<td>' + n.openid + '</td>' +
								'<td>' + n.sender + '</td>' +
								'<td>' + n.receiver + '</td>' +
								'<td>' + n.time + '</td>' +
								'<td>' + n.text + '</td>' +
								'</tr>').appendTo('#table1 tbody')
						})
							page_count=con.length;
							if(con.length==0){
								page_count=0;
								$('<tr>' +
								'<td colspan="6" style="text-align: center;">已无数据！请返回上一页...</td>' +
								'</tr>').appendTo('#table1 tbody')
							}
					}
				});

			}
			function goLast(action) {
				console.log(page_count);
				if(action == 0) {
					//上一页
					pageIndex--;
					if(pageIndex == 0)
						pageIndex = 1;
				} else if(action == 1) {
					//下一页
					if(page_count==0){
						pageIndex=pageIndex;
					}else{
							pageIndex++;
					}
				}
				getTR(pageIndex); 
			}
		</script>
	</body>

</html>