@progressive-development/pd-spa-helper 0.3.62 → 0.3.64
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/src/defaultpage/default-confirm-popup.d.ts +4 -1
- package/dist/src/defaultpage/default-confirm-popup.js +26 -8
- package/dist/src/defaultpage/default-confirm-popup.js.map +1 -1
- package/dist/src/defaultpage/default-wizard-step.d.ts +1 -0
- package/dist/src/defaultpage/default-wizard-step.js +4 -0
- package/dist/src/defaultpage/default-wizard-step.js.map +1 -1
- package/dist/src/defaultpage/default-wizard.d.ts +6 -0
- package/dist/src/defaultpage/default-wizard.js +118 -1
- package/dist/src/defaultpage/default-wizard.js.map +1 -1
- package/dist/src/generated/locale-wrapper/de-wrapper.d.ts +11 -0
- package/dist/src/generated/locales/be.d.ts +11 -0
- package/dist/src/generated/locales/be.js +11 -0
- package/dist/src/generated/locales/be.js.map +1 -1
- package/dist/src/generated/locales/de.d.ts +11 -0
- package/dist/src/generated/locales/de.js +11 -0
- package/dist/src/generated/locales/de.js.map +1 -1
- package/dist/src/generated/locales/en.d.ts +11 -0
- package/dist/src/generated/locales/en.js +11 -0
- package/dist/src/generated/locales/en.js.map +1 -1
- package/dist/src/model/spa-model.d.ts +1 -0
- package/dist/src/model/spa-model.js +1 -0
- package/dist/src/model/spa-model.js.map +1 -1
- package/dist/src/popup/wizard-close-popup.d.ts +10 -0
- package/dist/src/popup/wizard-close-popup.js +49 -0
- package/dist/src/popup/wizard-close-popup.js.map +1 -0
- package/dist/src/popup/wizard-reload-popup.d.ts +13 -0
- package/dist/src/popup/wizard-reload-popup.js +63 -0
- package/dist/src/popup/wizard-reload-popup.js.map +1 -0
- package/dist/src/tmpown/pd-loading-state.js +2 -1
- package/dist/src/tmpown/pd-loading-state.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/defaultpage/default-confirm-popup.ts +22 -13
- package/src/defaultpage/default-wizard-step.ts +5 -0
- package/src/defaultpage/default-wizard.ts +143 -1
- package/src/generated/locales/be.ts +11 -0
- package/src/generated/locales/de.ts +11 -0
- package/src/generated/locales/en.ts +12 -1
- package/src/model/spa-model.ts +2 -0
- package/src/popup/wizard-close-popup.ts +52 -0
- package/src/popup/wizard-reload-popup.ts +69 -0
- package/src/tmpown/pd-loading-state.ts +2 -1
- package/xliff/be.xlf +45 -0
- package/xliff/de.xlf +33 -0
- package/xliff/en.xlf +45 -0
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { CSSResultGroup } from "lit";
|
|
2
|
+
import { DefaultConfirmPopup, PopupType } from "../defaultpage/default-confirm-popup.js";
|
|
3
|
+
export declare class WizardReloadPopup extends DefaultConfirmPopup {
|
|
4
|
+
_singleButton: boolean;
|
|
5
|
+
_type: PopupType;
|
|
6
|
+
_popupTitle: string;
|
|
7
|
+
reloadItem: {
|
|
8
|
+
timestamp: string;
|
|
9
|
+
wizardStep: number;
|
|
10
|
+
};
|
|
11
|
+
static styles: CSSResultGroup;
|
|
12
|
+
_renderContent(): import("lit").TemplateResult<1>;
|
|
13
|
+
}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { __decorate } from "tslib";
|
|
2
|
+
import { html, css } from "lit";
|
|
3
|
+
import { customElement, property } from "lit/decorators.js";
|
|
4
|
+
import { msg } from "@lit/localize";
|
|
5
|
+
import { DefaultConfirmPopup } from "../defaultpage/default-confirm-popup.js";
|
|
6
|
+
let WizardReloadPopup = class WizardReloadPopup extends DefaultConfirmPopup {
|
|
7
|
+
constructor() {
|
|
8
|
+
super(...arguments);
|
|
9
|
+
this._singleButton = false;
|
|
10
|
+
this._type = "info";
|
|
11
|
+
this._popupTitle = msg("Bearbeitung fortsetzen?", { id: "spaH.wizard.reload.popup.title" });
|
|
12
|
+
}
|
|
13
|
+
// eslint-disable-next-line class-methods-use-this
|
|
14
|
+
_renderContent() {
|
|
15
|
+
return html `
|
|
16
|
+
<div class="popup-content" slot="content">
|
|
17
|
+
<p>
|
|
18
|
+
${msg("Für dieses Formular wurden bereits Daten gespeichert. Soll die Bearbeitung fortgesetzt, oder eine neue Dateneingabe gestartet werden? Bei einer neuen Eingabe werden die bisherigen Daten verworfen.", { id: "spaH.wizard.reload.popup.content" })}
|
|
19
|
+
</p>
|
|
20
|
+
<div class="last-modified">
|
|
21
|
+
Letzte Bearbeitung: <span>${this.reloadItem.timestamp}</span>
|
|
22
|
+
</div>
|
|
23
|
+
</div>
|
|
24
|
+
`;
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
WizardReloadPopup.styles = [
|
|
28
|
+
DefaultConfirmPopup.styles,
|
|
29
|
+
css `
|
|
30
|
+
|
|
31
|
+
:host {
|
|
32
|
+
--pd-popup-max-width: 80%;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
.popup-content {
|
|
36
|
+
display: flex;
|
|
37
|
+
flex-direction: column;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.last-modified {
|
|
41
|
+
color: #555;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.last-modified span {
|
|
45
|
+
font-weight: bold;
|
|
46
|
+
color: #000;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.last-modified::before {
|
|
50
|
+
content: '🕒';
|
|
51
|
+
margin-right: 6px;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
`
|
|
55
|
+
];
|
|
56
|
+
__decorate([
|
|
57
|
+
property({ type: Object })
|
|
58
|
+
], WizardReloadPopup.prototype, "reloadItem", void 0);
|
|
59
|
+
WizardReloadPopup = __decorate([
|
|
60
|
+
customElement('wizard-reload-popup')
|
|
61
|
+
], WizardReloadPopup);
|
|
62
|
+
export { WizardReloadPopup };
|
|
63
|
+
//# sourceMappingURL=wizard-reload-popup.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"wizard-reload-popup.js","sourceRoot":"","sources":["../../../src/popup/wizard-reload-popup.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAkB,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAEpC,OAAO,EAAE,mBAAmB,EAAa,MAAM,yCAAyC,CAAC;AAIlF,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,mBAAmB;IAAnD;;QAEL,kBAAa,GAAG,KAAK,CAAC;QAEtB,UAAK,GAAc,MAAM,CAAC;QAE1B,gBAAW,GAAG,GAAG,CAAC,yBAAyB,EAAE,EAAC,EAAE,EAAE,gCAAgC,EAAC,CAAC,CAAC;IAsDvF,CAAC;IAdC,kDAAkD;IAClD,cAAc;QACZ,OAAO,IAAI,CAAA;;;YAGH,GAAG,CAAC,sMAAsM,EAAE,EAAC,EAAE,EAAE,kCAAkC,EAAC,CAAC;;;sCAG3N,IAAI,CAAC,UAAU,CAAC,SAAS;;;KAG1D,CAAC;IACJ,CAAC;;AA3CM,wBAAM,GAAG;IACd,mBAAmB,CAAC,MAAM;IAC1B,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;KAyBF;CACgB,CAAC;AAjCpB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;qDAIxB;AAbU,iBAAiB;IAD7B,aAAa,CAAC,qBAAqB,CAAC;GACxB,iBAAiB,CA4D7B;SA5DY,iBAAiB","sourcesContent":["import { html, css, CSSResultGroup } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { msg } from \"@lit/localize\";\n\nimport { DefaultConfirmPopup, PopupType } from \"../defaultpage/default-confirm-popup.js\";\n\n\n@customElement('wizard-reload-popup')\nexport class WizardReloadPopup extends DefaultConfirmPopup {\n\n _singleButton = false;\n\n _type: PopupType = \"info\";\n\n _popupTitle = msg(\"Bearbeitung fortsetzen?\", {id: \"spaH.wizard.reload.popup.title\"});\n\n\n @property({type: Object})\n reloadItem!: { \n timestamp: string,\n wizardStep: number,\n }\n\n static styles = [ \n DefaultConfirmPopup.styles,\n css`\n\n :host {\n --pd-popup-max-width: 80%;\n }\n\n .popup-content {\n display: flex;\n flex-direction: column;\n }\n\n .last-modified {\n color: #555;\n }\n\n .last-modified span {\n font-weight: bold;\n color: #000;\n }\n\n .last-modified::before {\n content: '🕒';\n margin-right: 6px;\n }\n\n `\n ] as CSSResultGroup;\n \n\n // eslint-disable-next-line class-methods-use-this\n _renderContent() { \n return html`\n <div class=\"popup-content\" slot=\"content\">\n <p>\n ${msg(\"Für dieses Formular wurden bereits Daten gespeichert. Soll die Bearbeitung fortgesetzt, oder eine neue Dateneingabe gestartet werden? Bei einer neuen Eingabe werden die bisherigen Daten verworfen.\", {id: \"spaH.wizard.reload.popup.content\"})} \n </p>\n <div class=\"last-modified\">\n Letzte Bearbeitung: <span>${this.reloadItem.timestamp}</span>\n </div>\n </div> \n `;\n }\n\n}\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import { LitElement, html, css } from 'lit';
|
|
3
3
|
import { customElement, property } from 'lit/decorators.js';
|
|
4
|
-
import { msg } from '@lit/localize';
|
|
4
|
+
import { localized, msg } from '@lit/localize';
|
|
5
5
|
import { classMap } from 'lit/directives/class-map.js';
|
|
6
6
|
import '@progressive-development/pd-icon/pd-icon.js';
|
|
7
7
|
let PdLoadingState = class PdLoadingState extends LitElement {
|
|
@@ -166,6 +166,7 @@ __decorate([
|
|
|
166
166
|
property({ type: Object })
|
|
167
167
|
], PdLoadingState.prototype, "loadingState", void 0);
|
|
168
168
|
PdLoadingState = __decorate([
|
|
169
|
+
localized(),
|
|
169
170
|
customElement('pd-loading-state')
|
|
170
171
|
], PdLoadingState);
|
|
171
172
|
export { PdLoadingState };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pd-loading-state.js","sourceRoot":"","sources":["../../../src/tmpown/pd-loading-state.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAkB,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"pd-loading-state.js","sourceRoot":"","sources":["../../../src/tmpown/pd-loading-state.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAkB,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,OAAO,6CAA6C,CAAC;AAO9C,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,UAAU;IA0H5C,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;YACtB,OAAO,EAAE,CAAC;SACX;QACD,OAAO,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA;;YAE7B,IAAI,CAAC,cAAc,EAAE;;OAE1B,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;IAC9B,CAAC;IAED,cAAc;QACZ,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;YACtB,OAAO,EAAE,CAAC;SACX;QACD,OAAO,IAAI,CAAA;oBACK,QAAQ,CAAC;YACnB,OAAO,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe;YAC3C,kBAAkB,EAAE,IAAI,CAAC,YAAY,CAAC,KAAK,KAAK,IAAI,IAAI,IAAI,CAAC,YAAY,CAAC,eAAe,KAAK,IAAI;YAClG,oBAAoB,EAAE,IAAI,CAAC,YAAY,CAAC,eAAe,KAAK,IAAI;SACjE,CAAC;sBACY,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,QAAQ;aAC3E,IAAI,CAAC,YAAY,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC;YACvE,GAAG,CAAC,6BAA6B,EAAE,EAAC,EAAE,EAAE,6BAA6B,EAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,oCAAoC,EAAE,EAAC,EAAE,EAAE,8BAA8B,EAAC,CAAC,CAAC;;UAE1J,IAAI,CAAC,YAAY,CAAC,OAAO,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAA;;cAEpE,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAA;;;kBAGtC,IAAI,CAAC,UAAU;kBACf,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAA,2EAA2E;YAChG,CAAC,CAAC,IAAI,CAAA,yEAAyE;;;aAGpF,CAAC;;SAEL,CAAC,CAAC,CAAC,EAAE;;KAET,CAAA;IACH,CAAC;;AA7JM,qBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAiHF;CACgB,CAAC;AArHpB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAC,CAAC;oDACE;AAHjB,cAAc;IAF1B,SAAS,EAAE;IACX,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CAoK1B;SApKY,cAAc","sourcesContent":["import { LitElement, html, css, CSSResultGroup } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { localized, msg } from '@lit/localize';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport '@progressive-development/pd-icon/pd-icon.js';\n\nimport {LoadingState} from '../model/spa-model.js';\n\n\n@localized()\n@customElement('pd-loading-state')\nexport class PdLoadingState extends LitElement {\n\n @property({ type: Object}) \n loadingState?: LoadingState;\n\n static styles = [ \n css`\n :host {\n display: block;\n }\n\n /* The Modal (background) */\n .modal { \n position: fixed; /* Stay in place */ \n left: 0;\n top: 0;\n z-index: 500; /* Sit on top */\n\n display: flex;\n align-items: center;\n justify-content: center;\n \n width: 100%; /* Full width */\n height: 100%; /* Full height */ \n overflow: auto; /* Enable scroll if needed */\n /* RGBA Wert muss hier verwendet werden #AFC1D2 to rgba for opacity */\n background-color: var(--pd-popup-modal-bg-rgba, rgba(175, 193, 210, 0.8)); \n }\n\n /* Modal Content */\n .no-modal-content { \n position: fixed; /* Stay in place */ \n left: 50%; \n top: 50%; \n transform: translate(-50%, -50%); \n }\n\n .content {\n padding: 1em;\n text-align: center;\n background-color: var(--pd-loading-state-bg-col, #edf7fd);\n border: 2px solid var(--pd-loading-state-bg-col, var(--pd-default-col, #067394));\n z-index: 101; /* Sit on top */\n }\n\n .background-content {\n\n position: fixed; /* Stay in place */ \n right: 0em; \n bottom: 0em; \n\n padding: 1em; \n z-index: 600; /* Sit on top */\n\n display: flex;\n gap: 0.5em;\n align-items: center;\n\n background-color: white;\n }\n\n .loader { \n border: 16px solid var(--pd-heating-service-loader, #0A3A48);\n border-top: 16px solid var(--pd-heating-service-loader-run, #067394);\n border-radius: 50%;\n width: 30px;\n height: 30px;\n animation: spin 2s linear infinite;\n \n margin-left: auto;\n margin-right: auto;\n }\n\n .background-loader { \n border: 10px solid var(--pd-heating-service-loader, #0A3A48);\n border-top: 10px solid var(--pd-heating-service-loader-run, #067394);\n border-radius: 50%;\n width: 10px;\n height: 10px;\n animation: spin 2s linear infinite;\n }\n\n .sub-ul {\n text-align: start;\n }\n\n .sub-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding-right: 10px;\n }\n\n .sub-icon {\n --pd-icon-size: 1rem;\n padding: 0;\n vertical-align: baseline;\n margin: 0 .25rem 0 0;\n }\n\n .completed {\n --pd-icon-stroke-col-active: green;\n --pd-icon-col-active: green;\n }\n\n .loading {\n --pd-icon-stroke-col-active: orange;\n --pd-icon-col-active: orange;\n }\n\n @keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n }\n\n `\n ] as CSSResultGroup; \n\n render() { \n if (!this.loadingState) {\n return '';\n }\n return this.loadingState.modal ? html`\n <div id=\"modalId\" class=\"modal\">\n ${this._renderContent()}\n </div>\n ` : this._renderContent();\n }\n\n _renderContent() {\n if (!this.loadingState) {\n return '';\n }\n return html`\n <div class=\"${classMap({\n content: !this.loadingState.smallBackground,\n \"no-modal-content\": this.loadingState.modal !== true && this.loadingState.smallBackground !== true,\n \"background-content\": this.loadingState.smallBackground === true,\n })}\">\n <div class=\"${this.loadingState.smallBackground ? \"background-loader\" : \"loader\"}\"></div>\n <p>${this.loadingState.loadingTxt || (this.loadingState.smallBackground ? \n msg(\"Daten werden synchronisiert\", {id: \"spaH.loadingstate.syncState\"}) : msg(\"Bitte warten, Daten werden geladen\", {id: \"spaH.loadingstate.pleaseWait\"}))}\n </p>\n ${this.loadingState.subTask && this.loadingState.subTask.length > 0 ? html`\n <ul class=\"sub-ul\">\n ${this.loadingState.subTask.map(task => html`\n <li>\n <div class=\"sub-row\">\n ${task.loadingTxt}\n ${task.completed ? html`<pd-icon class=\"sub-icon completed\" icon=\"checkBox\" activeIcon></pd-icon>` \n : html`<pd-icon class=\"sub-icon loading\" icon=\"syncIcon\" activeIcon></pd-icon>`}\n </div>\n </li>\n `)}\n </ul>\n ` : ''}\n </div>\n `\n }\n\n}"]}
|