UNPKG

okr-tree-org

Version:

![npm](https://img.shields.io/npm/v/vue3-tree-org) ![npm](https://img.shields.io/npm/dm/vue3-tree-org) ![NPM](https://img.shields.io/npm/l/vue3-tree-org) [![star](https://gitee.com/sangtian152/vue3-tree-org/badge/star.svg?theme=white)](https://gite

2 lines (1 loc) 33.6 kB
import{h as e,withDirectives as n,vShow as t,resolveDirective as o,defineComponent as a,ref as l,computed as r,onMounted as d,onBeforeUnmount as s,openBlock as c,createElementBlock as u,toDisplayString as i,createCommentVNode as p,createElementVNode as f,normalizeClass as m,onBeforeMount as v,onUnmounted as g,watch as y,warn as h,normalizeStyle as b,renderSlot as x,resolveComponent as $,createBlock as N,Teleport as S,createVNode as z,createSlots as E,withCtx as D,nextTick as C,reactive as k,Transition as M,Fragment as O,renderList as w,vModelText as _}from"vue";var R="okr-tree-org",F="1.0.0";const A=function(e){return"[object Object]"===Object.prototype.toString.call(e)},B=function(e){return"string"==typeof e},L=function(e){return"number"==typeof e},T={print:(e,n,t)=>B(n)||"boolean"==typeof t,pretty:(e,n,t)=>B(n)&&B(e)||"string"==typeof t,primary:(e,n)=>B(e)||"boolean"==typeof n,success:(e,n)=>B(e)||"boolean"==typeof n,info:(e,n)=>B(e)||"boolean"==typeof n,warning:(e,n)=>B(e)||"boolean"==typeof n,danger:(e,n)=>B(e)||"boolean"==typeof n};function j(e="default"){let n="";switch(e){case"primary":n="#2d8cf0";break;case"success":n="#19be6b";break;case"info":n="#909399";break;case"warning":n="#ff9900";break;case"danger":n="#ff4d4f";break;case"default":n="#35495E";break;default:n=e}return n}T.print=function(e,n="default",t=!1){return"object"==typeof e?(console.dir(e),!0):(t?console.log(`%c ${e} `,`background:${j(n)}; padding: 2px; border-radius: 4px;color: #fff;`):console.log(`%c ${e} `,`color: ${j(n)};`),!0)},T.pretty=function(e,n,t="primary"){return console.log(`%c ${e} %c ${n} %c`,`background:${j(t)};border:1px solid ${j(t)}; padding: 1px; border-radius: 4px 0 0 4px; color: #fff;`,`border:1px solid ${j(t)}; padding: 1px; border-radius: 0 4px 4px 0; color: ${j(t)};`,"background:transparent"),!0},T.primary=function(e,n=!1){return this.print&&this.print(e,"primary",n),!0},T.success=function(e,n=!1){return this.print&&this.print(e,"success",n),!0},T.info=function(e,n=!1){return this.print&&this.print(e,"info",n),!0},T.warning=function(e,n=!1){return this.print&&this.print(e,"warning",n),!0},T.danger=function(e,n=!1){return this.print&&this.print(e,"danger",n),!0};var V={async install(e){e.config.globalProperties.$log=T,T.pretty("["+R+"] "+F,"success")}};const Y=function(){let e=!1;return{get:()=>e,set:n=>{e=n}}}(),P=function(e,n,t){const{id:o,children:a}=n;if(e[o]===t)return e;if(Array.isArray(e[a])){const o=e[a];for(let e=0,a=o.length;e<a;e++){const a=o[e],l=P(a,n,t);if(l)return l}}},X=function(e,n){const{parenNode:t,onlyOneNode:o,cloneNodeDrag:a}=n;if(t.value){const{keys:l}=n,{id:r,pid:d,children:s}=l,c=t.value.$$data,u=JSON.parse(JSON.stringify(e.$$data));a?(!function(e,n,t){const{children:o}=n;if(A(e))a(e);else if(Array.isArray(e))for(let n=0,t=e.length;n<t;n++)a(e[n]);function a(e){if(t(e),Array.isArray(e[o])){const n=e[o];for(let e=0,t=n.length;e<t;e++)a(n[e])}}}(u,l,(function(e){"string"==typeof e[r]&&-1!==e[r].indexOf("clone-node")&&(e[r]=`clone-node-${e[r]}`)})),o&&Array.isArray(u[s])&&(u[s]=[]),u[l.pid]=c[l.id],c[s]?c[s].push(u):c[s]=[u]):(!function(e,n){const{keys:t,data:o,onlyOneNode:a}=n,{id:l,pid:r,children:d}=t,s=P(o,t,e[r]),c=s[d];let u;for(let n=0,t=c.length;n<t;n++)if(c[n][l]===e[l]){c.splice(n,1),u=n;break}const i=e[d];a&&void 0!==u&&i&&(e[d]=[],i.forEach((e=>{e[r]=s[l]})),s[d].splice(u,0,...i))}(u,n),u[d]=c[r],c[s]?c[s].push(u):c[s]=[].concat(u))}},K={beforeMount(e,n){const{l:t,t:o}=n.modifiers,{drag:a,dragData:l,node:r,emit:d,beforeDragEnd:s,initNodes:c}=n.value,{value:u}=n,i={...l};e.addEventListener("mousedown",(function(e){const n=e.target;if(!1===a||0!==e.button||r.focused||r.$$data.noDragging||n.className.indexOf("tree-org-node-btn")>-1)return!1;(function(e){e.stopPropagation(),v=e.screenX,g=e.screenY,f=0,i.contextmenu.value=!1;const{keys:n,onlyOneNode:t}=i;if(t){const{children:e}=n,t={...r.$$data};t[e]=[],i.cloneData.value=c(t)}else i.cloneData.value=c(r.$$data)})(e),document.addEventListener("mousemove",y),document.addEventListener("mouseup",h),x("start")}));let p,f=0,m=!1,v=0,g=0;function y(n){return n.preventDefault(),!(Math.abs(n.screenX-v)<5&&Math.abs(n.screenY-g)<5)&&(m||(m=!0,function(n){Y.set(!0),i.nodeMoving.value=!0,r.moving=!0;let t=e;for(;!t.classList.contains("tree-org-node");)f+=t.offsetLeft,t=t.offsetParent;f+=2,p=document.querySelector("#clone-tree-org"),p&&(p.style.width=`${t.clientWidth}px`,p.style.opacity="0.8",p.style.left=n.clientX-f+"px",p.style.top=n.clientY+2+"px")}(n)),t&&o&&u?(p&&(p.style.left=n.clientX-f+"px",p.style.top=n.clientY+2+"px"),void x("move")):t&&u?(e.style.left=n.clientX-f+"px",void x("move")):void(o&&u&&(e.style.top=n.clientY+"px",x("move"))))}function h(e){if(document.removeEventListener("mousemove",y),document.removeEventListener("mouseup",h),m){if("function"==typeof s){const n=s(r,i.parenNode.value);n&&n.then?n.then((()=>{b(e)}),(()=>{})):!1!==n&&b(e)}else b(e);m=!1,p=null,r.moving=!1,i.nodeMoving.value=!1,setTimeout((()=>{Y.set(!1)}),200)}}function b(e){const n=document.querySelector(".tree-org-node__moving");if(n&&n.contains(e.target))return x("end"),!1;X(r,i),x("end")}function x(e){"start"!==e?"move"!==e?"end"===e&&d("on-node-drag-end",r,i.parenNode.value):d("on-node-drag",r):d("on-node-drag-start",r)}}};const W={onClick:"onNodeClick",onDblclick:"onNodeDblclick",onContextmenu:"onNodeContextmenu",onMouseenter:"onNodeMouseenter",onMouseleave:"onNodeMouseleave"};function q(e,n){if("function"==typeof e)return function(t){t.target.className.indexOf("org-tree-node-btn")>-1||e(t,n)}}const U=(e,n,t)=>!(Array.isArray(e[n])&&e[n].length>0)&&!t||e.isLeaf,I=(e,o,a)=>{const{attrs:l}=a,r=["tree-org-node"],d=[],{expand:s,children:c,id:u}=o;return U(o,"children",l.lazy)?r.push("is-leaf"):l.collapsable&&!s&&r.push("collapsed"),o.moving&&r.push("tree-org-node__moving"),d.push(J(e,o,a)),l.collapsable&&!s||d.push(H(e,c,a)),n(e("div",{class:r,key:u},d),[[t,!o.hidden]])},J=(e,a,l)=>{const{attrs:r}=l,d=r.props,s=r.renderContent,{label:c}=a,u=[];if(l.slots.default)u.push(l.slots.default({node:a}));else if("function"==typeof s){T.warning("scoped-slot header is easier to use. We recommend users to use scoped-slot header.");const n=s(e,a);n&&u.push(n)}else u.push(e("div",{class:"tree-org-node__text"},c));r.collapsable&&!U(a,"children",r.lazy)&&u.push(((e,n,t)=>{const{attrs:o}=t,a=o.onOnExpand,l=["tree-org-node__expand"];n.expand&&l.push("expanded");const r=[];return t.slots.expand?r.push(t.slots.expand({node:n})):r.push(e("span",{class:"tree-org-node__expand-btn"})),e("span",{class:l,onMousedown:e=>{e.stopPropagation()},onDblclick:e=>{e.stopPropagation()},onClick:e=>{e.stopPropagation(),a&&a(e,n)}},r)})(e,a,l));const i=["tree-org-node__inner"];let{labelStyle:p,labelClassName:f,selectedClassName:m,selectedKey:v}=r;"function"==typeof f&&(f=f(a)),f&&i.push(f),a.className&&i.push(a.className),"function"==typeof m&&(m=m(a)),void 0!==v&&(v=Array.isArray(v)?v:[v]),m&&v&&v.includes(a.id)&&i.push(m);const g=["tree-org-node__content"];a.$$root&&g.push(`is-root_${r.suffix}`),a.label||g.push("is-empty"),a.$$focused&&g.push("is-edit");const y=o("nodedrag"),h=[];r.vNodedrag&&y&&!a.$$root&&h.push([y,Object.assign({node:a},r.vNodedrag),"",{l:!0,t:!0}]);const b={};for(const e in W)if(Object.prototype.hasOwnProperty.call(W,e)){const n=r[W[e]];n&&(b[e]=q(n,a))}const x=r.onNodeFocus,$=r.onNodeBlur,N=o("focus"),S=[[t,a.$$focused]];return N&&S.push([N,a.$$focused]),e("div",{class:g},[n(e("div",{class:i,style:a.style?a.style:p,...b},u),h),n(e("textarea",{class:"tree-org-node__textarea",placeholder:"请输入节点名称",value:a.label,onFocus:e=>{x&&x(e,a.$$data,a)},onInput:e=>{a.label=e.target.value},onBlur:e=>{void 0!==a.$$data.focused&&(a.$$data.focused=!1),a.$$data[d.label]=e.target.value,a.$$focused=!1,$&&$(e,a.$$data,a)},onClick:e=>e.stopPropagation()}),S)])},H=(e,n,t)=>{if(Array.isArray(n)&&n.length){const o=n.filter((e=>!e.$$hidden)).map((n=>I(e,n,t)));return e("div",{class:"tree-org-node__children"},o)}return""},G=(n,t)=>n.data&&0!==Object.keys(n.data).length?(n.data.$$root=!n.isClone,I(e,n.data,t)):"";G.directives={focus:{mounted(e,{value:n}){n&&e.focus()},updated(e,{value:n}){n&&e.focus()}},nodedrag:K};var Q=a({props:{scale:String,tools:Object},setup(e,{emit:n}){const t=l(!1),o=l(!1);function a(e){o.value=!o.value,n("onFullscreen",e)}function c(){document.isFullScreen||document.mozIsFullScreen||document.webkitIsFullScreen||!o.value||a("esc")}const u=r((()=>t.value?"全部收起":"全部展开")),i=r((()=>o.value?"退出全屏":"全屏"));return d((()=>{window.addEventListener("resize",c)})),s((()=>{window.removeEventListener("resize",c)})),{expanded:t,fullscreen:o,expandTitle:u,fullTiltle:i,handleExpand:function(){t.value=!t.value,n("onExpand")},handleScale:function(e){"out"===e?n("onScale",.1):"in"===e?n("onScale",-.1):n("onRestore")},handleFullscreen:a}}});const Z={class:"zm-tree-handle"},ee={key:0,class:"zm-tree-percent"},ne=["title"],te={class:"zm-tree-svg"},oe=[f("span",{class:"zm-tree-icon"},"+",-1)],ae=[f("span",{class:"zm-tree-icon"},"-",-1)],le=[f("span",{class:"zm-tree-restore"},null,-1)],re=["title"],de={class:"zm-tree-svg"};function se(e){return"function"==typeof e||"[object Function]"===Object.prototype.toString.call(e)}function ce(e,n,t,o=1){return{deltaX:Math.round(n/o/e[0])*e[0],deltaY:Math.round(t/o/e[1])*e[1]}}function ue(e,n,t){return e<n?n:t<e?t:e}Q.render=function(e,n,t,o,a,l){return c(),u("div",Z,[e.tools.scale?(c(),u("div",ee,i(e.scale),1)):p("v-if",!0),e.tools.expand?(c(),u("div",{key:1,onClick:n[0]||(n[0]=(...n)=>e.handleExpand&&e.handleExpand(...n)),title:e.expandTitle,class:"zm-tree-handle-item"},[f("span",te,[f("i",{class:m(["treefont",e.expanded?"icon-collapse":"icon-expand"])},null,2)])],8,ne)):p("v-if",!0),e.tools.zoom?(c(),u("div",{key:2,onClick:n[1]||(n[1]=n=>e.handleScale("out")),title:"放大",class:"zm-tree-handle-item zoom-out"},oe)):p("v-if",!0),e.tools.zoom?(c(),u("div",{key:3,onClick:n[2]||(n[2]=n=>e.handleScale("in")),title:"缩小",class:"zm-tree-handle-item zoom-in"},ae)):p("v-if",!0),e.tools.restore?(c(),u("div",{key:4,onClick:n[3]||(n[3]=n=>e.handleScale("restore")),title:"还原",class:"zm-tree-handle-item"},le)):p("v-if",!0),e.tools.fullscreen?(c(),u("div",{key:5,onClick:n[4]||(n[4]=(...n)=>e.handleFullscreen&&e.handleFullscreen(...n)),title:e.fullTiltle,class:"zm-tree-handle-item"},[f("span",de,[f("i",{class:m(["treefont",e.fullscreen?"icon-unfullscreen":"icon-fullscreen"])},null,2)])],8,re)):p("v-if",!0)])},Q.__file="src/components/tools/tools.vue";const ie=function(e,n,t,o=!1){e&&n&&t&&e.addEventListener(n,t,o)},pe=function(e,n,t,o=!1){e&&n&&t&&e.removeEventListener(n,t,o)},fe=(e,{emit:n},t)=>{const o={start:"mousedown",move:"mousemove",stop:"mouseup"},a={start:"touchstart",move:"touchmove",stop:"touchend"},s={userSelect:"none",MozUserSelect:"none",WebkitUserSelect:"none",MsUserSelect:"none"},c={userSelect:"auto",MozUserSelect:"auto",WebkitUserSelect:"auto",MsUserSelect:"auto"};let u=o;const i=l(e.x),p=l(e.y),f=l(e.z),m=l(e.active),h=l(!1),b=l(0),x=l(0),$=l(0),N=l(0),S=l(0),z=l(0);let E={},D={};function C(){E={mouseX:0,mouseY:0,x:0,y:0,w:0,h:0},D={minLeft:-1/0,maxLeft:1/0,minRight:-1/0,maxRight:1/0,minTop:-1/0,maxTop:1/0,minBottom:-1/0,maxBottom:1/0}}function k(){if(e.parent){const[e,n]=M();S.value=e||0,z.value=n||0}}function M(){if(e.parent&&t.eleRef.value){const e=window.getComputedStyle(t.eleRef.value.parentNode,null);return[parseInt(e.getPropertyValue("width"),10),parseInt(e.getPropertyValue("height"),10)]}return[0,0]}function O(o){if(o instanceof MouseEvent&&1!==o.which)return;const a=o.target||o.srcElement;if(a&&t.eleRef.value&&t.eleRef.value.contains(a)){if(e.dragCancel&&function(e,n,t){let o=e;const a=["matches","webkitMatchesSelector","mozMatchesSelector","msMatchesSelector","oMatchesSelector"].find((e=>o&&se(o[e])))||"";if(!se(o[a]))return!1;do{if(o[a](n))return!0;if(o===t)return!1;o=o.parentNode}while(o);return!1}(a,e.dragCancel,t.eleRef.value))return void(h.value=!1);m.value||(m.value=!0,n("activated"),n("update:active",!0)),e.draggable&&(h.value=!0),o instanceof MouseEvent?(E.mouseX=o.pageX,E.mouseY=o.pageY):(E.mouseX=o.touches[0].pageX,E.mouseY=o.touches[0].pageY),E.left=i.value,E.right=b.value,E.top=p.value,E.bottom=x.value,e.parent&&(D=w()),ie(document.documentElement,u.move,R),ie(document.documentElement,u.stop,F)}}function w(){const n=e.grid;return{minLeft:i.value%n[0],maxLeft:Math.floor((S.value-$.value-i.value)/n[0])*n[0]+i.value,minRight:b.value%n[0],maxRight:Math.floor((S.value-$.value-b.value)/n[0])*n[0]+b.value,minTop:p.value%n[1],maxTop:Math.floor((z.value-N.value-p.value)/n[1])*n[1]+p.value,minBottom:x.value%n[1],maxBottom:Math.floor((z.value-N.value-x.value)/n[1])*n[1]+x.value}}function _(o){const a=o.target||o.srcElement;t.eleRef.value&&!t.eleRef.value.contains(a)&&m.value&&!e.preventDeactivation&&(m.value=!1,n("deactivated"),n("update:active",!1))}function R(t){h.value&&function(t){const o=e.axis,a=e.grid;let l=0,r=0;t instanceof MouseEvent?(l=t.pageX,r=t.pageY):(l=t.touches[0].pageX,r=t.touches[0].pageY);const d=o&&"y"!==o?E.mouseX-l:0,s=o&&"x"!==o?E.mouseY-r:0,{deltaX:c,deltaY:u}=ce(a,d,s,e.scale),f=ue(E.left-c,D.minLeft,D.maxLeft),m=ue(E.top-u,D.minTop,D.maxTop),v=ue(E.right+c,D.minRight,D.maxRight),g=ue(E.bottom+u,D.minBottom,D.maxBottom);i.value=f,p.value=m,b.value=v,x.value=g,n("dragging",i.value,p.value)}(t)}function F(){C(),h.value&&(h.value=!1,n("dragstop",i.value,p.value))}v((()=>{C()})),d((()=>{!e.enableNativeDrag&&t.eleRef.value&&(t.eleRef.value.ondragstart=()=>!1);const[n,o]=M();if(S.value=n,z.value=o,t.eleRef.value){const[e,n]=function(e){const n=window.getComputedStyle(e);return[parseFloat(n.getPropertyValue("width")),parseFloat(n.getPropertyValue("height"))]}(t.eleRef.value);$.value=e,N.value=n,b.value=S.value-$.value-i.value,x.value=z.value-N.value-p.value}ie(document.documentElement,"mousedown",_),ie(document.documentElement,"touchend touchcancel",_),ie(window,"resize",k)})),g((()=>{pe(document.documentElement,"mousedown",_),pe(document.documentElement,"touchstart",F),pe(document.documentElement,"mousemove",R),pe(document.documentElement,"touchmove",R),pe(document.documentElement,"mouseup",F),pe(document.documentElement,"touchend touchcancel",_),pe(window,"resize",k)}));const A=r((()=>({transform:`translate(${i.value}px, ${p.value}px)`,zIndex:f.value,...h.value&&e.disableUserSelect?s:c})));return y((()=>e.active),(e=>{m.value=e,n(e?"activated":"deactivated")})),y((()=>e.z),(e=>{(e>=0||"auto"===e)&&(f.value=e)})),y((()=>e.x),(n=>{h.value||(e.parent&&(D=w()),function(n){const{deltaX:t}=ce(e.grid,n,p.value,e.scale),o=ue(t,D.minLeft,D.maxLeft);i.value=o,b.value=S.value-$.value-o}(n))})),y((()=>e.y),(n=>{h.value||(e.parent&&(D=w()),function(n){const{deltaY:t}=ce(e.grid,i.value,n,e.scale),o=ue(t,D.minTop,D.maxTop);p.value=o,x.value=z.value-N.value-o}(n))})),{enabled:m,dragging:h,style:A,resetBoundsAndMouseState:C,elementTouchDown:function(e){u=a,O(e)},elementMouseDown:function(e){u=o,O(e)}}};"production"===process.env.NODE_ENV||Object.freeze({}),"production"===process.env.NODE_ENV||Object.freeze([]);const me=Symbol("wrapper");function ve(e,n){if(null===(t=e)||"object"!=typeof t||e.__elPropsReservedKey)return e;var t;const{values:o,required:a,default:l,type:r,validator:d}=e,s=o||d?e=>{let t=!1,a=[];if(o&&(a=[...o,l],t=t||a.includes(e)),d&&(t=t||d(e)),!t&&a.length>0){const t=[...new Set(a)].map((e=>JSON.stringify(e))).join(", ");h(`Invalid prop: validation failed${n?` for prop "${n}"`:""}. Expected one of [${t}], got value ${JSON.stringify(e)}.`)}return t}:void 0;return{type:"object"==typeof r&&Object.getOwnPropertySymbols(r).includes(me)?r[me]:r,validator:s,__elPropsReservedKey:!0,default:l,required:!!a}}const ge=e=>function(e){let n=-1;const t=e?e.length:0,o={};for(;++n<t;){const t=e[n];o[t[0]]=t[1]}return o}(Object.entries(e).map((([e,n])=>[e,ve(n,e)]))),ye=e=>({[me]:e});var he=a({replace:!0,name:"Draggable",props:ge({className:{type:String,default:"zm-draggable"},classNameDraggable:{type:String,default:"draggable"},classNameDragging:{type:String,default:"dragging"},classNameActive:{type:String,default:"active"},disableUserSelect:{type:Boolean,default:!0},enableNativeDrag:{type:Boolean,default:!1},preventDeactivation:{type:Boolean,default:!1},active:{type:Boolean,default:!1},draggable:{type:Boolean,default:!0},x:{type:Number,default:0},y:{type:Number,default:0},z:{type:[String,Number],default:"auto",validator:e=>"string"==typeof e?"auto"===e:e>=0},dragCancel:String,axis:{type:String,default:"both",validator:e=>["x","y","both"].includes(e)},grid:{type:Array,default:()=>[1,1]},parent:{type:Boolean,default:!1},scale:{type:Number,default:1,validator:e=>e>0}}),emits:{activated:()=>!0,deactivated:()=>!0,dragging:(e,n)=>L(e)&&L(n),dragstop:(e,n)=>L(e)&&L(n),"update:active":e=>"boolean"==typeof e},setup(e,n){const t=l(),o=fe(e,n,{eleRef:t});return{top:top,eleRef:t,...o}}});he.render=function(e,n,t,o,a,l){return c(),u("div",{style:b(e.style),class:m([{[e.classNameActive]:e.enabled,[e.classNameDragging]:e.dragging,[e.classNameDraggable]:e.draggable},e.className]),ref:"eleRef",onMousedown:n[0]||(n[0]=(...n)=>e.elementMouseDown&&e.elementMouseDown(...n)),onTouchstart:n[1]||(n[1]=(...n)=>e.elementTouchDown&&e.elementTouchDown(...n))},[x(e.$slots,"default")],38)},he.__file="src/components/draggable/src/draggable.vue";var be=a({components:{TreeOrgNode:G},props:ge({data:{type:Object,required:!0},props:{type:ye(Object)},modelValue:Boolean,horizontal:Boolean,selectedKey:String,collapsable:Boolean,renderContent:Function,labelStyle:Object,labelClassName:{type:[Function,String]}}),setup:(e,n)=>({defaultSlot:!!n.slots.default,expandSlot:!!n.slots.expand})});be.render=function(e,o,a,l,r,d){const s=$("tree-org-node");return c(),N(S,{to:"body"},[n(f("div",{id:"clone-tree-org",class:m(["clone-tree-org tree-org",{horizontal:e.horizontal,collapsable:e.collapsable}])},[z(s,{data:e.data,props:e.props,isClone:!1,horizontal:e.horizontal,labelStyle:e.labelStyle,collapsable:e.collapsable,renderContent:e.renderContent,labelClassName:e.labelClassName},E({_:2},[e.defaultSlot?{name:"default",fn:D((({node:n})=>[x(e.$slots,"default",{node:n})]))}:void 0,e.expandSlot?{name:"expand",fn:D((({node:n})=>[x(e.$slots,"expand",{node:n})]))}:void 0]),1032,["data","props","horizontal","labelStyle","collapsable","renderContent","labelClassName"])],2),[[t,e.modelValue]])])},be.__file="src/components/clone-org/clone-org.vue";const xe=(e,{emit:n},t)=>{const o=l("");function a(e,n,t){if(e[n.id]===t)return e;if(Array.isArray(e[n.children])){const o=e[n.children];for(let e=0,l=o.length;e<l;e++){const l=a(o[e],n,t);if(l)return l}}}function s(){const{props:t,data:o,node:l}=e;if(e.nodeDelete)return void e.nodeDelete(l.$$data);if(l.$$root)return void T.pretty("[提示] ","根节点不允许删除","danger");const{id:r,children:d}=t,s=a(o,t,l.pid);if(s){const e=s[d];for(let t=0,o=e.length;t<o;t++)if(e[t][r]===l.id){e.splice(t,1),n("onNodeDelete",l.$$data,l);break}}}function c(){const{nodeEdit:t,node:o}=e;t?t(o.$$data):(o.$$focused=!0,n("onNodeFocus",o.$$data))}function u(o){if(e.modelValue){if(t.eleRef.value&&t.eleRef.value.contains(o.target))return!1;n("update:modelValue",!1)}}const i=r((()=>({left:`${e.x}px`,top:`${e.y}px`}))),p=r((()=>!e.disabled&&!e.node.disabled));return d((()=>{document.addEventListener("mousedown",u)})),g((()=>{document.removeEventListener("mousedown",u)})),{position:i,editable:p,handleMenu:function(a){const l=a.target;if("zm-tree-menu-item"===l.className){const a=l.getAttribute("action");switch(a){case"copy":!function(){if(e.nodeCopy)return void e.nodeCopy(e.node.$$data);o.value=e.node.label,C((()=>{t.inputRef&&t.inputRef.value&&(t.inputRef&&t.inputRef.value.select(),navigator.clipboard.writeText(o.value).then((function(){T.pretty("[提示] ","文本复制成功","success")}),(function(){T.pretty("[错误] ","浏览器不支持","danger")})),n("onNodeCopy",o.value))}))}();break;case"add":!function(){if(e.nodeAdd)return void e.nodeAdd(e.node.$$data);const{id:t,pid:o,label:a,expand:l,children:r}=e.props,{node:d}=e,s={[t]:String((new Date).getTime()),[o]:d.id,[a]:"",[l]:!1,[r]:[],newNode:!0,focused:!0};Array.isArray(d.children)?d.$$data[r].push(s):d.$$data[r]=[s];n("onNodeFocus",s)}();break;case"edit":c();break;case"delete":s()}n("contextmenu",{command:a,node:e.node,data:e.node.$$data}),n("update:modelValue",!1)}},handleEdit:c,handleClose:u,afterEnter:function(){n("opened")},afterLeave:function(){n("closed")}}};var $e=a({name:"Contextmenu",props:ge({modelValue:{type:Boolean,required:!0},data:{type:Object,required:!0},node:{type:ye(Object),required:!0},props:{type:ye(Object)},x:Number,y:Number,menus:{type:ye(Array)},nodeAdd:Function,nodeDelete:Function,nodeEdit:Function,nodeCopy:Function,disabled:Boolean}),emits:{onNodeDelete:(e,n)=>A(e)&&A(n),onNodeCopy:e=>B(e),contextmenu:e=>A(e),onNodeFocus:e=>A(e),opened:()=>!0,closed:()=>!0,"update:modelValue":e=>"boolean"==typeof e},setup(e,n){const t=l(),o=l();return{eleRef:o,inputRef:t,copyText:l(""),oldData:k({}),...xe(e,n,{inputRef:t,eleRef:o})}}});const Ne=["action"];$e.render=function(e,o,a,l,r,d){return c(),N(S,{to:"body"},[z(M,{name:"dialog-fade",onAfterEnter:e.afterEnter,onAfterLeave:e.afterLeave,persisted:""},{default:D((()=>[n(f("div",{style:b(e.position),onClick:o[1]||(o[1]=(...n)=>e.handleMenu&&e.handleMenu(...n)),ref:"eleRef",class:"zm-tree-contextmenu"},[f("ul",null,[(c(!0),u(O,null,w(e.menus,(n=>(c(),u(O,null,[e.editable||!["add","edit","delete"].includes(n.command)?(c(),u("li",{class:"zm-tree-menu-item",action:n.command,key:n.command},i(n.name),9,Ne)):p("v-if",!0)],64)))),256))]),n(f("textarea",{class:"copy-textarea",ref:"inputRef","onUpdate:modelValue":o[0]||(o[0]=n=>e.copyText=n)},null,512),[[_,e.copyText]])],4),[[t,e.modelValue]])])),_:1},8,["onAfterEnter","onAfterLeave"])])},$e.__file="src/components/contextmenu/src/contextmenu.vue";const Se=[{name:"复制文本",command:"copy"},{name:"新增节点",command:"add"},{name:"编辑节点",command:"edit"},{name:"删除节点",command:"delete"}],ze=ge({data:{type:Object,required:!0},center:Boolean,props:{type:ye(Object),default:()=>({id:"id",pid:"pid",label:"label",expand:"expand",children:"children"})},toolBar:{type:[Object,Boolean],default:()=>({expand:!0,scale:!0,zoom:!0,restore:!0,fullscreen:!0})},disabled:{type:Boolean,default:!1},scalable:{type:Boolean,default:!0},draggable:{type:Boolean,default:!0},draggableOnNode:{type:Boolean,default:!1},nodeDraggable:{type:Boolean,default:!0},cloneNodeDrag:{type:Boolean,default:!0},onlyOneNode:{type:Boolean,default:!0},clickDelay:{type:Number,default:260},lazy:Boolean,load:{type:ye(Function)},defaultExpandLevel:Number,defaultExpandKeys:{type:Array,default:()=>[]},beforeDragEnd:Function,horizontal:Boolean,selectedKey:{type:[Array,String,Number]},collapsable:Boolean,renderContent:Function,labelStyle:Object,labelClassName:{type:[Function,String]},selectedClassName:{type:[Function,String]},defineMenus:{type:ye([Array,Function]),default:()=>Se},nodeAdd:Function,nodeDelete:Function,nodeEdit:Function,nodeCopy:Function,filterNodeMethod:Function}),Ee=(e,{emit:n},t)=>{const o=l(0),a=l(0),d=l(!1);function s(n,l){const r=t.zoomRef.value,d=t.treeRef.value;let s=r.clientWidth/2;const c=r.clientHeight/2;let u=r.clientHeight-d.clientHeight,i=r.clientWidth-d.clientWidth;if(u>0&&(u=0),i>0&&(i=0),e.center){const e=(r.clientWidth-d.clientWidth)/2;i-=e,s-=e}o.value=n>s?s:n<i?i:n,a.value=l<u?u:l>c?c:l}function c(e,t){s(e,t),setTimeout((()=>{Y.set(!1)}),200),n("on-drag-stop",{x:e,y:t})}const u=l(!1),i=k({value:{}});const p=l(!1),f=l(0),m=l(0),g=l({}),h=l([]);const b=l(1);function x(n){if(!e.scalable)return;const t=Number((Number(b.value)+n).toFixed(1));b.value=n>0?Math.min(3,t):Math.max(.3,t)}function $(n,t,l){if(d.value=!0,console.log(e.center,e.horizontal,n.offsetLeft,t),!e.center||e.horizontal){const e=n.offsetLeft-t;o.value-=e}const r=n.offsetTop-l;a.value-=r,s(o.value,a.value)}let N;const S=k(Object.assign({id:"id",pid:"pid",label:"label",expand:"expand",children:"children",isLeaf:"isLeaf"},e.props));const z=l(!1);function E(e){e.forEach((e=>{e.expand&&(e.expand=!1,T.delete(e.id)),e.children&&E(e.children)}))}const D=l(!1);function M(e,n){Array.isArray(e)?e.forEach((e=>{n&&T.add(e.id),e.expand=n,n&&T.add(e.id),e.children&&M(e.children,n)})):(n&&T.add(e.id),e.expand=n,n&&T.add(e.id),e.children&&M(e.children,n))}function O(e){V.value=j(e)}const w=r((()=>({width:100/b.value+"%",height:100/b.value+"%",transform:`scale(${b.value})`}))),_=r((()=>`${Math.round(100*b.value)}%`)),R=r((()=>e.draggableOnNode&&!e.nodeDraggable?"":`.tree-org-node__content:not(.is-root_${X})>.tree-org-node__inner`)),F=r((()=>D.value?"收起全部节点":"展开全部节点")),A=r((()=>D.value?"收起全部节点":"展开全部节点")),B=l({}),L=r((()=>{const{cloneNodeDrag:t,onlyOneNode:o,data:a}=e;return{drag:e.nodeDraggable,dragData:{keys:S,nodeMoving:u,stopClick:Y,parenNode:i,cloneNodeDrag:t,onlyOneNode:o,contextmenu:p,cloneData:B,data:a},beforeDragEnd:e.beforeDragEnd,initNodes:j,emit:n}}));y((()=>e.horizontal),(()=>{C((()=>{c(o.value,a.value)}))}));let T=new Set(e.defaultExpandKeys);function j(n){const{defaultExpandLevel:t=0}=e,o=(e,n)=>{const{id:a,label:l,pid:r,expand:d,children:s,isLeaf:c}=S,u={};Object.keys(e).map((n=>{["hidden","disabled","className","style"].includes(n)&&(u[n]=e[n])}));const i=e[s],p=n+1,f=e[d],m=e[a];return(f||void 0===f&&n<t)&&T.add(m),{...u,id:m,label:e[l],pid:e[r],expand:T.has(m),children:i?i.map((e=>o(e,p))):void 0,isLeaf:e[c],$$level:n,$$data:e,$$focused:e.focused||!1}};return o(n,0)}const V=l(j(e.data));y((()=>e.data),((n,t)=>{n!==t&&(T=new Set(e.defaultExpandKeys)),O(e.data)}),{deep:!0});const P=k({visible:!0,data:{expand:!0,scale:!0,zoom:!0,restore:!0,fullscreen:!0}});v((()=>{"object"==typeof e.toolBar?Object.assign(P.data,e.toolBar):e.toolBar||(P.visible=!1)}));const X=function(e){e=e||32;const n="ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678",t=n.length;let o="";for(let a=0;a<e;a++)o+=n.charAt(Math.floor(Math.random()*t));return o}(6);return{keys:S,left:o,top:a,menuX:f,menuY:m,suffix:X,nodeMoving:u,zoomStyle:w,tools:P,zoomPercent:_,dragCancel:R,expandTitle:F,fullTiltle:A,nodeargs:L,expanded:D,fullscreen:z,treeData:V,autoDragging:d,contextmenu:p,nodeMenus:h,menuData:g,cloneData:B,filter:function(n){const t=e.filterNodeMethod;if(!t)throw new Error("[Tree] filterNodeMethod is required when filter");const o=function(e){const a=e.children||[];if(a.forEach((e=>{e.$$hidden=!t.call(e,n,e),o(e)})),e.$$hidden&&a.length){let n=!0;n=a.some((e=>!e.$$hidden)),e.$$hidden=!n}n&&!e.$$hidden&&e.children&&(e.expand=!0)};o(V.value)},setData:O,zoomWheel:function(t){e.scalable&&t.ctrlKey&&(t.preventDefault(),t.deltaY<0?x(.1):x(-.1),n("on-zoom",b.value))},onDrag:function(e,t){Y.set(!0),d.value=!1,o.value=e,a.value=t,n("on-drag",{x:e,y:t})},onDragStop:c,expandChange:function(){D.value=!D.value,D.value||(T.clear(),C((()=>{c(o.value,a.value)}))),M(V.value,D.value),n("on-expand-all",D.value)},handleFullscreen:function(e){z.value=!z.value,"esc"!==e&&(z.value?function(){const e=t.eleRef.value;e.requestFullscreen&&e.requestFullscreen()}():document.exitFullscreen&&document.exitFullscreen())},zoomOrgchart:x,restoreOrgchart:function(){b.value=1,o.value=0,a.value=0,n("on-restore")},handleExpand:function(t,o){t.stopPropagation();const a=document.querySelector(`.is-root_${X}`);if(a){const l=a.offsetLeft,r=a.offsetTop;o.expand=!o.expand;let d=!0;o.expand?(T.add(o.id),e.lazy&&e.load&&(d=!1,function(e,n,t){n(e,((n,o)=>{const{children:a}=S;e.isLeaf=!n.length,n.length&&(e.$$data[a]=n,o&&t())}))}(o,e.load,(()=>{C((()=>{$(a,l,r)}))})))):!o.expand&&o.children&&(T.delete(o.id),E(o.children)),C((()=>{d&&$(a,l,r)})),n("on-expand",t,o.$$data,o)}},getExpandKeys:function(){return[...T]},setExpandKeys:function(n){T=new Set(n),O(e.data)},nodeMouseenter:function(e,t){return u.value&&(i.value=t),n("on-node-mouseenter",e,t.$$data,t),!0},nodeMouseleave:function(e,t){return u.value&&(i.value=null),n("on-node-mouseleave",e,t.$$data,t),!0},nodeContextmenu:function(n,t){n.stopPropagation(),n.preventDefault();const{defineMenus:o}=e;Array.isArray(o)?h.value=o:"function"==typeof o&&(h.value=o(n,t)||[]),p.value=!0,f.value=n.clientX,m.value=n.clientY,g.value=t},handleFocus:function(e,t,o){n("on-node-focus",e,t,o)},handleBlur:function(e,t,o){const{id:a,label:l}=S,r=g.value.children||[];for(let e=r.length;e>0;e--){const n=r[e-1];if(""===n[a]&&""===n[l]){r.splice(e-1,1);break}}n("on-node-blur",e,t,o)},handleClick:function(t,o){Y.get()||(clearTimeout(N),N=setTimeout((()=>{n("on-node-click",t,o.$$data,o)}),e.clickDelay))},handleDblclick:function(e,t){clearTimeout(N),n("on-node-dblclick",e,t.$$data,t)}}};var De=a({name:"vue3TreeOrg",components:{Tools:Q,CloneOrg:be,Draggable:he,Contextmenu:$e,TreeOrgNode:G},directives:{nodedrag:K},props:ze,emits:{"on-drag":({x:e,y:n})=>L(e)&&L(n),"on-drag-stop":({x:e,y:n})=>L(e)&&L(n),"on-restore":()=>!0,"on-zoom":e=>L(e),"on-expand":(e,n,t)=>e instanceof MouseEvent&&A(t)&&A(n),"on-expand-all":e=>"boolean"==typeof e,"on-node-blur":(e,n,t)=>e instanceof FocusEvent&&A(t)&&A(n),"on-node-click":(e,n,t)=>e instanceof MouseEvent&&A(t)&&A(n),"on-node-dblclick":(e,n,t)=>e instanceof MouseEvent&&A(t)&&A(n),"on-node-mouseenter":(e,n,t)=>e instanceof MouseEvent&&A(t)&&A(n),"on-node-mouseleave":(e,n,t)=>e instanceof MouseEvent&&A(t)&&A(n),"on-contextmenu":e=>A(e),"on-node-copy":e=>B(e),"on-node-delete":e=>A(e),"on-node-drag-start":e=>A(e),"on-node-drag":e=>A(e),"on-node-drag-end":(e,n)=>A(e)&&A(n),"on-node-focus":(e,n,t)=>e instanceof FocusEvent&&A(t)&&A(n)},setup(e,n){const t=!!n.slots.default,o=!!n.slots.expand,a=l(),r=l(),d=l();return{eleRef:a,treeRef:r,zoomRef:d,defaultSlot:t,expandSlot:o,...Ee(e,n,{eleRef:a,treeRef:r,zoomRef:d})}}});const Ce={ref:"eleRef",class:"zm-tree-org"},ke={class:"tree-org-node__text"},Me=f("span",{class:"tree-org-node__expand-btn"},null,-1),Oe={class:"tree-org-node__text"},we=f("span",{class:"tree-org-node__expand-btn"},null,-1);De.render=function(e,n,t,o,a,l){const r=$("tree-org-node"),d=$("Draggable"),s=$("Tools"),v=$("clone-org"),g=$("Contextmenu");return c(),u("div",Ce,[f("div",{ref:"zoomRef",class:m(["zoom-container",{"is-center":e.center&&!e.horizontal}]),style:b(e.zoomStyle),onWheel:n[0]||(n[0]=(...n)=>e.zoomWheel&&e.zoomWheel(...n))},[z(d,{x:e.left,y:e.top,class:m({dragging:e.autoDragging}),onDragging:e.onDrag,onDragstop:e.onDragStop,draggable:e.draggable,"drag-cancel":e.dragCancel},{default:D((()=>[f("div",{ref:"treeRef",class:m(["tree-org",{horizontal:e.horizontal,collapsable:e.collapsable}])},[z(r,{data:e.treeData,props:e.keys,lazy:e.lazy,suffix:e.suffix,horizontal:e.horizontal,labelStyle:e.labelStyle,collapsable:e.collapsable,renderContent:e.renderContent,selectedKey:e.selectedKey,defaultExpandLevel:e.defaultExpandLevel,selectedClassName:e.selectedClassName,labelClassName:e.labelClassName,vNodedrag:e.nodeargs,onOnExpand:e.handleExpand,onNodeClick:e.handleClick,onNodeDblclick:e.handleDblclick,onNodeMouseenter:e.nodeMouseenter,onNodeMouseleave:e.nodeMouseleave,onNodeContextmenu:e.nodeContextmenu,onNodeFocus:e.handleFocus,onNodeBlur:e.handleBlur},E({_:2},[e.defaultSlot?{name:"default",fn:D((({node:n})=>[x(e.$slots,"default",{node:n},(()=>[f("div",ke,[f("span",null,i(n.label),1)])]))]))}:void 0,e.expandSlot?{name:"expand",fn:D((({node:n})=>[x(e.$slots,"expand",{node:n},(()=>[Me]))]))}:void 0]),1032,["data","props","lazy","suffix","horizontal","labelStyle","collapsable","renderContent","selectedKey","defaultExpandLevel","selectedClassName","labelClassName","vNodedrag","onOnExpand","onNodeClick","onNodeDblclick","onNodeMouseenter","onNodeMouseleave","onNodeContextmenu","onNodeFocus","onNodeBlur"])],2)])),_:3},8,["x","y","class","onDragging","onDragstop","draggable","drag-cancel"])],38),e.tools.visible?(c(),N(s,{key:0,tools:e.tools.data,scale:e.zoomPercent,onOnExpand:e.expandChange,onOnScale:e.zoomOrgchart,onOnRestore:e.restoreOrgchart,onOnFullscreen:e.handleFullscreen},null,8,["tools","scale","onOnExpand","onOnScale","onOnRestore","onOnFullscreen"])):p("v-if",!0),e.nodeDraggable?(c(),N(v,{key:1,modelValue:e.nodeMoving,"onUpdate:modelValue":n[1]||(n[1]=n=>e.nodeMoving=n),props:e.keys,data:e.cloneData,horizontal:e.horizontal,"label-style":e.labelStyle,collapsable:e.collapsable,"render-content":e.renderContent,"label-class-name":e.labelClassName},E({_:2},[e.defaultSlot?{name:"default",fn:D((({node:n})=>[x(e.$slots,"default",{node:n},(()=>[f("div",Oe,[f("span",null,i(n[e.keys.label]),1)])]))]))}:void 0,e.expandSlot?{name:"expand",fn:D((({node:n})=>[x(e.$slots,"expand",{node:n},(()=>[we]))]))}:void 0]),1032,["modelValue","props","data","horizontal","label-style","collapsable","render-content","label-class-name"])):p("v-if",!0),e.nodeMenus.length?(c(),N(g,{key:2,modelValue:e.contextmenu,"onUpdate:modelValue":n[2]||(n[2]=n=>e.contextmenu=n),x:e.menuX,y:e.menuY,node:e.menuData,data:e.data,props:e.keys,menus:e.nodeMenus,disabled:e.disabled,"node-add":e.nodeAdd,"node-delete":e.nodeDelete,"node-edit":e.nodeEdit,"node-copy":e.nodeCopy,onContextmenu:n[3]||(n[3]=n=>{e.$emit("on-contextmenu",n)}),onOnNodeCopy:n[4]||(n[4]=n=>{e.$emit("on-node-copy",n)}),onOnNodeDelete:n[5]||(n[5]=n=>{e.$emit("on-node-delete",n)})},null,8,["modelValue","x","y","node","data","props","menus","disabled","node-add","node-delete","node-edit","node-copy"])):p("v-if",!0)],512)},De.__file="src/components/tree-org/src/tree.vue",De.install=function(e){e.component(De.name,De)};const _e=[De];var Re={install:function(e){_e.forEach((n=>{e.component(n.name,n)})),e.use(V)},Vue3TreeOrg:De};export{De as Vue3TreeOrg,Re as default};