openc3-cosmos-init/plugins/packages/openc3-tool-common/src/tools/admin/tabs/RoutersTab.vue
<!--
# Copyright 2022 Ball Aerospace & Technologies Corp.
# All Rights Reserved.
#
# This program is free software; you can modify and/or redistribute it
# under the terms of the GNU Affero General Public License
# as published by the Free Software Foundation; version 3 with
# attribution addendums as found in the LICENSE.txt
#
# This program is distributed in the hope that it will be useful,
# but WITHOUT ANY WARRANTY; without even the implied warranty of
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
# GNU Affero General Public License for more details.
# Modified by OpenC3, Inc.
# All changes Copyright 2024, OpenC3, Inc.
# All Rights Reserved
#
# This file may also be used under the terms of a commercial license
# if purchased from OpenC3, Inc.
-->
<template>
<div>
<v-list class="list" data-test="routerList">
<div v-for="(router, index) in routers" :key="index">
<v-list-item>
<v-list-item-content>
<v-list-item-title>{{ router }}</v-list-item-title>
</v-list-item-content>
<v-list-item-icon>
<v-tooltip bottom>
<template v-slot:activator="{ on, attrs }">
<v-icon @click="showRouter(router)" v-bind="attrs" v-on="on">
mdi-eye
</v-icon>
</template>
<span>Show Router Details</span>
</v-tooltip>
</v-list-item-icon>
</v-list-item>
<v-divider />
</div>
</v-list>
<output-dialog
v-model="showDialog"
v-if="showDialog"
:content="jsonContent"
type="Router"
:name="dialogTitle"
@submit="dialogCallback"
/>
</div>
</template>
<script>
import Api from '../../../services/api'
import OutputDialog from '../../../components/OutputDialog'
export default {
components: { OutputDialog },
data() {
return {
routers: [],
jsonContent: '',
dialogTitle: '',
showDialog: false,
}
},
mounted() {
this.update()
},
methods: {
update() {
Api.get('/openc3-api/routers').then((response) => {
this.routers = response.data
})
},
add() {},
showRouter(name) {
Api.get(`/openc3-api/routers/${name}`).then((response) => {
this.jsonContent = JSON.stringify(response.data, null, '\t')
this.dialogTitle = name
this.showDialog = true
})
},
dialogCallback(content) {
this.showDialog = false
},
},
}
</script>
<style scoped>
.list {
background-color: var(--color-background-surface-default) !important;
}
</style>