+
+
+
+
+
+
-
-
{{ getProp(row, col.prop) }}
+
+
+
+
+ {{ getProp(row, col.prop) }}
{{ col.render(row) }}
-
-
+
diff --git a/src/components/scroll-table.vue b/src/components/scroll-table.vue
index 73b2e00..a6d82e5 100644
--- a/src/components/scroll-table.vue
+++ b/src/components/scroll-table.vue
@@ -20,131 +20,131 @@ import MyInput from './my-input.vue';
import { ObserveVisibility } from 'vue-observe-visibility/dist/vue-observe-visibility';
export default {
- name: "ScrollTable",
- directives: {
- ObserveVisibility
- },
- components: {
- MyTable,
- MyInput
- },
- props: {
+ name: "ScrollTable",
+ directives: {
+ ObserveVisibility
+ },
+ components: {
+ MyTable,
+ MyInput
+ },
+ props: {
actions: {
type: Array,
default() {
return [ ];
}
},
- columns: {
- type: Array,
- default() {
- return [ ];
- }
- },
- newRows: {
- type: Array,
- default() {
- return [ ];
- }
- },
- offset: {
- type: Number,
- default: 0
- },
- limit: {
- type: Number,
- default: 10
- },
- orderBy: {
- type: String
- },
- orderDesc: {
- type: Boolean,
- default: false
- },
- search: {
- type: String
- },
- loading: {
- type: Boolean,
- default: false
- },
- hasMore: {
- type: Boolean,
- default: true
- },
- handler: {
- type: Function,
- default: () => {}
- }
- },
- watch: {
- newRows(rows) {
- rows.forEach(row => {
- this.rowsToPush.push(row);
- });
- this.currentOffset += rows.length;
+ columns: {
+ type: Array,
+ default() {
+ return [ ];
+ }
+ },
+ newRows: {
+ type: Array,
+ default() {
+ return [ ];
+ }
+ },
+ offset: {
+ type: Number,
+ default: 0
+ },
+ limit: {
+ type: Number,
+ default: 10
+ },
+ orderBy: {
+ type: String
+ },
+ orderDesc: {
+ type: Boolean,
+ default: false
+ },
+ search: {
+ type: String
+ },
+ loading: {
+ type: Boolean,
+ default: false
+ },
+ hasMore: {
+ type: Boolean,
+ default: true
+ },
+ handler: {
+ type: Function,
+ default: () => {}
+ }
+ },
+ watch: {
+ newRows(rows) {
+ rows.forEach(row => {
+ this.rowsToPush.push(row);
+ });
+ this.currentOffset += rows.length;
this.pushRows(); // for transition
},
loading(l) {
- if (!l) {
+ if (!l) {
// delay after loading for visibility observer
setTimeout(() => {
- this.loadingDelayed = false;
+ this.loadingDelayed = false;
}, 200);
} else {
- this.loadingDelayed = true;
+ this.loadingDelayed = true;
}
}
},
data() {
- return {
- rows: [ ],
- rowsToPush: [ ],
- currentOffset: this.offset,
- currentOrderBy: this.orderBy,
- currentOrderDesc: this.orderDesc,
- currentSearch: this.search,
- loadingDelayed: false,
- reloadTriggered: false
- }
+ return {
+ rows: [ ],
+ rowsToPush: [ ],
+ currentOffset: this.offset,
+ currentOrderBy: this.orderBy,
+ currentOrderDesc: this.orderDesc,
+ currentSearch: this.search,
+ loadingDelayed: false,
+ reloadTriggered: false
+ }
},
methods: {
- visibilityChanged(isVisible, entry) {
- if (isVisible) {
+ visibilityChanged(isVisible) {
+ if (isVisible) {
// infinite scrolling
this.reloadTriggered = false;
this.handler(this.currentOffset, this.limit, this.currentOrderBy, this.currentOrderDesc, this.currentSearch);
}
},
pushRows() {
- let row = this.rowsToPush.shift();
- if (row) {
- this.rows.push(row);
- setTimeout(() => {
- this.pushRows();
- }, 20);
- }
+ let row = this.rowsToPush.shift();
+ if (row) {
+ this.rows.push(row);
+ setTimeout(() => {
+ this.pushRows();
+ }, 20);
+ }
},
clear() {
- this.currentOffset = 0;
- this.rows = [];
- this.rowsToPush = [];
+ this.currentOffset = 0;
+ this.rows = [];
+ this.rowsToPush = [];
},
sort(e) {
- if (e.orderBy == this.currentOrderBy) {
- this.currentOrderDesc = !this.currentOrderDesc;
- } else {
- this.currentOrderDesc = false;
- }
- this.currentOrderBy = e.orderBy;
- this.reloadTriggered = true;
- this.clear();
+ if (e.orderBy == this.currentOrderBy) {
+ this.currentOrderDesc = !this.currentOrderDesc;
+ } else {
+ this.currentOrderDesc = false;
+ }
+ this.currentOrderBy = e.orderBy;
+ this.reloadTriggered = true;
+ this.clear();
},
searchChanged(e) {
- this.currentSearch = e;
- this.reloadTriggered = true;
- this.clear();
+ this.currentSearch = e;
+ this.reloadTriggered = true;
+ this.clear();
}
}
}
diff --git a/src/components/sidebar.vue b/src/components/sidebar.vue
index b8af8ce..655ef5b 100644
--- a/src/components/sidebar.vue
+++ b/src/components/sidebar.vue
@@ -14,27 +14,6 @@
