65 lines
1.5 KiB
JavaScript
65 lines
1.5 KiB
JavaScript
|
|
||
|
|
Vue.component('entity-data', {
|
||
|
|
props: [ "filter" ],
|
||
|
|
mounted: function() {
|
||
|
|
this.startRequesting("");
|
||
|
|
},
|
||
|
|
beforeDestroy: function() {
|
||
|
|
this.stopRequesting();
|
||
|
|
},
|
||
|
|
data: function() {
|
||
|
|
return {
|
||
|
|
scope: "",
|
||
|
|
scope_pending: "",
|
||
|
|
data: [],
|
||
|
|
data_request: undefined,
|
||
|
|
error: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
request_data(scope) {
|
||
|
|
var url = "scope/" + scope + "?include=Name";
|
||
|
|
if (this.filter) {
|
||
|
|
url += "," + this.filter.join(",");
|
||
|
|
}
|
||
|
|
|
||
|
|
app.get(url, (msg) => {
|
||
|
|
this.data = msg;
|
||
|
|
this.error = false;
|
||
|
|
this.scope = this.scope_pending;
|
||
|
|
}, (Http) => {
|
||
|
|
if (Http.status == 404) {
|
||
|
|
this.error = true;
|
||
|
|
}
|
||
|
|
});
|
||
|
|
},
|
||
|
|
// Stop periodically requesting the scope
|
||
|
|
stopRequesting() {
|
||
|
|
this.data = [];
|
||
|
|
clearInterval(this.data_request);
|
||
|
|
},
|
||
|
|
// Start periodically requesting a scope
|
||
|
|
startRequesting(scope) {
|
||
|
|
this.stopRequesting();
|
||
|
|
|
||
|
|
// Initial request
|
||
|
|
var scope_url = scope.replace(/\./g, "/");
|
||
|
|
this.request_data(scope_url);
|
||
|
|
|
||
|
|
// Start periodic request
|
||
|
|
this.data_request = window.setInterval(function() {
|
||
|
|
this.request_data(scope_url);
|
||
|
|
}.bind(this), 1000);
|
||
|
|
},
|
||
|
|
select_scope(scope) {
|
||
|
|
this.scope_pending = scope;
|
||
|
|
this.startRequesting(scope);
|
||
|
|
}
|
||
|
|
},
|
||
|
|
template: `
|
||
|
|
<div>
|
||
|
|
<entity-table v-for="table in data" :data="table" :key="table.type.join(',')"></entity-table>
|
||
|
|
</div>
|
||
|
|
`
|
||
|
|
});
|