Lefteris
/
playground-client
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

last changes

master
lefteris 4 years ago
parent
ddea9670af
commit
e8c0869881
5 changed files with 880 additions and 864 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 200
      src/App.vue
  2. 6
      src/components/doclive/config.js
  3. 1074
      src/components/doclive/runLlo.vue
  4. 45
      src/main.js
  5. 419
      src/store/modules/create_pipelineLLO.js

200
src/App.vue
View File

@ -1,36 +1,39 @@
<template> <template>
<div id="app"> <div id="app">
<!-- ***************** nav items ****************** -->
<!-- ***************** nav items ****************** --> <b-navbar toggleable="md" class="navbar-secondary">
<b-navbar toggleable="md" class="navbar-secondary" > <b-navbar-toggle target="nav_collapse"> </b-navbar-toggle>
<b-navbar-toggle target="nav_collapse"> </b-navbar-toggle> <b-navbar-brand class="logo simple-text ti-swarmlab text-secondary">
<b-navbar-brand class="logo simple-text ti-swarmlab text-secondary"> Swarmlab.io Playground
Swarmlab.io Playground </b-navbar-brand>
</b-navbar-brand> <b-collapse is-nav id="nav_collapse">
<b-collapse is-nav id="nav_collapse"> <b-navbar-nav> </b-navbar-nav>
<b-navbar-nav>
<!-- Right aligned nav items -->
<b-navbar-nav class="ml-auto">
</b-navbar-nav> <b-nav-item href="https://git.swarmlab.io:3000" target="_swarmlabgit">
Swarmlab_git
<!-- Right aligned nav items --> </b-nav-item>
<b-navbar-nav class="ml-auto"> <b-nav-item> | </b-nav-item>
<b-nav-item href="https://git.swarmlab.io:3000" target="_swarmlabgit"> Swarmlab_git </b-nav-item> <b-nav-item
<b-nav-item > | </b-nav-item> :href="'https://api-client.swarmlab.io:8088/?token=' + token"
<b-nav-item :href="'https://api-client.swarmlab.io:8088/?token='+ token" target="_swarmlab"> Lab_onDemand </b-nav-item> target="_swarmlab"
<b-nav-item > | </b-nav-item> >
<!-- Lab_onDemand
</b-nav-item>
<b-nav-item> | </b-nav-item>
<!--
<b-nav-form> <b-nav-form>
<b-form-input size="sm" class="mr-sm-2" type="text" placeholder="Search"/> <b-form-input size="sm" class="mr-sm-2" type="text" placeholder="Search"/>
<b-button size="sm" class="my-2 my-sm-0" type="submit">Search</b-button> <b-button size="sm" class="my-2 my-sm-0" type="submit">Search</b-button>
</b-nav-form> </b-nav-form>
--> -->
<!-- template <!-- template
<b-nav-item-dropdown right> <b-nav-item-dropdown right>
--> -->
<!-- Using template slot --> <!-- Using template slot -->
<!-- template <!-- template
<template slot="button-content"> <template slot="button-content">
<em>Template</em> <em>Template</em>
</template> </template>
@ -53,124 +56,101 @@
@click="saveDocLive"> @click="saveDocLive">
Save As Zip</button> Save As Zip</button>
--> -->
</b-navbar-nav>
</b-navbar-nav> </b-collapse>
</b-navbar>
</b-collapse>
</b-navbar> <!-- ***************** container items ****************** -->
<b-row>
<!-- ***************** container items ****************** --> <b-col cols="12">
<b-row> <doc-live style="background-color: #f8f9fa"> </doc-live>
<b-col cols="12"> </b-col>
</b-row>
<doc-live <b-row>
style="background-color: #f8f9fa" <b-col cols="12">
> <doc-grep style="background-color: #f8f9fa"> </doc-grep>
</doc-live> </b-col>
</b-row>
</b-col>
</b-row>
<b-row>
<b-col cols="12">
<doc-grep
style="background-color: #f8f9fa"
>
</doc-grep>
</b-col>
</b-row>
</div> </div>
</template> </template>
<script> <script>
import DocLive from './components/DocLive.vue' import DocLive from "./components/DocLive.vue";
import DocGrep from './components/DocGrep.vue' import DocGrep from "./components/DocGrep.vue";
import "@/assets/css/themify-icons.css"; import "@/assets/css/themify-icons.css";
export default { export default {
name: 'app', name: "app",
components: { components: {
DocLive, DocLive,
DocGrep DocGrep,
}, },
data() { data() {
return { return {
show: true, show: true,
token: '', token: "",
SwarmabAsciiLabTemplate:'' SwarmabAsciiLabTemplate: "",
} };
},
mounted() {
}, },
created() { mounted() {},
var url_string = window.location.href created() {
var url_string = window.location.href;
var url = new URL(url_string); var url = new URL(url_string);
this.token = url.searchParams.get("token"); this.token = url.searchParams.get("token");
console.log("token "+ this.token); console.log("token " + this.token);
}, },
methods: { methods: {
saveDocLive() { saveDocLive() {
this.$root.$emit('asciilive_save','save') this.$root.$emit("asciilive_save", "save");
}, },
async connect_to_iot(iot) { async connect_to_iot(iot) {
if (iot == "mesh") {
if( iot == 'mesh' ){ this.SwarmabAsciiLabTemplate = {
iot5: {
this.SwarmabAsciiLabTemplate = { id: 5,
"iot5": { name: "auto5",
"id": 5, img: "rinse.png",
"name": "auto5", Servicios: [
"img": "rinse.png", { model: "Sentra", doors: 4 },
"Servicios": [ { model: "Maxima", doors: 4 },
{"model":"Sentra", "doors":4}, { model: "Skyline", doors: 2 },
{"model":"Maxima", "doors":4}, ],
{"model":"Skyline", "doors":2} },
] };
}
}
} }
} },
} },
} };
</script> </script>
<style> <style>
@import url('https://fonts.googleapis.com/css?family=Lato:400,700'); @import url("https://fonts.googleapis.com/css?family=Lato:400,700");
body { body {
background: #EEF1F4 !important; background: #eef1f4 !important;
} }
.nav-background { .nav-background {
background: #353535; background: #353535;
} }
.ti-swarmlab:before { .ti-swarmlab:before {
position: relative; position: relative;
top:-5px; top: -5px;
right:-8px; right: -8px;
font-size: 1.5em; font-size: 1.5em;
font-weight: 300; font-weight: 300;
content: "\e606"; content: "\e606";
color: #222; color: #222;
color: #74B3C8; color: #74b3c8;
border-color: #c60000; border-color: #c60000;
} }
.ti-themify-logo:before { .ti-themify-logo:before {
content: "\e6d1"; content: "\e6d1";
} }
.menoutext { .menoutext {
font-family: 'Lato', sans-serif !important; font-family: "Lato", sans-serif !important;
} }
</style> </style>

6
src/components/doclive/config.js
View File

@ -0,0 +1,6 @@
var config = {};
//hardcoded token for testing
config.token = "c96e7fe836f9ffaf83e1fb7bc2b49819251057b0";
module.exports = config;

1074
src/components/doclive/runLlo.vue
View File

File diff suppressed because it is too large

45
src/main.js
View File

@ -1,45 +1,38 @@
import Vue from 'vue' import Vue from "vue";
import App from './App.vue' import App from "./App.vue";
import store from '@/store/index' import store from "@/store/index";
import BootstrapVue from 'bootstrap-vue' import BootstrapVue from "bootstrap-vue";
import 'bootstrap/dist/css/bootstrap.css' import "bootstrap/dist/css/bootstrap.css";
import 'bootstrap-vue/dist/bootstrap-vue.css' import "bootstrap-vue/dist/bootstrap-vue.css";
import VueSweetalert2 from 'vue-sweetalert2'; import VueSweetalert2 from "vue-sweetalert2";
Vue.use(VueSweetalert2); Vue.use(VueSweetalert2);
import VueSocketIOExt from "vue-socket.io-extended";
import io from "socket.io-client";
const socket = io("localhost:3000", {
//const socket = io('http://factory.swarmlab.io:55528', {
import VueSocketIOExt from 'vue-socket.io-extended';
import io from 'socket.io-client';
const socket = io('https://factory.swarmlab.io:55527', {
//const socket = io('http://factory.swarmlab.io:55528', {
//autoConnect: false //autoConnect: false
autoConnect: false, autoConnect: false,
reconnection: true, reconnection: true,
reconnectionDelay: 500, reconnectionDelay: 500,
maxReconnectionAttempts: Infinity, maxReconnectionAttempts: Infinity,
pingInterval: 25000, pingInterval: 25000,
pingTimeout: 60000, pingTimeout: 60000,
//transports: ["websocket"], //transports: ["websocket"],
transports: [ 'websocket', 'polling' ], transports: ["websocket", "polling"],
//transports: ["polling"], //transports: ["polling"],
secure: true, secure: true,
rejectUnauthorized: false rejectUnauthorized: false,
}); });
Vue.use(VueSocketIOExt, socket); Vue.use(VueSocketIOExt, socket);
Vue.use(BootstrapVue); Vue.use(BootstrapVue);
Vue.config.productionTip = false Vue.config.productionTip = false;
new Vue({ new Vue({
el: '#app', el: "#app",
store, store,
render: h => h(App) render: (h) => h(App),
}) });

419
src/store/modules/create_pipelineLLO.js
View File

@ -1,237 +1,254 @@
import { mapState, mapActions, commit } from 'vuex' import { mapState, mapActions, commit } from "vuex";
import store from '@/store/index' import store from "@/store/index";
import axios from 'axios' import axios from "axios";
export default { export default {
namespaced: true, namespaced: true,
state: { state: {
token: '', token: "",
llo: {}, llo: {},
log: [], log: [],
mongolog: [], mongolog: [],
socketid:'', socketid: "",
restapi:'off' restapi: "off",
}, },
getters: { getters: {
getrestapi (state, container) { getrestapi(state, container) {
//console.log("js1 get "+JSON.stringify(state.llo)) //console.log("js1 get "+JSON.stringify(state.llo))
return state.restapi return state.restapi;
//return state.log //return state.log
}, },
getmongolog (state, container) { getmongolog(state, container) {
//console.log("js1 get "+JSON.stringify(state.llo)) //console.log("js1 get "+JSON.stringify(state.llo))
return state.mongolog return state.mongolog;
//return state.log //return state.log
}, },
getlog (state, container) { getlog(state, container) {
//console.log("js1 get "+JSON.stringify(state.llo)) //console.log("js1 get "+JSON.stringify(state.llo))
return state.log return state.log;
}, },
gettoken (state, container) { gettoken(state, container) {
//console.log("js1 get "+JSON.stringify(state.llo)) //console.log("js1 get "+JSON.stringify(state.llo))
return state.token return state.token;
}, },
getllosrc (state, container) { getllosrc(state, container) {
//console.log("js1 get "+JSON.stringify(state.llo)) //console.log("js1 get "+JSON.stringify(state.llo))
return state.llo return state.llo;
}, },
getsocketid (state, container) { getsocketid(state, container) {
//console.log("js1 get "+JSON.stringify(state.llo)) //console.log("js1 get "+JSON.stringify(state.llo))
return state.socketid return state.socketid;
} },
}, },
mutations: { mutations: {
add_log (state, data) { add_log(state, data) {
//console.log("js1 set "+JSON.stringify(data)) //console.log("js1 set "+JSON.stringify(data))
state.log.push(data); state.log.push(data);
}, },
setrestapi (state, data) { setrestapi(state, data) {
//console.log("js1 set "+JSON.stringify(data)) //console.log("js1 set "+JSON.stringify(data))
state.restapi=data state.restapi = data;
}, },
set_token (state, data) { set_token(state, data) {
//console.log("js1 set "+JSON.stringify(data)) //console.log("js1 set "+JSON.stringify(data))
state.token=data; state.token = data;
}, },
rm_log (state, path) { rm_log(state, path) {
//console.log("js1 set "+JSON.stringify(data)) //console.log("js1 set "+JSON.stringify(data))
state.log = state.log.filter((item) => item.tailed_path !== path); state.log = state.log.filter((item) => item.tailed_path !== path);
//const filteredArray = myarr.filter(obj => obj.name !== 'foo'); //const filteredArray = myarr.filter(obj => obj.name !== 'foo');
//console.log("js1 set "+JSON.stringify(filterlog)) //console.log("js1 set "+JSON.stringify(filterlog))
console.log("js1 setrm "+JSON.stringify(state.log)) console.log("js1 setrm " + JSON.stringify(state.log));
//state.log = filterlog; //state.log = filterlog;
}, },
tail_log (state, path) { tail_log(state, path) {
//console.log("js1 set "+JSON.stringify(data)) //console.log("js1 set "+JSON.stringify(data))
state.log = state.log.filter((item) => item.tailed_path !== path).splice(0, 4); state.log = state.log
//const filteredArray = myarr.filter(obj => obj.name !== 'foo'); .filter((item) => item.tailed_path !== path)
//console.log("js1 set "+JSON.stringify(filterlog)) .splice(0, 4);
console.log("js1 setrmrmrmrmrmrmrmrm "+JSON.stringify(state.log)) //const filteredArray = myarr.filter(obj => obj.name !== 'foo');
//console.log("js1 set "+JSON.stringify(filterlog))
console.log("js1 setrmrmrmrmrmrmrmrm " + JSON.stringify(state.log));
//state.log = filterlog; //state.log = filterlog;
}, },
setmongolog (state, data) { setmongolog(state, data) {
//console.log("js1 set "+JSON.stringify(data)) //console.log("js1 set "+JSON.stringify(data))
state.mongolog.push(data); state.mongolog.push(data);
//state.log.push(data); //state.log.push(data);
}, },
rmmongolog (state, data) { rmmongolog(state, data) {
//console.log("js1 set "+JSON.stringify(data)) //console.log("js1 set "+JSON.stringify(data))
state.mongolog = []; state.mongolog = [];
//state.log.push(data); //state.log.push(data);
}, },
setllo (state, data) { setllo(state, data) {
//console.log("js1 set "+JSON.stringify(data)) //console.log("js1 set "+JSON.stringify(data))
state.llo=data; state.llo = data;
}, },
setsocketid (state, data) { setsocketid(state, data) {
//console.log("js1 set "+JSON.stringify(data)) //console.log("js1 set "+JSON.stringify(data))
state.socketid = data; state.socketid = data;
} },
}, },
actions: { actions: {
RMmongolog({commit}, value) { RMmongolog({ commit }, value) {
commit('rmmongolog') commit("rmmongolog");
}, },
addlog({commit}, value) { addlog({ commit }, value) {
//console.log("container "+value) //console.log("container "+value)
var tt = {} var tt = {};
tt.message = value.log.log.message tt.message = value.log.log.message;
tt.tailed_path = value.log.log.tailed_path tt.tailed_path = value.log.log.tailed_path;
tt.date = value.log.date tt.date = value.log.date;
commit('add_log', tt) commit("add_log", tt);
}, },
setRestapi({commit}, value) { setRestapi({ commit }, value) {
//console.log("container "+value) //console.log("container "+value)
commit('setrestapi', value.restapi) commit("setrestapi", value.restapi);
}, },
settoken({commit}, value) { settoken({ commit }, value) {
//console.log("container "+value) //console.log("container "+value)
commit('set_token', value.token) commit("set_token", value.token);
}, },
rmlog({commit}, value) { rmlog({ commit }, value) {
//console.log("containerirm "+value) //console.log("containerirm "+value)
commit('rm_log', value.path) commit("rm_log", value.path);
}, },
taillog({commit}, value) { taillog({ commit }, value) {
console.log("containerirm "+value) console.log("containerirm " + value);
commit('tail_log', value.path) commit("tail_log", value.path);
}, },
async get_data({commit,rootGetters}, value) { async get_data({ commit, rootGetters }, value) {
try { try {
let p = await axios.get("https://factory.swarmlab.io:55527/run", { let p = await axios.get("https://factory.swarmlab.io:55527/run", {
timeout: 45000, timeout: 45000,
params: { params: {
code: value.code code: value.code,
} },
}); });
//var p = value.code
console.log("paramp "+JSON.stringify(p))
store.dispatch('pipelineLLO/setScriptllo', p)
return p;
} catch (e) { //var p = value.code
if(e.message == "Request failed with status code 401" || /401/i.test(e.message)){ console.log("paramp " + JSON.stringify(p));
window.location.href = 'https://api-login.swarmlab.io:8089'; store.dispatch("pipelineLLO/setScriptllo", p);
}else{ return p;
var R = { } catch (e) {
if (
e.message == "Request failed with status code 401" ||
/401/i.test(e.message)
) {
window.location.href = "https://api-login.swarmlab.io:8089";
} else {
var R = {
ERROR_str: e, ERROR_str: e,
ERROR: 'yes' ERROR: "yes",
} };
return R; return R;
} }
} }
}, },
async get_log({commit,rootGetters}, value) { async get_log({ commit, rootGetters }, value) {
try { try {
var token = store.getters['pipelineLLO/gettoken']; var token = store.getters["pipelineLLO/gettoken"];
let p = await axios.get("https://factory.swarmlab.io:55527/get_log", { let p = await axios.get("https://factory.swarmlab.io:55527/get_log", {
timeout: 45000, timeout: 45000,
params: { params: {
token: token, token: token,
start: value.datestart, start: value.datestart,
end: value.dateend, end: value.dateend,
swarmlabname: value.swarmlabname swarmlabname: value.swarmlabname,
} },
}); });
//var p = value.code
console.log("paramp-------------------------- "+JSON.stringify(value))
store.dispatch('pipelineLLO/set_mongolog', p)
return p;
} catch (e) { //var p = value.code
if(e.message == "Request failed with status code 401" || /401/i.test(e.message)){ console.log(
window.location.href = 'https://api-login.swarmlab.io:8089'; "paramp-------------------------- " + JSON.stringify(value)
}else{ );
var R = { store.dispatch("pipelineLLO/set_mongolog", p);
return p;
} catch (e) {
if (
e.message == "Request failed with status code 401" ||
/401/i.test(e.message)
) {
window.location.href = "https://api-login.swarmlab.io:8089";
} else {
var R = {
ERROR_str: e, ERROR_str: e,
ERROR: 'yes' ERROR: "yes",
}
return R;
}
}
},
async hotreload({commit,rootGetters}, value) {
try {
var token = value.token
var params = {
swarmlabname: value.swarmlabname
}
var options = {
headers: { 'content-type': 'application/x-www-form-urlencoded',Authorization: `Bearer ${token}` },
}; };
var p = await axios.post('https://api.swarmlab.io/swarmlabrunhotreload',params,options); return R;
if(p.error == "invalid_token"){ }
console.log(p) }
console.log(JSON.stringify(p)) },
}else{ async hotreload({ commit, rootGetters }, value) {
try {
var token = value.token;
var params = {
swarmlabname: value.swarmlabname,
};
var options = {
headers: {
"content-type": "application/x-www-form-urlencoded",
Authorization: `Bearer ${token}`,
},
};
var p = await axios.post(
"https://api.swarmlab.io/swarmlabrunhotreload",
params,
options
);
if (p.error == "invalid_token") {
console.log(p);
console.log(JSON.stringify(p));
} else {
} }
//console.log(value.token) //console.log(value.token)
//console.log(value.swarmlabname) //console.log(value.swarmlabname)
console.log(JSON.stringify(p)) console.log(JSON.stringify(p));
} catch (e) { } catch (e) {
if(e.message == "Request failed with status code 401" || /401/i.test(e.message)){ if (
e.message == "Request failed with status code 401" ||
/401/i.test(e.message)
) {
//console.log('error '+JSON.stringify(e)) //console.log('error '+JSON.stringify(e))
window.location.href = 'https://api-login.swarmlab.io:8089'; window.location.href = "https://api-login.swarmlab.io:8089";
}else{ } else {
var R = { var R = {
ERROR_str: e, ERROR_str: e,
ERROR: 'yes' ERROR: "yes",
} };
return R; return R;
} }
} }
}, },
set_mongolog({commit}, value) { set_mongolog({ commit }, value) {
//console.log("container "+value) //console.log("container "+value)
//commit('setmongolog', value) //commit('setmongolog', value)
for (let item of value.data.data) { for (let item of value.data.data) {
//console.log(JSON.stringify(item)) //console.log(JSON.stringify(item))
var itemobj = {} var itemobj = {};
itemobj.message = item.message itemobj.message = item.message;
itemobj.tailed_path = item.tailed_path itemobj.tailed_path = item.tailed_path;
itemobj.date = item.time itemobj.date = item.time;
//console.log('vvvvvvvvvvvvvvvvvvvvvvvv '+JSON.stringify(itemobj)) //console.log('vvvvvvvvvvvvvvvvvvvvvvvv '+JSON.stringify(itemobj))
commit('setmongolog', itemobj) commit("setmongolog", itemobj);
} }
}, },
setScriptllo({commit}, value) { setScriptllo({ commit }, value) {
//console.log("container "+value) //console.log("container "+value)
commit('setllo', value) commit("setllo", value);
}, },
setsocketllo({commit}, value) { setsocketllo({ commit }, value) {
//console.log("container "+value) //console.log("container "+value)
commit('setsocketid', value) commit("setsocketid", value);
}, },
setScriptCodlogAction({commit}, value) { setScriptCodlogAction({ commit }, value) {
//console.log("container "+value) //console.log("container "+value)
commit('setScriptCodelog', value) commit("setScriptCodelog", value);
} },
} },
} };

Write Preview
Loading…
Cancel
Save