bulma-templates/js/kanban.js at master · ITCSsDeveloper/bulma-templates · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
var App = new Vue({
  el: "#app",
  data() {
    return {
      search: "",
      title: "Game of Thrones",
      cards: [
        {
          name: "Season One",
          cardColor: "dark",
          items: [
            "winter is coming",
            "the kingsroad",
            "lord snow",
            "cripples, bastards and broken things",
            "the wolf and the lion",
            "a golden crown",
            "you win or you die",
            "the pointy end",
            "baelor",
            "fire and blood"
          ]
        },
        {
          name: "Season 2",
          cardColor: "info",
          items: [
            "the north remembers",
            "the night lands",
            "what is dead may never die",
            "garden of bones",
            "the ghost of harrenhal",
            "the old gods and the new",
            "a man without honor",
            "the prince of winterfell",
            "blackwater",
            "valar morghulis"
          ]
        },
        {
          name: "Season 3",
          cardColor: "primary",
          items: [
            "valar dohaeris ",
            "dark wings, dark words",
            "walk of punishment",
            "and now his watch is ended",
            "kissed by fire",
            "the climb",
            "the bear and the maiden fair",
            "second sons",
            "the rains of castamere",
            "mhysa"
          ]
        },
        {
          name: "Season 4",
          cardColor: "info",
          items: [
            "two swords",
            "the lion and the rose",
            "breaker of chains",
            "oathkeeper",
            "first of his name",
            "the laws of gods and men",
            "mockingbird",
            "the mountain and the viper",
            "the watchers on the wall",
            "the children"
          ]
        },
        {
          name: "Season 5",
          cardColor: "success",
          items: [
            "the wars to come",
            "the house of black and white",
            "high sparrow",
            "sons of the harpy",
            "kill the boy",
            "unbowed unbent unbroken",
            "the gift",
            "hardome",
            "the dance of dragons",
            "mother's mercy"
          ]
        },
        {
          name: "Season 6",
          cardColor: "warning",
          items: [
            "the red woman",
            "home",
            "oathbreaker",
            "book of the stranger ",
            "the door",
            "blood of my blood",
            "the broken man",
            "no one",
            "battle of the bastards",
            "the winds of winter"
          ]
        },
        {
          name: "Season 7",
          cardColor: "danger",
          items: [
            "dragonstone",
            "stormborn",
            "the queen's justice",
            "the spoils of war",
            "eastwatch",
            "beyond the wall",
            "the dragon and the wolf"
          ]
        },

             {
          name: "Season 8",
          cardColor: "info",
          items: [
            "winterfell",
            "a knight of the seven kingdoms",
            "the long night",
            "the last of the starks",
            "the bells",
            "the iron throne"
          ]
        }
      ]
    }
    },


  computed: {
    filteredCards() {
      var _this = this
      if(this.search.length === 0) return this.cards
      return this.cards.map(function(card) {
        return {
          name: card.name,
          cardColor: card.cardColor,
          items: card.items.filter(function (item) {
            return item.includes(_this.search)
          })
        }
      })
    }
  },

  methods: {
    removeCard (card) {
      this.cards.splice(this.cards.indexOf(card), 1)
    },
    clearSearchField () {
      this.search = ''
    }
  }
});