mirror of
https://github.com/n8n-io/n8n.git
synced 2025-02-02 07:01:30 -08:00
Setup routes
This commit is contained in:
parent
5549c8fb34
commit
90eefd1d1e
|
@ -36,6 +36,7 @@ const dirtyState = ref(false);
|
|||
const tabBarItems = computed(() => [
|
||||
{ value: MAIN_HEADER_TABS.WORKFLOW, label: locale.baseText('generic.editor') },
|
||||
{ value: MAIN_HEADER_TABS.EXECUTIONS, label: locale.baseText('generic.executions') },
|
||||
{ value: MAIN_HEADER_TABS.EVALUATION, label: locale.baseText('generic.tests') },
|
||||
]);
|
||||
|
||||
const activeNode = computed(() => ndvStore.activeNode);
|
||||
|
@ -67,6 +68,10 @@ onMounted(async () => {
|
|||
});
|
||||
|
||||
function syncTabsWithRoute(to: RouteLocation, from?: RouteLocation): void {
|
||||
console.log('🚀 ~ syncTabsWithRoute ~ to.name:', to.name);
|
||||
if (to.name === VIEWS.WORKFLOW_EVALUATION) {
|
||||
activeHeaderTab.value = MAIN_HEADER_TABS.EVALUATION;
|
||||
}
|
||||
if (
|
||||
to.name === VIEWS.EXECUTION_HOME ||
|
||||
to.name === VIEWS.WORKFLOW_EXECUTIONS ||
|
||||
|
@ -106,6 +111,11 @@ function onTabSelected(tab: MAIN_HEADER_TABS, event: MouseEvent) {
|
|||
void navigateToExecutionsView(openInNewTab);
|
||||
break;
|
||||
|
||||
case MAIN_HEADER_TABS.EVALUATION:
|
||||
activeHeaderTab.value = MAIN_HEADER_TABS.EVALUATION;
|
||||
void router.push({ name: VIEWS.WORKFLOW_EVALUATION });
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
|
|
|
@ -484,6 +484,8 @@ export const enum VIEWS {
|
|||
COMMUNITY_NODES = 'CommunityNodes',
|
||||
WORKFLOWS = 'WorkflowsView',
|
||||
WORKFLOW_EXECUTIONS = 'WorkflowExecutions',
|
||||
WORKFLOW_EVALUATION = 'WorkflowEvaluation',
|
||||
NEW_WORKFLOW_EVALUATION = 'NewWorkflowEvaluation',
|
||||
USAGE = 'Usage',
|
||||
LOG_STREAMING_SETTINGS = 'LogStreamingSettingsView',
|
||||
SSO_SETTINGS = 'SSoSettings',
|
||||
|
@ -580,6 +582,7 @@ export const enum MAIN_HEADER_TABS {
|
|||
WORKFLOW = 'workflow',
|
||||
EXECUTIONS = 'executions',
|
||||
SETTINGS = 'settings',
|
||||
EVALUATION = 'evaluation',
|
||||
}
|
||||
export const CURL_IMPORT_NOT_SUPPORTED_PROTOCOLS = [
|
||||
'ftp',
|
||||
|
|
|
@ -47,6 +47,7 @@
|
|||
"generic.delete": "Delete",
|
||||
"generic.dontShowAgain": "Don't show again",
|
||||
"generic.executions": "Executions",
|
||||
"generic.tests": "Tests",
|
||||
"generic.or": "or",
|
||||
"generic.clickToCopy": "Click to copy",
|
||||
"generic.copiedToClipboard": "Copied to clipboard",
|
||||
|
|
|
@ -18,6 +18,8 @@ import type { RouterMiddleware } from '@/types/router';
|
|||
import { initializeAuthenticatedFeatures, initializeCore } from '@/init';
|
||||
import { tryToParseNumber } from '@/utils/typesUtils';
|
||||
import { projectsRoutes } from '@/routes/projects.routes';
|
||||
import WorkflowEvaluationView from './views/WorkflowEvaluationView.vue';
|
||||
import NewWorkflowEvaluationView from './views/NewWorkflowEvaluationView.vue';
|
||||
|
||||
const ChangePasswordView = async () => await import('./views/ChangePasswordView.vue');
|
||||
const ErrorView = async () => await import('./views/ErrorView.vue');
|
||||
|
@ -248,6 +250,80 @@ export const routes: RouteRecordRaw[] = [
|
|||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/workflow/:name/evaluation',
|
||||
name: VIEWS.WORKFLOW_EVALUATION,
|
||||
components: {
|
||||
default: WorkflowEvaluationView,
|
||||
header: MainHeader,
|
||||
sidebar: MainSidebar,
|
||||
},
|
||||
meta: {
|
||||
keepWorkflowAlive: true,
|
||||
middleware: ['authenticated'],
|
||||
},
|
||||
// children: [
|
||||
// {
|
||||
// path: '',
|
||||
// name: VIEWS.EXECUTION_HOME,
|
||||
// components: {
|
||||
// executionPreview: WorkflowExecutionsLandingPage,
|
||||
// },
|
||||
// meta: {
|
||||
// keepWorkflowAlive: true,
|
||||
// middleware: ['authenticated'],
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: ':executionId',
|
||||
// name: VIEWS.EXECUTION_PREVIEW,
|
||||
// components: {
|
||||
// executionPreview: WorkflowExecutionsPreview,
|
||||
// },
|
||||
// meta: {
|
||||
// keepWorkflowAlive: true,
|
||||
// middleware: ['authenticated'],
|
||||
// },
|
||||
// },
|
||||
// ],
|
||||
},
|
||||
{
|
||||
path: '/workflow/:name/evaluation/new',
|
||||
name: VIEWS.NEW_WORKFLOW_EVALUATION,
|
||||
components: {
|
||||
default: NewWorkflowEvaluationView,
|
||||
header: MainHeader,
|
||||
sidebar: MainSidebar,
|
||||
},
|
||||
meta: {
|
||||
keepWorkflowAlive: true,
|
||||
middleware: ['authenticated'],
|
||||
},
|
||||
// children: [
|
||||
// {
|
||||
// path: '',
|
||||
// name: VIEWS.EXECUTION_HOME,
|
||||
// components: {
|
||||
// executionPreview: WorkflowExecutionsLandingPage,
|
||||
// },
|
||||
// meta: {
|
||||
// keepWorkflowAlive: true,
|
||||
// middleware: ['authenticated'],
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: ':executionId',
|
||||
// name: VIEWS.EXECUTION_PREVIEW,
|
||||
// components: {
|
||||
// executionPreview: WorkflowExecutionsPreview,
|
||||
// },
|
||||
// meta: {
|
||||
// keepWorkflowAlive: true,
|
||||
// middleware: ['authenticated'],
|
||||
// },
|
||||
// },
|
||||
// ],
|
||||
},
|
||||
{
|
||||
path: '/workflow/:workflowId/history/:versionId?',
|
||||
name: VIEWS.WORKFLOW_HISTORY,
|
||||
|
|
25
packages/editor-ui/src/views/NewWorkflowEvaluationView.vue
Normal file
25
packages/editor-ui/src/views/NewWorkflowEvaluationView.vue
Normal file
|
@ -0,0 +1,25 @@
|
|||
<script setup lang="ts">
|
||||
console.log('New WorkflowEvaluationView');
|
||||
|
||||
function onClickEmptyStateButton() {
|
||||
console.log('onClickEmptyStateButton');
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<h1>New Evaluation</h1>
|
||||
Fill in
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style module lang="scss">
|
||||
.container {
|
||||
padding: var(--spacing-xl) var(--spacing-l);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: var(--spacing-xl);
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
42
packages/editor-ui/src/views/WorkflowEvaluationView.vue
Normal file
42
packages/editor-ui/src/views/WorkflowEvaluationView.vue
Normal file
|
@ -0,0 +1,42 @@
|
|||
<script setup lang="ts">
|
||||
import { VIEWS } from '@/constants';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
console.log('WorkflowEvaluationView');
|
||||
|
||||
const router = useRouter();
|
||||
function onClickEmptyStateButton() {
|
||||
console.log('onClickEmptyStateButton');
|
||||
void router.push({ name: VIEWS.NEW_WORKFLOW_EVALUATION });
|
||||
}
|
||||
|
||||
const actionBoxConfig = {
|
||||
calloutText: '',
|
||||
calloutTheme: '',
|
||||
hideButton: false,
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
<div :class="$style.container">
|
||||
<h1>Tests</h1>
|
||||
<n8n-action-box
|
||||
:heading="'Get confidence your workflow is working as expected'"
|
||||
:description="'Tests run your workflow and compare the results to expected ones. Create your first test from a past execution. More info'"
|
||||
:button-text="'Choose Executions(s)'"
|
||||
:callout-text="actionBoxConfig.calloutText"
|
||||
@click:button="onClickEmptyStateButton"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style module lang="scss">
|
||||
.container {
|
||||
padding: var(--spacing-xl) var(--spacing-l);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: var(--spacing-xl);
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
Loading…
Reference in a new issue