refactor(editor): Overhaul workflow level executions list (#5089)

* fix(editor): update texts and styles

* fix(editor): update texts and styles

* fix(editor): move 'No execution found' to sidebar

* fix(editor): change empty state title in executions

* fix(editor): workflow execution list delete item

* fix(editor): workflow execution always show sidebar

* fix(editor): workflow execution unify date display mode

* fix(editor): workflow execution empty list
This commit is contained in:
Csaba Tuncsik
2023-01-11 15:08:00 +01:00
committed by GitHub
parent 62d06b1e6e
commit 3c109ffab1
10 changed files with 641 additions and 637 deletions

View File

@@ -1,6 +1,6 @@
import { IExecutionsSummary } from '@/Interface';
import { useWorkflowsStore } from '@/stores/workflows';
import dateFormat from 'dateformat';
import { i18n as locale } from '@/plugins/i18n';
import { mapStores } from 'pinia';
import mixins from 'vue-typed-mixins';
import { genericHelpers } from './genericHelpers';
@@ -35,7 +35,7 @@ export const executionHelpers = mixins(genericHelpers).extend({
getExecutionUIDetails(execution: IExecutionsSummary): IExecutionUIData {
const status = {
name: 'unknown',
startTime: this.formatDate(new Date(execution.startedAt)),
startTime: this.formatDate(execution.startedAt),
label: 'Status unknown',
runningTime: '',
};
@@ -72,11 +72,9 @@ export const executionHelpers = mixins(genericHelpers).extend({
return status;
},
formatDate(date: Date) {
if (date.getFullYear() === new Date().getFullYear()) {
return dateFormat(date.getTime(), 'HH:MM:ss "on" d mmm');
}
return dateFormat(date.getTime(), 'HH:MM:ss "on" d mmm yyyy');
formatDate(fullDate: Date | string | number) {
const { date, time } = this.convertToDisplayDate(fullDate);
return locale.baseText('executionsList.started', { interpolate: { time, date } });
},
},
});

View File

@@ -36,8 +36,11 @@ export const genericHelpers = mixins(showMessage).extend({
return `${minutesPassed}:${secondsLeft}${this.$locale.baseText('genericHelpers.minShort')}`;
},
convertToDisplayDate(epochTime: number): { date: string; time: string } {
const formattedDate = dateformat(epochTime, 'd mmm, yyyy#HH:MM:ss');
convertToDisplayDate(fullDate: Date | string | number): { date: string; time: string } {
const mask = `d mmm${
new Date(fullDate).getFullYear() === new Date().getFullYear() ? '' : ', yyyy'
}#HH:MM:ss`;
const formattedDate = dateformat(fullDate, mask);
const [date, time] = formattedDate.split('#');
return { date, time };
},