Browse Source

add poc version 1

master
zeus 3 years ago
parent
commit
bbc860ded3
  1. 2
      dist/css/app.5311f292.css
  2. 2
      dist/index.html
  3. 2
      dist/js/app.52520ba2.js
  4. 1
      dist/js/app.52520ba2.js.map
  5. 2
      dist/js/app.6e97b28f.js
  6. 1
      dist/js/app.6e97b28f.js.map
  7. 151
      src-local/llo/new.js
  8. 21
      src/App.vue
  9. 72
      src/components/manageservices/calendarview.vue
  10. 662
      src/components/mynetwork/availablepoc.vue
  11. 31
      src/components/mynetwork/mytable.vue
  12. 70
      src/components/proofofconcept.vue
  13. 54
      src/store/modules/create_pipelineLLO.js

2
dist/css/app.10423c10.css → dist/css/app.5311f292.css

File diff suppressed because one or more lines are too long

2
dist/index.html

@ -1 +1 @@
<!DOCTYPE html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Vue App</title><link href="/css/app.10423c10.css" rel="preload" as="style"><link href="/css/chunk-vendors.e469b508.css" rel="preload" as="style"><link href="/js/app.6e97b28f.js" rel="preload" as="script"><link href="/js/chunk-vendors.d8d18fe6.js" rel="preload" as="script"><link href="/css/chunk-vendors.e469b508.css" rel="stylesheet"><link href="/css/app.10423c10.css" rel="stylesheet"></head><body><div id="app"></div><script src="/js/chunk-vendors.d8d18fe6.js"></script><script src="/js/app.6e97b28f.js"></script></body></html>
<!DOCTYPE html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Vue App</title><link href="/css/app.5311f292.css" rel="preload" as="style"><link href="/css/chunk-vendors.e469b508.css" rel="preload" as="style"><link href="/js/app.52520ba2.js" rel="preload" as="script"><link href="/js/chunk-vendors.d8d18fe6.js" rel="preload" as="script"><link href="/css/chunk-vendors.e469b508.css" rel="stylesheet"><link href="/css/app.5311f292.css" rel="stylesheet"></head><body><div id="app"></div><script src="/js/chunk-vendors.d8d18fe6.js"></script><script src="/js/app.52520ba2.js"></script></body></html>

2
dist/js/app.52520ba2.js

File diff suppressed because one or more lines are too long

1
dist/js/app.52520ba2.js.map

File diff suppressed because one or more lines are too long

2
dist/js/app.6e97b28f.js

File diff suppressed because one or more lines are too long

1
dist/js/app.6e97b28f.js.map

File diff suppressed because one or more lines are too long

151
src-local/llo/new.js

@ -957,7 +957,6 @@ app.get('/getbuildstatus', (req, res, next) => {
});
app.get('/getstoragestatus', (req, res, next) => {
var RES = new Object();
RES.instance = req.query["instance"]
var showfile = `./instance/${RES.instance}/swarmlabconfig/instance`
@ -971,9 +970,7 @@ app.get('/getstoragestatus', (req, res, next) => {
console.log(JSON.stringify(err))
res.json(RES)
}else{
data = data.trim();
var showexec = `docker ps --format '{"Names":"{{ .Names }}", "Status":"{{.Status}}"}' | jq . -s `
exec(showexec, (err, stdout, stderr) => {
if (err) {
@ -1009,6 +1006,48 @@ app.get('/getstoragestatus', (req, res, next) => {
});
app.get('/getpocstatus', (req, res, next) => {
var RES = new Object();
RES.instance = req.query["instance"]
var runpath = `./instance/${RES.instance}`
var found = 'no'
RES.error = false
RES.error_msg = "ok"
//RES.errorm = "Following_services_are_not_running:";
RES.data = "All_services_are_running";
var showexec = `./check-services.sh`
exec(showexec, {cwd: runpath}, (err, stdout, stderr) => {
if (err) {
return;
}
if (stdout) {
var string = stdout.toString()
//var datajson = JSON.parse(string);
var extenderror = new RegExp(RES.data);
var found = 'no';
var servicename = string
if(extenderror.test(servicename)){
found = 'yes';
}
RES.error = false
RES.error_msg = "ok"
RES.test = string;
RES.data = found;
res.json(RES)
}else{
var found = 'no'
RES.error = false
RES.error_msg = "ok"
RES.data = found;
res.json(RES)
}
});
});
app.get('/getlogs', (req, res, next) => {
var RES = new Object();
@ -1357,6 +1396,32 @@ app.get('/rm_swarmlabstorage', (req, res, next) => {
});
app.get('/rm_swarmlabpoc', (req, res, next) => {
var mypath = process.cwd()
var RES = new Object();
RES.instance = req.query["instance"]
var services_path = './instance/'+RES.instance
docker_image_rm(mypath, RES.instance);
fs.rm(services_path, {
recursive: true,
force: true
}, (error) => {
if (error) {
RES.error = true
RES.path = mypath
RES.error_msg = "no"
res.json(RES)
} else {
RES.error = false
RES.path = mypath
RES.error_msg = "ok"
res.json(RES)
}
});
});
app.get('/get_config', (req, res, next) => {
var mypath = process.cwd()
@ -1777,6 +1842,59 @@ SWARMLAB_STORAGE_PASSWORD=${service_password}
}
});
socket.on('start_poc', (value) => {
if(value.swarmlabname){
var service = value.swarmlabname
var services_path = './instance/'+service
var ENV_service_file_path = services_path+'/.env'
var service_password = ''
if(value.password){
service_password = value.password
}else{
service_password = Math.random().toString(36).substring(7);
}
var ENV_service_file = `
SWARMLAB_STORAGE_PASSWORD=${service_password}
`
fs.writeFileSync(ENV_service_file_path, ENV_service_file ,{encoding:'utf8',flag:'a'});
var service_up = '/bin/bash ./run.sh'
child[0] = spawn(service_up, {
shell: true,
cwd: services_path,
//detached: true,
detached: false,
//stdio: [ 'ignore', logout, logerr ]
stdio: 'pipe'
});
ppid = child[0].pid;
//console.log(ppid)
child[0].stdout.on('data', function (data) {
var n = {}
n.data = data.toString()
io.emit('message_out_poc', n);
});
child[0].stderr.on('data', function (data) {
var n = {}
n.data = data.toString()
io.emit('message_err_poc', n);
});
child[0].on('close', function (code) {
var n = {}
n.data = code
io.emit('message_close_poc', n);
});
}else{
var n = {}
n.data = 'NoSwarmlabname'
io.emit('message_err_poc', n);
}
});
socket.on('stop', (service) => {
var services_path = './instance/'+service+'/'+service
@ -1831,6 +1949,33 @@ SWARMLAB_STORAGE_PASSWORD=${service_password}
});
});
socket.on('stop_poc', (service) => {
var services_path = './instance/'+service
//console.log(services_path)
const stop = spawn('/bin/sh ./stop.sh', {
stdio: 'pipe',
shell: true,
cwd: services_path
});
stop.stdout.on('data', function (data) {
var n = {}
n.data = data.toString()
io.emit('message_out_poc', n);
});
stop.stderr.on('data', function (data) {
var n = {}
n.data = data.toString()
io.emit('message_err_poc', n);
});
stop.on('close', function (code) {
var n = {}
n.data = code
io.emit('message_close_poc', n);
});
});
socket.on('install', (value) => {
if(value.swarmlabname){
//console.log('install')

21
src/App.vue

@ -268,6 +268,7 @@
<b-list-group-item variant="light" name="Container" class="ti-harddrive m-subm-listgroup list-group-item list-group-item-action" v-on:click="setActive('private','hybrid_private')" style="cursor: pointer;" :class="{ active: isActiveSub('hybrid_private') }" @click="hybrid('services')"> LabRoom</b-list-group-item>
<b-list-group-item variant="light" name="Storage" class="ti-server m-subm-listgroup list-group-item list-group-item-action" v-on:click="setActive('private','hybrid_storage')" style="cursor: pointer;" :class="{ active: isActiveSub('hybrid_storage') }" @click="hybrid('storage')"> Storage</b-list-group-item>
<b-list-group-item variant="light" name="Microservice" class="ti-cloud m-subm-listgroup list-group-item list-group-item-action" v-on:click="setActive('private','hybrid_microservice')" style="cursor: pointer;" :class="{ active: isActiveSub('hybrid_microservice') }" @click="hybrid('microservice')"> MicroServices</b-list-group-item>
<b-list-group-item variant="light" name="Proof_of_concept" class=" ti-light-bulb m-subm-listgroup list-group-item list-group-item-action" v-on:click="setActive('private','hybrid_proofofconcept')" style="cursor: pointer;" :class="{ active: isActiveSub('hybrid_proofofconcept') }" @click="hybrid('proofofconcept')"> Proof_of_concept</b-list-group-item>
</b-collapse>
@ -354,6 +355,7 @@
<b-list-group-item variant="light" name="Container" class="ti-harddrive m-subm-listgroup list-group-item list-group-item-action" v-on:click="setActive('private','hybrid_private')" style="cursor: pointer;" :class="{ active: isActiveSub('hybrid_private') }" @click="hybrid('services')" title="LabRoom"> </b-list-group-item>
<b-list-group-item variant="light" name="Storage" class="ti-server m-subm-listgroup list-group-item list-group-item-action" v-on:click="setActive('private','hybrid_storage')" style="cursor: pointer;" :class="{ active: isActiveSub('hybrid_storage') }" @click="hybrid('storage')" title="Storage"> </b-list-group-item>
<b-list-group-item variant="light" name="Microservice" class="ti-cloud m-subm-listgroup list-group-item list-group-item-action" v-on:click="setActive('private','hybrid_microservice')" style="cursor: pointer;" :class="{ active: isActiveSub('hybrid_microservice') }" @click="hybrid('microservice')" title="Microservices"> </b-list-group-item>
<b-list-group-item variant="light" name="Proof_of_concept" class="ti-light-bulb m-subm-listgroup list-group-item list-group-item-action" v-on:click="setActive('private','hybrid_proofofconcept')" style="cursor: pointer;" :class="{ active: isActiveSub('hybrid_proofofconcept') }" @click="hybrid('proofofconcept')" title="Proof_of_concept"> </b-list-group-item>
</b-collapse>
@ -498,6 +500,19 @@
<!-- ------ hybrid manage microservices --------------- -->
<!-- ----------------------------------- -->
<!-- ----------------------------------- -->
<!-- ------ hybrid manage proofofconcept --------------- -->
<!-- ----------------------------------- -->
<manage-proofofconcept
:key="componentKeyreload4"
v-show="hybridmenou == 'proofofconcept'"
style="background-color: #f8f9fa"
>
</manage-proofofconcept>
<!-- ----------------------------------- -->
<!-- ------ hybrid manage proofofconcept --------------- -->
<!-- ----------------------------------- -->
<!-- ----------------------------------- -->
<!-- ------ hybrid manage builders --------------- -->
<!-- ----------------------------------- -->
@ -602,6 +617,7 @@ import ServicesTable from "./components/myservices.vue";
import ManageServices from "./components/manageservices.vue";
import ManageStorage from "./components/mystorage.vue";
import ManageMicroservices from "./components/mymicroservices.vue";
import ManageProofofconcept from "./components/proofofconcept.vue";
import ManageBuilders from "./components/mybuild.vue";
import ManageDeploy from "./components/managedeploy.vue";
import ManageLlo from "./components/managello.vue";
@ -618,6 +634,7 @@ export default {
ManageServices,
ManageStorage,
ManageMicroservices,
ManageProofofconcept,
ManageBuilders,
ManageDeploy,
ManageLlo
@ -629,6 +646,7 @@ export default {
componentKeyreload1:1,
componentKeyreload2:1,
componentKeyreload3:1,
componentKeyreload4:1,
componentKeybuilders:1,
setStatusAgent:'',
issocket:false, //socket server
@ -699,6 +717,7 @@ export default {
this.componentKeyreload1 += 1
this.componentKeyreload2 += 1
this.componentKeyreload3 += 1
this.componentKeyreload4 += 1
this.componentKeybuilders += 1
}
},
@ -740,6 +759,8 @@ export default {
//this.$root.$emit('hybrid_manage_service')
}else if(action == 'microservice'){
//this.$root.$emit('hybrid_manage_service')
}else if(action == 'proofofconcept'){
//this.$root.$emit('hybrid_manage_service')
}else if(action == 'manage_deploy'){
}
},

72
src/components/manageservices/calendarview.vue

@ -1,7 +1,76 @@
<template>
<div id="appcalendar" >
<div class="calendar-parent">
<h1>Welcome to Swarmlab!</h1>
<span>
Swarmlab provides the user with the unique abillity to <strong>create Labrooms</strong> (or other applications) and <strong>share</strong> them as project images expanding the simple ideas to full-blown systems.
</span>
<div class="toc-menu">
<br>
<h3><a href="http://docs.swarmlab.io/SwarmLab-HowTos/swarmlab/docs/swarmlab/docs/quickstart/overview.html" target="_blank">This is where your wondeful journey in the vast world of Swarmlab begins</a></h3>
<br>
<div class="sect1">
<div class="sectionbody">
<div class="ulist">
<ul>
<li>
<p>you are a <strong>teacher</strong> and want to prepare your lesson</p>
<div class="ulist">
<ul>
<li>
<p>create exercises and examples</p>
</li>
<li>
<p>share them with your students</p>
</li>
</ul>
</div>
</li>
<li>
<p>you are a <strong>student</strong> and want to try your newly acquired knowledge on some project</p>
</li>
<li>
<p>you are a <strong>Developer</strong> and would like to denug your application or a real world senario</p>
<div class="ulist">
<ul>
<li>
<p>you want to provide POC</p>
</li>
</ul>
</div>
</li>
<li>
<p>you are a <strong>user</strong> and just want to try out stuff</p>
<div class="ulist">
<ul>
<li>
<p>you want to play around with examples but are too scared to do so on your system</p>
</li>
</ul>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<h3><a href="https://git.swarmlab.io:3000/docs/Documentation" target="_blank">See what you can do with swarmlab Docs</a></h3>
<!--
<calendar-view
:items="items"
:show-date="showDate"
@ -35,6 +104,7 @@
@input="setShowDate"
/>
</calendar-view>
-->
</div>
</div>

662
src/components/mynetwork/availablepoc.vue

@ -0,0 +1,662 @@
<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="myRunInstancetutorpoc">
<template slot="waiting">
<div>
<img src="@/assets/loading.gif" />
Enter Lab_room storage...
</div>
</template>
</v-wait>
<div class="row text-center">
<div class="col-12">
<b>Swarmlab <span class="text-info">Proof_of_concept</span> Deploy - Local </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>POC Service Options</b>
</span>
</b-col>
</div>
<div class="input-group-append"
v-if="viewhybridoptions"
>
<button class="btn btn-outline-secondary"
round
type="button"
>
Admin </button>
<input type="text"
class="form-control"
aria-label="Small" aria-describedby="inputGroup-sizing-sm"
placeholder="New Password"
v-model="hybridoptions.password"
>
<button class="btn btn-outline-success"
round
type="button"
@click="checkHybridoptions"
>
Up</button>
</div>
<div class="white h-100 flex-fixed-width-item"
<vuetable
ref="vuetable"
:key="vuetablekeypoc"
: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="actionsenabled" slot-scope="props">
<div class="d-flex justify-content-center">
<button
v-if="testactionrowindex[props.rowData.swarmlabname] == props.rowIndex"
class="ti-thumb-up btn btn-info btn-sm"
title="Stop Lab_Instance"
round
@click="onAction('down-item', props.rowData, props.rowIndex)"
>
</button>
<button
v-if="testactionrowindex[props.rowData.swarmlabname] != props.rowIndex && testactionrowindex[props.rowIndex] == props.rowIndex"
class="ti-thumb-down btn btn-secondary 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">
<button
v-if="testactionrowindex[props.rowIndex] == props.rowIndex && testactionrowindex[props.rowData.swarmlabname] != props.rowIndex"
class="ti-trash btn btn-info btn-sm"
title="Remove Lab_Instance"
@click="onAction('delete-item', props.rowData, props.rowIndex)"
round
>
</button>
</div>
</div>
<div slot="actions" slot-scope="props">
<div class="d-flex justify-content-center">
<button
v-if="checkactionrowindex(props.rowData,props.rowIndex)"
class="ti-cloud-down btn btn-outline-secondary btn-sm"
title="Download Lab_Instance"
round
@click="onAction('run-install', props.rowData, props.rowIndex)">
</button>
<button
class="ti-info btn btn-outline-secondary btn-sm"
title="Lab_Instance Info"
round
@click="onAction('view-item', props.rowData, props.rowIndex)">
</button>
</div>
</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{
testactionrowindex:[], // downloaded used in installed
teststatusindex:[], // status stop run used in status
hybridoptions: {
'index':'',
'swarmlabname':'',
'password':'',
'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,
vuetablekeypoc:0,
fielddata:{},
fields: [
{
name: 'swarmlabname',
title: '<span class="orange"></span>Name',
sortField: 'swarmlabname',
visible:true,
dataClass: 'left aligned col-3',
width: '68%'
},
{
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:actionslocal', // <----
title: 'Installed',
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+"/swarmlabhybridpoc",
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_poc', () => {
Vue.nextTick( () => this.$refs.vuetable.refresh())
})
//refresh from socket mytable
this.$root.$on('hybrid_refresh_table_poc', (v) => {
this.$nextTick(function () {
Vue.nextTick( () => this.$refs.vuetable.refresh())
this.viewhybridoptions = false
this.$wait.end('myRunInstancetutorpoc');
})
})
},
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_poc')
this.$root.$off('hybrid_refresh_table_poc')
},
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/getpocstatus', obj)
if(res1.data.data == 'yes'){
Vue.set(this.testactionrowindex, data.swarmlabname, index)
}else{
Vue.delete(this.testactionrowindex, data.swarmlabname)
}
}else{
var obj = {}
obj.token = this.token
obj.instance = data.swarmlabname
var res = await store.dispatch('pipelineLLO/getservicesinfo', obj)
if(res.data.data == 'yes'){
Vue.set(this.testactionrowindex, index, index)
var res1 = await store.dispatch('pipelineLLO/getpocstatus', obj)
if(res1.data.data == 'yes'){
Vue.set(this.testactionrowindex, data.swarmlabname, index)
}else{
Vue.delete(this.testactionrowindex, data.swarmlabname)
}
}else{
console.log('resi NO1 '+JSON.stringify(res))
}
}
},
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));
},
async onAction (action, data, index) {
if(action == 'view-item' ){
this.swarmlab=data
var container=this.swarmlab
var res = await store.dispatch('pipelineLLO/getswarmlabstorageinfo', container.swarmlabname)
var swarmlab1=JSON.stringify(res.data.swarmlab, null ,2)
var swarmlab1info=JSON.stringify(res.data.swarmlabinfo, null ,2)
var swarmlab1info=res.data.swarmlabinfo
var description='<div style="height: 250px; overflow-y: scroll;"><p><pre><code class="codeblock">'+swarmlab1+'</code></pre></p></div>'
if(res.data.error25=="ok"){
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.hybridoptions.swarmlabname = data.swarmlabname
var info='<h5>This will remove the storage with the name<b> '+ data.swarmlabname +'</b> </h5><br>'
var storage = this.hybridoptions.swarmlabname
var winfo=''
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!'
}).then((result)=> {
this.rmStorageAndClose(result);
})
//Vue.nextTick( () => this.$refs.vuetable.refresh())
this.refreshVuetable()
}else if(action == 'run-install' ){
this.$wait.start('myRunInstancetutorpoc');
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/getswarmlabpocinfo', value.swarmlabname)
var swarmlab1info=res.data.swarmlabinfo
value.git = swarmlab1info
this.$root.$emit('hybrid_install_instance_storage', value)
this.$wait.end('myRunInstancetutorpoc');
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())
}else if(action == 'down-item' ){
this.hybridoptions.swarmlabname = data.swarmlabname
this.hybridoptions.index = index
var info = "Stop and remove storage: containers, networks, images, and volumes"
this.$swal({
type: 'info',
html: 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 rmStorageAndClose(action){
if(action.isConfirmed){
//this.hybridoptions.swarmlabname = data.swarmlabname
this.$wait.start('myRunInstancetutorpoc');
var res = await store.dispatch('pipelineLLO/rmswarmlablocalpoc', this.hybridoptions.swarmlabname)
this.$wait.end('myRunInstancetutorpoc');
//Vue.nextTick( () => this.$refs.vuetable.refresh())
Vue.delete(this.testactionrowindex, this.hybridoptions.swarmlabname)
this.refreshVuetable()
this.$root.$emit('hybrid_refresh_info_deploy_local')
//console.log('inf res '+ JSON.stringify(res))
}
},
async rmAndClose(result){
if (result.isConfirmed) {
this.$wait.start('myRunInstancetutorpoc');
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())
}else {
console.log('no')
}
this.refreshVuetable()
},
async checkHybridoptions(){
var storage = this.hybridoptions.swarmlabname
var myaction = {}
myaction.isConfirmed = 'true'
this.setHybridoptions(myaction)
},
async setHybridoptions(action){
this.$wait.start('myRunInstancetutorpoc');
//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.password = this.hybridoptions.password
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())
},
refreshVuetable() {
this.$nextTick(()=>{
this.vuetablekeypoc += 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>

31
src/components/mynetwork/mytable.vue

@ -342,6 +342,15 @@ export default {
this.$socket.client.open();
this.$socket.client.emit('start_storage', obj);
})
this.$root.$on('hybrid_start_instance_poc', (data) => {
var obj = {}
obj.action = 'up'
obj.token = this.token
obj.swarmlabname = data.swarmlabname
obj.password = data.password
this.$socket.client.open();
this.$socket.client.emit('start_poc', obj);
})
// build
this.$root.$on('SERVER_build_image', (obj) => {
this.$socket.client.open();
@ -400,6 +409,13 @@ export default {
//this.onAction('stop')
this.$socket.client.emit('stop_storage', data);
})
// from available poc socket run here
this.$root.$on('hybrid_stop_instance_poc', (data) => {
//this.swarmlabname = data
//console.log('RUN exec '+JSON.stringify(this.swarmlabname))
//this.onAction('stop')
this.$socket.client.emit('stop_poc', data);
})
},
created() {
var url_string = window.location.href
@ -996,6 +1012,21 @@ info +='This permits the docker user on the local machine to connect to X window
this.$root.$emit('hybrid_log_in',val)
this.$root.$emit('hybrid_refresh_table_storage')
},
// poc
async message_err_poc(val) {
//console.log(" socket err "+JSON.stringify(val))
this.$root.$emit('hybrid_log_in',val)
},
async message_out_poc(val) {
// console.log(" socket out storage "+JSON.stringify(val))
this.$root.$emit('hybrid_log_in',val)
//this.hybridshowdata = {}
},
async message_close_poc(val) {
// refresh table hybrid storage
this.$root.$emit('hybrid_log_in',val)
this.$root.$emit('hybrid_refresh_table_poc')
},
async message_close_build(val) {
// refresh table hybrid storage
this.$root.$emit('SERVER_build_closebuild',val)

70
src/components/proofofconcept.vue

@ -0,0 +1,70 @@
<template>
<card class="card-user" style="max-height:100%">
<div class="row" >
<div class="col-7 order-first " >
<br>
<!--
<view-network>
</view-network>
-->
<available-poc
:key="componentKeyreloadpoc"
>
</available-poc>
</div>
<div class="col-5 order-last" >
<br>
<adhoc-view>
</adhoc-view>
</div>
</div>
</card>
</template>
<script>
import {mapState, mapGetters, mapActions} from 'vuex'
//import ViewNetwork from "./mynetwork/mytable.vue";
import AdhocView from "./mynetwork/AdhocView.vue";
import card from '@/components/Card.vue'
//import DockerServices from "./mynetwork/dockerservices.vue";
//import AvailableServices from "./mynetwork/availableservices.vue";
import AvailablePoc from "./mynetwork/availablepoc.vue";
export default {
components: {
// ViewNetwork,
AdhocView,
card,
// DockerServices,
AvailablePoc
},
data () {
return {
componentKeyreloadpoc:1,
loading: false,
consoleView: 'off',
productIndex: 1
}
},
mounted() {
this.$root.$on('hybrid_refresh_info_deploy_local', () => {
this.componentKeyreloadpoc += 1
})
},
beforeDestroy () {
this.$root.$off('hybrid_refresh_info_deploy_local')
},
created () {
}
};
</script>
<style>
</style>

54
src/store/modules/create_pipelineLLO.js

@ -658,6 +658,34 @@ export default {
return R;
}
}
},
async getpocstatus({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+'/getpocstatus'
var p = await axios.get(sock_server_l,options);
//var p = await axios.get('https://localhost:3000/getservicesstatus',options);
return p
} 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 create_config({commit,rootGetters}, value) {
//console.log('value '+JSON.stringify(value))
@ -719,7 +747,7 @@ export default {
}
},
async rmswarmlablocalstorage({commit,rootGetters}, value) {
async rmswarmlablocalpoc({commit,rootGetters}, value) {
//console.log('value '+JSON.stringify(value))
try {
@ -731,7 +759,7 @@ export default {
params: params,
headers: { 'content-type': 'application/x-www-form-urlencoded',Authorization: `Bearer ${token}` },
};
var sock_server_l = ApiConfig.url_80+'/rm_swarmlabstorage'
var sock_server_l = ApiConfig.url_80+'/rm_swarmlabpoc'
var p = await axios.get(sock_server_l,options);
//var p = await axios.get('https://localhost:3000/get_config',options);
return p
@ -961,6 +989,28 @@ export default {
const info = await axios.get('https://api.swarmlab.io/getswarmlabhybridstorageinfo',options);
return info
} catch (e) {
//console.error(e);
if(e.error == "invalid_token"){
window.location.href = 'https://api-login.swarmlab.io:8089';
}
}
},
async getswarmlabpocinfo({commit,rootGetters}, value) {
try {
var token = rootGetters['pipelineLLO/gettoken']
//console.log('token ' + token)
var params = {
swarmlabname: value
}
var options = {
params: params,
headers: { 'content-type': 'application/x-www-form-urlencoded',Authorization: `Bearer ${token}` },
};
const info = await axios.get('https://api.swarmlab.io/getswarmlabhybridpocinfo',options);
return info
} catch (e) {
//console.error(e);
if(e.error == "invalid_token"){

Loading…
Cancel
Save