Campaigns pagination

Author: alexhernandezord

src/view/adminhtml/templates/product/edit/productCampaigns.phtml

@@ -21,6 +21,12 @@ use Aplazame\Serializer\JsonSerializer;
 
     var articles = <?php echo json_encode(JsonSerializer::serializeValue($block->getArticles())) ?>;
 
+    var dateObj = new Date();
+    var currentDate = dateObj.toISOString();
+    var byEndDate = function (campaign) {
+        return (campaign.end_date > currentDate);
+    };
+
     function associateArticlesToCampaign(articles, campaignId) {
         apiRequest("POST", "/me/campaigns/" + campaignId + "/articles", articles, function() {});
     }
@@ -110,6 +116,7 @@ use Aplazame\Serializer\JsonSerializer;
     function apiRequest(method, path, data, callback) {
         new Ajax.Request(apiProxyEndpoint, {
             method: "POST",
+            asynchronous: false,
             parameters: {
                 method: method,
                 path: path,
@@ -123,23 +130,30 @@ use Aplazame\Serializer\JsonSerializer;
         });
     }
 
-    apiRequest("GET", "/me/campaigns", null, function(payload) {
-        var campaigns = payload.results;
-        var dateObj = new Date();
-        var currentDate = dateObj.toISOString();
-        var byEndDate = function (campaign) {
-            return (campaign.end_date > currentDate);
-        };
+    function getCampaigns(page = 1) {
+        apiRequest("GET", "/me/campaigns?page=" + page, null, function(payload) {
+            var campaigns = payload.results;
+
+            displayCampaigns(campaigns.filter(byEndDate));
 
-        campaigns = campaigns.filter(byEndDate);
+            if (payload.cursor.after != null) {
+                getCampaigns(payload.cursor.after);
+            }
+        });
+    }
 
-        apiRequest("GET", "/me/campaigns?articles-mid=" + articles[0].id, null, function(payload) {
+    function getCampaignsFromArticle(page = 1) {
+        apiRequest("GET", "/me/campaigns?articles-mid=" + articles[0].id + "&page=" + page, null, function(payload) {
             var selectedCampaigns = payload.results;
 
-            selectedCampaigns = selectedCampaigns.filter(byEndDate);
+            selectCampaigns(selectedCampaigns.filter(byEndDate));
 
-            displayCampaigns(campaigns);
-            selectCampaigns(selectedCampaigns);
+            if (payload.cursor.after != null) {
+                getCampaignsFromArticle(payload.cursor.after);
+            }
         });
-    });
+    }
+
+    getCampaigns();
+    getCampaignsFromArticle();
 </script>

src/view/adminhtml/templates/product/edit/productsCampaigns.phtml

@@ -26,6 +26,12 @@ use Aplazame\Serializer\JsonSerializer;
 
     var articles = <?php echo json_encode(JsonSerializer::serializeValue($block->getArticles())) ?>;
 
+    var dateObj = new Date();
+    var currentDate = dateObj.toISOString();
+    var byEndDate = function (campaign) {
+        return (campaign.end_date > currentDate);
+    };
+
     function associateArticlesToCampaign(articles, campaignId) {
         apiRequest("POST", "/me/campaigns/" + campaignId + "/articles", articles, function() {});
     }
@@ -118,6 +124,7 @@ use Aplazame\Serializer\JsonSerializer;
     function apiRequest(method, path, data, callback) {
         new Ajax.Request(apiProxyEndpoint, {
             method: "POST",
+            asynchronous: false,
             parameters: {
                 method: method,
                 path: path,
@@ -131,20 +138,21 @@ use Aplazame\Serializer\JsonSerializer;
         });
     }
 
-    require([
-        'prototype'
-    ], function () {
-        apiRequest("GET", "/me/campaigns", null, function(payload) {
+    function getCampaigns(page = 1) {
+        apiRequest("GET", "/me/campaigns?page=" + page, null, function(payload) {
             var campaigns = payload.results;
-            var dateObj = new Date();
-            var currentDate = dateObj.toISOString();
-            var byEndDate = function (campaign) {
-                return (campaign.end_date > currentDate);
-            };
 
-            campaigns = campaigns.filter(byEndDate);
+            displayCampaigns(campaigns.filter(byEndDate));
 
-            displayCampaigns(campaigns);
+            if (payload.cursor.after != null) {
+                getCampaigns(payload.cursor.after);
+            }
         });
+    }
+
+    require([
+        'prototype'
+    ], function () {
+        getCampaigns();
     });
 </script>