{extend name="adminblue/base" /}
{block name="resources"/}
<script type="text/javascript" src="__STATIC__/My97DatePicker/WdatePicker.js"></script>
<style  type="text/css">
.modal-div{width:90%;margin:auto;}
.modal-dl{overflow:hidden;}
.modal-dl dt{line-height:33px;float:left;font-weight:normal;}
.modal-dl dd{float:left;}
.modal-dl dd span{display:block;color:#de533c;}
.btn.off{background-color:#e26f6f;color:#FFF;}
.btn.sure{color:#FFF;background-color:#62c462;}
.silde_sort {width: auto;text-align: center;}
.style0list input{margin-bottom:0px;}
.style0list tbody td{vertical-align:inherit;}
.category_alias{width:100px;}
.short_name{width:100px;margin-bottom: 0;}
.sort{width:30px;}
.floor_goods_sort_type{width: 120px;}
tr{text-align:center;}
.is_show,.is_show_brand,.is_show_lower_category{display: none;}
.is_show + label,.is_show_brand + label,.is_show_lower_category + label{display: inline-block;width: 15px;height: 15px;background: url("ADMIN_IMG/un_checked.png") center no-repeat;background-size: 15px 15px;margin-bottom: 0;}
.is_show + label + span,.is_show_brand + label + span,.is_show_lower_category + label + span{color: #777;position: relative;margin-left: 5px;top: -2px;}
.is_show:checked + label,.is_show_brand:checked + label,.is_show_lower_category:checked + label{background: url("ADMIN_IMG/checked.png") center no-repeat;background-size: 15px 15px;}
.is_show:checked + label + span,.is_show_brand:checked + label + span,.is_show_lower_category:checked + label + span{color: #126AE4;}
.modal-dialog dl dd{width:370px;}
</style>
{/block}
{block name="main"}
<div class="space-10"></div>
<div class="mod-table">
	<div class="mod-table-head">
		<div class="con style0list">
				<table class="table-class">
					<colgroup>
						<col style="width: 2%;">
						<col style="width: 25%;">
						<col style="width: 10%;">
						<col style="width: 10%;">
						<col style="width: 10%;">
						<col style="width: 5%;">
						<col style="width: 7%;">
						<col style="width: 7%;">
						<col style="width: 10%;">
						<col style="width: 4%;">
						<col style="width: 10%;">
					</colgroup>
					<thead>
						<tr>
							<th><i class="checkbox-common"><input type="checkbox"  onclick="CheckAll(this)"></i></th>
							<th class="tal" align="left">分类名称</th>
							
							<th class="tal">别名</th>
							<th class="tal">简称</th>
							<th class="tal">商品排序</th>
							<th class="tal">颜色</th>
							<th class="tal">是否显示</th>
							<th class="tal">品牌显示</th>
							<th class="tal">下级分类显示</th>
							<th class="tal">排序</th>
							<th class="tal">广告图</th>
						</tr>
					</thead>
					<tbody id="list"></tbody>
				</table>
		</div>
		<input type="hidden" id="ap_id" value="{$ap_id}">
	</div>
</div>
<!-- 广告添加  -->
<div class="modal fade hide" id="add_adv" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
				<h3 class="modal-title" id="myModalLabel">广告添加</h3>
			</div>
			<div class="modal-body">
				<div class="set-style">
					<dl>
						<dt>主标题：</dt>
						<dd>
							<p><input id="title" type="text" value="" class="input-common"> </p>
							<p class="error">请输入标题</p>
						</dd>
					</dl>
					<dl>
						<dt>副标题：</dt>
						<dd>
							<p><input  id="subtitle" type="text" value="" class="input-common"> </p>
							<p class="error">请输入副标题</p>
						</dd>
					</dl>
					<dl>
						<dt>图片：</dt>
						<dd>
							<div class="upload-btn-common">
								<div>
									<input class="input-file" name="file_upload" id="uploadAdv" type="file" onchange="imgUpload(this);" title="上传">
									<input type="hidden" id="adv" value="">
								</div>
								
								<input type="text" id="text_adv" class="input-common" readonly="readonly" value="">
								<em>上传</em>
								<img id="preview_adv" src="__STATIC__/blue/img/upload-common-select.png" data-src="" data-html="true" data-container="body" data-placement="top" data-trigger="manual" data-original-title="" title="">
							</div>
						</dd>
					</dl>
					<dl>
						<dt>背景色：</dt>
						<dd>
							<input id="background" type="color" value="#000000" class="input-common-color"/>
						</dd>
					</dl>
					<dl>
						<dt>链接地址：</dt>
						<dd>
							<p><input  id="url" type="text" value="" class="input-common"> </p>
							<p class="error">请输入链接地址</p>
						</dd>
					</dl>
				</div>	
				<input type="hidden" id="id" value=""/>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn-common btn-big" onclick="addGoodsAdv();">保存</button>
				<button type="button" class="btn btn-big" data-dismiss="modal">关闭</button>
			</div>
		</div>
	</div>
</div>
{/block}
{block name="script"}
<script src="__STATIC__/js/ajax_file_upload.js" type="text/javascript"></script>
<script src="__STATIC__/js/file_upload.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
	LoadingInfo();
	$(".page").hide();
})

//查询广告列表
function LoadingInfo() {
	$.ajax({
		type : "post",
		url : "{:__URL('ADMIN_MAIN/system/getGoodsCategoryBlock')}",
		async : false,
		success : function(data) {
			if (data.length > 0) {
				$("#list").empty();
				for (var i = 0; i < data.length; i++) {
					var html = '';
					var show_html ="";
					var is_show = "否";
					if(data[i]["is_show"] == 1){
						show_html = "checked";
						is_show = "是";
					}
					var is_show_lower_category = "否";
					var lower_category_html ="";
					if(data[i]["is_show_lower_category"] == 1){
						lower_category_html = "checked";
						is_show_lower_category = "是";
					}
					var is_show_brand = "否";
					var show_brand_html = "";
					if(data[i]["is_show_brand"] == 1){
						show_brand_html = "checked";
						is_show_brand = "是";
					}
					var goods_sort_type = data[i]['goods_sort_type'];
					html += '<tr>';  
					html += '<td><i class="checkbox-common"><input type="checkbox" name="sub" value="'+ data[i]['id']+'"></i></td>';
					html += '<td class="tal" align="left">'+ data[i]['category_name']+'</td>';
					
					html += '<td class="tal category_alias'+data[i]['id']+'"><input type="text"class="category_alias input-common middle"  value="' + data[i]["category_alias"] + '" onchange="setGoodsCategoryField(this, '+data[i]['id']+');"/></td>';
					html += '<td class="tal short_name'+data[i]['id']+'"><input type="text" class="short_name input-common harf" value="' + data[i]["short_name"] + '" onchange="setGoodsCategoryField(this, '+data[i]['id']+');" maxlength="4"/></td>';
					html += '<td class="tal"><select class="floor_goods_sort_type select-common harf" onchange="setGoodsCategoryField(this, '+data[i]['id']+');"><option value="0" '+ is_selected(0,goods_sort_type) +'>默认排序</option><option value="1" '+ is_selected(1,goods_sort_type) +'>按发布时间排序</option><option value="2" '+ is_selected(2,goods_sort_type) +'>按销量排序</option><option value="3" '+ is_selected(3,goods_sort_type) +'>按排序号排序</option><option value="4" '+ is_selected(4,goods_sort_type) +'>按人气排序</option></select></td>';

					html += '<td class="tal"><input type="color" class="input-common-color color"  onchange="setGoodsCategoryField(this, '+data[i]['id']+');"  value="'+data[i]["color"]+'"></td>';
					html += '<td class="tal"><label style="margin-bottom:0;margin-top: 5px;"><input type="checkbox" class="is_show" onchange="setGoodsCategoryField(this, '+data[i]['id']+')" '+show_html+'/><label></label><span>'+ is_show +'</span></label></td>';
					html += '<td class="tal"><label style="margin-bottom:0;margin-top: 5px;"><input type="checkbox" class="is_show_brand input-common" onchange="setGoodsCategoryField(this, '+data[i]['id']+');" '+show_brand_html+'/><label></label><span>'+ is_show_brand +'</span></label></td>';
					html += '<td class="tal"><label style="margin-bottom:0;margin-top: 5px;"><input type="checkbox" class="is_show_lower_category" onchange="setGoodsCategoryField(this, '+data[i]['id']+');" '+lower_category_html+'/><label></label><span>'+ is_show_lower_category +'</span></label></td>';
					
					html += '<td class="tal"><input type="number" style="text-align:center;" class="sort input-common input-common-sort" onchange="setGoodsCategoryField(this, '+data[i]['id']+');" value="'+data[i]['sort']+'"/></td>';
					html += '<td class="tal">';
					if(data[i]['ad_picture'] != undefined && data[i]['ad_picture'] !=''){
						var ad_picture = data[i]['ad_picture'];
						ad_picture = JSON.parse(ad_picture);
						var title = ad_picture.title;
						var subtitle = ad_picture.subtitle;
						var picture = ad_picture.picture;
						var background = ad_picture.background;
						var url = ad_picture.url;
						html +='<a href="javascript:void(0)" onclick="editgoodsAd('+ data[i]['id']+', \''+title+'\', \''+subtitle+'\', \''+picture+'\', \''+background+'\', \''+url+'\');">编辑广告</a>';
						html +='<br/><a href="javascript:void(0)" onclick="deleteGoodsAd('+ data[i]['id']+');">删除广告</a>';
					}else{
						html +='<a href="javascript:void(0)" onclick="addgoodsAd('+ data[i]['id']+');">添加广告</a>';
					}
					html +='</td>';
					html += '</tr>';
					$("#list").append(html);
				}
			} else {
				var html = '<tr><td colspan="11">暂无符合条件的数据记录</td></tr>';
				$("#list").html(html);
			}
		}
	});
	$(".checkbox").simpleSwitch({
		"theme": "FlatRadius"
	});
}

function is_selected(value,goods_sort_type){
	var select = "";
	if(value == goods_sort_type){
		select = "selected";
	}
	return select;
}

/**
*修改商品分类楼层
*/
function setGoodsCategoryField(obj,id){
	var parent_obj = $(obj).parents("tr");
	var category_alias = parent_obj.find(".category_alias").val();
	var short_name = parent_obj.find(".short_name").val();
	var is_show = 0;
	var color = parent_obj.find(".color").val();
	var is_show_lower_category = 0;
	var is_show_brand = 0;
	var sort = parent_obj.find(".sort").val();
	if(parent_obj.find(".is_show").is(":checked")){
		is_show = 1;
	}
	if(parent_obj.find(".is_show_lower_category").is(":checked")){
		is_show_lower_category = 1;
	}
	if(parent_obj.find(".is_show_brand").is(":checked")){
		is_show_brand = 1;
	}
	var goods_sort_type = parent_obj.find(".floor_goods_sort_type").val(); 
	
	$.ajax({
		type:"post",
		url:"{:__URL('ADMIN_MAIN/system/setgoodscategoryblock')}",
		async : false,
		data:{
			'category_alias':category_alias,
			'is_show':is_show,
			'color':color,
			'is_show_lower_category':is_show_lower_category,
			'is_show_brand':is_show_brand,
			'id':id,
			'sort':sort,
			'short_name':short_name,
			'goods_sort_type' : goods_sort_type
		},
		success: function (data) {
			if(data.code > 0){
				showTip("编辑成功","success");
				LoadingInfo();
			}else{
				showTip("编辑失败","error");
			}
		}
	});
}

/**
*商品广告
*/
function addgoodsAd(id){
	clearBlock();
	$("#id").val(id);
	$('#add_adv').modal(show);
}

function editgoodsAd(id, title, subtitle, picture, background, url){
	clearBlock();
	$("#id").val(id);
	$('#add_adv').modal(show);
	//	if(ad_picture != undefined && ad_picture != ""){
	//	ad_picture = eval(ad_picture);
	$("#add_adv").find("#title").val(title);
	$("#add_adv").find("#subtitle").val(subtitle);
	$("#add_adv").find("#background").val(background);
	$("#add_adv").find("#url").val(url);
	$("#add_adv").find("#adv").val(picture);
	$("#add_adv").find("#text_adv").val(picture);
	$("#add_adv").find("#preview_adv").attr("data-src",__IMG(picture));
	//	}

}

/**
*添加商品分类广告
*/
function addGoodsAdv(){
	var id = $("#id").val();
	var title = $("#add_adv").find("#title").val();
	var subtitle = $("#add_adv").find("#subtitle").val();
	var picture = $("#add_adv").find("#adv").val();
	var background = $("#add_adv").find("#background").val();
	var url = $("#add_adv").find("#url").val();
	var ad_picture = {
		"title":title,
		"subtitle":subtitle,
		"picture":picture,
		"background":background,
		"url":url
	};
	var ad_picture = JSON.stringify(ad_picture);
	if(title == ''){
		$("#title").focus();
		$("#title").parent().next().show();
		return false;
	}else{
		$("#title").parent().next().hide();
	}
	if(subtitle == ''){
		$("#subtitle").focus();
		$("#subtitle").parent().next().show();
		return false;
	}else{
		$("#subtitle").parent().next().hide();
	}
	if(picture == ''){
		$("#Logo").focus();
		$("#Logo").next().show();
		return false;
	}else{
		$("#Logo").next().hide();
	}
	if(url == ''){
		$("#url").focus();
		$("#url").parent().next().show();
		return false;
	}else{
		$("#url").parent().next().hide();
	}
	$.ajax({
		type:"post",
		url:"{:__URL('ADMIN_MAIN/system/setgoodscategoryadv')}",
		data:{
			'ad_picture':ad_picture,
			'id':id
		},
		success: function (data) {
			if(data.code > 0){
				showTip("保存成功","success");
				$("#id").val('');
				LoadingInfo();
				$('#add_adv').modal("hide");
			}else{
				showTip("广告添加失败","error");
			}
		}
	});
}
function imgUpload(event) {
	var fileid = $(event).attr("id");
	var data = { 'file_path' : UPLOADADV };
	var id = $(event).next().attr("id");
	uploadFile(fileid,data,function(res){
		if(res.code){
			$("#" + id).val(res.data);
			$("#text_" + id).val(res.data);
			$("#preview_"+ id).attr("data-src",__IMG(res.data));
			showTip(res.message,"success");
		}else{
			showTip(res.message,"error");
		}
	});
}

/**
*清除模态框内容
*/
function clearBlock(){
	$("#add_adv").find("#title").val('');
	$("#add_adv").find("#subtitle").val('');
	$("#add_adv").find("#Logo").val('');
	$("#add_adv").find("#background").val('#000000');
	$("#add_adv").find("#url").val('');
	$("#add_adv").find("#imgLogo").attr("src",'');
	$("#id").val('');
}

/**
*删除广告
*/
function deleteGoodsAd(id){
	$.ajax({
		type:"post",
		url:"{:__URL('ADMIN_MAIN/system/setgoodscategoryadv')}",
		data:{ 'ad_picture':'', 'id':id },
		success: function (data) {
			if(data.code > 0){
				showTip("保存成功","success");
				LoadingInfo();	
			}else{
				showTip("广告添加失败","error");
			}
		}
	});
}
function CheckAll(event){
	var checked = event.checked;
	$(".table-class tbody input[name = 'sub']").prop("checked",checked);
	if(checked) $(".table-class tbody input[type = 'checkbox']").parent().addClass("selected");
	else $(".table-class tbody input[type = 'checkbox']").parent().removeClass("selected");
}
</script>
{/block}