n8n/packages/editor-ui/src/components/mixins/genericHelpers.ts
Mutasem Aldmour 1d5ba3d437
Allow to load workflow templates (#1887)
* implement import

* set name, remove console log

* add validation and such

* remove monday.com package for testing

* clean up code

* await new name

* refactor api requests

* remove unnessary import

* build

* add zoom button

* update positions on loading template

* update error handling

* build

* update zoom to center

* set state to dirty upon leaving

* clean up pr

* refactor func

* refactor redir

* fix lint issue

* refactor func out

* use new endpoint

* revert error changes

* revert error changes

* update logic to find top left node

* zoom to fit when opening workflow

* revert testing change

* update case

* address comments

* reset zoom when opening new workflow

* update endpoint to plural form

* update endpoint

*  Minor improvements

Co-authored-by: Jan Oberhauser <jan.oberhauser@gmail.com>
2021-06-22 19:33:07 +02:00

110 lines
3 KiB
TypeScript

import dateformat from 'dateformat';
import { showMessage } from '@/components/mixins/showMessage';
import { MessageType } from '@/Interface';
import { debounce } from 'lodash';
import mixins from 'vue-typed-mixins';
export const genericHelpers = mixins(showMessage).extend({
data () {
return {
loadingService: null as any | null, // tslint:disable-line:no-any
debouncedFunctions: [] as any[], // tslint:disable-line:no-any
};
},
computed: {
isReadOnly (): boolean {
if (['NodeViewExisting', 'NodeViewNew'].includes(this.$route.name as string)) {
return false;
}
return true;
},
},
methods: {
convertToDisplayDate (epochTime: number) {
return dateformat(epochTime, 'yyyy-mm-dd HH:MM:ss');
},
displayTimer (msPassed: number, showMs = false): string {
if (msPassed < 60000) {
if (showMs === false) {
return `${Math.floor(msPassed / 1000)} sec.`;
}
return `${msPassed / 1000} sec.`;
}
const secondsPassed = Math.floor(msPassed / 1000);
const minutesPassed = Math.floor(secondsPassed / 60);
const secondsLeft = (secondsPassed - (minutesPassed * 60)).toString().padStart(2, '0');
return `${minutesPassed}:${secondsLeft} min.`;
},
editAllowedCheck (): boolean {
if (this.isReadOnly) {
this.$showMessage({
title: 'Workflow can not be changed!',
message: `The workflow can not be edited as a past execution gets displayed. To make changed either open the original workflow of which the execution gets displayed or save it under a new name first.`,
type: 'error',
duration: 0,
});
return false;
}
return true;
},
startLoading (text?: string) {
if (this.loadingService !== null) {
return;
}
this.loadingService = this.$loading(
{
lock: true,
text: text || 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(255, 255, 255, 0.8)',
},
);
},
setLoadingText (text: string) {
this.loadingService.text = text;
},
stopLoading () {
if (this.loadingService !== null) {
this.loadingService.close();
this.loadingService = null;
}
},
async callDebounced (...inputParameters: any[]): Promise<void> { // tslint:disable-line:no-any
const functionName = inputParameters.shift() as string;
const debounceTime = inputParameters.shift() as number;
// @ts-ignore
if (this.debouncedFunctions[functionName] === undefined) {
// @ts-ignore
this.debouncedFunctions[functionName] = debounce(this[functionName], debounceTime, { leading: true });
}
// @ts-ignore
await this.debouncedFunctions[functionName].apply(this, inputParameters);
},
async confirmMessage (message: string, headline: string, type = 'warning' as MessageType, confirmButtonText = 'OK', cancelButtonText = 'Cancel'): Promise<boolean> {
try {
await this.$confirm(message, headline, {
confirmButtonText,
cancelButtonText,
type,
dangerouslyUseHTMLString: true,
});
return true;
} catch (e) {
return false;
}
},
},
});