mirror of
https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git
synced 2025-12-19 11:01:15 +00:00
refactor(editor): RunData components to composition API (no-changelog) (#11545)
This commit is contained in:
Elias Meire
@@ -15,10 +15,11 @@ import { usePinnedData } from '@/composables/usePinnedData';
|
||||
import { useTelemetry } from '@/composables/useTelemetry';
|
||||
import { useI18n } from '@/composables/useI18n';
|
||||
import { waitingNodeTooltip } from '@/utils/executionUtils';
|
||||
import { N8nRadioButtons, N8nText } from 'n8n-design-system';
|
||||
|
||||
// Types
|
||||
|
||||
type RunDataRef = InstanceType<typeof RunData> | null;
|
||||
type RunDataRef = InstanceType<typeof RunData>;
|
||||
|
||||
const OUTPUT_TYPE = {
|
||||
REGULAR: 'regular',
|
||||
@@ -55,7 +56,7 @@ const emit = defineEmits<{
|
||||
runChange: [number];
|
||||
activatePane: [];
|
||||
tableMounted: [{ avgRowHeight: number }];
|
||||
itemHover: [{ itemIndex: number; outputIndex: number }];
|
||||
itemHover: [item: { itemIndex: number; outputIndex: number } | null];
|
||||
search: [string];
|
||||
openSettings: [];
|
||||
}>();
|
||||
@@ -87,7 +88,7 @@ const outputTypes = ref([
|
||||
{ label: i18n.baseText('ndv.output.outType.regular'), value: OUTPUT_TYPE.REGULAR },
|
||||
{ label: i18n.baseText('ndv.output.outType.logs'), value: OUTPUT_TYPE.LOGS },
|
||||
]);
|
||||
const runDataRef = ref<RunDataRef>(null);
|
||||
const runDataRef = ref<RunDataRef>();
|
||||
|
||||
// Computed
|
||||
|
||||
@@ -127,9 +128,7 @@ const isNodeRunning = computed(() => {
|
||||
return workflowRunning.value && !!node.value && workflowsStore.isNodeExecuting(node.value.name);
|
||||
});
|
||||
|
||||
const workflowRunning = computed(() => {
|
||||
return uiStore.isActionActive['workflowRunning'];
|
||||
});
|
||||
const workflowRunning = computed(() => uiStore.isActionActive.workflowRunning);
|
||||
|
||||
const workflowExecution = computed(() => {
|
||||
return workflowsStore.getWorkflowExecution;
|
||||
@@ -253,8 +252,8 @@ const onRunIndexChange = (run: number) => {
|
||||
emit('runChange', run);
|
||||
};
|
||||
|
||||
const onUpdateOutputMode = (outputMode: OutputType) => {
|
||||
if (outputMode === OUTPUT_TYPE.LOGS) {
|
||||
const onUpdateOutputMode = (newOutputMode: OutputType) => {
|
||||
if (newOutputMode === OUTPUT_TYPE.LOGS) {
|
||||
ndvEventBus.emit('setPositionByName', 'minLeft');
|
||||
} else {
|
||||
ndvEventBus.emit('setPositionByName', 'initial');
|
||||
@@ -288,10 +287,10 @@ const activatePane = () => {
|
||||
:run-index="runIndex"
|
||||
:linked-runs="linkedRuns"
|
||||
:can-link-runs="canLinkRuns"
|
||||
:too-much-data-title="$locale.baseText('ndv.output.tooMuchData.title')"
|
||||
:no-data-in-branch-message="$locale.baseText('ndv.output.noOutputDataInBranch')"
|
||||
:too-much-data-title="i18n.baseText('ndv.output.tooMuchData.title')"
|
||||
:no-data-in-branch-message="i18n.baseText('ndv.output.noOutputDataInBranch')"
|
||||
:is-executing="isNodeRunning"
|
||||
:executing-message="$locale.baseText('ndv.output.executing')"
|
||||
:executing-message="i18n.baseText('ndv.output.executing')"
|
||||
:push-ref="pushRef"
|
||||
:block-u-i="blockUI"
|
||||
:is-production-execution-preview="isProductionExecutionPreview"
|
||||
@@ -310,15 +309,15 @@ const activatePane = () => {
|
||||
<template #header>
|
||||
<div :class="$style.titleSection">
|
||||
<template v-if="hasAiMetadata">
|
||||
<n8n-radio-buttons
|
||||
data-test-id="ai-output-mode-select"
|
||||
<N8nRadioButtons
|
||||
v-model="outputMode"
|
||||
data-test-id="ai-output-mode-select"
|
||||
:options="outputTypes"
|
||||
@update:model-value="onUpdateOutputMode"
|
||||
/>
|
||||
</template>
|
||||
<span v-else :class="$style.title">
|
||||
{{ $locale.baseText(outputPanelEditMode.enabled ? 'ndv.output.edit' : 'ndv.output') }}
|
||||
{{ i18n.baseText(outputPanelEditMode.enabled ? 'ndv.output.edit' : 'ndv.output') }}
|
||||
</span>
|
||||
<RunInfo
|
||||
v-if="hasNodeRun && !pinnedData.hasData.value && runsCount === 1"
|
||||
@@ -331,42 +330,40 @@ const activatePane = () => {
|
||||
</template>
|
||||
|
||||
<template #node-not-run>
|
||||
<n8n-text v-if="workflowRunning && !isTriggerNode" data-test-id="ndv-output-waiting">{{
|
||||
$locale.baseText('ndv.output.waitingToRun')
|
||||
}}</n8n-text>
|
||||
<n8n-text v-if="!workflowRunning" data-test-id="ndv-output-run-node-hint">
|
||||
<N8nText v-if="workflowRunning && !isTriggerNode" data-test-id="ndv-output-waiting">{{
|
||||
i18n.baseText('ndv.output.waitingToRun')
|
||||
}}</N8nText>
|
||||
<N8nText v-if="!workflowRunning" data-test-id="ndv-output-run-node-hint">
|
||||
<template v-if="isSubNodeType">
|
||||
{{ $locale.baseText('ndv.output.runNodeHintSubNode') }}
|
||||
{{ i18n.baseText('ndv.output.runNodeHintSubNode') }}
|
||||
</template>
|
||||
<template v-else>
|
||||
{{ $locale.baseText('ndv.output.runNodeHint') }}
|
||||
{{ i18n.baseText('ndv.output.runNodeHint') }}
|
||||
<span v-if="canPinData" @click="insertTestData">
|
||||
<br />
|
||||
{{ $locale.baseText('generic.or') }}
|
||||
<n8n-text tag="a" size="medium" color="primary">
|
||||
{{ $locale.baseText('ndv.output.insertTestData') }}
|
||||
</n8n-text>
|
||||
{{ i18n.baseText('generic.or') }}
|
||||
<N8nText tag="a" size="medium" color="primary">
|
||||
{{ i18n.baseText('ndv.output.insertTestData') }}
|
||||
</N8nText>
|
||||
</span>
|
||||
</template>
|
||||
</n8n-text>
|
||||
</N8nText>
|
||||
</template>
|
||||
|
||||
<template #node-waiting>
|
||||
<n8n-text :bold="true" color="text-dark" size="large">Waiting for input</n8n-text>
|
||||
<n8n-text v-n8n-html="waitingNodeTooltip()"></n8n-text>
|
||||
<N8nText :bold="true" color="text-dark" size="large">Waiting for input</N8nText>
|
||||
<N8nText v-n8n-html="waitingNodeTooltip()"></N8nText>
|
||||
</template>
|
||||
|
||||
<template #no-output-data>
|
||||
<n8n-text :bold="true" color="text-dark" size="large">{{
|
||||
$locale.baseText('ndv.output.noOutputData.title')
|
||||
}}</n8n-text>
|
||||
<n8n-text>
|
||||
{{ $locale.baseText('ndv.output.noOutputData.message') }}
|
||||
<a @click="openSettings">{{
|
||||
$locale.baseText('ndv.output.noOutputData.message.settings')
|
||||
}}</a>
|
||||
{{ $locale.baseText('ndv.output.noOutputData.message.settingsOption') }}
|
||||
</n8n-text>
|
||||
<N8nText :bold="true" color="text-dark" size="large">{{
|
||||
i18n.baseText('ndv.output.noOutputData.title')
|
||||
}}</N8nText>
|
||||
<N8nText>
|
||||
{{ i18n.baseText('ndv.output.noOutputData.message') }}
|
||||
<a @click="openSettings">{{ i18n.baseText('ndv.output.noOutputData.message.settings') }}</a>
|
||||
{{ i18n.baseText('ndv.output.noOutputData.message.settingsOption') }}
|
||||
</N8nText>
|
||||
</template>
|
||||
|
||||
<template v-if="outputMode === 'logs' && node" #content>
|
||||
@@ -375,12 +372,12 @@ const activatePane = () => {
|
||||
|
||||
<template #recovered-artificial-output-data>
|
||||
<div :class="$style.recoveredOutputData">
|
||||
<n8n-text tag="div" :bold="true" color="text-dark" size="large">{{
|
||||
$locale.baseText('executionDetails.executionFailed.recoveredNodeTitle')
|
||||
}}</n8n-text>
|
||||
<n8n-text>
|
||||
{{ $locale.baseText('executionDetails.executionFailed.recoveredNodeMessage') }}
|
||||
</n8n-text>
|
||||
<N8nText tag="div" :bold="true" color="text-dark" size="large">{{
|
||||
i18n.baseText('executionDetails.executionFailed.recoveredNodeTitle')
|
||||
}}</N8nText>
|
||||
<N8nText>
|
||||
{{ i18n.baseText('executionDetails.executionFailed.recoveredNodeMessage') }}
|
||||
</N8nText>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user