tables with rewrite
This commit is contained in:
parent
cc3c35be6d
commit
a2acc7298c
@ -160,11 +160,18 @@ class MessageStyleSerializer(DynamicModelSerializer):
|
||||
)
|
||||
|
||||
|
||||
class UniqueContentRuleSerializer(DynamicModelSerializer):
|
||||
class Meta:
|
||||
model = UniqueContentRule
|
||||
fields = ("id", "name", "value")
|
||||
|
||||
|
||||
class SubscriptionSerializer(DynamicModelSerializer):
|
||||
filters = serializers.PrimaryKeyRelatedField(
|
||||
queryset=ContentFilter.objects.all(),
|
||||
many=True
|
||||
)
|
||||
# unique_rules = UniqueContentRuleSerializer(many=True) # TODO: solve? causes issues with submission.
|
||||
|
||||
class Meta:
|
||||
model = Subscription
|
||||
@ -178,7 +185,8 @@ class SubscriptionSerializer(DynamicModelSerializer):
|
||||
"extra_notes",
|
||||
"active",
|
||||
"filters",
|
||||
"message_style"
|
||||
"message_style",
|
||||
"unique_rules"
|
||||
)
|
||||
|
||||
def validate(self, data):
|
||||
@ -216,9 +224,3 @@ class ContentSerializer(DynamicModelSerializer):
|
||||
"item_title",
|
||||
"item_content_hash"
|
||||
)
|
||||
|
||||
|
||||
class UniqueContentRuleSerializer(DynamicModelSerializer):
|
||||
class Meta:
|
||||
model = UniqueContentRule
|
||||
fields = ("id", "name", "value")
|
||||
|
||||
@ -2,7 +2,9 @@ $(document).ready(async function() {
|
||||
// await initSubscriptionTable();
|
||||
// await initFiltersTable();
|
||||
// await initContentTable();
|
||||
|
||||
|
||||
initSubscriptionsModule();
|
||||
|
||||
await loadServers();
|
||||
$("#subscriptionsTab").click();
|
||||
});
|
||||
|
||||
49
apps/home/static/home/js/tables.js
Normal file
49
apps/home/static/home/js/tables.js
Normal file
@ -0,0 +1,49 @@
|
||||
|
||||
function initializeDataTable(tableId, apiUrl, columns) {
|
||||
$(tableId).DataTable({
|
||||
info: false,
|
||||
paging: false,
|
||||
ordering: 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 col-switch-width",
|
||||
render: function() {
|
||||
return '<input type="checkbox" class="form-check-input table-select-row" />'
|
||||
}
|
||||
},
|
||||
{ data: "id", visible: false },
|
||||
...columns
|
||||
]
|
||||
});
|
||||
}
|
||||
|
||||
function wipeTable(tableId) {
|
||||
$(`${tableId} thead .table-select-all`).prop("checked", false).prop("indeterminate", false);
|
||||
$(tableId).DataTable().clear().draw(false)
|
||||
}
|
||||
|
||||
function populateTable(tableId, data) {
|
||||
$(tableId).DataTable().rows.add(data.results).draw(false);
|
||||
}
|
||||
|
||||
async function loadData(tableId, loadFunc) {
|
||||
|
||||
}
|
||||
@ -0,0 +1,110 @@
|
||||
|
||||
const subTableId = "#subTable";
|
||||
|
||||
// #region Init Module
|
||||
|
||||
function initSubscriptionsModule() {
|
||||
initializeDataTable(
|
||||
"#subTable",
|
||||
null,
|
||||
[
|
||||
{
|
||||
title: "Name",
|
||||
data: "name",
|
||||
className: "text-truncate",
|
||||
render: function(data, type, row) {
|
||||
const name = sanitise(data);
|
||||
return `<button type="button" class="btn btn-link text-start text-decoration-none">${name}</button>`;
|
||||
}
|
||||
},
|
||||
{
|
||||
title: "URL",
|
||||
data: "url",
|
||||
className: "text-truncate",
|
||||
render: function(data, type) {
|
||||
const url = sanitise(data);
|
||||
return `<a href="${url}" class="btn btn-link text-start text-decoration-none" target="_blank">${url}</a>`;
|
||||
}
|
||||
},
|
||||
{
|
||||
title: "Rules",
|
||||
data: "unique_rules",
|
||||
className: "text-center text-nowrap",
|
||||
render: function(data, type) {
|
||||
let badges = $("<div>");
|
||||
data.forEach(function(rule, idx) {
|
||||
let badge = $(`<span class="badge text-bg-secondary">${rule.name}</span>`)
|
||||
if (idx > 0) { badge.addClass("ms-2") }
|
||||
badges.append(badge);
|
||||
});
|
||||
|
||||
return badges.html();
|
||||
}
|
||||
},
|
||||
{
|
||||
title: "Created At",
|
||||
data: "created_at",
|
||||
render: function(data, type) {
|
||||
let dateTime = new Date(data);
|
||||
return $(`
|
||||
<span data-bs-trigger="hover focus"
|
||||
data-bs-html="true"
|
||||
data-bs-custom-class="text-center"
|
||||
data-bs-toggle="popover"
|
||||
data-bs-content="${formatStringDate(dateTime, "%a, %D %B, %Y<br>%H:%M:%S")}">
|
||||
${formatStringDate(dateTime, "%D, %b %Y")}
|
||||
</span>
|
||||
`).popover()[0];
|
||||
}
|
||||
},
|
||||
{
|
||||
title: "Notes",
|
||||
data: "extra_notes",
|
||||
orderable: false,
|
||||
className: "text-center",
|
||||
render: function(data, type) {
|
||||
if (!data) { return "" }
|
||||
const extraNotes = sanitise(data);
|
||||
return $(`
|
||||
<i class="bi bi-chat-left-text"
|
||||
data-bs-trigger="hover focus"
|
||||
data-bs-toggle="popover"
|
||||
data-bs-title="Extra Notes"
|
||||
data-bs-content="${extraNotes}">
|
||||
</i>
|
||||
`).popover()[0];
|
||||
}
|
||||
},
|
||||
{
|
||||
title: "Active",
|
||||
data: "active",
|
||||
orderable: false,
|
||||
className: "text-center form-switch",
|
||||
render: function(data, type) {
|
||||
return `<input type="checkbox" class="sub-toggle-active form-check-input ms-0" ${data ? "checked" : ""} />`
|
||||
}
|
||||
}
|
||||
]
|
||||
);
|
||||
}
|
||||
|
||||
// #endregion
|
||||
|
||||
// #region Load Data
|
||||
|
||||
$(document).on("selectedServerChange", async function() {
|
||||
await loadSubscriptionData();
|
||||
});
|
||||
|
||||
async function loadSubscriptionData() {
|
||||
if (!selectedServer) {
|
||||
return;
|
||||
}
|
||||
|
||||
let data = await getSubscriptions(selectedServer.id);
|
||||
wipeTable(subTableId);
|
||||
populateTable(subTableId, data);
|
||||
}
|
||||
|
||||
// #endregion
|
||||
|
||||
@ -37,12 +37,12 @@
|
||||
<ul class="d-flex flex-lg-row flex-column list-unstyled text-center flex-nowrap mb-0 px-lg-4 px-2 align-items-center text-body-secondary">
|
||||
<li>
|
||||
<a href="https://gitea.cor.bz/corbz/PYRSS-Website" class="text-reset" target="_blank">
|
||||
<i class="bi bi-git fs-5"></i>
|
||||
<i class="bi bi-git fs-6"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="ms-lg-4 ms-0">
|
||||
<a href="https://gitea.cor.bz/corbz/PYRSS-Website/wiki" class="text-reset" target="_blank">
|
||||
<i class="bi bi-question-lg fs-5"></i>
|
||||
<i class="bi bi-question-lg fs-6"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="ms-3 d-none d-lg-inline">
|
||||
@ -181,6 +181,7 @@
|
||||
</script>
|
||||
<script src="{% static 'js/api.js' %}"></script>
|
||||
<script src="{% static 'home/js/index.js' %}"></script>
|
||||
<script src="{% static 'home/js/tables.js' %}"></script>
|
||||
<script src="{% static 'home/js/servers.js' %}"></script>
|
||||
<script src="{% static 'home/js/tabs/subs.js' %}"></script>
|
||||
<script src="{% static 'home/js/tabs/filters.js' %}"></script>
|
||||
|
||||
@ -180,13 +180,13 @@ async function getServers() {
|
||||
|
||||
// #region Subscriptions
|
||||
|
||||
async function getSubscriptions(filters, sort) {
|
||||
async function getSubscriptions(serverId, filters, sort) {
|
||||
let querystring = makeQuerystring(filters, sort);
|
||||
return await ajaxRequest(`/api/subscriptions/${querystring}`, "GET");
|
||||
return await ajaxRequest(`/api/servers/${serverId}/subscriptions/${querystring}`, "GET");
|
||||
}
|
||||
|
||||
async function getSubscription(serverId, subId) {
|
||||
return await ajaxRequest(`/api/${serverId}/subscriptions/${subId}/`, "GET");
|
||||
return await ajaxRequest(`/api/servers/${serverId}/subscriptions/${subId}/`, "GET");
|
||||
}
|
||||
|
||||
async function newSubscription(serverId, formData) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user