@libs-ui/components-inputs-multi-language 0.2.356-24 → 0.2.356-25
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/esm2022/interfaces/multi-language.interface.mjs +1 -1
- package/esm2022/items/items.component.mjs +26 -50
- package/esm2022/multi-language.component.mjs +15 -31
- package/fesm2022/libs-ui-components-inputs-multi-language.mjs +38 -78
- package/fesm2022/libs-ui-components-inputs-multi-language.mjs.map +1 -1
- package/interfaces/multi-language.interface.d.ts +4 -0
- package/items/items.component.d.ts +5 -15
- package/multi-language.component.d.ts +5 -8
- package/package.json +10 -10
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Pipe, signal, computed, input, model, output, effect, untracked, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
2
|
+
import { Pipe, signal, computed, viewChildren, input, model, output, effect, untracked, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
3
|
import { LibsUiComponentsButtonsButtonComponent } from '@libs-ui/components-buttons-button';
|
|
4
4
|
import { LibsUiComponentsDropdownComponent } from '@libs-ui/components-dropdown';
|
|
5
|
-
import {
|
|
5
|
+
import { LibsUiComponentsInputsQuill2xComponent } from '@libs-ui/components-inputs-quill2x';
|
|
6
6
|
import { LibsUiComponentsInputsValidComponent } from '@libs-ui/components-inputs-valid';
|
|
7
7
|
import { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';
|
|
8
8
|
import { LibsUiPipesEscapeHtmlPipe } from '@libs-ui/pipes-escape-html';
|
|
@@ -486,8 +486,8 @@ class LibsUiComponentsInputsMultiLanguageComponent {
|
|
|
486
486
|
validRequiredDefault = signal(validRequired());
|
|
487
487
|
listConfigItem = computed(() => listConfigItem(this.options()));
|
|
488
488
|
httpRequestDetail = computed(() => httpRequestDetail(this.options()));
|
|
489
|
-
|
|
490
|
-
|
|
489
|
+
inputComponentRefs = viewChildren(LibsUiComponentsInputsValidComponent);
|
|
490
|
+
quillComponentRefs = viewChildren(LibsUiComponentsInputsQuill2xComponent);
|
|
491
491
|
onDestroy = new Subject();
|
|
492
492
|
optionsLanguage = input(langOptions());
|
|
493
493
|
zIndex = input();
|
|
@@ -518,9 +518,9 @@ class LibsUiComponentsInputsMultiLanguageComponent {
|
|
|
518
518
|
onlyAcceptNegativeValue = input();
|
|
519
519
|
validOneDefaultMultiLanguage = input();
|
|
520
520
|
classIconAddLanguage = input('libs-ui-icon-add', { transform: (value) => value || 'libs-ui-icon-add' });
|
|
521
|
+
validPattern = input();
|
|
521
522
|
outEventMultiLanguage = output();
|
|
522
523
|
outChangeTypeLanguage = output();
|
|
523
|
-
outFunctionsControl = output();
|
|
524
524
|
outChangeValueInput = output();
|
|
525
525
|
constructor() {
|
|
526
526
|
effect(() => {
|
|
@@ -582,7 +582,6 @@ class LibsUiComponentsInputsMultiLanguageComponent {
|
|
|
582
582
|
});
|
|
583
583
|
}
|
|
584
584
|
ngOnInit() {
|
|
585
|
-
this.outFunctionsControl.emit(this.FunctionsControl);
|
|
586
585
|
this.extendClass.update((value) => `${value || ''} ${this.viewPosition() === 'row' ? 'flex-row' : 'flex-col'}`);
|
|
587
586
|
}
|
|
588
587
|
get FunctionsControl() {
|
|
@@ -609,20 +608,6 @@ class LibsUiComponentsInputsMultiLanguageComponent {
|
|
|
609
608
|
}
|
|
610
609
|
return Array.from(selected);
|
|
611
610
|
}
|
|
612
|
-
handlerInputFunctionControl(event, key) {
|
|
613
|
-
this.inputFunctionControl.update((map) => {
|
|
614
|
-
const next = new Map(map);
|
|
615
|
-
next.set(key, event);
|
|
616
|
-
return next;
|
|
617
|
-
});
|
|
618
|
-
}
|
|
619
|
-
handlerQuillFunctionControl(event, index) {
|
|
620
|
-
this.quillFunctionControl.update((map) => {
|
|
621
|
-
const next = new Map(map);
|
|
622
|
-
next.set(index, event);
|
|
623
|
-
return next;
|
|
624
|
-
});
|
|
625
|
-
}
|
|
626
611
|
handlerSelectChange(event, keyOld) {
|
|
627
612
|
if (!event || event.key === keyOld) {
|
|
628
613
|
return;
|
|
@@ -655,7 +640,6 @@ class LibsUiComponentsInputsMultiLanguageComponent {
|
|
|
655
640
|
void this.validateIsMultiKey();
|
|
656
641
|
this.languageDisplay.update((value) => value.filter((item) => item !== key));
|
|
657
642
|
this.outEventMultiLanguage.emit({ action: 'remove', data: this.dataLanguageChange() });
|
|
658
|
-
this.inputFunctionControl().delete(key);
|
|
659
643
|
}
|
|
660
644
|
getData() {
|
|
661
645
|
if (this.singleLanguage()) {
|
|
@@ -711,13 +695,13 @@ class LibsUiComponentsInputsMultiLanguageComponent {
|
|
|
711
695
|
}
|
|
712
696
|
async validate() {
|
|
713
697
|
let valid = true;
|
|
714
|
-
for (const control of this.
|
|
715
|
-
if (!(await control.checkIsValid())) {
|
|
698
|
+
for (const control of this.inputComponentRefs()) {
|
|
699
|
+
if (!(await control.FunctionsControl.checkIsValid())) {
|
|
716
700
|
valid = false;
|
|
717
701
|
}
|
|
718
702
|
}
|
|
719
|
-
for (const
|
|
720
|
-
if (!(await
|
|
703
|
+
for (const quillCmp of this.quillComponentRefs()) {
|
|
704
|
+
if (!(await quillCmp.FunctionsControl.checkIsValid())) {
|
|
721
705
|
valid = false;
|
|
722
706
|
}
|
|
723
707
|
}
|
|
@@ -766,8 +750,8 @@ class LibsUiComponentsInputsMultiLanguageComponent {
|
|
|
766
750
|
}
|
|
767
751
|
async checkValidInput() {
|
|
768
752
|
let valid = true;
|
|
769
|
-
for (const control of this.
|
|
770
|
-
if (!(await control.checkIsValid())) {
|
|
753
|
+
for (const control of this.inputComponentRefs()) {
|
|
754
|
+
if (!(await control.FunctionsControl.checkIsValid())) {
|
|
771
755
|
valid = false;
|
|
772
756
|
}
|
|
773
757
|
}
|
|
@@ -849,7 +833,7 @@ class LibsUiComponentsInputsMultiLanguageComponent {
|
|
|
849
833
|
this.onDestroy.complete();
|
|
850
834
|
}
|
|
851
835
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsInputsMultiLanguageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
852
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsInputsMultiLanguageComponent, isStandalone: true, selector: "libs_ui-components-inputs-multi_language", inputs: { optionsLanguage: { classPropertyName: "optionsLanguage", publicName: "optionsLanguage", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, viewType: { classPropertyName: "viewType", publicName: "viewType", isSignal: true, isRequired: false, transformFunction: null }, singleLanguage: { classPropertyName: "singleLanguage", publicName: "singleLanguage", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, validRequired: { classPropertyName: "validRequired", publicName: "validRequired", isSignal: true, isRequired: false, transformFunction: null }, ignoreAdd: { classPropertyName: "ignoreAdd", publicName: "ignoreAdd", isSignal: true, isRequired: false, transformFunction: null }, titleField: { classPropertyName: "titleField", publicName: "titleField", isSignal: true, isRequired: false, transformFunction: null }, keyHeader: { classPropertyName: "keyHeader", publicName: "keyHeader", isSignal: true, isRequired: false, transformFunction: null }, textArea: { classPropertyName: "textArea", publicName: "textArea", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, extendClass: { classPropertyName: "extendClass", publicName: "extendClass", isSignal: true, isRequired: false, transformFunction: null }, extendClassContent: { classPropertyName: "extendClassContent", publicName: "extendClassContent", isSignal: true, isRequired: false, transformFunction: null }, viewPosition: { classPropertyName: "viewPosition", publicName: "viewPosition", isSignal: true, isRequired: false, transformFunction: null }, ignoreRemove: { classPropertyName: "ignoreRemove", publicName: "ignoreRemove", isSignal: true, isRequired: false, transformFunction: null }, validMaxLength: { classPropertyName: "validMaxLength", publicName: "validMaxLength", isSignal: true, isRequired: false, transformFunction: null }, validMinLength: { classPropertyName: "validMinLength", publicName: "validMinLength", isSignal: true, isRequired: false, transformFunction: null }, countCharacters: { classPropertyName: "countCharacters", publicName: "countCharacters", isSignal: true, isRequired: false, transformFunction: null }, viewContent: { classPropertyName: "viewContent", publicName: "viewContent", isSignal: true, isRequired: false, transformFunction: null }, classIncludeKey: { classPropertyName: "classIncludeKey", publicName: "classIncludeKey", isSignal: true, isRequired: false, transformFunction: null }, classIncludeValue: { classPropertyName: "classIncludeValue", publicName: "classIncludeValue", isSignal: true, isRequired: false, transformFunction: null }, dataLanguage: { classPropertyName: "dataLanguage", publicName: "dataLanguage", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, acceptNegativeValue: { classPropertyName: "acceptNegativeValue", publicName: "acceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, valueUpDownNumber: { classPropertyName: "valueUpDownNumber", publicName: "valueUpDownNumber", isSignal: true, isRequired: false, transformFunction: null }, maxValueNumber: { classPropertyName: "maxValueNumber", publicName: "maxValueNumber", isSignal: true, isRequired: false, transformFunction: null }, onlyAcceptNegativeValue: { classPropertyName: "onlyAcceptNegativeValue", publicName: "onlyAcceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, validOneDefaultMultiLanguage: { classPropertyName: "validOneDefaultMultiLanguage", publicName: "validOneDefaultMultiLanguage", isSignal: true, isRequired: false, transformFunction: null }, classIconAddLanguage: { classPropertyName: "classIconAddLanguage", publicName: "classIconAddLanguage", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { data: "dataChange", ignoreAdd: "ignoreAddChange", extendClass: "extendClassChange", dataLanguage: "dataLanguageChange", outEventMultiLanguage: "outEventMultiLanguage", outChangeTypeLanguage: "outChangeTypeLanguage", outFunctionsControl: "outFunctionsControl", outChangeValueInput: "outChangeValueInput" }, ngImport: i0, template: "<div class=\"w-full flex flex-col gap-[8px]\">\n @if (titleField(); as titleField) {\n <div class=\"libs-ui-font-h6m\">{{ titleField | translate }}</div>\n }\n <div\n class=\"flex flex-col gap-[8px]\"\n [class.gap-[8px]]=\"viewPosition() === 'row'\"\n [class.gap-[16px]]=\"viewPosition() === 'column'\">\n @for (key of languageDisplay(); track key) {\n @if (!viewContent()) {\n <div class=\"flex gap-[8px] w-full {{ extendClass() }}\">\n @if (!singleLanguage()) {\n <div>\n <libs_ui-components-dropdown\n [listConfig]=\"listConfigItem()\"\n [httpRequestDetailItemById]=\"httpRequestDetail()\"\n [listKeysDisable]=\"languageDisplay() | LibsUiComponentsInputsMultiLanguageGetDisableKeyPipe: key\"\n [readonly]=\"$index === 0 || readonly()\"\n [listKeySelected]=\"key\"\n [zIndex]=\"zIndex()\"\n [classInclude]=\"'w-[150px]'\"\n [listHiddenInputSearch]=\"true\"\n [listHasButtonUnSelectOption]=\"false\"\n (outSelectKey)=\"handlerSelectChange($event, key)\" />\n </div>\n }\n <div class=\"flex flex-1 gap-[12px] {{ extendClassContent() }}\">\n @for (item of data(); track item; let itemIndex = $index) {\n @if (item.type === 'editor') {\n <div class=\"w-full min-w-0 h-[250px]\">\n @if (item.keyBindData | LibsUiComponentsInputsMultiLanguageGetItemPipe: dataLanguageChange; as itemMap) {\n @let constHtmlPlaceholder = item.placeholder || ' ';\n <libs_ui-components-inputs-quill\n [(item)]=\"itemMap\"\n [fieldNameBind]=\"key\"\n [validRequired]=\"$index === 0 && data().length <= 1 ? validRequiredDefault() : validRequired()\"\n [placeholder]=\"constHtmlPlaceholder | translate\"\n [readonly]=\"readonly()\"\n (outFocus)=\"handlerInputChange()\"\n (outChange)=\"handlerInputChange()\"\n (outFunctionsControl)=\"handlerQuillFunctionControl($event, itemIndex)\" />\n }\n </div>\n } @else {\n <div class=\"w-full min-w-0 {{ item.classIncludeInput }}\">\n @if (item.keyBindData | LibsUiComponentsInputsMultiLanguageGetItemPipe: dataLanguageChange; as itemMap) {\n @let constHtmlPlaceholder = item.placeholder || ' ';\n <libs_ui-components-inputs-valid\n [dataType]=\"item.type === 'number' ? 'int' : item.type === 'text' ? 'string' : item.type === 'bigint' ? 'bigint' : 'float'\"\n [(item)]=\"itemMap\"\n [fieldNameBind]=\"key\"\n [tagInput]=\"textArea() ? 'textarea' : 'input'\"\n [placeholder]=\"constHtmlPlaceholder | translate\"\n [emitEmptyInDataTypeNumber]=\"true\"\n [validRequired]=\"\n validOneDefaultMultiLanguage()\n ? { isRequired: validOneDefaultMultiLanguage() === key ? true : false }\n : $index === 0 && data().length <= 1\n ? validRequiredDefault()\n : $index === 0 && data().length > 1 && item.validRequiredLangDefault\n ? item.validRequiredLangDefault\n : item.validRequired\n ? item.validRequired\n : validRequired() || { isRequired: false }\n \"\n [unitsRight]=\"currencyUnits()\"\n [keySelectedUnitRight]=\"key\"\n [readonly]=\"readonly()\"\n [showCount]=\"countCharacters()\"\n [maxLength]=\"validMaxLength().length ? validMaxLength().length : undefined\"\n [fixedFloat]=\"item.type === 'bigint' ? 4 : 14\"\n [validMinLength]=\"\n validOneDefaultMultiLanguage() && validOneDefaultMultiLanguage() !== key && !itemMap()[key]\n ? undefined\n : { length: validMinLength()?.length || -1, message: 'i18n_minimum_length_number', interpolateParams: { number: validMinLength()?.length } }\n \"\n [acceptNegativeValue]=\"acceptNegativeValue()\"\n [valueUpDownNumber]=\"valueUpDownNumber()\"\n [maxValueNumber]=\"maxValueNumber()\"\n [onlyAcceptNegativeValue]=\"onlyAcceptNegativeValue()\"\n (outValueChange)=\"handlerInputChange()\"\n (outFunctionsControl)=\"handlerInputFunctionControl($event, key)\" />\n }\n </div>\n }\n }\n @if (!singleLanguage()) {\n <div\n class=\"flex items-center w-[16px]\"\n [class.h-[32px]]=\"data()[0].type !== 'editor'\"\n [class.h-[40px]]=\"data()[0].type === 'editor'\">\n @if ($index > 0 && data().length === 1 && !ignoreRemove() && !readonly()) {\n <libs_ui-components-buttons-button\n [type]=\"'button-link-custom'\"\n [buttonCustom]=\"{\n configStepColor: {\n text: '#6a7383',\n text_hover: '#ee2d41',\n text_active: '#ee2d41',\n text_disable: '#6a7383',\n },\n rootColor: '#6a7383',\n }\"\n [iconOnlyType]=\"true\"\n [popover]=\"{ config: { content: 'i18n_delete', zIndex: 1205 } }\"\n [classIconLeft]=\"'libs-ui-icon-remove'\"\n [classInclude]=\"'!p-0'\"\n (outClick)=\"handlerRemoveLanguage($event, key)\" />\n }\n @if ($index === 0 && options().length !== languageDisplay().length && viewType() !== 'integer' && !readonly()) {\n <libs_ui-components-buttons-button\n [type]=\"'button-link-third'\"\n [iconOnlyType]=\"true\"\n [classIconLeft]=\"classIconAddLanguage()\"\n [classInclude]=\"'!p-0'\"\n (outClick)=\"handlerAddLanguage($event)\" />\n }\n </div>\n }\n </div>\n </div>\n }\n @if (viewContent()) {\n <div class=\"flex gap-[4px]\">\n @if (!singleLanguage()) {\n <div class=\"flex\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [classInclude]=\"classIncludeKey()\"\n [innerHTML]=\"key | LibsUiComponentsInputsMultiLanguageDisplayLanguagePipe: options()\" />\n </div>\n }\n <div class=\"flex flex-1 min-w-0\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [classInclude]=\"classIncludeValue()\"\n [innerHTML]=\"(dataLanguageChange()[key] || dataLanguageChange()[key] === 0 ? dataLanguageChange()[key] + '' : '') | LibsUiPipesEscapeHtmlPipe\"\n [config]=\"{ zIndex: zIndex() }\" />\n </div>\n </div>\n }\n }\n </div>\n @if (viewType() === 'integer' && !this.ignoreAdd() && !readonly()) {\n <libs_ui-components-buttons-button\n [type]=\"'button-link-primary'\"\n [classIconLeft]=\"'libs-ui-icon-add'\"\n [classLabel]=\"'libs-ui-font-h6mi'\"\n [classInclude]=\"'!px-0 !py-[2px]'\"\n [label]=\"'i18n_add_new'\"\n (outClick)=\"handlerAddLanguage($event)\" />\n }\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsDropdownComponent, selector: "libs_ui-components-dropdown", inputs: ["useXssFilter", "popoverElementRefCustom", "classInclude", "ignoreStopPropagationEvent", "flagMouse", "flagMouseContent", "popoverCustomConfig", "isNgContent", "zIndex", "convertItemSelected", "getPopoverItemSelected", "httpRequestDetailItemById", "lengthKeys", "textDisplayWhenNoSelect", "textDisplayWhenMultiSelect", "classIncludeTextDisplayWhenNoSelect", "fieldLabel", "fieldGetLabel", "labelPopoverConfig", "labelPopoverFullWidth", "hasContentUnitRight", "listSearchNoDataTemplateRef", "dropdownTemplateRefNotSearchNoData", "fieldGetImage", "imageSize", "typeShape", "fieldGetIcon", "fieldGetTextAvatar", "fieldGetColorAvatar", "classAvatarInclude", "getLastTextAfterSpace", "linkImageError", "showError", "showBorderError", "disable", "readonly", "labelConfig", "disableLabel", "listSearchConfig", "isSearchOnline", "listHiddenInputSearch", "listSearchPadding", "listKeySearch", "listDividerClassInclude", "listConfig", "listButtonsOther", "listHasButtonUnSelectOption", "listClickExactly", "listBackgroundCustom", "listMaxItemShow", "listKeySelected", "listMultiKeySelected", "listKeysDisable", "listKeysHidden", "validRequired", "validMaxItemSelected", "changeValidUndefinedResetError", "allowSelectItemMultiple", "focusInputSearch", "onlyEmitDataWhenReset", "resetKeyWhenSelectAllKey", "listConfigHasDivider", "classIncludeIcon", "classIncludeContent", "listIgnoreClassDisableDefaultWhenUseKeysDisableItem", "tabKeyActive", "tabsConfig", "ignoreBorderBottom"], outputs: ["flagMouseChange", "flagMouseContentChange", "lengthKeysChange", "showBorderErrorChange", "listKeySelectedChange", "listMultiKeySelectedChange", "tabKeyActiveChange", "outSelectKey", "outSelectMultiKey", "outFunctionsControl", "outValidEvent", "outChangStageFlagMouse", "outDataChange", "outClickButtonOther", "outShowList", "outChangeTabKeyActive"] }, { kind: "component", type: LibsUiComponentsInputsValidComponent, selector: "libs_ui-components-inputs-valid", inputs: ["item", "labelConfig", "emitEmptyInDataTypeNumber", "ignoreBlockInputMaxValue", "fieldNameBind", "showCount", "typeComponentSelectItem", "valueComponentSelectItem", "disableComponentSelectItem", "tagInput", "dataType", "typeInput", "modeInput", "resetAutoCompletePassword", "textAreaEnterNotNewLine", "fixedFloat", "acceptNegativeValue", "valueUpDownNumber", "ignoreWidthInput100", "classIncludeInput", "classContainerInput", "readonly", "disable", "noBorder", "backgroundNone", "useColorModeExist", "placeholder", "keepPlaceholderOnly", "classContainerBottomInput", "autoRemoveEmoji", "defaultHeight", "maxHeightTextArea", "minHeightTextArea", "ignoreShowError", "ignoreShowMessageError", "borderError", "iconLeftClass", "popoverContentIconLeft", "iconRightClass", "popoverContentIconRight", "zIndexPopoverContent", "unitsLeft", "configUnitLeft", "keySelectedUnitLeft", "unitsRight", "configUnitRight", "keySelectedUnitRight", "maxValueNumber", "minValueNumber", "ignoreContentLeft", "ignoreContentRight", "isBaselineStyle", "valuePatternShowError", "validPattern", "validRequired", "validMinLength", "validMinValue", "validMaxValue", "validMaxLength", "functionValid", "maxLength", "positionMessageErrorStartInput", "classInclude", "resize", "templateLeftBottomInput", "templateRightBottomInput", "onlyAcceptNegativeValue", "autoAddZeroLessThan10InTypeInt", "maxLengthNumberCount", "classMessageErrorInclude", "ignoreStopPropagationEvent", "ignoreUnitRightClassReadOnly", "paddingRightCustomSpecific", "focusTimeOut", "debounceTimeValidate"], outputs: ["itemChange", "outValueChange", "outSelect", "outIconLeft", "outIconRight", "outClickButtonLabel", "outSwitchEventLabel", "outLabelRightClick", "outEnterInputEvent", "outHeightAreaChange", "outFunctionsControl", "outFocusAndBlur", "outChangeValueByButtonUpDown"] }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "pipe", type: LibsUiComponentsInputsMultiLanguageGetDisableKeyPipe, name: "LibsUiComponentsInputsMultiLanguageGetDisableKeyPipe" }, { kind: "pipe", type: LibsUiComponentsInputsMultiLanguageDisplayLanguagePipe, name: "LibsUiComponentsInputsMultiLanguageDisplayLanguagePipe" }, { kind: "pipe", type: LibsUiComponentsInputsMultiLanguageGetItemPipe, name: "LibsUiComponentsInputsMultiLanguageGetItemPipe" }, { kind: "pipe", type: LibsUiPipesEscapeHtmlPipe, name: "LibsUiPipesEscapeHtmlPipe" }, { kind: "component", type: LibsUiComponentsInputsQuillComponent, selector: "libs_ui-components-inputs-quill", inputs: ["isShowToolBar", "isToolbarPositionFixed", "classIncludeToolbar", "stylesIncludeToolbar", "toolbarConfig", "placeholder", "label", "item", "autoUpdateValueWhenTextChange", "fieldNameBind", "readonly", "showErrorLabel", "showErrorBorder", "onlyShowErrorBorderInContent", "classIncludeTemplate", "classInclude", "handlersExpand", "validRequired", "validMinLength", "validMaxLength", "zIndex", "dataConfigMention", "blotsRegister", "autoFocus", "focusBottom", "blockUndoRedoKeyboard", "templateToolBarPersonalize", "template", "uploadImageConfig", "heightAuto", "elementScrollHeightAuto", "ignoreShowPopupEditLink", "ignoreCommunicateMicroEventPopup"], outputs: ["itemChange", "outShowPopupEditLink", "outMessageError", "outBlur", "outFocus", "outChange", "outFunctionsControl", "outSelectionChange", "outTextChange", "outContextMenu"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
836
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsInputsMultiLanguageComponent, isStandalone: true, selector: "libs_ui-components-inputs-multi_language", inputs: { optionsLanguage: { classPropertyName: "optionsLanguage", publicName: "optionsLanguage", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, viewType: { classPropertyName: "viewType", publicName: "viewType", isSignal: true, isRequired: false, transformFunction: null }, singleLanguage: { classPropertyName: "singleLanguage", publicName: "singleLanguage", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, validRequired: { classPropertyName: "validRequired", publicName: "validRequired", isSignal: true, isRequired: false, transformFunction: null }, ignoreAdd: { classPropertyName: "ignoreAdd", publicName: "ignoreAdd", isSignal: true, isRequired: false, transformFunction: null }, titleField: { classPropertyName: "titleField", publicName: "titleField", isSignal: true, isRequired: false, transformFunction: null }, keyHeader: { classPropertyName: "keyHeader", publicName: "keyHeader", isSignal: true, isRequired: false, transformFunction: null }, textArea: { classPropertyName: "textArea", publicName: "textArea", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, extendClass: { classPropertyName: "extendClass", publicName: "extendClass", isSignal: true, isRequired: false, transformFunction: null }, extendClassContent: { classPropertyName: "extendClassContent", publicName: "extendClassContent", isSignal: true, isRequired: false, transformFunction: null }, viewPosition: { classPropertyName: "viewPosition", publicName: "viewPosition", isSignal: true, isRequired: false, transformFunction: null }, ignoreRemove: { classPropertyName: "ignoreRemove", publicName: "ignoreRemove", isSignal: true, isRequired: false, transformFunction: null }, validMaxLength: { classPropertyName: "validMaxLength", publicName: "validMaxLength", isSignal: true, isRequired: false, transformFunction: null }, validMinLength: { classPropertyName: "validMinLength", publicName: "validMinLength", isSignal: true, isRequired: false, transformFunction: null }, countCharacters: { classPropertyName: "countCharacters", publicName: "countCharacters", isSignal: true, isRequired: false, transformFunction: null }, viewContent: { classPropertyName: "viewContent", publicName: "viewContent", isSignal: true, isRequired: false, transformFunction: null }, classIncludeKey: { classPropertyName: "classIncludeKey", publicName: "classIncludeKey", isSignal: true, isRequired: false, transformFunction: null }, classIncludeValue: { classPropertyName: "classIncludeValue", publicName: "classIncludeValue", isSignal: true, isRequired: false, transformFunction: null }, dataLanguage: { classPropertyName: "dataLanguage", publicName: "dataLanguage", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, acceptNegativeValue: { classPropertyName: "acceptNegativeValue", publicName: "acceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, valueUpDownNumber: { classPropertyName: "valueUpDownNumber", publicName: "valueUpDownNumber", isSignal: true, isRequired: false, transformFunction: null }, maxValueNumber: { classPropertyName: "maxValueNumber", publicName: "maxValueNumber", isSignal: true, isRequired: false, transformFunction: null }, onlyAcceptNegativeValue: { classPropertyName: "onlyAcceptNegativeValue", publicName: "onlyAcceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, validOneDefaultMultiLanguage: { classPropertyName: "validOneDefaultMultiLanguage", publicName: "validOneDefaultMultiLanguage", isSignal: true, isRequired: false, transformFunction: null }, classIconAddLanguage: { classPropertyName: "classIconAddLanguage", publicName: "classIconAddLanguage", isSignal: true, isRequired: false, transformFunction: null }, validPattern: { classPropertyName: "validPattern", publicName: "validPattern", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { data: "dataChange", ignoreAdd: "ignoreAddChange", extendClass: "extendClassChange", dataLanguage: "dataLanguageChange", outEventMultiLanguage: "outEventMultiLanguage", outChangeTypeLanguage: "outChangeTypeLanguage", outChangeValueInput: "outChangeValueInput" }, viewQueries: [{ propertyName: "inputComponentRefs", predicate: LibsUiComponentsInputsValidComponent, descendants: true, isSignal: true }, { propertyName: "quillComponentRefs", predicate: LibsUiComponentsInputsQuill2xComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"w-full flex flex-col gap-[8px]\">\n @if (titleField(); as titleField) {\n <div class=\"libs-ui-font-h6m\">{{ titleField | translate }}</div>\n }\n <div\n class=\"flex flex-col gap-[8px]\"\n [class.gap-[8px]]=\"viewPosition() === 'row'\"\n [class.gap-[16px]]=\"viewPosition() === 'column'\">\n @for (key of languageDisplay(); track key) {\n @if (!viewContent()) {\n <div class=\"flex gap-[8px] w-full {{ extendClass() }}\">\n @if (!singleLanguage()) {\n <div>\n <libs_ui-components-dropdown\n [listConfig]=\"listConfigItem()\"\n [httpRequestDetailItemById]=\"httpRequestDetail()\"\n [listKeysDisable]=\"languageDisplay() | LibsUiComponentsInputsMultiLanguageGetDisableKeyPipe: key\"\n [readonly]=\"$index === 0 || readonly()\"\n [listKeySelected]=\"key\"\n [zIndex]=\"zIndex()\"\n [classInclude]=\"'w-[150px]'\"\n [listHiddenInputSearch]=\"true\"\n [listHasButtonUnSelectOption]=\"false\"\n (outSelectKey)=\"handlerSelectChange($event, key)\" />\n </div>\n }\n <div class=\"flex flex-1 gap-[12px] {{ extendClassContent() }}\">\n @for (item of data(); track item) {\n @if (item.type === 'editor') {\n <div class=\"w-full min-w-0\">\n @if (item.keyBindData | LibsUiComponentsInputsMultiLanguageGetItemPipe: dataLanguageChange; as itemMap) {\n @let constHtmlPlaceholder = item.placeholder || ' ';\n <libs_ui-components-inputs-quill2x\n [(item)]=\"itemMap\"\n [fieldBind]=\"key\"\n [resize]=\"item.resize || 'vertical'\"\n [minHeightEditorContentDefault]=\"item.minHeightEditorContentDefault || 160\"\n [maxHeightEditorContentDefault]=\"item.maxHeightEditorContentDefault\"\n [heightEditorContentDefault]=\"item.heightEditorContentDefault\"\n [validRequired]=\"$index === 0 && data().length <= 1 ? validRequiredDefault() : validRequired()\"\n [placeholder]=\"constHtmlPlaceholder | translate\"\n [readonly]=\"readonly()\"\n (outFocus)=\"handlerInputChange()\"\n (outChange)=\"handlerInputChange()\" />\n }\n </div>\n } @else {\n <div class=\"w-full min-w-0 {{ item.classIncludeInput }}\">\n @if (item.keyBindData | LibsUiComponentsInputsMultiLanguageGetItemPipe: dataLanguageChange; as itemMap) {\n @let constHtmlPlaceholder = item.placeholder || ' ';\n <libs_ui-components-inputs-valid\n [dataType]=\"item.type === 'number' ? 'int' : item.type === 'text' ? 'string' : item.type === 'bigint' ? 'bigint' : 'float'\"\n [(item)]=\"itemMap\"\n [fieldNameBind]=\"key\"\n [tagInput]=\"textArea() ? 'textarea' : 'input'\"\n [placeholder]=\"constHtmlPlaceholder | translate\"\n [emitEmptyInDataTypeNumber]=\"true\"\n [validRequired]=\"\n validOneDefaultMultiLanguage()\n ? { isRequired: validOneDefaultMultiLanguage() === key ? true : false }\n : $index === 0 && data().length <= 1\n ? validRequiredDefault()\n : $index === 0 && data().length > 1 && item.validRequiredLangDefault\n ? item.validRequiredLangDefault\n : item.validRequired\n ? item.validRequired\n : validRequired() || { isRequired: false }\n \"\n [unitsRight]=\"currencyUnits()\"\n [keySelectedUnitRight]=\"key\"\n [readonly]=\"readonly()\"\n [showCount]=\"countCharacters()\"\n [maxLength]=\"validMaxLength().length ? validMaxLength().length : undefined\"\n [fixedFloat]=\"item.type === 'bigint' ? 4 : 14\"\n [validMinLength]=\"\n validOneDefaultMultiLanguage() && validOneDefaultMultiLanguage() !== key && !itemMap()[key]\n ? undefined\n : { length: validMinLength()?.length || -1, message: 'i18n_minimum_length_number', interpolateParams: { number: validMinLength()?.length } }\n \"\n [validPattern]=\"validPattern()\"\n [acceptNegativeValue]=\"acceptNegativeValue()\"\n [valueUpDownNumber]=\"valueUpDownNumber()\"\n [maxValueNumber]=\"maxValueNumber()\"\n [onlyAcceptNegativeValue]=\"onlyAcceptNegativeValue()\"\n (outValueChange)=\"handlerInputChange()\" />\n }\n </div>\n }\n }\n @if (!singleLanguage()) {\n <div\n class=\"flex items-center w-[16px] shrink-0\"\n [class.h-[32px]]=\"data()[0].type !== 'editor'\"\n [class.h-[44px]]=\"data()[0].type === 'editor'\">\n @if ($index > 0 && data().length === 1 && !ignoreRemove() && !readonly()) {\n <libs_ui-components-buttons-button\n [type]=\"'button-link-custom'\"\n [buttonCustom]=\"{\n configStepColor: {\n text: '#6a7383',\n text_hover: '#ee2d41',\n text_active: '#ee2d41',\n text_disable: '#6a7383',\n },\n rootColor: '#6a7383',\n }\"\n [iconOnlyType]=\"true\"\n [popover]=\"{ config: { content: 'i18n_delete', zIndex: 1205 } }\"\n [classIconLeft]=\"'libs-ui-icon-remove'\"\n [classInclude]=\"'!p-0'\"\n (outClick)=\"handlerRemoveLanguage($event, key)\" />\n }\n @if ($index === 0 && options().length !== languageDisplay().length && viewType() !== 'integer' && !readonly()) {\n <libs_ui-components-buttons-button\n [type]=\"'button-link-third'\"\n [iconOnlyType]=\"true\"\n [classIconLeft]=\"classIconAddLanguage()\"\n [classInclude]=\"'!p-0'\"\n (outClick)=\"handlerAddLanguage($event)\" />\n }\n </div>\n }\n </div>\n </div>\n }\n @if (viewContent()) {\n <div class=\"flex gap-[4px]\">\n @if (!singleLanguage()) {\n <div class=\"flex\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [classInclude]=\"classIncludeKey()\"\n [innerHTML]=\"key | LibsUiComponentsInputsMultiLanguageDisplayLanguagePipe: options()\" />\n </div>\n }\n <div class=\"flex flex-1 min-w-0\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [classInclude]=\"classIncludeValue()\"\n [innerHTML]=\"(dataLanguageChange()[key] || dataLanguageChange()[key] === 0 ? dataLanguageChange()[key] + '' : '') | LibsUiPipesEscapeHtmlPipe\"\n [config]=\"{ zIndex: zIndex() }\" />\n </div>\n </div>\n }\n }\n </div>\n @if (viewType() === 'integer' && !this.ignoreAdd() && !readonly()) {\n <libs_ui-components-buttons-button\n [type]=\"'button-link-primary'\"\n [classIconLeft]=\"'libs-ui-icon-add'\"\n [classLabel]=\"'libs-ui-font-h6mi'\"\n [classInclude]=\"'!px-0 !py-[2px]'\"\n [label]=\"'i18n_add_new'\"\n (outClick)=\"handlerAddLanguage($event)\" />\n }\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsDropdownComponent, selector: "libs_ui-components-dropdown", inputs: ["useXssFilter", "popoverElementRefCustom", "classInclude", "ignoreStopPropagationEvent", "flagMouse", "flagMouseContent", "popoverCustomConfig", "isNgContent", "zIndex", "convertItemSelected", "getPopoverItemSelected", "httpRequestDetailItemById", "lengthKeys", "textDisplayWhenNoSelect", "textDisplayWhenMultiSelect", "classIncludeTextDisplayWhenNoSelect", "fieldLabel", "fieldGetLabel", "labelPopoverConfig", "labelPopoverFullWidth", "hasContentUnitRight", "listSearchNoDataTemplateRef", "dropdownTemplateRefNotSearchNoData", "fieldGetImage", "imageSize", "typeShape", "fieldGetIcon", "fieldGetTextAvatar", "fieldGetColorAvatar", "classAvatarInclude", "getLastTextAfterSpace", "linkImageError", "showError", "showBorderError", "disable", "readonly", "labelConfig", "disableLabel", "listSearchConfig", "isSearchOnline", "listHiddenInputSearch", "listSearchPadding", "listKeySearch", "listDividerClassInclude", "listConfig", "listButtonsOther", "listHasButtonUnSelectOption", "listClickExactly", "listBackgroundCustom", "listMaxItemShow", "listKeySelected", "listMultiKeySelected", "listKeysDisable", "listKeysHidden", "validRequired", "validMaxItemSelected", "changeValidUndefinedResetError", "allowSelectItemMultiple", "focusInputSearch", "onlyEmitDataWhenReset", "resetKeyWhenSelectAllKey", "listConfigHasDivider", "classIncludeIcon", "classIncludeContent", "listIgnoreClassDisableDefaultWhenUseKeysDisableItem", "tabKeyActive", "tabsConfig", "ignoreBorderBottom"], outputs: ["flagMouseChange", "flagMouseContentChange", "lengthKeysChange", "showBorderErrorChange", "listKeySelectedChange", "listMultiKeySelectedChange", "tabKeyActiveChange", "outSelectKey", "outSelectMultiKey", "outFunctionsControl", "outValidEvent", "outChangStageFlagMouse", "outDataChange", "outClickButtonOther", "outShowList", "outChangeTabKeyActive"] }, { kind: "component", type: LibsUiComponentsInputsValidComponent, selector: "libs_ui-components-inputs-valid", inputs: ["item", "labelConfig", "emitEmptyInDataTypeNumber", "ignoreBlockInputMaxValue", "fieldNameBind", "showCount", "typeComponentSelectItem", "valueComponentSelectItem", "disableComponentSelectItem", "tagInput", "dataType", "typeInput", "modeInput", "resetAutoCompletePassword", "textAreaEnterNotNewLine", "fixedFloat", "acceptNegativeValue", "valueUpDownNumber", "ignoreWidthInput100", "classIncludeInput", "classContainerInput", "readonly", "disable", "noBorder", "backgroundNone", "useColorModeExist", "placeholder", "keepPlaceholderOnly", "classContainerBottomInput", "autoRemoveEmoji", "defaultHeight", "maxHeightTextArea", "minHeightTextArea", "ignoreShowError", "ignoreShowMessageError", "borderError", "iconLeftClass", "popoverContentIconLeft", "iconRightClass", "popoverContentIconRight", "zIndexPopoverContent", "unitsLeft", "configUnitLeft", "keySelectedUnitLeft", "unitsRight", "configUnitRight", "keySelectedUnitRight", "maxValueNumber", "minValueNumber", "ignoreContentLeft", "ignoreContentRight", "isBaselineStyle", "valuePatternShowError", "validPattern", "validRequired", "validMinLength", "validMinValue", "validMaxValue", "validMaxLength", "functionValid", "maxLength", "positionMessageErrorStartInput", "classInclude", "resize", "templateLeftBottomInput", "templateRightBottomInput", "onlyAcceptNegativeValue", "autoAddZeroLessThan10InTypeInt", "maxLengthNumberCount", "classMessageErrorInclude", "ignoreStopPropagationEvent", "ignoreUnitRightClassReadOnly", "paddingRightCustomSpecific", "focusTimeOut", "debounceTimeValidate"], outputs: ["itemChange", "outValueChange", "outSelect", "outIconLeft", "outIconRight", "outClickButtonLabel", "outSwitchEventLabel", "outLabelRightClick", "outEnterInputEvent", "outHeightAreaChange", "outFunctionsControl", "outFocusAndBlur", "outChangeValueByButtonUpDown"] }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "pipe", type: LibsUiComponentsInputsMultiLanguageGetDisableKeyPipe, name: "LibsUiComponentsInputsMultiLanguageGetDisableKeyPipe" }, { kind: "pipe", type: LibsUiComponentsInputsMultiLanguageDisplayLanguagePipe, name: "LibsUiComponentsInputsMultiLanguageDisplayLanguagePipe" }, { kind: "pipe", type: LibsUiComponentsInputsMultiLanguageGetItemPipe, name: "LibsUiComponentsInputsMultiLanguageGetItemPipe" }, { kind: "pipe", type: LibsUiPipesEscapeHtmlPipe, name: "LibsUiPipesEscapeHtmlPipe" }, { kind: "component", type: LibsUiComponentsInputsQuill2xComponent, selector: "libs_ui-components-inputs-quill2x", inputs: ["uploadImageConfig", "displayToolbar", "placeholder", "blotsRegister", "readonly", "quillCustomConfig", "label", "item", "fieldBind", "dataConfigMention", "templateToolBarPersonalize", "zIndex", "ignoreShowPopupEditLink", "ignoreCommunicateMicroEventPopup", "handlersExpand", "resizeImagePlugin", "fontSizeDefault", "heightEditorContentDefault", "minHeightEditorContentDefault", "maxHeightEditorContentDefault", "removeNearWhiteColorsOnPaste", "resize", "autoFocus", "focusTimerOnInit", "focusBottom", "validRequired", "validMinLength", "validMaxLength", "showErrorLabel", "showErrorBorder", "ignoreShowBorderErrorToolbar"], outputs: ["itemChange", "outShowPopupEditLink", "outMessageError", "outBlur", "outFocus", "outChange", "outSelectionChange", "outTextChange", "outContextMenu", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
853
837
|
}
|
|
854
838
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsInputsMultiLanguageComponent, decorators: [{
|
|
855
839
|
type: Component,
|
|
@@ -863,8 +847,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
863
847
|
LibsUiComponentsInputsMultiLanguageDisplayLanguagePipe,
|
|
864
848
|
LibsUiComponentsInputsMultiLanguageGetItemPipe,
|
|
865
849
|
LibsUiPipesEscapeHtmlPipe,
|
|
866
|
-
|
|
867
|
-
], template: "<div class=\"w-full flex flex-col gap-[8px]\">\n @if (titleField(); as titleField) {\n <div class=\"libs-ui-font-h6m\">{{ titleField | translate }}</div>\n }\n <div\n class=\"flex flex-col gap-[8px]\"\n [class.gap-[8px]]=\"viewPosition() === 'row'\"\n [class.gap-[16px]]=\"viewPosition() === 'column'\">\n @for (key of languageDisplay(); track key) {\n @if (!viewContent()) {\n <div class=\"flex gap-[8px] w-full {{ extendClass() }}\">\n @if (!singleLanguage()) {\n <div>\n <libs_ui-components-dropdown\n [listConfig]=\"listConfigItem()\"\n [httpRequestDetailItemById]=\"httpRequestDetail()\"\n [listKeysDisable]=\"languageDisplay() | LibsUiComponentsInputsMultiLanguageGetDisableKeyPipe: key\"\n [readonly]=\"$index === 0 || readonly()\"\n [listKeySelected]=\"key\"\n [zIndex]=\"zIndex()\"\n [classInclude]=\"'w-[150px]'\"\n [listHiddenInputSearch]=\"true\"\n [listHasButtonUnSelectOption]=\"false\"\n (outSelectKey)=\"handlerSelectChange($event, key)\" />\n </div>\n }\n <div class=\"flex flex-1 gap-[12px] {{ extendClassContent() }}\">\n @for (item of data(); track item
|
|
850
|
+
LibsUiComponentsInputsQuill2xComponent,
|
|
851
|
+
], template: "<div class=\"w-full flex flex-col gap-[8px]\">\n @if (titleField(); as titleField) {\n <div class=\"libs-ui-font-h6m\">{{ titleField | translate }}</div>\n }\n <div\n class=\"flex flex-col gap-[8px]\"\n [class.gap-[8px]]=\"viewPosition() === 'row'\"\n [class.gap-[16px]]=\"viewPosition() === 'column'\">\n @for (key of languageDisplay(); track key) {\n @if (!viewContent()) {\n <div class=\"flex gap-[8px] w-full {{ extendClass() }}\">\n @if (!singleLanguage()) {\n <div>\n <libs_ui-components-dropdown\n [listConfig]=\"listConfigItem()\"\n [httpRequestDetailItemById]=\"httpRequestDetail()\"\n [listKeysDisable]=\"languageDisplay() | LibsUiComponentsInputsMultiLanguageGetDisableKeyPipe: key\"\n [readonly]=\"$index === 0 || readonly()\"\n [listKeySelected]=\"key\"\n [zIndex]=\"zIndex()\"\n [classInclude]=\"'w-[150px]'\"\n [listHiddenInputSearch]=\"true\"\n [listHasButtonUnSelectOption]=\"false\"\n (outSelectKey)=\"handlerSelectChange($event, key)\" />\n </div>\n }\n <div class=\"flex flex-1 gap-[12px] {{ extendClassContent() }}\">\n @for (item of data(); track item) {\n @if (item.type === 'editor') {\n <div class=\"w-full min-w-0\">\n @if (item.keyBindData | LibsUiComponentsInputsMultiLanguageGetItemPipe: dataLanguageChange; as itemMap) {\n @let constHtmlPlaceholder = item.placeholder || ' ';\n <libs_ui-components-inputs-quill2x\n [(item)]=\"itemMap\"\n [fieldBind]=\"key\"\n [resize]=\"item.resize || 'vertical'\"\n [minHeightEditorContentDefault]=\"item.minHeightEditorContentDefault || 160\"\n [maxHeightEditorContentDefault]=\"item.maxHeightEditorContentDefault\"\n [heightEditorContentDefault]=\"item.heightEditorContentDefault\"\n [validRequired]=\"$index === 0 && data().length <= 1 ? validRequiredDefault() : validRequired()\"\n [placeholder]=\"constHtmlPlaceholder | translate\"\n [readonly]=\"readonly()\"\n (outFocus)=\"handlerInputChange()\"\n (outChange)=\"handlerInputChange()\" />\n }\n </div>\n } @else {\n <div class=\"w-full min-w-0 {{ item.classIncludeInput }}\">\n @if (item.keyBindData | LibsUiComponentsInputsMultiLanguageGetItemPipe: dataLanguageChange; as itemMap) {\n @let constHtmlPlaceholder = item.placeholder || ' ';\n <libs_ui-components-inputs-valid\n [dataType]=\"item.type === 'number' ? 'int' : item.type === 'text' ? 'string' : item.type === 'bigint' ? 'bigint' : 'float'\"\n [(item)]=\"itemMap\"\n [fieldNameBind]=\"key\"\n [tagInput]=\"textArea() ? 'textarea' : 'input'\"\n [placeholder]=\"constHtmlPlaceholder | translate\"\n [emitEmptyInDataTypeNumber]=\"true\"\n [validRequired]=\"\n validOneDefaultMultiLanguage()\n ? { isRequired: validOneDefaultMultiLanguage() === key ? true : false }\n : $index === 0 && data().length <= 1\n ? validRequiredDefault()\n : $index === 0 && data().length > 1 && item.validRequiredLangDefault\n ? item.validRequiredLangDefault\n : item.validRequired\n ? item.validRequired\n : validRequired() || { isRequired: false }\n \"\n [unitsRight]=\"currencyUnits()\"\n [keySelectedUnitRight]=\"key\"\n [readonly]=\"readonly()\"\n [showCount]=\"countCharacters()\"\n [maxLength]=\"validMaxLength().length ? validMaxLength().length : undefined\"\n [fixedFloat]=\"item.type === 'bigint' ? 4 : 14\"\n [validMinLength]=\"\n validOneDefaultMultiLanguage() && validOneDefaultMultiLanguage() !== key && !itemMap()[key]\n ? undefined\n : { length: validMinLength()?.length || -1, message: 'i18n_minimum_length_number', interpolateParams: { number: validMinLength()?.length } }\n \"\n [validPattern]=\"validPattern()\"\n [acceptNegativeValue]=\"acceptNegativeValue()\"\n [valueUpDownNumber]=\"valueUpDownNumber()\"\n [maxValueNumber]=\"maxValueNumber()\"\n [onlyAcceptNegativeValue]=\"onlyAcceptNegativeValue()\"\n (outValueChange)=\"handlerInputChange()\" />\n }\n </div>\n }\n }\n @if (!singleLanguage()) {\n <div\n class=\"flex items-center w-[16px] shrink-0\"\n [class.h-[32px]]=\"data()[0].type !== 'editor'\"\n [class.h-[44px]]=\"data()[0].type === 'editor'\">\n @if ($index > 0 && data().length === 1 && !ignoreRemove() && !readonly()) {\n <libs_ui-components-buttons-button\n [type]=\"'button-link-custom'\"\n [buttonCustom]=\"{\n configStepColor: {\n text: '#6a7383',\n text_hover: '#ee2d41',\n text_active: '#ee2d41',\n text_disable: '#6a7383',\n },\n rootColor: '#6a7383',\n }\"\n [iconOnlyType]=\"true\"\n [popover]=\"{ config: { content: 'i18n_delete', zIndex: 1205 } }\"\n [classIconLeft]=\"'libs-ui-icon-remove'\"\n [classInclude]=\"'!p-0'\"\n (outClick)=\"handlerRemoveLanguage($event, key)\" />\n }\n @if ($index === 0 && options().length !== languageDisplay().length && viewType() !== 'integer' && !readonly()) {\n <libs_ui-components-buttons-button\n [type]=\"'button-link-third'\"\n [iconOnlyType]=\"true\"\n [classIconLeft]=\"classIconAddLanguage()\"\n [classInclude]=\"'!p-0'\"\n (outClick)=\"handlerAddLanguage($event)\" />\n }\n </div>\n }\n </div>\n </div>\n }\n @if (viewContent()) {\n <div class=\"flex gap-[4px]\">\n @if (!singleLanguage()) {\n <div class=\"flex\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [classInclude]=\"classIncludeKey()\"\n [innerHTML]=\"key | LibsUiComponentsInputsMultiLanguageDisplayLanguagePipe: options()\" />\n </div>\n }\n <div class=\"flex flex-1 min-w-0\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [classInclude]=\"classIncludeValue()\"\n [innerHTML]=\"(dataLanguageChange()[key] || dataLanguageChange()[key] === 0 ? dataLanguageChange()[key] + '' : '') | LibsUiPipesEscapeHtmlPipe\"\n [config]=\"{ zIndex: zIndex() }\" />\n </div>\n </div>\n }\n }\n </div>\n @if (viewType() === 'integer' && !this.ignoreAdd() && !readonly()) {\n <libs_ui-components-buttons-button\n [type]=\"'button-link-primary'\"\n [classIconLeft]=\"'libs-ui-icon-add'\"\n [classLabel]=\"'libs-ui-font-h6mi'\"\n [classInclude]=\"'!px-0 !py-[2px]'\"\n [label]=\"'i18n_add_new'\"\n (outClick)=\"handlerAddLanguage($event)\" />\n }\n</div>\n" }]
|
|
868
852
|
}], ctorParameters: () => [] });
|
|
869
853
|
|
|
870
854
|
class LibsUiComponentsInputsMultiLanguageItemsComponent {
|
|
@@ -874,10 +858,8 @@ class LibsUiComponentsInputsMultiLanguageItemsComponent {
|
|
|
874
858
|
validRequired = signal({ isRequired: false });
|
|
875
859
|
validRequiredWhenInputHasValue = signal(undefined);
|
|
876
860
|
dataHeader = signal(undefined);
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
/** Một control multi-language cho mỗi dòng (theo index). */
|
|
880
|
-
multiLanguageByRow = signal(new Map());
|
|
861
|
+
inputComponentRefs = viewChildren(LibsUiComponentsInputsValidComponent);
|
|
862
|
+
multiLanguageComponentRefs = viewChildren(LibsUiComponentsInputsMultiLanguageComponent);
|
|
881
863
|
configItems = input([]);
|
|
882
864
|
dataMultiLanguage = model([{}]);
|
|
883
865
|
zIndex = input();
|
|
@@ -889,8 +871,6 @@ class LibsUiComponentsInputsMultiLanguageItemsComponent {
|
|
|
889
871
|
maxValueNumber = input();
|
|
890
872
|
onlyAcceptNegativeValue = input();
|
|
891
873
|
classIconAddLanguage = input('libs-ui-icon-add', { transform: (value) => value || 'libs-ui-icon-add' });
|
|
892
|
-
outClick = output();
|
|
893
|
-
outFunctionControl = output();
|
|
894
874
|
outChangeValue = output();
|
|
895
875
|
constructor() {
|
|
896
876
|
effect(() => {
|
|
@@ -913,9 +893,6 @@ class LibsUiComponentsInputsMultiLanguageItemsComponent {
|
|
|
913
893
|
});
|
|
914
894
|
});
|
|
915
895
|
}
|
|
916
|
-
ngOnInit() {
|
|
917
|
-
this.outFunctionControl.emit(this.FunctionsControl);
|
|
918
|
-
}
|
|
919
896
|
get FunctionsControl() {
|
|
920
897
|
return {
|
|
921
898
|
checkIsValid: this.validate.bind(this),
|
|
@@ -925,65 +902,48 @@ class LibsUiComponentsInputsMultiLanguageItemsComponent {
|
|
|
925
902
|
/**
|
|
926
903
|
* Mỗi dòng cần một bản `data` (shallow copy từng `IDataItem`) để multi-language con không dùng chung một mảng tham chiếu.
|
|
927
904
|
*/
|
|
928
|
-
syncDataMultiKey() {
|
|
905
|
+
syncDataMultiKey(indexRemove) {
|
|
929
906
|
const templates = this.configItems();
|
|
930
907
|
const rowCount = this.dataMultiLanguage().length;
|
|
931
908
|
if (!templates?.length) {
|
|
932
909
|
this.dataMultiKey.set([]);
|
|
933
910
|
return;
|
|
934
911
|
}
|
|
935
|
-
this.dataMultiKey
|
|
912
|
+
if (this.dataMultiKey().length === rowCount) {
|
|
913
|
+
return;
|
|
914
|
+
}
|
|
915
|
+
if (this.dataMultiKey().length > rowCount && !isNil(indexRemove)) {
|
|
916
|
+
this.dataMultiKey.update((data) => {
|
|
917
|
+
data.splice(indexRemove, 1);
|
|
918
|
+
return data;
|
|
919
|
+
});
|
|
920
|
+
return;
|
|
921
|
+
}
|
|
922
|
+
const newData = Array.from({ length: rowCount - this.dataMultiKey().length }, () => templates.map((c) => cloneDeep(c)));
|
|
923
|
+
this.dataMultiKey.update((data) => [...data, ...newData]);
|
|
936
924
|
}
|
|
937
925
|
handlerAdd() {
|
|
938
926
|
const header = this.configHeader();
|
|
939
927
|
const dataLanguage = header?.dataDefault ? cloneDeep(header.dataDefault) : {};
|
|
940
928
|
this.dataMultiLanguage.update((items) => [...items, dataLanguage]);
|
|
941
|
-
this.syncDataMultiKey();
|
|
942
929
|
this.handlerChangeValue();
|
|
943
930
|
}
|
|
944
931
|
handlerRemove(index) {
|
|
945
932
|
this.dataMultiLanguage.update((items) => items.filter((_, i) => i !== index));
|
|
946
|
-
this.
|
|
947
|
-
this.syncDataMultiKey();
|
|
933
|
+
this.syncDataMultiKey(index);
|
|
948
934
|
this.handlerChangeValue();
|
|
949
935
|
}
|
|
950
|
-
reindexRowMapsAfterRemove(removedIndex) {
|
|
951
|
-
const reindex = (m) => {
|
|
952
|
-
const next = new Map();
|
|
953
|
-
m.forEach((v, k) => {
|
|
954
|
-
if (k < removedIndex) {
|
|
955
|
-
next.set(k, v);
|
|
956
|
-
}
|
|
957
|
-
else if (k > removedIndex) {
|
|
958
|
-
next.set(k - 1, v);
|
|
959
|
-
}
|
|
960
|
-
});
|
|
961
|
-
return next;
|
|
962
|
-
};
|
|
963
|
-
this.inputValidByRow.update((m) => reindex(m));
|
|
964
|
-
this.multiLanguageByRow.update((m) => reindex(m));
|
|
965
|
-
}
|
|
966
|
-
handlerClick(e) {
|
|
967
|
-
e.stopPropagation();
|
|
968
|
-
this.outClick.emit();
|
|
969
|
-
}
|
|
970
|
-
handlerFunctionsControlInputLanguage(event, rowIndex) {
|
|
971
|
-
this.multiLanguageByRow.update((m) => new Map(m).set(rowIndex, event));
|
|
972
|
-
}
|
|
973
|
-
handlerFunctionsControlInputValid(event, rowIndex) {
|
|
974
|
-
this.inputValidByRow.update((m) => new Map(m).set(rowIndex, event));
|
|
975
|
-
}
|
|
976
936
|
async validate() {
|
|
977
937
|
let valid = true;
|
|
978
938
|
this.applyValidRequiredWhenHeaderHasValue();
|
|
979
939
|
const rowCount = this.dataMultiLanguage().length;
|
|
980
940
|
for (let i = 0; i < rowCount; i++) {
|
|
981
|
-
const inputCtrl = this.
|
|
982
|
-
if (inputCtrl && !(await inputCtrl.checkIsValid())) {
|
|
941
|
+
const inputCtrl = this.inputComponentRefs()[i];
|
|
942
|
+
if (inputCtrl && !(await inputCtrl.FunctionsControl.checkIsValid())) {
|
|
983
943
|
valid = false;
|
|
984
944
|
}
|
|
985
|
-
const mlCtrl = this.
|
|
986
|
-
if (mlCtrl && !(await mlCtrl.checkIsValid())) {
|
|
945
|
+
const mlCtrl = this.multiLanguageComponentRefs()[i];
|
|
946
|
+
if (mlCtrl && !(await mlCtrl.FunctionsControl.checkIsValid())) {
|
|
987
947
|
valid = false;
|
|
988
948
|
}
|
|
989
949
|
}
|
|
@@ -993,8 +953,8 @@ class LibsUiComponentsInputsMultiLanguageItemsComponent {
|
|
|
993
953
|
const rowCount = this.dataMultiLanguage().length;
|
|
994
954
|
const out = [];
|
|
995
955
|
for (let i = 0; i < rowCount; i++) {
|
|
996
|
-
const ctrl = this.
|
|
997
|
-
out.push((ctrl?.getData() ?? {}));
|
|
956
|
+
const ctrl = this.multiLanguageComponentRefs()[i];
|
|
957
|
+
out.push((ctrl?.FunctionsControl.getData() ?? {}));
|
|
998
958
|
}
|
|
999
959
|
return out;
|
|
1000
960
|
}
|
|
@@ -1012,11 +972,11 @@ class LibsUiComponentsInputsMultiLanguageItemsComponent {
|
|
|
1012
972
|
}
|
|
1013
973
|
}
|
|
1014
974
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsInputsMultiLanguageItemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1015
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsInputsMultiLanguageItemsComponent, isStandalone: true, selector: "libs_ui-components-inputs-multi_language-items", inputs: { configItems: { classPropertyName: "configItems", publicName: "configItems", isSignal: true, isRequired: false, transformFunction: null }, dataMultiLanguage: { classPropertyName: "dataMultiLanguage", publicName: "dataMultiLanguage", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, ignoreAdd: { classPropertyName: "ignoreAdd", publicName: "ignoreAdd", isSignal: true, isRequired: false, transformFunction: null }, labelAddItem: { classPropertyName: "labelAddItem", publicName: "labelAddItem", isSignal: true, isRequired: false, transformFunction: null }, singleLanguage: { classPropertyName: "singleLanguage", publicName: "singleLanguage", isSignal: true, isRequired: false, transformFunction: null }, acceptNegativeValue: { classPropertyName: "acceptNegativeValue", publicName: "acceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, valueUpDownNumber: { classPropertyName: "valueUpDownNumber", publicName: "valueUpDownNumber", isSignal: true, isRequired: false, transformFunction: null }, maxValueNumber: { classPropertyName: "maxValueNumber", publicName: "maxValueNumber", isSignal: true, isRequired: false, transformFunction: null }, onlyAcceptNegativeValue: { classPropertyName: "onlyAcceptNegativeValue", publicName: "onlyAcceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, classIconAddLanguage: { classPropertyName: "classIconAddLanguage", publicName: "classIconAddLanguage", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dataMultiLanguage: "dataMultiLanguageChange",
|
|
975
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsInputsMultiLanguageItemsComponent, isStandalone: true, selector: "libs_ui-components-inputs-multi_language-items", inputs: { configItems: { classPropertyName: "configItems", publicName: "configItems", isSignal: true, isRequired: false, transformFunction: null }, dataMultiLanguage: { classPropertyName: "dataMultiLanguage", publicName: "dataMultiLanguage", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, ignoreAdd: { classPropertyName: "ignoreAdd", publicName: "ignoreAdd", isSignal: true, isRequired: false, transformFunction: null }, labelAddItem: { classPropertyName: "labelAddItem", publicName: "labelAddItem", isSignal: true, isRequired: false, transformFunction: null }, singleLanguage: { classPropertyName: "singleLanguage", publicName: "singleLanguage", isSignal: true, isRequired: false, transformFunction: null }, acceptNegativeValue: { classPropertyName: "acceptNegativeValue", publicName: "acceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, valueUpDownNumber: { classPropertyName: "valueUpDownNumber", publicName: "valueUpDownNumber", isSignal: true, isRequired: false, transformFunction: null }, maxValueNumber: { classPropertyName: "maxValueNumber", publicName: "maxValueNumber", isSignal: true, isRequired: false, transformFunction: null }, onlyAcceptNegativeValue: { classPropertyName: "onlyAcceptNegativeValue", publicName: "onlyAcceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, classIconAddLanguage: { classPropertyName: "classIconAddLanguage", publicName: "classIconAddLanguage", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dataMultiLanguage: "dataMultiLanguageChange", outChangeValue: "outChangeValue" }, viewQueries: [{ propertyName: "inputComponentRefs", predicate: LibsUiComponentsInputsValidComponent, descendants: true, isSignal: true }, { propertyName: "multiLanguageComponentRefs", predicate: LibsUiComponentsInputsMultiLanguageComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col gap-[8px]\">\n @for (item of dataMultiLanguage(); track item) {\n <div class=\"libs-ui-border-general w-full rounded-[4px]\">\n @if (configHeader(); as configHeader) {\n <div class=\"flex bg-[var(--libs-ui-color-light-2)] p-[12px] gap-[16px]\">\n <div class=\"flex gap-[8px] w-full\">\n <div class=\"libs-ui-font-h6m h-[32px] flex items-center shrink-0\">\n @let constHtmlTitle = configHeader.title ?? ' ';\n {{ constHtmlTitle | translate }}\n </div>\n <div class=\"w-full\">\n @if (configHeader.keyBindData | LibsUiComponentsInputsMultiLanguageGetItemPipe: item; as itemMap) {\n <libs_ui-components-inputs-valid\n [(item)]=\"itemMap\"\n [dataType]=\"configHeader.type && configHeader.type === 'number' ? 'int' : 'string'\"\n [fieldNameBind]=\"langDefault()\"\n [emitEmptyInDataTypeNumber]=\"true\"\n [validRequired]=\"{ isRequired: configItems()[0].validRequired?.isRequired ?? false }\"\n [placeholder]=\"'i18n_enter_value'\"\n [acceptNegativeValue]=\"acceptNegativeValue() ?? true\"\n [valueUpDownNumber]=\"valueUpDownNumber() || 1\"\n [maxValueNumber]=\"maxValueNumber()\"\n [fixedFloat]=\"15\"\n (outValueChange)=\"handlerChangeValue($event, 'input')\" />\n }\n </div>\n </div>\n @if (!$first) {\n <div class=\"flex items-center h-[32px]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-link-custom'\"\n [buttonCustom]=\"{\n configStepColor: {\n text: '#071631',\n text_hover: '#ee2d41',\n text_active: '#ee2d41',\n text_disable: '071631',\n },\n rootColor: '#071631',\n }\"\n [iconOnlyType]=\"true\"\n [popover]=\"{ config: { content: 'i18n_delete', zIndex: 1205 } }\"\n [classIconLeft]=\"'libs-ui-icon-remove'\"\n [classInclude]=\"'!p-0'\"\n (outClick)=\"handlerRemove($index)\" />\n </div>\n }\n </div>\n <div class=\"p-[12px] flex w-full\">\n <libs_ui-components-inputs-multi_language\n class=\"w-full\"\n [singleLanguage]=\"singleLanguage()\"\n [titleField]=\"configItems()[0].titleField || ''\"\n [keyHeader]=\"configHeader.keyBindData ?? ''\"\n [placeholder]=\"'i18n_import_content'\"\n [classIncludeValue]=\"'libs-ui-font-h5r'\"\n [data]=\"dataMultiKey()[$index]\"\n [validRequired]=\"validRequiredWhenInputHasValue() || configItems()[0].validRequired\"\n [dataLanguage]=\"item\"\n [zIndex]=\"zIndex() ?? 1203\"\n [acceptNegativeValue]=\"acceptNegativeValue() ?? true\"\n [valueUpDownNumber]=\"valueUpDownNumber() || 1\"\n [maxValueNumber]=\"maxValueNumber()\"\n [onlyAcceptNegativeValue]=\"onlyAcceptNegativeValue()\"\n [classIconAddLanguage]=\"classIconAddLanguage()\"\n [viewType]=\"configItems()[0].type ? (configItems()[0].type === 'number' ? 'number' : configItems()[0].type === 'float' ? 'float' : 'text') : 'text'\"\n (outEventMultiLanguage)=\"handlerChangeValue()\"\n (outChangeValueInput)=\"handlerChangeValue()\" />\n </div>\n }\n </div>\n }\n @if (!ignoreAdd()) {\n <libs_ui-components-buttons-button\n [type]=\"'button-link-primary'\"\n [classIconLeft]=\"'libs-ui-icon-add'\"\n [classLabel]=\"'libs-ui-font-h6mi'\"\n [classInclude]=\"'!px-0 !py-[2px]'\"\n [label]=\"labelAddItem() || ''\"\n (outClick)=\"handlerAdd()\" />\n }\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: LibsUiComponentsInputsMultiLanguageGetItemPipe, name: "LibsUiComponentsInputsMultiLanguageGetItemPipe" }, { kind: "component", type: LibsUiComponentsInputsValidComponent, selector: "libs_ui-components-inputs-valid", inputs: ["item", "labelConfig", "emitEmptyInDataTypeNumber", "ignoreBlockInputMaxValue", "fieldNameBind", "showCount", "typeComponentSelectItem", "valueComponentSelectItem", "disableComponentSelectItem", "tagInput", "dataType", "typeInput", "modeInput", "resetAutoCompletePassword", "textAreaEnterNotNewLine", "fixedFloat", "acceptNegativeValue", "valueUpDownNumber", "ignoreWidthInput100", "classIncludeInput", "classContainerInput", "readonly", "disable", "noBorder", "backgroundNone", "useColorModeExist", "placeholder", "keepPlaceholderOnly", "classContainerBottomInput", "autoRemoveEmoji", "defaultHeight", "maxHeightTextArea", "minHeightTextArea", "ignoreShowError", "ignoreShowMessageError", "borderError", "iconLeftClass", "popoverContentIconLeft", "iconRightClass", "popoverContentIconRight", "zIndexPopoverContent", "unitsLeft", "configUnitLeft", "keySelectedUnitLeft", "unitsRight", "configUnitRight", "keySelectedUnitRight", "maxValueNumber", "minValueNumber", "ignoreContentLeft", "ignoreContentRight", "isBaselineStyle", "valuePatternShowError", "validPattern", "validRequired", "validMinLength", "validMinValue", "validMaxValue", "validMaxLength", "functionValid", "maxLength", "positionMessageErrorStartInput", "classInclude", "resize", "templateLeftBottomInput", "templateRightBottomInput", "onlyAcceptNegativeValue", "autoAddZeroLessThan10InTypeInt", "maxLengthNumberCount", "classMessageErrorInclude", "ignoreStopPropagationEvent", "ignoreUnitRightClassReadOnly", "paddingRightCustomSpecific", "focusTimeOut", "debounceTimeValidate"], outputs: ["itemChange", "outValueChange", "outSelect", "outIconLeft", "outIconRight", "outClickButtonLabel", "outSwitchEventLabel", "outLabelRightClick", "outEnterInputEvent", "outHeightAreaChange", "outFunctionsControl", "outFocusAndBlur", "outChangeValueByButtonUpDown"] }, { kind: "component", type: LibsUiComponentsInputsMultiLanguageComponent, selector: "libs_ui-components-inputs-multi_language", inputs: ["optionsLanguage", "zIndex", "viewType", "singleLanguage", "data", "validRequired", "ignoreAdd", "titleField", "keyHeader", "textArea", "placeholder", "extendClass", "extendClassContent", "viewPosition", "ignoreRemove", "validMaxLength", "validMinLength", "countCharacters", "viewContent", "classIncludeKey", "classIncludeValue", "dataLanguage", "readonly", "acceptNegativeValue", "valueUpDownNumber", "maxValueNumber", "onlyAcceptNegativeValue", "validOneDefaultMultiLanguage", "classIconAddLanguage", "validPattern"], outputs: ["dataChange", "ignoreAddChange", "extendClassChange", "dataLanguageChange", "outEventMultiLanguage", "outChangeTypeLanguage", "outChangeValueInput"] }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1016
976
|
}
|
|
1017
977
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsInputsMultiLanguageItemsComponent, decorators: [{
|
|
1018
978
|
type: Component,
|
|
1019
|
-
args: [{ selector: 'libs_ui-components-inputs-multi_language-items', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslateModule, LibsUiComponentsInputsMultiLanguageGetItemPipe, LibsUiComponentsInputsValidComponent, LibsUiComponentsInputsMultiLanguageComponent, LibsUiComponentsButtonsButtonComponent], template: "<div class=\"flex flex-col gap-[8px]\">\n @for (item of dataMultiLanguage(); track item) {\n <div class=\"libs-ui-border-general w-full rounded-[4px]\">\n @if (configHeader(); as configHeader) {\n <div class=\"flex bg-[var(--libs-ui-color-light-2)] p-[12px] gap-[16px]\">\n <div class=\"flex
|
|
979
|
+
args: [{ selector: 'libs_ui-components-inputs-multi_language-items', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslateModule, LibsUiComponentsInputsMultiLanguageGetItemPipe, LibsUiComponentsInputsValidComponent, LibsUiComponentsInputsMultiLanguageComponent, LibsUiComponentsButtonsButtonComponent], template: "<div class=\"flex flex-col gap-[8px]\">\n @for (item of dataMultiLanguage(); track item) {\n <div class=\"libs-ui-border-general w-full rounded-[4px]\">\n @if (configHeader(); as configHeader) {\n <div class=\"flex bg-[var(--libs-ui-color-light-2)] p-[12px] gap-[16px]\">\n <div class=\"flex gap-[8px] w-full\">\n <div class=\"libs-ui-font-h6m h-[32px] flex items-center shrink-0\">\n @let constHtmlTitle = configHeader.title ?? ' ';\n {{ constHtmlTitle | translate }}\n </div>\n <div class=\"w-full\">\n @if (configHeader.keyBindData | LibsUiComponentsInputsMultiLanguageGetItemPipe: item; as itemMap) {\n <libs_ui-components-inputs-valid\n [(item)]=\"itemMap\"\n [dataType]=\"configHeader.type && configHeader.type === 'number' ? 'int' : 'string'\"\n [fieldNameBind]=\"langDefault()\"\n [emitEmptyInDataTypeNumber]=\"true\"\n [validRequired]=\"{ isRequired: configItems()[0].validRequired?.isRequired ?? false }\"\n [placeholder]=\"'i18n_enter_value'\"\n [acceptNegativeValue]=\"acceptNegativeValue() ?? true\"\n [valueUpDownNumber]=\"valueUpDownNumber() || 1\"\n [maxValueNumber]=\"maxValueNumber()\"\n [fixedFloat]=\"15\"\n (outValueChange)=\"handlerChangeValue($event, 'input')\" />\n }\n </div>\n </div>\n @if (!$first) {\n <div class=\"flex items-center h-[32px]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-link-custom'\"\n [buttonCustom]=\"{\n configStepColor: {\n text: '#071631',\n text_hover: '#ee2d41',\n text_active: '#ee2d41',\n text_disable: '071631',\n },\n rootColor: '#071631',\n }\"\n [iconOnlyType]=\"true\"\n [popover]=\"{ config: { content: 'i18n_delete', zIndex: 1205 } }\"\n [classIconLeft]=\"'libs-ui-icon-remove'\"\n [classInclude]=\"'!p-0'\"\n (outClick)=\"handlerRemove($index)\" />\n </div>\n }\n </div>\n <div class=\"p-[12px] flex w-full\">\n <libs_ui-components-inputs-multi_language\n class=\"w-full\"\n [singleLanguage]=\"singleLanguage()\"\n [titleField]=\"configItems()[0].titleField || ''\"\n [keyHeader]=\"configHeader.keyBindData ?? ''\"\n [placeholder]=\"'i18n_import_content'\"\n [classIncludeValue]=\"'libs-ui-font-h5r'\"\n [data]=\"dataMultiKey()[$index]\"\n [validRequired]=\"validRequiredWhenInputHasValue() || configItems()[0].validRequired\"\n [dataLanguage]=\"item\"\n [zIndex]=\"zIndex() ?? 1203\"\n [acceptNegativeValue]=\"acceptNegativeValue() ?? true\"\n [valueUpDownNumber]=\"valueUpDownNumber() || 1\"\n [maxValueNumber]=\"maxValueNumber()\"\n [onlyAcceptNegativeValue]=\"onlyAcceptNegativeValue()\"\n [classIconAddLanguage]=\"classIconAddLanguage()\"\n [viewType]=\"configItems()[0].type ? (configItems()[0].type === 'number' ? 'number' : configItems()[0].type === 'float' ? 'float' : 'text') : 'text'\"\n (outEventMultiLanguage)=\"handlerChangeValue()\"\n (outChangeValueInput)=\"handlerChangeValue()\" />\n </div>\n }\n </div>\n }\n @if (!ignoreAdd()) {\n <libs_ui-components-buttons-button\n [type]=\"'button-link-primary'\"\n [classIconLeft]=\"'libs-ui-icon-add'\"\n [classLabel]=\"'libs-ui-font-h6mi'\"\n [classInclude]=\"'!px-0 !py-[2px]'\"\n [label]=\"labelAddItem() || ''\"\n (outClick)=\"handlerAdd()\" />\n }\n</div>\n" }]
|
|
1020
980
|
}], ctorParameters: () => [] });
|
|
1021
981
|
|
|
1022
982
|
/**
|