Spaces:
Runtime error
Runtime error
<html> | |
<head> | |
<title>API Connectors</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"> | |
<style> | |
.header-row { | |
display: flex; | |
justify-content: space-between; | |
align-items: center; | |
} | |
h2 { | |
text-align: center; | |
} | |
.table-container { | |
width: 100%; | |
overflow-x: auto; | |
} | |
.wrapper { | |
display: flex; | |
flex-direction: column; | |
height: 100vh; | |
} | |
.content-wrapper { | |
flex: 1; | |
overflow-y: auto; | |
} | |
.content-header { | |
padding: 1rem; | |
} | |
.footer { | |
text-align: right; | |
padding: 10px; | |
} | |
th, | |
td { | |
white-space: nowrap; | |
} | |
th:nth-child(1), | |
td:nth-child(1) { | |
/* Sno column */ | |
width: 5%; | |
} | |
th:nth-child(2), | |
td:nth-child(2) { | |
/* API Name column */ | |
width: 20%; | |
} | |
th:nth-child(3), | |
td:nth-child(3) { | |
/* API Endpoint column */ | |
width: 40%; | |
} | |
th:nth-child(4), | |
td:nth-child(4) { | |
/* Auth/Bearer token column */ | |
width: 20%; | |
} | |
th:nth-child(5), | |
td:nth-child(5) { | |
/* View column */ | |
width: 15%; | |
} | |
</style> | |
</head> | |
<body> | |
{% include 'sidepane.html' %} | |
<div class="wrapper"> | |
<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"> | |
<div class="header-row"> | |
<h2 class="m-0 text-center" style="flex-grow: 1;">API Connectors</h2> | |
<button class="btn btn-primary" id="add">Add</button> | |
</div> | |
</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 table-container"> | |
<table id="knowledgeTable" class="table table-bordered table-striped"> | |
<thead> | |
<tr> | |
<th>Sno</th> | |
<th>API Name</th> | |
<th>API Endpoint</th> | |
<th>View</th> | |
</tr> | |
</thead> | |
<tbody> | |
<tr> | |
<td>1</td> | |
<td>Warehouse</td> | |
<td>http://193.203.162.39:9090/nxt-wms/userWarehouse/fetchWarehouseForUserId | |
</td> | |
<td><button class="btn btn-primary viewButton">View</button></td> | |
</tr> | |
<tr> | |
<td>2</td> | |
<td>customer</td> | |
<td>http://193.203.162.39:9090/nxt-wms/userCustomer/fetchCustomerForUserId | |
</td> | |
<td><button class="btn btn-primary viewButton">View</button></td> | |
</tr> | |
<tr> | |
<td>3</td> | |
<td>SKU</td> | |
<td>http://193.203.162.39:9090/nxt-wms/sku/autoComplete?</td> | |
<td><button class="btn btn-primary viewButton">View</button></td> | |
</tr> | |
<tr> | |
<td>4</td> | |
<td>ASN</td> | |
<td>http://193.203.162.39:9090/nxt-wms/trnHeader</td> | |
<td><button class="btn btn-primary viewButton">View</button></td> | |
</tr> | |
</tbody> | |
</table> | |
</div> | |
</div> | |
</div> | |
</div> | |
</div> | |
</section> | |
</div> | |
</div> | |
<!-- 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> | |
<div class="form-group"> | |
<label for="APIName">API Name <span class="text-danger">*</span></label> | |
<input type="text" class="form-control" id="APIName" name="APIName" required> | |
</div> | |
<div class="form-group"> | |
<label for="APIEndpoint">API Endpoint <span class="text-danger">*</span></label> | |
<input type="text" class="form-control" id="APIEndpoint" name="APIEndpoint" required> | |
</div> | |
<div class="form-group"> | |
<label for="Auth_Bearer">Auth/Bearer token <span class="text-danger">*</span></label> | |
<input type="text" class="form-control" id="Auth_Bearer" name="Auth_Bearer" required> | |
</div> | |
<div class="form-group"> | |
<label for="Inputjson">Input parameter <span class="text-danger">*</span></label> | |
<input type="text" class="form-control" id="Inputjson" name="Inputjson" required> | |
</div> | |
<div class="form-group"> | |
<label for="OutputJson">Output Json <span class="text-danger">*</span></label> | |
<input type="text" class="form-control" id="OutputJson" name="OutputJson" required> | |
</div> | |
<div class="form-group"> | |
<label for="Description">Description <span class="text-danger">*</span></label> | |
<textarea class="form-control" id="Description" name="Description" rows="3" | |
required></textarea> | |
</div> | |
</form> | |
</div> | |
<div class="modal-footer"> | |
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> | |
<button type="button" id="save" onclick="save_file()" class="btn btn-primary">Save</button> | |
</div> | |
</div> | |
</div> | |
</div> | |
<!-- Include DataTables JS and your custom script --> | |
<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> | |
<script> | |
$(document).ready(function () { | |
// Initialize DataTable | |
$('#knowledgeTable').DataTable(); | |
// Show modal function | |
$('#add').on('click', function () { | |
$('#addModal').modal('show'); | |
}); | |
// Your save file function here | |
async function save_file() { | |
alert('Save button clicked'); | |
// Your save file logic goes here | |
} | |
}); | |
</script> | |
</body> | |
</html> |