From a2acc7298c69bcc39395e5a7b5b89f4ca9b237b4 Mon Sep 17 00:00:00 2001 From: Corban-Lee Date: Wed, 25 Sep 2024 17:20:33 +0100 Subject: [PATCH] tables with rewrite --- apps/api/serializers.py | 16 ++-- apps/home/static/home/js/index.js | 4 +- apps/home/static/home/js/tables.js | 49 ++++++++++++ apps/home/static/home/js/tabs/subs.js | 110 ++++++++++++++++++++++++++ apps/home/templates/home/index.html | 5 +- static/js/api.js | 6 +- 6 files changed, 177 insertions(+), 13 deletions(-) create mode 100644 apps/home/static/home/js/tables.js diff --git a/apps/api/serializers.py b/apps/api/serializers.py index 8cd0db1..20a5ef0 100644 --- a/apps/api/serializers.py +++ b/apps/api/serializers.py @@ -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") diff --git a/apps/home/static/home/js/index.js b/apps/home/static/home/js/index.js index ba0b836..53651ba 100644 --- a/apps/home/static/home/js/index.js +++ b/apps/home/static/home/js/index.js @@ -2,7 +2,9 @@ $(document).ready(async function() { // await initSubscriptionTable(); // await initFiltersTable(); // await initContentTable(); - + + initSubscriptionsModule(); + await loadServers(); $("#subscriptionsTab").click(); }); diff --git a/apps/home/static/home/js/tables.js b/apps/home/static/home/js/tables.js new file mode 100644 index 0000000..be9e3b9 --- /dev/null +++ b/apps/home/static/home/js/tables.js @@ -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: '', + data: null, + orderable: false, + className: "text-center col-switch-width", + render: function() { + return '' + } + }, + { 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) { + +} diff --git a/apps/home/static/home/js/tabs/subs.js b/apps/home/static/home/js/tabs/subs.js index e69de29..9fa79d7 100644 --- a/apps/home/static/home/js/tabs/subs.js +++ b/apps/home/static/home/js/tabs/subs.js @@ -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 ``; + } + }, + { + title: "URL", + data: "url", + className: "text-truncate", + render: function(data, type) { + const url = sanitise(data); + return `${url}`; + } + }, + { + title: "Rules", + data: "unique_rules", + className: "text-center text-nowrap", + render: function(data, type) { + let badges = $("
"); + data.forEach(function(rule, idx) { + let badge = $(`${rule.name}`) + 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 $(` + %H:%M:%S")}"> + ${formatStringDate(dateTime, "%D, %b %Y")} + + `).popover()[0]; + } + }, + { + title: "Notes", + data: "extra_notes", + orderable: false, + className: "text-center", + render: function(data, type) { + if (!data) { return "" } + const extraNotes = sanitise(data); + return $(` + + + `).popover()[0]; + } + }, + { + title: "Active", + data: "active", + orderable: false, + className: "text-center form-switch", + render: function(data, type) { + return `` + } + } + ] + ); +} + +// #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 + diff --git a/apps/home/templates/home/index.html b/apps/home/templates/home/index.html index 6725026..df02726 100644 --- a/apps/home/templates/home/index.html +++ b/apps/home/templates/home/index.html @@ -37,12 +37,12 @@