primevue
Version:
[](https://opensource.org/licenses/MIT) [](https://badge.fury.io/js/primevue) [ • 11.1 kB
JavaScript
this.primevue=this.primevue||{},this.primevue.organizationchart=function(e,n,t,o,l,i){"use strict";function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c,a=r(e),s=r(t),d=r(o);function p(e){return p="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},p(e)}function u(e,n,t){return(n=g(n))in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function g(e){var n=m(e,"string");return"symbol"===p(n)?n:String(n)}function m(e,n){if("object"!==p(e)||null===e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var o=t.call(e,n||"default");if("object"!==p(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(e)}var h=(u(c={root:"p-organizationchart p-component",table:"p-organizationchart-table",node:function(e){var n=e.instance;return["p-organizationchart-node-content",{"p-organizationchart-selectable-node":n.selectable,"p-highlight":n.selected}]},nodeToggler:"p-node-toggler",nodeTogglerIcon:"p-node-toggler-icon",lines:"p-organizationchart-lines",lineDown:"p-organizationchart-line-down"},"lines","p-organizationchart-lines"),u(c,"lineLeft",(function(e){return["p-organizationchart-line-left",{"p-organizationchart-line-top":!(0===e.index)}]})),u(c,"lineRight",(function(e){return["p-organizationchart-line-right",{"p-organizationchart-line-top":!(e.index===e.props.node.children.length-1)}]})),u(c,"nodes","p-organizationchart-nodes"),c),y=n.useStyle("\n.p-organizationchart-table {\n border-spacing: 0;\n border-collapse: separate;\n margin: 0 auto;\n}\n\n.p-organizationchart-table > tbody > tr > td {\n text-align: center;\n vertical-align: top;\n padding: 0 0.75rem;\n}\n\n.p-organizationchart-node-content {\n display: inline-block;\n position: relative;\n}\n\n.p-organizationchart-node-content .p-node-toggler {\n position: absolute;\n bottom: -0.75rem;\n margin-left: -0.75rem;\n z-index: 2;\n left: 50%;\n user-select: none;\n cursor: pointer;\n width: 1.5rem;\n height: 1.5rem;\n text-decoration: none;\n}\n\n.p-organizationchart-node-content .p-node-toggler .p-node-toggler-icon {\n position: relative;\n top: 0.25rem;\n}\n\n.p-organizationchart-line-down {\n margin: 0 auto;\n height: 20px;\n width: 1px;\n}\n\n.p-organizationchart-line-right {\n border-radius: 0px;\n}\n\n.p-organizationchart-line-left {\n border-radius: 0;\n}\n\n.p-organizationchart-selectable-node {\n cursor: pointer;\n}\n",{name:"organizationchart",manual:!0}),f={name:"BaseOrganizationChart",extends:a.default,props:{value:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null}},css:{classes:h,loadStyle:y.load},provide:function(){return{$parentInstance:this}}},b={name:"OrganizationChartNode",hostName:"OrganizationChart",extends:a.default,emits:["node-click","node-toggle"],props:{node:{type:null,default:null},templates:{type:null,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null}},methods:{getPTOptions:function(e){return this.ptm(e,{context:{expanded:this.expanded,selectable:this.selectable,selected:this.selected,toggleable:this.toggleable,active:this.selected}})},getNodeOptions:function(e,n){return this.ptm(n,{context:{lineTop:e}})},onNodeClick:function(e){l.DomHandler.getAttribute(e.target,"nodeToggler")||l.DomHandler.getAttribute(e.target,"nodeTogglerIcon")||this.selectionMode&&this.$emit("node-click",this.node)},onChildNodeClick:function(e){this.$emit("node-click",e)},toggleNode:function(){this.$emit("node-toggle",this.node)},onChildNodeToggle:function(e){this.$emit("node-toggle",e)},onKeydown:function(e){"Enter"!==e.code&&"Space"!==e.code||(this.toggleNode(),e.preventDefault())}},computed:{leaf:function(){return!1!==this.node.leaf&&!(this.node.children&&this.node.children.length)},colspan:function(){return this.node.children&&this.node.children.length?2*this.node.children.length:null},childStyle:function(){return{visibility:!this.leaf&&this.expanded?"inherit":"hidden"}},expanded:function(){return void 0===this.collapsedKeys[this.node.key]},selectable:function(){return this.selectionMode&&!1!==this.node.selectable},selected:function(){return this.selectable&&this.selectionKeys&&!0===this.selectionKeys[this.node.key]},toggleable:function(){return this.collapsible&&!1!==this.node.collapsible&&!this.leaf}},components:{ChevronDownIcon:s.default,ChevronUpIcon:d.default}},v=["colspan"],k=["colspan"],N=["colspan"];function C(e){return C="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},C(e)}function K(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);n&&(o=o.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,o)}return t}function x(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?K(Object(t),!0).forEach((function(n){P(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):K(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function P(e,n,t){return(n=z(n))in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function z(e){var n=O(e,"string");return"symbol"===C(n)?n:String(n)}function O(e,n){if("object"!==C(e)||null===e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var o=t.call(e,n||"default");if("object"!==C(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(e)}b.render=function(e,n,t,o,l,r){var c=i.resolveComponent("OrganizationChartNode",!0);return i.openBlock(),i.createElementBlock("table",i.mergeProps({class:e.cx("table")},e.ptm("table")),[i.createElementVNode("tbody",i.normalizeProps(i.guardReactiveProps(e.ptm("body"))),[t.node?(i.openBlock(),i.createElementBlock("tr",i.normalizeProps(i.mergeProps({key:0},e.ptm("row"))),[i.createElementVNode("td",i.mergeProps({colspan:r.colspan},e.ptm("cell")),[i.createElementVNode("div",i.mergeProps({class:[e.cx("node"),t.node.styleClass],onClick:n[2]||(n[2]=function(){return r.onNodeClick&&r.onNodeClick.apply(r,arguments)})},r.getPTOptions("node")),[(i.openBlock(),i.createBlock(i.resolveDynamicComponent(t.templates[t.node.type]||t.templates.default),{node:t.node},null,8,["node"])),r.toggleable?(i.openBlock(),i.createElementBlock("a",i.mergeProps({key:0,tabindex:"0",class:e.cx("nodeToggler"),onClick:n[0]||(n[0]=function(){return r.toggleNode&&r.toggleNode.apply(r,arguments)}),onKeydown:n[1]||(n[1]=function(){return r.onKeydown&&r.onKeydown.apply(r,arguments)})},r.getPTOptions("nodeToggler")),[t.templates.togglericon?(i.openBlock(),i.createBlock(i.resolveDynamicComponent(t.templates.togglericon),{key:0,expanded:r.expanded,class:"p-node-toggler-icon"},null,8,["expanded"])):(i.openBlock(),i.createBlock(i.resolveDynamicComponent(r.expanded?"ChevronDownIcon":"ChevronUpIcon"),i.mergeProps({key:1,class:e.cx("nodeTogglerIcon")},r.getPTOptions("nodeTogglerIcon")),null,16,["class"]))],16)):i.createCommentVNode("",!0)],16)],16,v)],16)):i.createCommentVNode("",!0),i.createElementVNode("tr",i.mergeProps({style:r.childStyle,class:e.cx("lines")},e.ptm("lines")),[i.createElementVNode("td",i.mergeProps({colspan:r.colspan},e.ptm("lineCell")),[i.createElementVNode("div",i.mergeProps({class:e.cx("lineDown")},e.ptm("lineDown")),null,16)],16,k)],16),i.createElementVNode("tr",i.mergeProps({style:r.childStyle,class:e.cx("lines")},e.ptm("lines")),[t.node.children&&1===t.node.children.length?(i.openBlock(),i.createElementBlock("td",i.mergeProps({key:0,colspan:r.colspan},e.ptm("lineCell")),[i.createElementVNode("div",i.mergeProps({class:e.cx("lineDown")},e.ptm("lineDown")),null,16)],16,N)):i.createCommentVNode("",!0),t.node.children&&t.node.children.length>1?(i.openBlock(!0),i.createElementBlock(i.Fragment,{key:1},i.renderList(t.node.children,(function(n,o){return i.openBlock(),i.createElementBlock(i.Fragment,{key:n.key},[i.createElementVNode("td",i.mergeProps({class:e.cx("lineLeft",{index:o})},r.getNodeOptions(!(0===o),"lineLeft"))," ",16),i.createElementVNode("td",i.mergeProps({class:e.cx("lineRight",{index:o})},r.getNodeOptions(!(o===t.node.children.length-1),"lineRight"))," ",16)],64)})),128)):i.createCommentVNode("",!0)],16),i.createElementVNode("tr",i.mergeProps({style:r.childStyle,class:e.cx("nodes")},e.ptm("nodes")),[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(t.node.children,(function(n){return i.openBlock(),i.createElementBlock("td",i.mergeProps({key:n.key,colspan:"2"},e.ptm("nodeCell")),[i.createVNode(c,{node:n,templates:t.templates,collapsedKeys:t.collapsedKeys,onNodeToggle:r.onChildNodeToggle,collapsible:t.collapsible,selectionMode:t.selectionMode,selectionKeys:t.selectionKeys,onNodeClick:r.onChildNodeClick,pt:e.pt,unstyled:e.unstyled},null,8,["node","templates","collapsedKeys","onNodeToggle","collapsible","selectionMode","selectionKeys","onNodeClick","pt","unstyled"])],16)})),128))],16)],16)],16)};var w={name:"OrganizationChart",extends:f,emits:["node-unselect","node-select","update:selectionKeys","node-expand","node-collapse","update:collapsedKeys"],data:function(){return{d_collapsedKeys:this.collapsedKeys||{}}},watch:{collapsedKeys:function(e){this.d_collapsedKeys=e}},methods:{onNodeClick:function(e){var n=e.key;if(this.selectionMode){var t=this.selectionKeys?x({},this.selectionKeys):{};t[n]?(delete t[n],this.$emit("node-unselect",e)):("single"===this.selectionMode&&(t={}),t[n]=!0,this.$emit("node-select",e)),this.$emit("update:selectionKeys",t)}},onNodeToggle:function(e){var n=e.key;this.d_collapsedKeys[n]?(delete this.d_collapsedKeys[n],this.$emit("node-expand",e)):(this.d_collapsedKeys[n]=!0,this.$emit("node-collapse",e)),this.d_collapsedKeys=x({},this.d_collapsedKeys),this.$emit("update:collapsedKeys",this.d_collapsedKeys)}},components:{OrganizationChartNode:b}};return w.render=function(e,n,t,o,l,r){var c=i.resolveComponent("OrganizationChartNode");return i.openBlock(),i.createElementBlock("div",i.mergeProps({class:e.cx("root")},e.ptm("root")),[i.createVNode(c,{node:e.value,templates:e.$slots,onNodeToggle:r.onNodeToggle,collapsedKeys:l.d_collapsedKeys,collapsible:e.collapsible,onNodeClick:r.onNodeClick,selectionMode:e.selectionMode,selectionKeys:e.selectionKeys,pt:e.pt,unstyled:e.unstyled},null,8,["node","templates","onNodeToggle","collapsedKeys","collapsible","onNodeClick","selectionMode","selectionKeys","pt","unstyled"])],16)},w}(primevue.basecomponent,primevue.usestyle,primevue.icons.chevrondown,primevue.icons.chevronup,primevue.utils,Vue);