mirror of
https://github.com/n8n-io/n8n.git
synced 2024-12-24 04:04:06 -08:00
⚡ Add wait node toasts (#2203)
* ⚡ Generalize unique entity name generation * ⚡ Standardize variable names * redo credentials * revert some changes, replace got with was * fix v-if order * fix v-if order * update linting * update gulpfile * update ssh display name * update height * update params * update info tip sizes * address design comments * update google button disabled * update icon size to 28px * update design issues * update info tab design * address design comments * update tab size * update run data spacing * address comments, update logo design * fix spacing issues * clean up store * fix create new bug * add loading state * rename prop * remove unused prop * fix select bug * remove label tag * update word break * build * address design comments * update font family of button * update menu opacity * update text * update title * address more comments * update oauth messages * add oauth validation * hide disabled state * update warning modal * show button on text input * clean up cred details * add validation errors * fix bug when deleting cred * Frontend hack to display test button * Created interfaces for testing and endpoint * Testing slack node credentials working * Adding test with node to endpoint for credential testing * Fixed linting and test detectability * Adding required for slack token * Added google sheets credential testing * update message * Adding suggestions by Ivan and Mutasem * Address comments * keep blurred when focused * update font weight of errors * add oauth banner * remove toast * Fixed code bug and added telegram credential testing * scroll to top on success * clean up duplication * Fixed telegram trigger node and added tests to typeform * refactor modal * add more validation support * refactor info tab * scroll to bottom on save, handle cred saving * refactor save button * save cred on valid * save cred on valid * scroll to top if has error * add targets on input labels * delete credentails input * revert fe changes * update validation logic * clean interface * test credentials * update banner design * show testing state * update x position * fix issues * fix focus issues * clean up validation behavior * make error relative * update banner component * update error spacing * don't close dialog * rename button * update how banners behave * if has unsaved changes first * move confirm message * add success banner * update time state * disable transitions * test on open * clean up banner behavior * update banner styling * capitalize * update error banner styling to handle long texts * avoid unnessary content jostling * add loading label * show validation warnings when opening modal * retest cred if not all props req * update scroll to auto * add error warning * update color saturation * set overflow to auto * fix bug to get credentials when connected * round down to minutes * change tab name * update casing oauth * disable credential testing if it has expressions * label same as title * add more space between close and save * remove check on making any changes * hide close on confirm modals * don't accept clicks outside dialog * fix build issues * undo test changes * fix table scrollbar logs * rename modals * fix bug with same name * refactor modal * fix tslint issue * refactor name * update name behavior * update monospace font * remove comment * refactor inputs * refactor error handling * reduce spacing changes * fix doc url oauth1 oauth2 * build * add toast for waiting executions * hide infotip if no inputs * address most comments * rename file * fix menu alignment * gst * update types * update language * refactor toast behavior, add support for links clicking * allow closing workflow modal from notification * refactor how modals work * fix data display * update toast behavior * fix type issues * rename prop * update overflow behavior for settings * only expand used properties * fix edge bug * make scrollable prop, add margin to tags footer * remove max height from tag manager * rewrite message * fix notice word break * update property names * clear sticky notifications on run * build * refactor function out * use destruction Co-authored-by: Iván Ovejero <ivov.src@gmail.com> Co-authored-by: Omar Ajoue <krynble@gmail.com>
This commit is contained in:
Mutasem Aldmour
GitHub
parent
e3c3a381b6
commit
6461423a5c
|
|
@ -578,7 +578,6 @@ export interface IRootState {
|
|||
pushConnectionActive: boolean;
|
||||
saveDataErrorExecution: string;
|
||||
saveDataSuccessExecution: string;
|
||||
saveManualExecutions: boolean;
|
||||
timezone: string;
|
||||
stateIsDirty: boolean;
|
||||
executionTimeout: number;
|
||||
|
|
|
|||
|
|
@ -1,11 +1,12 @@
|
|||
<template>
|
||||
<Modal
|
||||
:name="modalName"
|
||||
size="lg"
|
||||
:customClass="$style.credentialModal"
|
||||
:eventBus="modalBus"
|
||||
:loading="loading"
|
||||
:beforeClose="beforeClose"
|
||||
width="70%"
|
||||
height="80%"
|
||||
>
|
||||
<template slot="header">
|
||||
<div v-if="credentialType" :class="$style.header">
|
||||
|
|
|
|||
|
|
@ -2,7 +2,9 @@
|
|||
<Modal
|
||||
:name="modalName"
|
||||
:eventBus="modalBus"
|
||||
size="sm"
|
||||
width="50%"
|
||||
:center="true"
|
||||
maxWidth="460px"
|
||||
>
|
||||
<template slot="header">
|
||||
<h2 :class="$style.title">Add new credential</h2>
|
||||
|
|
|
|||
|
|
@ -127,6 +127,7 @@ export default mixins(externalHooks, nodeHelpers, workflowHelpers).extend({
|
|||
|
||||
.el-dialog__body {
|
||||
padding: 0 !important;
|
||||
height: 100%;
|
||||
min-height: 400px;
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
|
|
|
|||
|
|
@ -3,30 +3,34 @@
|
|||
:name="modalName"
|
||||
:eventBus="modalBus"
|
||||
@enter="save"
|
||||
size="sm"
|
||||
title="Duplicate Workflow"
|
||||
:center="true"
|
||||
minWidth="420px"
|
||||
maxWidth="420px"
|
||||
>
|
||||
<template v-slot:content>
|
||||
<el-row>
|
||||
<n8n-input
|
||||
v-model="name"
|
||||
ref="nameInput"
|
||||
placeholder="Enter workflow name"
|
||||
:maxlength="MAX_WORKFLOW_NAME_LENGTH"
|
||||
/>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<TagsDropdown
|
||||
:createEnabled="true"
|
||||
:currentTagIds="currentTagIds"
|
||||
:eventBus="dropdownBus"
|
||||
@blur="onTagsBlur"
|
||||
@esc="onTagsEsc"
|
||||
@update="onTagsUpdate"
|
||||
placeholder="Choose or create a tag"
|
||||
ref="dropdown"
|
||||
/>
|
||||
</el-row>
|
||||
<div :class="$style.content">
|
||||
<el-row>
|
||||
<n8n-input
|
||||
v-model="name"
|
||||
ref="nameInput"
|
||||
placeholder="Enter workflow name"
|
||||
:maxlength="MAX_WORKFLOW_NAME_LENGTH"
|
||||
/>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<TagsDropdown
|
||||
:createEnabled="true"
|
||||
:currentTagIds="currentTagIds"
|
||||
:eventBus="dropdownBus"
|
||||
@blur="onTagsBlur"
|
||||
@esc="onTagsEsc"
|
||||
@update="onTagsUpdate"
|
||||
placeholder="Choose or create a tag"
|
||||
ref="dropdown"
|
||||
/>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
<template v-slot:footer="{ close }">
|
||||
<div :class="$style.footer">
|
||||
|
|
@ -127,6 +131,12 @@ export default mixins(showMessage, workflowHelpers).extend({
|
|||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
.content {
|
||||
> div {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
> * {
|
||||
margin-left: var(--spacing-3xs);
|
||||
|
|
|
|||
|
|
@ -65,7 +65,11 @@ export default mixins(showMessage).extend({
|
|||
if (!this.name) {
|
||||
this.$emit('input', `Untitled ${this.type}`);
|
||||
|
||||
this.$showWarning('Error', `${this.type} name cannot be empty`);
|
||||
this.$showToast({
|
||||
title: 'Error',
|
||||
message: `${this.type} name cannot be empty`,
|
||||
type: 'warning',
|
||||
});
|
||||
}
|
||||
|
||||
this.isNameEdit = false;
|
||||
|
|
|
|||
|
|
@ -3,7 +3,6 @@
|
|||
<about :dialogVisible="aboutDialogVisible" @closeDialog="closeAboutDialog"></about>
|
||||
<executions-list :dialogVisible="executionsListDialogVisible" @closeDialog="closeExecutionsListOpenDialog"></executions-list>
|
||||
<credentials-list :dialogVisible="credentialOpenDialogVisible" @closeDialog="closeCredentialOpenDialog"></credentials-list>
|
||||
<workflow-settings :dialogVisible="workflowSettingsDialogVisible" @closeDialog="closeWorkflowSettingsDialog"></workflow-settings>
|
||||
<input type="file" ref="importFile" style="display: none" v-on:change="handleFileImport()">
|
||||
|
||||
<div class="side-menu-wrapper" :class="{expanded: !isCollapsed}">
|
||||
|
|
@ -229,7 +228,6 @@ export default mixins(
|
|||
credentialOpenDialogVisible: false,
|
||||
executionsListDialogVisible: false,
|
||||
stopExecutionInProgress: false,
|
||||
workflowSettingsDialogVisible: false,
|
||||
helpMenuItems,
|
||||
};
|
||||
},
|
||||
|
|
@ -305,9 +303,6 @@ export default mixins(
|
|||
closeAboutDialog () {
|
||||
this.aboutDialogVisible = false;
|
||||
},
|
||||
closeWorkflowSettingsDialog () {
|
||||
this.workflowSettingsDialogVisible = false;
|
||||
},
|
||||
closeExecutionsListOpenDialog () {
|
||||
this.executionsListDialogVisible = false;
|
||||
},
|
||||
|
|
@ -436,7 +431,7 @@ export default mixins(
|
|||
} else if (key === 'help-about') {
|
||||
this.aboutDialogVisible = true;
|
||||
} else if (key === 'workflow-settings') {
|
||||
this.workflowSettingsDialogVisible = true;
|
||||
this.$store.dispatch('ui/openWorkflowSettingsModal');
|
||||
} else if (key === 'workflow-new') {
|
||||
const result = this.$store.getters.getStateIsDirty;
|
||||
if(result) {
|
||||
|
|
|
|||
|
|
@ -1,63 +1,84 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-drawer
|
||||
v-if="drawer"
|
||||
:direction="drawerDirection"
|
||||
:visible="visible && visibleDrawer"
|
||||
:size="drawerWidth"
|
||||
:before-close="closeDrawer"
|
||||
>
|
||||
<template v-slot:title>
|
||||
<slot name="header" />
|
||||
</template>
|
||||
<template>
|
||||
<slot name="content"/>
|
||||
</template>
|
||||
</el-drawer>
|
||||
<el-dialog
|
||||
v-else
|
||||
:visible="dialogVisible"
|
||||
:before-close="closeDialog"
|
||||
:title="title"
|
||||
:class="{ 'dialog-wrapper': true, [size]: true }"
|
||||
:width="width"
|
||||
:show-close="showClose"
|
||||
:custom-class="getCustomClass()"
|
||||
append-to-body
|
||||
>
|
||||
<template v-slot:title>
|
||||
<slot name="header" v-if="!loading" />
|
||||
</template>
|
||||
<div class="modal-content" @keydown.stop @keydown.enter="handleEnter" @keydown.esc="closeDialog">
|
||||
<slot v-if="!loading" name="content"/>
|
||||
<div class="loader" v-else>
|
||||
<n8n-spinner />
|
||||
</div>
|
||||
<el-dialog
|
||||
:visible="visible"
|
||||
:before-close="closeDialog"
|
||||
:title="title"
|
||||
:class="{'dialog-wrapper': true, 'center': center, 'scrollable': scrollable}"
|
||||
:width="width"
|
||||
:show-close="showClose"
|
||||
:custom-class="getCustomClass()"
|
||||
:style="styles"
|
||||
append-to-body
|
||||
>
|
||||
<template v-slot:title>
|
||||
<slot name="header" v-if="!loading" />
|
||||
</template>
|
||||
<div class="modal-content" @keydown.stop @keydown.enter="handleEnter" @keydown.esc="closeDialog">
|
||||
<slot v-if="!loading" name="content"/>
|
||||
<div class="loader" v-else>
|
||||
<n8n-spinner />
|
||||
</div>
|
||||
<el-row v-if="!loading" class="modal-footer">
|
||||
<slot name="footer" :close="closeDialog" />
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
<el-row v-if="!loading" class="modal-footer">
|
||||
<slot name="footer" :close="closeDialog" />
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from "vue";
|
||||
|
||||
const sizeMap: {[size: string]: string} = {
|
||||
xl: '80%',
|
||||
lg: '70%',
|
||||
m: '50%',
|
||||
default: '50%',
|
||||
};
|
||||
|
||||
export default Vue.extend({
|
||||
name: "Modal",
|
||||
props: ['name', 'title', 'eventBus', 'size', 'drawer', 'drawerDirection', 'drawerWidth', 'visible', 'showClose', 'loading', 'classic', 'beforeClose', 'customClass'],
|
||||
data() {
|
||||
return {
|
||||
visibleDrawer: this.drawer,
|
||||
};
|
||||
props: {
|
||||
name: {
|
||||
type: String,
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
},
|
||||
eventBus: {
|
||||
type: Vue,
|
||||
},
|
||||
showClose: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
loading: {
|
||||
type: Boolean,
|
||||
},
|
||||
classic: {
|
||||
type: Boolean,
|
||||
},
|
||||
beforeClose: {
|
||||
type: Function,
|
||||
},
|
||||
customClass: {
|
||||
type: String,
|
||||
},
|
||||
center: {
|
||||
type: Boolean,
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
default: '50%',
|
||||
},
|
||||
minWidth: {
|
||||
type: String,
|
||||
},
|
||||
maxWidth: {
|
||||
type: String,
|
||||
},
|
||||
height: {
|
||||
type: String,
|
||||
},
|
||||
maxHeight: {
|
||||
type: String,
|
||||
},
|
||||
scrollable: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
window.addEventListener('keydown', this.onWindowKeydown);
|
||||
|
|
@ -108,13 +129,6 @@ export default Vue.extend({
|
|||
callback();
|
||||
}
|
||||
},
|
||||
closeDrawer() {
|
||||
this.visibleDrawer = false;
|
||||
setTimeout(() =>{
|
||||
this.$store.commit('ui/closeTopModal');
|
||||
this.visibleDrawer = true;
|
||||
}, 300); // delayed for closing animation to take effect
|
||||
},
|
||||
getCustomClass() {
|
||||
let classes = this.$props.customClass || '';
|
||||
|
||||
|
|
@ -126,60 +140,64 @@ export default Vue.extend({
|
|||
},
|
||||
},
|
||||
computed: {
|
||||
width(): string {
|
||||
return this.$props.size ? sizeMap[this.$props.size] : sizeMap.default;
|
||||
},
|
||||
isActive(): boolean {
|
||||
return this.$store.getters['ui/isModalActive'](this.$props.name);
|
||||
},
|
||||
dialogVisible(): boolean {
|
||||
visible(): boolean {
|
||||
return this.$store.getters['ui/isModalOpen'](this.$props.name);
|
||||
},
|
||||
styles() {
|
||||
const styles: {[prop: string]: string} = {};
|
||||
if (this.height) {
|
||||
styles['--dialog-height'] = this.height;
|
||||
}
|
||||
if (this.maxHeight) {
|
||||
styles['--dialog-max-height'] = this.maxHeight;
|
||||
}
|
||||
if (this.maxWidth) {
|
||||
styles['--dialog-max-width'] = this.maxWidth;
|
||||
}
|
||||
if (this.minWidth) {
|
||||
styles['--dialog-min-width'] = this.minWidth;
|
||||
}
|
||||
return styles;
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.el-drawer__header {
|
||||
margin: 0;
|
||||
padding: 30px 30px 0 30px;
|
||||
}
|
||||
|
||||
.el-drawer__body {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.el-dialog__body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.dialog-wrapper {
|
||||
&.xl > div, &.md > div {
|
||||
min-width: 620px;
|
||||
.el-dialog {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: var(--dialog-max-width, 80%);
|
||||
min-width: var(--dialog-min-width, 420px);
|
||||
height: var(--dialog-height);
|
||||
max-height: var(--dialog-max-height);
|
||||
}
|
||||
|
||||
&.lg > div {
|
||||
height: 80%;
|
||||
.el-dialog__body {
|
||||
overflow: hidden;
|
||||
|
||||
.modal-content {
|
||||
height: 100%;
|
||||
}
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
&.sm {
|
||||
.modal-content {
|
||||
overflow: hidden;
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.scrollable .modal-content {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.center {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
> div {
|
||||
max-width: 460px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.modal-content > .el-row {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.loader {
|
||||
|
|
|
|||
92
packages/editor-ui/src/components/ModalDrawer.vue
Normal file
92
packages/editor-ui/src/components/ModalDrawer.vue
Normal file
|
|
@ -0,0 +1,92 @@
|
|||
<template>
|
||||
<el-drawer
|
||||
:direction="direction"
|
||||
:visible="visible"
|
||||
:size="width"
|
||||
:before-close="close"
|
||||
>
|
||||
<template v-slot:title>
|
||||
<slot name="header" />
|
||||
</template>
|
||||
<template>
|
||||
<slot name="content"/>
|
||||
</template>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from "vue";
|
||||
|
||||
export default Vue.extend({
|
||||
name: "ModalDrawer",
|
||||
props: {
|
||||
name: {
|
||||
type: String,
|
||||
},
|
||||
eventBus: {
|
||||
type: Vue,
|
||||
},
|
||||
direction: {
|
||||
type: String,
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
window.addEventListener('keydown', this.onWindowKeydown);
|
||||
|
||||
if (this.$props.eventBus) {
|
||||
this.$props.eventBus.$on('close', () => {
|
||||
this.close();
|
||||
});
|
||||
}
|
||||
|
||||
const activeElement = document.activeElement as HTMLElement;
|
||||
if (activeElement) {
|
||||
activeElement.blur();
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener('keydown', this.onWindowKeydown);
|
||||
},
|
||||
methods: {
|
||||
onWindowKeydown(event: KeyboardEvent) {
|
||||
if (!this.isActive) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (event && event.keyCode === 13) {
|
||||
this.handleEnter();
|
||||
}
|
||||
},
|
||||
handleEnter() {
|
||||
if (this.isActive) {
|
||||
this.$emit('enter');
|
||||
}
|
||||
},
|
||||
close() {
|
||||
this.$store.commit('ui/closeTopModal');
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
isActive(): boolean {
|
||||
return this.$store.getters['ui/isModalActive'](this.$props.name);
|
||||
},
|
||||
visible(): boolean {
|
||||
return this.$store.getters['ui/isModalOpen'](this.$props.name);
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.el-drawer__header {
|
||||
margin: 0;
|
||||
padding: 30px 30px 0 30px;
|
||||
}
|
||||
|
||||
.el-drawer__body {
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -26,10 +26,16 @@
|
|||
</ModalRoot>
|
||||
|
||||
<ModalRoot :name="VERSIONS_MODAL_KEY" :keepAlive="true">
|
||||
<template v-slot="{ modalName, open }">
|
||||
<template v-slot="{ modalName }">
|
||||
<UpdatesPanel
|
||||
:modalName="modalName"
|
||||
:visible="open"
|
||||
/>
|
||||
</template>
|
||||
</ModalRoot>
|
||||
<ModalRoot :name="WORKFLOW_SETTINGS_MODAL_KEY">
|
||||
<template v-slot="{ modalName }">
|
||||
<WorkflowSettings
|
||||
:modalName="modalName"
|
||||
/>
|
||||
</template>
|
||||
</ModalRoot>
|
||||
|
|
@ -56,7 +62,7 @@
|
|||
|
||||
<script lang="ts">
|
||||
import Vue from "vue";
|
||||
import { DUPLICATE_MODAL_KEY, TAGS_MANAGER_MODAL_KEY, WORKLOW_OPEN_MODAL_KEY, VERSIONS_MODAL_KEY, CREDENTIAL_EDIT_MODAL_KEY, CREDENTIAL_SELECT_MODAL_KEY } from '@/constants';
|
||||
import { DUPLICATE_MODAL_KEY, TAGS_MANAGER_MODAL_KEY, WORKLOW_OPEN_MODAL_KEY, VERSIONS_MODAL_KEY, CREDENTIAL_EDIT_MODAL_KEY, CREDENTIAL_SELECT_MODAL_KEY, WORKFLOW_SETTINGS_MODAL_KEY } from '@/constants';
|
||||
|
||||
import CredentialEdit from "./CredentialEdit/CredentialEdit.vue";
|
||||
import DuplicateWorkflowDialog from "@/components/DuplicateWorkflowDialog.vue";
|
||||
|
|
@ -64,6 +70,7 @@ import WorkflowOpen from "@/components/WorkflowOpen.vue";
|
|||
import ModalRoot from "./ModalRoot.vue";
|
||||
import CredentialsSelectModal from "./CredentialsSelectModal.vue";
|
||||
import UpdatesPanel from "./UpdatesPanel.vue";
|
||||
import WorkflowSettings from "./WorkflowSettings.vue";
|
||||
import TagsManager from "@/components/TagsManager/TagsManager.vue";
|
||||
|
||||
export default Vue.extend({
|
||||
|
|
@ -74,6 +81,7 @@ export default Vue.extend({
|
|||
ModalRoot,
|
||||
CredentialsSelectModal,
|
||||
UpdatesPanel,
|
||||
WorkflowSettings,
|
||||
TagsManager,
|
||||
WorkflowOpen,
|
||||
},
|
||||
|
|
@ -81,6 +89,7 @@ export default Vue.extend({
|
|||
DUPLICATE_MODAL_KEY,
|
||||
TAGS_MANAGER_MODAL_KEY,
|
||||
WORKLOW_OPEN_MODAL_KEY,
|
||||
WORKFLOW_SETTINGS_MODAL_KEY,
|
||||
VERSIONS_MODAL_KEY,
|
||||
CREDENTIAL_EDIT_MODAL_KEY,
|
||||
CREDENTIAL_SELECT_MODAL_KEY,
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
:name="modalName"
|
||||
:eventBus="modalBus"
|
||||
@enter="onEnter"
|
||||
size="md"
|
||||
minWidth="620px"
|
||||
>
|
||||
<template v-slot:content>
|
||||
<el-row>
|
||||
|
|
@ -186,5 +186,6 @@ export default mixins(showMessage).extend({
|
|||
<style lang="scss" scoped>
|
||||
.el-row {
|
||||
min-height: $--tags-manager-min-height;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,8 @@
|
|||
<template>
|
||||
<Modal
|
||||
<ModalDrawer
|
||||
:name="modalName"
|
||||
:drawer="true"
|
||||
:visible="visible"
|
||||
drawerDirection="ltr"
|
||||
drawerWidth="520px"
|
||||
direction="ltr"
|
||||
width="520px"
|
||||
>
|
||||
<template slot="header">
|
||||
<span :class="$style.title">We’ve been busy ✨</span>
|
||||
|
|
@ -40,25 +38,25 @@
|
|||
</div>
|
||||
</section>
|
||||
</template>
|
||||
</Modal>
|
||||
</ModalDrawer>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import { mapGetters } from 'vuex';
|
||||
|
||||
import Modal from './Modal.vue';
|
||||
import ModalDrawer from './ModalDrawer.vue';
|
||||
import TimeAgo from './TimeAgo.vue';
|
||||
import VersionCard from './VersionCard.vue';
|
||||
|
||||
export default Vue.extend({
|
||||
name: 'UpdatesPanel',
|
||||
components: {
|
||||
Modal,
|
||||
ModalDrawer,
|
||||
VersionCard,
|
||||
TimeAgo,
|
||||
},
|
||||
props: ['modalName', 'visible'],
|
||||
props: ['modalName'],
|
||||
computed: {
|
||||
...mapGetters('versions', ['nextVersions', 'currentVersion', 'infoUrl']),
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
<template>
|
||||
<Modal
|
||||
:name="modalName"
|
||||
size="xl"
|
||||
width="80%"
|
||||
minWidth="620px"
|
||||
:classic="true"
|
||||
>
|
||||
<template v-slot:header>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,14 @@
|
|||
<template>
|
||||
<span>
|
||||
<el-dialog class="workflow-settings" :visible="dialogVisible" append-to-body width="65%" title="Workflow Settings" :before-close="closeDialog">
|
||||
<div v-loading="isLoading">
|
||||
<Modal
|
||||
:name="modalName"
|
||||
width="65%"
|
||||
maxHeight="80%"
|
||||
title="Workflow Settings"
|
||||
:eventBus="modalBus"
|
||||
:scrollable="true"
|
||||
>
|
||||
<template v-slot:content>
|
||||
<div v-loading="isLoading" class="workflow-settings">
|
||||
<el-row>
|
||||
<el-col :span="10" class="setting-name">
|
||||
Error Workflow:
|
||||
|
|
@ -156,12 +163,14 @@
|
|||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="action-buttons">
|
||||
<n8n-button label="Save" size="large" @click="saveSettings" />
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</span>
|
||||
</template>
|
||||
<template v-slot:footer>
|
||||
<div class="action-buttons">
|
||||
<n8n-button label="Save" size="large" @click="saveSettings" />
|
||||
</div>
|
||||
</template>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
|
|
@ -177,6 +186,7 @@ import {
|
|||
IWorkflowSettings,
|
||||
IWorkflowShortResponse,
|
||||
} from '@/Interface';
|
||||
import Modal from './Modal.vue';
|
||||
|
||||
import mixins from 'vue-typed-mixins';
|
||||
|
||||
|
|
@ -187,9 +197,14 @@ export default mixins(
|
|||
showMessage,
|
||||
).extend({
|
||||
name: 'WorkflowSettings',
|
||||
props: [
|
||||
'dialogVisible',
|
||||
],
|
||||
props: {
|
||||
modalName: {
|
||||
type: String,
|
||||
},
|
||||
},
|
||||
components: {
|
||||
Modal,
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
isLoading: true,
|
||||
|
|
@ -220,22 +235,74 @@ export default mixins(
|
|||
executionTimeout: this.$store.getters.executionTimeout,
|
||||
maxExecutionTimeout: this.$store.getters.maxExecutionTimeout,
|
||||
timeoutHMS: { hours: 0, minutes: 0, seconds: 0 } as ITimeoutHMS,
|
||||
modalBus: new Vue(),
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
dialogVisible (newValue, oldValue) {
|
||||
if (newValue) {
|
||||
this.openDialog();
|
||||
}
|
||||
this.$externalHooks().run('workflowSettings.dialogVisibleChanged', { dialogVisible: newValue });
|
||||
},
|
||||
async mounted () {
|
||||
if (this.$route.params.name === undefined) {
|
||||
this.$showMessage({
|
||||
title: 'No workflow active',
|
||||
message: `No workflow active to display settings of.`,
|
||||
type: 'error',
|
||||
duration: 0,
|
||||
});
|
||||
this.closeDialog();
|
||||
return;
|
||||
}
|
||||
|
||||
this.defaultValues.saveDataErrorExecution = this.$store.getters.saveDataErrorExecution;
|
||||
this.defaultValues.saveDataSuccessExecution = this.$store.getters.saveDataSuccessExecution;
|
||||
this.defaultValues.saveManualExecutions = this.$store.getters.saveManualExecutions;
|
||||
this.defaultValues.timezone = this.$store.getters.timezone;
|
||||
|
||||
this.isLoading = true;
|
||||
const promises = [];
|
||||
promises.push(this.loadWorkflows());
|
||||
promises.push(this.loadSaveDataErrorExecutionOptions());
|
||||
promises.push(this.loadSaveDataSuccessExecutionOptions());
|
||||
promises.push(this.loadSaveExecutionProgressOptions());
|
||||
promises.push(this.loadSaveManualOptions());
|
||||
promises.push(this.loadTimezones());
|
||||
|
||||
try {
|
||||
await Promise.all(promises);
|
||||
} catch (error) {
|
||||
this.$showError(error, 'Problem loading settings', 'The following error occurred loading the data:');
|
||||
}
|
||||
|
||||
const workflowSettings = JSON.parse(JSON.stringify(this.$store.getters.workflowSettings));
|
||||
|
||||
if (workflowSettings.timezone === undefined) {
|
||||
workflowSettings.timezone = 'DEFAULT';
|
||||
}
|
||||
if (workflowSettings.saveDataErrorExecution === undefined) {
|
||||
workflowSettings.saveDataErrorExecution = 'DEFAULT';
|
||||
}
|
||||
if (workflowSettings.saveDataSuccessExecution === undefined) {
|
||||
workflowSettings.saveDataSuccessExecution = 'DEFAULT';
|
||||
}
|
||||
if (workflowSettings.saveExecutionProgress === undefined) {
|
||||
workflowSettings.saveExecutionProgress = 'DEFAULT';
|
||||
}
|
||||
if (workflowSettings.saveManualExecutions === undefined) {
|
||||
workflowSettings.saveManualExecutions = 'DEFAULT';
|
||||
}
|
||||
if (workflowSettings.executionTimeout === undefined) {
|
||||
workflowSettings.executionTimeout = this.$store.getters.executionTimeout;
|
||||
}
|
||||
if (workflowSettings.maxExecutionTimeout === undefined) {
|
||||
workflowSettings.maxExecutionTimeout = this.$store.getters.maxExecutionTimeout;
|
||||
}
|
||||
|
||||
Vue.set(this, 'workflowSettings', workflowSettings);
|
||||
this.timeoutHMS = this.convertToHMS(workflowSettings.executionTimeout);
|
||||
this.isLoading = false;
|
||||
|
||||
this.$externalHooks().run('workflowSettings.dialogVisibleChanged', { dialogVisible: true });
|
||||
},
|
||||
methods: {
|
||||
closeDialog () {
|
||||
// Handle the close externally as the visible parameter is an external prop
|
||||
// and is so not allowed to be changed here.
|
||||
this.$emit('closeDialog');
|
||||
return false;
|
||||
this.modalBus.$emit('close');
|
||||
},
|
||||
setTimeout (key: string, value: string) {
|
||||
const time = value ? parseInt(value, 10) : 0;
|
||||
|
|
@ -362,66 +429,6 @@ export default mixins(
|
|||
|
||||
Vue.set(this, 'workflows', workflows);
|
||||
},
|
||||
async openDialog () {
|
||||
if (this.$route.params.name === undefined) {
|
||||
this.$showMessage({
|
||||
title: 'No workflow active',
|
||||
message: `No workflow active to display settings of.`,
|
||||
type: 'error',
|
||||
duration: 0,
|
||||
});
|
||||
this.closeDialog();
|
||||
return;
|
||||
}
|
||||
|
||||
this.defaultValues.saveDataErrorExecution = this.$store.getters.saveDataErrorExecution;
|
||||
this.defaultValues.saveDataSuccessExecution = this.$store.getters.saveDataSuccessExecution;
|
||||
this.defaultValues.saveManualExecutions = this.$store.getters.saveManualExecutions;
|
||||
this.defaultValues.timezone = this.$store.getters.timezone;
|
||||
|
||||
this.isLoading = true;
|
||||
const promises = [];
|
||||
promises.push(this.loadWorkflows());
|
||||
promises.push(this.loadSaveDataErrorExecutionOptions());
|
||||
promises.push(this.loadSaveDataSuccessExecutionOptions());
|
||||
promises.push(this.loadSaveExecutionProgressOptions());
|
||||
promises.push(this.loadSaveManualOptions());
|
||||
promises.push(this.loadTimezones());
|
||||
|
||||
try {
|
||||
await Promise.all(promises);
|
||||
} catch (error) {
|
||||
this.$showError(error, 'Problem loading settings', 'The following error occurred loading the data:');
|
||||
}
|
||||
|
||||
const workflowSettings = JSON.parse(JSON.stringify(this.$store.getters.workflowSettings));
|
||||
|
||||
if (workflowSettings.timezone === undefined) {
|
||||
workflowSettings.timezone = 'DEFAULT';
|
||||
}
|
||||
if (workflowSettings.saveDataErrorExecution === undefined) {
|
||||
workflowSettings.saveDataErrorExecution = 'DEFAULT';
|
||||
}
|
||||
if (workflowSettings.saveDataSuccessExecution === undefined) {
|
||||
workflowSettings.saveDataSuccessExecution = 'DEFAULT';
|
||||
}
|
||||
if (workflowSettings.saveExecutionProgress === undefined) {
|
||||
workflowSettings.saveExecutionProgress = 'DEFAULT';
|
||||
}
|
||||
if (workflowSettings.saveManualExecutions === undefined) {
|
||||
workflowSettings.saveManualExecutions = 'DEFAULT';
|
||||
}
|
||||
if (workflowSettings.executionTimeout === undefined) {
|
||||
workflowSettings.executionTimeout = this.$store.getters.executionTimeout;
|
||||
}
|
||||
if (workflowSettings.maxExecutionTimeout === undefined) {
|
||||
workflowSettings.maxExecutionTimeout = this.$store.getters.maxExecutionTimeout;
|
||||
}
|
||||
|
||||
Vue.set(this, 'workflowSettings', workflowSettings);
|
||||
this.timeoutHMS = this.convertToHMS(workflowSettings.executionTimeout);
|
||||
this.isLoading = false;
|
||||
},
|
||||
async saveSettings () {
|
||||
// Set that the active state should be changed
|
||||
const data: IWorkflowDataUpdate = {
|
||||
|
|
|
|||
11
packages/editor-ui/src/components/mixins/helpers.ts
Normal file
11
packages/editor-ui/src/components/mixins/helpers.ts
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
export function isChildOf(parent: Element, child: Element): boolean {
|
||||
if (child.parentElement === null) {
|
||||
return false;
|
||||
}
|
||||
if (child.parentElement === parent) {
|
||||
return true;
|
||||
}
|
||||
|
||||
return isChildOf(parent, child.parentElement);
|
||||
}
|
||||
|
||||
|
|
@ -26,15 +26,18 @@ export const newVersions = mixins(
|
|||
}
|
||||
|
||||
message = `${message} <a class="primary-color">More info</a>`;
|
||||
this.$showWarning('Critical update available', message, {
|
||||
this.$showToast({
|
||||
title: 'Critical update available',
|
||||
message,
|
||||
onClick: () => {
|
||||
this.$store.dispatch('ui/openUpdatesPanel');
|
||||
},
|
||||
closeOnClick: true,
|
||||
customClass: 'clickable',
|
||||
type: 'warning',
|
||||
duration: 0,
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -218,12 +218,35 @@ export const pushConnection = mixins(
|
|||
// @ts-ignore
|
||||
const workflow = this.getWorkflow();
|
||||
if (runDataExecuted.waitTill !== undefined) {
|
||||
const {
|
||||
isNewWorkflow,
|
||||
activeExecutionId,
|
||||
saveManualExecutions,
|
||||
} = this.$store.getters;
|
||||
|
||||
let action;
|
||||
if (isNewWorkflow || !saveManualExecutions) {
|
||||
action = '<a class="open-settings">Turn on saving manual executions</a> and run again to see what happened after this node.';
|
||||
}
|
||||
else {
|
||||
action = `<a href="/execution/${activeExecutionId}" target="_blank">View the execution</a> to see what happened after this node.`;
|
||||
}
|
||||
|
||||
// Workflow did start but had been put to wait
|
||||
this.$titleSet(workflow.name as string, 'IDLE');
|
||||
this.$showMessage({
|
||||
title: 'Workflow got started',
|
||||
message: 'Workflow execution has started and is now waiting!',
|
||||
this.$showToast({
|
||||
title: 'Workflow started waiting',
|
||||
message: `${action} <a href="https://docs.n8n.io/nodes/n8n-nodes-base.wait/" target="_blank">More info</a>`,
|
||||
type: 'success',
|
||||
duration: 0,
|
||||
onLinkClick: async (e: HTMLLinkElement) => {
|
||||
if (e.classList.contains('open-settings')) {
|
||||
if (this.$store.getters.isNewWorkflow) {
|
||||
await this.saveAsNewWorkflow();
|
||||
}
|
||||
this.$store.dispatch('ui/openWorkflowSettingsModal');
|
||||
}
|
||||
},
|
||||
});
|
||||
} else if (runDataExecuted.finished !== true) {
|
||||
this.$titleSet(workflow.name as string, 'ERROR');
|
||||
|
|
@ -237,8 +260,8 @@ export const pushConnection = mixins(
|
|||
// Workflow did execute without a problem
|
||||
this.$titleSet(workflow.name as string, 'IDLE');
|
||||
this.$showMessage({
|
||||
title: 'Workflow got executed',
|
||||
message: 'Workflow did get executed successfully!',
|
||||
title: 'Workflow was executed',
|
||||
message: 'Workflow was executed successfully!',
|
||||
type: 'success',
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,6 +6,9 @@ import { externalHooks } from '@/components/mixins/externalHooks';
|
|||
import { ExecutionError } from 'n8n-workflow';
|
||||
import { ElMessageBoxOptions } from 'element-ui/types/message-box';
|
||||
import { MessageType } from 'element-ui/types/message';
|
||||
import { isChildOf } from './helpers';
|
||||
|
||||
let stickyNotificationQueue: ElNotificationComponent[] = [];
|
||||
|
||||
export const showMessage = mixins(externalHooks).extend({
|
||||
methods: {
|
||||
|
|
@ -15,13 +18,29 @@ export const showMessage = mixins(externalHooks).extend({
|
|||
messageData.position = 'bottom-right';
|
||||
}
|
||||
|
||||
return this.$notify(messageData);
|
||||
const notification = this.$notify(messageData);
|
||||
|
||||
if (messageData.duration === 0) {
|
||||
stickyNotificationQueue.push(notification);
|
||||
}
|
||||
|
||||
return notification;
|
||||
},
|
||||
|
||||
$showWarning(title: string, message: string, config?: {onClick?: () => void, duration?: number, customClass?: string, closeOnClick?: boolean}) {
|
||||
$showToast(config: {
|
||||
title: string,
|
||||
message: string,
|
||||
onClick?: () => void,
|
||||
onClose?: () => void,
|
||||
duration?: number,
|
||||
customClass?: string,
|
||||
closeOnClick?: boolean,
|
||||
onLinkClick?: (e: HTMLLinkElement) => void,
|
||||
type?: MessageType,
|
||||
}) {
|
||||
// eslint-disable-next-line prefer-const
|
||||
let notification: ElNotificationComponent;
|
||||
if (config && config.closeOnClick) {
|
||||
if (config.closeOnClick) {
|
||||
const cb = config.onClick;
|
||||
config.onClick = () => {
|
||||
if (notification) {
|
||||
|
|
@ -33,11 +52,34 @@ export const showMessage = mixins(externalHooks).extend({
|
|||
};
|
||||
}
|
||||
|
||||
if (config.onLinkClick) {
|
||||
const onLinkClick = (e: MouseEvent) => {
|
||||
if (e && e.target && config.onLinkClick && isChildOf(notification.$el, e.target as Element)) {
|
||||
const target = e.target as HTMLElement;
|
||||
if (target && target.tagName === 'A') {
|
||||
config.onLinkClick(e.target as HTMLLinkElement);
|
||||
}
|
||||
}
|
||||
};
|
||||
window.addEventListener('click', onLinkClick);
|
||||
|
||||
const cb = config.onClose;
|
||||
config.onClose = () => {
|
||||
window.removeEventListener('click', onLinkClick);
|
||||
if (cb) {
|
||||
cb();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
notification = this.$showMessage({
|
||||
title,
|
||||
message,
|
||||
type: 'warning',
|
||||
...(config || {}),
|
||||
title: config.title,
|
||||
message: config.message,
|
||||
onClick: config.onClick,
|
||||
onClose: config.onClose,
|
||||
duration: config.duration,
|
||||
customClass: config.customClass,
|
||||
type: config.type,
|
||||
});
|
||||
|
||||
return notification;
|
||||
|
|
@ -99,6 +141,16 @@ export const showMessage = mixins(externalHooks).extend({
|
|||
}
|
||||
},
|
||||
|
||||
clearAllStickyNotifications() {
|
||||
stickyNotificationQueue.map((notification: ElNotificationComponent) => {
|
||||
if (notification) {
|
||||
notification.close();
|
||||
}
|
||||
});
|
||||
|
||||
stickyNotificationQueue = [];
|
||||
},
|
||||
|
||||
// @ts-ignore
|
||||
collapsableDetails({ description, node }: Error) {
|
||||
if (!description) return '';
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ import {
|
|||
import { externalHooks } from '@/components/mixins/externalHooks';
|
||||
import { restApi } from '@/components/mixins/restApi';
|
||||
import { workflowHelpers } from '@/components/mixins/workflowHelpers';
|
||||
import { showMessage } from '@/components/mixins/showMessage';
|
||||
|
||||
import mixins from 'vue-typed-mixins';
|
||||
import { titleChange } from './titleChange';
|
||||
|
|
@ -21,6 +22,7 @@ export const workflowRun = mixins(
|
|||
externalHooks,
|
||||
restApi,
|
||||
workflowHelpers,
|
||||
showMessage,
|
||||
titleChange,
|
||||
).extend({
|
||||
methods: {
|
||||
|
|
@ -61,6 +63,8 @@ export const workflowRun = mixins(
|
|||
const workflow = this.getWorkflow();
|
||||
this.$titleSet(workflow.name as string, 'EXECUTING');
|
||||
|
||||
this.clearAllStickyNotifications();
|
||||
|
||||
try {
|
||||
// Check first if the workflow has any issues before execute it
|
||||
const issuesExist = this.$store.getters.nodesIssuesExist;
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ export const DUPLICATE_MODAL_KEY = 'duplicate';
|
|||
export const TAGS_MANAGER_MODAL_KEY = 'tagsManager';
|
||||
export const WORKLOW_OPEN_MODAL_KEY = 'workflowOpen';
|
||||
export const VERSIONS_MODAL_KEY = 'versions';
|
||||
export const WORKFLOW_SETTINGS_MODAL_KEY = 'settings';
|
||||
export const CREDENTIAL_EDIT_MODAL_KEY = 'editCredential';
|
||||
export const CREDENTIAL_SELECT_MODAL_KEY = 'selectCredential';
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { CREDENTIAL_EDIT_MODAL_KEY, DUPLICATE_MODAL_KEY, TAGS_MANAGER_MODAL_KEY, VERSIONS_MODAL_KEY, WORKLOW_OPEN_MODAL_KEY, CREDENTIAL_SELECT_MODAL_KEY } from '@/constants';
|
||||
import { CREDENTIAL_EDIT_MODAL_KEY, DUPLICATE_MODAL_KEY, TAGS_MANAGER_MODAL_KEY, VERSIONS_MODAL_KEY, WORKLOW_OPEN_MODAL_KEY, CREDENTIAL_SELECT_MODAL_KEY, WORKFLOW_SETTINGS_MODAL_KEY } from '@/constants';
|
||||
import Vue from 'vue';
|
||||
import { ActionContext, Module } from 'vuex';
|
||||
import {
|
||||
|
|
@ -27,6 +27,9 @@ const module: Module<IUiState, IRootState> = {
|
|||
[VERSIONS_MODAL_KEY]: {
|
||||
open: false,
|
||||
},
|
||||
[WORKFLOW_SETTINGS_MODAL_KEY]: {
|
||||
open: false,
|
||||
},
|
||||
[CREDENTIAL_SELECT_MODAL_KEY]: {
|
||||
open: false,
|
||||
},
|
||||
|
|
@ -95,6 +98,9 @@ const module: Module<IUiState, IRootState> = {
|
|||
openUpdatesPanel: async (context: ActionContext<IUiState, IRootState>) => {
|
||||
context.commit('openModal', VERSIONS_MODAL_KEY);
|
||||
},
|
||||
openWorkflowSettingsModal: async (context: ActionContext<IUiState, IRootState>) => {
|
||||
context.commit('openModal', WORKFLOW_SETTINGS_MODAL_KEY);
|
||||
},
|
||||
openExisitngCredential: async (context: ActionContext<IUiState, IRootState>, { id }: {id: string}) => {
|
||||
context.commit('setActiveId', {name: CREDENTIAL_EDIT_MODAL_KEY, id});
|
||||
context.commit('setMode', {name: CREDENTIAL_EDIT_MODAL_KEY, mode: 'edit'});
|
||||
|
|
|
|||
|
|
@ -56,7 +56,6 @@ const state: IRootState = {
|
|||
pushConnectionActive: true,
|
||||
saveDataErrorExecution: 'all',
|
||||
saveDataSuccessExecution: 'all',
|
||||
saveManualExecutions: false,
|
||||
timezone: 'America/New_York',
|
||||
stateIsDirty: false,
|
||||
executionTimeout: -1,
|
||||
|
|
@ -497,9 +496,6 @@ export const store = new Vuex.Store({
|
|||
setSaveDataSuccessExecution (state, newValue: string) {
|
||||
Vue.set(state, 'saveDataSuccessExecution', newValue);
|
||||
},
|
||||
setSaveManualExecutions (state, saveManualExecutions: boolean) {
|
||||
Vue.set(state, 'saveManualExecutions', saveManualExecutions);
|
||||
},
|
||||
setTimezone (state, timezone: string) {
|
||||
Vue.set(state, 'timezone', timezone);
|
||||
},
|
||||
|
|
@ -606,6 +602,10 @@ export const store = new Vuex.Store({
|
|||
return state.activeActions.includes(action);
|
||||
},
|
||||
|
||||
isNewWorkflow: (state) => {
|
||||
return state.workflow.id === PLACEHOLDER_EMPTY_WORKFLOW_ID;
|
||||
},
|
||||
|
||||
getActiveExecutions: (state): IExecutionsCurrentSummaryExtended[] => {
|
||||
return state.activeExecutions;
|
||||
},
|
||||
|
|
@ -650,8 +650,8 @@ export const store = new Vuex.Store({
|
|||
saveDataSuccessExecution: (state): string => {
|
||||
return state.saveDataSuccessExecution;
|
||||
},
|
||||
saveManualExecutions: (state): boolean => {
|
||||
return state.saveManualExecutions;
|
||||
saveManualExecutions: (state, getters): boolean => {
|
||||
return !!getters.workflowSettings.saveManualExecutions;
|
||||
},
|
||||
timezone: (state): string => {
|
||||
return state.timezone;
|
||||
|
|
|
|||
|
|
@ -161,6 +161,7 @@ import {
|
|||
IPushDataExecutionFinished,
|
||||
ITag,
|
||||
IWorkflowTemplate,
|
||||
IExecutionsSummary,
|
||||
} from '../Interface';
|
||||
import { mapGetters } from 'vuex';
|
||||
|
||||
|
|
@ -403,6 +404,15 @@ export default mixins(
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
if ((data as IExecutionsSummary).waitTill) {
|
||||
this.$showMessage({
|
||||
title: `This execution hasn't finished yet`,
|
||||
message: `<a onclick="window.location.reload(false);">Refresh</a> to see the latest status.<br/> <a href="https://docs.n8n.io/nodes/n8n-nodes-base.wait/" target="_blank">More info</a>`,
|
||||
type: 'warning',
|
||||
duration: 0,
|
||||
});
|
||||
}
|
||||
},
|
||||
async openWorkflowTemplate (templateId: string) {
|
||||
this.setLoadingText('Loading template');
|
||||
|
|
@ -911,7 +921,7 @@ export default mixins(
|
|||
});
|
||||
} catch (error) {
|
||||
// Execution stop might fail when the execution has already finished. Let's treat this here.
|
||||
const execution = await this.restApi().getExecution(executionId) as IExecutionResponse;
|
||||
const execution = await this.restApi().getExecution(executionId);
|
||||
if (execution.finished) {
|
||||
const executedData = {
|
||||
data: execution.data,
|
||||
|
|
@ -2182,13 +2192,11 @@ export default mixins(
|
|||
},
|
||||
async loadSettings (): Promise<void> {
|
||||
const settings = await this.restApi().getSettings() as IN8nUISettings;
|
||||
|
||||
this.$store.commit('setUrlBaseWebhook', settings.urlBaseWebhook);
|
||||
this.$store.commit('setEndpointWebhook', settings.endpointWebhook);
|
||||
this.$store.commit('setEndpointWebhookTest', settings.endpointWebhookTest);
|
||||
this.$store.commit('setSaveDataErrorExecution', settings.saveDataErrorExecution);
|
||||
this.$store.commit('setSaveDataSuccessExecution', settings.saveDataSuccessExecution);
|
||||
this.$store.commit('setSaveManualExecutions', settings.saveManualExecutions);
|
||||
this.$store.commit('setTimezone', settings.timezone);
|
||||
this.$store.commit('setExecutionTimeout', settings.executionTimeout);
|
||||
this.$store.commit('setMaxExecutionTimeout', settings.maxExecutionTimeout);
|
||||
|
|
|
|||
|
|
@ -283,7 +283,7 @@ export class Wait implements INodeType {
|
|||
description: 'The HTTP Response code to return',
|
||||
},
|
||||
{
|
||||
displayName: 'Response Mode',
|
||||
displayName: 'Respond when',
|
||||
name: 'responseMode',
|
||||
type: 'options',
|
||||
displayOptions: {
|
||||
|
|
@ -295,12 +295,12 @@ export class Wait implements INodeType {
|
|||
},
|
||||
options: [
|
||||
{
|
||||
name: 'On Received',
|
||||
name: 'Webhook received',
|
||||
value: 'onReceived',
|
||||
description: 'Returns directly with defined Response Code',
|
||||
},
|
||||
{
|
||||
name: 'Last Node',
|
||||
name: 'Last node finishes',
|
||||
value: 'lastNode',
|
||||
description: 'Returns data of the last executed node',
|
||||
},
|
||||
|
|
|
|||
|
|
@ -155,17 +155,17 @@ export class Webhook implements INodeType {
|
|||
description: 'The HTTP Response code to return',
|
||||
},
|
||||
{
|
||||
displayName: 'Response Mode',
|
||||
displayName: 'Respond when',
|
||||
name: 'responseMode',
|
||||
type: 'options',
|
||||
options: [
|
||||
{
|
||||
name: 'On Received',
|
||||
name: 'Webhook received',
|
||||
value: 'onReceived',
|
||||
description: 'Returns directly with defined Response Code',
|
||||
},
|
||||
{
|
||||
name: 'Last Node',
|
||||
name: 'Last node finishes',
|
||||
value: 'lastNode',
|
||||
description: 'Returns data of the last executed node',
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in a new issue