RedMindGPT_UI_Dev / templates /sidepane.html
Redmind's picture
Upload 55 files
294253d verified
raw
history blame
8.18 kB
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>RedMindGPT - Dashboard</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<link rel="stylesheet" href="/static/css/sidepane.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-white shadow-sm" style="padding: 15px; z-index: 20;">
<div class="container-fluid d-flex justify-content-between align-items-center">
<button class="navbar-toggler" type="button" onclick="toggleSidebar()">
<span class="navbar-toggler-icon"></span>
</button>
<div class="d-flex align-items-center">
<img class="logo" src="/static/img/redmindlogo3.jpg" alt="Logo"
style="width: 70px; height: auto; margin-right: 15px;">
<h3 class="title" style="font-weight: 500;text-align: center;"> <span id="title">RedMind</span>
Dashboard</h3>
</div>
<div class="justify-content-end" id="navbarNav">
<div class="nav-btn d-flex align-items-center">
<button class="btn btn-primary mr-2" id="add" onclick="addCompany()">Add</button>
<button class="btn btn-danger" id="logout" onclick="logout()">Logout</button>
</div>
</div>
</div>
</nav>
<aside class="main-sidebar" style="z-index: 10;">
<div class="sidebar-header">
<i class="nav-icon fas fa-building"></i>
<span class="menu-text" id="selectedCompany">Select a company</span>
</div>
<nav class="mt-2">
<ul class="nav nav-pills nav-sidebar flex-column">
<li class="nav-item">
<a href="{{url_for('dashboard')}}" class="nav-link">
<i class="nav-icon fas fa-home"></i>
<p class="menu-text">Dashboard</p>
</a>
</li>
<li class="nav-item">
<a href="{{ url_for('company_profile') }}" class="nav-link">
<i class="nav-icon fas fa-users"></i>
<p class="menu-text">Company Profile</p>
</a>
</li>
<li class="nav-item">
<a href="{{ url_for('knowledgebase') }}" class="nav-link">
<i class="nav-icon fas fa-book"></i>
<p class="menu-text">KnowledgeBase</p>
</a>
</li>
<li class="nav-item">
<a href="{{ url_for('data_connectors') }}" class="nav-link">
<i class="nav-icon fas fa-plug"></i>
<p class="menu-text">Data Connectors</p>
</a>
</li>
<li class="nav-item">
<a href="{{ url_for('API_connectors') }}" class="nav-link">
<i class="nav-icon fas fa-cogs"></i>
<p class="menu-text">API Connectors</p>
</a>
</li>
<li class="nav-item">
<a href="{{ url_for('prompt_template') }}" class="nav-link">
<i class="nav-icon fas fa-pencil-alt"></i>
<p class="menu-text">Prompt Templates</p>
</a>
</li>
</ul>
</nav>
</aside>
<!-- Section to toggle -->
<div class="container pt-3" id="addnewcompany">
<div class="toggle-section" id="companySection">
<h4>Add a New Company</h4>
<form>
<div class="form-group">
<label for="companyName">Company Name:</label>
<input type="text" class="form-control" id="companyName" placeholder="Enter company name" >
</div>
<button type="submit" class="btn btn-success">Submit</button>
</form>
</div>
</div>
<script>
function logout() {
sessionStorage.removeItem('role');
sessionStorage.clear();
window.location.href = '/';
}
function toggleSidebar() {
const sidebar = document.querySelector('.main-sidebar');
if (sidebar) {
const isSidebarVisible = getComputedStyle(sidebar).display !== 'none';
sidebar.style.display = isSidebarVisible ? 'none' : 'block';
}
}
function addCompany() {
const section = document.getElementById("companySection");
// Toggle display style of the company section
if (section.style.display === "none" || section.style.display === "") {
section.style.display = "block"; // Show the section
} else {
section.style.display = "none"; // Hide the section
}
}
document.addEventListener("DOMContentLoaded", function () {
const companyId = document.getElementById("company_id") ? document.getElementById("company_id").value : null;
const role = document.getElementById("userRole") ? document.getElementById("userRole").value : null;
if (companyId) {
sessionStorage.setItem('sidecompanyId1', companyId);
}
if (role) {
sessionStorage.setItem('siderole1', role);
if (role === 'admin') {
editCompany(companyId, role);
updateLinkVisibility(role);
}
}
});
async function updateLinkVisibility(role) {
if (role === 'admin') {
const displayState = JSON.parse(sessionStorage.getItem('displayState'));
document.getElementById('api_connectors_link').style.display = displayState.apiConnectors;
document.getElementById('knowledgebase_link').style.display = displayState.knowledgeBase;
document.getElementById('data_connectors_link').style.display = displayState.dataConnectors;
}
}
async function editCompany(companyId, role) {
$.getJSON(`/api/getcompanydetails/${companyId}`, function (company) {
$('#llm_tools').val(company.llm_tools.split(',')).trigger('change');
const llmTools = $('#llm_tools').val();
if (llmTools && llmTools.length > 0) {
document.getElementById('api_connectors_link').style.display = llmTools.includes('API') ? 'block' : 'none';
document.getElementById('knowledgebase_link').style.display = llmTools.includes('Static Documents') ? 'block' : 'none';
document.getElementById('data_connectors_link').style.display = llmTools.includes('Database') ? 'block' : 'none';
sessionStorage.setItem('displayState', JSON.stringify({
apiConnectors: document.getElementById('api_connectors_link').style.display,
knowledgeBase: document.getElementById('knowledgebase_link').style.display,
dataConnectors: document.getElementById('data_connectors_link').style.display
}));
updateLinkVisibility(role);
}
}).fail(function () {
console.error("Error retrieving company details.");
});
}
</script>
</body>
</html>