inviton-powerduck 0.0.2 → 0.0.4
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/app/powerduck-state.ts +14 -1
- package/app/powerduck-system-resources.ts +12 -0
- package/common/base-component.tsx +2 -5
- package/common/dialog-utils.ts +1 -1
- package/common/enum-translation/currency-code-translator.ts +20 -0
- package/common/enums/api.ts +4 -0
- package/common/enums/currency.ts +7 -0
- package/common/enums/dialog-icons.ts +8 -0
- package/common/enums/language.ts +20 -0
- package/common/enums/menu.ts +5 -0
- package/common/enums/modal.ts +4 -0
- package/common/image-declarations.d.ts +24 -0
- package/common/utils/currency-utils.ts +4 -3
- package/common/utils/language-utils.ts +8 -35
- package/common/utils/localized-string.ts +1 -1
- package/common/utils/localized-text-util.ts +36 -0
- package/components/app/menu.ts +1 -1
- package/components/datatable/datatable.tsx +2 -1
- package/components/dropdown/currency-code-picker.tsx +60 -0
- package/components/dropdown/language-picker.tsx +79 -0
- package/components/dropdown/timezone-picker.tsx +292 -0
- package/components/fullcalendar/timegrid-calendar.tsx +1 -1
- package/components/image-crop/image-cropping-modal.tsx +1 -0
- package/components/input/daterange-picker.tsx +1 -1
- package/components/input/geo-json.tsx +56 -0
- package/components/input/gps-input.tsx +116 -0
- package/components/input/img/global.png +0 -0
- package/components/input/localized-info-input.tsx +141 -0
- package/components/input/localized-string-input.tsx +3 -2
- package/components/input/localized-string-textarea.tsx +1 -1
- package/components/input/localized-string-wysiwyg.tsx +1 -1
- package/components/input/localized-url-input.tsx +3 -2
- package/components/input/video-urls.tsx +216 -0
- package/components/input/wysiwig.tsx +1 -0
- package/components/modal-wrap/css/modal-section-wrapper.css +4 -0
- package/components/modal-wrap/css/modal-subtitle.css +13 -0
- package/components/modal-wrap/modal-section-wrapper.tsx +64 -0
- package/components/modal-wrap/modal-section.tsx +44 -0
- package/components/modal-wrap/modal-subtitle.tsx +18 -0
- package/components/modal-wrap/modal-wrapper-helper.ts +13 -0
- package/components/open-street-map/img/marker-icon-2x.png +0 -0
- package/components/open-street-map/img/marker-icon.png +0 -0
- package/components/open-street-map/open-street-map.tsx +2 -1
- package/components/photos/photo-manager.tsx +136 -0
- package/components/quick-edit/quick-edit-modal-base.tsx +135 -0
- package/components/quick-edit/quick-edit-modal-status-base.tsx +81 -0
- package/components/rating/css/rating.css +6 -0
- package/components/rating/rating-displayer.tsx +31 -0
- package/components/rating/rating-picker.tsx +83 -0
- package/components/summary-stats/summary-stats-item.tsx +3 -3
- package/components/svg/skilift-svg.tsx +6 -0
- package/components/table-wrapper/css/table-wrapper.css +21 -0
- package/components/table-wrapper/table-wrapper.tsx +26 -0
- package/data/geo.ts +18 -0
- package/data/photo.ts +12 -0
- package/package.json +9 -9
- package/common/declarations.d.ts +0 -24
- package/common/enums.ts +0 -55
package/app/powerduck-state.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { Language } from "../common/enums";
|
|
1
|
+
import { Language } from "../common/enums/language";
|
|
2
|
+
import { ModalSectionMode } from "../common/enums/modal";
|
|
2
3
|
import { isNullOrEmpty } from "../common/utils/is-null-or-empty";
|
|
3
4
|
import { LanguageUtils } from "../common/utils/language-utils";
|
|
4
5
|
import { IDynamicComponentContainer } from "../components/app/dynamic-component-contracts";
|
|
@@ -78,6 +79,18 @@ export default class PowerduckState {
|
|
|
78
79
|
return null;
|
|
79
80
|
}
|
|
80
81
|
|
|
82
|
+
static getModalSectionMode(): ModalSectionMode {
|
|
83
|
+
if ((PowerduckState as any)._modalSectionMode == null) {
|
|
84
|
+
if (localStorage.getItem("modalSectionMode") != null) {
|
|
85
|
+
(PowerduckState as any)._modalSectionMode = Number(localStorage.getItem("modalSectionMode"));
|
|
86
|
+
} else {
|
|
87
|
+
(PowerduckState as any).setModalSectionMode(ModalSectionMode.navPills);
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
return (PowerduckState as any)._modalSectionMode
|
|
92
|
+
}
|
|
93
|
+
|
|
81
94
|
static parseErrorMessage(respText: string): string {
|
|
82
95
|
let parsedErr: any;
|
|
83
96
|
if (respText == null || respText.indexOf("{") != 0) {
|
|
@@ -16,6 +16,7 @@ export interface IPowerduckSystemResources {
|
|
|
16
16
|
back: string
|
|
17
17
|
submit: string
|
|
18
18
|
close: string
|
|
19
|
+
save: string
|
|
19
20
|
search: string
|
|
20
21
|
searchedValue: string
|
|
21
22
|
image: string
|
|
@@ -37,6 +38,17 @@ export interface IPowerduckSystemResources {
|
|
|
37
38
|
copyToClipboard: string
|
|
38
39
|
copyToClipboardSuccess: string
|
|
39
40
|
loginExpired: string
|
|
41
|
+
gpsLabel: string
|
|
42
|
+
gpsSubtitle: string
|
|
43
|
+
gpsLatitudeCaption: string
|
|
44
|
+
gpsLongitudeCaption: string
|
|
45
|
+
currencyCode: string
|
|
46
|
+
photosErrorMessage: string
|
|
47
|
+
photosInitialMessage: string
|
|
48
|
+
photosInvalidFileMessage: string
|
|
49
|
+
quickEdit: string
|
|
50
|
+
quickEditItemsCount: string
|
|
51
|
+
quickEditErrorNamed: string
|
|
40
52
|
|
|
41
53
|
language0: string;
|
|
42
54
|
language1: string;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { Vue } from "vue-facing-decorator";
|
|
2
2
|
import { useVuelidate, Validation } from "@vuelidate/core";
|
|
3
3
|
import { OptionBuilder } from "vue-facing-decorator/dist/optionBuilder";
|
|
4
|
-
import {
|
|
4
|
+
import { Language } from "./enums/language";
|
|
5
|
+
import { TryCallApiResult } from "./enums/api";
|
|
5
6
|
import { ValidationHelper } from "./validation";
|
|
6
7
|
import { PortalUtils } from "./utils/utils";
|
|
7
8
|
import { AjaxError } from "./api-http";
|
|
@@ -9,10 +10,6 @@ import { isNullOrEmpty } from "./utils/is-null-or-empty";
|
|
|
9
10
|
import NotificationProvider from './../components/ui/notification';
|
|
10
11
|
import PowerduckState from "../app/powerduck-state";
|
|
11
12
|
import { IValidation, ValidationState } from './static-wrappers/interfaces/validation-interface';
|
|
12
|
-
import { BreadcrumbItem } from "./../components/app/breadcrumb";
|
|
13
|
-
import { AppMenuItem } from "./../components/app/menu";
|
|
14
|
-
|
|
15
|
-
//import { LoginDialog } from '../components/login/login-dialog';
|
|
16
13
|
|
|
17
14
|
export abstract class PowerduckViewModelBase extends Vue {
|
|
18
15
|
blockRoot: boolean = true;
|
package/common/dialog-utils.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Modal as BootstrapModal } from "bootstrap";
|
|
2
|
-
import { DialogIcons } from "./enums"
|
|
2
|
+
import { DialogIcons } from "./enums/dialog-icons"
|
|
3
3
|
import { PortalUtils } from "./utils/utils";
|
|
4
4
|
import { isNullOrEmpty } from "./utils/is-null-or-empty";
|
|
5
5
|
import { ButtonLayout } from "../components/button/button-layout";
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { CURRENCY_CODE } from "../enums/currency";
|
|
2
|
+
|
|
3
|
+
export default class CurrencyCodeTranslator {
|
|
4
|
+
static getString(val: CURRENCY_CODE) {
|
|
5
|
+
switch (val) {
|
|
6
|
+
case CURRENCY_CODE.EUR:
|
|
7
|
+
return "€";
|
|
8
|
+
case CURRENCY_CODE.CZK:
|
|
9
|
+
return "Kč";
|
|
10
|
+
case CURRENCY_CODE.GBP:
|
|
11
|
+
return "£";
|
|
12
|
+
case CURRENCY_CODE.PLN:
|
|
13
|
+
return "zł";
|
|
14
|
+
case CURRENCY_CODE.USD:
|
|
15
|
+
return "$";
|
|
16
|
+
default:
|
|
17
|
+
return "";
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export enum DialogIcons {
|
|
2
|
+
Success = "https://inviton-cdn.azureedge.net/assets/img/modal/modal_success_icon.png",
|
|
3
|
+
Info = "https://inviton-cdn.azureedge.net/assets/img/modal/modal_info_icon.png",
|
|
4
|
+
Error = "https://inviton-cdn.azureedge.net/assets/img/modal/modal_err_icon.png",
|
|
5
|
+
Warning = "https://inviton-cdn.azureedge.net/assets/img/modal/modal_warn_icon.png",
|
|
6
|
+
Question = "https://inviton-cdn.azureedge.net/assets/img/modal/modal_question_icon.png",
|
|
7
|
+
Prompt = "https://inviton-cdn.azureedge.net/assets/img/modal/modal_prompt_icon.png",
|
|
8
|
+
}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export enum Language {
|
|
2
|
+
Slovak = 0,
|
|
3
|
+
English = 1,
|
|
4
|
+
Czech = 2,
|
|
5
|
+
German = 3,
|
|
6
|
+
Latvian = 4,
|
|
7
|
+
Polish = 5,
|
|
8
|
+
Italian = 6,
|
|
9
|
+
Hungarian = 7,
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
export enum LANGUAGE {
|
|
13
|
+
sk = "sk",
|
|
14
|
+
en = "en",
|
|
15
|
+
cs = "cs",
|
|
16
|
+
pl = "pl",
|
|
17
|
+
de = "de",
|
|
18
|
+
it = "it",
|
|
19
|
+
hu = "hu",
|
|
20
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
declare module '*.svg' {
|
|
2
|
+
const content: string;
|
|
3
|
+
export default content;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
declare module '*.gif' {
|
|
7
|
+
const content: string;
|
|
8
|
+
export default content;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
declare module '*.png' {
|
|
12
|
+
const content: string;
|
|
13
|
+
export default content;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
declare module '*.jpg' {
|
|
17
|
+
const content: string;
|
|
18
|
+
export default content;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
declare module '*.jpeg' {
|
|
22
|
+
const content: string;
|
|
23
|
+
export default content;
|
|
24
|
+
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
|
|
2
|
+
import { CURRENCY_CODE } from "../enums/currency";
|
|
2
3
|
import { LanguageUtils } from "./language-utils";
|
|
3
4
|
|
|
4
5
|
export class CurrencyUtils {
|
|
@@ -8,11 +9,11 @@ export class CurrencyUtils {
|
|
|
8
9
|
* @param value Number
|
|
9
10
|
* @param currency Currency symbol
|
|
10
11
|
*/
|
|
11
|
-
static floatToCurrency(value: number, currency:
|
|
12
|
+
static floatToCurrency(value: number, currency: CURRENCY_CODE | string | any): string {
|
|
12
13
|
return LanguageUtils.floatToCurrency(value, currency);
|
|
13
14
|
}
|
|
14
15
|
|
|
15
|
-
static getCurrencySymbol(currency:
|
|
16
|
+
static getCurrencySymbol(currency: CURRENCY_CODE | string | any) {
|
|
16
17
|
return CurrencyUtils.floatToCurrency(1.11, currency).replace("1.11", "").replace("1,11", "").trim();
|
|
17
18
|
}
|
|
18
19
|
}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import PowerduckState from "../../app/powerduck-state";
|
|
2
|
-
import {
|
|
2
|
+
import { CURRENCY_CODE } from "../enums/currency";
|
|
3
|
+
import { Language } from "../enums/language";
|
|
4
|
+
import { arraySort } from "./array-sort";
|
|
3
5
|
import { PortalUtils } from "./utils";
|
|
4
6
|
|
|
5
7
|
export namespace LanguageUtils {
|
|
@@ -61,15 +63,12 @@ export namespace LanguageUtils {
|
|
|
61
63
|
return newOption;
|
|
62
64
|
};
|
|
63
65
|
|
|
64
|
-
//client want this exact order
|
|
65
|
-
retVal.push(...[getLanguage(1), getLanguage(0), getLanguage(3), getLanguage(2), getLanguage(5), getLanguage(6), getLanguage(7)]);
|
|
66
|
-
|
|
67
66
|
try {
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
67
|
+
retVal.sort(function (a, b) {
|
|
68
|
+
return a.text.localeCompare(b.text);
|
|
69
|
+
});
|
|
71
70
|
} catch (e) {
|
|
72
|
-
|
|
71
|
+
arraySort(retVal, 'text');
|
|
73
72
|
}
|
|
74
73
|
|
|
75
74
|
LanguageUtils.getLanguageList = function () {
|
|
@@ -178,36 +177,10 @@ export namespace LanguageUtils {
|
|
|
178
177
|
}
|
|
179
178
|
}
|
|
180
179
|
|
|
181
|
-
export function floatToCurrency(value: number, currency: string |
|
|
180
|
+
export function floatToCurrency(value: number, currency: string | CURRENCY_CODE | number | any): string {
|
|
182
181
|
var currencyISO: string;
|
|
183
182
|
if (currency == null || currency == "") {
|
|
184
183
|
currencyISO = "?";
|
|
185
|
-
} else if (PortalUtils.isNumber(currency)) {
|
|
186
|
-
switch (Number(currency)) {
|
|
187
|
-
case Currency.EUR:
|
|
188
|
-
currencyISO = "EUR";
|
|
189
|
-
break;
|
|
190
|
-
case Currency.CZK:
|
|
191
|
-
currencyISO = "CZK";
|
|
192
|
-
break;
|
|
193
|
-
case Currency.GBP:
|
|
194
|
-
currencyISO = "GBP";
|
|
195
|
-
break;
|
|
196
|
-
case Currency.HUF:
|
|
197
|
-
currencyISO = "HUF";
|
|
198
|
-
break;
|
|
199
|
-
case Currency.PLN:
|
|
200
|
-
currencyISO = "PLN";
|
|
201
|
-
break;
|
|
202
|
-
case Currency.RUB:
|
|
203
|
-
currencyISO = "RUB";
|
|
204
|
-
break;
|
|
205
|
-
case Currency.USD:
|
|
206
|
-
currencyISO = "USD";
|
|
207
|
-
break;
|
|
208
|
-
default:
|
|
209
|
-
currencyISO = "?";
|
|
210
|
-
}
|
|
211
184
|
} else {
|
|
212
185
|
currencyISO = currency as any;
|
|
213
186
|
}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import LocalizedText from './../localized-text';
|
|
2
|
+
import { LANGUAGE } from './../enums/language';
|
|
3
|
+
|
|
4
|
+
export default class LocalizedTextUtil {
|
|
5
|
+
static getLocalizedTextValue(value: LocalizedText, langKey: string | LANGUAGE): string {
|
|
6
|
+
if (value == null) {
|
|
7
|
+
return null as any;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
let retVal = (value as any)[langKey];
|
|
11
|
+
if (retVal == null) {
|
|
12
|
+
if (langKey == "sk") {
|
|
13
|
+
retVal = value.cs;
|
|
14
|
+
} else if (langKey == "cs") {
|
|
15
|
+
retVal = value.sk;
|
|
16
|
+
} else {
|
|
17
|
+
retVal = value.en;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
if (retVal == null) {
|
|
22
|
+
if (value.sk != null) {
|
|
23
|
+
return value.sk;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
for (const propName in value) {
|
|
27
|
+
const text = (value as any)[propName];
|
|
28
|
+
if (text != null && text.toString().length > 0) {
|
|
29
|
+
return text;
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
return retVal || value.sk;
|
|
35
|
+
}
|
|
36
|
+
}
|
package/components/app/menu.ts
CHANGED
|
@@ -21,7 +21,7 @@ import TimezoneHelper from './../../common/timezone-helper';
|
|
|
21
21
|
import Sortable from "sortablejs";
|
|
22
22
|
import "./css/datatable.css";
|
|
23
23
|
import { IWebApiClient, WebClientApiMethod } from "../../common/IWebClient";
|
|
24
|
-
import { DialogIcons } from "../../common/enums";
|
|
24
|
+
import { DialogIcons } from "../../common/enums/dialog-icons";
|
|
25
25
|
import { QueryStringUtils } from "../../common/query-string-utils";
|
|
26
26
|
import { DateWrapper } from "../../common/date-wrapper";
|
|
27
27
|
import { PortalUtils } from "../../common/utils/utils";
|
|
@@ -29,6 +29,7 @@ import { isNullOrEmpty } from "../../common/utils/is-null-or-empty";
|
|
|
29
29
|
import { latinize } from "../../common/utils/latinize-string";
|
|
30
30
|
import { capitalize } from "../../common/utils/capitalize-string";
|
|
31
31
|
import { arraySort } from "../../common/utils/array-sort";
|
|
32
|
+
import './../../common/image-declarations';
|
|
32
33
|
import loadingGif from './img/loading_16_16.gif';
|
|
33
34
|
import PowerduckState from "../../app/powerduck-state";
|
|
34
35
|
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import { Prop, toNative } from "vue-facing-decorator";
|
|
2
|
+
import TsxComponent, { Component } from "../../app/vuetsx";
|
|
3
|
+
import { ValidationState } from "../../common/static-wrappers/interfaces/validation-interface";
|
|
4
|
+
import { CURRENCY_CODE } from './../../common/enums/currency';
|
|
5
|
+
import DropdownList, { DropdownListOption } from ".";
|
|
6
|
+
import CurrencyCodeTranslator from './../../common/enum-translation/currency-code-translator';
|
|
7
|
+
import { isNullOrEmpty } from "../../common/utils/is-null-or-empty";
|
|
8
|
+
import PowerduckState from "../../app/powerduck-state";
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
interface CurrencyCodePickerArgs {
|
|
12
|
+
selected: CURRENCY_CODE;
|
|
13
|
+
mandatory?: boolean;
|
|
14
|
+
label?: string;
|
|
15
|
+
placeholder?: string;
|
|
16
|
+
validationState?: ValidationState;
|
|
17
|
+
wrap?: boolean;
|
|
18
|
+
changed: (e: CURRENCY_CODE) => void;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
@Component
|
|
22
|
+
class CurrencyCodePicker extends TsxComponent<CurrencyCodePickerArgs> implements CurrencyCodePickerArgs {
|
|
23
|
+
@Prop() selected: CURRENCY_CODE;
|
|
24
|
+
@Prop() mandatory!: boolean;
|
|
25
|
+
@Prop() label!: string;
|
|
26
|
+
@Prop() placeholder!: string;
|
|
27
|
+
@Prop() wrap!: boolean;
|
|
28
|
+
@Prop() changed: (e: CURRENCY_CODE) => void;
|
|
29
|
+
|
|
30
|
+
getOptionList(): DropdownListOption[] {
|
|
31
|
+
return [
|
|
32
|
+
{ id: CURRENCY_CODE.EUR, text: CurrencyCodeTranslator.getString(CURRENCY_CODE.EUR) },
|
|
33
|
+
{ id: CURRENCY_CODE.CZK, text: CurrencyCodeTranslator.getString(CURRENCY_CODE.CZK) },
|
|
34
|
+
{ id: CURRENCY_CODE.GBP, text: CurrencyCodeTranslator.getString(CURRENCY_CODE.GBP) },
|
|
35
|
+
{ id: CURRENCY_CODE.PLN, text: CurrencyCodeTranslator.getString(CURRENCY_CODE.PLN) },
|
|
36
|
+
{ id: CURRENCY_CODE.USD, text: CurrencyCodeTranslator.getString(CURRENCY_CODE.USD) },
|
|
37
|
+
];
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
render(h) {
|
|
41
|
+
let optArr = this.getOptionList();
|
|
42
|
+
|
|
43
|
+
return (
|
|
44
|
+
<DropdownList
|
|
45
|
+
label={!isNullOrEmpty(this.label) ? this.label : PowerduckState.getResourceValue('currencyCode')}
|
|
46
|
+
wrap={this.wrap}
|
|
47
|
+
validationState={this.validationState}
|
|
48
|
+
placeholder={this.placeholder}
|
|
49
|
+
options={optArr}
|
|
50
|
+
mandatory={this.mandatory}
|
|
51
|
+
selected={this.selected == null ? null : optArr.find((p) => p.id == this.selected)}
|
|
52
|
+
changed={(e: DropdownListOption) => {
|
|
53
|
+
this.changed(e?.id as CURRENCY_CODE);
|
|
54
|
+
}}
|
|
55
|
+
/>
|
|
56
|
+
);
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
export default toNative(CurrencyCodePicker);
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import { Prop, toNative } from "vue-facing-decorator";
|
|
2
|
+
import { Language, LANGUAGE } from "../../common/enums/language";
|
|
3
|
+
import { ValidationState } from "../../common/static-wrappers/interfaces/validation-interface";
|
|
4
|
+
import DropdownList, { DropdownListOption } from ".";
|
|
5
|
+
import { LanguageUtils } from "../../common/utils/language-utils";
|
|
6
|
+
import TsxComponent, { Component } from "../../app/vuetsx";
|
|
7
|
+
import { isNullOrEmpty } from "../../common/utils/is-null-or-empty";
|
|
8
|
+
import { PortalUtils } from "../../common/utils/utils";
|
|
9
|
+
import PowerduckState from "../../app/powerduck-state";
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
interface LanguagePickerArgs {
|
|
13
|
+
selected: LANGUAGE | Language;
|
|
14
|
+
mandatory?: boolean;
|
|
15
|
+
label?: string;
|
|
16
|
+
placeholder?: string;
|
|
17
|
+
validationState?: ValidationState;
|
|
18
|
+
wrap?: boolean;
|
|
19
|
+
changed: (e: { value: Language, code: LANGUAGE }) => void;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
@Component
|
|
23
|
+
class LanguagePicker extends TsxComponent<LanguagePickerArgs> implements LanguagePickerArgs {
|
|
24
|
+
@Prop() selected: LANGUAGE | Language;
|
|
25
|
+
@Prop() mandatory!: boolean;
|
|
26
|
+
@Prop() label!: string;
|
|
27
|
+
@Prop() placeholder!: string;
|
|
28
|
+
@Prop() wrap!: boolean;
|
|
29
|
+
@Prop() changed: (e: { value: Language, code: LANGUAGE }) => void;
|
|
30
|
+
|
|
31
|
+
getOptionList(): DropdownListOption[] {
|
|
32
|
+
return LanguageUtils.getLanguageList().map(p => ({
|
|
33
|
+
id: LanguageUtils.getLanguageCode(p.id),
|
|
34
|
+
text: p.text
|
|
35
|
+
}));
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
getSelectedRow(optArr: DropdownListOption[]) {
|
|
39
|
+
if (this.selected == null) {
|
|
40
|
+
return null;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
let searchVal = this.selected as string;
|
|
44
|
+
if (PortalUtils.isNumber(searchVal)) {
|
|
45
|
+
searchVal = LanguageUtils.getLanguageCode(searchVal as any);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
return optArr.find((p) => p.id == searchVal);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
render(h) {
|
|
53
|
+
let optArr = this.getOptionList();
|
|
54
|
+
|
|
55
|
+
return (
|
|
56
|
+
<DropdownList
|
|
57
|
+
label={this.label}
|
|
58
|
+
wrap={this.wrap}
|
|
59
|
+
validationState={this.validationState}
|
|
60
|
+
placeholder={this.placeholder}
|
|
61
|
+
options={optArr}
|
|
62
|
+
mandatory={this.mandatory}
|
|
63
|
+
selected={this.getSelectedRow(optArr)}
|
|
64
|
+
changed={(e: DropdownListOption) => {
|
|
65
|
+
if (e?.id == null) {
|
|
66
|
+
this.changed(null);
|
|
67
|
+
} else {
|
|
68
|
+
this.changed({
|
|
69
|
+
code: e.id as LANGUAGE,
|
|
70
|
+
value: LanguageUtils.getLanguageEnum(e.id as string)
|
|
71
|
+
})
|
|
72
|
+
}
|
|
73
|
+
}}
|
|
74
|
+
/>
|
|
75
|
+
);
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
export default toNative(LanguagePicker);
|