demo form

2017-08-31 14:03:52 +02:00
parent 1803e604c4
commit 15943ce641
6 changed files with 133 additions and 14 deletions
--- a/src/views/lists/domainlist.vue
+++ b/src/views/lists/domainlist.vue
@@ -0,0 +1,85 @@
+<template>
+    <div class="Domainlist">
+        <h1>Domainlist</h1>
+        <scroll-table :actions="actions" :columns="columns" :new-rows="newRows" :has-more="hasMore" :loading="loading" :handler="more" orderBy="Name" :orderDesc="false" :limit="50"></scroll-table>
+    </div>
+</template>
+
+<script>
+import ScrollTable from '../../components/scroll-table.vue';
+
+export default {
+    name: "Domainlist",
+    components: {
+        ScrollTable
+    },
+    data() {
+        return {
+            actions: [{
+                title: 'Edit',
+                icon: 'icon-pencil',
+                action(row) {
+                    console.log("yay edit", row);
+                }
+            }, {
+                title: 'Duplicate',
+                icon: 'icon-docs',
+                action(row) {
+                    console.log("yay duplicate", row);
+                }
+            }, {
+                title: 'Hide',
+                icon: 'icon-eye-off',
+                action(row) {
+                    console.log("yay hide", row);
+                }
+            }],
+            columns: [{
+                heading: 'ID',
+                prop: 'ID',
+                orderBy: 'id',
+                align: 'right'
+            }, {
+                heading: 'TLD',
+                prop: 'TLD',
+                orderBy: 'tld',
+                align: 'left'
+            }, {
+                heading: 'Domain',
+                prop: 'Name',
+                orderBy: 'name'
+            }],
+            newRows: [ ],
+            hasMore: true,
+            loading: false
+        }
+    },
+    methods: {
+        more(offset, limit, orderBy, orderDesc, search) {
+            this.loading = true;
+            this.$store.dispatch('apiRequest', {
+                endpoint: 'domains',
+                params: {
+                    start: offset,
+                    length: limit,
+                    orderBy,
+                    orderDesc,
+                    search
+                }
+            })
+                .then(rows => {
+                    this.hasMore = (rows.length >= limit);
+                    this.newRows = rows;
+                    this.loading = false;
+                })
+                .catch(error => {
+                    this.loading = false;
+                    this.hasMore = false;
+
+                    console.log(error);
+                });
+
+        }
+    }
+}
+</script>