diff --git a/packages/editor-ui/src/components/RunData.vue b/packages/editor-ui/src/components/RunData.vue index 0727699e2c..b3729e4f68 100644 --- a/packages/editor-ui/src/components/RunData.vue +++ b/packages/editor-ui/src/components/RunData.vue @@ -19,7 +19,16 @@
- Results: {{ dataCount }}  + + Results: {{ dataCount }} + + Results: + + +  / + {{ dataCount }} + +   option <= this.dataCount); + }, node (): INodeUi | null { return this.$store.getters.activeNode; }, @@ -323,19 +344,27 @@ export default mixins( return 0; }, jsonData (): IDataObject[] { - const inputData = this.getNodeInputData(this.node, this.runIndex, this.outputIndex); + let inputData = this.getNodeInputData(this.node, this.runIndex, this.outputIndex); if (inputData.length === 0 || !Array.isArray(inputData)) { return []; } + if (this.maxDisplayItems !== null) { + inputData = inputData.slice(0, this.maxDisplayItems); + } + return this.convertToJson(inputData); }, tableData (): ITableData | undefined { - const inputData = this.getNodeInputData(this.node, this.runIndex, this.outputIndex); + let inputData = this.getNodeInputData(this.node, this.runIndex, this.outputIndex); if (inputData.length === 0) { return undefined; } + if (this.maxDisplayItems !== null) { + inputData = inputData.slice(0,this.maxDisplayItems); + } + return this.convertToTable(inputData); }, binaryData (): IBinaryKeyData[] { @@ -451,11 +480,11 @@ export default mixins( // Check how much data there is to display const inputData = this.getNodeInputData(this.node, this.runIndex, this.outputIndex); - const jsonItems = inputData.map(item => item.json); + const jsonItems = inputData.slice(0, this.maxDisplayItems || inputData.length).map(item => item.json); this.dataSize = JSON.stringify(jsonItems).length; - if (this.dataSize < 204800) { + if (this.dataSize < this.MAX_DISPLAY_DATA_SIZE) { // Data is reasonable small (< 200kb) so display it directly this.showData = true; } @@ -469,6 +498,7 @@ export default mixins( node (newNode, oldNode) { // Reset the selected output index every time another node gets selected this.outputIndex = 0; + this.maxDisplayItems = 25; this.refreshDataSize(); }, jsonData () { diff --git a/packages/editor-ui/src/constants.ts b/packages/editor-ui/src/constants.ts index 90f8808986..22ec0a5198 100644 --- a/packages/editor-ui/src/constants.ts +++ b/packages/editor-ui/src/constants.ts @@ -1,2 +1,4 @@ +export const MAX_DISPLAY_DATA_SIZE = 204800; +export const MAX_DISPLAY_ITEMS_AUTO_ALL = 250; export const NODE_NAME_PREFIX = 'node-'; export const PLACEHOLDER_EMPTY_WORKFLOW_ID = '__EMPTY__';