{extend name="admin/base" /}
{block name="resources"/}
<style>
.step_0{text-align:center;margin-top:100px;}
.reply-div{border:1px solid #d3d3d3;width:360px;padding:15px;margin-top:20px;}
.cover-div{background:#f5f5f5;position:relative;}
.cover-title{position:absolute;left:0;bottom:0;background:#000;color:#fff;width:350px;padding:5px;opacity:0.6;}
.cover-pic{max-width:360px;max-height:200px;margin:auto;display:block;}
.reply-one p,h5{padding:3px 0;}
.reply-one p{color:#999;font-size:13px;}
ul.reply-more li{border-bottom:1px solid #d3d3d3;padding:10px 0;}
ul.reply-more li:after{content:'';clear:both;display:block;}
ul.reply-more li:last-child{border-bottom:0px solid #d3d3d3;padding-bottom:0;}
ul.reply-more li:first-child{padding-top:0;}
.media-div-l{width:270px;margin-right:10px;float:left;}
.media-div-r{width:80px;float:right;}
.media-img{max-width:80px;max-height:200px;margin:auto;display:block;}
.media-button{border:1px solid #d3d3d3;width:390px;border-top:0px solid #d3d3d3;background:#e7e7eb;display:table;}
.media-button a{display:inline-block;width:194.5px;text-align:center;padding:10px 0;}
.media-button a:first-child{border-right:1px solid #d3d3d3;}
</style>
{/block}
{block name="main"}
<!-- 关注时回复 -->
<div class="set-style">
	<dl>
		<dt>关键词:</dt>
		<dd>
			<p><input name="UserCode" id="key" type="text" value="{$info['key']}"> </p>
			<p class="error">请输入关键词</p>
		</dd>
	</dl>
	<dl>
		<dt>匹配类型:</dt>
		<dd>
			<p><label for="match_type1"><input name="match_type" id="match_type1" type="radio" value="1" {eq name="info['match_type']" value="1"}checked{/eq}> 模糊匹配</label></p>
			<p><label for="match_type2"><input name="match_type" id="match_type2" type="radio" value="2" {eq name="info['match_type']" value="2"}checked{/eq}> 全部匹配</label></p>
			<p class="error">请选择匹配类型</p>
		</dd>
	</dl>
	<dl>
		<dt>回复内容:</dt>
		<dd>
			{empty name="info['madie_info']"}
				<p class="key_data_a" {empty name="info['media_info']"}style="display:block;"{else /}style="display:none;"{/empty}>您还未选择回复内容，<a href="javascript:;" onclick="showMaterial()">立即选择</a></p>
			{/empty}
			<div id="key_data">
			<div class="step_1" {empty name="info['media_info']"}style="display:none;"{else /}style="display:block;"{/empty}>
			{notempty name="info['media_info']"}
							{eq name="info['media_info']['type']" value="1"}
								<div class="reply-div">
									<div class="reply-text">
										<p>{$info['media_info']['title']}</p>
									</div>
								</div>
							{/eq}
							{eq name="info['media_info']['type']" value="2"}
								<div class="reply-div">
									<div class="reply-one">
										<h5>{$info['media_info']['title']}</h5>
										<p>xx月xx日</p>
										<div class="cover-div"><img class="cover-pic" src="__UPLOAD__/{$info['media_info']['item_list'][0]['cover']}"></div>
										<p>{$info['media_info']['item_list'][0]['summary']}</p>
									</div>
								</div>
							{/eq}
							{eq name="info['media_info']['type']" value="3"}
								<div class="reply-div">
									<ul class="reply-more">
									{foreach name="info['media_info']['item_list']" item="v" key="k"}
										{eq name="k" value="0"}
											<li>
												<div class="cover-div">
													<img class="cover-pic" src="__UPLOAD__/{$v['cover']}">
													<p class="cover-title">{$v['title']}<p>
												</div>
											</li>
										{/eq}
										{gt name="k" value="0"}
											<li>
												<div class="media-div-l"><p class="media-title">{$v['title']}</p></div>
												<div class="media-div-r"><img class="media-img" src="__UPLOAD__/{$v['cover']}"></div>
											</li>
										{/gt}
									{/foreach}
									</ul>
								</div>
							{/eq}
			{/notempty}
			<div class="media-button">
			<a class="" href="javascript:;" onclick="showMaterial()">修改</a>
			<a class="" href="javascript:;" onclick="delReply()">删除</a>
		</div>
				</div>
			</div>
		</dd>
	</dl>
	<button class="edit_button" onclick="addOrUpdateKeyReplay();">提交</button>
</div> 
<input type="hidden" id="id" value="{$id}">
<input type="hidden" id="media_id" value="{$info['reply_media_id']}">
{include file="admin/Wchat/controlWxDialog" /}
<script>
function getMaterial(media_id){
	$.ajax({
		url : ADMINMAIN + "/Wchat/getWeixinMediaDetail",
		type : "post",
		async : true,
		data : { "media_id" : media_id },
		success : function(data){
			var html = '';
			if(data){
				html += '<div class="reply-div">';
				if(data['type'] == 1){
					html += '<div class="reply-text">';
					html += '<p>'+data['title']+'</p>';
					html += '</div>';
				}else if(data['type'] == 2){
					html += '<div class="reply-one">';
					html += '<h5>'+data['item_list'][0]['title']+'</h5>';
					html += '<p>xx月xx日</p>';
					html += '<div class="cover-div"><img class="cover-pic" src="'+UPLOAD+'/'+data['item_list'][0]['cover']+'"></div>';
					html += '<p>'+data['item_list'][0]['summary']+'</p>';
					html += '</div>';
				}else if(data['type'] == 3){
					html += '<ul class="reply-more">';
					for(var i=0; i < data['item_list'].length; i++){
						if(i < 1){
							html += '<li><div class="cover-div">';
							html += '<img class="cover-pic" src="'+UPLOAD+'/'+data['item_list'][i]['cover']+'">';
							html += '<p class="cover-title">'+data['item_list'][i]['title']+'<p>';
							html += '</div></li>';
						}else{
							html += '<li>';
							html += '<div class="media-div-l"><p class="media-title">'+data['item_list'][i]['title']+'</p></div>';
							html += '<div class="media-div-r"><img class="media-img" src="'+UPLOAD+'/'+data['item_list'][i]['cover']+'"></div>';
							html += '</li>';
						}
					}
					html += '</ul>';
				}
				html += '</div>';
			}
			$("#media_id").val(media_id);
			$(".key_data_a").hide();
			$("#key_data .step_1").show();
			$("#key_data .step_1 .reply-div").remove();
			$("#key_data .step_1 .media-button").before(html);
		}
	})
}
/**
 * 添加 或 修改 关注时回复
 */
function addOrUpdateKeyReplay(){
	var id = $("#id").val();
	var media_id = $("#media_id").val();
	var key = $("#key").val();
	var match_type = $("input[name='match_type']:checked").val();
	if(media_id > 0){
		$.ajax({
			url : ADMINMAIN + "/Wchat/addOrUpdateKeyReplay",
			type : "post",
			async : true,
			data : { "media_id" : media_id, "id" : id, "match_type" : match_type, "key" : key },
			success : function(data){
				if(data['code'] > 0){
					showMessage('success', data['message'], ADMINMAIN + "/Wchat/replayconfig?type=2");
				}else{
					showMessage('error', data['message']);
				}
			}
		})
	}else{
		showMessage('error', '请添加回复内容');
	}
}
function delReply(){
	$('#key_data .step_1').hide();
	$('.key_data_a').show();
}
</script>

{/block}