Hanchao = new Vue({
	el : '#dragedit',
	data : {
		//主列表
		HClist : [],
		//追加列表
		HCaddlist : '',
		//当前点击添加的模板类型
		type_con:'',
		//当前点击编辑的模板类型
		type_edit:'',
		//当前点击编辑的模板ID
		currentID:0,
		//数据库存储的新数组
		HCnewlist:[],
		//数据库存储的新数组长度【用来遍历渲染】
		HCnewlistlen:0,
		//给模板挂载事件的数组
		HCdroplist:[6,7,10,11,12,13,14,15],
		//给模板挂载拖动slider事件的数组
		HCslider:[7,9,16],
		//给模板挂载颜色选择器事件的数组
		HCcolorPicker:[10],
		//系统链接规则模板
		HCurlrules:urlrules,
		//order排序模板
		HCorderlist:HCorderlist,
		//++++++++++++++弹窗类数据++++++++++++++++++++
		//分类类型弹窗数据
		HCtextlist:{},
		//商品类型弹窗数据
		HCgoodslist:{},
		//商品类型弹窗分类数据
		HCcatelist:{},
		//商品类型弹窗筛选数据
		HCgoodsparam:{
			type:0,
			keyword:'',
			catid:0,
			goods_type:1,
			p:1
		},
		//商品类型弹窗数据[当前选中数据]
		HCcurgoodslist:[],
		//商品类型弹窗数据[当前选中数据索引，用于数据渲染记录]
		HCcurindexlist:[],
		//弹窗数据未获取前加载图标
		HCloading:'<div class="loadEffect"><div><span></span></div><div><span></span></div><div><span></span></div><div><span></span></div></div>',
		//弹窗数据未获取前加载图标
		HCloadingstatus:false,
		//++++++++++++++弹窗类数据end+++++++++++++++++
	},
	methods : {
		init : function() {
			this.HCnewlist = HCinitlist;
			if(this.HCnewlist){
				this.HCnewlistlen = this.HCnewlist.length;
				this.initlist(0);
			}
		},
		initlist : function(index) {
			if(this.HCnewlistlen==index)return;
			this.settimeoutinit(index);
		},
		settimeoutinit:function(index){
			var that = this;
			this.left(that.HCnewlist[index]);
			this.$nextTick(function () {
				index++;
				that.initlist(index);
			});
		},
		left :function(ret){
			//left-module自定义事件添加
			this.HCaddlist = ret;//模板赋值
			this.currentID = this.HCaddlist.id;
			this.type_con = 'tpl_diy_con_type'+this.HCaddlist.data_type;//判断内容模板类型
			this.type_edit = 'tpl_diy_edit_type'+this.HCaddlist.data_type;//判断编辑模板类型
			if(this.HCaddlist)this.HClist.push(this.HCaddlist);//记录数据
			// alert(JSON.stringify(this.HCaddlist));
			// alert(JSON.stringify(this.HClist));
			//18.03.19 start
			var that = this;
			setTimeout(function () {
				that.reposition(that.currentID);//18.03.19
			},300);
			//18.03.19 end
		},
		actionUp :function(id,obj){
			//上移操作
			$(obj).parent().parent().parent().insertBefore($(obj).parent().parent().parent().prev());
			UpOrDownShow();
			this.reposition(id);
		},
		actionDown :function(id,obj){
			//下移操作
			$(obj).parent().parent().parent().insertAfter($(obj).parent().parent().parent().next());
			UpOrDownShow();
			this.reposition(id);
		},
		actionEdit :function(id){
			//编辑操作
			for(var i in this.HClist){
				if(this.HClist[i].id==id){
					this.HCaddlist = this.HClist[i];
					this.currentID = id;
					this.type_con = 'tpl_diy_con_type'+this.HCaddlist.data_type;//判断内容模板类型
					this.type_edit = 'tpl_diy_edit_type'+this.HCaddlist.data_type;//判断编辑模板类型
					break;
				}
			}
			this.reposition(id);//18.03.19
		},
		actionDel :function(id,obj){
			//删除操作
			var data = this.HClist;
			if (!data) return false;
			//提示删除
			var r = confirm("删除后将不可恢复，是否继续？");
			if (r==true){
				for(var i in this.HClist){
					if(this.HClist[i].id==id){
						this.HClist.splice(i,1);
						$('#xq'+id).remove();
						UpOrDownShow();
						if(id==this.currentID)this.currentID=0;
						break;
					}
				}
			}else{
				return false;
			}
			return false;
		},
		diy_edit_default_style:function(val){
			//标题样式
			var str = 'margin-top: 85px;';
			if(val>0)str += 'display:none;';
			return str;
		},
		diy_edit_style:function(val){
			//可编辑样式
			var str = 'display:none;';
			if(val>0){
				// this.reposition(val);//18.03.19
				str = '';
			}
			return str;
		},
		reposition:function(id){
			//重新定位编辑框高度
			if(id==0)return;
			this.$nextTick(function () {
				var top_conitem = $('#xq'+id).offset().top,
				curPosTop = top_conitem - $(".diy").offset().top;
				$("html,body").animate({ scrollTop: curPosTop }, 300);//滚动页面
				setTimeout(function(){
					//消除动画累积延时
					$("html,body").stop(false, true);
				},300);
				$('#order-edit').css("margin-top", curPosTop);
			});
		},
		sortdatalist:function(urlcode){
			//重新计算模块的排序
			var self = this;
			$('#sortable .diy-conitem').each(function(){
				for(var i in self.HClist){
					if('xq'+self.HClist[i].id==$(this).attr('id')){
						self.HClist[i].sort=$(this).index();
						continue;
					}
				}
			});
			var data = new Object;
			var url = APP;
			if(parseInt(id)>0){
				url += "Dragedit/update";
				data.id = id;
			}else{
				url += "Dragedit/add";
			}
			data.content = JSON.stringify(self.HClist);
			$.ajax({
				url: url,
				data: data,
				type: "post",
				dataType: "json",
				success: function (data) {
					if (data.status == 1) {
						showtoast("保存成功");
						if(typeof(urlcode)!='undefined'){
							window.open(urlcode);
						}
					}else {
						showtoast(data.msg);
					}
				}
			});
		},
		check_con_show:function(code){
			//模板内容显示
			if(this.type_con==code)return true;
			return false;
		},
		check_edit_show:function(code){
			if(!code)return false;
			var newarr = new Array;
			var self = this;
			if(code.indexOf('|')>-1){
				newarr = code.split("|");
			}else{
				newarr.push(code);
			}
			for(var ai in newarr){
				//模板编辑内容显示
				if(self.type_edit&&self.type_edit==newarr[ai]){
					for(var i in self.HCdroplist){
						if(newarr[ai]=='tpl_diy_edit_type'+self.HCdroplist[i]){
							//渲染模板时判断是否挂载相应事件
							self.$nextTick(function () {
								eventdroplist();
							});
							break;
						}
					}
					for(var i in self.HCslider){
						if(newarr[ai]=='tpl_diy_edit_type'+self.HCslider[i]){
							//渲染模板时判断是否挂载slider事件
							for(var Hi in self.HClist){
								if(self.HClist[Hi].id==self.currentID){
									self.$nextTick(function () {
										$("#slider").slider({
											min: 0,
											max: 100,
											step: 1,
											animate: "fast",
											value: parseInt(self.HClist[Hi]['content'].height),
											slide: function (event, ui) {
												self.HClist[Hi]['content']['height'] = parseInt(ui.value);
											},
											stop: function (event, ui) {
											
											}
										});
									});
									break;
								}
							}
							break;
						}
					}
					for(var i in self.HCcolorPicker){
						if(newarr[ai]=='tpl_diy_edit_type'+self.HCcolorPicker[i]){
							//渲染模板时判断是否挂载Picker事件
							self.$nextTick(function () {
								$('.colorPicker').colpick({
									colorScheme:'dark',
									layout:'rgbhex',
									color:'ff8800',
									onSubmit:function(hsb,hex,rgb,el) {
										$(el).css('background-color', '#'+hex);
										$(el).colpickHide();
										for(var Hi in self.HClist){
											if(self.HClist[Hi].id==self.currentID){
												var type = $(el).attr('type');var index = $(el).attr('index');var param = $(el).attr('param');
												self.HClist[Hi]['content'][type][index][param] = '#'+hex;
												break;
											}
										}
									}
								});
							});
							break;
						}
					}
					return true;
				}	
			}
			return false;
		},
		updateData:function(id,obj){
			for(var i in this.HClist){
				if(this.HClist[i].id==id){
					this.HClist[i].content.name = obj;
					break;
				}
			}
		},
		uploadimgcallback:function(id,index,filter,data){
			//公共图片上传回调
			for(var i in this.HClist){
				if(this.HClist[i].id==id){
					this.HClist[i].content[filter][index].img = data;
					break;
				}
			}
		} ,
		tpl_diy_con_type2_class:function(data){
			return 'members_titles titlestyle'+data.titlestyle+' '+data.direction;
		},
		bind_type10_style:function(bgColor,height,liheight,marginstyle,type){
			if(type==1)return 'color:'+bgColor+';height:44px;line-height:44px;';
			return 'background-color:'+bgColor+';height:'+height+'px;line-height:'+liheight+'px;margin-right:'+marginstyle+'px;';
		},
		inserturlhtml:function(){
			return $('#tempurlhtml').html();
		},
		changeRange:function(id,value,index,type,name) {
			var se = new Object;
			var self = this;
			for(var i in self.HClist){
				if(self.HClist[i].id==self.currentID){
					self.HClist[i]['content'][type][index]['link'] = '';
					self.HClist[i]['content'][type][index]['is_param'] = false;
					self.HClist[i]['content'][type][index]['is_url'] = false;
					if(id=='url'){
						var paramdata = new Object;
						paramdata.findname = name;
						self.HClist[i]['content'][type][index]['link'] = paramdata;
						self.HClist[i]['content'][type][index]['is_url'] = true;
						return false;	
					}
					break;
				}
			}
			self.HCloadingstatus = true;
			se.id = id;
			se.value = value;
			var url = APP + "Ajax/ajax_diy_give";
			$.ajax({
				url: url,
				data: se,
				type: "post",
				dataType: "json",
				success: function (data) {
					self.HCloadingstatus = false;
					if (data.status == 1) {
						for(var i in self.HClist){
							if(self.HClist[i].id==self.currentID){
								var paramdata = new Object;
								paramdata.is_param = data.is_param;
								paramdata.findname = name;
								paramdata.url_navtype = id;
								self.HClist[i]['content'][type][index]['link'] = paramdata;
								self.HClist[i]['content'][type][index]['is_param'] = data.is_param==1?true:false;//额外参数
								self.HClist[i]['content'][type][index]['is_url'] = false;
								if(data.optin){//打开弹出窗选择参数 
									self.openjbox('cate',name,data.optin,type,index);
								}
								break;
							}
						}
					}else {
						showtoast("数据出错");
					}
				}
			});
		},
		changeRangeParam:function(data,id,type,index){
			var self = this;
			var dname = data.name;
			var did = data.id;
			for(var i in self.HClist){
				if(self.HClist[i].id==id){
					self.HClist[i]['content'][type][index]['link']['url_modulename'] = did;
					if(data.fname)dname = data.fname;
					self.HClist[i]['content'][type][index]['link']['sonfindname'] = dname;
					self.closejbox();
					break;
				}
			}
		},
		selectgoods:function(id,data){
			if($.inArray(id,this.HCcurindexlist)>=0){
				this.HCcurindexlist.splice($.inArray(id,this.HCcurindexlist),1);
				for(var i in this.HCcurgoodslist){
					if(this.HCcurgoodslist[i].id==id){
						this.HCcurgoodslist.splice(i,1);
					}
				}
			}else{
				this.HCcurindexlist.push(id);
				this.HCcurgoodslist.push(data);
			}
		},
		selectgoodsclass:function(id){
			var str = 'f-r choice-a mt15 mr15';
			if($.inArray(id,this.HCcurindexlist)>=0){
				str+=' on';
			}
			return str;
		},
		selectgoodstext:function(id){
			var str = '选取';
			if($.inArray(id,this.HCcurindexlist)>=0){
				str='已选';
			}
			return str;
		},
		openjbox:function(filter,name,data,type,index){
			var self = this;
			if(filter=='cate'){
				self.HCtextlist.name=name;
				self.HCtextlist.type=type;
				self.HCtextlist.index=index;
				self.HCtextlist.list=data;
				$(".textlist-jbox").css('display','block');
			}else if(filter=='goods'){
				self.getgoodslist();//获取商品信息
				$(".goods-jbox").css('display','block');
			}
			$("#jbox-overlay").css('display','block');
		},
		closejbox:function(){
			var self = this;
			self.HCtextlist={};
			$(".jbox").css('display','none');
			$("#jbox-overlay").css('display','none')
		},
		getgoodslist:function(page){
			var self = this;
			self.HCloadingstatus = true;
			var page = parseInt(page);
			if(page)self.HCgoodsparam.page = page;
			var url = APP + "Dragedit/get_goods_list";
			$.ajax({
				url: url,
				data: self.HCgoodsparam,
				type: "post",
				dataType: "json",
				success: function (data) {
					self.HCloadingstatus = false;
					if (data.status == 1) {
						self.HCgoodslist = data;
						if(data.catelist)self.HCcatelist = data.catelist;
						self.HCgoodsparam.type = 1;
					}else {
						self.HCgoodslist = [];
						showtoast(data.msg);
					}
				}
			});
		},
		submitgoodslist:function(){
			var self = this;
			if(self.HCcurgoodslist==''){
				self.closejbox();
				return false;
			}
			for(var i in self.HClist){
				if(self.HClist[i].id==self.currentID){
					self.HClist[i]['content']['goodslist'] = self.HCcurgoodslist;
					self.HClist[i]['content']['isadd'] = 1;
					self.HCcurgoodslist = [];
					self.HCcurindexlist = [];
					self.HCtextlist = [];
					self.HCgoodslist=[];
					self.HCgoodsparam.p = 1;
					self.closejbox();
				}
			}
		},
		delgoods:function(type,index){
			var self = this;
			for(var i in self.HClist){
				if(self.HClist[i].id==self.currentID){
					self.HClist[i]['content'][type].splice(index,1);
					if(self.HClist[i]['content'][type]==''){
						self.HClist[i]['content'][type] = self.HClist[i]['content']['initgoodslist'];
						self.HClist[i]['content']['isadd'] = 0;
					}
					break;		
				}
			}
		},
		moveindex:function(filter,type,index){
			var index = parseInt(index);
			var self = this;
			var temp = templist = new Array;
			for(var i in self.HClist){
				if(self.HClist[i].id==self.currentID){
					var movelen = parseInt(self.HClist[i]['content'][type].length);
					if(filter=='up'){
						if(index<1){
							return false;
						}else{
							temp = self.HClist[i]['content'][type][index-1];
							self.HClist[i]['content'][type][index-1] = self.HClist[i]['content'][type][index];
							self.HClist[i]['content'][type][index] = temp;
						}
					}else if(filter=='down'){
						if(index>(movelen-2)){
							return false;
						}else{
							temp = self.HClist[i]['content'][type][index+1];
							self.HClist[i]['content'][type][index+1] = self.HClist[i]['content'][type][index];
							self.HClist[i]['content'][type][index] = temp;
						}
					}else if(filter=='del'){
						var r = confirm("删除后将不可恢复，是否继续？");
						if(r==true){
							self.HClist[i]['content'][type].splice(index,1);
						}else{
							return false;
						}
					}else if(filter=='add'){
						if(self.type_edit=='tpl_diy_edit_type6'){
							var addlist = {
								link: "#",
								is_url:false,
								url:'',
								is_param:false,
								url_param:'',
								title: "导航名称",
								showtitle: "导航名称",
								img: "/Public/drag/images/waitupload.png"
							}
						}
						if(self.type_edit=='tpl_diy_edit_type7'){
							var addlist = {
								link: "#",
								is_url:false,
								url:'',
								is_param:false,
								url_param:'',
								title: "标题",
								showtitle: "标题",
								img: "/Public/drag/images/waitupload.png"
							}
						}
						if(self.type_edit=='tpl_diy_edit_type10'){
							var addlist = {
								link: "#",
								is_url:false,
								url:'',
								is_param:false,
								url_param:'',
								showtitle: "首页",
								title: "首页",
								img: "/Public/drag/images/icon_home.png",
								bgColor: "#07a0e7",
								cloPicker: '0',
								fotColor: '#fff'
							};
						}
						self.HClist[i]['content'][type].push(addlist);
					}else{
						return false;
					}
					templist = self.HClist[i]['content'][type];
					self.HClist[i]['content'][type] = [];
					self.HClist[i]['content'][type] = templist;
					//self.$forceUpdate();
					break;
				}
			}
		}
	},
});