@jumoo/processing 17.4.2 → 17.4.3-prerelease.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/pipeline/components/background.element.js +23 -23
- package/dist/pipeline/components/pipeline-list.element.js +28 -28
- package/dist/pipeline/components/pipeline-table.element.js +23 -23
- package/dist/pipeline/components/process-error.element.js +39 -39
- package/dist/pipeline/components/progress.element.js +122 -122
- package/dist/pipeline/components/progress.step.element.js +5 -5
- package/dist/pipeline/modal/errors/error-modal.element.js +87 -87
- package/dist/pipeline/modal/pipeline-modal.element.js +34 -34
- package/dist/pipeline/pipeline.element.js +26 -26
- package/dist/pipeline/workspace/views/default-pipeline-view.js +18 -18
- package/dist/queue/components/queue-list.element.js +17 -17
- package/dist/queue/components/queue-table.element.js +15 -15
- package/package.json +58 -51
|
@@ -19,35 +19,35 @@ let JumooPipelineBackgroundElement = class JumooPipelineBackgroundElement extend
|
|
|
19
19
|
}
|
|
20
20
|
}
|
|
21
21
|
renderBackgroundBanner() {
|
|
22
|
-
return html `<uui-box class="banner">
|
|
23
|
-
<umb-localize key="jumooProcBackground_running"></umb-localize>
|
|
22
|
+
return html `<uui-box class="banner">
|
|
23
|
+
<umb-localize key="jumooProcBackground_running"></umb-localize>
|
|
24
24
|
</uui-box>`;
|
|
25
25
|
}
|
|
26
26
|
renderProgress() {
|
|
27
|
-
return html `<jumoo-pipeline-progress
|
|
28
|
-
.progress=${this.state?.progress}
|
|
27
|
+
return html `<jumoo-pipeline-progress
|
|
28
|
+
.progress=${this.state?.progress}
|
|
29
29
|
.message=${this.message}></jumoo-pipeline-progress>`;
|
|
30
30
|
}
|
|
31
31
|
renderComplete() {
|
|
32
32
|
return !this.background?.completedElement
|
|
33
|
-
? html `<uui-box
|
|
34
|
-
><umb-localize key="jumooProcBackground_completed"></umb-localize
|
|
35
|
-
></uui-box>
|
|
33
|
+
? html `<uui-box
|
|
34
|
+
><umb-localize key="jumooProcBackground_completed"></umb-localize
|
|
35
|
+
></uui-box>
|
|
36
36
|
<pre>${JSON.stringify(this.state, null, 1)}</pre>`
|
|
37
37
|
: html `${this.renderElement(this.background.completedElement)}`;
|
|
38
38
|
}
|
|
39
39
|
renderError() {
|
|
40
40
|
return !this.background?.failedElement
|
|
41
|
-
? html `<uui-box
|
|
42
|
-
><umb-localize key="jumooProcBackground_error"></umb-localize
|
|
43
|
-
></uui-box>
|
|
41
|
+
? html `<uui-box
|
|
42
|
+
><umb-localize key="jumooProcBackground_error"></umb-localize
|
|
43
|
+
></uui-box>
|
|
44
44
|
<pre>${JSON.stringify(this.state, null, 1)}</pre>`
|
|
45
45
|
: html `${this.renderElement(this.background.failedElement)}`;
|
|
46
46
|
}
|
|
47
47
|
renderElement(element) {
|
|
48
|
-
return html `<umb-extension-slot
|
|
49
|
-
type="jumoo-process-step"
|
|
50
|
-
.filter=${(ext) => ext.elementName === element}
|
|
48
|
+
return html `<umb-extension-slot
|
|
49
|
+
type="jumoo-process-step"
|
|
50
|
+
.filter=${(ext) => ext.elementName === element}
|
|
51
51
|
.props=${{
|
|
52
52
|
pipelineId: this.pipelineId,
|
|
53
53
|
state: this.state,
|
|
@@ -55,16 +55,16 @@ let JumooPipelineBackgroundElement = class JumooPipelineBackgroundElement extend
|
|
|
55
55
|
}}></umb-extension-slot>`;
|
|
56
56
|
}
|
|
57
57
|
};
|
|
58
|
-
JumooPipelineBackgroundElement.styles = css `
|
|
59
|
-
:host {
|
|
60
|
-
display: flex;
|
|
61
|
-
flex-direction: column;
|
|
62
|
-
height: 100%;
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
.banner {
|
|
66
|
-
background-color: var(--uui-color-current);
|
|
67
|
-
}
|
|
58
|
+
JumooPipelineBackgroundElement.styles = css `
|
|
59
|
+
:host {
|
|
60
|
+
display: flex;
|
|
61
|
+
flex-direction: column;
|
|
62
|
+
height: 100%;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.banner {
|
|
66
|
+
background-color: var(--uui-color-current);
|
|
67
|
+
}
|
|
68
68
|
`;
|
|
69
69
|
__decorate([
|
|
70
70
|
property({ type: String })
|
|
@@ -90,18 +90,18 @@ let JumooProcessingPipelineList = class JumooProcessingPipelineList extends UmbL
|
|
|
90
90
|
await this.getPipelines();
|
|
91
91
|
}
|
|
92
92
|
render() {
|
|
93
|
-
return html `<uui-box style="--uui-box-default-padding: 0;" .headline=${this.headline}>
|
|
94
|
-
<div slot="header-actions">
|
|
95
|
-
Status: ${this.renderDropdown()} ${this.renderRefresh()}
|
|
96
|
-
</div>
|
|
97
|
-
${when(this.loading, () => html `<uui-loader-bar
|
|
98
|
-
animationDuration="1.5"
|
|
99
|
-
style="color: black"></uui-loader-bar>`, () => this.renderListPipelines())}
|
|
93
|
+
return html `<uui-box style="--uui-box-default-padding: 0;" .headline=${this.headline}>
|
|
94
|
+
<div slot="header-actions">
|
|
95
|
+
Status: ${this.renderDropdown()} ${this.renderRefresh()}
|
|
96
|
+
</div>
|
|
97
|
+
${when(this.loading, () => html `<uui-loader-bar
|
|
98
|
+
animationDuration="1.5"
|
|
99
|
+
style="color: black"></uui-loader-bar>`, () => this.renderListPipelines())}
|
|
100
100
|
</uui-box>`;
|
|
101
101
|
}
|
|
102
102
|
renderRefresh() {
|
|
103
|
-
return html `<uui-button @click=${this.getPipelines} label="refresh" compact
|
|
104
|
-
><uui-icon name="icon-refresh"></uui-icon
|
|
103
|
+
return html `<uui-button @click=${this.getPipelines} label="refresh" compact
|
|
104
|
+
><uui-icon name="icon-refresh"></uui-icon
|
|
105
105
|
></uui-button>`;
|
|
106
106
|
}
|
|
107
107
|
renderDropdown() {
|
|
@@ -114,38 +114,38 @@ let JumooProcessingPipelineList = class JumooProcessingPipelineList extends UmbL
|
|
|
114
114
|
});
|
|
115
115
|
return options.length <= 1
|
|
116
116
|
? html `${this.status}`
|
|
117
|
-
: html `
|
|
118
|
-
<uui-select
|
|
119
|
-
.options=${options}
|
|
120
|
-
@change=${this.onStatusChange}
|
|
121
|
-
label="status"></uui-select>
|
|
117
|
+
: html `
|
|
118
|
+
<uui-select
|
|
119
|
+
.options=${options}
|
|
120
|
+
@change=${this.onStatusChange}
|
|
121
|
+
label="status"></uui-select>
|
|
122
122
|
`;
|
|
123
123
|
}
|
|
124
124
|
renderListPipelines() {
|
|
125
125
|
return !this.pipelines || this.pipelines.length === 0
|
|
126
126
|
? html `<div class="emtpy">Nothing with status ${this.status}</div>`
|
|
127
|
-
: html `<jumoo-pipelines-table
|
|
128
|
-
.pipelines=${this.pipelines}
|
|
129
|
-
.hideDelete=${this.hideDelete}
|
|
130
|
-
@view-pipeline=${this.onViewPipeline}
|
|
127
|
+
: html `<jumoo-pipelines-table
|
|
128
|
+
.pipelines=${this.pipelines}
|
|
129
|
+
.hideDelete=${this.hideDelete}
|
|
130
|
+
@view-pipeline=${this.onViewPipeline}
|
|
131
131
|
@delete-pipeline=${this.onDeletePipeline}></jumoo-pipelines-table>`;
|
|
132
132
|
}
|
|
133
133
|
renderPipeline(pipeline) {
|
|
134
|
-
return html `
|
|
135
|
-
<div>${pipeline.alias}</div>
|
|
136
|
-
<div>${pipeline.state.status}</div>
|
|
137
|
-
<div>${pipeline.state.currentRequest?.action?.alias}</div>
|
|
134
|
+
return html `
|
|
135
|
+
<div>${pipeline.alias}</div>
|
|
136
|
+
<div>${pipeline.state.status}</div>
|
|
137
|
+
<div>${pipeline.state.currentRequest?.action?.alias}</div>
|
|
138
138
|
`;
|
|
139
139
|
}
|
|
140
140
|
};
|
|
141
141
|
_JumooProcessingPipelineList_pipelinesContext = new WeakMap();
|
|
142
142
|
_JumooProcessingPipelineList_modalController = new WeakMap();
|
|
143
|
-
JumooProcessingPipelineList.styles = css `
|
|
144
|
-
.emtpy {
|
|
145
|
-
display: flex;
|
|
146
|
-
justify-content: center;
|
|
147
|
-
padding: var(--uui-size-space-5);
|
|
148
|
-
}
|
|
143
|
+
JumooProcessingPipelineList.styles = css `
|
|
144
|
+
.emtpy {
|
|
145
|
+
display: flex;
|
|
146
|
+
justify-content: center;
|
|
147
|
+
padding: var(--uui-size-space-5);
|
|
148
|
+
}
|
|
149
149
|
`;
|
|
150
150
|
__decorate([
|
|
151
151
|
property({ type: String })
|
|
@@ -60,7 +60,7 @@ let JumooPipelinesTableElement = class JumooPipelinesTableElement extends UmbLit
|
|
|
60
60
|
},
|
|
61
61
|
{
|
|
62
62
|
columnAlias: 'background',
|
|
63
|
-
value: html `<umb-icon
|
|
63
|
+
value: html `<umb-icon
|
|
64
64
|
.name=${when((pipeline.state.backgroundState?.isBackgroundRequest ?? false) == true, () => 'icon-check', () => 'icon-close')}></umb-icon>`,
|
|
65
65
|
},
|
|
66
66
|
{
|
|
@@ -77,33 +77,33 @@ let JumooPipelinesTableElement = class JumooPipelinesTableElement extends UmbLit
|
|
|
77
77
|
};
|
|
78
78
|
})
|
|
79
79
|
.filter((item) => item !== undefined);
|
|
80
|
-
return html `
|
|
81
|
-
<umb-table
|
|
82
|
-
.config=${this._tableConfig}
|
|
83
|
-
.columns=${this.tableColumns}
|
|
84
|
-
.items=${items}
|
|
85
|
-
.filter=${this.filter}></umb-table>
|
|
80
|
+
return html `
|
|
81
|
+
<umb-table
|
|
82
|
+
.config=${this._tableConfig}
|
|
83
|
+
.columns=${this.tableColumns}
|
|
84
|
+
.items=${items}
|
|
85
|
+
.filter=${this.filter}></umb-table>
|
|
86
86
|
`;
|
|
87
87
|
}
|
|
88
88
|
renderActions(pipeline) {
|
|
89
|
-
return html `<uui-button-group
|
|
90
|
-
><uui-button
|
|
91
|
-
.id=${pipeline.id}
|
|
92
|
-
label="View"
|
|
93
|
-
color="positive"
|
|
94
|
-
look="outline"
|
|
95
|
-
@click=${__classPrivateFieldGet(this, _JumooPipelinesTableElement_instances, "m", _JumooPipelinesTableElement_onViewPipeline)}
|
|
96
|
-
>View</uui-button
|
|
97
|
-
>
|
|
89
|
+
return html `<uui-button-group
|
|
90
|
+
><uui-button
|
|
91
|
+
.id=${pipeline.id}
|
|
92
|
+
label="View"
|
|
93
|
+
color="positive"
|
|
94
|
+
look="outline"
|
|
95
|
+
@click=${__classPrivateFieldGet(this, _JumooPipelinesTableElement_instances, "m", _JumooPipelinesTableElement_onViewPipeline)}
|
|
96
|
+
>View</uui-button
|
|
97
|
+
>
|
|
98
98
|
${this.hideDelete
|
|
99
99
|
? ''
|
|
100
|
-
: html `<uui-button
|
|
101
|
-
label="Delete"
|
|
102
|
-
color="danger"
|
|
103
|
-
look="outline"
|
|
104
|
-
@click=${() => __classPrivateFieldGet(this, _JumooPipelinesTableElement_instances, "m", _JumooPipelinesTableElement_onDeletePipeline).call(this, pipeline.id)}
|
|
105
|
-
>Delete</uui-button
|
|
106
|
-
>`}</uui-button-group
|
|
100
|
+
: html `<uui-button
|
|
101
|
+
label="Delete"
|
|
102
|
+
color="danger"
|
|
103
|
+
look="outline"
|
|
104
|
+
@click=${() => __classPrivateFieldGet(this, _JumooPipelinesTableElement_instances, "m", _JumooPipelinesTableElement_onDeletePipeline).call(this, pipeline.id)}
|
|
105
|
+
>Delete</uui-button
|
|
106
|
+
>`}</uui-button-group
|
|
107
107
|
>`;
|
|
108
108
|
}
|
|
109
109
|
};
|
|
@@ -23,16 +23,16 @@ let JumooProcessingErrorElement = class JumooProcessingErrorElement extends UmbL
|
|
|
23
23
|
return !this.error ? nothing : this.renderError(this.error);
|
|
24
24
|
}
|
|
25
25
|
renderError(error) {
|
|
26
|
-
return html `<div class="error">
|
|
27
|
-
<div class="header">
|
|
28
|
-
<uui-icon name="icon-wrong"></uui-icon>
|
|
29
|
-
<h3>${error.message}</h3>
|
|
30
|
-
</div>
|
|
31
|
-
<div class="more">
|
|
32
|
-
<uui-button @click=${__classPrivateFieldGet(this, _JumooProcessingErrorElement_instances, "m", _JumooProcessingErrorElement_openErrorModal)} look="primary" color="danger"
|
|
33
|
-
><umb-localize key="jumooProcError_details"></umb-localize
|
|
34
|
-
></uui-button>
|
|
35
|
-
</div>
|
|
26
|
+
return html `<div class="error">
|
|
27
|
+
<div class="header">
|
|
28
|
+
<uui-icon name="icon-wrong"></uui-icon>
|
|
29
|
+
<h3>${error.message}</h3>
|
|
30
|
+
</div>
|
|
31
|
+
<div class="more">
|
|
32
|
+
<uui-button @click=${__classPrivateFieldGet(this, _JumooProcessingErrorElement_instances, "m", _JumooProcessingErrorElement_openErrorModal)} look="primary" color="danger"
|
|
33
|
+
><umb-localize key="jumooProcError_details"></umb-localize
|
|
34
|
+
></uui-button>
|
|
35
|
+
</div>
|
|
36
36
|
</div>`;
|
|
37
37
|
}
|
|
38
38
|
};
|
|
@@ -53,35 +53,35 @@ _JumooProcessingErrorElement_openErrorModal = async function _JumooProcessingErr
|
|
|
53
53
|
});
|
|
54
54
|
return result;
|
|
55
55
|
};
|
|
56
|
-
JumooProcessingErrorElement.styles = css `
|
|
57
|
-
.error {
|
|
58
|
-
padding: 0;
|
|
59
|
-
background-color: var(--uui-color-danger);
|
|
60
|
-
color: var(--uui-color-default-contrast);
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
.error .header {
|
|
64
|
-
display: flex;
|
|
65
|
-
gap: var(--uui-size-space-2);
|
|
66
|
-
align-items: center;
|
|
67
|
-
padding: var(--uui-size-space-2);
|
|
68
|
-
border-bottom: 1px solid var(--uui-color-default-contrast);
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
h3 {
|
|
72
|
-
padding: 0;
|
|
73
|
-
margin: 0;
|
|
74
|
-
overflow: auto;
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
uui-icon {
|
|
78
|
-
font-size: var(--uui-type-h3-size);
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
.error .more {
|
|
82
|
-
padding: var(--uui-size-space-3);
|
|
83
|
-
text-align: right;
|
|
84
|
-
}
|
|
56
|
+
JumooProcessingErrorElement.styles = css `
|
|
57
|
+
.error {
|
|
58
|
+
padding: 0;
|
|
59
|
+
background-color: var(--uui-color-danger);
|
|
60
|
+
color: var(--uui-color-default-contrast);
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.error .header {
|
|
64
|
+
display: flex;
|
|
65
|
+
gap: var(--uui-size-space-2);
|
|
66
|
+
align-items: center;
|
|
67
|
+
padding: var(--uui-size-space-2);
|
|
68
|
+
border-bottom: 1px solid var(--uui-color-default-contrast);
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
h3 {
|
|
72
|
+
padding: 0;
|
|
73
|
+
margin: 0;
|
|
74
|
+
overflow: auto;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
uui-icon {
|
|
78
|
+
font-size: var(--uui-type-h3-size);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.error .more {
|
|
82
|
+
padding: var(--uui-size-space-3);
|
|
83
|
+
text-align: right;
|
|
84
|
+
}
|
|
85
85
|
`;
|
|
86
86
|
__decorate([
|
|
87
87
|
property({ type: Object })
|
|
@@ -23,16 +23,16 @@ let JumooPipelineProgressElement = class JumooPipelineProgressElement extends Um
|
|
|
23
23
|
? 'running'
|
|
24
24
|
: 'pending';
|
|
25
25
|
const icon = step.icon ?? 'icon-checkmark';
|
|
26
|
-
return html `
|
|
27
|
-
<div class="step ${className}">
|
|
28
|
-
<uui-icon .name=${icon}></uui-icon>
|
|
29
|
-
<div class="step-name">${step.name}</div>
|
|
30
|
-
</div>
|
|
26
|
+
return html `
|
|
27
|
+
<div class="step ${className}">
|
|
28
|
+
<uui-icon .name=${icon}></uui-icon>
|
|
29
|
+
<div class="step-name">${step.name}</div>
|
|
30
|
+
</div>
|
|
31
31
|
`;
|
|
32
32
|
});
|
|
33
|
-
return html `<div class="step-progress">
|
|
34
|
-
<div class="steps">${steps}</div>
|
|
35
|
-
${this.renderMessages()}
|
|
33
|
+
return html `<div class="step-progress">
|
|
34
|
+
<div class="steps">${steps}</div>
|
|
35
|
+
${this.renderMessages()}
|
|
36
36
|
</div>`;
|
|
37
37
|
}
|
|
38
38
|
getLastKnownProgress() {
|
|
@@ -43,123 +43,123 @@ let JumooPipelineProgressElement = class JumooPipelineProgressElement extends Um
|
|
|
43
43
|
renderMessages() {
|
|
44
44
|
this._lastKnownProgress = this.getLastKnownProgress();
|
|
45
45
|
console.debug('Current progress:', this._lastKnownProgress, this.message?.progress);
|
|
46
|
-
return html `<div class="message">
|
|
47
|
-
<div class="content">
|
|
48
|
-
<div>
|
|
49
|
-
<h3>${this.message?.title}</h3>
|
|
50
|
-
</div>
|
|
51
|
-
<div>
|
|
52
|
-
<small>${this.message?.message}</small>
|
|
53
|
-
</div>
|
|
54
|
-
</div>
|
|
55
|
-
<div class="progress">
|
|
56
|
-
<uui-progress-bar .progress=${this._lastKnownProgress}></uui-progress-bar>
|
|
57
|
-
${when(this.showPercentage, () => html `<div>${this._lastKnownProgress.toFixed(2)}%</div>`)}
|
|
58
|
-
</div>
|
|
46
|
+
return html `<div class="message">
|
|
47
|
+
<div class="content">
|
|
48
|
+
<div>
|
|
49
|
+
<h3>${this.message?.title}</h3>
|
|
50
|
+
</div>
|
|
51
|
+
<div>
|
|
52
|
+
<small>${this.message?.message}</small>
|
|
53
|
+
</div>
|
|
54
|
+
</div>
|
|
55
|
+
<div class="progress">
|
|
56
|
+
<uui-progress-bar .progress=${this._lastKnownProgress}></uui-progress-bar>
|
|
57
|
+
${when(this.showPercentage, () => html `<div>${this._lastKnownProgress.toFixed(2)}%</div>`)}
|
|
58
|
+
</div>
|
|
59
59
|
</div>`;
|
|
60
60
|
}
|
|
61
61
|
};
|
|
62
|
-
JumooPipelineProgressElement.styles = css `
|
|
63
|
-
:host {
|
|
64
|
-
display: flex;
|
|
65
|
-
justify-content: center;
|
|
66
|
-
align-items: center;
|
|
67
|
-
flex-direction: column;
|
|
68
|
-
height: 100%;
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
.message {
|
|
72
|
-
display: grid;
|
|
73
|
-
grid-template-rows: 1fr 1fr;
|
|
74
|
-
align-items: center;
|
|
75
|
-
height: 8rem;
|
|
76
|
-
width: 100%;
|
|
77
|
-
margin: var(--uui-size-space-3) 0;
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
.content {
|
|
81
|
-
display: flex;
|
|
82
|
-
flex-direction: column;
|
|
83
|
-
align-items: center;
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
.content h3 {
|
|
87
|
-
margin: 0;
|
|
88
|
-
padding-bottom: var(--uui-size-space-2);
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
.progress {
|
|
92
|
-
width: 100%;
|
|
93
|
-
display: flex;
|
|
94
|
-
flex-direction: column;
|
|
95
|
-
align-items: center;
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
.percentage {
|
|
99
|
-
font-size: small;
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
uui-progress-bar {
|
|
103
|
-
height: var(--uui-size-space-4);
|
|
104
|
-
margin: 0;
|
|
105
|
-
padding: 0;
|
|
106
|
-
border-radius: var(--uui-border-radius);
|
|
107
|
-
background-color: var(--uui-color-border);
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
.step-progress {
|
|
111
|
-
width: 100%;
|
|
112
|
-
display: flex;
|
|
113
|
-
flex-direction: column;
|
|
114
|
-
align-items: center;
|
|
115
|
-
}
|
|
116
|
-
|
|
117
|
-
.steps {
|
|
118
|
-
display: flex;
|
|
119
|
-
flex-direction: row;
|
|
120
|
-
flex-flow: row wrap;
|
|
121
|
-
justify-content: center;
|
|
122
|
-
width: 100%;
|
|
123
|
-
margin-bottom: var(--uui-size-space-3);
|
|
124
|
-
gap: var(--uui-size-space-2);
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
.step {
|
|
128
|
-
display: flex;
|
|
129
|
-
flex-grow: 1;
|
|
130
|
-
margin: 0 var(--uui-size-space-5);
|
|
131
|
-
padding: var(--uui-size-space-2);
|
|
132
|
-
max-width: var(--uui-size-layout-5);
|
|
133
|
-
flex-direction: column;
|
|
134
|
-
align-items: center;
|
|
135
|
-
align-content: center;
|
|
136
|
-
transition: background-color 0.3s ease;
|
|
137
|
-
}
|
|
138
|
-
|
|
139
|
-
.step uui-icon {
|
|
140
|
-
font-size: 30pt;
|
|
141
|
-
margin: var(--uui-size-space-2) 0;
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
.step-name {
|
|
145
|
-
text-align: center;
|
|
146
|
-
font-weight: 900;
|
|
147
|
-
}
|
|
148
|
-
|
|
149
|
-
.step.complete uui-icon {
|
|
150
|
-
color: green;
|
|
151
|
-
}
|
|
152
|
-
.step.running uui-icon {
|
|
153
|
-
color: blue;
|
|
154
|
-
}
|
|
155
|
-
.step.pending uui-icon {
|
|
156
|
-
color: gray;
|
|
157
|
-
}
|
|
158
|
-
|
|
159
|
-
.step.running {
|
|
160
|
-
border-radius: var(--uui-size-4);
|
|
161
|
-
background-color: var(--uui-color-disabled-standalone);
|
|
162
|
-
}
|
|
62
|
+
JumooPipelineProgressElement.styles = css `
|
|
63
|
+
:host {
|
|
64
|
+
display: flex;
|
|
65
|
+
justify-content: center;
|
|
66
|
+
align-items: center;
|
|
67
|
+
flex-direction: column;
|
|
68
|
+
height: 100%;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.message {
|
|
72
|
+
display: grid;
|
|
73
|
+
grid-template-rows: 1fr 1fr;
|
|
74
|
+
align-items: center;
|
|
75
|
+
height: 8rem;
|
|
76
|
+
width: 100%;
|
|
77
|
+
margin: var(--uui-size-space-3) 0;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.content {
|
|
81
|
+
display: flex;
|
|
82
|
+
flex-direction: column;
|
|
83
|
+
align-items: center;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.content h3 {
|
|
87
|
+
margin: 0;
|
|
88
|
+
padding-bottom: var(--uui-size-space-2);
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
.progress {
|
|
92
|
+
width: 100%;
|
|
93
|
+
display: flex;
|
|
94
|
+
flex-direction: column;
|
|
95
|
+
align-items: center;
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
.percentage {
|
|
99
|
+
font-size: small;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
uui-progress-bar {
|
|
103
|
+
height: var(--uui-size-space-4);
|
|
104
|
+
margin: 0;
|
|
105
|
+
padding: 0;
|
|
106
|
+
border-radius: var(--uui-border-radius);
|
|
107
|
+
background-color: var(--uui-color-border);
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.step-progress {
|
|
111
|
+
width: 100%;
|
|
112
|
+
display: flex;
|
|
113
|
+
flex-direction: column;
|
|
114
|
+
align-items: center;
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.steps {
|
|
118
|
+
display: flex;
|
|
119
|
+
flex-direction: row;
|
|
120
|
+
flex-flow: row wrap;
|
|
121
|
+
justify-content: center;
|
|
122
|
+
width: 100%;
|
|
123
|
+
margin-bottom: var(--uui-size-space-3);
|
|
124
|
+
gap: var(--uui-size-space-2);
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
.step {
|
|
128
|
+
display: flex;
|
|
129
|
+
flex-grow: 1;
|
|
130
|
+
margin: 0 var(--uui-size-space-5);
|
|
131
|
+
padding: var(--uui-size-space-2);
|
|
132
|
+
max-width: var(--uui-size-layout-5);
|
|
133
|
+
flex-direction: column;
|
|
134
|
+
align-items: center;
|
|
135
|
+
align-content: center;
|
|
136
|
+
transition: background-color 0.3s ease;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
.step uui-icon {
|
|
140
|
+
font-size: 30pt;
|
|
141
|
+
margin: var(--uui-size-space-2) 0;
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
.step-name {
|
|
145
|
+
text-align: center;
|
|
146
|
+
font-weight: 900;
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
.step.complete uui-icon {
|
|
150
|
+
color: green;
|
|
151
|
+
}
|
|
152
|
+
.step.running uui-icon {
|
|
153
|
+
color: blue;
|
|
154
|
+
}
|
|
155
|
+
.step.pending uui-icon {
|
|
156
|
+
color: gray;
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
.step.running {
|
|
160
|
+
border-radius: var(--uui-size-4);
|
|
161
|
+
background-color: var(--uui-color-disabled-standalone);
|
|
162
|
+
}
|
|
163
163
|
`;
|
|
164
164
|
__decorate([
|
|
165
165
|
property({ type: Object })
|
|
@@ -16,16 +16,16 @@ let JumooProcessStepElement = class JumooProcessStepElement extends UmbElementMi
|
|
|
16
16
|
: this.renderStepElement();
|
|
17
17
|
}
|
|
18
18
|
renderStepElement() {
|
|
19
|
-
return html `
|
|
20
|
-
<umb-extension-slot
|
|
21
|
-
type="jumoo-process-step"
|
|
22
|
-
.filter=${(ext) => ext.elementName === this.state?.elementName}
|
|
19
|
+
return html `
|
|
20
|
+
<umb-extension-slot
|
|
21
|
+
type="jumoo-process-step"
|
|
22
|
+
.filter=${(ext) => ext.elementName === this.state?.elementName}
|
|
23
23
|
.props=${{
|
|
24
24
|
pipelineId: this.pipelineId,
|
|
25
25
|
state: this.state,
|
|
26
26
|
options: this.options,
|
|
27
27
|
resutls: this.resutls,
|
|
28
|
-
}}></umb-extension-slot>
|
|
28
|
+
}}></umb-extension-slot>
|
|
29
29
|
`;
|
|
30
30
|
}
|
|
31
31
|
};
|
|
@@ -20,65 +20,65 @@ let JumooProcessingErrorModal = class JumooProcessingErrorModal extends UmbModal
|
|
|
20
20
|
}
|
|
21
21
|
render() {
|
|
22
22
|
const headline = __classPrivateFieldGet(this, _JumooProcessingErrorModal_instances, "m", _JumooProcessingErrorModal_truncate).call(this, 'Error: ' + this.data?.error.message, 75);
|
|
23
|
-
return html `<umb-body-layout .headline=${headline}>
|
|
24
|
-
<uui-box .headline=${this.localize.term('jumooProcError_headline')}>
|
|
25
|
-
<h2>${this.data?.error.message}</h2>
|
|
26
|
-
<div class="more-box">
|
|
27
|
-
<div class="more">
|
|
28
|
-
<div class="label">
|
|
29
|
-
<umb-localize key="jumooProcError_source"></umb-localize>
|
|
30
|
-
</div>
|
|
31
|
-
<div class="detail">
|
|
32
|
-
${this.data?.error.strategy} / ${this.data?.error.source}
|
|
33
|
-
</div>
|
|
34
|
-
</div>
|
|
35
|
-
<div class="more">
|
|
36
|
-
<div class="label">
|
|
37
|
-
<umb-localize key="jumooProcError_action"></umb-localize>
|
|
38
|
-
</div>
|
|
39
|
-
<div class="detail">${this.data?.error.action}</div>
|
|
40
|
-
</div>
|
|
41
|
-
<div class="more">
|
|
42
|
-
<div class="label"></div>
|
|
43
|
-
<div class="detail">
|
|
44
|
-
${this.data?.error.step}
|
|
45
|
-
${when(this.data?.error.subStep, () => html `(${this.data?.error.subStep})`)}
|
|
46
|
-
</div>
|
|
47
|
-
</div>
|
|
48
|
-
<div class="more">
|
|
49
|
-
<div class="label">
|
|
50
|
-
<umb-localize key="jumooProcError_page"></umb-localize>
|
|
51
|
-
</div>
|
|
52
|
-
<div class="detail">${this.data?.error.page}</div>
|
|
53
|
-
</div>
|
|
54
|
-
<div class="more">
|
|
55
|
-
<div class="label">
|
|
56
|
-
<umb-localize key="jumooProcError_class"></umb-localize>
|
|
57
|
-
</div>
|
|
58
|
-
<div class="detail">${this.data?.error.className}</div>
|
|
59
|
-
</div>
|
|
60
|
-
<div class="more">
|
|
61
|
-
<div class="label">
|
|
62
|
-
<umb-localize key="jumooProcError_method"></umb-localize>
|
|
63
|
-
</div>
|
|
64
|
-
<div class="detail">${this.data?.error.methodName}</div>
|
|
65
|
-
</div>
|
|
66
|
-
<div class="more">
|
|
67
|
-
<div class="label">
|
|
68
|
-
<umb-localize key="jumooProcError_stack"></umb-localize>
|
|
69
|
-
</div>
|
|
70
|
-
<div class="detail fixed">${this.data?.error.stackTrace}</div>
|
|
71
|
-
</div>
|
|
72
|
-
</div>
|
|
73
|
-
</uui-box>
|
|
74
|
-
|
|
75
|
-
<div slot="actions">
|
|
76
|
-
<uui-button
|
|
77
|
-
@click=${__classPrivateFieldGet(this, _JumooProcessingErrorModal_instances, "m", _JumooProcessingErrorModal_onClose)}
|
|
78
|
-
color="default"
|
|
79
|
-
look="default"
|
|
80
|
-
.label=${this.localize.term('general_close')}></uui-button>
|
|
81
|
-
</div>
|
|
23
|
+
return html `<umb-body-layout .headline=${headline}>
|
|
24
|
+
<uui-box .headline=${this.localize.term('jumooProcError_headline')}>
|
|
25
|
+
<h2>${this.data?.error.message}</h2>
|
|
26
|
+
<div class="more-box">
|
|
27
|
+
<div class="more">
|
|
28
|
+
<div class="label">
|
|
29
|
+
<umb-localize key="jumooProcError_source"></umb-localize>
|
|
30
|
+
</div>
|
|
31
|
+
<div class="detail">
|
|
32
|
+
${this.data?.error.strategy} / ${this.data?.error.source}
|
|
33
|
+
</div>
|
|
34
|
+
</div>
|
|
35
|
+
<div class="more">
|
|
36
|
+
<div class="label">
|
|
37
|
+
<umb-localize key="jumooProcError_action"></umb-localize>
|
|
38
|
+
</div>
|
|
39
|
+
<div class="detail">${this.data?.error.action}</div>
|
|
40
|
+
</div>
|
|
41
|
+
<div class="more">
|
|
42
|
+
<div class="label"></div>
|
|
43
|
+
<div class="detail">
|
|
44
|
+
${this.data?.error.step}
|
|
45
|
+
${when(this.data?.error.subStep, () => html `(${this.data?.error.subStep})`)}
|
|
46
|
+
</div>
|
|
47
|
+
</div>
|
|
48
|
+
<div class="more">
|
|
49
|
+
<div class="label">
|
|
50
|
+
<umb-localize key="jumooProcError_page"></umb-localize>
|
|
51
|
+
</div>
|
|
52
|
+
<div class="detail">${this.data?.error.page}</div>
|
|
53
|
+
</div>
|
|
54
|
+
<div class="more">
|
|
55
|
+
<div class="label">
|
|
56
|
+
<umb-localize key="jumooProcError_class"></umb-localize>
|
|
57
|
+
</div>
|
|
58
|
+
<div class="detail">${this.data?.error.className}</div>
|
|
59
|
+
</div>
|
|
60
|
+
<div class="more">
|
|
61
|
+
<div class="label">
|
|
62
|
+
<umb-localize key="jumooProcError_method"></umb-localize>
|
|
63
|
+
</div>
|
|
64
|
+
<div class="detail">${this.data?.error.methodName}</div>
|
|
65
|
+
</div>
|
|
66
|
+
<div class="more">
|
|
67
|
+
<div class="label">
|
|
68
|
+
<umb-localize key="jumooProcError_stack"></umb-localize>
|
|
69
|
+
</div>
|
|
70
|
+
<div class="detail fixed">${this.data?.error.stackTrace}</div>
|
|
71
|
+
</div>
|
|
72
|
+
</div>
|
|
73
|
+
</uui-box>
|
|
74
|
+
|
|
75
|
+
<div slot="actions">
|
|
76
|
+
<uui-button
|
|
77
|
+
@click=${__classPrivateFieldGet(this, _JumooProcessingErrorModal_instances, "m", _JumooProcessingErrorModal_onClose)}
|
|
78
|
+
color="default"
|
|
79
|
+
look="default"
|
|
80
|
+
.label=${this.localize.term('general_close')}></uui-button>
|
|
81
|
+
</div>
|
|
82
82
|
</umb-body-layout>`;
|
|
83
83
|
}
|
|
84
84
|
};
|
|
@@ -93,34 +93,34 @@ _JumooProcessingErrorModal_truncate = function _JumooProcessingErrorModal_trunca
|
|
|
93
93
|
const charsToShow = length - separatorLength;
|
|
94
94
|
return input.substring(0, charsToShow) + separator;
|
|
95
95
|
};
|
|
96
|
-
JumooProcessingErrorModal.styles = css `
|
|
97
|
-
.more {
|
|
98
|
-
display: flex;
|
|
99
|
-
gap: var(--uui-size-space-4);
|
|
100
|
-
margin-bottom: var(--uui-size-space-4);
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
h2 {
|
|
104
|
-
overflow: auto;
|
|
105
|
-
padding: var(--uui-size-space-2);
|
|
106
|
-
background-color: var(--uui-color-danger);
|
|
107
|
-
color: var(--uui-color-default-contrast);
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
.label {
|
|
111
|
-
font-weight: bold;
|
|
112
|
-
min-width: var(--uui-size-layout-5);
|
|
113
|
-
text-align: right;
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
.label::after {
|
|
117
|
-
content: ' :';
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
.more .fixed {
|
|
121
|
-
overflow: overlay;
|
|
122
|
-
font-family: monospace;
|
|
123
|
-
}
|
|
96
|
+
JumooProcessingErrorModal.styles = css `
|
|
97
|
+
.more {
|
|
98
|
+
display: flex;
|
|
99
|
+
gap: var(--uui-size-space-4);
|
|
100
|
+
margin-bottom: var(--uui-size-space-4);
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
h2 {
|
|
104
|
+
overflow: auto;
|
|
105
|
+
padding: var(--uui-size-space-2);
|
|
106
|
+
background-color: var(--uui-color-danger);
|
|
107
|
+
color: var(--uui-color-default-contrast);
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.label {
|
|
111
|
+
font-weight: bold;
|
|
112
|
+
min-width: var(--uui-size-layout-5);
|
|
113
|
+
text-align: right;
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
.label::after {
|
|
117
|
+
content: ' :';
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
.more .fixed {
|
|
121
|
+
overflow: overlay;
|
|
122
|
+
font-family: monospace;
|
|
123
|
+
}
|
|
124
124
|
`;
|
|
125
125
|
JumooProcessingErrorModal = __decorate([
|
|
126
126
|
customElement(JUMOO_PROCESSING_ERROR_MODAL_ALIAS)
|
|
@@ -38,41 +38,41 @@ let uSyncProcessingModal = class uSyncProcessingModal extends UmbModalBaseElemen
|
|
|
38
38
|
this.closeLabel = this.data?.closeLabel ?? 'Close';
|
|
39
39
|
}
|
|
40
40
|
render() {
|
|
41
|
-
return html ` ${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_getDialogStyles).call(this)}
|
|
42
|
-
<umb-body-layout id="jumoo-processing-modal">
|
|
43
|
-
<div slot="header" id="header">
|
|
44
|
-
<h3>${this.headline}</h3>
|
|
45
|
-
${this.data?.description}
|
|
46
|
-
</div>
|
|
47
|
-
${this.renderProcess()}
|
|
48
|
-
<div slot="actions">${this.renderActions()}</div>
|
|
41
|
+
return html ` ${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_getDialogStyles).call(this)}
|
|
42
|
+
<umb-body-layout id="jumoo-processing-modal">
|
|
43
|
+
<div slot="header" id="header">
|
|
44
|
+
<h3>${this.headline}</h3>
|
|
45
|
+
${this.data?.description}
|
|
46
|
+
</div>
|
|
47
|
+
${this.renderProcess()}
|
|
48
|
+
<div slot="actions">${this.renderActions()}</div>
|
|
49
49
|
</umb-body-layout>`;
|
|
50
50
|
}
|
|
51
51
|
renderProcess() {
|
|
52
52
|
if (!this.data)
|
|
53
53
|
return;
|
|
54
|
-
return html `<jumoo-pipeline
|
|
55
|
-
.processor=${this.data.processor}
|
|
56
|
-
.strategy=${this.data.strategy}
|
|
57
|
-
.setup=${this.data.options}
|
|
58
|
-
.debug=${this.data.debug ?? false}
|
|
59
|
-
@pipeline-status=${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_onStatusChange)}
|
|
60
|
-
@pipeline-valid=${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_onSetValid)}
|
|
61
|
-
@pipeline-complete=${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_onComplete)}
|
|
54
|
+
return html `<jumoo-pipeline
|
|
55
|
+
.processor=${this.data.processor}
|
|
56
|
+
.strategy=${this.data.strategy}
|
|
57
|
+
.setup=${this.data.options}
|
|
58
|
+
.debug=${this.data.debug ?? false}
|
|
59
|
+
@pipeline-status=${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_onStatusChange)}
|
|
60
|
+
@pipeline-valid=${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_onSetValid)}
|
|
61
|
+
@pipeline-complete=${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_onComplete)}
|
|
62
62
|
@pipeline-modal-update=${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_onUpdateModal)}></jumoo-pipeline>`;
|
|
63
63
|
}
|
|
64
64
|
renderActions() {
|
|
65
65
|
const actionButton = this._status === PipelineStatus.WAITING && this._isValid && !this._isLastAction
|
|
66
|
-
? html `<uui-button
|
|
67
|
-
@click=${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_onProcess)}
|
|
68
|
-
color="positive"
|
|
69
|
-
look="primary"
|
|
66
|
+
? html `<uui-button
|
|
67
|
+
@click=${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_onProcess)}
|
|
68
|
+
color="positive"
|
|
69
|
+
look="primary"
|
|
70
70
|
.label=${this.progressLabel}></uui-button>`
|
|
71
71
|
: nothing;
|
|
72
|
-
const closeButton = html `<uui-button
|
|
73
|
-
@click=${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_onClose)}
|
|
74
|
-
color="default"
|
|
75
|
-
look="default"
|
|
72
|
+
const closeButton = html `<uui-button
|
|
73
|
+
@click=${__classPrivateFieldGet(this, _uSyncProcessingModal_instances, "m", _uSyncProcessingModal_onClose)}
|
|
74
|
+
color="default"
|
|
75
|
+
look="default"
|
|
76
76
|
label=${this.closeLabel}></uui-button>`;
|
|
77
77
|
return html `${closeButton} ${actionButton}`;
|
|
78
78
|
}
|
|
@@ -110,18 +110,18 @@ _uSyncProcessingModal_onProcess = function _uSyncProcessingModal_onProcess() {
|
|
|
110
110
|
};
|
|
111
111
|
_uSyncProcessingModal_getDialogStyles = function _uSyncProcessingModal_getDialogStyles() {
|
|
112
112
|
const width = (this.data?.width ?? this.modalType === 'dialog') ? 600 : 0;
|
|
113
|
-
return html `<style>
|
|
114
|
-
#jumoo-processing-modal {
|
|
115
|
-
min-width: ${width > 0 ? width + 'px' : 'auto'};
|
|
116
|
-
min-height: ${this.data?.height ? this.data.height + 'px' : 'auto'};
|
|
117
|
-
}
|
|
113
|
+
return html `<style>
|
|
114
|
+
#jumoo-processing-modal {
|
|
115
|
+
min-width: ${width > 0 ? width + 'px' : 'auto'};
|
|
116
|
+
min-height: ${this.data?.height ? this.data.height + 'px' : 'auto'};
|
|
117
|
+
}
|
|
118
118
|
</style>`;
|
|
119
119
|
};
|
|
120
|
-
uSyncProcessingModal.styles = css `
|
|
121
|
-
#header h3 {
|
|
122
|
-
display: block;
|
|
123
|
-
margin: 0;
|
|
124
|
-
}
|
|
120
|
+
uSyncProcessingModal.styles = css `
|
|
121
|
+
#header h3 {
|
|
122
|
+
display: block;
|
|
123
|
+
margin: 0;
|
|
124
|
+
}
|
|
125
125
|
`;
|
|
126
126
|
__decorate([
|
|
127
127
|
state()
|
|
@@ -164,11 +164,11 @@ let JumooPipelineElement = class JumooPipelineElement extends UmbLitElement {
|
|
|
164
164
|
}
|
|
165
165
|
renderBackground() {
|
|
166
166
|
return !this.state?.backgroundState?.backgroundElement
|
|
167
|
-
? html `<jumoo-pipeline-background
|
|
168
|
-
.message=${this.message}
|
|
169
|
-
.state=${this.backgroundState ?? this.state}
|
|
170
|
-
.pipelineId=${this._pipelineId}
|
|
171
|
-
.background=${this.state?.backgroundState}
|
|
167
|
+
? html `<jumoo-pipeline-background
|
|
168
|
+
.message=${this.message}
|
|
169
|
+
.state=${this.backgroundState ?? this.state}
|
|
170
|
+
.pipelineId=${this._pipelineId}
|
|
171
|
+
.background=${this.state?.backgroundState}
|
|
172
172
|
.options=${this.options}></jumoo-pipeline-background>`
|
|
173
173
|
: this.renderElement(this.state?.backgroundState?.backgroundElement);
|
|
174
174
|
}
|
|
@@ -177,48 +177,48 @@ let JumooPipelineElement = class JumooPipelineElement extends UmbLitElement {
|
|
|
177
177
|
? !this.state?.currentRequest?.action?.element
|
|
178
178
|
? html `<div>complete</div>`
|
|
179
179
|
: this.renderElement(this.state?.currentRequest?.action?.element)
|
|
180
|
-
: html `<jumoo-pipeline-background
|
|
181
|
-
.message=${this.message}
|
|
182
|
-
.state=${this.backgroundState ?? this.state}
|
|
183
|
-
.pipelineId=${this._pipelineId}
|
|
184
|
-
.background=${this.state?.backgroundState}
|
|
180
|
+
: html `<jumoo-pipeline-background
|
|
181
|
+
.message=${this.message}
|
|
182
|
+
.state=${this.backgroundState ?? this.state}
|
|
183
|
+
.pipelineId=${this._pipelineId}
|
|
184
|
+
.background=${this.state?.backgroundState}
|
|
185
185
|
.options=${this.options}></jumoo-pipeline-background>`;
|
|
186
186
|
}
|
|
187
187
|
renderSteps() {
|
|
188
188
|
if (!this.state?.progress)
|
|
189
189
|
return nothing;
|
|
190
|
-
return html `<jumoo-pipeline-progress
|
|
191
|
-
.progress=${this.state?.progress}
|
|
190
|
+
return html `<jumoo-pipeline-progress
|
|
191
|
+
.progress=${this.state?.progress}
|
|
192
192
|
.message=${this.message}></jumoo-pipeline-progress>`;
|
|
193
193
|
}
|
|
194
194
|
renderElement(element) {
|
|
195
195
|
return !element
|
|
196
196
|
? nothing
|
|
197
|
-
: html `
|
|
198
|
-
<div class="wrapper">
|
|
199
|
-
<umb-extension-slot
|
|
200
|
-
type="jumoo-process-step"
|
|
201
|
-
.filter=${(ext) => ext.elementName === element}
|
|
197
|
+
: html `
|
|
198
|
+
<div class="wrapper">
|
|
199
|
+
<umb-extension-slot
|
|
200
|
+
type="jumoo-process-step"
|
|
201
|
+
.filter=${(ext) => ext.elementName === element}
|
|
202
202
|
.props=${{
|
|
203
203
|
pipelineId: this._pipelineId,
|
|
204
204
|
state: this.state,
|
|
205
205
|
options: this.options,
|
|
206
206
|
results: this.results,
|
|
207
|
-
}}></umb-extension-slot>
|
|
208
|
-
</div>
|
|
207
|
+
}}></umb-extension-slot>
|
|
208
|
+
</div>
|
|
209
209
|
`;
|
|
210
210
|
}
|
|
211
211
|
renderFail() {
|
|
212
|
-
return html `
|
|
213
|
-
<jumoo-processing-error .error=${this.results?.error}></jumoo-processing-error>
|
|
212
|
+
return html `
|
|
213
|
+
<jumoo-processing-error .error=${this.results?.error}></jumoo-processing-error>
|
|
214
214
|
`;
|
|
215
215
|
}
|
|
216
216
|
};
|
|
217
|
-
JumooPipelineElement.styles = css `
|
|
218
|
-
.wrapper,
|
|
219
|
-
umb-extension-slot {
|
|
220
|
-
height: 100%;
|
|
221
|
-
}
|
|
217
|
+
JumooPipelineElement.styles = css `
|
|
218
|
+
.wrapper,
|
|
219
|
+
umb-extension-slot {
|
|
220
|
+
height: 100%;
|
|
221
|
+
}
|
|
222
222
|
`;
|
|
223
223
|
__decorate([
|
|
224
224
|
property({ type: String })
|
|
@@ -50,30 +50,30 @@ let JumooProcessingPipelineWorkspaceDefaultViewElement = class JumooProcessingPi
|
|
|
50
50
|
this.progressLabel = this.localize.term('jumooProc_process');
|
|
51
51
|
}
|
|
52
52
|
render() {
|
|
53
|
-
return html `<umb-body-layout .headline=${this.headline}>
|
|
54
|
-
<jumoo-pipeline
|
|
55
|
-
.pipelineId=${this.pipeline?.id}
|
|
56
|
-
.setup=${this.pipeline?.options}
|
|
57
|
-
.debug=${false}
|
|
58
|
-
@pipeline-status=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onStatusChange)}
|
|
59
|
-
@pipeline-valid=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onSetValid)}
|
|
60
|
-
@pipeline-complete=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onComplete)}
|
|
61
|
-
@pipeline-modal-update=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onUpdateModal)}></jumoo-pipeline>
|
|
62
|
-
<div slot="actions">${this.renderActions()}</div>
|
|
53
|
+
return html `<umb-body-layout .headline=${this.headline}>
|
|
54
|
+
<jumoo-pipeline
|
|
55
|
+
.pipelineId=${this.pipeline?.id}
|
|
56
|
+
.setup=${this.pipeline?.options}
|
|
57
|
+
.debug=${false}
|
|
58
|
+
@pipeline-status=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onStatusChange)}
|
|
59
|
+
@pipeline-valid=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onSetValid)}
|
|
60
|
+
@pipeline-complete=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onComplete)}
|
|
61
|
+
@pipeline-modal-update=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onUpdateModal)}></jumoo-pipeline>
|
|
62
|
+
<div slot="actions">${this.renderActions()}</div>
|
|
63
63
|
</umb-body-layout>`;
|
|
64
64
|
}
|
|
65
65
|
renderActions() {
|
|
66
66
|
const actionButton = this._status === PipelineStatus.WAITING && this._isValid && !this._isLastAction
|
|
67
|
-
? html `<uui-button
|
|
68
|
-
@click=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onProcess)}
|
|
69
|
-
color="positive"
|
|
70
|
-
look="primary"
|
|
67
|
+
? html `<uui-button
|
|
68
|
+
@click=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onProcess)}
|
|
69
|
+
color="positive"
|
|
70
|
+
look="primary"
|
|
71
71
|
.label=${this.progressLabel}></uui-button>`
|
|
72
72
|
: nothing;
|
|
73
|
-
const closeButton = html `<uui-button
|
|
74
|
-
@click=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onClose)}
|
|
75
|
-
color="default"
|
|
76
|
-
look="default"
|
|
73
|
+
const closeButton = html `<uui-button
|
|
74
|
+
@click=${__classPrivateFieldGet(this, _JumooProcessingPipelineWorkspaceDefaultViewElement_instances, "m", _JumooProcessingPipelineWorkspaceDefaultViewElement_onClose)}
|
|
75
|
+
color="default"
|
|
76
|
+
look="default"
|
|
77
77
|
label=${this.closeLabel}></uui-button>`;
|
|
78
78
|
return html `${closeButton} ${actionButton}`;
|
|
79
79
|
}
|
|
@@ -27,34 +27,34 @@ let JumooQueueListElement = class JumooQueueListElement extends UmbLitElement {
|
|
|
27
27
|
this.loading = false;
|
|
28
28
|
}
|
|
29
29
|
render() {
|
|
30
|
-
return html `<uui-box style="--uui-box-default-padding: 0;" .headline=${this.headline}>
|
|
31
|
-
<div slot="header-actions">
|
|
32
|
-
<uui-button label="refresh" @click=${this.onRefresh} compact
|
|
33
|
-
><uui-icon name="icon-refresh"></uui-icon
|
|
34
|
-
></uui-button>
|
|
35
|
-
</div>
|
|
36
|
-
${when(this.loading, () => html `<uui-loader-bar
|
|
37
|
-
animationDuration="1.5"
|
|
38
|
-
style="color: black"></uui-loader-bar>`, () => this.renderTable())}
|
|
30
|
+
return html `<uui-box style="--uui-box-default-padding: 0;" .headline=${this.headline}>
|
|
31
|
+
<div slot="header-actions">
|
|
32
|
+
<uui-button label="refresh" @click=${this.onRefresh} compact
|
|
33
|
+
><uui-icon name="icon-refresh"></uui-icon
|
|
34
|
+
></uui-button>
|
|
35
|
+
</div>
|
|
36
|
+
${when(this.loading, () => html `<uui-loader-bar
|
|
37
|
+
animationDuration="1.5"
|
|
38
|
+
style="color: black"></uui-loader-bar>`, () => this.renderTable())}
|
|
39
39
|
</uui-box>`;
|
|
40
40
|
}
|
|
41
41
|
renderTable() {
|
|
42
42
|
return !this.queue || !this.queue.items.length
|
|
43
43
|
? html `<div class="emtpy">Nothing in the queue</div>`
|
|
44
|
-
: html `<jumoo-queue-table
|
|
45
|
-
.items=${this.queue.items}
|
|
44
|
+
: html `<jumoo-queue-table
|
|
45
|
+
.items=${this.queue.items}
|
|
46
46
|
@process-queue-item=${this._onProcessQueueItem}></jumoo-queue-table>`;
|
|
47
47
|
}
|
|
48
48
|
async _onProcessQueueItem(e) {
|
|
49
49
|
await this._queueContext.process(e.detail.key);
|
|
50
50
|
}
|
|
51
51
|
};
|
|
52
|
-
JumooQueueListElement.styles = css `
|
|
53
|
-
.emtpy {
|
|
54
|
-
display: flex;
|
|
55
|
-
justify-content: center;
|
|
56
|
-
padding: var(--uui-size-space-5);
|
|
57
|
-
}
|
|
52
|
+
JumooQueueListElement.styles = css `
|
|
53
|
+
.emtpy {
|
|
54
|
+
display: flex;
|
|
55
|
+
justify-content: center;
|
|
56
|
+
padding: var(--uui-size-space-5);
|
|
57
|
+
}
|
|
58
58
|
`;
|
|
59
59
|
__decorate([
|
|
60
60
|
property({ type: String })
|
|
@@ -93,24 +93,24 @@ let JumooQueueTableElement = class JumooQueueTableElement extends UmbLitElement
|
|
|
93
93
|
};
|
|
94
94
|
})
|
|
95
95
|
.filter((item) => item !== undefined);
|
|
96
|
-
return html ` <umb-table
|
|
97
|
-
.items=${items}
|
|
98
|
-
.config=${this.tableConfig}
|
|
99
|
-
.columns=${this.tableColumns}
|
|
96
|
+
return html ` <umb-table
|
|
97
|
+
.items=${items}
|
|
98
|
+
.config=${this.tableConfig}
|
|
99
|
+
.columns=${this.tableColumns}
|
|
100
100
|
.filter=${this.filter}></umb-table>`;
|
|
101
101
|
}
|
|
102
102
|
renderActions(item) {
|
|
103
|
-
return html ` <uui-button-group>
|
|
104
|
-
${when(this.showViewDetails, () => html ` <uui-button
|
|
105
|
-
label="Details"
|
|
106
|
-
color="default"
|
|
107
|
-
look="primary"
|
|
108
|
-
@click=${() => __classPrivateFieldGet(this, _JumooQueueTableElement_instances, "m", _JumooQueueTableElement_onViewDetails).call(this, item)}></uui-button>`)}
|
|
109
|
-
${when(!this.hideProcess, () => html ` <uui-button
|
|
110
|
-
label="Process"
|
|
111
|
-
color="positive"
|
|
112
|
-
look="outline"
|
|
113
|
-
@click=${() => __classPrivateFieldGet(this, _JumooQueueTableElement_instances, "m", _JumooQueueTableElement_onProcess).call(this, item)}></uui-button>`)}
|
|
103
|
+
return html ` <uui-button-group>
|
|
104
|
+
${when(this.showViewDetails, () => html ` <uui-button
|
|
105
|
+
label="Details"
|
|
106
|
+
color="default"
|
|
107
|
+
look="primary"
|
|
108
|
+
@click=${() => __classPrivateFieldGet(this, _JumooQueueTableElement_instances, "m", _JumooQueueTableElement_onViewDetails).call(this, item)}></uui-button>`)}
|
|
109
|
+
${when(!this.hideProcess, () => html ` <uui-button
|
|
110
|
+
label="Process"
|
|
111
|
+
color="positive"
|
|
112
|
+
look="outline"
|
|
113
|
+
@click=${() => __classPrivateFieldGet(this, _JumooQueueTableElement_instances, "m", _JumooQueueTableElement_onProcess).call(this, item)}></uui-button>`)}
|
|
114
114
|
</uui-button-group>`;
|
|
115
115
|
}
|
|
116
116
|
};
|
package/package.json
CHANGED
|
@@ -1,51 +1,58 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@jumoo/processing",
|
|
3
|
-
"licence": "custom",
|
|
4
|
-
"version": "17.4.2",
|
|
5
|
-
"type": "module",
|
|
6
|
-
"description": "Jumoo processing library",
|
|
7
|
-
"exports": {
|
|
8
|
-
".": "./dist/index.js",
|
|
9
|
-
"./pipeline": "./dist/pipeline/index.js",
|
|
10
|
-
"./signalr": "./dist/signalr/index.js",
|
|
11
|
-
"./api": "./dist/api/index.js"
|
|
12
|
-
},
|
|
13
|
-
"files": [
|
|
14
|
-
"./dist/**/*"
|
|
15
|
-
],
|
|
16
|
-
"author": {
|
|
17
|
-
"name": "Jumoo",
|
|
18
|
-
"email": "info@jumoo.co.uk",
|
|
19
|
-
"url": "https://jumoo.co.uk"
|
|
20
|
-
},
|
|
21
|
-
"publishConfig": {
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
"client:
|
|
26
|
-
"client:
|
|
27
|
-
"client:
|
|
28
|
-
"
|
|
29
|
-
"
|
|
30
|
-
"
|
|
31
|
-
"
|
|
32
|
-
"
|
|
33
|
-
"
|
|
34
|
-
"
|
|
35
|
-
"
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
"@
|
|
41
|
-
"@
|
|
42
|
-
"
|
|
43
|
-
"
|
|
44
|
-
"
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
"
|
|
48
|
-
"
|
|
49
|
-
"
|
|
50
|
-
|
|
51
|
-
|
|
1
|
+
{
|
|
2
|
+
"name": "@jumoo/processing",
|
|
3
|
+
"licence": "custom",
|
|
4
|
+
"version": "17.4.3-prerelease.2",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"description": "Jumoo processing library",
|
|
7
|
+
"exports": {
|
|
8
|
+
".": "./dist/index.js",
|
|
9
|
+
"./pipeline": "./dist/pipeline/index.js",
|
|
10
|
+
"./signalr": "./dist/signalr/index.js",
|
|
11
|
+
"./api": "./dist/api/index.js"
|
|
12
|
+
},
|
|
13
|
+
"files": [
|
|
14
|
+
"./dist/**/*"
|
|
15
|
+
],
|
|
16
|
+
"author": {
|
|
17
|
+
"name": "Jumoo",
|
|
18
|
+
"email": "info@jumoo.co.uk",
|
|
19
|
+
"url": "https://jumoo.co.uk"
|
|
20
|
+
},
|
|
21
|
+
"publishConfig": {
|
|
22
|
+
"access": "public"
|
|
23
|
+
},
|
|
24
|
+
"scripts": {
|
|
25
|
+
"client:build": "tsc --project ./tsconfig.dist.json",
|
|
26
|
+
"client:pack": "npm pack --pack-destination ./pack",
|
|
27
|
+
"client:publish": "npm publish -tag next",
|
|
28
|
+
"client:make": "npm run client:build && npm run client:pack && npm run client:publish",
|
|
29
|
+
"client:link": "npm link",
|
|
30
|
+
"generate": "openapi-ts",
|
|
31
|
+
"lint": "eslint .",
|
|
32
|
+
"lint:fix": "eslint . --fix",
|
|
33
|
+
"format:fix": "npm run format -- --write",
|
|
34
|
+
"format": "prettier \"src/**/*.ts\" --check",
|
|
35
|
+
"build": "tsc && vite build",
|
|
36
|
+
"watch": "vite build --watch",
|
|
37
|
+
"make": "npm run build && npm run client:make"
|
|
38
|
+
},
|
|
39
|
+
"devDependencies": {
|
|
40
|
+
"@eslint/js": "^10.0.1",
|
|
41
|
+
"@hey-api/openapi-ts": "^0.95.0",
|
|
42
|
+
"@microsoft/signalr": "^10.0.0",
|
|
43
|
+
"@umbraco-cms/backoffice": "^17.3.0",
|
|
44
|
+
"eslint": "^10.2.0",
|
|
45
|
+
"globals": "^17.8.0",
|
|
46
|
+
"lit": "^3.3.2",
|
|
47
|
+
"prettier": "^3.8.2",
|
|
48
|
+
"typescript": "^6.0.2",
|
|
49
|
+
"typescript-eslint": "^8.65.0",
|
|
50
|
+
"vite": "^8.0.8",
|
|
51
|
+
"vite-plugin-dts": "^4.5.4"
|
|
52
|
+
},
|
|
53
|
+
"repository": {
|
|
54
|
+
"type": "git",
|
|
55
|
+
"url": "git+https://github.com/Jumoo/Jumoo.Processing.git",
|
|
56
|
+
"directory": "Jumoo.Processing.Client/jumoo-processing-assets"
|
|
57
|
+
}
|
|
58
|
+
}
|