Browse Source

final-version

master
lefteris 3 years ago
parent
commit
84d3870d99
  1. 17
      Details
  2. 1
      WriteToMongo
  3. 5
      ddocker.sh
  4. 113
      docker-compose.yml
  5. 1
      dummyservice
  6. 22
      fluentd.yml
  7. 32
      mongo.yml
  8. 1
      playground-client
  9. 1
      readmongo
  10. 2
      runw.sh
  11. 5
      terminate_all.sh
  12. 658
      test.vue

17
Details

@ -0,0 +1,17 @@
Uparxei custom css gia to vuetable poy prepei na lifthei upopsin se periptwsh pou treksei
se allo termatiko
// kill docker if container bugs
sudo systemctl restart docker.socket docker.service
docker rm -f <container id>
//kill a process by id
lsof -i:8080
kill $(lsof -t -i:8080)
kill -9 $(lsof -t -i:8080)
fuser 3000/tcp
fuser -k 8080/tcp

1
WriteToMongo

@ -0,0 +1 @@
Subproject commit 5a483700b9463acaa38dc50230515c53aa509521

5
ddocker.sh

@ -0,0 +1,5 @@
sudo rm -rf /var/lib/docker /etc/docker
sudo rm /etc/apparmor.d/docker
sudo groupdel docker
sudo rm -rf /var/run/docker.sock
sudo rm -rf /usr/local/bin/docker-compose

113
docker-compose.yml

@ -0,0 +1,113 @@
version: "3.3"
services:
redisserver:
#image: hub.swarmlab.io:5480/playground-redisserver:latest
container_name: redisserver
depends_on:
- writetomongo
logging:
driver: "fluentd"
options:
fluentd-async-connect: "true"
tag: mongo.redis
image: redis:6.0.9-alpine
ports:
- "6379:6379"
networks:
playground-net:
writetomongo:
image: writemongo:latest
container_name: fluentd
user: root
build: ./WriteToMongo/fluent
volumes:
- ./WriteToMongo/fluent:/fluentd/etc
ports:
- "24224:24224"
- "24224:24224/udp"
networks:
playground-net:
readmongo:
container_name: readmongo_service
restart: always
depends_on:
- writetomongo
logging:
driver: "fluentd"
options:
fluentd-async-connect: "true"
tag: mongo.access
build: ./readmongo
image: readmongo:latest
ports:
- "3000:3000"
volumes:
- ./readmongo:/usr/src/app
links:
- mongo
networks:
playground-net:
# readmongo:
# container_name: readmongo_service
# restart: always
# depends_on:
# - writetomongo
# logging:
# driver: "fluentd"
# options:
# fluentd-async-connect: "true"
# tag: mongo.access
# build: ./readmongo
# image: readmongo:latest
# ports:
# - "3000:3000"
# volumes:
# - ./readmongo:/usr/src/app
# links:
# - mongo
# networks:
# playground-net:
dummy:
container_name: dummy_service
restart: always
depends_on:
- writetomongo
logging:
driver: "fluentd"
options:
fluentd-async-connect: "true"
tag: mongo.dummy
build: ./dummyservice
image: dummyservice:latest
ports:
- "3001:3001"
volumes:
- ./dummyservice:/usr/src/app
links:
- mongo
networks:
playground-net:
# ---- fluentd service ----
mongo:
container_name: mongo
logging:
driver: "fluentd"
options:
fluentd-async-connect: "true"
tag: mongo.mongo
image: mongo
expose:
- 27017
ports:
- "27017:27017"
networks:
playground-net:
volumes:
fluent:
readmongo:
dummy:
networks:
playground-net:

1
dummyservice

@ -0,0 +1 @@
Subproject commit b67f60bbed66e8b4198a549a6600ae11e861bbde

22
fluentd.yml

@ -0,0 +1,22 @@
version: "3.8"
services:
writetomongo:
image: writemongo:latest
container_name: fluentd
user: root
build: ./WriteToMongo/fluent
volumes:
- ./WriteToMongo/fluent:/fluentd/etc
ports:
- "24224:24224"
- "24224:24224/udp"
networks:
playground-net:
volumes:
fluent:
# src:
networks:
playground-net:

32
mongo.yml

@ -0,0 +1,32 @@
version: "3.8"
services:
#fluentd service
writetomongo:
image: writemongo:latest
container_name: fluentd
user: root
build: ./WriteToMongo/fluent
volumes:
- ./WriteToMongo/fluent:/fluentd/etc
ports:
- "24224:24224"
- "24224:24224/udp"
networks:
playground-net:
mongo:
container_name: mongo
image: mongo
expose:
- 27017
ports:
- "27017:27017"
networks:
playground-net:
volumes:
fluent:
# src:
networks:
playground-net:

1
playground-client

@ -0,0 +1 @@
Subproject commit 5be6c5580d704c57798676d2b463ee1eba22e0a8

1
readmongo

@ -0,0 +1 @@
Subproject commit 8a9a6bd8da5cf8fc2850dfa7684bc98e5f043ddf

2
runw.sh

@ -0,0 +1,2 @@
cd playground-client
npm run serve

5
terminate_all.sh

@ -0,0 +1,5 @@
sudo fuser -k 3000/tcp
sudo fuser -k 6379/tcp
sudo fuser -k 27017/tcp
sudo fuser -k 24224/tcp
sudo fuser -k 24224/udp

658
test.vue

@ -0,0 +1,658 @@
<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-wait>
<div class="row text-center">
<div class="col-12">
<b>Swarmlab <span class="text-info">LabRoom</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>Lab Service Options</b>
</span>
</b-col>
</div>
<div class="input-group-append"
v-if="viewhybridoptions"
>
<button class="btn btn-outline-secondary"
round
type="button"
>
Instances </button>
<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"
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 class="btn btn-outline-success"
round
type="button"
@click="setHybridoptions"
>
Up</button>
</div>
<div class="white h-100 flex-fixed-width-item"
<vuetable
ref="vuetable"
:key="vuetablekey"
: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('rm-install', 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':'',
'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,
vuetablekey: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+"/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 '+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/getswarmlabinfo', 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.$swal({
type: 'info',
html: info+winfo,
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' ){
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.$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())
}else if(action == 'down-item' ){
this.hybridoptions.swarmlabname = data.swarmlabname
this.hybridoptions.index = index
var info = "Stop and remove 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 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())
}else {
console.log('no')
}
this.refreshVuetable()
},
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.vuetablekey += 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>
</style>
Loading…
Cancel
Save