iview-select-tree
Version:
这是一个基于iview编写的下拉菜单的一个实现的组件
2 lines • 12.8 kB
JavaScript
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("selectTree",[],t):"object"==typeof exports?exports.selectTree=t():e.selectTree=t()}("undefined"!=typeof self?self:this,function(){return function(e){function t(r){if(i[r])return i[r].exports;var n=i[r]={i:r,l:!1,exports:{}};return e[r].call(n.exports,n,n.exports,t),n.l=!0,n.exports}var i={};return t.m=e,t.c=i,t.d=function(e,i,r){t.o(e,i)||Object.defineProperty(e,i,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var i=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(i,"a",i),i},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="/dist/",t(t.s=1)}([function(e,t,i){"use strict";t.a={name:"selectTree",props:{treeData:{type:Array},value:{},filterable:{type:Boolean,default:!1},multiple:{type:Boolean,default:!1},clearable:{type:Boolean,default:!1}},data:function(){return{queryVal:"",hideValue:"",valueType:"string",selectNode:[],multipleShowVal:[],multipleHideVal:[],showTree:!1,iconVal:"ios-arrow-down",cloneData:JSON.parse(JSON.stringify(this.treeData)),showData:[],queryData:[],queryTreeVal:""}},methods:{clickIcon:function(){"ios-close-circle"===this.iconVal?this.clearVal():this.showSelectTree()},pickTree:function(e){if("string"===this.valueType)for(var t=0;t<this.showData.length;t++)this.showData[t].value===e?this.showData[t].selected=!1:void 0!==this.showData[t].children&&this.recursionPickTree(e,this.showData[t].children);else for(var i=0;i<e.length;i++)for(var r=0;r<this.showData.length;r++)this.showData[r].value===e[i]?this.showData[r].selected=!1:void 0!==this.showData[r].children&&this.recursionPickTree(e[i],this.showData[r].children)},recursionPickTree:function(e,t){for(var i=0;i<t.length;i++)t[i].value===e?t[i].selected=!1:void 0!==t[i].children&&t[i].children.length>0&&this.recursionPickTree(e,t[i].children)},selectTreeChange:function(){if(this.queryData=JSON.parse(JSON.stringify(this.showData)),""!==this.queryTreeVal){for(var e=[],t=0;t<this.queryData.length;t++){this.recursionTreeData(this.queryTreeVal,this.queryData[t])||e.push(t)}this.queryData=this.queryData.filter(function(t,i){return!e.includes(i)})}},recursionTreeData:function(e,t){var i=!1,r=[];if(void 0===t.children)return-1!==t.title.indexOf(e);for(var n=0;n<t.children.length;n++)i?this.recursionTreeData(e,t.children[n])||r.push(n):(i=this.recursionTreeData(e,t.children[n]))||r.push(n);return t.children=t.children.filter(function(e,t){return!r.includes(t)}),i||-1!==t.title.indexOf(e)},clearVal:function(){this.clearable&&!this.multiple&&"ios-close-circle"===this.iconVal&&(this.pickTree(this.hideValue),this.queryVal="",this.hideValue="",this.showTree?this.iconVal="ios-arrow-up":this.iconVal="ios-arrow-down",this.$emit("input",""))},mouseover:function(){this.clearable&&!this.multiple&&"ios-close-circle"!==this.iconVal&&""!==this.hideValue&&(this.iconVal="ios-close-circle")},mouseleave:function(){this.clearable&&!this.multiple&&(this.showTree?this.iconVal="ios-arrow-up":this.iconVal="ios-arrow-down")},selectChange:function(e){if(this.multiple){this.multipleShowVal=[],this.multipleHideVal=[];for(var t=0;t<e.length;t++)this.multipleShowVal.push(e[t].title),this.multipleHideVal.push(e[t].value);this.$emit("input",this.multipleHideVal)}else 0===e.length?(this.queryVal="",this.hideValue="",this.$emit("input","")):(this.queryVal=e[0].title,this.hideValue=e[0].value,this.$emit("input",e[0].value)),this.showTree=!1,this.iconVal="ios-arrow-down"},clickInputShow:function(){this.multiple?"ios-arrow-up"!==this.iconVal&&this.showSelectTree():this.showSelectTree()},showSelectTree:function(){console.log("this.showTree=>"+this.showTree),this.showTree?this.showTree=!1:this.showTree=!0,"ios-close-circle"!==this.iconVal&&("ios-arrow-down"===this.iconVal?this.iconVal="ios-arrow-up":"ios-arrow-up"===this.iconVal&&(this.iconVal="ios-arrow-down"))},resetTreeData:function(){this.cloneData=JSON.parse(JSON.stringify(this.treeData))},removeVal:function(e){for(var t=0;t<this.showData.length;t++)this.showData[t].value===this.multipleHideVal[e]?(this.hideValue=this.treeData[t].value,this.queryVal=this.treeData[t].title,this.showData[t].selected=!1):void 0!==this.showData[t].children&&this.recursionRemoveTreeData(this.showData[t].children,this.multipleHideVal[e]);this.multipleShowVal.splice(e,1),this.multipleHideVal.splice(e,1)},recursionRemoveTreeData:function(e,t){for(var i=0;i<e.length;i++){if(e[i].value===t)return void(e[i].selected=!1);void 0!==e[i].children&&e[i].children.length>0&&this.recursionRemoveTreeData(e[i].children,t)}},checkValueType:function(){"string"!=typeof this.value&&(this.valueType="array")},initQueryMultiple:function(){for(var e=0;e<this.value.length;e++)for(var t=0;t<this.cloneData.length;t++){if(this.cloneData[t].value===this.value[e]){this.multipleShowVal.push(this.cloneData[t].title),this.multipleHideVal.push(this.cloneData[t].value),this.$emit("input",this.multipleHideVal),this.cloneData[t].selected=!0;break}void 0!==this.cloneData[t].children&&this.recursionQueryTreeData(this.cloneData[t].children,this.value[e])}},initQueryVal:function(){this.$emit("input","");for(var e=0;e<this.cloneData.length;e++){if(this.cloneData[e].value===this.value)return this.hideValue=this.cloneData[e].value,this.queryVal=this.cloneData[e].title,this.$emit("input",this.cloneData[e].value),void(this.cloneData[e].selected=!0);void 0!==this.cloneData[e].children&&this.recursionQueryTreeData(this.cloneData[e].children,this.value)}},recursionQueryTreeData:function(e,t){for(var i=0;i<e.length;i++)e[i].value===t?(this.multiple?(this.multipleShowVal.push(e[i].title),this.multipleHideVal.push(e[i].value),this.$emit("input",this.multipleHideVal)):(this.hideValue=e[i].value,this.queryVal=e[i].title,this.$emit("input",e[i].value)),e[i].selected=!0):void 0!==e[i].children&&this.recursionQueryTreeData(e[i].children,t)}},mounted:function(){this.checkValueType(),this.multiple?this.initQueryMultiple():this.initQueryVal(),this.showData=JSON.parse(JSON.stringify(this.cloneData)),this.queryData=this.showData}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=i(2);r.a.install=function(e){return e.component(r.a.name,r.a)},t.default=r.a},function(e,t,i){"use strict";function r(e){i(3)}var n=i(0),s=i(9),a=i(8),l=r,o=a(n.a,s.a,!1,l,null,null);t.a=o.exports},function(e,t,i){var r=i(4);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);i(6)("2e05695e",r,!0,{})},function(e,t,i){t=e.exports=i(5)(!1),t.push([e.i,".ivu-select-placeholder{color:#c5c8ce;padding-right:22px}.ivu-select-placeholder,.ivu-select-selected-value{display:block;height:30px;line-height:30px;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:8px}.ivu-select-selected-value{padding-right:24px}",""])},function(e,t){function i(e,t){var i=e[1]||"",n=e[3];if(!n)return i;if(t&&"function"==typeof btoa){var s=r(n);return[i].concat(n.sources.map(function(e){return"/*# sourceURL="+n.sourceRoot+e+" */"})).concat([s]).join("\n")}return[i].join("\n")}function r(e){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */"}e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var r=i(t,e);return t[2]?"@media "+t[2]+"{"+r+"}":r}).join("")},t.i=function(e,i){"string"==typeof e&&(e=[[null,e,""]]);for(var r={},n=0;n<this.length;n++){var s=this[n][0];"number"==typeof s&&(r[s]=!0)}for(n=0;n<e.length;n++){var a=e[n];"number"==typeof a[0]&&r[a[0]]||(i&&!a[2]?a[2]=i:i&&(a[2]="("+a[2]+") and ("+i+")"),t.push(a))}},t}},function(e,t,i){function r(e){for(var t=0;t<e.length;t++){var i=e[t],r=c[i.id];if(r){r.refs++;for(var n=0;n<r.parts.length;n++)r.parts[n](i.parts[n]);for(;n<i.parts.length;n++)r.parts.push(s(i.parts[n]));r.parts.length>i.parts.length&&(r.parts.length=i.parts.length)}else{for(var a=[],n=0;n<i.parts.length;n++)a.push(s(i.parts[n]));c[i.id]={id:i.id,refs:1,parts:a}}}}function n(){var e=document.createElement("style");return e.type="text/css",h.appendChild(e),e}function s(e){var t,i,r=document.querySelector("style["+y+'~="'+e.id+'"]');if(r){if(f)return v;r.parentNode.removeChild(r)}if(g){var s=p++;r=d||(d=n()),t=a.bind(null,r,s,!1),i=a.bind(null,r,s,!0)}else r=n(),t=l.bind(null,r),i=function(){r.parentNode.removeChild(r)};return t(e),function(r){if(r){if(r.css===e.css&&r.media===e.media&&r.sourceMap===e.sourceMap)return;t(e=r)}else i()}}function a(e,t,i,r){var n=i?"":r.css;if(e.styleSheet)e.styleSheet.cssText=w(t,n);else{var s=document.createTextNode(n),a=e.childNodes;a[t]&&e.removeChild(a[t]),a.length?e.insertBefore(s,a[t]):e.appendChild(s)}}function l(e,t){var i=t.css,r=t.media,n=t.sourceMap;if(r&&e.setAttribute("media",r),m.ssrId&&e.setAttribute(y,t.id),n&&(i+="\n/*# sourceURL="+n.sources[0]+" */",i+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(n))))+" */"),e.styleSheet)e.styleSheet.cssText=i;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(i))}}var o="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!o)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var u=i(7),c={},h=o&&(document.head||document.getElementsByTagName("head")[0]),d=null,p=0,f=!1,v=function(){},m=null,y="data-vue-ssr-id",g="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());e.exports=function(e,t,i,n){f=i,m=n||{};var s=u(e,t);return r(s),function(t){for(var i=[],n=0;n<s.length;n++){var a=s[n],l=c[a.id];l.refs--,i.push(l)}t?(s=u(e,t),r(s)):s=[];for(var n=0;n<i.length;n++){var l=i[n];if(0===l.refs){for(var o=0;o<l.parts.length;o++)l.parts[o]();delete c[l.id]}}}};var w=function(){var e=[];return function(t,i){return e[t]=i,e.filter(Boolean).join("\n")}}()},function(e,t){e.exports=function(e,t){for(var i=[],r={},n=0;n<t.length;n++){var s=t[n],a=s[0],l=s[1],o=s[2],u=s[3],c={id:e+":"+n,css:l,media:o,sourceMap:u};r[a]?r[a].parts.push(c):i.push(r[a]={id:a,parts:[c]})}return i}},function(e,t){e.exports=function(e,t,i,r,n,s){var a,l=e=e||{},o=typeof e.default;"object"!==o&&"function"!==o||(a=e,l=e.default);var u="function"==typeof l?l.options:l;t&&(u.render=t.render,u.staticRenderFns=t.staticRenderFns,u._compiled=!0),i&&(u.functional=!0),n&&(u._scopeId=n);var c;if(s?(c=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),r&&r.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(s)},u._ssrRegister=c):r&&(c=r),c){var h=u.functional,d=h?u.render:u.beforeCreate;h?(u._injectStyles=c,u.render=function(e,t){return c.call(t),d(e,t)}):u.beforeCreate=d?[].concat(d,c):[c]}return{esModule:a,exports:l,options:u}}},function(e,t,i){"use strict";var r=function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{staticClass:"ivu-select ivu-select-default"},[i("div",{staticClass:"ivu-select-selection ivu-form-item-content",attrs:{tabindex:"0"}},[i("div",{on:{mouseover:e.mouseover,mouseleave:e.mouseleave}},[i("div",{on:{click:e.clickInputShow}},[e._l(e.multipleShowVal,function(t,r){return e.multiple?i("div",{key:t,staticClass:"ivu-tag ivu-tag-checked "},[i("span",{staticClass:"ivu-tag-text "},[e._v(e._s(t))]),e._v(" "),i("i",{staticClass:"ivu-icon ivu-icon-ios-close",on:{click:function(t){return e.removeVal(r)}}})]):e._e()}),e._v(" "),e.multiple||""==e.queryVal?e._e():i("span",{staticClass:"ivu-select-selected-value"},[e._v(e._s(e.queryVal))]),e._v(" "),0===e.multipleHideVal.length&&e.multiple?i("span",{staticClass:"ivu-select-placeholder"},[e._v("请选择")]):e._e(),e._v(" "),""!==e.value||e.multiple?e._e():i("span",{staticClass:"ivu-select-placeholder"},[e._v("请选择")]),e._v(" "),i("span",{staticStyle:{display:"none"}})],2),e._v(" "),i("i",{class:"ivu-icon ivu-icon-"+e.iconVal+" ivu-select-arrow",on:{click:e.clickIcon}})]),e._v(" "),i("div",{directives:[{name:"show",rawName:"v-show",value:e.showTree,expression:"showTree"}],staticClass:"ivu-select-dropdown",staticStyle:{"max-height":"200px","overflow-y":"scroll","z-index":"9999",width:"100%"}},[i("div",{staticStyle:{width:"95%","margin-left":"10px"}},[i("Input",{attrs:{placeholder:"请输入筛选条件"},on:{"on-change":e.selectTreeChange},model:{value:e.queryTreeVal,callback:function(t){e.queryTreeVal=t},expression:"queryTreeVal"}})],1),e._v(" "),i("Tree",{ref:"tree",attrs:{data:e.queryData,multiple:e.multiple},on:{"on-select-change":e.selectChange}})],1)])])},n=[],s={render:r,staticRenderFns:n};t.a=s}])});
//# sourceMappingURL=selectTree.js.map