@masterteam/form-builder 0.0.33 → 0.0.35
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/assets/i18n/ar.json
CHANGED
|
@@ -1,83 +1,85 @@
|
|
|
1
|
-
{
|
|
2
|
-
"formBuilder": {
|
|
3
|
-
"save": "حفظ",
|
|
4
|
-
"cancel": "إلغاء",
|
|
5
|
-
"delete": "حذف",
|
|
6
|
-
"name-ar": "الاسم بالعربية",
|
|
7
|
-
"name-en": "الاسم بالإنجليزية",
|
|
8
|
-
"
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
-
"
|
|
12
|
-
"
|
|
13
|
-
"
|
|
14
|
-
"
|
|
15
|
-
"
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
-
"
|
|
23
|
-
"
|
|
24
|
-
"
|
|
25
|
-
"
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
"
|
|
29
|
-
"
|
|
30
|
-
"
|
|
31
|
-
"
|
|
32
|
-
"
|
|
33
|
-
"
|
|
34
|
-
"validation-
|
|
35
|
-
"validation-
|
|
36
|
-
"validation-
|
|
37
|
-
"validation-
|
|
38
|
-
"
|
|
39
|
-
"
|
|
40
|
-
"
|
|
41
|
-
"
|
|
42
|
-
"severity
|
|
43
|
-
"severity-
|
|
44
|
-
"
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
"
|
|
48
|
-
"
|
|
49
|
-
"
|
|
50
|
-
"
|
|
51
|
-
"is-
|
|
52
|
-
"is-
|
|
53
|
-
"
|
|
54
|
-
"
|
|
55
|
-
"
|
|
56
|
-
"
|
|
57
|
-
"
|
|
58
|
-
"
|
|
59
|
-
"
|
|
60
|
-
"
|
|
61
|
-
"scope-
|
|
62
|
-
"scope-
|
|
63
|
-
"scope-
|
|
64
|
-
"scope-
|
|
65
|
-
"scope-
|
|
66
|
-
"scope-
|
|
67
|
-
"scope-
|
|
68
|
-
"
|
|
69
|
-
"
|
|
70
|
-
"
|
|
71
|
-
"no-
|
|
72
|
-
"
|
|
73
|
-
"
|
|
74
|
-
"
|
|
75
|
-
"
|
|
76
|
-
"
|
|
77
|
-
"
|
|
78
|
-
"
|
|
79
|
-
"toolbar-
|
|
80
|
-
"toolbar-
|
|
81
|
-
"
|
|
82
|
-
|
|
83
|
-
|
|
1
|
+
{
|
|
2
|
+
"formBuilder": {
|
|
3
|
+
"save": "حفظ",
|
|
4
|
+
"cancel": "إلغاء",
|
|
5
|
+
"delete": "حذف",
|
|
6
|
+
"name-ar": "الاسم بالعربية",
|
|
7
|
+
"name-en": "الاسم بالإنجليزية",
|
|
8
|
+
"required": "هذا الحقل مطلوب",
|
|
9
|
+
"whitespace-invalid": "أدخل حرفًا واحدًا على الأقل غير المسافة",
|
|
10
|
+
"system": "نظام",
|
|
11
|
+
"custom": "مخصص",
|
|
12
|
+
"layout": "التخطيط",
|
|
13
|
+
"reset": "إعادة تعيين",
|
|
14
|
+
"preview": "معاينة",
|
|
15
|
+
"add-section": "إضافة قسم",
|
|
16
|
+
"edit-section": "تعديل القسم",
|
|
17
|
+
"edit-field": "تعديل الحقل",
|
|
18
|
+
"remove-field": "إزالة الحقل",
|
|
19
|
+
"drag-from-the-side": "اسحب عناصرك من اللوحة الجانبية",
|
|
20
|
+
"change-width": "تغيير العرض",
|
|
21
|
+
"is-required": "مطلوب",
|
|
22
|
+
"size": "الحجم",
|
|
23
|
+
"field-settings": "إعدادات الحقل",
|
|
24
|
+
"form-elements": "عناصر النموذج",
|
|
25
|
+
"no-section": "لنبدأ بإضافة قسم إلى نموذجك، انقر على زر إضافة قسم أعلاه.",
|
|
26
|
+
"hidden-in-creation": "مخفي عند الإنشاء",
|
|
27
|
+
"hidden-in-edit-form": "مخفي في نموذج التعديل",
|
|
28
|
+
"show-hide": "إظهار/إخفاء",
|
|
29
|
+
"show-hide-description": "الإظهار بناءً على قيمة خصائص أخرى",
|
|
30
|
+
"set-conditions": "تعيين الشروط",
|
|
31
|
+
"conditional-display-formula": "معادلة الإظهار الشرطي",
|
|
32
|
+
"enter-formula": "أدخل المعادلة...",
|
|
33
|
+
"validation-rules": "قواعد التحقق",
|
|
34
|
+
"add-validation-rule": "إضافة قاعدة تحقق",
|
|
35
|
+
"edit-validation-rule": "تعديل قاعدة التحقق",
|
|
36
|
+
"validation-formula": "المعادلة",
|
|
37
|
+
"validation-message": "الرسالة",
|
|
38
|
+
"validation-active": "نشط",
|
|
39
|
+
"validation-formula-placeholder": "أنشئ معادلة التحقق...",
|
|
40
|
+
"message-en": "الرسالة (الإنجليزية)",
|
|
41
|
+
"message-ar": "الرسالة (العربية)",
|
|
42
|
+
"severity": "نوع رسالة التحقق",
|
|
43
|
+
"severity-hint": "اختر ما إذا كانت القاعدة ستظهر كخطأ أو تحذير عند فشل التحقق.",
|
|
44
|
+
"severity-error": "خطأ",
|
|
45
|
+
"severity-warning": "تحذير",
|
|
46
|
+
"create-form": "إنشاء نموذج",
|
|
47
|
+
"edit-form": "تعديل النموذج",
|
|
48
|
+
"search-properties": "البحث في الخصائص",
|
|
49
|
+
"no-data-found": "لا توجد بيانات",
|
|
50
|
+
"no-fields-visible": "لا توجد حقول مرئية في هذا الوضع",
|
|
51
|
+
"is-read": "قابل للقراءة",
|
|
52
|
+
"is-read-description": "عند التعطيل، سيتم إخفاء هذا الحقل عن المستخدمين",
|
|
53
|
+
"is-write": "قابل للتعديل",
|
|
54
|
+
"is-write-description": "عند التعطيل، سيكون هذا الحقل للقراءة فقط للمستخدمين",
|
|
55
|
+
"hidden": "مخفي",
|
|
56
|
+
"read-only": "للقراءة فقط",
|
|
57
|
+
"sections": "أقسام",
|
|
58
|
+
"steps": "خطوات",
|
|
59
|
+
"tabs": "تبويبات",
|
|
60
|
+
"wizard": "خطوات رأسية",
|
|
61
|
+
"scope-current": "الحالي",
|
|
62
|
+
"scope-host": "المضيف",
|
|
63
|
+
"scope-level": "المستوى",
|
|
64
|
+
"scope-parent": "الأصل",
|
|
65
|
+
"scope-ancestors": "الأسلاف",
|
|
66
|
+
"scope-children": "الأبناء",
|
|
67
|
+
"scope-descendants": "السلالة",
|
|
68
|
+
"scope-related": "المرتبط",
|
|
69
|
+
"scope-siblings": "الإخوة",
|
|
70
|
+
"path": "المسار",
|
|
71
|
+
"no-context": "لا يوجد سياق متاح",
|
|
72
|
+
"select": "اختر",
|
|
73
|
+
"no-options": "لا توجد خيارات",
|
|
74
|
+
"add-segment": "إضافة مقطع",
|
|
75
|
+
"scope-select-placeholder": "اختر...",
|
|
76
|
+
"select-property": "اختر خاصية",
|
|
77
|
+
"no-properties-available": "لا توجد خصائص متاحة",
|
|
78
|
+
"all-items-in-use": "جميع العناصر مستخدمة",
|
|
79
|
+
"toolbar-functions": "الدوال",
|
|
80
|
+
"toolbar-fields": "الحقول",
|
|
81
|
+
"toolbar-operators": "العوامل",
|
|
82
|
+
"toolbar-no-fields": "لا توجد حقول متاحة",
|
|
83
|
+
"build-condition-formula": "أنشئ صيغة الشرط..."
|
|
84
|
+
}
|
|
85
|
+
}
|
package/assets/i18n/en.json
CHANGED
|
@@ -1,83 +1,85 @@
|
|
|
1
|
-
{
|
|
2
|
-
"formBuilder": {
|
|
3
|
-
"save": "Save",
|
|
4
|
-
"cancel": "Cancel",
|
|
5
|
-
"delete": "Delete",
|
|
6
|
-
"name-ar": "Name (Arabic)",
|
|
7
|
-
"name-en": "Name (English)",
|
|
8
|
-
"
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
-
"
|
|
12
|
-
"
|
|
13
|
-
"
|
|
14
|
-
"
|
|
15
|
-
"
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
-
"
|
|
23
|
-
"
|
|
24
|
-
"
|
|
25
|
-
"
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
"
|
|
29
|
-
"
|
|
30
|
-
"
|
|
31
|
-
"
|
|
32
|
-
"
|
|
33
|
-
"
|
|
34
|
-
"validation-
|
|
35
|
-
"validation-
|
|
36
|
-
"validation-
|
|
37
|
-
"validation-
|
|
38
|
-
"
|
|
39
|
-
"
|
|
40
|
-
"
|
|
41
|
-
"
|
|
42
|
-
"severity
|
|
43
|
-
"severity-
|
|
44
|
-
"
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
"
|
|
48
|
-
"no-
|
|
49
|
-
"
|
|
50
|
-
"
|
|
51
|
-
"is-
|
|
52
|
-
"is-
|
|
53
|
-
"
|
|
54
|
-
"
|
|
55
|
-
"
|
|
56
|
-
"
|
|
57
|
-
"
|
|
58
|
-
"
|
|
59
|
-
"
|
|
60
|
-
"
|
|
61
|
-
"scope-
|
|
62
|
-
"scope-
|
|
63
|
-
"scope-
|
|
64
|
-
"scope-
|
|
65
|
-
"scope-
|
|
66
|
-
"scope-
|
|
67
|
-
"scope-
|
|
68
|
-
"
|
|
69
|
-
"
|
|
70
|
-
"
|
|
71
|
-
"no-
|
|
72
|
-
"
|
|
73
|
-
"
|
|
74
|
-
"
|
|
75
|
-
"
|
|
76
|
-
"
|
|
77
|
-
"
|
|
78
|
-
"
|
|
79
|
-
"toolbar-
|
|
80
|
-
"toolbar-
|
|
81
|
-
"
|
|
82
|
-
|
|
83
|
-
|
|
1
|
+
{
|
|
2
|
+
"formBuilder": {
|
|
3
|
+
"save": "Save",
|
|
4
|
+
"cancel": "Cancel",
|
|
5
|
+
"delete": "Delete",
|
|
6
|
+
"name-ar": "Name (Arabic)",
|
|
7
|
+
"name-en": "Name (English)",
|
|
8
|
+
"required": "This field is required",
|
|
9
|
+
"whitespace-invalid": "Enter at least one non-space character",
|
|
10
|
+
"system": "System",
|
|
11
|
+
"custom": "Custom",
|
|
12
|
+
"layout": "Layout",
|
|
13
|
+
"reset": "Reset",
|
|
14
|
+
"preview": "Preview",
|
|
15
|
+
"add-section": "Add Section",
|
|
16
|
+
"edit-section": "Edit Section",
|
|
17
|
+
"edit-field": "Edit Field",
|
|
18
|
+
"remove-field": "Remove Field",
|
|
19
|
+
"drag-from-the-side": "Drag your elemnents from the side panel",
|
|
20
|
+
"change-width": "Change Width",
|
|
21
|
+
"is-required": "Is Required",
|
|
22
|
+
"size": "Size",
|
|
23
|
+
"field-settings": "Field Settings",
|
|
24
|
+
"form-elements": "Form Elements",
|
|
25
|
+
"no-section": "Let's start by adding a section to your form, click the add section button above.",
|
|
26
|
+
"hidden-in-creation": "Hidden In Creation",
|
|
27
|
+
"hidden-in-edit-form": "Hidden In Edit Form",
|
|
28
|
+
"show-hide": "Show/Hide",
|
|
29
|
+
"show-hide-description": "Show Based On The Value Of Other Properties",
|
|
30
|
+
"set-conditions": "Set Conditions",
|
|
31
|
+
"conditional-display-formula": "Conditional Display Formula",
|
|
32
|
+
"enter-formula": "Enter formula...",
|
|
33
|
+
"validation-rules": "Validation Rules",
|
|
34
|
+
"add-validation-rule": "Add Validation Rule",
|
|
35
|
+
"edit-validation-rule": "Edit Validation Rule",
|
|
36
|
+
"validation-formula": "Formula",
|
|
37
|
+
"validation-message": "Message",
|
|
38
|
+
"validation-active": "Active",
|
|
39
|
+
"validation-formula-placeholder": "Build validation formula...",
|
|
40
|
+
"message-en": "Message (English)",
|
|
41
|
+
"message-ar": "Message (Arabic)",
|
|
42
|
+
"severity": "Validation Message Type",
|
|
43
|
+
"severity-hint": "Choose whether this rule shows an error or a warning when validation fails.",
|
|
44
|
+
"severity-error": "Error",
|
|
45
|
+
"severity-warning": "Warning",
|
|
46
|
+
"create-form": "Create Form",
|
|
47
|
+
"edit-form": "Edit Form",
|
|
48
|
+
"no-data-found": "No data found",
|
|
49
|
+
"search-properties": "Search Properties",
|
|
50
|
+
"no-fields-visible": "No fields visible in this mode",
|
|
51
|
+
"is-read": "Readable",
|
|
52
|
+
"is-read-description": "When disabled, this field will be hidden from users",
|
|
53
|
+
"is-write": "Editable",
|
|
54
|
+
"is-write-description": "When disabled, this field will be read-only for users",
|
|
55
|
+
"hidden": "Hidden",
|
|
56
|
+
"read-only": "Read Only",
|
|
57
|
+
"sections": "Sections",
|
|
58
|
+
"steps": "Steps",
|
|
59
|
+
"tabs": "Tabs",
|
|
60
|
+
"wizard": "Wizard",
|
|
61
|
+
"scope-current": "Current",
|
|
62
|
+
"scope-host": "Host",
|
|
63
|
+
"scope-level": "Level",
|
|
64
|
+
"scope-parent": "Parent",
|
|
65
|
+
"scope-ancestors": "Ancestors",
|
|
66
|
+
"scope-children": "Children",
|
|
67
|
+
"scope-descendants": "Descendants",
|
|
68
|
+
"scope-related": "Related",
|
|
69
|
+
"scope-siblings": "Siblings",
|
|
70
|
+
"path": "Path",
|
|
71
|
+
"no-context": "No context available",
|
|
72
|
+
"select": "Select",
|
|
73
|
+
"no-options": "No options",
|
|
74
|
+
"add-segment": "Add Segment",
|
|
75
|
+
"scope-select-placeholder": "Select...",
|
|
76
|
+
"select-property": "Select a property",
|
|
77
|
+
"no-properties-available": "No properties available",
|
|
78
|
+
"all-items-in-use": "All items are in use",
|
|
79
|
+
"toolbar-functions": "Functions",
|
|
80
|
+
"toolbar-fields": "Fields",
|
|
81
|
+
"toolbar-operators": "Operators",
|
|
82
|
+
"toolbar-no-fields": "No fields available",
|
|
83
|
+
"build-condition-formula": "Build condition formula..."
|
|
84
|
+
}
|
|
85
|
+
}
|
|
@@ -24,7 +24,7 @@ import { DynamicField } from '@masterteam/forms/dynamic-field';
|
|
|
24
24
|
import { Icon } from '@masterteam/icons';
|
|
25
25
|
import { Action, Selector, State, Store, select } from '@ngxs/store';
|
|
26
26
|
import { HttpClient } from '@angular/common/http';
|
|
27
|
-
import { CrudStateBase, handleApiRequest, RadioCardsFieldConfig } from '@masterteam/components';
|
|
27
|
+
import { CrudStateBase, handleApiRequest, RadioCardsFieldConfig, ValidatorConfig } from '@masterteam/components';
|
|
28
28
|
import { DynamicForm } from '@masterteam/forms/dynamic-form';
|
|
29
29
|
import { ToggleField } from '@masterteam/components/toggle-field';
|
|
30
30
|
import { ModalRef } from '@masterteam/components/dialog';
|
|
@@ -1500,6 +1500,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
1500
1500
|
], template: "<ng-container *transloco=\"let t; prefix: 'formBuilder'\">\r\n <div\r\n [class]=\"[\r\n modalService.contentClass,\r\n 'min-w-0',\r\n 'p-4',\r\n 'overflow-y-hidden!',\r\n 'max-[640px]:p-3',\r\n ]\"\r\n >\r\n <div class=\"mt-2 flex h-full min-h-0 flex-col gap-4 overflow-y-auto pb-10\">\r\n <mt-dynamic-form\r\n [formConfig]=\"activeFormConfig()\"\r\n [formControl]=\"formControl\"\r\n >\r\n </mt-dynamic-form>\r\n\r\n <!-- isRead Toggle -->\r\n <mt-toggle-field\r\n toggleShape=\"card\"\r\n [label]=\"t('is-read')\"\r\n [descriptionCard]=\"t('is-read-description')\"\r\n icon=\"general.eye\"\r\n [formControl]=\"isReadControl\"\r\n ></mt-toggle-field>\r\n\r\n <!-- isWrite Toggle -->\r\n <mt-toggle-field\r\n toggleShape=\"card\"\r\n [label]=\"t('is-write')\"\r\n [descriptionCard]=\"t('is-write-description')\"\r\n icon=\"general.edit-02\"\r\n [formControl]=\"isWriteControl\"\r\n ></mt-toggle-field>\r\n\r\n @if (!isManageProperties()) {\r\n <!-- Show/Hide Toggle with Set Conditions -->\r\n <mt-toggle-field\r\n toggleShape=\"card\"\r\n [label]=\"t('show-hide')\"\r\n [descriptionCard]=\"t('show-hide-description')\"\r\n icon=\"general.eye\"\r\n [formControl]=\"showHideControl\"\r\n class=\"mt-3\"\r\n >\r\n <ng-template #toggleCardBottom>\r\n @if (showHideControl.value) {\r\n <div class=\"mt-3\">\r\n <mt-button\r\n [label]=\"t('set-conditions')\"\r\n size=\"small\"\r\n styleClass=\"w-full sm:w-auto\"\r\n (onClick)=\"onSetConditions()\"\r\n ></mt-button>\r\n </div>\r\n }\r\n </ng-template>\r\n </mt-toggle-field>\r\n }\r\n </div>\r\n </div>\r\n\r\n <div\r\n [class]=\"[\r\n modalService.footerClass,\r\n '!h-auto',\r\n 'min-h-0',\r\n 'flex-col',\r\n 'gap-2',\r\n 'sm:flex-row',\r\n 'sm:items-center',\r\n 'sm:justify-end',\r\n ]\"\r\n >\r\n @if (initialData() && !isManageProperties()) {\r\n <mt-button\r\n [tooltip]=\"t('delete')\"\r\n severity=\"danger\"\r\n [variant]=\"'outlined'\"\r\n icon=\"general.trash-01\"\r\n [loading]=\"deleting()\"\r\n [disabled]=\"submitting()\"\r\n (onClick)=\"onDelete($event)\"\r\n class=\"self-start sm:me-auto\"\r\n ></mt-button>\r\n }\r\n <mt-button\r\n [label]=\"t('cancel')\"\r\n variant=\"outlined\"\r\n [disabled]=\"submitting() || deleting()\"\r\n styleClass=\"w-full sm:w-auto\"\r\n (onClick)=\"onCancel()\"\r\n >\r\n </mt-button>\r\n <mt-button\r\n [disabled]=\"!formControl.valid || deleting()\"\r\n [label]=\"t('save')\"\r\n severity=\"primary\"\r\n [loading]=\"submitting()\"\r\n styleClass=\"w-full sm:w-auto\"\r\n (onClick)=\"onSave()\"\r\n >\r\n </mt-button>\r\n </div>\r\n</ng-container>\r\n" }]
|
|
1501
1501
|
}], ctorParameters: () => [], propDecorators: { sectionId: [{ type: i0.Input, args: [{ isSignal: true, alias: "sectionId", required: false }] }], initialData: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialData", required: false }] }], allSections: [{ type: i0.Input, args: [{ isSignal: true, alias: "allSections", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }] } });
|
|
1502
1502
|
|
|
1503
|
+
const hasNonWhitespaceValue = (value) => {
|
|
1504
|
+
if (value === null || value === undefined || value === '')
|
|
1505
|
+
return true;
|
|
1506
|
+
return typeof value !== 'string' || value.trim().length > 0;
|
|
1507
|
+
};
|
|
1503
1508
|
class FBSectionForm {
|
|
1504
1509
|
transloco = inject(TranslocoService);
|
|
1505
1510
|
modalService = inject(ModalService);
|
|
@@ -1528,6 +1533,10 @@ class FBSectionForm {
|
|
|
1528
1533
|
label: this.transloco.translate('formBuilder.name-ar'),
|
|
1529
1534
|
type: 'text',
|
|
1530
1535
|
placeholder: this.transloco.translate('formBuilder.name-ar'),
|
|
1536
|
+
validators: [
|
|
1537
|
+
ValidatorConfig.required(this.transloco.translate('formBuilder.required')),
|
|
1538
|
+
ValidatorConfig.custom(hasNonWhitespaceValue, this.transloco.translate('formBuilder.whitespace-invalid')),
|
|
1539
|
+
],
|
|
1531
1540
|
colSpan: 12,
|
|
1532
1541
|
order: 1,
|
|
1533
1542
|
},
|
|
@@ -1536,6 +1545,10 @@ class FBSectionForm {
|
|
|
1536
1545
|
label: this.transloco.translate('formBuilder.name-en'),
|
|
1537
1546
|
type: 'text',
|
|
1538
1547
|
placeholder: this.transloco.translate('formBuilder.name-en'),
|
|
1548
|
+
validators: [
|
|
1549
|
+
ValidatorConfig.required(this.transloco.translate('formBuilder.required')),
|
|
1550
|
+
ValidatorConfig.custom(hasNonWhitespaceValue, this.transloco.translate('formBuilder.whitespace-invalid')),
|
|
1551
|
+
],
|
|
1539
1552
|
colSpan: 12,
|
|
1540
1553
|
order: 2,
|
|
1541
1554
|
},
|
|
@@ -1557,11 +1570,15 @@ class FBSectionForm {
|
|
|
1557
1570
|
onSave() {
|
|
1558
1571
|
if (this.formControl.invalid)
|
|
1559
1572
|
return;
|
|
1560
|
-
const formValue = this.formControl.value;
|
|
1573
|
+
const formValue = this.formControl.value ?? {};
|
|
1574
|
+
const nameAr = String(formValue['name-ar'] ?? '').trim();
|
|
1575
|
+
const nameEn = String(formValue['name-en'] ?? '').trim();
|
|
1576
|
+
if (!nameAr || !nameEn)
|
|
1577
|
+
return;
|
|
1561
1578
|
const payload = {
|
|
1562
1579
|
name: {
|
|
1563
|
-
ar:
|
|
1564
|
-
en:
|
|
1580
|
+
ar: nameAr,
|
|
1581
|
+
en: nameEn,
|
|
1565
1582
|
},
|
|
1566
1583
|
};
|
|
1567
1584
|
this.submitting.set(true);
|
|
@@ -2101,7 +2118,7 @@ class FBValidationRuleForm {
|
|
|
2101
2118
|
this.saveError.set(message);
|
|
2102
2119
|
}
|
|
2103
2120
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: FBValidationRuleForm, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2104
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: FBValidationRuleForm, isStandalone: true, selector: "mt-fb-validation-rule-form", inputs: { initialData: { classPropertyName: "initialData", publicName: "initialData", isSignal: true, isRequired: false, transformFunction: null }, availableFields: { classPropertyName: "availableFields", publicName: "availableFields", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'formBuilder'\">\n <div\n [class]=\"[\n modalService.contentClass,\n 'min-w-0',\n 'p-4',\n 'overflow-y-hidden!',\n 'max-[640px]:p-3',\n ]\"\n >\n <div class=\"mt-4 flex h-full min-h-0 flex-col gap-4 overflow-y-auto pb-10\">\n <mt-formula-builder\n [placeholder]=\"t('validation-formula-placeholder')\"\n [formControl]=\"formulaControl\"\n [levelSchemaId]=\"builderSchemaId()\"\n [moduleId]=\"builderModuleId()\"\n [contextEntityTypeKey]=\"builderContextEntityTypeKey()\"\n [propertiesByPath]=\"formulaPropertiesByPath()\"\n (validationChange)=\"onFormulaValidationChange($event)\"\n />\n <div class=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\n <mt-text-field\n [label]=\"t('message-en')\"\n [placeholder]=\"t('message-en')\"\n [formControl]=\"messageEnControl\"\n />\n <mt-text-field\n [label]=\"t('message-ar')\"\n [placeholder]=\"t('message-ar')\"\n [formControl]=\"messageArControl\"\n />\n </div>\n <mt-radio-cards-field\n [label]=\"t('severity')\"\n [hint]=\"t('severity-hint')\"\n [options]=\"severityOptions()\"\n [formControl]=\"severityControl\"\n />\n @if (saveError(); as error) {\n <div\n class=\"rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700\"\n >\n {{ error }}\n </div>\n }\n </div>\n </div>\n\n <div\n [class]=\"[\n modalService.footerClass,\n '!h-auto',\n 'min-h-0',\n 'flex-col',\n 'gap-2',\n 'sm:flex-row',\n 'sm:items-center',\n 'sm:justify-end',\n ]\"\n >\n <mt-button\n [label]=\"t('cancel')\"\n variant=\"outlined\"\n [disabled]=\"submitting()\"\n styleClass=\"w-full sm:w-auto\"\n (onClick)=\"onCancel()\"\n />\n <mt-button\n [label]=\"t('save')\"\n severity=\"primary\"\n [loading]=\"submitting()\"\n [disabled]=\"!canSave()\"\n styleClass=\"w-full sm:w-auto\"\n (onClick)=\"onSave()\"\n />\n </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: TextField, selector: "mt-text-field", inputs: ["field", "hint", "label", "placeholder", "class", "type", "readonly", "pInputs", "required", "maxLength", "icon", "iconPosition"] }, { kind: "component", type: RadioCardsField, selector: "mt-radio-cards-field", inputs: ["circle", "label", "hint", "readonly", "required", "color", "size", "optionLabel", "optionValue", "options"] }, { kind: "component", type: FormulaBuilder, selector: "mt-formula-builder", inputs: ["propertiesByPath", "levelSchemaId", "moduleId", "contextEntityTypeKey", "templateId", "placeholder", "hideToolbar", "hideStatusBar", "toolbarTabs", "codeOnly", "isProcessBuilder"], outputs: ["validationChange", "tokensChange"] }] });
|
|
2121
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: FBValidationRuleForm, isStandalone: true, selector: "mt-fb-validation-rule-form", inputs: { initialData: { classPropertyName: "initialData", publicName: "initialData", isSignal: true, isRequired: false, transformFunction: null }, availableFields: { classPropertyName: "availableFields", publicName: "availableFields", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'formBuilder'\">\r\n <div\r\n [class]=\"[\r\n modalService.contentClass,\r\n 'min-w-0',\r\n 'p-4',\r\n 'overflow-y-hidden!',\r\n 'max-[640px]:p-3',\r\n ]\"\r\n >\r\n <div class=\"mt-4 flex h-full min-h-0 flex-col gap-4 overflow-y-auto pb-10\">\r\n <mt-formula-builder\r\n [placeholder]=\"t('validation-formula-placeholder')\"\r\n [formControl]=\"formulaControl\"\r\n [levelSchemaId]=\"builderSchemaId()\"\r\n [moduleId]=\"builderModuleId()\"\r\n [contextEntityTypeKey]=\"builderContextEntityTypeKey()\"\r\n [propertiesByPath]=\"formulaPropertiesByPath()\"\r\n (validationChange)=\"onFormulaValidationChange($event)\"\r\n />\r\n <div class=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\r\n <mt-text-field\r\n [label]=\"t('message-en')\"\r\n [placeholder]=\"t('message-en')\"\r\n [formControl]=\"messageEnControl\"\r\n />\r\n <mt-text-field\r\n [label]=\"t('message-ar')\"\r\n [placeholder]=\"t('message-ar')\"\r\n [formControl]=\"messageArControl\"\r\n />\r\n </div>\r\n <mt-radio-cards-field\r\n [label]=\"t('severity')\"\r\n [hint]=\"t('severity-hint')\"\r\n [options]=\"severityOptions()\"\r\n [formControl]=\"severityControl\"\r\n />\r\n @if (saveError(); as error) {\r\n <div\r\n class=\"rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700\"\r\n >\r\n {{ error }}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n\r\n <div\r\n [class]=\"[\r\n modalService.footerClass,\r\n '!h-auto',\r\n 'min-h-0',\r\n 'flex-col',\r\n 'gap-2',\r\n 'sm:flex-row',\r\n 'sm:items-center',\r\n 'sm:justify-end',\r\n ]\"\r\n >\r\n <mt-button\r\n [label]=\"t('cancel')\"\r\n variant=\"outlined\"\r\n [disabled]=\"submitting()\"\r\n styleClass=\"w-full sm:w-auto\"\r\n (onClick)=\"onCancel()\"\r\n />\r\n <mt-button\r\n [label]=\"t('save')\"\r\n severity=\"primary\"\r\n [loading]=\"submitting()\"\r\n [disabled]=\"!canSave()\"\r\n styleClass=\"w-full sm:w-auto\"\r\n (onClick)=\"onSave()\"\r\n />\r\n </div>\r\n</ng-container>\r\n", dependencies: [{ kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: TextField, selector: "mt-text-field", inputs: ["field", "hint", "label", "placeholder", "class", "type", "readonly", "pInputs", "required", "maxLength", "icon", "iconPosition"] }, { kind: "component", type: RadioCardsField, selector: "mt-radio-cards-field", inputs: ["circle", "label", "hint", "readonly", "required", "color", "size", "optionLabel", "optionValue", "options"] }, { kind: "component", type: FormulaBuilder, selector: "mt-formula-builder", inputs: ["propertiesByPath", "levelSchemaId", "moduleId", "contextEntityTypeKey", "templateId", "placeholder", "hideToolbar", "hideStatusBar", "toolbarTabs", "codeOnly", "isProcessBuilder"], outputs: ["validationChange", "tokensChange"] }] });
|
|
2105
2122
|
}
|
|
2106
2123
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: FBValidationRuleForm, decorators: [{
|
|
2107
2124
|
type: Component,
|
|
@@ -2112,7 +2129,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
2112
2129
|
TextField,
|
|
2113
2130
|
RadioCardsField,
|
|
2114
2131
|
FormulaBuilder,
|
|
2115
|
-
], template: "<ng-container *transloco=\"let t; prefix: 'formBuilder'\">\n <div\n [class]=\"[\n modalService.contentClass,\n 'min-w-0',\n 'p-4',\n 'overflow-y-hidden!',\n 'max-[640px]:p-3',\n ]\"\n >\n <div class=\"mt-4 flex h-full min-h-0 flex-col gap-4 overflow-y-auto pb-10\">\n <mt-formula-builder\n [placeholder]=\"t('validation-formula-placeholder')\"\n [formControl]=\"formulaControl\"\n [levelSchemaId]=\"builderSchemaId()\"\n [moduleId]=\"builderModuleId()\"\n [contextEntityTypeKey]=\"builderContextEntityTypeKey()\"\n [propertiesByPath]=\"formulaPropertiesByPath()\"\n (validationChange)=\"onFormulaValidationChange($event)\"\n />\n <div class=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\n <mt-text-field\n [label]=\"t('message-en')\"\n [placeholder]=\"t('message-en')\"\n [formControl]=\"messageEnControl\"\n />\n <mt-text-field\n [label]=\"t('message-ar')\"\n [placeholder]=\"t('message-ar')\"\n [formControl]=\"messageArControl\"\n />\n </div>\n <mt-radio-cards-field\n [label]=\"t('severity')\"\n [hint]=\"t('severity-hint')\"\n [options]=\"severityOptions()\"\n [formControl]=\"severityControl\"\n />\n @if (saveError(); as error) {\n <div\n class=\"rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700\"\n >\n {{ error }}\n </div>\n }\n </div>\n </div>\n\n <div\n [class]=\"[\n modalService.footerClass,\n '!h-auto',\n 'min-h-0',\n 'flex-col',\n 'gap-2',\n 'sm:flex-row',\n 'sm:items-center',\n 'sm:justify-end',\n ]\"\n >\n <mt-button\n [label]=\"t('cancel')\"\n variant=\"outlined\"\n [disabled]=\"submitting()\"\n styleClass=\"w-full sm:w-auto\"\n (onClick)=\"onCancel()\"\n />\n <mt-button\n [label]=\"t('save')\"\n severity=\"primary\"\n [loading]=\"submitting()\"\n [disabled]=\"!canSave()\"\n styleClass=\"w-full sm:w-auto\"\n (onClick)=\"onSave()\"\n />\n </div>\n</ng-container>\n" }]
|
|
2132
|
+
], template: "<ng-container *transloco=\"let t; prefix: 'formBuilder'\">\r\n <div\r\n [class]=\"[\r\n modalService.contentClass,\r\n 'min-w-0',\r\n 'p-4',\r\n 'overflow-y-hidden!',\r\n 'max-[640px]:p-3',\r\n ]\"\r\n >\r\n <div class=\"mt-4 flex h-full min-h-0 flex-col gap-4 overflow-y-auto pb-10\">\r\n <mt-formula-builder\r\n [placeholder]=\"t('validation-formula-placeholder')\"\r\n [formControl]=\"formulaControl\"\r\n [levelSchemaId]=\"builderSchemaId()\"\r\n [moduleId]=\"builderModuleId()\"\r\n [contextEntityTypeKey]=\"builderContextEntityTypeKey()\"\r\n [propertiesByPath]=\"formulaPropertiesByPath()\"\r\n (validationChange)=\"onFormulaValidationChange($event)\"\r\n />\r\n <div class=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\r\n <mt-text-field\r\n [label]=\"t('message-en')\"\r\n [placeholder]=\"t('message-en')\"\r\n [formControl]=\"messageEnControl\"\r\n />\r\n <mt-text-field\r\n [label]=\"t('message-ar')\"\r\n [placeholder]=\"t('message-ar')\"\r\n [formControl]=\"messageArControl\"\r\n />\r\n </div>\r\n <mt-radio-cards-field\r\n [label]=\"t('severity')\"\r\n [hint]=\"t('severity-hint')\"\r\n [options]=\"severityOptions()\"\r\n [formControl]=\"severityControl\"\r\n />\r\n @if (saveError(); as error) {\r\n <div\r\n class=\"rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700\"\r\n >\r\n {{ error }}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n\r\n <div\r\n [class]=\"[\r\n modalService.footerClass,\r\n '!h-auto',\r\n 'min-h-0',\r\n 'flex-col',\r\n 'gap-2',\r\n 'sm:flex-row',\r\n 'sm:items-center',\r\n 'sm:justify-end',\r\n ]\"\r\n >\r\n <mt-button\r\n [label]=\"t('cancel')\"\r\n variant=\"outlined\"\r\n [disabled]=\"submitting()\"\r\n styleClass=\"w-full sm:w-auto\"\r\n (onClick)=\"onCancel()\"\r\n />\r\n <mt-button\r\n [label]=\"t('save')\"\r\n severity=\"primary\"\r\n [loading]=\"submitting()\"\r\n [disabled]=\"!canSave()\"\r\n styleClass=\"w-full sm:w-auto\"\r\n (onClick)=\"onSave()\"\r\n />\r\n </div>\r\n</ng-container>\r\n" }]
|
|
2116
2133
|
}], ctorParameters: () => [], propDecorators: { initialData: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialData", required: false }] }], availableFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "availableFields", required: false }] }] } });
|
|
2117
2134
|
|
|
2118
2135
|
class FBValidationRules {
|
|
@@ -2528,7 +2545,7 @@ class FormBuilder {
|
|
|
2528
2545
|
// Effect: watch context/sidebar visibility changes and load only data the UI uses.
|
|
2529
2546
|
effect(() => {
|
|
2530
2547
|
this.syncContextData();
|
|
2531
|
-
}
|
|
2548
|
+
});
|
|
2532
2549
|
}
|
|
2533
2550
|
ngOnInit() {
|
|
2534
2551
|
this.syncContextData();
|