abstract modal funcs

apps/home/static/home/js/tables.js

@@ -335,3 +335,62 @@ function setTableControlsUsability(tableId, disabled) {
     const $search = $tableFilters.find(".disable-while-loading[type=search]");
     $search.data("was-focused") ? $search.focus() : null;
 }
+
+
+// region Modals
+
+
+async function openDataModal(modalId, pk, url) {
+    $modal = $(modalId);
+    $modal.data("primary-key", pk);
+
+    if (parseInt(pk) === -1) {
+        $modal.find(".form-create").show();
+        $modal.find(".form-edit").hide();
+        setDefaultModalData($modal);
+    }
+    else {
+        $modal.find(".form-create").hide();
+        $modal.find(".form-edit").show();
+        await loadModalData($modal, url);
+    }
+
+    $modal.modal("show");
+}
+
+function setDefaultModalData($modal) {
+    $modal.find("[data-field]").each(function() {
+        const type = $(this).attr("type");
+        const defaultVal = $(this).attr("data-default") || "";
+
+        if (type === "checkbox") {
+            $(this).prop("checked", defaultVal === "true");
+        }
+        else if (type === "datetime-local") {
+            $(this).val(getCurrentDateTime());
+        }
+        else {
+            $(this).val(defaultVal).change();
+        }
+    });
+}
+
+async function loadModalData($modal, url) {
+    const data = await ajaxRequest(url, "GET");
+
+    $modal.find("[data-field]").each(function() {
+        const key = $(this).attr("data-field");
+        const value = data[key];
+
+        if (typeof value === "boolean") {
+            $(this).prop("checked", value);
+        }
+        else if (isISODateTimeString(value)) {
+            console.log(value.split('+')[0].substring(0, 16));
+            $(this).val(value.split('+')[0].substring(0, 16));
+        }
+        else {
+            $(this).val(value).change();
+        }
+    });
+}

apps/home/static/home/js/tabs/subs.js

@@ -108,16 +108,17 @@ $(subTableId).on("change", ".sub-toggle-active", async function() {
 // region New/Edit Modal
 
 $(subTableId).closest('.js-tableBody').siblings('.js-tableFilters').on("click", ".table-new-btn", async function() {
-    await openSubModal(-1);
+    await openDataModal(subModalId, -1);
 });
 
 $(subTableId).on("click", ".edit-modal", async function() {
     let id = $(subTableId).DataTable().row($(this).closest("tr")).data().id;
-    await openSubModal(id)
+    await openDataModal(subModalId, id, `/api/subscriptions/${id}/`);
 })
 
 async function openSubModal(id) {
     $modal = $(subModalId);
+    $modal.find('input[data-role="is-id"]').val(id);
 
     if (parseInt(id) === -1) {
         $modal.find(".form-create").show();
@@ -152,6 +153,7 @@ async function openSubModal(id) {
                 $(this).prop("checked", value);
             }
             else if (isISODateTimeString(value)) {
+                console.log(value.split('+')[0].substring(0, 16));
                 $(this).val(value.split('+')[0].substring(0, 16));
             }
             else {
@@ -163,6 +165,54 @@ async function openSubModal(id) {
     $modal.modal("show");
 }
 
+$(subModalId).on("submit", async function(event) {
+    event.preventDefault();
+
+    if (!selectedServer) {
+        throw new Error("Cannot submit form while no server is selected");
+    }
+
+    let data = { server: selectedServer.id };
+
+    $(this).find("[data-field]").each(function() {
+        const type = $(this).attr("type");
+        const key = $(this).attr("data-field");
+        if (!key) {
+            return;
+        }
+
+        let value;
+        if (type === "checkbox") {
+            value = $(this).prop("checked");
+        }
+        else {
+            value = $(this).val();
+        }
+
+        data[key] = value;
+    });
+
+    const formData = objectToFormData(data);
+    const id = $(this).find('input[data-role="is-id"]').val();
+
+    if (parseInt(id) !== -1) {
+        ajaxRequest(`/api/subscriptions/${id}/`, "PATCH", formData)
+            .then(response => {
+                $(this).modal("hide");
+                $(subTableId).trigger("doDataLoad");
+            })
+            .catch(error => logError(error))
+    }
+    else {
+        ajaxRequest("/api/subscriptions/", "POST", formData)
+            .then(response => {
+                $(this).modal("hide");
+                $(subTableId).trigger("doDataLoad");
+            })
+            .catch(error => logError(error));
+    }
+});
+
 
 // region Load Modal Options
 
@@ -195,4 +245,24 @@ async function loadMessageStyleOptions() {
 
     // Re-enable input
     $input.prop("disabled", false);
-}
+}
+
+$(document).ready(async function() {
+    await loadUniqueRules();
+})
+
+async function loadUniqueRules() {
+    let $input = $(subModalId).find('[data-field="unique_rules"]');
+    $input.prop("disabled", true);
+
+    // Load new values
+    const data = await ajaxRequest("/api/unique-content-rules/", "GET");
+    data.results.forEach(style => {
+        $input.append($(
+            "<option>",
+            {text: style.name, value: style.id}
+        ));
+    });
+
+    $input.prop("disabled", false);
+}