Redmind commited on
Commit
63d697f
·
verified ·
1 Parent(s): 7736d85

Update templates/knowledgebase.html

Browse files
Files changed (1) hide show
  1. templates/knowledgebase.html +311 -368
templates/knowledgebase.html CHANGED
@@ -18,8 +18,9 @@
18
  <style>
19
  body {
20
  background-color: transparent !important;
21
- }
22
- .content-wrapper{
 
23
  flex: 1;
24
  overflow-y: auto;
25
  }
@@ -29,7 +30,7 @@
29
  flex-direction: column;
30
  height: 100vh;
31
  }
32
-
33
 
34
  .modal-content {
35
  background-color: #fff;
@@ -38,7 +39,7 @@
38
  .content-header {
39
  padding: 1rem;
40
  }
41
-
42
  h1 {
43
  text-align: center;
44
  margin-bottom: 30px;
@@ -64,16 +65,17 @@
64
  margin-right: 7.5px;
65
  }
66
 
67
-
68
  .text-wrap {
69
  white-space: normal !important;
70
  word-break: break-word;
71
  }
72
- div.dataTables_wrapper div.dataTables_length select{
 
73
  width: 60px;
74
  display: inline-block;
75
  }
76
-
77
  th {
78
  white-space: nowrap;
79
  }
@@ -125,36 +127,36 @@
125
  /* Delete column */
126
  width: auto;
127
  }
128
- .alert {
129
- position: relative;
130
- padding: 15px;
131
- margin-bottom: 20px;
132
- border: 1px solid transparent;
133
- border-radius: 4px;
134
- }
135
-
136
- .alert-success {
137
- color: #3c763d;
138
- background-color: #dff0d8;
139
- border-color: #d6e9c6;
140
- }
141
-
142
- .alert-danger {
143
- color: #a94442;
144
- background-color: #f2dede;
145
- border-color: #ebccd1;
146
- }
147
-
148
- .close {
149
- position: absolute;
150
- bottom: 10px;
151
- right: 10px;
152
- border: none;
153
- background: none;
154
- font-size: 16px;
155
- cursor: pointer;
156
- }
157
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
158
  </style>
159
  </head>
160
 
@@ -163,21 +165,21 @@
163
  <div class="wrapper">
164
  <div class="main-header" style="border-bottom: none;">
165
  <div class="container mt-2">
166
- <div class="form-group left-align" >
167
- <label for="company" class="mr-1" style="margin-left:-40px; margin-top: 12px;">Company Name <span class="text-danger">*</span></label>
168
  <select type="text" id="company" name="company" class="form-control" style="width:20%;margin-left:-40px;"required>
169
  <option value="" selected>Select</option>
170
- </select>
171
  <div class="col-12 d-flex justify-content-end mb-3">
172
- <button class="btn btn-primary" style="margin-top:-40px;margin-right: -10px;position: fixed;"
173
- id="add" data-action="add">Add</button>
174
  </div>
175
  </div>
176
  </div>
177
  <div class="row">
178
  <div id="message-container" style="margin-left: 200px;width:600px;"></div>
179
  </div>
180
-
181
  <section class="content" id="contentSection" style="display: none;">
182
  <div class="container-fluid">
183
  <div>
@@ -185,7 +187,8 @@
185
  <!-- <label for="company_id">company_id</label>--->
186
  <input type="hidden" id="company_id" name="company_id" class="form-control" required>
187
  </div>
188
- <div class="row">
 
189
  <div class="col-12">
190
  <div class="card">
191
  <div id="message-container">
@@ -193,7 +196,7 @@
193
  <table id="knowledgeTable" class="table table-bordered table-striped">
194
  <thead>
195
  <tr>
196
-
197
  <th>Sno</th>
198
  <th>Document Name</th>
199
  <th>Document Description</th>
@@ -202,7 +205,7 @@
202
  <th>View</th>
203
  <th>Edit</th>
204
  <th>Delete</th>
205
- <!-- <th style="display:none;">Company ID</th> -->
206
  </tr>
207
  </thead>
208
  <tbody>
@@ -216,14 +219,14 @@
216
  </div>
217
  </section>
218
  </div>
219
-
220
  <div class="modal fade" id="addModal" tabindex="-1" role="dialog" aria-labelledby="addModalLabel"
221
  aria-hidden="true">
222
  <div class="modal-dialog" role="document">
223
  <div class="modal-content">
224
  <div class="modal-header">
225
  <h5 class="modal-title" id="addModalLabel">Add Document Details</h5>
226
- <button type="button" class="btn-close" data-dismiss="modal" >
227
  <span aria-hidden="true" data-backdrop="static" data-keyboard="false"></span>
228
  </button>
229
  </div>
@@ -267,7 +270,8 @@
267
  </div>
268
  <div class="modal-footer">
269
  <!-- <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> -->
270
- <button type="button" id="saveupdate" class="btn btn-primary" style="display: none;">Update</button>
 
271
  <button type="button" id="save" onclick="save_file()" class="btn btn-primary">Save</button>
272
  </div>
273
  </div>
@@ -275,15 +279,21 @@
275
  </div>
276
  </div>
277
 
278
- {%include 'footer.html'%}
279
-
280
- <!-- JavaScript to handle modal display -->
281
- <script>
282
- document.addEventListener("DOMContentLoaded", function () {
 
 
 
 
 
 
 
283
  now = new Date().toISOString().replace('T', ' ').substr(0, 19);
284
  document.getElementById('lastUpdated').value = now;
285
  const inputs = document.querySelectorAll("#documentForm input, textarea");
286
-
287
  inputs.forEach((input, index) => {
288
  input.addEventListener("keydown", function (event) {
289
  if (event.key === "Enter") {
@@ -292,136 +302,98 @@
292
  }
293
  });
294
  });
 
 
 
 
 
 
 
 
 
 
 
 
 
 
295
 
296
- function moveToNextInput(inputs, currentIndex) {
297
- const nextInput = inputs[currentIndex + 1];
298
- if (nextInput) {
299
- nextInput.focus();
300
- } else {
301
- // Optionally, submit the form or trigger the save button
302
- document.getElementById("save").focus();
303
- }
304
- }
305
- // $(document).on('click', '.btn-view', function () {
306
- // const companyId = $(this).data('id');
307
- // console.log("company_id in view",companyId);
308
- // viewCompany(companyId);
309
- // });
310
-
311
- // // Edit knowledge base details
312
- // $(document).on('click', '.btn-edit', function () {
313
- // const companyId = $(this).data('id');
314
- // console.log("company_id in edit",companyId);
315
- // editCompany(companyId);
316
- // });
317
-
318
- // // Delete company
319
- // $(document).on('click', '.btn-delete', function () {
320
- // const kid = $(this).data('id'); // Get the company ID from the da
321
- // console.log("company_id in delete",kid);
322
- // if (confirm("Are you sure you want to delete this company?")) {
323
- // deleteCompany(kid); // Call the delete function with the company ID
324
- // }
325
- // });
326
- fetchCompanies();
327
-
328
- const companySelect = document.getElementById('company');
329
- const documentForm = document.getElementById('documentForm');
330
- const table = $('#knowledgeTable').DataTable(); // Initialize DataTable at the start
331
-
332
- companySelect.addEventListener('change', async function () {
333
- $("#message-container").empty();
334
- const selectedCompanyName = companySelect.options[companySelect.selectedIndex].text;
335
- console.log(`Selected Company Name: ${selectedCompanyName}`);
336
-
337
- if (selectedCompanyName !== "Select") {
338
- try {
339
- const response = await fetch(`/api/company_id?company_name=${encodeURIComponent(selectedCompanyName)}`);
340
- if (!response.ok) {
341
- contentSection.style.display = 'none';
342
- displayErrorMessage("Knowledgebase details do not exist for this company. Please fill in the details.");
343
- throw new Error('Network response was not ok');
344
- }
345
- const data = await response.json();
346
- console.log('data returned', data);
347
- const companyId = data.company_id;
348
- document.getElementById('company_id').value = companyId;
349
-
350
- if (companyId) {
351
- try {
352
- const Response = await fetch(`/api/document_upload?company_id=${companyId}&company_name=${selectedCompanyName}`);
353
- const connectorsResponse = await Response.json();
354
- console.log("knowledge data table after connecting to table", connectorsResponse);
355
- table.clear();
356
- if (!Array.isArray(connectorsResponse) || connectorsResponse.length === 0) {
357
- //displayEmptyTable();
358
-
359
- displayErrorMessage("Knowledgebase details do not exist for this company. Please fill in the details.");
360
- contentSection.style.display = 'none';
361
- } else {
362
-
363
- connectorsResponse.forEach((company, index) => {
364
- table.row.add([
365
-
366
- index + 1,
367
- company.document_name,
368
- company.document_desc,
369
- company.version,
370
- company.vectorDBflag,
371
- `<a href='#' class='btn btn-info btn-sm'data-kid-id='${company.row_id}' data-action="view" onclick='viewCompany(this)''><i class='fas fa-eye'></i></a>`,
372
- `<a href='#' class='btn btn-warning btn-sm'data-kid-id='${company.row_id}' data-action="edit" onclick='editCompany(this)'><i class='fas fa-edit'></i></a>`,
373
- `<a href='#' class='btn btn-danger btn-sm' data-kid-id='${company.row_id}' onclick='deleteCompany(this)'><i class='fas fa-trash'></i></a>`,
374
- company.row_id
375
- // "<a href='#' class='btn btn-info btn-sm'><i class='fas fa-eye'></i></a>",
376
- // "<a href='#' class='btn btn-warning btn-sm'><i class='fas fa-edit'></i></a>",
377
- // "<a href='#' class='btn btn-danger btn-sm'><i class='fas fa-trash'></i></button>"
378
- ]).draw(false);
379
- });
380
- contentSection.style.display = 'block';
381
- }
382
- } catch (error) {
383
- console.error('Error fetching company documents:', error);
384
- //displayEmptyTable();
385
-
386
- displayErrorMessage("Knowledgebase details1 do not exist for this company. Please fill in the details.");
387
- contentSection.style.display = 'none';
388
  }
389
- } else {
390
- // displayEmptyTable();
391
-
392
- displayErrorMessage("Details for knowledgebase do not exist for this company. Please fill in the details.");
393
  }
394
- } catch (error) {
395
- console.error('No details for this company ID or data documents:', error);
 
 
 
 
 
 
 
 
 
396
  // displayEmptyTable();
397
-
398
- displayErrorMessage("Knowledgebase details do not exist for this company. Please fill in the details.");
399
  contentSection.style.display = 'none';
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
400
  }
401
- } else {
402
- table.clear().draw();
403
- document.getElementById('contentSection').style.display = 'none';
404
- clearFormFields();
 
 
405
  }
406
- });
 
407
 
 
 
 
 
 
408
  function displayErrorMessage(message) {
409
  const messageContainer = document.getElementById('message-container');
410
  if (messageContainer) {
411
  messageContainer.innerHTML = `<div class='alert alert-danger'>${message}</div>`;
412
  }
413
  }
414
-
415
- });
416
 
417
  function clearFormFields() {
418
- document.getElementById('file-name').textContent=""
419
  document.getElementById('uploadFile').value = "";
420
  document.getElementById('documentName').value = "";
421
  document.getElementById('documentDescription').value = "";
422
  document.getElementById('department').value = "";
423
  document.getElementById('version').value = "";
424
- //document.getElementById('lastUpdated').value = "";
425
  }
426
 
427
 
@@ -429,21 +401,19 @@
429
  // Show modal function
430
  $('#add').on('click', function () {
431
  $('#documentName').removeAttr('readonly');
432
- $('#documentDescription').removeAttr('readonly');
433
- $('#department').removeAttr('readonly');
434
- $('#version').removeAttr('readonly');
435
- $('#lastUpdated').removeAttr('readonly');
436
  const modalTitle = document.getElementById('addModalLabel');
437
- modalTitle.textContent = 'Add Knowledgebase Details';
 
438
  $('#uploadFile').show();
439
  $('#saveupdate').hide();
440
- $('#save').show();
441
  clearFormFields();
442
  $('#message-container').empty(); // Clear the message container
443
  $('#addModal').modal('show');
444
  });
445
-
446
-
447
  $('.modal-footer .btn-secondary, .modal-header .btn-close').on('click', function () {
448
  $('#addModal').modal('hide');
449
  });
@@ -455,10 +425,12 @@
455
  function viewCompany(button) {
456
  var companyId = $(button).data('kid-id');
457
  const modalTitle = document.getElementById('addModalLabel');
458
- modalTitle.textContent = 'View Knowledgebase Details';
 
 
459
  $.getJSON(`/api/getknowledgebase/${companyId}`, function (company) {
460
  $('#uploadFile').hide();
461
- $('#file-name').text(company.file_path).attr('readonly','readonly');
462
  $('#documentName').val(company.document_name).attr('readonly', 'readonly');
463
  $('#documentDescription').val(company.document_desc).attr('readonly', 'readonly');
464
  $('#department').val(company.department).attr('readonly', 'readonly');
@@ -466,195 +438,184 @@
466
  //$('#lastUpdated').val(company.last_updated).attr('readonly', 'readonly');
467
  var lastUpdated = company.last_updated;
468
  $('#lastUpdated').val(lastUpdated).attr('readonly', 'readonly');
469
- $('#save').hide();
470
- $('#saveupdate').hide();
471
  $('#addModal').modal('show');
472
  }).fail(function () {
473
- alert("Error retrieving knowledge base details.");
474
  });
475
  }
 
476
 
477
  // Edit knowledge base details
478
- function editCompany(button) {
479
- var companyId = $(button).data('kid-id');
480
- const modalTitle = document.getElementById('addModalLabel');
481
- modalTitle.textContent = 'Edit Knowledgebase Details';
482
-
483
- // Fetch company details by ID
484
- $.getJSON(`/api/getknowledgebase/${companyId}`, function (company) {
485
-
486
- const fileName = company.file_path.split('/').pop();
487
- const fileContent = new Blob([""], { type: 'text/plain' });
488
- const file = new File([fileContent], fileName, { type: fileContent.type });
489
- const dataTransfer = new DataTransfer();
490
- dataTransfer.items.add(file);
491
-
492
- // Set the file input's files property to the created file
493
- const fileInput = document.getElementById('uploadFile');
494
- fileInput.files = dataTransfer.files;
495
-
496
- // Check if the input element is of type 'file'
497
- if (fileInput.type === 'file') {
498
- console.log("The input is of type 'file'.");
499
- } else {
500
- console.log("The input is NOT of type 'file'.");
501
- }
502
-
503
- // Check if the value is of type 'File'
504
- const files = fileInput.files;
505
- if (files.length > 0 && files[0] instanceof File) {
506
- console.log("The value is of type 'File':", files[0].name);
507
- } else {
508
- console.log("No file is selected or the value is not of type 'File'.");
509
- }
510
-
511
- $('#uploadFileLabel').text(files[0].name);
512
- $('#uploadFile').text(files[0].name)
513
- $('#documentName').val(company.document_name);
514
- $('#documentDescription').val(company.document_desc);
515
- $('#department').val(company.department);
516
- $('#version').val(company.version);
517
- $('#lastUpdated').val(company.last_updated);
518
- $('#company_id').val(company.company_id);
519
-
520
- // Show/hide appropriate elements
521
- $('#uploadFile').show(); // Hide the file upload field
522
- $('#save').hide(); // Hide the default save button
523
- $('#saveupdate').show(); // Show the update button
524
-
525
- // Ensure fields are editable
526
- $('#documentName').removeAttr('readonly');
527
- $('#documentDescription').removeAttr('readonly');
528
- $('#department').removeAttr('readonly');
529
- $('#version').removeAttr('readonly');
530
- $('#lastUpdated').removeAttr('readonly');
531
- $('#company_id').val(company.company_id); // Ensure company_id is included if necessary
532
-
533
- // Show the modal
534
- $('#addModal').modal('show');
535
-
536
- // Set up the click event for the update button
537
- $('#saveupdate').off('click').on('click', function () {
538
- saveupdate(companyId,files[0].name); // Pass the company ID for updating
539
- });
540
- }).fail(function () {
541
- alert("Error retrieving knowledge base details.");
542
- });
543
- }
544
 
545
-
546
- function saveupdate(companyId, filename) {
547
- const formData = new FormData();
548
- const fileInput = document.getElementById("uploadFile");
549
- const uploadFile = fileInput.files[0]; // Get the file object
550
- const company_id=document.getElementById("company_id").value;
551
- formData.append("company_id", $('#company_id').val());
552
- formData.append("documentName", $('#documentName').val());
553
- formData.append("documentDescription", $('#documentDescription').val());
554
- formData.append("department", $('#department').val());
555
- formData.append("version", $('#version').val());
556
- formData.append("vectorDBFlag", 'NO');
557
- formData.append("lastUpdated", $('#lastUpdated').val());
558
- console.log("company_id to table refresh",company_id)
559
- // Append the file only if it exists, otherwise, append the filename
560
- if (uploadFile) {
561
- formData.append("file_path", uploadFile); // Append the file object
562
- } else {
563
- formData.append("file_path", filename); // Append the existing filename
564
- }
 
565
 
566
- $.ajax({
567
- url: `/api/putknowledgebase/${companyId}`,
568
- type: 'PUT',
569
- data: formData,
570
- processData: false, // Required for FormData
571
- contentType: false, // Required for FormData
572
- success: function (response) {
573
- // alert('Knowledgebase details updated successfully.');
574
- const messageContainer = document.getElementById('message-container');
575
- if(messageContainer)
576
- messageContainer.innerHTML = `
577
- <div class='alert alert-success'>
578
- Knowledgebasse Data updated successfully
579
- <button class='close' onclick='dismissMessage()'>OK</button>
580
- </div>`;
581
- $('#addModal').modal('hide'); // Close the modal after saving
582
- fetchUpdatedDocuments(company_id);
583
- },
584
- error: function () {
585
- const messageContainer = document.getElementById('message-container');
586
- if(messageContainer)
587
- messageContainer.innerHTML = `
588
- <div class='alert alert-danger'>
589
- No changes have been made to update knowledgebase details.
590
- <button class='close' onclick='dismissMessage()'>OK</button>
591
- </div>`;
592
- $('#addModal').modal('hide');
593
- // alert('Form has no changes to update knowledge base details.');
 
 
 
 
 
 
 
 
 
 
 
 
594
  }
595
- });
596
- }
597
-
598
- async function fetchUpdatedDocuments(company_id) {
599
- console.log("company_id",company_id);
600
- var table = $('#knowledgeTable').DataTable();
601
- const Response = await fetch(`/api/document_update?company_id=${company_id}`);
602
- const connectorsResponse = await Response.json();
603
- console.log("knowledge data table after connecting to table", connectorsResponse);
604
- table.clear();
605
- if (!Array.isArray(connectorsResponse) || connectorsResponse.length === 0) {
606
- //displayEmptyTable();
607
-
608
- displayErrorMessage("Knowledgebase details do not exist for this company. Please fill in the details.");
609
- contentSection.style.display = 'none';
610
- } else {
611
-
612
- connectorsResponse.forEach((company, index) => {
613
- table.row.add([
614
-
615
- index + 1,
616
- company.document_name,
617
- company.document_desc,
618
- company.version,
619
- company.vectorDBflag,
620
- `<a href='#' class='btn btn-info btn-sm'data-kid-id='${company.row_id}' data-action="view" onclick='viewCompany(this)''><i class='fas fa-eye'></i></a>`,
621
- `<a href='#' class='btn btn-warning btn-sm'data-kid-id='${company.row_id}' data-action="edit" onclick='editCompany(this)'><i class='fas fa-edit'></i></a>`,
622
- //`<a href='#' class='btn btn-danger btn-sm' onclick='deleteCompany(${company.company_id})'><i class='fas fa-trash'></i></a>`,
623
- `<a href='#' class='btn btn-danger btn-sm' data-kid-id='${company.row_id}' onclick='deleteCompany(this)'><i class='fas fa-trash'></i></a>`,
624
- company.row_id
625
- // "<a href='#' class='btn btn-info btn-sm'><i class='fas fa-eye'></i></a>",
626
- // "<a href='#' class='btn btn-warning btn-sm'><i class='fas fa-edit'></i></a>",
627
- // "<a href='#' class='btn btn-danger btn-sm'><i class='fas fa-trash'></i></button>"
628
- ]).draw(false);
629
- });
630
- contentSection.style.display = 'block';
631
- }
632
- }
633
- // Delete company
634
  function deleteCompany(button) {
635
  var companyId = $(button).data('kid-id');
636
- console.log("k_id deleted",companyId);
637
  $.ajax({
638
  type: "DELETE",
639
  url: `/api/delknowledgebase/${companyId}`,
640
  success: function () {
641
  var table = $('#knowledgeTable').DataTable();
642
  table.row($(button).closest('tr')).remove().draw();
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
643
  const messageContainer = document.getElementById('message-container');
644
- if(messageContainer)
645
  messageContainer.innerHTML = `
646
- <div class='alert alert-danger'>
647
- Knowledgebase data deleted successfully.
648
  <button class='close' onclick='dismissMessage()'>OK</button>
649
  </div>`;
650
- // alert("Knowledgebase data deleted successfully.");
651
- fetchCompanies(); // Refresh the table
652
  },
653
- error: function (xhr) {
654
- alert("Error deleting company: " + xhr.responseJSON.detail);
655
  }
656
  });
657
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
658
  function save_file() {
659
  const form = document.getElementById('documentForm');
660
 
@@ -675,9 +636,9 @@ async function fetchUpdatedDocuments(company_id) {
675
  //const formData = new FormData();
676
  var formData = new FormData($('#documentForm')[0]);
677
  const vectorDBFlag = "NO"; // Example value
678
- const view = "<a href='#' class='btn btn-info btn-sm'><i class='fas fa-eye'></i></a>";
679
- const edit = "<a href='#' class='btn btn-warning btn-sm'><i class='fas fa-edit'></i></a>";
680
- const dele= "<a href='#' class='btn btn-danger btn-sm'><i class='fas fa-trash'></i></a>";
681
 
682
 
683
  formData.append("uploadFile", uploadFile);
@@ -697,11 +658,15 @@ console.log("formdata",formData);
697
  if (!response.ok) {
698
  throw new Error('Network response was not ok');
699
  }
700
- return response.text();
701
  })
702
  .then(data => {
 
703
  var table = $('#knowledgeTable').DataTable();
704
  var rowCount = table.rows().count();
 
 
 
705
  table.row.add([
706
  rowCount + 1,
707
  documentName,
@@ -718,7 +683,7 @@ console.log("formdata",formData);
718
  messageContainer.innerHTML = `
719
  <div class='alert alert-success'>
720
  Knowledgebase Data saved successfully
721
- <button class='close' onclick='dismissMessage()'>OK</button>
722
  </div>`;
723
  // alert('Document saved successfully');
724
  $('#addModal').modal('hide');
@@ -727,34 +692,12 @@ console.log("formdata",formData);
727
  .catch(error => console.error('Error:', error));
728
  }
729
  function dismissMessage() {
730
- const messageContainer = document.getElementById('message-container');
731
- if (messageContainer) {
732
- messageContainer.innerHTML = '';
733
- }
734
- }
735
- async function fetchCompanies() {
736
- try {
737
- const response = await fetch('/api/companies');
738
- if (!response.ok) {
739
- throw new Error('Network response was not ok');
740
- }
741
- const data = await response.json();
742
- displayCompanies(data.companies);
743
- } catch (error) {
744
- console.error('Error fetching companies:', error);
745
  }
746
  }
747
-
748
- function displayCompanies(companies) {
749
- const companySelect = document.getElementById('company');
750
- companySelect.innerHTML = '<option value="" selected>Select</option>'; // Reset the dropdown
751
- companies.forEach(company => {
752
- const option = document.createElement('option');
753
- option.value = company.name;
754
- option.textContent = company.name;
755
- companySelect.appendChild(option);
756
- });
757
- }
758
  </script>
759
  </body>
760
 
 
18
  <style>
19
  body {
20
  background-color: transparent !important;
21
+ }
22
+
23
+ .content-wrapper {
24
  flex: 1;
25
  overflow-y: auto;
26
  }
 
30
  flex-direction: column;
31
  height: 100vh;
32
  }
33
+
34
 
35
  .modal-content {
36
  background-color: #fff;
 
39
  .content-header {
40
  padding: 1rem;
41
  }
42
+
43
  h1 {
44
  text-align: center;
45
  margin-bottom: 30px;
 
65
  margin-right: 7.5px;
66
  }
67
 
68
+
69
  .text-wrap {
70
  white-space: normal !important;
71
  word-break: break-word;
72
  }
73
+
74
+ div.dataTables_wrapper div.dataTables_length select {
75
  width: 60px;
76
  display: inline-block;
77
  }
78
+
79
  th {
80
  white-space: nowrap;
81
  }
 
127
  /* Delete column */
128
  width: auto;
129
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
130
 
131
+ .alert {
132
+ position: relative;
133
+ padding: 15px;
134
+ margin-bottom: 20px;
135
+ border: 1px solid transparent;
136
+ border-radius: 4px;
137
+ }
138
+
139
+ .alert-success {
140
+ color: #3c763d;
141
+ background-color: #dff0d8;
142
+ border-color: #d6e9c6;
143
+ }
144
+
145
+ .alert-danger {
146
+ color: #a94442;
147
+ background-color: #f2dede;
148
+ border-color: #ebccd1;
149
+ }
150
+
151
+ .close {
152
+ position: absolute;
153
+ bottom: 10px;
154
+ right: 10px;
155
+ border: none;
156
+ background: none;
157
+ font-size: 16px;
158
+ cursor: pointer;
159
+ }
160
  </style>
161
  </head>
162
 
 
165
  <div class="wrapper">
166
  <div class="main-header" style="border-bottom: none;">
167
  <div class="container mt-2">
168
+ <div id="company-select" class="form-group left-align">
169
+ <!-- <label for="company" class="mr-1" style="margin-left:-40px; margin-top: 12px;">Company Name <span class="text-danger">*</span></label>
170
  <select type="text" id="company" name="company" class="form-control" style="width:20%;margin-left:-40px;"required>
171
  <option value="" selected>Select</option>
172
+ </select> -->
173
  <div class="col-12 d-flex justify-content-end mb-3">
174
+ <button class="btn btn-primary" style="margin-top:10px;margin-right: -10px;position: fixed;"
175
+ id="add" data-action="add">Add</button>
176
  </div>
177
  </div>
178
  </div>
179
  <div class="row">
180
  <div id="message-container" style="margin-left: 200px;width:600px;"></div>
181
  </div>
182
+ <h3 id="company_name" style="margin-left: 400px;">{{company_name}}</h3>
183
  <section class="content" id="contentSection" style="display: none;">
184
  <div class="container-fluid">
185
  <div>
 
187
  <!-- <label for="company_id">company_id</label>--->
188
  <input type="hidden" id="company_id" name="company_id" class="form-control" required>
189
  </div>
190
+ <h4 id="selectedCompany" style="margin-left: 300px;"></h4>
191
+ <div class="row" style="margin-top: 50px;">
192
  <div class="col-12">
193
  <div class="card">
194
  <div id="message-container">
 
196
  <table id="knowledgeTable" class="table table-bordered table-striped">
197
  <thead>
198
  <tr>
199
+
200
  <th>Sno</th>
201
  <th>Document Name</th>
202
  <th>Document Description</th>
 
205
  <th>View</th>
206
  <th>Edit</th>
207
  <th>Delete</th>
208
+ <!-- <th style="display:none;">Company ID</th> -->
209
  </tr>
210
  </thead>
211
  <tbody>
 
219
  </div>
220
  </section>
221
  </div>
222
+
223
  <div class="modal fade" id="addModal" tabindex="-1" role="dialog" aria-labelledby="addModalLabel"
224
  aria-hidden="true">
225
  <div class="modal-dialog" role="document">
226
  <div class="modal-content">
227
  <div class="modal-header">
228
  <h5 class="modal-title" id="addModalLabel">Add Document Details</h5>
229
+ <button type="button" class="btn-close" data-dismiss="modal">
230
  <span aria-hidden="true" data-backdrop="static" data-keyboard="false"></span>
231
  </button>
232
  </div>
 
270
  </div>
271
  <div class="modal-footer">
272
  <!-- <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> -->
273
+ <button type="button" id="saveupdate" class="btn btn-primary"
274
+ style="display: none;">Update</button>
275
  <button type="button" id="save" onclick="save_file()" class="btn btn-primary">Save</button>
276
  </div>
277
  </div>
 
279
  </div>
280
  </div>
281
 
282
+ {%include 'footer.html'%}
283
+ <script src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
284
+ <script src="https://cdn.datatables.net/1.10.25/js/dataTables.bootstrap4.min.js"></script>
285
+
286
+ <script>
287
+ var table = $('#knowledgeTable').DataTable();
288
+ const role = sessionStorage.getItem('userRole');
289
+ const company_name=sessionStorage.getItem('company_name');
290
+ console.log("company_name",company_name);
291
+ // document.getElementById('company_name').textContent = company_name;
292
+
293
+ document.addEventListener("DOMContentLoaded", function () {
294
  now = new Date().toISOString().replace('T', ' ').substr(0, 19);
295
  document.getElementById('lastUpdated').value = now;
296
  const inputs = document.querySelectorAll("#documentForm input, textarea");
 
297
  inputs.forEach((input, index) => {
298
  input.addEventListener("keydown", function (event) {
299
  if (event.key === "Enter") {
 
302
  }
303
  });
304
  });
305
+
306
+ const passedCompanyName=sessionStorage.getItem('company_name')
307
+ document.getElementById('selectedCompany').innerText = `Company name: ${passedCompanyName}`;
308
+ console.log('Current role:', role); // Debug statement to check the role
309
+ const company_id=sessionStorage.getItem('company_id');
310
+ document.getElementById("company_id").value=company_id;
311
+ console.log("inside knowledgebaae sessionstorage",company_id);
312
+ data_get_from_db(company_id);
313
+
314
+
315
+
316
+
317
+ const companySelect = document.getElementById('company');
318
+ const documentForm = document.getElementById('documentForm');
319
 
320
+
321
+ });
322
+ function moveToNextInput(inputs, currentIndex) {
323
+ const nextInput = inputs[currentIndex + 1];
324
+ if (nextInput) {
325
+ nextInput.focus();
326
+ } else {
327
+ // Optionally, submit the form or trigger the save button
328
+ document.getElementById("save").focus();
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
329
  }
 
 
 
 
330
  }
331
+
332
+ async function data_get_from_db(company_id) {
333
+ if (company_id) {
334
+ try {
335
+ const Response = await fetch(`/api/document_upload?company_id=${company_id}`);
336
+ console.log("responce from api :==> ", Response)
337
+ const connectorsResponse = await Response.json();
338
+ console.log("knowledge data table after connecting to table", connectorsResponse);
339
+ const table = $('#knowledgeTable').DataTable(); // Initialize DataTable at the start
340
+ table.clear();
341
+ if (!Array.isArray(connectorsResponse) || connectorsResponse.length === 0) {
342
  // displayEmptyTable();
343
+ displayErrorMessage("Document details do not exist for this company. Please fill in the details.");
 
344
  contentSection.style.display = 'none';
345
+ } else {
346
+ console.log('company data retrived succesfully ! .........')
347
+ connectorsResponse.forEach((company, index) => {
348
+ table.row.add([
349
+ index + 1,
350
+ company.document_name,
351
+ company.document_desc,
352
+ company.version,
353
+ company.vectorDBflag,
354
+ `<a href='#' class='btn btn-info btn-sm'data-kid-id='${company.row_id}' data-action="view" onclick='viewCompany(this)''><i class='fas fa-eye'></i></a>`,
355
+ `<a href='#' class='btn btn-warning btn-sm'data-kid-id='${company.row_id}' data-action="edit" onclick='editCompany(this)'><i class='fas fa-edit'></i></a>`,
356
+ `<a href='#' class='btn btn-danger btn-sm' data-kid-id='${company.row_id}' onclick='deleteCompany(this)'><i class='fas fa-trash'></i></a>`,
357
+ company.row_id
358
+ // "<a href='#' class='btn btn-info btn-sm'><i class='fas fa-eye'></i></a>",
359
+ // "<a href='#' class='btn btn-warning btn-sm'><i class='fas fa-edit'></i></a>",
360
+ // "<a href='#' class='btn btn-danger btn-sm'><i class='fas fa-trash'></i></button>"
361
+ ]).draw(false);
362
+ });
363
+ contentSection.style.display = 'block';
364
  }
365
+ } catch (error) {
366
+ console.error('Error fetching company documents:', error);
367
+ //displayEmptyTable();
368
+
369
+ displayErrorMessage("Document details1 do not exist for this company. Please fill in the details.");
370
+ contentSection.style.display = 'none';
371
  }
372
+ } else {
373
+ // displayEmptyTable();
374
 
375
+ displayErrorMessage("Details for knowledgebase do not exist for this company. Please fill in the details.");
376
+ }
377
+
378
+ }
379
+
380
  function displayErrorMessage(message) {
381
  const messageContainer = document.getElementById('message-container');
382
  if (messageContainer) {
383
  messageContainer.innerHTML = `<div class='alert alert-danger'>${message}</div>`;
384
  }
385
  }
386
+
387
+
388
 
389
  function clearFormFields() {
390
+ document.getElementById('file-name').textContent = ""
391
  document.getElementById('uploadFile').value = "";
392
  document.getElementById('documentName').value = "";
393
  document.getElementById('documentDescription').value = "";
394
  document.getElementById('department').value = "";
395
  document.getElementById('version').value = "";
396
+ // document.getElementById('lastUpdated').value = "";
397
  }
398
 
399
 
 
401
  // Show modal function
402
  $('#add').on('click', function () {
403
  $('#documentName').removeAttr('readonly');
404
+ $('#documentDescription').removeAttr('readonly');
405
+ $('#department').removeAttr('readonly');
406
+ $('#version').removeAttr('readonly');
407
+ $('#lastUpdated').removeAttr('readonly');
408
  const modalTitle = document.getElementById('addModalLabel');
409
+ modalTitle.textContent = 'Add Document Details';
410
+ $('#save').show();
411
  $('#uploadFile').show();
412
  $('#saveupdate').hide();
 
413
  clearFormFields();
414
  $('#message-container').empty(); // Clear the message container
415
  $('#addModal').modal('show');
416
  });
 
 
417
  $('.modal-footer .btn-secondary, .modal-header .btn-close').on('click', function () {
418
  $('#addModal').modal('hide');
419
  });
 
425
  function viewCompany(button) {
426
  var companyId = $(button).data('kid-id');
427
  const modalTitle = document.getElementById('addModalLabel');
428
+ modalTitle.textContent = 'View Document Details';
429
+ if(companyId)
430
+ {
431
  $.getJSON(`/api/getknowledgebase/${companyId}`, function (company) {
432
  $('#uploadFile').hide();
433
+ $('#file-name').text(company.file_path).attr('readonly', 'readonly');
434
  $('#documentName').val(company.document_name).attr('readonly', 'readonly');
435
  $('#documentDescription').val(company.document_desc).attr('readonly', 'readonly');
436
  $('#department').val(company.department).attr('readonly', 'readonly');
 
438
  //$('#lastUpdated').val(company.last_updated).attr('readonly', 'readonly');
439
  var lastUpdated = company.last_updated;
440
  $('#lastUpdated').val(lastUpdated).attr('readonly', 'readonly');
441
+ $('#save').hide();// Disable the "Save" button when the modal opens
 
442
  $('#addModal').modal('show');
443
  }).fail(function () {
444
+ alert("Error retrieving knowledge base check the sidepane working.");
445
  });
446
  }
447
+ }
448
 
449
  // Edit knowledge base details
450
+ function editCompany(button) {
451
+ var companyId = $(button).data('kid-id');
452
+
453
+ const modalTitle = document.getElementById('addModalLabel');
454
+ modalTitle.textContent = 'Edit Document Details';
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
455
 
456
+ // Fetch company details by ID
457
+ if(companyId)
458
+ {
459
+ $.getJSON(`/api/getknowledgebase/${companyId}`, function (company) {
460
+
461
+ const fileName = company.file_path.split('/').pop();
462
+ const fileContent = new Blob([""], { type: 'text/plain' });
463
+ const file = new File([fileContent], fileName, { type: fileContent.type });
464
+ const dataTransfer = new DataTransfer();
465
+ dataTransfer.items.add(file);
466
+
467
+ // Set the file input's files property to the created file
468
+ const fileInput = document.getElementById('uploadFile');
469
+ fileInput.files = dataTransfer.files;
470
+
471
+ // Check if the input element is of type 'file'
472
+ if (fileInput.type === 'file') {
473
+ console.log("The input is of type 'file'.");
474
+ } else {
475
+ console.log("The input is NOT of type 'file'.");
476
+ }
477
 
478
+ // Check if the value is of type 'File'
479
+ const files = fileInput.files;
480
+ if (files.length > 0 && files[0] instanceof File) {
481
+ console.log("The value is of type 'File':", files[0].name);
482
+ } else {
483
+ console.log("No file is selected or the value is not of type 'File'.");
484
+ }
485
+
486
+ $('#uploadFileLabel').text(files[0].name);
487
+ $('#uploadFile').text(files[0].name)
488
+ $('#documentName').val(company.document_name);
489
+ $('#documentDescription').val(company.document_desc);
490
+ $('#department').val(company.department);
491
+ $('#version').val(company.version);
492
+ $('#lastUpdated').val(company.last_updated).attr('readonly', 'readonly');
493
+ $('#company_id').val(company.company_id);
494
+
495
+ // Show/hide appropriate elements
496
+ $('#uploadFile').show(); // Hide the file upload field
497
+ $('#save').hide(); // Hide the default save button
498
+ $('#saveupdate').show(); // Show the update button
499
+
500
+ // Ensure fields are editable
501
+ $('#documentName').removeAttr('readonly');
502
+ $('#documentDescription').removeAttr('readonly');
503
+ $('#department').removeAttr('readonly');
504
+ $('#version').removeAttr('readonly');
505
+ // $('#lastUpdated').removeAttr('readonly');
506
+ $('#company_id').val(company.company_id); // Ensure company_id is included if necessary
507
+
508
+ // Show the modal
509
+ $('#addModal').modal('show');
510
+
511
+ // Set up the click event for the update button
512
+ $('#saveupdate').off('click').on('click', function () {
513
+ saveupdate(companyId, files[0].name); // Pass the company ID for updating
514
+ });
515
+ }).fail(function () {
516
+ alert("Error retrieving knowledge base error 2 details.");
517
+ });
518
  }
519
+ }
520
+
521
+ // Delete company
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
522
  function deleteCompany(button) {
523
  var companyId = $(button).data('kid-id');
524
+ console.log("k_id deleted", companyId);
525
  $.ajax({
526
  type: "DELETE",
527
  url: `/api/delknowledgebase/${companyId}`,
528
  success: function () {
529
  var table = $('#knowledgeTable').DataTable();
530
  table.row($(button).closest('tr')).remove().draw();
531
+
532
+ alert("Company deleted successfully.");
533
+ fetchCompanies(); // Refresh the table
534
+ },
535
+ error: function (xhr) {
536
+ alert("Error deleting company: " + xhr.responseJSON.detail);
537
+ }
538
+ });
539
+ }
540
+ function saveupdate(companyId, filename) {
541
+ const formData = new FormData();
542
+ const fileInput = document.getElementById("uploadFile");
543
+ const uploadFile = fileInput.files[0]; // Get the file object
544
+ const company_id = document.getElementById("company_id").value;
545
+ formData.append("company_id", $('#company_id').val());
546
+ formData.append("documentName", $('#documentName').val());
547
+ formData.append("documentDescription", $('#documentDescription').val());
548
+ formData.append("department", $('#department').val());
549
+ formData.append("version", $('#version').val());
550
+ formData.append("vectorDBFlag", 'NO');
551
+ formData.append("lastUpdated", $('#lastUpdated').val());
552
+ console.log("company_id to table refresh", company_id)
553
+ // Append the file only if it exists, otherwise, append the filename
554
+ if (uploadFile) {
555
+ formData.append("file_path", uploadFile); // Append the file object
556
+ } else {
557
+ formData.append("file_path", filename); // Append the existing filename
558
+ }
559
+
560
+ $.ajax({
561
+ url: `/api/putknowledgebase/${companyId}`,
562
+ type: 'PUT',
563
+ data: formData,
564
+ processData: false, // Required for FormData
565
+ contentType: false, // Required for FormData
566
+ success: function (response) {
567
+ // alert('Knowledgebase details updated successfully.');
568
  const messageContainer = document.getElementById('message-container');
569
+ if (messageContainer)
570
  messageContainer.innerHTML = `
571
+ <div class='alert alert-success'>
572
+ Data saved successfully
573
  <button class='close' onclick='dismissMessage()'>OK</button>
574
  </div>`;
575
+ $('#addModal').modal('hide'); // Close the modal after saving
576
+ fetchUpdatedDocuments(company_id);
577
  },
578
+ error: function () {
579
+ alert('Form has no changes to update knowledge base details.');
580
  }
581
  });
582
  }
583
+
584
+ async function fetchUpdatedDocuments(company_id) {
585
+ console.log("company_id", company_id);
586
+ var table = $('#knowledgeTable').DataTable();
587
+ const Response = await fetch(`/api/document_update?company_id=${company_id}`);
588
+ const connectorsResponse = await Response.json();
589
+ console.log("knowledge data table after connecting to table", connectorsResponse);
590
+ table.clear();
591
+ if (!Array.isArray(connectorsResponse) || connectorsResponse.length === 0) {
592
+ //displayEmptyTable();
593
+
594
+ displayErrorMessage("Document details do not exist for this company. Please fill in the details.");
595
+ contentSection.style.display = 'none';
596
+ } else {
597
+
598
+ connectorsResponse.forEach((company, index) => {
599
+ table.row.add([
600
+ index + 1,
601
+ company.document_name,
602
+ company.document_desc,
603
+ company.version,
604
+ company.vectorDBflag,
605
+ `<a href='#' class='btn btn-info btn-sm'data-kid-id='${company.row_id}' data-action="view" onclick='viewCompany(this)''><i class='fas fa-eye'></i></a>`,
606
+ `<a href='#' class='btn btn-warning btn-sm'data-kid-id='${company.row_id}' data-action="edit" onclick='editCompany(this)'><i class='fas fa-edit'></i></a>`,
607
+ //`<a href='#' class='btn btn-danger btn-sm' onclick='deleteCompany(${company.company_id})'><i class='fas fa-trash'></i></a>`,
608
+ `<a href='#' class='btn btn-danger btn-sm' data-kid-id='${company.row_id}' onclick='deleteCompany(this)'><i class='fas fa-trash'></i></a>`,
609
+ company.row_id
610
+ // "<a href='#' class='btn btn-info btn-sm'><i class='fas fa-eye'></i></a>",
611
+ // "<a href='#' class='btn btn-warning btn-sm'><i class='fas fa-edit'></i></a>",
612
+ // "<a href='#' class='btn btn-danger btn-sm'><i class='fas fa-trash'></i></button>"
613
+ ]).draw(false);
614
+ });
615
+ contentSection.style.display = 'block';
616
+ }
617
+ }
618
+
619
  function save_file() {
620
  const form = document.getElementById('documentForm');
621
 
 
636
  //const formData = new FormData();
637
  var formData = new FormData($('#documentForm')[0]);
638
  const vectorDBFlag = "NO"; // Example value
639
+ // const view = "<a href='#' class='btn btn-info btn-sm'><i class='fas fa-eye'></i></a>";
640
+ // const edit = "<a href='#' class='btn btn-warning btn-sm'><i class='fas fa-edit'></i></a>";
641
+ // const dele= "<a href='#' class='btn btn-danger btn-sm'><i class='fas fa-trash'></i></a>";
642
 
643
 
644
  formData.append("uploadFile", uploadFile);
 
658
  if (!response.ok) {
659
  throw new Error('Network response was not ok');
660
  }
661
+ return response.json();
662
  })
663
  .then(data => {
664
+ const row_id=data.row_id;
665
  var table = $('#knowledgeTable').DataTable();
666
  var rowCount = table.rows().count();
667
+ const view=`<a href='#' class='btn btn-info btn-sm'data-kid-id='${row_id}' data-action="view" onclick='viewCompany(this)''><i class='fas fa-eye'></i></a>`;
668
+ const edit=`<a href='#' class='btn btn-warning btn-sm'data-kid-id='${row_id}' data-action="edit" onclick='editCompany(this)'><i class='fas fa-edit'></i></a>`;
669
+ const dele= `<a href='#' class='btn btn-danger btn-sm' data-kid-id='${row_id}' onclick='deleteCompany(this)'><i class='fas fa-trash'></i></a>`;
670
  table.row.add([
671
  rowCount + 1,
672
  documentName,
 
683
  messageContainer.innerHTML = `
684
  <div class='alert alert-success'>
685
  Knowledgebase Data saved successfully
686
+ <button class='close' style='font-size:medium;margin-top:6px;' onclick='dismissMessage()'>OK</button>
687
  </div>`;
688
  // alert('Document saved successfully');
689
  $('#addModal').modal('hide');
 
692
  .catch(error => console.error('Error:', error));
693
  }
694
  function dismissMessage() {
695
+ const messageContainer = document.getElementById('message-container');
696
+ if (messageContainer) {
697
+ messageContainer.innerHTML = '';
 
 
 
 
 
 
 
 
 
 
 
 
698
  }
699
  }
700
+
 
 
 
 
 
 
 
 
 
 
701
  </script>
702
  </body>
703