@memberjunction/ng-simple-record-list 1.0.9 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/lib/module.d.ts
CHANGED
|
@@ -5,12 +5,11 @@ import * as i3 from "@angular/forms";
|
|
|
5
5
|
import * as i4 from "@progress/kendo-angular-dialog";
|
|
6
6
|
import * as i5 from "@memberjunction/ng-container-directives";
|
|
7
7
|
import * as i6 from "@progress/kendo-angular-buttons";
|
|
8
|
-
import * as i7 from "@progress/kendo-angular-
|
|
9
|
-
import * as i8 from "@
|
|
10
|
-
import * as i9 from "@
|
|
11
|
-
import * as i10 from "@progress/kendo-angular-indicators";
|
|
8
|
+
import * as i7 from "@progress/kendo-angular-dropdowns";
|
|
9
|
+
import * as i8 from "@memberjunction/ng-entity-form-dialog";
|
|
10
|
+
import * as i9 from "@progress/kendo-angular-indicators";
|
|
12
11
|
export declare class SimpleRecordListModule {
|
|
13
12
|
static ɵfac: i0.ɵɵFactoryDeclaration<SimpleRecordListModule, never>;
|
|
14
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<SimpleRecordListModule, [typeof i1.SimpleRecordListComponent], [typeof i2.CommonModule, typeof i3.FormsModule, typeof i4.DialogsModule, typeof i5.ContainerDirectivesModule, typeof i6.ButtonsModule, typeof i7.
|
|
13
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<SimpleRecordListModule, [typeof i1.SimpleRecordListComponent], [typeof i2.CommonModule, typeof i3.FormsModule, typeof i4.DialogsModule, typeof i5.ContainerDirectivesModule, typeof i6.ButtonsModule, typeof i7.DropDownsModule, typeof i4.DialogsModule, typeof i8.EntityFormDialogModule, typeof i9.IndicatorsModule], [typeof i1.SimpleRecordListComponent]>;
|
|
15
14
|
static ɵinj: i0.ɵɵInjectorDeclaration<SimpleRecordListModule>;
|
|
16
15
|
}
|
package/dist/lib/module.js
CHANGED
|
@@ -4,7 +4,6 @@ import { FormsModule } from '@angular/forms';
|
|
|
4
4
|
// Kendo UI Angular imports
|
|
5
5
|
import { DialogsModule } from "@progress/kendo-angular-dialog";
|
|
6
6
|
import { ButtonsModule } from '@progress/kendo-angular-buttons';
|
|
7
|
-
import { IconsModule } from '@progress/kendo-angular-icons';
|
|
8
7
|
import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
|
|
9
8
|
import { IndicatorsModule } from '@progress/kendo-angular-indicators';
|
|
10
9
|
// MJ
|
|
@@ -22,7 +21,6 @@ SimpleRecordListModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [C
|
|
|
22
21
|
DialogsModule,
|
|
23
22
|
ContainerDirectivesModule,
|
|
24
23
|
ButtonsModule,
|
|
25
|
-
IconsModule,
|
|
26
24
|
DropDownsModule,
|
|
27
25
|
DialogsModule,
|
|
28
26
|
EntityFormDialogModule,
|
|
@@ -39,7 +37,6 @@ SimpleRecordListModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [C
|
|
|
39
37
|
DialogsModule,
|
|
40
38
|
ContainerDirectivesModule,
|
|
41
39
|
ButtonsModule,
|
|
42
|
-
IconsModule,
|
|
43
40
|
DropDownsModule,
|
|
44
41
|
DialogsModule,
|
|
45
42
|
EntityFormDialogModule,
|
|
@@ -55,7 +52,6 @@ SimpleRecordListModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [C
|
|
|
55
52
|
DialogsModule,
|
|
56
53
|
ContainerDirectivesModule,
|
|
57
54
|
ButtonsModule,
|
|
58
|
-
IconsModule,
|
|
59
55
|
DropDownsModule,
|
|
60
56
|
DialogsModule,
|
|
61
57
|
EntityFormDialogModule,
|
|
@@ -1,15 +1,32 @@
|
|
|
1
1
|
import { OnInit, EventEmitter } from '@angular/core';
|
|
2
2
|
import { BaseEntity } from '@memberjunction/core';
|
|
3
|
-
import { kendoSVGIcon } from '@memberjunction/ng-shared';
|
|
4
3
|
import { Router } from '@angular/router';
|
|
5
4
|
import * as i0 from "@angular/core";
|
|
6
5
|
export declare class SimpleRecordListComponent implements OnInit {
|
|
7
6
|
private router;
|
|
7
|
+
/**
|
|
8
|
+
* Name of the entity to display records for.
|
|
9
|
+
*/
|
|
8
10
|
EntityName: string;
|
|
11
|
+
/**
|
|
12
|
+
* List of columns to display in the grid. If empty and the entity has > 10 columns, those columns marked as DefaultInView=1 will be used, otherwise the first 10 columns will be used.
|
|
13
|
+
*/
|
|
9
14
|
Columns: string[];
|
|
15
|
+
/**
|
|
16
|
+
* Name of the column to sort by. If empty, no sorting is done.
|
|
17
|
+
*/
|
|
10
18
|
SortBy: string;
|
|
19
|
+
/**
|
|
20
|
+
* If true, the delete button will be shown for each record.
|
|
21
|
+
*/
|
|
11
22
|
AllowDelete: boolean;
|
|
23
|
+
/**
|
|
24
|
+
* If true, the new button will be shown.
|
|
25
|
+
*/
|
|
12
26
|
AllowNew: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* If true, the edit button will be shown for each record.
|
|
29
|
+
*/
|
|
13
30
|
AllowEdit: boolean;
|
|
14
31
|
/**
|
|
15
32
|
* If AllowEdit or AllowNew is true, this is the section name to display for editing a new or existing record.
|
|
@@ -20,7 +37,6 @@ export declare class SimpleRecordListComponent implements OnInit {
|
|
|
20
37
|
RecordCreated: EventEmitter<BaseEntity>;
|
|
21
38
|
isLoading: boolean;
|
|
22
39
|
records: BaseEntity[];
|
|
23
|
-
kendoSVGIcon: typeof kendoSVGIcon;
|
|
24
40
|
constructor(router: Router);
|
|
25
41
|
ngOnInit(): void;
|
|
26
42
|
Refresh(): Promise<void>;
|
|
@@ -9,129 +9,157 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
9
9
|
};
|
|
10
10
|
import { Component, Input, EventEmitter, Output } from '@angular/core';
|
|
11
11
|
import { Metadata, RunView } from '@memberjunction/core';
|
|
12
|
-
import { SharedService
|
|
12
|
+
import { SharedService } from '@memberjunction/ng-shared';
|
|
13
13
|
import * as i0 from "@angular/core";
|
|
14
14
|
import * as i1 from "@angular/router";
|
|
15
15
|
import * as i2 from "@angular/common";
|
|
16
16
|
import * as i3 from "@progress/kendo-angular-dialog";
|
|
17
17
|
import * as i4 from "@memberjunction/ng-container-directives";
|
|
18
18
|
import * as i5 from "@progress/kendo-angular-buttons";
|
|
19
|
-
import * as i6 from "@
|
|
20
|
-
import * as i7 from "@
|
|
21
|
-
|
|
22
|
-
|
|
19
|
+
import * as i6 from "@memberjunction/ng-entity-form-dialog";
|
|
20
|
+
import * as i7 from "@progress/kendo-angular-indicators";
|
|
21
|
+
function SimpleRecordListComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
22
|
+
const _r6 = i0.ɵɵgetCurrentView();
|
|
23
|
+
i0.ɵɵelementStart(0, "button", 4);
|
|
24
|
+
i0.ɵɵlistener("click", function SimpleRecordListComponent_Conditional_1_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r5 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r5.createNewRecord()); });
|
|
25
|
+
i0.ɵɵelement(1, "span", 5);
|
|
26
|
+
i0.ɵɵtext(2, " New");
|
|
27
|
+
i0.ɵɵelementEnd();
|
|
28
|
+
} }
|
|
29
|
+
function SimpleRecordListComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
|
|
23
30
|
i0.ɵɵelementStart(0, "div");
|
|
24
31
|
i0.ɵɵelement(1, "kendo-loader");
|
|
25
32
|
i0.ɵɵelementEnd();
|
|
26
33
|
} }
|
|
27
|
-
function
|
|
34
|
+
function SimpleRecordListComponent_Conditional_3_th_3_Template(rf, ctx) { if (rf & 1) {
|
|
28
35
|
i0.ɵɵelementStart(0, "th");
|
|
29
36
|
i0.ɵɵtext(1);
|
|
30
37
|
i0.ɵɵelementEnd();
|
|
31
38
|
} if (rf & 2) {
|
|
32
|
-
const
|
|
39
|
+
const c_r9 = ctx.$implicit;
|
|
33
40
|
i0.ɵɵadvance();
|
|
34
|
-
i0.ɵɵtextInterpolate1(" ",
|
|
41
|
+
i0.ɵɵtextInterpolate1(" ", c_r9, " ");
|
|
35
42
|
} }
|
|
36
|
-
function
|
|
37
|
-
const
|
|
38
|
-
i0.ɵɵelementStart(0, "
|
|
39
|
-
i0.ɵɵlistener("click", function
|
|
43
|
+
function SimpleRecordListComponent_Conditional_3_tr_5_td_1_Conditional_3_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
44
|
+
const _r19 = i0.ɵɵgetCurrentView();
|
|
45
|
+
i0.ɵɵelementStart(0, "span", 12);
|
|
46
|
+
i0.ɵɵlistener("click", function SimpleRecordListComponent_Conditional_3_tr_5_td_1_Conditional_3_Conditional_1_Template_span_click_0_listener($event) { i0.ɵɵrestoreView(_r19); const r_r10 = i0.ɵɵnextContext(3).$implicit; const ctx_r17 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r17.editRecord($event, r_r10)); });
|
|
40
47
|
i0.ɵɵelementEnd();
|
|
41
|
-
} if (rf & 2) {
|
|
42
|
-
const ctx_r12 = i0.ɵɵnextContext(5);
|
|
43
|
-
i0.ɵɵproperty("icon", ctx_r12.kendoSVGIcon("pencil"));
|
|
44
48
|
} }
|
|
45
|
-
function
|
|
46
|
-
const
|
|
47
|
-
i0.ɵɵelementStart(0, "
|
|
48
|
-
i0.ɵɵlistener("click", function
|
|
49
|
+
function SimpleRecordListComponent_Conditional_3_tr_5_td_1_Conditional_3_Conditional_2_Template(rf, ctx) { if (rf & 1) {
|
|
50
|
+
const _r22 = i0.ɵɵgetCurrentView();
|
|
51
|
+
i0.ɵɵelementStart(0, "span", 13);
|
|
52
|
+
i0.ɵɵlistener("click", function SimpleRecordListComponent_Conditional_3_tr_5_td_1_Conditional_3_Conditional_2_Template_span_click_0_listener($event) { i0.ɵɵrestoreView(_r22); const r_r10 = i0.ɵɵnextContext(3).$implicit; const ctx_r20 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r20.deleteRecord($event, r_r10)); });
|
|
49
53
|
i0.ɵɵelementEnd();
|
|
50
|
-
} if (rf & 2) {
|
|
51
|
-
const ctx_r13 = i0.ɵɵnextContext(5);
|
|
52
|
-
i0.ɵɵproperty("icon", ctx_r13.kendoSVGIcon("trash"));
|
|
53
54
|
} }
|
|
54
|
-
function
|
|
55
|
+
function SimpleRecordListComponent_Conditional_3_tr_5_td_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
|
|
55
56
|
i0.ɵɵelementStart(0, "span");
|
|
56
|
-
i0.ɵɵtemplate(1,
|
|
57
|
+
i0.ɵɵtemplate(1, SimpleRecordListComponent_Conditional_3_tr_5_td_1_Conditional_3_Conditional_1_Template, 1, 0, "span", 10)(2, SimpleRecordListComponent_Conditional_3_tr_5_td_1_Conditional_3_Conditional_2_Template, 1, 0, "span", 11);
|
|
57
58
|
i0.ɵɵelementEnd();
|
|
58
59
|
} if (rf & 2) {
|
|
59
|
-
const
|
|
60
|
+
const ctx_r14 = i0.ɵɵnextContext(4);
|
|
60
61
|
i0.ɵɵadvance();
|
|
61
|
-
i0.ɵɵ
|
|
62
|
+
i0.ɵɵconditional(1, ctx_r14.AllowEdit ? 1 : -1);
|
|
62
63
|
i0.ɵɵadvance();
|
|
63
|
-
i0.ɵɵ
|
|
64
|
+
i0.ɵɵconditional(2, ctx_r14.AllowDelete ? 2 : -1);
|
|
64
65
|
} }
|
|
65
|
-
function
|
|
66
|
+
function SimpleRecordListComponent_Conditional_3_tr_5_td_1_Template(rf, ctx) { if (rf & 1) {
|
|
66
67
|
i0.ɵɵelementStart(0, "td")(1, "span");
|
|
67
68
|
i0.ɵɵtext(2);
|
|
68
69
|
i0.ɵɵelementEnd();
|
|
69
|
-
i0.ɵɵtemplate(3,
|
|
70
|
+
i0.ɵɵtemplate(3, SimpleRecordListComponent_Conditional_3_tr_5_td_1_Conditional_3_Template, 3, 2, "span");
|
|
70
71
|
i0.ɵɵelementEnd();
|
|
71
72
|
} if (rf & 2) {
|
|
72
|
-
const
|
|
73
|
-
const
|
|
74
|
-
const
|
|
75
|
-
const
|
|
73
|
+
const c_r12 = ctx.$implicit;
|
|
74
|
+
const i_r13 = ctx.index;
|
|
75
|
+
const r_r10 = i0.ɵɵnextContext().$implicit;
|
|
76
|
+
const ctx_r11 = i0.ɵɵnextContext(2);
|
|
76
77
|
i0.ɵɵadvance(2);
|
|
77
|
-
i0.ɵɵtextInterpolate(
|
|
78
|
+
i0.ɵɵtextInterpolate(r_r10.Get(c_r12));
|
|
78
79
|
i0.ɵɵadvance();
|
|
79
|
-
i0.ɵɵ
|
|
80
|
+
i0.ɵɵconditional(3, i_r13 === 0 && (ctx_r11.AllowDelete || ctx_r11.AllowEdit) ? 3 : -1);
|
|
80
81
|
} }
|
|
81
|
-
function
|
|
82
|
-
const
|
|
83
|
-
i0.ɵɵelementStart(0, "tr",
|
|
84
|
-
i0.ɵɵlistener("click", function
|
|
85
|
-
i0.ɵɵtemplate(1,
|
|
82
|
+
function SimpleRecordListComponent_Conditional_3_tr_5_Template(rf, ctx) { if (rf & 1) {
|
|
83
|
+
const _r25 = i0.ɵɵgetCurrentView();
|
|
84
|
+
i0.ɵɵelementStart(0, "tr", 9);
|
|
85
|
+
i0.ɵɵlistener("click", function SimpleRecordListComponent_Conditional_3_tr_5_Template_tr_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r25); const r_r10 = restoredCtx.$implicit; const ctx_r24 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r24.selectRecord(undefined, r_r10)); });
|
|
86
|
+
i0.ɵɵtemplate(1, SimpleRecordListComponent_Conditional_3_tr_5_td_1_Template, 4, 2, "td", 7);
|
|
86
87
|
i0.ɵɵelementEnd();
|
|
87
88
|
} if (rf & 2) {
|
|
88
|
-
const
|
|
89
|
+
const ctx_r8 = i0.ɵɵnextContext(2);
|
|
89
90
|
i0.ɵɵadvance();
|
|
90
|
-
i0.ɵɵproperty("ngForOf",
|
|
91
|
+
i0.ɵɵproperty("ngForOf", ctx_r8.Columns);
|
|
91
92
|
} }
|
|
92
|
-
function
|
|
93
|
-
i0.ɵɵelementStart(0, "table",
|
|
94
|
-
i0.ɵɵtemplate(3,
|
|
93
|
+
function SimpleRecordListComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
|
|
94
|
+
i0.ɵɵelementStart(0, "table", 6)(1, "thead")(2, "tr");
|
|
95
|
+
i0.ɵɵtemplate(3, SimpleRecordListComponent_Conditional_3_th_3_Template, 2, 1, "th", 7);
|
|
95
96
|
i0.ɵɵelementEnd()();
|
|
96
97
|
i0.ɵɵelementStart(4, "tbody");
|
|
97
|
-
i0.ɵɵtemplate(5,
|
|
98
|
+
i0.ɵɵtemplate(5, SimpleRecordListComponent_Conditional_3_tr_5_Template, 2, 1, "tr", 8);
|
|
98
99
|
i0.ɵɵelementEnd()();
|
|
99
100
|
} if (rf & 2) {
|
|
100
|
-
const
|
|
101
|
+
const ctx_r2 = i0.ɵɵnextContext();
|
|
101
102
|
i0.ɵɵadvance(3);
|
|
102
|
-
i0.ɵɵproperty("ngForOf",
|
|
103
|
+
i0.ɵɵproperty("ngForOf", ctx_r2.Columns);
|
|
103
104
|
i0.ɵɵadvance(2);
|
|
104
|
-
i0.ɵɵproperty("ngForOf",
|
|
105
|
+
i0.ɵɵproperty("ngForOf", ctx_r2.records);
|
|
106
|
+
} }
|
|
107
|
+
function SimpleRecordListComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
|
|
108
|
+
const _r28 = i0.ɵɵgetCurrentView();
|
|
109
|
+
i0.ɵɵelementStart(0, "mj-entity-form-dialog", 14, 15);
|
|
110
|
+
i0.ɵɵlistener("close", function SimpleRecordListComponent_Conditional_4_Template_mj_entity_form_dialog_close_0_listener($event) { i0.ɵɵrestoreView(_r28); const ctx_r27 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r27.onEditOrNewRecordFormClosed($event)); });
|
|
111
|
+
i0.ɵɵelementEnd();
|
|
112
|
+
} if (rf & 2) {
|
|
113
|
+
const ctx_r3 = i0.ɵɵnextContext();
|
|
114
|
+
i0.ɵɵproperty("Record", ctx_r3.editOrNewRecord)("SectionName", ctx_r3.EditSectionName)("Visible", ctx_r3.showEditOrNewRecordForm)("AutoRevertOnCancel", true)("HandleSave", true)("Width", 550)("Height", 450);
|
|
105
115
|
} }
|
|
106
|
-
function
|
|
107
|
-
const
|
|
108
|
-
i0.ɵɵelementStart(0, "kendo-dialog",
|
|
109
|
-
i0.ɵɵlistener("close", function
|
|
116
|
+
function SimpleRecordListComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
|
|
117
|
+
const _r30 = i0.ɵɵgetCurrentView();
|
|
118
|
+
i0.ɵɵelementStart(0, "kendo-dialog", 16);
|
|
119
|
+
i0.ɵɵlistener("close", function SimpleRecordListComponent_Conditional_5_Template_kendo_dialog_close_0_listener() { i0.ɵɵrestoreView(_r30); const ctx_r29 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r29.closeDeleteDialog("No")); });
|
|
110
120
|
i0.ɵɵelementStart(1, "div");
|
|
111
121
|
i0.ɵɵtext(2);
|
|
112
122
|
i0.ɵɵelementEnd();
|
|
113
|
-
i0.ɵɵelementStart(3, "kendo-dialog-actions")(4, "button",
|
|
114
|
-
i0.ɵɵlistener("click", function
|
|
123
|
+
i0.ɵɵelementStart(3, "kendo-dialog-actions")(4, "button", 17);
|
|
124
|
+
i0.ɵɵlistener("click", function SimpleRecordListComponent_Conditional_5_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r30); const ctx_r31 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r31.closeDeleteDialog("Yes")); });
|
|
115
125
|
i0.ɵɵtext(5, "Yes");
|
|
116
126
|
i0.ɵɵelementEnd();
|
|
117
|
-
i0.ɵɵelementStart(6, "button",
|
|
118
|
-
i0.ɵɵlistener("click", function
|
|
127
|
+
i0.ɵɵelementStart(6, "button", 4);
|
|
128
|
+
i0.ɵɵlistener("click", function SimpleRecordListComponent_Conditional_5_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r30); const ctx_r32 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r32.closeDeleteDialog("No")); });
|
|
119
129
|
i0.ɵɵtext(7, "No");
|
|
120
130
|
i0.ɵɵelementEnd()()();
|
|
121
131
|
} if (rf & 2) {
|
|
122
|
-
const
|
|
123
|
-
i0.ɵɵproperty("title", "Delete " +
|
|
132
|
+
const ctx_r4 = i0.ɵɵnextContext();
|
|
133
|
+
i0.ɵɵproperty("title", "Delete " + ctx_r4.EntityName + "?")("width", 450)("height", 200);
|
|
124
134
|
i0.ɵɵadvance(2);
|
|
125
|
-
i0.ɵɵtextInterpolate1(" Are you sure you want to delete '",
|
|
135
|
+
i0.ɵɵtextInterpolate1(" Are you sure you want to delete '", ctx_r4.getRecordName(ctx_r4.deleteRecordItem), "'? ");
|
|
126
136
|
} }
|
|
127
137
|
export class SimpleRecordListComponent {
|
|
128
138
|
constructor(router) {
|
|
129
139
|
this.router = router;
|
|
140
|
+
/**
|
|
141
|
+
* Name of the entity to display records for.
|
|
142
|
+
*/
|
|
130
143
|
this.EntityName = '';
|
|
144
|
+
/**
|
|
145
|
+
* List of columns to display in the grid. If empty and the entity has > 10 columns, those columns marked as DefaultInView=1 will be used, otherwise the first 10 columns will be used.
|
|
146
|
+
*/
|
|
131
147
|
this.Columns = [];
|
|
148
|
+
/**
|
|
149
|
+
* Name of the column to sort by. If empty, no sorting is done.
|
|
150
|
+
*/
|
|
132
151
|
this.SortBy = '';
|
|
152
|
+
/**
|
|
153
|
+
* If true, the delete button will be shown for each record.
|
|
154
|
+
*/
|
|
133
155
|
this.AllowDelete = true;
|
|
156
|
+
/**
|
|
157
|
+
* If true, the new button will be shown.
|
|
158
|
+
*/
|
|
134
159
|
this.AllowNew = true;
|
|
160
|
+
/**
|
|
161
|
+
* If true, the edit button will be shown for each record.
|
|
162
|
+
*/
|
|
135
163
|
this.AllowEdit = true;
|
|
136
164
|
/**
|
|
137
165
|
* If AllowEdit or AllowNew is true, this is the section name to display for editing a new or existing record.
|
|
@@ -142,7 +170,6 @@ export class SimpleRecordListComponent {
|
|
|
142
170
|
this.RecordCreated = new EventEmitter();
|
|
143
171
|
this.isLoading = false;
|
|
144
172
|
this.records = [];
|
|
145
|
-
this.kendoSVGIcon = kendoSVGIcon;
|
|
146
173
|
this.deleteRecordDialogVisible = false;
|
|
147
174
|
this.showEditOrNewRecordForm = false;
|
|
148
175
|
this.recordMode = 'new';
|
|
@@ -238,6 +265,8 @@ export class SimpleRecordListComponent {
|
|
|
238
265
|
}
|
|
239
266
|
onEditOrNewRecordFormClosed(result) {
|
|
240
267
|
return __awaiter(this, void 0, void 0, function* () {
|
|
268
|
+
if (!this.editOrNewRecord)
|
|
269
|
+
return; // this can happen if the user closes the form before the record is loaded
|
|
241
270
|
this.showEditOrNewRecordForm = false;
|
|
242
271
|
if (result === 'Save') {
|
|
243
272
|
// the dialog already saved the record, just check to make sure it was saved and if so, navigate
|
|
@@ -276,30 +305,24 @@ export class SimpleRecordListComponent {
|
|
|
276
305
|
}
|
|
277
306
|
}
|
|
278
307
|
SimpleRecordListComponent.ɵfac = function SimpleRecordListComponent_Factory(t) { return new (t || SimpleRecordListComponent)(i0.ɵɵdirectiveInject(i1.Router)); };
|
|
279
|
-
SimpleRecordListComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SimpleRecordListComponent, selectors: [["mj-simple-record-list"]], inputs: { EntityName: "EntityName", Columns: "Columns", SortBy: "SortBy", AllowDelete: "AllowDelete", AllowNew: "AllowNew", AllowEdit: "AllowEdit", EditSectionName: "EditSectionName" }, outputs: { RecordSelected: "RecordSelected", RecordEdited: "RecordEdited", RecordCreated: "RecordCreated" }, decls:
|
|
280
|
-
i0.ɵɵelementStart(0, "div", 0)
|
|
281
|
-
i0.ɵɵ
|
|
282
|
-
i0.ɵɵtext(2, "New Record");
|
|
283
|
-
i0.ɵɵelementEnd();
|
|
284
|
-
i0.ɵɵtemplate(3, SimpleRecordListComponent_div_3_Template, 2, 0, "div", 2)(4, SimpleRecordListComponent_table_4_Template, 6, 2, "table", 3);
|
|
308
|
+
SimpleRecordListComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SimpleRecordListComponent, selectors: [["mj-simple-record-list"]], inputs: { EntityName: "EntityName", Columns: "Columns", SortBy: "SortBy", AllowDelete: "AllowDelete", AllowNew: "AllowNew", AllowEdit: "AllowEdit", EditSectionName: "EditSectionName" }, outputs: { RecordSelected: "RecordSelected", RecordEdited: "RecordEdited", RecordCreated: "RecordCreated" }, decls: 6, vars: 4, consts: [["mjFillContainer", "", 1, "wrapper"], ["kendoButton", ""], ["Mode", "section", 3, "Record", "SectionName", "Visible", "AutoRevertOnCancel", "HandleSave", "Width", "Height"], [3, "title", "width", "height"], ["kendoButton", "", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "grid"], [4, "ngFor", "ngForOf"], [3, "click", 4, "ngFor", "ngForOf"], [3, "click"], ["class", "fa-solid fa-pen-to-square icon"], ["class", "fa-solid fa-trash-can icon"], [1, "fa-solid", "fa-pen-to-square", "icon", 3, "click"], [1, "fa-solid", "fa-trash-can", "icon", 3, "click"], ["Mode", "section", 3, "Record", "SectionName", "Visible", "AutoRevertOnCancel", "HandleSave", "Width", "Height", "close"], ["entityForm", ""], [3, "title", "width", "height", "close"], ["kendoButton", "", "themeColor", "primary", 3, "click"]], template: function SimpleRecordListComponent_Template(rf, ctx) { if (rf & 1) {
|
|
309
|
+
i0.ɵɵelementStart(0, "div", 0);
|
|
310
|
+
i0.ɵɵtemplate(1, SimpleRecordListComponent_Conditional_1_Template, 3, 0, "button", 1)(2, SimpleRecordListComponent_Conditional_2_Template, 2, 0, "div")(3, SimpleRecordListComponent_Conditional_3_Template, 6, 2);
|
|
285
311
|
i0.ɵɵelementEnd();
|
|
286
|
-
i0.ɵɵ
|
|
287
|
-
i0.ɵɵlistener("close", function SimpleRecordListComponent_Template_mj_entity_form_dialog_close_5_listener($event) { return ctx.onEditOrNewRecordFormClosed($event); });
|
|
288
|
-
i0.ɵɵelementEnd();
|
|
289
|
-
i0.ɵɵtemplate(7, SimpleRecordListComponent_kendo_dialog_7_Template, 8, 4, "kendo-dialog", 6);
|
|
312
|
+
i0.ɵɵtemplate(4, SimpleRecordListComponent_Conditional_4_Template, 2, 7, "mj-entity-form-dialog", 2)(5, SimpleRecordListComponent_Conditional_5_Template, 8, 4, "kendo-dialog", 3);
|
|
290
313
|
} if (rf & 2) {
|
|
291
|
-
i0.ɵɵadvance(3);
|
|
292
|
-
i0.ɵɵproperty("ngIf", ctx.isLoading);
|
|
293
314
|
i0.ɵɵadvance();
|
|
294
|
-
i0.ɵɵ
|
|
315
|
+
i0.ɵɵconditional(1, ctx.AllowNew ? 1 : -1);
|
|
295
316
|
i0.ɵɵadvance();
|
|
296
|
-
i0.ɵɵ
|
|
317
|
+
i0.ɵɵconditional(2, ctx.isLoading ? 2 : 3);
|
|
297
318
|
i0.ɵɵadvance(2);
|
|
298
|
-
i0.ɵɵ
|
|
299
|
-
|
|
319
|
+
i0.ɵɵconditional(4, ctx.AllowNew || ctx.AllowEdit ? 4 : -1);
|
|
320
|
+
i0.ɵɵadvance();
|
|
321
|
+
i0.ɵɵconditional(5, ctx.deleteRecordDialogVisible && ctx.AllowDelete ? 5 : -1);
|
|
322
|
+
} }, dependencies: [i2.NgForOf, i3.DialogComponent, i3.DialogActionsComponent, i4.FillContainer, i5.ButtonComponent, i6.EntityFormDialog, i7.LoaderComponent], styles: ["button[_ngcontent-%COMP%] {\n margin-left: 5px;\n margin-top: 5px;\n width: 125px;\n}\n\n.wrapper[_ngcontent-%COMP%] {\n padding-right: 10px;\n}\n\n\n\ntable[_ngcontent-%COMP%] {\n margin-left: 5px;\n margin-top: 10px;\n margin-right: 5px;\n border-collapse: collapse; \n\n width: 100%;\n}\n \ntable[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n background-color: #f2f2f2; \n\n color: black; \n\n font-weight: bold; \n\n text-align: left;\n}\n\n\n\ntable[_ngcontent-%COMP%] th[_ngcontent-%COMP%], table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n height: 36px; \n\n padding: 0 8px; \n\n}\n\n\n\ntable[_ngcontent-%COMP%] td[_ngcontent-%COMP%]:first-child {\n display: flex; \n\n justify-content: space-between; \n\n align-items: center; \n\n padding-right: 8px; \n\n}\n\n\n\ntd[_ngcontent-%COMP%]:first-child span[_ngcontent-%COMP%]:first-child {\n border: none; \n\n}\n\n\n\ntd[_ngcontent-%COMP%]:first-child span[_ngcontent-%COMP%]:last-child {\n border: none; \n\n}\n\n\n\ntd[_ngcontent-%COMP%]:first-child .icon[_ngcontent-%COMP%] {\n margin-left: 10px; \n\n cursor: pointer; \n\n}\n\ntable[_ngcontent-%COMP%] tr[_ngcontent-%COMP%] {\n cursor: pointer;\n}\n\ntable[_ngcontent-%COMP%] tr[_ngcontent-%COMP%]:hover {\n background-color: #e7f4ff; \n\n}"] });
|
|
300
323
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SimpleRecordListComponent, [{
|
|
301
324
|
type: Component,
|
|
302
|
-
args: [{ selector: 'mj-simple-record-list', template: "<div mjFillContainer class=\"wrapper\">\n <button kendoButton (click)=\"createNewRecord()\">New
|
|
325
|
+
args: [{ selector: 'mj-simple-record-list', template: "<div mjFillContainer class=\"wrapper\">\n @if(AllowNew) {\n <button kendoButton (click)=\"createNewRecord()\"><span class=\"fa-solid fa-plus\"></span> New</button>\n }\n @if(isLoading) {\n <div>\n <kendo-loader></kendo-loader>\n </div>\n }\n @else {\n <table class=\"grid\">\n <thead>\n <tr>\n <th *ngFor=\"let c of Columns\">\n {{ c }}\n </th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let r of records\" (click)=\"selectRecord(undefined, r)\">\n <td *ngFor=\"let c of Columns; let i = index\">\n <span>{{ r.Get(c) }}</span>\n @if(i === 0 && (AllowDelete || AllowEdit)) {\n <span>\n @if (AllowEdit) {\n <span class=\"fa-solid fa-pen-to-square icon\" (click)=\"editRecord($event, r)\"></span>\n }\n @if (AllowDelete) {\n <span class=\"fa-solid fa-trash-can icon\" (click)=\"deleteRecord($event, r)\"></span>\n }\n </span> \n }\n </td>\n </tr>\n </tbody>\n </table> \n }\n</div>\n \n@if(AllowNew || AllowEdit) {\n<mj-entity-form-dialog #entityForm \n [Record]=\"editOrNewRecord\" \n [SectionName]=\"EditSectionName\"\n Mode=\"section\" \n [Visible]=\"showEditOrNewRecordForm\" \n [AutoRevertOnCancel]=\"true\"\n [HandleSave]=\"true\"\n [Width]=\"550\"\n [Height]=\"450\"\n (close)=\"onEditOrNewRecordFormClosed($event)\">\n</mj-entity-form-dialog>\n}\n\n@if(deleteRecordDialogVisible && AllowDelete) {\n<kendo-dialog\n [title]=\"'Delete ' + EntityName + '?'\" \n [width]=\"450\"\n [height]=\"200\"\n (close)=\"closeDeleteDialog('No')\" >\n <div>\n Are you sure you want to delete '{{getRecordName(deleteRecordItem!)}}'?\n </div>\n <kendo-dialog-actions>\n <button kendoButton (click)=\"closeDeleteDialog('Yes')\" themeColor=\"primary\">Yes</button>\n <button kendoButton (click)=\"closeDeleteDialog('No')\">No</button>\n </kendo-dialog-actions>\n</kendo-dialog>\n}\n", styles: ["button {\n margin-left: 5px;\n margin-top: 5px;\n width: 125px;\n}\n\n.wrapper {\n padding-right: 10px;\n}\n\n/* Style for the whole table */\ntable {\n margin-left: 5px;\n margin-top: 10px;\n margin-right: 5px;\n border-collapse: collapse; /* Ensures border collapse for a cleaner look */\n width: 100%;\n}\n \ntable th {\n background-color: #f2f2f2; /* Light gray background for headers */\n color: black; /* Black text color for headers */\n font-weight: bold; /* Bold font weight for headers */\n text-align: left;\n}\n\n/* Style for all table cells */\ntable th, table td {\n height: 36px; /* Fixed height for all rows */\n padding: 0 8px; /* Add some padding inside cells */\n}\n\n/* Style for the first column cells */\ntable td:first-child {\n display: flex; /* Make the cell a flex container */\n justify-content: space-between; /* Space out the text and icons */\n align-items: center; /* Center items vertically */\n padding-right: 8px; /* Ensure there is some padding on the right */\n}\n\n/* Style for the text span within the first column */\ntd:first-child span:first-child {\n border: none; /* Ensures no border is applied to the span */\n}\n\n/* Style for the icons container span within the first column */\ntd:first-child span:last-child {\n border: none; /* Ensures no border is applied to the span */\n}\n\n/* Style for the icons within the first column */\ntd:first-child .icon {\n margin-left: 10px; /* Space between icons if needed */\n cursor: pointer; /* Change cursor to pointer on hover */\n}\n\ntable tr {\n cursor: pointer;\n}\n\ntable tr:hover {\n background-color: #e7f4ff; /* Light blue for even rows */\n}\n "] }]
|
|
303
326
|
}], () => [{ type: i1.Router }], { EntityName: [{
|
|
304
327
|
type: Input
|
|
305
328
|
}], Columns: [{
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@memberjunction/ng-simple-record-list",
|
|
3
|
-
"version": "1.0
|
|
3
|
+
"version": "1.1.0",
|
|
4
4
|
"description": "MemberJunction: Very simple and reusable Angular component for displaying, editing, creating and deleting records in any entity",
|
|
5
5
|
"main": "./dist/public-api.js",
|
|
6
6
|
"typings": "./dist/public-api.d.ts",
|
|
@@ -25,12 +25,12 @@
|
|
|
25
25
|
"@angular/router": "~17.2.2"
|
|
26
26
|
},
|
|
27
27
|
"dependencies": {
|
|
28
|
-
"@memberjunction/core-entities": "
|
|
29
|
-
"@memberjunction/global": "
|
|
30
|
-
"@memberjunction/core": "
|
|
31
|
-
"@memberjunction/ng-container-directives": "
|
|
32
|
-
"@memberjunction/ng-shared": "
|
|
33
|
-
"@memberjunction/ng-entity-form-dialog": "
|
|
28
|
+
"@memberjunction/core-entities": "~1.1.0",
|
|
29
|
+
"@memberjunction/global": "~1.1.0",
|
|
30
|
+
"@memberjunction/core": "~1.1.0",
|
|
31
|
+
"@memberjunction/ng-container-directives": "~1.1.0",
|
|
32
|
+
"@memberjunction/ng-shared": "~1.1.0",
|
|
33
|
+
"@memberjunction/ng-entity-form-dialog": "~1.1.0",
|
|
34
34
|
"@progress/kendo-angular-buttons": "~15.1.0",
|
|
35
35
|
"@progress/kendo-angular-dialog": "~15.1.0",
|
|
36
36
|
"@progress/kendo-angular-layout": "~15.1.0",
|