{extend name="adminblue/base" /}
{block name="resources"/}
<style>
.step_0{text-align:center;margin-top:100px;}
.reply-div{border:1px solid #d3d3d3;width:360px;padding:15px;}
.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><span class="required">*</span>关键词：</dt>
		<dd>
			<p><input id="key" type="text" value="{$info['key']}" class="input-common"></p>
			<p class="error">请输入关键词</p>
		</dd>
	</dl>
	<dl>
		<dt>匹配类型：</dt>
		<dd>
			<label for="match_type1" class="radio inline normal"><i class="radio-common {eq name="info['match_type']" value="1"}selected{/eq}"><input name="match_type" id="match_type1" type="radio" value="1" {eq name="info['match_type']" value="1"}checked{/eq}></i> 模糊匹配</label>
			<label for="match_type2" class="radio inline normal"><i class="radio-common {eq name="info['match_type']" value="2"}selected{/eq}"><input name="match_type" id="match_type2" type="radio" value="2" {eq name="info['match_type']" value="2"}checked{/eq}></i> 全部匹配</label>
			<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="{:__IMG($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="{:__IMG($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="{:__IMG($v['cover'])}"></div>
									</li>
								{/gt}
							{/foreach}
							</ul>
						</div>
					{/eq}
				{/notempty}
					<div class="media-button">
						<a href="javascript:;" onclick="showMaterial()">修改</a>
						<a href="javascript:;" onclick="delReply()">删除</a>
					</div>
				</div>
			</div>
		</dd>
	</dl>
	<dl>
		<dt></dt>
		<dd>
			<button class="btn-common btn-big" onclick="addOrUpdateKeyReplay();">保存</button>
			<button class="btn-common-cancle btn-big" onclick="window.location.href = window.history.go(-1);" >返回</button>
		</dd>
	</dl>
</div> 
<input type="hidden" id="id" value="{$id}">
<input type="hidden" id="media_id" value="{$info['reply_media_id']}">
{include file="adminblue/Wchat/controlWxDialog" /}
<script>
function getMaterial(media_id){
	$.ajax({
		url : __URL(ADMINMAIN + "/wchat/getweixinmediadetail"),
		type : "post",
		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="'+__IMG(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="'+__IMG(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="'+__IMG(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();
	if(key == ''){
		$("#key").parent().next().show();
		return;
	}else{
		$(".error").hide();
	}
	var match_type = $("input[name='match_type']:checked").val();
	if(media_id > 0){
		$.ajax({
			url :__URL(ADMINMAIN + "/wchat/addorupdatekeyreplay"),
			type : "post",
			data : { "media_id" : media_id, "id" : id, "match_type" : match_type, "key" : key },
			success : function(data){
				if(data['code'] > 0){
					showTip(data['message'],"success");
					location.href =  __URL(ADMINMAIN + "/wchat/replayconfig?type=2");
				}else{
					showTip(data['message'],"error");
				}
			}
		})
	}else{
		showTip('请添加回复内容',"warning");
	}
}
function delReply(){
	$('#key_data .step_1').hide();
	$('.key_data_a').show();
	$("#media_id").val(0);
}
</script>
{/block}