Pulls down issues for lists

app/assets/javascripts/boards/models/list.js.es6

@@ -4,16 +4,21 @@ class List {
     this.position = obj.position;
     this.title = obj.title;
     this.type = obj.list_type;
+    this.issues = [];
 
     if (obj.label) {
       this.label = new Label(obj.label);
     }
 
-    if (obj.issues) {
-      this.issues = [];
-      obj.issues.forEach((issue) => {
-        this.issues.push(new Issue(issue));
-      });
+    if (this.type !== 'blank') {
+      service.getIssuesForList(this.id)
+        .then((resp) => {
+          const data = resp.json();
+
+          data.forEach((issue) => {
+            this.issues.push(new Issue(issue));
+          });
+        });
     }
   }
 

app/assets/javascripts/boards/services/board_service.js.es6

@@ -4,6 +4,7 @@ class BoardService {
 
     this.lists = Vue.resource(`${root}{/id}.json`, {});
     this.list = Vue.resource(`${root}/lists{/id}.json`, {});
+    this.issues = Vue.resource(`${root}/lists{/id}/issues.json`, {});
   }
 
   setCSRF () {
@@ -40,4 +41,10 @@ class BoardService {
 
     return this.list.delete({ id });
   }
+
+  getIssuesForList (id) {
+    this.setCSRF();
+
+    return this.issues.get({ id });
+  }
 };

app/views/projects/boards/components/_card.html.haml

@@ -6,5 +6,5 @@
     %span.card-number
       = precede '#' do
         {{ issue.id }}
-    %span.label.color-label{ "v-for" => "label in issue.labels", ":style" => "{ backgroundColor: label.backgroundColor, color: label.textColor }" }
+    %span.label.color-label{ "v-for" => "label in issue.labels", ":style" => "{ backgroundColor: label.color, color: label.textColor }" }
       {{ label.title }}