inviton-powerduck 0.0.3 → 0.0.5

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.
Files changed (63) hide show
  1. package/app/powerduck-state.ts +14 -1
  2. package/app/powerduck-system-resources.ts +12 -0
  3. package/common/base-component.tsx +2 -5
  4. package/common/dialog-utils.ts +1 -1
  5. package/common/enum-translation/bool-translator.ts +11 -0
  6. package/common/enum-translation/currency-code-translator.ts +20 -0
  7. package/common/enum-translation/day-translator.ts +27 -0
  8. package/common/enum-translation/language-enum-normalizer.ts +45 -0
  9. package/common/enum-translation/language-translator.ts +14 -0
  10. package/common/enums/api.ts +4 -0
  11. package/common/enums/currency.ts +7 -0
  12. package/common/enums/day.ts +9 -0
  13. package/common/enums/dialog-icons.ts +8 -0
  14. package/common/enums/language.ts +20 -0
  15. package/common/enums/menu.ts +5 -0
  16. package/common/enums/modal.ts +4 -0
  17. package/common/image-declarations.d.ts +24 -0
  18. package/common/utils/currency-utils.ts +4 -3
  19. package/common/utils/language-utils.ts +8 -35
  20. package/common/utils/localized-string.ts +1 -1
  21. package/common/utils/localized-text-util.ts +36 -0
  22. package/components/app/menu.ts +1 -1
  23. package/components/datatable/datatable.tsx +2 -1
  24. package/components/dropdown/currency-code-picker.tsx +60 -0
  25. package/components/dropdown/language-picker.tsx +79 -0
  26. package/components/dropdown/timezone-picker.tsx +292 -0
  27. package/components/fullcalendar/timegrid-calendar.tsx +1 -1
  28. package/components/image-crop/image-cropping-modal.tsx +1 -0
  29. package/components/input/daterange-picker.tsx +1 -1
  30. package/components/input/geo-json.tsx +56 -0
  31. package/components/input/gps-input.tsx +116 -0
  32. package/components/input/img/global.png +0 -0
  33. package/components/input/localized-info-input.tsx +141 -0
  34. package/components/input/localized-string-input.tsx +3 -2
  35. package/components/input/localized-string-textarea.tsx +1 -1
  36. package/components/input/localized-string-wysiwyg.tsx +1 -1
  37. package/components/input/localized-url-input.tsx +3 -2
  38. package/components/input/video-urls.tsx +216 -0
  39. package/components/input/wysiwig.tsx +1 -0
  40. package/components/modal-wrap/css/modal-section-wrapper.css +4 -0
  41. package/components/modal-wrap/css/modal-subtitle.css +13 -0
  42. package/components/modal-wrap/modal-section-wrapper.tsx +64 -0
  43. package/components/modal-wrap/modal-section.tsx +44 -0
  44. package/components/modal-wrap/modal-subtitle.tsx +18 -0
  45. package/components/modal-wrap/modal-wrapper-helper.ts +13 -0
  46. package/components/open-street-map/img/marker-icon-2x.png +0 -0
  47. package/components/open-street-map/img/marker-icon.png +0 -0
  48. package/components/open-street-map/open-street-map.tsx +2 -1
  49. package/components/photos/photo-manager.tsx +136 -0
  50. package/components/quick-edit/quick-edit-modal-base.tsx +135 -0
  51. package/components/quick-edit/quick-edit-modal-status-base.tsx +81 -0
  52. package/components/rating/css/rating.css +6 -0
  53. package/components/rating/rating-displayer.tsx +31 -0
  54. package/components/rating/rating-picker.tsx +83 -0
  55. package/components/summary-stats/summary-stats-item.tsx +3 -3
  56. package/components/svg/skilift-svg.tsx +6 -0
  57. package/components/table-wrapper/css/table-wrapper.css +21 -0
  58. package/components/table-wrapper/table-wrapper.tsx +26 -0
  59. package/data/geo.ts +18 -0
  60. package/data/photo.ts +12 -0
  61. package/package.json +3 -2
  62. package/common/declarations.d.ts +0 -24
  63. package/common/enums.ts +0 -55
@@ -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 { DialogIcons, Language, TryCallApiResult } from "./enums";
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;
@@ -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,11 @@
1
+ import PowerduckState from "../../app/powerduck-state";
2
+
3
+ export default class BoolTranslator {
4
+ static getString(val: boolean): string {
5
+ if (val == true) {
6
+ return PowerduckState.getResourceValue('yes');
7
+ }
8
+
9
+ return PowerduckState.getResourceValue('no');
10
+ }
11
+ }
@@ -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,27 @@
1
+ import { DAY } from "./../enums/day";
2
+ import PowerduckState from './../../app/powerduck-state';
3
+ import { capitalize } from "./../utils/capitalize-string";
4
+
5
+ export default class DayTranslator {
6
+ private static _dayMap: { [index: string]: string } = null as any;
7
+
8
+ static getString(day: DAY): string {
9
+ this.initMap();
10
+ return this._dayMap[day];
11
+ }
12
+
13
+ private static initMap() {
14
+ if (this._dayMap != null) {
15
+ return;
16
+ }
17
+
18
+ this._dayMap = {};
19
+ const locale = PowerduckState.getCurrentLanguageCode();
20
+ for (var i = 7; i < 15; i++) {
21
+ const dayDate = new Date(Date.UTC(2015, 5, i));
22
+ const dayName = capitalize(dayDate.toLocaleDateString(locale, { weekday: "long", timeZone: "UTC" }));
23
+ const dayEnumName = dayDate.toLocaleDateString("en", { weekday: "long", timeZone: "UTC" }).toUpperCase();
24
+ this._dayMap[dayEnumName] = dayName;
25
+ }
26
+ }
27
+ }
@@ -0,0 +1,45 @@
1
+ import { Language, LANGUAGE } from "./../enums/language";
2
+
3
+ export default class LanguageEnumNormalizer {
4
+ static getTmrLanguage(lang: Language): LANGUAGE {
5
+ switch (lang) {
6
+ case Language.Slovak:
7
+ return LANGUAGE.sk;
8
+ case Language.English:
9
+ return LANGUAGE.en;
10
+ case Language.Czech:
11
+ return LANGUAGE.cs;
12
+ case Language.German:
13
+ return LANGUAGE.de;
14
+ case Language.Polish:
15
+ return LANGUAGE.pl;
16
+ case Language.Italian:
17
+ return LANGUAGE.it;
18
+ case Language.Hungarian:
19
+ return LANGUAGE.hu;
20
+ default:
21
+ return null as any;
22
+ }
23
+ }
24
+
25
+ static getFrontendLanguage(lang: LANGUAGE): Language {
26
+ switch (lang) {
27
+ case LANGUAGE.sk:
28
+ return Language.Slovak;
29
+ case LANGUAGE.en:
30
+ return Language.English;
31
+ case LANGUAGE.cs:
32
+ return Language.Czech;
33
+ case LANGUAGE.de:
34
+ return Language.German;
35
+ case LANGUAGE.pl:
36
+ return Language.Polish;
37
+ case LANGUAGE.it:
38
+ return Language.Italian;
39
+ case LANGUAGE.hu:
40
+ return Language.Hungarian;
41
+ default:
42
+ return null as any;
43
+ }
44
+ }
45
+ }
@@ -0,0 +1,14 @@
1
+ import { LANGUAGE, Language } from "./../enums/language";
2
+ import { PortalUtils } from "../utils/utils";
3
+ import { LanguageUtils } from "../utils/language-utils";
4
+ import PowerduckState from "../../app/powerduck-state";
5
+
6
+ export default class LanguageTranslator {
7
+ static getString(lang: LANGUAGE | Language) {
8
+ if (PortalUtils.isString(lang)) {
9
+ lang = LanguageUtils.getLanguageEnum(lang as any) as any;
10
+ }
11
+
12
+ return PowerduckState.getResourceValue('language' + lang as any);
13
+ }
14
+ }
@@ -0,0 +1,4 @@
1
+ export enum TryCallApiResult {
2
+ Success = 0,
3
+ Error = 1,
4
+ }
@@ -0,0 +1,7 @@
1
+ export enum CURRENCY_CODE {
2
+ PLN = "PLN",
3
+ CZK = "CZK",
4
+ EUR = "EUR",
5
+ USD = "USD",
6
+ GBP = "GBP",
7
+ }
@@ -0,0 +1,9 @@
1
+ export enum DAY {
2
+ MONDAY = "MONDAY",
3
+ TUESDAY = "TUESDAY",
4
+ WEDNESDAY = "WEDNESDAY",
5
+ THURSDAY = "THURSDAY",
6
+ FRIDAY = "FRIDAY",
7
+ SATURDAY = "SATURDAY",
8
+ SUNDAY = "SUNDAY",
9
+ }
@@ -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,5 @@
1
+ export enum AppMenuType {
2
+ MenuItem = 0,
3
+ Separator = 1,
4
+ }
5
+
@@ -0,0 +1,4 @@
1
+ export enum ModalSectionMode {
2
+ fieldSet = 0,
3
+ navPills = 1,
4
+ }
@@ -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
- import { Currency } from "../enums";
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: Currency | string | any): string {
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: Currency | string | any) {
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 { Currency, Language } from "../enums";
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
- // retVal.sort(function (a, b) {
69
- // return a.text.localeCompare(b.text);
70
- // });
67
+ retVal.sort(function (a, b) {
68
+ return a.text.localeCompare(b.text);
69
+ });
71
70
  } catch (e) {
72
- // retVal.sortBy('text');
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 | Currency | number | any): 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
  }
@@ -1,4 +1,4 @@
1
- import { Language } from "../enums";
1
+ import { Language } from "../enums/language";
2
2
  import { isNullOrEmpty } from "./is-null-or-empty";
3
3
  import { LanguageUtils } from "./language-utils";
4
4
 
@@ -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
+ }
@@ -1,4 +1,4 @@
1
- import { AppMenuType } from "../../common/enums";
1
+ import { AppMenuType } from "../../common/enums/menu";
2
2
 
3
3
  export interface AppMenuItem {
4
4
  text?: string;
@@ -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);