zeus
/
swarmlab-hybrid
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

add scroll

master
zeus 2 years ago
parent
430d9479fe
commit
767f4be100
9 changed files with 1105 additions and 37 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 278
      src-local/llo/new.js
  2. 17
      src/components/mynetwork.vue
  3. 22
      src/components/mynetwork/availablepoc.vue
  4. 30
      src/components/mynetwork/dockerservices.vue
  5. 37
      src/components/mynetwork/images.vue
  6. 29
      src/components/mynetwork/mytable.vue
  7. 603
      src/components/mynetwork/networks.vue
  8. 2
      src/main.js
  9. 124
      src/store/modules/create_pipelineLLO.js

278
src-local/llo/new.js
View File

@ -776,6 +776,142 @@ app.get('/dockerimages', (req, res, next) => {
});
app.get('/dockernetworks', (req, res, next) => {
var RES = new Object();
const page = req.query["page"]
const per_page = req.query["per_page"]
var sort = req.query["sort"]
var filter = req.query["filter"]
var type = req.query["type"]
var sort = req.query["sort"]
var sorttmp1 = sort.split('|');
var sortname = sorttmp1[0];
var sortorder = sorttmp1[1];
var showexec = `docker network ls --format "{{json . }}" | jq . -s `
exec(showexec, (err, stdout, stderr) => {
if (err) {
console.error(`exec error: ${err}`);
return;
}
var nn = []
var string = stdout.toString()
var datajson = JSON.parse(string);
var results = []
if(filter !== 'NULL'){
var grep = new RegExp(filter);
var datalenth = datajson.length
for (var i=0 ; i < datalenth ; i++)
{
if(grep.test(datajson[i]['Name'])){
results.push(datajson[i]);
}
}
datajson=results
}
// sort by title
if(sortname == 'Repository'){
datajson.sort(function (a, b) {
if(sortorder == 'asc'){
return a.Repository.localeCompare(b.Repository);
}else{
return b.Repository.localeCompare(a.Repository);
}
});
}else if(sortname == 'Size'){
datajson.sort(function (a, b) {
if(sortorder == 'asc'){
return a.Size.localeCompare(b.Size);
}else{
return b.Size.localeCompare(a.Size);
}
});
}
var resultid = []
var datalenth2 = datajson.length
for (var i=0 ; i < datalenth2 ; i++)
{
datajson[i].id=i
datajson[i]._id=i
resultid.push(datajson[i]);
}
datajson=resultid
//console.log('Number of files ' + stdout);
//console.log('Number string ' + string);
//console.log('stringify ' + JSON.stringify(datajson));
var total = datajson.length;
var perpage = per_page
//var page = 1
var lastpage = total/perpage;
if(lastpage <= 1) {
lastpage=1
}else{
lastpage++
}
lastpage = Math.trunc(lastpage);
var next=(page+1);
if(next >= lastpage){
next=lastpage;
}
var prev=(page-1);
if(prev == 0){
prev=1;
}
var from=((page-1)*perpage)+1;
var to=(perpage*page)
var myplaybooks = new Object();
var links = `
{
"pagination": {
"total": ${total},
"per_page": ${perpage},
"current_page": ${page},
"last_page": ${lastpage},
"next_page_url": "?page=${next}",
"prev_page_url": "?page=${prev}",
"from": ${from},
"to": ${to},
"frommongo": ${from},
"tomongo": ${to}
}
}
`
//"next_page_url": "?page="+${next},
//"prev_page_url": "?page="+${prev},
//console.log(JSON.stringify(links))
//myplaybooks.links = links
myplaybooks.links = JSON.parse(links);
from--
myplaybooks.data = datajson.slice(from,to);
//myplaybooks.data = datajson;
var RES = new Object();
RES.code = req.query["action"]
RES.token = req.query["token"]
RES.error = false
RES.error_msg = "ok"
RES.data = myplaybooks;
res.json(RES.data)
});
});
app.get('/buildservices', (req, res, next) => {
@ -967,6 +1103,45 @@ app.get('/hybrid_rmimage', (req, res, next) => {
});
app.get('/hybrid_rmnetworks', (req, res, next) => {
var RES = new Object();
RES.instance = req.query["instance"]
var showexec = `docker network rm ${RES.instance}`
//console.log(JSON.stringify(showexec))
exec(showexec, (err, stdout, stderr) => {
if (err) {
console.error(`exec error: ${err}`);
var string = err.toString()
RES.error = false
RES.error_msg = "ok"
RES.test = string;
//RES.data = found;
res.json(RES)
return;
}
if (stdout) {
var string = stdout.toString()
RES.error = false
RES.error_msg = "ok"
RES.test = 'ok';
RES.out = string;
//RES.data = found;
res.json(RES)
}else{
var found = 'no'
RES.error = false
RES.error_msg = "ok"
RES.test = 'ok';
RES.out = string;
//RES.data = found;
res.json(RES)
}
});
});
app.get('/hybrid_rmall', (req, res, next) => {
// docker rmi $(docker image ls -q) -f; docker container prune -f; docker image prune -f; docker volume prune -f
@ -1034,19 +1209,6 @@ app.get('/getmountinfo', (req, res, next) => {
if (stdout) {
var string = stdout.toString()
var datajson = JSON.parse(string);
//console.log(JSON.stringify(string))
//console.log(JSON.stringify(datajson))
//var extenderror = new RegExp(RES.instance);
/*
var found = 'no';
for(var i = 0; i < datajson.length; i++) {
var servicename = datajson[i].Names
console.log(JSON.stringify(servicename))
if(extenderror.test(servicename)){
found = 'yes';
}
}
*/
RES.error = false
RES.error_msg = "ok"
RES.test = datajson;
@ -1066,6 +1228,96 @@ app.get('/getmountinfo', (req, res, next) => {
});
app.get('/hybrid_inspectnetworks', (req, res, next) => {
var mypath1 = process.cwd()
var RES = new Object();
RES.instance = req.query["instance"]
var showexec = `docker network inspect --format='{{json .}}' ${RES.instance} | jq . -s`
exec(showexec, (err, stdout, stderr) => {
if (err) {
console.error(`exec error: ${err}`);
return;
}
if (stdout) {
var string = stdout.toString()
var datajson = JSON.parse(string);
RES.error = false
RES.error_msg = "ok"
RES.test = datajson;
res.json(RES)
}else{
var found = 'no'
RES.error = false
RES.error_msg = "ok"
RES.test = 'no info';
res.json(RES)
}
});
});
app.get('/hybrid_inspectcontainer', (req, res, next) => {
var mypath1 = process.cwd()
var RES = new Object();
RES.instance = req.query["instance"]
var showexec = `docker inspect --format='{{json .}}' ${RES.instance} | jq . -s`
exec(showexec, (err, stdout, stderr) => {
if (err) {
console.error(`exec error: ${err}`);
return;
}
if (stdout) {
var string = stdout.toString()
var datajson = JSON.parse(string);
RES.error = false
RES.error_msg = "ok"
RES.test = datajson;
res.json(RES)
}else{
var found = 'no'
RES.error = false
RES.error_msg = "ok"
RES.test = 'no info';
res.json(RES)
}
});
});
app.get('/hybrid_inspectimages', (req, res, next) => {
var mypath1 = process.cwd()
var RES = new Object();
RES.instance = req.query["instance"]
var showexec = `docker image inspect --format='{{json .}}' ${RES.instance} | jq . -s`
exec(showexec, (err, stdout, stderr) => {
if (err) {
console.error(`exec error: ${err}`);
return;
}
if (stdout) {
var string = stdout.toString()
var datajson = JSON.parse(string);
RES.error = false
RES.error_msg = "ok"
RES.test = datajson;
res.json(RES)
}else{
var found = 'no'
RES.error = false
RES.error_msg = "ok"
RES.test = 'no info';
res.json(RES)
}
});
});
app.get('/getserviceshybridstatus', (req, res, next) => {
var RES = new Object();

17
src/components/mynetwork.vue
View File

@ -23,6 +23,19 @@
<docker-images>
</docker-images>
<br>
<br>
<br>
<hr>
<div class="row text-center">
<div class="col-12">
<b>View and Manage your local networks</b>
</div>
</div>
<hr>
<docker-networks>
</docker-networks>
</div>
<div class="col-5 order-last" >
@ -42,6 +55,7 @@ import ViewNetwork from "./mynetwork/mytable.vue";
import AdhocView from "./mynetwork/AdhocView.vue";
import DockerServices from "./mynetwork/dockerservices.vue";
import DockerImages from "./mynetwork/images.vue";
import DockerNetworks from "./mynetwork/networks.vue";
import card from '@/components/Card.vue'
//import AvailableServices from "./mynetwork/availableservices.vue";
export default {
@ -50,7 +64,8 @@ export default {
AdhocView,
card,
DockerServices,
DockerImages
DockerImages,
DockerNetworks
// AvailableServices
},
data () {

22
src/components/mynetwork/availablepoc.vue
View File

@ -308,12 +308,14 @@ export default {
},
mounted() {
this.$root.$on('hybrid_refresh_availableservices_poc', () => {
Vue.nextTick( () => this.$refs.vuetable.refresh())
//Vue.nextTick( () => this.$refs.vuetable.refresh())
this.refreshVuetable()
})
//refresh from socket mytable
this.$root.$on('hybrid_refresh_table_poc', (v) => {
this.$nextTick(function () {
Vue.nextTick( () => this.$refs.vuetable.refresh())
// Vue.nextTick( () => this.$refs.vuetable.refresh())
this.refreshVuetable()
this.viewhybridoptions = false
this.$wait.end('myRunInstancetutorpoc');
})
@ -393,7 +395,8 @@ export default {
'filter': this.searchFor,
'type': this.selected
}
Vue.nextTick( () => this.$refs.vuetable.refresh())
//Vue.nextTick( () => this.$refs.vuetable.refresh())
this.refreshVuetable()
},
resetFilter () {
this.moreParams = {}
@ -402,7 +405,8 @@ export default {
'filter': '',
'type': 'scripts'
}
Vue.nextTick( () => this.$refs.vuetable.refresh())
//Vue.nextTick( () => this.$refs.vuetable.refresh())
this.refreshVuetable()
},
onPaginationData (paginationData) {
this.$refs.pagination.setPaginationData(paginationData)
@ -510,7 +514,8 @@ export default {
})
//console.log('RUN 1 '+ JSON.stringify(data.swarmlabname))
Vue.nextTick( () => this.$refs.vuetable.refresh())
//Vue.nextTick( () => this.$refs.vuetable.refresh())
this.refreshVuetable()
}
},
async rmStorageAndClose(action){
@ -534,11 +539,11 @@ export default {
var value = this.hybridoptions.swarmlabname
this.$root.$emit('hybrid_stop_instance_poc', value)
Vue.delete(this.testactionrowindex, this.hybridoptions.index)
Vue.nextTick( () => this.$refs.vuetable.refresh())
//Vue.nextTick( () => this.$refs.vuetable.refresh())
this.refreshVuetable()
}else {
console.log('no')
}
this.refreshVuetable()
},
async checkHybridoptions(){
var storage = this.hybridoptions.swarmlabname
@ -558,7 +563,8 @@ export default {
value.port = this.hybridoptions.port
this.$root.$emit('hybrid_start_instance_poc', value)
Vue.set(this.testactionrowindex, value.swarmlabname, value.index)
Vue.nextTick( () => this.$refs.vuetable.refresh())
//Vue.nextTick( () => this.$refs.vuetable.refresh())
this.refreshVuetable()
},
refreshVuetable() {

30
src/components/mynetwork/dockerservices.vue
View File

@ -85,6 +85,11 @@
class="ti-more btn btn-outline-secondary btn-sm"
round
@click="onAction('run-more', props.rowData, props.rowIndex)">
</button>
<button
class="ti-info btn btn-outline-info btn-sm"
round
@click="onAction('view-item', props.rowData, props.rowIndex)">
</button>
</div>
</vuetable>
@ -205,7 +210,7 @@ export default {
title: 'Actions',
titleClass: 'center aligned',
dataClass: 'center aligned',
width: '5%'
width: '10%'
}
],
apiurl:ApiConfig.url_80+"/dockerservices",
@ -329,6 +334,29 @@ export default {
console.log('index '+JSON.stringify(data))
//console.log('index '+this.actionrowindex)
if(action == 'view-item' ){
var log = await store.dispatch("pipelineLLO/hybrid_inspectcontainer",{
token:this.token,
instance:data.ID
})
//console.log('index '+JSON.stringify(log.data.test[0]))
var info='<h5>Instance Info <b> '+ data.Names +'</b> <br> id: ' + data.ID+ '<br></h5>'
info += '<div class="overflow-auto" style="width:100%;height:450px;"><samp>'+ JSON.stringify(log.data.test[0]) +'</samp></div>'
this.$swal({
type: 'Info',
title: 'Info!',
icon:'warning',
html: info,
showCloseButton: true,
showLoaderOnConfirm: false,
allowOutsideClick: false,
cancelButtonText: 'No, cancel!',
showCancelButton: false,
showLoaderOnConfirm: false,
reverseButtons: true,
focusCancel: true,
confirmButtonText: 'Ok!'
})
}else if(action == 'delete-item' ){
this.$swal({
type: 'info',

37
src/components/mynetwork/images.vue
View File

@ -110,6 +110,11 @@
class="ti-trash btn btn-outline-secondary btn-sm"
round
@click="onAction('rm-item', props.rowData, props.rowIndex)">
</button>
<button
class="ti-info btn btn-outline-secondary btn-sm"
round
@click="onAction('info-item', props.rowData, props.rowIndex)">
</button>
</div>
</vuetable>
@ -208,7 +213,7 @@ export default {
name: 'CreatedSince',
sortField: 'CreatedSince',
titleClass: 'center aligned',
dataClass: 'left aligned w-25',
dataClass: 'left aligned w-20',
visible:true,
width: '10%'
},
@ -230,7 +235,7 @@ export default {
title: 'Actions',
titleClass: 'center aligned',
dataClass: 'center aligned',
width: '5%'
width: '10%'
}
],
apiurl:ApiConfig.url_80+"/dockerimages",
@ -383,7 +388,7 @@ export default {
action:rmimages
})
this.$wait.end('myRunInstancedockerimages');
console.log(JSON.stringify(log))
//console.log(JSON.stringify(log))
if(log.data.error == 'no'){
if(rmimages != 'images'){
var info='<h5> <div class="overflow-auto">' + log.data.out + '</div></h5>'
@ -429,9 +434,31 @@ export default {
this.actionrowindex = index
this.image2rm = data
//this.$root.$emit('hybrid_show_info',data)
console.log('rm '+JSON.stringify(data))
//console.log('rm '+JSON.stringify(data))
//console.log('index '+this.actionrowindex)
if(action == 'info-item' ){
var log = await store.dispatch("pipelineLLO/hybrid_inspectimages",{
token:this.token,
instance:this.image2rm.ID
})
//console.log('index '+JSON.stringify(log.data.test[0]))
var info='<h5>Image Info <b> '+ data.Repository +'</b> <br> id: ' + data.ID+ '<br></h5>'
info += '<samp class="overflow-auto">'+ JSON.stringify(log.data.test[0]) +'</samp>'
this.$swal({
type: 'Info',
title: 'Info!',
icon:'warning',
html: info,
showCloseButton: true,
showLoaderOnConfirm: false,
allowOutsideClick: false,
cancelButtonText: 'No, cancel!',
showCancelButton: false,
showLoaderOnConfirm: false,
reverseButtons: true,
focusCancel: true,
confirmButtonText: 'Ok!'
})
}else if(action == 'rm-item' ){
var info = 'test'
/*
@ -480,7 +507,7 @@ export default {
})
if(log.data.test != 'ok'){
console.log('-------' + JSON.stringify(log.data.test))
//console.log('-------' + JSON.stringify(log.data.test))
var info='<h5> ' + log.data.test + '</h5>'
this.$swal({
type: 'Info',

29
src/components/mynetwork/mytable.vue
View File

@ -670,9 +670,6 @@ export default {
instance:this.hybridshowdata.Names
})
var pocmypathtmp = log.data.mypath
//console.log('log--poc--- ' + pocmypath)
//console.log('log111111111111111---------- ' + JSON.stringify(log))
var container_bash = '/bin/sh'
var container_user = false
var swarmlabinstance = new RegExp("^(hybrid-|HYBRID-)");
@ -684,11 +681,9 @@ export default {
// -----
var swarmlabinstance1c = new RegExp("(/poc-|/POC-)");
var pocurl = 'no'
//console.log('log---------- ' + JSON.stringify(this.hybridshowdata))
var myNetwork = this.hybridshowdata.Networks.split('_')
var pocmypath = pocmypathtmp + myNetwork[0]
//console.log('log---imypath ok------- ' + JSON.stringify(pocmypath))
if(swarmlabinstance1c.test(this.hybridshowdata.Image)){
var swarmlabinstance1cd = new RegExp("(->)");
if(swarmlabinstance1cd.test(this.hybridshowdata.Ports)){
@ -698,11 +693,22 @@ export default {
if(swarmlabinstance1ce.test(this.hybridshowdata.Names)){
pocurl = 'http://localhost:'+splitcd1[0]+'/?token='+this.token
}
//console.log('log1a---------- ' + pocurl)
//console.log('log1---------- ' + JSON.stringify(this.hybridshowdata))
}
//container_user = true
}
// -----
var swarmlabinstance1ca = new RegExp("(microservice-codeserver)");
var pocurlcodeserver = 'no'
if(swarmlabinstance1ca.test(this.hybridshowdata.Names)){
//console.log('stringify--1------- ' + JSON.stringify(this.hybridshowdata.Names));
var swarmlabinstance1cda = new RegExp("(->)");
if(swarmlabinstance1cda.test(this.hybridshowdata.Ports)){
var splitcda = this.hybridshowdata.Ports.split(':')
var splitcd1a = splitcda[1].split('-')
pocurlcodeserver = 'http://localhost:'+splitcd1a[0]+'/?token='+this.token
}
}
//console.log('stringify--------- ' + JSON.stringify(pocurlcodeserver));
// -----
var swarmlabinstance = new RegExp("^(hybrid-|HYBRID-)");
if(swarmlabinstance.test(this.hybridshowdata.Names)){
@ -734,6 +740,13 @@ if(pocurl != 'no'){
info +='</p>'
}
if(pocurlcodeserver != 'no'){
info +='<p class="text-info">'
info += '<a href="'+pocurlcodeserver+'" target="_blank">Click here to open the Web_App</a>'
info +='</p>'
}
var pocmypathinfo = ''
if(pocmypath != ''){

603
src/components/mynetwork/networks.vue
View File

@ -0,0 +1,603 @@
<template>
<card class="card-user" style="max-height:100%">
<v-wait for="myRunInstancedockerimages1a">
<template slot="waiting">
<div>
<img src="@/assets/loading.gif" />
Clear ...
</div>
</template>
</v-wait>
<b-container fluid class="bv-example-row">
<div class="input-group input-group-sm sm-3">
<div class="input-group-append">
<button
class="btn btn-outline-success"
round
type="button"
@click="setRefresh">
Refresh networks</button>
</div>
<input type="text"
class="form-control"
aria-label="Small" aria-describedby="inputGroup-sizing-sm"
placeholder="Search by Name"
v-model="searchFor"
@keyup.enter="setFilter"
>
<div class="input-group-append">
<button
class="btn btn-outline-primary"
round
type="button"
@click="setFilter">
Go</button>
</div>
<div class="input-group-append">
<button class="btn btn-outline-secondary"
round
type="button"
@click="resetFilter">
Reset</button>
</div>
</div>
<div class="white h-100 flex-fixed-width-item"
<vuetable
ref="vuetable"
:key="vuetablekeybnetworks1"
:api-url='apiurl'
:api-mode="true"
:http-options="httpOptions"
:fields="fields"
:item-actions="itemActions"
:sort-order="sortOrder"
:show-sort-icons="true"
:multi-sort="multiSort"
:per-page="perpage"
pagination-path="links.pagination"
:pagination-component="paginationComponent"
:append-params="moreParams"
wrapper-class="vuetable-wrapper"
loading-class="loading"
detail-row-id="id"
@vuetable:pagination-data="onPaginationData"
@vuetable:load-success="loadsuccess"
@vuetable:load-error="onLoadError"
:css="css.table"
>
<div slot="actions" slot-scope="props">
<button
class="ti-trash btn btn-outline-secondary btn-sm"
round
@click="onAction('rm-item', props.rowData, props.rowIndex)">
</button>
<button
class="ti-info btn btn-outline-secondary btn-sm"
round
@click="onAction('info-item', props.rowData, props.rowIndex)">
</button>
</div>
</vuetable>
<div class="vuetable-pagination ui basic segment grid">
<vuetable-pagination-info
ref="paginationInfo"
:css="css.paginationInfo"
>
</vuetable-pagination-info>
<vuetable-pagination
:css="css.pagination"
ref="pagination"
@vuetable-pagination:change-page="onChangePage"
>
</vuetable-pagination>
</div>
</div>
</b-container>
</card>
</template>
<script>
import store from '@/store/index'
import {mapState, mapGetters, mapActions,dispatch} from 'vuex'
import Vue from 'vue'
import {Vuetable, VuetablePaginationDropdown} from 'vuetable-2'
import VuetablePaginationInfo from 'vuetable-2/src/components/VuetablePaginationInfo'
import VuetablePagination from 'vuetable-2/src/components/VuetablePagination'
import CssConfig from 'vuetable-2/src/components/VuetableCssConfig.js'
import card from '@/components/Card.vue'
import {ApiConfig} from "@/config/index";
export default {
components: {
card,
Vuetable,
VuetablePagination,
VuetablePaginationInfo,
VuetablePaginationDropdown
},
props: {
},
data() {
return{
actionrowindex:'',
playbookInfo: {},
rmactionclear: '',
image2rm: {},
token: '',
playbook: {
'title':'',
'name':'',
'description':''
},
container:{
name:'',
view:0
},
pipeline:{},
selected: 'hybrid',
options: [
{ text: 'Packages', value: 'packages' },
{ text: 'Images', value: 'images' },
{ text: 'Scripts', value: 'scripts' }
],
showModal: false,
visibility: [],
active:false,
vuetablekeybnetworks1:0,
fielddata:{},
fields: [
{
name: 'ID',
title: '<span class="orange"></span>Network id',
//sortField: 'ID',
visible:true,
dataClass: 'text-left text-wrap text-break break-word',
width: '15%'
},
{
name: 'Name',
title: '<span class="orange"></span>Name',
sortField: 'Name',
visible:true,
dataClass: 'left aligned w-25',
width: '30%'
},
{
name: 'Driver',
//sortField: 'Tag',
titleClass: 'center aligned',
dataClass: 'left aligned w-20',
visible:true,
width: '5%'
},
{
name: 'CreatedAt',
sortField: 'CreatedAt',
titleClass: 'center aligned',
dataClass: 'left aligned w-25',
visible:true,
width: '10%'
},
{
name: '_id',
title: '<span class="orange"></span>mongo',
visible:false
},
{
name: 'Scope',
title: '<span class="orange"></span>Scope',
sortField: 'Scope',
titleClass: 'center aligned',
visible:true,
width: '5%'
},
{
name: '__slot:actions', // <----
title: 'Actions',
titleClass: 'center aligned',
dataClass: 'center aligned',
width: '10%'
}
],
apiurl:ApiConfig.url_80+"/dockernetworks",
//apiurl:ApiConfig.swarmlab_url_80+"/swarmlabhybridservices",
css: CssConfig,
perpage: 5,
searchFor: '',
sortOrder: [{
field: 'Names',
direction: 'asc'
}],
multiSort: true,
paginationComponent: 'vuetable-pagination',
itemActions: [
{ name: 'view-item', label: '', icon: 'glyphicon glyphicon-zoom-in', class: 'btn btn-info', extra: {'title': 'View', 'data-toggle':"tooltip", 'data-placement': "left"} },
{ name: 'edit-item', label: '', icon: 'glyphicon glyphicon-pencil', class: 'btn btn-warning', extra: {title: 'Edit', 'data-toggle':"tooltip", 'data-placement': "top"} },
{ name: 'delete-item', label: '', icon: 'glyphicon glyphicon-remove', class: 'btn btn-danger', extra: {title: 'Delete', 'data-toggle':"tooltip", 'data-placement': "right" } }
],
moreParams: {
'filter': '',
'type': 'scripts',
'tutor': 'yes'
},
}
},
mounted() {
this.$root.$on('hybrid_refresh_networktable', () => {
//this.setFilter()
//this.$refs.vuetable.refresh()
Vue.nextTick( () => this.$refs.vuetable.refresh())
this.refreshVuetable()
})
this.$root.$on('hybrid_refresh_dockerservices', () => {
//this.setFilter()
//this.$refs.vuetable.refresh()
Vue.nextTick( () => this.$refs.vuetable.refresh())
this.refreshVuetable()
})
//refresh from socket mytable
this.$root.$on('hybrid_refresh_table', (v) => {
this.$nextTick(function () {
Vue.nextTick( () => this.$refs.vuetable.refresh())
this.viewhybridoptions = false
})
})
},
created() {
var url_string = window.location.href
var url = new URL(url_string);
this.token = url.searchParams.get("token");
//console.log("token "+ this.token);
},
beforeDestroy () {
this.$root.$off('hybrid_refresh_networktable')
this.$root.$off('hybrid_refresh_dockerservices')
this.$root.$off('hybrid_refresh_table')
},
computed: {
httpOptions() {
var token = this.token
var p="headers: {Authorization: token}}"; //table props -> :http-options="httpOptions"
return {headers: {Authorization: 'Bearer ' + token}} //table props -> :http-options="httpOptions"
},
},
methods: {
onError (type,description) {
var winfo=description
var info='<h5>Bootstrap '+type+'</h5>'
this.$swal({
type: type,
html: info+winfo,
showCloseButton: true,
showLoaderOnConfirm: false,
allowOutsideClick: false,
cancelButtonText: 'No, cancel!',
showCancelButton: false,
showLoaderOnConfirm: false,
reverseButtons: true,
focusCancel: true,
confirmButtonText: 'Ok!'
})
},
setRefresh () {
this.moreParams = {
'filter': '',
'type': this.selected
}
Vue.nextTick( () => this.$refs.vuetable.refresh())
},
setFilter () {
this.moreParams = {
'filter': this.searchFor,
'type': this.selected
}
Vue.nextTick( () => this.$refs.vuetable.refresh())
},
resetFilter () {
this.moreParams = {}
this.searchFor = ''
Vue.nextTick( () => this.$refs.vuetable.refresh())
},
onPaginationData (paginationData) {
this.$refs.pagination.setPaginationData(paginationData)
this.$refs.paginationInfo.setPaginationData(paginationData)
},
onChangePage (page) {
this.$refs.vuetable.changePage(page)
},
editRow(rowData) {
alert("You clicked edit on"+ JSON.stringify(rowData));
},
// **************************************************************
// ************ rm all ***********************************
// **************************************************************
async rmall_i (action) {
this.rmactionclear = action
var info='<h5>This will remove all unused ' + action +' from system. </h5>'
this.$swal({
type: 'Info',
title: 'Info!',
icon:'warning',
html: info,
showCloseButton: true,
showLoaderOnConfirm: false,
allowOutsideClick: false,
cancelButtonText: 'No, cancel!',
showCancelButton: true,
showLoaderOnConfirm: false,
reverseButtons: true,
focusCancel: true,
confirmButtonText: 'Ok!'
}).then((result)=> {
//console.log(JSON.stringify(result))
this.onActionHybrid_containerrmall(result);
})
},
async onActionHybrid_containerrmall(action) {
// myRunInstancedockerimages1a
var rmimages = this.rmactionclear
if(action.isConfirmed){
this.$wait.start('myRunInstancedockerimages1a');
var log = await store.dispatch("pipelineLLO/hybrid_rmall",{
token:this.token,
action:rmimages
})
this.$wait.end('myRunInstancedockerimages1a');
//console.log(JSON.stringify(log))
if(log.data.error == 'no'){
if(rmimages != 'images'){
var info='<h5> <div class="overflow-auto">' + log.data.out + '</div></h5>'
this.$swal({
type: 'Info',
title: 'Info!',
icon:'info',
html: info,
showCloseButton: true,
showLoaderOnConfirm: false,
allowOutsideClick: false,
//cancelButtonText: 'No, cancel!',
showCancelButton: false,
showLoaderOnConfirm: false,
reverseButtons: true,
focusCancel: false,
confirmButtonText: 'Ok!'
})
}else{
Vue.nextTick( () => this.$refs.vuetable.refresh())
}
}else{
var info='<h5> ' + log.data.error_msg + '</h5>'
this.$swal({
type: 'Info',
title: 'Error!',
icon:'error',
html: info,
showCloseButton: true,
showLoaderOnConfirm: false,
allowOutsideClick: false,
//cancelButtonText: 'No, cancel!',
showCancelButton: false,
showLoaderOnConfirm: false,
reverseButtons: true,
focusCancel: false,
confirmButtonText: 'Ok!'
})
}
}
},
async onAction (action, data, index) {
this.actionrowindex = index
this.image2rm = data
//this.$root.$emit('hybrid_show_info',data)
//console.log('rm '+JSON.stringify(data))
if(action == 'info-item' ){
var log = await store.dispatch("pipelineLLO/hybrid_inspectnetworks",{
token:this.token,
instance:this.image2rm.ID
})
//console.log('index '+JSON.stringify(log.data.test[0]))
var info='<h5>Network Info <b> '+ data.Name +'</b> <br> id: ' + data.ID+ '<br></h5>'
info += '<samp class="overflow-auto">'+ JSON.stringify(log.data.test[0]) +'</samp>'
this.$swal({
type: 'Info',
title: 'Info!',
icon:'warning',
html: info,
showCloseButton: true,
showLoaderOnConfirm: false,
allowOutsideClick: false,
cancelButtonText: 'No, cancel!',
showCancelButton: false,
showLoaderOnConfirm: false,
reverseButtons: true,
focusCancel: true,
confirmButtonText: 'Ok!'
})
}else if(action == 'rm-item' ){
var info = 'test'
/*
this.$swal({
type: 'info',
html: info,
showCloseButton: true,
showLoaderOnConfirm: false,
allowOutsideClick: false,
cancelButtonText: 'No, cancel!',
showCancelButton: true,
showLoaderOnConfirm: false,
reverseButtons: true,
focusCancel: true,
confirmButtonText: 'Yes, Delete it!'
})
*/
var info='<h5>This will remove network <b> '+ data.Name +'</b> <br> id: ' + data.ID+ '<br></h5>'
this.$swal({
type: 'Info',
title: 'Info!',
icon:'warning',
html: info,
showCloseButton: true,
showLoaderOnConfirm: false,
allowOutsideClick: false,
cancelButtonText: 'No, cancel!',
showCancelButton: true,
showLoaderOnConfirm: false,
reverseButtons: true,
focusCancel: true,
confirmButtonText: 'Ok!'
}).then((result)=> {
//console.log(JSON.stringify(result))
this.onActionHybrid_imagerm(result);
})
}else if(action == 'run-item' ){
}
},
async onActionHybrid_imagerm(action) {
if(action.isConfirmed){
var log = await store.dispatch("pipelineLLO/hybrid_rmnetworks",{
token:this.token,
instance:this.image2rm.ID
})
if(log.data.test != 'ok'){
//console.log('-------' + JSON.stringify(log.data.test))
var info='<h5> ' + log.data.test + '</h5>'
this.$swal({
type: 'Info',
title: 'Error!',
icon:'error',
html: info,
showCloseButton: true,
showLoaderOnConfirm: false,
allowOutsideClick: false,
//cancelButtonText: 'No, cancel!',
showCancelButton: false,
showLoaderOnConfirm: false,
reverseButtons: true,
focusCancel: false,
confirmButtonText: 'Ok!'
})
}
//console.log(JSON.stringify(this.image2rm))
Vue.nextTick( () => this.$refs.vuetable.refresh())
}
},
refreshVuetable() {
this.$nextTick(()=>{
this.vuetablekeybnetworks1 += 1
})
},
playbookinfoShow(value) {
return this.visibility[value]=true
},
playbookinfo(value) {
return this.playbookInfo=value
},
rowClicked(row, event) {
return {
html: true,
title: () => { return 'Hello <b>Popover:</b> ' + (++this.counter) },
content: () => { return 'The date is:<br><em>' + new Date() + '</em>' }
}
},
loadsuccess(response) {
var data = response.data.data
this.fielddata=data
var n = data.length
n=n-1
},
onLoadError(payload) {
/*
//error2 "invalid_token" join-service.vue:684
//error2 "The access token provided has expired" join-service.vue:685
//error2 "Unauthorized" join-service.vue:686
//error2 401
console.log('error2 '+JSON.stringify(payload.response.data.error))
console.log('error2 '+JSON.stringify(payload.response.data.error_description))
console.log('error2 '+JSON.stringify(payload.response.statusText))
console.log('error2 '+JSON.stringify(payload.response.status))
*/
if(payload.response.status == '401'){
window.location.href = 'https://api-login.swarmlab.io:8089';
Vue.nextTick( () => window.location.href = 'https://api-login.swarmlab.io:8089')
}
}
},
actions: {
}
};
</script>
<style>
.flex-fixed-width-item {
flex: 0 0 100px;
}
.modalinfo {
z-index: 10000000 !important;
position:fixed;
}
/* a container with flex-direction column */
.vue-notifyjs.notifications{
.alert{
z-index: 100;
}
.list-move {
transition: transform 0.3s, opacity 0.4s;
}
.list-item {
display: inline-block;
margin-right: 10px;
}
.list-enter-active {
transition: transform 0.2s ease-in, opacity 0.4s ease-in;
}
.list-leave-active {
transition: transform 1s ease-out, opacity 0.4s ease-out;
}
.list-enter {
opacity: 0;
transform: scale(1.1);
}
.list-leave-to {
opacity: 0;
transform: scale(1.2, 0.7);
}
}
pre {
//background-color: rgb(255, 247, 229);
background-color: #eff0f1;
border: 1px solid blue;
//white-space: pre-line;
}
</style>

2
src/main.js
View File

@ -27,7 +27,7 @@ var socketurl = ApiConfig.url_80;
const socket = io(socketurl, {
autoConnect: false,
reconnection: true,
reconnectionDelay: 500,
reconnectionDelay: 3000,
maxReconnectionAttempts: Infinity,
pingInterval: 25000,
pingTimeout: 60000,

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

@ -398,6 +398,130 @@ export default {
return R;
}
}
},
async hybrid_rmnetworks({commit,rootGetters}, value) {
//console.log('value '+JSON.stringify(value))
try {
var token = value.token
var params = {
instance: value.instance
}
var options = {
params: params,
headers: { 'content-type': 'application/x-www-form-urlencoded',Authorization: `Bearer ${token}` },
};
var sock_server_l = ApiConfig.url_80+'/hybrid_rmnetworks'
var p = await axios.get(sock_server_l,options);
//var p = await axios.get('https://localhost:3000/getservicesinfo',options);
return p
//console.log(JSON.stringify(p))
//console.log(value.token)
//console.log(value.swarmlabname)
} catch (e) {
if(e.message == "Request failed with status code 401" || /401/i.test(e.message)){
//console.log('error '+JSON.stringify(e))
window.location.href = 'https://api-login.swarmlab.io:8089';
}else{
var R = {
ERROR_str: e,
ERROR: 'yes'
}
return R;
}
}
},
async hybrid_inspectnetworks({commit,rootGetters}, value) {
//console.log('value '+JSON.stringify(value))
try {
var token = value.token
var params = {
instance: value.instance
}
var options = {
params: params,
headers: { 'content-type': 'application/x-www-form-urlencoded',Authorization: `Bearer ${token}` },
};
var sock_server_l = ApiConfig.url_80+'/hybrid_inspectnetworks'
var p = await axios.get(sock_server_l,options);
//var p = await axios.get('https://localhost:3000/getservicesinfo',options);
return p
//console.log(JSON.stringify(p))
//console.log(value.token)
//console.log(value.swarmlabname)
} catch (e) {
if(e.message == "Request failed with status code 401" || /401/i.test(e.message)){
//console.log('error '+JSON.stringify(e))
window.location.href = 'https://api-login.swarmlab.io:8089';
}else{
var R = {
ERROR_str: e,
ERROR: 'yes'
}
return R;
}
}
},
async hybrid_inspectimages({commit,rootGetters}, value) {
//console.log('value '+JSON.stringify(value))
try {
var token = value.token
var params = {
instance: value.instance
}
var options = {
params: params,
headers: { 'content-type': 'application/x-www-form-urlencoded',Authorization: `Bearer ${token}` },
};
var sock_server_l = ApiConfig.url_80+'/hybrid_inspectimages'
var p = await axios.get(sock_server_l,options);
//var p = await axios.get('https://localhost:3000/getservicesinfo',options);
return p
//console.log(JSON.stringify(p))
//console.log(value.token)
//console.log(value.swarmlabname)
} catch (e) {
if(e.message == "Request failed with status code 401" || /401/i.test(e.message)){
//console.log('error '+JSON.stringify(e))
window.location.href = 'https://api-login.swarmlab.io:8089';
}else{
var R = {
ERROR_str: e,
ERROR: 'yes'
}
return R;
}
}
},
async hybrid_inspectcontainer({commit,rootGetters}, value) {
//console.log('value '+JSON.stringify(value))
try {
var token = value.token
var params = {
instance: value.instance
}
var options = {
params: params,
headers: { 'content-type': 'application/x-www-form-urlencoded',Authorization: `Bearer ${token}` },
};
var sock_server_l = ApiConfig.url_80+'/hybrid_inspectcontainer'
var p = await axios.get(sock_server_l,options);
//var p = await axios.get('https://localhost:3000/getservicesinfo',options);
return p
//console.log(JSON.stringify(p))
//console.log(value.token)
//console.log(value.swarmlabname)
} catch (e) {
if(e.message == "Request failed with status code 401" || /401/i.test(e.message)){
//console.log('error '+JSON.stringify(e))
window.location.href = 'https://api-login.swarmlab.io:8089';
}else{
var R = {
ERROR_str: e,
ERROR: 'yes'
}
return R;
}
}
},
async hybrid_rmall({commit,rootGetters}, value) {
//console.log('value '+JSON.stringify(value))

Write Preview
Loading…
Cancel
Save