Updated OrgChart to V3
parent
ca201d8e1d
commit
844edd45a7
|
@ -4,7 +4,7 @@
|
||||||
<tr v-if="node">
|
<tr v-if="node">
|
||||||
<td :colspan="colspan">
|
<td :colspan="colspan">
|
||||||
<div :class="nodeContentClass" @click="onNodeClick">
|
<div :class="nodeContentClass" @click="onNodeClick">
|
||||||
<OrganizationChartNodeTemplate :node="node" :template="templates[node.type]||templates['default']" />
|
<component :is="templates[node.type]||templates['default']" :node="node" />
|
||||||
<a v-if="toggleable" tabindex="0" class="p-node-toggler" @click="toggleNode" @keydown.enter="toggleNode">
|
<a v-if="toggleable" tabindex="0" class="p-node-toggler" @click="toggleNode" @keydown.enter="toggleNode">
|
||||||
<i class="p-node-toggler-icon pi" :class="{'pi-chevron-down': expanded, 'pi-chevron-up': !expanded}"></i>
|
<i class="p-node-toggler-icon pi" :class="{'pi-chevron-down': expanded, 'pi-chevron-up': !expanded}"></i>
|
||||||
</a>
|
</a>
|
||||||
|
@ -42,26 +42,6 @@
|
||||||
<script>
|
<script>
|
||||||
import DomHandler from '../utils/DomHandler';
|
import DomHandler from '../utils/DomHandler';
|
||||||
|
|
||||||
const OrganizationChartNodeTemplate = {
|
|
||||||
functional: true,
|
|
||||||
props: {
|
|
||||||
node: {
|
|
||||||
type: null,
|
|
||||||
default: null
|
|
||||||
},
|
|
||||||
template: {
|
|
||||||
type: null,
|
|
||||||
default: null
|
|
||||||
}
|
|
||||||
},
|
|
||||||
render(createElement, context) {
|
|
||||||
const content = context.props.template({
|
|
||||||
'node': context.props.node
|
|
||||||
});
|
|
||||||
return [content];
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'sub-node',
|
name: 'sub-node',
|
||||||
props: {
|
props: {
|
||||||
|
@ -137,9 +117,6 @@ export default {
|
||||||
toggleable() {
|
toggleable() {
|
||||||
return this.collapsible && this.node.collapsible !== false && !this.leaf;
|
return this.collapsible && this.node.collapsible !== false && !this.leaf;
|
||||||
}
|
}
|
||||||
},
|
|
||||||
components: {
|
|
||||||
'OrganizationChartNodeTemplate': OrganizationChartNodeTemplate
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
Loading…
Reference in New Issue