fetch current state

This commit is contained in:
Martin/Geno 2019-03-08 17:09:01 +01:00
parent 3b98fb36cb
commit 35e6446036
No known key found for this signature in database
GPG Key ID: 9D7D3C6BFF600C6A
7 changed files with 73 additions and 30 deletions

View File

@ -3,7 +3,7 @@ answer = false
[database] [database]
type = "sqlite3" type = "sqlite3"
logging = true logging = true
connection = "file:/tmp/wifictld.db" connection = "/tmp/wifictld.db"
# For Master-Slave cluster # For Master-Slave cluster
# read_connection = "" # read_connection = ""

View File

@ -10,6 +10,7 @@
<script src="assets/vue-route.js"></script> <script src="assets/vue-route.js"></script>
<script src="assets/vuex.js"></script> <script src="assets/vuex.js"></script>
<script src="assets/vue-websocket.js"></script> <script src="assets/vue-websocket.js"></script>
<script src="js/utils.js"></script>
</head> </head>
<body role="document"> <body role="document">
<div id="app"> <div id="app">
@ -40,6 +41,7 @@
<script src="js/view/accesspoint.js"></script> <script src="js/view/accesspoint.js"></script>
<script src="js/view/clients.js"></script> <script src="js/view/clients.js"></script>
<script src="js/store.js"></script> <script src="js/store.js"></script>
<script src="js/view.js"></script>
<script src="js/data.js"></script> <script src="js/data.js"></script>
<script src="js/main.js"></script> <script src="js/main.js"></script>
</body> </body>

View File

@ -18,3 +18,15 @@ store.commit('setEvent', {
state.controller.clients[client.addr] = client; state.controller.clients[client.addr] = client;
} }
}) })
VueNativeSock.default.install(Vue, `//${location.host}${location.pathname}ws`, {
store: store,
reconnection: true,
reconnectionDelay: 5000,
format: 'json',
})
getJSON(`//${location.host}${location.pathname}data.json`).then(function(data){
store.commit('initData',data);
})

View File

@ -1,32 +1,3 @@
const router = new VueRouter({
store,
routes: [
{ path: '/ap', component: ViewAccessPoints, name: "aps" },
{ path: '/ap/clients/:ip', component: ViewClients, name: "ap.clients"},
{ path: '/clients', component: ViewClients, name: "clients" },
{ path: '/', redirect: '/ap' }
]
})
VueNativeSock.default.install(Vue, `//${location.host}${location.pathname}ws`, {
store: store,
reconnection: true,
reconnectionDelay: 5000,
format: 'json',
})
const NavbarLogo = {
template: `<div class="p-navigation__logo" v-bind:class="{ online: isOnline }">
<a class="p-navigation__link" href="/">Wifictld</a>
</div>`,
computed: {
isOnline () {
return this.$store.state.socket.isConnected
}
}
};
const app = new Vue({ const app = new Vue({
el: '#app', el: '#app',
store, store,

View File

@ -99,6 +99,20 @@ const store = new Vuex.Store({
state.socket.eventMSGID[data.msg.id] = data.callback; state.socket.eventMSGID[data.msg.id] = data.callback;
} }
return ret; return ret;
},
initData (state, data) {
data.aps.forEach((ap) => {
if(state.controller._ap[ap.ip] === undefined){
state.controller.ap.push(ap.ip)
state.controller._ap[ap.ip] = null;
}
})
data.clients.forEach((client) => {
if (state.controller.clients[client.addr] === undefined) {
state.controller._clients.push(client.addr)
}
state.controller.clients[client.addr] = client;
})
} }
} }
}) })

23
webroot/js/utils.js Normal file
View File

@ -0,0 +1,23 @@
function get(url) {
return new Promise(function (resolve, reject) {
var req = new XMLHttpRequest();
req.open('GET', url);
req.onload = function onload() {
if (req.status === 200) {
resolve(req.response);
} else {
reject(Error(req.statusText));
}
};
req.onerror = function onerror() {
reject(Error('Network Error'));
};
req.send();
});
}
function getJSON(url) {
return get(url).then(JSON.parse);
}

21
webroot/js/view.js Normal file
View File

@ -0,0 +1,21 @@
const NavbarLogo = {
template: `<div class="p-navigation__logo" v-bind:class="{ online: isOnline }">
<a class="p-navigation__link" href="/">Wifictld</a>
</div>`,
computed: {
isOnline () {
return this.$store.state.socket.isConnected
}
}
};
const router = new VueRouter({
store,
routes: [
{ path: '/ap', component: ViewAccessPoints, name: "aps" },
{ path: '/ap/clients/:ip', component: ViewClients, name: "ap.clients"},
{ path: '/clients', component: ViewClients, name: "clients" },
{ path: '/', redirect: '/ap' }
]
})