Spaces:
Sleeping
Sleeping
<html> | |
<head> | |
<title>Knowledge Base</title> | |
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> | |
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script> | |
<!-- Include AdminLTE CSS --> | |
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/adminlte.min.css"> | |
<!-- Include DataTables CSS --> | |
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.25/css/dataTables.bootstrap4.min.css"> | |
<!-- Include AdminLTE JS --> | |
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/adminlte.min.js"></script> | |
<!-- Include DataTables JS --> | |
<script src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script> | |
<script src="https://cdn.datatables.net/1.10.25/js/dataTables.bootstrap4.min.js"></script> | |
<style> | |
body { | |
background-color: transparent ; | |
} | |
.content-wrapper { | |
background-color: transparent ; | |
text-align: center; | |
} | |
.wrapper { | |
background-color: transparent ; | |
} | |
.modal-content { | |
background-color: #fff; | |
} | |
h1 { | |
text-align: center; | |
margin-bottom: 40px; | |
} | |
/* Adjust table width to full container width */ | |
.card-body { | |
padding: 0; | |
} | |
.table { | |
width: 100%; | |
} | |
</style> | |
</head> | |
<body> | |
{% include 'sidepane.html' %} | |
<div class="wrapper" style="position: relative; top: 0;"> | |
<!-- Content Wrapper. Contains page content --> | |
<div class="content-wrapper"> | |
<!-- Content Header (Page header) --> | |
<div class="content-header"> | |
<div class="container-fluid"> | |
<div class="row mb-2"> | |
<div class="col-12 d-flex justify-content-between align-items-center"> | |
<h1 class="m-0 text-center" style="flex-grow: 1;">Knowledge Base</h1> | |
<button class="btn btn-primary" id="add">Add</button> | |
</div> | |
</div> | |
</div> | |
</div> | |
<!-- Main content --> | |
<section class="content"> | |
<div class="container-fluid"> | |
<div class="row"> | |
<div class="col-12"> | |
<div class="card"> | |
<div class="card-body"> | |
<div class="table-responsive"> | |
<table id="knowledgeTable" class="table table-bordered table-striped"> | |
<thead> | |
<tr> | |
<th>Sno</th> | |
<th>Document Name</th> | |
<th>Document Description</th> | |
<th>Document Version</th> | |
<th>VectorDB Flag</th> | |
<th>View</th> | |
</tr> | |
</thead> | |
<tbody> | |
<tr> | |
<td>1</td> | |
<td>NewAge eWMS BusinessRequirementsDocument_V1.9 - Inbound</td> | |
<td>GRN Inbound</td> | |
<td>1.9</td> | |
<td>Yes</td> | |
<td> | |
<button class="btn btn-primary viewButton">View</button> | |
</td> | |
</tr> | |
<tr> | |
<td>2</td> | |
<td>NewAge eWMS BusinessRequirementsDocument_V2.3 - Inbound</td> | |
<td>GRN Inbound</td> | |
<td>2.3</td> | |
<td>No</td> | |
<td> | |
<button class="btn btn-primary viewButton">View</button> | |
</td> | |
</tr> | |
<tr> | |
<td>3</td> | |
<td>NewAge eWMS BusinessRequirementsDocument_V1.9 - Outbound</td> | |
<td>GRN Outbound</td> | |
<td>1.9</td> | |
<td>Yes</td> | |
<td> | |
<button class="btn btn-primary viewButton">View</button> | |
</td> | |
</tr> | |
<tr> | |
<td>4</td> | |
<td>NewAge eWMS BusinessRequirementsDocument_V2.2 - Outboundbound</td> | |
<td>ASN Outbound</td> | |
<td>2.2</td> | |
<td>No</td> | |
<td> | |
<button class="btn btn-primary viewButton">View</button> | |
</td> | |
</tr> | |
</tbody> | |
</table> | |
</div> | |
</div> | |
</div> | |
</div> | |
</div> | |
</div> | |
</section> | |
<!-- /.content --> | |
</div> | |
<!-- /.content-wrapper --> | |
<!-- Modal --> | |
<div class="modal fade" id="addModal" tabindex="-1" role="dialog" aria-labelledby="addModalLabel" aria-hidden="true"> | |
<div class="modal-dialog" role="document"> | |
<div class="modal-content"> | |
<div class="modal-header"> | |
<h5 class="modal-title" id="addModalLabel">Add Document</h5> | |
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> | |
<span aria-hidden="true">×</span> | |
</button> | |
</div> | |
<div class="modal-body"> | |
<form id="myForm"> | |
<div class="form-group"> | |
<label for="file">Upload File</label> | |
<input type="file" class="form-control-file" id="file" name="file" accept=".pdf,.doc,.docx"> | |
</div> | |
<div class="form-group"> | |
<label for="document_name">Document Name</label> | |
<input type="text" class="form-control" id="document_name" name="document_name" required> | |
</div> | |
<div class="form-group"> | |
<label for="document_description">Document Description</label> | |
<textarea class="form-control" id="document_description" name="document_description" rows="3" required></textarea> | |
</div> | |
<div class="form-group"> | |
<label for="department">Department</label> | |
<input type="text" class="form-control" id="department" name="department" required> | |
</div> | |
<div class="form-group"> | |
<label for="version">Version</label> | |
<input type="text" class="form-control" id="version" name="version" required> | |
</div> | |
<div class="form-group"> | |
<label for="last_updated">Last Updated</label> | |
<input type="text" class="form-control" id="last_updated" name="last_updated" required> | |
</div> | |
</div> | |
<div class="modal-footer"> | |
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> | |
<button type="button" id="save" onclick="save_file()" class="btn btn-primary">Save</button> | |
</div> | |
</form> | |
</div> | |
</div> | |
</div> | |
</div> | |
<!-- ./wrapper --> | |
<!-- Footer --> | |
{% include 'footer.html' %} | |
<!-- End footer --> | |
<!-- JavaScript to handle modal display --> | |
<script> | |
$(document).ready(function() { | |
// Show modal function | |
$('#add').on('click', function() { | |
$('#addModal').modal('show'); | |
}); | |
$('.modal-footer .btn-secondary').on('click', function() { | |
$('#addModal').modal('hide'); | |
}); | |
}); | |
// Your save file function here | |
function save_file() { | |
alert('Save button clicked'); | |
// Call the API with the user's question and get the response | |
var xhr = new XMLHttpRequest(); | |
var myForm = document.getElementById('myForm'); | |
var formData = new FormData(myForm); | |
alert('Save button'); | |
xhr.open("POST", "/upload_file", true); | |
xhr.send(formData); | |
alert('sent'); | |
xhr.onreadystatechange = function() { | |
if (xhr.readyState === XMLHttpRequest.DONE) { | |
if (xhr.status === 200) { | |
// Successfully received a response | |
//alert(xhr.responseText); | |
console.log(xhr.responseText); | |
// Append the user's question and the response to the chat history | |
} else { | |
// There was a problem with the request | |
alert('There was a problem with the request.'); | |
console.error('Error:', xhr.statusText); | |
} | |
} | |
}; | |
} | |
</script> | |
</body> | |
</html> | |