mirror of
https://github.com/n8n-io/n8n.git
synced 2025-03-05 20:50:17 -08:00
fix: editor kind of working, lots of issues to fix
This commit is contained in:
Alex Grozav
parent
fd0896478a
commit
e8d948e942
|
|
@ -159,7 +159,7 @@ export default defineComponent({
|
|||
size="mini"
|
||||
:value="rowsPerPage"
|
||||
@update:modelValue="onRowsPerPageChange"
|
||||
popper-append-to-body
|
||||
teleported
|
||||
>
|
||||
<template #prepend>{{ t('datatable.pageSize') }}</template>
|
||||
<n8n-option
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div :class="$style.custom" v-else-if="variant === 'custom'">
|
||||
<el-skeleton-item :variant="variant" />
|
||||
<el-skeleton-item />
|
||||
</div>
|
||||
<el-skeleton-item v-else :variant="variant" />
|
||||
</template>
|
||||
|
|
@ -98,7 +98,7 @@ export default defineComponent({
|
|||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
.n8n-loading-custom .el-skeleton {
|
||||
.n8n-loading-custom.el-skeleton {
|
||||
&,
|
||||
.el-skeleton__item {
|
||||
width: 100%;
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
[$style.active]: mode === 'router' && isItemActive(item),
|
||||
}"
|
||||
:index="item.id"
|
||||
popper-append-to-body
|
||||
teleported
|
||||
:popper-class="`${$style.submenuPopper} ${popperClass}`"
|
||||
>
|
||||
<template #title>
|
||||
|
|
|
|||
|
|
@ -16,8 +16,8 @@ export default defineComponent({
|
|||
<template>
|
||||
<el-popover v-bind="{ ...$props, ...$attrs }">
|
||||
<template #reference>
|
||||
<slot />
|
||||
<slot name="reference" />
|
||||
</template>
|
||||
<slot name="content" />
|
||||
<slot />
|
||||
</el-popover>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
:filterMethod="setFilter"
|
||||
:placeholder="placeholder"
|
||||
:default-first-option="true"
|
||||
:popper-append-to-body="true"
|
||||
teleported
|
||||
:popper-class="$style.limitPopperWidth"
|
||||
:noDataText="t('nds.userSelect.noMatchingUsers')"
|
||||
:size="size"
|
||||
|
|
|
|||
|
|
@ -4,8 +4,8 @@
|
|||
.fade-in-linear-leave-active {
|
||||
transition: var.$fade-linear-transition;
|
||||
}
|
||||
.fade-in-linear-enter,
|
||||
.fade-in-linear-leave,
|
||||
.fade-in-linear-enter-from,
|
||||
.fade-in-linear-leave-from,
|
||||
.fade-in-linear-leave-active {
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -14,8 +14,8 @@
|
|||
.el-fade-in-linear-leave-active {
|
||||
transition: var.$fade-linear-transition;
|
||||
}
|
||||
.el-fade-in-linear-enter,
|
||||
.el-fade-in-linear-leave,
|
||||
.el-fade-in-linear-enter-from,
|
||||
.el-fade-in-linear-leave-from,
|
||||
.el-fade-in-linear-leave-active {
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -24,7 +24,7 @@
|
|||
.el-fade-in-leave-active {
|
||||
transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
|
||||
}
|
||||
.el-fade-in-enter,
|
||||
.el-fade-in-enter-from,
|
||||
.el-fade-in-leave-active {
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -33,7 +33,7 @@
|
|||
.el-zoom-in-center-leave-active {
|
||||
transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
|
||||
}
|
||||
.el-zoom-in-center-enter,
|
||||
.el-zoom-in-center-enter-from,
|
||||
.el-zoom-in-center-leave-active {
|
||||
opacity: 0;
|
||||
transform: scaleX(0);
|
||||
|
|
@ -46,7 +46,7 @@
|
|||
transition: var.$md-fade-transition;
|
||||
transform-origin: center top;
|
||||
}
|
||||
.el-zoom-in-top-enter,
|
||||
.el-zoom-in-top-enter-from,
|
||||
.el-zoom-in-top-leave-active {
|
||||
opacity: 0;
|
||||
transform: scaleY(0);
|
||||
|
|
@ -59,7 +59,7 @@
|
|||
transition: var.$md-fade-transition;
|
||||
transform-origin: center bottom;
|
||||
}
|
||||
.el-zoom-in-bottom-enter,
|
||||
.el-zoom-in-bottom-enter-from,
|
||||
.el-zoom-in-bottom-leave-active {
|
||||
opacity: 0;
|
||||
transform: scaleY(0);
|
||||
|
|
@ -72,7 +72,7 @@
|
|||
transition: var.$md-fade-transition;
|
||||
transform-origin: top left;
|
||||
}
|
||||
.el-zoom-in-left-enter,
|
||||
.el-zoom-in-left-enter-from,
|
||||
.el-zoom-in-left-leave-active {
|
||||
opacity: 0;
|
||||
transform: scale(0.45, 0.45);
|
||||
|
|
@ -89,7 +89,7 @@
|
|||
.el-list-leave-active {
|
||||
transition: all 1s;
|
||||
}
|
||||
.el-list-enter,
|
||||
.el-list-enter-from,
|
||||
.el-list-leave-active {
|
||||
opacity: 0;
|
||||
transform: translateY(-30px);
|
||||
|
|
|
|||
|
|
@ -3,6 +3,17 @@
|
|||
@use './common/var';
|
||||
@use 'common/popup';
|
||||
|
||||
@include mixins.b(overlay) {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: var(--spacing-2xl);
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
@include mixins.b(dialog) {
|
||||
position: relative;
|
||||
margin: 0 auto 50px;
|
||||
|
|
|
|||
|
|
@ -36,8 +36,6 @@ export async function use(l: string) {
|
|||
try {
|
||||
const ndsLang = (await import(`./lang/${l}.ts`)) as { default: N8nLocale };
|
||||
|
||||
console.log('ndsLang', ndsLang);
|
||||
|
||||
lang = ndsLang.default;
|
||||
|
||||
// todo breaks select empty data
|
||||
|
|
|
|||
|
|
@ -276,6 +276,11 @@ export default defineComponent({
|
|||
height: 100vh;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
|
||||
main {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<el-tag :type="theme" size="medium" :disable-transitions="true" :class="$style.container">
|
||||
<el-tag :type="theme" :disable-transitions="true" :class="$style.container">
|
||||
<font-awesome-icon
|
||||
:icon="theme === 'success' ? 'check-circle' : 'exclamation-triangle'"
|
||||
:class="theme === 'success' ? $style.icon : $style.dangerIcon"
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@ export default defineComponent({
|
|||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
value: {
|
||||
modelValue: {
|
||||
type: String,
|
||||
},
|
||||
},
|
||||
|
|
@ -209,8 +209,8 @@ export default defineComponent({
|
|||
if (!this.isReadOnly) codeNodeEditorEventBus.on('error-line-number', this.highlightLine);
|
||||
|
||||
// empty on first load, default param value
|
||||
if (!this.value) {
|
||||
this.$emit('valueChanged', this.placeholder);
|
||||
if (!this.modelValue) {
|
||||
this.$emit('update:modelValue', this.placeholder);
|
||||
}
|
||||
|
||||
const { isReadOnly, language } = this;
|
||||
|
|
@ -242,7 +242,7 @@ export default defineComponent({
|
|||
|
||||
this.trackCompletion(viewUpdate);
|
||||
|
||||
this.$emit('valueChanged', this.editor?.state.doc.toString());
|
||||
this.$emit('update:modelValue', this.editor?.state.doc.toString());
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
|
@ -251,7 +251,7 @@ export default defineComponent({
|
|||
extensions.push(this.languageCompartment.of(languageSupport), ...otherExtensions);
|
||||
|
||||
const state = EditorState.create({
|
||||
doc: this.value || this.placeholder,
|
||||
doc: this.modelValue || this.placeholder,
|
||||
extensions,
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<n8n-card :class="$style.card" v-on="$listeners">
|
||||
<n8n-card :class="$style.card" v-bind="$attrs">
|
||||
<template #header v-if="!loading">
|
||||
<span v-text="title" :class="$style.title" />
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -244,7 +244,7 @@ onBeforeMount(() => {
|
|||
<div :class="$style.group">
|
||||
<n8n-tooltip placement="right">
|
||||
<template #content>
|
||||
<i18n-t tag="span" path="executionsFilter.customData.docsTooltip">
|
||||
<i18n-t tag="span" keypath="executionsFilter.customData.docsTooltip">
|
||||
<template #link>
|
||||
<a
|
||||
target="_blank"
|
||||
|
|
@ -266,7 +266,7 @@ onBeforeMount(() => {
|
|||
}}</label>
|
||||
<n8n-tooltip :disabled="isAdvancedExecutionFilterEnabled" placement="top">
|
||||
<template #content>
|
||||
<i18n-t tag="span" path="executionsFilter.customData.inputTooltip">
|
||||
<i18n-t tag="span" keypath="executionsFilter.customData.inputTooltip">
|
||||
<template #link>
|
||||
<a
|
||||
href="#"
|
||||
|
|
@ -294,7 +294,7 @@ onBeforeMount(() => {
|
|||
}}</label>
|
||||
<n8n-tooltip :disabled="isAdvancedExecutionFilterEnabled" placement="top">
|
||||
<template #content>
|
||||
<i18n-t tag="span" path="executionsFilter.customData.inputTooltip">
|
||||
<i18n-t tag="span" keypath="executionsFilter.customData.inputTooltip">
|
||||
<template #link>
|
||||
<a href="#" @click.prevent="goToUpgrade">{{
|
||||
locale.baseText('executionsFilter.customData.inputTooltip.link')
|
||||
|
|
|
|||
|
|
@ -95,7 +95,7 @@
|
|||
</span>
|
||||
<i18n-t
|
||||
v-if="!isWaitTillIndefinite(execution)"
|
||||
:path="getStatusTextTranslationPath(execution)"
|
||||
:keypath="getStatusTextTranslationPath(execution)"
|
||||
>
|
||||
<template #status>
|
||||
<span :class="$style.status">{{ getStatusText(execution) }}</span>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
</n8n-text>
|
||||
</div>
|
||||
<div v-else-if="!isTrialExpired && trialHasExecutionsLeft" :class="$style.usageText">
|
||||
<i18n-t path="executionUsage.currentUsage">
|
||||
<i18n-t keypath="executionUsage.currentUsage">
|
||||
<template #text>
|
||||
<n8n-text size="small" color="text-dark">
|
||||
{{ locale.baseText('executionUsage.currentUsage.text') }}
|
||||
|
|
|
|||
|
|
@ -10,10 +10,10 @@ import { defineComponent } from 'vue';
|
|||
|
||||
export default defineComponent({
|
||||
name: 'ExpandableInputBase',
|
||||
props: ['value', 'placeholder', 'staticSize'],
|
||||
props: ['modelValue', 'placeholder', 'staticSize'],
|
||||
computed: {
|
||||
hiddenValue() {
|
||||
let value = (this.value as string).replace(/\s/g, '.'); // force input to expand on space chars
|
||||
let value = (this.modelValue as string).replace(/\s/g, '.'); // force input to expand on space chars
|
||||
if (!value) {
|
||||
// @ts-ignore
|
||||
value = this.placeholder;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<ExpandableInputBase :value="modelValue" :placeholder="placeholder">
|
||||
<ExpandableInputBase :modelValue="modelValue" :placeholder="placeholder">
|
||||
<input
|
||||
class="el-input__inner"
|
||||
:value="modelValue"
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<template>
|
||||
<ExpandableInputBase :value="value" :staticSize="true">
|
||||
<ExpandableInputBase :modelValue="modelValue" :staticSize="true">
|
||||
<template>
|
||||
<input
|
||||
:class="{ 'el-input__inner': true, clickable: true }"
|
||||
:value="value"
|
||||
:value="modelValue"
|
||||
:disabled="true"
|
||||
size="4"
|
||||
/>
|
||||
|
|
@ -18,7 +18,7 @@ import ExpandableInputBase from './ExpandableInputBase.vue';
|
|||
export default defineComponent({
|
||||
name: 'ExpandableInputPreview',
|
||||
components: { ExpandableInputBase },
|
||||
props: ['value'],
|
||||
props: ['modelValue'],
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div v-if="dialogVisible" @keydown.stop>
|
||||
<el-dialog
|
||||
:visible="dialogVisible"
|
||||
:modelValue="dialogVisible"
|
||||
class="expression-dialog classic"
|
||||
append-to-body
|
||||
width="80%"
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
</span>
|
||||
|
||||
<span @click="onClick" class="preview" v-else>
|
||||
<ExpandableInputPreview :value="previewValue || value" />
|
||||
<ExpandableInputPreview :modelValue="previewValue || modelValue" />
|
||||
</span>
|
||||
</span>
|
||||
</template>
|
||||
|
|
@ -34,7 +34,7 @@ export default defineComponent({
|
|||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
value: {
|
||||
modelValue: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
|
|
@ -75,7 +75,7 @@ export default defineComponent({
|
|||
return;
|
||||
}
|
||||
|
||||
this.$data.newValue = this.value;
|
||||
this.$data.newValue = this.modelValue;
|
||||
this.$emit('toggle');
|
||||
},
|
||||
onBlur() {
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
<div :class="$style.titleSection">
|
||||
<n8n-select
|
||||
v-if="parentNodes.length"
|
||||
:popper-append-to-body="true"
|
||||
teleported
|
||||
size="small"
|
||||
:modelValue="currentNodeName"
|
||||
@update:modelValue="onSelect"
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
>
|
||||
<template #default="{ shortenedName }">
|
||||
<InlineTextEdit
|
||||
:value="workflowName"
|
||||
:modelValue="workflowName"
|
||||
:previewValue="shortenedName"
|
||||
:isEditEnabled="isNameEditEnabled"
|
||||
:maxLength="MAX_WORKFLOW_NAME_LENGTH"
|
||||
|
|
@ -77,7 +77,7 @@
|
|||
</n8n-button>
|
||||
<template #content>
|
||||
<i18n-t
|
||||
:path="
|
||||
:keypath="
|
||||
contextBasedTranslationKeys.workflows.sharing.unavailable.description.tooltip
|
||||
"
|
||||
tag="span"
|
||||
|
|
|
|||
|
|
@ -445,7 +445,9 @@ export default defineComponent({
|
|||
}
|
||||
},
|
||||
goToRoute(route: string | { name: string }) {
|
||||
console.log(this.$router);
|
||||
this.$router.push(route).catch((failure) => {
|
||||
console.log(failure);
|
||||
// Catch navigation failures caused by route guards
|
||||
if (!isNavigationFailure(failure)) {
|
||||
console.error(failure);
|
||||
|
|
@ -466,8 +468,6 @@ export default defineComponent({
|
|||
}
|
||||
}
|
||||
|
||||
console.log(defaultSettingsRoute);
|
||||
|
||||
return defaultSettingsRoute;
|
||||
},
|
||||
onResize(event: UIEvent) {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<el-dialog
|
||||
:visible="uiStore.isModalOpen(this.name)"
|
||||
:modelValue="uiStore.isModalOpen(this.name)"
|
||||
:before-close="closeDialog"
|
||||
:class="{
|
||||
'dialog-wrapper': true,
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
append-to-body
|
||||
:data-test-id="`${this.name}-modal`"
|
||||
>
|
||||
<template #title v-if="$scopedSlots.header">
|
||||
<template #header v-if="$slots.header">
|
||||
<slot name="header" v-if="!loading" />
|
||||
</template>
|
||||
<template #title v-else-if="title">
|
||||
|
|
@ -40,7 +40,7 @@
|
|||
<n8n-spinner />
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!loading && $scopedSlots.footer" :class="$style.footer">
|
||||
<div v-if="!loading && $slots.footer" :class="$style.footer">
|
||||
<slot name="footer" :close="closeDialog" />
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ const categoryName = computed(() => {
|
|||
<template>
|
||||
<div
|
||||
:class="$style.categoryWrapper"
|
||||
v-on="$listeners"
|
||||
v-bind="$attrs"
|
||||
data-keyboard-nav="true"
|
||||
data-test-id="node-creator-category-item"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { computed, getCurrentInstance, onMounted, defineComponent } from 'vue';
|
||||
import { computed, getCurrentInstance, onMounted, defineComponent, h } from 'vue';
|
||||
import type { VNode, PropType } from 'vue';
|
||||
import type {
|
||||
INodeCreateElement,
|
||||
|
|
@ -211,15 +211,16 @@ const OrderSwitcher = defineComponent({
|
|||
type: String as PropType<NodeFilterType>,
|
||||
},
|
||||
},
|
||||
render(h): VNode {
|
||||
const triggers = this.$slots?.triggers?.[0];
|
||||
const actions = this.$slots?.actions?.[0];
|
||||
setup(props, { slots }) {
|
||||
const triggers = slots.triggers?.();
|
||||
const actions = slots.actions?.();
|
||||
|
||||
return h(
|
||||
'div',
|
||||
{},
|
||||
this.rootView === REGULAR_NODE_CREATOR_VIEW ? [actions, triggers] : [triggers, actions],
|
||||
);
|
||||
return () =>
|
||||
h(
|
||||
'div',
|
||||
{},
|
||||
props.rootView === REGULAR_NODE_CREATOR_VIEW ? [actions, triggers] : [triggers, actions],
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
@mouseup="onMouseUp"
|
||||
data-test-id="node-creator"
|
||||
>
|
||||
<NodesListPanel @nodeTypeSelected="$listeners.nodeTypeSelected" />
|
||||
<NodesListPanel @nodeTypeSelected="onNodeTypeSelected" />
|
||||
</div>
|
||||
</slide-transition>
|
||||
</div>
|
||||
|
|
@ -33,6 +33,7 @@ import NodesListPanel from './Panel/NodesListPanel.vue';
|
|||
|
||||
export interface Props {
|
||||
active?: boolean;
|
||||
onNodeTypeSelected?: (nodeType: string) => void;
|
||||
}
|
||||
|
||||
const props = defineProps<Props>();
|
||||
|
|
|
|||
|
|
@ -129,10 +129,10 @@ function onBackButton() {
|
|||
/>
|
||||
<div :class="$style.renderedItems">
|
||||
<!-- Actions mode -->
|
||||
<ActionsRenderer v-if="isActionsMode && activeViewStack.subcategory" v-on="$listeners" />
|
||||
<ActionsRenderer v-if="isActionsMode && activeViewStack.subcategory" v-bind="$attrs" />
|
||||
|
||||
<!-- Nodes Mode -->
|
||||
<NodesRenderer v-else :rootView="nodeCreatorView" v-on="$listeners" />
|
||||
<NodesRenderer v-else :rootView="nodeCreatorView" v-bind="$attrs" />
|
||||
</div>
|
||||
</aside>
|
||||
</transition>
|
||||
|
|
|
|||
|
|
@ -117,8 +117,8 @@ registerKeyHook(`CategoryLeft_${props.category}`, {
|
|||
<!-- Pass through listeners & empty slot to ItemsRenderer -->
|
||||
<ItemsRenderer
|
||||
v-if="expanded"
|
||||
v-bind="$attrs"
|
||||
:elements="elements"
|
||||
v-on="$listeners"
|
||||
:isTrigger="isTriggerCategory"
|
||||
>
|
||||
<template #default> </template>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<el-dialog
|
||||
:visible="(!!activeNode || renaming) && !isActiveStickyNode"
|
||||
:modelValue="(!!activeNode || renaming) && !isActiveStickyNode"
|
||||
:before-close="close"
|
||||
:show-close="false"
|
||||
class="data-display-wrapper ndv-wrapper"
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@
|
|||
<div v-if="isCommunityNode" :class="$style.descriptionContainer">
|
||||
<div class="mb-l">
|
||||
<i18n-t
|
||||
path="nodeSettings.communityNodeUnknown.description"
|
||||
keypath="nodeSettings.communityNodeUnknown.description"
|
||||
tag="span"
|
||||
@click="onMissingNodeTextClick"
|
||||
>
|
||||
|
|
@ -68,7 +68,7 @@
|
|||
{{ $locale.baseText('nodeSettings.communityNodeUnknown.installLink.text') }}
|
||||
</n8n-link>
|
||||
</div>
|
||||
<i18n-t v-else path="nodeSettings.nodeTypeUnknown.description" tag="span">
|
||||
<i18n-t v-else keypath="nodeSettings.nodeTypeUnknown.description" tag="span">
|
||||
<template #action>
|
||||
<a
|
||||
:href="CUSTOM_NODES_DOCS_URL"
|
||||
|
|
|
|||
|
|
@ -3,7 +3,11 @@
|
|||
<expression-edit
|
||||
:dialogVisible="expressionEditDialogVisible"
|
||||
:modelValue="
|
||||
isResourceLocatorParameter && typeof value !== 'string' ? (value ? value.value : '') : value
|
||||
isResourceLocatorParameter && typeof modelValue !== 'string'
|
||||
? modelValue
|
||||
? modelValue.value
|
||||
: ''
|
||||
: modelValue
|
||||
"
|
||||
:parameter="parameter"
|
||||
:path="path"
|
||||
|
|
@ -17,7 +21,7 @@
|
|||
v-if="isResourceLocatorParameter"
|
||||
ref="resourceLocator"
|
||||
:parameter="parameter"
|
||||
:modelValue="value"
|
||||
:modelValue="modelValue"
|
||||
:dependentParametersValues="dependentParametersValues"
|
||||
:displayTitle="displayTitle"
|
||||
:expressionDisplayValue="expressionDisplayValue"
|
||||
|
|
@ -55,7 +59,7 @@
|
|||
>
|
||||
<el-dialog
|
||||
v-if="codeEditDialogVisible"
|
||||
visible
|
||||
:modelValue="true"
|
||||
append-to-body
|
||||
:close-on-click-modal="false"
|
||||
width="80%"
|
||||
|
|
@ -66,18 +70,18 @@
|
|||
>
|
||||
<div class="ignore-key-press">
|
||||
<code-node-editor
|
||||
:value="value"
|
||||
:modelValue="modelValue"
|
||||
:defaultValue="parameter.default"
|
||||
:language="editorLanguage"
|
||||
:isReadOnly="isReadOnly"
|
||||
@valueChanged="expressionUpdated"
|
||||
@update:modelValue="expressionUpdated"
|
||||
/>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<text-edit
|
||||
:dialogVisible="textEditDialogVisible"
|
||||
:value="value"
|
||||
:value="modelValue"
|
||||
:parameter="parameter"
|
||||
:path="path"
|
||||
:isReadOnly="isReadOnly"
|
||||
|
|
@ -88,17 +92,17 @@
|
|||
<code-node-editor
|
||||
v-if="editorType === 'codeNodeEditor' && isCodeNode(node)"
|
||||
:mode="node.parameters.mode"
|
||||
:value="value"
|
||||
:modelValue="modelValue"
|
||||
:defaultValue="parameter.default"
|
||||
:language="editorLanguage"
|
||||
:isReadOnly="isReadOnly"
|
||||
:aiButtonEnabled="settingsStore.isCloudDeployment"
|
||||
@valueChanged="valueChangedDebounced"
|
||||
@update:modelValue="valueChangedDebounced"
|
||||
/>
|
||||
|
||||
<html-editor
|
||||
v-else-if="editorType === 'htmlEditor'"
|
||||
:html="value"
|
||||
:html="modelValue"
|
||||
:isReadOnly="isReadOnly"
|
||||
:rows="getArgument('rows')"
|
||||
:disableExpressionColoring="!isHtmlNode(node)"
|
||||
|
|
@ -108,7 +112,7 @@
|
|||
|
||||
<sql-editor
|
||||
v-else-if="editorType === 'sqlEditor'"
|
||||
:query="value"
|
||||
:query="modelValue"
|
||||
:dialect="getArgument('sqlDialect')"
|
||||
:isReadOnly="isReadOnly"
|
||||
@valueChanged="valueChangedDebounced"
|
||||
|
|
@ -121,7 +125,7 @@
|
|||
>
|
||||
<code-node-editor
|
||||
v-if="!codeEditDialogVisible"
|
||||
:value="value"
|
||||
:modelValue="modelValue"
|
||||
:language="editorLanguage"
|
||||
:isReadOnly="true"
|
||||
/>
|
||||
|
|
@ -137,8 +141,8 @@
|
|||
:rows="getArgument('rows')"
|
||||
:modelValue="displayValue"
|
||||
:disabled="isReadOnly"
|
||||
@update:modelValue="onTextInputChange"
|
||||
@change="valueChanged"
|
||||
@update:modelValue="valueChanged"
|
||||
@change="onTextInputChange"
|
||||
@keydown.stop
|
||||
@focus="setFocus"
|
||||
@blur="onBlur"
|
||||
|
|
@ -171,7 +175,7 @@
|
|||
:disabled="isReadOnly"
|
||||
@focus="setFocus"
|
||||
@blur="onBlur"
|
||||
@change="valueChanged"
|
||||
@update:modelValue="valueChanged"
|
||||
:title="displayTitle"
|
||||
:show-alpha="getArgument('showAlpha')"
|
||||
/>
|
||||
|
|
@ -203,7 +207,7 @@
|
|||
: $locale.baseText('parameterInput.selectDateAndTime')
|
||||
"
|
||||
:picker-options="dateTimePickerOptions"
|
||||
@change="valueChanged"
|
||||
@update:modelValue="valueChanged"
|
||||
@focus="setFocus"
|
||||
@blur="onBlur"
|
||||
@keydown.stop
|
||||
|
|
@ -221,8 +225,8 @@
|
|||
:disabled="isReadOnly"
|
||||
:title="displayTitle"
|
||||
:placeholder="parameter.placeholder"
|
||||
@change="valueChanged"
|
||||
@update:modelValue="onTextInputChange"
|
||||
@change="onTextInputChange"
|
||||
@update:modelValue="valueChanged"
|
||||
@focus="setFocus"
|
||||
@blur="onBlur"
|
||||
@keydown.stop
|
||||
|
|
@ -260,7 +264,7 @@
|
|||
:loading="remoteParameterOptionsLoading"
|
||||
:disabled="isReadOnly || remoteParameterOptionsLoading"
|
||||
:title="displayTitle"
|
||||
@change="valueChanged"
|
||||
@update:modelValue="valueChanged"
|
||||
@keydown.stop
|
||||
@focus="setFocus"
|
||||
@blur="onBlur"
|
||||
|
|
@ -298,7 +302,7 @@
|
|||
:disabled="isReadOnly || remoteParameterOptionsLoading"
|
||||
:title="displayTitle"
|
||||
:placeholder="$locale.baseText('parameterInput.select')"
|
||||
@change="valueChanged"
|
||||
@update:modelValue="valueChanged"
|
||||
@keydown.stop
|
||||
@focus="setFocus"
|
||||
@blur="onBlur"
|
||||
|
|
@ -335,7 +339,7 @@
|
|||
active-color="#13ce66"
|
||||
:value="displayValue"
|
||||
:disabled="isReadOnly"
|
||||
@change="valueChanged"
|
||||
@update:modelValue="valueChanged"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
|
@ -417,7 +421,7 @@ export default defineComponent({
|
|||
path: {
|
||||
type: String,
|
||||
},
|
||||
value: {
|
||||
modelValue: {
|
||||
type: [String, Number, Boolean, Array, Object] as PropType<NodeParameterValueType>,
|
||||
},
|
||||
hideLabel: {
|
||||
|
|
@ -521,7 +525,7 @@ export default defineComponent({
|
|||
// on which the current field depends on changes
|
||||
await this.loadRemoteParameterOptions();
|
||||
},
|
||||
value() {
|
||||
modelValue() {
|
||||
if (this.parameter.type === 'color' && this.getArgument('showAlpha') === true) {
|
||||
// Do not set for color with alpha else wrong value gets displayed in field
|
||||
return;
|
||||
|
|
@ -542,7 +546,9 @@ export default defineComponent({
|
|||
return '';
|
||||
}
|
||||
|
||||
const value = isResourceLocatorValue(this.value) ? this.value.value : this.value;
|
||||
const value = isResourceLocatorValue(this.modelValue)
|
||||
? this.modelValue.value
|
||||
: this.modelValue;
|
||||
if (typeof value === 'string' && value.startsWith('=')) {
|
||||
return value.slice(1);
|
||||
}
|
||||
|
|
@ -550,7 +556,7 @@ export default defineComponent({
|
|||
return `${this.displayValue ?? ''}`;
|
||||
},
|
||||
isValueExpression(): boolean {
|
||||
return isValueExpression(this.parameter, this.value);
|
||||
return isValueExpression(this.parameter, this.modelValue);
|
||||
},
|
||||
codeAutocomplete(): string | undefined {
|
||||
return this.getArgument('codeAutocomplete') as string | undefined;
|
||||
|
|
@ -608,16 +614,16 @@ export default defineComponent({
|
|||
let returnValue;
|
||||
if (this.isValueExpression === false) {
|
||||
returnValue = this.isResourceLocatorParameter
|
||||
? isResourceLocatorValue(this.value)
|
||||
? this.value.value
|
||||
? isResourceLocatorValue(this.modelValue)
|
||||
? this.modelValue.value
|
||||
: ''
|
||||
: this.value;
|
||||
: this.modelValue;
|
||||
} else {
|
||||
returnValue = this.expressionEvaluated;
|
||||
}
|
||||
|
||||
if (this.parameter.type === 'credentialsSelect' && typeof this.value === 'string') {
|
||||
const credType = this.credentialsStore.getCredentialTypeByName(this.value);
|
||||
if (this.parameter.type === 'credentialsSelect' && typeof this.modelValue === 'string') {
|
||||
const credType = this.credentialsStore.getCredentialTypeByName(this.modelValue);
|
||||
if (credType) {
|
||||
returnValue = credType.displayName;
|
||||
}
|
||||
|
|
@ -942,7 +948,7 @@ export default defineComponent({
|
|||
},
|
||||
expressionUpdated(value: string) {
|
||||
const val: NodeParameterValueType = this.isResourceLocatorParameter
|
||||
? { __rl: true, value, mode: this.value.mode }
|
||||
? { __rl: true, value, mode: this.modelValue.mode }
|
||||
: value;
|
||||
this.valueChanged(val);
|
||||
},
|
||||
|
|
@ -1063,26 +1069,30 @@ export default defineComponent({
|
|||
}
|
||||
},
|
||||
optionSelected(command: string) {
|
||||
const prevValue = this.value;
|
||||
const prevValue = this.modelValue;
|
||||
|
||||
if (command === 'resetValue') {
|
||||
this.valueChanged(this.parameter.default);
|
||||
} else if (command === 'addExpression') {
|
||||
if (this.isResourceLocatorParameter) {
|
||||
if (isResourceLocatorValue(this.value)) {
|
||||
this.valueChanged({ __rl: true, value: `=${this.value.value}`, mode: this.value.mode });
|
||||
if (isResourceLocatorValue(this.modelValue)) {
|
||||
this.valueChanged({
|
||||
__rl: true,
|
||||
value: `=${this.modelValue.value}`,
|
||||
mode: this.modelValue.mode,
|
||||
});
|
||||
} else {
|
||||
this.valueChanged({ __rl: true, value: `=${this.value}`, mode: '' });
|
||||
this.valueChanged({ __rl: true, value: `=${this.modelValue}`, mode: '' });
|
||||
}
|
||||
} else if (
|
||||
this.parameter.type === 'number' &&
|
||||
(!this.value || this.value === '[Object: null]')
|
||||
(!this.modelValue || this.modelValue === '[Object: null]')
|
||||
) {
|
||||
this.valueChanged('={{ 0 }}');
|
||||
} else if (this.parameter.type === 'number' || this.parameter.type === 'boolean') {
|
||||
this.valueChanged(`={{ ${this.value} }}`);
|
||||
this.valueChanged(`={{ ${this.modelValue} }}`);
|
||||
} else {
|
||||
this.valueChanged(`=${this.value}`);
|
||||
this.valueChanged(`=${this.modelValue}`);
|
||||
}
|
||||
|
||||
this.setFocus();
|
||||
|
|
@ -1101,14 +1111,14 @@ export default defineComponent({
|
|||
);
|
||||
}
|
||||
|
||||
if (this.isResourceLocatorParameter && isResourceLocatorValue(this.value)) {
|
||||
this.valueChanged({ __rl: true, value, mode: this.value.mode });
|
||||
if (this.isResourceLocatorParameter && isResourceLocatorValue(this.modelValue)) {
|
||||
this.valueChanged({ __rl: true, value, mode: this.modelValue.mode });
|
||||
} else {
|
||||
let newValue = typeof value !== 'undefined' ? value : null;
|
||||
|
||||
if (this.parameter.type === 'string') {
|
||||
// Strip the '=' from the beginning
|
||||
newValue = this.value ? this.value.toString().substring(1) : null;
|
||||
newValue = this.modelValue ? this.modelValue.toString().substring(1) : null;
|
||||
}
|
||||
|
||||
this.valueChanged(newValue);
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
ref="param"
|
||||
:inputSize="inputSize"
|
||||
:parameter="parameter"
|
||||
:value="value"
|
||||
:modelValue="value"
|
||||
:path="path"
|
||||
:isReadOnly="isReadOnly"
|
||||
:droppable="droppable"
|
||||
|
|
|
|||
|
|
@ -44,6 +44,7 @@ import type { NodeParameterValueType } from 'n8n-workflow';
|
|||
import { defineComponent } from 'vue';
|
||||
import type { PropType } from 'vue';
|
||||
import { isValueExpression, isResourceLocatorValue } from '@/utils';
|
||||
import { i18n } from '@/plugins/i18n';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'parameter-options',
|
||||
|
|
@ -81,7 +82,7 @@ export default defineComponent({
|
|||
loadingMessage: {
|
||||
type: String,
|
||||
default() {
|
||||
return this.$locale.baseText('genericHelpers.loading');
|
||||
return i18n.baseText('genericHelpers.loading');
|
||||
},
|
||||
},
|
||||
},
|
||||
|
|
|
|||
|
|
@ -132,7 +132,7 @@
|
|||
:modelValue="runIndex"
|
||||
@update:modelValue="onRunIndexChange"
|
||||
@click.stop
|
||||
popper-append-to-body
|
||||
teleported
|
||||
>
|
||||
<template #prepend>{{ $locale.baseText('ndv.output.run') }}</template>
|
||||
<n8n-option
|
||||
|
|
@ -195,9 +195,9 @@
|
|||
<div v-else-if="editMode.enabled" :class="$style.editMode">
|
||||
<div :class="[$style.editModeBody, 'ignore-key-press']">
|
||||
<code-node-editor
|
||||
:value="editMode.value"
|
||||
:modelValue="editMode.value"
|
||||
language="json"
|
||||
@valueChanged="ndvStore.setOutputPanelEditModeValue($event)"
|
||||
@update:modelValue="ndvStore.setOutputPanelEditModeValue($event)"
|
||||
/>
|
||||
</div>
|
||||
<div :class="$style.editModeFooter">
|
||||
|
|
@ -459,7 +459,7 @@
|
|||
size="mini"
|
||||
:modelValue="pageSize"
|
||||
@update:modelValue="onPageSizeChange"
|
||||
popper-append-to-body
|
||||
teleported
|
||||
>
|
||||
<template #prepend>{{ $locale.baseText('ndv.output.pageSize') }}</template>
|
||||
<n8n-option v-for="size in pageSizes" :key="size" :label="size" :value="size">
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@
|
|||
<n8n-tooltip placement="bottom-end">
|
||||
<template #content>
|
||||
<div>
|
||||
<i18n-t path="dataMapping.tableView.tableColumnsExceeded.tooltip">
|
||||
<i18n-t keypath="dataMapping.tableView.tableColumnsExceeded.tooltip">
|
||||
<template #columnLimit>{{ columnLimit }}</template>
|
||||
<template #link>
|
||||
<a @click="switchToJsonView">{{
|
||||
|
|
|
|||
|
|
@ -14,7 +14,6 @@
|
|||
ref="select"
|
||||
loading-text="..."
|
||||
popper-class="tags-dropdown"
|
||||
size="medium"
|
||||
>
|
||||
<n8n-option
|
||||
v-if="options.length === 0 && filter && createEnabled"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div v-if="dialogVisible">
|
||||
<el-dialog
|
||||
:visible="dialogVisible"
|
||||
:modelValue="dialogVisible"
|
||||
append-to-body
|
||||
width="80%"
|
||||
:title="`${$locale.baseText('textEdit.edit')} ${$locale
|
||||
|
|
|
|||
|
|
@ -71,7 +71,7 @@
|
|||
<template #fallback>
|
||||
<n8n-text>
|
||||
<i18n-t
|
||||
:path="
|
||||
:keypath="
|
||||
uiStore.contextBasedTranslationKeys.workflows.sharing.unavailable.description
|
||||
"
|
||||
tag="span"
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<n8n-popover trigger="click">
|
||||
<n8n-popover trigger="click" width="304" size="large">
|
||||
<template #reference>
|
||||
<n8n-button
|
||||
icon="filter"
|
||||
|
|
|
|||
|
|
@ -66,7 +66,6 @@
|
|||
v-model="filters.search"
|
||||
:class="[$style['search'], 'mr-2xs']"
|
||||
:placeholder="$locale.baseText(`${resourceKey}.search.placeholder`)"
|
||||
size="medium"
|
||||
clearable
|
||||
ref="search"
|
||||
data-test-id="resources-list-search"
|
||||
|
|
@ -76,7 +75,7 @@
|
|||
</template>
|
||||
</n8n-input>
|
||||
<div :class="$style['sort-and-filter']">
|
||||
<n8n-select v-model="sortBy" size="medium" data-test-id="resources-list-sort">
|
||||
<n8n-select v-model="sortBy" data-test-id="resources-list-sort">
|
||||
<n8n-option
|
||||
v-for="sortOption in sortOptions"
|
||||
:key="sortOption"
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ export default defineComponent({
|
|||
transition: 200ms ease;
|
||||
}
|
||||
.slide-leave-to,
|
||||
.slide-enter {
|
||||
.slide-enter-from {
|
||||
transform: translateX(100%);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -24,7 +24,6 @@
|
|||
/>
|
||||
<n8n-select
|
||||
:modelValue="filters.type"
|
||||
size="medium"
|
||||
multiple
|
||||
filterable
|
||||
ref="typeInput"
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
<div v-if="apiKey">
|
||||
<p class="mb-s">
|
||||
<n8n-info-tip :bold="false">
|
||||
<i18n-t path="settings.api.view.info" tag="span">
|
||||
<i18n-t keypath="settings.api.view.info" tag="span">
|
||||
<template #apiAction>
|
||||
<a
|
||||
href="https://docs.n8n.io/api"
|
||||
|
|
|
|||
|
|
@ -138,7 +138,7 @@ const openPricingPage = () => {
|
|||
/>
|
||||
<div v-if="!usageStore.isDesktop && !usageStore.isLoading">
|
||||
<n8n-heading :class="$style.title" size="large">
|
||||
<i18n-t path="settings.usageAndPlan.description">
|
||||
<i18n-t keypath="settings.usageAndPlan.description">
|
||||
<template #name>{{ usageStore.planName }}</template>
|
||||
<template #type>
|
||||
<span v-if="usageStore.planId">{{
|
||||
|
|
@ -160,7 +160,7 @@ const openPricingPage = () => {
|
|||
:style="{ width: `${usageStore.executionPercentage}%` }"
|
||||
></span>
|
||||
</span>
|
||||
<i18n-t :class="$style.count" path="settings.usageAndPlan.activeWorkflows.count">
|
||||
<i18n-t :class="$style.count" keypath="settings.usageAndPlan.activeWorkflows.count">
|
||||
<template #count>{{ usageStore.executionCount }}</template>
|
||||
<template #limit>
|
||||
<span v-if="usageStore.executionLimit < 0">{{
|
||||
|
|
@ -203,7 +203,7 @@ const openPricingPage = () => {
|
|||
top="0"
|
||||
@closed="onDialogClosed"
|
||||
@opened="onDialogOpened"
|
||||
:visible.sync="activationKeyModal"
|
||||
v-model="activationKeyModal"
|
||||
:title="locale.baseText('settings.usageAndPlan.dialog.activation.title')"
|
||||
>
|
||||
<template #default>
|
||||
|
|
|
|||
|
|
@ -189,7 +189,7 @@ const refreshBranches = async () => {
|
|||
data-test-id="version-control-content-licensed"
|
||||
>
|
||||
<n8n-callout theme="secondary" icon="info-circle" class="mt-2xl mb-l">
|
||||
<i18n-t path="settings.versionControl.description">
|
||||
<i18n-t keypath="settings.versionControl.description">
|
||||
<template #link>
|
||||
<a :href="versionControlDocsSetupUrl" target="_blank">
|
||||
{{ locale.baseText('settings.versionControl.description.link') }}
|
||||
|
|
@ -280,7 +280,7 @@ const refreshBranches = async () => {
|
|||
</n8n-button>
|
||||
</div>
|
||||
<n8n-notice type="info" class="mt-s">
|
||||
<i18n-t path="settings.versionControl.sshKeyDescription">
|
||||
<i18n-t keypath="settings.versionControl.sshKeyDescription">
|
||||
<template #link>
|
||||
<a :href="versionControlDocsSetupUrl" target="_blank">{{
|
||||
locale.baseText('settings.versionControl.sshKeyDescriptionLink')
|
||||
|
|
@ -342,7 +342,7 @@ const refreshBranches = async () => {
|
|||
v-model="versionControlStore.preferences.branchReadOnly"
|
||||
:class="$style.readOnly"
|
||||
>
|
||||
<i18n-t path="settings.versionControl.readonly">
|
||||
<i18n-t keypath="settings.versionControl.readonly">
|
||||
<template #bold>
|
||||
<strong>{{ locale.baseText('settings.versionControl.readonly.bold') }}</strong>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -77,11 +77,7 @@
|
|||
color="text-base"
|
||||
class="mb-3xs"
|
||||
/>
|
||||
<n8n-select
|
||||
:modelValue="filters.status"
|
||||
@update:modelValue="setKeyValue('status', $event)"
|
||||
size="medium"
|
||||
>
|
||||
<n8n-select :modelValue="filters.status" @update:modelValue="setKeyValue('status', $event)">
|
||||
<n8n-option
|
||||
v-for="option in statusFilterOptions"
|
||||
:key="option.label"
|
||||
|
|
|
|||
Loading…
Reference in a new issue