< template >
< card class = "card-user" style = "max-height:100%" >
< div class = "author" >
< img class = "avatar border-white" src = "@/assets/img/docker.png" alt = "..." >
< / div >
< b -container fluid class = "bv-example-row" >
< v -wait for = "myRunInstancetutor" >
< template slot = "waiting" >
< div >
< img src = "@/assets/loading.gif" / >
Enter Lab_room ...
< / div >
< / template >
< / v - w a i t >
< div class = "row text-center" >
< div class = "col-12" >
< b > < span class = "text-muted" > Swarmlab < / span > < span class = "text-info" > LabRoom < / span > - < span class = "text-muted" > Deploy @ Home < / span > < / b >
< / div >
< / div >
< br >
< div class = "input-group input-group-sm sm-3" >
< input type = "text"
class = "form-control"
aria - label = "Small" aria - describedby = "inputGroup-sizing-sm"
placeholder = "Search"
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 = "row"
v - if = "viewhybridoptions"
>
< b -col class = "text-center" cols = "12" sm = "12" md = "12" >
< span >
< b > Lab Service Options < / b >
< / span >
< / b - c o l >
< / div >
< div class = "input-group-append input-group-sm sm-3"
v - if = "viewhybridoptions"
>
< button class = "btn btn-success btn-sm"
v - if = "startservice"
round
type = "button"
@ click = "setHybridoptions"
>
Start < / button >
< button class = "btn btn-warning btn-sm"
v - else
round
type = "button"
@ click = "stopservice"
>
Stop < / button >
< input type = "text"
class = "form-control text-info"
aria - label = "Small" aria - describedby = "inputGroup-sizing-sm"
disabled
v - model = "up_name"
>
< input type = "text"
class = "form-control"
aria - label = "Small" aria - describedby = "inputGroup-sizing-sm"
placeholder = "Number of Instances"
v - model = "hybridoptions.size"
>
<!--
< button class = "btn btn-outline-secondary btn-sm"
round
type = "button"
>
Port < / button >
< input type = "text"
class = "form-control"
aria - label = "Small" aria - describedby = "inputGroup-sizing-sm"
placeholder = "Expose Port"
v - model = "hybridoptions.port"
>
-- >
< button
v - if = "startservice"
class = " btn btn-outline-danger btn-sm"
title = "Remove Lab_Instance"
@ click = "onAction('rm-install', hybridoptions, hybridoptions._id)"
round
>
Remove
< / button >
< button
v - else
class = " btn btn-outline-danger btn-sm"
title = "Remove Lab_Instance"
round
disabled
>
Remove
< / button >
< / div >
< div class = "white h-100 flex-fixed-width-item"
< vuetable id = "idvuetablekeya"
ref = "vuetable"
: key = "vuetablekeya"
: 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 : row - clicked = "rowClicked"
@ vuetable : pagination - data = "onPaginationData"
@ vuetable : load - success = "loadsuccess"
@ vuetable : load - error = "onLoadError"
: css = "css.table"
>
< div slot = "actionsenabled" slot -scope = " props " >
< div class = "d-flex justify-content-center" >
<!--
< button
v - if = "testactionrowindex[props.rowData.swarmlabname] == props.rowIndex"
class = "ti-arrow-up btn text-success btn-sm "
title = "Stop Lab_Instance"
round
@ click = "onAction('down-item', props.rowData, props.rowIndex)"
>
< / button >
-- >
< button
class = " btn btn-sm text-muted"
round
v - if = "testactionrowindex[props.rowData.swarmlabname] == props.rowData._id"
>
< span class = "text-success" > Running ... < / span >
< / button >
< button
v - else
class = " btn btn-sm text-muted"
round
> < span class = "text-success" > & nbsp ; < / span > < / button >
<!--
< button
v - if = "testactionrowindex[props.rowData.swarmlabname] != props.rowIndex && testactionrowindex[props.rowIndex] == props.rowIndex"
class = "ti-arrow-down btn btn-sm"
title = "Start Lab_Instance"
round
@ click = "onAction('run-item', props.rowData, props.rowIndex)"
>
< / button >
-- >
< / div >
< / div >
< div slot = "actionslocal" slot -scope = " props " >
< div class = "d-flex justify-content-center" >
<!--
v - if = "testactionrowindex[props.rowData._id] == props.rowData._id && testactionrowindex[props.rowData.swarmlabname] != props.rowData._id"
-- >
< button
v - if = "testactionrowindex[props.rowData._id] == props.rowData._id "
class = "ti-check btn btn-sm text-success"
title = "Remove Lab_Instance"
round
>
< / button >
<!--
@ click = "onAction('rm-install', props.rowData, props.rowIndex)"
-- >
< / div >
< / div >
< div slot = "actions" slot -scope = " props " >
< div class = "d-flex justify-content-center" >
< button
v - if = "checkactionrowindex(props.rowData,props.rowData._id)"
class = "ti-cloud-down btn btn-sm text-muted"
title = "Download Lab_Instance"
round
@ click = "onAction('run-install', props.rowData, props.rowData._id)" >
< / button >
< button
class = "ti-info btn btn-sm text-muted"
title = "Lab_Instance Info"
round
@ click = "onAction('view-item', props.row, props.row._id)" >
< / button >
< / div >
< / div >
< / vuetable >
< div class = "vuetable-pagination ui basic segment grid" >
< vuetable -pagination -info
ref = "paginationInfo"
: css = "css.paginationInfo"
>
< / v u e t a b l e - p a g i n a t i o n - i n f o >
< vuetable -pagination
: css = "css.pagination"
ref = "pagination"
@ vuetable - pagination : change - page = "onChangePage"
>
< / v u e t a b l e - p a g i n a t i o n >
< / div >
< / div >
< / b - c o n t a i n e r >
< / 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 {
startservice : true ,
swarmlabinfonow : false ,
up_name : '' ,
removelabroom : false ,
testactionrowindex : [ ] , // downloaded used in installed
teststatusindex : [ ] , // status stop run used in status
hybridoptions : {
'index' : '' ,
'swarmlabname' : '' ,
'size' : '' ,
'port' : ''
} ,
viewhybridoptions : false ,
swarmlab : { } ,
playbookInfo : { } ,
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 ,
vuetablekeya : 0 ,
fielddata : { } ,
fields : [
{
name : '__slot:actionslocal' , // <----
title : '' ,
titleClass : 'center' ,
dataClass : 'center alignedi text-success' ,
width : '5%'
} ,
{
name : 'swarmlabname' ,
title : '<span class="orange"></span>Labroom' ,
sortField : 'swarmlabname' ,
visible : true ,
dataClass : 'left aligned col-3 text-muted' ,
width : '68%' ,
callback : function ( value ) {
var tmp = value . split ( '-' )
var v = tmp [ 1 ]
return v
}
} ,
{
name : '_id' ,
title : '<span class="orange"></span>mongo' ,
visible : false
} ,
{
name : 'description' ,
sortField : 'gitrepoCloneUrl' ,
titleClass : 'center aligned' ,
dataClass : 'left aligned w-25' ,
visible : false ,
width : '15%'
} ,
{
name : 'gitrepoFullName' ,
sortField : 'gitrepoFullName' ,
titleClass : 'center aligned' ,
dataClass : 'left aligned w-25' ,
visible : false ,
width : '15%'
} ,
{
name : '__slot:actionsenabled' , // <----
title : 'Status' ,
titleClass : 'center' ,
dataClass : 'center aligned' ,
width : '5%'
} ,
{
name : '__slot:actions' , // <----
title : 'Download' ,
titleClass : 'col text-center' ,
dataClass : 'center aligned' ,
width : '10%'
} ,
] ,
apiurl : ApiConfig . swarmlab_url_80 + "/swarmlabhybridservices" ,
css : CssConfig ,
perpage : 5 ,
searchFor : '' ,
sortOrder : [ {
field : 'pipelinename' ,
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'
} ,
}
} ,
mounted ( ) {
this . $root . $on ( 'hybrid_refresh_availableservices' , ( ) => {
Vue . nextTick ( ( ) => this . $refs . vuetable . refresh ( ) )
} )
//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_availableservices' )
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!'
} )
} ,
async checkactionrowindex ( data , index ) {
if ( this . testactionrowindex [ index ] == index ) {
var obj = { }
obj . token = this . token
obj . instance = data . swarmlabname
var res1 = await store . dispatch ( 'pipelineLLO/getservicesstatus' , obj )
//console.log('res8 all '+JSON.stringify(res1))
if ( res1 . data . data == 'yes' ) {
Vue . set ( this . testactionrowindex , data . swarmlabname , index )
//console.log('res8 YES '+JSON.stringify(res1.data))
} else {
//console.log('res8 NO '+JSON.stringify(res1.data))
Vue . delete ( this . testactionrowindex , data . swarmlabname )
}
//console.log('is set '+index)
} else {
//console.log('not set '+index)
var obj = { }
obj . token = this . token
obj . instance = data . swarmlabname
var res = await store . dispatch ( 'pipelineLLO/getservicesinfo' , obj )
if ( res . data . data == 'yes' ) {
//console.log('resi YES '+JSON.stringify(res))
Vue . set ( this . testactionrowindex , index , index )
var res1 = await store . dispatch ( 'pipelineLLO/getservicesstatus' , obj )
//console.log('res8 all '+JSON.stringify(res1))
if ( res1 . data . data == 'yes' ) {
Vue . set ( this . testactionrowindex , data . swarmlabname , index )
//console.log('res8 YES '+JSON.stringify(res1.data))
} else {
//console.log('res8 NO '+JSON.stringify(res1.data))
Vue . delete ( this . testactionrowindex , data . swarmlabname )
}
//console.log('resiiiiiiii yes '+JSON.stringify(this.testactionrowindex[index]))
} else {
//Vue.delete(this.testactionrowindex, index)
//console.log('resi NO data '+JSON.stringify(res))
console . log ( 'resi NO data ' )
}
}
} ,
setFilter ( ) {
this . moreParams = {
'filter' : this . searchFor ,
'type' : this . selected
}
Vue . nextTick ( ( ) => this . $refs . vuetable . refresh ( ) )
} ,
resetFilter ( ) {
this . moreParams = { }
this . searchFor = ''
this . moreParams = {
'filter' : '' ,
'type' : 'scripts'
}
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 ) ) ;
} ,
async onAction ( action , data , index ) {
if ( action == 'view-item' ) {
this . swarmlabinfonow = true
this . swarmlab = data
var container = this . swarmlab
/ *
var res = await store . dispatch ( 'pipelineLLO/getswarmlabinfo' , container . swarmlabname )
var swarmlab1 = JSON . stringify ( res . data . swarmlab , null , 2 )
var swarmlab1info = JSON . stringify ( res . data . swarmlabinfo , null , 2 )
* /
var swarmlab1info = ` https://git.swarmlab.io:3000/swarmlab/ ${ container . swarmlabname } `
var description = '<div style="height: 250px; overflow-y: scroll;"><p><pre><code class="codeblock">' + swarmlab1info + '</code></pre></p></div>'
var winfo = ''
var info = '<h5>Swarmlab Service <a href="' + swarmlab1info + '" target="_blank" >Info</a></h5>(Open page in new window)'
this . $swal ( {
type : 'info' ,
html : info + winfo ,
showCloseButton : true ,
showLoaderOnConfirm : false ,
allowOutsideClick : false ,
showLoaderOnConfirm : false ,
reverseButtons : true ,
focusCancel : true
} )
} else if ( action == 'delete-item' ) {
this . $swal ( {
type : 'info' ,
html : info + winfo ,
icon : 'info' ,
showCloseButton : true ,
showLoaderOnConfirm : false ,
allowOutsideClick : false ,
cancelButtonText : 'No, cancel!' ,
showCancelButton : true ,
showLoaderOnConfirm : false ,
reverseButtons : true ,
focusCancel : true ,
confirmButtonText : 'Yes, Delete it!'
} )
//Vue.nextTick( () => this.$refs.vuetable.refresh())
this . refreshVuetable ( )
} else if ( action == 'rm-install' ) {
var info = ` <h5> Labroom: <b> ${ this . hybridoptions . swarmlabname } </b> </h5> `
info += "<br>Remove containers, networks, images, and volumes"
this . $swal ( {
type : 'info' ,
html : info ,
icon : 'info' ,
showCloseButton : true ,
showLoaderOnConfirm : false ,
allowOutsideClick : false ,
cancelButtonText : 'No, cancel!' ,
showCancelButton : true ,
showLoaderOnConfirm : false ,
reverseButtons : true ,
focusCancel : false ,
confirmButtonText : 'Yes!'
} ) . then ( ( result ) => {
if ( result . isConfirmed ) {
( async ( ) => {
console . log ( 'remove' )
this . hybridoptions . swarmlabname = data . swarmlabname
this . $wait . start ( 'myRunInstancetutor' ) ;
var res = await store . dispatch ( 'pipelineLLO/rmswarmlablocal' , this . hybridoptions . swarmlabname )
this . $wait . end ( 'myRunInstancetutor' ) ;
var obj = { }
obj . token = this . token
obj . instance = data . swarmlabname
//check if exists
var res2 = await store . dispatch ( 'pipelineLLO/getservicesinfo' , obj )
if ( res2 . data . data == 'yes' ) {
if ( res2 . data . data == 'yes' ) {
var winfo = '<h6 class="text-warning"> swarmlab encountered a problem while deleting your labroom files. <br> This propably means that you have created some files while operating the labroom. <br> To remove those files please run the following command as root. </h6> <h5><i>Copy-and-run-command </i></h5><br> '
winfo += '<span class="text-success">sudo rm -rf ' + res . data . path + '/instance/' + data . swarmlabname + ' </span><br><br>'
winfo += '<span class="text-secondary"> You can back up content using: </span><br>'
winfo += '<span class="text-warning">sudo tar -zcvf /home/\$USER/swarmlabbackup_' + data . swarmlabname + '.tar.gz ' + res . data . path + '/instance/' + data . swarmlabname + ' </span>'
var info = '<h5>Labroom remove</h5>'
this . $swal ( {
type : 'info' ,
html : info + winfo ,
icon : 'info' ,
showCloseButton : true ,
showLoaderOnConfirm : false ,
allowOutsideClick : false ,
cancelButtonText : 'No, cancel!' ,
showCancelButton : false ,
showLoaderOnConfirm : false ,
reverseButtons : true ,
focusCancel : true ,
confirmButtonText : 'Ok!'
} )
console . log ( 'inf res11111111111 ' + JSON . stringify ( res . data . path ) )
}
}
//Vue.nextTick( () => this.$refs.vuetable.refresh())
Vue . delete ( this . testactionrowindex , data . swarmlabname )
this . refreshVuetable ( )
this . $root . $emit ( 'hybrid_refresh_info_deploy_local' )
} ) ( ) ;
}
} )
} else if ( action == 'run-install' ) {
this . swarmlabinfonow = true
this . $wait . start ( 'myRunInstancetutor' ) ;
this . hybridoptions . swarmlabname = data . swarmlabname
this . hybridoptions . index = index
let value = { }
value . swarmlabname = this . hybridoptions . swarmlabname
value . index = this . hybridoptions . index
value . size = this . hybridoptions . size
value . port = this . hybridoptions . port
var res = await store . dispatch ( 'pipelineLLO/getswarmlabinfo' , value . swarmlabname )
var swarmlab1info = res . data . swarmlabinfo
value . git = swarmlab1info
//console.log('inf git 1 '+ JSON.stringify(swarmlab1info))
//console.log('inf '+ JSON.stringify(value))
this . $root . $emit ( 'hybrid_install_instance' , value )
this . $wait . end ( 'myRunInstancetutor' ) ;
//Vue.nextTick( () => this.$refs.vuetable.refresh())
this . refreshVuetable ( )
} else if ( action == 'run-item' ) {
this . viewhybridoptions = true
this . hybridoptions . swarmlabname = data . swarmlabname
this . hybridoptions . index = index
/ *
console . log ( 'RUN 1 ' + JSON . stringify ( data . swarmlabname ) )
// run on mytable.vue
this . $root . $emit ( 'hybrid_start_instance' , data . swarmlabname )
Vue . set ( this . testactionrowindex , data . swarmlabname , index )
Vue . nextTick ( ( ) => this . $refs . vuetable . refresh ( ) )
* /
//Vue.nextTick( () => this.$refs.vuetable.refresh())
// this.refreshVuetable()
} else if ( action == 'down-item' ) {
this . hybridoptions . swarmlabname = data . swarmlabname
this . hybridoptions . index = index
var info = ` <h5> Labroom: <b> ${ this . hybridoptions . swarmlabname } </b> </h5> `
info += "<br>Stop and remove containers, networks, images, and volumes"
this . $swal ( {
type : 'info' ,
html : info ,
icon : 'info' ,
showCloseButton : true ,
showLoaderOnConfirm : false ,
allowOutsideClick : false ,
cancelButtonText : 'No, cancel!' ,
showCancelButton : true ,
showLoaderOnConfirm : false ,
reverseButtons : true ,
focusCancel : false ,
confirmButtonText : 'Yes!'
} ) . then ( ( result ) => {
this . rmAndClose ( result ) ;
} )
//console.log('RUN 1 '+ JSON.stringify(data.swarmlabname))
//Vue.nextTick( () => this.$refs.vuetable.refresh())
}
} ,
async rmAndClose ( result ) {
//console.log('value 1 '+ JSON.stringify(result))
//console.log('value 1 '+ JSON.stringify(this.hybridoptions))
if ( result . isConfirmed ) {
//console.log('yes')
// run on mytable.vue
var value = this . hybridoptions . swarmlabname
this . $root . $emit ( 'hybrid_stop_instance' , value )
Vue . delete ( this . testactionrowindex , this . hybridoptions . index )
Vue . nextTick ( ( ) => this . $refs . vuetable . refresh ( ) )
this . refreshVuetable ( )
} else {
console . log ( 'no' )
}
} ,
async setHybridoptions ( ) {
//console.log(JSON.stringify(this.hybridoptions))
//console.log('RUN 1 '+ JSON.stringify(data.swarmlabname))
// run on mytable.vue
let value = { }
value . swarmlabname = this . hybridoptions . swarmlabname
value . index = this . hybridoptions . index
value . size = this . hybridoptions . size
value . port = this . hybridoptions . port
this . $root . $emit ( 'hybrid_start_instance' , value )
Vue . set ( this . testactionrowindex , value . swarmlabname , value . index )
Vue . nextTick ( ( ) => this . $refs . vuetable . refresh ( ) )
} ,
refreshVuetable ( ) {
this . $nextTick ( ( ) => {
this . vuetablekeya += 1
} )
} ,
playbookinfoShow ( value ) {
return this . visibility [ value ] = true
} ,
playbookinfo ( value ) {
return this . playbookInfo = value
} ,
async rowClicked ( row , event ) {
console . log ( row )
console . log ( this . testactionrowindex )
if ( this . testactionrowindex [ row . _id ] == row . _id && this . testactionrowindex [ row . swarmlabname ] != row . _id ) {
if ( ! this . swarmlabinfonow ) {
this . up_name = row . swarmlabname
this . hybridoptions = row
this . startservice = true
console . log ( 'start ' + row . swarmlabname )
await this . onAction ( 'run-item' , row , row . _id )
this . swarmlabinfonow = false
}
} else if ( this . testactionrowindex [ row . _id ] == row . _id && this . testactionrowindex [ row . swarmlabname ] == row . _id ) {
this . up_name = row . swarmlabname
console . log ( 'stop ' + row . swarmlabname )
this . viewhybridoptions = false
this . startservice = false
this . hybridoptions = row
await this . onAction ( 'run-item' , row , row . _id )
//await this.onAction ('down-item', row, row._id)
} else if ( this . testactionrowindex [ row . _id ] != row . _id && this . testactionrowindex [ row . swarmlabname ] != row . _id ) {
console . log ( 'info' )
// -----------------------------
// check installed download it
// -----------------------------
if ( ! this . swarmlabinfonow ) {
var info = ` <h5> Labroom <b> ${ row . swarmlabname } </b> is Not Installed </h5> <br>
< b > Use < / b >
< br >
< br >
< div class = "row" >
< div class = "col-1" >
< button
class = "ti-cloud-down btn btn-outline-secondary btn-sm"
round
>
< / button >
< / div >
< div class = "col-4" >
To Install
< / div >
< div class = "col-1" >
< button
class = "ti-info btn btn-outline-secondary btn-sm"
round
>
< / button >
< / div >
< div class = "col-6" >
For More Information
< / div >
< / div >
`
this . $swal ( {
type : 'info' ,
html : info ,
icon : 'info' ,
showCloseButton : true ,
showLoaderOnConfirm : false ,
allowOutsideClick : false ,
cancelButtonText : 'No, cancel!' ,
showCancelButton : false ,
showLoaderOnConfirm : false ,
reverseButtons : true ,
focusCancel : false ,
confirmButtonText : 'Yes!'
} )
//console.log('not installed ' + row.swarmlabname)
//console.log(this.testtestdir)
}
}
this . swarmlabinfonow = false
} ,
async stopservice ( ) {
this . startservice = false
await this . onAction ( 'down-item' , this . hybridoptions , this . hybridoptions . _id )
} ,
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 >
# idvuetablekeya tr td {
border - left : 0 px solid ;
border - right : 0 px solid ;
padding : 0 px ;
}
# idvuetablekeya tr td {
color : # 2185 d0 ;
cursor : pointer ;
}
. flex - fixed - width - item {
flex : 0 0 100 px ;
}
. 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.3 s , opacity 0.4 s ;
}
. list - item {
display : inline - block ;
margin - right : 10 px ;
}
. list - enter - active {
transition : transform 0.2 s ease - in , opacity 0.4 s ease - in ;
}
. list - leave - active {
transition : transform 1 s ease - out , opacity 0.4 s 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 : 1 px solid blue ;
//white-space: pre-line;
}
< / style >