app.js

   1 var app = new Vue({
   2     el: '#app',
   3     data: {
   4         config: null,
   5         filter: ''
   6     },
   7     beforeCreate () {
   8         let that = this;
   9
  10         return getConfig().then(function (config) {
  11             console.log(config);
  12             const size = 3;
  13             config.services.forEach(function(service) {
  14                 service.rows = [];
  15                 items = service.items;
  16                 while (items.length) {
  17                     service.rows.push(items.splice(0, size));
  18                 }
  19
  20                 if (service.rows.length) {
  21                     let last = service.rows.length-1;
  22                     service.rows[last] = service.rows[last].concat(Array(size - service.rows[last].length));
  23                 }
  24             });
  25             that.config = config;
  26         }).catch(function () {
  27             console.error('Fail to get config');
  28         });
  29     }
  30 });
  31
  32
  33 function getConfig() {
  34     return fetch('config.yml').then(function(response) {
  35         if (response.status !== 200) {
  36             return;
  37         }
  38
  39         return response.text().then(function(body){
  40             return jsyaml.load(body);
  41         });
  42     });
  43 }