function addpic() {
	var pic = jq("#picbox .control-group").length;
	pic++;
	var newpic = '  <div class="control-group"><label class="control-label" for=""> 宝贝链接' + pic + '： </label><div class="control">  <input class="input-box da" type="text" name="imurl[' + pic + ']" value="">图片地址：<input class="input-box da setobj" type="text" name="pic[' + pic + ']" data-sty="#pic'+pic+' img|src" value=""><a class="gais" tname="pic[' + pic + ']" onclick="gaishuxx(this)">刷新</a>   <input  type="text" name="picx[' + pic + ']" value=""  class="setobj hide" data-sty="#pic' + pic + '|csspx.left" ><input  type="text" name="picy[' + pic + ']" value=""  class="setobj hide" data-sty="#pic' + pic + '|csspx.top"></div></div>';

	if (pic <= 24) {
		jq("#picbox").append(newpic);
		dqplsd();
		addobj(pic, 'pic');
		zhikeyidon();
	} else {
		alert("数量建议不要超过24个！否则代码可能会超量");
	}
}
function delpic() {
	var pic = jq("#picbox .control-group").length;
	pic--;
	if (pic >= 1) {
		jq("#picbox .control-group").eq(pic).remove();
		jQuery('#pic' + (pic+1)).remove();
	} else {
		alert("亲再删就没有了啊！！！！");
	}
}

function adddhli() {
	var pic = jq("#daohanglis .control-group").length;
	pic++;
	var newpic = '   <div class="control-group"> <label class="control-label" for="">导航'+pic+'： </label> <div class="control"> <input  class="input-box setobj" type="text"  data-sty="#dh'+pic+'|text"  name="dhm['+pic+']" value="分类'+pic+'"   style="width:80px">  链接：<input  class="input-box txiao" type="text" name="dhlj['+pic+']" value=""> 默认底色： <input  class="yanse input-box setobj"    data-sty="#dh'+pic+'|css.background-color" type="text" name="dhlids['+pic+']" value="'+jQuery('[name="dhlids['+(pic-1)+']"]').val()+'"  style="width:80px">  默认字色: <input  class="yanse input-box setobj"  data-sty="#dh'+pic+'|css.color" type="text" name="dhlimrzs['+pic+']" value="'+jQuery('[name="dhlimrzs['+(pic-1)+']"]').val()+'"  style="width:80px"> 焦点底色: <input  class="yanse input-box"  type="text" name="dhlijdds['+pic+']" value="'+jQuery('[name="dhlijdds['+(pic-1)+']"]').val()+'"  style="width:80px"> 焦点字色:  <input  class="yanse input-box"   type="text" name="dhlijdzs['+pic+']" value="'+jQuery('[name="dhlijdzs['+(pic-1)+']"]').val()+'"  style="width:80px">  </div></div>';


    var xialcdo = '<div class="control-group"> <label class="control-label" for="">导航'+pic+'下拉： </label> <div class="control">宽度:<input class="input-box" type="text" name="xlw['+pic+']" value="auto" style="width:80px"> 偏移值：<input class="input-box" type="text" name="xlpy['+pic+']" value="0" style="width:80px">默认底色： <input class="yanse input-box"  type="text" name="xllids['+pic+']" value="'+jQuery('[name="xllids['+(pic-1)+']"]').val()+'" style="width:80px">默认字色: <input class="yanse input-box" type="text"  name="xllimrzs['+pic+']" value="'+jQuery('[name="xllimrzs['+(pic-1)+']"]').val()+'" style="width:80px">焦点底色: <input class="yanse input-box" type="text" name="xllijdds['+pic+']" value="'+jQuery('[name="xllijdds['+(pic-1)+']"]').val()+'" style="width:80px">焦点字色: <input class="yanse input-box" type="text" name="xllijdzs['+pic+']" value="'+jQuery('[name="xllijdzs['+(pic-1)+']"]').val()+'" style="width:80px"> <br/> <br/> <textarea class="textarea-box" type="text" name="xiala['+pic+']"></textarea> </div> </div>';

	if (pic <= 24) {
        jq("#daohanglis").append(newpic);	
        jq("#dhxlcd").append(xialcdo);	
        addobj(pic, 'dhli');
        ljzha();
	} else {
		alert("数量建议不要超过24个！否则代码可能会超量");
	}
}
function deldhli() {
	var pic = jq("#daohanglis .control-group").length;
	pic--;
	if (pic >= 1) {
        jq("#daohanglis .control-group").eq(pic).remove();
        jq("#dhxlcd .control-group").eq(pic).remove();
		jQuery('#dh' + (pic+1)).remove();
	} else {
		alert("亲再删就没有了啊！！！！");
	}
}


function addpicryt() {
	var pic = jq("#picboxryt .control-group").length;
	pic++;
	var newpic = '<div class="control-group"><label class="control-label" for=""> 链接'+pic+'： </label><div class="control"><input class="input-box da" type="text" name="ryturl['+pic+']" value="">图片：<input class="input-box da setobj" type="text" data-sty="#ryt'+pic+' img|src"  name="ryt['+pic+']" value="https://img.alicdn.com/imgextra/i1/456989075/TB2gQx5bmr85uJjSZPiXXbOBFXa_!!456989075.gif"> <input type="text" name="rytx['+pic+']"  class="setobj hide"    data-sty="#ryt'+pic+'|csspx.left"  value=""> <input type="text" name="ryty['+pic+']"   class="setobj hide"    data-sty="#ryt'+pic+'|csspx.top"  value=""> </div></div>';

	if (pic <= 24) {
		jq("#picboxryt").append(newpic);	
		addobj(pic, 'ryt');
		zhikeyidon();
	} else {
		alert("数量建议不要超过24个！否则代码可能会超量");
	}
}
function delpicryt() {
	var pic = jq("#picboxryt .control-group").length;
	pic--;
	if (pic >= 1) {
		jq("#picboxryt .control-group").eq(pic).remove();
		jQuery('#ryt' + (pic+1)).remove();
	} else {
		alert("亲再删就没有了啊！！！！");
	}
}



function addobj(tid, zjnm) {
    if (zjnm == "pic") {
        var xstyle = 'width:' + jQuery('[name="picw"]').val() + 'px;height:' + jQuery('[name="pich"]').val() + 'px;border-radius:' + jQuery('[name="picyj"]').val() + 'px;';
        var objhtml = '<div class="abs" zjnm="pic" id="pic' + tid + '" style="' + xstyle + '"><img style="width:100%;height:100%;" src="https://img.alicdn.com/imgextra/i2/456989075/O1CN01voJZJZ2GuOoJj41Wz-456989075.jpg"/></div>';
        jQuery('#dmspmk #dianzhao').append(objhtml);
    } else if (zjnm == "dhli") {
        var xstyle = jQuery("#dh" + (tid - 1)).attr('style');;
        var objhtml = ' <li zjnm="daohangli" id="dh' + tid + '" class="dhli" style="' + xstyle + '">分类' + tid + '</li> ';
        jQuery('#dmspmk #daohangli').append(objhtml);
        xuansezujian();
        objset();
    } else if (zjnm == "ryt") { 
        var objhtml = '<div class="abs" zjnm="ryt" id="ryt' + tid + '"><img src="https://img.alicdn.com/imgextra/i1/456989075/TB2gQx5bmr85uJjSZPiXXbOBFXa_!!456989075.gif"/></div>';
        jQuery('#dmspmk #dianzhao').append(objhtml);
    }

}
function objset() { 
	jQuery(".setobj").on("change",function(){
		gaishuxx(this);
	});
}

function gaishuxx(objs) { 
	var objname = jQuery(objs).attr('name') != undefined ? jQuery(objs).attr('name') : jQuery(objs).attr('tname');
    var zhis = jQuery('[name="' + objname + '"]').val();
    var zjsty = jQuery('[name="' + objname + '"]').attr('data-sty');
  if (zhis.indexOf('http') == -1) { 
        zhis = zhis.replace('px','');
    }
    var mlh = zjsty.split('|');
    if (mlh[1].indexOf('css.') != -1) {
        mlh[1] = mlh[1].replace('css.', '');
        jQuery(mlh[0]).css(mlh[1], zhis);
    } else if (mlh[1].indexOf('csspx.') != -1) { 
        mlh[1] = mlh[1].replace('csspx.', '');

        if (mlh[1].indexOf('&') != -1) {
            var duocan = mlh[1].split('&');

for (let index = 0; index < duocan.length; index++) {
    jQuery(mlh[0]).css(duocan[index], zhis + 'px');
}

        } else { 
            jQuery(mlh[0]).css(mlh[1], zhis + 'px');
           
        }
        
        if (objname == "dianzhaoh" || objname == "daohangh") { 
            jQuery('#dmspmk').css('height',(parseInt(jQuery('[name="dianzhaoh"]').val())+parseInt(jQuery('[name="daohangh"]').val()))+'px')
        }
    } else if (mlh[1].indexOf('text') != -1) { 
        jQuery(mlh[0]).text(zhis);
    } else if (mlh[1].indexOf('cssbgt') != -1) { 
        jQuery(mlh[0]).css('background','url("/static/dutu.php?imgurl='+encodeURIComponent(zhis)+'")');
    }
    else { 
        jQuery(mlh[0]).attr(mlh[1],zhis);
    }

   
}


function yunguiwei() {
    var csarr = jQuery('.setobj');
    for (let index = 0; index < csarr.length; index++) {     
        gaishuxx(csarr[index]);
    }
}

var yaoti = 888;
function zhikeyidon() {
	jQuery('#dmspmk .abs').draggable({
		stop: function () {
			var zjid = jQuery(this).attr("id");
			var zjnm = jQuery(this).attr("zjnm");
			getxy(zjid, this.style.left, this.style.top, zjnm);
		}
	});
	objset();
} zhikeyidon();


function getxy(objid, xs, ys, zjnms) {
	var reg = /\d+/;
    var thisid = objid.match(reg);
    if (thisid) {
        jQuery('[name="' + zjnms + 'x[' + thisid + ']"]').val(xs);
        jQuery('[name="' + zjnms + 'y[' + thisid + ']"]').val(ys);
    } else { 
        jQuery('[name="' + zjnms + 'x"]').val(xs);
        jQuery('[name="' + zjnms + 'y"]').val(ys);
    }
}

function chicunChange() { 
    var chicun = jQuery('#dplxcc').val();
jQuery('#dianzhao,#daohangli').css('width',chicun+'px')
}

jQuery('#daobeijing').click(function () {
    settutu();
});

function settutu() { 
    jQuery('#dianzhao div,#daohangli').hide();
    jQuery('#dianzhao').css('border-width','0px');
    html2canvas(document.querySelector(".democao")).then(canvas => {
      //  jQuery('.democao').append('<a id="down950" class="imgdown" href="" download="页头背景图片" >点击下载图片</a>');
     //   jQuery("#down950").attr('href', canvas.toDataURL());
        layer.open({
            type: 1,
            title:'鼠标右键另存图片(保存到自己电脑)',
            skin: 'layui-layer-img',
            closeBtn: 1,
            area: ['1200px', '140px'],
            anim: 2,
            shadeClose: true,
            content: '<img width="1200" src="'+canvas.toDataURL()+'">'
          });


        jQuery('#dianzhao div,#daohangli').show();
        jQuery('#dianzhao').css('border-width','1px');
          });
}

jQuery('.issty').click(function () {
    var objnmes = this.name;
    var xz = jQuery(this).is(':checked');
switch (objnmes) {
    case 'dianbiaoshow':
        if (xz) {
            jQuery('#logo').show();
        } else { 
            jQuery('#logo').hide();
        }
        break;
        case 'dingminshow':
            if (xz) {
                jQuery('#dianming').show();
            } else { 
                jQuery('#dianming').hide();
            }
        break;
        case 'jianjieshow':
            if (xz) {
                jQuery('#jianjie').show();
            } else { 
                jQuery('#jianjie').hide();
            }
        break;
        case 'sousuoshow':
            if (xz) {
                jQuery('#sousuo,#suosuobf').show();
            } else { 
                jQuery('#sousuo,#suosuobf').hide();
            }
        break;
        case 'tuijianshow':
            if (xz) {
                jQuery('[zjnm="pic"],#bbtj').show();
            } else { 
                jQuery('[zjnm="pic"],#bbtj').hide();
            }
        break;
        case 'rytshow':
            if (xz) {
                jQuery('[zjnm="ryt"],#rytbf').show();
            } else { 
                jQuery('[zjnm="ryt"],#rytbf').hide();
            }
        break;
        case 'fzxshow':
            if (xz) {
                jQuery('#dianzhao, #daohangli').css('border-width','1px');
            } else { 
                jQuery('#dianzhao, #daohangli').css('border-width','0px');
            }
            break;
    default:
        break;
}
});
function getsuijiobj(url) { 
    jQuery('[name="dianzhaobg"]').val(url);
    jQuery('#dmspmk').css('background','url("/static/dutu.php?imgurl='+encodeURIComponent(url)+'")');
}