vuejs first REST query (wip)

2021-02-26 13:44:38 +01:00 · 2021-02-26 13:44:38 +01:00 · 0e71eb75af
parent b96fd655dc
commit 0e71eb75af
6 changed files with 383 additions and 44 deletions
--- a/app/assets/components/App.vue
+++ b/app/assets/components/App.vue
@ -1,18 +1,25 @@
 <template>
-    <div class="card">
-        <div class="card-header">
-            <h4>
-                Hello {{ name }}
-            </h4>
-        </div>
-        <div class="card-body">
-        </div>
-    </div>
+   <div id="app">
+      <!-- la balise contacts corresponds au composant contacts passé ci-dessous -->
+      <contacts></contacts>
+   </div>
 </template>

 <script>
-    export default {
-        props: ['name']
-    }
-    console.log(app);
+   //  importe dans contacts les datas d'une requête rest GET en json
+   import contacts from './test1/Contacts.vue'
+
+   export default {
+      name: 'app',
+      components: {
+         // passe l'objet contacts comme composant
+         contacts,
+      }
+   }
 </script>
+
+<style>
+   #app {}
+   .container {}
+   .componentItem{}
+</style>
--- a/app/assets/components/test1/Contacts.vue
+++ b/app/assets/components/test1/Contacts.vue
@ -0,0 +1,57 @@
+<template>
+   <div>
+      <table>
+         <tr v-for="contact in contacts">
+            <td>{{contact.firstname}}</td>
+            <td>{{contact.lastname}}</td>
+         </tr>
+      </table>
+      <button @click="addContact">Add</button>
+      <label>#contacts {{counter}}</label>
+   </div>
+</template>
+
+<script> // la balise script dans ce fichier vue, est un peu comme une classe Contacts
+         // namespace test1/Contacts
+   import Vue from 'vue'
+   import VueResource from 'vue-resource'
+
+   // injection de dépendance pour dealer du REST json
+   Vue.use(VueResource)
+
+   export default{
+   // initialise les données
+      data () {
+         return { // constructeur du tableau-objet vide 'contacts' qui est passé à App.vue
+            contacts: []
+         }
+      },
+      // Rest GET json
+      http: {
+         root: 'http://localhost:3000'
+      },
+      // méthodes
+      methods: {
+         addContact(){
+            this.contacts.push({"firstname":"Lisa", "lastname":"Simpson", "age":"10"})
+         }
+      },
+      // traitements
+      computed:{
+         counter(){
+            return this.contacts.length
+         }
+      },
+      // on dirait un setter
+      mounted() {
+         this.$resource('contacts').get().then((response) => {
+            this.contacts = response.data
+         }, (response) => {
+            console.log('erreur', response);
+         })
+      }
+   }
+</script>
+
+<style>
+</style>
--- a/app/assets/vue.js
+++ b/app/assets/vue.js
@ -2,11 +2,6 @@ import Vue from 'vue'
 import App from './components/App.vue'

 new Vue({
-    render(h) {
-        return h(App, {
-            props: {
-                name: this.$el.getAttribute('data-name'),
-            },
-        })
-    },
-}).$mount('#app');
+   el: '#app',
+   render: h => h(App)
+})
--- a/app/composer.lock
+++ b/app/composer.lock
@ -1619,24 +1619,26 @@
        },
        {
            "name": "laminas/laminas-zendframework-bridge",
-            "version": "1.1.1",
+            "version": "1.2.0",
            "source": {
                "type": "git",
                "url": "https://github.com/laminas/laminas-zendframework-bridge.git",
-                "reference": "6ede70583e101030bcace4dcddd648f760ddf642"
+                "reference": "6cccbddfcfc742eb02158d6137ca5687d92cee32"
            },
            "dist": {
                "type": "zip",
-                "url": "https://api.github.com/repos/laminas/laminas-zendframework-bridge/zipball/6ede70583e101030bcace4dcddd648f760ddf642",
-                "reference": "6ede70583e101030bcace4dcddd648f760ddf642",
+                "url": "https://api.github.com/repos/laminas/laminas-zendframework-bridge/zipball/6cccbddfcfc742eb02158d6137ca5687d92cee32",
+                "reference": "6cccbddfcfc742eb02158d6137ca5687d92cee32",
                "shasum": ""
            },
            "require": {
-                "php": "^5.6 || ^7.0 || ^8.0"
+                "php": "^7.3 || ^8.0"
            },
            "require-dev": {
                "phpunit/phpunit": "^5.7 || ^6.5 || ^7.5 || ^8.1 || ^9.3",
-                "squizlabs/php_codesniffer": "^3.5"
+                "psalm/plugin-phpunit": "^0.15.1",
+                "squizlabs/php_codesniffer": "^3.5",
+                "vimeo/psalm": "^4.6"
            },
            "type": "library",
            "extra": {
@ -1675,7 +1677,7 @@
                    "type": "community_bridge"
                }
            ],
-            "time": "2020-09-14T14:23:00+00:00"
+            "time": "2021-02-25T21:54:58+00:00"
        },
        {
            "name": "nikic/php-parser",
--- a/app/package-lock.json
+++ b/app/package-lock.json
@ -1073,6 +1073,11 @@
                }
            }
        },
+        "@sindresorhus/is": {
+            "version": "0.7.0",
+            "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-0.7.0.tgz",
+            "integrity": "sha512-ONhaKPIufzzrlNbqtWFFd+jlnemX6lJAgq9ZeiZtS7I1PIf/la7CW4m83rTXRnVnsMbW2k56pGYu7AUFJD9Pow=="
+        },
        "@stimulus/core": {
            "version": "2.0.0",
            "resolved": "https://registry.npmjs.org/@stimulus/core/-/core-2.0.0.tgz",
@ -1957,6 +1962,42 @@
                }
            }
        },
+        "cacheable-request": {
+            "version": "2.1.4",
+            "resolved": "https://registry.npmjs.org/cacheable-request/-/cacheable-request-2.1.4.tgz",
+            "integrity": "sha1-DYCIAbY0KtM8kd+dC0TcCbkeXD0=",
+            "requires": {
+                "clone-response": "1.0.2",
+                "get-stream": "3.0.0",
+                "http-cache-semantics": "3.8.1",
+                "keyv": "3.0.0",
+                "lowercase-keys": "1.0.0",
+                "normalize-url": "2.0.1",
+                "responselike": "1.0.2"
+            },
+            "dependencies": {
+                "get-stream": {
+                    "version": "3.0.0",
+                    "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
+                    "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
+                },
+                "lowercase-keys": {
+                    "version": "1.0.0",
+                    "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz",
+                    "integrity": "sha1-TjNms55/VFfjXxMkvfb4jQv8cwY="
+                },
+                "normalize-url": {
+                    "version": "2.0.1",
+                    "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-2.0.1.tgz",
+                    "integrity": "sha512-D6MUW4K/VzoJ4rJ01JFKxDrtY1v9wrgzCX5f2qj/lzH1m/lW6MhUZFKerVsnyjOhOsYzI9Kqqak+10l4LvLpMw==",
+                    "requires": {
+                        "prepend-http": "^2.0.0",
+                        "query-string": "^5.0.1",
+                        "sort-keys": "^2.0.0"
+                    }
+                }
+            }
+        },
        "call-bind": {
            "version": "1.0.2",
            "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.2.tgz",
@ -2124,6 +2165,14 @@
                "shallow-clone": "^3.0.0"
            }
        },
+        "clone-response": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/clone-response/-/clone-response-1.0.2.tgz",
+            "integrity": "sha1-0dyXOSAxTfZ/vrlCI7TuNQI56Ws=",
+            "requires": {
+                "mimic-response": "^1.0.0"
+            }
+        },
        "coa": {
            "version": "2.0.2",
            "resolved": "https://registry.npmjs.org/coa/-/coa-2.0.2.tgz",
@ -2332,8 +2381,7 @@
        "core-util-is": {
            "version": "1.0.2",
            "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-            "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
-            "dev": true
+            "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
        },
        "cosmiconfig": {
            "version": "5.2.1",
@ -2856,8 +2904,15 @@
        "decode-uri-component": {
            "version": "0.2.0",
            "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz",
-            "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=",
-            "dev": true
+            "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU="
+        },
+        "decompress-response": {
+            "version": "3.3.0",
+            "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-3.3.0.tgz",
+            "integrity": "sha1-gKTdMjdIOEv6JICDYirt7Jgq3/M=",
+            "requires": {
+                "mimic-response": "^1.0.0"
+            }
        },
        "deep-equal": {
            "version": "1.1.1",
@ -3019,6 +3074,11 @@
                "is-obj": "^2.0.0"
            }
        },
+        "duplexer3": {
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz",
+            "integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI="
+        },
        "ee-first": {
            "version": "1.1.1",
            "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@ -3516,6 +3576,39 @@
                }
            }
        },
+        "from2": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/from2/-/from2-2.3.0.tgz",
+            "integrity": "sha1-i/tVAr3kpNNs/e6gB/zKIdfjgq8=",
+            "requires": {
+                "inherits": "^2.0.1",
+                "readable-stream": "^2.0.0"
+            },
+            "dependencies": {
+                "readable-stream": {
+                    "version": "2.3.7",
+                    "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+                    "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+                    "requires": {
+                        "core-util-is": "~1.0.0",
+                        "inherits": "~2.0.3",
+                        "isarray": "~1.0.0",
+                        "process-nextick-args": "~2.0.0",
+                        "safe-buffer": "~5.1.1",
+                        "string_decoder": "~1.1.1",
+                        "util-deprecate": "~1.0.1"
+                    }
+                },
+                "string_decoder": {
+                    "version": "1.1.1",
+                    "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+                    "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
+                    "requires": {
+                        "safe-buffer": "~5.1.0"
+                    }
+                }
+            }
+        },
        "fs-minipass": {
            "version": "2.1.0",
            "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-2.1.0.tgz",
@ -3629,6 +3722,50 @@
                }
            }
        },
+        "got": {
+            "version": "8.3.2",
+            "resolved": "https://registry.npmjs.org/got/-/got-8.3.2.tgz",
+            "integrity": "sha512-qjUJ5U/hawxosMryILofZCkm3C84PLJS/0grRIpjAwu+Lkxxj5cxeCU25BG0/3mDSpXKTyZr8oh8wIgLaH0QCw==",
+            "requires": {
+                "@sindresorhus/is": "^0.7.0",
+                "cacheable-request": "^2.1.1",
+                "decompress-response": "^3.3.0",
+                "duplexer3": "^0.1.4",
+                "get-stream": "^3.0.0",
+                "into-stream": "^3.1.0",
+                "is-retry-allowed": "^1.1.0",
+                "isurl": "^1.0.0-alpha5",
+                "lowercase-keys": "^1.0.0",
+                "mimic-response": "^1.0.0",
+                "p-cancelable": "^0.4.0",
+                "p-timeout": "^2.0.1",
+                "pify": "^3.0.0",
+                "safe-buffer": "^5.1.1",
+                "timed-out": "^4.0.1",
+                "url-parse-lax": "^3.0.0",
+                "url-to-options": "^1.0.1"
+            },
+            "dependencies": {
+                "get-stream": {
+                    "version": "3.0.0",
+                    "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
+                    "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
+                },
+                "p-timeout": {
+                    "version": "2.0.1",
+                    "resolved": "https://registry.npmjs.org/p-timeout/-/p-timeout-2.0.1.tgz",
+                    "integrity": "sha512-88em58dDVB/KzPEx1X0N3LwFfYZPyDc4B6eF38M1rk9VTZMbxXXgjugz8mmwpS9Ox4BDZ+t6t3QP5+/gazweIA==",
+                    "requires": {
+                        "p-finally": "^1.0.0"
+                    }
+                },
+                "pify": {
+                    "version": "3.0.0",
+                    "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
+                    "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY="
+                }
+            }
+        },
        "graceful-fs": {
            "version": "4.2.6",
            "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.6.tgz",
@ -3661,12 +3798,25 @@
            "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
            "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0="
        },
+        "has-symbol-support-x": {
+            "version": "1.4.2",
+            "resolved": "https://registry.npmjs.org/has-symbol-support-x/-/has-symbol-support-x-1.4.2.tgz",
+            "integrity": "sha512-3ToOva++HaW+eCpgqZrCfN51IPB+7bJNVT6CUATzueB5Heb8o6Nam0V3HG5dlDvZU1Gn5QLcbahiKw/XVk5JJw=="
+        },
        "has-symbols": {
            "version": "1.0.1",
            "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.1.tgz",
            "integrity": "sha512-PLcsoqu++dmEIZB+6totNFKq/7Do+Z0u4oT0zKOJNl3lYK6vGwwu2hjHs+68OEZbTjiUE9bgOABXbP/GvrS0Kg==",
            "dev": true
        },
+        "has-to-string-tag-x": {
+            "version": "1.4.1",
+            "resolved": "https://registry.npmjs.org/has-to-string-tag-x/-/has-to-string-tag-x-1.4.1.tgz",
+            "integrity": "sha512-vdbKfmw+3LoOYVr+mtxHaX5a96+0f3DljYd8JOqvOLsf5mw2Otda2qCDT9qRqLAhrjyQ0h7ual5nOiASpsGNFw==",
+            "requires": {
+                "has-symbol-support-x": "^1.4.1"
+            }
+        },
        "hash-sum": {
            "version": "1.0.2",
            "resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
@ -3767,6 +3917,11 @@
                }
            }
        },
+        "http-cache-semantics": {
+            "version": "3.8.1",
+            "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-3.8.1.tgz",
+            "integrity": "sha512-5ai2iksyV8ZXmnZhHH4rWPoxxistEexSi5936zIQ1bnNTW5VnA85B6P/VpXiRM017IgRvb2kKo1a//y+0wSp3w=="
+        },
        "http-deceiver": {
            "version": "1.2.7",
            "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
@ -3907,8 +4062,7 @@
        "inherits": {
            "version": "2.0.4",
            "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
-            "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
-            "dev": true
+            "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
        },
        "internal-ip": {
            "version": "6.2.0",
@ -3928,6 +4082,15 @@
            "integrity": "sha512-Ju0Bz/cEia55xDwUWEa8+olFpCiQoypjnQySseKtmjNrnps3P+xfpUmGr90T7yjlVJmOtybRvPXhKMbHr+fWnw==",
            "dev": true
        },
+        "into-stream": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/into-stream/-/into-stream-3.1.0.tgz",
+            "integrity": "sha1-lvsKk2wSur1v8XUqF9BWFqvQlMY=",
+            "requires": {
+                "from2": "^2.1.1",
+                "p-is-promise": "^1.1.0"
+            }
+        },
        "ip": {
            "version": "1.1.5",
            "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
@ -4077,6 +4240,11 @@
            "integrity": "sha512-drqDG3cbczxxEJRoOXcOjtdp1J/lyp1mNn0xaznRs8+muBhgQcrnbspox5X5fOw0HnMnbfDzvnEMEtqDEJEo8w==",
            "dev": true
        },
+        "is-object": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/is-object/-/is-object-1.0.2.tgz",
+            "integrity": "sha512-2rRIahhZr2UWb45fIOuvZGpFtz0TyOZLf32KxBbSoUCeZR495zCKlWUKKUByk3geS2eAs7ZAABt0Y/Rx0GiQGA=="
+        },
        "is-path-cwd": {
            "version": "2.2.0",
            "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz",
@ -4101,6 +4269,11 @@
                "path-is-inside": "^1.0.2"
            }
        },
+        "is-plain-obj": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz",
+            "integrity": "sha1-caUMhCnfync8kqOQpKA7OfzVHT4="
+        },
        "is-plain-object": {
            "version": "2.0.4",
            "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
@ -4126,6 +4299,11 @@
            "integrity": "sha512-qgDYXFSR5WvEfuS5dMj6oTMEbrrSaM0CrFk2Yiq/gXnBvD9pMa2jGXxyhGLfvhZpuMZe18CJpFxAt3CRs42NMg==",
            "dev": true
        },
+        "is-retry-allowed": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.2.0.tgz",
+            "integrity": "sha512-RUbUeKwvm3XG2VYamhJL1xFktgjvPzL0Hq8C+6yrWIswDy3BIXGqCxhxkc30N9jqK311gVU137K8Ei55/zVJRg=="
+        },
        "is-stream": {
            "version": "2.0.0",
            "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.0.tgz",
@ -4175,8 +4353,7 @@
        "isarray": {
            "version": "1.0.0",
            "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-            "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
-            "dev": true
+            "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
        },
        "isexe": {
            "version": "2.0.0",
@ -4190,6 +4367,15 @@
            "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8=",
            "dev": true
        },
+        "isurl": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/isurl/-/isurl-1.0.0.tgz",
+            "integrity": "sha512-1P/yWsxPlDtn7QeRD+ULKQPaIaN6yF368GZ2vDfv0AL0NwpStafjWCDDdn0k8wgFMWpVAqG7oJhxHnlud42i9w==",
+            "requires": {
+                "has-to-string-tag-x": "^1.2.0",
+                "is-object": "^1.0.1"
+            }
+        },
        "jest-worker": {
            "version": "26.6.2",
            "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-26.6.2.tgz",
@ -4240,6 +4426,11 @@
            "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==",
            "dev": true
        },
+        "json-buffer": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.0.tgz",
+            "integrity": "sha1-Wx85evx11ne96Lz8Dkfh+aPZqJg="
+        },
        "json-parse-better-errors": {
            "version": "1.0.2",
            "resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz",
@ -4267,6 +4458,14 @@
                "minimist": "^1.2.5"
            }
        },
+        "keyv": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/keyv/-/keyv-3.0.0.tgz",
+            "integrity": "sha512-eguHnq22OE3uVoSYG0LVWNP+4ppamWr9+zWBe1bsNcovIMy6huUJFPgy4mGwCd/rnl3vOLGW1MTlu4c57CT1xA==",
+            "requires": {
+                "json-buffer": "3.0.0"
+            }
+        },
        "killable": {
            "version": "1.0.1",
            "resolved": "https://registry.npmjs.org/killable/-/killable-1.0.1.tgz",
@ -4329,6 +4528,11 @@
            "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=",
            "dev": true
        },
+        "lowercase-keys": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.1.tgz",
+            "integrity": "sha512-G2Lj61tXDnVFFOi8VZds+SoQjtQC3dgokKdDG2mTm1tx4m50NUHBOZSBwQQHyy0V12A0JTG4icfZQH+xPyh8VA=="
+        },
        "lru-cache": {
            "version": "6.0.0",
            "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
@ -4479,6 +4683,11 @@
            "integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==",
            "dev": true
        },
+        "mimic-response": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-1.0.1.tgz",
+            "integrity": "sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ=="
+        },
        "mini-css-extract-plugin": {
            "version": "1.3.8",
            "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.8.tgz",
@ -4688,8 +4897,7 @@
        "object-assign": {
            "version": "4.1.1",
            "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-            "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
-            "dev": true
+            "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
        },
        "object-inspect": {
            "version": "1.9.0",
@ -4806,6 +5014,11 @@
                "url-parse": "^1.4.3"
            }
        },
+        "p-cancelable": {
+            "version": "0.4.1",
+            "resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-0.4.1.tgz",
+            "integrity": "sha512-HNa1A8LvB1kie7cERyy21VNeHb2CWJJYqyyC2o3klWFfMGlFmWv2Z7sFgZH8ZiaYL95ydToKTFVXgMV/Os0bBQ=="
+        },
        "p-defer": {
            "version": "1.0.0",
            "resolved": "https://registry.npmjs.org/p-defer/-/p-defer-1.0.0.tgz",
@ -4824,8 +5037,12 @@
        "p-finally": {
            "version": "1.0.0",
            "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
-            "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4=",
-            "dev": true
+            "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4="
+        },
+        "p-is-promise": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/p-is-promise/-/p-is-promise-1.1.0.tgz",
+            "integrity": "sha1-nJRWmJ6fZYgBewQ01WCXZ1w9oF4="
        },
        "p-limit": {
            "version": "2.3.0",
@ -6892,6 +7109,11 @@
            "integrity": "sha512-97DXOFbQJhk71ne5/Mt6cOu6yxsSfM0QGQyl0L25Gca4yGWEGJaig7l7gbCX623VqTBNGLRLaVUCnNkcedlRSQ==",
            "dev": true
        },
+        "prepend-http": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-2.0.0.tgz",
+            "integrity": "sha1-6SQ0v6XqjBn0HN/UAddBo8gZ2Jc="
+        },
        "prettier": {
            "version": "1.19.1",
            "resolved": "https://registry.npmjs.org/prettier/-/prettier-1.19.1.tgz",
@ -6911,8 +7133,7 @@
        "process-nextick-args": {
            "version": "2.0.1",
            "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
-            "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
-            "dev": true
+            "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
        },
        "promise-inflight": {
            "version": "1.0.1",
@ -6953,6 +7174,16 @@
            "integrity": "sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ==",
            "dev": true
        },
+        "query-string": {
+            "version": "5.1.1",
+            "resolved": "https://registry.npmjs.org/query-string/-/query-string-5.1.1.tgz",
+            "integrity": "sha512-gjWOsm2SoGlgLEdAGt7a6slVOk9mGiXmPFMqrEhLQ68rhQuBnpfs3+EmlvqKyxnCo9/PPlF+9MtY02S1aFg+Jw==",
+            "requires": {
+                "decode-uri-component": "^0.2.0",
+                "object-assign": "^4.1.0",
+                "strict-uri-encode": "^1.0.0"
+            }
+        },
        "querystring": {
            "version": "0.2.0",
            "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz",
@ -7293,6 +7524,14 @@
                }
            }
        },
+        "responselike": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/responselike/-/responselike-1.0.2.tgz",
+            "integrity": "sha1-kYcg7ztjHFZCvgaPFa3lpG9Loec=",
+            "requires": {
+                "lowercase-keys": "^1.0.0"
+            }
+        },
        "retry": {
            "version": "0.12.0",
            "resolved": "https://registry.npmjs.org/retry/-/retry-0.12.0.tgz",
@ -7362,8 +7601,7 @@
        "safe-buffer": {
            "version": "5.1.2",
            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-            "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
-            "dev": true
+            "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
        },
        "safer-buffer": {
            "version": "2.1.2",
@ -7655,6 +7893,14 @@
                }
            }
        },
+        "sort-keys": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-2.0.0.tgz",
+            "integrity": "sha1-ZYU1WEhh7JfXMNbPQYIuH1ZoQSg=",
+            "requires": {
+                "is-plain-obj": "^1.0.0"
+            }
+        },
        "source-list-map": {
            "version": "2.0.1",
            "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz",
@ -7774,6 +8020,11 @@
                "@stimulus/webpack-helpers": "^2.0.0"
            }
        },
+        "strict-uri-encode": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
+            "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM="
+        },
        "string-width": {
            "version": "2.1.1",
            "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
@ -8089,6 +8340,11 @@
            "integrity": "sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==",
            "dev": true
        },
+        "timed-out": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
+            "integrity": "sha1-8y6srFoXW+ol1/q1Zas+2HQe9W8="
+        },
        "timsort": {
            "version": "0.3.0",
            "resolved": "https://registry.npmjs.org/timsort/-/timsort-0.3.0.tgz",
@ -8270,6 +8526,19 @@
                "requires-port": "^1.0.0"
            }
        },
+        "url-parse-lax": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-3.0.0.tgz",
+            "integrity": "sha1-FrXK/Afb42dsGxmZF3gj1lA6yww=",
+            "requires": {
+                "prepend-http": "^2.0.0"
+            }
+        },
+        "url-to-options": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/url-to-options/-/url-to-options-1.0.1.tgz",
+            "integrity": "sha1-FQWgOiiaSMvXpDTvuu7FBV9WM6k="
+        },
        "util": {
            "version": "0.12.3",
            "resolved": "https://registry.npmjs.org/util/-/util-0.12.3.tgz",
@ -8400,6 +8669,14 @@
                }
            }
        },
+        "vue-resource": {
+            "version": "1.5.1",
+            "resolved": "https://registry.npmjs.org/vue-resource/-/vue-resource-1.5.1.tgz",
+            "integrity": "sha512-o6V4wNgeqP+9v9b2bPXrr20CGNQPEXjpbUWdZWq9GJhqVeAGcYoeTtn/D4q059ZiyN0DIrDv/ADrQUmlUQcsmg==",
+            "requires": {
+                "got": "^8.0.3"
+            }
+        },
        "vue-style-loader": {
            "version": "4.1.2",
            "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz",
--- a/app/package.json
+++ b/app/package.json
@ -20,6 +20,7 @@
    "dependencies": {
        "vue": "^2.6.12",
        "vue-loader": "^15.9.6",
+        "vue-resource": "^1.5.1",
        "vue-template-compiler": "^2.6.12",
        "yarn": "^1.22.10"
    }