<template> <card class="card-user" style="max-height:100%"> <div class="row" > <div :class="`col-1 order-first`" > <button class="btn btn-outline-info btn-sm" round type="button" @click="setnewview(12,0)"> +</button> <button v-show="!consoleview" class="btn btn-warning btn-sm" round type="button" @click="setnewview(7,5)"> -</button> </div> <div :class="`col-10`" > </div> <div :class="`col-1 order-last float-sm-right`" > <button class="btn btn-outline-info btn-sm float-right" round type="button" @click="setnewview(0,12)"> +</button> <button v-show="!consolemicro" class="btn btn-warning btn-sm float-right" round type="button" @click="setnewview(7,5)"> -</button> </div> </div> <div class="divider py-1 "><hr></div> <div class="row" > <div :class="`col-${viewmicroservices} order-first`" > <br> <available-microservices v-show="consolemicro" :key="componentKeyreloadservice5" > </available-microservices> </div> <div :class="`col-${viewconsole} order-last`" > <br> <!-- <adhoc-view v-show="consoleview" > </adhoc-view> --> <available-mymicroservices> </available-mymicroservices> </div> </div> <div class="divider py-1 "><hr></div> <div class="row" > <div :class="`col-12 order-first`" > <br> <adhoc-view v-show="showconsole" > </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 AvailableMicroservices from "./mynetwork/availablemicroservices.vue"; import AvailableMymicroservices from "./mynetwork/availablemicroservicescustom.vue"; export default { components: { AvailableMymicroservices, AdhocView, card, // DockerServices, AvailableMicroservices }, data () { return { viewmicroservices: 7, viewconsole: 5, consoleview: true, consolemicro: true, showconsole: true, componentKeyreloadservice5:1, loading: false, consoleView: 'off', productIndex: 1 } }, mounted() { this.$root.$on('hybrid_refresh_info_deploy_local', () => { this.componentKeyreloadservice5 += 1 }) // problem reload asto etsi mechri na vreis giati // this.$root.$on('hybrid_start_instance_show_console', (v) => { // this.setnewview(7, 5) // }) }, beforeDestroy () { this.$root.$off('hybrid_refresh_info_deploy_local') // this.$root.$off('hybrid_start_instance_show_console') }, methods: { setnewview(m, c) { if(m == 12){ this.viewmicroservices = m this.viewconsole = c this.consoleview = false this.consolemicro = true } if(c == 12){ this.viewmicroservices = m this.viewconsole = c this.consoleview = true this.consolemicro = false } if(m == 7 || c == 5){ this.viewmicroservices = m this.viewconsole = c this.consoleview = true this.consolemicro = true } } }, created () { this.setnewview(7, 5) } }; </script> <style> </style>