mirror of
https://github.com/n8n-io/n8n.git
synced 2024-09-20 06:47:32 -07:00
make not recursive
This commit is contained in:
parent
b0cc1abd28
commit
f064fc14f4
|
@ -1,10 +1,10 @@
|
|||
<template>
|
||||
<div class="n8n-tree">
|
||||
<n8n-tree-node :input="input" :path="path">
|
||||
<template v-for="(index, name) in $scopedSlots" v-slot:[name]="data">
|
||||
<slot :name="name" v-bind="data"></slot>
|
||||
</template>
|
||||
</n8n-tree-node>
|
||||
<div v-for="row in parsedData" :style="getStyles(row)">
|
||||
<slot name="label" v-bind:label="row.label" />
|
||||
<span v-if="row.value"> : </span>
|
||||
<span v-if="row.value" :class="$style.value">{{ row.value }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -12,11 +12,10 @@
|
|||
import Vue from 'vue';
|
||||
import N8nTreeNode from './TreeNode.vue';
|
||||
|
||||
const INDENT = 24;
|
||||
|
||||
export default Vue.extend({
|
||||
name: 'n8n-tree',
|
||||
components: {
|
||||
N8nTreeNode,
|
||||
},
|
||||
props: {
|
||||
input: {
|
||||
},
|
||||
|
@ -26,9 +25,46 @@ export default Vue.extend({
|
|||
},
|
||||
},
|
||||
computed: {
|
||||
parsedData() {
|
||||
const data = traverse(this.input);
|
||||
console.log(data);
|
||||
return data;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getStyles(row) {
|
||||
return {marginLeft: `${INDENT * row.depth}px`};
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
function traverse(data, parsed = [], depth = 0) {
|
||||
Object.keys(data).forEach((label, i) => {
|
||||
const row = {
|
||||
label,
|
||||
depth,
|
||||
};
|
||||
parsed.push(row);
|
||||
if (typeof data[label] !== 'object') {
|
||||
row.value = data[label];
|
||||
}
|
||||
else {
|
||||
traverse(data[label], parsed, depth + 1);
|
||||
}
|
||||
});
|
||||
|
||||
return parsed;
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
.simple {
|
||||
text-indent: -24px;
|
||||
margin-left: var(--spacing-l);
|
||||
}
|
||||
|
||||
.value {
|
||||
word-break: break-all;
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in a new issue