server tabs

tabs for
- subscriptions
- filters
- processed content
This commit is contained in:
Corban-Lee Jones 2024-04-30 01:12:47 +01:00
parent cfe7962f14
commit b57e520b4e
4 changed files with 113 additions and 13 deletions

View File

View File

@ -0,0 +1,61 @@
var filtersTable;
// Create subscription table
function initFiltersTable() {
filtersTable = $("#filtersTable").DataTable({
info: false,
paging: false,
searching: false,
autoWidth: false,
order: [],
select: {
style: "multi+shift",
selector: 'th:first-child input[type="checkbox"]'
},
columnDefs: [
{ orderable: false, targets: "no-sort" },
{
targets: 0,
checkboxes: { selectRow: true }
}
],
columns: [
{
// Select row checkbox column
title: '<input type="checkbox" class="form-check-input table-select-all" />',
data: null,
orderable: false,
className: "text-center",
render: function() {
return '<input type="checkbox" class="form-check-input table-select-row" />'
}
},
{ title: "ID", data: "id", visible: false },
{
title: "Name",
data: "name",
render: function(data, type, row) {
return `<a href="#" onclick="showEditFilterModal(${row.id})" class="text-decoration-none">${data}</a>`
}
},
{ title: "Regex", data: "regex" },
{ title: "Used", data: "used_count" },
{
title: "Created",
data: "creation_datetime",
render: function(data, type) {
return new Date(data).toISOString().split("T")[0];
}
},
{
title: "Active",
data: "active",
orderable: false,
className: "text-center form-switch",
render: function(data, type) {
return `<input type="checkbox" class="form-check-input ms-0" ${data ? "checked" : ""} />`
}
}
]
});
}

View File

@ -1,7 +1,15 @@
$(document).ready(async function() {
initSubscriptionTable();
initFiltersTable();
$("#subscriptionsTab").click();
await loadSavedGuilds();
await loadServerOptions();
// await loadChannelOptions();
});
$('#serverTabs [data-bs-toggle="tab"]').on("show.bs.tab", function(event) {
const activeTab = $(event.target);
$(".tab-pane-buttons .tab-pane-buttons-item").hide();
$(`.tab-pane-buttons .tab-pane-buttons-item[data-tab="${activeTab.attr("id")}"]`).show();
});

View File

@ -38,20 +38,49 @@
</div>
<div class="col-12">
<div class="d-flex px-3 pt-4 pb-2 justify-content-end">
<button type="button" id="tableAddRowBtn" class="btn btn-primary me-3">
<i class="bi bi-plus-lg"></i>
</button>
<button type="button" id="tableDeleteSelectedBtn" class="btn btn-danger" disabled>
<i class="bi bi-trash3"></i>
</button>
<!-- <button type="button" id="tableButton" class="btn btn-outline-primary">See Selected</button> -->
<div class="d-flex px-3 pt-4 pb-2">
<ul id="serverTabs" class="nav nav-pills me-auto" role="tablist">
<li class="nav-item" role="presentation">
<button id="subscriptionsTab" class="nav-link" data-bs-toggle="tab" data-bs-target="#subscriptionsTabPane" type="button" aria-controls="subscriptionsTabPane" aria-selected="false">Subscriptions</button>
</li>
<li class="nav-item" role="presentation">
<button id="filtersTab" class="nav-link" data-bs-toggle="tab" data-bs-target="#filtersTabPane" type="button" aria-controls="filtersTabPane" aria-selected="false">Content Filters</button>
</li>
<li class="nav-item" role="presentation">
<button id="contentTab" class="nav-link" data-bs-toggle="tab" data-bs-target="#contentTabPane" type="button" aria-controls="contentTabPane" aria-selected="false">Content</button>
</li>
</ul>
<div class="tab-pane-buttons">
<div class="tab-pane-buttons-item" data-tab="subscriptionsTab">
<button type="button" id="tableAddRowBtn" class="btn btn-primary me-3">
<i class="bi bi-plus-lg"></i>
</button>
<button type="button" id="tableDeleteSelectedBtn" class="btn btn-danger" disabled>
<i class="bi bi-trash3"></i>
</button>
<!-- <button type="button" id="tableButton" class="btn btn-outline-primary">See Selected</button> -->
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="table-responsive mt-3">
<table id="subTable" class="table table-hover align-middle"></table>
<div id="serverTabContent" class="tab-content">
<div id="subscriptionsTabPane" class="tab-pane fade" role="tabpanel" aria-labelledby="subscriptionsTab" tabindex="0">
<div class="table-responsive mt-3">
<table id="subTable" class="table table-hover align-middle"></table>
</div>
</div>
<div id="filtersTabPane" class="tab-pane fade" role="tabpanel" aria-labelledby="filtersTab" tabindex="0">
<div class="table-responsive mt-3">
<table id="filtersTable" class="table table-hover align-middle"></table>
</div>
</div>
<div id="contentTabPane" class="tab-pane fade" role="tabpanel" aria-labelledby="contentTab" tabindex="0">
<div class="table-responsive mt-3">
<table id="contentTable" class="table table-hover align-middle"></table>
</div>
</div>
</div>
</div>
</div>
@ -74,4 +103,6 @@
<script src="{% static 'js/home/index.js' %}"></script>
<script src="{% static 'js/home/servers.js' %}"></script>
<script src="{% static 'js/home/subscriptions.js' %}"></script>
{% endblock javascript %}
<script src="{% static 'js/home/filters.js' %}"></script>
<script src="{% static 'js/home/content.js' %}"></script>
{% endblock javascript %}