dotnetreport-ng 6.3.0 → 6.3.1-beta.1
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.
|
@@ -135,7 +135,7 @@ class DotnetdashboardComponent {
|
|
|
135
135
|
<!-- ko if: ['DateTime','Date','Time'].indexOf(fieldType) != -1 -->
|
|
136
136
|
<div style="display: flex; align-items: center; gap: 8px;">
|
|
137
137
|
<!-- ko if: ['=','>','<','>=','<=', 'not equal'].indexOf($parent.Operator()) != -1 -->
|
|
138
|
-
<input class="form-control" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat:
|
|
138
|
+
<input class="form-control" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat: (['Date','Date and Time','Time'].indexOf(fieldFormat()) >= 0 && dateFormat() && dateFormat() !== 'Custom') ? $root.dateFormatMappings[dateFormat()] : $root.dateFormatMappings[($root.appSettings && $root.appSettings.defaultDateFormat) || 'United States']}" required />
|
|
139
139
|
<!-- ko if: fieldType=='Time' || fieldFormat()=='Time' || fieldFormat()=='Date and Time'-->
|
|
140
140
|
<input class="form-control" type="time" data-bind="value:$parent.Valuetime" required>
|
|
141
141
|
<!-- /ko -->
|
|
@@ -144,14 +144,14 @@ class DotnetdashboardComponent {
|
|
|
144
144
|
<!-- ko if: ['between'].indexOf($parent.Operator()) != -1 -->
|
|
145
145
|
From
|
|
146
146
|
<div style="display: flex; align-items: center; gap: 8px;">
|
|
147
|
-
<input required class="form-control from-date" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat:
|
|
147
|
+
<input required class="form-control from-date" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat: (['Date','Date and Time','Time'].indexOf(fieldFormat()) >= 0 && dateFormat() && dateFormat() !== 'Custom') ? $root.dateFormatMappings[dateFormat()] : $root.dateFormatMappings[($root.appSettings && $root.appSettings.defaultDateFormat) || 'United States']}" />
|
|
148
148
|
<!-- ko if:fieldType=='Time' || fieldFormat()=='Time' || fieldFormat()=='Date and Time'-->
|
|
149
149
|
<input class="form-control" type="time" data-bind="value:$parent.Valuetime" required>
|
|
150
150
|
<!-- /ko -->
|
|
151
151
|
</div>
|
|
152
152
|
to
|
|
153
153
|
<div style="display: flex; align-items: center; gap: 8px;">
|
|
154
|
-
<input data-bind="datepicker: $parent.fmtValue2, datepickerOptions: {value: $parent.Value2, dateFormat:
|
|
154
|
+
<input data-bind="datepicker: $parent.fmtValue2, datepickerOptions: {value: $parent.Value2, dateFormat: (['Date','Date and Time','Time'].indexOf(fieldFormat()) >= 0 && dateFormat() && dateFormat() !== 'Custom') ? $root.dateFormatMappings[dateFormat()] : $root.dateFormatMappings[($root.appSettings && $root.appSettings.defaultDateFormat) || 'United States']}" class="form-control to-date" required />
|
|
155
155
|
<!-- ko if:fieldType=='Time' || fieldFormat()=='Time' || fieldFormat()=='Date and Time'-->
|
|
156
156
|
<input class="form-control" type="time" data-bind="value:$parent.Valuetime2" required>
|
|
157
157
|
<!-- /ko -->
|
|
@@ -293,7 +293,7 @@ class DotnetdashboardComponent {
|
|
|
293
293
|
<th data-bind="attr: { id: !IsPivotField ? fieldId : 'pivot--' + fieldName }, style: {'text-align': fieldAlign() ? fieldAlign() : (IsNumeric ? 'right' : 'left'), 'background-color': headerBackColor }, hidden: outerGroup" style="border-right: 1px solid;">
|
|
294
294
|
|
|
295
295
|
<!-- ko if: !$parent.IsDrillDown() && !$parent.IsSubReport() -->
|
|
296
|
-
<div class="
|
|
296
|
+
<div class="pull-left" style="padding-right: 5px;">
|
|
297
297
|
<div class="dropup">
|
|
298
298
|
<a href="#" data-bs-toggle="dropdown" aria-haspopup="false" aria-expanded="false">
|
|
299
299
|
<span class="fa fa-ellipsis-v sortable" title="Drag to reorder"></span>
|
|
@@ -3044,7 +3044,7 @@ class DotnetdashboardComponent {
|
|
|
3044
3044
|
</div>
|
|
3045
3045
|
<div class="checkbox" data-bind="visible: adminMode()">
|
|
3046
3046
|
<label>
|
|
3047
|
-
<input type="checkbox" data-bind="checked:
|
|
3047
|
+
<input type="checkbox" data-bind="checked: ShowAdminOnly">
|
|
3048
3048
|
Hide from reports unless Admin Mode is enabled
|
|
3049
3049
|
</label>
|
|
3050
3050
|
</div>
|
|
@@ -3053,7 +3053,7 @@ class DotnetdashboardComponent {
|
|
|
3053
3053
|
<i class="fa fa-folder-open"></i> Choose Folder
|
|
3054
3054
|
</label>
|
|
3055
3055
|
<div>
|
|
3056
|
-
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID"></select>
|
|
3056
|
+
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID, valueAllowUnset: true"></select>
|
|
3057
3057
|
</div>
|
|
3058
3058
|
</div>
|
|
3059
3059
|
<hr />
|
|
@@ -3339,7 +3339,7 @@ class DotnetdashboardComponent {
|
|
|
3339
3339
|
</div>
|
|
3340
3340
|
<div class="checkbox" data-bind="visible: adminMode()">
|
|
3341
3341
|
<label>
|
|
3342
|
-
<input type="checkbox" data-bind="checked:
|
|
3342
|
+
<input type="checkbox" data-bind="checked: ShowAdminOnly">
|
|
3343
3343
|
Hide from reports unless Admin Mode is enabled
|
|
3344
3344
|
</label>
|
|
3345
3345
|
</div>
|
|
@@ -3348,7 +3348,7 @@ class DotnetdashboardComponent {
|
|
|
3348
3348
|
<i class="fa fa-folder-open"></i> Choose Folder
|
|
3349
3349
|
</label>
|
|
3350
3350
|
<div>
|
|
3351
|
-
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID"></select>
|
|
3351
|
+
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID, valueAllowUnset: true"></select>
|
|
3352
3352
|
</div>
|
|
3353
3353
|
</div>
|
|
3354
3354
|
</div>
|
|
@@ -3483,13 +3483,13 @@ class DotnetdashboardComponent {
|
|
|
3483
3483
|
<label><input type="checkbox" data-bind="checked: isSubReportOnly, click: function() { setTimeout(function() { toggleIsSubReportOnly(); }, 0); return true; }"> Only use as sub report</label>
|
|
3484
3484
|
</div>
|
|
3485
3485
|
<div class="checkbox" data-bind="visible: adminMode()">
|
|
3486
|
-
<label><input type="checkbox" data-bind="checked:
|
|
3486
|
+
<label><input type="checkbox" data-bind="checked: ShowAdminOnly"> </label>
|
|
3487
3487
|
Hide from reports unless Admin Mode is enabled
|
|
3488
3488
|
</div>
|
|
3489
3489
|
<div class="form-group row mb-2" data-bind="visible: SaveReport">
|
|
3490
3490
|
<label class="control-label"><i class="fa fa-folder-open"></i> Folder</label>
|
|
3491
3491
|
<div>
|
|
3492
|
-
<select class="form-select form-select-sm" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID"></select>
|
|
3492
|
+
<select class="form-select form-select-sm" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID, valueAllowUnset: true"></select>
|
|
3493
3493
|
</div>
|
|
3494
3494
|
</div>
|
|
3495
3495
|
<hr class="my-1" />
|
|
@@ -4753,7 +4753,7 @@ class DotnetreportComponent {
|
|
|
4753
4753
|
<!-- ko if: ['DateTime','Date','Time'].indexOf(fieldType) != -1 -->
|
|
4754
4754
|
<div style="display: flex; align-items: center; gap: 8px;">
|
|
4755
4755
|
<!-- ko if: ['=','>','<','>=','<=', 'not equal'].indexOf($parent.Operator()) != -1 -->
|
|
4756
|
-
<input class="form-control" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat:
|
|
4756
|
+
<input class="form-control" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat: (['Date','Date and Time','Time'].indexOf(fieldFormat()) >= 0 && dateFormat() && dateFormat() !== 'Custom') ? $root.dateFormatMappings[dateFormat()] : $root.dateFormatMappings[($root.appSettings && $root.appSettings.defaultDateFormat) || 'United States']}" required />
|
|
4757
4757
|
<!-- ko if: fieldType=='Time' || fieldFormat()=='Time' || fieldFormat()=='Date and Time'-->
|
|
4758
4758
|
<input class="form-control" type="time" data-bind="value:$parent.Valuetime" required>
|
|
4759
4759
|
<!-- /ko -->
|
|
@@ -4762,14 +4762,14 @@ class DotnetreportComponent {
|
|
|
4762
4762
|
<!-- ko if: ['between'].indexOf($parent.Operator()) != -1 -->
|
|
4763
4763
|
From
|
|
4764
4764
|
<div style="display: flex; align-items: center; gap: 8px;">
|
|
4765
|
-
<input required class="form-control from-date" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat:
|
|
4765
|
+
<input required class="form-control from-date" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat: (['Date','Date and Time','Time'].indexOf(fieldFormat()) >= 0 && dateFormat() && dateFormat() !== 'Custom') ? $root.dateFormatMappings[dateFormat()] : $root.dateFormatMappings[($root.appSettings && $root.appSettings.defaultDateFormat) || 'United States']}" />
|
|
4766
4766
|
<!-- ko if:fieldType=='Time' || fieldFormat()=='Time' || fieldFormat()=='Date and Time'-->
|
|
4767
4767
|
<input class="form-control" type="time" data-bind="value:$parent.Valuetime" required>
|
|
4768
4768
|
<!-- /ko -->
|
|
4769
4769
|
</div>
|
|
4770
4770
|
to
|
|
4771
4771
|
<div style="display: flex; align-items: center; gap: 8px;">
|
|
4772
|
-
<input data-bind="datepicker: $parent.fmtValue2, datepickerOptions: {value: $parent.Value2, dateFormat:
|
|
4772
|
+
<input data-bind="datepicker: $parent.fmtValue2, datepickerOptions: {value: $parent.Value2, dateFormat: (['Date','Date and Time','Time'].indexOf(fieldFormat()) >= 0 && dateFormat() && dateFormat() !== 'Custom') ? $root.dateFormatMappings[dateFormat()] : $root.dateFormatMappings[($root.appSettings && $root.appSettings.defaultDateFormat) || 'United States']}" class="form-control to-date" required />
|
|
4773
4773
|
<!-- ko if:fieldType=='Time' || fieldFormat()=='Time' || fieldFormat()=='Date and Time'-->
|
|
4774
4774
|
<input class="form-control" type="time" data-bind="value:$parent.Valuetime2" required>
|
|
4775
4775
|
<!-- /ko -->
|
|
@@ -4911,7 +4911,7 @@ class DotnetreportComponent {
|
|
|
4911
4911
|
<th data-bind="attr: { id: !IsPivotField ? fieldId : 'pivot--' + fieldName }, style: {'text-align': fieldAlign() ? fieldAlign() : (IsNumeric ? 'right' : 'left'), 'background-color': headerBackColor }, hidden: outerGroup" style="border-right: 1px solid;">
|
|
4912
4912
|
|
|
4913
4913
|
<!-- ko if: !$parent.IsDrillDown() && !$parent.IsSubReport() -->
|
|
4914
|
-
<div class="
|
|
4914
|
+
<div class="pull-left" style="padding-right: 5px;">
|
|
4915
4915
|
<div class="dropup">
|
|
4916
4916
|
<a href="#" data-bs-toggle="dropdown" aria-haspopup="false" aria-expanded="false">
|
|
4917
4917
|
<span class="fa fa-ellipsis-v sortable" title="Drag to reorder"></span>
|
|
@@ -7662,7 +7662,7 @@ class DotnetreportComponent {
|
|
|
7662
7662
|
</div>
|
|
7663
7663
|
<div class="checkbox" data-bind="visible: adminMode()">
|
|
7664
7664
|
<label>
|
|
7665
|
-
<input type="checkbox" data-bind="checked:
|
|
7665
|
+
<input type="checkbox" data-bind="checked: ShowAdminOnly">
|
|
7666
7666
|
Hide from reports unless Admin Mode is enabled
|
|
7667
7667
|
</label>
|
|
7668
7668
|
</div>
|
|
@@ -7671,7 +7671,7 @@ class DotnetreportComponent {
|
|
|
7671
7671
|
<i class="fa fa-folder-open"></i> Choose Folder
|
|
7672
7672
|
</label>
|
|
7673
7673
|
<div>
|
|
7674
|
-
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID"></select>
|
|
7674
|
+
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID, valueAllowUnset: true"></select>
|
|
7675
7675
|
</div>
|
|
7676
7676
|
</div>
|
|
7677
7677
|
<hr />
|
|
@@ -7957,7 +7957,7 @@ class DotnetreportComponent {
|
|
|
7957
7957
|
</div>
|
|
7958
7958
|
<div class="checkbox" data-bind="visible: adminMode()">
|
|
7959
7959
|
<label>
|
|
7960
|
-
<input type="checkbox" data-bind="checked:
|
|
7960
|
+
<input type="checkbox" data-bind="checked: ShowAdminOnly">
|
|
7961
7961
|
Hide from reports unless Admin Mode is enabled
|
|
7962
7962
|
</label>
|
|
7963
7963
|
</div>
|
|
@@ -7966,7 +7966,7 @@ class DotnetreportComponent {
|
|
|
7966
7966
|
<i class="fa fa-folder-open"></i> Choose Folder
|
|
7967
7967
|
</label>
|
|
7968
7968
|
<div>
|
|
7969
|
-
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID"></select>
|
|
7969
|
+
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID, valueAllowUnset: true"></select>
|
|
7970
7970
|
</div>
|
|
7971
7971
|
</div>
|
|
7972
7972
|
</div>
|
|
@@ -8101,13 +8101,13 @@ class DotnetreportComponent {
|
|
|
8101
8101
|
<label><input type="checkbox" data-bind="checked: isSubReportOnly, click: function() { setTimeout(function() { toggleIsSubReportOnly(); }, 0); return true; }"> Only use as sub report</label>
|
|
8102
8102
|
</div>
|
|
8103
8103
|
<div class="checkbox" data-bind="visible: adminMode()">
|
|
8104
|
-
<label><input type="checkbox" data-bind="checked:
|
|
8104
|
+
<label><input type="checkbox" data-bind="checked: ShowAdminOnly"> </label>
|
|
8105
8105
|
Hide from reports unless Admin Mode is enabled
|
|
8106
8106
|
</div>
|
|
8107
8107
|
<div class="form-group row mb-2" data-bind="visible: SaveReport">
|
|
8108
8108
|
<label class="control-label"><i class="fa fa-folder-open"></i> Folder</label>
|
|
8109
8109
|
<div>
|
|
8110
|
-
<select class="form-select form-select-sm" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID"></select>
|
|
8110
|
+
<select class="form-select form-select-sm" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID, valueAllowUnset: true"></select>
|
|
8111
8111
|
</div>
|
|
8112
8112
|
</div>
|
|
8113
8113
|
<hr class="my-1" />
|
|
@@ -9074,11 +9074,11 @@ class DotnetreportComponent {
|
|
|
9074
9074
|
});
|
|
9075
9075
|
}
|
|
9076
9076
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DotnetreportComponent, deps: [{ token: i0.Injector }, { token: i1.DomSanitizer }, { token: i0.ChangeDetectorRef }, { token: BASE_URL_TOKEN }, { token: i2.HttpClient }, { token: i3.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
|
|
9077
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: DotnetreportComponent, isStandalone: true, selector: "app-dotnetreport", ngImport: i0, template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n<div class=\"container-fluid\">\r\n <div data-bind=\"template: {name: 'admin-mode-template'}, visible: allowAdmin\" style=\"display: none;\"></div>\r\n\r\n <!--\r\n The markup code below is related to presentation. You don't have to change it, unless you\r\n intentionally want to change something in the Report Builder's behavior in your Application.\r\n It's Recommended you use it as is. You will be responsible for managing and maintaining any changes.\r\n -->\r\n <!-- Folders/Report List -->\r\n <div id=\"report-start\" data-bind=\"if: ReportMode() == 'start' || ReportMode() == 'generate'\">\r\n <div class=\"card folder-panel\" data-bind=\"visible: true\" style=\"display: none;\">\r\n <div class=\"card-header\">\r\n <nav class=\"navbar navbar-expand-lg navbar-light bg-light\">\r\n <a class=\"navbar-brand\" href=\"#\" data-bind=\"click: function() {SelectedFolder(null); designingHeader(false); designingFooter(false); searchReports(''); $('#search-report').val([]).trigger('change'); }\">Manage Reports</a>\r\n <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarSupportedContent\" aria-controls=\"navbarSupportedContent\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <span class=\"navbar-toggler-icon\"></span>\r\n </button>\r\n\r\n <div class=\"collapse navbar-collapse\" id=\"navbarSupportedContent\">\r\n <ul class=\"navbar-nav mr-auto\">\r\n <li class=\"nav-item\" data-bind=\"visible: SelectedFolder() ? SelectedFolder().canEdit : (CanSaveReports() || adminMode())\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: createNewReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-plus\"></span> New Report\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" data-bind=\"visible: CanManageFolders() || adminMode()\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: ManageFolder.newFolder\">\r\n <span class=\"fa fa-folder-open\"></span> Add Folder\r\n </a>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: (CanManageFolders() || adminMode()) && SelectedFolder()!=null && (SelectedFolder().canEdit || SelectedFolder().canDelete || adminMode())\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-folder\"></span> Folder Options\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ManageFolder.editFolder, visible: SelectedFolder() && (SelectedFolder().canEdit || adminMode())\">Edit Selected Folder</a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ManageFolder.deleteFolder, visible: SelectedFolder() && (SelectedFolder().canDelete || adminMode())\">Delete Selected Folder</a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: adminMode() && SelectedFolder() ==null\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-window-maximize\"></span> Header / Footer\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ initHeaderDesigner(false); }\">\r\n <span class=\"fa fa-arrow-up\"></span> Report Header\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ initFooterDesigner(false); }\">\r\n <span class=\"fa fa-arrow-down\"></span> Report Footer\r\n </a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: appSettings.showImportExport() || adminMode()\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-exchange\"></span> Import / Export\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ selectMode(!selectMode()); }\">\r\n <span data-bind=\"css: selectMode() ? 'fa fa-check-square text-primary' : 'fa fa-square-o'\"></span>\r\n <span data-bind=\"text: selectMode() ? 'Cancel Select Mode' : 'Select Mode'\"></span>\r\n </a>\r\n <div class=\"dropdown-divider\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadFileModal\" data-bind=\"visible: !selectMode()\" title=\"Import Report from JSON file\">\r\n <span class=\"fa fa-upload\"></span> Import Reports\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: selectMode, click: exportSelectedReportJson\">\r\n <span class=\"fa fa-download\"></span> Export Selected Reports\r\n </a>\r\n </div>\r\n </li>\r\n </ul>\r\n <div class=\"form-inline my-2 my-lg-0 ms-auto w-50\">\r\n <div class=\"input-group w-100\">\r\n <p id=\"search-input\" class=\"form-control search-input\" data-placeholder=\"Search Report by Name, Description or Data Field...\"></p>\r\n <span data-bind=\"click: searchForReports\" class=\"input-group-text\" style=\"height: 38px; cursor: pointer;\" title=\"Search\"><i class=\"fa fa-search\"></i></span>\r\n <span data-bind=\"click: function() {resetQuery(true, true);}\" class=\"input-group-text\" style=\"height: 38px; cursor: pointer;\" title=\"Clear Search\"><i class=\"fa fa-close\"></i></span>\r\n </div>\r\n </div>\r\n </div>\r\n </nav>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"visible: designingHeader, with: headerDesigner\" style=\"display: none;\" class=\"overflow-auto\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseReportHeader\"> Use Report Header\r\n </label>\r\n </div>\r\n <div data-bind=\"visible: UseReportHeader\">\r\n <p class=\"alert alert-info\">\r\n You can design the common report header below that will be applied to all reports where report headers are turned on.\r\n </p>\r\n <div class=\"form-group row m-1\" data-bind=\"visible: clientListIds().length > 0\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Headers for other Clients saved</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <select class=\"form-control\"\r\n data-bind=\"options: clientListIds,\r\n value: selectedHeaderClientId,\r\n optionsCaption: 'No Client Id (Global)',\r\n event: { change: function () { loadHtmlHeader(true); } }\">\r\n </select>\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" class=\"fa fa-question-circle helptip\"\r\n title=\"Choose a client to design its report header\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Specify Client Id to Restrict Access</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <input class=\"form-control text-box single-line\" type=\"text\" data-bind=\"value: headerClientId\">\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" data-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Leave blank to give all clients access (Global Report Header)\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-12\">\r\n <div class=\"dropdown d-inline-block me-2\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n Insert System Variable\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.number}'); }\">Page Number</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.total}'); }\">Total Pages</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user}'); }\">Current User</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user.roles}'); }\">Current User Roles</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.datetime}'); }\">Current Date/Time</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{report.name}'); }\">Report Name</a></li>\r\n </ul>\r\n </div>\r\n <label class=\"ms-2\">\r\n <input type=\"checkbox\" data-bind=\"checked: IncludeOnEveryPage\" /> Include on every page in PDF/Word export\r\n </label>\r\n </div>\r\n </div>\r\n <textarea id=\"report-header-editor\"></textarea>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlHeader\">\r\n Save Changes\r\n </button>\r\n </div>\r\n <div data-bind=\"visible: !UseReportHeader()\">\r\n <p class=\"alert alert-info\">\r\n If you turn off the <b>Use Report Header</b> option,\r\n the <b>Report Header</b> will not be applied in reports.\r\n </p>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlHeader\">\r\n Save Changes\r\n </button>\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: designingFooter, with: footerDesigner\" style=\"display: none;\" class=\"overflow-auto\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseReportFooter\"> Use Report Footer\r\n </label>\r\n </div>\r\n <div data-bind=\"visible: UseReportFooter\">\r\n <p class=\"alert alert-info\">\r\n You can design the common report footer below that will be applied to all reports where report footers are turned on.\r\n </p>\r\n <div class=\"form-group row m-1\" data-bind=\"visible: clientListIds().length > 0\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Footers for other Clients saved</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <select class=\"form-control\"\r\n data-bind=\"options: clientListIds,\r\n value: selectedFooterClientId,\r\n optionsCaption: 'No Client Id (Global)',\r\n event: { change: function () { loadHtmlFooter(true); } }\">\r\n </select>\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" class=\"fa fa-question-circle helptip\"\r\n title=\"Choose a client to design its report footer\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Specify Client Id to Restrict Access</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <input class=\"form-control text-box single-line\" type=\"text\" data-bind=\"value: footerClientId\">\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" data-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Leave blank to give all clients access (Global Report Footer)\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-12\">\r\n <div class=\"dropdown d-inline-block me-2\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n Insert System Variable\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.number}'); }\">Page Number</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.total}'); }\">Total Pages</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user}'); }\">Current User</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user.roles}'); }\">Current User Roles</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.datetime}'); }\">Current Date/Time</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{report.name}'); }\">Report Name</a></li>\r\n </ul>\r\n </div>\r\n <label class=\"ms-2\">\r\n <input type=\"checkbox\" data-bind=\"checked: IncludeOnEveryPage\" /> Include on every page in PDF/Word export\r\n </label>\r\n </div>\r\n </div>\r\n <textarea id=\"report-footer-editor\"></textarea>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlFooter\">\r\n Save Changes\r\n </button>\r\n </div>\r\n <div data-bind=\"visible: !UseReportFooter()\">\r\n <p class=\"alert alert-info\">\r\n If you turn off the <b>Use Report Footer</b> option,\r\n the <b>Report Footer</b> will not be applied in reports.\r\n </p>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlFooter\">\r\n Save Changes\r\n </button>\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: !designingHeader() && !designingFooter()\">\r\n <div class=\"btn-group\" style=\"float: right\" role=\"group\">\r\n <button type=\"button\" class=\"btn btn-light\" data-bs-toggle=\"tooltip\" title=\"List View\"\r\n data-bind=\"css: { 'active': layout() === 'list' }, click: toggleLayout\">\r\n <span class=\"fa fa-list\"></span>\r\n </button>\r\n <button type=\"button\" class=\"btn btn-light\" data-bs-toggle=\"tooltip\" title=\"Icon View\"\r\n data-bind=\"css: { 'active': layout() === 'icons' }, click: toggleLayout\">\r\n <span class=\"fa fa-th-large\"></span>\r\n </button>\r\n </div>\r\n\r\n <div data-bind=\"if: layout()=='icons'\">\r\n <div data-bind=\"visible: !SelectedFolder() && !searchReports()\">\r\n <p>Please choose Folders below to view Reports</p>\r\n <ul class=\"folder-list\" data-bind=\"foreach: Folders\">\r\n <li data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <span data-bind=\"visible: $root.selectMode, click: function(d,e){ isSelected(!isSelected()); e.stopPropagation(); },\r\n css: isSelected() ? 'fa fa-check-square text-primary me-2' : 'fa fa-square-o me-2'\"></span>\r\n <span class=\"fa fa-3x fa-folder text-secondary\"></span>\r\n <span class=\"desc\" data-bind=\"text: FolderName\"></span>\r\n <div data-bind=\"visible: $root.adminMode\" style=\"font-size: 0.75em; margin-top: 4px;\" onclick=\"event.stopPropagation()\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserId ? UserId : 'Any User'\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserRoles ? UserRoles : 'Any Role'\"></span>\r\n </div> \r\n </li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"clearfix\">\r\n <p class=\"float-start\">Please choose a Report from this Folder</p>\r\n <div class=\"float-end\">\r\n <a href=\"#\" class=\"btn btn-light\" data-bind=\"click: function(){ SelectedFolder(null); searchReports(''); $('#search-report').val([]).trigger('change');}\">\r\n ..back to Folders\r\n </a>\r\n </div>\r\n </div>\r\n <div class=\"list-group list-overflow\">\r\n <div data-bind=\"if: SelectedFolder()!=null && reportsInFolder().length==0\">\r\n This folder is empty.\r\n </div>\r\n <div data-bind=\"if: searchReports() && reportsInSearch().length==0 && foldersInSearch().length==0\">\r\n No results found matching your search.\r\n </div>\r\n <!-- Folder search results (icon view) -->\r\n <div data-bind=\"if: searchReports() && foldersInSearch().length > 0\">\r\n <div class=\"mt-1 mb-1\"><strong><span class=\"fa fa-folder\"></span> Matching Folders</strong></div>\r\n <ul class=\"folder-list\" data-bind=\"foreach: foldersInSearch\">\r\n <li data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.searchReports(''); }\">\r\n <span class=\"fa fa-3x fa-folder text-secondary\"></span>\r\n <span class=\"desc\" data-bind=\"highlightedText: { text: FolderName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n <div data-bind=\"visible: $root.adminMode\" style=\"font-size: 0.75em; margin-top: 4px;\" onclick=\"event.stopPropagation()\">\r\n <div class=\"d-flex flex-wrap gap-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n <hr />\r\n </div>\r\n <div class=\"list-group\" data-bind=\"foreach: searchReports() ? reportsInSearch() : reportsInFolder()\">\r\n <div class=\"list-group-item\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-7\">\r\n <input type=\"checkbox\" data-bind=\"visible: $root.selectMode, checked: isSelected\" class=\"float-start me-2\" />\r\n <div class=\"fa fa-2x float-start\" data-bind=\"css: {'fa-file': reportType=='List', 'fa-th-list': reportType=='Summary', 'fa-bar-chart': reportType=='Bar', 'fa-pie-chart': reportType=='Pie', 'fa-line-chart': reportType=='Line', 'fa-globe': reportType.indexOf('Map')==0, 'fa-window-maximize': reportType=='Single', 'fa-random': reportType=='Pivot', 'fa-window-restore': reportType=='Treemap', 'fa-signal': reportType == 'Combo', 'fa-code': reportType == 'Html', 'fa-map': reportType == 'HeatMap'}\"></div>\r\n <div class=\"float-start\">\r\n <h4>\r\n <a data-bind=\"click: runReport\" style=\"cursor: pointer\">\r\n <span data-bind=\"highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n </a>\r\n </h4>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n <p data-bind=\"text: reportDescription\"></p>\r\n <p data-bind=\"if: $parent.searchReports()\">\r\n <span class=\"fa fa-folder\"></span> <span data-bind=\"text: folderName\"></span>\r\n <span>\r\n <span data-bind=\"text: message\" class=\"highlight small\"></span>\r\n </span>\r\n </p>\r\n <div data-bind=\"if: isSubReportOnly && isSubReportOnly()\">\r\n <span class=\"badge bg-warning text-dark mt-1\"><i class=\"fa fa-link\"></i> Sub Report Only</span>\r\n </div>\r\n <div data-bind=\"if: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center mt-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: userId ? '\uD83D\uDC64 ' + userId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: viewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: deleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (userRole ? userRole : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: viewOnlyUserRole\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: deleteOnlyUserRole\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: clientId\"> \uD83C\uDFE2 <span data-bind=\"text: clientId\"></span> </span>\r\n <a data-bind=\"attr: {href: '/DotNetReport/?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\" title=\"Direct Link\"><span class=\"fa fa-link\"></span></a>\r\n <a href=\"#\" data-bind=\"click: function() { navigator && navigator.clipboard && navigator.clipboard.writeText('/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId) }\" title=\"Copy Link\"><span class=\"fa fa-copy\"></span></a>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-5 right-align\">\r\n <div class=\"d-none d-md-block\">\r\n <br />\r\n <span data-bind=\"if: $root.CanSaveReports() || $root.adminMode() \">\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"visible: canEdit, click: openReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-edit\" aria-hidden=\"true\"></span> Edit\r\n </button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-copy\" aria-hidden=\"true\"></span> Copy\r\n </button>\r\n </span>\r\n <div class=\"btn-group\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: runReport\">\r\n <span class=\"fa fa-gears\" aria-hidden=\"true\"></span> Run\r\n </button>\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle dropdown-toggle-split\" data-bs-toggle=\"dropdown\" style=\"margin-left: -4px;\">\r\n <span class=\"sr-only\"></span>\r\n </button>\r\n <div class=\"dropdown-menu dropdown-menu-right\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { exportReport($root.appSettings.useAltPdf ? 'pdfalt' : 'pdf');}\">\r\n <span class=\"fas fa-file-pdf\"></span> Download PDF\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel (Expanded)\r\n </a>\r\n <div class=\"dropdown-divider\" data-bind=\"visible: !isSubReportOnly()\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"visible: !isSubReportOnly(), click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </div>\r\n </div>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\" aria-hidden=\"true\"></span> Delete\r\n </button>\r\n <br />\r\n </div>\r\n\r\n <div class=\"d-block d-md-none\">\r\n <span data-bind=\"if: $root.CanSaveReports() || $root.adminMode()\">\r\n <button class=\"btn btn-sm btn-outline-secondary\" title=\"Edit\" data-bind=\"visible: canEdit, click: openReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-edit\" aria-hidden=\"true\"></span>\r\n </button>\r\n <button class=\"btn btn-sm btn-light\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\" title=\"Copy Report\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-copy\" aria-hidden=\"true\"></span>\r\n </button>\r\n </span>\r\n\r\n <div class=\"btn-group\">\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: runReport\" title=\"Run Report\">\r\n <span class=\"fa fa-gears\" aria-hidden=\"true\"></span>\r\n </button>\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle dropdown-toggle-split\" data-bs-toggle=\"dropdown\" style=\"margin-left: -4px;\">\r\n <span class=\"sr-only\"></span>\r\n </button>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel with inner rows\r\n </a>\r\n <div class=\"dropdown-divider\" data-bind=\"visible: !isSubReportOnly()\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"visible: !isSubReportOnly(), click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <button class=\"btn btn-sm btn-outline-secondary\" title=\"Delete Report\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\" aria-hidden=\"true\"></span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: layout()=='list'\">\r\n <div class=\"file-explorer-container\">\r\n <nav class=\"breadcrumb\">\r\n <a href=\"#\" class=\"breadcrumb-item\" data-bind=\"click: function(){ SelectedFolder(null); searchReports(''); }\">\r\n All Folders\r\n </a>\r\n <span class=\"breadcrumb-item active\" data-bind=\"visible: SelectedFolder && !searchReports(), text: SelectedFolder()?.FolderName\"></span>\r\n <span class=\"breadcrumb-item active\" data-bind=\"visible: searchReports\">\r\n Search Results\r\n </span>\r\n </nav>\r\n\r\n <div data-bind=\"visible: !SelectedFolder() && !searchReports()\">\r\n <div class=\"container-fluid\">\r\n <div class=\"row fw-bold border-bottom py-2 w-100\">\r\n <div class=\"col-md-5\">Name</div>\r\n <div class=\"col-md-1\"></div>\r\n <div class=\"col-md-6\" data-bind=\"visible: adminMode\">Access Control</div>\r\n </div>\r\n <div class=\"\" data-bind=\"foreach: Folders\">\r\n <div class=\"row py-2 border-bottom align-items-center w-100\" >\r\n <div class=\"col-md-5 d-flex align-items-center clickable\" data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <span data-bind=\"visible: $root.selectMode, click: function(d,e){ isSelected(!isSelected()); e.stopPropagation(); },\r\n css: isSelected() ? 'fa fa-check-square text-primary me-2' : 'fa fa-square-o me-2'\"></span>\r\n <span class=\"fa fa-folder text-secondary me-2\"></span>\r\n <span data-bind=\"text: FolderName\"></span>\r\n </div>\r\n <div class=\"col-md-1\" onclick=\"event.stopPropagation()\">\r\n <div class=\"dropdown\" data-bind=\"visible: ($root.CanManageFolders() || $root.adminMode()) && (canEdit || canDelete || $root.adminMode())\">\r\n <button class=\"btn btn-sm\" type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-h\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.ManageFolder.editFolder(); }, visible: canEdit || $root.adminMode()\">\r\n <span class=\"fa fa-edit\"></span> Edit Folder\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item text-danger\" href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.ManageFolder.deleteFolder(); }, visible: canDelete || $root.adminMode()\">\r\n <span class=\"fa fa-trash\"></span> Delete Folder\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"container-fluid\">\r\n <div data-bind=\"if: SelectedFolder()!=null && reportsInFolder().length==0\">\r\n <p class=\"text-muted\">This folder is empty.</p>\r\n </div>\r\n\r\n <div data-bind=\"if: searchReports() && reportsInSearch().length==0 && foldersInSearch().length==0\">\r\n <p class=\"text-center text-muted\">No results found matching your search.</p>\r\n </div>\r\n <!-- Folder search results (list view) -->\r\n <div data-bind=\"if: searchReports() && foldersInSearch().length > 0\">\r\n <div class=\"row fw-bold py-1 border-bottom mt-2 w-100\">\r\n <div class=\"col-md-6\"><span class=\"fa fa-folder\"></span> Matching Folders</div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $root.adminMode\">Access</div>\r\n </div>\r\n <div data-bind=\"foreach: foldersInSearch\">\r\n <div class=\"row border-bottom py-2 align-items-center w-100\">\r\n <div class=\"col-md-6 d-flex align-items-center\">\r\n <span class=\"fa fa-folder text-secondary me-2\"></span>\r\n <a href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.searchReports(''); }, highlightedText: { text: FolderName, highlight: $parent.searchReports, css: 'highlight' }\" style=\"cursor: pointer\"></a>\r\n </div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $root.adminMode\">\r\n <div class=\"small text-muted d-flex flex-wrap gap-1 align-items-center\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mb-2\"></div>\r\n </div>\r\n <div data-bind=\"if: reportsInFolder().length > 0 || reportsInSearch().length > 0\">\r\n <div class=\"row fw-bold border-bottom py-2 w-100\">\r\n <div class=\"col-md-4\">Name</div>\r\n <div class=\"col-md-1\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: searchReports()\">Folder</div>\r\n <div class=\"col-md-2\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: adminMode\">Access</div>\r\n <div class=\"col-md-1\" data-bind=\"visible: adminMode\">Direct Link</div>\r\n </div>\r\n\r\n <div class=\"report-list\" data-bind=\"foreach: searchReports() ? reportsInSearch() : reportsInFolder()\">\r\n <div class=\"row border-bottom py-2 align-items-center w-100\">\r\n <div class=\"col-md-4 d-flex align-items-center\">\r\n <input type=\"checkbox\" data-bind=\"visible: $root.selectMode, checked: isSelected\" class=\"me-2\" />\r\n <span class=\"fa\" data-bind=\"css: {\r\n 'fa-file': reportType=='List',\r\n 'fa-th-list': reportType=='Summary',\r\n 'fa-bar-chart': reportType=='Bar',\r\n 'fa-pie-chart': reportType=='Pie',\r\n 'fa-line-chart': reportType=='Line',\r\n 'fa-signal': reportType=='Combo',\r\n 'fa-globe': reportType.indexOf('Map')==0,\r\n 'fa-window-maximize': reportType=='Single',\r\n 'fa-random': reportType=='Pivot',\r\n 'fa-window-restore': reportType=='Treemap',\r\n 'fa-code': reportType == 'Html',\r\n 'fa-map': reportType == 'HeatMap'\r\n }\"></span>\r\n <a class=\"ms-2\" data-bind=\"click: runReport, highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\" style=\"cursor: pointer\"></a> \r\n <span data-bind=\"text: message\" class=\"highlight small\"></span>\r\n <span class=\"badge bg-warning text-dark ms-1\"\r\n title=\"This report is only used as a linked or sub report\"\r\n data-bind=\"visible: isSubReportOnly && isSubReportOnly()\">\r\n <i class=\"fa fa-link\"></i> Sub Report Only\r\n </span>\r\n </div>\r\n\r\n <div class=\"col-md-1\">\r\n <div class=\"dropdown\">\r\n <button class=\"btn btn-sm\" type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-h\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li data-bind=\"visible: canEdit\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: openReport\">\r\n <span class=\"fa fa-edit\"></span> Edit\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\">\r\n <span class=\"fa fa-copy\"></span> Copy\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item text-danger\" href=\"#\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\"></span> Delete\r\n </a>\r\n </li>\r\n <li><hr class=\"dropdown-divider\"></li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: runReport\">\r\n <span class=\"fa fa-gears\"></span> Run Report\r\n </a>\r\n </li>\r\n <li class=\"dropdown-submenu\">\r\n <a class=\"dropdown-item dropdown-toggle\" href=\"#\">Export</a>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport($root.appSettings.useAltPdf ? 'pdfalt' : 'pdf');}\">\r\n <span class=\"fa fa-file-pdf\"></span> Download PDF\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel (Expanded)\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li data-bind=\"visible: !isSubReportOnly()\"><hr class=\"dropdown-divider\"></li>\r\n <li data-bind=\"visible: !isSubReportOnly()\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"text: folderName, visible: $parent.searchReports()\"></div> \r\n <div class=\"col-md-4\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center mt-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: userId ? '\uD83D\uDC64 ' + userId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: viewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: deleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (userRole ? userRole : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: viewOnlyUserRole\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: deleteOnlyUserRole\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: clientId\"> \uD83C\uDFE2 <span data-bind=\"text: clientId\"></span> </span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1\" data-bind=\"visible: $parent.adminMode\">\r\n <a data-bind=\"attr: {href: '/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\"><span class=\"fa fa-link\"></span></a>\r\n \r\n <a href=\"#\" data-bind=\"click: function() { navigator && navigator.clipboard && navigator.clipboard.writeText('/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId) }\">\r\n <span class=\"fa fa-copy\" title=\"Copy Link\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n\r\n <div data-bind=\"visible: (ReportMode() == 'execute' || ReportMode() == 'linked' || ReportMode() == 'design') && !isModalOpen()\">\r\n <div class=\"card\" data-bind=\"visible: true;\" style=\"display: none;\">\r\n <div class=\"card-header\">\r\n <nav class=\"navbar navbar-expand-lg navbar-light bg-light\">\r\n <a class=\"navbar-brand\" href=\"#\">Viewing Report</a>\r\n <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarSupportedContent\" aria-controls=\"navbarSupportedContent\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <span class=\"navbar-toggler-icon\"></span>\r\n </button>\r\n <div class=\"collapse navbar-collapse\" id=\"navbarSupportedContent\">\r\n <ul class=\"navbar-nav me-auto\"></ul>\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"click: function() {$root.ReportMode('start'); $root.textQuery.setupSearch();}\">\r\n <i class=\"fa fa-arrow-left\"></i>\r\n <span>Back to Reports</span>\r\n </button>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: canGoBackToParent(), click: backToParentReport\">\r\n <i class=\"fa fa-arrow-circle-left\"></i>\r\n <span>Back to Parent Report</span>\r\n </button>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: $root.CanEdit() && ReportID(), click: function(){ SaveReport(true); }\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <i class=\"fa fa-edit\"></i> Edit Report\r\n </button>\r\n\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"click: RefreshReport, visible: false\">\r\n <i class=\"fa fa-refresh\"></i>\r\n <span>Refresh</span>\r\n </button> \r\n <span data-bind=\"visible: isDirty\" title=\"You have unsaved changes\">\r\n <i class=\"text-warning fa fa-exclamation-triangle\"></i>\r\n </span>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: $root.CanEdit(), click: SaveWithoutRun\">\r\n <i class=\"fa fa-save\"></i> \r\n <span>Save Report</span>\r\n </button>\r\n <div class=\"dropdown\" data-bind=\"hidden: (DontExecuteOnRun() && !reportRan()) || !ReportID()\">\r\n <button type=\"button\" class=\"btn btn-light btn-sm dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <i class=\"fa fa-download\"></i>\r\n <span>Export</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end\"> \r\n <li data-bind=\"hidden: appSettings.useAltPdf\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { PdfPage.isDebug = false; $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdf(false); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: adminMode() && !appSettings.useAltPdf()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { PdfPage.isDebug = true; $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdf(true); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf (Debug)\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: appSettings.useAltPdf\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdfAlt(); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcel\">\r\n <i class=\"fas fa-file-excel\"></i> Excel\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: canDrilldown\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: downloadExcelWithDrilldown\">\r\n <i class=\"fas fa-file-excel\"></i> Excel (Expanded)\r\n </a>\r\n </li>\r\n <li data-bind=\"hidden: appSettings.dontWordExport\">\r\n <a class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { $('#wordOptionsModal').modal('show'); }\r\n : function() { downloadWord(); }\">\r\n <span class=\"fas fa-file-word\"></span> Word\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadCsv\">\r\n <i class=\"fas fa-file-excel\"></i> Csv\r\n </a>\r\n </li>\r\n <li data-bind=\"hidden: appSettings.dontXmlExport\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadXml\">\r\n <i class=\"fa fa-file-code\"></i> Xml\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: printReportPage\">\r\n <i class=\"fas fa-print\"></i> Print\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </nav>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"with: ReportResult\" class=\"report-view\">\r\n <div data-bind=\"ifnot: HasError\">\r\n <div data-bind=\"with: $root\">\r\n <div>\r\n <div data-bind=\"if: EditFiltersOnReport\">\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <a data-bs-toggle=\"collapse\" data-bs-target=\"#filter-panel\" href=\"#\">\r\n <i class=\"fa fa-filter\"></i>Choose Filters\r\n </a>\r\n </div>\r\n <div id=\"filter-panel\" class=\"card-body collapse\">\r\n <div data-bind=\"if: useStoredProc\">\r\n <div class=\"row\">\r\n <div data-bind=\"template: {name: 'filter-parameters'}\" class=\"col-md-12\"></div>\r\n </div>\r\n </div>\r\n <div data-bind=\"ifnot: useStoredProc\">\r\n <div class=\"row\">\r\n <div data-bind=\"template: {name: 'filter-group'}\" class=\"col-md-12\"></div>\r\n </div>\r\n </div>\r\n <br />\r\n <button class=\"btn btn-primary\" data-bind=\"click: SaveFilterAndRunReport\">Update Filters</button>\r\n </div>\r\n </div>\r\n <br />\r\n </div>\r\n <div data-bind=\"ifnot: EditFiltersOnReport\">\r\n <div data-bind=\"template: {name: 'fly-filter-template'}\"></div>\r\n <br />\r\n </div>\r\n </div>\r\n <div class=\"report-render\" data-bind=\"css: { 'report-expanded': isExpanded }\">\r\n <div class=\"report-menubar bg-light\" data-bind=\"hidden: DontExecuteOnRun() && !reportRan()\">\r\n <div class=\"col-xs-12 col-centered d-flex justify-content-between flex-wrap\" data-bind=\"with: pager\">\r\n <div class=\"form-inline d-flex\" data-bind=\"visible: pages()\">\r\n <div class=\"form-group float-start total-records\">\r\n <span data-bind=\"text: ' Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"float-start\">\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: !$root.isChart() || $root.ShowDataWithGraph(), click: $root.downloadExcel\" title=\"Export to Excel\">\r\n <span class=\"fas fa-file-excel\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"click: $parent.toggleExpand\">\r\n <span class=\"fa\" data-bind=\"css: {'fa-expand': !$parent.isExpanded(), 'fa-compress': $parent.isExpanded() }\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: $parent.canDrilldown, click: $parent.ExpandAll\" title=\"Expand all rows\">\r\n <span class=\"fa fa-plus\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: $parent.canDrilldown, click: $parent.CollapseAll\" title=\"Collapse all rows\">\r\n <span class=\"fa fa-minus\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" title=\"Re-run Report\" data-bind=\"click: function() { $root.RunReport(false, true);}\">\r\n <i class=\"fa fa-play\"></i> \r\n </button>\r\n <div data-bind=\"with: $parent\" class=\"float-start\">\r\n <div class=\"dropdown-selected\" data-bind=\"click: toggleDropdown\">\r\n <div data-bind=\"with: selectedTableStyle\" class=\"btn btn-sm btn-secondary\" title=\"Format Table\">\r\n <span class=\"fa fa- fa-paint-brush\"></span>\r\n </div>\r\n </div>\r\n <div class=\"dropdown-content\" style=\"position: absolute;\" data-bind=\"visible: dropdownOpen\">\r\n <div data-bind=\"foreach: tableStyles\">\r\n <div class=\"dropdown-option\" data-bind=\"title: $data.name, click: $parent.selectStyle\">\r\n <div class=\"mini-table-preview\" data-bind=\"foreach: new Array(5)\">\r\n <div class=\"mini-table-row\" data-bind=\"foreach: new Array(5)\">\r\n <div class=\"mini-table-cell\" data-bind=\"style: { backgroundColor: $parentContext.$index() === 0 ? $parents[1].headerBg : ($parentContext.$index() % 2 === 0 ? $parents[1].altRowBg : $parents[1].rowBg), color: $parents[1].textColor }\"></div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div class=\"btn-group btn-group-sm d-flex\" role=\"group\">\r\n <button class=\"btn btn-light\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode\">\r\n <i class=\"fa fa-code\"></i> View Report Code\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.zoomOut\" data-bs-toggle=\"tooltip\" title=\"Zoom Out\">\r\n <i class=\"fa fa-search-minus\"></i>\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.resetZoom\" data-bs-toggle=\"tooltip\" title=\"Reset Zoom\">\r\n <i class=\"fa fa-compress\"></i>\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.zoomIn\" data-bs-toggle=\"tooltip\" title=\"Zoom In\">\r\n <i class=\"fa fa-search-plus\"></i>\r\n </button>\r\n </div>\r\n <div class=\"form-inline d-flex\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"report-canvas\" data-bind=\"hidden: DontExecuteOnRun() && !reportRan()\">\r\n <div class=\"report-container bg-light\">\r\n <div class=\"report-inner\" data-bind=\"style: { backgroundColor: tableSettings().backColor || (ReportResult() && ReportResult().ReportData() && ReportResult().ReportData().BackColor ? ReportResult().ReportData().BackColor() : '#fff') }\">\r\n <div data-bind=\"if: $root.CanEdit() && ReportType()!='Html' && ReportType()!='Single'\">\r\n <div data-bind=\"template: 'chart-settings', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"if: $root.CanEdit() && ReportType()=='Single'\">\r\n <div data-bind=\"template: 'kpi-settings', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"visible: headerDesigner.UseReportHeader\">\r\n <div id=\"report-header\" width=\"900\" height=\"120\" data-bind=\"html: $root.substituteReportPlaceholders($root.headerDesigner.headerHtml())\"></div>\r\n </div>\r\n <h2 data-bind=\"text: ReportName\"></h2>\r\n <p data-bind=\"html: ReportDescription\">\r\n </p>\r\n <div data-bind=\"template: 'filter-details-summary'\"></div>\r\n\r\n <div data-bind=\"with: ReportResult\" class=\"report-expanded-scroll\">\r\n <div data-bind=\"visible: !ReportData()\">\r\n <div class=\"report-spinner\"></div>\r\n </div>\r\n <div data-bind=\"template: 'report-template', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"visible: footerDesigner.UseReportFooter\">\r\n <div id=\"report-footer\" width=\"900\" data-bind=\"html: $root.substituteReportPlaceholders($root.footerDesigner.footerHtml())\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <br />\r\n <span>Report ran on: <span data-bind=\"text: new Date().toLocaleDateString() + ' ' + new Date().toLocaleTimeString()\"></span></span>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: HasError\">\r\n <h2 data-bind=\"text: $root.ReportName\"></h2>\r\n <p data-bind=\"text: $root.ReportDescription\"></p>\r\n\r\n <h3>An unexpected error occured while running the Report</h3>\r\n <hr />\r\n <b>Error Details</b>\r\n <div data-bind=\"text: Exception\"></div>\r\n <br />\r\n <button class=\"btn btn-light\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode\">\r\n <i class=\"fa fa-code\"></i> View Report Code\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: function() { $root.RunReport(false, true);}\">\r\n <i class=\"fa fa-play\"></i> Re-run Report\r\n </button>\r\n <hr />\r\n </div>\r\n </div>\r\n </div><!-- /flex wrapper -->\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Report Builder -->\r\n<div class=\"modal modal-fullscreen\" id=\"modal-reportbuilder\" role=\"dialog\" aria-labelledby=\"myModalLabel\" aria-hidden=\"true\" style=\"padding-right: 0px !important;\">\r\n <div data-bind=\"template: {name: 'report-designer', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Field Options Modal -->\r\n<div class=\"modal\" id=\"fieldOptionsModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div data-bind=\"template: {name: 'report-field-options', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Link Edit Modal -->\r\n<div class=\"modal\" id=\"linkModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div data-bind=\"template: {name: 'report-link-edit', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Folder Edit Modal -->\r\n<div class=\"modal\" id=\"folderModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\" data-bind=\"css: {'modal-lg': adminMode}\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageFolder\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title fs-5\">Manage Folder</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"form-group\">\r\n <label class=\"col-sm-4 col-md-4 control-label\">Folder Name</label>\r\n <div class=\"col-sm-8 col-md-8\">\r\n <input type=\"text\" class=\"form-control\" id=\"folderName\" required placeholder=\"Folder Name\" data-bind=\"value: FolderName\">\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: $root.adminMode\" class=\"form-group\">\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"showAdminOnly\" data-bind=\"checked: ShowAdminOnly\">\r\n <label class=\"form-check-label\" for=\"showAdminOnly\">\r\n Show Admin Only (Only visible when Admin Mode is ON)\r\n </label>\r\n </div>\r\n </div>\r\n <br />\r\n <div data-bind=\"visible: $root.adminMode\" class=\"card card-body\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageFolderAccess}\"></div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: saveFolder\">Save</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Json File Modal -->\r\n<div class=\"modal\" id=\"uploadFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadFileModalLabel\">Import previously Exported Reports</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n\r\n <div class=\"alert alert-info small\">\r\n <strong>Instructions:</strong><br />\r\n \u2022 Select a <code>.json</code> file previously exported from Dotnet Report.<br />\r\n \u2022 The file may include multiple reports and their folders.<br />\r\n \u2022 Any missing folders will be created automatically.<br />\r\n \u2022 If a report with the same name already exists, you will be prompted to:\r\n <em>Skip</em>, <em>Overwrite</em>, or <em>Make a Copy</em>.<br />\r\n \u2022 Once uploaded, all imported reports will be available immediately.\r\n </div>\r\n\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n Click here to select a JSON file\r\n </div>\r\n\r\n <input type=\"file\" id=\"fileInputJson\" accept=\".json\" style=\"display: none;\"\r\n data-bind=\"event: { change: handleFileSelect }\">\r\n\r\n <div class=\"mt-3\" data-bind=\"visible: fileName\">\r\n <p><strong>Selected File:</strong> <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"wordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'word-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"pdfOptionsModal\" tabindex=\"-1\" aria-labelledby=\"pdfOptionsModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- This renders the template -->\r\n<div class=\"modal\" id=\"pdfOptionsScheduleModal\" tabindex=\"-1\" aria-labelledby=\"pdfOptionsScheduleModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'pdf-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n<!-- This renders the template -->\r\n<div class=\"modal\" id=\"wordOptionsScheduleModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsScheduleModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'word-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- Schedule Report Modal -->\r\n<div class=\"modal\" id=\"modal-schedule-report\" tabindex=\"-1\" aria-labelledby=\"scheduleReportModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\">\r\n <div class=\"modal-content\" data-bind=\"with: scheduleReportModal\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"scheduleReportModalLabel\">\r\n <i class=\"fa fa-hourglass me-2\"></i> Schedule Report\r\n </h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <h6 data-bind=\"text: reportName\" class=\"mb-3\"></h6>\r\n <div data-bind=\"template: { name: 'report-schedule', data: $parent }\"></div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: saveSchedule\">Save Schedule</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
9077
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: DotnetreportComponent, isStandalone: true, selector: "app-dotnetreport", ngImport: i0, template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n<div class=\"container-fluid\">\r\n <div data-bind=\"template: {name: 'admin-mode-template'}, visible: allowAdmin\" style=\"display: none;\"></div>\r\n\r\n <!--\r\n The markup code below is related to presentation. You don't have to change it, unless you\r\n intentionally want to change something in the Report Builder's behavior in your Application.\r\n It's Recommended you use it as is. You will be responsible for managing and maintaining any changes.\r\n -->\r\n <!-- Folders/Report List -->\r\n <div id=\"report-start\" data-bind=\"if: ReportMode() == 'start' || ReportMode() == 'generate'\">\r\n <div class=\"card folder-panel\" data-bind=\"visible: true\" style=\"display: none;\">\r\n <div class=\"card-header\">\r\n <nav class=\"navbar navbar-expand-lg navbar-light bg-light\">\r\n <a class=\"navbar-brand\" href=\"#\" data-bind=\"click: function() {SelectedFolder(null); designingHeader(false); designingFooter(false); searchReports(''); $('#search-report').val([]).trigger('change'); }\">Manage Reports</a>\r\n <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarSupportedContent\" aria-controls=\"navbarSupportedContent\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <span class=\"navbar-toggler-icon\"></span>\r\n </button>\r\n\r\n <div class=\"collapse navbar-collapse\" id=\"navbarSupportedContent\">\r\n <ul class=\"navbar-nav mr-auto\">\r\n <li class=\"nav-item\" data-bind=\"visible: SelectedFolder() ? SelectedFolder().canEdit : (CanSaveReports() || adminMode())\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: createNewReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-plus\"></span> New Report\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" data-bind=\"visible: CanManageFolders() || adminMode()\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: ManageFolder.newFolder\">\r\n <span class=\"fa fa-folder-open\"></span> Add Folder\r\n </a>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: (CanManageFolders() || adminMode()) && SelectedFolder()!=null && (SelectedFolder().canEdit || SelectedFolder().canDelete || adminMode())\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-folder\"></span> Folder Options\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ManageFolder.editFolder, visible: SelectedFolder() && (SelectedFolder().canEdit || adminMode())\">Edit Selected Folder</a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ManageFolder.deleteFolder, visible: SelectedFolder() && (SelectedFolder().canDelete || adminMode())\">Delete Selected Folder</a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: adminMode() && SelectedFolder() ==null\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-window-maximize\"></span> Header / Footer\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ initHeaderDesigner(false); }\">\r\n <span class=\"fa fa-arrow-up\"></span> Report Header\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ initFooterDesigner(false); }\">\r\n <span class=\"fa fa-arrow-down\"></span> Report Footer\r\n </a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: appSettings.showImportExport() || adminMode()\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-exchange\"></span> Import / Export\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ selectMode(!selectMode()); }\">\r\n <span data-bind=\"css: selectMode() ? 'fa fa-check-square text-primary' : 'fa fa-square-o'\"></span>\r\n <span data-bind=\"text: selectMode() ? 'Cancel Select Mode' : 'Select Mode'\"></span>\r\n </a>\r\n <div class=\"dropdown-divider\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadFileModal\" data-bind=\"visible: !selectMode()\" title=\"Import Report from JSON file\">\r\n <span class=\"fa fa-upload\"></span> Import Reports\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: selectMode, click: exportSelectedReportJson\">\r\n <span class=\"fa fa-download\"></span> Export Selected Reports\r\n </a>\r\n </div>\r\n </li>\r\n </ul>\r\n <div class=\"form-inline my-2 my-lg-0 ms-auto w-50\">\r\n <div class=\"input-group w-100\">\r\n <p id=\"search-input\" class=\"form-control search-input\" data-placeholder=\"Search Report by Name, Description or Data Field...\"></p>\r\n <span data-bind=\"click: searchForReports\" class=\"input-group-text\" style=\"height: 38px; cursor: pointer;\" title=\"Search\"><i class=\"fa fa-search\"></i></span>\r\n <span data-bind=\"click: function() {resetQuery(true, true);}\" class=\"input-group-text\" style=\"height: 38px; cursor: pointer;\" title=\"Clear Search\"><i class=\"fa fa-close\"></i></span>\r\n </div>\r\n </div>\r\n </div>\r\n </nav>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"visible: designingHeader, with: headerDesigner\" style=\"display: none;\" class=\"overflow-auto\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseReportHeader\"> Use Report Header\r\n </label>\r\n </div>\r\n <div data-bind=\"visible: UseReportHeader\">\r\n <p class=\"alert alert-info\">\r\n You can design the common report header below that will be applied to all reports where report headers are turned on.\r\n </p>\r\n <div class=\"form-group row m-1\" data-bind=\"visible: clientListIds().length > 0\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Headers for other Clients saved</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <select class=\"form-control\"\r\n data-bind=\"options: clientListIds,\r\n value: selectedHeaderClientId,\r\n optionsCaption: 'No Client Id (Global)',\r\n event: { change: function () { loadHtmlHeader(true); } }\">\r\n </select>\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" class=\"fa fa-question-circle helptip\"\r\n title=\"Choose a client to design its report header\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Specify Client Id to Restrict Access</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <input class=\"form-control text-box single-line\" type=\"text\" data-bind=\"value: headerClientId\">\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" data-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Leave blank to give all clients access (Global Report Header)\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-12\">\r\n <div class=\"dropdown d-inline-block me-2\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n Insert System Variable\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.number}'); }\">Page Number</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.total}'); }\">Total Pages</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user}'); }\">Current User</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user.roles}'); }\">Current User Roles</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.datetime}'); }\">Current Date/Time</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{report.name}'); }\">Report Name</a></li>\r\n </ul>\r\n </div>\r\n <label class=\"ms-2\">\r\n <input type=\"checkbox\" data-bind=\"checked: IncludeOnEveryPage\" /> Include on every page in PDF/Word export\r\n </label>\r\n </div>\r\n </div>\r\n <textarea id=\"report-header-editor\"></textarea>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlHeader\">\r\n Save Changes\r\n </button>\r\n </div>\r\n <div data-bind=\"visible: !UseReportHeader()\">\r\n <p class=\"alert alert-info\">\r\n If you turn off the <b>Use Report Header</b> option,\r\n the <b>Report Header</b> will not be applied in reports.\r\n </p>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlHeader\">\r\n Save Changes\r\n </button>\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: designingFooter, with: footerDesigner\" style=\"display: none;\" class=\"overflow-auto\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseReportFooter\"> Use Report Footer\r\n </label>\r\n </div>\r\n <div data-bind=\"visible: UseReportFooter\">\r\n <p class=\"alert alert-info\">\r\n You can design the common report footer below that will be applied to all reports where report footers are turned on.\r\n </p>\r\n <div class=\"form-group row m-1\" data-bind=\"visible: clientListIds().length > 0\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Footers for other Clients saved</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <select class=\"form-control\"\r\n data-bind=\"options: clientListIds,\r\n value: selectedFooterClientId,\r\n optionsCaption: 'No Client Id (Global)',\r\n event: { change: function () { loadHtmlFooter(true); } }\">\r\n </select>\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" class=\"fa fa-question-circle helptip\"\r\n title=\"Choose a client to design its report footer\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Specify Client Id to Restrict Access</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <input class=\"form-control text-box single-line\" type=\"text\" data-bind=\"value: footerClientId\">\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" data-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Leave blank to give all clients access (Global Report Footer)\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-12\">\r\n <div class=\"dropdown d-inline-block me-2\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n Insert System Variable\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.number}'); }\">Page Number</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.total}'); }\">Total Pages</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user}'); }\">Current User</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user.roles}'); }\">Current User Roles</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.datetime}'); }\">Current Date/Time</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{report.name}'); }\">Report Name</a></li>\r\n </ul>\r\n </div>\r\n <label class=\"ms-2\">\r\n <input type=\"checkbox\" data-bind=\"checked: IncludeOnEveryPage\" /> Include on every page in PDF/Word export\r\n </label>\r\n </div>\r\n </div>\r\n <textarea id=\"report-footer-editor\"></textarea>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlFooter\">\r\n Save Changes\r\n </button>\r\n </div>\r\n <div data-bind=\"visible: !UseReportFooter()\">\r\n <p class=\"alert alert-info\">\r\n If you turn off the <b>Use Report Footer</b> option,\r\n the <b>Report Footer</b> will not be applied in reports.\r\n </p>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlFooter\">\r\n Save Changes\r\n </button>\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: !designingHeader() && !designingFooter()\">\r\n <div class=\"btn-group\" style=\"float: right\" role=\"group\">\r\n <button type=\"button\" class=\"btn btn-light\" data-bs-toggle=\"tooltip\" title=\"List View\"\r\n data-bind=\"css: { 'active': layout() === 'list' }, click: toggleLayout\">\r\n <span class=\"fa fa-list\"></span>\r\n </button>\r\n <button type=\"button\" class=\"btn btn-light\" data-bs-toggle=\"tooltip\" title=\"Icon View\"\r\n data-bind=\"css: { 'active': layout() === 'icons' }, click: toggleLayout\">\r\n <span class=\"fa fa-th-large\"></span>\r\n </button>\r\n </div>\r\n\r\n <div data-bind=\"if: layout()=='icons'\">\r\n <div data-bind=\"visible: !SelectedFolder() && !searchReports()\">\r\n <p>Please choose Folders below to view Reports</p>\r\n <ul class=\"folder-list\" data-bind=\"foreach: Folders\">\r\n <li data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <span data-bind=\"visible: $root.selectMode, click: function(d,e){ isSelected(!isSelected()); e.stopPropagation(); },\r\n css: isSelected() ? 'fa fa-check-square text-primary me-2' : 'fa fa-square-o me-2'\"></span>\r\n <span class=\"fa fa-3x fa-folder text-secondary\"></span>\r\n <span class=\"desc\" data-bind=\"text: FolderName\"></span>\r\n <div data-bind=\"visible: $root.adminMode\" style=\"font-size: 0.75em; margin-top: 4px;\" onclick=\"event.stopPropagation()\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserId ? UserId : 'Any User'\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserRoles ? UserRoles : 'Any Role'\"></span>\r\n </div> \r\n </li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"clearfix\">\r\n <p class=\"float-start\">Please choose a Report from this Folder</p>\r\n <div class=\"float-end\">\r\n <a href=\"#\" class=\"btn btn-light\" data-bind=\"click: function(){ SelectedFolder(null); searchReports(''); $('#search-report').val([]).trigger('change');}\">\r\n ..back to Folders\r\n </a>\r\n </div>\r\n </div>\r\n <div class=\"list-group list-overflow\">\r\n <div data-bind=\"if: SelectedFolder()!=null && reportsInFolder().length==0\">\r\n This folder is empty.\r\n </div>\r\n <div data-bind=\"if: searchReports() && reportsInSearch().length==0 && foldersInSearch().length==0\">\r\n No results found matching your search.\r\n </div>\r\n <!-- Folder search results (icon view) -->\r\n <div data-bind=\"if: searchReports() && foldersInSearch().length > 0\">\r\n <div class=\"mt-1 mb-1\"><strong><span class=\"fa fa-folder\"></span> Matching Folders</strong></div>\r\n <ul class=\"folder-list\" data-bind=\"foreach: foldersInSearch\">\r\n <li data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.searchReports(''); }\">\r\n <span class=\"fa fa-3x fa-folder text-secondary\"></span>\r\n <span class=\"desc\" data-bind=\"highlightedText: { text: FolderName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n <div data-bind=\"visible: $root.adminMode\" style=\"font-size: 0.75em; margin-top: 4px;\" onclick=\"event.stopPropagation()\">\r\n <div class=\"d-flex flex-wrap gap-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n <hr />\r\n </div>\r\n <div class=\"list-group\" data-bind=\"foreach: searchReports() ? reportsInSearch() : reportsInFolder()\">\r\n <div class=\"list-group-item\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-7\">\r\n <input type=\"checkbox\" data-bind=\"visible: $root.selectMode, checked: isSelected\" class=\"float-start me-2\" />\r\n <div class=\"fa fa-2x float-start\" data-bind=\"css: {'fa-file': reportType=='List', 'fa-th-list': reportType=='Summary', 'fa-bar-chart': reportType=='Bar', 'fa-pie-chart': reportType=='Pie', 'fa-line-chart': reportType=='Line', 'fa-globe': reportType.indexOf('Map')==0, 'fa-window-maximize': reportType=='Single', 'fa-random': reportType=='Pivot', 'fa-window-restore': reportType=='Treemap', 'fa-signal': reportType == 'Combo', 'fa-code': reportType == 'Html', 'fa-map': reportType == 'HeatMap'}\"></div>\r\n <div class=\"float-start\">\r\n <h4>\r\n <a data-bind=\"click: runReport\" style=\"cursor: pointer\">\r\n <span data-bind=\"highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n </a>\r\n </h4>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n <p data-bind=\"text: reportDescription\"></p>\r\n <p data-bind=\"if: $parent.searchReports()\">\r\n <span class=\"fa fa-folder\"></span> <span data-bind=\"text: folderName\"></span>\r\n <span>\r\n <span data-bind=\"text: message\" class=\"highlight small\"></span>\r\n </span>\r\n </p>\r\n <div data-bind=\"if: isSubReportOnly && isSubReportOnly()\">\r\n <span class=\"badge bg-warning text-dark mt-1\"><i class=\"fa fa-link\"></i> Sub Report Only</span>\r\n </div>\r\n <div data-bind=\"if: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center mt-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: userId ? '\uD83D\uDC64 ' + userId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: viewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: deleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (userRole ? userRole : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: viewOnlyUserRole\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: deleteOnlyUserRole\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: clientId\"> \uD83C\uDFE2 <span data-bind=\"text: clientId\"></span> </span>\r\n <a data-bind=\"attr: {href: '/DotNetReport/?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\" title=\"Direct Link\"><span class=\"fa fa-link\"></span></a>\r\n <a href=\"#\" data-bind=\"click: function() { navigator && navigator.clipboard && navigator.clipboard.writeText('/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId) }\" title=\"Copy Link\"><span class=\"fa fa-copy\"></span></a>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-5 right-align\">\r\n <div class=\"d-none d-md-block\">\r\n <br />\r\n <span data-bind=\"if: $root.CanSaveReports() || $root.adminMode() \">\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"visible: canEdit, click: openReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-edit\" aria-hidden=\"true\"></span> Edit\r\n </button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-copy\" aria-hidden=\"true\"></span> Copy\r\n </button>\r\n </span>\r\n <div class=\"btn-group\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: runReport\">\r\n <span class=\"fa fa-gears\" aria-hidden=\"true\"></span> Run\r\n </button>\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle dropdown-toggle-split\" data-bs-toggle=\"dropdown\" style=\"margin-left: -4px;\">\r\n <span class=\"sr-only\"></span>\r\n </button>\r\n <div class=\"dropdown-menu dropdown-menu-right\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { exportReport($root.appSettings.useAltPdf ? 'pdfalt' : 'pdf');}\">\r\n <span class=\"fas fa-file-pdf\"></span> Download PDF\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel (Expanded)\r\n </a>\r\n <div class=\"dropdown-divider\" data-bind=\"visible: !isSubReportOnly()\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"visible: !isSubReportOnly(), click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </div>\r\n </div>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\" aria-hidden=\"true\"></span> Delete\r\n </button>\r\n <br />\r\n </div>\r\n\r\n <div class=\"d-block d-md-none\">\r\n <span data-bind=\"if: $root.CanSaveReports() || $root.adminMode()\">\r\n <button class=\"btn btn-sm btn-outline-secondary\" title=\"Edit\" data-bind=\"visible: canEdit, click: openReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-edit\" aria-hidden=\"true\"></span>\r\n </button>\r\n <button class=\"btn btn-sm btn-light\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\" title=\"Copy Report\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-copy\" aria-hidden=\"true\"></span>\r\n </button>\r\n </span>\r\n\r\n <div class=\"btn-group\">\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: runReport\" title=\"Run Report\">\r\n <span class=\"fa fa-gears\" aria-hidden=\"true\"></span>\r\n </button>\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle dropdown-toggle-split\" data-bs-toggle=\"dropdown\" style=\"margin-left: -4px;\">\r\n <span class=\"sr-only\"></span>\r\n </button>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel with inner rows\r\n </a>\r\n <div class=\"dropdown-divider\" data-bind=\"visible: !isSubReportOnly()\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"visible: !isSubReportOnly(), click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <button class=\"btn btn-sm btn-outline-secondary\" title=\"Delete Report\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\" aria-hidden=\"true\"></span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: layout()=='list'\">\r\n <div class=\"file-explorer-container\">\r\n <nav class=\"breadcrumb\">\r\n <a href=\"#\" class=\"breadcrumb-item\" data-bind=\"click: function(){ SelectedFolder(null); searchReports(''); }\">\r\n All Folders\r\n </a>\r\n <span class=\"breadcrumb-item active\" data-bind=\"visible: SelectedFolder && !searchReports(), text: SelectedFolder()?.FolderName\"></span>\r\n <span class=\"breadcrumb-item active\" data-bind=\"visible: searchReports\">\r\n Search Results\r\n </span>\r\n </nav>\r\n\r\n <div data-bind=\"visible: !SelectedFolder() && !searchReports()\">\r\n <div class=\"container-fluid\">\r\n <div class=\"row fw-bold border-bottom py-2 w-100\">\r\n <div class=\"col-md-5\">Name</div>\r\n <div class=\"col-md-1\"></div>\r\n <div class=\"col-md-6\" data-bind=\"visible: adminMode\">Access Control</div>\r\n </div>\r\n <div class=\"\" data-bind=\"foreach: Folders\">\r\n <div class=\"row py-2 border-bottom align-items-center w-100\" >\r\n <div class=\"col-md-5 d-flex align-items-center clickable\" data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <span data-bind=\"visible: $root.selectMode, click: function(d,e){ isSelected(!isSelected()); e.stopPropagation(); },\r\n css: isSelected() ? 'fa fa-check-square text-primary me-2' : 'fa fa-square-o me-2'\"></span>\r\n <span class=\"fa fa-folder text-secondary me-2\"></span>\r\n <span data-bind=\"text: FolderName\"></span>\r\n </div>\r\n <div class=\"col-md-1\" onclick=\"event.stopPropagation()\">\r\n <div class=\"dropdown\" data-bind=\"visible: ($root.CanManageFolders() || $root.adminMode()) && (canEdit || canDelete || $root.adminMode())\">\r\n <button class=\"btn btn-sm\" type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-h\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.ManageFolder.editFolder(); }, visible: canEdit || $root.adminMode()\">\r\n <span class=\"fa fa-edit\"></span> Edit Folder\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item text-danger\" href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.ManageFolder.deleteFolder(); }, visible: canDelete || $root.adminMode()\">\r\n <span class=\"fa fa-trash\"></span> Delete Folder\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"container-fluid\">\r\n <div data-bind=\"if: SelectedFolder()!=null && reportsInFolder().length==0\">\r\n <p class=\"text-muted\">This folder is empty.</p>\r\n </div>\r\n\r\n <div data-bind=\"if: searchReports() && reportsInSearch().length==0 && foldersInSearch().length==0\">\r\n <p class=\"text-center text-muted\">No results found matching your search.</p>\r\n </div>\r\n <!-- Folder search results (list view) -->\r\n <div data-bind=\"if: searchReports() && foldersInSearch().length > 0\">\r\n <div class=\"row fw-bold py-1 border-bottom mt-2 w-100\">\r\n <div class=\"col-md-6\"><span class=\"fa fa-folder\"></span> Matching Folders</div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $root.adminMode\">Access</div>\r\n </div>\r\n <div data-bind=\"foreach: foldersInSearch\">\r\n <div class=\"row border-bottom py-2 align-items-center w-100\">\r\n <div class=\"col-md-6 d-flex align-items-center\">\r\n <span class=\"fa fa-folder text-secondary me-2\"></span>\r\n <a href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.searchReports(''); }, highlightedText: { text: FolderName, highlight: $parent.searchReports, css: 'highlight' }\" style=\"cursor: pointer\"></a>\r\n </div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $root.adminMode\">\r\n <div class=\"small text-muted d-flex flex-wrap gap-1 align-items-center\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mb-2\"></div>\r\n </div>\r\n <div data-bind=\"if: reportsInFolder().length > 0 || reportsInSearch().length > 0\">\r\n <div class=\"row fw-bold border-bottom py-2 w-100\">\r\n <div class=\"col-md-4\">Name</div>\r\n <div class=\"col-md-1\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: searchReports()\">Folder</div>\r\n <div class=\"col-md-2\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: adminMode\">Access</div>\r\n <div class=\"col-md-1\" data-bind=\"visible: adminMode\">Direct Link</div>\r\n </div>\r\n\r\n <div class=\"report-list\" data-bind=\"foreach: searchReports() ? reportsInSearch() : reportsInFolder()\">\r\n <div class=\"row border-bottom py-2 align-items-center w-100\">\r\n <div class=\"col-md-4 d-flex align-items-center\">\r\n <input type=\"checkbox\" data-bind=\"visible: $root.selectMode, checked: isSelected\" class=\"me-2\" />\r\n <span class=\"fa\" data-bind=\"css: {\r\n 'fa-file': reportType=='List',\r\n 'fa-th-list': reportType=='Summary',\r\n 'fa-bar-chart': reportType=='Bar',\r\n 'fa-pie-chart': reportType=='Pie',\r\n 'fa-line-chart': reportType=='Line',\r\n 'fa-signal': reportType=='Combo',\r\n 'fa-globe': reportType.indexOf('Map')==0,\r\n 'fa-window-maximize': reportType=='Single',\r\n 'fa-random': reportType=='Pivot',\r\n 'fa-window-restore': reportType=='Treemap',\r\n 'fa-code': reportType == 'Html',\r\n 'fa-map': reportType == 'HeatMap'\r\n }\"></span>\r\n <a class=\"ms-2\" data-bind=\"click: runReport, highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\" style=\"cursor: pointer\"></a> \r\n <span data-bind=\"text: message\" class=\"highlight small\"></span>\r\n <span class=\"badge bg-warning text-dark ms-1\"\r\n title=\"This report is only used as a linked or sub report\"\r\n data-bind=\"visible: isSubReportOnly && isSubReportOnly()\">\r\n <i class=\"fa fa-link\"></i> Sub Report Only\r\n </span>\r\n </div>\r\n\r\n <div class=\"col-md-1\">\r\n <div class=\"dropdown\">\r\n <button class=\"btn btn-sm\" type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-h\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li data-bind=\"visible: canEdit\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: openReport\">\r\n <span class=\"fa fa-edit\"></span> Edit\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\">\r\n <span class=\"fa fa-copy\"></span> Copy\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item text-danger\" href=\"#\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\"></span> Delete\r\n </a>\r\n </li>\r\n <li><hr class=\"dropdown-divider\"></li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: runReport\">\r\n <span class=\"fa fa-gears\"></span> Run Report\r\n </a>\r\n </li>\r\n <li class=\"dropdown-submenu\">\r\n <a class=\"dropdown-item dropdown-toggle\" href=\"#\">Export</a>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport($root.appSettings.useAltPdf ? 'pdfalt' : 'pdf');}\">\r\n <span class=\"fa fa-file-pdf\"></span> Download PDF\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel (Expanded)\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li data-bind=\"visible: !isSubReportOnly()\"><hr class=\"dropdown-divider\"></li>\r\n <li data-bind=\"visible: !isSubReportOnly()\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"text: folderName, visible: $parent.searchReports()\"></div> \r\n <div class=\"col-md-4\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center mt-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: userId ? '\uD83D\uDC64 ' + userId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: viewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: deleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (userRole ? userRole : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: viewOnlyUserRole\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: deleteOnlyUserRole\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: clientId\"> \uD83C\uDFE2 <span data-bind=\"text: clientId\"></span> </span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1\" data-bind=\"visible: $parent.adminMode\">\r\n <a data-bind=\"attr: {href: '/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\"><span class=\"fa fa-link\"></span></a>\r\n \r\n <a href=\"#\" data-bind=\"click: function() { navigator && navigator.clipboard && navigator.clipboard.writeText('/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId) }\">\r\n <span class=\"fa fa-copy\" title=\"Copy Link\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n\r\n <div data-bind=\"visible: (ReportMode() == 'execute' || ReportMode() == 'linked' || ReportMode() == 'design') && !isModalOpen()\">\r\n <div class=\"card\" data-bind=\"visible: true;\" style=\"display: none;\">\r\n <div class=\"card-header\">\r\n <nav class=\"navbar navbar-expand-lg navbar-light bg-light\">\r\n <a class=\"navbar-brand\" href=\"#\">Viewing Report</a>\r\n <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarSupportedContent\" aria-controls=\"navbarSupportedContent\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <span class=\"navbar-toggler-icon\"></span>\r\n </button>\r\n <div class=\"collapse navbar-collapse\" id=\"navbarSupportedContent\">\r\n <ul class=\"navbar-nav me-auto\"></ul>\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"click: function() {$root.ReportMode('start'); $root.textQuery.setupSearch();}\">\r\n <i class=\"fa fa-arrow-left\"></i>\r\n <span>Back to Reports</span>\r\n </button>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: canGoBackToParent(), click: backToParentReport\">\r\n <i class=\"fa fa-arrow-circle-left\"></i>\r\n <span>Back to Parent Report</span>\r\n </button>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: $root.CanEdit() && ReportID(), click: function(){ SaveReport(true); }\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <i class=\"fa fa-edit\"></i> Edit Report\r\n </button>\r\n\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"click: RefreshReport, visible: false\">\r\n <i class=\"fa fa-refresh\"></i>\r\n <span>Refresh</span>\r\n </button> \r\n <span data-bind=\"visible: isDirty\" title=\"You have unsaved changes\">\r\n <i class=\"text-warning fa fa-exclamation-triangle\"></i>\r\n </span>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: $root.CanEdit(), click: SaveWithoutRun\">\r\n <i class=\"fa fa-save\"></i> \r\n <span>Save Report</span>\r\n </button>\r\n <div class=\"dropdown\" data-bind=\"hidden: (DontExecuteOnRun() && !reportRan()) || !ReportID()\">\r\n <button type=\"button\" class=\"btn btn-light btn-sm dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <i class=\"fa fa-download\"></i>\r\n <span>Export</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end\"> \r\n <li data-bind=\"hidden: appSettings.useAltPdf\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { PdfPage.isDebug = false; $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdf(false); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: adminMode() && !appSettings.useAltPdf()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { PdfPage.isDebug = true; $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdf(true); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf (Debug)\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: appSettings.useAltPdf\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdfAlt(); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcel\">\r\n <i class=\"fas fa-file-excel\"></i> Excel\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: canDrilldown\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: downloadExcelWithDrilldown\">\r\n <i class=\"fas fa-file-excel\"></i> Excel (Expanded)\r\n </a>\r\n </li>\r\n <li data-bind=\"hidden: appSettings.dontWordExport\">\r\n <a class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { $('#wordOptionsModal').modal('show'); }\r\n : function() { downloadWord(); }\">\r\n <span class=\"fas fa-file-word\"></span> Word\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadCsv\">\r\n <i class=\"fas fa-file-excel\"></i> Csv\r\n </a>\r\n </li>\r\n <li data-bind=\"hidden: appSettings.dontXmlExport\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadXml\">\r\n <i class=\"fa fa-file-code\"></i> Xml\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: printReportPage\">\r\n <i class=\"fas fa-print\"></i> Print\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </nav>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"with: ReportResult\" class=\"report-view\">\r\n <div data-bind=\"ifnot: HasError\">\r\n <div data-bind=\"with: $root\">\r\n <div>\r\n <div data-bind=\"if: EditFiltersOnReport\">\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <a data-bs-toggle=\"collapse\" data-bs-target=\"#filter-panel\" href=\"#\">\r\n <i class=\"fa fa-filter\"></i>Choose Filters\r\n </a>\r\n </div>\r\n <div id=\"filter-panel\" class=\"card-body collapse\">\r\n <div data-bind=\"if: useStoredProc\">\r\n <div class=\"row\">\r\n <div data-bind=\"template: {name: 'filter-parameters'}\" class=\"col-md-12\"></div>\r\n </div>\r\n </div>\r\n <div data-bind=\"ifnot: useStoredProc\">\r\n <div class=\"row\">\r\n <div data-bind=\"template: {name: 'filter-group'}\" class=\"col-md-12\"></div>\r\n </div>\r\n </div>\r\n <br />\r\n <button class=\"btn btn-primary\" data-bind=\"click: SaveFilterAndRunReport\">Update Filters</button>\r\n </div>\r\n </div>\r\n <br />\r\n </div>\r\n <div data-bind=\"ifnot: EditFiltersOnReport\">\r\n <div data-bind=\"template: {name: 'fly-filter-template'}\"></div>\r\n <br />\r\n </div>\r\n </div>\r\n <div class=\"report-render\" data-bind=\"css: { 'report-expanded': isExpanded }\">\r\n <div class=\"report-menubar bg-light\" data-bind=\"hidden: DontExecuteOnRun() && !reportRan()\">\r\n <div class=\"col-xs-12 col-centered d-flex justify-content-between flex-wrap\" data-bind=\"with: pager\">\r\n <div class=\"form-inline d-flex\" data-bind=\"visible: pages()\">\r\n <div class=\"form-group float-start total-records\">\r\n <span data-bind=\"text: ' Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"float-start\">\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: !$root.isChart() || $root.ShowDataWithGraph(), click: $root.downloadExcel\" title=\"Export to Excel\">\r\n <span class=\"fas fa-file-excel\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"click: $parent.toggleExpand\">\r\n <span class=\"fa\" data-bind=\"css: {'fa-expand': !$parent.isExpanded(), 'fa-compress': $parent.isExpanded() }\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: $parent.canDrilldown, click: $parent.ExpandAll\" title=\"Expand all rows\">\r\n <span class=\"fa fa-plus\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: $parent.canDrilldown, click: $parent.CollapseAll\" title=\"Collapse all rows\">\r\n <span class=\"fa fa-minus\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" title=\"Re-run Report\" data-bind=\"click: function() { $root.RunReport(false, true);}\">\r\n <i class=\"fa fa-play\"></i> \r\n </button>\r\n <div data-bind=\"with: $parent\" class=\"float-start\">\r\n <div class=\"dropdown-selected\" data-bind=\"click: toggleDropdown\">\r\n <div data-bind=\"with: selectedTableStyle\" class=\"btn btn-sm btn-secondary\" title=\"Format Table\">\r\n <span class=\"fa fa- fa-paint-brush\"></span>\r\n </div>\r\n </div>\r\n <div class=\"dropdown-content\" style=\"position: absolute;\" data-bind=\"visible: dropdownOpen\">\r\n <div data-bind=\"foreach: tableStyles\">\r\n <div class=\"dropdown-option\" data-bind=\"title: $data.name, click: $parent.selectStyle\">\r\n <div class=\"mini-table-preview\" data-bind=\"foreach: new Array(5)\">\r\n <div class=\"mini-table-row\" data-bind=\"foreach: new Array(5)\">\r\n <div class=\"mini-table-cell\" data-bind=\"style: { backgroundColor: $parentContext.$index() === 0 ? $parents[1].headerBg : ($parentContext.$index() % 2 === 0 ? $parents[1].altRowBg : $parents[1].rowBg), color: $parents[1].textColor }\"></div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div class=\"btn-group btn-group-sm d-flex\" role=\"group\">\r\n <button class=\"btn btn-light\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode\">\r\n <i class=\"fa fa-code\"></i> View Report Code\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.zoomOut\" data-bs-toggle=\"tooltip\" title=\"Zoom Out\">\r\n <i class=\"fa fa-search-minus\"></i>\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.resetZoom\" data-bs-toggle=\"tooltip\" title=\"Reset Zoom\">\r\n <i class=\"fa fa-compress\"></i>\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.zoomIn\" data-bs-toggle=\"tooltip\" title=\"Zoom In\">\r\n <i class=\"fa fa-search-plus\"></i>\r\n </button>\r\n </div>\r\n <div class=\"form-inline d-flex\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"report-canvas\" data-bind=\"hidden: DontExecuteOnRun() && !reportRan()\">\r\n <div class=\"report-container bg-light\">\r\n <div class=\"report-inner\" data-bind=\"style: { backgroundColor: tableSettings().backColor || (ReportResult() && ReportResult().ReportData() && ReportResult().ReportData().BackColor ? ReportResult().ReportData().BackColor() : '#fff') }\">\r\n <div data-bind=\"if: $root.CanEdit() && ReportType()!='Html' && ReportType()!='Single'\">\r\n <div data-bind=\"template: 'chart-settings', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"if: $root.CanEdit() && ReportType()=='Single'\">\r\n <div data-bind=\"template: 'kpi-settings', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"visible: headerDesigner.UseReportHeader\">\r\n <div id=\"report-header\" width=\"900\" height=\"120\" data-bind=\"html: $root.substituteReportPlaceholders($root.headerDesigner.headerHtml())\"></div>\r\n </div>\r\n <h2 data-bind=\"text: ReportName\"></h2>\r\n <p data-bind=\"html: ReportDescription\">\r\n </p>\r\n <div data-bind=\"template: 'filter-details-summary'\"></div>\r\n\r\n <div data-bind=\"with: ReportResult\" class=\"report-expanded-scroll\">\r\n <div data-bind=\"visible: !ReportData()\">\r\n <div class=\"report-spinner\"></div>\r\n </div>\r\n <div data-bind=\"template: 'report-template', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"visible: footerDesigner.UseReportFooter\">\r\n <div id=\"report-footer\" width=\"900\" data-bind=\"html: $root.substituteReportPlaceholders($root.footerDesigner.footerHtml())\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <br />\r\n <span>Report ran on: <span data-bind=\"text: new Date().toLocaleDateString() + ' ' + new Date().toLocaleTimeString()\"></span></span>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: HasError\">\r\n <h2 data-bind=\"text: $root.ReportName\"></h2>\r\n <p data-bind=\"text: $root.ReportDescription\"></p>\r\n\r\n <h3>An unexpected error occured while running the Report</h3>\r\n <hr />\r\n <b>Error Details</b>\r\n <div data-bind=\"text: Exception\"></div>\r\n <br />\r\n <button class=\"btn btn-light\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode\">\r\n <i class=\"fa fa-code\"></i> View Report Code\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: function() { $root.RunReport(false, true);}\">\r\n <i class=\"fa fa-play\"></i> Re-run Report\r\n </button>\r\n <hr />\r\n </div>\r\n </div>\r\n </div><!-- /flex wrapper -->\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Report Builder -->\r\n<div class=\"modal modal-fullscreen\" id=\"modal-reportbuilder\" role=\"dialog\" aria-labelledby=\"myModalLabel\" aria-hidden=\"true\" style=\"padding-right: 0px !important;\">\r\n <div data-bind=\"template: {name: 'report-designer', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Field Options Modal -->\r\n<div class=\"modal\" id=\"fieldOptionsModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div data-bind=\"template: {name: 'report-field-options', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Link Edit Modal -->\r\n<div class=\"modal\" id=\"linkModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div data-bind=\"template: {name: 'report-link-edit', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Folder Edit Modal -->\r\n<div class=\"modal\" id=\"folderModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\" data-bind=\"css: {'modal-lg': adminMode}\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageFolder\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title fs-5\">Manage Folder</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"form-group\">\r\n <label class=\"col-sm-4 col-md-4 control-label\">Folder Name</label>\r\n <div class=\"col-sm-8 col-md-8\">\r\n <input type=\"text\" class=\"form-control\" id=\"folderName\" required placeholder=\"Folder Name\" data-bind=\"value: FolderName\">\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: $root.adminMode\" class=\"form-group\">\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"showAdminOnly\" data-bind=\"checked: ShowAdminOnly\">\r\n <label class=\"form-check-label\" for=\"showAdminOnly\">\r\n Show Admin Only (Only visible when Admin Mode is ON)\r\n </label>\r\n </div>\r\n </div>\r\n <br />\r\n <div data-bind=\"visible: $root.adminMode\" class=\"card card-body\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageFolderAccess}\"></div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: saveFolder\">Save</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Json File Modal -->\r\n<div class=\"modal\" id=\"uploadFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadFileModalLabel\">Import previously Exported Reports</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n\r\n <div class=\"alert alert-info small\">\r\n <strong>Instructions:</strong><br />\r\n \u2022 Select a <code>.json</code> file previously exported from Dotnet Report.<br />\r\n \u2022 The file may include multiple reports and their folders.<br />\r\n \u2022 Any missing folders will be created automatically.<br />\r\n \u2022 If a report with the same name already exists, you will be prompted to:\r\n <em>Skip</em>, <em>Overwrite</em>, or <em>Make a Copy</em>.<br />\r\n \u2022 Once uploaded, all imported reports will be available immediately.\r\n </div>\r\n\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n Click here to select a JSON file\r\n </div>\r\n\r\n <input type=\"file\" id=\"fileInputJson\" accept=\".json\" style=\"display: none;\"\r\n data-bind=\"event: { change: handleFileSelect }\">\r\n\r\n <div class=\"mt-3\" data-bind=\"visible: fileName\">\r\n <p><strong>Selected File:</strong> <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"wordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'word-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"pdfOptionsModal\" tabindex=\"-1\" aria-labelledby=\"pdfOptionsModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- This renders the template -->\r\n<div class=\"modal\" id=\"pdfOptionsScheduleModal\" tabindex=\"-1\" aria-labelledby=\"pdfOptionsScheduleModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'pdf-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n<!-- This renders the template -->\r\n<div class=\"modal\" id=\"wordOptionsScheduleModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsScheduleModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'word-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- Schedule Report Modal -->\r\n<div class=\"modal\" id=\"modal-schedule-report\" tabindex=\"-1\" aria-labelledby=\"scheduleReportModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\">\r\n <div class=\"modal-content\" data-bind=\"with: scheduleReportModal\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"scheduleReportModalLabel\">\r\n <i class=\"fa fa-hourglass me-2\"></i> Schedule Report\r\n </h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <h6 data-bind=\"text: reportName\" class=\"mb-3\"></h6>\r\n <div data-bind=\"template: { name: 'report-schedule', data: $parent }\"></div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: saveSchedule\">Save Schedule</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->\r\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
9078
9078
|
}
|
|
9079
9079
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DotnetreportComponent, decorators: [{
|
|
9080
9080
|
type: Component,
|
|
9081
|
-
args: [{ selector: 'app-dotnetreport', standalone: true, imports: [CommonModule], template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n<div class=\"container-fluid\">\r\n <div data-bind=\"template: {name: 'admin-mode-template'}, visible: allowAdmin\" style=\"display: none;\"></div>\r\n\r\n <!--\r\n The markup code below is related to presentation. You don't have to change it, unless you\r\n intentionally want to change something in the Report Builder's behavior in your Application.\r\n It's Recommended you use it as is. You will be responsible for managing and maintaining any changes.\r\n -->\r\n <!-- Folders/Report List -->\r\n <div id=\"report-start\" data-bind=\"if: ReportMode() == 'start' || ReportMode() == 'generate'\">\r\n <div class=\"card folder-panel\" data-bind=\"visible: true\" style=\"display: none;\">\r\n <div class=\"card-header\">\r\n <nav class=\"navbar navbar-expand-lg navbar-light bg-light\">\r\n <a class=\"navbar-brand\" href=\"#\" data-bind=\"click: function() {SelectedFolder(null); designingHeader(false); designingFooter(false); searchReports(''); $('#search-report').val([]).trigger('change'); }\">Manage Reports</a>\r\n <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarSupportedContent\" aria-controls=\"navbarSupportedContent\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <span class=\"navbar-toggler-icon\"></span>\r\n </button>\r\n\r\n <div class=\"collapse navbar-collapse\" id=\"navbarSupportedContent\">\r\n <ul class=\"navbar-nav mr-auto\">\r\n <li class=\"nav-item\" data-bind=\"visible: SelectedFolder() ? SelectedFolder().canEdit : (CanSaveReports() || adminMode())\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: createNewReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-plus\"></span> New Report\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" data-bind=\"visible: CanManageFolders() || adminMode()\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: ManageFolder.newFolder\">\r\n <span class=\"fa fa-folder-open\"></span> Add Folder\r\n </a>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: (CanManageFolders() || adminMode()) && SelectedFolder()!=null && (SelectedFolder().canEdit || SelectedFolder().canDelete || adminMode())\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-folder\"></span> Folder Options\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ManageFolder.editFolder, visible: SelectedFolder() && (SelectedFolder().canEdit || adminMode())\">Edit Selected Folder</a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ManageFolder.deleteFolder, visible: SelectedFolder() && (SelectedFolder().canDelete || adminMode())\">Delete Selected Folder</a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: adminMode() && SelectedFolder() ==null\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-window-maximize\"></span> Header / Footer\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ initHeaderDesigner(false); }\">\r\n <span class=\"fa fa-arrow-up\"></span> Report Header\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ initFooterDesigner(false); }\">\r\n <span class=\"fa fa-arrow-down\"></span> Report Footer\r\n </a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: appSettings.showImportExport() || adminMode()\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-exchange\"></span> Import / Export\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ selectMode(!selectMode()); }\">\r\n <span data-bind=\"css: selectMode() ? 'fa fa-check-square text-primary' : 'fa fa-square-o'\"></span>\r\n <span data-bind=\"text: selectMode() ? 'Cancel Select Mode' : 'Select Mode'\"></span>\r\n </a>\r\n <div class=\"dropdown-divider\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadFileModal\" data-bind=\"visible: !selectMode()\" title=\"Import Report from JSON file\">\r\n <span class=\"fa fa-upload\"></span> Import Reports\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: selectMode, click: exportSelectedReportJson\">\r\n <span class=\"fa fa-download\"></span> Export Selected Reports\r\n </a>\r\n </div>\r\n </li>\r\n </ul>\r\n <div class=\"form-inline my-2 my-lg-0 ms-auto w-50\">\r\n <div class=\"input-group w-100\">\r\n <p id=\"search-input\" class=\"form-control search-input\" data-placeholder=\"Search Report by Name, Description or Data Field...\"></p>\r\n <span data-bind=\"click: searchForReports\" class=\"input-group-text\" style=\"height: 38px; cursor: pointer;\" title=\"Search\"><i class=\"fa fa-search\"></i></span>\r\n <span data-bind=\"click: function() {resetQuery(true, true);}\" class=\"input-group-text\" style=\"height: 38px; cursor: pointer;\" title=\"Clear Search\"><i class=\"fa fa-close\"></i></span>\r\n </div>\r\n </div>\r\n </div>\r\n </nav>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"visible: designingHeader, with: headerDesigner\" style=\"display: none;\" class=\"overflow-auto\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseReportHeader\"> Use Report Header\r\n </label>\r\n </div>\r\n <div data-bind=\"visible: UseReportHeader\">\r\n <p class=\"alert alert-info\">\r\n You can design the common report header below that will be applied to all reports where report headers are turned on.\r\n </p>\r\n <div class=\"form-group row m-1\" data-bind=\"visible: clientListIds().length > 0\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Headers for other Clients saved</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <select class=\"form-control\"\r\n data-bind=\"options: clientListIds,\r\n value: selectedHeaderClientId,\r\n optionsCaption: 'No Client Id (Global)',\r\n event: { change: function () { loadHtmlHeader(true); } }\">\r\n </select>\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" class=\"fa fa-question-circle helptip\"\r\n title=\"Choose a client to design its report header\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Specify Client Id to Restrict Access</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <input class=\"form-control text-box single-line\" type=\"text\" data-bind=\"value: headerClientId\">\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" data-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Leave blank to give all clients access (Global Report Header)\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-12\">\r\n <div class=\"dropdown d-inline-block me-2\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n Insert System Variable\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.number}'); }\">Page Number</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.total}'); }\">Total Pages</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user}'); }\">Current User</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user.roles}'); }\">Current User Roles</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.datetime}'); }\">Current Date/Time</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{report.name}'); }\">Report Name</a></li>\r\n </ul>\r\n </div>\r\n <label class=\"ms-2\">\r\n <input type=\"checkbox\" data-bind=\"checked: IncludeOnEveryPage\" /> Include on every page in PDF/Word export\r\n </label>\r\n </div>\r\n </div>\r\n <textarea id=\"report-header-editor\"></textarea>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlHeader\">\r\n Save Changes\r\n </button>\r\n </div>\r\n <div data-bind=\"visible: !UseReportHeader()\">\r\n <p class=\"alert alert-info\">\r\n If you turn off the <b>Use Report Header</b> option,\r\n the <b>Report Header</b> will not be applied in reports.\r\n </p>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlHeader\">\r\n Save Changes\r\n </button>\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: designingFooter, with: footerDesigner\" style=\"display: none;\" class=\"overflow-auto\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseReportFooter\"> Use Report Footer\r\n </label>\r\n </div>\r\n <div data-bind=\"visible: UseReportFooter\">\r\n <p class=\"alert alert-info\">\r\n You can design the common report footer below that will be applied to all reports where report footers are turned on.\r\n </p>\r\n <div class=\"form-group row m-1\" data-bind=\"visible: clientListIds().length > 0\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Footers for other Clients saved</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <select class=\"form-control\"\r\n data-bind=\"options: clientListIds,\r\n value: selectedFooterClientId,\r\n optionsCaption: 'No Client Id (Global)',\r\n event: { change: function () { loadHtmlFooter(true); } }\">\r\n </select>\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" class=\"fa fa-question-circle helptip\"\r\n title=\"Choose a client to design its report footer\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Specify Client Id to Restrict Access</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <input class=\"form-control text-box single-line\" type=\"text\" data-bind=\"value: footerClientId\">\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" data-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Leave blank to give all clients access (Global Report Footer)\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-12\">\r\n <div class=\"dropdown d-inline-block me-2\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n Insert System Variable\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.number}'); }\">Page Number</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.total}'); }\">Total Pages</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user}'); }\">Current User</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user.roles}'); }\">Current User Roles</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.datetime}'); }\">Current Date/Time</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{report.name}'); }\">Report Name</a></li>\r\n </ul>\r\n </div>\r\n <label class=\"ms-2\">\r\n <input type=\"checkbox\" data-bind=\"checked: IncludeOnEveryPage\" /> Include on every page in PDF/Word export\r\n </label>\r\n </div>\r\n </div>\r\n <textarea id=\"report-footer-editor\"></textarea>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlFooter\">\r\n Save Changes\r\n </button>\r\n </div>\r\n <div data-bind=\"visible: !UseReportFooter()\">\r\n <p class=\"alert alert-info\">\r\n If you turn off the <b>Use Report Footer</b> option,\r\n the <b>Report Footer</b> will not be applied in reports.\r\n </p>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlFooter\">\r\n Save Changes\r\n </button>\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: !designingHeader() && !designingFooter()\">\r\n <div class=\"btn-group\" style=\"float: right\" role=\"group\">\r\n <button type=\"button\" class=\"btn btn-light\" data-bs-toggle=\"tooltip\" title=\"List View\"\r\n data-bind=\"css: { 'active': layout() === 'list' }, click: toggleLayout\">\r\n <span class=\"fa fa-list\"></span>\r\n </button>\r\n <button type=\"button\" class=\"btn btn-light\" data-bs-toggle=\"tooltip\" title=\"Icon View\"\r\n data-bind=\"css: { 'active': layout() === 'icons' }, click: toggleLayout\">\r\n <span class=\"fa fa-th-large\"></span>\r\n </button>\r\n </div>\r\n\r\n <div data-bind=\"if: layout()=='icons'\">\r\n <div data-bind=\"visible: !SelectedFolder() && !searchReports()\">\r\n <p>Please choose Folders below to view Reports</p>\r\n <ul class=\"folder-list\" data-bind=\"foreach: Folders\">\r\n <li data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <span data-bind=\"visible: $root.selectMode, click: function(d,e){ isSelected(!isSelected()); e.stopPropagation(); },\r\n css: isSelected() ? 'fa fa-check-square text-primary me-2' : 'fa fa-square-o me-2'\"></span>\r\n <span class=\"fa fa-3x fa-folder text-secondary\"></span>\r\n <span class=\"desc\" data-bind=\"text: FolderName\"></span>\r\n <div data-bind=\"visible: $root.adminMode\" style=\"font-size: 0.75em; margin-top: 4px;\" onclick=\"event.stopPropagation()\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserId ? UserId : 'Any User'\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserRoles ? UserRoles : 'Any Role'\"></span>\r\n </div> \r\n </li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"clearfix\">\r\n <p class=\"float-start\">Please choose a Report from this Folder</p>\r\n <div class=\"float-end\">\r\n <a href=\"#\" class=\"btn btn-light\" data-bind=\"click: function(){ SelectedFolder(null); searchReports(''); $('#search-report').val([]).trigger('change');}\">\r\n ..back to Folders\r\n </a>\r\n </div>\r\n </div>\r\n <div class=\"list-group list-overflow\">\r\n <div data-bind=\"if: SelectedFolder()!=null && reportsInFolder().length==0\">\r\n This folder is empty.\r\n </div>\r\n <div data-bind=\"if: searchReports() && reportsInSearch().length==0 && foldersInSearch().length==0\">\r\n No results found matching your search.\r\n </div>\r\n <!-- Folder search results (icon view) -->\r\n <div data-bind=\"if: searchReports() && foldersInSearch().length > 0\">\r\n <div class=\"mt-1 mb-1\"><strong><span class=\"fa fa-folder\"></span> Matching Folders</strong></div>\r\n <ul class=\"folder-list\" data-bind=\"foreach: foldersInSearch\">\r\n <li data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.searchReports(''); }\">\r\n <span class=\"fa fa-3x fa-folder text-secondary\"></span>\r\n <span class=\"desc\" data-bind=\"highlightedText: { text: FolderName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n <div data-bind=\"visible: $root.adminMode\" style=\"font-size: 0.75em; margin-top: 4px;\" onclick=\"event.stopPropagation()\">\r\n <div class=\"d-flex flex-wrap gap-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n <hr />\r\n </div>\r\n <div class=\"list-group\" data-bind=\"foreach: searchReports() ? reportsInSearch() : reportsInFolder()\">\r\n <div class=\"list-group-item\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-7\">\r\n <input type=\"checkbox\" data-bind=\"visible: $root.selectMode, checked: isSelected\" class=\"float-start me-2\" />\r\n <div class=\"fa fa-2x float-start\" data-bind=\"css: {'fa-file': reportType=='List', 'fa-th-list': reportType=='Summary', 'fa-bar-chart': reportType=='Bar', 'fa-pie-chart': reportType=='Pie', 'fa-line-chart': reportType=='Line', 'fa-globe': reportType.indexOf('Map')==0, 'fa-window-maximize': reportType=='Single', 'fa-random': reportType=='Pivot', 'fa-window-restore': reportType=='Treemap', 'fa-signal': reportType == 'Combo', 'fa-code': reportType == 'Html', 'fa-map': reportType == 'HeatMap'}\"></div>\r\n <div class=\"float-start\">\r\n <h4>\r\n <a data-bind=\"click: runReport\" style=\"cursor: pointer\">\r\n <span data-bind=\"highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n </a>\r\n </h4>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n <p data-bind=\"text: reportDescription\"></p>\r\n <p data-bind=\"if: $parent.searchReports()\">\r\n <span class=\"fa fa-folder\"></span> <span data-bind=\"text: folderName\"></span>\r\n <span>\r\n <span data-bind=\"text: message\" class=\"highlight small\"></span>\r\n </span>\r\n </p>\r\n <div data-bind=\"if: isSubReportOnly && isSubReportOnly()\">\r\n <span class=\"badge bg-warning text-dark mt-1\"><i class=\"fa fa-link\"></i> Sub Report Only</span>\r\n </div>\r\n <div data-bind=\"if: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center mt-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: userId ? '\uD83D\uDC64 ' + userId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: viewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: deleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (userRole ? userRole : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: viewOnlyUserRole\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: deleteOnlyUserRole\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: clientId\"> \uD83C\uDFE2 <span data-bind=\"text: clientId\"></span> </span>\r\n <a data-bind=\"attr: {href: '/DotNetReport/?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\" title=\"Direct Link\"><span class=\"fa fa-link\"></span></a>\r\n <a href=\"#\" data-bind=\"click: function() { navigator && navigator.clipboard && navigator.clipboard.writeText('/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId) }\" title=\"Copy Link\"><span class=\"fa fa-copy\"></span></a>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-5 right-align\">\r\n <div class=\"d-none d-md-block\">\r\n <br />\r\n <span data-bind=\"if: $root.CanSaveReports() || $root.adminMode() \">\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"visible: canEdit, click: openReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-edit\" aria-hidden=\"true\"></span> Edit\r\n </button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-copy\" aria-hidden=\"true\"></span> Copy\r\n </button>\r\n </span>\r\n <div class=\"btn-group\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: runReport\">\r\n <span class=\"fa fa-gears\" aria-hidden=\"true\"></span> Run\r\n </button>\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle dropdown-toggle-split\" data-bs-toggle=\"dropdown\" style=\"margin-left: -4px;\">\r\n <span class=\"sr-only\"></span>\r\n </button>\r\n <div class=\"dropdown-menu dropdown-menu-right\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { exportReport($root.appSettings.useAltPdf ? 'pdfalt' : 'pdf');}\">\r\n <span class=\"fas fa-file-pdf\"></span> Download PDF\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel (Expanded)\r\n </a>\r\n <div class=\"dropdown-divider\" data-bind=\"visible: !isSubReportOnly()\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"visible: !isSubReportOnly(), click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </div>\r\n </div>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\" aria-hidden=\"true\"></span> Delete\r\n </button>\r\n <br />\r\n </div>\r\n\r\n <div class=\"d-block d-md-none\">\r\n <span data-bind=\"if: $root.CanSaveReports() || $root.adminMode()\">\r\n <button class=\"btn btn-sm btn-outline-secondary\" title=\"Edit\" data-bind=\"visible: canEdit, click: openReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-edit\" aria-hidden=\"true\"></span>\r\n </button>\r\n <button class=\"btn btn-sm btn-light\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\" title=\"Copy Report\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-copy\" aria-hidden=\"true\"></span>\r\n </button>\r\n </span>\r\n\r\n <div class=\"btn-group\">\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: runReport\" title=\"Run Report\">\r\n <span class=\"fa fa-gears\" aria-hidden=\"true\"></span>\r\n </button>\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle dropdown-toggle-split\" data-bs-toggle=\"dropdown\" style=\"margin-left: -4px;\">\r\n <span class=\"sr-only\"></span>\r\n </button>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel with inner rows\r\n </a>\r\n <div class=\"dropdown-divider\" data-bind=\"visible: !isSubReportOnly()\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"visible: !isSubReportOnly(), click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <button class=\"btn btn-sm btn-outline-secondary\" title=\"Delete Report\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\" aria-hidden=\"true\"></span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: layout()=='list'\">\r\n <div class=\"file-explorer-container\">\r\n <nav class=\"breadcrumb\">\r\n <a href=\"#\" class=\"breadcrumb-item\" data-bind=\"click: function(){ SelectedFolder(null); searchReports(''); }\">\r\n All Folders\r\n </a>\r\n <span class=\"breadcrumb-item active\" data-bind=\"visible: SelectedFolder && !searchReports(), text: SelectedFolder()?.FolderName\"></span>\r\n <span class=\"breadcrumb-item active\" data-bind=\"visible: searchReports\">\r\n Search Results\r\n </span>\r\n </nav>\r\n\r\n <div data-bind=\"visible: !SelectedFolder() && !searchReports()\">\r\n <div class=\"container-fluid\">\r\n <div class=\"row fw-bold border-bottom py-2 w-100\">\r\n <div class=\"col-md-5\">Name</div>\r\n <div class=\"col-md-1\"></div>\r\n <div class=\"col-md-6\" data-bind=\"visible: adminMode\">Access Control</div>\r\n </div>\r\n <div class=\"\" data-bind=\"foreach: Folders\">\r\n <div class=\"row py-2 border-bottom align-items-center w-100\" >\r\n <div class=\"col-md-5 d-flex align-items-center clickable\" data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <span data-bind=\"visible: $root.selectMode, click: function(d,e){ isSelected(!isSelected()); e.stopPropagation(); },\r\n css: isSelected() ? 'fa fa-check-square text-primary me-2' : 'fa fa-square-o me-2'\"></span>\r\n <span class=\"fa fa-folder text-secondary me-2\"></span>\r\n <span data-bind=\"text: FolderName\"></span>\r\n </div>\r\n <div class=\"col-md-1\" onclick=\"event.stopPropagation()\">\r\n <div class=\"dropdown\" data-bind=\"visible: ($root.CanManageFolders() || $root.adminMode()) && (canEdit || canDelete || $root.adminMode())\">\r\n <button class=\"btn btn-sm\" type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-h\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.ManageFolder.editFolder(); }, visible: canEdit || $root.adminMode()\">\r\n <span class=\"fa fa-edit\"></span> Edit Folder\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item text-danger\" href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.ManageFolder.deleteFolder(); }, visible: canDelete || $root.adminMode()\">\r\n <span class=\"fa fa-trash\"></span> Delete Folder\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"container-fluid\">\r\n <div data-bind=\"if: SelectedFolder()!=null && reportsInFolder().length==0\">\r\n <p class=\"text-muted\">This folder is empty.</p>\r\n </div>\r\n\r\n <div data-bind=\"if: searchReports() && reportsInSearch().length==0 && foldersInSearch().length==0\">\r\n <p class=\"text-center text-muted\">No results found matching your search.</p>\r\n </div>\r\n <!-- Folder search results (list view) -->\r\n <div data-bind=\"if: searchReports() && foldersInSearch().length > 0\">\r\n <div class=\"row fw-bold py-1 border-bottom mt-2 w-100\">\r\n <div class=\"col-md-6\"><span class=\"fa fa-folder\"></span> Matching Folders</div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $root.adminMode\">Access</div>\r\n </div>\r\n <div data-bind=\"foreach: foldersInSearch\">\r\n <div class=\"row border-bottom py-2 align-items-center w-100\">\r\n <div class=\"col-md-6 d-flex align-items-center\">\r\n <span class=\"fa fa-folder text-secondary me-2\"></span>\r\n <a href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.searchReports(''); }, highlightedText: { text: FolderName, highlight: $parent.searchReports, css: 'highlight' }\" style=\"cursor: pointer\"></a>\r\n </div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $root.adminMode\">\r\n <div class=\"small text-muted d-flex flex-wrap gap-1 align-items-center\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mb-2\"></div>\r\n </div>\r\n <div data-bind=\"if: reportsInFolder().length > 0 || reportsInSearch().length > 0\">\r\n <div class=\"row fw-bold border-bottom py-2 w-100\">\r\n <div class=\"col-md-4\">Name</div>\r\n <div class=\"col-md-1\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: searchReports()\">Folder</div>\r\n <div class=\"col-md-2\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: adminMode\">Access</div>\r\n <div class=\"col-md-1\" data-bind=\"visible: adminMode\">Direct Link</div>\r\n </div>\r\n\r\n <div class=\"report-list\" data-bind=\"foreach: searchReports() ? reportsInSearch() : reportsInFolder()\">\r\n <div class=\"row border-bottom py-2 align-items-center w-100\">\r\n <div class=\"col-md-4 d-flex align-items-center\">\r\n <input type=\"checkbox\" data-bind=\"visible: $root.selectMode, checked: isSelected\" class=\"me-2\" />\r\n <span class=\"fa\" data-bind=\"css: {\r\n 'fa-file': reportType=='List',\r\n 'fa-th-list': reportType=='Summary',\r\n 'fa-bar-chart': reportType=='Bar',\r\n 'fa-pie-chart': reportType=='Pie',\r\n 'fa-line-chart': reportType=='Line',\r\n 'fa-signal': reportType=='Combo',\r\n 'fa-globe': reportType.indexOf('Map')==0,\r\n 'fa-window-maximize': reportType=='Single',\r\n 'fa-random': reportType=='Pivot',\r\n 'fa-window-restore': reportType=='Treemap',\r\n 'fa-code': reportType == 'Html',\r\n 'fa-map': reportType == 'HeatMap'\r\n }\"></span>\r\n <a class=\"ms-2\" data-bind=\"click: runReport, highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\" style=\"cursor: pointer\"></a> \r\n <span data-bind=\"text: message\" class=\"highlight small\"></span>\r\n <span class=\"badge bg-warning text-dark ms-1\"\r\n title=\"This report is only used as a linked or sub report\"\r\n data-bind=\"visible: isSubReportOnly && isSubReportOnly()\">\r\n <i class=\"fa fa-link\"></i> Sub Report Only\r\n </span>\r\n </div>\r\n\r\n <div class=\"col-md-1\">\r\n <div class=\"dropdown\">\r\n <button class=\"btn btn-sm\" type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-h\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li data-bind=\"visible: canEdit\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: openReport\">\r\n <span class=\"fa fa-edit\"></span> Edit\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\">\r\n <span class=\"fa fa-copy\"></span> Copy\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item text-danger\" href=\"#\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\"></span> Delete\r\n </a>\r\n </li>\r\n <li><hr class=\"dropdown-divider\"></li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: runReport\">\r\n <span class=\"fa fa-gears\"></span> Run Report\r\n </a>\r\n </li>\r\n <li class=\"dropdown-submenu\">\r\n <a class=\"dropdown-item dropdown-toggle\" href=\"#\">Export</a>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport($root.appSettings.useAltPdf ? 'pdfalt' : 'pdf');}\">\r\n <span class=\"fa fa-file-pdf\"></span> Download PDF\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel (Expanded)\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li data-bind=\"visible: !isSubReportOnly()\"><hr class=\"dropdown-divider\"></li>\r\n <li data-bind=\"visible: !isSubReportOnly()\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"text: folderName, visible: $parent.searchReports()\"></div> \r\n <div class=\"col-md-4\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center mt-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: userId ? '\uD83D\uDC64 ' + userId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: viewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: deleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (userRole ? userRole : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: viewOnlyUserRole\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: deleteOnlyUserRole\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: clientId\"> \uD83C\uDFE2 <span data-bind=\"text: clientId\"></span> </span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1\" data-bind=\"visible: $parent.adminMode\">\r\n <a data-bind=\"attr: {href: '/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\"><span class=\"fa fa-link\"></span></a>\r\n \r\n <a href=\"#\" data-bind=\"click: function() { navigator && navigator.clipboard && navigator.clipboard.writeText('/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId) }\">\r\n <span class=\"fa fa-copy\" title=\"Copy Link\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n\r\n <div data-bind=\"visible: (ReportMode() == 'execute' || ReportMode() == 'linked' || ReportMode() == 'design') && !isModalOpen()\">\r\n <div class=\"card\" data-bind=\"visible: true;\" style=\"display: none;\">\r\n <div class=\"card-header\">\r\n <nav class=\"navbar navbar-expand-lg navbar-light bg-light\">\r\n <a class=\"navbar-brand\" href=\"#\">Viewing Report</a>\r\n <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarSupportedContent\" aria-controls=\"navbarSupportedContent\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <span class=\"navbar-toggler-icon\"></span>\r\n </button>\r\n <div class=\"collapse navbar-collapse\" id=\"navbarSupportedContent\">\r\n <ul class=\"navbar-nav me-auto\"></ul>\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"click: function() {$root.ReportMode('start'); $root.textQuery.setupSearch();}\">\r\n <i class=\"fa fa-arrow-left\"></i>\r\n <span>Back to Reports</span>\r\n </button>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: canGoBackToParent(), click: backToParentReport\">\r\n <i class=\"fa fa-arrow-circle-left\"></i>\r\n <span>Back to Parent Report</span>\r\n </button>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: $root.CanEdit() && ReportID(), click: function(){ SaveReport(true); }\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <i class=\"fa fa-edit\"></i> Edit Report\r\n </button>\r\n\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"click: RefreshReport, visible: false\">\r\n <i class=\"fa fa-refresh\"></i>\r\n <span>Refresh</span>\r\n </button> \r\n <span data-bind=\"visible: isDirty\" title=\"You have unsaved changes\">\r\n <i class=\"text-warning fa fa-exclamation-triangle\"></i>\r\n </span>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: $root.CanEdit(), click: SaveWithoutRun\">\r\n <i class=\"fa fa-save\"></i> \r\n <span>Save Report</span>\r\n </button>\r\n <div class=\"dropdown\" data-bind=\"hidden: (DontExecuteOnRun() && !reportRan()) || !ReportID()\">\r\n <button type=\"button\" class=\"btn btn-light btn-sm dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <i class=\"fa fa-download\"></i>\r\n <span>Export</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end\"> \r\n <li data-bind=\"hidden: appSettings.useAltPdf\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { PdfPage.isDebug = false; $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdf(false); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: adminMode() && !appSettings.useAltPdf()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { PdfPage.isDebug = true; $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdf(true); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf (Debug)\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: appSettings.useAltPdf\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdfAlt(); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcel\">\r\n <i class=\"fas fa-file-excel\"></i> Excel\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: canDrilldown\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: downloadExcelWithDrilldown\">\r\n <i class=\"fas fa-file-excel\"></i> Excel (Expanded)\r\n </a>\r\n </li>\r\n <li data-bind=\"hidden: appSettings.dontWordExport\">\r\n <a class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { $('#wordOptionsModal').modal('show'); }\r\n : function() { downloadWord(); }\">\r\n <span class=\"fas fa-file-word\"></span> Word\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadCsv\">\r\n <i class=\"fas fa-file-excel\"></i> Csv\r\n </a>\r\n </li>\r\n <li data-bind=\"hidden: appSettings.dontXmlExport\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadXml\">\r\n <i class=\"fa fa-file-code\"></i> Xml\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: printReportPage\">\r\n <i class=\"fas fa-print\"></i> Print\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </nav>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"with: ReportResult\" class=\"report-view\">\r\n <div data-bind=\"ifnot: HasError\">\r\n <div data-bind=\"with: $root\">\r\n <div>\r\n <div data-bind=\"if: EditFiltersOnReport\">\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <a data-bs-toggle=\"collapse\" data-bs-target=\"#filter-panel\" href=\"#\">\r\n <i class=\"fa fa-filter\"></i>Choose Filters\r\n </a>\r\n </div>\r\n <div id=\"filter-panel\" class=\"card-body collapse\">\r\n <div data-bind=\"if: useStoredProc\">\r\n <div class=\"row\">\r\n <div data-bind=\"template: {name: 'filter-parameters'}\" class=\"col-md-12\"></div>\r\n </div>\r\n </div>\r\n <div data-bind=\"ifnot: useStoredProc\">\r\n <div class=\"row\">\r\n <div data-bind=\"template: {name: 'filter-group'}\" class=\"col-md-12\"></div>\r\n </div>\r\n </div>\r\n <br />\r\n <button class=\"btn btn-primary\" data-bind=\"click: SaveFilterAndRunReport\">Update Filters</button>\r\n </div>\r\n </div>\r\n <br />\r\n </div>\r\n <div data-bind=\"ifnot: EditFiltersOnReport\">\r\n <div data-bind=\"template: {name: 'fly-filter-template'}\"></div>\r\n <br />\r\n </div>\r\n </div>\r\n <div class=\"report-render\" data-bind=\"css: { 'report-expanded': isExpanded }\">\r\n <div class=\"report-menubar bg-light\" data-bind=\"hidden: DontExecuteOnRun() && !reportRan()\">\r\n <div class=\"col-xs-12 col-centered d-flex justify-content-between flex-wrap\" data-bind=\"with: pager\">\r\n <div class=\"form-inline d-flex\" data-bind=\"visible: pages()\">\r\n <div class=\"form-group float-start total-records\">\r\n <span data-bind=\"text: ' Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"float-start\">\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: !$root.isChart() || $root.ShowDataWithGraph(), click: $root.downloadExcel\" title=\"Export to Excel\">\r\n <span class=\"fas fa-file-excel\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"click: $parent.toggleExpand\">\r\n <span class=\"fa\" data-bind=\"css: {'fa-expand': !$parent.isExpanded(), 'fa-compress': $parent.isExpanded() }\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: $parent.canDrilldown, click: $parent.ExpandAll\" title=\"Expand all rows\">\r\n <span class=\"fa fa-plus\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: $parent.canDrilldown, click: $parent.CollapseAll\" title=\"Collapse all rows\">\r\n <span class=\"fa fa-minus\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" title=\"Re-run Report\" data-bind=\"click: function() { $root.RunReport(false, true);}\">\r\n <i class=\"fa fa-play\"></i> \r\n </button>\r\n <div data-bind=\"with: $parent\" class=\"float-start\">\r\n <div class=\"dropdown-selected\" data-bind=\"click: toggleDropdown\">\r\n <div data-bind=\"with: selectedTableStyle\" class=\"btn btn-sm btn-secondary\" title=\"Format Table\">\r\n <span class=\"fa fa- fa-paint-brush\"></span>\r\n </div>\r\n </div>\r\n <div class=\"dropdown-content\" style=\"position: absolute;\" data-bind=\"visible: dropdownOpen\">\r\n <div data-bind=\"foreach: tableStyles\">\r\n <div class=\"dropdown-option\" data-bind=\"title: $data.name, click: $parent.selectStyle\">\r\n <div class=\"mini-table-preview\" data-bind=\"foreach: new Array(5)\">\r\n <div class=\"mini-table-row\" data-bind=\"foreach: new Array(5)\">\r\n <div class=\"mini-table-cell\" data-bind=\"style: { backgroundColor: $parentContext.$index() === 0 ? $parents[1].headerBg : ($parentContext.$index() % 2 === 0 ? $parents[1].altRowBg : $parents[1].rowBg), color: $parents[1].textColor }\"></div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div class=\"btn-group btn-group-sm d-flex\" role=\"group\">\r\n <button class=\"btn btn-light\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode\">\r\n <i class=\"fa fa-code\"></i> View Report Code\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.zoomOut\" data-bs-toggle=\"tooltip\" title=\"Zoom Out\">\r\n <i class=\"fa fa-search-minus\"></i>\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.resetZoom\" data-bs-toggle=\"tooltip\" title=\"Reset Zoom\">\r\n <i class=\"fa fa-compress\"></i>\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.zoomIn\" data-bs-toggle=\"tooltip\" title=\"Zoom In\">\r\n <i class=\"fa fa-search-plus\"></i>\r\n </button>\r\n </div>\r\n <div class=\"form-inline d-flex\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"report-canvas\" data-bind=\"hidden: DontExecuteOnRun() && !reportRan()\">\r\n <div class=\"report-container bg-light\">\r\n <div class=\"report-inner\" data-bind=\"style: { backgroundColor: tableSettings().backColor || (ReportResult() && ReportResult().ReportData() && ReportResult().ReportData().BackColor ? ReportResult().ReportData().BackColor() : '#fff') }\">\r\n <div data-bind=\"if: $root.CanEdit() && ReportType()!='Html' && ReportType()!='Single'\">\r\n <div data-bind=\"template: 'chart-settings', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"if: $root.CanEdit() && ReportType()=='Single'\">\r\n <div data-bind=\"template: 'kpi-settings', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"visible: headerDesigner.UseReportHeader\">\r\n <div id=\"report-header\" width=\"900\" height=\"120\" data-bind=\"html: $root.substituteReportPlaceholders($root.headerDesigner.headerHtml())\"></div>\r\n </div>\r\n <h2 data-bind=\"text: ReportName\"></h2>\r\n <p data-bind=\"html: ReportDescription\">\r\n </p>\r\n <div data-bind=\"template: 'filter-details-summary'\"></div>\r\n\r\n <div data-bind=\"with: ReportResult\" class=\"report-expanded-scroll\">\r\n <div data-bind=\"visible: !ReportData()\">\r\n <div class=\"report-spinner\"></div>\r\n </div>\r\n <div data-bind=\"template: 'report-template', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"visible: footerDesigner.UseReportFooter\">\r\n <div id=\"report-footer\" width=\"900\" data-bind=\"html: $root.substituteReportPlaceholders($root.footerDesigner.footerHtml())\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <br />\r\n <span>Report ran on: <span data-bind=\"text: new Date().toLocaleDateString() + ' ' + new Date().toLocaleTimeString()\"></span></span>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: HasError\">\r\n <h2 data-bind=\"text: $root.ReportName\"></h2>\r\n <p data-bind=\"text: $root.ReportDescription\"></p>\r\n\r\n <h3>An unexpected error occured while running the Report</h3>\r\n <hr />\r\n <b>Error Details</b>\r\n <div data-bind=\"text: Exception\"></div>\r\n <br />\r\n <button class=\"btn btn-light\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode\">\r\n <i class=\"fa fa-code\"></i> View Report Code\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: function() { $root.RunReport(false, true);}\">\r\n <i class=\"fa fa-play\"></i> Re-run Report\r\n </button>\r\n <hr />\r\n </div>\r\n </div>\r\n </div><!-- /flex wrapper -->\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Report Builder -->\r\n<div class=\"modal modal-fullscreen\" id=\"modal-reportbuilder\" role=\"dialog\" aria-labelledby=\"myModalLabel\" aria-hidden=\"true\" style=\"padding-right: 0px !important;\">\r\n <div data-bind=\"template: {name: 'report-designer', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Field Options Modal -->\r\n<div class=\"modal\" id=\"fieldOptionsModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div data-bind=\"template: {name: 'report-field-options', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Link Edit Modal -->\r\n<div class=\"modal\" id=\"linkModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div data-bind=\"template: {name: 'report-link-edit', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Folder Edit Modal -->\r\n<div class=\"modal\" id=\"folderModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\" data-bind=\"css: {'modal-lg': adminMode}\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageFolder\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title fs-5\">Manage Folder</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"form-group\">\r\n <label class=\"col-sm-4 col-md-4 control-label\">Folder Name</label>\r\n <div class=\"col-sm-8 col-md-8\">\r\n <input type=\"text\" class=\"form-control\" id=\"folderName\" required placeholder=\"Folder Name\" data-bind=\"value: FolderName\">\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: $root.adminMode\" class=\"form-group\">\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"showAdminOnly\" data-bind=\"checked: ShowAdminOnly\">\r\n <label class=\"form-check-label\" for=\"showAdminOnly\">\r\n Show Admin Only (Only visible when Admin Mode is ON)\r\n </label>\r\n </div>\r\n </div>\r\n <br />\r\n <div data-bind=\"visible: $root.adminMode\" class=\"card card-body\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageFolderAccess}\"></div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: saveFolder\">Save</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Json File Modal -->\r\n<div class=\"modal\" id=\"uploadFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadFileModalLabel\">Import previously Exported Reports</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n\r\n <div class=\"alert alert-info small\">\r\n <strong>Instructions:</strong><br />\r\n \u2022 Select a <code>.json</code> file previously exported from Dotnet Report.<br />\r\n \u2022 The file may include multiple reports and their folders.<br />\r\n \u2022 Any missing folders will be created automatically.<br />\r\n \u2022 If a report with the same name already exists, you will be prompted to:\r\n <em>Skip</em>, <em>Overwrite</em>, or <em>Make a Copy</em>.<br />\r\n \u2022 Once uploaded, all imported reports will be available immediately.\r\n </div>\r\n\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n Click here to select a JSON file\r\n </div>\r\n\r\n <input type=\"file\" id=\"fileInputJson\" accept=\".json\" style=\"display: none;\"\r\n data-bind=\"event: { change: handleFileSelect }\">\r\n\r\n <div class=\"mt-3\" data-bind=\"visible: fileName\">\r\n <p><strong>Selected File:</strong> <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"wordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'word-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"pdfOptionsModal\" tabindex=\"-1\" aria-labelledby=\"pdfOptionsModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- This renders the template -->\r\n<div class=\"modal\" id=\"pdfOptionsScheduleModal\" tabindex=\"-1\" aria-labelledby=\"pdfOptionsScheduleModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'pdf-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n<!-- This renders the template -->\r\n<div class=\"modal\" id=\"wordOptionsScheduleModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsScheduleModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'word-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- Schedule Report Modal -->\r\n<div class=\"modal\" id=\"modal-schedule-report\" tabindex=\"-1\" aria-labelledby=\"scheduleReportModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\">\r\n <div class=\"modal-content\" data-bind=\"with: scheduleReportModal\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"scheduleReportModalLabel\">\r\n <i class=\"fa fa-hourglass me-2\"></i> Schedule Report\r\n </h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <h6 data-bind=\"text: reportName\" class=\"mb-3\"></h6>\r\n <div data-bind=\"template: { name: 'report-schedule', data: $parent }\"></div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: saveSchedule\">Save Schedule</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->" }]
|
|
9081
|
+
args: [{ selector: 'app-dotnetreport', standalone: true, imports: [CommonModule], template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n<div class=\"container-fluid\">\r\n <div data-bind=\"template: {name: 'admin-mode-template'}, visible: allowAdmin\" style=\"display: none;\"></div>\r\n\r\n <!--\r\n The markup code below is related to presentation. You don't have to change it, unless you\r\n intentionally want to change something in the Report Builder's behavior in your Application.\r\n It's Recommended you use it as is. You will be responsible for managing and maintaining any changes.\r\n -->\r\n <!-- Folders/Report List -->\r\n <div id=\"report-start\" data-bind=\"if: ReportMode() == 'start' || ReportMode() == 'generate'\">\r\n <div class=\"card folder-panel\" data-bind=\"visible: true\" style=\"display: none;\">\r\n <div class=\"card-header\">\r\n <nav class=\"navbar navbar-expand-lg navbar-light bg-light\">\r\n <a class=\"navbar-brand\" href=\"#\" data-bind=\"click: function() {SelectedFolder(null); designingHeader(false); designingFooter(false); searchReports(''); $('#search-report').val([]).trigger('change'); }\">Manage Reports</a>\r\n <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarSupportedContent\" aria-controls=\"navbarSupportedContent\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <span class=\"navbar-toggler-icon\"></span>\r\n </button>\r\n\r\n <div class=\"collapse navbar-collapse\" id=\"navbarSupportedContent\">\r\n <ul class=\"navbar-nav mr-auto\">\r\n <li class=\"nav-item\" data-bind=\"visible: SelectedFolder() ? SelectedFolder().canEdit : (CanSaveReports() || adminMode())\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: createNewReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-plus\"></span> New Report\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" data-bind=\"visible: CanManageFolders() || adminMode()\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: ManageFolder.newFolder\">\r\n <span class=\"fa fa-folder-open\"></span> Add Folder\r\n </a>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: (CanManageFolders() || adminMode()) && SelectedFolder()!=null && (SelectedFolder().canEdit || SelectedFolder().canDelete || adminMode())\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-folder\"></span> Folder Options\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ManageFolder.editFolder, visible: SelectedFolder() && (SelectedFolder().canEdit || adminMode())\">Edit Selected Folder</a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ManageFolder.deleteFolder, visible: SelectedFolder() && (SelectedFolder().canDelete || adminMode())\">Delete Selected Folder</a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: adminMode() && SelectedFolder() ==null\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-window-maximize\"></span> Header / Footer\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ initHeaderDesigner(false); }\">\r\n <span class=\"fa fa-arrow-up\"></span> Report Header\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ initFooterDesigner(false); }\">\r\n <span class=\"fa fa-arrow-down\"></span> Report Footer\r\n </a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item dropdown\" data-bind=\"visible: appSettings.showImportExport() || adminMode()\">\r\n <a href=\"#\" class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-exchange\"></span> Import / Export\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ selectMode(!selectMode()); }\">\r\n <span data-bind=\"css: selectMode() ? 'fa fa-check-square text-primary' : 'fa fa-square-o'\"></span>\r\n <span data-bind=\"text: selectMode() ? 'Cancel Select Mode' : 'Select Mode'\"></span>\r\n </a>\r\n <div class=\"dropdown-divider\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadFileModal\" data-bind=\"visible: !selectMode()\" title=\"Import Report from JSON file\">\r\n <span class=\"fa fa-upload\"></span> Import Reports\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: selectMode, click: exportSelectedReportJson\">\r\n <span class=\"fa fa-download\"></span> Export Selected Reports\r\n </a>\r\n </div>\r\n </li>\r\n </ul>\r\n <div class=\"form-inline my-2 my-lg-0 ms-auto w-50\">\r\n <div class=\"input-group w-100\">\r\n <p id=\"search-input\" class=\"form-control search-input\" data-placeholder=\"Search Report by Name, Description or Data Field...\"></p>\r\n <span data-bind=\"click: searchForReports\" class=\"input-group-text\" style=\"height: 38px; cursor: pointer;\" title=\"Search\"><i class=\"fa fa-search\"></i></span>\r\n <span data-bind=\"click: function() {resetQuery(true, true);}\" class=\"input-group-text\" style=\"height: 38px; cursor: pointer;\" title=\"Clear Search\"><i class=\"fa fa-close\"></i></span>\r\n </div>\r\n </div>\r\n </div>\r\n </nav>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"visible: designingHeader, with: headerDesigner\" style=\"display: none;\" class=\"overflow-auto\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseReportHeader\"> Use Report Header\r\n </label>\r\n </div>\r\n <div data-bind=\"visible: UseReportHeader\">\r\n <p class=\"alert alert-info\">\r\n You can design the common report header below that will be applied to all reports where report headers are turned on.\r\n </p>\r\n <div class=\"form-group row m-1\" data-bind=\"visible: clientListIds().length > 0\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Headers for other Clients saved</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <select class=\"form-control\"\r\n data-bind=\"options: clientListIds,\r\n value: selectedHeaderClientId,\r\n optionsCaption: 'No Client Id (Global)',\r\n event: { change: function () { loadHtmlHeader(true); } }\">\r\n </select>\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" class=\"fa fa-question-circle helptip\"\r\n title=\"Choose a client to design its report header\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Specify Client Id to Restrict Access</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <input class=\"form-control text-box single-line\" type=\"text\" data-bind=\"value: headerClientId\">\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" data-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Leave blank to give all clients access (Global Report Header)\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-12\">\r\n <div class=\"dropdown d-inline-block me-2\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n Insert System Variable\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.number}'); }\">Page Number</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.total}'); }\">Total Pages</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user}'); }\">Current User</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user.roles}'); }\">Current User Roles</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.datetime}'); }\">Current Date/Time</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{report.name}'); }\">Report Name</a></li>\r\n </ul>\r\n </div>\r\n <label class=\"ms-2\">\r\n <input type=\"checkbox\" data-bind=\"checked: IncludeOnEveryPage\" /> Include on every page in PDF/Word export\r\n </label>\r\n </div>\r\n </div>\r\n <textarea id=\"report-header-editor\"></textarea>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlHeader\">\r\n Save Changes\r\n </button>\r\n </div>\r\n <div data-bind=\"visible: !UseReportHeader()\">\r\n <p class=\"alert alert-info\">\r\n If you turn off the <b>Use Report Header</b> option,\r\n the <b>Report Header</b> will not be applied in reports.\r\n </p>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlHeader\">\r\n Save Changes\r\n </button>\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: designingFooter, with: footerDesigner\" style=\"display: none;\" class=\"overflow-auto\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseReportFooter\"> Use Report Footer\r\n </label>\r\n </div>\r\n <div data-bind=\"visible: UseReportFooter\">\r\n <p class=\"alert alert-info\">\r\n You can design the common report footer below that will be applied to all reports where report footers are turned on.\r\n </p>\r\n <div class=\"form-group row m-1\" data-bind=\"visible: clientListIds().length > 0\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Footers for other Clients saved</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <select class=\"form-control\"\r\n data-bind=\"options: clientListIds,\r\n value: selectedFooterClientId,\r\n optionsCaption: 'No Client Id (Global)',\r\n event: { change: function () { loadHtmlFooter(true); } }\">\r\n </select>\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" class=\"fa fa-question-circle helptip\"\r\n title=\"Choose a client to design its report footer\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-3 col-sm-3\">\r\n <label class=\"control-label\">Specify Client Id to Restrict Access</label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <input class=\"form-control text-box single-line\" type=\"text\" data-bind=\"value: footerClientId\">\r\n </div>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <span data-bs-toggle=\"tooltip\" data-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Leave blank to give all clients access (Global Report Footer)\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row m-1\">\r\n <div class=\"col-md-12\">\r\n <div class=\"dropdown d-inline-block me-2\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n Insert System Variable\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.number}'); }\">Page Number</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{page.total}'); }\">Total Pages</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user}'); }\">Current User</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.user.roles}'); }\">Current User Roles</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{current.datetime}'); }\">Current Date/Time</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { insertPlaceholder('{report.name}'); }\">Report Name</a></li>\r\n </ul>\r\n </div>\r\n <label class=\"ms-2\">\r\n <input type=\"checkbox\" data-bind=\"checked: IncludeOnEveryPage\" /> Include on every page in PDF/Word export\r\n </label>\r\n </div>\r\n </div>\r\n <textarea id=\"report-footer-editor\"></textarea>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlFooter\">\r\n Save Changes\r\n </button>\r\n </div>\r\n <div data-bind=\"visible: !UseReportFooter()\">\r\n <p class=\"alert alert-info\">\r\n If you turn off the <b>Use Report Footer</b> option,\r\n the <b>Report Footer</b> will not be applied in reports.\r\n </p>\r\n <button class=\"btn btn-primary btn-sm mt-2\" data-bind=\"click: saveHtmlFooter\">\r\n Save Changes\r\n </button>\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: !designingHeader() && !designingFooter()\">\r\n <div class=\"btn-group\" style=\"float: right\" role=\"group\">\r\n <button type=\"button\" class=\"btn btn-light\" data-bs-toggle=\"tooltip\" title=\"List View\"\r\n data-bind=\"css: { 'active': layout() === 'list' }, click: toggleLayout\">\r\n <span class=\"fa fa-list\"></span>\r\n </button>\r\n <button type=\"button\" class=\"btn btn-light\" data-bs-toggle=\"tooltip\" title=\"Icon View\"\r\n data-bind=\"css: { 'active': layout() === 'icons' }, click: toggleLayout\">\r\n <span class=\"fa fa-th-large\"></span>\r\n </button>\r\n </div>\r\n\r\n <div data-bind=\"if: layout()=='icons'\">\r\n <div data-bind=\"visible: !SelectedFolder() && !searchReports()\">\r\n <p>Please choose Folders below to view Reports</p>\r\n <ul class=\"folder-list\" data-bind=\"foreach: Folders\">\r\n <li data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <span data-bind=\"visible: $root.selectMode, click: function(d,e){ isSelected(!isSelected()); e.stopPropagation(); },\r\n css: isSelected() ? 'fa fa-check-square text-primary me-2' : 'fa fa-square-o me-2'\"></span>\r\n <span class=\"fa fa-3x fa-folder text-secondary\"></span>\r\n <span class=\"desc\" data-bind=\"text: FolderName\"></span>\r\n <div data-bind=\"visible: $root.adminMode\" style=\"font-size: 0.75em; margin-top: 4px;\" onclick=\"event.stopPropagation()\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserId ? UserId : 'Any User'\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserRoles ? UserRoles : 'Any Role'\"></span>\r\n </div> \r\n </li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"clearfix\">\r\n <p class=\"float-start\">Please choose a Report from this Folder</p>\r\n <div class=\"float-end\">\r\n <a href=\"#\" class=\"btn btn-light\" data-bind=\"click: function(){ SelectedFolder(null); searchReports(''); $('#search-report').val([]).trigger('change');}\">\r\n ..back to Folders\r\n </a>\r\n </div>\r\n </div>\r\n <div class=\"list-group list-overflow\">\r\n <div data-bind=\"if: SelectedFolder()!=null && reportsInFolder().length==0\">\r\n This folder is empty.\r\n </div>\r\n <div data-bind=\"if: searchReports() && reportsInSearch().length==0 && foldersInSearch().length==0\">\r\n No results found matching your search.\r\n </div>\r\n <!-- Folder search results (icon view) -->\r\n <div data-bind=\"if: searchReports() && foldersInSearch().length > 0\">\r\n <div class=\"mt-1 mb-1\"><strong><span class=\"fa fa-folder\"></span> Matching Folders</strong></div>\r\n <ul class=\"folder-list\" data-bind=\"foreach: foldersInSearch\">\r\n <li data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.searchReports(''); }\">\r\n <span class=\"fa fa-3x fa-folder text-secondary\"></span>\r\n <span class=\"desc\" data-bind=\"highlightedText: { text: FolderName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n <div data-bind=\"visible: $root.adminMode\" style=\"font-size: 0.75em; margin-top: 4px;\" onclick=\"event.stopPropagation()\">\r\n <div class=\"d-flex flex-wrap gap-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n <hr />\r\n </div>\r\n <div class=\"list-group\" data-bind=\"foreach: searchReports() ? reportsInSearch() : reportsInFolder()\">\r\n <div class=\"list-group-item\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-7\">\r\n <input type=\"checkbox\" data-bind=\"visible: $root.selectMode, checked: isSelected\" class=\"float-start me-2\" />\r\n <div class=\"fa fa-2x float-start\" data-bind=\"css: {'fa-file': reportType=='List', 'fa-th-list': reportType=='Summary', 'fa-bar-chart': reportType=='Bar', 'fa-pie-chart': reportType=='Pie', 'fa-line-chart': reportType=='Line', 'fa-globe': reportType.indexOf('Map')==0, 'fa-window-maximize': reportType=='Single', 'fa-random': reportType=='Pivot', 'fa-window-restore': reportType=='Treemap', 'fa-signal': reportType == 'Combo', 'fa-code': reportType == 'Html', 'fa-map': reportType == 'HeatMap'}\"></div>\r\n <div class=\"float-start\">\r\n <h4>\r\n <a data-bind=\"click: runReport\" style=\"cursor: pointer\">\r\n <span data-bind=\"highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n </a>\r\n </h4>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n <p data-bind=\"text: reportDescription\"></p>\r\n <p data-bind=\"if: $parent.searchReports()\">\r\n <span class=\"fa fa-folder\"></span> <span data-bind=\"text: folderName\"></span>\r\n <span>\r\n <span data-bind=\"text: message\" class=\"highlight small\"></span>\r\n </span>\r\n </p>\r\n <div data-bind=\"if: isSubReportOnly && isSubReportOnly()\">\r\n <span class=\"badge bg-warning text-dark mt-1\"><i class=\"fa fa-link\"></i> Sub Report Only</span>\r\n </div>\r\n <div data-bind=\"if: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center mt-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: userId ? '\uD83D\uDC64 ' + userId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: viewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: deleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (userRole ? userRole : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: viewOnlyUserRole\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: deleteOnlyUserRole\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: clientId\"> \uD83C\uDFE2 <span data-bind=\"text: clientId\"></span> </span>\r\n <a data-bind=\"attr: {href: '/DotNetReport/?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\" title=\"Direct Link\"><span class=\"fa fa-link\"></span></a>\r\n <a href=\"#\" data-bind=\"click: function() { navigator && navigator.clipboard && navigator.clipboard.writeText('/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId) }\" title=\"Copy Link\"><span class=\"fa fa-copy\"></span></a>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-5 right-align\">\r\n <div class=\"d-none d-md-block\">\r\n <br />\r\n <span data-bind=\"if: $root.CanSaveReports() || $root.adminMode() \">\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"visible: canEdit, click: openReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-edit\" aria-hidden=\"true\"></span> Edit\r\n </button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-copy\" aria-hidden=\"true\"></span> Copy\r\n </button>\r\n </span>\r\n <div class=\"btn-group\">\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: runReport\">\r\n <span class=\"fa fa-gears\" aria-hidden=\"true\"></span> Run\r\n </button>\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle dropdown-toggle-split\" data-bs-toggle=\"dropdown\" style=\"margin-left: -4px;\">\r\n <span class=\"sr-only\"></span>\r\n </button>\r\n <div class=\"dropdown-menu dropdown-menu-right\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { exportReport($root.appSettings.useAltPdf ? 'pdfalt' : 'pdf');}\">\r\n <span class=\"fas fa-file-pdf\"></span> Download PDF\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel (Expanded)\r\n </a>\r\n <div class=\"dropdown-divider\" data-bind=\"visible: !isSubReportOnly()\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"visible: !isSubReportOnly(), click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </div>\r\n </div>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\" aria-hidden=\"true\"></span> Delete\r\n </button>\r\n <br />\r\n </div>\r\n\r\n <div class=\"d-block d-md-none\">\r\n <span data-bind=\"if: $root.CanSaveReports() || $root.adminMode()\">\r\n <button class=\"btn btn-sm btn-outline-secondary\" title=\"Edit\" data-bind=\"visible: canEdit, click: openReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-edit\" aria-hidden=\"true\"></span>\r\n </button>\r\n <button class=\"btn btn-sm btn-light\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\" title=\"Copy Report\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <span class=\"fa fa-copy\" aria-hidden=\"true\"></span>\r\n </button>\r\n </span>\r\n\r\n <div class=\"btn-group\">\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: runReport\" title=\"Run Report\">\r\n <span class=\"fa fa-gears\" aria-hidden=\"true\"></span>\r\n </button>\r\n <button type=\"button\" class=\"btn btn-sm btn-outline-secondary dropdown-toggle dropdown-toggle-split\" data-bs-toggle=\"dropdown\" style=\"margin-left: -4px;\">\r\n <span class=\"sr-only\"></span>\r\n </button>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel with inner rows\r\n </a>\r\n <div class=\"dropdown-divider\" data-bind=\"visible: !isSubReportOnly()\"></div>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"visible: !isSubReportOnly(), click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <button class=\"btn btn-sm btn-outline-secondary\" title=\"Delete Report\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\" aria-hidden=\"true\"></span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: layout()=='list'\">\r\n <div class=\"file-explorer-container\">\r\n <nav class=\"breadcrumb\">\r\n <a href=\"#\" class=\"breadcrumb-item\" data-bind=\"click: function(){ SelectedFolder(null); searchReports(''); }\">\r\n All Folders\r\n </a>\r\n <span class=\"breadcrumb-item active\" data-bind=\"visible: SelectedFolder && !searchReports(), text: SelectedFolder()?.FolderName\"></span>\r\n <span class=\"breadcrumb-item active\" data-bind=\"visible: searchReports\">\r\n Search Results\r\n </span>\r\n </nav>\r\n\r\n <div data-bind=\"visible: !SelectedFolder() && !searchReports()\">\r\n <div class=\"container-fluid\">\r\n <div class=\"row fw-bold border-bottom py-2 w-100\">\r\n <div class=\"col-md-5\">Name</div>\r\n <div class=\"col-md-1\"></div>\r\n <div class=\"col-md-6\" data-bind=\"visible: adminMode\">Access Control</div>\r\n </div>\r\n <div class=\"\" data-bind=\"foreach: Folders\">\r\n <div class=\"row py-2 border-bottom align-items-center w-100\" >\r\n <div class=\"col-md-5 d-flex align-items-center clickable\" data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <span data-bind=\"visible: $root.selectMode, click: function(d,e){ isSelected(!isSelected()); e.stopPropagation(); },\r\n css: isSelected() ? 'fa fa-check-square text-primary me-2' : 'fa fa-square-o me-2'\"></span>\r\n <span class=\"fa fa-folder text-secondary me-2\"></span>\r\n <span data-bind=\"text: FolderName\"></span>\r\n </div>\r\n <div class=\"col-md-1\" onclick=\"event.stopPropagation()\">\r\n <div class=\"dropdown\" data-bind=\"visible: ($root.CanManageFolders() || $root.adminMode()) && (canEdit || canDelete || $root.adminMode())\">\r\n <button class=\"btn btn-sm\" type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-h\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.ManageFolder.editFolder(); }, visible: canEdit || $root.adminMode()\">\r\n <span class=\"fa fa-edit\"></span> Edit Folder\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item text-danger\" href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.ManageFolder.deleteFolder(); }, visible: canDelete || $root.adminMode()\">\r\n <span class=\"fa fa-trash\"></span> Delete Folder\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"container-fluid\">\r\n <div data-bind=\"if: SelectedFolder()!=null && reportsInFolder().length==0\">\r\n <p class=\"text-muted\">This folder is empty.</p>\r\n </div>\r\n\r\n <div data-bind=\"if: searchReports() && reportsInSearch().length==0 && foldersInSearch().length==0\">\r\n <p class=\"text-center text-muted\">No results found matching your search.</p>\r\n </div>\r\n <!-- Folder search results (list view) -->\r\n <div data-bind=\"if: searchReports() && foldersInSearch().length > 0\">\r\n <div class=\"row fw-bold py-1 border-bottom mt-2 w-100\">\r\n <div class=\"col-md-6\"><span class=\"fa fa-folder\"></span> Matching Folders</div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $root.adminMode\">Access</div>\r\n </div>\r\n <div data-bind=\"foreach: foldersInSearch\">\r\n <div class=\"row border-bottom py-2 align-items-center w-100\">\r\n <div class=\"col-md-6 d-flex align-items-center\">\r\n <span class=\"fa fa-folder text-secondary me-2\"></span>\r\n <a href=\"#\" data-bind=\"click: function(){ $parent.SelectedFolder($data); $parent.searchReports(''); }, highlightedText: { text: FolderName, highlight: $parent.searchReports, css: 'highlight' }\" style=\"cursor: pointer\"></a>\r\n </div>\r\n <div class=\"col-md-6\" data-bind=\"visible: $root.adminMode\">\r\n <div class=\"small text-muted d-flex flex-wrap gap-1 align-items-center\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: UserId ? '\uD83D\uDC64 ' + UserId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: ViewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: DeleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (UserRoles ? UserRoles : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: ViewOnlyUserRoles\"> \uD83D\uDC41 <span data-bind=\"text: ViewOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: DeleteOnlyUserRoles\"> \uD83D\uDDD1 <span data-bind=\"text: DeleteOnlyUserRoles\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: ClientId\"> \uD83C\uDFE2 <span data-bind=\"text: ClientId\"></span> </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mb-2\"></div>\r\n </div>\r\n <div data-bind=\"if: reportsInFolder().length > 0 || reportsInSearch().length > 0\">\r\n <div class=\"row fw-bold border-bottom py-2 w-100\">\r\n <div class=\"col-md-4\">Name</div>\r\n <div class=\"col-md-1\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: searchReports()\">Folder</div>\r\n <div class=\"col-md-2\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: adminMode\">Access</div>\r\n <div class=\"col-md-1\" data-bind=\"visible: adminMode\">Direct Link</div>\r\n </div>\r\n\r\n <div class=\"report-list\" data-bind=\"foreach: searchReports() ? reportsInSearch() : reportsInFolder()\">\r\n <div class=\"row border-bottom py-2 align-items-center w-100\">\r\n <div class=\"col-md-4 d-flex align-items-center\">\r\n <input type=\"checkbox\" data-bind=\"visible: $root.selectMode, checked: isSelected\" class=\"me-2\" />\r\n <span class=\"fa\" data-bind=\"css: {\r\n 'fa-file': reportType=='List',\r\n 'fa-th-list': reportType=='Summary',\r\n 'fa-bar-chart': reportType=='Bar',\r\n 'fa-pie-chart': reportType=='Pie',\r\n 'fa-line-chart': reportType=='Line',\r\n 'fa-signal': reportType=='Combo',\r\n 'fa-globe': reportType.indexOf('Map')==0,\r\n 'fa-window-maximize': reportType=='Single',\r\n 'fa-random': reportType=='Pivot',\r\n 'fa-window-restore': reportType=='Treemap',\r\n 'fa-code': reportType == 'Html',\r\n 'fa-map': reportType == 'HeatMap'\r\n }\"></span>\r\n <a class=\"ms-2\" data-bind=\"click: runReport, highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\" style=\"cursor: pointer\"></a> \r\n <span data-bind=\"text: message\" class=\"highlight small\"></span>\r\n <span class=\"badge bg-warning text-dark ms-1\"\r\n title=\"This report is only used as a linked or sub report\"\r\n data-bind=\"visible: isSubReportOnly && isSubReportOnly()\">\r\n <i class=\"fa fa-link\"></i> Sub Report Only\r\n </span>\r\n </div>\r\n\r\n <div class=\"col-md-1\">\r\n <div class=\"dropdown\">\r\n <button class=\"btn btn-sm\" type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-h\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li data-bind=\"visible: canEdit\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: openReport\">\r\n <span class=\"fa fa-edit\"></span> Edit\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: copyReport, visible:canEdit || $parent.appSettings.canCopyReport\">\r\n <span class=\"fa fa-copy\"></span> Copy\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item text-danger\" href=\"#\" data-bind=\"click: deleteReport, visible: canDelete\">\r\n <span class=\"fa fa-trash\"></span> Delete\r\n </a>\r\n </li>\r\n <li><hr class=\"dropdown-divider\"></li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: runReport\">\r\n <span class=\"fa fa-gears\"></span> Run Report\r\n </a>\r\n </li>\r\n <li class=\"dropdown-submenu\">\r\n <a class=\"dropdown-item dropdown-toggle\" href=\"#\">Export</a>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport($root.appSettings.useAltPdf ? 'pdfalt' : 'pdf');}\">\r\n <span class=\"fa fa-file-pdf\"></span> Download PDF\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible: hasDrilldown, click: function() {exportReport('excel-sub');}\">\r\n <span class=\"fas fa-file-excel\"></span> Download Excel (Expanded)\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li data-bind=\"visible: !isSubReportOnly()\"><hr class=\"dropdown-divider\"></li>\r\n <li data-bind=\"visible: !isSubReportOnly()\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-schedule-report\" data-bind=\"click: function() { $parent.openScheduleModal($data); }\">\r\n <span class=\"fa fa-hourglass\"></span> Schedule Report\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"text: folderName, visible: $parent.searchReports()\"></div> \r\n <div class=\"col-md-4\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"d-flex flex-wrap gap-1 align-items-center mt-1\">\r\n <span class=\"badge bg-info text-white\" title=\"Manage Users\" data-bind=\"text: userId ? '\uD83D\uDC64 ' + userId : '\uD83D\uDC64 Any User'\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Users\" data-bind=\"visible: viewOnlyUserId\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Users\" data-bind=\"visible: deleteOnlyUserId\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserId\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Manage Roles\" data-bind=\"text: '\uD83D\uDD11 ' + (userRole ? userRole : 'Any Role')\"> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"View only Roles\" data-bind=\"visible: viewOnlyUserRole\"> \uD83D\uDC41 <span data-bind=\"text: viewOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white border\" title=\"Delete only Roles\" data-bind=\"visible: deleteOnlyUserRole\"> \uD83D\uDDD1 <span data-bind=\"text: deleteOnlyUserRole\"></span> </span>\r\n <span class=\"badge bg-info text-white\" title=\"Client\" data-bind=\"visible: clientId\"> \uD83C\uDFE2 <span data-bind=\"text: clientId\"></span> </span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1\" data-bind=\"visible: $parent.adminMode\">\r\n <a data-bind=\"attr: {href: '/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\"><span class=\"fa fa-link\"></span></a>\r\n \r\n <a href=\"#\" data-bind=\"click: function() { navigator && navigator.clipboard && navigator.clipboard.writeText('/DotNetReport?linkedreport=true&noparent=true&reportId=' + reportId) }\">\r\n <span class=\"fa fa-copy\" title=\"Copy Link\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n\r\n <div data-bind=\"visible: (ReportMode() == 'execute' || ReportMode() == 'linked' || ReportMode() == 'design') && !isModalOpen()\">\r\n <div class=\"card\" data-bind=\"visible: true;\" style=\"display: none;\">\r\n <div class=\"card-header\">\r\n <nav class=\"navbar navbar-expand-lg navbar-light bg-light\">\r\n <a class=\"navbar-brand\" href=\"#\">Viewing Report</a>\r\n <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarSupportedContent\" aria-controls=\"navbarSupportedContent\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <span class=\"navbar-toggler-icon\"></span>\r\n </button>\r\n <div class=\"collapse navbar-collapse\" id=\"navbarSupportedContent\">\r\n <ul class=\"navbar-nav me-auto\"></ul>\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"click: function() {$root.ReportMode('start'); $root.textQuery.setupSearch();}\">\r\n <i class=\"fa fa-arrow-left\"></i>\r\n <span>Back to Reports</span>\r\n </button>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: canGoBackToParent(), click: backToParentReport\">\r\n <i class=\"fa fa-arrow-circle-left\"></i>\r\n <span>Back to Parent Report</span>\r\n </button>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: $root.CanEdit() && ReportID(), click: function(){ SaveReport(true); }\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\">\r\n <i class=\"fa fa-edit\"></i> Edit Report\r\n </button>\r\n\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"click: RefreshReport, visible: false\">\r\n <i class=\"fa fa-refresh\"></i>\r\n <span>Refresh</span>\r\n </button> \r\n <span data-bind=\"visible: isDirty\" title=\"You have unsaved changes\">\r\n <i class=\"text-warning fa fa-exclamation-triangle\"></i>\r\n </span>\r\n <button class=\"btn btn-light btn-sm\" data-bind=\"visible: $root.CanEdit(), click: SaveWithoutRun\">\r\n <i class=\"fa fa-save\"></i> \r\n <span>Save Report</span>\r\n </button>\r\n <div class=\"dropdown\" data-bind=\"hidden: (DontExecuteOnRun() && !reportRan()) || !ReportID()\">\r\n <button type=\"button\" class=\"btn btn-light btn-sm dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <i class=\"fa fa-download\"></i>\r\n <span>Export</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end\"> \r\n <li data-bind=\"hidden: appSettings.useAltPdf\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { PdfPage.isDebug = false; $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdf(false); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: adminMode() && !appSettings.useAltPdf()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { PdfPage.isDebug = true; $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdf(true); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf (Debug)\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: appSettings.useAltPdf\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { $('#pdfOptionsModal').modal('show'); }\r\n : function() { downloadPdfAlt(); }\">\r\n <i class=\"fa fa-file-pdf\"></i> Pdf\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcel\">\r\n <i class=\"fas fa-file-excel\"></i> Excel\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: canDrilldown\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: downloadExcelWithDrilldown\">\r\n <i class=\"fas fa-file-excel\"></i> Excel (Expanded)\r\n </a>\r\n </li>\r\n <li data-bind=\"hidden: appSettings.dontWordExport\">\r\n <a class=\"dropdown-item\" data-bind=\"click: appSettings.showPageSize\r\n ? function() { $('#wordOptionsModal').modal('show'); }\r\n : function() { downloadWord(); }\">\r\n <span class=\"fas fa-file-word\"></span> Word\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadCsv\">\r\n <i class=\"fas fa-file-excel\"></i> Csv\r\n </a>\r\n </li>\r\n <li data-bind=\"hidden: appSettings.dontXmlExport\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadXml\">\r\n <i class=\"fa fa-file-code\"></i> Xml\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: printReportPage\">\r\n <i class=\"fas fa-print\"></i> Print\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </nav>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"with: ReportResult\" class=\"report-view\">\r\n <div data-bind=\"ifnot: HasError\">\r\n <div data-bind=\"with: $root\">\r\n <div>\r\n <div data-bind=\"if: EditFiltersOnReport\">\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <a data-bs-toggle=\"collapse\" data-bs-target=\"#filter-panel\" href=\"#\">\r\n <i class=\"fa fa-filter\"></i>Choose Filters\r\n </a>\r\n </div>\r\n <div id=\"filter-panel\" class=\"card-body collapse\">\r\n <div data-bind=\"if: useStoredProc\">\r\n <div class=\"row\">\r\n <div data-bind=\"template: {name: 'filter-parameters'}\" class=\"col-md-12\"></div>\r\n </div>\r\n </div>\r\n <div data-bind=\"ifnot: useStoredProc\">\r\n <div class=\"row\">\r\n <div data-bind=\"template: {name: 'filter-group'}\" class=\"col-md-12\"></div>\r\n </div>\r\n </div>\r\n <br />\r\n <button class=\"btn btn-primary\" data-bind=\"click: SaveFilterAndRunReport\">Update Filters</button>\r\n </div>\r\n </div>\r\n <br />\r\n </div>\r\n <div data-bind=\"ifnot: EditFiltersOnReport\">\r\n <div data-bind=\"template: {name: 'fly-filter-template'}\"></div>\r\n <br />\r\n </div>\r\n </div>\r\n <div class=\"report-render\" data-bind=\"css: { 'report-expanded': isExpanded }\">\r\n <div class=\"report-menubar bg-light\" data-bind=\"hidden: DontExecuteOnRun() && !reportRan()\">\r\n <div class=\"col-xs-12 col-centered d-flex justify-content-between flex-wrap\" data-bind=\"with: pager\">\r\n <div class=\"form-inline d-flex\" data-bind=\"visible: pages()\">\r\n <div class=\"form-group float-start total-records\">\r\n <span data-bind=\"text: ' Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"float-start\">\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: !$root.isChart() || $root.ShowDataWithGraph(), click: $root.downloadExcel\" title=\"Export to Excel\">\r\n <span class=\"fas fa-file-excel\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"click: $parent.toggleExpand\">\r\n <span class=\"fa\" data-bind=\"css: {'fa-expand': !$parent.isExpanded(), 'fa-compress': $parent.isExpanded() }\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: $parent.canDrilldown, click: $parent.ExpandAll\" title=\"Expand all rows\">\r\n <span class=\"fa fa-plus\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: $parent.canDrilldown, click: $parent.CollapseAll\" title=\"Collapse all rows\">\r\n <span class=\"fa fa-minus\"></span>\r\n </button>\r\n <button class=\"btn btn-secondary btn-sm\" title=\"Re-run Report\" data-bind=\"click: function() { $root.RunReport(false, true);}\">\r\n <i class=\"fa fa-play\"></i> \r\n </button>\r\n <div data-bind=\"with: $parent\" class=\"float-start\">\r\n <div class=\"dropdown-selected\" data-bind=\"click: toggleDropdown\">\r\n <div data-bind=\"with: selectedTableStyle\" class=\"btn btn-sm btn-secondary\" title=\"Format Table\">\r\n <span class=\"fa fa- fa-paint-brush\"></span>\r\n </div>\r\n </div>\r\n <div class=\"dropdown-content\" style=\"position: absolute;\" data-bind=\"visible: dropdownOpen\">\r\n <div data-bind=\"foreach: tableStyles\">\r\n <div class=\"dropdown-option\" data-bind=\"title: $data.name, click: $parent.selectStyle\">\r\n <div class=\"mini-table-preview\" data-bind=\"foreach: new Array(5)\">\r\n <div class=\"mini-table-row\" data-bind=\"foreach: new Array(5)\">\r\n <div class=\"mini-table-cell\" data-bind=\"style: { backgroundColor: $parentContext.$index() === 0 ? $parents[1].headerBg : ($parentContext.$index() % 2 === 0 ? $parents[1].altRowBg : $parents[1].rowBg), color: $parents[1].textColor }\"></div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div class=\"btn-group btn-group-sm d-flex\" role=\"group\">\r\n <button class=\"btn btn-light\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode\">\r\n <i class=\"fa fa-code\"></i> View Report Code\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.zoomOut\" data-bs-toggle=\"tooltip\" title=\"Zoom Out\">\r\n <i class=\"fa fa-search-minus\"></i>\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.resetZoom\" data-bs-toggle=\"tooltip\" title=\"Reset Zoom\">\r\n <i class=\"fa fa-compress\"></i>\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: $parent.zoomIn\" data-bs-toggle=\"tooltip\" title=\"Zoom In\">\r\n <i class=\"fa fa-search-plus\"></i>\r\n </button>\r\n </div>\r\n <div class=\"form-inline d-flex\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"report-canvas\" data-bind=\"hidden: DontExecuteOnRun() && !reportRan()\">\r\n <div class=\"report-container bg-light\">\r\n <div class=\"report-inner\" data-bind=\"style: { backgroundColor: tableSettings().backColor || (ReportResult() && ReportResult().ReportData() && ReportResult().ReportData().BackColor ? ReportResult().ReportData().BackColor() : '#fff') }\">\r\n <div data-bind=\"if: $root.CanEdit() && ReportType()!='Html' && ReportType()!='Single'\">\r\n <div data-bind=\"template: 'chart-settings', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"if: $root.CanEdit() && ReportType()=='Single'\">\r\n <div data-bind=\"template: 'kpi-settings', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"visible: headerDesigner.UseReportHeader\">\r\n <div id=\"report-header\" width=\"900\" height=\"120\" data-bind=\"html: $root.substituteReportPlaceholders($root.headerDesigner.headerHtml())\"></div>\r\n </div>\r\n <h2 data-bind=\"text: ReportName\"></h2>\r\n <p data-bind=\"html: ReportDescription\">\r\n </p>\r\n <div data-bind=\"template: 'filter-details-summary'\"></div>\r\n\r\n <div data-bind=\"with: ReportResult\" class=\"report-expanded-scroll\">\r\n <div data-bind=\"visible: !ReportData()\">\r\n <div class=\"report-spinner\"></div>\r\n </div>\r\n <div data-bind=\"template: 'report-template', data: $data\"></div>\r\n </div>\r\n <div data-bind=\"visible: footerDesigner.UseReportFooter\">\r\n <div id=\"report-footer\" width=\"900\" data-bind=\"html: $root.substituteReportPlaceholders($root.footerDesigner.footerHtml())\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <br />\r\n <span>Report ran on: <span data-bind=\"text: new Date().toLocaleDateString() + ' ' + new Date().toLocaleTimeString()\"></span></span>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: HasError\">\r\n <h2 data-bind=\"text: $root.ReportName\"></h2>\r\n <p data-bind=\"text: $root.ReportDescription\"></p>\r\n\r\n <h3>An unexpected error occured while running the Report</h3>\r\n <hr />\r\n <b>Error Details</b>\r\n <div data-bind=\"text: Exception\"></div>\r\n <br />\r\n <button class=\"btn btn-light\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode\">\r\n <i class=\"fa fa-code\"></i> View Report Code\r\n </button>\r\n <button class=\"btn btn-light\" data-bind=\"click: function() { $root.RunReport(false, true);}\">\r\n <i class=\"fa fa-play\"></i> Re-run Report\r\n </button>\r\n <hr />\r\n </div>\r\n </div>\r\n </div><!-- /flex wrapper -->\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Report Builder -->\r\n<div class=\"modal modal-fullscreen\" id=\"modal-reportbuilder\" role=\"dialog\" aria-labelledby=\"myModalLabel\" aria-hidden=\"true\" style=\"padding-right: 0px !important;\">\r\n <div data-bind=\"template: {name: 'report-designer', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Field Options Modal -->\r\n<div class=\"modal\" id=\"fieldOptionsModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div data-bind=\"template: {name: 'report-field-options', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Link Edit Modal -->\r\n<div class=\"modal\" id=\"linkModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div data-bind=\"template: {name: 'report-link-edit', data: $data}\"></div>\r\n</div>\r\n\r\n<!-- Folder Edit Modal -->\r\n<div class=\"modal\" id=\"folderModal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\" data-bind=\"css: {'modal-lg': adminMode}\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageFolder\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title fs-5\">Manage Folder</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"form-group\">\r\n <label class=\"col-sm-4 col-md-4 control-label\">Folder Name</label>\r\n <div class=\"col-sm-8 col-md-8\">\r\n <input type=\"text\" class=\"form-control\" id=\"folderName\" required placeholder=\"Folder Name\" data-bind=\"value: FolderName\">\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: $root.adminMode\" class=\"form-group\">\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"showAdminOnly\" data-bind=\"checked: ShowAdminOnly\">\r\n <label class=\"form-check-label\" for=\"showAdminOnly\">\r\n Show Admin Only (Only visible when Admin Mode is ON)\r\n </label>\r\n </div>\r\n </div>\r\n <br />\r\n <div data-bind=\"visible: $root.adminMode\" class=\"card card-body\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageFolderAccess}\"></div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: saveFolder\">Save</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Json File Modal -->\r\n<div class=\"modal\" id=\"uploadFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadFileModalLabel\">Import previously Exported Reports</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n\r\n <div class=\"alert alert-info small\">\r\n <strong>Instructions:</strong><br />\r\n \u2022 Select a <code>.json</code> file previously exported from Dotnet Report.<br />\r\n \u2022 The file may include multiple reports and their folders.<br />\r\n \u2022 Any missing folders will be created automatically.<br />\r\n \u2022 If a report with the same name already exists, you will be prompted to:\r\n <em>Skip</em>, <em>Overwrite</em>, or <em>Make a Copy</em>.<br />\r\n \u2022 Once uploaded, all imported reports will be available immediately.\r\n </div>\r\n\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n Click here to select a JSON file\r\n </div>\r\n\r\n <input type=\"file\" id=\"fileInputJson\" accept=\".json\" style=\"display: none;\"\r\n data-bind=\"event: { change: handleFileSelect }\">\r\n\r\n <div class=\"mt-3\" data-bind=\"visible: fileName\">\r\n <p><strong>Selected File:</strong> <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"wordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'word-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"pdfOptionsModal\" tabindex=\"-1\" aria-labelledby=\"pdfOptionsModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- This renders the template -->\r\n<div class=\"modal\" id=\"pdfOptionsScheduleModal\" tabindex=\"-1\" aria-labelledby=\"pdfOptionsScheduleModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'pdf-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n<!-- This renders the template -->\r\n<div class=\"modal\" id=\"wordOptionsScheduleModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsScheduleModalLabel\" aria-hidden=\"true\">\r\n <div data-bind=\"template: { name: 'word-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- Schedule Report Modal -->\r\n<div class=\"modal\" id=\"modal-schedule-report\" tabindex=\"-1\" aria-labelledby=\"scheduleReportModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\">\r\n <div class=\"modal-content\" data-bind=\"with: scheduleReportModal\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"scheduleReportModalLabel\">\r\n <i class=\"fa fa-hourglass me-2\"></i> Schedule Report\r\n </h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <h6 data-bind=\"text: reportName\" class=\"mb-3\"></h6>\r\n <div data-bind=\"template: { name: 'report-schedule', data: $parent }\"></div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: saveSchedule\">Save Schedule</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->\r\n</div>" }]
|
|
9082
9082
|
}], ctorParameters: () => [{ type: i0.Injector }, { type: i1.DomSanitizer }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
|
|
9083
9083
|
type: Inject,
|
|
9084
9084
|
args: [BASE_URL_TOKEN]
|
|
@@ -9192,7 +9192,7 @@ class DotnetsetupComponent {
|
|
|
9192
9192
|
<!-- ko if: ['DateTime','Date','Time'].indexOf(fieldType) != -1 -->
|
|
9193
9193
|
<div style="display: flex; align-items: center; gap: 8px;">
|
|
9194
9194
|
<!-- ko if: ['=','>','<','>=','<=', 'not equal'].indexOf($parent.Operator()) != -1 -->
|
|
9195
|
-
<input class="form-control" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat:
|
|
9195
|
+
<input class="form-control" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat: (['Date','Date and Time','Time'].indexOf(fieldFormat()) >= 0 && dateFormat() && dateFormat() !== 'Custom') ? $root.dateFormatMappings[dateFormat()] : $root.dateFormatMappings[($root.appSettings && $root.appSettings.defaultDateFormat) || 'United States']}" required />
|
|
9196
9196
|
<!-- ko if: fieldType=='Time' || fieldFormat()=='Time' || fieldFormat()=='Date and Time'-->
|
|
9197
9197
|
<input class="form-control" type="time" data-bind="value:$parent.Valuetime" required>
|
|
9198
9198
|
<!-- /ko -->
|
|
@@ -9201,14 +9201,14 @@ class DotnetsetupComponent {
|
|
|
9201
9201
|
<!-- ko if: ['between'].indexOf($parent.Operator()) != -1 -->
|
|
9202
9202
|
From
|
|
9203
9203
|
<div style="display: flex; align-items: center; gap: 8px;">
|
|
9204
|
-
<input required class="form-control from-date" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat:
|
|
9204
|
+
<input required class="form-control from-date" data-bind="datepicker: $parent.fmtValue, datepickerOptions: {value: $parent.Value, dateFormat: (['Date','Date and Time','Time'].indexOf(fieldFormat()) >= 0 && dateFormat() && dateFormat() !== 'Custom') ? $root.dateFormatMappings[dateFormat()] : $root.dateFormatMappings[($root.appSettings && $root.appSettings.defaultDateFormat) || 'United States']}" />
|
|
9205
9205
|
<!-- ko if:fieldType=='Time' || fieldFormat()=='Time' || fieldFormat()=='Date and Time'-->
|
|
9206
9206
|
<input class="form-control" type="time" data-bind="value:$parent.Valuetime" required>
|
|
9207
9207
|
<!-- /ko -->
|
|
9208
9208
|
</div>
|
|
9209
9209
|
to
|
|
9210
9210
|
<div style="display: flex; align-items: center; gap: 8px;">
|
|
9211
|
-
<input data-bind="datepicker: $parent.fmtValue2, datepickerOptions: {value: $parent.Value2, dateFormat:
|
|
9211
|
+
<input data-bind="datepicker: $parent.fmtValue2, datepickerOptions: {value: $parent.Value2, dateFormat: (['Date','Date and Time','Time'].indexOf(fieldFormat()) >= 0 && dateFormat() && dateFormat() !== 'Custom') ? $root.dateFormatMappings[dateFormat()] : $root.dateFormatMappings[($root.appSettings && $root.appSettings.defaultDateFormat) || 'United States']}" class="form-control to-date" required />
|
|
9212
9212
|
<!-- ko if:fieldType=='Time' || fieldFormat()=='Time' || fieldFormat()=='Date and Time'-->
|
|
9213
9213
|
<input class="form-control" type="time" data-bind="value:$parent.Valuetime2" required>
|
|
9214
9214
|
<!-- /ko -->
|
|
@@ -9350,7 +9350,7 @@ class DotnetsetupComponent {
|
|
|
9350
9350
|
<th data-bind="attr: { id: !IsPivotField ? fieldId : 'pivot--' + fieldName }, style: {'text-align': fieldAlign() ? fieldAlign() : (IsNumeric ? 'right' : 'left'), 'background-color': headerBackColor }, hidden: outerGroup" style="border-right: 1px solid;">
|
|
9351
9351
|
|
|
9352
9352
|
<!-- ko if: !$parent.IsDrillDown() && !$parent.IsSubReport() -->
|
|
9353
|
-
<div class="
|
|
9353
|
+
<div class="pull-left" style="padding-right: 5px;">
|
|
9354
9354
|
<div class="dropup">
|
|
9355
9355
|
<a href="#" data-bs-toggle="dropdown" aria-haspopup="false" aria-expanded="false">
|
|
9356
9356
|
<span class="fa fa-ellipsis-v sortable" title="Drag to reorder"></span>
|
|
@@ -12101,7 +12101,7 @@ class DotnetsetupComponent {
|
|
|
12101
12101
|
</div>
|
|
12102
12102
|
<div class="checkbox" data-bind="visible: adminMode()">
|
|
12103
12103
|
<label>
|
|
12104
|
-
<input type="checkbox" data-bind="checked:
|
|
12104
|
+
<input type="checkbox" data-bind="checked: ShowAdminOnly">
|
|
12105
12105
|
Hide from reports unless Admin Mode is enabled
|
|
12106
12106
|
</label>
|
|
12107
12107
|
</div>
|
|
@@ -12110,7 +12110,7 @@ class DotnetsetupComponent {
|
|
|
12110
12110
|
<i class="fa fa-folder-open"></i> Choose Folder
|
|
12111
12111
|
</label>
|
|
12112
12112
|
<div>
|
|
12113
|
-
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID"></select>
|
|
12113
|
+
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID, valueAllowUnset: true"></select>
|
|
12114
12114
|
</div>
|
|
12115
12115
|
</div>
|
|
12116
12116
|
<hr />
|
|
@@ -12396,7 +12396,7 @@ class DotnetsetupComponent {
|
|
|
12396
12396
|
</div>
|
|
12397
12397
|
<div class="checkbox" data-bind="visible: adminMode()">
|
|
12398
12398
|
<label>
|
|
12399
|
-
<input type="checkbox" data-bind="checked:
|
|
12399
|
+
<input type="checkbox" data-bind="checked: ShowAdminOnly">
|
|
12400
12400
|
Hide from reports unless Admin Mode is enabled
|
|
12401
12401
|
</label>
|
|
12402
12402
|
</div>
|
|
@@ -12405,7 +12405,7 @@ class DotnetsetupComponent {
|
|
|
12405
12405
|
<i class="fa fa-folder-open"></i> Choose Folder
|
|
12406
12406
|
</label>
|
|
12407
12407
|
<div>
|
|
12408
|
-
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID"></select>
|
|
12408
|
+
<select class="form-select" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID, valueAllowUnset: true"></select>
|
|
12409
12409
|
</div>
|
|
12410
12410
|
</div>
|
|
12411
12411
|
</div>
|
|
@@ -12540,13 +12540,13 @@ class DotnetsetupComponent {
|
|
|
12540
12540
|
<label><input type="checkbox" data-bind="checked: isSubReportOnly, click: function() { setTimeout(function() { toggleIsSubReportOnly(); }, 0); return true; }"> Only use as sub report</label>
|
|
12541
12541
|
</div>
|
|
12542
12542
|
<div class="checkbox" data-bind="visible: adminMode()">
|
|
12543
|
-
<label><input type="checkbox" data-bind="checked:
|
|
12543
|
+
<label><input type="checkbox" data-bind="checked: ShowAdminOnly"> </label>
|
|
12544
12544
|
Hide from reports unless Admin Mode is enabled
|
|
12545
12545
|
</div>
|
|
12546
12546
|
<div class="form-group row mb-2" data-bind="visible: SaveReport">
|
|
12547
12547
|
<label class="control-label"><i class="fa fa-folder-open"></i> Folder</label>
|
|
12548
12548
|
<div>
|
|
12549
|
-
<select class="form-select form-select-sm" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID"></select>
|
|
12549
|
+
<select class="form-select form-select-sm" style="width: 100%;" data-bind="options: Folders, optionsText: 'FolderName', optionsValue: 'Id', value: FolderID, valueAllowUnset: true"></select>
|
|
12550
12550
|
</div>
|
|
12551
12551
|
</div>
|
|
12552
12552
|
<hr class="my-1" />
|
|
@@ -13505,11 +13505,11 @@ class DotnetsetupComponent {
|
|
|
13505
13505
|
this.cdref.detectChanges();
|
|
13506
13506
|
}
|
|
13507
13507
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DotnetsetupComponent, deps: [{ token: i0.Injector }, { token: i1.DomSanitizer }, { token: i0.ChangeDetectorRef }, { token: BASE_URL_TOKEN }, { token: i2.HttpClient }, { token: i3.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
|
|
13508
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: DotnetsetupComponent, isStandalone: true, selector: "app-dotnetsetup", ngImport: i0, template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n\r\n<div>\r\n <h2>Manage Database</h2>\r\n <p>\r\n You can select and manage display names for the Tables and Columns you would like to allow in Dotnet Report Builder.\r\n </p>\r\n <div class=\"alert alert-danger d-flex justify-content-between align-items-center\">\r\n <div>\r\n Do not expose this Setup Tool to end users who should not have access to it. Ideally, only Developers should be given access to this utility.\r\n </div>\r\n <button class=\"btn btn-primary ms-3\" data-bind=\"click: refreshAll\" title=\"Reload all Table and Columns\">\r\n <i class=\"fa fa-refresh\"></i> Refresh\r\n </button>\r\n </div>\r\n\r\n <div data-bind=\"visible: false;\">\r\n Loading...\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <!-- Nav tabs -->\r\n <ul class=\"nav nav-tabs flex-grow-1\" role=\"tablist\">\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link active\" href=\"#tablesfields\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\" data-bind=\"click: function() { customTableMode(false); activeTable(null);}\">\r\n <i class=\"fa fa-database\"></i> Database Tables\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#tablesfields\" aria-controls=\"custom\" role=\"tab\" data-bs-toggle=\"tab\" data-bind=\"click: function() { customTableMode(true); activeTable(null); }\">\r\n <i class=\"fa fa-table\"></i> Custom Tables\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#relations\" aria-controls=\"profile\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-link\"></i> Relations\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#procedure\" aria-controls=\"procedure\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-code\"></i> Stored Procs\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#schedules\" aria-controls=\"schedules\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-clock\"></i> Schedules\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\" data-bind=\"visible: settings.useFunctions\">\r\n <a class=\"nav-link\" href=\"#functions\" aria-controls=\"functions\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-cogs\"></i> Custom Functions\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#manageaccess\" aria-controls=\"manageaccess\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-folder\"></i> Manage Reports\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#connection\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-plug\"></i> Data Settings\r\n </a>\r\n </li>\r\n </ul>\r\n\r\n </div>\r\n <br />\r\n</div>\r\n<!-- Tab panes -->\r\n<div class=\"fix-content\" style=\"display: none;\" data-bind=\"visible: true\">\r\n <div class=\"tab-content\">\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"connection\">\r\n <b>Manage Data Connection</b>\r\n <p>\r\n Data Connection groups data schemas (including tables and stored procedures and other configuration), Reports, and Dashboards into a single environment. You can create multiple Data Connections and easily switch between them for separate environment management.\r\n </p>\r\n <hr />\r\n <div class=\"form-row\" data-bind=\"visible: true\">\r\n <div class=\"form-group\">\r\n <div class=\"control-group\">\r\n <select class=\"form-select\" style=\"width:25%\" data-bind=\"options: DataConnections, optionsText: 'DataConnectName', optionsValue: 'DataConnectGuid', value: currentConnectionKey\"></select>\r\n <div class=\"padded-top\"></div>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"visible: false\" data-bs-toggle=\"modal\" data-bs-target=\"#connection-setup-modal\">Manage DB Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: switchConnection, visible: canSwitchConnection\">Switch Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: editDataConnectionModal, hidden: canSwitchConnection\" data-bs-toggle=\"modal\" data-bs-target=\"#add-connection-modal\">Edit Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: newDataConnectionModal\" data-bs-toggle=\"modal\" data-bs-target=\"#add-connection-modal\">Add New Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: exportAll, visible: false\">Export Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: importStart, visible: false\">Import Connection</button>\r\n </div>\r\n <div data-bind=\"visible: importingFile\">\r\n <br />\r\n <div class=\"alert alert-info\">\r\n Please select a file you have previously exported from this utility. The system will load the screen with the Data Connection setting in the file, however, it will <b>NOT</b> be saved until you press the Save All button or Save individual tables\r\n <br />\r\n <div class=\"input-group\">\r\n <input type=\"file\" accept=\".json\" id=\"import-file\" data-bind=\"event: { change: function() { importFile($element.files[0]) } }\" />\r\n <span class=\"input-group-btn\">\r\n <button class=\"btn btn-link\" data-bind=\"click: importCancel\">Cancel</button>\r\n </span>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <br />\r\n <br />\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <b>Account Level Settings</b>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"with: settings\">\r\n <div class=\"row\">\r\n <div class=\"col-md-6\">\r\n <h6 class=\"mt-2 mb-2\">Admin Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useClientIdInAdmin\" data-bind=\"checked: useClientIdInAdmin\">\r\n <label class=\"form-check-label\" for=\"useClientIdInAdmin\">Use Client ID in Admin mode</label>\r\n <small class=\"text-muted d-block\">Enable this to respect client IDs even when in admin mode.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useSqlBuilderInAdminMode\" data-bind=\"checked: useSqlBuilderInAdminMode\">\r\n <label class=\"form-check-label\" for=\"useSqlBuilderInAdminMode\">Use SQL Builder in Admin Mode</label>\r\n <small class=\"text-muted d-block\">Allows SQL query builder access <b>only</b> in admin mode.</small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Customization</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useSqlCustomField\" data-bind=\"checked: useSqlCustomField\">\r\n <label class=\"form-check-label\" for=\"useSqlCustomField\">Use SQL in Custom Field</label>\r\n <small class=\"text-muted d-block\">Allows the use of SQL expressions in custom fields.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showDesignerHints\">\r\n <label class=\"form-check-label\">Show Designer Tips & Guidance</label>\r\n <small class=\"text-muted d-block\">Display contextual tips and explanations throughout the report designer to help users understand available options.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useAltPivot\">\r\n <label class=\"form-check-label\">Pivot with Drilldown</label>\r\n <small class=\"text-muted d-block\">Use alternate Pivot method that doesn\u2019t use SQL\u2019s PIVOT.<br>Allows drilldown, but may be slower.</small>\r\n </div>\r\n <div class=\"form-check\" data-bind=\"visible: isEnterprise\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useFunctions\">\r\n <label class=\"form-check-label\">Use Functions</label>\r\n <small class=\"text-muted d-block\">\r\n Enable calculated functions for List reports only.<br>\r\n Available for Enterprise license users.\r\n </small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Report Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"allowUsersToCreateReports\" data-bind=\"checked: allowUsersToCreateReports\">\r\n <label class=\"form-check-label\" for=\"allowUsersToCreateReports\">Allow All Users to Create Reports</label>\r\n <small class=\"text-muted d-block\">Permits users to generate and customize reports.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showImportExport\">\r\n <label class=\"form-check-label\">Allow All Users to export/import\u00A0reports</label>\r\n <small class=\"text-muted d-block\">\r\n Allow non admin users to export and import Reports in the system.\r\n </small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: canCopyReport\">\r\n <label class=\"form-check-label\">Always allow users to copy\u00A0reports</label>\r\n <small class=\"text-muted d-block\">\r\n Allow users with View Only access to copy Reports in the system.\r\n </small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showScheduling\">\r\n <label class=\"form-check-label\">Hide Report/Dashboard Scheduling</label>\r\n <small class=\"text-muted d-block\">\r\n Removes scheduling in reports and dashboard, select only if you don't want to use scheduling feature.\r\n </small>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <h6 class=\"mt-2 mb-2\">Folder Options</h6>\r\n <div class=\"form-check\" data-bind=\"visible: false\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"noFolders\" data-bind=\"checked: noFolders\">\r\n <label class=\"form-check-label\" for=\"noFolders\">No Folders</label>\r\n <small class=\"text-muted d-block\">Disables the use of folders in the application.</small>\r\n </div>\r\n <div class=\"form-check\" data-bind=\"visible: false\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"noDefaultFolder\" data-bind=\"checked: noDefaultFolder\">\r\n <label class=\"form-check-label\" for=\"noDefaultFolder\">No Default Folder</label>\r\n <small class=\"text-muted d-block\">Removes the Default folder.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showEmptyFolders\">\r\n <label class=\"form-check-label\">Show Empty Folders</label>\r\n <small class=\"text-muted d-block\">Will show empty folders for non admin users.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"allowUsersToManageFolders\" data-bind=\"checked: allowUsersToManageFolders\">\r\n <label class=\"form-check-label\" for=\"allowUsersToManageFolders\">Allow All Users to Manage Folders</label>\r\n <small class=\"text-muted d-block\">Grants permission to organize and manage folders without admin mode.</small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Export Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useAltPdf\">\r\n <label class=\"form-check-label\">PDF Export without Chromium</label>\r\n <small class=\"text-muted d-block\">Use alternate PDF export method that doesn\u2019t rely on Chromium.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: dontXmlExport\">\r\n <label class=\"form-check-label\">Hide XML Export option</label>\r\n <small class=\"text-muted d-block\">Remove XML Export option.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: dontWordExport\">\r\n <label class=\"form-check-label\">Hide Word Export option</label>\r\n <small class=\"text-muted d-block\">Remove Word Export option.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showPageSize\">\r\n <label class=\"form-check-label\">Show Page Size on PDF & Word export</label>\r\n <small class=\"text-muted d-block\">Display document dimensions in exported PDF & Word.</small>\r\n </div>\r\n\r\n <h6 class=\"mt-3 mb-2\">AI Assistant <span class=\"badge bg-warning text-dark\" style=\"font-size: 10px;\">BETA</span></h6>\r\n <div class=\"mb-2\">\r\n <div class=\"form-check form-switch\">\r\n <input class=\"form-check-input\" type=\"checkbox\" role=\"switch\" id=\"aiEnabledSwitch\"\r\n data-bind=\"checked: aiEnabled\">\r\n <label class=\"form-check-label\" for=\"aiEnabledSwitch\">Enable AI Report Assistant</label>\r\n </div>\r\n <small class=\"text-muted d-block\">When enabled, an AI-powered assistant will be available in the report designer to help build reports using natural language.</small>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mt-3\">\r\n <button type=\"button\" id=\"saveAppSettings\" class=\"btn btn-primary\" data-bind=\"click: saveAppSettings\">Save</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div role=\"tabpanel\" class=\"tab-pane active\" id=\"tablesfields\">\r\n <b data-bind=\"text: customTableMode() ? 'Custom Tables' : 'Database Tables'\"></b>\r\n <p>\r\n <span data-bind=\"visible: $root.customTableMode\">\r\n Define Custom Tables using SQL Select Query to use in Dotnet Report for Reporting and Analytics.\r\n </span>\r\n <span data-bind=\"hidden: $root.customTableMode\">\r\n Select Tables or Views from your Database to use in Dotnet Report for Reporting and Analytics.\r\n </span>\r\n </p>\r\n\r\n <div data-bind=\"with: Tables\">\r\n <input type=\"text\" class=\"form-control input-sm\" placeholder=\"Filter Tables...\" data-bind=\"value: tableFilter, valueUpdate: 'afterkeydown'\" style=\"float: left; width: 180px; margin-right: 5px;\">\r\n <button class=\"btn btn-outline-secondary btn-sm\" data-bind=\"click: clearTableFilter, visible: tableFilter()!='' && tableFilter()!=null\"><span class=\"fa fa-remove\"></span></button>\r\n <button class=\"btn btn-outline-secondary btn-sm\" data-bind=\"click: toggleShowAll, hidden: $root.customTableMode() || $root.onlyApi(), text: usedOnly() ? 'Show all' : 'Show used only'\">Show used only</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.customSql.addNewCustomSqlTable, visible: $root.customTableMode\">Add New Custom Table</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.loadFromDatabase, hidden: $root.customTableMode() || !$root.onlyApi()\">\r\n <span class=\"fa fa-database\"></span> Load all Database Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.visualizeJoins\"><span class=\"fa fa-arrows-h\"></span> Visualize Joins</button> \r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: function() { exportTablesJson(true) }, visible: $root.customTableMode\">\r\n <span class=\"fa fa-download\"></span> Export Custom Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: function() { exportTablesJson(false) }, visible: !$root.customTableMode()\">\r\n <span class=\"fa fa-download\"></span> Export Tables/Views\r\n </button>\r\n\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadTablesFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-file\"></span> Import Tables/Views\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" title=\"Manage Categories\" data-bs-toggle=\"modal\" data-bs-target=\"#category-modal\">\r\n <span class=\"fa fa-server\"></span> Manage Categories\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { selectAll(false)},visible: !$root.customTableMode()\">\r\n Select All Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { selectAll(true)}, visible: $root.customTableMode\">\r\n Select All Custom Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { unselectAll(false)},visible: !$root.customTableMode()\">\r\n UnSelect All Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { unselectAll(true)}, visible: $root.customTableMode\">\r\n UnSelect All Custom Tables \r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { $root.saveChanges($root.customTableMode()) }\">\r\n <span class=\"fa fa-floppy\"></span> Save All Tables\r\n </button>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n <hr />\r\n\r\n <div class=\"row\">\r\n <div class=\"col-12 col-md-4 col-lg-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n\r\n <div class=\"row\">\r\n <div data-bind=\"ifnot: $root.customTableMode\">\r\n <div class=\"alert alert-info\">\r\n <span data-bind=\"text: Tables.model().filter(t => !t.CustomTable()).length\"></span> Tables/Views\r\n <span data-bind=\"text: $root.onlyApi() ? 'configured and used' : 'read from database'\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"menu g-3\" data-bind=\"foreach: pagedTables\">\r\n <div class=\"menu-category card\">\r\n <div class=\"card-header clearfix\">\r\n <div class=\"checkbox float-start\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected\" title=\"Check to use in Dotnet Report, uncheck to Remove\">\r\n <span data-bind=\"text: TableName, attr: { title: TableName }, click: function() { $root.activeTable($data); }\" class=\"table-name-label\" style=\"cursor: pointer\"></span>\r\n <span data-bind=\"visible: SchemaName, text: SchemaName\" title=\"schema\" class=\"text-muted small\"></span>\r\n <span data-bind=\"visible: IsView\" class=\"label label-sm\">(view)</span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Table\" data-bind=\"click: function() { saveTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fas fa-save\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Preview this Table\" data-bind=\"click: function() { previewTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-table\"></i>\r\n </button>\r\n </div>\r\n <a class=\"float-end\" data-bind=\"click: function() { $root.activeTable($data); }\">\r\n <span class=\"fa fa-chevron-right\" style=\"cursor: pointer\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"row mt-3\">\r\n <div class=\"d-flex flex-column col-md-12\" data-bind=\"with: pager\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n <div class=\"text-muted small mt-0 pt-0\" style=\"padding-left: 3px\" data-bind=\"text: 'Total Records: ' + totalRecords()\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-12 col-md-8 col-lg-9\" id=\"tableDetails\">\r\n <div data-bind=\"visible: pagedTables().length === 0\">\r\n <br />\r\n <svg style=\"width:40px;float:left;transform:rotate(-45deg) translateY(6px);transform-origin:center center;\" fill=\"#000000\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" class=\"icon flat-line\"><g stroke-width=\"0\"></g><g stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke=\"#CCCCCC\" stroke-width=\"0.048\"></g><g><path d=\"M18,21A13.17,13.17,0,0,1,9,8.51V3\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></path><polyline points=\"12 6 9 3 6 6\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></polyline></g></svg>\r\n <div class=\"mt-3 fw-bold\" style=\"float:left; padding-left: 5px;\">No <span data-bind=\"visible: $root.customTableMode\">Custom </span> Tables added yet, click \"<span data-bind=\"text: customTableMode() ? 'Add New Custom Table' : 'Load All Tables'\"></span>\" to get started!</div>\r\n </div>\r\n\r\n <div data-bind=\"visible: !activeTable() && pagedTables().length > 0\">\r\n <br />\r\n <br />\r\n <svg style=\"width:40px;float:left;transform:rotate(-45deg) translateY(6px);transform-origin:center center;\" fill=\"#000000\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" class=\"icon flat-line\"><g stroke-width=\"0\"></g><g stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke=\"#CCCCCC\" stroke-width=\"0.048\"></g><g><path d=\"M18,21A13.17,13.17,0,0,1,9,8.51V3\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></path><polyline points=\"12 6 9 3 6 6\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></polyline></g></svg>\r\n <div class=\"mt-3 fw-bold\" style=\"float:left; padding-left: 5px;\">Select a <span data-bind=\"visible: $root.customTableMode\">Custom </span> Table, or \"<span data-bind=\"text: customTableMode() ? 'Add New Custom Table' : 'Load All Tables'\"></span>\"</div>\r\n </div>\r\n\r\n <div data-bind=\"with: activeTable\">\r\n <div class=\"card my-3\">\r\n <div class=\"card-header\">\r\n <h5>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected\" title=\"Check to use in Dotnet Report, uncheck to Remove\">\r\n <span data-bind=\"text: TableName\"></span>\r\n <span data-bind=\"visible: IsView\" class=\"label-sm\">(view)</span>\r\n </h5>\r\n <button class=\"btn btn-sm\" title=\"Save this Table\" data-bind=\"click: function() { saveTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fas fa-save\"></i> Save Changes\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Preview this Table\" data-bind=\"click: function() { previewTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-table\"></i> Preview Data\r\n </button>\r\n <button class=\"btn btn-sm btn-danger\" title=\"Delete this Table\" data-bind=\"click: function() { deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-trash\"></i> Remove Table\r\n </button>\r\n </div>\r\n <div class=\"card-body\">\r\n <p class=\"float-end\">\r\n <button class=\"btn btn-sm\" title=\"Manage Category\" data-bs-toggle=\"modal\" data-bs-target=\"#category-manage-modal\" data-bind=\"click: $root.selectedCategory\">\r\n <i class=\"fa fa-gear\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Export this Table\" data-bind=\"click: function() { exportTableJson(); }\">\r\n <i class=\"fa fa-file\"></i>\r\n </button>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Display Name</label><br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Schema Name</label><br />\r\n <span data-bind=\"editable: SchemaName\"></span>\r\n </p>\r\n <p style=\"display: none;\">\r\n <!-- deprecated -->\r\n <label class=\"label-sm\">Account Id Field</label><br />\r\n <span data-bind=\"editable: AccountIdField\"></span>\r\n </p>\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked: DoNotDisplay\">\r\n Do Not Display\r\n </label>\r\n </div>\r\n <div data-bind=\"if: CustomTable\">\r\n <button class=\"btn btn-sm btn-secondary\" data-bind=\"click: $root.customSql.viewCustomSql.bind($data)\">View Custom SQL</button>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center justify-content-end gap-2\">\r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: addNewColumn, visible: false\">\r\n <i class=\"fa fa-plus\"></i> Add Column\r\n </button>\r\n <label class=\"label-sm m-0\"><span data-bind=\"text: Columns().length\"></span> Columns</label>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: autoFormat, visible: Selected\">Auto Format</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: autoSort, visible: Selected\">Auto Sort</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: unselectAllColumns, visible: Selected\">Unselect All</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: selectAllColumns, visible: Selected\">Select All</button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"list-group\" data-bind=\"sortable: { data: Columns, options: { handle: '.sortable', cursor: 'move' }, afterMove: $root.Tables.columnSorted }\">\r\n <div class=\"list-group-item\">\r\n <div data-bind=\"if: $parent.DynamicColumns()\">\r\n <span data-bind=\"html: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n </div>\r\n <div class=\"checkbox\" data-bind=\"if: !$parent.DynamicColumns()\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected, enable: $parent.Selected()\">\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n <label data-bind=\"visible: PrimaryKey\" class=\"badge text-bg-primary\">Primary</label>\r\n <label data-bind=\"visible: ForeignKey\" class=\"badge text-bg-info text-white\">Foreign</label>\r\n <label class=\"badge text-bg-warning\" data-bind=\"visible: isNew\">New</label>\r\n </label>\r\n <button class=\"btn btn-sm float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#column-modal\" title=\"All column options\" data-bind=\"click: $root.selectColumn.bind($data, false)\">...</button>\r\n <div class=\"btn btn-sm float-end sortable\">\r\n <span class=\"fa fa-arrows\" aria-hidden=\"true\" title=\"Drag to reorder\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"relations\">\r\n <b>Relations</b>\r\n <p>\r\n Setup your Database Relations for Dotnet Report to produce dynamic queries\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: AddAllRelations\">Auto Add Joins</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: AddJoin\">Add new Join</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: SaveJoins\">Save Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: visualizeJoins\">Visualize Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: DeleteVisibleJoins\" title=\"Delete filtered Joins\">Delete Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: ExportJoins\" title=\"Export filtered Joins\">Export Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadJoinsFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-upload\"></span> Import Joins\r\n </button>\r\n <hr />\r\n <div id=\"form-joins\">\r\n <div class=\"alert alert-warning\" data-bind=\"visible: isDirty\">\r\n You have unsaved changes. Please be sure to click <b>Save Joins</b> to save your changes.\r\n </div>\r\n\r\n <div class=\"container-fluid\">\r\n <div class=\"row fw-bold bg-light border-bottom py-2\" data-bind=\"with: JoinFilters\">\r\n <!-- Repeat for each column header -->\r\n <div class=\"col-md-1\" style=\"max-width: 40px;\"></div>\r\n <div class=\"col-md-2\">\r\n Primary Table\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: primaryTable, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\" />\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: primaryField, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\" />\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1\">\r\n Join Type\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinType, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Join Table\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinTable, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinField, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\"></div>\r\n </div>\r\n\r\n <!-- New Join Row -->\r\n <div class=\"row bg-info bg-opacity-25 p-2\" data-bind=\"visible: showNewJoinRow\">\r\n <div class=\"col-md-1\" style=\"max-width: 40px;\"></div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: Tables.availableTables, optionsText: 'DisplayName', value: NewJoin().JoinTable, optionsCaption: 'Pick a table...'\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: NewJoin().JoinTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsCaption: 'Pick a field...', optionsValue: 'ColumnName', value: $root.NewJoin().FieldName\"></select>\r\n </div>\r\n <div class=\"col-md-1\">\r\n <select class=\"form-select\" data-bind=\"options: $root.JoinTypes, value: NewJoin().JoinType\"></select>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: NewJoin().OtherTables, optionsText: 'DisplayName', value: NewJoin().OtherTable, optionsCaption: 'Pick a table...'\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: NewJoin().OtherTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $root.NewJoin().JoinFieldName, optionsCaption: 'Pick a field...'\"></select>\r\n </div>\r\n <div class=\"col-md-2 text-end\">\r\n <button class=\"btn btn-success btn-sm\" data-bind=\"click: ConfirmAddJoin\">+ Add Join</button>\r\n </div>\r\n </div>\r\n\r\n <!-- Existing Join Rows with drag reorder -->\r\n <div data-bind=\"sortable: { data: reorderableJoins, options: { handle: '.join-drag-handle', cursor: 'move' }, afterMove: $root.joinSorted }\">\r\n <div class=\"row align-items-center border-bottom py-2\">\r\n <div class=\"col-md-1 text-center\" style=\"max-width: 40px;\">\r\n <span class=\"btn btn-sm btn-outline-secondary join-drag-handle\" title=\"Drag to reorder\"><i class=\"fa fa-bars\"></i></span>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: $root.Tables.availableTables, optionsText: 'DisplayName', value: JoinTable\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: JoinTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $parent.FieldName\"></select>\r\n </div>\r\n <div class=\"col-md-1\">\r\n <select class=\"form-select\" data-bind=\"options: $root.JoinTypes, value: JoinType\"></select>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: OtherTables, optionsText: 'DisplayName', value: OtherTable\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: OtherTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $parent.JoinFieldName\"></select>\r\n </div>\r\n <div class=\"col-md-2 text-end\">\r\n <span class=\"badge bg-warning text-dark me-2\"\r\n data-bind=\"visible: isNew\"\r\n data-bs-toggle=\"tooltip\"\r\n title=\"New record added or imported, not saved yet\">\r\n <i class=\"fa fa-warning\"></i> New\r\n </span>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"click: DeleteJoin\">Delete</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"row mt-3\"> \r\n <div class=\"d-flex flex-row align-items-center col-md-12\" data-bind=\"with: joinsPager\"> \r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n <div class=\"text-muted small mt-0 pt-0\" style=\"padding-left: 3px\" data-bind=\"text: 'Total Records: ' + totalRecords()\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <br />\r\n <br />\r\n </div>\r\n <div id=\"procedure\" class=\"tab-pane\">\r\n <b>Stored Procedures</b>\r\n <p>\r\n Select and manage Stored Procedures to use in Dotnet Report for more complex and coded Reports\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#procedure-modal\"><span class=\"fa fa-plus\"></span> Add Stored Procs from database</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadStoredProceduresFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-file\"></span> Import Stored Procedures\r\n </button>\r\n <hr />\r\n <div data-bind=\"if: Procedures.savedProcedures().length == 0\">\r\n <br />\r\n No Stored Procedures have been setup yet.\r\n </div>\r\n <div class=\"row\" data-bind=\"if: Procedures.savedProcedures().length > 0\">\r\n <!-- Left Panel for Stored Procedure Names -->\r\n <div class=\"col-12 col-md-4 col-lg-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n <div class=\"menu g-3\" data-bind=\"foreach: Procedures.savedProcedures\">\r\n <div class=\"menu-category card\">\r\n <div class=\"card-header clearfix\">\r\n <div class=\"float-start\">\r\n <label>\r\n <span data-bind=\"text: TableName, click: function() { $root.activeProcedure($data); }\" style=\"cursor: pointer\"></span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function() { $root.saveProcedure($data.TableName, false); }\">\r\n <span class=\"fa fa-save\"></span>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Delete this Procedure\" data-bind=\"click: function() { $data.deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <span class=\"fa fa-trash\"></span>\r\n </button>\r\n </div>\r\n <!-- Click to activate procedure -->\r\n <a class=\"float-end\" data-bind=\"click: function() { $root.activeProcedure($data); }\">\r\n <span class=\"fa fa-chevron-right\" style=\"cursor: pointer\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Right Panel for Stored Procedure Details -->\r\n <div class=\"col-12 col-md-8 col-lg-9\" id=\"procDetails\">\r\n <div data-bind=\"with: activeProcedure\">\r\n <div class=\"card my-3\">\r\n <div class=\"card-header\">\r\n <h5 data-bind=\"text: TableName\"></h5>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function() { $root.saveProcedure($data.TableName, false); }\">\r\n <span class=\"fa fa-save\"></span> Save Changes\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Delete this Procedure\" data-bind=\"click: function() { $data.deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <span class=\"fa fa-trash\"></span> Delete\r\n </button>\r\n </div>\r\n <div class=\"card-body\">\r\n <p class=\"float-end\">\r\n <button class=\"btn btn-sm\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Export this Procedure\" data-bind=\"click: function() { $root.exportProcedureJson($data.TableName); }\">\r\n <i class=\"fa fa-file\"></i>\r\n </button>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Display Name</label><br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Schema Name</label><br />\r\n <span data-bind=\"editable: SchemaName\"></span>\r\n </p>\r\n <label class=\"small\">Columns</label>\r\n <div class=\"list-group\" data-bind=\"foreach: Columns\">\r\n <div class=\"list-group-item\">\r\n <label>\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n </label>\r\n <button class=\"btn btn-sm float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#column-modal\" title=\"All column options\" data-bind=\"click: $root.selectColumn.bind($data, true)\">...</button>\r\n </div>\r\n </div>\r\n <label class=\"small\">Parameters</label>\r\n <div class=\"list-group\" data-bind=\"foreach: Parameters\">\r\n <div class=\"list-group-item\">\r\n <label>\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ParameterName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: ParameterDataTypeString\"></span>\r\n \r\n <button class=\"btn btn-sm btn-primary float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#parameter-modal\" title=\"All Parameter options\" data-bind=\"click: $root.editParameter\">...</button>\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div id=\"manageaccess\" class=\"tab-pane\">\r\n <ul class=\"nav nav-tabs\" id=\"accessTabs\" role=\"tablist\">\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link active\" id=\"reports-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#reportsAccess\" type=\"button\" role=\"tab\">Reports Access</button>\r\n </li>\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link\" id=\"folders-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#foldersAccess\" type=\"button\" role=\"tab\">Folders Access</button>\r\n </li>\r\n </ul>\r\n <div class=\"tab-content mt-3\">\r\n <div class=\"tab-pane fade show active\" id=\"reportsAccess\" role=\"tabpanel\" aria-labelledby=\"reports-tab\">\r\n <b>Reports Access</b>\r\n <p>You can setup access to individual Reports here</p>\r\n <div class=\"mb-2 d-flex gap-2\">\r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { exportFoldersReportJson() }\">\r\n <span class=\"fa fa-download\"></span> Export Selected Reports\r\n </button>\r\n </div> \r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadFileModal\">\r\n <span class=\"fa fa-upload\"></span> Import Reports\r\n </button>\r\n </div>\r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#searchModal\">\r\n <span class=\"fa fa-tasks\"></span> Bulk Actions\r\n </button>\r\n </div>\r\n </div>\r\n <hr />\r\n <div data-bind=\"foreach: reportsAndFolders\" class=\"list-group\">\r\n <div class=\"list-group-item\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <input type=\"checkbox\" class=\"form-check-input\"\r\n data-bind=\"checked: allReportsSelected\">\r\n <label>\r\n <a data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folder-' + folderId }\">\r\n <i class=\"fa fa-folder\"></i> <span data-bind=\"text: folder\"></span>\r\n </a>\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"collapse\" data-bind=\"attr: {id: 'folder-' + folderId }\">\r\n <div data-bind=\"if: reports.length == 0\">\r\n No Reports found in this folder\r\n </div>\r\n <ul class=\"list-group\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\">\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input\" type=\"checkbox\" data-bind=\"checked: isSelected\" />\r\n <label class=\"list-group-item-heading\">\r\n <span class=\"fa\" data-bind=\"css: {'fa-file': reportType=='List', 'fa-th-list': reportType=='Summary', 'fa-bar-chart': reportType=='Bar', 'fa-pie-chart': reportType=='Pie', 'fa-line-chart': reportType=='Line', 'fa-globe': reportType =='Map'}\" style=\"font-size: 14pt; color: #808080\"></span>\r\n <span data-bind=\"text: reportName\"></span>\r\n </label>\r\n </div>\r\n <p class=\"list-group-item-text small\" data-bind=\"text: reportDescription\"></p>\r\n <div class=\"small\" style=\"padding-top: 10px;\">\r\n <b>Current Report Access</b><br />\r\n Manage by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: userId() ? userId() : 'Any User'\"></span><br />\r\n View only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: (viewOnlyUserId() ? viewOnlyUserId() : (userId() ? userId() : 'Any User'))\"></span><br />\r\n <div data-bind=\"if: deleteOnlyUserId()\">\r\n Delete only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserId()\"></span><br />\r\n </div>\r\n <div data-bind=\"if: userRole()\">\r\n Manage by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: userRole() ? userRole() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: viewOnlyUserRole()\">\r\n View only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: viewOnlyUserRole() ? viewOnlyUserRole() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: deleteOnlyUserRole()\">\r\n Delete only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserRole() ? deleteOnlyUserRole() : 'Same as Manage'\"></span><br />\r\n </div>\r\n <div>\r\n For Client <span class=\"badge text-bg-info text-white\" data-bind=\"text: clientId() ? clientId() : 'All Clients'\"></span><br />\r\n </div>\r\n </div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeAccess(!changeAccess())}, text: !changeAccess() ? 'Change Access': 'Cancel Changing Access', hidden: changeAccess\">Change Access</button>\r\n </div>\r\n <div data-bind=\"if: changeAccess\" class=\"col-md-9\">\r\n <div style=\"padding-left: 10px;\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: saveAccessChanges\">Save Access Changes</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeAccess(!changeAccess())}, text: !changeAccess() ? 'Change Access': 'Cancel Changing Access'\">Change Access</button>\r\n </div>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"tab-pane fade\" id=\"foldersAccess\" role=\"tabpanel\" aria-labelledby=\"folders-tab\">\r\n <b>Folders Access</b>\r\n <p>You can setup access to individual Folders here</p>\r\n <hr />\r\n <div data-bind=\"foreach: Folders\" class=\"list-group\">\r\n <div class=\"list-group-item\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <a data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folderAccess-' + Id }\">\r\n <i class=\"fa fa-folder\"></i> <span data-bind=\"text: FolderName\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n <div class=\"collapse\" data-bind=\"attr: {id: 'folderAccess-' + Id }\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\">\r\n <div class=\"small\" style=\"padding-top: 10px;\">\r\n <b>Current Folder Access</b><br />\r\n Manage by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserId()? UserId() : 'Any User'\"></span><br />\r\n View only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: (ViewOnlyUserId() ? ViewOnlyUserId() : (UserId() ? UserId() : 'Any User'))\"></span><br />\r\n <div data-bind=\"if: DeleteOnlyUserId()\">\r\n Delete only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: DeleteOnlyUserId()\"></span><br />\r\n </div>\r\n <div data-bind=\"if: UserRoles()\">\r\n Manage by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserRoles() ? UserRoles() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: ViewOnlyUserRoles()\">\r\n View only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: ViewOnlyUserRoles() ? ViewOnlyUserRoles() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: DeleteOnlyUserRoles()\">\r\n Delete only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: DeleteOnlyUserRoles() ? DeleteOnlyUserRoles() : 'Same as Manage'\"></span><br />\r\n </div>\r\n <div>\r\n For Client <span class=\"badge text-bg-info text-white\" data-bind=\"text: ClientId() ? ClientId() : 'All Clients'\"></span><br />\r\n </div>\r\n </div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeFolderAccess(!changeFolderAccess())}, text: !changeFolderAccess() ? 'Change Access': 'Cancel Changing Access', hidden: changeFolderAccess\">Change Access</button>\r\n </div>\r\n <div data-bind=\"if: changeFolderAccess\" class=\"col-md-9\">\r\n <div style=\"padding-left: 10px;\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: saveFolderAccessChanges\">Save Access Changes</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeFolderAccess(!changeFolderAccess())}, text: !changeFolderAccess() ? 'Change Access': 'Cancel Changing Access'\">Change Access</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"functions\" data-bind=\"with: Functions\">\r\n <b>Custom Functions</b>\r\n <p>\r\n Create and manage Custom Function that you can use in building Reports and Dashboards\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"visible: $root.settings.canAddFunction,click: createNewFunction\">Add new Function</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: buildCustomFunctions\">Rebuild Functions Library</button>\r\n <br />\r\n <hr />\r\n\r\n <div class=\"container-fluid\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n <input id=\"searchInput\" class=\"form-control mb-2\" type=\"text\" placeholder=\"Search...\" data-bind=\"value: search, valueUpdate: 'input', visible: functions().length > 0\">\r\n <ul class=\"list-group\" data-bind=\"foreach: filteredFunctions\">\r\n <li class=\"list-group-item d-flex justify-content-between align-items-center\">\r\n <span data-bind=\"text: name\"></span>\r\n <div>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: $parent.selectFunction\">Edit</button>\r\n <button class=\"btn btn-danger btn-sm\" data-bind=\"click: function() { $parent.deleteFunction($data) }\">Delete</button>\r\n </div>\r\n </li>\r\n </ul>\r\n <div data-bind=\"if: functions().length == 0\">\r\n No Functions found\r\n </div>\r\n </div>\r\n <div class=\"col-md-9\" data-bind=\"with: selectedFunction\">\r\n <div style=\"padding-left: 10px;\">\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <b>Setup Function</b>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"mb-3\" data-bind=\"validationElement: functionName\">\r\n <label for=\"functionName\" class=\"form-label\">Function Name</label>\r\n <input id=\"functionName\" class=\"form-control\" required data-bind=\"value: name, valueUpdate: 'input'\" />\r\n <div class=\"invalid-feedback\">Function Name is required.</div>\r\n </div>\r\n <div class=\"mb-3\">\r\n <label for=\"functionType\" class=\"form-label\">Function Type</label>\r\n <select id=\"functionType\" class=\"form-control\" data-bind=\"value: functionType, event: { change: $parent.updateCodeEditorMode }\">\r\n <option value=\"csharp\">C#</option>\r\n <!--<option value=\"javascript\">JavaScript</option>\r\n <option value=\"sql\">SQL</option>-->\r\n </select>\r\n </div>\r\n <div class=\"mb-3\">\r\n <label for=\"functionDescription\" class=\"form-label\">Description</label>\r\n <textarea id=\"functionDescription\" class=\"form-control\" data-bind=\"value: description, valueUpdate: 'input'\" placeholder=\"Add any helpful description here for the user...\"></textarea>\r\n </div>\r\n\r\n <div>\r\n <b>Arguments</b>\r\n <table class=\"table table-bordered\">\r\n <thead>\r\n <tr>\r\n <th></th>\r\n <th>Name</th>\r\n <th>Description</th>\r\n <!--<th>Data Type</th>-->\r\n <th>Optional</th>\r\n <th></th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: parameters, tableSortable: { data: parameters, placeholder: 'sortable-placeholder' }\" >\r\n <tr>\r\n <td> <span class=\"fa fa-ellipsis-v\" aria-hidden=\"true\" title=\"Drag to reorder\"></span></td>\r\n <td>\r\n <input class=\"form-control\" data-bind=\"value: parameterName, valueUpdate: 'input'\" />\r\n <span class=\"text-danger\" data-bind=\"visible: name.hasError, text: name.validationMessage\"></span>\r\n </td>\r\n <td><input class=\"form-control\" data-bind=\"value: description, valueUpdate: 'input'\" placeholder=\"Friendly description for user...\" /></td>\r\n <!--<td>\r\n <select class=\"form-select\" data-bind=\"value: datatype\">\r\n <option>object</option>\r\n <option>string</option>\r\n <option>int</option>\r\n <option>float</option>\r\n <option>bool</option>\r\n </select>\r\n </td>-->\r\n <td> <input type=\"checkbox\" data-bind=\"checked: required, checkedValue: false, uncheckedValue: true\" /></td>\r\n <td><button class=\"btn btn-sm btn-danger\" data-bind=\"click: $parent.removeParameter\">Remove</button></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: addParameter\">Add Argument</button>\r\n </div>\r\n <br />\r\n <div class=\"mb-3\">\r\n <label for=\"codeEditor\" class=\"form-label\">Write the <b>Code</b> for the function below:</label>\r\n <div style=\"border: 1px solid\">\r\n <textarea id=\"codeEditor\" class=\"code-editor form-control\" data-bind=\"value: code\"></textarea>\r\n </div>\r\n </div>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $parent.saveFunction\">Save</button>\r\n <button class=\"btn btn-secondary\" data-bind=\"click: $parent.cancelEdit\">Cancel</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"schedules\">\r\n <b>Scheduled Reports</b>\r\n <p>\r\n View Schedules setup for sending Reports and Dashboards\r\n </p>\r\n <hr />\r\n\r\n <div class=\"row\">\r\n <div class=\"col-md-12\">\r\n <div data-bind=\"visible: schedules().length === 0\">\r\n <i class=\"fa fa-exclamation-circle\"></i> No scheduled Reports or Dashboards available.\r\n </div>\r\n <div class=\"container-fluid\" data-bind=\"if: schedules().length > 0\">\r\n <div data-bind=\"foreach: schedules\">\r\n <div class=\"row border-bottom py-2\">\r\n <div class=\"col-12\">\r\n For <span class=\"text-muted\" data-bind=\"text: DashboardId === 0 ? 'Report' : 'Dashboard'\"></span>\r\n <b><span data-bind=\"text: Name\"></span></b>\r\n </div>\r\n </div>\r\n\r\n <!-- Inner schedule items -->\r\n <div class=\"row fw-bold bg-light py-2 d-none d-md-flex\">\r\n <div class=\"col-md\"><i class=\"fa fa-clock\"></i> Schedule</div>\r\n <div class=\"col-md\"><i class=\"fa fa-envelope\"></i> Email To</div>\r\n <div class=\"col-md\"><i class=\"fa fa-file\"></i> Format</div>\r\n <div class=\"col-md\"><i class=\"fa fa-history\"></i> Last Run</div>\r\n <div class=\"col-md\"><i class=\"fa fa-user\"></i> User ID</div>\r\n <div class=\"col-md\"><i class=\"fa fa-globe\"></i> Time Zone</div>\r\n <div class=\"col-md\"><i class=\"fa fa-cogs\"></i> Actions</div>\r\n </div>\r\n\r\n <div data-bind=\"foreach: { data: Schedules, as: 'item' }\">\r\n <div class=\"row border-bottom py-2 align-items-center\">\r\n <div class=\"col-md\" data-bind=\"text: item.ScheduleDisplay\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.EmailTo\"></div>\r\n <div class=\"col-md\"\r\n data-bind=\"if: item.Format && item.Format.trim().substring(0,1) === '{'\">\r\n <div data-bind=\"html: item.Format.slice(1,-1).split(',').join('<br>')\"></div>\r\n </div>\r\n <div class=\"col-md\"\r\n data-bind=\"if: !item.Format || item.Format.trim().substring(0,1) !== '{'\">\r\n <div data-bind=\"text: item.Format\"></div>\r\n </div>\r\n <div class=\"col-md\" data-bind=\"text: item.LastRun\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.UserId ? item.UserId : 'N/A'\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.Timezone ? item.Timezone : 'N/A'\"></div>\r\n <div class=\"col-md\">\r\n <button class=\"btn btn-sm btn-danger\" data-bind=\"click: $root.deleteSchedule\">\r\n <i class=\"fa fa-trash\"></i> Delete\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Modal -->\r\n<div class=\"modal\" id=\"column-modal\" role=\"dialog\" tabindex=\"-1\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editColumn()\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"myModalLabel\">\r\n Manage\r\n <label data-bind=\"text: ColumnName\"></label>\r\n </h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose options that will determine how users interact with this column on Reports</p>\r\n <div class=\"form-horizontal\">\r\n\r\n <ul class=\"nav nav-tabs\" role=\"tablist\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link active\" href=\"#column-main\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\">Main Options</a></li>\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link\" href=\"#column-foreign\" aria-controls=\"profile\" role=\"tab\" data-bs-toggle=\"tab\">Foreign Key Options</a></li>\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link\" href=\"#column-filter\" aria-controls=\"procedure\" role=\"tab\" data-bs-toggle=\"tab\">Filter Options</a></li>\r\n </ul>\r\n <div class=\"tab-content\">\r\n <br />\r\n <div role=\"tabpanel\" class=\"tab-pane active\" id=\"column-main\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Display_Name\" data-bind=\"attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">Display Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" id=\"DisplayName\" name=\"DisplayName\" type=\"text\" value=\"First Name\" data-bind=\"value: DisplayName, attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is a friendly name to display to your users\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Field_Type\" data-bind=\"\">Field Type</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"FieldType_SelectedId\" name=\"FieldType.SelectedId\" data-bind=\"value: FieldType\">\r\n <option value=\"Boolean\">Boolean</option>\r\n <option value=\"DateTime\">Date Time</option>\r\n <option value=\"Varchar\">Varchar</option>\r\n <option value=\"Money\">Money</option>\r\n <option value=\"Int\">Int</option>\r\n <option value=\"Double\">Double</option>\r\n <option value=\"Json\">Json</option>\r\n <option value=\"Date\">Date Only</option>\r\n <option value=\"Time\">Time Only</option>\r\n <option value=\"Percentage\">Percentage</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"FieldType\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Primary_Key\" data-bind=\"\">Primary Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" data-val-required=\"The PrimaryKey field is required.\" id=\"PrimaryKey\" name=\"PrimaryKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:PrimaryKey\"><input name=\"PrimaryKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"PrimaryKey\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Do Not Display</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:DoNotDisplay\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the column will not be displayed on Report Designer, but can still be used on Global Data Filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control-group\" data-bind=\"if: FieldType() == 'Json'\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">JSON Data Structure</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <textarea class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" data-bind=\"value: JsonStructure, attr:{placeholder:'Please paste in Sample Json with all columns for this JSON data field'}\" rows=\"5\"></textarea>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"You can paste in a sample Json blob with all the columns you want to use in this field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"column-filter\">\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Require Filter if Column is selected</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForceFilter\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the column will always require the user to pick a filtered value\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Require Filter if Table is selected</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForceFilterForTable\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the report will always require the user to pick a filter value if user picks the column in report\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: FieldType() == 'DateTime'\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Restrict Filter Date Range</label>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked: restrictDateRangeFilter\" />\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\" data-bind=\"if: restrictDateRangeFilter\">\r\n <input class=\"form-control\" type=\"number\" data-bind=\"value: restrictDateRangeNumber\" />\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\" data-bind=\"if: restrictDateRangeFilter\">\r\n <select class=\"form-select\" data-bind=\"value: restrictDateRangeValue\">\r\n <option value=\"Days\">Day(s)</option>\r\n <option value=\"Months\">Month(s)</option>\r\n <option value=\"Years\">Year(s)</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is selected, user will not be able to pick date range larger than this selection\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"column-foreign\">\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Foreign Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" data-val-required=\"The ForeignKey field is required.\" id=\"ForeignKey\" name=\"ForeignKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForeignKey\"><input name=\"ForeignKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys allows friendly selection in Filters using a Dropdown List\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Foreign Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: JoinTable, visible:ForeignKey(), options: $root.Tables.availableTables, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" style=\"display: none;\">Foreign Join</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignJoin_SelectedId\" name=\"ForeignJoin.SelectedId\" data-bind=\"value: ForeignJoin, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" style=\"display: none;\">\r\n <option selected=\"selected\" value=\"Inner\">Inner</option>\r\n <option value=\"Left\">Left</option>\r\n <option value=\"Right\">Right</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignJoin\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeId'}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\">Foreign Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignKeyField\" name=\"ForeignKeyField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignKeyField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Key field is a Column from the Foreign table which is used as the Key field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeName'}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\">Foreign Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignValueField\" name=\"ForeignValueField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignValueField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Value field is a Column from the Foreign table which is used to display the value to the User in the Report Designer\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: ForeignKey\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Only for Filter?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignFilterOnly\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Check this option if you would like to use this for Filtering only, and not for SQL Joins\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"alert alert-info\">\r\n You can setup a cascading filter by setting up a parent for the foreign key below\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Setup Foreign Key Parent?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignParentKey\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys parent allows cascading dropdown selection in Filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignParentKey(), attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Parent Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: ForeignJoinTable, visible:ForeignParentKey(), options: $root.Tables.model, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignJoinTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeId'}\">Parent Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: ForeignJoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentKeyField, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeId\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Parent Key field is a Column from the Parent table which is used as the key in cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeName'}\">Parent Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: ForeignJoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentValueField, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeName\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Parent Value field is a Column from the Parent table which is used to display the value to the User in the Report Designer for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeName'}\">Foreign Key Filter Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentApplyTo, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeName\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign Key Filter Value field is a Column from the Foreign table where the selected parent filter will be applied for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <!--<div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Require Foreign Key Parent?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignParentRequired\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys parent can be optional or set to required for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>-->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>Manage Role Access\r\n </button>\r\n @* <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\" data-bind=\"click: function(){$root.saveColumn()}\">Done</button> *@\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"modal\" id=\"joinModal\" tabindex=\"-1\" role=\"dialog\">\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Joins Diagram</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\" style=\"max-height:800px;overflow:auto;\">\r\n <div id=\"joinDiagram\" style=\"width:2000px;height:1200px;position:relative;border:1px solid #ccc;\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"modal\" id=\"procedure-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content \">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Add Stored Proc</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"row\">\r\n <label class=\"col-md-2 control-label\">\r\n Search for\r\n </label>\r\n <div class=\"col-md-6\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: searchProcedureTerm\" placeholder=\"Search stored procedures by name\" />\r\n </div>\r\n <div class=\"col-md-2\">\r\n <button class=\"btn btn-primary\" data-bind=\"click: searchStoredProcedure\">Search</button>\r\n </div>\r\n </div>\r\n <br />\r\n <div class=\"menu g-3\" style=\"margin-left: 20px;\" data-bind=\"foreach: foundProcedures\">\r\n <div class=\"menu-category card\" style=\"float:left\">\r\n <div class=\"card-header clearfix\" style=\"\">\r\n <div class=\"float-start\">\r\n <label>\r\n <span data-bind=\"text: TableName\"></span>\r\n <span class=\"label-xs\">Procedure</span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function(){$root.saveProcedure($data.TableName, true);}\">\r\n <span class=\"fa fa-save\"></span>\r\n </button>\r\n </div>\r\n <a class=\"float-end\" data-bs-toggle=\"collapse\" data-bind=\"attr: {'data-bs-target': '#sp_'+$index()}\">\r\n <span class=\"fa fa-chevron-down\"></span>\r\n </a>\r\n </div>\r\n <div data-bind=\"attr: {id: 'sp_'+$index()}\" class=\"panel-collapse collapse in\">\r\n <div class=\"card-body\">\r\n Display Name<br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <label class=\"small\">Columns</label>\r\n\r\n <div class=\"list-group\" data-bind=\"foreach: Columns\">\r\n <div class=\"list-group-item\">\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n </div>\r\n </div>\r\n <label class=\"small\">Parameters</label>\r\n\r\n <div class=\"list-group\" data-bind=\"foreach: Parameters\">\r\n <div class=\"list-group-item\">\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: ParameterDataTypeString\"></span><br />\r\n Default Value: <span data-bind=\"editable: ParameterValue\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-primary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"parameter-modal\" role=\"dialog\" tabindex=\"-1\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editParameter()\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"myModalLabel\">\r\n Manage\r\n <label data-bind=\"text: ParameterName\"></label>\r\n </h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose options that will determine how users interact with this parameter on Reports</p>\r\n <div class=\"form-horizontal\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">Display Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" name=\"DisplayName\" type=\"text\" value=\"First Name\" data-bind=\"value: DisplayName, attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is a friendly name to display to your users\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Default Value</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <span data-bind=\"editable: ParameterValue\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Hidden Parameter</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked: Hidden, enable: ParameterValue\">\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Required</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:Required\">\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Use Lookup Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" name=\"ForeignKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForeignKey\"><input name=\"ForeignKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Using lookup table allows friendly selection in report using a Dropdown List\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Lookup Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: JoinTable, visible:ForeignKey(), options: $root.Procedures.tables, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeId'}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\">Lookup Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" name=\"ForeignKeyField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignKeyField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Key field is a Column from the Foreign table which is used as the Key field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeName'}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\">Lookup Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" name=\"ForeignValueField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignValueField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Lookup Value field is a Column from the Lookup table which is used to display the value to the User in the Report Designer\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n <div class=\"modal\" id=\"role-access-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editAllowedRoles\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Manage Access by Roles</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose User Roles that will have Access</p>\r\n <p class=\"small\">Note: All Users will have access if no restricted roles are setup</p>\r\n <div data-bind=\"if: $root.allRoles().length === 0\">\r\n <div class=\"alert alert-warning\">\r\n <strong>No roles available.</strong> Please add roles first.\r\n </div>\r\n </div>\r\n <div data-bind=\"if: $root.allRoles().length > 0\">\r\n <div class=\"list-group\" data-bind=\"foreach: $root.allRoles\">\r\n <div class=\"list-group-item\" style=\"padding: 2px 10px;\">\r\n <label>\r\n <input type=\"checkbox\"\r\n data-bind=\"value: $data,\r\n checked: $root.editAllowedRoles().AllowedRoles\" />\r\n <span data-bind=\"text: $data\"></span>\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal\" id=\"category-manage-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: manageCategories\">\r\n <div class=\"modal-header\">\r\n <b class=\"modal-title\">Manage Categories for <span data-bind=\"text: TableName\"></span></b>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div data-bind=\"visble: $root.Categories().lenth == 0\">\r\n No categories have been set up yet.\r\n </div>\r\n <div class=\"list-group\" data-bind=\"foreach: $root.Categories\">\r\n <div class=\"checkbox list-group-item\" style=\"padding-top: 2px; padding-bottom: 2px;\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: $parent.Categories, checkedValue: $data\" />\r\n <span data-bind=\"text: Name\"></span> <!-- Display category name -->\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n<div class=\"modal\" id=\"category-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <b class=\"modal-title\">Manage Categories</b>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>\r\n You can organize the display of tables in the Report Designer by assigning categories here.\r\n </p>\r\n <!-- Table for Categories -->\r\n <table class=\"table table-bordered\">\r\n <thead>\r\n <tr>\r\n <th>Category Name</th>\r\n <th>Description</th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: $root.Categories\">\r\n <tr>\r\n <td>\r\n <input type=\"text\" data-bind=\"value: Name, visible: $root.editingCategoryIndex() === $index()\" class=\"form-control\" />\r\n <span id=\"cat-name\" data-bind=\"text: Name, visible: $root.editingCategoryIndex() !== $index(), attr: { id: Id ? 'cat-name-' + Id :undefined }\" style=\"color: #6c757d;\"></span>\r\n </td>\r\n <td>\r\n <input type=\"text\" data-bind=\"value: Description, visible: $root.editingCategoryIndex() === $index()\" class=\"form-control\" />\r\n <span id=\"cat-desc\" data-bind=\"text: Description, visible: $root.editingCategoryIndex() !== $index(), attr: { id: Id ? 'cat-desc-' + Id :undefined }\" style=\"color: #6c757d;\"></span>\r\n </td>\r\n <td class=\"d-flex\">\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"visible: $root.editingCategoryIndex() !== $index() && Id !== 0, click: function() { $root.toggleEdit($index()) }\">\r\n <i class=\"fa fa-edit\"></i>\r\n </button>\r\n <button class=\"btn btn-success btn-sm\" data-bind=\"visible: $root.editingCategoryIndex() === $index() && Id !== 0, click: function() { $root.saveCategory($index()) }\" style=\"margin-left: 5px;\">\r\n <i class=\"fa fa-save\"></i>\r\n </button>\r\n <button class=\"btn btn-danger btn-sm\" data-bind=\"click: $root.removeCategory\">\r\n <i class=\"fa fa-trash\"></i>\r\n </button>\r\n </td>\r\n </tr>\r\n </tbody>\r\n <tfoot>\r\n <tr>\r\n <td>\r\n <input class=\"form-control\" type=\"text\" data-bind=\"value: $root.newCategoryName\" placeholder=\"Category Name\">\r\n </td>\r\n <td>\r\n <input class=\"form-control\" type=\"text\" data-bind=\"value: $root.newCategoryDescription\" placeholder=\"Description\">\r\n </td>\r\n <td>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: $root.addCategory\">Add</button>\r\n </td>\r\n </tr>\r\n </tfoot>\r\n </table>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: $root.saveCategories\">Save</button>\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"clearfix\"></div>\r\n\r\n<div class=\"modal\" id=\"add-connection-modal\" role=\"dialog\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: newDataConnection\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\"><span data-bind=\"text: $root.editingDataConnection() ? 'Edit' : 'Add a new'\"></span> Data Connection</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose User Roles that will have Access</p>\r\n <p class=\"small\">Note: All Users will have access if no restricted roles are setup</p>\r\n\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Connection Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box\" data-val=\"true\" data-val-required=\"Connection Name is required.\" type=\"text\" data-bind=\"value: Name\" placeholder=\"\" id=\"add-conn-name\">\r\n </div>\r\n </div>\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Connection Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box\" data-val=\"true\" data-val-required=\"Connection Key is required.\" type=\"text\" data-bind=\"value: ConnectionKey\" placeholder=\"\" id=\"add-conn-key\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is the Connection Key in your application settings for your SQL Connection String\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\" data-bind=\"visible: $root.editingDataConnection\">\r\n <div class=\"check-box col-md-9 col-sm-9\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseSchema\">\r\n Use Schema\r\n </label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Use Schema in SQL when building query\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 col-form-label\">Database Type</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: DatabaseType\" required>\r\n <option>MS SQL</option>\r\n <option>MySql</option>\r\n <option>PostgreSQL</option>\r\n <option>Oracle</option>\r\n <option value=\"OleDB\">OleDB/Others</option>\r\n </select>\r\n </div>\r\n </div>\r\n\r\n <div class=\"form-group row\" data-bind=\"hidden: $root.editingDataConnection\">\r\n <div class=\"check-box col-md-12\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: copySchema\">\r\n Copy Schema from existing Connection\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\" data-bind=\"visible: copySchema\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Choose Connection</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" style=\"max-width: 300px;\" data-bind=\"options: $root.DataConnections, optionsText: 'DataConnectName', optionsValue: 'DataConnectGuid', value: copyFrom\"></select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bind=\"click: $root.updateDataConnection, visible: $root.editingDataConnection()\">Update</button>\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bind=\"click: $root.addDataConnection, visible: !$root.editingDataConnection()\">Create</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"clearfix\"></div>\r\n\r\n<div class=\"modal\" id=\"data-preview-modal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\">\r\n <div class=\"modal-content\" data-bind=\"with: previewData\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Preview Table</h4>\r\n <button type=\"button\" class=\"btn-close float-end\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div style=\"overflow-x: auto; max-height: 500px; overflow-y: auto;\">\r\n <table class=\"table table-striped table-hover table-condensed\">\r\n <thead style=\"position: sticky; top: -1px; z-index: 2; background-color: #f8f9fa;\">\r\n <tr data-bind=\"foreach: Columns\">\r\n <th>\r\n <span data-bind=\"text: ColumnName, attr: { title: DataType.replace('System.', '') }\"></span>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: Rows\">\r\n <tr data-bind=\"foreach: Items\">\r\n <td>\r\n <span data-bind=\"html: FormattedValue\"></span>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"custom-sql-modal\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"myModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\" data-bind=\"with: customSql\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Enter Select SQL for your Data</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"form-group\" data-bind=\"validationElement: customTableName\">\r\n <label for=\"custom-table-name\">Custom Table Name</label>\r\n <input type=\"text\" class=\"form-control\" name=\"customTableName\" placeholder=\"Enter table name\" data-bind=\"textInput: customTableName\" required>\r\n <div class=\"invalid-feedback\">Custom Table Name is required.</div>\r\n </div>\r\n <div data-bind=\"visible: useAi\">\r\n <p id=\"query-input\" class=\"query-input\">\r\n Show me \r\n </p>\r\n <button data-bind=\"click: buildSqlUsingAi\" class=\"btn btn-primary btn-sm\">Process with ChatGPT</button>\r\n <button data-bind=\"click: textQuery.resetQuery\" class=\"btn btn-secondary btn-sm\">Start over</button>\r\n <hr />\r\n </div>\r\n\r\n <div class=\"form-group\" data-bind=\"validationElement: customSql\">\r\n <label for=\"custom-sql\">Custom SQL</label> |\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: dynamicColumns\">\r\n <span title=\"Setup a table that returns dynamic columns to pick from\">Table with Dynamic Columns</span>\r\n </label> |\r\n <a href=\"#\" data-bind=\"click: beautifySql\">Beautify Sql</a>\r\n <textarea class=\"form-control\" style=\"height: 240px;\" name=\"customSql\" data-bind=\"textInput: customSql\" required></textarea>\r\n <div class=\"invalid-feedback\">Custom SQL is required.</div>\r\n\r\n <div data-bind=\"if: dynamicColumns\">\r\n <label>Add SQL code to use the dynamic column</label>\r\n <textarea class=\"form-control\" style=\"height: 240px;\" name=\"columnTranslation\" data-bind=\"textInput: columnTranslation\" required></textarea>\r\n <label>Pick Values Table</label>\r\n <select class=\"form-select input-medium\" data-bind=\"options: $root.Tables.availableTables, optionsText: 'DisplayName', optionsValue: 'Id', optionsCaption: 'Choose Values Table...', value: dynamicValuesTableId\"></select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: executeSql\">Save changes</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Tables/Views Json File Modal -->\r\n<div class=\"modal\" id=\"uploadTablesFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadTablesFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageTablesJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadTablesFileModalLabel\">Import Tables/Views (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerTablesFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"tablesFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleTablesFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Tables/Views File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadTablesFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Joins Json File Modal -->\r\n<div class=\"modal\" id=\"uploadJoinsFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadJoinsFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJoinsJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadJoinsFileModalLabel\">Import Joins (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerJoinsFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"joinsFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleJoinsFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Joins File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadJoinsFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<!-- Import StoredProcedures Json File Modal -->\r\n<div class=\"modal\" id=\"uploadStoredProceduresFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadStoredProceduresFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageStoredProceduresJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadStoredProceduresFileModalLabel\">Import Stored Procedures (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerStoredProceduresFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"storedProceduresFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleStoredProceduresFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Stored Procedures File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadStoredProceduresFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"modal\" id=\"searchModal\" tabindex=\"-1\" aria-hidden=\"true\" data-bind=\"with: $root\">\r\n <div class=\"modal-dialog modal-xl modal-dialog-scrollable\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Bulk Manage Reports Access and Export</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"d-flex gap-2 mb-4 align-items-center\">\r\n <input type=\"text\" class=\"form-control\" placeholder=\"Search Reports\"\r\n data-bind=\"value: searchQuery, valueUpdate: 'input'\">\r\n <button class=\"btn btn-sm btn-outline-primary flex-shrink-0\" title=\"Select all Filtered\"\r\n data-bind=\"click: selectAllFiltered\">\r\n Select All\r\n </button>\r\n <button class=\"btn btn-sm btn-outline-secondary flex-shrink-0\" title=\"Deselect all Filtered\"\r\n data-bind=\"click: deselectAllFiltered\">\r\n Deselect All\r\n </button>\r\n </div>\r\n <div data-bind=\"foreach: filteredReportsAndFolders\">\r\n <div class=\"card mb-3\">\r\n <div class=\"card-header\">\r\n <div class=\"d-flex fw-bold\">\r\n <div class=\"w-50 flex-grow-1\">\r\n <input type=\"checkbox\" data-bind=\"checked: allReportsSelected\">\r\n <span data-bind=\"text: folder\"></span>\r\n </div>\r\n <div class=\"w-25\">View</div>\r\n <div class=\"w-25\">Manage</div>\r\n <div class=\"w-25\">Delete</div>\r\n <div class=\"w-25\">Client ID</div>\r\n </div>\r\n </div>\r\n <!-- Reports List -->\r\n <ul class=\"list-group list-group-flush\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"w-50 flex-grow-1\">\r\n <input type=\"checkbox\" data-bind=\"checked: isSelected\">\r\n <span data-bind=\"text: reportName\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: viewOnlyUserRole ? viewOnlyUserRole: 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: userRole ? userRole : 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserRole ? deleteOnlyUserRole : 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: clientId ? clientId : 'Any User'\"></span>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n <div class=\"p-2 text-muted\" data-bind=\"visible: reports.length === 0\">\r\n No matching reports found\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button class=\"btn btn-success\" data-bind=\"click: exportFoldersReportJson\">Export Selected</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.openApplySecurityModal, enable: $root.anyReportSelected\">Apply Security to All Selected</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.deleteSelectedItems, enable: $root.anyReportSelected\">Delete All Selected</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"modal\" id=\"applySecurityModal\" tabindex=\"-1\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\" data-bind=\"if: $root.anyReportSelected\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Apply Security to All Selected</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div data-bind=\"template: { name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.applySecurityToAll\">Apply to All</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<!-- Import Json File Modal -->\r\n<div class=\"modal\" id=\"uploadFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadFileModalLabel\">Import previously Exported Reports</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n\r\n <div class=\"alert alert-info small\">\r\n <strong>Instructions:</strong><br />\r\n \u2022 Select a <code>.json</code> file previously exported from Dotnet Report.<br />\r\n \u2022 The file may include multiple reports and their folders.<br />\r\n \u2022 Any missing folders will be created automatically.<br />\r\n \u2022 If a report with the same name already exists, you will be prompted to:\r\n <em>Skip</em>, <em>Overwrite</em>, or <em>Make a Copy</em>.<br />\r\n \u2022 Once uploaded, all imported reports will be available immediately.\r\n </div>\r\n\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n Click here to select a JSON file\r\n </div>\r\n\r\n <input type=\"file\" id=\"fileInputJson\" accept=\".json\" style=\"display: none;\"\r\n data-bind=\"event: { change: handleFileSelect }\">\r\n\r\n <div class=\"mt-3\" data-bind=\"visible: fileName\">\r\n <p><strong>Selected File:</strong> <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->", styles: [".glyphicon-ok:before{content:\"\\f00c\"}.glyphicon-remove:before{content:\"\\f00d\"}.glyphicon{display:inline-block;font: 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.table-name-label{display:inline-block;max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
13508
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: DotnetsetupComponent, isStandalone: true, selector: "app-dotnetsetup", ngImport: i0, template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n<div>\r\n <h2>Manage Database</h2>\r\n <p>\r\n You can select and manage display names for the Tables and Columns you would like to allow in Dotnet Report Builder.\r\n </p>\r\n <div class=\"alert alert-danger d-flex justify-content-between align-items-center\">\r\n <div>\r\n Do not expose this Setup Tool to end users who should not have access to it. Ideally, only Developers should be given access to this utility.\r\n </div>\r\n <button class=\"btn btn-primary ms-3\" data-bind=\"click: refreshAll\" title=\"Reload all Table and Columns\">\r\n <i class=\"fa fa-refresh\"></i> Refresh\r\n </button>\r\n </div>\r\n\r\n <div data-bind=\"visible: false;\">\r\n Loading...\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <!-- Nav tabs -->\r\n <ul class=\"nav nav-tabs flex-grow-1\" role=\"tablist\">\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link active\" href=\"#tablesfields\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\" data-bind=\"click: function() { customTableMode(false); activeTable(null);}\">\r\n <i class=\"fa fa-database\"></i> Database Tables\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#tablesfields\" aria-controls=\"custom\" role=\"tab\" data-bs-toggle=\"tab\" data-bind=\"click: function() { customTableMode(true); activeTable(null); }\">\r\n <i class=\"fa fa-table\"></i> Custom Tables\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#relations\" aria-controls=\"profile\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-link\"></i> Relations\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#procedure\" aria-controls=\"procedure\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-code\"></i> Stored Procs\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#schedules\" aria-controls=\"schedules\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-clock\"></i> Schedules\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\" data-bind=\"visible: settings.useFunctions\">\r\n <a class=\"nav-link\" href=\"#functions\" aria-controls=\"functions\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-cogs\"></i> Custom Functions\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#manageaccess\" aria-controls=\"manageaccess\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-folder\"></i> Manage Reports\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#connection\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-plug\"></i> Data Settings\r\n </a>\r\n </li>\r\n </ul>\r\n\r\n </div>\r\n <br />\r\n</div>\r\n<!-- Tab panes -->\r\n<div class=\"fix-content\" style=\"display: none;\" data-bind=\"visible: true\">\r\n <div class=\"tab-content\">\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"connection\">\r\n <b>Manage Data Connection</b>\r\n <p>\r\n Data Connection groups data schemas (including tables and stored procedures and other configuration), Reports, and Dashboards into a single environment. You can create multiple Data Connections and easily switch between them for separate environment management.\r\n </p>\r\n <hr />\r\n <div class=\"form-row\" data-bind=\"visible: true\">\r\n <div class=\"form-group\">\r\n <div class=\"control-group\">\r\n <select class=\"form-select\" style=\"width:25%\" data-bind=\"options: DataConnections, optionsText: 'DataConnectName', optionsValue: 'DataConnectGuid', value: currentConnectionKey\"></select>\r\n <div class=\"padded-top\"></div>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"visible: false\" data-bs-toggle=\"modal\" data-bs-target=\"#connection-setup-modal\">Manage DB Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: switchConnection, visible: canSwitchConnection\">Switch Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: editDataConnectionModal, hidden: canSwitchConnection\" data-bs-toggle=\"modal\" data-bs-target=\"#add-connection-modal\">Edit Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: newDataConnectionModal\" data-bs-toggle=\"modal\" data-bs-target=\"#add-connection-modal\">Add New Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: exportAll, visible: false\">Export Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: importStart, visible: false\">Import Connection</button>\r\n </div>\r\n <div data-bind=\"visible: importingFile\">\r\n <br />\r\n <div class=\"alert alert-info\">\r\n Please select a file you have previously exported from this utility. The system will load the screen with the Data Connection setting in the file, however, it will <b>NOT</b> be saved until you press the Save All button or Save individual tables\r\n <br />\r\n <div class=\"input-group\">\r\n <input type=\"file\" accept=\".json\" id=\"import-file\" data-bind=\"event: { change: function() { importFile($element.files[0]) } }\" />\r\n <span class=\"input-group-btn\">\r\n <button class=\"btn btn-link\" data-bind=\"click: importCancel\">Cancel</button>\r\n </span>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <br />\r\n <br />\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <b>Account Level Settings</b>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"with: settings\">\r\n <div class=\"row\">\r\n <div class=\"col-md-6\">\r\n <h6 class=\"mt-2 mb-2\">Admin Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useClientIdInAdmin\" data-bind=\"checked: useClientIdInAdmin\">\r\n <label class=\"form-check-label\" for=\"useClientIdInAdmin\">Use Client ID in Admin mode</label>\r\n <small class=\"text-muted d-block\">Enable this to respect client IDs even when in admin mode.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useSqlBuilderInAdminMode\" data-bind=\"checked: useSqlBuilderInAdminMode\">\r\n <label class=\"form-check-label\" for=\"useSqlBuilderInAdminMode\">Use SQL Builder in Admin Mode</label>\r\n <small class=\"text-muted d-block\">Allows SQL query builder access <b>only</b> in admin mode.</small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Customization</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useSqlCustomField\" data-bind=\"checked: useSqlCustomField\">\r\n <label class=\"form-check-label\" for=\"useSqlCustomField\">Use SQL in Custom Field</label>\r\n <small class=\"text-muted d-block\">Allows the use of SQL expressions in custom fields.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showDesignerHints\">\r\n <label class=\"form-check-label\">Show Designer Tips & Guidance</label>\r\n <small class=\"text-muted d-block\">Display contextual tips and explanations throughout the report designer to help users understand available options.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useAltPivot\">\r\n <label class=\"form-check-label\">Pivot with Drilldown</label>\r\n <small class=\"text-muted d-block\">Use alternate Pivot method that doesn\u2019t use SQL\u2019s PIVOT.<br>Allows drilldown, but may be slower.</small>\r\n </div>\r\n <div class=\"form-check\" data-bind=\"visible: isEnterprise\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useFunctions\">\r\n <label class=\"form-check-label\">Use Functions</label>\r\n <small class=\"text-muted d-block\">\r\n Enable calculated functions for List reports only.<br>\r\n Available for Enterprise license users.\r\n </small>\r\n </div>\r\n <div class=\"mb-2 mt-2\">\r\n <label class=\"form-label mb-1\" for=\"defaultDateFormatSelect\">Default Date Format</label>\r\n <select class=\"form-select form-select-sm\" id=\"defaultDateFormatSelect\" style=\"max-width: 220px;\"\r\n data-bind=\"options: dateFormatOptions, value: defaultDateFormat\"></select>\r\n <small class=\"text-muted d-block\">Date format used by all date pickers when a field doesn't override it. e.g. <em>New Zealand</em> uses <code>dd/mm/yyyy</code>.</small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Report Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"allowUsersToCreateReports\" data-bind=\"checked: allowUsersToCreateReports\">\r\n <label class=\"form-check-label\" for=\"allowUsersToCreateReports\">Allow All Users to Create Reports</label>\r\n <small class=\"text-muted d-block\">Permits users to generate and customize reports.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showImportExport\">\r\n <label class=\"form-check-label\">Allow All Users to export/import\u00A0reports</label>\r\n <small class=\"text-muted d-block\">\r\n Allow non admin users to export and import Reports in the system.\r\n </small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: canCopyReport\">\r\n <label class=\"form-check-label\">Always allow users to copy\u00A0reports</label>\r\n <small class=\"text-muted d-block\">\r\n Allow users with View Only access to copy Reports in the system.\r\n </small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showScheduling\">\r\n <label class=\"form-check-label\">Hide Report/Dashboard Scheduling</label>\r\n <small class=\"text-muted d-block\">\r\n Removes scheduling in reports and dashboard, select only if you don't want to use scheduling feature.\r\n </small>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <h6 class=\"mt-2 mb-2\">Folder Options</h6>\r\n <div class=\"form-check\" data-bind=\"visible: false\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"noFolders\" data-bind=\"checked: noFolders\">\r\n <label class=\"form-check-label\" for=\"noFolders\">No Folders</label>\r\n <small class=\"text-muted d-block\">Disables the use of folders in the application.</small>\r\n </div>\r\n <div class=\"form-check\" data-bind=\"visible: false\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"noDefaultFolder\" data-bind=\"checked: noDefaultFolder\">\r\n <label class=\"form-check-label\" for=\"noDefaultFolder\">No Default Folder</label>\r\n <small class=\"text-muted d-block\">Removes the Default folder.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showEmptyFolders\">\r\n <label class=\"form-check-label\">Show Empty Folders</label>\r\n <small class=\"text-muted d-block\">Will show empty folders for non admin users.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"allowUsersToManageFolders\" data-bind=\"checked: allowUsersToManageFolders\">\r\n <label class=\"form-check-label\" for=\"allowUsersToManageFolders\">Allow All Users to Manage Folders</label>\r\n <small class=\"text-muted d-block\">Grants permission to organize and manage folders without admin mode.</small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Export Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useAltPdf\">\r\n <label class=\"form-check-label\">PDF Export without Chromium</label>\r\n <small class=\"text-muted d-block\">Use alternate PDF export method that doesn\u2019t rely on Chromium.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: dontXmlExport\">\r\n <label class=\"form-check-label\">Hide XML Export option</label>\r\n <small class=\"text-muted d-block\">Remove XML Export option.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: dontWordExport\">\r\n <label class=\"form-check-label\">Hide Word Export option</label>\r\n <small class=\"text-muted d-block\">Remove Word Export option.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showPageSize\">\r\n <label class=\"form-check-label\">Show Page Size on PDF & Word export</label>\r\n <small class=\"text-muted d-block\">Display document dimensions in exported PDF & Word.</small>\r\n </div>\r\n\r\n <h6 class=\"mt-3 mb-2\">AI Assistant <span class=\"badge bg-warning text-dark\" style=\"font-size: 10px;\">BETA</span></h6>\r\n <div class=\"mb-2\">\r\n <div class=\"form-check form-switch\">\r\n <input class=\"form-check-input\" type=\"checkbox\" role=\"switch\" id=\"aiEnabledSwitch\"\r\n data-bind=\"checked: aiEnabled\">\r\n <label class=\"form-check-label\" for=\"aiEnabledSwitch\">Enable AI Report Assistant</label>\r\n </div>\r\n <small class=\"text-muted d-block\">When enabled, an AI-powered assistant will be available in the report designer to help build reports using natural language.</small>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mt-3\">\r\n <button type=\"button\" id=\"saveAppSettings\" class=\"btn btn-primary\" data-bind=\"click: saveAppSettings\">Save</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div role=\"tabpanel\" class=\"tab-pane active\" id=\"tablesfields\">\r\n <b data-bind=\"text: customTableMode() ? 'Custom Tables' : 'Database Tables'\"></b>\r\n <p>\r\n <span data-bind=\"visible: $root.customTableMode\">\r\n Define Custom Tables using SQL Select Query to use in Dotnet Report for Reporting and Analytics.\r\n </span>\r\n <span data-bind=\"hidden: $root.customTableMode\">\r\n Select Tables or Views from your Database to use in Dotnet Report for Reporting and Analytics.\r\n </span>\r\n </p>\r\n\r\n <div data-bind=\"with: Tables\">\r\n <input type=\"text\" class=\"form-control input-sm\" placeholder=\"Filter Tables...\" data-bind=\"value: tableFilter, valueUpdate: 'afterkeydown'\" style=\"float: left; width: 180px; margin-right: 5px;\">\r\n <button class=\"btn btn-outline-secondary btn-sm\" data-bind=\"click: clearTableFilter, visible: tableFilter()!='' && tableFilter()!=null\"><span class=\"fa fa-remove\"></span></button>\r\n <button class=\"btn btn-outline-secondary btn-sm\" data-bind=\"click: toggleShowAll, hidden: $root.customTableMode() || $root.onlyApi(), text: usedOnly() ? 'Show all' : 'Show used only'\">Show used only</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.customSql.addNewCustomSqlTable, visible: $root.customTableMode\">Add New Custom Table</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.loadFromDatabase, hidden: $root.customTableMode() || !$root.onlyApi()\">\r\n <span class=\"fa fa-database\"></span> Load all Database Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.visualizeJoins\"><span class=\"fa fa-arrows-h\"></span> Visualize Joins</button> \r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: function() { exportTablesJson(true) }, visible: $root.customTableMode\">\r\n <span class=\"fa fa-download\"></span> Export Custom Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: function() { exportTablesJson(false) }, visible: !$root.customTableMode()\">\r\n <span class=\"fa fa-download\"></span> Export Tables/Views\r\n </button>\r\n\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadTablesFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-file\"></span> Import Tables/Views\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" title=\"Manage Categories\" data-bs-toggle=\"modal\" data-bs-target=\"#category-modal\">\r\n <span class=\"fa fa-server\"></span> Manage Categories\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { selectAll(false)},visible: !$root.customTableMode()\">\r\n Select All Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { selectAll(true)}, visible: $root.customTableMode\">\r\n Select All Custom Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { unselectAll(false)},visible: !$root.customTableMode()\">\r\n UnSelect All Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { unselectAll(true)}, visible: $root.customTableMode\">\r\n UnSelect All Custom Tables \r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { $root.saveChanges($root.customTableMode()) }\">\r\n <span class=\"fa fa-floppy\"></span> Save All Tables\r\n </button>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n <hr />\r\n\r\n <div class=\"row\">\r\n <div class=\"col-12 col-md-4 col-lg-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n\r\n <div class=\"row\">\r\n <div data-bind=\"ifnot: $root.customTableMode\">\r\n <div class=\"alert alert-info\">\r\n <span data-bind=\"text: Tables.model().filter(t => !t.CustomTable()).length\"></span> Tables/Views\r\n <span data-bind=\"text: $root.onlyApi() ? 'configured and used' : 'read from database'\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"menu g-3\" data-bind=\"foreach: pagedTables\">\r\n <div class=\"menu-category card\">\r\n <div class=\"card-header clearfix\">\r\n <div class=\"checkbox float-start\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected\" title=\"Check to use in Dotnet Report, uncheck to Remove\">\r\n <span data-bind=\"text: TableName, attr: { title: TableName }, click: function() { $root.activeTable($data); }\" class=\"table-name-label\" style=\"cursor: pointer\"></span>\r\n <span data-bind=\"visible: SchemaName, text: SchemaName\" title=\"schema\" class=\"text-muted small\"></span>\r\n <span data-bind=\"visible: IsView\" class=\"label label-sm\">(view)</span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Table\" data-bind=\"click: function() { saveTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fas fa-save\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Preview this Table\" data-bind=\"click: function() { previewTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-table\"></i>\r\n </button>\r\n </div>\r\n <a class=\"float-end\" data-bind=\"click: function() { $root.activeTable($data); }\">\r\n <span class=\"fa fa-chevron-right\" style=\"cursor: pointer\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"row mt-3\">\r\n <div class=\"d-flex flex-column col-md-12\" data-bind=\"with: pager\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n <div class=\"text-muted small mt-0 pt-0\" style=\"padding-left: 3px\" data-bind=\"text: 'Total Records: ' + totalRecords()\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-12 col-md-8 col-lg-9\" id=\"tableDetails\">\r\n <div data-bind=\"visible: pagedTables().length === 0\">\r\n <br />\r\n <svg style=\"width:40px;float:left;transform:rotate(-45deg) translateY(6px);transform-origin:center center;\" fill=\"#000000\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" class=\"icon flat-line\"><g stroke-width=\"0\"></g><g stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke=\"#CCCCCC\" stroke-width=\"0.048\"></g><g><path d=\"M18,21A13.17,13.17,0,0,1,9,8.51V3\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></path><polyline points=\"12 6 9 3 6 6\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></polyline></g></svg>\r\n <div class=\"mt-3 fw-bold\" style=\"float:left; padding-left: 5px;\">No <span data-bind=\"visible: $root.customTableMode\">Custom </span> Tables added yet, click \"<span data-bind=\"text: customTableMode() ? 'Add New Custom Table' : 'Load All Tables'\"></span>\" to get started!</div>\r\n </div>\r\n\r\n <div data-bind=\"visible: !activeTable() && pagedTables().length > 0\">\r\n <br />\r\n <br />\r\n <svg style=\"width:40px;float:left;transform:rotate(-45deg) translateY(6px);transform-origin:center center;\" fill=\"#000000\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" class=\"icon flat-line\"><g stroke-width=\"0\"></g><g stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke=\"#CCCCCC\" stroke-width=\"0.048\"></g><g><path d=\"M18,21A13.17,13.17,0,0,1,9,8.51V3\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></path><polyline points=\"12 6 9 3 6 6\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></polyline></g></svg>\r\n <div class=\"mt-3 fw-bold\" style=\"float:left; padding-left: 5px;\">Select a <span data-bind=\"visible: $root.customTableMode\">Custom </span> Table, or \"<span data-bind=\"text: customTableMode() ? 'Add New Custom Table' : 'Load All Tables'\"></span>\"</div>\r\n </div>\r\n\r\n <div data-bind=\"with: activeTable\">\r\n <div class=\"card my-3\">\r\n <div class=\"card-header\">\r\n <h5>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected\" title=\"Check to use in Dotnet Report, uncheck to Remove\">\r\n <span data-bind=\"text: TableName\"></span>\r\n <span data-bind=\"visible: IsView\" class=\"label-sm\">(view)</span>\r\n </h5>\r\n <button class=\"btn btn-sm\" title=\"Save this Table\" data-bind=\"click: function() { saveTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fas fa-save\"></i> Save Changes\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Preview this Table\" data-bind=\"click: function() { previewTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-table\"></i> Preview Data\r\n </button>\r\n <button class=\"btn btn-sm btn-danger\" title=\"Delete this Table\" data-bind=\"click: function() { deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-trash\"></i> Remove Table\r\n </button>\r\n </div>\r\n <div class=\"card-body\">\r\n <p class=\"float-end\">\r\n <button class=\"btn btn-sm\" title=\"Manage Category\" data-bs-toggle=\"modal\" data-bs-target=\"#category-manage-modal\" data-bind=\"click: $root.selectedCategory\">\r\n <i class=\"fa fa-gear\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Export this Table\" data-bind=\"click: function() { exportTableJson(); }\">\r\n <i class=\"fa fa-file\"></i>\r\n </button>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Display Name</label><br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Schema Name</label><br />\r\n <span data-bind=\"editable: SchemaName\"></span>\r\n </p>\r\n <p style=\"display: none;\">\r\n <!-- deprecated -->\r\n <label class=\"label-sm\">Account Id Field</label><br />\r\n <span data-bind=\"editable: AccountIdField\"></span>\r\n </p>\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked: DoNotDisplay\">\r\n Do Not Display\r\n </label>\r\n </div>\r\n <div data-bind=\"if: CustomTable\">\r\n <button class=\"btn btn-sm btn-secondary\" data-bind=\"click: $root.customSql.viewCustomSql.bind($data)\">View Custom SQL</button>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center justify-content-end gap-2\">\r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: addNewColumn, visible: false\">\r\n <i class=\"fa fa-plus\"></i> Add Column\r\n </button>\r\n <label class=\"label-sm m-0\"><span data-bind=\"text: Columns().length\"></span> Columns</label>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: autoFormat, visible: Selected\">Auto Format</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: autoSort, visible: Selected\">Auto Sort</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: unselectAllColumns, visible: Selected\">Unselect All</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: selectAllColumns, visible: Selected\">Select All</button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"list-group\" data-bind=\"sortable: { data: Columns, options: { handle: '.sortable', cursor: 'move' }, afterMove: $root.Tables.columnSorted }\">\r\n <div class=\"list-group-item\">\r\n <div data-bind=\"if: $parent.DynamicColumns()\">\r\n <span data-bind=\"html: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n </div>\r\n <div class=\"checkbox\" data-bind=\"if: !$parent.DynamicColumns()\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected, enable: $parent.Selected()\">\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n <label data-bind=\"visible: PrimaryKey\" class=\"badge text-bg-primary\">Primary</label>\r\n <label data-bind=\"visible: ForeignKey\" class=\"badge text-bg-info text-white\">Foreign</label>\r\n <label class=\"badge text-bg-warning\" data-bind=\"visible: isNew\">New</label>\r\n </label>\r\n <button class=\"btn btn-sm float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#column-modal\" title=\"All column options\" data-bind=\"click: $root.selectColumn.bind($data, false)\">...</button>\r\n <div class=\"btn btn-sm float-end sortable\">\r\n <span class=\"fa fa-arrows\" aria-hidden=\"true\" title=\"Drag to reorder\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"relations\">\r\n <b>Relations</b>\r\n <p>\r\n Setup your Database Relations for Dotnet Report to produce dynamic queries\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: AddAllRelations\">Auto Add Joins</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: AddJoin\">Add new Join</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: SaveJoins\">Save Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: visualizeJoins\">Visualize Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: DeleteVisibleJoins\" title=\"Delete filtered Joins\">Delete Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: ExportJoins\" title=\"Export filtered Joins\">Export Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadJoinsFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-upload\"></span> Import Joins\r\n </button>\r\n <hr />\r\n <div id=\"form-joins\">\r\n <div class=\"alert alert-warning\" data-bind=\"visible: isDirty\">\r\n You have unsaved changes. Please be sure to click <b>Save Joins</b> to save your changes.\r\n </div>\r\n\r\n <div class=\"container-fluid\">\r\n <div class=\"row fw-bold bg-light border-bottom py-2\" data-bind=\"with: JoinFilters\">\r\n <!-- Repeat for each column header -->\r\n <div class=\"col-md-1\" style=\"max-width: 40px;\"></div>\r\n <div class=\"col-md-2\">\r\n Primary Table\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: primaryTable, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\" />\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: primaryField, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\" />\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1\">\r\n Join Type\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinType, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Join Table\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinTable, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinField, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\"></div>\r\n </div>\r\n\r\n <!-- New Join Row -->\r\n <div class=\"row bg-info bg-opacity-25 p-2\" data-bind=\"visible: showNewJoinRow\">\r\n <div class=\"col-md-1\" style=\"max-width: 40px;\"></div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: Tables.availableTables, optionsText: 'DisplayName', value: NewJoin().JoinTable, optionsCaption: 'Pick a table...'\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: NewJoin().JoinTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsCaption: 'Pick a field...', optionsValue: 'ColumnName', value: $root.NewJoin().FieldName\"></select>\r\n </div>\r\n <div class=\"col-md-1\">\r\n <select class=\"form-select\" data-bind=\"options: $root.JoinTypes, value: NewJoin().JoinType\"></select>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: NewJoin().OtherTables, optionsText: 'DisplayName', value: NewJoin().OtherTable, optionsCaption: 'Pick a table...'\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: NewJoin().OtherTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $root.NewJoin().JoinFieldName, optionsCaption: 'Pick a field...'\"></select>\r\n </div>\r\n <div class=\"col-md-2 text-end\">\r\n <button class=\"btn btn-success btn-sm\" data-bind=\"click: ConfirmAddJoin\">+ Add Join</button>\r\n </div>\r\n </div>\r\n\r\n <!-- Existing Join Rows with drag reorder -->\r\n <div data-bind=\"sortable: { data: reorderableJoins, options: { handle: '.join-drag-handle', cursor: 'move' }, afterMove: $root.joinSorted }\">\r\n <div class=\"row align-items-center border-bottom py-2\">\r\n <div class=\"col-md-1 text-center\" style=\"max-width: 40px;\">\r\n <span class=\"btn btn-sm btn-outline-secondary join-drag-handle\" title=\"Drag to reorder\"><i class=\"fa fa-bars\"></i></span>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: $root.Tables.availableTables, optionsText: 'DisplayName', value: JoinTable\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: JoinTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $parent.FieldName\"></select>\r\n </div>\r\n <div class=\"col-md-1\">\r\n <select class=\"form-select\" data-bind=\"options: $root.JoinTypes, value: JoinType\"></select>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: OtherTables, optionsText: 'DisplayName', value: OtherTable\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: OtherTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $parent.JoinFieldName\"></select>\r\n </div>\r\n <div class=\"col-md-2 text-end\">\r\n <span class=\"badge bg-warning text-dark me-2\"\r\n data-bind=\"visible: isNew\"\r\n data-bs-toggle=\"tooltip\"\r\n title=\"New record added or imported, not saved yet\">\r\n <i class=\"fa fa-warning\"></i> New\r\n </span>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"click: DeleteJoin\">Delete</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"row mt-3\"> \r\n <div class=\"d-flex flex-row align-items-center col-md-12\" data-bind=\"with: joinsPager\"> \r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n <div class=\"text-muted small mt-0 pt-0\" style=\"padding-left: 3px\" data-bind=\"text: 'Total Records: ' + totalRecords()\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <br />\r\n <br />\r\n </div>\r\n <div id=\"procedure\" class=\"tab-pane\">\r\n <b>Stored Procedures</b>\r\n <p>\r\n Select and manage Stored Procedures to use in Dotnet Report for more complex and coded Reports\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#procedure-modal\"><span class=\"fa fa-plus\"></span> Add Stored Procs from database</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadStoredProceduresFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-file\"></span> Import Stored Procedures\r\n </button>\r\n <hr />\r\n <div data-bind=\"if: Procedures.savedProcedures().length == 0\">\r\n <br />\r\n No Stored Procedures have been setup yet.\r\n </div>\r\n <div class=\"row\" data-bind=\"if: Procedures.savedProcedures().length > 0\">\r\n <!-- Left Panel for Stored Procedure Names -->\r\n <div class=\"col-12 col-md-4 col-lg-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n <div class=\"menu g-3\" data-bind=\"foreach: Procedures.savedProcedures\">\r\n <div class=\"menu-category card\">\r\n <div class=\"card-header clearfix\">\r\n <div class=\"float-start\">\r\n <label>\r\n <span data-bind=\"text: TableName, click: function() { $root.activeProcedure($data); }\" style=\"cursor: pointer\"></span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function() { $root.saveProcedure($data.TableName, false); }\">\r\n <span class=\"fa fa-save\"></span>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Delete this Procedure\" data-bind=\"click: function() { $data.deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <span class=\"fa fa-trash\"></span>\r\n </button>\r\n </div>\r\n <!-- Click to activate procedure -->\r\n <a class=\"float-end\" data-bind=\"click: function() { $root.activeProcedure($data); }\">\r\n <span class=\"fa fa-chevron-right\" style=\"cursor: pointer\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Right Panel for Stored Procedure Details -->\r\n <div class=\"col-12 col-md-8 col-lg-9\" id=\"procDetails\">\r\n <div data-bind=\"with: activeProcedure\">\r\n <div class=\"card my-3\">\r\n <div class=\"card-header\">\r\n <h5 data-bind=\"text: TableName\"></h5>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function() { $root.saveProcedure($data.TableName, false); }\">\r\n <span class=\"fa fa-save\"></span> Save Changes\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Delete this Procedure\" data-bind=\"click: function() { $data.deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <span class=\"fa fa-trash\"></span> Delete\r\n </button>\r\n </div>\r\n <div class=\"card-body\">\r\n <p class=\"float-end\">\r\n <button class=\"btn btn-sm\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Export this Procedure\" data-bind=\"click: function() { $root.exportProcedureJson($data.TableName); }\">\r\n <i class=\"fa fa-file\"></i>\r\n </button>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Display Name</label><br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Schema Name</label><br />\r\n <span data-bind=\"editable: SchemaName\"></span>\r\n </p>\r\n <label class=\"small\">Columns</label>\r\n <div class=\"list-group\" data-bind=\"foreach: Columns\">\r\n <div class=\"list-group-item\">\r\n <label>\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n </label>\r\n <button class=\"btn btn-sm float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#column-modal\" title=\"All column options\" data-bind=\"click: $root.selectColumn.bind($data, true)\">...</button>\r\n </div>\r\n </div>\r\n <label class=\"small\">Parameters</label>\r\n <div class=\"list-group\" data-bind=\"foreach: Parameters\">\r\n <div class=\"list-group-item\">\r\n <label>\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ParameterName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: ParameterDataTypeString\"></span>\r\n \r\n <button class=\"btn btn-sm btn-primary float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#parameter-modal\" title=\"All Parameter options\" data-bind=\"click: $root.editParameter\">...</button>\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div id=\"manageaccess\" class=\"tab-pane\">\r\n <ul class=\"nav nav-tabs\" id=\"accessTabs\" role=\"tablist\">\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link active\" id=\"reports-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#reportsAccess\" type=\"button\" role=\"tab\">Reports Access</button>\r\n </li>\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link\" id=\"folders-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#foldersAccess\" type=\"button\" role=\"tab\">Folders Access</button>\r\n </li>\r\n </ul>\r\n <div class=\"tab-content mt-3\">\r\n <div class=\"tab-pane fade show active\" id=\"reportsAccess\" role=\"tabpanel\" aria-labelledby=\"reports-tab\">\r\n <b>Reports Access</b>\r\n <p>You can setup access to individual Reports here</p>\r\n <div class=\"mb-2 d-flex gap-2\">\r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { exportFoldersReportJson() }\">\r\n <span class=\"fa fa-download\"></span> Export Selected Reports\r\n </button>\r\n </div> \r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadFileModal\">\r\n <span class=\"fa fa-upload\"></span> Import Reports\r\n </button>\r\n </div>\r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#searchModal\">\r\n <span class=\"fa fa-tasks\"></span> Bulk Actions\r\n </button>\r\n </div>\r\n </div>\r\n <hr />\r\n <div data-bind=\"foreach: reportsAndFolders\" class=\"list-group\">\r\n <div class=\"list-group-item\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <input type=\"checkbox\" class=\"form-check-input\"\r\n data-bind=\"checked: allReportsSelected\">\r\n <label>\r\n <a data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folder-' + folderId }\">\r\n <i class=\"fa fa-folder\"></i> <span data-bind=\"text: folder\"></span>\r\n </a>\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"collapse\" data-bind=\"attr: {id: 'folder-' + folderId }\">\r\n <div data-bind=\"if: reports.length == 0\">\r\n No Reports found in this folder\r\n </div>\r\n <ul class=\"list-group\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\">\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input\" type=\"checkbox\" data-bind=\"checked: isSelected\" />\r\n <label class=\"list-group-item-heading\">\r\n <span class=\"fa\" data-bind=\"css: {'fa-file': reportType=='List', 'fa-th-list': reportType=='Summary', 'fa-bar-chart': reportType=='Bar', 'fa-pie-chart': reportType=='Pie', 'fa-line-chart': reportType=='Line', 'fa-globe': reportType =='Map'}\" style=\"font-size: 14pt; color: #808080\"></span>\r\n <span data-bind=\"text: reportName\"></span>\r\n </label>\r\n </div>\r\n <p class=\"list-group-item-text small\" data-bind=\"text: reportDescription\"></p>\r\n <div class=\"small\" style=\"padding-top: 10px;\">\r\n <b>Current Report Access</b><br />\r\n Manage by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: userId() ? userId() : 'Any User'\"></span><br />\r\n View only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: (viewOnlyUserId() ? viewOnlyUserId() : (userId() ? userId() : 'Any User'))\"></span><br />\r\n <div data-bind=\"if: deleteOnlyUserId()\">\r\n Delete only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserId()\"></span><br />\r\n </div>\r\n <div data-bind=\"if: userRole()\">\r\n Manage by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: userRole() ? userRole() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: viewOnlyUserRole()\">\r\n View only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: viewOnlyUserRole() ? viewOnlyUserRole() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: deleteOnlyUserRole()\">\r\n Delete only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserRole() ? deleteOnlyUserRole() : 'Same as Manage'\"></span><br />\r\n </div>\r\n <div>\r\n For Client <span class=\"badge text-bg-info text-white\" data-bind=\"text: clientId() ? clientId() : 'All Clients'\"></span><br />\r\n </div>\r\n </div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeAccess(!changeAccess())}, text: !changeAccess() ? 'Change Access': 'Cancel Changing Access', hidden: changeAccess\">Change Access</button>\r\n </div>\r\n <div data-bind=\"if: changeAccess\" class=\"col-md-9\">\r\n <div style=\"padding-left: 10px;\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: saveAccessChanges\">Save Access Changes</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeAccess(!changeAccess())}, text: !changeAccess() ? 'Change Access': 'Cancel Changing Access'\">Change Access</button>\r\n </div>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"tab-pane fade\" id=\"foldersAccess\" role=\"tabpanel\" aria-labelledby=\"folders-tab\">\r\n <b>Folders Access</b>\r\n <p>You can setup access to individual Folders here</p>\r\n <hr />\r\n <div data-bind=\"foreach: Folders\" class=\"list-group\">\r\n <div class=\"list-group-item\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <a data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folderAccess-' + Id }\">\r\n <i class=\"fa fa-folder\"></i> <span data-bind=\"text: FolderName\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n <div class=\"collapse\" data-bind=\"attr: {id: 'folderAccess-' + Id }\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\">\r\n <div class=\"small\" style=\"padding-top: 10px;\">\r\n <b>Current Folder Access</b><br />\r\n Manage by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserId()? UserId() : 'Any User'\"></span><br />\r\n View only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: (ViewOnlyUserId() ? ViewOnlyUserId() : (UserId() ? UserId() : 'Any User'))\"></span><br />\r\n <div data-bind=\"if: DeleteOnlyUserId()\">\r\n Delete only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: DeleteOnlyUserId()\"></span><br />\r\n </div>\r\n <div data-bind=\"if: UserRoles()\">\r\n Manage by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserRoles() ? UserRoles() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: ViewOnlyUserRoles()\">\r\n View only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: ViewOnlyUserRoles() ? ViewOnlyUserRoles() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: DeleteOnlyUserRoles()\">\r\n Delete only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: DeleteOnlyUserRoles() ? DeleteOnlyUserRoles() : 'Same as Manage'\"></span><br />\r\n </div>\r\n <div>\r\n For Client <span class=\"badge text-bg-info text-white\" data-bind=\"text: ClientId() ? ClientId() : 'All Clients'\"></span><br />\r\n </div>\r\n </div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeFolderAccess(!changeFolderAccess())}, text: !changeFolderAccess() ? 'Change Access': 'Cancel Changing Access', hidden: changeFolderAccess\">Change Access</button>\r\n </div>\r\n <div data-bind=\"if: changeFolderAccess\" class=\"col-md-9\">\r\n <div style=\"padding-left: 10px;\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: saveFolderAccessChanges\">Save Access Changes</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeFolderAccess(!changeFolderAccess())}, text: !changeFolderAccess() ? 'Change Access': 'Cancel Changing Access'\">Change Access</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"functions\" data-bind=\"with: Functions\">\r\n <b>Custom Functions</b>\r\n <p>\r\n Create and manage Custom Function that you can use in building Reports and Dashboards\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"visible: $root.settings.canAddFunction,click: createNewFunction\">Add new Function</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: buildCustomFunctions\">Rebuild Functions Library</button>\r\n <br />\r\n <hr />\r\n\r\n <div class=\"container-fluid\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n <input id=\"searchInput\" class=\"form-control mb-2\" type=\"text\" placeholder=\"Search...\" data-bind=\"value: search, valueUpdate: 'input', visible: functions().length > 0\">\r\n <ul class=\"list-group\" data-bind=\"foreach: filteredFunctions\">\r\n <li class=\"list-group-item d-flex justify-content-between align-items-center\">\r\n <span data-bind=\"text: name\"></span>\r\n <div>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: $parent.selectFunction\">Edit</button>\r\n <button class=\"btn btn-danger btn-sm\" data-bind=\"click: function() { $parent.deleteFunction($data) }\">Delete</button>\r\n </div>\r\n </li>\r\n </ul>\r\n <div data-bind=\"if: functions().length == 0\">\r\n No Functions found\r\n </div>\r\n </div>\r\n <div class=\"col-md-9\" data-bind=\"with: selectedFunction\">\r\n <div style=\"padding-left: 10px;\">\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <b>Setup Function</b>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"mb-3\" data-bind=\"validationElement: functionName\">\r\n <label for=\"functionName\" class=\"form-label\">Function Name</label>\r\n <input id=\"functionName\" class=\"form-control\" required data-bind=\"value: name, valueUpdate: 'input'\" />\r\n <div class=\"invalid-feedback\">Function Name is required.</div>\r\n </div>\r\n <div class=\"mb-3\">\r\n <label for=\"functionType\" class=\"form-label\">Function Type</label>\r\n <select id=\"functionType\" class=\"form-control\" data-bind=\"value: functionType, event: { change: $parent.updateCodeEditorMode }\">\r\n <option value=\"csharp\">C#</option>\r\n <!--<option value=\"javascript\">JavaScript</option>\r\n <option value=\"sql\">SQL</option>-->\r\n </select>\r\n </div>\r\n <div class=\"mb-3\">\r\n <label for=\"functionDescription\" class=\"form-label\">Description</label>\r\n <textarea id=\"functionDescription\" class=\"form-control\" data-bind=\"value: description, valueUpdate: 'input'\" placeholder=\"Add any helpful description here for the user...\"></textarea>\r\n </div>\r\n\r\n <div>\r\n <b>Arguments</b>\r\n <table class=\"table table-bordered\">\r\n <thead>\r\n <tr>\r\n <th></th>\r\n <th>Name</th>\r\n <th>Description</th>\r\n <!--<th>Data Type</th>-->\r\n <th>Optional</th>\r\n <th></th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: parameters, tableSortable: { data: parameters, placeholder: 'sortable-placeholder' }\" >\r\n <tr>\r\n <td> <span class=\"fa fa-ellipsis-v\" aria-hidden=\"true\" title=\"Drag to reorder\"></span></td>\r\n <td>\r\n <input class=\"form-control\" data-bind=\"value: parameterName, valueUpdate: 'input'\" />\r\n <span class=\"text-danger\" data-bind=\"visible: name.hasError, text: name.validationMessage\"></span>\r\n </td>\r\n <td><input class=\"form-control\" data-bind=\"value: description, valueUpdate: 'input'\" placeholder=\"Friendly description for user...\" /></td>\r\n <!--<td>\r\n <select class=\"form-select\" data-bind=\"value: datatype\">\r\n <option>object</option>\r\n <option>string</option>\r\n <option>int</option>\r\n <option>float</option>\r\n <option>bool</option>\r\n </select>\r\n </td>-->\r\n <td> <input type=\"checkbox\" data-bind=\"checked: required, checkedValue: false, uncheckedValue: true\" /></td>\r\n <td><button class=\"btn btn-sm btn-danger\" data-bind=\"click: $parent.removeParameter\">Remove</button></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: addParameter\">Add Argument</button>\r\n </div>\r\n <br />\r\n <div class=\"mb-3\">\r\n <label for=\"codeEditor\" class=\"form-label\">Write the <b>Code</b> for the function below:</label>\r\n <div style=\"border: 1px solid\">\r\n <textarea id=\"codeEditor\" class=\"code-editor form-control\" data-bind=\"value: code\"></textarea>\r\n </div>\r\n </div>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $parent.saveFunction\">Save</button>\r\n <button class=\"btn btn-secondary\" data-bind=\"click: $parent.cancelEdit\">Cancel</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"schedules\">\r\n <b>Scheduled Reports</b>\r\n <p>\r\n View Schedules setup for sending Reports and Dashboards\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#sentHistoryModal\" data-bind=\"click: function() { loadSentHistory(1); }\">\r\n <span class=\"fa fa-history\"></span> View Send History\r\n </button>\r\n <hr />\r\n\r\n <div class=\"row\">\r\n <div class=\"col-md-12\">\r\n <div data-bind=\"visible: schedules().length === 0\">\r\n <i class=\"fa fa-exclamation-circle\"></i> No scheduled Reports or Dashboards available.\r\n </div>\r\n <div class=\"container-fluid\" data-bind=\"if: schedules().length > 0\">\r\n <div data-bind=\"foreach: schedules\">\r\n <div class=\"row border-bottom py-2\">\r\n <div class=\"col-12\">\r\n For <span class=\"text-muted\" data-bind=\"text: DashboardId === 0 ? 'Report' : 'Dashboard'\"></span>\r\n <b><span data-bind=\"text: Name\"></span></b>\r\n </div>\r\n </div>\r\n\r\n <!-- Inner schedule items -->\r\n <div class=\"row fw-bold bg-light py-2 d-none d-md-flex\">\r\n <div class=\"col-md\"><i class=\"fa fa-clock\"></i> Schedule</div>\r\n <div class=\"col-md\"><i class=\"fa fa-envelope\"></i> Email To</div>\r\n <div class=\"col-md\"><i class=\"fa fa-file\"></i> Format</div>\r\n <div class=\"col-md\"><i class=\"fa fa-history\"></i> Last Run</div>\r\n <div class=\"col-md\"><i class=\"fa fa-user\"></i> User ID</div>\r\n <div class=\"col-md\"><i class=\"fa fa-globe\"></i> Time Zone</div>\r\n <div class=\"col-md\"><i class=\"fa fa-cogs\"></i> Actions</div>\r\n </div>\r\n\r\n <div data-bind=\"foreach: { data: Schedules, as: 'item' }\">\r\n <div class=\"row border-bottom py-2 align-items-center\">\r\n <div class=\"col-md\" data-bind=\"text: item.ScheduleDisplay\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.EmailTo\"></div>\r\n <div class=\"col-md\"\r\n data-bind=\"if: item.Format && item.Format.trim().substring(0,1) === '{'\">\r\n <div data-bind=\"html: item.Format.slice(1,-1).split(',').join('<br>')\"></div>\r\n </div>\r\n <div class=\"col-md\"\r\n data-bind=\"if: !item.Format || item.Format.trim().substring(0,1) !== '{'\">\r\n <div data-bind=\"text: item.Format\"></div>\r\n </div>\r\n <div class=\"col-md\" data-bind=\"text: item.LastRun\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.UserId ? item.UserId : 'N/A'\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.Timezone ? item.Timezone : 'N/A'\"></div>\r\n <div class=\"col-md\">\r\n <button class=\"btn btn-sm btn-danger\" data-bind=\"click: $root.deleteSchedule\">\r\n <i class=\"fa fa-trash\"></i> Delete\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Modal -->\r\n<div class=\"modal\" id=\"column-modal\" role=\"dialog\" tabindex=\"-1\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editColumn()\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"myModalLabel\">\r\n Manage\r\n <label data-bind=\"text: ColumnName\"></label>\r\n </h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose options that will determine how users interact with this column on Reports</p>\r\n <div class=\"form-horizontal\">\r\n\r\n <ul class=\"nav nav-tabs\" role=\"tablist\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link active\" href=\"#column-main\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\">Main Options</a></li>\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link\" href=\"#column-foreign\" aria-controls=\"profile\" role=\"tab\" data-bs-toggle=\"tab\">Foreign Key Options</a></li>\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link\" href=\"#column-filter\" aria-controls=\"procedure\" role=\"tab\" data-bs-toggle=\"tab\">Filter Options</a></li>\r\n </ul>\r\n <div class=\"tab-content\">\r\n <br />\r\n <div role=\"tabpanel\" class=\"tab-pane active\" id=\"column-main\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Display_Name\" data-bind=\"attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">Display Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" id=\"DisplayName\" name=\"DisplayName\" type=\"text\" value=\"First Name\" data-bind=\"value: DisplayName, attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is a friendly name to display to your users\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Field_Type\" data-bind=\"\">Field Type</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"FieldType_SelectedId\" name=\"FieldType.SelectedId\" data-bind=\"value: FieldType\">\r\n <option value=\"Boolean\">Boolean</option>\r\n <option value=\"DateTime\">Date Time</option>\r\n <option value=\"Varchar\">Varchar</option>\r\n <option value=\"Money\">Money</option>\r\n <option value=\"Int\">Int</option>\r\n <option value=\"Double\">Double</option>\r\n <option value=\"Json\">Json</option>\r\n <option value=\"Date\">Date Only</option>\r\n <option value=\"Time\">Time Only</option>\r\n <option value=\"Percentage\">Percentage</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"FieldType\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Primary_Key\" data-bind=\"\">Primary Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" data-val-required=\"The PrimaryKey field is required.\" id=\"PrimaryKey\" name=\"PrimaryKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:PrimaryKey\"><input name=\"PrimaryKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"PrimaryKey\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Do Not Display</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:DoNotDisplay\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the column will not be displayed on Report Designer, but can still be used on Global Data Filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control-group\" data-bind=\"if: FieldType() == 'Json'\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">JSON Data Structure</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <textarea class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" data-bind=\"value: JsonStructure, attr:{placeholder:'Please paste in Sample Json with all columns for this JSON data field'}\" rows=\"5\"></textarea>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"You can paste in a sample Json blob with all the columns you want to use in this field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"column-filter\">\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Require Filter if Column is selected</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForceFilter\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the column will always require the user to pick a filtered value\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Require Filter if Table is selected</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForceFilterForTable\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the report will always require the user to pick a filter value if user picks the column in report\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: FieldType() == 'DateTime'\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Restrict Filter Date Range</label>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked: restrictDateRangeFilter\" />\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\" data-bind=\"if: restrictDateRangeFilter\">\r\n <input class=\"form-control\" type=\"number\" data-bind=\"value: restrictDateRangeNumber\" />\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\" data-bind=\"if: restrictDateRangeFilter\">\r\n <select class=\"form-select\" data-bind=\"value: restrictDateRangeValue\">\r\n <option value=\"Days\">Day(s)</option>\r\n <option value=\"Months\">Month(s)</option>\r\n <option value=\"Years\">Year(s)</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is selected, user will not be able to pick date range larger than this selection\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"column-foreign\">\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Foreign Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" data-val-required=\"The ForeignKey field is required.\" id=\"ForeignKey\" name=\"ForeignKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForeignKey\"><input name=\"ForeignKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys allows friendly selection in Filters using a Dropdown List\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Foreign Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: JoinTable, visible:ForeignKey(), options: $root.Tables.availableTables, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" style=\"display: none;\">Foreign Join</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignJoin_SelectedId\" name=\"ForeignJoin.SelectedId\" data-bind=\"value: ForeignJoin, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" style=\"display: none;\">\r\n <option selected=\"selected\" value=\"Inner\">Inner</option>\r\n <option value=\"Left\">Left</option>\r\n <option value=\"Right\">Right</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignJoin\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeId'}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\">Foreign Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignKeyField\" name=\"ForeignKeyField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignKeyField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Key field is a Column from the Foreign table which is used as the Key field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeName'}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\">Foreign Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignValueField\" name=\"ForeignValueField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignValueField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Value field is a Column from the Foreign table which is used to display the value to the User in the Report Designer\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: ForeignKey\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Only for Filter?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignFilterOnly\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Check this option if you would like to use this for Filtering only, and not for SQL Joins\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"alert alert-info\">\r\n You can setup a cascading filter by setting up a parent for the foreign key below\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Setup Foreign Key Parent?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignParentKey\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys parent allows cascading dropdown selection in Filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignParentKey(), attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Parent Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: ForeignJoinTable, visible:ForeignParentKey(), options: $root.Tables.model, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignJoinTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeId'}\">Parent Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: ForeignJoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentKeyField, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeId\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Parent Key field is a Column from the Parent table which is used as the key in cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeName'}\">Parent Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: ForeignJoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentValueField, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeName\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Parent Value field is a Column from the Parent table which is used to display the value to the User in the Report Designer for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeName'}\">Foreign Key Filter Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentApplyTo, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeName\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign Key Filter Value field is a Column from the Foreign table where the selected parent filter will be applied for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <!--<div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Require Foreign Key Parent?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignParentRequired\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys parent can be optional or set to required for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>-->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>Manage Role Access\r\n </button>\r\n @* <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\" data-bind=\"click: function(){$root.saveColumn()}\">Done</button> *@\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"modal\" id=\"joinModal\" tabindex=\"-1\" role=\"dialog\">\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Joins Diagram</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\" style=\"max-height:800px;overflow:auto;\">\r\n <div id=\"joinDiagram\" style=\"width:2000px;height:1200px;position:relative;border:1px solid #ccc;\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"modal\" id=\"procedure-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content \">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Add Stored Proc</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"row\">\r\n <label class=\"col-md-2 control-label\">\r\n Search for\r\n </label>\r\n <div class=\"col-md-6\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: searchProcedureTerm\" placeholder=\"Search stored procedures by name\" />\r\n </div>\r\n <div class=\"col-md-2\">\r\n <button class=\"btn btn-primary\" data-bind=\"click: searchStoredProcedure\">Search</button>\r\n </div>\r\n </div>\r\n <br />\r\n <div class=\"menu g-3\" style=\"margin-left: 20px;\" data-bind=\"foreach: foundProcedures\">\r\n <div class=\"menu-category card\" style=\"float:left\">\r\n <div class=\"card-header clearfix\" style=\"\">\r\n <div class=\"float-start\">\r\n <label>\r\n <span data-bind=\"text: TableName\"></span>\r\n <span class=\"label-xs\">Procedure</span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function(){$root.saveProcedure($data.TableName, true);}\">\r\n <span class=\"fa fa-save\"></span>\r\n </button>\r\n </div>\r\n <a class=\"float-end\" data-bs-toggle=\"collapse\" data-bind=\"attr: {'data-bs-target': '#sp_'+$index()}\">\r\n <span class=\"fa fa-chevron-down\"></span>\r\n </a>\r\n </div>\r\n <div data-bind=\"attr: {id: 'sp_'+$index()}\" class=\"panel-collapse collapse in\">\r\n <div class=\"card-body\">\r\n Display Name<br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <label class=\"small\">Columns</label>\r\n\r\n <div class=\"list-group\" data-bind=\"foreach: Columns\">\r\n <div class=\"list-group-item\">\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n </div>\r\n </div>\r\n <label class=\"small\">Parameters</label>\r\n\r\n <div class=\"list-group\" data-bind=\"foreach: Parameters\">\r\n <div class=\"list-group-item\">\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: ParameterDataTypeString\"></span><br />\r\n Default Value: <span data-bind=\"editable: ParameterValue\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-primary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"parameter-modal\" role=\"dialog\" tabindex=\"-1\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editParameter()\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"myModalLabel\">\r\n Manage\r\n <label data-bind=\"text: ParameterName\"></label>\r\n </h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose options that will determine how users interact with this parameter on Reports</p>\r\n <div class=\"form-horizontal\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">Display Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" name=\"DisplayName\" type=\"text\" value=\"First Name\" data-bind=\"value: DisplayName, attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is a friendly name to display to your users\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Default Value</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <span data-bind=\"editable: ParameterValue\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Hidden Parameter</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked: Hidden, enable: ParameterValue\">\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Required</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:Required\">\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Use Lookup Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" name=\"ForeignKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForeignKey\"><input name=\"ForeignKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Using lookup table allows friendly selection in report using a Dropdown List\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Lookup Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: JoinTable, visible:ForeignKey(), options: $root.Procedures.tables, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeId'}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\">Lookup Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" name=\"ForeignKeyField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignKeyField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Key field is a Column from the Foreign table which is used as the Key field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeName'}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\">Lookup Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" name=\"ForeignValueField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignValueField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Lookup Value field is a Column from the Lookup table which is used to display the value to the User in the Report Designer\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n <div class=\"modal\" id=\"role-access-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editAllowedRoles\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Manage Access by Roles</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose User Roles that will have Access</p>\r\n <p class=\"small\">Note: All Users will have access if no restricted roles are setup</p>\r\n <div data-bind=\"if: $root.allRoles().length === 0\">\r\n <div class=\"alert alert-warning\">\r\n <strong>No roles available.</strong> Please add roles first.\r\n </div>\r\n </div>\r\n <div data-bind=\"if: $root.allRoles().length > 0\">\r\n <div class=\"list-group\" data-bind=\"foreach: $root.allRoles\">\r\n <div class=\"list-group-item\" style=\"padding: 2px 10px;\">\r\n <label>\r\n <input type=\"checkbox\"\r\n data-bind=\"value: $data,\r\n checked: $root.editAllowedRoles().AllowedRoles\" />\r\n <span data-bind=\"text: $data\"></span>\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal\" id=\"category-manage-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: manageCategories\">\r\n <div class=\"modal-header\">\r\n <b class=\"modal-title\">Manage Categories for <span data-bind=\"text: TableName\"></span></b>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div data-bind=\"visble: $root.Categories().lenth == 0\">\r\n No categories have been set up yet.\r\n </div>\r\n <div class=\"list-group\" data-bind=\"foreach: $root.Categories\">\r\n <div class=\"checkbox list-group-item\" style=\"padding-top: 2px; padding-bottom: 2px;\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: $parent.Categories, checkedValue: $data\" />\r\n <span data-bind=\"text: Name\"></span> <!-- Display category name -->\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n<div class=\"modal\" id=\"category-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <b class=\"modal-title\">Manage Categories</b>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>\r\n You can organize the display of tables in the Report Designer by assigning categories here.\r\n </p>\r\n <!-- Table for Categories -->\r\n <table class=\"table table-bordered\">\r\n <thead>\r\n <tr>\r\n <th>Category Name</th>\r\n <th>Description</th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: $root.Categories\">\r\n <tr>\r\n <td>\r\n <input type=\"text\" data-bind=\"value: Name, visible: $root.editingCategoryIndex() === $index()\" class=\"form-control\" />\r\n <span id=\"cat-name\" data-bind=\"text: Name, visible: $root.editingCategoryIndex() !== $index(), attr: { id: Id ? 'cat-name-' + Id :undefined }\" style=\"color: #6c757d;\"></span>\r\n </td>\r\n <td>\r\n <input type=\"text\" data-bind=\"value: Description, visible: $root.editingCategoryIndex() === $index()\" class=\"form-control\" />\r\n <span id=\"cat-desc\" data-bind=\"text: Description, visible: $root.editingCategoryIndex() !== $index(), attr: { id: Id ? 'cat-desc-' + Id :undefined }\" style=\"color: #6c757d;\"></span>\r\n </td>\r\n <td class=\"d-flex\">\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"visible: $root.editingCategoryIndex() !== $index() && Id !== 0, click: function() { $root.toggleEdit($index()) }\">\r\n <i class=\"fa fa-edit\"></i>\r\n </button>\r\n <button class=\"btn btn-success btn-sm\" data-bind=\"visible: $root.editingCategoryIndex() === $index() && Id !== 0, click: function() { $root.saveCategory($index()) }\" style=\"margin-left: 5px;\">\r\n <i class=\"fa fa-save\"></i>\r\n </button>\r\n <button class=\"btn btn-danger btn-sm\" data-bind=\"click: $root.removeCategory\">\r\n <i class=\"fa fa-trash\"></i>\r\n </button>\r\n </td>\r\n </tr>\r\n </tbody>\r\n <tfoot>\r\n <tr>\r\n <td>\r\n <input class=\"form-control\" type=\"text\" data-bind=\"value: $root.newCategoryName\" placeholder=\"Category Name\">\r\n </td>\r\n <td>\r\n <input class=\"form-control\" type=\"text\" data-bind=\"value: $root.newCategoryDescription\" placeholder=\"Description\">\r\n </td>\r\n <td>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: $root.addCategory\">Add</button>\r\n </td>\r\n </tr>\r\n </tfoot>\r\n </table>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: $root.saveCategories\">Save</button>\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"clearfix\"></div>\r\n\r\n<div class=\"modal\" id=\"add-connection-modal\" role=\"dialog\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: newDataConnection\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\"><span data-bind=\"text: $root.editingDataConnection() ? 'Edit' : 'Add a new'\"></span> Data Connection</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose User Roles that will have Access</p>\r\n <p class=\"small\">Note: All Users will have access if no restricted roles are setup</p>\r\n\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Connection Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box\" data-val=\"true\" data-val-required=\"Connection Name is required.\" type=\"text\" data-bind=\"value: Name\" placeholder=\"\" id=\"add-conn-name\">\r\n </div>\r\n </div>\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Connection Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box\" data-val=\"true\" data-val-required=\"Connection Key is required.\" type=\"text\" data-bind=\"value: ConnectionKey\" placeholder=\"\" id=\"add-conn-key\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is the Connection Key in your application settings for your SQL Connection String\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\" data-bind=\"visible: $root.editingDataConnection\">\r\n <div class=\"check-box col-md-9 col-sm-9\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseSchema\">\r\n Use Schema\r\n </label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Use Schema in SQL when building query\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 col-form-label\">Database Type</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: DatabaseType\" required>\r\n <option>MS SQL</option>\r\n <option>MySql</option>\r\n <option>PostgreSQL</option>\r\n <option>Oracle</option>\r\n <option value=\"OleDB\">OleDB/Others</option>\r\n </select>\r\n </div>\r\n </div>\r\n\r\n <div class=\"form-group row\" data-bind=\"hidden: $root.editingDataConnection\">\r\n <div class=\"check-box col-md-12\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: copySchema\">\r\n Copy Schema from existing Connection\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\" data-bind=\"visible: copySchema\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Choose Connection</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" style=\"max-width: 300px;\" data-bind=\"options: $root.DataConnections, optionsText: 'DataConnectName', optionsValue: 'DataConnectGuid', value: copyFrom\"></select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bind=\"click: $root.updateDataConnection, visible: $root.editingDataConnection()\">Update</button>\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bind=\"click: $root.addDataConnection, visible: !$root.editingDataConnection()\">Create</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"clearfix\"></div>\r\n\r\n<div class=\"modal\" id=\"data-preview-modal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\">\r\n <div class=\"modal-content\" data-bind=\"with: previewData\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Preview Table</h4>\r\n <button type=\"button\" class=\"btn-close float-end\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div style=\"overflow-x: auto; max-height: 500px; overflow-y: auto;\">\r\n <table class=\"table table-striped table-hover table-condensed\">\r\n <thead style=\"position: sticky; top: -1px; z-index: 2; background-color: #f8f9fa;\">\r\n <tr data-bind=\"foreach: Columns\">\r\n <th>\r\n <span data-bind=\"text: ColumnName, attr: { title: DataType.replace('System.', '') }\"></span>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: Rows\">\r\n <tr data-bind=\"foreach: Items\">\r\n <td>\r\n <span data-bind=\"html: FormattedValue\"></span>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"custom-sql-modal\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"myModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\" data-bind=\"with: customSql\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Enter Select SQL for your Data</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"form-group\" data-bind=\"validationElement: customTableName\">\r\n <label for=\"custom-table-name\">Custom Table Name</label>\r\n <input type=\"text\" class=\"form-control\" name=\"customTableName\" placeholder=\"Enter table name\" data-bind=\"textInput: customTableName\" required>\r\n <div class=\"invalid-feedback\">Custom Table Name is required.</div>\r\n </div>\r\n <div data-bind=\"visible: useAi\">\r\n <p id=\"query-input\" class=\"query-input\">\r\n Show me \r\n </p>\r\n <button data-bind=\"click: buildSqlUsingAi\" class=\"btn btn-primary btn-sm\">Process with ChatGPT</button>\r\n <button data-bind=\"click: textQuery.resetQuery\" class=\"btn btn-secondary btn-sm\">Start over</button>\r\n <hr />\r\n </div>\r\n\r\n <div class=\"form-group\" data-bind=\"validationElement: customSql\">\r\n <label for=\"custom-sql\">Custom SQL</label> |\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: dynamicColumns\">\r\n <span title=\"Setup a table that returns dynamic columns to pick from\">Table with Dynamic Columns</span>\r\n </label> |\r\n <a href=\"#\" data-bind=\"click: beautifySql\">Beautify Sql</a>\r\n <textarea class=\"form-control\" style=\"height: 240px;\" name=\"customSql\" data-bind=\"textInput: customSql\" required></textarea>\r\n <div class=\"invalid-feedback\">Custom SQL is required.</div>\r\n\r\n <div data-bind=\"if: dynamicColumns\">\r\n <label>Add SQL code to use the dynamic column</label>\r\n <textarea class=\"form-control\" style=\"height: 240px;\" name=\"columnTranslation\" data-bind=\"textInput: columnTranslation\" required></textarea>\r\n <label>Pick Values Table</label>\r\n <select class=\"form-select input-medium\" data-bind=\"options: $root.Tables.availableTables, optionsText: 'DisplayName', optionsValue: 'Id', optionsCaption: 'Choose Values Table...', value: dynamicValuesTableId\"></select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: executeSql\">Save changes</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Tables/Views Json File Modal -->\r\n<div class=\"modal\" id=\"uploadTablesFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadTablesFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageTablesJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadTablesFileModalLabel\">Import Tables/Views (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerTablesFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"tablesFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleTablesFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Tables/Views File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadTablesFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Joins Json File Modal -->\r\n<div class=\"modal\" id=\"uploadJoinsFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadJoinsFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJoinsJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadJoinsFileModalLabel\">Import Joins (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerJoinsFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"joinsFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleJoinsFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Joins File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadJoinsFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<!-- Import StoredProcedures Json File Modal -->\r\n<div class=\"modal\" id=\"uploadStoredProceduresFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadStoredProceduresFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageStoredProceduresJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadStoredProceduresFileModalLabel\">Import Stored Procedures (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerStoredProceduresFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"storedProceduresFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleStoredProceduresFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Stored Procedures File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadStoredProceduresFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"modal\" id=\"searchModal\" tabindex=\"-1\" aria-hidden=\"true\" data-bind=\"with: $root\">\r\n <div class=\"modal-dialog modal-xl modal-dialog-scrollable\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Bulk Manage Reports Access and Export</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"d-flex gap-2 mb-4 align-items-center\">\r\n <input type=\"text\" class=\"form-control\" placeholder=\"Search Reports\"\r\n data-bind=\"value: searchQuery, valueUpdate: 'input'\">\r\n <button class=\"btn btn-sm btn-outline-primary flex-shrink-0\" title=\"Select all Filtered\"\r\n data-bind=\"click: selectAllFiltered\">\r\n Select All\r\n </button>\r\n <button class=\"btn btn-sm btn-outline-secondary flex-shrink-0\" title=\"Deselect all Filtered\"\r\n data-bind=\"click: deselectAllFiltered\">\r\n Deselect All\r\n </button>\r\n </div>\r\n <div data-bind=\"foreach: filteredReportsAndFolders\">\r\n <div class=\"card mb-3\">\r\n <div class=\"card-header\">\r\n <div class=\"d-flex fw-bold\">\r\n <div class=\"w-50 flex-grow-1\">\r\n <input type=\"checkbox\" data-bind=\"checked: allReportsSelected\">\r\n <span data-bind=\"text: folder\"></span>\r\n </div>\r\n <div class=\"w-25\">View</div>\r\n <div class=\"w-25\">Manage</div>\r\n <div class=\"w-25\">Delete</div>\r\n <div class=\"w-25\">Client ID</div>\r\n </div>\r\n </div>\r\n <!-- Reports List -->\r\n <ul class=\"list-group list-group-flush\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"w-50 flex-grow-1\">\r\n <input type=\"checkbox\" data-bind=\"checked: isSelected\">\r\n <span data-bind=\"text: reportName\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: viewOnlyUserRole ? viewOnlyUserRole: 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: userRole ? userRole : 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserRole ? deleteOnlyUserRole : 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: clientId ? clientId : 'Any User'\"></span>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n <div class=\"p-2 text-muted\" data-bind=\"visible: reports.length === 0\">\r\n No matching reports found\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button class=\"btn btn-success\" data-bind=\"click: exportFoldersReportJson\">Export Selected</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.openApplySecurityModal, enable: $root.anyReportSelected\">Apply Security to All Selected</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.deleteSelectedItems, enable: $root.anyReportSelected\">Delete All Selected</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"modal\" id=\"applySecurityModal\" tabindex=\"-1\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\" data-bind=\"if: $root.anyReportSelected\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Apply Security to All Selected</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div data-bind=\"template: { name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.applySecurityToAll\">Apply to All</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<!-- Import Json File Modal -->\r\n<div class=\"modal\" id=\"uploadFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadFileModalLabel\">Import previously Exported Reports</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n\r\n <div class=\"alert alert-info small\">\r\n <strong>Instructions:</strong><br />\r\n \u2022 Select a <code>.json</code> file previously exported from Dotnet Report.<br />\r\n \u2022 The file may include multiple reports and their folders.<br />\r\n \u2022 Any missing folders will be created automatically.<br />\r\n \u2022 If a report with the same name already exists, you will be prompted to:\r\n <em>Skip</em>, <em>Overwrite</em>, or <em>Make a Copy</em>.<br />\r\n \u2022 Once uploaded, all imported reports will be available immediately.\r\n </div>\r\n\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n Click here to select a JSON file\r\n </div>\r\n\r\n <input type=\"file\" id=\"fileInputJson\" accept=\".json\" style=\"display: none;\"\r\n data-bind=\"event: { change: handleFileSelect }\">\r\n\r\n <div class=\"mt-3\" data-bind=\"visible: fileName\">\r\n <p><strong>Selected File:</strong> <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"sentHistoryModal\" tabindex=\"-1\" role=\"dialog\">\r\n <div class=\"modal-dialog modal-xl modal-dialog-scrollable\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\"><i class=\"fa fa-history\"></i> Schedule Send History</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"row g-2 align-items-end mb-3 border-bottom pb-2\">\r\n <div class=\"col-sm-3\">\r\n <label class=\"form-label small mb-0\">From</label>\r\n <input type=\"date\" class=\"form-control form-control-sm\" data-bind=\"value: sentHistoryStartDate\" />\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <label class=\"form-label small mb-0\">To</label>\r\n <input type=\"date\" class=\"form-control form-control-sm\" data-bind=\"value: sentHistoryEndDate\" />\r\n </div>\r\n <div class=\"col-sm-auto\">\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { loadSentHistory(1); }, enable: !sentHistoryLoading()\">Search</button>\r\n <button class=\"btn btn-sm btn-secondary\" data-bind=\"click: function() { sentHistoryStartDate(''); sentHistoryEndDate(''); loadSentHistory(1); }, enable: !sentHistoryLoading()\">Clear</button>\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: sentHistoryLoading() && sentHistory().length === 0\" class=\"text-center py-3 text-muted\">\r\n <i class=\"fa fa-spinner fa-spin\"></i> Loading...\r\n </div>\r\n <div data-bind=\"visible: !sentHistoryLoading() && sentHistory().length === 0\" class=\"text-center py-3 text-muted\">\r\n <i class=\"fa fa-inbox\"></i> No history for this range.\r\n </div>\r\n <div data-bind=\"visible: sentHistory().length > 0\">\r\n <table class=\"table table-sm table-striped\">\r\n <thead>\r\n <tr>\r\n <th>When</th>\r\n <th>Type</th>\r\n <th>Name</th>\r\n <th>Sent To</th>\r\n <th>Format</th>\r\n <th>Result</th>\r\n <th>Message</th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: sentHistory\">\r\n <tr>\r\n <td><small data-bind=\"text: created\"></small></td>\r\n <td><span class=\"badge bg-secondary\" data-bind=\"text: itemType\"></span></td>\r\n <td data-bind=\"text: itemName || ('#' + (itemId || ''))\"></td>\r\n <td><small data-bind=\"text: sentTo\"></small></td>\r\n <td data-bind=\"text: format\"></td>\r\n <td>\r\n <span data-bind=\"css: isError ? 'badge bg-danger' : (result === 'Triggered' ? 'badge bg-info' : 'badge bg-success'), text: result\"></span>\r\n </td>\r\n <td><small class=\"text-muted\" data-bind=\"text: message\"></small></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <div class=\"d-flex justify-content-between align-items-center mt-2\">\r\n <small class=\"text-muted\">\r\n Page <span data-bind=\"text: sentHistoryPage\"></span> of <span data-bind=\"text: sentHistoryTotalPages\"></span>\r\n (<span data-bind=\"text: sentHistoryTotal\"></span> total)\r\n </small>\r\n <div>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: function() { loadSentHistory(sentHistoryPage() - 1); }, enable: sentHistoryPage() > 1 && !sentHistoryLoading()\">\r\n <i class=\"fa fa-chevron-left\"></i> Prev\r\n </button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: function() { loadSentHistory(sentHistoryPage() + 1); }, enable: sentHistoryPage() < sentHistoryTotalPages() && !sentHistoryLoading()\">\r\n Next <i class=\"fa fa-chevron-right\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: function() { loadSentHistory(sentHistoryPage()); }\">\r\n <span class=\"fa fa-refresh\"></span> Refresh\r\n </button>\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->\r\n</div>", styles: [".glyphicon-ok:before{content:\"\\f00c\"}.glyphicon-remove:before{content:\"\\f00d\"}.glyphicon{display:inline-block;font: 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.table-name-label{display:inline-block;max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
13509
13509
|
}
|
|
13510
13510
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DotnetsetupComponent, decorators: [{
|
|
13511
13511
|
type: Component,
|
|
13512
|
-
args: [{ selector: 'app-dotnetsetup', standalone: true, imports: [CommonModule], template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n\r\n<div>\r\n <h2>Manage Database</h2>\r\n <p>\r\n You can select and manage display names for the Tables and Columns you would like to allow in Dotnet Report Builder.\r\n </p>\r\n <div class=\"alert alert-danger d-flex justify-content-between align-items-center\">\r\n <div>\r\n Do not expose this Setup Tool to end users who should not have access to it. Ideally, only Developers should be given access to this utility.\r\n </div>\r\n <button class=\"btn btn-primary ms-3\" data-bind=\"click: refreshAll\" title=\"Reload all Table and Columns\">\r\n <i class=\"fa fa-refresh\"></i> Refresh\r\n </button>\r\n </div>\r\n\r\n <div data-bind=\"visible: false;\">\r\n Loading...\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <!-- Nav tabs -->\r\n <ul class=\"nav nav-tabs flex-grow-1\" role=\"tablist\">\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link active\" href=\"#tablesfields\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\" data-bind=\"click: function() { customTableMode(false); activeTable(null);}\">\r\n <i class=\"fa fa-database\"></i> Database Tables\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#tablesfields\" aria-controls=\"custom\" role=\"tab\" data-bs-toggle=\"tab\" data-bind=\"click: function() { customTableMode(true); activeTable(null); }\">\r\n <i class=\"fa fa-table\"></i> Custom Tables\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#relations\" aria-controls=\"profile\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-link\"></i> Relations\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#procedure\" aria-controls=\"procedure\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-code\"></i> Stored Procs\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#schedules\" aria-controls=\"schedules\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-clock\"></i> Schedules\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\" data-bind=\"visible: settings.useFunctions\">\r\n <a class=\"nav-link\" href=\"#functions\" aria-controls=\"functions\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-cogs\"></i> Custom Functions\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#manageaccess\" aria-controls=\"manageaccess\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-folder\"></i> Manage Reports\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#connection\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-plug\"></i> Data Settings\r\n </a>\r\n </li>\r\n </ul>\r\n\r\n </div>\r\n <br />\r\n</div>\r\n<!-- Tab panes -->\r\n<div class=\"fix-content\" style=\"display: none;\" data-bind=\"visible: true\">\r\n <div class=\"tab-content\">\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"connection\">\r\n <b>Manage Data Connection</b>\r\n <p>\r\n Data Connection groups data schemas (including tables and stored procedures and other configuration), Reports, and Dashboards into a single environment. You can create multiple Data Connections and easily switch between them for separate environment management.\r\n </p>\r\n <hr />\r\n <div class=\"form-row\" data-bind=\"visible: true\">\r\n <div class=\"form-group\">\r\n <div class=\"control-group\">\r\n <select class=\"form-select\" style=\"width:25%\" data-bind=\"options: DataConnections, optionsText: 'DataConnectName', optionsValue: 'DataConnectGuid', value: currentConnectionKey\"></select>\r\n <div class=\"padded-top\"></div>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"visible: false\" data-bs-toggle=\"modal\" data-bs-target=\"#connection-setup-modal\">Manage DB Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: switchConnection, visible: canSwitchConnection\">Switch Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: editDataConnectionModal, hidden: canSwitchConnection\" data-bs-toggle=\"modal\" data-bs-target=\"#add-connection-modal\">Edit Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: newDataConnectionModal\" data-bs-toggle=\"modal\" data-bs-target=\"#add-connection-modal\">Add New Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: exportAll, visible: false\">Export Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: importStart, visible: false\">Import Connection</button>\r\n </div>\r\n <div data-bind=\"visible: importingFile\">\r\n <br />\r\n <div class=\"alert alert-info\">\r\n Please select a file you have previously exported from this utility. The system will load the screen with the Data Connection setting in the file, however, it will <b>NOT</b> be saved until you press the Save All button or Save individual tables\r\n <br />\r\n <div class=\"input-group\">\r\n <input type=\"file\" accept=\".json\" id=\"import-file\" data-bind=\"event: { change: function() { importFile($element.files[0]) } }\" />\r\n <span class=\"input-group-btn\">\r\n <button class=\"btn btn-link\" data-bind=\"click: importCancel\">Cancel</button>\r\n </span>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <br />\r\n <br />\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <b>Account Level Settings</b>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"with: settings\">\r\n <div class=\"row\">\r\n <div class=\"col-md-6\">\r\n <h6 class=\"mt-2 mb-2\">Admin Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useClientIdInAdmin\" data-bind=\"checked: useClientIdInAdmin\">\r\n <label class=\"form-check-label\" for=\"useClientIdInAdmin\">Use Client ID in Admin mode</label>\r\n <small class=\"text-muted d-block\">Enable this to respect client IDs even when in admin mode.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useSqlBuilderInAdminMode\" data-bind=\"checked: useSqlBuilderInAdminMode\">\r\n <label class=\"form-check-label\" for=\"useSqlBuilderInAdminMode\">Use SQL Builder in Admin Mode</label>\r\n <small class=\"text-muted d-block\">Allows SQL query builder access <b>only</b> in admin mode.</small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Customization</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useSqlCustomField\" data-bind=\"checked: useSqlCustomField\">\r\n <label class=\"form-check-label\" for=\"useSqlCustomField\">Use SQL in Custom Field</label>\r\n <small class=\"text-muted d-block\">Allows the use of SQL expressions in custom fields.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showDesignerHints\">\r\n <label class=\"form-check-label\">Show Designer Tips & Guidance</label>\r\n <small class=\"text-muted d-block\">Display contextual tips and explanations throughout the report designer to help users understand available options.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useAltPivot\">\r\n <label class=\"form-check-label\">Pivot with Drilldown</label>\r\n <small class=\"text-muted d-block\">Use alternate Pivot method that doesn\u2019t use SQL\u2019s PIVOT.<br>Allows drilldown, but may be slower.</small>\r\n </div>\r\n <div class=\"form-check\" data-bind=\"visible: isEnterprise\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useFunctions\">\r\n <label class=\"form-check-label\">Use Functions</label>\r\n <small class=\"text-muted d-block\">\r\n Enable calculated functions for List reports only.<br>\r\n Available for Enterprise license users.\r\n </small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Report Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"allowUsersToCreateReports\" data-bind=\"checked: allowUsersToCreateReports\">\r\n <label class=\"form-check-label\" for=\"allowUsersToCreateReports\">Allow All Users to Create Reports</label>\r\n <small class=\"text-muted d-block\">Permits users to generate and customize reports.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showImportExport\">\r\n <label class=\"form-check-label\">Allow All Users to export/import\u00A0reports</label>\r\n <small class=\"text-muted d-block\">\r\n Allow non admin users to export and import Reports in the system.\r\n </small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: canCopyReport\">\r\n <label class=\"form-check-label\">Always allow users to copy\u00A0reports</label>\r\n <small class=\"text-muted d-block\">\r\n Allow users with View Only access to copy Reports in the system.\r\n </small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showScheduling\">\r\n <label class=\"form-check-label\">Hide Report/Dashboard Scheduling</label>\r\n <small class=\"text-muted d-block\">\r\n Removes scheduling in reports and dashboard, select only if you don't want to use scheduling feature.\r\n </small>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <h6 class=\"mt-2 mb-2\">Folder Options</h6>\r\n <div class=\"form-check\" data-bind=\"visible: false\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"noFolders\" data-bind=\"checked: noFolders\">\r\n <label class=\"form-check-label\" for=\"noFolders\">No Folders</label>\r\n <small class=\"text-muted d-block\">Disables the use of folders in the application.</small>\r\n </div>\r\n <div class=\"form-check\" data-bind=\"visible: false\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"noDefaultFolder\" data-bind=\"checked: noDefaultFolder\">\r\n <label class=\"form-check-label\" for=\"noDefaultFolder\">No Default Folder</label>\r\n <small class=\"text-muted d-block\">Removes the Default folder.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showEmptyFolders\">\r\n <label class=\"form-check-label\">Show Empty Folders</label>\r\n <small class=\"text-muted d-block\">Will show empty folders for non admin users.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"allowUsersToManageFolders\" data-bind=\"checked: allowUsersToManageFolders\">\r\n <label class=\"form-check-label\" for=\"allowUsersToManageFolders\">Allow All Users to Manage Folders</label>\r\n <small class=\"text-muted d-block\">Grants permission to organize and manage folders without admin mode.</small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Export Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useAltPdf\">\r\n <label class=\"form-check-label\">PDF Export without Chromium</label>\r\n <small class=\"text-muted d-block\">Use alternate PDF export method that doesn\u2019t rely on Chromium.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: dontXmlExport\">\r\n <label class=\"form-check-label\">Hide XML Export option</label>\r\n <small class=\"text-muted d-block\">Remove XML Export option.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: dontWordExport\">\r\n <label class=\"form-check-label\">Hide Word Export option</label>\r\n <small class=\"text-muted d-block\">Remove Word Export option.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showPageSize\">\r\n <label class=\"form-check-label\">Show Page Size on PDF & Word export</label>\r\n <small class=\"text-muted d-block\">Display document dimensions in exported PDF & Word.</small>\r\n </div>\r\n\r\n <h6 class=\"mt-3 mb-2\">AI Assistant <span class=\"badge bg-warning text-dark\" style=\"font-size: 10px;\">BETA</span></h6>\r\n <div class=\"mb-2\">\r\n <div class=\"form-check form-switch\">\r\n <input class=\"form-check-input\" type=\"checkbox\" role=\"switch\" id=\"aiEnabledSwitch\"\r\n data-bind=\"checked: aiEnabled\">\r\n <label class=\"form-check-label\" for=\"aiEnabledSwitch\">Enable AI Report Assistant</label>\r\n </div>\r\n <small class=\"text-muted d-block\">When enabled, an AI-powered assistant will be available in the report designer to help build reports using natural language.</small>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mt-3\">\r\n <button type=\"button\" id=\"saveAppSettings\" class=\"btn btn-primary\" data-bind=\"click: saveAppSettings\">Save</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div role=\"tabpanel\" class=\"tab-pane active\" id=\"tablesfields\">\r\n <b data-bind=\"text: customTableMode() ? 'Custom Tables' : 'Database Tables'\"></b>\r\n <p>\r\n <span data-bind=\"visible: $root.customTableMode\">\r\n Define Custom Tables using SQL Select Query to use in Dotnet Report for Reporting and Analytics.\r\n </span>\r\n <span data-bind=\"hidden: $root.customTableMode\">\r\n Select Tables or Views from your Database to use in Dotnet Report for Reporting and Analytics.\r\n </span>\r\n </p>\r\n\r\n <div data-bind=\"with: Tables\">\r\n <input type=\"text\" class=\"form-control input-sm\" placeholder=\"Filter Tables...\" data-bind=\"value: tableFilter, valueUpdate: 'afterkeydown'\" style=\"float: left; width: 180px; margin-right: 5px;\">\r\n <button class=\"btn btn-outline-secondary btn-sm\" data-bind=\"click: clearTableFilter, visible: tableFilter()!='' && tableFilter()!=null\"><span class=\"fa fa-remove\"></span></button>\r\n <button class=\"btn btn-outline-secondary btn-sm\" data-bind=\"click: toggleShowAll, hidden: $root.customTableMode() || $root.onlyApi(), text: usedOnly() ? 'Show all' : 'Show used only'\">Show used only</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.customSql.addNewCustomSqlTable, visible: $root.customTableMode\">Add New Custom Table</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.loadFromDatabase, hidden: $root.customTableMode() || !$root.onlyApi()\">\r\n <span class=\"fa fa-database\"></span> Load all Database Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.visualizeJoins\"><span class=\"fa fa-arrows-h\"></span> Visualize Joins</button> \r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: function() { exportTablesJson(true) }, visible: $root.customTableMode\">\r\n <span class=\"fa fa-download\"></span> Export Custom Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: function() { exportTablesJson(false) }, visible: !$root.customTableMode()\">\r\n <span class=\"fa fa-download\"></span> Export Tables/Views\r\n </button>\r\n\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadTablesFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-file\"></span> Import Tables/Views\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" title=\"Manage Categories\" data-bs-toggle=\"modal\" data-bs-target=\"#category-modal\">\r\n <span class=\"fa fa-server\"></span> Manage Categories\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { selectAll(false)},visible: !$root.customTableMode()\">\r\n Select All Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { selectAll(true)}, visible: $root.customTableMode\">\r\n Select All Custom Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { unselectAll(false)},visible: !$root.customTableMode()\">\r\n UnSelect All Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { unselectAll(true)}, visible: $root.customTableMode\">\r\n UnSelect All Custom Tables \r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { $root.saveChanges($root.customTableMode()) }\">\r\n <span class=\"fa fa-floppy\"></span> Save All Tables\r\n </button>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n <hr />\r\n\r\n <div class=\"row\">\r\n <div class=\"col-12 col-md-4 col-lg-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n\r\n <div class=\"row\">\r\n <div data-bind=\"ifnot: $root.customTableMode\">\r\n <div class=\"alert alert-info\">\r\n <span data-bind=\"text: Tables.model().filter(t => !t.CustomTable()).length\"></span> Tables/Views\r\n <span data-bind=\"text: $root.onlyApi() ? 'configured and used' : 'read from database'\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"menu g-3\" data-bind=\"foreach: pagedTables\">\r\n <div class=\"menu-category card\">\r\n <div class=\"card-header clearfix\">\r\n <div class=\"checkbox float-start\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected\" title=\"Check to use in Dotnet Report, uncheck to Remove\">\r\n <span data-bind=\"text: TableName, attr: { title: TableName }, click: function() { $root.activeTable($data); }\" class=\"table-name-label\" style=\"cursor: pointer\"></span>\r\n <span data-bind=\"visible: SchemaName, text: SchemaName\" title=\"schema\" class=\"text-muted small\"></span>\r\n <span data-bind=\"visible: IsView\" class=\"label label-sm\">(view)</span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Table\" data-bind=\"click: function() { saveTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fas fa-save\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Preview this Table\" data-bind=\"click: function() { previewTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-table\"></i>\r\n </button>\r\n </div>\r\n <a class=\"float-end\" data-bind=\"click: function() { $root.activeTable($data); }\">\r\n <span class=\"fa fa-chevron-right\" style=\"cursor: pointer\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"row mt-3\">\r\n <div class=\"d-flex flex-column col-md-12\" data-bind=\"with: pager\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n <div class=\"text-muted small mt-0 pt-0\" style=\"padding-left: 3px\" data-bind=\"text: 'Total Records: ' + totalRecords()\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-12 col-md-8 col-lg-9\" id=\"tableDetails\">\r\n <div data-bind=\"visible: pagedTables().length === 0\">\r\n <br />\r\n <svg style=\"width:40px;float:left;transform:rotate(-45deg) translateY(6px);transform-origin:center center;\" fill=\"#000000\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" class=\"icon flat-line\"><g stroke-width=\"0\"></g><g stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke=\"#CCCCCC\" stroke-width=\"0.048\"></g><g><path d=\"M18,21A13.17,13.17,0,0,1,9,8.51V3\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></path><polyline points=\"12 6 9 3 6 6\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></polyline></g></svg>\r\n <div class=\"mt-3 fw-bold\" style=\"float:left; padding-left: 5px;\">No <span data-bind=\"visible: $root.customTableMode\">Custom </span> Tables added yet, click \"<span data-bind=\"text: customTableMode() ? 'Add New Custom Table' : 'Load All Tables'\"></span>\" to get started!</div>\r\n </div>\r\n\r\n <div data-bind=\"visible: !activeTable() && pagedTables().length > 0\">\r\n <br />\r\n <br />\r\n <svg style=\"width:40px;float:left;transform:rotate(-45deg) translateY(6px);transform-origin:center center;\" fill=\"#000000\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" class=\"icon flat-line\"><g stroke-width=\"0\"></g><g stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke=\"#CCCCCC\" stroke-width=\"0.048\"></g><g><path d=\"M18,21A13.17,13.17,0,0,1,9,8.51V3\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></path><polyline points=\"12 6 9 3 6 6\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></polyline></g></svg>\r\n <div class=\"mt-3 fw-bold\" style=\"float:left; padding-left: 5px;\">Select a <span data-bind=\"visible: $root.customTableMode\">Custom </span> Table, or \"<span data-bind=\"text: customTableMode() ? 'Add New Custom Table' : 'Load All Tables'\"></span>\"</div>\r\n </div>\r\n\r\n <div data-bind=\"with: activeTable\">\r\n <div class=\"card my-3\">\r\n <div class=\"card-header\">\r\n <h5>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected\" title=\"Check to use in Dotnet Report, uncheck to Remove\">\r\n <span data-bind=\"text: TableName\"></span>\r\n <span data-bind=\"visible: IsView\" class=\"label-sm\">(view)</span>\r\n </h5>\r\n <button class=\"btn btn-sm\" title=\"Save this Table\" data-bind=\"click: function() { saveTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fas fa-save\"></i> Save Changes\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Preview this Table\" data-bind=\"click: function() { previewTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-table\"></i> Preview Data\r\n </button>\r\n <button class=\"btn btn-sm btn-danger\" title=\"Delete this Table\" data-bind=\"click: function() { deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-trash\"></i> Remove Table\r\n </button>\r\n </div>\r\n <div class=\"card-body\">\r\n <p class=\"float-end\">\r\n <button class=\"btn btn-sm\" title=\"Manage Category\" data-bs-toggle=\"modal\" data-bs-target=\"#category-manage-modal\" data-bind=\"click: $root.selectedCategory\">\r\n <i class=\"fa fa-gear\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Export this Table\" data-bind=\"click: function() { exportTableJson(); }\">\r\n <i class=\"fa fa-file\"></i>\r\n </button>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Display Name</label><br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Schema Name</label><br />\r\n <span data-bind=\"editable: SchemaName\"></span>\r\n </p>\r\n <p style=\"display: none;\">\r\n <!-- deprecated -->\r\n <label class=\"label-sm\">Account Id Field</label><br />\r\n <span data-bind=\"editable: AccountIdField\"></span>\r\n </p>\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked: DoNotDisplay\">\r\n Do Not Display\r\n </label>\r\n </div>\r\n <div data-bind=\"if: CustomTable\">\r\n <button class=\"btn btn-sm btn-secondary\" data-bind=\"click: $root.customSql.viewCustomSql.bind($data)\">View Custom SQL</button>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center justify-content-end gap-2\">\r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: addNewColumn, visible: false\">\r\n <i class=\"fa fa-plus\"></i> Add Column\r\n </button>\r\n <label class=\"label-sm m-0\"><span data-bind=\"text: Columns().length\"></span> Columns</label>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: autoFormat, visible: Selected\">Auto Format</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: autoSort, visible: Selected\">Auto Sort</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: unselectAllColumns, visible: Selected\">Unselect All</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: selectAllColumns, visible: Selected\">Select All</button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"list-group\" data-bind=\"sortable: { data: Columns, options: { handle: '.sortable', cursor: 'move' }, afterMove: $root.Tables.columnSorted }\">\r\n <div class=\"list-group-item\">\r\n <div data-bind=\"if: $parent.DynamicColumns()\">\r\n <span data-bind=\"html: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n </div>\r\n <div class=\"checkbox\" data-bind=\"if: !$parent.DynamicColumns()\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected, enable: $parent.Selected()\">\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n <label data-bind=\"visible: PrimaryKey\" class=\"badge text-bg-primary\">Primary</label>\r\n <label data-bind=\"visible: ForeignKey\" class=\"badge text-bg-info text-white\">Foreign</label>\r\n <label class=\"badge text-bg-warning\" data-bind=\"visible: isNew\">New</label>\r\n </label>\r\n <button class=\"btn btn-sm float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#column-modal\" title=\"All column options\" data-bind=\"click: $root.selectColumn.bind($data, false)\">...</button>\r\n <div class=\"btn btn-sm float-end sortable\">\r\n <span class=\"fa fa-arrows\" aria-hidden=\"true\" title=\"Drag to reorder\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"relations\">\r\n <b>Relations</b>\r\n <p>\r\n Setup your Database Relations for Dotnet Report to produce dynamic queries\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: AddAllRelations\">Auto Add Joins</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: AddJoin\">Add new Join</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: SaveJoins\">Save Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: visualizeJoins\">Visualize Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: DeleteVisibleJoins\" title=\"Delete filtered Joins\">Delete Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: ExportJoins\" title=\"Export filtered Joins\">Export Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadJoinsFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-upload\"></span> Import Joins\r\n </button>\r\n <hr />\r\n <div id=\"form-joins\">\r\n <div class=\"alert alert-warning\" data-bind=\"visible: isDirty\">\r\n You have unsaved changes. Please be sure to click <b>Save Joins</b> to save your changes.\r\n </div>\r\n\r\n <div class=\"container-fluid\">\r\n <div class=\"row fw-bold bg-light border-bottom py-2\" data-bind=\"with: JoinFilters\">\r\n <!-- Repeat for each column header -->\r\n <div class=\"col-md-1\" style=\"max-width: 40px;\"></div>\r\n <div class=\"col-md-2\">\r\n Primary Table\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: primaryTable, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\" />\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: primaryField, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\" />\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1\">\r\n Join Type\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinType, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Join Table\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinTable, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinField, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\"></div>\r\n </div>\r\n\r\n <!-- New Join Row -->\r\n <div class=\"row bg-info bg-opacity-25 p-2\" data-bind=\"visible: showNewJoinRow\">\r\n <div class=\"col-md-1\" style=\"max-width: 40px;\"></div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: Tables.availableTables, optionsText: 'DisplayName', value: NewJoin().JoinTable, optionsCaption: 'Pick a table...'\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: NewJoin().JoinTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsCaption: 'Pick a field...', optionsValue: 'ColumnName', value: $root.NewJoin().FieldName\"></select>\r\n </div>\r\n <div class=\"col-md-1\">\r\n <select class=\"form-select\" data-bind=\"options: $root.JoinTypes, value: NewJoin().JoinType\"></select>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: NewJoin().OtherTables, optionsText: 'DisplayName', value: NewJoin().OtherTable, optionsCaption: 'Pick a table...'\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: NewJoin().OtherTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $root.NewJoin().JoinFieldName, optionsCaption: 'Pick a field...'\"></select>\r\n </div>\r\n <div class=\"col-md-2 text-end\">\r\n <button class=\"btn btn-success btn-sm\" data-bind=\"click: ConfirmAddJoin\">+ Add Join</button>\r\n </div>\r\n </div>\r\n\r\n <!-- Existing Join Rows with drag reorder -->\r\n <div data-bind=\"sortable: { data: reorderableJoins, options: { handle: '.join-drag-handle', cursor: 'move' }, afterMove: $root.joinSorted }\">\r\n <div class=\"row align-items-center border-bottom py-2\">\r\n <div class=\"col-md-1 text-center\" style=\"max-width: 40px;\">\r\n <span class=\"btn btn-sm btn-outline-secondary join-drag-handle\" title=\"Drag to reorder\"><i class=\"fa fa-bars\"></i></span>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: $root.Tables.availableTables, optionsText: 'DisplayName', value: JoinTable\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: JoinTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $parent.FieldName\"></select>\r\n </div>\r\n <div class=\"col-md-1\">\r\n <select class=\"form-select\" data-bind=\"options: $root.JoinTypes, value: JoinType\"></select>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: OtherTables, optionsText: 'DisplayName', value: OtherTable\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: OtherTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $parent.JoinFieldName\"></select>\r\n </div>\r\n <div class=\"col-md-2 text-end\">\r\n <span class=\"badge bg-warning text-dark me-2\"\r\n data-bind=\"visible: isNew\"\r\n data-bs-toggle=\"tooltip\"\r\n title=\"New record added or imported, not saved yet\">\r\n <i class=\"fa fa-warning\"></i> New\r\n </span>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"click: DeleteJoin\">Delete</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"row mt-3\"> \r\n <div class=\"d-flex flex-row align-items-center col-md-12\" data-bind=\"with: joinsPager\"> \r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n <div class=\"text-muted small mt-0 pt-0\" style=\"padding-left: 3px\" data-bind=\"text: 'Total Records: ' + totalRecords()\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <br />\r\n <br />\r\n </div>\r\n <div id=\"procedure\" class=\"tab-pane\">\r\n <b>Stored Procedures</b>\r\n <p>\r\n Select and manage Stored Procedures to use in Dotnet Report for more complex and coded Reports\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#procedure-modal\"><span class=\"fa fa-plus\"></span> Add Stored Procs from database</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadStoredProceduresFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-file\"></span> Import Stored Procedures\r\n </button>\r\n <hr />\r\n <div data-bind=\"if: Procedures.savedProcedures().length == 0\">\r\n <br />\r\n No Stored Procedures have been setup yet.\r\n </div>\r\n <div class=\"row\" data-bind=\"if: Procedures.savedProcedures().length > 0\">\r\n <!-- Left Panel for Stored Procedure Names -->\r\n <div class=\"col-12 col-md-4 col-lg-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n <div class=\"menu g-3\" data-bind=\"foreach: Procedures.savedProcedures\">\r\n <div class=\"menu-category card\">\r\n <div class=\"card-header clearfix\">\r\n <div class=\"float-start\">\r\n <label>\r\n <span data-bind=\"text: TableName, click: function() { $root.activeProcedure($data); }\" style=\"cursor: pointer\"></span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function() { $root.saveProcedure($data.TableName, false); }\">\r\n <span class=\"fa fa-save\"></span>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Delete this Procedure\" data-bind=\"click: function() { $data.deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <span class=\"fa fa-trash\"></span>\r\n </button>\r\n </div>\r\n <!-- Click to activate procedure -->\r\n <a class=\"float-end\" data-bind=\"click: function() { $root.activeProcedure($data); }\">\r\n <span class=\"fa fa-chevron-right\" style=\"cursor: pointer\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Right Panel for Stored Procedure Details -->\r\n <div class=\"col-12 col-md-8 col-lg-9\" id=\"procDetails\">\r\n <div data-bind=\"with: activeProcedure\">\r\n <div class=\"card my-3\">\r\n <div class=\"card-header\">\r\n <h5 data-bind=\"text: TableName\"></h5>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function() { $root.saveProcedure($data.TableName, false); }\">\r\n <span class=\"fa fa-save\"></span> Save Changes\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Delete this Procedure\" data-bind=\"click: function() { $data.deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <span class=\"fa fa-trash\"></span> Delete\r\n </button>\r\n </div>\r\n <div class=\"card-body\">\r\n <p class=\"float-end\">\r\n <button class=\"btn btn-sm\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Export this Procedure\" data-bind=\"click: function() { $root.exportProcedureJson($data.TableName); }\">\r\n <i class=\"fa fa-file\"></i>\r\n </button>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Display Name</label><br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Schema Name</label><br />\r\n <span data-bind=\"editable: SchemaName\"></span>\r\n </p>\r\n <label class=\"small\">Columns</label>\r\n <div class=\"list-group\" data-bind=\"foreach: Columns\">\r\n <div class=\"list-group-item\">\r\n <label>\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n </label>\r\n <button class=\"btn btn-sm float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#column-modal\" title=\"All column options\" data-bind=\"click: $root.selectColumn.bind($data, true)\">...</button>\r\n </div>\r\n </div>\r\n <label class=\"small\">Parameters</label>\r\n <div class=\"list-group\" data-bind=\"foreach: Parameters\">\r\n <div class=\"list-group-item\">\r\n <label>\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ParameterName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: ParameterDataTypeString\"></span>\r\n \r\n <button class=\"btn btn-sm btn-primary float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#parameter-modal\" title=\"All Parameter options\" data-bind=\"click: $root.editParameter\">...</button>\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div id=\"manageaccess\" class=\"tab-pane\">\r\n <ul class=\"nav nav-tabs\" id=\"accessTabs\" role=\"tablist\">\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link active\" id=\"reports-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#reportsAccess\" type=\"button\" role=\"tab\">Reports Access</button>\r\n </li>\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link\" id=\"folders-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#foldersAccess\" type=\"button\" role=\"tab\">Folders Access</button>\r\n </li>\r\n </ul>\r\n <div class=\"tab-content mt-3\">\r\n <div class=\"tab-pane fade show active\" id=\"reportsAccess\" role=\"tabpanel\" aria-labelledby=\"reports-tab\">\r\n <b>Reports Access</b>\r\n <p>You can setup access to individual Reports here</p>\r\n <div class=\"mb-2 d-flex gap-2\">\r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { exportFoldersReportJson() }\">\r\n <span class=\"fa fa-download\"></span> Export Selected Reports\r\n </button>\r\n </div> \r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadFileModal\">\r\n <span class=\"fa fa-upload\"></span> Import Reports\r\n </button>\r\n </div>\r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#searchModal\">\r\n <span class=\"fa fa-tasks\"></span> Bulk Actions\r\n </button>\r\n </div>\r\n </div>\r\n <hr />\r\n <div data-bind=\"foreach: reportsAndFolders\" class=\"list-group\">\r\n <div class=\"list-group-item\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <input type=\"checkbox\" class=\"form-check-input\"\r\n data-bind=\"checked: allReportsSelected\">\r\n <label>\r\n <a data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folder-' + folderId }\">\r\n <i class=\"fa fa-folder\"></i> <span data-bind=\"text: folder\"></span>\r\n </a>\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"collapse\" data-bind=\"attr: {id: 'folder-' + folderId }\">\r\n <div data-bind=\"if: reports.length == 0\">\r\n No Reports found in this folder\r\n </div>\r\n <ul class=\"list-group\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\">\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input\" type=\"checkbox\" data-bind=\"checked: isSelected\" />\r\n <label class=\"list-group-item-heading\">\r\n <span class=\"fa\" data-bind=\"css: {'fa-file': reportType=='List', 'fa-th-list': reportType=='Summary', 'fa-bar-chart': reportType=='Bar', 'fa-pie-chart': reportType=='Pie', 'fa-line-chart': reportType=='Line', 'fa-globe': reportType =='Map'}\" style=\"font-size: 14pt; color: #808080\"></span>\r\n <span data-bind=\"text: reportName\"></span>\r\n </label>\r\n </div>\r\n <p class=\"list-group-item-text small\" data-bind=\"text: reportDescription\"></p>\r\n <div class=\"small\" style=\"padding-top: 10px;\">\r\n <b>Current Report Access</b><br />\r\n Manage by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: userId() ? userId() : 'Any User'\"></span><br />\r\n View only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: (viewOnlyUserId() ? viewOnlyUserId() : (userId() ? userId() : 'Any User'))\"></span><br />\r\n <div data-bind=\"if: deleteOnlyUserId()\">\r\n Delete only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserId()\"></span><br />\r\n </div>\r\n <div data-bind=\"if: userRole()\">\r\n Manage by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: userRole() ? userRole() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: viewOnlyUserRole()\">\r\n View only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: viewOnlyUserRole() ? viewOnlyUserRole() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: deleteOnlyUserRole()\">\r\n Delete only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserRole() ? deleteOnlyUserRole() : 'Same as Manage'\"></span><br />\r\n </div>\r\n <div>\r\n For Client <span class=\"badge text-bg-info text-white\" data-bind=\"text: clientId() ? clientId() : 'All Clients'\"></span><br />\r\n </div>\r\n </div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeAccess(!changeAccess())}, text: !changeAccess() ? 'Change Access': 'Cancel Changing Access', hidden: changeAccess\">Change Access</button>\r\n </div>\r\n <div data-bind=\"if: changeAccess\" class=\"col-md-9\">\r\n <div style=\"padding-left: 10px;\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: saveAccessChanges\">Save Access Changes</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeAccess(!changeAccess())}, text: !changeAccess() ? 'Change Access': 'Cancel Changing Access'\">Change Access</button>\r\n </div>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"tab-pane fade\" id=\"foldersAccess\" role=\"tabpanel\" aria-labelledby=\"folders-tab\">\r\n <b>Folders Access</b>\r\n <p>You can setup access to individual Folders here</p>\r\n <hr />\r\n <div data-bind=\"foreach: Folders\" class=\"list-group\">\r\n <div class=\"list-group-item\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <a data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folderAccess-' + Id }\">\r\n <i class=\"fa fa-folder\"></i> <span data-bind=\"text: FolderName\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n <div class=\"collapse\" data-bind=\"attr: {id: 'folderAccess-' + Id }\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\">\r\n <div class=\"small\" style=\"padding-top: 10px;\">\r\n <b>Current Folder Access</b><br />\r\n Manage by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserId()? UserId() : 'Any User'\"></span><br />\r\n View only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: (ViewOnlyUserId() ? ViewOnlyUserId() : (UserId() ? UserId() : 'Any User'))\"></span><br />\r\n <div data-bind=\"if: DeleteOnlyUserId()\">\r\n Delete only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: DeleteOnlyUserId()\"></span><br />\r\n </div>\r\n <div data-bind=\"if: UserRoles()\">\r\n Manage by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserRoles() ? UserRoles() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: ViewOnlyUserRoles()\">\r\n View only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: ViewOnlyUserRoles() ? ViewOnlyUserRoles() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: DeleteOnlyUserRoles()\">\r\n Delete only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: DeleteOnlyUserRoles() ? DeleteOnlyUserRoles() : 'Same as Manage'\"></span><br />\r\n </div>\r\n <div>\r\n For Client <span class=\"badge text-bg-info text-white\" data-bind=\"text: ClientId() ? ClientId() : 'All Clients'\"></span><br />\r\n </div>\r\n </div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeFolderAccess(!changeFolderAccess())}, text: !changeFolderAccess() ? 'Change Access': 'Cancel Changing Access', hidden: changeFolderAccess\">Change Access</button>\r\n </div>\r\n <div data-bind=\"if: changeFolderAccess\" class=\"col-md-9\">\r\n <div style=\"padding-left: 10px;\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: saveFolderAccessChanges\">Save Access Changes</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeFolderAccess(!changeFolderAccess())}, text: !changeFolderAccess() ? 'Change Access': 'Cancel Changing Access'\">Change Access</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"functions\" data-bind=\"with: Functions\">\r\n <b>Custom Functions</b>\r\n <p>\r\n Create and manage Custom Function that you can use in building Reports and Dashboards\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"visible: $root.settings.canAddFunction,click: createNewFunction\">Add new Function</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: buildCustomFunctions\">Rebuild Functions Library</button>\r\n <br />\r\n <hr />\r\n\r\n <div class=\"container-fluid\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n <input id=\"searchInput\" class=\"form-control mb-2\" type=\"text\" placeholder=\"Search...\" data-bind=\"value: search, valueUpdate: 'input', visible: functions().length > 0\">\r\n <ul class=\"list-group\" data-bind=\"foreach: filteredFunctions\">\r\n <li class=\"list-group-item d-flex justify-content-between align-items-center\">\r\n <span data-bind=\"text: name\"></span>\r\n <div>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: $parent.selectFunction\">Edit</button>\r\n <button class=\"btn btn-danger btn-sm\" data-bind=\"click: function() { $parent.deleteFunction($data) }\">Delete</button>\r\n </div>\r\n </li>\r\n </ul>\r\n <div data-bind=\"if: functions().length == 0\">\r\n No Functions found\r\n </div>\r\n </div>\r\n <div class=\"col-md-9\" data-bind=\"with: selectedFunction\">\r\n <div style=\"padding-left: 10px;\">\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <b>Setup Function</b>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"mb-3\" data-bind=\"validationElement: functionName\">\r\n <label for=\"functionName\" class=\"form-label\">Function Name</label>\r\n <input id=\"functionName\" class=\"form-control\" required data-bind=\"value: name, valueUpdate: 'input'\" />\r\n <div class=\"invalid-feedback\">Function Name is required.</div>\r\n </div>\r\n <div class=\"mb-3\">\r\n <label for=\"functionType\" class=\"form-label\">Function Type</label>\r\n <select id=\"functionType\" class=\"form-control\" data-bind=\"value: functionType, event: { change: $parent.updateCodeEditorMode }\">\r\n <option value=\"csharp\">C#</option>\r\n <!--<option value=\"javascript\">JavaScript</option>\r\n <option value=\"sql\">SQL</option>-->\r\n </select>\r\n </div>\r\n <div class=\"mb-3\">\r\n <label for=\"functionDescription\" class=\"form-label\">Description</label>\r\n <textarea id=\"functionDescription\" class=\"form-control\" data-bind=\"value: description, valueUpdate: 'input'\" placeholder=\"Add any helpful description here for the user...\"></textarea>\r\n </div>\r\n\r\n <div>\r\n <b>Arguments</b>\r\n <table class=\"table table-bordered\">\r\n <thead>\r\n <tr>\r\n <th></th>\r\n <th>Name</th>\r\n <th>Description</th>\r\n <!--<th>Data Type</th>-->\r\n <th>Optional</th>\r\n <th></th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: parameters, tableSortable: { data: parameters, placeholder: 'sortable-placeholder' }\" >\r\n <tr>\r\n <td> <span class=\"fa fa-ellipsis-v\" aria-hidden=\"true\" title=\"Drag to reorder\"></span></td>\r\n <td>\r\n <input class=\"form-control\" data-bind=\"value: parameterName, valueUpdate: 'input'\" />\r\n <span class=\"text-danger\" data-bind=\"visible: name.hasError, text: name.validationMessage\"></span>\r\n </td>\r\n <td><input class=\"form-control\" data-bind=\"value: description, valueUpdate: 'input'\" placeholder=\"Friendly description for user...\" /></td>\r\n <!--<td>\r\n <select class=\"form-select\" data-bind=\"value: datatype\">\r\n <option>object</option>\r\n <option>string</option>\r\n <option>int</option>\r\n <option>float</option>\r\n <option>bool</option>\r\n </select>\r\n </td>-->\r\n <td> <input type=\"checkbox\" data-bind=\"checked: required, checkedValue: false, uncheckedValue: true\" /></td>\r\n <td><button class=\"btn btn-sm btn-danger\" data-bind=\"click: $parent.removeParameter\">Remove</button></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: addParameter\">Add Argument</button>\r\n </div>\r\n <br />\r\n <div class=\"mb-3\">\r\n <label for=\"codeEditor\" class=\"form-label\">Write the <b>Code</b> for the function below:</label>\r\n <div style=\"border: 1px solid\">\r\n <textarea id=\"codeEditor\" class=\"code-editor form-control\" data-bind=\"value: code\"></textarea>\r\n </div>\r\n </div>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $parent.saveFunction\">Save</button>\r\n <button class=\"btn btn-secondary\" data-bind=\"click: $parent.cancelEdit\">Cancel</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"schedules\">\r\n <b>Scheduled Reports</b>\r\n <p>\r\n View Schedules setup for sending Reports and Dashboards\r\n </p>\r\n <hr />\r\n\r\n <div class=\"row\">\r\n <div class=\"col-md-12\">\r\n <div data-bind=\"visible: schedules().length === 0\">\r\n <i class=\"fa fa-exclamation-circle\"></i> No scheduled Reports or Dashboards available.\r\n </div>\r\n <div class=\"container-fluid\" data-bind=\"if: schedules().length > 0\">\r\n <div data-bind=\"foreach: schedules\">\r\n <div class=\"row border-bottom py-2\">\r\n <div class=\"col-12\">\r\n For <span class=\"text-muted\" data-bind=\"text: DashboardId === 0 ? 'Report' : 'Dashboard'\"></span>\r\n <b><span data-bind=\"text: Name\"></span></b>\r\n </div>\r\n </div>\r\n\r\n <!-- Inner schedule items -->\r\n <div class=\"row fw-bold bg-light py-2 d-none d-md-flex\">\r\n <div class=\"col-md\"><i class=\"fa fa-clock\"></i> Schedule</div>\r\n <div class=\"col-md\"><i class=\"fa fa-envelope\"></i> Email To</div>\r\n <div class=\"col-md\"><i class=\"fa fa-file\"></i> Format</div>\r\n <div class=\"col-md\"><i class=\"fa fa-history\"></i> Last Run</div>\r\n <div class=\"col-md\"><i class=\"fa fa-user\"></i> User ID</div>\r\n <div class=\"col-md\"><i class=\"fa fa-globe\"></i> Time Zone</div>\r\n <div class=\"col-md\"><i class=\"fa fa-cogs\"></i> Actions</div>\r\n </div>\r\n\r\n <div data-bind=\"foreach: { data: Schedules, as: 'item' }\">\r\n <div class=\"row border-bottom py-2 align-items-center\">\r\n <div class=\"col-md\" data-bind=\"text: item.ScheduleDisplay\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.EmailTo\"></div>\r\n <div class=\"col-md\"\r\n data-bind=\"if: item.Format && item.Format.trim().substring(0,1) === '{'\">\r\n <div data-bind=\"html: item.Format.slice(1,-1).split(',').join('<br>')\"></div>\r\n </div>\r\n <div class=\"col-md\"\r\n data-bind=\"if: !item.Format || item.Format.trim().substring(0,1) !== '{'\">\r\n <div data-bind=\"text: item.Format\"></div>\r\n </div>\r\n <div class=\"col-md\" data-bind=\"text: item.LastRun\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.UserId ? item.UserId : 'N/A'\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.Timezone ? item.Timezone : 'N/A'\"></div>\r\n <div class=\"col-md\">\r\n <button class=\"btn btn-sm btn-danger\" data-bind=\"click: $root.deleteSchedule\">\r\n <i class=\"fa fa-trash\"></i> Delete\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Modal -->\r\n<div class=\"modal\" id=\"column-modal\" role=\"dialog\" tabindex=\"-1\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editColumn()\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"myModalLabel\">\r\n Manage\r\n <label data-bind=\"text: ColumnName\"></label>\r\n </h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose options that will determine how users interact with this column on Reports</p>\r\n <div class=\"form-horizontal\">\r\n\r\n <ul class=\"nav nav-tabs\" role=\"tablist\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link active\" href=\"#column-main\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\">Main Options</a></li>\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link\" href=\"#column-foreign\" aria-controls=\"profile\" role=\"tab\" data-bs-toggle=\"tab\">Foreign Key Options</a></li>\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link\" href=\"#column-filter\" aria-controls=\"procedure\" role=\"tab\" data-bs-toggle=\"tab\">Filter Options</a></li>\r\n </ul>\r\n <div class=\"tab-content\">\r\n <br />\r\n <div role=\"tabpanel\" class=\"tab-pane active\" id=\"column-main\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Display_Name\" data-bind=\"attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">Display Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" id=\"DisplayName\" name=\"DisplayName\" type=\"text\" value=\"First Name\" data-bind=\"value: DisplayName, attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is a friendly name to display to your users\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Field_Type\" data-bind=\"\">Field Type</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"FieldType_SelectedId\" name=\"FieldType.SelectedId\" data-bind=\"value: FieldType\">\r\n <option value=\"Boolean\">Boolean</option>\r\n <option value=\"DateTime\">Date Time</option>\r\n <option value=\"Varchar\">Varchar</option>\r\n <option value=\"Money\">Money</option>\r\n <option value=\"Int\">Int</option>\r\n <option value=\"Double\">Double</option>\r\n <option value=\"Json\">Json</option>\r\n <option value=\"Date\">Date Only</option>\r\n <option value=\"Time\">Time Only</option>\r\n <option value=\"Percentage\">Percentage</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"FieldType\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Primary_Key\" data-bind=\"\">Primary Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" data-val-required=\"The PrimaryKey field is required.\" id=\"PrimaryKey\" name=\"PrimaryKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:PrimaryKey\"><input name=\"PrimaryKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"PrimaryKey\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Do Not Display</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:DoNotDisplay\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the column will not be displayed on Report Designer, but can still be used on Global Data Filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control-group\" data-bind=\"if: FieldType() == 'Json'\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">JSON Data Structure</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <textarea class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" data-bind=\"value: JsonStructure, attr:{placeholder:'Please paste in Sample Json with all columns for this JSON data field'}\" rows=\"5\"></textarea>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"You can paste in a sample Json blob with all the columns you want to use in this field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"column-filter\">\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Require Filter if Column is selected</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForceFilter\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the column will always require the user to pick a filtered value\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Require Filter if Table is selected</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForceFilterForTable\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the report will always require the user to pick a filter value if user picks the column in report\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: FieldType() == 'DateTime'\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Restrict Filter Date Range</label>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked: restrictDateRangeFilter\" />\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\" data-bind=\"if: restrictDateRangeFilter\">\r\n <input class=\"form-control\" type=\"number\" data-bind=\"value: restrictDateRangeNumber\" />\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\" data-bind=\"if: restrictDateRangeFilter\">\r\n <select class=\"form-select\" data-bind=\"value: restrictDateRangeValue\">\r\n <option value=\"Days\">Day(s)</option>\r\n <option value=\"Months\">Month(s)</option>\r\n <option value=\"Years\">Year(s)</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is selected, user will not be able to pick date range larger than this selection\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"column-foreign\">\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Foreign Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" data-val-required=\"The ForeignKey field is required.\" id=\"ForeignKey\" name=\"ForeignKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForeignKey\"><input name=\"ForeignKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys allows friendly selection in Filters using a Dropdown List\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Foreign Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: JoinTable, visible:ForeignKey(), options: $root.Tables.availableTables, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" style=\"display: none;\">Foreign Join</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignJoin_SelectedId\" name=\"ForeignJoin.SelectedId\" data-bind=\"value: ForeignJoin, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" style=\"display: none;\">\r\n <option selected=\"selected\" value=\"Inner\">Inner</option>\r\n <option value=\"Left\">Left</option>\r\n <option value=\"Right\">Right</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignJoin\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeId'}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\">Foreign Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignKeyField\" name=\"ForeignKeyField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignKeyField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Key field is a Column from the Foreign table which is used as the Key field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeName'}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\">Foreign Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignValueField\" name=\"ForeignValueField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignValueField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Value field is a Column from the Foreign table which is used to display the value to the User in the Report Designer\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: ForeignKey\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Only for Filter?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignFilterOnly\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Check this option if you would like to use this for Filtering only, and not for SQL Joins\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"alert alert-info\">\r\n You can setup a cascading filter by setting up a parent for the foreign key below\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Setup Foreign Key Parent?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignParentKey\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys parent allows cascading dropdown selection in Filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignParentKey(), attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Parent Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: ForeignJoinTable, visible:ForeignParentKey(), options: $root.Tables.model, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignJoinTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeId'}\">Parent Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: ForeignJoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentKeyField, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeId\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Parent Key field is a Column from the Parent table which is used as the key in cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeName'}\">Parent Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: ForeignJoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentValueField, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeName\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Parent Value field is a Column from the Parent table which is used to display the value to the User in the Report Designer for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeName'}\">Foreign Key Filter Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentApplyTo, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeName\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign Key Filter Value field is a Column from the Foreign table where the selected parent filter will be applied for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <!--<div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Require Foreign Key Parent?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignParentRequired\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys parent can be optional or set to required for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>-->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>Manage Role Access\r\n </button>\r\n @* <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\" data-bind=\"click: function(){$root.saveColumn()}\">Done</button> *@\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"modal\" id=\"joinModal\" tabindex=\"-1\" role=\"dialog\">\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Joins Diagram</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\" style=\"max-height:800px;overflow:auto;\">\r\n <div id=\"joinDiagram\" style=\"width:2000px;height:1200px;position:relative;border:1px solid #ccc;\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"modal\" id=\"procedure-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content \">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Add Stored Proc</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"row\">\r\n <label class=\"col-md-2 control-label\">\r\n Search for\r\n </label>\r\n <div class=\"col-md-6\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: searchProcedureTerm\" placeholder=\"Search stored procedures by name\" />\r\n </div>\r\n <div class=\"col-md-2\">\r\n <button class=\"btn btn-primary\" data-bind=\"click: searchStoredProcedure\">Search</button>\r\n </div>\r\n </div>\r\n <br />\r\n <div class=\"menu g-3\" style=\"margin-left: 20px;\" data-bind=\"foreach: foundProcedures\">\r\n <div class=\"menu-category card\" style=\"float:left\">\r\n <div class=\"card-header clearfix\" style=\"\">\r\n <div class=\"float-start\">\r\n <label>\r\n <span data-bind=\"text: TableName\"></span>\r\n <span class=\"label-xs\">Procedure</span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function(){$root.saveProcedure($data.TableName, true);}\">\r\n <span class=\"fa fa-save\"></span>\r\n </button>\r\n </div>\r\n <a class=\"float-end\" data-bs-toggle=\"collapse\" data-bind=\"attr: {'data-bs-target': '#sp_'+$index()}\">\r\n <span class=\"fa fa-chevron-down\"></span>\r\n </a>\r\n </div>\r\n <div data-bind=\"attr: {id: 'sp_'+$index()}\" class=\"panel-collapse collapse in\">\r\n <div class=\"card-body\">\r\n Display Name<br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <label class=\"small\">Columns</label>\r\n\r\n <div class=\"list-group\" data-bind=\"foreach: Columns\">\r\n <div class=\"list-group-item\">\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n </div>\r\n </div>\r\n <label class=\"small\">Parameters</label>\r\n\r\n <div class=\"list-group\" data-bind=\"foreach: Parameters\">\r\n <div class=\"list-group-item\">\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: ParameterDataTypeString\"></span><br />\r\n Default Value: <span data-bind=\"editable: ParameterValue\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-primary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"parameter-modal\" role=\"dialog\" tabindex=\"-1\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editParameter()\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"myModalLabel\">\r\n Manage\r\n <label data-bind=\"text: ParameterName\"></label>\r\n </h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose options that will determine how users interact with this parameter on Reports</p>\r\n <div class=\"form-horizontal\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">Display Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" name=\"DisplayName\" type=\"text\" value=\"First Name\" data-bind=\"value: DisplayName, attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is a friendly name to display to your users\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Default Value</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <span data-bind=\"editable: ParameterValue\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Hidden Parameter</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked: Hidden, enable: ParameterValue\">\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Required</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:Required\">\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Use Lookup Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" name=\"ForeignKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForeignKey\"><input name=\"ForeignKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Using lookup table allows friendly selection in report using a Dropdown List\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Lookup Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: JoinTable, visible:ForeignKey(), options: $root.Procedures.tables, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeId'}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\">Lookup Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" name=\"ForeignKeyField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignKeyField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Key field is a Column from the Foreign table which is used as the Key field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeName'}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\">Lookup Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" name=\"ForeignValueField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignValueField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Lookup Value field is a Column from the Lookup table which is used to display the value to the User in the Report Designer\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n <div class=\"modal\" id=\"role-access-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editAllowedRoles\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Manage Access by Roles</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose User Roles that will have Access</p>\r\n <p class=\"small\">Note: All Users will have access if no restricted roles are setup</p>\r\n <div data-bind=\"if: $root.allRoles().length === 0\">\r\n <div class=\"alert alert-warning\">\r\n <strong>No roles available.</strong> Please add roles first.\r\n </div>\r\n </div>\r\n <div data-bind=\"if: $root.allRoles().length > 0\">\r\n <div class=\"list-group\" data-bind=\"foreach: $root.allRoles\">\r\n <div class=\"list-group-item\" style=\"padding: 2px 10px;\">\r\n <label>\r\n <input type=\"checkbox\"\r\n data-bind=\"value: $data,\r\n checked: $root.editAllowedRoles().AllowedRoles\" />\r\n <span data-bind=\"text: $data\"></span>\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal\" id=\"category-manage-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: manageCategories\">\r\n <div class=\"modal-header\">\r\n <b class=\"modal-title\">Manage Categories for <span data-bind=\"text: TableName\"></span></b>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div data-bind=\"visble: $root.Categories().lenth == 0\">\r\n No categories have been set up yet.\r\n </div>\r\n <div class=\"list-group\" data-bind=\"foreach: $root.Categories\">\r\n <div class=\"checkbox list-group-item\" style=\"padding-top: 2px; padding-bottom: 2px;\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: $parent.Categories, checkedValue: $data\" />\r\n <span data-bind=\"text: Name\"></span> <!-- Display category name -->\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n<div class=\"modal\" id=\"category-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <b class=\"modal-title\">Manage Categories</b>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>\r\n You can organize the display of tables in the Report Designer by assigning categories here.\r\n </p>\r\n <!-- Table for Categories -->\r\n <table class=\"table table-bordered\">\r\n <thead>\r\n <tr>\r\n <th>Category Name</th>\r\n <th>Description</th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: $root.Categories\">\r\n <tr>\r\n <td>\r\n <input type=\"text\" data-bind=\"value: Name, visible: $root.editingCategoryIndex() === $index()\" class=\"form-control\" />\r\n <span id=\"cat-name\" data-bind=\"text: Name, visible: $root.editingCategoryIndex() !== $index(), attr: { id: Id ? 'cat-name-' + Id :undefined }\" style=\"color: #6c757d;\"></span>\r\n </td>\r\n <td>\r\n <input type=\"text\" data-bind=\"value: Description, visible: $root.editingCategoryIndex() === $index()\" class=\"form-control\" />\r\n <span id=\"cat-desc\" data-bind=\"text: Description, visible: $root.editingCategoryIndex() !== $index(), attr: { id: Id ? 'cat-desc-' + Id :undefined }\" style=\"color: #6c757d;\"></span>\r\n </td>\r\n <td class=\"d-flex\">\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"visible: $root.editingCategoryIndex() !== $index() && Id !== 0, click: function() { $root.toggleEdit($index()) }\">\r\n <i class=\"fa fa-edit\"></i>\r\n </button>\r\n <button class=\"btn btn-success btn-sm\" data-bind=\"visible: $root.editingCategoryIndex() === $index() && Id !== 0, click: function() { $root.saveCategory($index()) }\" style=\"margin-left: 5px;\">\r\n <i class=\"fa fa-save\"></i>\r\n </button>\r\n <button class=\"btn btn-danger btn-sm\" data-bind=\"click: $root.removeCategory\">\r\n <i class=\"fa fa-trash\"></i>\r\n </button>\r\n </td>\r\n </tr>\r\n </tbody>\r\n <tfoot>\r\n <tr>\r\n <td>\r\n <input class=\"form-control\" type=\"text\" data-bind=\"value: $root.newCategoryName\" placeholder=\"Category Name\">\r\n </td>\r\n <td>\r\n <input class=\"form-control\" type=\"text\" data-bind=\"value: $root.newCategoryDescription\" placeholder=\"Description\">\r\n </td>\r\n <td>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: $root.addCategory\">Add</button>\r\n </td>\r\n </tr>\r\n </tfoot>\r\n </table>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: $root.saveCategories\">Save</button>\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"clearfix\"></div>\r\n\r\n<div class=\"modal\" id=\"add-connection-modal\" role=\"dialog\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: newDataConnection\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\"><span data-bind=\"text: $root.editingDataConnection() ? 'Edit' : 'Add a new'\"></span> Data Connection</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose User Roles that will have Access</p>\r\n <p class=\"small\">Note: All Users will have access if no restricted roles are setup</p>\r\n\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Connection Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box\" data-val=\"true\" data-val-required=\"Connection Name is required.\" type=\"text\" data-bind=\"value: Name\" placeholder=\"\" id=\"add-conn-name\">\r\n </div>\r\n </div>\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Connection Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box\" data-val=\"true\" data-val-required=\"Connection Key is required.\" type=\"text\" data-bind=\"value: ConnectionKey\" placeholder=\"\" id=\"add-conn-key\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is the Connection Key in your application settings for your SQL Connection String\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\" data-bind=\"visible: $root.editingDataConnection\">\r\n <div class=\"check-box col-md-9 col-sm-9\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseSchema\">\r\n Use Schema\r\n </label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Use Schema in SQL when building query\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 col-form-label\">Database Type</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: DatabaseType\" required>\r\n <option>MS SQL</option>\r\n <option>MySql</option>\r\n <option>PostgreSQL</option>\r\n <option>Oracle</option>\r\n <option value=\"OleDB\">OleDB/Others</option>\r\n </select>\r\n </div>\r\n </div>\r\n\r\n <div class=\"form-group row\" data-bind=\"hidden: $root.editingDataConnection\">\r\n <div class=\"check-box col-md-12\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: copySchema\">\r\n Copy Schema from existing Connection\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\" data-bind=\"visible: copySchema\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Choose Connection</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" style=\"max-width: 300px;\" data-bind=\"options: $root.DataConnections, optionsText: 'DataConnectName', optionsValue: 'DataConnectGuid', value: copyFrom\"></select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bind=\"click: $root.updateDataConnection, visible: $root.editingDataConnection()\">Update</button>\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bind=\"click: $root.addDataConnection, visible: !$root.editingDataConnection()\">Create</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"clearfix\"></div>\r\n\r\n<div class=\"modal\" id=\"data-preview-modal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\">\r\n <div class=\"modal-content\" data-bind=\"with: previewData\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Preview Table</h4>\r\n <button type=\"button\" class=\"btn-close float-end\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div style=\"overflow-x: auto; max-height: 500px; overflow-y: auto;\">\r\n <table class=\"table table-striped table-hover table-condensed\">\r\n <thead style=\"position: sticky; top: -1px; z-index: 2; background-color: #f8f9fa;\">\r\n <tr data-bind=\"foreach: Columns\">\r\n <th>\r\n <span data-bind=\"text: ColumnName, attr: { title: DataType.replace('System.', '') }\"></span>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: Rows\">\r\n <tr data-bind=\"foreach: Items\">\r\n <td>\r\n <span data-bind=\"html: FormattedValue\"></span>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"custom-sql-modal\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"myModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\" data-bind=\"with: customSql\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Enter Select SQL for your Data</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"form-group\" data-bind=\"validationElement: customTableName\">\r\n <label for=\"custom-table-name\">Custom Table Name</label>\r\n <input type=\"text\" class=\"form-control\" name=\"customTableName\" placeholder=\"Enter table name\" data-bind=\"textInput: customTableName\" required>\r\n <div class=\"invalid-feedback\">Custom Table Name is required.</div>\r\n </div>\r\n <div data-bind=\"visible: useAi\">\r\n <p id=\"query-input\" class=\"query-input\">\r\n Show me \r\n </p>\r\n <button data-bind=\"click: buildSqlUsingAi\" class=\"btn btn-primary btn-sm\">Process with ChatGPT</button>\r\n <button data-bind=\"click: textQuery.resetQuery\" class=\"btn btn-secondary btn-sm\">Start over</button>\r\n <hr />\r\n </div>\r\n\r\n <div class=\"form-group\" data-bind=\"validationElement: customSql\">\r\n <label for=\"custom-sql\">Custom SQL</label> |\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: dynamicColumns\">\r\n <span title=\"Setup a table that returns dynamic columns to pick from\">Table with Dynamic Columns</span>\r\n </label> |\r\n <a href=\"#\" data-bind=\"click: beautifySql\">Beautify Sql</a>\r\n <textarea class=\"form-control\" style=\"height: 240px;\" name=\"customSql\" data-bind=\"textInput: customSql\" required></textarea>\r\n <div class=\"invalid-feedback\">Custom SQL is required.</div>\r\n\r\n <div data-bind=\"if: dynamicColumns\">\r\n <label>Add SQL code to use the dynamic column</label>\r\n <textarea class=\"form-control\" style=\"height: 240px;\" name=\"columnTranslation\" data-bind=\"textInput: columnTranslation\" required></textarea>\r\n <label>Pick Values Table</label>\r\n <select class=\"form-select input-medium\" data-bind=\"options: $root.Tables.availableTables, optionsText: 'DisplayName', optionsValue: 'Id', optionsCaption: 'Choose Values Table...', value: dynamicValuesTableId\"></select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: executeSql\">Save changes</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Tables/Views Json File Modal -->\r\n<div class=\"modal\" id=\"uploadTablesFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadTablesFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageTablesJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadTablesFileModalLabel\">Import Tables/Views (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerTablesFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"tablesFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleTablesFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Tables/Views File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadTablesFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Joins Json File Modal -->\r\n<div class=\"modal\" id=\"uploadJoinsFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadJoinsFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJoinsJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadJoinsFileModalLabel\">Import Joins (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerJoinsFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"joinsFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleJoinsFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Joins File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadJoinsFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<!-- Import StoredProcedures Json File Modal -->\r\n<div class=\"modal\" id=\"uploadStoredProceduresFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadStoredProceduresFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageStoredProceduresJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadStoredProceduresFileModalLabel\">Import Stored Procedures (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerStoredProceduresFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"storedProceduresFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleStoredProceduresFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Stored Procedures File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadStoredProceduresFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"modal\" id=\"searchModal\" tabindex=\"-1\" aria-hidden=\"true\" data-bind=\"with: $root\">\r\n <div class=\"modal-dialog modal-xl modal-dialog-scrollable\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Bulk Manage Reports Access and Export</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"d-flex gap-2 mb-4 align-items-center\">\r\n <input type=\"text\" class=\"form-control\" placeholder=\"Search Reports\"\r\n data-bind=\"value: searchQuery, valueUpdate: 'input'\">\r\n <button class=\"btn btn-sm btn-outline-primary flex-shrink-0\" title=\"Select all Filtered\"\r\n data-bind=\"click: selectAllFiltered\">\r\n Select All\r\n </button>\r\n <button class=\"btn btn-sm btn-outline-secondary flex-shrink-0\" title=\"Deselect all Filtered\"\r\n data-bind=\"click: deselectAllFiltered\">\r\n Deselect All\r\n </button>\r\n </div>\r\n <div data-bind=\"foreach: filteredReportsAndFolders\">\r\n <div class=\"card mb-3\">\r\n <div class=\"card-header\">\r\n <div class=\"d-flex fw-bold\">\r\n <div class=\"w-50 flex-grow-1\">\r\n <input type=\"checkbox\" data-bind=\"checked: allReportsSelected\">\r\n <span data-bind=\"text: folder\"></span>\r\n </div>\r\n <div class=\"w-25\">View</div>\r\n <div class=\"w-25\">Manage</div>\r\n <div class=\"w-25\">Delete</div>\r\n <div class=\"w-25\">Client ID</div>\r\n </div>\r\n </div>\r\n <!-- Reports List -->\r\n <ul class=\"list-group list-group-flush\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"w-50 flex-grow-1\">\r\n <input type=\"checkbox\" data-bind=\"checked: isSelected\">\r\n <span data-bind=\"text: reportName\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: viewOnlyUserRole ? viewOnlyUserRole: 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: userRole ? userRole : 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserRole ? deleteOnlyUserRole : 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: clientId ? clientId : 'Any User'\"></span>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n <div class=\"p-2 text-muted\" data-bind=\"visible: reports.length === 0\">\r\n No matching reports found\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button class=\"btn btn-success\" data-bind=\"click: exportFoldersReportJson\">Export Selected</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.openApplySecurityModal, enable: $root.anyReportSelected\">Apply Security to All Selected</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.deleteSelectedItems, enable: $root.anyReportSelected\">Delete All Selected</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"modal\" id=\"applySecurityModal\" tabindex=\"-1\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\" data-bind=\"if: $root.anyReportSelected\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Apply Security to All Selected</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div data-bind=\"template: { name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.applySecurityToAll\">Apply to All</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<!-- Import Json File Modal -->\r\n<div class=\"modal\" id=\"uploadFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadFileModalLabel\">Import previously Exported Reports</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n\r\n <div class=\"alert alert-info small\">\r\n <strong>Instructions:</strong><br />\r\n \u2022 Select a <code>.json</code> file previously exported from Dotnet Report.<br />\r\n \u2022 The file may include multiple reports and their folders.<br />\r\n \u2022 Any missing folders will be created automatically.<br />\r\n \u2022 If a report with the same name already exists, you will be prompted to:\r\n <em>Skip</em>, <em>Overwrite</em>, or <em>Make a Copy</em>.<br />\r\n \u2022 Once uploaded, all imported reports will be available immediately.\r\n </div>\r\n\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n Click here to select a JSON file\r\n </div>\r\n\r\n <input type=\"file\" id=\"fileInputJson\" accept=\".json\" style=\"display: none;\"\r\n data-bind=\"event: { change: handleFileSelect }\">\r\n\r\n <div class=\"mt-3\" data-bind=\"visible: fileName\">\r\n <p><strong>Selected File:</strong> <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->", styles: [".glyphicon-ok:before{content:\"\\f00c\"}.glyphicon-remove:before{content:\"\\f00d\"}.glyphicon{display:inline-block;font: 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.table-name-label{display:inline-block;max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}\n"] }]
|
|
13512
|
+
args: [{ selector: 'app-dotnetsetup', standalone: true, imports: [CommonModule], template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n<div>\r\n <h2>Manage Database</h2>\r\n <p>\r\n You can select and manage display names for the Tables and Columns you would like to allow in Dotnet Report Builder.\r\n </p>\r\n <div class=\"alert alert-danger d-flex justify-content-between align-items-center\">\r\n <div>\r\n Do not expose this Setup Tool to end users who should not have access to it. Ideally, only Developers should be given access to this utility.\r\n </div>\r\n <button class=\"btn btn-primary ms-3\" data-bind=\"click: refreshAll\" title=\"Reload all Table and Columns\">\r\n <i class=\"fa fa-refresh\"></i> Refresh\r\n </button>\r\n </div>\r\n\r\n <div data-bind=\"visible: false;\">\r\n Loading...\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <!-- Nav tabs -->\r\n <ul class=\"nav nav-tabs flex-grow-1\" role=\"tablist\">\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link active\" href=\"#tablesfields\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\" data-bind=\"click: function() { customTableMode(false); activeTable(null);}\">\r\n <i class=\"fa fa-database\"></i> Database Tables\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#tablesfields\" aria-controls=\"custom\" role=\"tab\" data-bs-toggle=\"tab\" data-bind=\"click: function() { customTableMode(true); activeTable(null); }\">\r\n <i class=\"fa fa-table\"></i> Custom Tables\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#relations\" aria-controls=\"profile\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-link\"></i> Relations\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#procedure\" aria-controls=\"procedure\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-code\"></i> Stored Procs\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#schedules\" aria-controls=\"schedules\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-clock\"></i> Schedules\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\" data-bind=\"visible: settings.useFunctions\">\r\n <a class=\"nav-link\" href=\"#functions\" aria-controls=\"functions\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-cogs\"></i> Custom Functions\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#manageaccess\" aria-controls=\"manageaccess\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-folder\"></i> Manage Reports\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\">\r\n <a class=\"nav-link\" href=\"#connection\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\">\r\n <i class=\"fa fa-plug\"></i> Data Settings\r\n </a>\r\n </li>\r\n </ul>\r\n\r\n </div>\r\n <br />\r\n</div>\r\n<!-- Tab panes -->\r\n<div class=\"fix-content\" style=\"display: none;\" data-bind=\"visible: true\">\r\n <div class=\"tab-content\">\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"connection\">\r\n <b>Manage Data Connection</b>\r\n <p>\r\n Data Connection groups data schemas (including tables and stored procedures and other configuration), Reports, and Dashboards into a single environment. You can create multiple Data Connections and easily switch between them for separate environment management.\r\n </p>\r\n <hr />\r\n <div class=\"form-row\" data-bind=\"visible: true\">\r\n <div class=\"form-group\">\r\n <div class=\"control-group\">\r\n <select class=\"form-select\" style=\"width:25%\" data-bind=\"options: DataConnections, optionsText: 'DataConnectName', optionsValue: 'DataConnectGuid', value: currentConnectionKey\"></select>\r\n <div class=\"padded-top\"></div>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"visible: false\" data-bs-toggle=\"modal\" data-bs-target=\"#connection-setup-modal\">Manage DB Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: switchConnection, visible: canSwitchConnection\">Switch Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: editDataConnectionModal, hidden: canSwitchConnection\" data-bs-toggle=\"modal\" data-bs-target=\"#add-connection-modal\">Edit Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: newDataConnectionModal\" data-bs-toggle=\"modal\" data-bs-target=\"#add-connection-modal\">Add New Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: exportAll, visible: false\">Export Connection</button>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: importStart, visible: false\">Import Connection</button>\r\n </div>\r\n <div data-bind=\"visible: importingFile\">\r\n <br />\r\n <div class=\"alert alert-info\">\r\n Please select a file you have previously exported from this utility. The system will load the screen with the Data Connection setting in the file, however, it will <b>NOT</b> be saved until you press the Save All button or Save individual tables\r\n <br />\r\n <div class=\"input-group\">\r\n <input type=\"file\" accept=\".json\" id=\"import-file\" data-bind=\"event: { change: function() { importFile($element.files[0]) } }\" />\r\n <span class=\"input-group-btn\">\r\n <button class=\"btn btn-link\" data-bind=\"click: importCancel\">Cancel</button>\r\n </span>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <br />\r\n <br />\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <b>Account Level Settings</b>\r\n </div>\r\n <div class=\"card-body\">\r\n <div data-bind=\"with: settings\">\r\n <div class=\"row\">\r\n <div class=\"col-md-6\">\r\n <h6 class=\"mt-2 mb-2\">Admin Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useClientIdInAdmin\" data-bind=\"checked: useClientIdInAdmin\">\r\n <label class=\"form-check-label\" for=\"useClientIdInAdmin\">Use Client ID in Admin mode</label>\r\n <small class=\"text-muted d-block\">Enable this to respect client IDs even when in admin mode.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useSqlBuilderInAdminMode\" data-bind=\"checked: useSqlBuilderInAdminMode\">\r\n <label class=\"form-check-label\" for=\"useSqlBuilderInAdminMode\">Use SQL Builder in Admin Mode</label>\r\n <small class=\"text-muted d-block\">Allows SQL query builder access <b>only</b> in admin mode.</small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Customization</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"useSqlCustomField\" data-bind=\"checked: useSqlCustomField\">\r\n <label class=\"form-check-label\" for=\"useSqlCustomField\">Use SQL in Custom Field</label>\r\n <small class=\"text-muted d-block\">Allows the use of SQL expressions in custom fields.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showDesignerHints\">\r\n <label class=\"form-check-label\">Show Designer Tips & Guidance</label>\r\n <small class=\"text-muted d-block\">Display contextual tips and explanations throughout the report designer to help users understand available options.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useAltPivot\">\r\n <label class=\"form-check-label\">Pivot with Drilldown</label>\r\n <small class=\"text-muted d-block\">Use alternate Pivot method that doesn\u2019t use SQL\u2019s PIVOT.<br>Allows drilldown, but may be slower.</small>\r\n </div>\r\n <div class=\"form-check\" data-bind=\"visible: isEnterprise\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useFunctions\">\r\n <label class=\"form-check-label\">Use Functions</label>\r\n <small class=\"text-muted d-block\">\r\n Enable calculated functions for List reports only.<br>\r\n Available for Enterprise license users.\r\n </small>\r\n </div>\r\n <div class=\"mb-2 mt-2\">\r\n <label class=\"form-label mb-1\" for=\"defaultDateFormatSelect\">Default Date Format</label>\r\n <select class=\"form-select form-select-sm\" id=\"defaultDateFormatSelect\" style=\"max-width: 220px;\"\r\n data-bind=\"options: dateFormatOptions, value: defaultDateFormat\"></select>\r\n <small class=\"text-muted d-block\">Date format used by all date pickers when a field doesn't override it. e.g. <em>New Zealand</em> uses <code>dd/mm/yyyy</code>.</small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Report Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"allowUsersToCreateReports\" data-bind=\"checked: allowUsersToCreateReports\">\r\n <label class=\"form-check-label\" for=\"allowUsersToCreateReports\">Allow All Users to Create Reports</label>\r\n <small class=\"text-muted d-block\">Permits users to generate and customize reports.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showImportExport\">\r\n <label class=\"form-check-label\">Allow All Users to export/import\u00A0reports</label>\r\n <small class=\"text-muted d-block\">\r\n Allow non admin users to export and import Reports in the system.\r\n </small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: canCopyReport\">\r\n <label class=\"form-check-label\">Always allow users to copy\u00A0reports</label>\r\n <small class=\"text-muted d-block\">\r\n Allow users with View Only access to copy Reports in the system.\r\n </small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showScheduling\">\r\n <label class=\"form-check-label\">Hide Report/Dashboard Scheduling</label>\r\n <small class=\"text-muted d-block\">\r\n Removes scheduling in reports and dashboard, select only if you don't want to use scheduling feature.\r\n </small>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <h6 class=\"mt-2 mb-2\">Folder Options</h6>\r\n <div class=\"form-check\" data-bind=\"visible: false\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"noFolders\" data-bind=\"checked: noFolders\">\r\n <label class=\"form-check-label\" for=\"noFolders\">No Folders</label>\r\n <small class=\"text-muted d-block\">Disables the use of folders in the application.</small>\r\n </div>\r\n <div class=\"form-check\" data-bind=\"visible: false\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"noDefaultFolder\" data-bind=\"checked: noDefaultFolder\">\r\n <label class=\"form-check-label\" for=\"noDefaultFolder\">No Default Folder</label>\r\n <small class=\"text-muted d-block\">Removes the Default folder.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showEmptyFolders\">\r\n <label class=\"form-check-label\">Show Empty Folders</label>\r\n <small class=\"text-muted d-block\">Will show empty folders for non admin users.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" id=\"allowUsersToManageFolders\" data-bind=\"checked: allowUsersToManageFolders\">\r\n <label class=\"form-check-label\" for=\"allowUsersToManageFolders\">Allow All Users to Manage Folders</label>\r\n <small class=\"text-muted d-block\">Grants permission to organize and manage folders without admin mode.</small>\r\n </div>\r\n <h6 class=\"mt-3 mb-2\">Export Options</h6>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: useAltPdf\">\r\n <label class=\"form-check-label\">PDF Export without Chromium</label>\r\n <small class=\"text-muted d-block\">Use alternate PDF export method that doesn\u2019t rely on Chromium.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: dontXmlExport\">\r\n <label class=\"form-check-label\">Hide XML Export option</label>\r\n <small class=\"text-muted d-block\">Remove XML Export option.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: dontWordExport\">\r\n <label class=\"form-check-label\">Hide Word Export option</label>\r\n <small class=\"text-muted d-block\">Remove Word Export option.</small>\r\n </div>\r\n <div class=\"form-check\">\r\n <input type=\"checkbox\" class=\"form-check-input\" data-bind=\"checked: showPageSize\">\r\n <label class=\"form-check-label\">Show Page Size on PDF & Word export</label>\r\n <small class=\"text-muted d-block\">Display document dimensions in exported PDF & Word.</small>\r\n </div>\r\n\r\n <h6 class=\"mt-3 mb-2\">AI Assistant <span class=\"badge bg-warning text-dark\" style=\"font-size: 10px;\">BETA</span></h6>\r\n <div class=\"mb-2\">\r\n <div class=\"form-check form-switch\">\r\n <input class=\"form-check-input\" type=\"checkbox\" role=\"switch\" id=\"aiEnabledSwitch\"\r\n data-bind=\"checked: aiEnabled\">\r\n <label class=\"form-check-label\" for=\"aiEnabledSwitch\">Enable AI Report Assistant</label>\r\n </div>\r\n <small class=\"text-muted d-block\">When enabled, an AI-powered assistant will be available in the report designer to help build reports using natural language.</small>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mt-3\">\r\n <button type=\"button\" id=\"saveAppSettings\" class=\"btn btn-primary\" data-bind=\"click: saveAppSettings\">Save</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div role=\"tabpanel\" class=\"tab-pane active\" id=\"tablesfields\">\r\n <b data-bind=\"text: customTableMode() ? 'Custom Tables' : 'Database Tables'\"></b>\r\n <p>\r\n <span data-bind=\"visible: $root.customTableMode\">\r\n Define Custom Tables using SQL Select Query to use in Dotnet Report for Reporting and Analytics.\r\n </span>\r\n <span data-bind=\"hidden: $root.customTableMode\">\r\n Select Tables or Views from your Database to use in Dotnet Report for Reporting and Analytics.\r\n </span>\r\n </p>\r\n\r\n <div data-bind=\"with: Tables\">\r\n <input type=\"text\" class=\"form-control input-sm\" placeholder=\"Filter Tables...\" data-bind=\"value: tableFilter, valueUpdate: 'afterkeydown'\" style=\"float: left; width: 180px; margin-right: 5px;\">\r\n <button class=\"btn btn-outline-secondary btn-sm\" data-bind=\"click: clearTableFilter, visible: tableFilter()!='' && tableFilter()!=null\"><span class=\"fa fa-remove\"></span></button>\r\n <button class=\"btn btn-outline-secondary btn-sm\" data-bind=\"click: toggleShowAll, hidden: $root.customTableMode() || $root.onlyApi(), text: usedOnly() ? 'Show all' : 'Show used only'\">Show used only</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.customSql.addNewCustomSqlTable, visible: $root.customTableMode\">Add New Custom Table</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.loadFromDatabase, hidden: $root.customTableMode() || !$root.onlyApi()\">\r\n <span class=\"fa fa-database\"></span> Load all Database Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: $root.visualizeJoins\"><span class=\"fa fa-arrows-h\"></span> Visualize Joins</button> \r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: function() { exportTablesJson(true) }, visible: $root.customTableMode\">\r\n <span class=\"fa fa-download\"></span> Export Custom Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: function() { exportTablesJson(false) }, visible: !$root.customTableMode()\">\r\n <span class=\"fa fa-download\"></span> Export Tables/Views\r\n </button>\r\n\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadTablesFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-file\"></span> Import Tables/Views\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" title=\"Manage Categories\" data-bs-toggle=\"modal\" data-bs-target=\"#category-modal\">\r\n <span class=\"fa fa-server\"></span> Manage Categories\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { selectAll(false)},visible: !$root.customTableMode()\">\r\n Select All Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { selectAll(true)}, visible: $root.customTableMode\">\r\n Select All Custom Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { unselectAll(false)},visible: !$root.customTableMode()\">\r\n UnSelect All Tables\r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { unselectAll(true)}, visible: $root.customTableMode\">\r\n UnSelect All Custom Tables \r\n </button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { $root.saveChanges($root.customTableMode()) }\">\r\n <span class=\"fa fa-floppy\"></span> Save All Tables\r\n </button>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n <hr />\r\n\r\n <div class=\"row\">\r\n <div class=\"col-12 col-md-4 col-lg-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n\r\n <div class=\"row\">\r\n <div data-bind=\"ifnot: $root.customTableMode\">\r\n <div class=\"alert alert-info\">\r\n <span data-bind=\"text: Tables.model().filter(t => !t.CustomTable()).length\"></span> Tables/Views\r\n <span data-bind=\"text: $root.onlyApi() ? 'configured and used' : 'read from database'\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"menu g-3\" data-bind=\"foreach: pagedTables\">\r\n <div class=\"menu-category card\">\r\n <div class=\"card-header clearfix\">\r\n <div class=\"checkbox float-start\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected\" title=\"Check to use in Dotnet Report, uncheck to Remove\">\r\n <span data-bind=\"text: TableName, attr: { title: TableName }, click: function() { $root.activeTable($data); }\" class=\"table-name-label\" style=\"cursor: pointer\"></span>\r\n <span data-bind=\"visible: SchemaName, text: SchemaName\" title=\"schema\" class=\"text-muted small\"></span>\r\n <span data-bind=\"visible: IsView\" class=\"label label-sm\">(view)</span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Table\" data-bind=\"click: function() { saveTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fas fa-save\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Preview this Table\" data-bind=\"click: function() { previewTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-table\"></i>\r\n </button>\r\n </div>\r\n <a class=\"float-end\" data-bind=\"click: function() { $root.activeTable($data); }\">\r\n <span class=\"fa fa-chevron-right\" style=\"cursor: pointer\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"row mt-3\">\r\n <div class=\"d-flex flex-column col-md-12\" data-bind=\"with: pager\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n <div class=\"text-muted small mt-0 pt-0\" style=\"padding-left: 3px\" data-bind=\"text: 'Total Records: ' + totalRecords()\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-12 col-md-8 col-lg-9\" id=\"tableDetails\">\r\n <div data-bind=\"visible: pagedTables().length === 0\">\r\n <br />\r\n <svg style=\"width:40px;float:left;transform:rotate(-45deg) translateY(6px);transform-origin:center center;\" fill=\"#000000\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" class=\"icon flat-line\"><g stroke-width=\"0\"></g><g stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke=\"#CCCCCC\" stroke-width=\"0.048\"></g><g><path d=\"M18,21A13.17,13.17,0,0,1,9,8.51V3\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></path><polyline points=\"12 6 9 3 6 6\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></polyline></g></svg>\r\n <div class=\"mt-3 fw-bold\" style=\"float:left; padding-left: 5px;\">No <span data-bind=\"visible: $root.customTableMode\">Custom </span> Tables added yet, click \"<span data-bind=\"text: customTableMode() ? 'Add New Custom Table' : 'Load All Tables'\"></span>\" to get started!</div>\r\n </div>\r\n\r\n <div data-bind=\"visible: !activeTable() && pagedTables().length > 0\">\r\n <br />\r\n <br />\r\n <svg style=\"width:40px;float:left;transform:rotate(-45deg) translateY(6px);transform-origin:center center;\" fill=\"#000000\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" class=\"icon flat-line\"><g stroke-width=\"0\"></g><g stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke=\"#CCCCCC\" stroke-width=\"0.048\"></g><g><path d=\"M18,21A13.17,13.17,0,0,1,9,8.51V3\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></path><polyline points=\"12 6 9 3 6 6\" style=\"fill:none;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;\"></polyline></g></svg>\r\n <div class=\"mt-3 fw-bold\" style=\"float:left; padding-left: 5px;\">Select a <span data-bind=\"visible: $root.customTableMode\">Custom </span> Table, or \"<span data-bind=\"text: customTableMode() ? 'Add New Custom Table' : 'Load All Tables'\"></span>\"</div>\r\n </div>\r\n\r\n <div data-bind=\"with: activeTable\">\r\n <div class=\"card my-3\">\r\n <div class=\"card-header\">\r\n <h5>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected\" title=\"Check to use in Dotnet Report, uncheck to Remove\">\r\n <span data-bind=\"text: TableName\"></span>\r\n <span data-bind=\"visible: IsView\" class=\"label-sm\">(view)</span>\r\n </h5>\r\n <button class=\"btn btn-sm\" title=\"Save this Table\" data-bind=\"click: function() { saveTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fas fa-save\"></i> Save Changes\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Preview this Table\" data-bind=\"click: function() { previewTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-table\"></i> Preview Data\r\n </button>\r\n <button class=\"btn btn-sm btn-danger\" title=\"Delete this Table\" data-bind=\"click: function() { deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <i class=\"fa fa-trash\"></i> Remove Table\r\n </button>\r\n </div>\r\n <div class=\"card-body\">\r\n <p class=\"float-end\">\r\n <button class=\"btn btn-sm\" title=\"Manage Category\" data-bs-toggle=\"modal\" data-bs-target=\"#category-manage-modal\" data-bind=\"click: $root.selectedCategory\">\r\n <i class=\"fa fa-gear\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Export this Table\" data-bind=\"click: function() { exportTableJson(); }\">\r\n <i class=\"fa fa-file\"></i>\r\n </button>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Display Name</label><br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Schema Name</label><br />\r\n <span data-bind=\"editable: SchemaName\"></span>\r\n </p>\r\n <p style=\"display: none;\">\r\n <!-- deprecated -->\r\n <label class=\"label-sm\">Account Id Field</label><br />\r\n <span data-bind=\"editable: AccountIdField\"></span>\r\n </p>\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked: DoNotDisplay\">\r\n Do Not Display\r\n </label>\r\n </div>\r\n <div data-bind=\"if: CustomTable\">\r\n <button class=\"btn btn-sm btn-secondary\" data-bind=\"click: $root.customSql.viewCustomSql.bind($data)\">View Custom SQL</button>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center justify-content-end gap-2\">\r\n <button class=\"btn btn-sm btn-primary\"\r\n data-bind=\"click: addNewColumn, visible: false\">\r\n <i class=\"fa fa-plus\"></i> Add Column\r\n </button>\r\n <label class=\"label-sm m-0\"><span data-bind=\"text: Columns().length\"></span> Columns</label>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: autoFormat, visible: Selected\">Auto Format</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: autoSort, visible: Selected\">Auto Sort</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: unselectAllColumns, visible: Selected\">Unselect All</button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: selectAllColumns, visible: Selected\">Select All</button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"list-group\" data-bind=\"sortable: { data: Columns, options: { handle: '.sortable', cursor: 'move' }, afterMove: $root.Tables.columnSorted }\">\r\n <div class=\"list-group-item\">\r\n <div data-bind=\"if: $parent.DynamicColumns()\">\r\n <span data-bind=\"html: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n </div>\r\n <div class=\"checkbox\" data-bind=\"if: !$parent.DynamicColumns()\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: Selected, enable: $parent.Selected()\">\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n <label data-bind=\"visible: PrimaryKey\" class=\"badge text-bg-primary\">Primary</label>\r\n <label data-bind=\"visible: ForeignKey\" class=\"badge text-bg-info text-white\">Foreign</label>\r\n <label class=\"badge text-bg-warning\" data-bind=\"visible: isNew\">New</label>\r\n </label>\r\n <button class=\"btn btn-sm float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#column-modal\" title=\"All column options\" data-bind=\"click: $root.selectColumn.bind($data, false)\">...</button>\r\n <div class=\"btn btn-sm float-end sortable\">\r\n <span class=\"fa fa-arrows\" aria-hidden=\"true\" title=\"Drag to reorder\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"relations\">\r\n <b>Relations</b>\r\n <p>\r\n Setup your Database Relations for Dotnet Report to produce dynamic queries\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: AddAllRelations\">Auto Add Joins</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: AddJoin\">Add new Join</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: SaveJoins\">Save Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: visualizeJoins\">Visualize Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: DeleteVisibleJoins\" title=\"Delete filtered Joins\">Delete Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: ExportJoins\" title=\"Export filtered Joins\">Export Joins</button> \r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadJoinsFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-upload\"></span> Import Joins\r\n </button>\r\n <hr />\r\n <div id=\"form-joins\">\r\n <div class=\"alert alert-warning\" data-bind=\"visible: isDirty\">\r\n You have unsaved changes. Please be sure to click <b>Save Joins</b> to save your changes.\r\n </div>\r\n\r\n <div class=\"container-fluid\">\r\n <div class=\"row fw-bold bg-light border-bottom py-2\" data-bind=\"with: JoinFilters\">\r\n <!-- Repeat for each column header -->\r\n <div class=\"col-md-1\" style=\"max-width: 40px;\"></div>\r\n <div class=\"col-md-2\">\r\n Primary Table\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: primaryTable, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\" />\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: primaryField, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\" />\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1\">\r\n Join Type\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinType, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Join Table\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinTable, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field\r\n <div class=\"input-group input-group-sm\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: joinField, valueUpdate: 'afterkeydown'\" placeholder=\"Search...\">\r\n <span class=\"input-group-text\"><i class=\"fa fa-filter\"></i></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\"></div>\r\n </div>\r\n\r\n <!-- New Join Row -->\r\n <div class=\"row bg-info bg-opacity-25 p-2\" data-bind=\"visible: showNewJoinRow\">\r\n <div class=\"col-md-1\" style=\"max-width: 40px;\"></div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: Tables.availableTables, optionsText: 'DisplayName', value: NewJoin().JoinTable, optionsCaption: 'Pick a table...'\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: NewJoin().JoinTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsCaption: 'Pick a field...', optionsValue: 'ColumnName', value: $root.NewJoin().FieldName\"></select>\r\n </div>\r\n <div class=\"col-md-1\">\r\n <select class=\"form-select\" data-bind=\"options: $root.JoinTypes, value: NewJoin().JoinType\"></select>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: NewJoin().OtherTables, optionsText: 'DisplayName', value: NewJoin().OtherTable, optionsCaption: 'Pick a table...'\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: NewJoin().OtherTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $root.NewJoin().JoinFieldName, optionsCaption: 'Pick a field...'\"></select>\r\n </div>\r\n <div class=\"col-md-2 text-end\">\r\n <button class=\"btn btn-success btn-sm\" data-bind=\"click: ConfirmAddJoin\">+ Add Join</button>\r\n </div>\r\n </div>\r\n\r\n <!-- Existing Join Rows with drag reorder -->\r\n <div data-bind=\"sortable: { data: reorderableJoins, options: { handle: '.join-drag-handle', cursor: 'move' }, afterMove: $root.joinSorted }\">\r\n <div class=\"row align-items-center border-bottom py-2\">\r\n <div class=\"col-md-1 text-center\" style=\"max-width: 40px;\">\r\n <span class=\"btn btn-sm btn-outline-secondary join-drag-handle\" title=\"Drag to reorder\"><i class=\"fa fa-bars\"></i></span>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: $root.Tables.availableTables, optionsText: 'DisplayName', value: JoinTable\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: JoinTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $parent.FieldName\"></select>\r\n </div>\r\n <div class=\"col-md-1\">\r\n <select class=\"form-select\" data-bind=\"options: $root.JoinTypes, value: JoinType\"></select>\r\n </div>\r\n <div class=\"col-md-2\">\r\n <select class=\"form-select\" data-bind=\"options: OtherTables, optionsText: 'DisplayName', value: OtherTable\"></select>\r\n </div>\r\n <div class=\"col-md-2\" data-bind=\"with: OtherTable\">\r\n <select class=\"form-select\" data-bind=\"options: availableColumns, optionsText: 'DisplayName', optionsValue: 'ColumnName', value: $parent.JoinFieldName\"></select>\r\n </div>\r\n <div class=\"col-md-2 text-end\">\r\n <span class=\"badge bg-warning text-dark me-2\"\r\n data-bind=\"visible: isNew\"\r\n data-bs-toggle=\"tooltip\"\r\n title=\"New record added or imported, not saved yet\">\r\n <i class=\"fa fa-warning\"></i> New\r\n </span>\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"click: DeleteJoin\">Delete</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"row mt-3\"> \r\n <div class=\"d-flex flex-row align-items-center col-md-12\" data-bind=\"with: joinsPager\"> \r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n <div class=\"text-muted small mt-0 pt-0\" style=\"padding-left: 3px\" data-bind=\"text: 'Total Records: ' + totalRecords()\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <br />\r\n <br />\r\n </div>\r\n <div id=\"procedure\" class=\"tab-pane\">\r\n <b>Stored Procedures</b>\r\n <p>\r\n Select and manage Stored Procedures to use in Dotnet Report for more complex and coded Reports\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#procedure-modal\"><span class=\"fa fa-plus\"></span> Add Stored Procs from database</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadStoredProceduresFileModal\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <span class=\"fa fa-file\"></span> Import Stored Procedures\r\n </button>\r\n <hr />\r\n <div data-bind=\"if: Procedures.savedProcedures().length == 0\">\r\n <br />\r\n No Stored Procedures have been setup yet.\r\n </div>\r\n <div class=\"row\" data-bind=\"if: Procedures.savedProcedures().length > 0\">\r\n <!-- Left Panel for Stored Procedure Names -->\r\n <div class=\"col-12 col-md-4 col-lg-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n <div class=\"menu g-3\" data-bind=\"foreach: Procedures.savedProcedures\">\r\n <div class=\"menu-category card\">\r\n <div class=\"card-header clearfix\">\r\n <div class=\"float-start\">\r\n <label>\r\n <span data-bind=\"text: TableName, click: function() { $root.activeProcedure($data); }\" style=\"cursor: pointer\"></span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function() { $root.saveProcedure($data.TableName, false); }\">\r\n <span class=\"fa fa-save\"></span>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Delete this Procedure\" data-bind=\"click: function() { $data.deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <span class=\"fa fa-trash\"></span>\r\n </button>\r\n </div>\r\n <!-- Click to activate procedure -->\r\n <a class=\"float-end\" data-bind=\"click: function() { $root.activeProcedure($data); }\">\r\n <span class=\"fa fa-chevron-right\" style=\"cursor: pointer\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Right Panel for Stored Procedure Details -->\r\n <div class=\"col-12 col-md-8 col-lg-9\" id=\"procDetails\">\r\n <div data-bind=\"with: activeProcedure\">\r\n <div class=\"card my-3\">\r\n <div class=\"card-header\">\r\n <h5 data-bind=\"text: TableName\"></h5>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function() { $root.saveProcedure($data.TableName, false); }\">\r\n <span class=\"fa fa-save\"></span> Save Changes\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Delete this Procedure\" data-bind=\"click: function() { $data.deleteTable($root.keys.AccountApiKey, $root.keys.DatabaseApiKey); }\">\r\n <span class=\"fa fa-trash\"></span> Delete\r\n </button>\r\n </div>\r\n <div class=\"card-body\">\r\n <p class=\"float-end\">\r\n <button class=\"btn btn-sm\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>\r\n </button>\r\n <button class=\"btn btn-sm\" title=\"Export this Procedure\" data-bind=\"click: function() { $root.exportProcedureJson($data.TableName); }\">\r\n <i class=\"fa fa-file\"></i>\r\n </button>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Display Name</label><br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n </p>\r\n <p>\r\n <label class=\"label-sm\">Schema Name</label><br />\r\n <span data-bind=\"editable: SchemaName\"></span>\r\n </p>\r\n <label class=\"small\">Columns</label>\r\n <div class=\"list-group\" data-bind=\"foreach: Columns\">\r\n <div class=\"list-group-item\">\r\n <label>\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ColumnName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n </label>\r\n <button class=\"btn btn-sm float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#column-modal\" title=\"All column options\" data-bind=\"click: $root.selectColumn.bind($data, true)\">...</button>\r\n </div>\r\n </div>\r\n <label class=\"small\">Parameters</label>\r\n <div class=\"list-group\" data-bind=\"foreach: Parameters\">\r\n <div class=\"list-group-item\">\r\n <label>\r\n <span data-bind=\"editable: DisplayName, attr: { title: 'DB field is ' + ParameterName() }\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: ParameterDataTypeString\"></span>\r\n \r\n <button class=\"btn btn-sm btn-primary float-end\" data-bs-toggle=\"modal\" data-bs-target=\"#parameter-modal\" title=\"All Parameter options\" data-bind=\"click: $root.editParameter\">...</button>\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div id=\"manageaccess\" class=\"tab-pane\">\r\n <ul class=\"nav nav-tabs\" id=\"accessTabs\" role=\"tablist\">\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link active\" id=\"reports-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#reportsAccess\" type=\"button\" role=\"tab\">Reports Access</button>\r\n </li>\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link\" id=\"folders-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#foldersAccess\" type=\"button\" role=\"tab\">Folders Access</button>\r\n </li>\r\n </ul>\r\n <div class=\"tab-content mt-3\">\r\n <div class=\"tab-pane fade show active\" id=\"reportsAccess\" role=\"tabpanel\" aria-labelledby=\"reports-tab\">\r\n <b>Reports Access</b>\r\n <p>You can setup access to individual Reports here</p>\r\n <div class=\"mb-2 d-flex gap-2\">\r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { exportFoldersReportJson() }\">\r\n <span class=\"fa fa-download\"></span> Export Selected Reports\r\n </button>\r\n </div> \r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#uploadFileModal\">\r\n <span class=\"fa fa-upload\"></span> Import Reports\r\n </button>\r\n </div>\r\n <div class=\"mb-2\">\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#searchModal\">\r\n <span class=\"fa fa-tasks\"></span> Bulk Actions\r\n </button>\r\n </div>\r\n </div>\r\n <hr />\r\n <div data-bind=\"foreach: reportsAndFolders\" class=\"list-group\">\r\n <div class=\"list-group-item\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <input type=\"checkbox\" class=\"form-check-input\"\r\n data-bind=\"checked: allReportsSelected\">\r\n <label>\r\n <a data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folder-' + folderId }\">\r\n <i class=\"fa fa-folder\"></i> <span data-bind=\"text: folder\"></span>\r\n </a>\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"collapse\" data-bind=\"attr: {id: 'folder-' + folderId }\">\r\n <div data-bind=\"if: reports.length == 0\">\r\n No Reports found in this folder\r\n </div>\r\n <ul class=\"list-group\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\">\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input\" type=\"checkbox\" data-bind=\"checked: isSelected\" />\r\n <label class=\"list-group-item-heading\">\r\n <span class=\"fa\" data-bind=\"css: {'fa-file': reportType=='List', 'fa-th-list': reportType=='Summary', 'fa-bar-chart': reportType=='Bar', 'fa-pie-chart': reportType=='Pie', 'fa-line-chart': reportType=='Line', 'fa-globe': reportType =='Map'}\" style=\"font-size: 14pt; color: #808080\"></span>\r\n <span data-bind=\"text: reportName\"></span>\r\n </label>\r\n </div>\r\n <p class=\"list-group-item-text small\" data-bind=\"text: reportDescription\"></p>\r\n <div class=\"small\" style=\"padding-top: 10px;\">\r\n <b>Current Report Access</b><br />\r\n Manage by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: userId() ? userId() : 'Any User'\"></span><br />\r\n View only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: (viewOnlyUserId() ? viewOnlyUserId() : (userId() ? userId() : 'Any User'))\"></span><br />\r\n <div data-bind=\"if: deleteOnlyUserId()\">\r\n Delete only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserId()\"></span><br />\r\n </div>\r\n <div data-bind=\"if: userRole()\">\r\n Manage by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: userRole() ? userRole() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: viewOnlyUserRole()\">\r\n View only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: viewOnlyUserRole() ? viewOnlyUserRole() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: deleteOnlyUserRole()\">\r\n Delete only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserRole() ? deleteOnlyUserRole() : 'Same as Manage'\"></span><br />\r\n </div>\r\n <div>\r\n For Client <span class=\"badge text-bg-info text-white\" data-bind=\"text: clientId() ? clientId() : 'All Clients'\"></span><br />\r\n </div>\r\n </div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeAccess(!changeAccess())}, text: !changeAccess() ? 'Change Access': 'Cancel Changing Access', hidden: changeAccess\">Change Access</button>\r\n </div>\r\n <div data-bind=\"if: changeAccess\" class=\"col-md-9\">\r\n <div style=\"padding-left: 10px;\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: saveAccessChanges\">Save Access Changes</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeAccess(!changeAccess())}, text: !changeAccess() ? 'Change Access': 'Cancel Changing Access'\">Change Access</button>\r\n </div>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"tab-pane fade\" id=\"foldersAccess\" role=\"tabpanel\" aria-labelledby=\"folders-tab\">\r\n <b>Folders Access</b>\r\n <p>You can setup access to individual Folders here</p>\r\n <hr />\r\n <div data-bind=\"foreach: Folders\" class=\"list-group\">\r\n <div class=\"list-group-item\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <a data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folderAccess-' + Id }\">\r\n <i class=\"fa fa-folder\"></i> <span data-bind=\"text: FolderName\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n <div class=\"collapse\" data-bind=\"attr: {id: 'folderAccess-' + Id }\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\">\r\n <div class=\"small\" style=\"padding-top: 10px;\">\r\n <b>Current Folder Access</b><br />\r\n Manage by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserId()? UserId() : 'Any User'\"></span><br />\r\n View only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: (ViewOnlyUserId() ? ViewOnlyUserId() : (UserId() ? UserId() : 'Any User'))\"></span><br />\r\n <div data-bind=\"if: DeleteOnlyUserId()\">\r\n Delete only by User <span class=\"badge text-bg-info text-white\" data-bind=\"text: DeleteOnlyUserId()\"></span><br />\r\n </div>\r\n <div data-bind=\"if: UserRoles()\">\r\n Manage by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: UserRoles() ? UserRoles() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: ViewOnlyUserRoles()\">\r\n View only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: ViewOnlyUserRoles() ? ViewOnlyUserRoles() : 'Any Role'\"></span><br />\r\n </div>\r\n <div data-bind=\"if: DeleteOnlyUserRoles()\">\r\n Delete only by Role <span class=\"badge text-bg-info text-white\" data-bind=\"text: DeleteOnlyUserRoles() ? DeleteOnlyUserRoles() : 'Same as Manage'\"></span><br />\r\n </div>\r\n <div>\r\n For Client <span class=\"badge text-bg-info text-white\" data-bind=\"text: ClientId() ? ClientId() : 'All Clients'\"></span><br />\r\n </div>\r\n </div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeFolderAccess(!changeFolderAccess())}, text: !changeFolderAccess() ? 'Change Access': 'Cancel Changing Access', hidden: changeFolderAccess\">Change Access</button>\r\n </div>\r\n <div data-bind=\"if: changeFolderAccess\" class=\"col-md-9\">\r\n <div style=\"padding-left: 10px;\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n <br /><br />\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: saveFolderAccessChanges\">Save Access Changes</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { changeFolderAccess(!changeFolderAccess())}, text: !changeFolderAccess() ? 'Change Access': 'Cancel Changing Access'\">Change Access</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"functions\" data-bind=\"with: Functions\">\r\n <b>Custom Functions</b>\r\n <p>\r\n Create and manage Custom Function that you can use in building Reports and Dashboards\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"visible: $root.settings.canAddFunction,click: createNewFunction\">Add new Function</button>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: buildCustomFunctions\">Rebuild Functions Library</button>\r\n <br />\r\n <hr />\r\n\r\n <div class=\"container-fluid\">\r\n <div class=\"row\">\r\n <div class=\"col-md-3 border-end\" style=\"height: 100vh; overflow-y: auto;\">\r\n <input id=\"searchInput\" class=\"form-control mb-2\" type=\"text\" placeholder=\"Search...\" data-bind=\"value: search, valueUpdate: 'input', visible: functions().length > 0\">\r\n <ul class=\"list-group\" data-bind=\"foreach: filteredFunctions\">\r\n <li class=\"list-group-item d-flex justify-content-between align-items-center\">\r\n <span data-bind=\"text: name\"></span>\r\n <div>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: $parent.selectFunction\">Edit</button>\r\n <button class=\"btn btn-danger btn-sm\" data-bind=\"click: function() { $parent.deleteFunction($data) }\">Delete</button>\r\n </div>\r\n </li>\r\n </ul>\r\n <div data-bind=\"if: functions().length == 0\">\r\n No Functions found\r\n </div>\r\n </div>\r\n <div class=\"col-md-9\" data-bind=\"with: selectedFunction\">\r\n <div style=\"padding-left: 10px;\">\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <b>Setup Function</b>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"mb-3\" data-bind=\"validationElement: functionName\">\r\n <label for=\"functionName\" class=\"form-label\">Function Name</label>\r\n <input id=\"functionName\" class=\"form-control\" required data-bind=\"value: name, valueUpdate: 'input'\" />\r\n <div class=\"invalid-feedback\">Function Name is required.</div>\r\n </div>\r\n <div class=\"mb-3\">\r\n <label for=\"functionType\" class=\"form-label\">Function Type</label>\r\n <select id=\"functionType\" class=\"form-control\" data-bind=\"value: functionType, event: { change: $parent.updateCodeEditorMode }\">\r\n <option value=\"csharp\">C#</option>\r\n <!--<option value=\"javascript\">JavaScript</option>\r\n <option value=\"sql\">SQL</option>-->\r\n </select>\r\n </div>\r\n <div class=\"mb-3\">\r\n <label for=\"functionDescription\" class=\"form-label\">Description</label>\r\n <textarea id=\"functionDescription\" class=\"form-control\" data-bind=\"value: description, valueUpdate: 'input'\" placeholder=\"Add any helpful description here for the user...\"></textarea>\r\n </div>\r\n\r\n <div>\r\n <b>Arguments</b>\r\n <table class=\"table table-bordered\">\r\n <thead>\r\n <tr>\r\n <th></th>\r\n <th>Name</th>\r\n <th>Description</th>\r\n <!--<th>Data Type</th>-->\r\n <th>Optional</th>\r\n <th></th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: parameters, tableSortable: { data: parameters, placeholder: 'sortable-placeholder' }\" >\r\n <tr>\r\n <td> <span class=\"fa fa-ellipsis-v\" aria-hidden=\"true\" title=\"Drag to reorder\"></span></td>\r\n <td>\r\n <input class=\"form-control\" data-bind=\"value: parameterName, valueUpdate: 'input'\" />\r\n <span class=\"text-danger\" data-bind=\"visible: name.hasError, text: name.validationMessage\"></span>\r\n </td>\r\n <td><input class=\"form-control\" data-bind=\"value: description, valueUpdate: 'input'\" placeholder=\"Friendly description for user...\" /></td>\r\n <!--<td>\r\n <select class=\"form-select\" data-bind=\"value: datatype\">\r\n <option>object</option>\r\n <option>string</option>\r\n <option>int</option>\r\n <option>float</option>\r\n <option>bool</option>\r\n </select>\r\n </td>-->\r\n <td> <input type=\"checkbox\" data-bind=\"checked: required, checkedValue: false, uncheckedValue: true\" /></td>\r\n <td><button class=\"btn btn-sm btn-danger\" data-bind=\"click: $parent.removeParameter\">Remove</button></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: addParameter\">Add Argument</button>\r\n </div>\r\n <br />\r\n <div class=\"mb-3\">\r\n <label for=\"codeEditor\" class=\"form-label\">Write the <b>Code</b> for the function below:</label>\r\n <div style=\"border: 1px solid\">\r\n <textarea id=\"codeEditor\" class=\"code-editor form-control\" data-bind=\"value: code\"></textarea>\r\n </div>\r\n </div>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $parent.saveFunction\">Save</button>\r\n <button class=\"btn btn-secondary\" data-bind=\"click: $parent.cancelEdit\">Cancel</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"schedules\">\r\n <b>Scheduled Reports</b>\r\n <p>\r\n View Schedules setup for sending Reports and Dashboards\r\n </p>\r\n <button class=\"btn btn-sm btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#sentHistoryModal\" data-bind=\"click: function() { loadSentHistory(1); }\">\r\n <span class=\"fa fa-history\"></span> View Send History\r\n </button>\r\n <hr />\r\n\r\n <div class=\"row\">\r\n <div class=\"col-md-12\">\r\n <div data-bind=\"visible: schedules().length === 0\">\r\n <i class=\"fa fa-exclamation-circle\"></i> No scheduled Reports or Dashboards available.\r\n </div>\r\n <div class=\"container-fluid\" data-bind=\"if: schedules().length > 0\">\r\n <div data-bind=\"foreach: schedules\">\r\n <div class=\"row border-bottom py-2\">\r\n <div class=\"col-12\">\r\n For <span class=\"text-muted\" data-bind=\"text: DashboardId === 0 ? 'Report' : 'Dashboard'\"></span>\r\n <b><span data-bind=\"text: Name\"></span></b>\r\n </div>\r\n </div>\r\n\r\n <!-- Inner schedule items -->\r\n <div class=\"row fw-bold bg-light py-2 d-none d-md-flex\">\r\n <div class=\"col-md\"><i class=\"fa fa-clock\"></i> Schedule</div>\r\n <div class=\"col-md\"><i class=\"fa fa-envelope\"></i> Email To</div>\r\n <div class=\"col-md\"><i class=\"fa fa-file\"></i> Format</div>\r\n <div class=\"col-md\"><i class=\"fa fa-history\"></i> Last Run</div>\r\n <div class=\"col-md\"><i class=\"fa fa-user\"></i> User ID</div>\r\n <div class=\"col-md\"><i class=\"fa fa-globe\"></i> Time Zone</div>\r\n <div class=\"col-md\"><i class=\"fa fa-cogs\"></i> Actions</div>\r\n </div>\r\n\r\n <div data-bind=\"foreach: { data: Schedules, as: 'item' }\">\r\n <div class=\"row border-bottom py-2 align-items-center\">\r\n <div class=\"col-md\" data-bind=\"text: item.ScheduleDisplay\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.EmailTo\"></div>\r\n <div class=\"col-md\"\r\n data-bind=\"if: item.Format && item.Format.trim().substring(0,1) === '{'\">\r\n <div data-bind=\"html: item.Format.slice(1,-1).split(',').join('<br>')\"></div>\r\n </div>\r\n <div class=\"col-md\"\r\n data-bind=\"if: !item.Format || item.Format.trim().substring(0,1) !== '{'\">\r\n <div data-bind=\"text: item.Format\"></div>\r\n </div>\r\n <div class=\"col-md\" data-bind=\"text: item.LastRun\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.UserId ? item.UserId : 'N/A'\"></div>\r\n <div class=\"col-md\" data-bind=\"text: item.Timezone ? item.Timezone : 'N/A'\"></div>\r\n <div class=\"col-md\">\r\n <button class=\"btn btn-sm btn-danger\" data-bind=\"click: $root.deleteSchedule\">\r\n <i class=\"fa fa-trash\"></i> Delete\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Modal -->\r\n<div class=\"modal\" id=\"column-modal\" role=\"dialog\" tabindex=\"-1\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editColumn()\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"myModalLabel\">\r\n Manage\r\n <label data-bind=\"text: ColumnName\"></label>\r\n </h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose options that will determine how users interact with this column on Reports</p>\r\n <div class=\"form-horizontal\">\r\n\r\n <ul class=\"nav nav-tabs\" role=\"tablist\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link active\" href=\"#column-main\" aria-controls=\"home\" role=\"tab\" data-bs-toggle=\"tab\">Main Options</a></li>\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link\" href=\"#column-foreign\" aria-controls=\"profile\" role=\"tab\" data-bs-toggle=\"tab\">Foreign Key Options</a></li>\r\n <li role=\"presentation\" class=\"nav-item\"><a class=\"nav-link\" href=\"#column-filter\" aria-controls=\"procedure\" role=\"tab\" data-bs-toggle=\"tab\">Filter Options</a></li>\r\n </ul>\r\n <div class=\"tab-content\">\r\n <br />\r\n <div role=\"tabpanel\" class=\"tab-pane active\" id=\"column-main\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Display_Name\" data-bind=\"attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">Display Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" id=\"DisplayName\" name=\"DisplayName\" type=\"text\" value=\"First Name\" data-bind=\"value: DisplayName, attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is a friendly name to display to your users\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Field_Type\" data-bind=\"\">Field Type</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"FieldType_SelectedId\" name=\"FieldType.SelectedId\" data-bind=\"value: FieldType\">\r\n <option value=\"Boolean\">Boolean</option>\r\n <option value=\"DateTime\">Date Time</option>\r\n <option value=\"Varchar\">Varchar</option>\r\n <option value=\"Money\">Money</option>\r\n <option value=\"Int\">Int</option>\r\n <option value=\"Double\">Double</option>\r\n <option value=\"Json\">Json</option>\r\n <option value=\"Date\">Date Only</option>\r\n <option value=\"Time\">Time Only</option>\r\n <option value=\"Percentage\">Percentage</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"FieldType\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" for=\"Primary_Key\" data-bind=\"\">Primary Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" data-val-required=\"The PrimaryKey field is required.\" id=\"PrimaryKey\" name=\"PrimaryKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:PrimaryKey\"><input name=\"PrimaryKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"PrimaryKey\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Do Not Display</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:DoNotDisplay\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the column will not be displayed on Report Designer, but can still be used on Global Data Filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control-group\" data-bind=\"if: FieldType() == 'Json'\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">JSON Data Structure</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <textarea class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" data-bind=\"value: JsonStructure, attr:{placeholder:'Please paste in Sample Json with all columns for this JSON data field'}\" rows=\"5\"></textarea>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"You can paste in a sample Json blob with all the columns you want to use in this field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"column-filter\">\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Require Filter if Column is selected</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForceFilter\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the column will always require the user to pick a filtered value\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Require Filter if Table is selected</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForceFilterForTable\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is checked, the report will always require the user to pick a filter value if user picks the column in report\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: FieldType() == 'DateTime'\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-4 col-sm-4 control-label\" data-bind=\"\">Restrict Filter Date Range</label>\r\n <div class=\"col-md-1 col-sm-1\">\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked: restrictDateRangeFilter\" />\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\" data-bind=\"if: restrictDateRangeFilter\">\r\n <input class=\"form-control\" type=\"number\" data-bind=\"value: restrictDateRangeNumber\" />\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\" data-bind=\"if: restrictDateRangeFilter\">\r\n <select class=\"form-select\" data-bind=\"value: restrictDateRangeValue\">\r\n <option value=\"Days\">Day(s)</option>\r\n <option value=\"Months\">Month(s)</option>\r\n <option value=\"Years\">Year(s)</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-2 col-sm-2\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"If this is selected, user will not be able to pick date range larger than this selection\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div role=\"tabpanel\" class=\"tab-pane\" id=\"column-foreign\">\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Foreign Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" data-val-required=\"The ForeignKey field is required.\" id=\"ForeignKey\" name=\"ForeignKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForeignKey\"><input name=\"ForeignKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys allows friendly selection in Filters using a Dropdown List\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Foreign Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: JoinTable, visible:ForeignKey(), options: $root.Tables.availableTables, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" style=\"display: none;\">Foreign Join</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignJoin_SelectedId\" name=\"ForeignJoin.SelectedId\" data-bind=\"value: ForeignJoin, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" style=\"display: none;\">\r\n <option selected=\"selected\" value=\"Inner\">Inner</option>\r\n <option value=\"Left\">Left</option>\r\n <option value=\"Right\">Right</option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignJoin\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeId'}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\">Foreign Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignKeyField\" name=\"ForeignKeyField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignKeyField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Key field is a Column from the Foreign table which is used as the Key field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"if: $root.isStoredProcColumn() == false\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeName'}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\">Foreign Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" id=\"ForeignValueField\" name=\"ForeignValueField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignValueField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Value field is a Column from the Foreign table which is used to display the value to the User in the Report Designer\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: ForeignKey\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Only for Filter?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignFilterOnly\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Check this option if you would like to use this for Filtering only, and not for SQL Joins\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"alert alert-info\">\r\n You can setup a cascading filter by setting up a parent for the foreign key below\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Setup Foreign Key Parent?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignParentKey\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys parent allows cascading dropdown selection in Filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignParentKey(), attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Parent Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: ForeignJoinTable, visible:ForeignParentKey(), options: $root.Tables.model, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignJoinTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeId'}\">Parent Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: ForeignJoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentKeyField, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeId\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Parent Key field is a Column from the Parent table which is used as the key in cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeName'}\">Parent Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: ForeignJoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentValueField, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeName\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Parent Value field is a Column from the Parent table which is used to display the value to the User in the Report Designer for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\" data-bind=\"visible:ForeignParentKey()\" style=\"display: none;\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr: {required: ForeignParentKey()?'True':null, placeholder: 'Ex EmployeeName'}\">Foreign Key Filter Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignParentApplyTo, attr: {required: ForeignParentKey()?'True':null}\" placeholder=\"Ex EmployeeName\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign Key Filter Value field is a Column from the Foreign table where the selected parent filter will be applied for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <!--<div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Require Foreign Key Parent?</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" type=\"checkbox\" data-bind=\"checked:ForeignParentRequired\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Foreign keys parent can be optional or set to required for cascading filters\"></span>\r\n </div>\r\n </div>\r\n </div>-->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" title=\"Manage Role Access\" data-bs-toggle=\"modal\" data-bs-target=\"#role-access-modal\" data-bind=\"click: $root.selectAllowedRoles\">\r\n <i class=\"fa fa-user\"></i>Manage Role Access\r\n </button>\r\n @* <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\" data-bind=\"click: function(){$root.saveColumn()}\">Done</button> *@\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"modal\" id=\"joinModal\" tabindex=\"-1\" role=\"dialog\">\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Joins Diagram</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\" style=\"max-height:800px;overflow:auto;\">\r\n <div id=\"joinDiagram\" style=\"width:2000px;height:1200px;position:relative;border:1px solid #ccc;\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"modal\" id=\"procedure-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content \">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Add Stored Proc</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"row\">\r\n <label class=\"col-md-2 control-label\">\r\n Search for\r\n </label>\r\n <div class=\"col-md-6\">\r\n <input type=\"text\" class=\"form-control\" data-bind=\"value: searchProcedureTerm\" placeholder=\"Search stored procedures by name\" />\r\n </div>\r\n <div class=\"col-md-2\">\r\n <button class=\"btn btn-primary\" data-bind=\"click: searchStoredProcedure\">Search</button>\r\n </div>\r\n </div>\r\n <br />\r\n <div class=\"menu g-3\" style=\"margin-left: 20px;\" data-bind=\"foreach: foundProcedures\">\r\n <div class=\"menu-category card\" style=\"float:left\">\r\n <div class=\"card-header clearfix\" style=\"\">\r\n <div class=\"float-start\">\r\n <label>\r\n <span data-bind=\"text: TableName\"></span>\r\n <span class=\"label-xs\">Procedure</span>\r\n </label>\r\n <button class=\"btn btn-sm\" title=\"Save this Procedure\" data-bind=\"click: function(){$root.saveProcedure($data.TableName, true);}\">\r\n <span class=\"fa fa-save\"></span>\r\n </button>\r\n </div>\r\n <a class=\"float-end\" data-bs-toggle=\"collapse\" data-bind=\"attr: {'data-bs-target': '#sp_'+$index()}\">\r\n <span class=\"fa fa-chevron-down\"></span>\r\n </a>\r\n </div>\r\n <div data-bind=\"attr: {id: 'sp_'+$index()}\" class=\"panel-collapse collapse in\">\r\n <div class=\"card-body\">\r\n Display Name<br />\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <label class=\"small\">Columns</label>\r\n\r\n <div class=\"list-group\" data-bind=\"foreach: Columns\">\r\n <div class=\"list-group-item\">\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: FieldType\"></span>\r\n </div>\r\n </div>\r\n <label class=\"small\">Parameters</label>\r\n\r\n <div class=\"list-group\" data-bind=\"foreach: Parameters\">\r\n <div class=\"list-group-item\">\r\n <span data-bind=\"editable: DisplayName\"></span>\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: ParameterDataTypeString\"></span><br />\r\n Default Value: <span data-bind=\"editable: ParameterValue\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-primary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"parameter-modal\" role=\"dialog\" tabindex=\"-1\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editParameter()\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"myModalLabel\">\r\n Manage\r\n <label data-bind=\"text: ParameterName\"></label>\r\n </h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose options that will determine how users interact with this parameter on Reports</p>\r\n <div class=\"form-horizontal\">\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">Display Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box single-line\" data-val=\"true\" data-val-required=\"The DisplayName field is required.\" name=\"DisplayName\" type=\"text\" value=\"First Name\" data-bind=\"value: DisplayName, attr:{placeholder:'Ex First Name'}\" placeholder=\"Ex First Name\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is a friendly name to display to your users\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Default Value</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <span data-bind=\"editable: ParameterValue\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Hidden Parameter</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked: Hidden, enable: ParameterValue\">\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Required</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" type=\"checkbox\" value=\"true\" data-bind=\"checked:Required\">\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"\">Use Lookup Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <div class=\"checkbox\">\r\n <label>\r\n <input class=\"check-box\" data-val=\"true\" name=\"ForeignKey\" type=\"checkbox\" value=\"true\" data-bind=\"checked:ForeignKey\"><input name=\"ForeignKey\" type=\"hidden\" value=\"false\">\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Using lookup table allows friendly selection in report using a Dropdown List\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex tblEmployees'}\" placeholder=\"Ex tblEmployees\" style=\"display: none;\">Lookup Table</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: JoinTable, visible:ForeignKey(), options: $root.Procedures.tables, optionsText: 'TableName'\" placeholder=\"Ex tblEmployees\" style=\"display: none;\"></select>\r\n\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span class=\"field-validation-valid help-inline indent\" data-valmsg-for=\"ForeignTable\" data-valmsg-replace=\"true\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeId'}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\">Lookup Key Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" name=\"ForeignKeyField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignKeyField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeId\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Foreign Key field is a Column from the Foreign table which is used as the Key field\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"control-group\">\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\" data-bind=\"visible:ForeignKey(), attr: {required: ForeignKey()?'True':null, placeholder: 'Ex EmployeeName'}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\">Lookup Value Field</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" name=\"ForeignValueField\" data-bind=\"options: JoinTable().Columns, optionsText: 'ColumnName', optionsValue: 'ColumnName', value: ForeignValueField, visible:ForeignKey(), attr: {required: ForeignKey()?'True':null}\" placeholder=\"Ex EmployeeName\" style=\"display: none;\"></select>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bind=\"visible:ForeignKey()\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" style=\"display: none;\" title=\"Lookup Value field is a Column from the Lookup table which is used to display the value to the User in the Report Designer\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n <div class=\"modal\" id=\"role-access-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: editAllowedRoles\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Manage Access by Roles</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose User Roles that will have Access</p>\r\n <p class=\"small\">Note: All Users will have access if no restricted roles are setup</p>\r\n <div data-bind=\"if: $root.allRoles().length === 0\">\r\n <div class=\"alert alert-warning\">\r\n <strong>No roles available.</strong> Please add roles first.\r\n </div>\r\n </div>\r\n <div data-bind=\"if: $root.allRoles().length > 0\">\r\n <div class=\"list-group\" data-bind=\"foreach: $root.allRoles\">\r\n <div class=\"list-group-item\" style=\"padding: 2px 10px;\">\r\n <label>\r\n <input type=\"checkbox\"\r\n data-bind=\"value: $data,\r\n checked: $root.editAllowedRoles().AllowedRoles\" />\r\n <span data-bind=\"text: $data\"></span>\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal\" id=\"category-manage-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: manageCategories\">\r\n <div class=\"modal-header\">\r\n <b class=\"modal-title\">Manage Categories for <span data-bind=\"text: TableName\"></span></b>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div data-bind=\"visble: $root.Categories().lenth == 0\">\r\n No categories have been set up yet.\r\n </div>\r\n <div class=\"list-group\" data-bind=\"foreach: $root.Categories\">\r\n <div class=\"checkbox list-group-item\" style=\"padding-top: 2px; padding-bottom: 2px;\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: $parent.Categories, checkedValue: $data\" />\r\n <span data-bind=\"text: Name\"></span> <!-- Display category name -->\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n<div class=\"modal\" id=\"category-modal\" role=\"dialog\" tabindex=\"-2\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <b class=\"modal-title\">Manage Categories</b>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>\r\n You can organize the display of tables in the Report Designer by assigning categories here.\r\n </p>\r\n <!-- Table for Categories -->\r\n <table class=\"table table-bordered\">\r\n <thead>\r\n <tr>\r\n <th>Category Name</th>\r\n <th>Description</th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: $root.Categories\">\r\n <tr>\r\n <td>\r\n <input type=\"text\" data-bind=\"value: Name, visible: $root.editingCategoryIndex() === $index()\" class=\"form-control\" />\r\n <span id=\"cat-name\" data-bind=\"text: Name, visible: $root.editingCategoryIndex() !== $index(), attr: { id: Id ? 'cat-name-' + Id :undefined }\" style=\"color: #6c757d;\"></span>\r\n </td>\r\n <td>\r\n <input type=\"text\" data-bind=\"value: Description, visible: $root.editingCategoryIndex() === $index()\" class=\"form-control\" />\r\n <span id=\"cat-desc\" data-bind=\"text: Description, visible: $root.editingCategoryIndex() !== $index(), attr: { id: Id ? 'cat-desc-' + Id :undefined }\" style=\"color: #6c757d;\"></span>\r\n </td>\r\n <td class=\"d-flex\">\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"visible: $root.editingCategoryIndex() !== $index() && Id !== 0, click: function() { $root.toggleEdit($index()) }\">\r\n <i class=\"fa fa-edit\"></i>\r\n </button>\r\n <button class=\"btn btn-success btn-sm\" data-bind=\"visible: $root.editingCategoryIndex() === $index() && Id !== 0, click: function() { $root.saveCategory($index()) }\" style=\"margin-left: 5px;\">\r\n <i class=\"fa fa-save\"></i>\r\n </button>\r\n <button class=\"btn btn-danger btn-sm\" data-bind=\"click: $root.removeCategory\">\r\n <i class=\"fa fa-trash\"></i>\r\n </button>\r\n </td>\r\n </tr>\r\n </tbody>\r\n <tfoot>\r\n <tr>\r\n <td>\r\n <input class=\"form-control\" type=\"text\" data-bind=\"value: $root.newCategoryName\" placeholder=\"Category Name\">\r\n </td>\r\n <td>\r\n <input class=\"form-control\" type=\"text\" data-bind=\"value: $root.newCategoryDescription\" placeholder=\"Description\">\r\n </td>\r\n <td>\r\n <button class=\"btn btn-primary btn-sm\" data-bind=\"click: $root.addCategory\">Add</button>\r\n </td>\r\n </tr>\r\n </tfoot>\r\n </table>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: $root.saveCategories\">Save</button>\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Done</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"clearfix\"></div>\r\n\r\n<div class=\"modal\" id=\"add-connection-modal\" role=\"dialog\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: newDataConnection\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\"><span data-bind=\"text: $root.editingDataConnection() ? 'Edit' : 'Add a new'\"></span> Data Connection</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <p>Choose User Roles that will have Access</p>\r\n <p class=\"small\">Note: All Users will have access if no restricted roles are setup</p>\r\n\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Connection Name</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box\" data-val=\"true\" data-val-required=\"Connection Name is required.\" type=\"text\" data-bind=\"value: Name\" placeholder=\"\" id=\"add-conn-name\">\r\n </div>\r\n </div>\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Connection Key</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <input class=\"form-control text-box\" data-val=\"true\" data-val-required=\"Connection Key is required.\" type=\"text\" data-bind=\"value: ConnectionKey\" placeholder=\"\" id=\"add-conn-key\">\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"This is the Connection Key in your application settings for your SQL Connection String\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\" data-bind=\"visible: $root.editingDataConnection\">\r\n <div class=\"check-box col-md-9 col-sm-9\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: UseSchema\">\r\n Use Schema\r\n </label>\r\n </div>\r\n <div class=\"col-md-3 col-sm-3\">\r\n <span data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" class=\"fa fa-question-circle helptip\" title=\"Use Schema in SQL when building query\"></span>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\">\r\n <label class=\"col-md-3 col-sm-3 col-form-label\">Database Type</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" data-bind=\"value: DatabaseType\" required>\r\n <option>MS SQL</option>\r\n <option>MySql</option>\r\n <option>PostgreSQL</option>\r\n <option>Oracle</option>\r\n <option value=\"OleDB\">OleDB/Others</option>\r\n </select>\r\n </div>\r\n </div>\r\n\r\n <div class=\"form-group row\" data-bind=\"hidden: $root.editingDataConnection\">\r\n <div class=\"check-box col-md-12\">\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: copySchema\">\r\n Copy Schema from existing Connection\r\n </label>\r\n </div>\r\n </div>\r\n <div class=\"form-group row\" data-bind=\"visible: copySchema\">\r\n <label class=\"col-md-3 col-sm-3 control-label\">Choose Connection</label>\r\n <div class=\"col-md-6 col-sm-6\">\r\n <select class=\"form-select\" style=\"max-width: 300px;\" data-bind=\"options: $root.DataConnections, optionsText: 'DataConnectName', optionsValue: 'DataConnectGuid', value: copyFrom\"></select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bind=\"click: $root.updateDataConnection, visible: $root.editingDataConnection()\">Update</button>\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bind=\"click: $root.addDataConnection, visible: !$root.editingDataConnection()\">Create</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"clearfix\"></div>\r\n\r\n<div class=\"modal\" id=\"data-preview-modal\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\">\r\n <div class=\"modal-content\" data-bind=\"with: previewData\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">Preview Table</h4>\r\n <button type=\"button\" class=\"btn-close float-end\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div style=\"overflow-x: auto; max-height: 500px; overflow-y: auto;\">\r\n <table class=\"table table-striped table-hover table-condensed\">\r\n <thead style=\"position: sticky; top: -1px; z-index: 2; background-color: #f8f9fa;\">\r\n <tr data-bind=\"foreach: Columns\">\r\n <th>\r\n <span data-bind=\"text: ColumnName, attr: { title: DataType.replace('System.', '') }\"></span>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: Rows\">\r\n <tr data-bind=\"foreach: Items\">\r\n <td>\r\n <span data-bind=\"html: FormattedValue\"></span>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"custom-sql-modal\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"myModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\" data-bind=\"with: customSql\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Enter Select SQL for your Data</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"form-group\" data-bind=\"validationElement: customTableName\">\r\n <label for=\"custom-table-name\">Custom Table Name</label>\r\n <input type=\"text\" class=\"form-control\" name=\"customTableName\" placeholder=\"Enter table name\" data-bind=\"textInput: customTableName\" required>\r\n <div class=\"invalid-feedback\">Custom Table Name is required.</div>\r\n </div>\r\n <div data-bind=\"visible: useAi\">\r\n <p id=\"query-input\" class=\"query-input\">\r\n Show me \r\n </p>\r\n <button data-bind=\"click: buildSqlUsingAi\" class=\"btn btn-primary btn-sm\">Process with ChatGPT</button>\r\n <button data-bind=\"click: textQuery.resetQuery\" class=\"btn btn-secondary btn-sm\">Start over</button>\r\n <hr />\r\n </div>\r\n\r\n <div class=\"form-group\" data-bind=\"validationElement: customSql\">\r\n <label for=\"custom-sql\">Custom SQL</label> |\r\n <label>\r\n <input type=\"checkbox\" data-bind=\"checked: dynamicColumns\">\r\n <span title=\"Setup a table that returns dynamic columns to pick from\">Table with Dynamic Columns</span>\r\n </label> |\r\n <a href=\"#\" data-bind=\"click: beautifySql\">Beautify Sql</a>\r\n <textarea class=\"form-control\" style=\"height: 240px;\" name=\"customSql\" data-bind=\"textInput: customSql\" required></textarea>\r\n <div class=\"invalid-feedback\">Custom SQL is required.</div>\r\n\r\n <div data-bind=\"if: dynamicColumns\">\r\n <label>Add SQL code to use the dynamic column</label>\r\n <textarea class=\"form-control\" style=\"height: 240px;\" name=\"columnTranslation\" data-bind=\"textInput: columnTranslation\" required></textarea>\r\n <label>Pick Values Table</label>\r\n <select class=\"form-select input-medium\" data-bind=\"options: $root.Tables.availableTables, optionsText: 'DisplayName', optionsValue: 'Id', optionsCaption: 'Choose Values Table...', value: dynamicValuesTableId\"></select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: executeSql\">Save changes</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Tables/Views Json File Modal -->\r\n<div class=\"modal\" id=\"uploadTablesFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadTablesFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageTablesJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadTablesFileModalLabel\">Import Tables/Views (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerTablesFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"tablesFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleTablesFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Tables/Views File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadTablesFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Import Joins Json File Modal -->\r\n<div class=\"modal\" id=\"uploadJoinsFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadJoinsFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJoinsJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadJoinsFileModalLabel\">Import Joins (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerJoinsFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"joinsFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleJoinsFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Joins File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadJoinsFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<!-- Import StoredProcedures Json File Modal -->\r\n<div class=\"modal\" id=\"uploadStoredProceduresFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadStoredProceduresFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageStoredProceduresJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadStoredProceduresFileModalLabel\">Import Stored Procedures (Previously Exported)</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerStoredProceduresFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n click to select Json file\r\n </div>\r\n <input type=\"file\" id=\"storedProceduresFileInputJson\" accept=\".json\" style=\"display: none;\" data-bind=\"event: { change: handleStoredProceduresFileSelect }\">\r\n <div data-bind=\"visible: fileName\">\r\n <p>Selected Stored Procedures File: <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadStoredProceduresFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"modal\" id=\"searchModal\" tabindex=\"-1\" aria-hidden=\"true\" data-bind=\"with: $root\">\r\n <div class=\"modal-dialog modal-xl modal-dialog-scrollable\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Bulk Manage Reports Access and Export</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"d-flex gap-2 mb-4 align-items-center\">\r\n <input type=\"text\" class=\"form-control\" placeholder=\"Search Reports\"\r\n data-bind=\"value: searchQuery, valueUpdate: 'input'\">\r\n <button class=\"btn btn-sm btn-outline-primary flex-shrink-0\" title=\"Select all Filtered\"\r\n data-bind=\"click: selectAllFiltered\">\r\n Select All\r\n </button>\r\n <button class=\"btn btn-sm btn-outline-secondary flex-shrink-0\" title=\"Deselect all Filtered\"\r\n data-bind=\"click: deselectAllFiltered\">\r\n Deselect All\r\n </button>\r\n </div>\r\n <div data-bind=\"foreach: filteredReportsAndFolders\">\r\n <div class=\"card mb-3\">\r\n <div class=\"card-header\">\r\n <div class=\"d-flex fw-bold\">\r\n <div class=\"w-50 flex-grow-1\">\r\n <input type=\"checkbox\" data-bind=\"checked: allReportsSelected\">\r\n <span data-bind=\"text: folder\"></span>\r\n </div>\r\n <div class=\"w-25\">View</div>\r\n <div class=\"w-25\">Manage</div>\r\n <div class=\"w-25\">Delete</div>\r\n <div class=\"w-25\">Client ID</div>\r\n </div>\r\n </div>\r\n <!-- Reports List -->\r\n <ul class=\"list-group list-group-flush\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"w-50 flex-grow-1\">\r\n <input type=\"checkbox\" data-bind=\"checked: isSelected\">\r\n <span data-bind=\"text: reportName\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: viewOnlyUserRole ? viewOnlyUserRole: 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: userRole ? userRole : 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: deleteOnlyUserRole ? deleteOnlyUserRole : 'Any User'\"></span>\r\n </div>\r\n <div class=\"w-25\">\r\n <span class=\"badge text-bg-info text-white\" data-bind=\"text: clientId ? clientId : 'Any User'\"></span>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n <div class=\"p-2 text-muted\" data-bind=\"visible: reports.length === 0\">\r\n No matching reports found\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button class=\"btn btn-success\" data-bind=\"click: exportFoldersReportJson\">Export Selected</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.openApplySecurityModal, enable: $root.anyReportSelected\">Apply Security to All Selected</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.deleteSelectedItems, enable: $root.anyReportSelected\">Delete All Selected</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"modal\" id=\"applySecurityModal\" tabindex=\"-1\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg\" data-bind=\"if: $root.anyReportSelected\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\">Apply Security to All Selected</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div data-bind=\"template: { name: 'manage-access-template', data: $root.manageAccess }\"></div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button class=\"btn btn-primary\" data-bind=\"click: $root.applySecurityToAll\">Apply to All</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<!-- Import Json File Modal -->\r\n<div class=\"modal\" id=\"uploadFileModal\" tabindex=\"-1\" aria-labelledby=\"uploadFileModalLabel\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\">\r\n <div class=\"modal-content\" data-bind=\"with: ManageJsonFile\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\" id=\"uploadFileModalLabel\">Import previously Exported Reports</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n\r\n <div class=\"alert alert-info small\">\r\n <strong>Instructions:</strong><br />\r\n \u2022 Select a <code>.json</code> file previously exported from Dotnet Report.<br />\r\n \u2022 The file may include multiple reports and their folders.<br />\r\n \u2022 Any missing folders will be created automatically.<br />\r\n \u2022 If a report with the same name already exists, you will be prompted to:\r\n <em>Skip</em>, <em>Overwrite</em>, or <em>Make a Copy</em>.<br />\r\n \u2022 Once uploaded, all imported reports will be available immediately.\r\n </div>\r\n\r\n <div id=\"dropzone\" class=\"dropzone\"\r\n data-bind=\"event: {click: triggerFileInput }\"\r\n style=\"border: 2px dashed #007bff; border-radius: 5px; padding: 30px; text-align: center; color: #007bff; cursor: pointer;\">\r\n Click here to select a JSON file\r\n </div>\r\n\r\n <input type=\"file\" id=\"fileInputJson\" accept=\".json\" style=\"display: none;\"\r\n data-bind=\"event: { change: handleFileSelect }\">\r\n\r\n <div class=\"mt-3\" data-bind=\"visible: fileName\">\r\n <p><strong>Selected File:</strong> <span data-bind=\"text: fileName\"></span></p>\r\n </div>\r\n\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: uploadFile\">Upload</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"sentHistoryModal\" tabindex=\"-1\" role=\"dialog\">\r\n <div class=\"modal-dialog modal-xl modal-dialog-scrollable\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h5 class=\"modal-title\"><i class=\"fa fa-history\"></i> Schedule Send History</h5>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"row g-2 align-items-end mb-3 border-bottom pb-2\">\r\n <div class=\"col-sm-3\">\r\n <label class=\"form-label small mb-0\">From</label>\r\n <input type=\"date\" class=\"form-control form-control-sm\" data-bind=\"value: sentHistoryStartDate\" />\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <label class=\"form-label small mb-0\">To</label>\r\n <input type=\"date\" class=\"form-control form-control-sm\" data-bind=\"value: sentHistoryEndDate\" />\r\n </div>\r\n <div class=\"col-sm-auto\">\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: function() { loadSentHistory(1); }, enable: !sentHistoryLoading()\">Search</button>\r\n <button class=\"btn btn-sm btn-secondary\" data-bind=\"click: function() { sentHistoryStartDate(''); sentHistoryEndDate(''); loadSentHistory(1); }, enable: !sentHistoryLoading()\">Clear</button>\r\n </div>\r\n </div>\r\n <div data-bind=\"visible: sentHistoryLoading() && sentHistory().length === 0\" class=\"text-center py-3 text-muted\">\r\n <i class=\"fa fa-spinner fa-spin\"></i> Loading...\r\n </div>\r\n <div data-bind=\"visible: !sentHistoryLoading() && sentHistory().length === 0\" class=\"text-center py-3 text-muted\">\r\n <i class=\"fa fa-inbox\"></i> No history for this range.\r\n </div>\r\n <div data-bind=\"visible: sentHistory().length > 0\">\r\n <table class=\"table table-sm table-striped\">\r\n <thead>\r\n <tr>\r\n <th>When</th>\r\n <th>Type</th>\r\n <th>Name</th>\r\n <th>Sent To</th>\r\n <th>Format</th>\r\n <th>Result</th>\r\n <th>Message</th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: sentHistory\">\r\n <tr>\r\n <td><small data-bind=\"text: created\"></small></td>\r\n <td><span class=\"badge bg-secondary\" data-bind=\"text: itemType\"></span></td>\r\n <td data-bind=\"text: itemName || ('#' + (itemId || ''))\"></td>\r\n <td><small data-bind=\"text: sentTo\"></small></td>\r\n <td data-bind=\"text: format\"></td>\r\n <td>\r\n <span data-bind=\"css: isError ? 'badge bg-danger' : (result === 'Triggered' ? 'badge bg-info' : 'badge bg-success'), text: result\"></span>\r\n </td>\r\n <td><small class=\"text-muted\" data-bind=\"text: message\"></small></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <div class=\"d-flex justify-content-between align-items-center mt-2\">\r\n <small class=\"text-muted\">\r\n Page <span data-bind=\"text: sentHistoryPage\"></span> of <span data-bind=\"text: sentHistoryTotalPages\"></span>\r\n (<span data-bind=\"text: sentHistoryTotal\"></span> total)\r\n </small>\r\n <div>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: function() { loadSentHistory(sentHistoryPage() - 1); }, enable: sentHistoryPage() > 1 && !sentHistoryLoading()\">\r\n <i class=\"fa fa-chevron-left\"></i> Prev\r\n </button>\r\n <button class=\"btn btn-sm btn-outline-secondary\" data-bind=\"click: function() { loadSentHistory(sentHistoryPage() + 1); }, enable: sentHistoryPage() < sentHistoryTotalPages() && !sentHistoryLoading()\">\r\n Next <i class=\"fa fa-chevron-right\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: function() { loadSentHistory(sentHistoryPage()); }\">\r\n <span class=\"fa fa-refresh\"></span> Refresh\r\n </button>\r\n <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->\r\n</div>", styles: [".glyphicon-ok:before{content:\"\\f00c\"}.glyphicon-remove:before{content:\"\\f00d\"}.glyphicon{display:inline-block;font: 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.table-name-label{display:inline-block;max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}\n"] }]
|
|
13513
13513
|
}], ctorParameters: () => [{ type: i0.Injector }, { type: i1.DomSanitizer }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
|
|
13514
13514
|
type: Inject,
|
|
13515
13515
|
args: [BASE_URL_TOKEN]
|