Redmind commited on
Commit
e084a2e
·
verified ·
1 Parent(s): d7025df

Update dashboard.html

Browse files
Files changed (1) hide show
  1. dashboard.html +239 -120
dashboard.html CHANGED
@@ -1,120 +1,239 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <title>Dashboard</title>
6
- <!-- AdminLTE CSS -->
7
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/admin-lte/3.1.0/css/adminlte.min.css">
8
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
9
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" />
10
- <style>
11
- html, body {
12
- height: 100%;
13
- margin: 0;
14
- display: flex;
15
- flex-direction: column;
16
- }
17
- .wrapper {
18
- flex: 1; /* This allows the content to grow and push the footer down */
19
- padding: 10px;
20
- margin-left: -35px;
21
- }
22
-
23
- </style>
24
- </head>
25
- <body>
26
- {% include 'sidepane.html' %}
27
-
28
- <div class="wrapper">
29
- <!-- Main content
30
- <h1>Welcome,tothe RedMindGPT {{ username }}!</h1>
31
- <h1>Your role in redmindgptis: {{ role }}</h1> -->
32
- <section class="main-header" style="border-bottom: none;border-top: none;">
33
- <div class="container-fluid">
34
- <div class="row">
35
- <div class="col-lg-4 col-6">
36
- <div class="small-box bg-info">
37
- <div class="inner margin-left:10px;">
38
- <h3>4</h3>
39
- <h4>KnowledgeBase</h4>
40
- </div>
41
- <div class="icon">
42
- <i class="ion ion-bag"></i>
43
- </div>
44
- </div>
45
- </div>
46
-
47
- <div class="col-lg-4 col-6">
48
- <div class="small-box bg-success">
49
- <div class="inner">
50
- <h3>1</h3>
51
- <h4>Data connectors</h4>
52
- </div>
53
- <div class="icon">
54
- <i class="ion ion-stats-bars"></i>
55
- </div>
56
- </div>
57
- </div>
58
-
59
- <div class="col-lg-4 col-6">
60
- <div class="small-box bg-warning">
61
- <div class="inner">
62
- <h3>4</h3>
63
- <h4>API Connectors</h4>
64
- </div>
65
- <div class="icon">
66
- <i class="ion ion-person-add"></i>
67
- </div>
68
- </div>
69
- </div>
70
-
71
- <div class="col-lg-4 col-6">
72
- <div class="small-box bg-warning">
73
- <div class="inner">
74
- <h3>5</h3>
75
- <h4>Prompt_Templates</h4>
76
- </div>
77
- <div class="icon">
78
- <i class="ion ion-person-add"></i>
79
- </div>
80
- </div>
81
- </div>
82
- </div>
83
- </div>
84
- </section>
85
- </div>
86
-
87
- <input type="hidden" id="userRole" name="userRole" value={{ role }}>
88
-
89
- <footer>
90
- {% include 'footer.html' %}
91
- </footer>
92
-
93
- <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/adminlte.min.js"></script>
94
- <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
95
- <script>
96
- window.addEventListener('pageshow', function(event) {
97
- if (event.persisted || (window.performance && window.performance.navigation.type === 2)) {
98
- window.location.reload();
99
- }
100
- });
101
-
102
-
103
-
104
- document.addEventListener('DOMContentLoaded', function() {
105
- var role1 = document.getElementById("userRole").value;
106
- if (!role1) {
107
- var roleFromInput = sessionStorage.getItem('userRole');
108
- sessionStorage.setItem('userRole', roleFromInput);
109
- console.log("Role set in sessionStorage:", roleFromInput);
110
- } else {
111
- sessionStorage.setItem('userRole', role1);
112
- console.log("Retrieved user role from input:", role1); // Debugging
113
- }
114
-
115
- });
116
- </script>
117
- </body>
118
-
119
- </body>
120
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>Dashboard</title>
6
+ <!-- AdminLTE CSS -->
7
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/admin-lte/3.1.0/css/adminlte.min.css">
8
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
9
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" />
10
+ <style>
11
+ html, body {
12
+ height: 100%;
13
+ margin: 0;
14
+ display: flex;
15
+ flex-direction: column;
16
+ }
17
+ .wrapper {
18
+ flex: 1; /* This allows the content to grow and push the footer down */
19
+ padding: 10px;
20
+ margin-left: -35px;
21
+ }
22
+
23
+ </style>
24
+ </head>
25
+ <body>
26
+
27
+ {% include 'sidepane.html' %}
28
+
29
+
30
+ <div class="wrapper">
31
+ <section class="main-header" style="border-bottom: none;border-top: none;">
32
+ <div class="container-fluid">
33
+ <div id="company-block" class="form-group left-align" style="display: none;">
34
+ <label for="company" class="ml-3" style="display: inline-block; margin-right: 10px;">Select the Company Name
35
+ to view the details <span class="text-danger">*</span>
36
+ </label>
37
+ <select type="text" id="company" name="company" class="ml-3 form-control"
38
+ style="display: inline-block; width: 20%;" required>
39
+ <option value="" selected>Select</option>
40
+ </select>
41
+ </div>
42
+
43
+ <div class="row">
44
+ <div class="col-lg-4 col-6">
45
+ <div class="small-box bg-info">
46
+ <div class="inner margin-left:10px;">
47
+ <h3 id="knowledgeBaseCount">{{table_count_of_each_table.knowledge_base}}</h3>
48
+ <h4>KnowledgeBase</h4>
49
+ </div>
50
+ <div class="icon">
51
+ <i class="ion ion-bag"></i>
52
+ </div>
53
+ </div>
54
+ </div>
55
+
56
+ <div class="col-lg-4 col-6">
57
+ <div class="small-box bg-success">
58
+ <div class="inner">
59
+ <h3 id="dataConnectorsCount">{{table_count_of_each_table.data_connectors}}</h3>
60
+ <h4>Data connectors</h4>
61
+ </div>
62
+ <div class="icon">
63
+ <i class="ion ion-stats-bars"></i>
64
+ </div>
65
+ </div>
66
+ </div>
67
+
68
+ <div class="col-lg-4 col-6">
69
+ <div class="small-box bg-warning">
70
+ <div class="inner">
71
+ <h3 id="apiConnectorsCount">{{table_count_of_each_table.api_connectors}}</h3>
72
+ <h4>API Connectors</h4>
73
+ </div>
74
+ <div class="icon">
75
+ <i class="ion ion-person-add"></i>
76
+ </div>
77
+ </div>
78
+ </div>
79
+
80
+ <div class="col-lg-4 col-6">
81
+ <div class="small-box bg-warning">
82
+ <div class="inner">
83
+ <h3 id="promptTemplatesCount">{{table_count_of_each_table.prompt_templates}}</h3>
84
+ <h4>Prompt_Templates</h4>
85
+ </div>
86
+ <div class="icon">
87
+ <i class="ion ion-person-add"></i>
88
+ </div>
89
+ </div>
90
+ </div>
91
+
92
+ </div>
93
+ </div>
94
+ </section>
95
+ <input type="hidden" id="userRole" name="userRole" value={{role}}>
96
+ <input type="hidden" id="company_id" name="company_id" value={{company_id}}>
97
+ <input type="hidden" id="username" name="username" value={{username}}>
98
+ <input type="hidden" id="company_name" name="company_name" value={{company_name}}>
99
+ </div>
100
+
101
+
102
+
103
+ {% include 'footer.html' %}
104
+
105
+
106
+ <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/adminlte.min.js"></script>
107
+ <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
108
+ <script>
109
+ window.addEventListener('pageshow', function (event) {
110
+ if (event.persisted || (window.performance && window.performance.navigation.type === 2)) {
111
+ window.location.reload();
112
+ }
113
+ });
114
+
115
+
116
+ document.addEventListener('DOMContentLoaded', function () {
117
+ var role1 = document.getElementById("userRole").value;
118
+ var company_id1 = document.getElementById("company_id").value;
119
+ var company_name1=document.getElementById("company_name").value;
120
+ var username1=document.getElementById("username").value;
121
+ console.log("companyid in dasshboard",username1);
122
+ sessionStorage.setItem('userRole', role1);
123
+ // sessionStorage.setItem('siderole',role1);
124
+ // sessionStorage.setItem('sidecompanyId',company_id1);
125
+ sessionStorage.setItem('company_id', company_id1);
126
+ sessionStorage.setItem('company_name',company_name1);
127
+ sessionStorage.setItem('username',username1);
128
+ if (!role1) {
129
+ var roleFromInput = sessionStorage.getItem('userRole');
130
+ sessionStorage.setItem('userRole', roleFromInput);
131
+ console.log("Role set in sessionStorage:", roleFromInput);
132
+ } else {
133
+ sessionStorage.setItem('userRole', role1);
134
+ console.log("Retrieved user role from input:", role1); // Debugging
135
+ }
136
+ if (role1 === "superadmin") {
137
+ document.getElementById('company-block').style.display = 'block';
138
+ fetchCompanies();
139
+ }
140
+
141
+ });
142
+ document.getElementById('company').addEventListener('change', async function () {
143
+ const selectedCompany = this.value;
144
+ sessionStorage.setItem("company_name",selectedCompany);
145
+ if (selectedCompany!== "Select") {
146
+ try {
147
+ const response = await fetch(`/api/company_id?company_name=${encodeURIComponent(selectedCompany)}`);
148
+ if (!response.ok) {
149
+ contentSection.style.display = 'none';
150
+ displayErrorMessage("Document details do not exist for this company. Please fill in the details.");
151
+ throw new Error('Network response was not ok');
152
+ }
153
+ const data = await response.json();
154
+ console.log('data returned', data);
155
+ const companyId = data.company_id;
156
+ sessionStorage.setItem("company_id",companyId);
157
+ console.log("company id for superadmin", company_id);
158
+ //document.getElementById('company_id').value = companyId;
159
+
160
+
161
+ if (companyId) {
162
+ try {
163
+ const countResponse = await fetch(`/api/company_record_count/${companyId}`);
164
+ if (!countResponse.ok) {
165
+ throw new Error('Network response was not ok');
166
+ }
167
+ const countData = await countResponse.json();
168
+ console.log('Count data:', countData); // Log the response data
169
+ updateRecordCounts(countData.table_counts);
170
+ } catch (error) {
171
+ console.error('Error fetching record counts:', error);
172
+ }
173
+ } else {
174
+ clearRecordCounts();
175
+ }
176
+ } catch (error) {
177
+ console.error('No details for this company ID or data documents:', error);
178
+ // displayEmptyTable();
179
+
180
+ displayErrorMessage("company details do not exist for this company.");
181
+
182
+ }
183
+ }
184
+ });
185
+
186
+
187
+ function updateRecordCounts(counts) {
188
+ // Update the counts displayed in the dashboard
189
+ document.getElementById('knowledgeBaseCount').textContent = counts.knowledge_base || 0;
190
+ document.getElementById('dataConnectorsCount').textContent = counts.data_connectors || 0;
191
+ document.getElementById('apiConnectorsCount').textContent = counts.api_connectors || 0;
192
+ document.getElementById('promptTemplatesCount').textContent = counts.prompt_templates || 0;
193
+ }
194
+
195
+ function clearRecordCounts() {
196
+ document.getElementById('knowledgeBaseCount').textContent = 0;
197
+ document.getElementById('dataConnectorsCount').textContent = 0;
198
+ document.getElementById('apiConnectorsCount').textContent = 0;
199
+ document.getElementById('promptTemplatesCount').textContent = 0;
200
+ }
201
+
202
+
203
+ async function fetchCompanies() {
204
+ try {
205
+ const response = await fetch('/api/companies');
206
+ if (!response.ok) {
207
+ throw new Error('Network response was not ok');
208
+ }
209
+ const data = await response.json();
210
+ displayCompanies(data.companies);
211
+ } catch (error) {
212
+ console.error('Error fetching companies:', error);
213
+ }
214
+ }
215
+
216
+ function displayCompanies(companies) {
217
+ const companySelect = document.getElementById('company');
218
+ companySelect.innerHTML = '<option value="" selected>Select</option>'; // Reset the dropdown
219
+ companies.forEach(company => {
220
+ const option = document.createElement('option');
221
+ option.value = company.name;
222
+ option.textContent = company.name;
223
+ companySelect.appendChild(option);
224
+ });
225
+ }
226
+ function clearFormFields() {
227
+ document.getElementById('APIName').value = "";
228
+ document.getElementById('APIEndpoint').value = "";
229
+ document.getElementById('Auth_Bearer').value = "";
230
+ document.getElementById('Inputjson').value = "";
231
+ document.getElementById('OutputJson').value = "";
232
+ document.getElementById('Description').value = "";
233
+ }
234
+
235
+
236
+ </script>
237
+ </body>
238
+
239
+ </html>