<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>KGCMS企业应用管理平台 - Powered by KGCMS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="renderer" content="webkit">
<!-- <meta http-equiv="cache-control" content="no-siteapp" /> -->
<link rel="stylesheet" href="{{ kg['tpl_url'] }}style/message_manage_reply.css">
<script src="{{ kg['tpl_url'] }}script/jquery.min.js"></script>
<script src="{{ kg['server']['HTTP_HOST'] }}/tools/amazeui/js/amazeui.min.js"></script>
<script src="{{ kg['server']['HTTP_HOST'] }}/tools/ueditor/ueditor.config.js?dir=article"></script>
<script src="{{ kg['server']['HTTP_HOST'] }}/tools/ueditor/ueditor.all.js"></script>
<script src="{{ kg['server']['HTTP_HOST'] }}/tools/ueditor/lang/zh-cn/zh-cn.js"></script>
<script src="{{kg['tpl_url']}}script/cropper.min.js"></script>
<script src="{{kg['tpl_url']}}script/amazeui.datetimepicker.min.js"></script>
<script src="{{kg['tpl_url']}}script/common.js"></script>
</head>
<body data-type="generalComponents">
	{% include 'component_header.tpl' %}
	<div class="tpl-page-container tpl-page-header-fixed">
		<div class="scrollbar-wrap">
		{% include 'component_left.tpl' %}
		<div class="tpl-content-wrapper">
			<div class="tpl-content-page-title">
				消息推送
			</div>
			<ol class="am-breadcrumb">
				<li><a href="#" class="am-icon-home">首页</a></li>
				<li><a href="message_manage">信息管理</a></li>
				<li class="am-active">聊天信息管理</li>
			</ol>
			<div class="tpl-portlet-components">
				<div class="portlet-title">
					<div class="caption font-green bold">
						<span class="am-icon-code"></span>&nbsp;与&nbsp;{{fans['nickname']}}&nbsp;的聊天中
					</div>
					<div class="tpl-portlet-input tpl-fz-ml am-select-hover am-no-margintop ngsty-boxR">
						<form action="" method="post">
							<input type="hidden" name="action" value="material">
							<!-- 按钮 -->
							<div class="ngar-xiugai-width portlet-input input-small input-inline " style="float: right;width: auto !important;">
								<div class="input-icon right am-fr top-1">
									<div class="am-btn-group am-btn-group-xs">
										<button href="#" type="submit" class="am-btn am-btn-secondary ng-add-hightB"><span class="am-icon-book"></span>&nbsp;发送素材</button>
										<a href="#" class="am-btn am-btn-success"><span class="am-icon-retweet"></span>&nbsp;更新缓存</a>
									</div>
								</div>
							</div>
							<!-- 选择素材 -->
							<div class="am-form-group am-fl am-select-hover am-no-marginbtm am-no-outline" style="margin-right:10px;float: right;">
								<span>给&nbsp;{{fans['nickname']}}&nbsp;推送素材</span>
								<select data-am-selected="{sbtnSize: 'sm'}" name="material">
									<option value="0">选择素材</option>
									{% for row in material %}
									<option value="{{row['id']}}">{{row['name']}}</option>
									{% endfor %}
								</select>
							</div>
						</form>
					</div>
				</div>
				<input type="hidden" id="data_id" value=""/>
				<div class="tpl-block ">
					<div class="am-g">
						<div class="tpl-form-body tpl-form-line">
							<form method="post" action="" class="am-form tpl-form-line-form" id="form-sublime">
								<div style="border: 1px solid #d4d4d4;border-radius: 4px;">
									<div class="am-form-group" style="border-bottom: 1px solid #d4d4d4;background: #f5f5f5;"><label for="Template" class="am-u-md-12 am-form-label" style="text-align: left;padding: 10px 15px !important;">给&nbsp;{{fans['nickname']}}&nbsp;发送文本消息</label></div>
									<div class="am-form-group">
										<div class="am-u-md-12  am_fl_zi_tihuan" style="padding-left: 1.5rem !important;">
											<textarea type="text" placeholder="" id="Introduction" name="content" style="border: 1px solid #d4d4d4;border-radius: 4px;height: 120px;padding: 6px;"></textarea>
										</div>
									</div>
									<input type="hidden" name="action" value="text">
									<div class="am-form-group">
										<div class="am-u-sm-12" style="padding-left: 1.5rem !important;">
											<button type="submit" class="am-btn am-btn-primary tpl-btn-bg-color-success" id="">发送</button>
											<div style="float: right;font-size: 16px;color: #888;">还可以输入&nbsp;600&nbsp;个字符</div>
										</div>
									</div>
								</div>
								<table class="ngco-Kfubox am-table am-table-striped am-table-hover table-main ngco-Esz-mgibdr" style="padding-top: 20px !important;">
									<thead>
										<tr>
											<th class="table-check" colspan="2">最近30条聊天记录<a href="message_manage?msgid={{id}}" style="margin-left: 20px;">查看与该用户全部聊天记录</a></th>
										</tr>
									</thead>
									<tbody id="message">
									{% for row in message %}
										<tr>
											<td>
												<ul data-am-widget="gallery" class="am-gallery sm-block-grid-2 md-block-grid-3 lg-block-grid-4 am-gallery-bordered  am-no-layout" data-am-gallery="{ pureview: true }" style="display: inline-block">
													<li><img src="{% if row['type'] > 20 %}{{kg['tpl_url']}}images/member.png{% else %}{{row['headimgurl']}}{% endif %}" alt="" style="height: 46px" data-am-pureviewed="1"></li>
												</ul>
												<div style="display: inline-block; vertical-align: middle;">
													<div>{% if row['type'] > 20 %}管理员{% else %}{{row['nickname']}}{% endif %}</div>
													<div>
														{%- if row['type'] == 2 -%}
														图片消息：<img src="{{row['content']}}" style="height: 40px;">
														{%- elif row['type'] == 3 -%}
														语音消息：<a href="{{row['content']}}" download="">{{row['content']}}</a>
														{%- elif row['type'] == 4 -%}
														视频消息：<a href="{{row['content']}}" target="_blank">视频</a>
														{%- else -%}
														{{row['content']}}
														{%- endif -%}
													</div>
												</div>
											</td>
											<td>
												<div>{{row['addtime']}}</div>

												<div>{{row['day']}}</div>
											</td>
										</tr>
									{% endfor %}
									</tbody>
								</table>
							</form>
						</div>
					</div>
				</div>
			</div>
			{% include 'component_footer.tpl' %}
		</div>
		</div><!-- /.scrollbar-wrap -->
	</div>
</body>
<script>
	$(function(){
		var msg_count = {{count}}
		setInterval(function(){
            var formData = new FormData();
			formData.append("action", 'getcount');
			formData.append("count", msg_count);
			formData.append("openid", '{{fans['openid']}}');
			$.ajax({
				scriptCharset: 'UTF-8',
				type: 'post',
				url: '',
				data: formData,
				cache: false,
				processData: false,
				contentType: false,
				dataType : "json",
			}).success(function(data) {
				if(data.status == 1){
					alert(data.msg)
					window.location.href='message_manage'
				}else {
					if (data.new > 0) {
						for (var i = 0; i < data.msg.length; i++) {
							if (data.msg[i].type > 20) {
								var headimgurl = "{{kg['tpl_url']}}images/member.png"
								var nickname = '管理员'
							} else {
								var headimgurl = data.msg[i].headimgurl
								var nickname = data.msg[i].nickname
							}
							var content = data.msg[i].content
							if (data.msg[i].type == 2) {
								content = '图片消息：<img src="' + content + '" style="height: 40px;">'
							}
							if (data.msg[i].type == 3) {
								content = '语音消息：<a href="' + content + '" download="">' + content + '</a>'
							}
							if (data.msg[i].type == 4) {
								content = '视频消息：<a href="' + content + '" target="_blank">视频</a>'
							}
							var line = '<tr>' +
									'<td>' +
									'<ul data-am-widget="gallery" class="am-gallery sm-block-grid-2 md-block-grid-3 lg-block-grid-4 am-gallery-bordered  am-no-layout" data-am-gallery="{ pureview: true }" style="display: inline-block">' +
									'<li><img src="' + headimgurl + '" alt="" style="height: 46px" data-am-pureviewed="1"></li>' +
									'</ul>' +
									'<div style="display: inline-block; vertical-align: middle;">' +
									'<div>' + nickname + '</div>' +
									'<div>' + content + '</div>' +
									'</div>' +
									'</td>' +
									'<td>' +
									'<div>' + data.msg[i].addtime + '</div>' +
									'<div>' + data.msg[i].day + '</div>' +
									'</td>' +
									'</tr>'
							var trs = $('#message tr')
							if (trs.length == 0) {
								$('#message').append(line)
							} else {
								$('#message tr').eq(0).before(line)
							}
							msg_count += 1
						}
					}
				}

			}).error(function() {
				alert("请求失败");
			});
        }, 1000);
	})
</script>
</html>