Files
DiceCloud/app/imports/client/ui/library/LibraryNodeExpansionContent.vue
2023-06-05 15:44:53 +02:00

82 lines
1.7 KiB
Vue

<template lang="html">
<div>
<v-progress-linear
v-if="!subsReady"
indeterminate
color="accent"
/>
<v-expand-transition>
<div
v-if="subsReady"
class="pt-4"
>
<component
:is="model.type"
:model="model"
class="property-viewer"
/>
<tree-node-list
group="library-node-expansion"
:children="propertyChildren"
@selected="clickChild"
/>
</div>
</v-expand-transition>
</div>
</template>
<script lang="js">
import nodesToTree from '/imports/api/parenting/nodesToTree.js'
import LibraryNodes from '/imports/api/library/LibraryNodes.js';
import propertyViewerIndex from '/imports/client/ui/properties/viewers/shared/propertyViewerIndex.js';
import TreeNodeList from '/imports/client/ui/components/tree/TreeNodeList.vue';
export default {
components: {
TreeNodeList,
...propertyViewerIndex,
},
props: {
model: {
type: Object,
required: true,
},
},
computed: {
subsReady() {
return this.$subReady.descendantLibraryNodes && this.$subReady.libraryNode;
}
},
methods: {
clickChild(id){
this.$store.commit('pushDialogStack', {
component: 'library-node-dialog',
elementId: `tree-node-${id}`,
data: {
_id: id,
},
});
},
},
meteor: {
$subscribe: {
libraryNode(){
return [this.model._id];
},
descendantLibraryNodes(){
return [this.model._id];
},
},
propertyChildren(){
return nodesToTree({
collection: LibraryNodes,
ancestorId: this.model._id
});
},
}
}
</script>
<style lang="css" scoped>
</style>