mirror of
https://github.com/n8n-io/n8n.git
synced 2024-12-25 04:34:06 -08:00
refactor(editor): Simplify data count in NDV (no-changelog) (#7568)
This commit is contained in:
parent
6d42fad31a
commit
85e1a10021
|
@ -190,6 +190,7 @@ export default defineComponent({
|
|||
},
|
||||
runIndex: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
linkedRuns: {
|
||||
type: Boolean,
|
||||
|
|
|
@ -144,6 +144,7 @@ export default defineComponent({
|
|||
props: {
|
||||
runIndex: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
isReadOnly: {
|
||||
type: Boolean,
|
||||
|
|
|
@ -104,7 +104,7 @@
|
|||
icon="thumbtack"
|
||||
:disabled="
|
||||
editMode.enabled ||
|
||||
(inputData.length === 0 && !hasPinData) ||
|
||||
(rawInputData.length === 0 && !hasPinData) ||
|
||||
isReadOnlyRoute ||
|
||||
readOnlyEnv
|
||||
"
|
||||
|
@ -319,7 +319,7 @@
|
|||
<Suspense v-else-if="hasNodeRun && displayMode === 'table'">
|
||||
<run-data-table
|
||||
:node="node"
|
||||
:inputData="inputData"
|
||||
:inputData="inputDataPage"
|
||||
:mappingEnabled="mappingEnabled"
|
||||
:distanceFromActive="distanceFromActive"
|
||||
:runIndex="runIndex"
|
||||
|
@ -338,7 +338,7 @@
|
|||
:editMode="editMode"
|
||||
:sessioId="sessionId"
|
||||
:node="node"
|
||||
:inputData="inputData"
|
||||
:inputData="inputDataPage"
|
||||
:mappingEnabled="mappingEnabled"
|
||||
:distanceFromActive="distanceFromActive"
|
||||
:runIndex="runIndex"
|
||||
|
@ -347,7 +347,7 @@
|
|||
</Suspense>
|
||||
|
||||
<Suspense v-else-if="hasNodeRun && isPaneTypeOutput && displayMode === 'html'">
|
||||
<run-data-html :inputHtml="inputData[0].json.html" />
|
||||
<run-data-html :inputHtml="inputDataPage[0].json.html" />
|
||||
</Suspense>
|
||||
|
||||
<Suspense v-else-if="hasNodeRun && isSchemaView">
|
||||
|
@ -457,7 +457,8 @@
|
|||
!hasRunError &&
|
||||
binaryData.length === 0 &&
|
||||
dataCount > pageSize &&
|
||||
!isSchemaView
|
||||
!isSchemaView &&
|
||||
!isArtificialRecoveredEventItem
|
||||
"
|
||||
v-show="!editMode.enabled"
|
||||
>
|
||||
|
@ -575,6 +576,7 @@ export default defineComponent({
|
|||
},
|
||||
runIndex: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
linkedRuns: {
|
||||
type: Boolean,
|
||||
|
@ -748,7 +750,7 @@ export default defineComponent({
|
|||
);
|
||||
},
|
||||
isArtificialRecoveredEventItem(): boolean {
|
||||
return this.inputData?.[0]?.json?.isArtificialRecoveredEventItem !== undefined ?? false;
|
||||
return !!this.rawInputData?.[0]?.json?.isArtificialRecoveredEventItem;
|
||||
},
|
||||
subworkflowExecutionError(): Error | null {
|
||||
return this.workflowsStore.subWorkflowExecutionError;
|
||||
|
@ -823,48 +825,14 @@ export default defineComponent({
|
|||
return 0;
|
||||
},
|
||||
rawInputData(): INodeExecutionData[] {
|
||||
let inputData: INodeExecutionData[] = [];
|
||||
|
||||
if (this.node) {
|
||||
inputData = this.getNodeInputData(
|
||||
this.node,
|
||||
this.runIndex,
|
||||
this.currentOutputIndex,
|
||||
this.paneType,
|
||||
this.connectionType,
|
||||
);
|
||||
}
|
||||
|
||||
if (inputData.length === 0 || !Array.isArray(inputData)) {
|
||||
return [];
|
||||
}
|
||||
|
||||
return inputData;
|
||||
return this.getRawInputData(this.runIndex, this.currentOutputIndex, this.connectionType);
|
||||
},
|
||||
inputData(): INodeExecutionData[] {
|
||||
let inputData = this.rawInputData;
|
||||
|
||||
if (this.node && this.pinData && !this.isProductionExecutionPreview) {
|
||||
inputData = Array.isArray(this.pinData)
|
||||
? this.pinData.map((value) => ({
|
||||
json: value,
|
||||
}))
|
||||
: [
|
||||
{
|
||||
json: this.pinData,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
// We don't want to paginate the schema view
|
||||
if (this.isSchemaView) {
|
||||
return inputData;
|
||||
}
|
||||
|
||||
return this.getPinDataOrLiveData(this.rawInputData);
|
||||
},
|
||||
inputDataPage(): INodeExecutionData[] {
|
||||
const offset = this.pageSize * (this.currentPage - 1);
|
||||
inputData = inputData.slice(offset, offset + this.pageSize);
|
||||
|
||||
return inputData;
|
||||
return this.inputData.slice(offset, offset + this.pageSize);
|
||||
},
|
||||
jsonData(): IDataObject[] {
|
||||
return executionDataToJson(this.inputData);
|
||||
|
@ -1199,47 +1167,58 @@ export default defineComponent({
|
|||
const itemsLabel = itemsCount > 0 ? ` (${itemsCount} ${items})` : '';
|
||||
return option + this.$locale.baseText('ndv.output.of') + (this.maxRunIndex + 1) + itemsLabel;
|
||||
},
|
||||
getRawInputData(
|
||||
runIndex: number,
|
||||
outputIndex: number,
|
||||
connectionType: ConnectionTypes = NodeConnectionType.Main,
|
||||
): INodeExecutionData[] {
|
||||
let inputData: INodeExecutionData[] = [];
|
||||
|
||||
if (this.node) {
|
||||
inputData = this.getNodeInputData(
|
||||
this.node,
|
||||
runIndex,
|
||||
outputIndex,
|
||||
this.paneType,
|
||||
connectionType,
|
||||
);
|
||||
}
|
||||
|
||||
if (inputData.length === 0 || !Array.isArray(inputData)) {
|
||||
return [];
|
||||
}
|
||||
|
||||
return inputData;
|
||||
},
|
||||
getPinDataOrLiveData(inputData: INodeExecutionData[]): INodeExecutionData[] {
|
||||
if (this.pinData && !this.isProductionExecutionPreview) {
|
||||
return Array.isArray(this.pinData)
|
||||
? this.pinData.map((value) => ({
|
||||
json: value,
|
||||
}))
|
||||
: [
|
||||
{
|
||||
json: this.pinData,
|
||||
},
|
||||
];
|
||||
}
|
||||
return inputData;
|
||||
},
|
||||
getDataCount(
|
||||
runIndex: number,
|
||||
outputIndex: number,
|
||||
connectionType: ConnectionTypes = NodeConnectionType.Main,
|
||||
) {
|
||||
if (this.pinData) {
|
||||
return this.pinData.length;
|
||||
}
|
||||
|
||||
if (this.node === null) {
|
||||
if (!this.node) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
const runData: IRunData | null = this.workflowRunData;
|
||||
|
||||
if (runData === null || !runData.hasOwnProperty(this.node.name)) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
if (runData[this.node.name].length <= runIndex) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
if (runData[this.node.name][runIndex].hasOwnProperty('error')) {
|
||||
if (this.workflowRunData?.[this.node.name][runIndex].hasOwnProperty('error')) {
|
||||
return 1;
|
||||
}
|
||||
|
||||
if (
|
||||
!runData[this.node.name][runIndex].hasOwnProperty('data') ||
|
||||
runData[this.node.name][runIndex].data === undefined
|
||||
) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
const inputData = this.getInputData(
|
||||
runData[this.node.name][runIndex].data!,
|
||||
outputIndex,
|
||||
connectionType,
|
||||
);
|
||||
|
||||
return inputData.length;
|
||||
const rawInputData = this.getRawInputData(runIndex, outputIndex, connectionType);
|
||||
return this.getPinDataOrLiveData(rawInputData).length;
|
||||
},
|
||||
init() {
|
||||
// Reset the selected output index every time another node gets selected
|
||||
|
@ -1296,16 +1275,10 @@ export default defineComponent({
|
|||
}
|
||||
},
|
||||
async downloadJsonData() {
|
||||
const inputData = this.getNodeInputData(
|
||||
this.node,
|
||||
this.runIndex,
|
||||
this.currentOutputIndex,
|
||||
this.paneType,
|
||||
this.connectionType,
|
||||
);
|
||||
|
||||
const fileName = this.node!.name.replace(/[^\w\d]/g, '_');
|
||||
const blob = new Blob([JSON.stringify(inputData, null, 2)], { type: 'application/json' });
|
||||
const blob = new Blob([JSON.stringify(this.rawInputData, null, 2)], {
|
||||
type: 'application/json',
|
||||
});
|
||||
|
||||
saveAs(blob, `${fileName}.json`);
|
||||
},
|
||||
|
@ -1341,21 +1314,8 @@ export default defineComponent({
|
|||
refreshDataSize() {
|
||||
// Hide by default the data from being displayed
|
||||
this.showData = false;
|
||||
|
||||
// Check how much data there is to display
|
||||
const inputData = this.getNodeInputData(
|
||||
this.node,
|
||||
this.runIndex,
|
||||
this.currentOutputIndex,
|
||||
this.paneType,
|
||||
this.connectionType,
|
||||
);
|
||||
|
||||
const offset = this.pageSize * (this.currentPage - 1);
|
||||
const jsonItems = inputData.slice(offset, offset + this.pageSize).map((item) => item.json);
|
||||
|
||||
const jsonItems = this.inputDataPage.map((item) => item.json);
|
||||
this.dataSize = JSON.stringify(jsonItems).length;
|
||||
|
||||
if (this.dataSize < this.MAX_DISPLAY_DATA_SIZE) {
|
||||
// Data is reasonable small (< 200kb) so display it directly
|
||||
this.showData = true;
|
||||
|
@ -1398,7 +1358,7 @@ export default defineComponent({
|
|||
hasNodeRun() {
|
||||
if (this.paneType === 'output') this.setDisplayMode();
|
||||
},
|
||||
inputData: {
|
||||
inputDataPage: {
|
||||
handler(data: INodeExecutionData[]) {
|
||||
if (this.paneType && data) {
|
||||
this.ndvStore.setNDVPanelDataIsEmpty({
|
||||
|
|
Loading…
Reference in a new issue