2 lines
6.0 KiB
JavaScript
2 lines
6.0 KiB
JavaScript
layui.define(["jquery","layer"],function(x){var f="selectM",i=layui.jquery,g=layui.layer,v=function(r){this.disabledIndex=[],this.selected=[],this.values=[],this.names=[],this.config={elem:"",data:[],selected:[],tips:"请选择 最多 {max} 个",max:5,width:null,verify:"",name:"",delimiter:",",field:{idName:"id",titleName:"name",statusName:"status"}},this.config=i.extend(this.config,r),this.createOption=function(){var e=this,l=e.config,t=l.field,s=l.data,d=l.selected;$E=i(l.elem);var a=l.tips.replace("{max}",l.max),c=l.name==""?l.elem.replace("#","").replace(".",""):l.name,o=l.verify==""?"":'lay-verify="'+l.verify+'" ',n="";n+='<div class="layui-unselect layui-form-select">',n+='<div class="layui-select-title">',n+="<input "+o+'name="'+c+'" type="text" readonly="" class="layui-input layui-unselect">',n+="</div>",n+='<div class="layui-input multiple">',n+="</div>",n+='<dl class="layui-anim layui-anim-upbit">',n+='<dd lay-value="" class="layui-select-tips">'+a+"</dd>";for(var u=0;u<s.length;u++){var p="",m="";s[u][t.statusName]==0&&(e.disabledIndex[s[u][t.idName]]=s[u][t.titleName],p=s[u][t.statusName]==0?"layui-disabled":"",m=s[u][t.statusName]==0?" layui-checkbox-disbaled layui-disabled":""),n+='<dd lay-value="'+s[u][t.idName]+'" class="'+p+'">',n+='<div class="layui-unselect layui-form-checkbox'+m+'" lay-skin="primary">',n+="<span>"+s[u][t.titleName]+'</span><i class="layui-icon"></i>',n+="</div>",n+="</dd>"}n+="</dl>",n+="</div>",$E.html(n)},this.set=function(e){var l=this,t=l.config,s=typeof e=="undefined"?t.selected:e;$E=i(t.elem),$E.find(".layui-form-checkbox").removeClass("layui-form-checked"),$E.find("dd").removeClass("layui-this");for(var d=s.length>t.max?t.max:s.length,a=0;a<d;a++)s[a]&&!l.disabledIndex.hasOwnProperty(s[a])&&$E.find("dd[lay-value="+s[a]+"]").addClass("layui-this");$E.find("dd.layui-this").each(function(){i(this).find("div").addClass("layui-form-checked")}),l.setSelected(e)},this.redata=function(e){this.config.data=e,this.createOption()},this.setSelected=function(e){var l=this,t=l.config,s=t.field;$E=i(t.elem);var d=[],a=[],c=[],o=[],n=$E.find("dd.layui-this");if(n.length==0){var u=t.tips.replace("{max}",t.max);o.push('<span class="tips">'+u+"</span>")}else n.each(function(){$this=i(this);var m={},y=$this.attr("lay-value"),h=$this.find("span").text();m[s.idName]=y,m[s.titleName]=h,d.push(y),a.push(h),o.push('<a href="javascript:;"><span lay-value="'+y+'">'+h+'</span><i class="layui-icon">ဆ</i></a>'),c.push(m)});o.push('<i class="layui-edge" style="pointer-events: none;"></i>'),$E.find(".multiple").html(o.join("")),$E.find(".layui-select-title").find("input").each(function(){typeof e=="undefined"&&(this.defaultValue=d.join(t.delimiter)),this.value=d.join(t.delimiter)});var p=$E.find(".multiple").height()+14;$E.find(".layui-form-select dl").css("top",p+"px"),l.values=d,l.names=a,l.selected=c},this.getData=function(e){var l;return i.ajax({url:e,dataType:"json",async:!1,success:function(t){l=t},error:function(){console.error(f+" hint:候选数据ajax请求错误 "),l=!1}}),l}};v.prototype.render=function(){var r=this,e=r.config,l=e.field;if($E=i(e.elem),$E.length==0)return console.error(f+" hint:找不到容器 "+e.elem),!1;if(Object.prototype.toString.call(e.data)!="[object Array]"){var t=r.getData(e.data);if(t===!1)return console.error(f+" hint:缺少分类数据"),!1;r.config.data=t}if($E.addClass("lay-ext-mulitsel"),/^\d+$/.test(e.width)&&$E.css("width",e.width+"px"),i("#lay-ext-mulitsel-style").length==0){var s=".lay-ext-mulitsel .layui-form-select dl dd div{margin-top:0px!important;}.lay-ext-mulitsel .layui-form-select dl dd.layui-this{background-color:#fff}.lay-ext-mulitsel .layui-input.multiple{line-height:auto;height:auto;padding:4px 10px 4px 10px;overflow:hidden;min-height:38px;margin-top:-38px;left:0;z-index:99;position:relative;background:#fff;}.lay-ext-mulitsel .layui-input.multiple a{padding:2px 5px;background:#5FB878;border-radius:2px;color:#fff;display:block;line-height:20px;height:20px;margin:2px 5px 2px 0;float:left;}.lay-ext-mulitsel .layui-input.multiple a i{margin-left:4px;font-size:14px;} .lay-ext-mulitsel .layui-input.multiple a i:hover{background-color:#009E94;border-radius:2px;}.lay-ext-mulitsel .danger{border-color:#FF5722!important}.lay-ext-mulitsel .tips{pointer-events: none;position: absolute;left: 10px;top: 10px;color:#757575;}";i('<style id="lay-ext-mulitsel-style"></style>').text(s).appendTo(i("head"))}r.createOption(),r.set(),$E.on("click",".layui-select-title,.multiple,.multiple.layui-edge",function(d){i(".lay-ext-mulitsel").not(e.elem).removeClass("layui-form-selected"),i(e.elem).is(".layui-form-selected")?(i(e.elem).removeClass("layui-form-selected"),i(document).off("click",mEvent)):(i(e.elem).addClass("layui-form-selected"),i(document).on("click",mEvent=function(a){a.target.id!==e.elem&&a.target.className!=="layui-input multiple"&&(i(e.elem).removeClass("layui-form-selected"),i(document).off("click",mEvent))}))}),$E.on("click","dd",function(d){var a=i(this);if(a.hasClass("layui-disabled"))return!1;if(a.is(".layui-select-tips"))a.siblings().removeClass("layui-this"),i(e.elem).find(".layui-form-checkbox").removeClass("layui-form-checked");else if(a.is(".layui-this"))a.removeClass("layui-this"),a.find(".layui-form-checkbox").removeClass("layui-form-checked"),d.stopPropagation();else{if(r.selected.length>=e.max)return i(e.elem+" .multiple").addClass("danger"),g.tips("最多只能选择 "+e.max+" 个",e.elem+" .multiple",{tips:3,time:1e3,end:function(){i(e.elem+" .multiple").removeClass("danger")}}),!1;a.addClass("layui-this"),a.find(".layui-form-checkbox").addClass("layui-form-checked"),d.stopPropagation()}r.setSelected()}),$E.on("click","a i",function(d){var a=i(this).prev("span"),c=a.attr("lay-value");if(c){var o=i(e.elem).find("dd[lay-value="+c+"]");o.removeClass("layui-this"),o.find(".layui-form-checkbox").removeClass("layui-form-checked")}r.setSelected(),a.parent().remove(),d.stopPropagation()}),$E.find("input").focus(function(){i(e.elem+" .multiple").addClass("danger"),setTimeout(function(){i(e.elem+" .multiple").removeClass("danger")},3e3)})},x(f,function(r){var e=new v(r);return e.render(),e})});
|