homelab/traefik
1
0
Fork 0
Code Activity

Added router priority to webui's list and detail page

Browse source
This commit is contained in:
bendre90 2023-01-09 17:24:05 +01:00 • committed by GitHub
parent cd90b9761a
commit 8cd4923e72
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
43 changed files with 2913 additions and 131 deletions
Download patch file Download diff file Expand all files Collapse all files

64
webui/src/pages/_commons/MiddlewareDetail.vue
View file

@ -44,12 +44,15 @@
<div class="row items-center q-col-gutter-lg">
<div class="col-12">
<main-table
:data="allRouters"
v-bind="getTableProps({ type: `${protocol}-routers` })"
:data="allRouters"
:onLoadMore="onGetAll"
:request="()=>{}"
:loading="routersLoading"
:pagination.sync="routersPagination"
:filter="routersFilter"
:currentSort.sync="sortBy"
:currentSortDir.sync="sortDir"
/>
</div>
</div>
@ -91,7 +94,11 @@ export default {
page: 1,
rowsPerPage: 1000,
rowsNumber: 0
}
},
filter: '',
status: '',
sortBy: 'name',
sortDir: 'asc'
}
},
computed: {
@ -108,11 +115,14 @@ export default {
},
getRouterByName () {
return this[`${this.protocol}_getRouterByName`]
},
getAllRouters () {
return this[`${this.protocol}_getAllRouters`]
}
},
methods: {
...mapActions('http', { http_getMiddlewareByName: 'getMiddlewareByName', http_getRouterByName: 'getRouterByName' }),
...mapActions('tcp', { tcp_getMiddlewareByName: 'getMiddlewareByName', tcp_getRouterByName: 'getRouterByName' }),
...mapActions('http', { http_getMiddlewareByName: 'getMiddlewareByName', http_getRouterByName: 'getRouterByName', http_getAllRouters: 'getAllRouters' }),
...mapActions('tcp', { tcp_getMiddlewareByName: 'getMiddlewareByName', tcp_getRouterByName: 'getRouterByName', tcp_getAllRouters: 'getAllRouters' }),
refreshAll () {
if (this.middlewareByName.loading) {
return
@ -127,22 +137,26 @@ export default {
return
}
// Get routers
if (body.usedBy) {
for (const router in body.usedBy) {
if (body.usedBy.hasOwnProperty(router)) {
this.getRouterByName(body.usedBy[router])
.then(body => {
if (body) {
this.routersLoading = false
this.allRouters.push(body)
}
})
.catch(error => {
console.log('Error -> routers/byName', error)
})
this.getAllRouters({
query: this.filter,
status: this.status,
page: 1,
limit: 1000,
middlewareName: this.name,
serviceName: '',
sortBy: this.sortBy,
direction: this.sortDir
})
.then(body => {
this.allRouters = []
if (body) {
this.routersLoading = false
this.allRouters.push(...body.data)
}
}
}
})
.catch(error => {
console.log('Error -> routers/byName', error)
})
clearTimeout(this.timeOutGetAll)
this.timeOutGetAll = setTimeout(() => {
this.loading = false
@ -153,12 +167,18 @@ export default {
})
}
},
watch: {
'sortBy' () {
this.refreshAll()
},
'sortDir' () {
this.refreshAll()
}
},
created () {
this.refreshAll()
},
mounted () {
},
mounted () {},
beforeDestroy () {
clearInterval(this.timeOutGetAll)
this.$store.commit('http/getMiddlewareByNameClear')

66
webui/src/pages/_commons/ServiceDetail.vue
View file

@ -112,12 +112,15 @@
<div class="row items-center q-col-gutter-lg">
<div class="col-12">
<main-table
:data="allRouters"
v-bind="getTableProps({ type: `${protocol}-routers` })"
:data="allRouters"
:onLoadMore="onGetAll"
:request="()=>{}"
:loading="routersLoading"
:pagination.sync="routersPagination"
:filter="routersFilter"
:currentSort.sync="sortBy"
:currentSortDir.sync="sortDir"
/>
</div>
</div>
@ -167,7 +170,11 @@ export default {
page: 1,
rowsPerPage: 1000,
rowsNumber: 0
}
},
filter: '',
status: '',
sortBy: 'name',
sortDir: 'asc'
}
},
computed: {
@ -185,12 +192,15 @@ export default {
},
getRouterByName () {
return this[`${this.protocol}_getRouterByName`]
},
getAllRouters () {
return this[`${this.protocol}_getAllRouters`]
}
},
methods: {
...mapActions('http', { http_getServiceByName: 'getServiceByName', http_getRouterByName: 'getRouterByName' }),
...mapActions('tcp', { tcp_getServiceByName: 'getServiceByName', tcp_getRouterByName: 'getRouterByName' }),
...mapActions('udp', { udp_getServiceByName: 'getServiceByName', udp_getRouterByName: 'getRouterByName' }),
...mapActions('http', { http_getServiceByName: 'getServiceByName', http_getRouterByName: 'getRouterByName', http_getAllRouters: 'getAllRouters' }),
...mapActions('tcp', { tcp_getServiceByName: 'getServiceByName', tcp_getRouterByName: 'getRouterByName', tcp_getAllRouters: 'getAllRouters' }),
...mapActions('udp', { udp_getServiceByName: 'getServiceByName', udp_getRouterByName: 'getRouterByName', udp_getAllRouters: 'getAllRouters' }),
refreshAll () {
if (this.serviceByName.loading) {
return
@ -205,22 +215,26 @@ export default {
return
}
// Get routers
if (body.usedBy) {
for (const router in body.usedBy) {
if (body.usedBy.hasOwnProperty(router)) {
this.getRouterByName(body.usedBy[router])
.then(body => {
if (body) {
this.routersLoading = false
this.allRouters.push(body)
}
})
.catch(error => {
console.log('Error -> routers/byName', error)
})
this.getAllRouters({
query: this.filter,
status: this.status,
page: 1,
limit: 1000,
middlewareName: '',
serviceName: this.name,
sortBy: this.sortBy,
direction: this.sortDir
})
.then(body => {
this.allRouters = []
if (body) {
this.routersLoading = false
this.allRouters.push(...body.data)
}
}
}
})
.catch(error => {
console.log('Error -> getAllRouters', error)
})
clearTimeout(this.timeOutGetAll)
this.timeOutGetAll = setTimeout(() => {
this.loading = false
@ -231,12 +245,18 @@ export default {
})
}
},
watch: {
'sortBy' () {
this.refreshAll()
},
'sortDir' () {
this.refreshAll()
}
},
created () {
this.refreshAll()
},
mounted () {
},
mounted () {},
beforeDestroy () {
clearInterval(this.timeOutGetAll)
this.$store.commit('http/getServiceByNameClear')

14
webui/src/pages/http/Middlewares.vue
View file

@ -15,6 +15,8 @@
:onLoadMore="handleLoadMore"
:endReached="allMiddlewares.endReached"
:loading="allMiddlewares.loading"
:currentSort.sync="sortBy"
:currentSortDir.sync="sortDir"
/>
</div>
</div>
@ -50,7 +52,9 @@ export default {
data () {
return {
filter: '',
status: ''
status: '',
sortBy: 'name',
sortDir: 'asc'
}
},
computed: {
@ -62,6 +66,8 @@ export default {
return this.getAllMiddlewares({
query: this.filter,
status: this.status,
sortBy: this.sortBy,
direction: this.sortDir,
...params
})
},
@ -82,6 +88,12 @@ export default {
},
'filter' () {
this.refreshAll()
},
'sortBy' () {
this.refreshAll()
},
'sortDir' () {
this.refreshAll()
}
},
beforeDestroy () {

16
webui/src/pages/http/Routers.vue
View file

@ -15,6 +15,8 @@
:onLoadMore="handleLoadMore"
:endReached="allRouters.endReached"
:loading="allRouters.loading"
:currentSort.sync="sortBy"
:currentSortDir.sync="sortDir"
/>
</div>
</div>
@ -50,7 +52,9 @@ export default {
data () {
return {
filter: '',
status: ''
status: '',
sortBy: 'name',
sortDir: 'asc'
}
},
computed: {
@ -60,8 +64,12 @@ export default {
...mapActions('http', { getAllRouters: 'getAllRouters' }),
getAllRoutersWithParams (params) {
return this.getAllRouters({
serviceName: '',
middlewareName: '',
query: this.filter,
status: this.status,
sortBy: this.sortBy,
direction: this.sortDir,
...params
})
},
@ -82,6 +90,12 @@ export default {
},
'filter' () {
this.refreshAll()
},
'sortBy' () {
this.refreshAll()
},
'sortDir' () {
this.refreshAll()
}
},
beforeDestroy () {

14
webui/src/pages/http/Services.vue
View file

@ -15,6 +15,8 @@
:onLoadMore="handleLoadMore"
:endReached="allServices.endReached"
:loading="allServices.loading"
:currentSort.sync="sortBy"
:currentSortDir.sync="sortDir"
/>
</div>
</div>
@ -50,7 +52,9 @@ export default {
data () {
return {
filter: '',
status: ''
status: '',
sortBy: 'name',
sortDir: 'asc'
}
},
computed: {
@ -62,6 +66,8 @@ export default {
return this.getAllServices({
query: this.filter,
status: this.status,
sortBy: this.sortBy,
direction: this.sortDir,
...params
})
},
@ -82,6 +88,12 @@ export default {
},
'filter' () {
this.refreshAll()
},
'sortBy' () {
this.refreshAll()
},
'sortDir' () {
this.refreshAll()
}
},
beforeDestroy () {

14
webui/src/pages/tcp/Middlewares.vue
View file

@ -15,6 +15,8 @@
:onLoadMore="handleLoadMore"
:endReached="allMiddlewares.endReached"
:loading="allMiddlewares.loading"
:currentSort.sync="sortBy"
:currentSortDir.sync="sortDir"
/>
</div>
</div>
@ -50,7 +52,9 @@ export default {
data () {
return {
filter: '',
status: ''
status: '',
sortBy: 'name',
sortDir: 'asc'
}
},
computed: {
@ -62,6 +66,8 @@ export default {
return this.getAllMiddlewares({
query: this.filter,
status: this.status,
sortBy: this.sortBy,
direction: this.sortDir,
...params
})
},
@ -82,6 +88,12 @@ export default {
},
'filter' () {
this.refreshAll()
},
'sortBy' () {
this.refreshAll()
},
'sortDir' () {
this.refreshAll()
}
},
beforeDestroy () {

16
webui/src/pages/tcp/Routers.vue
View file

@ -15,6 +15,8 @@
:onLoadMore="handleLoadMore"
:endReached="allRouters.endReached"
:loading="allRouters.loading"
:currentSort.sync="sortBy"
:currentSortDir.sync="sortDir"
/>
</div>
</div>
@ -50,7 +52,9 @@ export default {
data () {
return {
filter: '',
status: ''
status: '',
sortBy: 'name',
sortDir: 'asc'
}
},
computed: {
@ -60,8 +64,12 @@ export default {
...mapActions('tcp', { getAllRouters: 'getAllRouters' }),
getAllRoutersWithParams (params) {
return this.getAllRouters({
serviceName: '',
middlewareName: '',
query: this.filter,
status: this.status,
sortBy: this.sortBy,
direction: this.sortDir,
...params
})
},
@ -82,6 +90,12 @@ export default {
},
'filter' () {
this.refreshAll()
},
'sortBy' () {
this.refreshAll()
},
'sortDir' () {
this.refreshAll()
}
},
beforeDestroy () {

14
webui/src/pages/tcp/Services.vue
View file

@ -15,6 +15,8 @@
:onLoadMore="handleLoadMore"
:endReached="allServices.endReached"
:loading="allServices.loading"
:currentSort.sync="sortBy"
:currentSortDir.sync="sortDir"
/>
</div>
</div>
@ -50,7 +52,9 @@ export default {
data () {
return {
filter: '',
status: ''
status: '',
sortBy: 'name',
sortDir: 'asc'
}
},
computed: {
@ -62,6 +66,8 @@ export default {
return this.getAllServices({
query: this.filter,
status: this.status,
sortBy: this.sortBy,
direction: this.sortDir,
...params
})
},
@ -82,6 +88,12 @@ export default {
},
'filter' () {
this.refreshAll()
},
'sortBy' () {
this.refreshAll()
},
'sortDir' () {
this.refreshAll()
}
},
beforeDestroy () {

16
webui/src/pages/udp/Routers.vue
View file

@ -14,6 +14,8 @@
:onLoadMore="handleLoadMore"
:endReached="allRouters.endReached"
:loading="allRouters.loading"
:currentSort.sync="sortBy"
:currentSortDir.sync="sortDir"
/>
</div>
</div>
@ -49,7 +51,9 @@ export default {
data () {
return {
filter: '',
status: ''
status: '',
sortBy: 'name',
sortDir: 'asc'
}
},
computed: {
@ -61,6 +65,10 @@ export default {
return this.getAllRouters({
query: this.filter,
status: this.status,
sortBy: this.sortBy,
direction: this.sortDir,
serviceName: '',
middlewareName: '',
...params
})
},
@ -81,6 +89,12 @@ export default {
},
'filter' () {
this.refreshAll()
},
'sortBy' () {
this.refreshAll()
},
'sortDir' () {
this.refreshAll()
}
},
beforeDestroy () {

14
webui/src/pages/udp/Services.vue
View file

@ -15,6 +15,8 @@
:onLoadMore="handleLoadMore"
:endReached="allServices.endReached"
:loading="allServices.loading"
:currentSort.sync="sortBy"
:currentSortDir.sync="sortDir"
/>
</div>
</div>
@ -50,7 +52,9 @@ export default {
data () {
return {
filter: '',
status: ''
status: '',
sortBy: 'name',
sortDir: 'asc'
}
},
computed: {
@ -62,6 +66,8 @@ export default {
return this.getAllServices({
query: this.filter,
status: this.status,
sortBy: this.sortBy,
direction: this.sortDir,
...params
})
},
@ -82,6 +88,12 @@ export default {
},
'filter' () {
this.refreshAll()
},
'sortBy' () {
this.refreshAll()
},
'sortDir' () {
this.refreshAll()
}
},
beforeDestroy () {