dotnetreport-ng 6.2.1 → 6.2.2-beta

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/dotnetreport-ng-6.2.2-beta.tgz +0 -0
  2. package/fesm2022/dotnetreport-ng.mjs +170 -209
  3. package/fesm2022/dotnetreport-ng.mjs.map +1 -1
  4. package/index.d.ts +68 -5
  5. package/package.json +4 -6
  6. package/dotnetreport-ng-6.2.1.tgz +0 -0
  7. package/esm2022/dotnetreport-ng.mjs +0 -5
  8. package/esm2022/lib/dotnetdashboard/dotnetdashboard.component.mjs +0 -3246
  9. package/esm2022/lib/dotnetreport/dotnetreport.component.mjs +0 -3202
  10. package/esm2022/lib/dotnetreport-lib.di.mjs +0 -3
  11. package/esm2022/lib/dotnetreport-lib.module.mjs +0 -46
  12. package/esm2022/lib/dotnetreport-lib.service.mjs +0 -15
  13. package/esm2022/lib/dotnetsetup/dotnetsetup.component.mjs +0 -3192
  14. package/esm2022/public-api.mjs +0 -9
  15. package/lib/dotnetdashboard/dotnetdashboard.component.d.ts +0 -24
  16. package/lib/dotnetreport/dotnetreport.component.d.ts +0 -23
  17. package/lib/dotnetreport-lib.di.d.ts +0 -2
  18. package/lib/dotnetreport-lib.module.d.ts +0 -12
  19. package/lib/dotnetreport-lib.service.d.ts +0 -6
  20. package/lib/dotnetsetup/dotnetsetup.component.d.ts +0 -22
  21. package/public-api.d.ts +0 -5
package/fesm2022/dotnetreport-ng.mjs CHANGED
@@ -1,26 +1,14 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Injectable, InjectionToken, Component, Inject, NgModule } from '@angular/core';
3
- import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
2
+ import { InjectionToken, Inject, Component } from '@angular/core';
3
+ import * as i3 from '@angular/router';
4
+ import { RouterOutlet } from '@angular/router';
5
+ import { CommonModule } from '@angular/common';
4
6
  import * as i1 from '@angular/platform-browser';
5
7
  import * as i2 from '@angular/common/http';
6
- import * as i3 from '@angular/router';
7
-
8
- class DotnetReportService {
9
- constructor() {
10
- }
11
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DotnetReportService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
12
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DotnetReportService, providedIn: 'root' });
13
- }
14
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DotnetReportService, decorators: [{
15
- type: Injectable,
16
- args: [{
17
- providedIn: 'root'
18
- }]
19
- }], ctorParameters: () => [] });
20
8
 
21
9
  const BASE_URL_TOKEN = new InjectionToken('BASE_URL');
22
10
 
23
- class DotnetreportComponent {
11
+ class DotnetdashboardComponent {
24
12
  sanitizer;
25
13
  cdref;
26
14
  baseUrl;
@@ -28,61 +16,77 @@ class DotnetreportComponent {
28
16
  route;
29
17
  baseServiceUrl;
30
18
  reportTemplates;
31
- queryParams;
19
+ queryParams = {};
32
20
  constructor(injector, sanitizer, cdref, baseUrl, http, route) {
33
21
  this.sanitizer = sanitizer;
34
22
  this.cdref = cdref;
35
23
  this.baseUrl = baseUrl;
36
24
  this.http = http;
37
25
  this.route = route;
38
- this.baseServiceUrl = this.baseUrl + '/api';
26
+ this.baseServiceUrl = this.baseUrl + '/api'; // "http://localhost:39378"; \
39
27
  this.reportTemplates = "";
40
28
  }
41
29
  ngOnInit() {
30
+ var reports = [];
31
+ var dashboards = [];
32
+ var adminMode = localStorage.getItem('reportAdminMode') ?? false;
33
+ let getDashboardsUrl = this.baseServiceUrl + "/DotNetReportApi/GetDashboards?adminMode=" + adminMode;
34
+ let loadSavedDashboard = this.baseServiceUrl + "/DotNetReportApi/LoadSavedDashboard";
42
35
  let getUsersAndRolesUrl = this.baseServiceUrl + "/DotNetReportApi/GetUsersAndRoles";
43
36
  getUsersAndRolesUrl = getUsersAndRolesUrl.replace(/[?&]$/, "");
44
- this.queryParams = this.route.snapshot.queryParams;
45
- this.http.get(getUsersAndRolesUrl).subscribe((response) => {
46
- let result = response;
47
- let vm = new reportViewModel({
48
- runReportUrl: this.baseServiceUrl + '/DotNetReport/Report',
49
- reportWizard: $("#modal-reportbuilder"),
50
- execReportUrl: this.baseServiceUrl + '/DotNetReportApi/RunReport',
51
- runLinkReportUrl: this.baseServiceUrl + '/DotNetReportApi/RunReportLink',
52
- getSchemaFromSql: this.baseServiceUrl + '/DotNetReportApi/GetSchemaFromSql',
53
- linkModal: $("#linkModal"),
54
- reportHeader: "report-header",
55
- fieldOptionsModal: $("#fieldOptionsModal"),
56
- lookupListUrl: this.baseServiceUrl + '/DotNetReportApi/GetLookupList',
57
- apiUrl: this.baseServiceUrl + '/DotNetReportApi/CallReportApi',
58
- runReportApiUrl: this.baseServiceUrl + '/DotNetReportApi/RunReportApi',
59
- getUsersAndRolesUrl: this.baseServiceUrl + '/DotNetReportApi/GetUsersAndRoles',
60
- userSettings: result,
61
- dataFilters: result.dataFilters,
62
- runExportUrl: this.baseServiceUrl + '/DotNetReportApi/',
63
- getTimeZonesUrl: this.baseServiceUrl + '/DotNetReportApi/GetAllTimezones',
64
- printReportUrl: this.baseUrl + '/DotNetReport/ReportPrint',
65
- samePageOnRun: true,
66
- reportMode: this.queryParams["linkedreport"] == "true" ? "linked" : "",
67
- reportId: this.queryParams["reportId"] || 0,
37
+ this.http.get(getDashboardsUrl).subscribe((dashboardData) => {
38
+ dashboardData.forEach((d) => {
39
+ dashboards.push({ id: d.Id, name: d.Name, description: d.Description, selectedReports: d.SelectedReports, schedule: d.Schedule, userId: d.UserId, userRoles: d.UserRoles, viewOnlyUserId: d.ViewOnlyUserId, viewOnlyUserRoles: d.ViewOnlyUserRoles, clientId: d.ClientId, canManage: d.CanManage });
40
+ });
41
+ this.queryParams = this.route.snapshot.queryParams;
42
+ var dashboardId = parseInt(this.queryParams['id'] || '0');
43
+ if (!dashboardId && dashboards.length > 0) {
44
+ dashboardId = dashboards[0].id;
45
+ }
46
+ this.http.get(loadSavedDashboard + "?id=" + dashboardId).subscribe((reportsData) => {
47
+ reportsData.forEach((r) => {
48
+ reports.push({ reportSql: r.ReportSql, reportId: r.ReportId, reportFilter: r.ReportFilter, connectKey: r.ConnectKey, x: r.X, y: r.Y, width: r.Width, height: r.Height });
49
+ });
50
+ this.http.get(getUsersAndRolesUrl).subscribe((response) => {
51
+ let result = response;
52
+ let vm = new dashboardViewModel({
53
+ runReportUrl: this.baseServiceUrl + '/DotNetReport/Report',
54
+ execReportUrl: this.baseServiceUrl + '/DotNetReportApi/RunReport',
55
+ runLinkReportUrl: this.baseServiceUrl + '/DotNetReportApi/RunReportLink',
56
+ reportWizard: $("#modal-reportbuilder"),
57
+ lookupListUrl: this.baseServiceUrl + '/DotNetReportApi/GetLookupList',
58
+ apiUrl: this.baseServiceUrl + '/DotNetReportApi/CallReportApi',
59
+ runReportApiUrl: this.baseServiceUrl + '/DotNetReportApi/RunReportApi',
60
+ getSchemaFromSql: this.baseServiceUrl + '/DotNetReportApi/GetSchemaFromSql',
61
+ reportMode: "execute",
62
+ linkModal: $("#linkModal"),
63
+ fieldOptionsModal: $("#fieldOptionsModal"),
64
+ reports: reports,
65
+ dashboards: dashboards,
66
+ userSettings: result,
67
+ users: result.users,
68
+ userRoles: result.userRoles,
69
+ allowAdmin: result.allowAdminMode,
70
+ dataFilters: result.dataFilters,
71
+ dashboardId: dashboardId,
72
+ runExportUrl: this.baseServiceUrl + '/DotNetReportApi/',
73
+ printReportUrl: this.baseUrl + '/DotNetReport/ReportPrint',
74
+ loadSavedDashbordUrl: this.baseServiceUrl + '/DotNetReportApi/LoadSavedDashboard',
75
+ getDashbordsUrl: this.baseServiceUrl + '/DotNetReportApi/GetDashboards',
76
+ getTimeZonesUrl: this.baseServiceUrl + '/DotNetReportApi/GetAllTimezones',
77
+ getUsersAndRolesUrl: getUsersAndRolesUrl,
78
+ samePageOnRun: true,
79
+ });
80
+ vm.init(0, result.noAccount).done(() => {
81
+ vm.loadDashboard(dashboardId).done(() => {
82
+ this.renderKOTemplates();
83
+ ko.applyBindings(vm, document.getElementById('dot-net-report'));
84
+ this.bindGridInit(vm);
85
+ this.bindWindowResize(vm);
86
+ });
87
+ });
88
+ });
68
89
  });
69
- vm.printReport = function () {
70
- var printWindow = window.open("");
71
- printWindow?.document.open();
72
- printWindow?.document.write('<html><head>' +
73
- '<link href="/Content/bootstrap.css" rel="stylesheet" />' +
74
- '<style type="text/css">a[href]:after {content: none !important;}</style>' +
75
- '</head><body>' + $('.report-inner').html() +
76
- '</body></html>');
77
- setTimeout(function () {
78
- printWindow?.print();
79
- printWindow?.close();
80
- }, 250);
81
- };
82
- vm.init(0, result.noAccount);
83
- this.renderKOTemplates();
84
- ko.applyBindings(vm, document.getElementById('dot-net-report'));
85
- this.bindWindowResize(vm);
86
90
  });
87
91
  }
88
92
  ngOnDestroy() {
@@ -3198,25 +3202,55 @@ class DotnetreportComponent {
3198
3202
  this.cdref.detectChanges();
3199
3203
  }
3200
3204
  bindWindowResize(vm) {
3205
+ let _vm = vm;
3201
3206
  $(window).resize(function () {
3202
- if (vm.reportMode == "execute") {
3203
- vm.DrawChart();
3204
- }
3205
- ;
3207
+ _vm.drawChart();
3206
3208
  });
3207
3209
  }
3208
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", 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 });
3209
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: DotnetreportComponent, 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); 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 dropdown\" data-bind=\"visible: (CanSaveReports() && appSettings.usePromptBuilder()) || 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-plus\"></span> New Report\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: createNewReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\"><i class=\"fa fa-sliders\"></i> Use Standard Designer</a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: createNewReportAi\"><i class=\"fa fa-bolt\"></i> Use Smarter Designer</a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item active\" data-bind=\"visible: (SelectedFolder() ? SelectedFolder().canEdit : (CanSaveReports() || adminMode())) && !appSettings.usePromptBuilder()\">\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-o\"></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 active\" data-bind=\"visible: adminMode() && SelectedFolder() ==null\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: function(){ initHeaderDesigner(false); }\">\r\n <span class=\"fa fa-arrow-up\"></span> Report Header\r\n </a>\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 <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=\"ifnot: designingHeader\">\r\n <div class=\"btn-group pull-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 </li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"clearfix\">\r\n <p class=\"pull-left\">Please choose a Report from this Folder</p>\r\n <div class=\"pull-right\">\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\">\r\n No Reports found matching your Search\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=\"pull-left me-2\" />\r\n <div class=\"fa fa-2x pull-left\" 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=\"pull-left\">\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: $parent.adminMode\">\r\n <div class=\"small\">\r\n <b>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>\r\n <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>\r\n <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>\r\n <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 : 'No Role'\"></span>\r\n <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>\r\n <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>\r\n <br />\r\n </div>\r\n <div data-bind=\"if: clientId\">\r\n For Client <span class=\"label label-info\" data-bind=\"text: clientId ? clientId : 'Any'\"></span>\r\n <br />\r\n </div>\r\n <div>\r\n Direct Link to Run Report: <a data-bind=\"attr: {href: '/DotNetReport/?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\"><span class=\"fa fa-link\"></span></a>\r\n &nbsp;<a href=\"#\" data-bind=\"click: navigator.clipboard.writeText(window.location.href + '?linkedreport=true&noparent=true&reportId=' + reportId )\"><span class=\"fa fa-copy\" title=\"Click to Copy Link\"></span></a>\r\n </div>\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=\"click: openReport, visible: canEdit\" 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\" 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('pdf');}\">\r\n <span class=\"fa fa-file-excel-o\"></span> Download PDF\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel (Expanded)\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 Report\" data-bind=\"click: openReport, visible: canEdit\" 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\" 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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel with inner rows\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-6\">Name</div>\r\n <div class=\"col-md-6 text-end\" data-bind=\"visible: adminMode\">Access Control</div>\r\n </div>\r\n <div class=\"folder-list\" data-bind=\"foreach: Folders\">\r\n <div class=\"row clickable py-2 border-bottom align-items-center w-100\" data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <div class=\"col-md-6 d-flex align-items-center\">\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-6 text-end\" data-bind=\"visible: $parent.adminMode\">\r\n <!--<div class=\"badge bg-info text-white\" data-bind=\"text: userId ? userId : 'Any User'\"></div>\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userRole ? userRole : 'No Role'\"></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\">\r\n <p class=\"text-center text-muted\">No reports found matching your search.</p>\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>&nbsp;\r\n <span data-bind=\"text: message\" class=\"highlight small\"></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>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: openReport, visible: canEdit\">\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\">\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('pdf');}\">\r\n <span class=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel (Expanded)\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible:$parent.adminMode, click: function() {exportReport('json');}\">\r\n <span class=\"fa fa-file\"></span> Export JSON\r\n </a>\r\n </li>\r\n </ul>\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-2\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userId ? userId : 'Any User'\"></div>\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userRole ? userRole : 'No Role'\"></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 &nbsp;\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'\">\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: ReportMode()=='linked'\">\r\n <i class=\"fa fa-arrow-circle-left\"></i>\r\n <span>Back to Parent Report</span>\r\n </button>\r\n <div class=\"dropdown\" data-bind=\"visible: $root.CanEdit() && ReportID()\">\r\n <button class=\"dropdown-toggle btn btn-light btn-sm\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <i class=\"fa fa-edit\"></i> Edit Report\r\n </button>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\"\r\n data-bind=\"click: function(){ SaveReport(true); }\"\r\n data-bs-toggle=\"modal\"\r\n data-bs-target=\"#modal-reportbuilder\">\r\n <i class=\"fa fa-sliders\"></i> Edit with Standard Designer\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\"\r\n data-bind=\"click: editReportAi\">\r\n <i class=\"fa fa-bolt\"></i> Edit with Smarter Designer\r\n </a>\r\n </div>\r\n </div>\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-o\"></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-o\"></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-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-word-o\"></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=\"fa fa-file-excel-o\"></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-o\"></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=\"fa 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=\"if: activeDesign()\">\r\n <div data-bind=\"if: ReportID() <= 0\">\r\n <ul class=\"nav nav-tabs\" id=\"designTabs\" role=\"tablist\"> \r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link active\" id=\"designer-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#designer\" type=\"button\" role=\"tab\">\r\n Report Designer\r\n </button>\r\n </li>\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link\" id=\"nl-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#nl\" type=\"button\" role=\"tab\">\r\n Use Prompt<span title=\"This feature is still in Beta release. You can turn it off from settings\" style=\"font-size: 10pt; padding: 5px; max-width: 350px; white-space: normal; margin-bottom: 0;\">\r\n <i class=\"fa fa-info-circle\"></i>\r\n </span>\r\n </button>\r\n </li>\r\n </ul>\r\n\r\n <div class=\"tab-content mt-3\">\r\n <div class=\"tab-pane fade show active\" id=\"designer\" role=\"tabpanel\" aria-labelledby=\"designer-tab\">\r\n <div data-bind=\"template: 'report-designer-compact', data: $root\"></div>\r\n </div>\r\n <div class=\"tab-pane fade\" id=\"nl\" role=\"tabpanel\" aria-labelledby=\"nl-tab\">\r\n <div class=\"card\">\r\n <div class=\"card-body\">\r\n <p>\r\n What would you like to know? Type a <b>natural language prompt</b> below to ask questions about your data.<br>\r\n Use <b>Auto Complete</b> suggestions to guide your query \u2014 the AI will convert your prompt into a Dotnet Report that you can then preview, design, save and reuse.\r\n </p>\r\n\r\n <p id=\"query-input\" class=\"query-input\">\r\n Show me&nbsp;\r\n </p>\r\n\r\n <p>\r\n <button data-bind=\"click: function() {runQuery(false);}\" class=\"btn btn-primary btn-sm\">\r\n <span class=\"fa fa-magic\"></span> Process with AI\r\n </button>\r\n\r\n <button data-bind=\"click: function() {resetQuery(true, false);}\" class=\"btn btn-secondary btn-sm\">\r\n <span class=\"fa fa-undo\"></span> Start Over\r\n </button>\r\n\r\n <button class=\"btn btn-secondary btn-sm\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: adminMode\">\r\n <span class=\"fa fa-code\"></span> View Code\r\n </button>\r\n\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: CanSaveReports(), click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span> Save Report\r\n </button>\r\n\r\n <button data-bind=\"click: openDesigner\" class=\"btn btn-secondary btn-sm\">\r\n <span class=\"fa fa-pencil\"></span> Design/Save Report\r\n </button>\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: ReportID() > 0\">\r\n <div data-bind=\"template: 'report-designer-compact', data: $root\"></div>\r\n </div>\r\n </div>\r\n\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\" data-bind=\"with: pager\">\r\n <div class=\"form-inline pull-left\" data-bind=\"visible: pages()\">\r\n <div class=\"form-group pull-left total-records\">\r\n <span data-bind=\"text: ' Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"pull-left\">\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=\"fa fa-file-excel-o\"></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=\"pull-left\">\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 <!-- ko 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 <!-- /ko -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"form-inline pull-right\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n <div class=\"btn-group btn-group-sm pull-right\" 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>\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 bg-white\">\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=\"visible: headerDesigner.UseReportHeader\">\r\n <div id=\"report-header\" width=\"900\" height=\"120\" data-bind=\"html: 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\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>\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>\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 <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<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->", styles: [""] });
3210
+ bindGridInit(vm) {
3211
+ let _vm = vm;
3212
+ $(function () {
3213
+ $('.grid-stack').show();
3214
+ var grid = GridStack.init({
3215
+ cellHeight: 60,
3216
+ verticalMargin: 10,
3217
+ resizable: {
3218
+ handles: 'se, sw, ne, nw, n, e, s, w'
3219
+ }
3220
+ });
3221
+ grid.on('change', function (event, items) {
3222
+ if (items) {
3223
+ _.forEach(items, function (x) {
3224
+ _vm.updatePosition(x);
3225
+ });
3226
+ }
3227
+ });
3228
+ grid.on('resizestop', function (event, item) {
3229
+ var e = $(event.target).find('.report-chart');
3230
+ var d = $(event.target).find('table');
3231
+ if (e && !d) {
3232
+ _vm.drawChart();
3233
+ }
3234
+ });
3235
+ setTimeout(function () {
3236
+ _vm.drawChart();
3237
+ grid.enableMove(false);
3238
+ grid.enableResize(false);
3239
+ }, 1000);
3240
+ });
3241
+ }
3242
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DotnetdashboardComponent, deps: [{ token: i0.Injector }, { token: i1.DomSanitizer }, { token: i0.ChangeDetectorRef }, { token: BASE_URL_TOKEN }, { token: i2.HttpClient }, { token: i3.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
3243
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: DotnetdashboardComponent, isStandalone: true, selector: "app-dotnetdashboard", ngImport: i0, template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n\r\n<div data-bind=\"template: {name: 'admin-mode-template'}, visible: allowAdmin\" style=\"display: none;\"></div>\r\n\r\n<div class=\"row\" style=\"display: none\" data-bind=\"visible: currentDashboard\">\r\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center\">\r\n <ul class=\"nav nav-tabs flex-grow-1\" data-bind=\"foreach: dashboards\">\r\n <li class=\"nav-item\">\r\n <h2>\r\n <a class=\"nav-link\" href=\"#\" data-bind=\"text: name, click: function() { $parent.selectDashboard(id);}, css: { 'active': $parent.currentDashboard().id === id, 'selected-tab': $parent.currentDashboard().id === id }\"></a>\r\n </h2>\r\n </li>\r\n </ul>\r\n <div class=\"d-flex flex-wrap align-items-end gap-2 mt-2 mt-md-0 border-bottom\" style=\"padding-top: 21px;\"> \r\n <div class=\"dropdown\">\r\n <button class=\"btn btn-light btn-sm dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <i class=\"fa fa-pencil-square\"></i>\r\n <span>Manage</span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li class=\"dropdown dropdown-hover\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\" data-bs-toggle=\"dropdown\" role=\"button\" aria-expanded=\"false\" data-bind=\"click: function() { newReport(true) }, visible: currentDashboard().canManage || adminMode()\">\r\n <span class=\"fa fa-plus\"></span> Add New Report\r\n </a>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { newReport(false) }\">\r\n <span class=\"fa fa-pencil\"></span> Add using Standard Designer\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { newReport(true) }\">\r\n <span class=\"fa fa-bolt\"></span> Add using Smarter Designer\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\" data-bind=\"click: editDashboard, visible: currentDashboard().canManage || adminMode()\">\r\n <i class=\"fa fa-pencil\"></i>\r\n <span>Edit Dashboard</span>\r\n </button>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\" data-bind=\"click: newDashboard\">\r\n <i class=\"fa fa-dashboard\"></i>\r\n <span>Add a New Dashboard</span>\r\n </button>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bind=\"click: RefreshAllReports\">\r\n <i class=\"fa fa-refresh\"></i>\r\n <span>Refresh</span>\r\n </button>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"dropdown\">\r\n <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\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllPdfReportsWithPageOption() : ExportAllPdfReports('',''); }, hidden: appSettings.useAltPdf\"><i class=\"fa fa-file-pdf-o\"></i> Pdf</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllPdfAltReportsWithPageOption() : ExportAllPdfAltReports('',''); }, visible: appSettings.useAltPdf\"><i class=\"fa fa-file-pdf-o\"></i> Pdf</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ExportAllExcelReports\"><i class=\"fa fa-file-excel-o\"></i> Excel</a></li>\r\n <li data-bind=\"visible: canDrilldown\"><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ExportAllExcelExpandedReports\"><i class=\"fa fa-file-excel-o\"></i> Excel (Expanded)</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllWordReportsWithPageOption() : ExportAllWordReports('','');}\"><i class=\"fa fa-file-word-o\"></i> Word</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: PrintDashboard\"><i class=\"fa fa-print\"></i> Print</a></li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"if: currentDashboard().canManage || adminMode()\">\r\n <div class=\"btn btn-light btn-sm d-flex align-items-center gap-2\">\r\n <div class=\"form-check form-switch m-0\">\r\n <input class=\"form-check-input\" id=\"arrange-mode\" type=\"checkbox\" data-bind=\"checked: arrangeDashboard\">\r\n </div>\r\n <span>Arrange</span>\r\n </div>\r\n </div>\r\n <div class=\"btn-group btn-group-sm\" role=\"group\">\r\n <button class=\"btn btn-light\" data-bind=\"click: zoomOutDashboard\" data-bs-toggle=\"tooltip\" title=\"Zoom Out\">\r\n <i class=\"fa fa-search-minus\"></i>\r\n </button>\r\n\r\n <button class=\"btn btn-light\" data-bind=\"click: resetZoomDashboard\" data-bs-toggle=\"tooltip\" title=\"Reset Zoom\">\r\n <i class=\"fa fa-compress\"></i>\r\n </button>\r\n\r\n <button class=\"btn btn-light\" data-bind=\"click: zoomInDashboard\" 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>\r\n </div>\r\n</div>\r\n\r\n<div class=\"d-flex justify-content-between\">\r\n <div class=\"row\" style=\"display: none\" data-bind=\"visible: currentDashboard\">\r\n <div data-bind=\"with: currentDashboard\">\r\n <p data-bind=\"text: description\"></p>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"padded-top\"></div>\r\n\r\n<div class=\"row\">\r\n <div class=\"col-md-12\">\r\n <div data-bind=\"template: {name: 'fly-filter-template'}\"></div>\r\n <br />\r\n </div>\r\n</div>\r\n\r\n<div class=\"centered\" style=\"display: none;\" data-bind=\"visible: dashboards().length == 0 \">\r\n No Dashboards yet. Click below to Start<br />\r\n <button class=\"btn btn-lg btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\"><i class=\"fa fa-dashboard\"></i> Create a New Dashboard</button>\r\n</div>\r\n\r\n<div class=\"modal modal-fullscreen\" id=\"add-dashboard-modal\" tabindex=\"-1\" aria-labelledby=\"add-dashboard-modal-label\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: dashboard\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"add-dashboard-modal-label\"><span data-bind=\"text: Id() ? 'Edit' : 'Add'\"></span> Dashboard</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" data-bind=\"click: $root.onModalCloseClicked\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"mb-4 card card-body\">\r\n <div class=\"row mb-3\">\r\n <label class=\"col-md-3 col-form-label\">Name</label>\r\n <div class=\"col-md-6\">\r\n <input class=\"form-control\" data-val=\"true\" data-val-required=\"Dashboard Name is required.\" type=\"text\" data-bind=\"value: Name\" placeholder=\"Dashboard Name, e.g., Sales, Accounting\" id=\"add-dash-name\" required />\r\n </div>\r\n </div>\r\n <div class=\"row mb-3\">\r\n <label class=\"col-md-3 col-form-label\">Description</label>\r\n <div class=\"col-md-6\">\r\n <textarea class=\"form-control\" data-bind=\"value: Description\" placeholder=\"Optional Description for the Dashboard\"></textarea>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mb-4 card card-body\">\r\n <div class=\"row align-items-center mb-3\">\r\n <div class=\"col-md-6\">\r\n <h5><i class=\"fa fa-paperclip\"></i> Choose Reports for the Dashboard</h5>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <input type=\"text\" class=\"form-control\" placeholder=\"Search Report by Name or Description...\" data-bind=\"textInput: $parent.searchReports\" />\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: $parent.searchReports() && $parent.reportsInSearch().length==0\">\r\n <div class=\"card card-body\">\r\n No reports found matching your search.\r\n </div>\r\n </div>\r\n <div data-bind=\"if: $parent.searchReports() && $parent.reportsInSearch().length>0\">\r\n <ul class=\"list-group\" data-bind=\"foreach: $parent.reportsInSearch\">\r\n <li class=\"list-group-item\">\r\n <div class=\"checkbox\">\r\n <label class=\"list-group-item-heading\">\r\n <input type=\"checkbox\" data-bind=\"checked: selected\">\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', 'fa-window-restore': reportType=='Treemap', 'fa-code': reportType=='Html'}\" style=\"font-size: 14pt; color: #808080\"></span>\r\n <span data-bind=\"highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n </label>\r\n </div>\r\n <p class=\"list-group-item-text small\" data-bind=\"text: reportDescription\"></p>\r\n </li>\r\n </ul>\r\n </div>\r\n\r\n <div data-bind=\"if: !$parent.searchReports()\" class=\"list-group mb-3\">\r\n <div data-bind=\"foreach: $parent.reportsAndFolders\">\r\n <div class=\"list-group-item\">\r\n <a role=\"button\" class=\"d-flex justify-content-between align-items-center\" data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folder-' + folderId }\" style=\"text-decoration: none; font-weight: normal;\">\r\n <div class=\"d-flex align-items-center\">\r\n <i class=\"fa fa-folder me-2 text-secondary\"></i>\r\n <span data-bind=\"text: folder\"></span>\r\n </div>\r\n <i class=\"fa fa-chevron-down\"></i>\r\n </a>\r\n <div class=\"collapse mt-2\" data-bind=\"attr: {id: 'folder-' + folderId }\">\r\n <ul class=\"list-group list-group-flush\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input\" type=\"checkbox\" data-bind=\"checked: selected\">\r\n <label class=\"form-check-label\">\r\n <i 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', 'fa-window-restore': reportType=='Treemap', 'fa-code': reportType=='Html'}\" style=\"font-size: 14pt; color: #808080\"></i>\r\n <span data-bind=\"text: reportName\"></span>\r\n </label>\r\n </div>\r\n <small class=\"text-muted\" data-bind=\"text: reportDescription\"></small>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card card-body mb-3\">\r\n <h5><i class=\"fa fa-hourglass\"></i>&nbsp;Choose Schedule</h5>\r\n <div data-bind=\"template: {name: 'report-schedule'}\"></div>\r\n </div>\r\n\r\n <div data-bind=\"visible: $parent.adminMode\" class=\"card card-body mb-3\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: manageAccess}\"></div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-danger\" data-bind=\"click: $root.deleteDashboard, visible: Id\">Delete Dashboard</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: $root.saveDashboard\">Save Dashboard</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"grid-stack\" data-bind=\"foreach: reports\" style=\"display: none;\">\r\n <div class=\"grid-stack-item\" data-bind=\"attr: {'gs-x': x, 'gs-y': y, 'gs-w': width, 'gs-h': height, 'gs-auto-position': true, 'gs-id': ReportID}\">\r\n <div class=\"card\" data-bind=\"attr: {class: 'card ' + panelStyle + ' grid-stack-item-content'}, css: { expanded: isExpanded }, style: { border: noDashboardBorders() ? 'none' : '', 'box-shadow': noDashboardBorders() ? 'none' : '' }\" style=\"overflow-y: hidden;\">\r\n <div class=\"padded-div\" style=\"padding-bottom: 0; margin-bottom: 0;\">\r\n <div class=\"pull-left\">\r\n <button type=\"button\" class=\"btn\" data-bs-toggle=\"dropdown\" aria-haspopup=\"false\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-v\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu small\" style=\"z-index: 1001;\">\r\n <li data-bind=\"visible: FlyFilters().length > 0\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: toggleFlyFilters\">\r\n <span class=\"fa fa-filter\"></span> Filter\r\n </a>\r\n </li>\r\n <li class=\"dropdown dropdown-hover\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\" data-bs-toggle=\"dropdown\" role=\"button\" aria-expanded=\"false\" data-bind=\"click: editReportAi\">\r\n <span class=\"fa fa-pencil\"></span> Edit\r\n </a>\r\n <ul class=\"dropdown-menu small\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: openReport\">\r\n <span class=\"fa fa-pencil\"></span> Edit Standard\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: editReportAi\">\r\n <span class=\"fa fa-bolt\"></span> Edit Smarter\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li class=\"dropdown dropdown-hover\" data-bind=\"visible: ReportType()!='Single'\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\">\r\n <span class=\"fa fa-download\"></span> Export\r\n </a>\r\n <ul class=\"dropdown-menu small\">\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcel\">\r\n <span class=\"fa fa-file-excel-o\"></span> Excel\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: canDrilldown\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcelWithDrilldown\">\r\n <span class=\"fa fa-file-excel-o\"></span> Excel (Expanded)\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: $parent.appSettings.showPageSize ? function() { loadPdfModel() } : function() { $parent.appSettings.useAltPdf ? downloadPdfAlt('','') : downloadPdf('','') }\">\r\n <span class=\"fa fa-file-pdf-o\"></span> PDF\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: $parent.appSettings.showPageSize ? function() { loadWordModel()} : function() { downloadWord('',''); }\">\r\n <span class=\"fa fa-file-word-o\"></span> Word\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li data-bind=\"visible: ReportType()!='Single'\">\r\n <a class=\"dropdown-item\" data-bind=\"attr: {href: '/DotNetReport?linkedreport=true&noparent=true&reportId=' + ReportID() }\" target=\"_blank\">\r\n <span class=\"fa fa-folder-open\"></span> Open Report\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: CanEdit() && CanSaveReports()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span> Save\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: $parent.currentDashboard().canManage || $parent.adminMode()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: function() { $parent.removeReportFromDashboard(ReportID()); }\">\r\n <span class=\"fa fa-close\"></span> Remove\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: function() { RefreshReport(ReportID()); }\">\r\n <span class=\"fa fa-refresh\"></span> Refresh\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode, click: getCode\">\r\n <span class=\"fa fa-code\"></span> Report Code\r\n </a>\r\n </li>\r\n </ul>\r\n\r\n </div>\r\n\r\n <h2 class=\"pull-left\" data-bind=\"text: ReportName\"></h2>\r\n <div class=\"pull-right\">\r\n <span data-bind=\"visible: isDirty\" class=\"text-warning small\" title=\"You have unsaved changes\">\r\n <i class=\"fa fa-exclamation-triangle\"></i>\r\n </span>\r\n <a class=\"btn btn-link\" data-bind=\"visible: CanEdit() && CanSaveReports() && isDirty(), click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span>\r\n </a>\r\n <a class=\"btn btn-link\" data-bind=\"click: toggleExpand\"><span class=\"fa\" data-bind=\"css: {'fa-expand': !isExpanded(), 'fa-minus': isExpanded() }, visible: ReportType() != 'Single' && !noDashboardBorders()\"></span></a>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: activeDesign()\">\r\n <div data-bind=\"template: 'report-designer-compact'\"></div>\r\n </div>\r\n <div class=\"card-body list-overflow-auto\" style=\"padding-top: 0; margin-top: 0;\">\r\n <div data-bind=\"if: ReportType()!='Single' && ReportType()!='Html' && CanEdit()\">\r\n <div data-bind=\"template: 'chart-settings', data: $data\"></div>\r\n </div>\r\n <p data-bind=\"html: ReportDescription, visible: ReportDescription\"></p>\r\n <div data-bind=\"template: {name: 'fly-filter-template'}, visible: showFlyFilters\"></div>\r\n <div data-bind=\"with: ReportResult\" class=\"small\">\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>\r\n <div class=\"form-inline\" data-bind=\"ifnot: noDashboardBorders\">\r\n <div class=\"small\" data-bind=\"with: pager\">\r\n <div class=\"form-group pull-left total-records\" data-bind=\"if: totalRecords()>1 && $parent.ReportType() != 'Single'\">\r\n <span data-bind=\"text: 'Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"form-group pull-right\" data-bind=\"if: pages()>1 && $parent.ReportType() != 'Single'\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\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;\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\r\n <div data-bind=\"template: {name: 'report-link-edit', 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\" data-bind=\"with: dashboard\">\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\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'word-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"wordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"exportAllWordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"exportAllWordOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'word-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"exportAllPdfOptionsModal\" tabindex=\"-1\" aria-labelledby=\"exportAllPdfOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->\r\n\r\n</div>", styles: [".report-chart{min-height:auto!important}.expanded{position:fixed!important;padding:0!important;margin:0!important;top:0!important;left:0!important;width:100%!important;height:100%!important;z-index:1050!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
3210
3244
  }
3211
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DotnetreportComponent, decorators: [{
3245
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DotnetdashboardComponent, decorators: [{
3212
3246
  type: Component,
3213
- args: [{ selector: 'app-dotnetreport', 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); 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 dropdown\" data-bind=\"visible: (CanSaveReports() && appSettings.usePromptBuilder()) || 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-plus\"></span> New Report\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: createNewReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\"><i class=\"fa fa-sliders\"></i> Use Standard Designer</a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: createNewReportAi\"><i class=\"fa fa-bolt\"></i> Use Smarter Designer</a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item active\" data-bind=\"visible: (SelectedFolder() ? SelectedFolder().canEdit : (CanSaveReports() || adminMode())) && !appSettings.usePromptBuilder()\">\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-o\"></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 active\" data-bind=\"visible: adminMode() && SelectedFolder() ==null\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: function(){ initHeaderDesigner(false); }\">\r\n <span class=\"fa fa-arrow-up\"></span> Report Header\r\n </a>\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 <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=\"ifnot: designingHeader\">\r\n <div class=\"btn-group pull-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 </li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"clearfix\">\r\n <p class=\"pull-left\">Please choose a Report from this Folder</p>\r\n <div class=\"pull-right\">\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\">\r\n No Reports found matching your Search\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=\"pull-left me-2\" />\r\n <div class=\"fa fa-2x pull-left\" 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=\"pull-left\">\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: $parent.adminMode\">\r\n <div class=\"small\">\r\n <b>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>\r\n <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>\r\n <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>\r\n <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 : 'No Role'\"></span>\r\n <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>\r\n <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>\r\n <br />\r\n </div>\r\n <div data-bind=\"if: clientId\">\r\n For Client <span class=\"label label-info\" data-bind=\"text: clientId ? clientId : 'Any'\"></span>\r\n <br />\r\n </div>\r\n <div>\r\n Direct Link to Run Report: <a data-bind=\"attr: {href: '/DotNetReport/?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\"><span class=\"fa fa-link\"></span></a>\r\n &nbsp;<a href=\"#\" data-bind=\"click: navigator.clipboard.writeText(window.location.href + '?linkedreport=true&noparent=true&reportId=' + reportId )\"><span class=\"fa fa-copy\" title=\"Click to Copy Link\"></span></a>\r\n </div>\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=\"click: openReport, visible: canEdit\" 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\" 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('pdf');}\">\r\n <span class=\"fa fa-file-excel-o\"></span> Download PDF\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel (Expanded)\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 Report\" data-bind=\"click: openReport, visible: canEdit\" 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\" 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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel with inner rows\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-6\">Name</div>\r\n <div class=\"col-md-6 text-end\" data-bind=\"visible: adminMode\">Access Control</div>\r\n </div>\r\n <div class=\"folder-list\" data-bind=\"foreach: Folders\">\r\n <div class=\"row clickable py-2 border-bottom align-items-center w-100\" data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <div class=\"col-md-6 d-flex align-items-center\">\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-6 text-end\" data-bind=\"visible: $parent.adminMode\">\r\n <!--<div class=\"badge bg-info text-white\" data-bind=\"text: userId ? userId : 'Any User'\"></div>\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userRole ? userRole : 'No Role'\"></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\">\r\n <p class=\"text-center text-muted\">No reports found matching your search.</p>\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>&nbsp;\r\n <span data-bind=\"text: message\" class=\"highlight small\"></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>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: openReport, visible: canEdit\">\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\">\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('pdf');}\">\r\n <span class=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel (Expanded)\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible:$parent.adminMode, click: function() {exportReport('json');}\">\r\n <span class=\"fa fa-file\"></span> Export JSON\r\n </a>\r\n </li>\r\n </ul>\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-2\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userId ? userId : 'Any User'\"></div>\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userRole ? userRole : 'No Role'\"></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 &nbsp;\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'\">\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: ReportMode()=='linked'\">\r\n <i class=\"fa fa-arrow-circle-left\"></i>\r\n <span>Back to Parent Report</span>\r\n </button>\r\n <div class=\"dropdown\" data-bind=\"visible: $root.CanEdit() && ReportID()\">\r\n <button class=\"dropdown-toggle btn btn-light btn-sm\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <i class=\"fa fa-edit\"></i> Edit Report\r\n </button>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\"\r\n data-bind=\"click: function(){ SaveReport(true); }\"\r\n data-bs-toggle=\"modal\"\r\n data-bs-target=\"#modal-reportbuilder\">\r\n <i class=\"fa fa-sliders\"></i> Edit with Standard Designer\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\"\r\n data-bind=\"click: editReportAi\">\r\n <i class=\"fa fa-bolt\"></i> Edit with Smarter Designer\r\n </a>\r\n </div>\r\n </div>\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-o\"></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-o\"></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-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-word-o\"></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=\"fa fa-file-excel-o\"></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-o\"></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=\"fa 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=\"if: activeDesign()\">\r\n <div data-bind=\"if: ReportID() <= 0\">\r\n <ul class=\"nav nav-tabs\" id=\"designTabs\" role=\"tablist\"> \r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link active\" id=\"designer-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#designer\" type=\"button\" role=\"tab\">\r\n Report Designer\r\n </button>\r\n </li>\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link\" id=\"nl-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#nl\" type=\"button\" role=\"tab\">\r\n Use Prompt<span title=\"This feature is still in Beta release. You can turn it off from settings\" style=\"font-size: 10pt; padding: 5px; max-width: 350px; white-space: normal; margin-bottom: 0;\">\r\n <i class=\"fa fa-info-circle\"></i>\r\n </span>\r\n </button>\r\n </li>\r\n </ul>\r\n\r\n <div class=\"tab-content mt-3\">\r\n <div class=\"tab-pane fade show active\" id=\"designer\" role=\"tabpanel\" aria-labelledby=\"designer-tab\">\r\n <div data-bind=\"template: 'report-designer-compact', data: $root\"></div>\r\n </div>\r\n <div class=\"tab-pane fade\" id=\"nl\" role=\"tabpanel\" aria-labelledby=\"nl-tab\">\r\n <div class=\"card\">\r\n <div class=\"card-body\">\r\n <p>\r\n What would you like to know? Type a <b>natural language prompt</b> below to ask questions about your data.<br>\r\n Use <b>Auto Complete</b> suggestions to guide your query \u2014 the AI will convert your prompt into a Dotnet Report that you can then preview, design, save and reuse.\r\n </p>\r\n\r\n <p id=\"query-input\" class=\"query-input\">\r\n Show me&nbsp;\r\n </p>\r\n\r\n <p>\r\n <button data-bind=\"click: function() {runQuery(false);}\" class=\"btn btn-primary btn-sm\">\r\n <span class=\"fa fa-magic\"></span> Process with AI\r\n </button>\r\n\r\n <button data-bind=\"click: function() {resetQuery(true, false);}\" class=\"btn btn-secondary btn-sm\">\r\n <span class=\"fa fa-undo\"></span> Start Over\r\n </button>\r\n\r\n <button class=\"btn btn-secondary btn-sm\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: adminMode\">\r\n <span class=\"fa fa-code\"></span> View Code\r\n </button>\r\n\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: CanSaveReports(), click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span> Save Report\r\n </button>\r\n\r\n <button data-bind=\"click: openDesigner\" class=\"btn btn-secondary btn-sm\">\r\n <span class=\"fa fa-pencil\"></span> Design/Save Report\r\n </button>\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: ReportID() > 0\">\r\n <div data-bind=\"template: 'report-designer-compact', data: $root\"></div>\r\n </div>\r\n </div>\r\n\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\" data-bind=\"with: pager\">\r\n <div class=\"form-inline pull-left\" data-bind=\"visible: pages()\">\r\n <div class=\"form-group pull-left total-records\">\r\n <span data-bind=\"text: ' Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"pull-left\">\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=\"fa fa-file-excel-o\"></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=\"pull-left\">\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 <!-- ko 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 <!-- /ko -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"form-inline pull-right\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n <div class=\"btn-group btn-group-sm pull-right\" 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>\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 bg-white\">\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=\"visible: headerDesigner.UseReportHeader\">\r\n <div id=\"report-header\" width=\"900\" height=\"120\" data-bind=\"html: 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\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>\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>\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 <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<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->" }]
3247
+ args: [{ selector: 'app-dotnetdashboard', standalone: true, imports: [RouterOutlet, CommonModule], template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n\r\n<div data-bind=\"template: {name: 'admin-mode-template'}, visible: allowAdmin\" style=\"display: none;\"></div>\r\n\r\n<div class=\"row\" style=\"display: none\" data-bind=\"visible: currentDashboard\">\r\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center\">\r\n <ul class=\"nav nav-tabs flex-grow-1\" data-bind=\"foreach: dashboards\">\r\n <li class=\"nav-item\">\r\n <h2>\r\n <a class=\"nav-link\" href=\"#\" data-bind=\"text: name, click: function() { $parent.selectDashboard(id);}, css: { 'active': $parent.currentDashboard().id === id, 'selected-tab': $parent.currentDashboard().id === id }\"></a>\r\n </h2>\r\n </li>\r\n </ul>\r\n <div class=\"d-flex flex-wrap align-items-end gap-2 mt-2 mt-md-0 border-bottom\" style=\"padding-top: 21px;\"> \r\n <div class=\"dropdown\">\r\n <button class=\"btn btn-light btn-sm dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <i class=\"fa fa-pencil-square\"></i>\r\n <span>Manage</span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li class=\"dropdown dropdown-hover\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\" data-bs-toggle=\"dropdown\" role=\"button\" aria-expanded=\"false\" data-bind=\"click: function() { newReport(true) }, visible: currentDashboard().canManage || adminMode()\">\r\n <span class=\"fa fa-plus\"></span> Add New Report\r\n </a>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { newReport(false) }\">\r\n <span class=\"fa fa-pencil\"></span> Add using Standard Designer\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { newReport(true) }\">\r\n <span class=\"fa fa-bolt\"></span> Add using Smarter Designer\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\" data-bind=\"click: editDashboard, visible: currentDashboard().canManage || adminMode()\">\r\n <i class=\"fa fa-pencil\"></i>\r\n <span>Edit Dashboard</span>\r\n </button>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\" data-bind=\"click: newDashboard\">\r\n <i class=\"fa fa-dashboard\"></i>\r\n <span>Add a New Dashboard</span>\r\n </button>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bind=\"click: RefreshAllReports\">\r\n <i class=\"fa fa-refresh\"></i>\r\n <span>Refresh</span>\r\n </button>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"dropdown\">\r\n <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\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllPdfReportsWithPageOption() : ExportAllPdfReports('',''); }, hidden: appSettings.useAltPdf\"><i class=\"fa fa-file-pdf-o\"></i> Pdf</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllPdfAltReportsWithPageOption() : ExportAllPdfAltReports('',''); }, visible: appSettings.useAltPdf\"><i class=\"fa fa-file-pdf-o\"></i> Pdf</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ExportAllExcelReports\"><i class=\"fa fa-file-excel-o\"></i> Excel</a></li>\r\n <li data-bind=\"visible: canDrilldown\"><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ExportAllExcelExpandedReports\"><i class=\"fa fa-file-excel-o\"></i> Excel (Expanded)</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllWordReportsWithPageOption() : ExportAllWordReports('','');}\"><i class=\"fa fa-file-word-o\"></i> Word</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: PrintDashboard\"><i class=\"fa fa-print\"></i> Print</a></li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"if: currentDashboard().canManage || adminMode()\">\r\n <div class=\"btn btn-light btn-sm d-flex align-items-center gap-2\">\r\n <div class=\"form-check form-switch m-0\">\r\n <input class=\"form-check-input\" id=\"arrange-mode\" type=\"checkbox\" data-bind=\"checked: arrangeDashboard\">\r\n </div>\r\n <span>Arrange</span>\r\n </div>\r\n </div>\r\n <div class=\"btn-group btn-group-sm\" role=\"group\">\r\n <button class=\"btn btn-light\" data-bind=\"click: zoomOutDashboard\" data-bs-toggle=\"tooltip\" title=\"Zoom Out\">\r\n <i class=\"fa fa-search-minus\"></i>\r\n </button>\r\n\r\n <button class=\"btn btn-light\" data-bind=\"click: resetZoomDashboard\" data-bs-toggle=\"tooltip\" title=\"Reset Zoom\">\r\n <i class=\"fa fa-compress\"></i>\r\n </button>\r\n\r\n <button class=\"btn btn-light\" data-bind=\"click: zoomInDashboard\" 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>\r\n </div>\r\n</div>\r\n\r\n<div class=\"d-flex justify-content-between\">\r\n <div class=\"row\" style=\"display: none\" data-bind=\"visible: currentDashboard\">\r\n <div data-bind=\"with: currentDashboard\">\r\n <p data-bind=\"text: description\"></p>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"padded-top\"></div>\r\n\r\n<div class=\"row\">\r\n <div class=\"col-md-12\">\r\n <div data-bind=\"template: {name: 'fly-filter-template'}\"></div>\r\n <br />\r\n </div>\r\n</div>\r\n\r\n<div class=\"centered\" style=\"display: none;\" data-bind=\"visible: dashboards().length == 0 \">\r\n No Dashboards yet. Click below to Start<br />\r\n <button class=\"btn btn-lg btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\"><i class=\"fa fa-dashboard\"></i> Create a New Dashboard</button>\r\n</div>\r\n\r\n<div class=\"modal modal-fullscreen\" id=\"add-dashboard-modal\" tabindex=\"-1\" aria-labelledby=\"add-dashboard-modal-label\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: dashboard\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"add-dashboard-modal-label\"><span data-bind=\"text: Id() ? 'Edit' : 'Add'\"></span> Dashboard</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" data-bind=\"click: $root.onModalCloseClicked\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"mb-4 card card-body\">\r\n <div class=\"row mb-3\">\r\n <label class=\"col-md-3 col-form-label\">Name</label>\r\n <div class=\"col-md-6\">\r\n <input class=\"form-control\" data-val=\"true\" data-val-required=\"Dashboard Name is required.\" type=\"text\" data-bind=\"value: Name\" placeholder=\"Dashboard Name, e.g., Sales, Accounting\" id=\"add-dash-name\" required />\r\n </div>\r\n </div>\r\n <div class=\"row mb-3\">\r\n <label class=\"col-md-3 col-form-label\">Description</label>\r\n <div class=\"col-md-6\">\r\n <textarea class=\"form-control\" data-bind=\"value: Description\" placeholder=\"Optional Description for the Dashboard\"></textarea>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mb-4 card card-body\">\r\n <div class=\"row align-items-center mb-3\">\r\n <div class=\"col-md-6\">\r\n <h5><i class=\"fa fa-paperclip\"></i> Choose Reports for the Dashboard</h5>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <input type=\"text\" class=\"form-control\" placeholder=\"Search Report by Name or Description...\" data-bind=\"textInput: $parent.searchReports\" />\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: $parent.searchReports() && $parent.reportsInSearch().length==0\">\r\n <div class=\"card card-body\">\r\n No reports found matching your search.\r\n </div>\r\n </div>\r\n <div data-bind=\"if: $parent.searchReports() && $parent.reportsInSearch().length>0\">\r\n <ul class=\"list-group\" data-bind=\"foreach: $parent.reportsInSearch\">\r\n <li class=\"list-group-item\">\r\n <div class=\"checkbox\">\r\n <label class=\"list-group-item-heading\">\r\n <input type=\"checkbox\" data-bind=\"checked: selected\">\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', 'fa-window-restore': reportType=='Treemap', 'fa-code': reportType=='Html'}\" style=\"font-size: 14pt; color: #808080\"></span>\r\n <span data-bind=\"highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n </label>\r\n </div>\r\n <p class=\"list-group-item-text small\" data-bind=\"text: reportDescription\"></p>\r\n </li>\r\n </ul>\r\n </div>\r\n\r\n <div data-bind=\"if: !$parent.searchReports()\" class=\"list-group mb-3\">\r\n <div data-bind=\"foreach: $parent.reportsAndFolders\">\r\n <div class=\"list-group-item\">\r\n <a role=\"button\" class=\"d-flex justify-content-between align-items-center\" data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folder-' + folderId }\" style=\"text-decoration: none; font-weight: normal;\">\r\n <div class=\"d-flex align-items-center\">\r\n <i class=\"fa fa-folder me-2 text-secondary\"></i>\r\n <span data-bind=\"text: folder\"></span>\r\n </div>\r\n <i class=\"fa fa-chevron-down\"></i>\r\n </a>\r\n <div class=\"collapse mt-2\" data-bind=\"attr: {id: 'folder-' + folderId }\">\r\n <ul class=\"list-group list-group-flush\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input\" type=\"checkbox\" data-bind=\"checked: selected\">\r\n <label class=\"form-check-label\">\r\n <i 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', 'fa-window-restore': reportType=='Treemap', 'fa-code': reportType=='Html'}\" style=\"font-size: 14pt; color: #808080\"></i>\r\n <span data-bind=\"text: reportName\"></span>\r\n </label>\r\n </div>\r\n <small class=\"text-muted\" data-bind=\"text: reportDescription\"></small>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card card-body mb-3\">\r\n <h5><i class=\"fa fa-hourglass\"></i>&nbsp;Choose Schedule</h5>\r\n <div data-bind=\"template: {name: 'report-schedule'}\"></div>\r\n </div>\r\n\r\n <div data-bind=\"visible: $parent.adminMode\" class=\"card card-body mb-3\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: manageAccess}\"></div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-danger\" data-bind=\"click: $root.deleteDashboard, visible: Id\">Delete Dashboard</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: $root.saveDashboard\">Save Dashboard</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"grid-stack\" data-bind=\"foreach: reports\" style=\"display: none;\">\r\n <div class=\"grid-stack-item\" data-bind=\"attr: {'gs-x': x, 'gs-y': y, 'gs-w': width, 'gs-h': height, 'gs-auto-position': true, 'gs-id': ReportID}\">\r\n <div class=\"card\" data-bind=\"attr: {class: 'card ' + panelStyle + ' grid-stack-item-content'}, css: { expanded: isExpanded }, style: { border: noDashboardBorders() ? 'none' : '', 'box-shadow': noDashboardBorders() ? 'none' : '' }\" style=\"overflow-y: hidden;\">\r\n <div class=\"padded-div\" style=\"padding-bottom: 0; margin-bottom: 0;\">\r\n <div class=\"pull-left\">\r\n <button type=\"button\" class=\"btn\" data-bs-toggle=\"dropdown\" aria-haspopup=\"false\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-v\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu small\" style=\"z-index: 1001;\">\r\n <li data-bind=\"visible: FlyFilters().length > 0\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: toggleFlyFilters\">\r\n <span class=\"fa fa-filter\"></span> Filter\r\n </a>\r\n </li>\r\n <li class=\"dropdown dropdown-hover\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\" data-bs-toggle=\"dropdown\" role=\"button\" aria-expanded=\"false\" data-bind=\"click: editReportAi\">\r\n <span class=\"fa fa-pencil\"></span> Edit\r\n </a>\r\n <ul class=\"dropdown-menu small\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: openReport\">\r\n <span class=\"fa fa-pencil\"></span> Edit Standard\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: editReportAi\">\r\n <span class=\"fa fa-bolt\"></span> Edit Smarter\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li class=\"dropdown dropdown-hover\" data-bind=\"visible: ReportType()!='Single'\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\">\r\n <span class=\"fa fa-download\"></span> Export\r\n </a>\r\n <ul class=\"dropdown-menu small\">\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcel\">\r\n <span class=\"fa fa-file-excel-o\"></span> Excel\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: canDrilldown\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcelWithDrilldown\">\r\n <span class=\"fa fa-file-excel-o\"></span> Excel (Expanded)\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: $parent.appSettings.showPageSize ? function() { loadPdfModel() } : function() { $parent.appSettings.useAltPdf ? downloadPdfAlt('','') : downloadPdf('','') }\">\r\n <span class=\"fa fa-file-pdf-o\"></span> PDF\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: $parent.appSettings.showPageSize ? function() { loadWordModel()} : function() { downloadWord('',''); }\">\r\n <span class=\"fa fa-file-word-o\"></span> Word\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li data-bind=\"visible: ReportType()!='Single'\">\r\n <a class=\"dropdown-item\" data-bind=\"attr: {href: '/DotNetReport?linkedreport=true&noparent=true&reportId=' + ReportID() }\" target=\"_blank\">\r\n <span class=\"fa fa-folder-open\"></span> Open Report\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: CanEdit() && CanSaveReports()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span> Save\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: $parent.currentDashboard().canManage || $parent.adminMode()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: function() { $parent.removeReportFromDashboard(ReportID()); }\">\r\n <span class=\"fa fa-close\"></span> Remove\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: function() { RefreshReport(ReportID()); }\">\r\n <span class=\"fa fa-refresh\"></span> Refresh\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode, click: getCode\">\r\n <span class=\"fa fa-code\"></span> Report Code\r\n </a>\r\n </li>\r\n </ul>\r\n\r\n </div>\r\n\r\n <h2 class=\"pull-left\" data-bind=\"text: ReportName\"></h2>\r\n <div class=\"pull-right\">\r\n <span data-bind=\"visible: isDirty\" class=\"text-warning small\" title=\"You have unsaved changes\">\r\n <i class=\"fa fa-exclamation-triangle\"></i>\r\n </span>\r\n <a class=\"btn btn-link\" data-bind=\"visible: CanEdit() && CanSaveReports() && isDirty(), click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span>\r\n </a>\r\n <a class=\"btn btn-link\" data-bind=\"click: toggleExpand\"><span class=\"fa\" data-bind=\"css: {'fa-expand': !isExpanded(), 'fa-minus': isExpanded() }, visible: ReportType() != 'Single' && !noDashboardBorders()\"></span></a>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: activeDesign()\">\r\n <div data-bind=\"template: 'report-designer-compact'\"></div>\r\n </div>\r\n <div class=\"card-body list-overflow-auto\" style=\"padding-top: 0; margin-top: 0;\">\r\n <div data-bind=\"if: ReportType()!='Single' && ReportType()!='Html' && CanEdit()\">\r\n <div data-bind=\"template: 'chart-settings', data: $data\"></div>\r\n </div>\r\n <p data-bind=\"html: ReportDescription, visible: ReportDescription\"></p>\r\n <div data-bind=\"template: {name: 'fly-filter-template'}, visible: showFlyFilters\"></div>\r\n <div data-bind=\"with: ReportResult\" class=\"small\">\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>\r\n <div class=\"form-inline\" data-bind=\"ifnot: noDashboardBorders\">\r\n <div class=\"small\" data-bind=\"with: pager\">\r\n <div class=\"form-group pull-left total-records\" data-bind=\"if: totalRecords()>1 && $parent.ReportType() != 'Single'\">\r\n <span data-bind=\"text: 'Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"form-group pull-right\" data-bind=\"if: pages()>1 && $parent.ReportType() != 'Single'\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\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;\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\r\n <div data-bind=\"template: {name: 'report-link-edit', 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\" data-bind=\"with: dashboard\">\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\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'word-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"wordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"exportAllWordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"exportAllWordOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'word-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"exportAllPdfOptionsModal\" tabindex=\"-1\" aria-labelledby=\"exportAllPdfOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->\r\n\r\n</div>", styles: [".report-chart{min-height:auto!important}.expanded{position:fixed!important;padding:0!important;margin:0!important;top:0!important;left:0!important;width:100%!important;height:100%!important;z-index:1050!important}\n"] }]
3214
3248
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.DomSanitizer }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
3215
3249
  type: Inject,
3216
3250
  args: [BASE_URL_TOKEN]
3217
3251
  }] }, { type: i2.HttpClient }, { type: i3.ActivatedRoute }] });
3218
3252
 
3219
- class DotnetdashboardComponent {
3253
+ class DotnetreportComponent {
3220
3254
  sanitizer;
3221
3255
  cdref;
3222
3256
  baseUrl;
@@ -3224,75 +3258,61 @@ class DotnetdashboardComponent {
3224
3258
  route;
3225
3259
  baseServiceUrl;
3226
3260
  reportTemplates;
3227
- queryParams;
3261
+ queryParams = {};
3228
3262
  constructor(injector, sanitizer, cdref, baseUrl, http, route) {
3229
3263
  this.sanitizer = sanitizer;
3230
3264
  this.cdref = cdref;
3231
3265
  this.baseUrl = baseUrl;
3232
3266
  this.http = http;
3233
3267
  this.route = route;
3234
- this.baseServiceUrl = this.baseUrl + '/api'; // "http://localhost:39378"; \
3268
+ this.baseServiceUrl = this.baseUrl + '/api';
3235
3269
  this.reportTemplates = "";
3236
3270
  }
3237
3271
  ngOnInit() {
3238
- var reports = [];
3239
- var dashboards = [];
3240
- var adminMode = localStorage.getItem('reportAdminMode') ?? false;
3241
- let getDashboardsUrl = this.baseServiceUrl + "/DotNetReportApi/GetDashboards?adminMode=" + adminMode;
3242
- let loadSavedDashboard = this.baseServiceUrl + "/DotNetReportApi/LoadSavedDashboard";
3243
3272
  let getUsersAndRolesUrl = this.baseServiceUrl + "/DotNetReportApi/GetUsersAndRoles";
3244
3273
  getUsersAndRolesUrl = getUsersAndRolesUrl.replace(/[?&]$/, "");
3245
- this.http.get(getDashboardsUrl).subscribe((dashboardData) => {
3246
- dashboardData.forEach((d) => {
3247
- dashboards.push({ id: d.Id, name: d.Name, description: d.Description, selectedReports: d.SelectedReports, schedule: d.Schedule, userId: d.UserId, userRoles: d.UserRoles, viewOnlyUserId: d.ViewOnlyUserId, viewOnlyUserRoles: d.ViewOnlyUserRoles, clientId: d.ClientId, canManage: d.CanManage });
3248
- });
3249
- this.queryParams = this.route.snapshot.queryParams;
3250
- var dashboardId = parseInt(this.queryParams['id'] || '0');
3251
- if (!dashboardId && dashboards.length > 0) {
3252
- dashboardId = dashboards[0].id;
3253
- }
3254
- this.http.get(loadSavedDashboard + "?id=" + dashboardId).subscribe((reportsData) => {
3255
- reportsData.forEach((r) => {
3256
- reports.push({ reportSql: r.ReportSql, reportId: r.ReportId, reportFilter: r.ReportFilter, connectKey: r.ConnectKey, x: r.X, y: r.Y, width: r.Width, height: r.Height });
3257
- });
3258
- this.http.get(getUsersAndRolesUrl).subscribe((response) => {
3259
- let result = response;
3260
- let vm = new dashboardViewModel({
3261
- runReportUrl: this.baseServiceUrl + '/DotNetReport/Report',
3262
- execReportUrl: this.baseServiceUrl + '/DotNetReportApi/RunReport',
3263
- runLinkReportUrl: this.baseServiceUrl + '/DotNetReportApi/RunReportLink',
3264
- reportWizard: $("#modal-reportbuilder"),
3265
- lookupListUrl: this.baseServiceUrl + '/DotNetReportApi/GetLookupList',
3266
- apiUrl: this.baseServiceUrl + '/DotNetReportApi/CallReportApi',
3267
- runReportApiUrl: this.baseServiceUrl + '/DotNetReportApi/RunReportApi',
3268
- getSchemaFromSql: this.baseServiceUrl + '/DotNetReportApi/GetSchemaFromSql',
3269
- reportMode: "execute",
3270
- linkModal: $("#linkModal"),
3271
- fieldOptionsModal: $("#fieldOptionsModal"),
3272
- reports: reports,
3273
- dashboards: dashboards,
3274
- userSettings: result,
3275
- users: result.users,
3276
- userRoles: result.userRoles,
3277
- allowAdmin: result.allowAdminMode,
3278
- dataFilters: result.dataFilters,
3279
- dashboardId: dashboardId,
3280
- runExportUrl: this.baseServiceUrl + '/DotNetReportApi/',
3281
- printReportUrl: this.baseUrl + '/DotNetReport/ReportPrint',
3282
- loadSavedDashbordUrl: this.baseServiceUrl + '/DotNetReportApi/LoadSavedDashboard',
3283
- getDashbordsUrl: this.baseServiceUrl + '/DotNetReportApi/GetDashboards',
3284
- getTimeZonesUrl: this.baseServiceUrl + '/DotNetReportApi/GetAllTimezones',
3285
- getUsersAndRolesUrl: getUsersAndRolesUrl,
3286
- samePageOnRun: true,
3287
- });
3288
- vm.init(0, result.noAccount).done(() => {
3289
- this.renderKOTemplates();
3290
- ko.applyBindings(vm, document.getElementById('dot-net-report'));
3291
- this.bindGridInit(vm);
3292
- this.bindWindowResize(vm);
3293
- });
3294
- });
3274
+ this.queryParams = this.route.snapshot.queryParams;
3275
+ this.http.get(getUsersAndRolesUrl).subscribe((response) => {
3276
+ let result = response;
3277
+ let vm = new reportViewModel({
3278
+ runReportUrl: this.baseServiceUrl + '/DotNetReport/Report',
3279
+ reportWizard: $("#modal-reportbuilder"),
3280
+ execReportUrl: this.baseServiceUrl + '/DotNetReportApi/RunReport',
3281
+ runLinkReportUrl: this.baseServiceUrl + '/DotNetReportApi/RunReportLink',
3282
+ getSchemaFromSql: this.baseServiceUrl + '/DotNetReportApi/GetSchemaFromSql',
3283
+ linkModal: $("#linkModal"),
3284
+ reportHeader: "report-header",
3285
+ fieldOptionsModal: $("#fieldOptionsModal"),
3286
+ lookupListUrl: this.baseServiceUrl + '/DotNetReportApi/GetLookupList',
3287
+ apiUrl: this.baseServiceUrl + '/DotNetReportApi/CallReportApi',
3288
+ runReportApiUrl: this.baseServiceUrl + '/DotNetReportApi/RunReportApi',
3289
+ getUsersAndRolesUrl: this.baseServiceUrl + '/DotNetReportApi/GetUsersAndRoles',
3290
+ userSettings: result,
3291
+ dataFilters: result.dataFilters,
3292
+ runExportUrl: this.baseServiceUrl + '/DotNetReportApi/',
3293
+ getTimeZonesUrl: this.baseServiceUrl + '/DotNetReportApi/GetAllTimezones',
3294
+ printReportUrl: this.baseUrl + '/DotNetReport/ReportPrint',
3295
+ samePageOnRun: true,
3296
+ reportMode: this.queryParams["linkedreport"] == "true" ? "linked" : "",
3297
+ reportId: this.queryParams["reportId"] || 0,
3295
3298
  });
3299
+ vm.printReport = function () {
3300
+ var printWindow = window.open("");
3301
+ printWindow?.document.open();
3302
+ printWindow?.document.write('<html><head>' +
3303
+ '<link href="/Content/bootstrap.css" rel="stylesheet" />' +
3304
+ '<style type="text/css">a[href]:after {content: none !important;}</style>' +
3305
+ '</head><body>' + $('.report-inner').html() +
3306
+ '</body></html>');
3307
+ setTimeout(function () {
3308
+ printWindow?.print();
3309
+ printWindow?.close();
3310
+ }, 250);
3311
+ };
3312
+ vm.init(0, result.noAccount);
3313
+ this.renderKOTemplates();
3314
+ ko.applyBindings(vm, document.getElementById('dot-net-report'));
3315
+ this.bindWindowResize(vm);
3296
3316
  });
3297
3317
  }
3298
3318
  ngOnDestroy() {
@@ -6408,49 +6428,19 @@ class DotnetdashboardComponent {
6408
6428
  this.cdref.detectChanges();
6409
6429
  }
6410
6430
  bindWindowResize(vm) {
6411
- let _vm = vm;
6412
6431
  $(window).resize(function () {
6413
- _vm.drawChart();
6414
- });
6415
- }
6416
- bindGridInit(vm) {
6417
- let _vm = vm;
6418
- $(function () {
6419
- $('.grid-stack').show();
6420
- var grid = GridStack.init({
6421
- cellHeight: 60,
6422
- verticalMargin: 10,
6423
- resizable: {
6424
- handles: 'se, sw, ne, nw, n, e, s, w'
6425
- }
6426
- });
6427
- grid.on('change', function (event, items) {
6428
- if (items) {
6429
- _.forEach(items, function (x) {
6430
- _vm.updatePosition(x);
6431
- });
6432
- }
6433
- });
6434
- grid.on('resizestop', function (event, item) {
6435
- var e = $(event.target).find('.report-chart');
6436
- var d = $(event.target).find('table');
6437
- if (e && !d) {
6438
- _vm.drawChart();
6439
- }
6440
- });
6441
- setTimeout(function () {
6442
- _vm.drawChart();
6443
- grid.enableMove(false);
6444
- grid.enableResize(false);
6445
- }, 1000);
6432
+ if (vm.reportMode == "execute") {
6433
+ vm.DrawChart();
6434
+ }
6435
+ ;
6446
6436
  });
6447
6437
  }
6448
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DotnetdashboardComponent, deps: [{ token: i0.Injector }, { token: i1.DomSanitizer }, { token: i0.ChangeDetectorRef }, { token: BASE_URL_TOKEN }, { token: i2.HttpClient }, { token: i3.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
6449
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: DotnetdashboardComponent, selector: "app-dotnetdashboard", ngImport: i0, template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n\r\n<div data-bind=\"template: {name: 'admin-mode-template'}, visible: allowAdmin\" style=\"display: none;\"></div>\r\n\r\n<div class=\"row\" style=\"display: none\" data-bind=\"visible: currentDashboard\">\r\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center\">\r\n <ul class=\"nav nav-tabs flex-grow-1\" data-bind=\"foreach: dashboards\">\r\n <li class=\"nav-item\">\r\n <h2>\r\n <a class=\"nav-link\" href=\"#\" data-bind=\"text: name, click: function() { $parent.selectDashboard(id);}, css: { 'active': $parent.currentDashboard().id === id, 'selected-tab': $parent.currentDashboard().id === id }\"></a>\r\n </h2>\r\n </li>\r\n </ul>\r\n <div class=\"d-flex flex-wrap align-items-end gap-2 mt-2 mt-md-0 border-bottom\" style=\"padding-top: 21px;\"> \r\n <div class=\"dropdown\">\r\n <button class=\"btn btn-light btn-sm dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <i class=\"fa fa-pencil-square\"></i>\r\n <span>Manage</span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li class=\"dropdown dropdown-hover\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\" data-bs-toggle=\"dropdown\" role=\"button\" aria-expanded=\"false\" data-bind=\"click: function() { newReport(true) }, visible: currentDashboard().canManage || adminMode()\">\r\n <span class=\"fa fa-plus\"></span> Add New Report\r\n </a>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { newReport(false) }\">\r\n <span class=\"fa fa-pencil\"></span> Add using Standard Designer\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { newReport(true) }\">\r\n <span class=\"fa fa-bolt\"></span> Add using Smarter Designer\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\" data-bind=\"click: editDashboard, visible: currentDashboard().canManage || adminMode()\">\r\n <i class=\"fa fa-pencil\"></i>\r\n <span>Edit Dashboard</span>\r\n </button>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\" data-bind=\"click: newDashboard\">\r\n <i class=\"fa fa-dashboard\"></i>\r\n <span>Add a New Dashboard</span>\r\n </button>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bind=\"click: RefreshAllReports\">\r\n <i class=\"fa fa-refresh\"></i>\r\n <span>Refresh</span>\r\n </button>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"dropdown\">\r\n <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\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllPdfReportsWithPageOption() : ExportAllPdfReports('',''); }, hidden: appSettings.useAltPdf\"><i class=\"fa fa-file-pdf-o\"></i> Pdf</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllPdfAltReportsWithPageOption() : ExportAllPdfAltReports('',''); }, visible: appSettings.useAltPdf\"><i class=\"fa fa-file-pdf-o\"></i> Pdf</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ExportAllExcelReports\"><i class=\"fa fa-file-excel-o\"></i> Excel</a></li>\r\n <li data-bind=\"visible: canDrilldown\"><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ExportAllExcelExpandedReports\"><i class=\"fa fa-file-excel-o\"></i> Excel (Expanded)</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllWordReportsWithPageOption() : ExportAllWordReports('','');}\"><i class=\"fa fa-file-word-o\"></i> Word</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: PrintDashboard\"><i class=\"fa fa-print\"></i> Print</a></li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"if: currentDashboard().canManage || adminMode()\">\r\n <div class=\"btn btn-light btn-sm d-flex align-items-center gap-2\">\r\n <div class=\"form-check form-switch m-0\">\r\n <input class=\"form-check-input\" id=\"arrange-mode\" type=\"checkbox\" data-bind=\"checked: arrangeDashboard\">\r\n </div>\r\n <span>Arrange</span>\r\n </div>\r\n </div>\r\n <div class=\"btn-group btn-group-sm\" role=\"group\">\r\n <button class=\"btn btn-light\" data-bind=\"click: zoomOutDashboard\" data-bs-toggle=\"tooltip\" title=\"Zoom Out\">\r\n <i class=\"fa fa-search-minus\"></i>\r\n </button>\r\n\r\n <button class=\"btn btn-light\" data-bind=\"click: resetZoomDashboard\" data-bs-toggle=\"tooltip\" title=\"Reset Zoom\">\r\n <i class=\"fa fa-compress\"></i>\r\n </button>\r\n\r\n <button class=\"btn btn-light\" data-bind=\"click: zoomInDashboard\" 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>\r\n </div>\r\n</div>\r\n\r\n<div class=\"d-flex justify-content-between\">\r\n <div class=\"row\" style=\"display: none\" data-bind=\"visible: currentDashboard\">\r\n <div data-bind=\"with: currentDashboard\">\r\n <p data-bind=\"text: description\"></p>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"padded-top\"></div>\r\n\r\n<div class=\"row\">\r\n <div class=\"col-md-12\">\r\n <div data-bind=\"template: {name: 'fly-filter-template'}\"></div>\r\n <br />\r\n </div>\r\n</div>\r\n\r\n<div class=\"centered\" style=\"display: none;\" data-bind=\"visible: dashboards().length == 0 \">\r\n No Dashboards yet. Click below to Start<br />\r\n <button class=\"btn btn-lg btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\"><i class=\"fa fa-dashboard\"></i> Create a New Dashboard</button>\r\n</div>\r\n\r\n<div class=\"modal modal-fullscreen\" id=\"add-dashboard-modal\" tabindex=\"-1\" aria-labelledby=\"add-dashboard-modal-label\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: dashboard\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"add-dashboard-modal-label\"><span data-bind=\"text: Id() ? 'Edit' : 'Add'\"></span> Dashboard</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" data-bind=\"click: $root.onModalCloseClicked\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"mb-4 card card-body\">\r\n <div class=\"row mb-3\">\r\n <label class=\"col-md-3 col-form-label\">Name</label>\r\n <div class=\"col-md-6\">\r\n <input class=\"form-control\" data-val=\"true\" data-val-required=\"Dashboard Name is required.\" type=\"text\" data-bind=\"value: Name\" placeholder=\"Dashboard Name, e.g., Sales, Accounting\" id=\"add-dash-name\" required />\r\n </div>\r\n </div>\r\n <div class=\"row mb-3\">\r\n <label class=\"col-md-3 col-form-label\">Description</label>\r\n <div class=\"col-md-6\">\r\n <textarea class=\"form-control\" data-bind=\"value: Description\" placeholder=\"Optional Description for the Dashboard\"></textarea>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mb-4 card card-body\">\r\n <div class=\"row align-items-center mb-3\">\r\n <div class=\"col-md-6\">\r\n <h5><i class=\"fa fa-paperclip\"></i> Choose Reports for the Dashboard</h5>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <input type=\"text\" class=\"form-control\" placeholder=\"Search Report by Name or Description...\" data-bind=\"textInput: $parent.searchReports\" />\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: $parent.searchReports() && $parent.reportsInSearch().length==0\">\r\n <div class=\"card card-body\">\r\n No reports found matching your search.\r\n </div>\r\n </div>\r\n <div data-bind=\"if: $parent.searchReports() && $parent.reportsInSearch().length>0\">\r\n <ul class=\"list-group\" data-bind=\"foreach: $parent.reportsInSearch\">\r\n <li class=\"list-group-item\">\r\n <div class=\"checkbox\">\r\n <label class=\"list-group-item-heading\">\r\n <input type=\"checkbox\" data-bind=\"checked: selected\">\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', 'fa-window-restore': reportType=='Treemap', 'fa-code': reportType=='Html'}\" style=\"font-size: 14pt; color: #808080\"></span>\r\n <span data-bind=\"highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n </label>\r\n </div>\r\n <p class=\"list-group-item-text small\" data-bind=\"text: reportDescription\"></p>\r\n </li>\r\n </ul>\r\n </div>\r\n\r\n <div data-bind=\"if: !$parent.searchReports()\" class=\"list-group mb-3\">\r\n <div data-bind=\"foreach: $parent.reportsAndFolders\">\r\n <div class=\"list-group-item\">\r\n <a role=\"button\" class=\"d-flex justify-content-between align-items-center\" data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folder-' + folderId }\" style=\"text-decoration: none; font-weight: normal;\">\r\n <div class=\"d-flex align-items-center\">\r\n <i class=\"fa fa-folder me-2 text-secondary\"></i>\r\n <span data-bind=\"text: folder\"></span>\r\n </div>\r\n <i class=\"fa fa-chevron-down\"></i>\r\n </a>\r\n <div class=\"collapse mt-2\" data-bind=\"attr: {id: 'folder-' + folderId }\">\r\n <ul class=\"list-group list-group-flush\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input\" type=\"checkbox\" data-bind=\"checked: selected\">\r\n <label class=\"form-check-label\">\r\n <i 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', 'fa-window-restore': reportType=='Treemap', 'fa-code': reportType=='Html'}\" style=\"font-size: 14pt; color: #808080\"></i>\r\n <span data-bind=\"text: reportName\"></span>\r\n </label>\r\n </div>\r\n <small class=\"text-muted\" data-bind=\"text: reportDescription\"></small>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card card-body mb-3\">\r\n <h5><i class=\"fa fa-hourglass\"></i>&nbsp;Choose Schedule</h5>\r\n <div data-bind=\"template: {name: 'report-schedule'}\"></div>\r\n </div>\r\n\r\n <div data-bind=\"visible: $parent.adminMode\" class=\"card card-body mb-3\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: manageAccess}\"></div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-danger\" data-bind=\"click: $root.deleteDashboard, visible: Id\">Delete Dashboard</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: $root.saveDashboard\">Save Dashboard</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"grid-stack\" data-bind=\"foreach: reports\" style=\"display: none;\">\r\n <div class=\"grid-stack-item\" data-bind=\"attr: {'gs-x': x, 'gs-y': y, 'gs-w': width, 'gs-h': height, 'gs-auto-position': true, 'gs-id': ReportID}\">\r\n <div class=\"card\" data-bind=\"attr: {class: 'card ' + panelStyle + ' grid-stack-item-content'}, css: { expanded: isExpanded }, style: { border: noDashboardBorders() ? 'none' : '', 'box-shadow': noDashboardBorders() ? 'none' : '' }\" style=\"overflow-y: hidden;\">\r\n <div class=\"padded-div\" style=\"padding-bottom: 0; margin-bottom: 0;\">\r\n <div class=\"pull-left\">\r\n <button type=\"button\" class=\"btn\" data-bs-toggle=\"dropdown\" aria-haspopup=\"false\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-v\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu small\" style=\"z-index: 1001;\">\r\n <li data-bind=\"visible: FlyFilters().length > 0\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: toggleFlyFilters\">\r\n <span class=\"fa fa-filter\"></span> Filter\r\n </a>\r\n </li>\r\n <li class=\"dropdown dropdown-hover\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\" data-bs-toggle=\"dropdown\" role=\"button\" aria-expanded=\"false\" data-bind=\"click: editReportAi\">\r\n <span class=\"fa fa-pencil\"></span> Edit\r\n </a>\r\n <ul class=\"dropdown-menu small\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: openReport\">\r\n <span class=\"fa fa-pencil\"></span> Edit Standard\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: editReportAi\">\r\n <span class=\"fa fa-bolt\"></span> Edit Smarter\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li class=\"dropdown dropdown-hover\" data-bind=\"visible: ReportType()!='Single'\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\">\r\n <span class=\"fa fa-download\"></span> Export\r\n </a>\r\n <ul class=\"dropdown-menu small\">\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcel\">\r\n <span class=\"fa fa-file-excel-o\"></span> Excel\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: canDrilldown\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcelWithDrilldown\">\r\n <span class=\"fa fa-file-excel-o\"></span> Excel (Expanded)\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: $parent.appSettings.showPageSize ? function() { loadPdfModel() } : function() { $parent.appSettings.useAltPdf ? downloadPdfAlt('','') : downloadPdf('','') }\">\r\n <span class=\"fa fa-file-pdf-o\"></span> PDF\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: $parent.appSettings.showPageSize ? function() { loadWordModel()} : function() { downloadWord('',''); }\">\r\n <span class=\"fa fa-file-word-o\"></span> Word\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li data-bind=\"visible: ReportType()!='Single'\">\r\n <a class=\"dropdown-item\" data-bind=\"attr: {href: '/DotNetReport?linkedreport=true&noparent=true&reportId=' + ReportID() }\" target=\"_blank\">\r\n <span class=\"fa fa-folder-open\"></span> Open Report\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: CanEdit() && CanSaveReports()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span> Save\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: $parent.currentDashboard().canManage || $parent.adminMode()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: function() { $parent.removeReportFromDashboard(ReportID()); }\">\r\n <span class=\"fa fa-close\"></span> Remove\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: function() { RefreshReport(ReportID()); }\">\r\n <span class=\"fa fa-refresh\"></span> Refresh\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode, click: getCode\">\r\n <span class=\"fa fa-code\"></span> Report Code\r\n </a>\r\n </li>\r\n </ul>\r\n\r\n </div>\r\n\r\n <h2 class=\"pull-left\" data-bind=\"text: ReportName\"></h2>\r\n <div class=\"pull-right\">\r\n <span data-bind=\"visible: isDirty\" class=\"text-warning small\" title=\"You have unsaved changes\">\r\n <i class=\"fa fa-exclamation-triangle\"></i>\r\n </span>\r\n <a class=\"btn btn-link\" data-bind=\"visible: CanEdit() && CanSaveReports() && isDirty(), click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span>\r\n </a>\r\n <a class=\"btn btn-link\" data-bind=\"click: toggleExpand\"><span class=\"fa\" data-bind=\"css: {'fa-expand': !isExpanded(), 'fa-minus': isExpanded() }, visible: ReportType() != 'Single' && !noDashboardBorders()\"></span></a>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: activeDesign()\">\r\n <div data-bind=\"template: 'report-designer-compact'\"></div>\r\n </div>\r\n <div class=\"card-body list-overflow-auto\" style=\"padding-top: 0; margin-top: 0;\">\r\n <div data-bind=\"if: ReportType()!='Single' && ReportType()!='Html' && CanEdit()\">\r\n <div data-bind=\"template: 'chart-settings', data: $data\"></div>\r\n </div>\r\n <p data-bind=\"html: ReportDescription, visible: ReportDescription\"></p>\r\n <div data-bind=\"template: {name: 'fly-filter-template'}, visible: showFlyFilters\"></div>\r\n <div data-bind=\"with: ReportResult\" class=\"small\">\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>\r\n <div class=\"form-inline\" data-bind=\"ifnot: noDashboardBorders\">\r\n <div class=\"small\" data-bind=\"with: pager\">\r\n <div class=\"form-group pull-left total-records\" data-bind=\"if: totalRecords()>1 && $parent.ReportType() != 'Single'\">\r\n <span data-bind=\"text: 'Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"form-group pull-right\" data-bind=\"if: pages()>1 && $parent.ReportType() != 'Single'\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\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;\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\r\n <div data-bind=\"template: {name: 'report-link-edit', 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\" data-bind=\"with: dashboard\">\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\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'word-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"wordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"exportAllWordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"exportAllWordOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'word-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"exportAllPdfOptionsModal\" tabindex=\"-1\" aria-labelledby=\"exportAllPdfOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->\r\n\r\n</div>", styles: [".report-chart{min-height:auto!important}.expanded{position:fixed!important;padding:0!important;margin:0!important;top:0!important;left:0!important;width:100%!important;height:100%!important;z-index:1050!important}\n"] });
6438
+ 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 });
6439
+ 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); 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 dropdown\" data-bind=\"visible: (CanSaveReports() && appSettings.usePromptBuilder()) || 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-plus\"></span> New Report\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: createNewReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\"><i class=\"fa fa-sliders\"></i> Use Standard Designer</a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: createNewReportAi\"><i class=\"fa fa-bolt\"></i> Use Smarter Designer</a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item active\" data-bind=\"visible: (SelectedFolder() ? SelectedFolder().canEdit : (CanSaveReports() || adminMode())) && !appSettings.usePromptBuilder()\">\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-o\"></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 active\" data-bind=\"visible: adminMode() && SelectedFolder() ==null\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: function(){ initHeaderDesigner(false); }\">\r\n <span class=\"fa fa-arrow-up\"></span> Report Header\r\n </a>\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...\" contenteditable=\"true\" data-tribute=\"true\"></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 <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=\"ifnot: designingHeader\">\r\n <div class=\"btn-group pull-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 </li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"clearfix\">\r\n <p class=\"pull-left\">Please choose a Report from this Folder</p>\r\n <div class=\"pull-right\">\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\">\r\n No Reports found matching your Search\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=\"pull-left me-2\" />\r\n <div class=\"fa fa-2x pull-left\" 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=\"pull-left\">\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: $parent.adminMode\">\r\n <div class=\"small\">\r\n <b>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>\r\n <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>\r\n <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>\r\n <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 : 'No Role'\"></span>\r\n <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>\r\n <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>\r\n <br />\r\n </div>\r\n <div data-bind=\"if: clientId\">\r\n For Client <span class=\"label label-info\" data-bind=\"text: clientId ? clientId : 'Any'\"></span>\r\n <br />\r\n </div>\r\n <div>\r\n Direct Link to Run Report: <a data-bind=\"attr: {href: '/DotNetReport/?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\"><span class=\"fa fa-link\"></span></a>\r\n &nbsp;<a href=\"#\" data-bind=\"click: navigator.clipboard.writeText(window.location.href + '?linkedreport=true&noparent=true&reportId=' + reportId )\"><span class=\"fa fa-copy\" title=\"Click to Copy Link\"></span></a>\r\n </div>\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=\"click: openReport, visible: canEdit\" 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('pdf');}\">\r\n <span class=\"fa fa-file-excel-o\"></span> Download PDF\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel (Expanded)\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 Report\" data-bind=\"click: openReport, visible: canEdit\" 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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel with inner rows\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-6\">Name</div>\r\n <div class=\"col-md-6 text-end\" data-bind=\"visible: adminMode\">Access Control</div>\r\n </div>\r\n <div class=\"folder-list\" data-bind=\"foreach: Folders\">\r\n <div class=\"row clickable py-2 border-bottom align-items-center w-100\" data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <div class=\"col-md-6 d-flex align-items-center\">\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-6 text-end\" data-bind=\"visible: $parent.adminMode\">\r\n <!--<div class=\"badge bg-info text-white\" data-bind=\"text: userId ? userId : 'Any User'\"></div>\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userRole ? userRole : 'No Role'\"></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\">\r\n <p class=\"text-center text-muted\">No reports found matching your search.</p>\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>&nbsp;\r\n <span data-bind=\"text: message\" class=\"highlight small\"></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>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: openReport, visible: canEdit\">\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('pdf');}\">\r\n <span class=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel (Expanded)\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible:$parent.adminMode, click: function() {exportReport('json');}\">\r\n <span class=\"fa fa-file\"></span> Export JSON\r\n </a>\r\n </li>\r\n </ul>\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-2\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userId ? userId : 'Any User'\"></div>\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userRole ? userRole : 'No Role'\"></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 &nbsp;\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'\">\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: ReportMode()=='linked'\">\r\n <i class=\"fa fa-arrow-circle-left\"></i>\r\n <span>Back to Parent Report</span>\r\n </button>\r\n <div class=\"dropdown\" data-bind=\"visible: $root.CanEdit() && ReportID()\">\r\n <button class=\"dropdown-toggle btn btn-light btn-sm\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <i class=\"fa fa-edit\"></i> Edit Report\r\n </button>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\"\r\n data-bind=\"click: function(){ SaveReport(true); }\"\r\n data-bs-toggle=\"modal\"\r\n data-bs-target=\"#modal-reportbuilder\">\r\n <i class=\"fa fa-sliders\"></i> Edit with Standard Designer\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\"\r\n data-bind=\"click: editReportAi\">\r\n <i class=\"fa fa-bolt\"></i> Edit with Smarter Designer\r\n </a>\r\n </div>\r\n </div>\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-o\"></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-o\"></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-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-word-o\"></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=\"fa fa-file-excel-o\"></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-o\"></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=\"fa 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=\"if: activeDesign()\">\r\n <div data-bind=\"if: ReportID() <= 0\">\r\n <ul class=\"nav nav-tabs\" id=\"designTabs\" role=\"tablist\"> \r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link active\" id=\"designer-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#designer\" type=\"button\" role=\"tab\">\r\n Report Designer\r\n </button>\r\n </li>\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link\" id=\"nl-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#nl\" type=\"button\" role=\"tab\">\r\n Use Prompt<span title=\"This feature is still in Beta release. You can turn it off from settings\" style=\"font-size: 10pt; padding: 5px; max-width: 350px; white-space: normal; margin-bottom: 0;\">\r\n <i class=\"fa fa-info-circle\"></i>\r\n </span>\r\n </button>\r\n </li>\r\n </ul>\r\n\r\n <div class=\"tab-content mt-3\">\r\n <div class=\"tab-pane fade show active\" id=\"designer\" role=\"tabpanel\" aria-labelledby=\"designer-tab\">\r\n <div data-bind=\"template: 'report-designer-compact', data: $root\"></div>\r\n </div>\r\n <div class=\"tab-pane fade\" id=\"nl\" role=\"tabpanel\" aria-labelledby=\"nl-tab\">\r\n <div class=\"card\">\r\n <div class=\"card-body\">\r\n <p>\r\n What would you like to know? Type a <b>natural language prompt</b> below to ask questions about your data.<br>\r\n Use <b>Auto Complete</b> suggestions to guide your query \u2014 the AI will convert your prompt into a Dotnet Report that you can then preview, design, save and reuse.\r\n </p>\r\n\r\n <p id=\"query-input\" class=\"query-input\">\r\n Show me&nbsp;\r\n </p>\r\n\r\n <p>\r\n <button data-bind=\"click: function() {runQuery(false);}\" class=\"btn btn-primary btn-sm\">\r\n <span class=\"fa fa-magic\"></span> Process with AI\r\n </button>\r\n\r\n <button data-bind=\"click: function() {resetQuery(true, false);}\" class=\"btn btn-secondary btn-sm\">\r\n <span class=\"fa fa-undo\"></span> Start Over\r\n </button>\r\n\r\n <button class=\"btn btn-secondary btn-sm\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: adminMode\">\r\n <span class=\"fa fa-code\"></span> View Code\r\n </button>\r\n\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: CanSaveReports(), click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span> Save Report\r\n </button>\r\n\r\n <button data-bind=\"click: openDesigner\" class=\"btn btn-secondary btn-sm\">\r\n <span class=\"fa fa-pencil\"></span> Design/Save Report\r\n </button>\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: ReportID() > 0\">\r\n <div data-bind=\"template: 'report-designer-compact', data: $root\"></div>\r\n </div>\r\n </div>\r\n\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\" data-bind=\"with: pager\">\r\n <div class=\"form-inline pull-left\" data-bind=\"visible: pages()\">\r\n <div class=\"form-group pull-left total-records\">\r\n <span data-bind=\"text: ' Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"pull-left\">\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=\"fa fa-file-excel-o\"></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=\"pull-left\">\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 <!-- ko 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 <!-- /ko -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"form-inline pull-right\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n <div class=\"btn-group btn-group-sm pull-right\" 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>\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 bg-white\">\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=\"visible: headerDesigner.UseReportHeader\">\r\n <div id=\"report-header\" width=\"900\" height=\"120\" data-bind=\"html: 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\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>\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>\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 <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<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
6450
6440
  }
6451
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DotnetdashboardComponent, decorators: [{
6441
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DotnetreportComponent, decorators: [{
6452
6442
  type: Component,
6453
- args: [{ selector: 'app-dotnetdashboard', template: "<div id=\"dot-net-report\" class=\"body-content\">\r\n\r\n<div data-bind=\"template: {name: 'admin-mode-template'}, visible: allowAdmin\" style=\"display: none;\"></div>\r\n\r\n<div class=\"row\" style=\"display: none\" data-bind=\"visible: currentDashboard\">\r\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center\">\r\n <ul class=\"nav nav-tabs flex-grow-1\" data-bind=\"foreach: dashboards\">\r\n <li class=\"nav-item\">\r\n <h2>\r\n <a class=\"nav-link\" href=\"#\" data-bind=\"text: name, click: function() { $parent.selectDashboard(id);}, css: { 'active': $parent.currentDashboard().id === id, 'selected-tab': $parent.currentDashboard().id === id }\"></a>\r\n </h2>\r\n </li>\r\n </ul>\r\n <div class=\"d-flex flex-wrap align-items-end gap-2 mt-2 mt-md-0 border-bottom\" style=\"padding-top: 21px;\"> \r\n <div class=\"dropdown\">\r\n <button class=\"btn btn-light btn-sm dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <i class=\"fa fa-pencil-square\"></i>\r\n <span>Manage</span>\r\n </button>\r\n <ul class=\"dropdown-menu\">\r\n <li class=\"dropdown dropdown-hover\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\" data-bs-toggle=\"dropdown\" role=\"button\" aria-expanded=\"false\" data-bind=\"click: function() { newReport(true) }, visible: currentDashboard().canManage || adminMode()\">\r\n <span class=\"fa fa-plus\"></span> Add New Report\r\n </a>\r\n <ul class=\"dropdown-menu\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { newReport(false) }\">\r\n <span class=\"fa fa-pencil\"></span> Add using Standard Designer\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { newReport(true) }\">\r\n <span class=\"fa fa-bolt\"></span> Add using Smarter Designer\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\" data-bind=\"click: editDashboard, visible: currentDashboard().canManage || adminMode()\">\r\n <i class=\"fa fa-pencil\"></i>\r\n <span>Edit Dashboard</span>\r\n </button>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\" data-bind=\"click: newDashboard\">\r\n <i class=\"fa fa-dashboard\"></i>\r\n <span>Add a New Dashboard</span>\r\n </button>\r\n </li>\r\n <li>\r\n <button class=\"dropdown-item\" data-bind=\"click: RefreshAllReports\">\r\n <i class=\"fa fa-refresh\"></i>\r\n <span>Refresh</span>\r\n </button>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"dropdown\">\r\n <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\">\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllPdfReportsWithPageOption() : ExportAllPdfReports('',''); }, hidden: appSettings.useAltPdf\"><i class=\"fa fa-file-pdf-o\"></i> Pdf</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllPdfAltReportsWithPageOption() : ExportAllPdfAltReports('',''); }, visible: appSettings.useAltPdf\"><i class=\"fa fa-file-pdf-o\"></i> Pdf</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ExportAllExcelReports\"><i class=\"fa fa-file-excel-o\"></i> Excel</a></li>\r\n <li data-bind=\"visible: canDrilldown\"><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: ExportAllExcelExpandedReports\"><i class=\"fa fa-file-excel-o\"></i> Excel (Expanded)</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() { return appSettings.showPageSize ? ExportAllWordReportsWithPageOption() : ExportAllWordReports('','');}\"><i class=\"fa fa-file-word-o\"></i> Word</a></li>\r\n <li><a class=\"dropdown-item\" href=\"#\" data-bind=\"click: PrintDashboard\"><i class=\"fa fa-print\"></i> Print</a></li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"if: currentDashboard().canManage || adminMode()\">\r\n <div class=\"btn btn-light btn-sm d-flex align-items-center gap-2\">\r\n <div class=\"form-check form-switch m-0\">\r\n <input class=\"form-check-input\" id=\"arrange-mode\" type=\"checkbox\" data-bind=\"checked: arrangeDashboard\">\r\n </div>\r\n <span>Arrange</span>\r\n </div>\r\n </div>\r\n <div class=\"btn-group btn-group-sm\" role=\"group\">\r\n <button class=\"btn btn-light\" data-bind=\"click: zoomOutDashboard\" data-bs-toggle=\"tooltip\" title=\"Zoom Out\">\r\n <i class=\"fa fa-search-minus\"></i>\r\n </button>\r\n\r\n <button class=\"btn btn-light\" data-bind=\"click: resetZoomDashboard\" data-bs-toggle=\"tooltip\" title=\"Reset Zoom\">\r\n <i class=\"fa fa-compress\"></i>\r\n </button>\r\n\r\n <button class=\"btn btn-light\" data-bind=\"click: zoomInDashboard\" 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>\r\n </div>\r\n</div>\r\n\r\n<div class=\"d-flex justify-content-between\">\r\n <div class=\"row\" style=\"display: none\" data-bind=\"visible: currentDashboard\">\r\n <div data-bind=\"with: currentDashboard\">\r\n <p data-bind=\"text: description\"></p>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"padded-top\"></div>\r\n\r\n<div class=\"row\">\r\n <div class=\"col-md-12\">\r\n <div data-bind=\"template: {name: 'fly-filter-template'}\"></div>\r\n <br />\r\n </div>\r\n</div>\r\n\r\n<div class=\"centered\" style=\"display: none;\" data-bind=\"visible: dashboards().length == 0 \">\r\n No Dashboards yet. Click below to Start<br />\r\n <button class=\"btn btn-lg btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#add-dashboard-modal\"><i class=\"fa fa-dashboard\"></i> Create a New Dashboard</button>\r\n</div>\r\n\r\n<div class=\"modal modal-fullscreen\" id=\"add-dashboard-modal\" tabindex=\"-1\" aria-labelledby=\"add-dashboard-modal-label\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog\" role=\"document\">\r\n <div class=\"modal-content\" data-bind=\"with: dashboard\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\" id=\"add-dashboard-modal-label\"><span data-bind=\"text: Id() ? 'Edit' : 'Add'\"></span> Dashboard</h4>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" data-bind=\"click: $root.onModalCloseClicked\" aria-label=\"Close\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div class=\"mb-4 card card-body\">\r\n <div class=\"row mb-3\">\r\n <label class=\"col-md-3 col-form-label\">Name</label>\r\n <div class=\"col-md-6\">\r\n <input class=\"form-control\" data-val=\"true\" data-val-required=\"Dashboard Name is required.\" type=\"text\" data-bind=\"value: Name\" placeholder=\"Dashboard Name, e.g., Sales, Accounting\" id=\"add-dash-name\" required />\r\n </div>\r\n </div>\r\n <div class=\"row mb-3\">\r\n <label class=\"col-md-3 col-form-label\">Description</label>\r\n <div class=\"col-md-6\">\r\n <textarea class=\"form-control\" data-bind=\"value: Description\" placeholder=\"Optional Description for the Dashboard\"></textarea>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mb-4 card card-body\">\r\n <div class=\"row align-items-center mb-3\">\r\n <div class=\"col-md-6\">\r\n <h5><i class=\"fa fa-paperclip\"></i> Choose Reports for the Dashboard</h5>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <input type=\"text\" class=\"form-control\" placeholder=\"Search Report by Name or Description...\" data-bind=\"textInput: $parent.searchReports\" />\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: $parent.searchReports() && $parent.reportsInSearch().length==0\">\r\n <div class=\"card card-body\">\r\n No reports found matching your search.\r\n </div>\r\n </div>\r\n <div data-bind=\"if: $parent.searchReports() && $parent.reportsInSearch().length>0\">\r\n <ul class=\"list-group\" data-bind=\"foreach: $parent.reportsInSearch\">\r\n <li class=\"list-group-item\">\r\n <div class=\"checkbox\">\r\n <label class=\"list-group-item-heading\">\r\n <input type=\"checkbox\" data-bind=\"checked: selected\">\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', 'fa-window-restore': reportType=='Treemap', 'fa-code': reportType=='Html'}\" style=\"font-size: 14pt; color: #808080\"></span>\r\n <span data-bind=\"highlightedText: { text: reportName, highlight: $parent.searchReports, css: 'highlight' }\"></span>\r\n </label>\r\n </div>\r\n <p class=\"list-group-item-text small\" data-bind=\"text: reportDescription\"></p>\r\n </li>\r\n </ul>\r\n </div>\r\n\r\n <div data-bind=\"if: !$parent.searchReports()\" class=\"list-group mb-3\">\r\n <div data-bind=\"foreach: $parent.reportsAndFolders\">\r\n <div class=\"list-group-item\">\r\n <a role=\"button\" class=\"d-flex justify-content-between align-items-center\" data-bs-toggle=\"collapse\" data-bind=\"attr: {href: '#folder-' + folderId }\" style=\"text-decoration: none; font-weight: normal;\">\r\n <div class=\"d-flex align-items-center\">\r\n <i class=\"fa fa-folder me-2 text-secondary\"></i>\r\n <span data-bind=\"text: folder\"></span>\r\n </div>\r\n <i class=\"fa fa-chevron-down\"></i>\r\n </a>\r\n <div class=\"collapse mt-2\" data-bind=\"attr: {id: 'folder-' + folderId }\">\r\n <ul class=\"list-group list-group-flush\" data-bind=\"foreach: reports\">\r\n <li class=\"list-group-item\">\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input\" type=\"checkbox\" data-bind=\"checked: selected\">\r\n <label class=\"form-check-label\">\r\n <i 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', 'fa-window-restore': reportType=='Treemap', 'fa-code': reportType=='Html'}\" style=\"font-size: 14pt; color: #808080\"></i>\r\n <span data-bind=\"text: reportName\"></span>\r\n </label>\r\n </div>\r\n <small class=\"text-muted\" data-bind=\"text: reportDescription\"></small>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card card-body mb-3\">\r\n <h5><i class=\"fa fa-hourglass\"></i>&nbsp;Choose Schedule</h5>\r\n <div data-bind=\"template: {name: 'report-schedule'}\"></div>\r\n </div>\r\n\r\n <div data-bind=\"visible: $parent.adminMode\" class=\"card card-body mb-3\">\r\n <div data-bind=\"template: {name: 'manage-access-template', data: manageAccess}\"></div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\">\r\n <button type=\"button\" class=\"btn btn-danger\" data-bind=\"click: $root.deleteDashboard, visible: Id\">Delete Dashboard</button>\r\n <button type=\"button\" class=\"btn btn-primary\" data-bind=\"click: $root.saveDashboard\">Save Dashboard</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"grid-stack\" data-bind=\"foreach: reports\" style=\"display: none;\">\r\n <div class=\"grid-stack-item\" data-bind=\"attr: {'gs-x': x, 'gs-y': y, 'gs-w': width, 'gs-h': height, 'gs-auto-position': true, 'gs-id': ReportID}\">\r\n <div class=\"card\" data-bind=\"attr: {class: 'card ' + panelStyle + ' grid-stack-item-content'}, css: { expanded: isExpanded }, style: { border: noDashboardBorders() ? 'none' : '', 'box-shadow': noDashboardBorders() ? 'none' : '' }\" style=\"overflow-y: hidden;\">\r\n <div class=\"padded-div\" style=\"padding-bottom: 0; margin-bottom: 0;\">\r\n <div class=\"pull-left\">\r\n <button type=\"button\" class=\"btn\" data-bs-toggle=\"dropdown\" aria-haspopup=\"false\" aria-expanded=\"false\">\r\n <span class=\"fa fa-ellipsis-v\"></span>\r\n </button>\r\n <ul class=\"dropdown-menu small\" style=\"z-index: 1001;\">\r\n <li data-bind=\"visible: FlyFilters().length > 0\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: toggleFlyFilters\">\r\n <span class=\"fa fa-filter\"></span> Filter\r\n </a>\r\n </li>\r\n <li class=\"dropdown dropdown-hover\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\" data-bs-toggle=\"dropdown\" role=\"button\" aria-expanded=\"false\" data-bind=\"click: editReportAi\">\r\n <span class=\"fa fa-pencil\"></span> Edit\r\n </a>\r\n <ul class=\"dropdown-menu small\">\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: openReport\">\r\n <span class=\"fa fa-pencil\"></span> Edit Standard\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: editReportAi\">\r\n <span class=\"fa fa-bolt\"></span> Edit Smarter\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li class=\"dropdown dropdown-hover\" data-bind=\"visible: ReportType()!='Single'\">\r\n <a href=\"#\" class=\"dropdown-toggle dropdown-item\">\r\n <span class=\"fa fa-download\"></span> Export\r\n </a>\r\n <ul class=\"dropdown-menu small\">\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcel\">\r\n <span class=\"fa fa-file-excel-o\"></span> Excel\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: canDrilldown\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: downloadExcelWithDrilldown\">\r\n <span class=\"fa fa-file-excel-o\"></span> Excel (Expanded)\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: $parent.appSettings.showPageSize ? function() { loadPdfModel() } : function() { $parent.appSettings.useAltPdf ? downloadPdfAlt('','') : downloadPdf('','') }\">\r\n <span class=\"fa fa-file-pdf-o\"></span> PDF\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: $parent.appSettings.showPageSize ? function() { loadWordModel()} : function() { downloadWord('',''); }\">\r\n <span class=\"fa fa-file-word-o\"></span> Word\r\n </a>\r\n </li>\r\n </ul>\r\n </li>\r\n <li data-bind=\"visible: ReportType()!='Single'\">\r\n <a class=\"dropdown-item\" data-bind=\"attr: {href: '/DotNetReport?linkedreport=true&noparent=true&reportId=' + ReportID() }\" target=\"_blank\">\r\n <span class=\"fa fa-folder-open\"></span> Open Report\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: CanEdit() && CanSaveReports()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span> Save\r\n </a>\r\n </li>\r\n <li data-bind=\"visible: $parent.currentDashboard().canManage || $parent.adminMode()\">\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: function() { $parent.removeReportFromDashboard(ReportID()); }\">\r\n <span class=\"fa fa-close\"></span> Remove\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bind=\"click: function() { RefreshReport(ReportID()); }\">\r\n <span class=\"fa fa-refresh\"></span> Refresh\r\n </a>\r\n </li>\r\n <li>\r\n <a href=\"#\" class=\"dropdown-item\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: $parent.adminMode, click: getCode\">\r\n <span class=\"fa fa-code\"></span> Report Code\r\n </a>\r\n </li>\r\n </ul>\r\n\r\n </div>\r\n\r\n <h2 class=\"pull-left\" data-bind=\"text: ReportName\"></h2>\r\n <div class=\"pull-right\">\r\n <span data-bind=\"visible: isDirty\" class=\"text-warning small\" title=\"You have unsaved changes\">\r\n <i class=\"fa fa-exclamation-triangle\"></i>\r\n </span>\r\n <a class=\"btn btn-link\" data-bind=\"visible: CanEdit() && CanSaveReports() && isDirty(), click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span>\r\n </a>\r\n <a class=\"btn btn-link\" data-bind=\"click: toggleExpand\"><span class=\"fa\" data-bind=\"css: {'fa-expand': !isExpanded(), 'fa-minus': isExpanded() }, visible: ReportType() != 'Single' && !noDashboardBorders()\"></span></a>\r\n </div>\r\n </div>\r\n <div data-bind=\"if: activeDesign()\">\r\n <div data-bind=\"template: 'report-designer-compact'\"></div>\r\n </div>\r\n <div class=\"card-body list-overflow-auto\" style=\"padding-top: 0; margin-top: 0;\">\r\n <div data-bind=\"if: ReportType()!='Single' && ReportType()!='Html' && CanEdit()\">\r\n <div data-bind=\"template: 'chart-settings', data: $data\"></div>\r\n </div>\r\n <p data-bind=\"html: ReportDescription, visible: ReportDescription\"></p>\r\n <div data-bind=\"template: {name: 'fly-filter-template'}, visible: showFlyFilters\"></div>\r\n <div data-bind=\"with: ReportResult\" class=\"small\">\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>\r\n <div class=\"form-inline\" data-bind=\"ifnot: noDashboardBorders\">\r\n <div class=\"small\" data-bind=\"with: pager\">\r\n <div class=\"form-group pull-left total-records\" data-bind=\"if: totalRecords()>1 && $parent.ReportType() != 'Single'\">\r\n <span data-bind=\"text: 'Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"form-group pull-right\" data-bind=\"if: pages()>1 && $parent.ReportType() != 'Single'\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\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;\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\r\n <div data-bind=\"template: {name: 'report-link-edit', 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\" data-bind=\"with: dashboard\">\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\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'word-options-schedule-template', data: $data }\"></div>\r\n</div>\r\n\r\n<div class=\"modal\" id=\"wordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"wordOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: selectedReport\">\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\" data-bind=\"with: selectedReport\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"exportAllWordOptionsModal\" tabindex=\"-1\" aria-labelledby=\"exportAllWordOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'word-options-template', data: $data }\"></div>\r\n</div>\r\n<div class=\"modal\" id=\"exportAllPdfOptionsModal\" tabindex=\"-1\" aria-labelledby=\"exportAllPdfOptionsModalLabel\" aria-hidden=\"true\" data-bind=\"with: dashboard\">\r\n <div data-bind=\"template: { name: 'pdf-options-template', data: $data }\"></div>\r\n</div>\r\n\r\n<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->\r\n\r\n</div>", styles: [".report-chart{min-height:auto!important}.expanded{position:fixed!important;padding:0!important;margin:0!important;top:0!important;left:0!important;width:100%!important;height:100%!important;z-index:1050!important}\n"] }]
6443
+ 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); 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 dropdown\" data-bind=\"visible: (CanSaveReports() && appSettings.usePromptBuilder()) || 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-plus\"></span> New Report\r\n </a>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: createNewReport\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\"><i class=\"fa fa-sliders\"></i> Use Standard Designer</a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: createNewReportAi\"><i class=\"fa fa-bolt\"></i> Use Smarter Designer</a>\r\n </div>\r\n </li>\r\n <li class=\"nav-item active\" data-bind=\"visible: (SelectedFolder() ? SelectedFolder().canEdit : (CanSaveReports() || adminMode())) && !appSettings.usePromptBuilder()\">\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-o\"></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 active\" data-bind=\"visible: adminMode() && SelectedFolder() ==null\">\r\n <a href=\"#\" class=\"nav-link\" data-bind=\"click: function(){ initHeaderDesigner(false); }\">\r\n <span class=\"fa fa-arrow-up\"></span> Report Header\r\n </a>\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...\" contenteditable=\"true\" data-tribute=\"true\"></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 <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=\"ifnot: designingHeader\">\r\n <div class=\"btn-group pull-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 </li>\r\n </ul>\r\n </div>\r\n <div data-bind=\"visible: SelectedFolder() || searchReports()\">\r\n <div class=\"clearfix\">\r\n <p class=\"pull-left\">Please choose a Report from this Folder</p>\r\n <div class=\"pull-right\">\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\">\r\n No Reports found matching your Search\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=\"pull-left me-2\" />\r\n <div class=\"fa fa-2x pull-left\" 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=\"pull-left\">\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: $parent.adminMode\">\r\n <div class=\"small\">\r\n <b>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>\r\n <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>\r\n <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>\r\n <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 : 'No Role'\"></span>\r\n <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>\r\n <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>\r\n <br />\r\n </div>\r\n <div data-bind=\"if: clientId\">\r\n For Client <span class=\"label label-info\" data-bind=\"text: clientId ? clientId : 'Any'\"></span>\r\n <br />\r\n </div>\r\n <div>\r\n Direct Link to Run Report: <a data-bind=\"attr: {href: '/DotNetReport/?linkedreport=true&noparent=true&reportId=' + reportId }\" target=\"_blank\"><span class=\"fa fa-link\"></span></a>\r\n &nbsp;<a href=\"#\" data-bind=\"click: navigator.clipboard.writeText(window.location.href + '?linkedreport=true&noparent=true&reportId=' + reportId )\"><span class=\"fa fa-copy\" title=\"Click to Copy Link\"></span></a>\r\n </div>\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=\"click: openReport, visible: canEdit\" 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('pdf');}\">\r\n <span class=\"fa fa-file-excel-o\"></span> Download PDF\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"click: function() {exportReport('excel');}\">\r\n <span class=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel (Expanded)\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 Report\" data-bind=\"click: openReport, visible: canEdit\" 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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel with inner rows\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-6\">Name</div>\r\n <div class=\"col-md-6 text-end\" data-bind=\"visible: adminMode\">Access Control</div>\r\n </div>\r\n <div class=\"folder-list\" data-bind=\"foreach: Folders\">\r\n <div class=\"row clickable py-2 border-bottom align-items-center w-100\" data-bind=\"click: function(){ $parent.SelectedFolder($data); }\">\r\n <div class=\"col-md-6 d-flex align-items-center\">\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-6 text-end\" data-bind=\"visible: $parent.adminMode\">\r\n <!--<div class=\"badge bg-info text-white\" data-bind=\"text: userId ? userId : 'Any User'\"></div>\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userRole ? userRole : 'No Role'\"></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\">\r\n <p class=\"text-center text-muted\">No reports found matching your search.</p>\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>&nbsp;\r\n <span data-bind=\"text: message\" class=\"highlight small\"></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>\r\n <a class=\"dropdown-item\" href=\"#\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-reportbuilder\" data-bind=\"click: openReport, visible: canEdit\">\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('pdf');}\">\r\n <span class=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></span> Download Excel (Expanded)\r\n </a>\r\n </li>\r\n <li>\r\n <a class=\"dropdown-item\" href=\"#\" data-bind=\"visible:$parent.adminMode, click: function() {exportReport('json');}\">\r\n <span class=\"fa fa-file\"></span> Export JSON\r\n </a>\r\n </li>\r\n </ul>\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-2\"></div>\r\n <div class=\"col-md-2\" data-bind=\"visible: $parent.adminMode\">\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userId ? userId : 'Any User'\"></div>\r\n <div class=\"badge bg-info text-white\" data-bind=\"text: userRole ? userRole : 'No Role'\"></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 &nbsp;\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'\">\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: ReportMode()=='linked'\">\r\n <i class=\"fa fa-arrow-circle-left\"></i>\r\n <span>Back to Parent Report</span>\r\n </button>\r\n <div class=\"dropdown\" data-bind=\"visible: $root.CanEdit() && ReportID()\">\r\n <button class=\"dropdown-toggle btn btn-light btn-sm\" role=\"button\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n <i class=\"fa fa-edit\"></i> Edit Report\r\n </button>\r\n <div class=\"dropdown-menu\">\r\n <a class=\"dropdown-item\" href=\"#\"\r\n data-bind=\"click: function(){ SaveReport(true); }\"\r\n data-bs-toggle=\"modal\"\r\n data-bs-target=\"#modal-reportbuilder\">\r\n <i class=\"fa fa-sliders\"></i> Edit with Standard Designer\r\n </a>\r\n <a class=\"dropdown-item\" href=\"#\"\r\n data-bind=\"click: editReportAi\">\r\n <i class=\"fa fa-bolt\"></i> Edit with Smarter Designer\r\n </a>\r\n </div>\r\n </div>\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-o\"></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-o\"></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-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-excel-o\"></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=\"fa fa-file-word-o\"></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=\"fa fa-file-excel-o\"></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-o\"></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=\"fa 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=\"if: activeDesign()\">\r\n <div data-bind=\"if: ReportID() <= 0\">\r\n <ul class=\"nav nav-tabs\" id=\"designTabs\" role=\"tablist\"> \r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link active\" id=\"designer-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#designer\" type=\"button\" role=\"tab\">\r\n Report Designer\r\n </button>\r\n </li>\r\n <li class=\"nav-item\" role=\"presentation\">\r\n <button class=\"nav-link\" id=\"nl-tab\" data-bs-toggle=\"tab\" data-bs-target=\"#nl\" type=\"button\" role=\"tab\">\r\n Use Prompt<span title=\"This feature is still in Beta release. You can turn it off from settings\" style=\"font-size: 10pt; padding: 5px; max-width: 350px; white-space: normal; margin-bottom: 0;\">\r\n <i class=\"fa fa-info-circle\"></i>\r\n </span>\r\n </button>\r\n </li>\r\n </ul>\r\n\r\n <div class=\"tab-content mt-3\">\r\n <div class=\"tab-pane fade show active\" id=\"designer\" role=\"tabpanel\" aria-labelledby=\"designer-tab\">\r\n <div data-bind=\"template: 'report-designer-compact', data: $root\"></div>\r\n </div>\r\n <div class=\"tab-pane fade\" id=\"nl\" role=\"tabpanel\" aria-labelledby=\"nl-tab\">\r\n <div class=\"card\">\r\n <div class=\"card-body\">\r\n <p>\r\n What would you like to know? Type a <b>natural language prompt</b> below to ask questions about your data.<br>\r\n Use <b>Auto Complete</b> suggestions to guide your query \u2014 the AI will convert your prompt into a Dotnet Report that you can then preview, design, save and reuse.\r\n </p>\r\n\r\n <p id=\"query-input\" class=\"query-input\">\r\n Show me&nbsp;\r\n </p>\r\n\r\n <p>\r\n <button data-bind=\"click: function() {runQuery(false);}\" class=\"btn btn-primary btn-sm\">\r\n <span class=\"fa fa-magic\"></span> Process with AI\r\n </button>\r\n\r\n <button data-bind=\"click: function() {resetQuery(true, false);}\" class=\"btn btn-secondary btn-sm\">\r\n <span class=\"fa fa-undo\"></span> Start Over\r\n </button>\r\n\r\n <button class=\"btn btn-secondary btn-sm\" data-bs-toggle=\"modal\" data-bs-target=\"#sqlModal\" data-bind=\"visible: adminMode\">\r\n <span class=\"fa fa-code\"></span> View Code\r\n </button>\r\n\r\n <button class=\"btn btn-secondary btn-sm\" data-bind=\"visible: CanSaveReports(), click: SaveWithoutRun\">\r\n <span class=\"fa fa-save\"></span> Save Report\r\n </button>\r\n\r\n <button data-bind=\"click: openDesigner\" class=\"btn btn-secondary btn-sm\">\r\n <span class=\"fa fa-pencil\"></span> Design/Save Report\r\n </button>\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div data-bind=\"if: ReportID() > 0\">\r\n <div data-bind=\"template: 'report-designer-compact', data: $root\"></div>\r\n </div>\r\n </div>\r\n\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\" data-bind=\"with: pager\">\r\n <div class=\"form-inline pull-left\" data-bind=\"visible: pages()\">\r\n <div class=\"form-group pull-left total-records\">\r\n <span data-bind=\"text: ' Total Records: ' + totalRecords()\"></span><br />\r\n </div>\r\n <div class=\"pull-left\">\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=\"fa fa-file-excel-o\"></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=\"pull-left\">\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 <!-- ko 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 <!-- /ko -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"form-inline pull-right\">\r\n <div data-bind=\"template: 'pager-template', data: $data\"></div>\r\n </div>\r\n <div class=\"btn-group btn-group-sm pull-right\" 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>\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 bg-white\">\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=\"visible: headerDesigner.UseReportHeader\">\r\n <div id=\"report-header\" width=\"900\" height=\"120\" data-bind=\"html: 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\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>\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>\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 <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<!-- Templates -->\r\n<div [innerHtml]=\"reportTemplates\"></div>\r\n<!-- Templates -->" }]
6454
6444
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.DomSanitizer }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
6455
6445
  type: Inject,
6456
6446
  args: [BASE_URL_TOKEN]
@@ -6464,7 +6454,7 @@ class DotnetsetupComponent {
6464
6454
  route;
6465
6455
  baseServiceUrl;
6466
6456
  reportTemplates;
6467
- queryParams;
6457
+ queryParams = {};
6468
6458
  constructor(injector, sanitizer, cdref, baseUrl, http, route) {
6469
6459
  this.sanitizer = sanitizer;
6470
6460
  this.cdref = cdref;
@@ -6506,7 +6496,8 @@ class DotnetsetupComponent {
6506
6496
  apiUrl: this.baseServiceUrl + '/DotNetReportApi/CallPostReportApi',
6507
6497
  getPreviewFromSqlUrl: this.baseServiceUrl + '/DotNetReportApi/GetPreviewFromSql',
6508
6498
  onlyApi: onlyApi,
6509
- loadSchemaUrl: loadSetupSchemaUrl
6499
+ loadSchemaUrl: loadSetupSchemaUrl,
6500
+ currentUserId: model.CurrentUserId
6510
6501
  };
6511
6502
  this.renderKOTemplates();
6512
6503
  var vm = new manageViewModel(options);
@@ -9631,63 +9622,33 @@ class DotnetsetupComponent {
9631
9622
  `);
9632
9623
  this.cdref.detectChanges();
9633
9624
  }
9634
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", 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 });
9635
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: DotnetsetupComponent, 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-o\"></i> Schedules\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\" style=\"display: none;\">\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 Connection\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: usePromptBuilder\">\r\n <label class=\"form-check-label\">Use AI aided, prompt based Report Builder</label>\r\n <small class=\"text-muted d-block\">Let non Admin users create reports using the AI aided Prompt based builder</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 <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>\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 </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>&nbsp;\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: selectAll, visible: !$root.onlyApi()\">\r\n <span class=\"fa fa-check\"></span> Select All 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-o\"></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 pull-left\">\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: IsView\" class=\"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=\"fa fa-floppy-o\"></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=\"pull-right\" 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=\"fa fa-floppy-o\"></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=\"pull-right\">\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 <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: 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>\r\n <button class=\"btn btn-sm pull-right\" 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 pull-right 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>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: SaveJoins\">Save Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: visualizeJoins\">Visualize Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: DeleteVisibleJoins\" title=\"Delete filtered Joins\">Delete Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: ExportJoins\" title=\"Export filtered Joins\">Export Joins</button>&nbsp;\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-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 <button class=\"btn btn-sm\" data-bind=\"click: $root.sortByPrimaryTable\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.primaryTable() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </button>\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 <button class=\"btn btn-sm\" data-bind=\"click: $root.sortByField\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.primaryField() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinType\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinType() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinTable\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinTable() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field<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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinField\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinField() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </span>\r\n </div>\r\n </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-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-2\">\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 -->\r\n <div data-bind=\"foreach: pagedJoins\">\r\n <div class=\"row align-items-center border-bottom py-2\">\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-2\">\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\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\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=\"pull-left\">\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=\"pull-right\" 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=\"pull-right\">\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 pull-right\" 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 &nbsp;&nbsp;\r\n <button class=\"btn btn-sm btn-primary pull-right\" 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 Access\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>&nbsp;<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>&nbsp;<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=\"click: createNewFunction\">Add new Function</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>Name</th>\r\n <th>Display Name</th>\r\n <th>Description</th>\r\n <th>Data Type</th>\r\n <th>Required</th>\r\n <th></th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: parameters\">\r\n <tr>\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: displayName, valueUpdate: 'input'\" /></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\" /></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-o\"></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\">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=\"pull-left\">\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=\"pull-right\" 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\" 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 pull-right\" 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&nbsp;\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}\n"] });
9625
+ 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 });
9626
+ 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-o\"></i> Schedules\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\" style=\"display: none;\">\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 Connection\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: usePromptBuilder\">\r\n <label class=\"form-check-label\">Use AI aided, prompt based Report Builder</label>\r\n <small class=\"text-muted d-block\">Let non Admin users create reports using the AI aided Prompt based builder</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 <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\">Allow User 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>\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 </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>&nbsp;\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: selectAll, visible: !$root.onlyApi()\">\r\n <span class=\"fa fa-check\"></span> Select All 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-o\"></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 pull-left\">\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: IsView\" class=\"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=\"fa fa-floppy-o\"></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=\"pull-right\" 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=\"fa fa-floppy-o\"></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=\"pull-right\">\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 <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: 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>\r\n <button class=\"btn btn-sm pull-right\" 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 pull-right 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>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: SaveJoins\">Save Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: visualizeJoins\">Visualize Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: DeleteVisibleJoins\" title=\"Delete filtered Joins\">Delete Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: ExportJoins\" title=\"Export filtered Joins\">Export Joins</button>&nbsp;\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-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 <button class=\"btn btn-sm\" data-bind=\"click: $root.sortByPrimaryTable\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.primaryTable() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </button>\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 <button class=\"btn btn-sm\" data-bind=\"click: $root.sortByField\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.primaryField() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinType\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinType() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinTable\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinTable() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field<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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinField\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinField() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </span>\r\n </div>\r\n </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-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-2\">\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 -->\r\n <div data-bind=\"foreach: pagedJoins\">\r\n <div class=\"row align-items-center border-bottom py-2\">\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-2\">\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\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\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=\"pull-left\">\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=\"pull-right\" 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=\"pull-right\">\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 pull-right\" 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 &nbsp;&nbsp;\r\n <button class=\"btn btn-sm btn-primary pull-right\" 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 Access\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>&nbsp;<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>&nbsp;<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=\"click: createNewFunction\">Add new Function</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>Name</th>\r\n <th>Display Name</th>\r\n <th>Description</th>\r\n <th>Data Type</th>\r\n <th>Required</th>\r\n <th></th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: parameters\">\r\n <tr>\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: displayName, valueUpdate: 'input'\" /></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\" /></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-o\"></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\">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=\"pull-left\">\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=\"pull-right\" 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\" 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 pull-right\" 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&nbsp;\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}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
9636
9627
  }
9637
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DotnetsetupComponent, decorators: [{
9628
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DotnetsetupComponent, decorators: [{
9638
9629
  type: Component,
9639
- args: [{ selector: 'app-dotnetsetup', 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-o\"></i> Schedules\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\" style=\"display: none;\">\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 Connection\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: usePromptBuilder\">\r\n <label class=\"form-check-label\">Use AI aided, prompt based Report Builder</label>\r\n <small class=\"text-muted d-block\">Let non Admin users create reports using the AI aided Prompt based builder</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 <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>\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 </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>&nbsp;\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: selectAll, visible: !$root.onlyApi()\">\r\n <span class=\"fa fa-check\"></span> Select All 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-o\"></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 pull-left\">\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: IsView\" class=\"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=\"fa fa-floppy-o\"></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=\"pull-right\" 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=\"fa fa-floppy-o\"></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=\"pull-right\">\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 <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: 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>\r\n <button class=\"btn btn-sm pull-right\" 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 pull-right 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>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: SaveJoins\">Save Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: visualizeJoins\">Visualize Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: DeleteVisibleJoins\" title=\"Delete filtered Joins\">Delete Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: ExportJoins\" title=\"Export filtered Joins\">Export Joins</button>&nbsp;\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-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 <button class=\"btn btn-sm\" data-bind=\"click: $root.sortByPrimaryTable\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.primaryTable() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </button>\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 <button class=\"btn btn-sm\" data-bind=\"click: $root.sortByField\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.primaryField() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinType\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinType() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinTable\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinTable() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field<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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinField\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinField() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </span>\r\n </div>\r\n </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-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-2\">\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 -->\r\n <div data-bind=\"foreach: pagedJoins\">\r\n <div class=\"row align-items-center border-bottom py-2\">\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-2\">\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\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\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=\"pull-left\">\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=\"pull-right\" 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=\"pull-right\">\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 pull-right\" 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 &nbsp;&nbsp;\r\n <button class=\"btn btn-sm btn-primary pull-right\" 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 Access\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>&nbsp;<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>&nbsp;<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=\"click: createNewFunction\">Add new Function</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>Name</th>\r\n <th>Display Name</th>\r\n <th>Description</th>\r\n <th>Data Type</th>\r\n <th>Required</th>\r\n <th></th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: parameters\">\r\n <tr>\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: displayName, valueUpdate: 'input'\" /></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\" /></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-o\"></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\">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=\"pull-left\">\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=\"pull-right\" 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\" 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 pull-right\" 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&nbsp;\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}\n"] }]
9630
+ 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-o\"></i> Schedules\r\n </a>\r\n </li>\r\n <li role=\"presentation\" class=\"nav-item\" style=\"display: none;\">\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 Connection\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: usePromptBuilder\">\r\n <label class=\"form-check-label\">Use AI aided, prompt based Report Builder</label>\r\n <small class=\"text-muted d-block\">Let non Admin users create reports using the AI aided Prompt based builder</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 <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\">Allow User 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>\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 </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>&nbsp;\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: selectAll, visible: !$root.onlyApi()\">\r\n <span class=\"fa fa-check\"></span> Select All 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-o\"></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 pull-left\">\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: IsView\" class=\"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=\"fa fa-floppy-o\"></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=\"pull-right\" 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=\"fa fa-floppy-o\"></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=\"pull-right\">\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 <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: 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>\r\n <button class=\"btn btn-sm pull-right\" 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 pull-right 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>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: SaveJoins\">Save Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: visualizeJoins\">Visualize Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: DeleteVisibleJoins\" title=\"Delete filtered Joins\">Delete Joins</button>&nbsp;\r\n <button class=\"btn btn-sm btn-primary\" data-bind=\"click: ExportJoins\" title=\"Export filtered Joins\">Export Joins</button>&nbsp;\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-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 <button class=\"btn btn-sm\" data-bind=\"click: $root.sortByPrimaryTable\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.primaryTable() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </button>\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 <button class=\"btn btn-sm\" data-bind=\"click: $root.sortByField\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.primaryField() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinType\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinType() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinTable\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinTable() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-2\">\r\n Field<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 <span class=\"btn btn-sm\" data-bind=\"click: $root.sortByJoinField\">\r\n <i class=\"fa\" data-bind=\"css: $root.sortDirection.joinField() ? 'fa-sort-asc' : 'fa-sort-desc'\"></i>\r\n </span>\r\n </div>\r\n </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-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-2\">\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 -->\r\n <div data-bind=\"foreach: pagedJoins\">\r\n <div class=\"row align-items-center border-bottom py-2\">\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-2\">\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\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\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=\"pull-left\">\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=\"pull-right\" 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=\"pull-right\">\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 pull-right\" 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 &nbsp;&nbsp;\r\n <button class=\"btn btn-sm btn-primary pull-right\" 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 Access\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>&nbsp;<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>&nbsp;<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=\"click: createNewFunction\">Add new Function</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>Name</th>\r\n <th>Display Name</th>\r\n <th>Description</th>\r\n <th>Data Type</th>\r\n <th>Required</th>\r\n <th></th>\r\n </tr>\r\n </thead>\r\n <tbody data-bind=\"foreach: parameters\">\r\n <tr>\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: displayName, valueUpdate: 'input'\" /></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\" /></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-o\"></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\">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=\"pull-left\">\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=\"pull-right\" 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\" 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 pull-right\" 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&nbsp;\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}\n"] }]
9640
9631
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.DomSanitizer }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
9641
9632
  type: Inject,
9642
9633
  args: [BASE_URL_TOKEN]
9643
9634
  }] }, { type: i2.HttpClient }, { type: i3.ActivatedRoute }] });
9644
9635
 
9645
- class DotnetReportModule {
9646
- static forRoot(base_url) {
9647
- return {
9648
- ngModule: DotnetReportModule,
9649
- providers: [
9650
- {
9651
- provide: BASE_URL_TOKEN,
9652
- useValue: base_url
9653
- }
9654
- ]
9655
- };
9656
- }
9657
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DotnetReportModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
9658
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: DotnetReportModule, declarations: [DotnetreportComponent,
9659
- DotnetdashboardComponent,
9660
- DotnetsetupComponent], imports: [BrowserAnimationsModule], exports: [DotnetreportComponent,
9661
- DotnetdashboardComponent,
9662
- DotnetsetupComponent] });
9663
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DotnetReportModule, imports: [BrowserAnimationsModule] });
9636
+ function provideDotNetReport(baseUrl) {
9637
+ return [
9638
+ {
9639
+ provide: BASE_URL_TOKEN,
9640
+ useValue: baseUrl
9641
+ }
9642
+ ];
9664
9643
  }
9665
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DotnetReportModule, decorators: [{
9666
- type: NgModule,
9667
- args: [{
9668
- declarations: [
9669
- DotnetreportComponent,
9670
- DotnetdashboardComponent,
9671
- DotnetsetupComponent,
9672
- ],
9673
- imports: [
9674
- BrowserAnimationsModule
9675
- ],
9676
- exports: [
9677
- DotnetreportComponent,
9678
- DotnetdashboardComponent,
9679
- DotnetsetupComponent
9680
- ]
9681
- }]
9682
- }] });
9683
9644
 
9684
9645
  /*
9685
- * Public API Surface of dotnetreport-lib
9646
+ * Public API Surface of dotnetreport-ng
9686
9647
  */
9687
9648
 
9688
9649
  /**
9689
9650
  * Generated bundle index. Do not edit.
9690
9651
  */
9691
9652
 
9692
- export { DotnetReportModule, DotnetReportService, DotnetdashboardComponent, DotnetreportComponent, DotnetsetupComponent };
9653
+ export { BASE_URL_TOKEN, DotnetdashboardComponent, DotnetreportComponent, DotnetsetupComponent, provideDotNetReport };
9693
9654
  //# sourceMappingURL=dotnetreport-ng.mjs.map