@@ -157,6 +180,9 @@ export default {
allTCP () {
return this.overviewAll.items.tcp
},
+ allUDP () {
+ return this.overviewAll.items.udp
+ },
allFeatures () {
return this.overviewAll.items.features
},
diff --git a/webui/src/pages/udp/Routers.vue b/webui/src/pages/udp/Routers.vue
new file mode 100644
index 000000000..c46900430
--- /dev/null
+++ b/webui/src/pages/udp/Routers.vue
@@ -0,0 +1,94 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/webui/src/pages/udp/Services.vue b/webui/src/pages/udp/Services.vue
new file mode 100644
index 000000000..988ace32b
--- /dev/null
+++ b/webui/src/pages/udp/Services.vue
@@ -0,0 +1,95 @@
+
+
+
+
+
+
+
+
+
+
+
diff --git a/webui/src/router/routes.js b/webui/src/router/routes.js
index 28ac34a0b..53565cf9d 100644
--- a/webui/src/router/routes.js
+++ b/webui/src/router/routes.js
@@ -158,6 +158,65 @@ const routes = [
}
}
]
+ },
+ {
+ path: '/udp',
+ redirect: '/udp/routers',
+ component: LayoutDefault,
+ children: [
+ {
+ path: 'routers',
+ name: 'udpRouters',
+ components: {
+ default: () => import('pages/udp/Routers.vue'),
+ NavBar: () => import('components/_commons/ToolBar.vue')
+ },
+ props: { default: true, NavBar: true },
+ meta: {
+ protocol: 'udp',
+ title: 'TCP Routers'
+ }
+ },
+ {
+ path: 'routers/:name',
+ name: 'udpRouterDetail',
+ components: {
+ default: () => import('pages/_commons/RouterDetail.vue'),
+ NavBar: () => import('components/_commons/ToolBar.vue')
+ },
+ props: { default: true, NavBar: true },
+ meta: {
+ protocol: 'udp',
+ title: 'TCP Router Detail'
+ }
+ },
+ {
+ path: 'services',
+ name: 'udpServices',
+ components: {
+ default: () => import('pages/udp/Services.vue'),
+ NavBar: () => import('components/_commons/ToolBar.vue')
+ },
+ props: { default: true, NavBar: true },
+ meta: {
+ protocol: 'udp',
+ title: 'TCP Services'
+ }
+ },
+ {
+ path: 'services/:name',
+ name: 'udpServiceDetail',
+ components: {
+ default: () => import('pages/_commons/ServiceDetail.vue'),
+ NavBar: () => import('components/_commons/ToolBar.vue')
+ },
+ props: { default: true, NavBar: true },
+ meta: {
+ protocol: 'udp',
+ title: 'TCP Service Detail'
+ }
+ }
+ ]
}
]
diff --git a/webui/src/store/index.js b/webui/src/store/index.js
index 190ad6594..5011c5bd4 100644
--- a/webui/src/store/index.js
+++ b/webui/src/store/index.js
@@ -5,6 +5,7 @@ import core from './core'
import entrypoints from './entrypoints'
import http from './http'
import tcp from './tcp'
+import udp from './udp'
Vue.use(Vuex)
@@ -19,7 +20,8 @@ export default function (/* { ssrContext } */) {
core,
entrypoints,
http,
- tcp
+ tcp,
+ udp
},
// enable strict mode (adds overhead!)
diff --git a/webui/src/store/udp/actions.js b/webui/src/store/udp/actions.js
new file mode 100644
index 000000000..15fe3a7be
--- /dev/null
+++ b/webui/src/store/udp/actions.js
@@ -0,0 +1,53 @@
+import UdpService from '../../_services/UdpService'
+
+export function getAllRouters ({ commit }, params) {
+ commit('getAllRoutersRequest')
+ return UdpService.getAllRouters(params)
+ .then(body => {
+ commit('getAllRoutersSuccess', { body, ...params })
+ return body
+ })
+ .catch(error => {
+ commit('getAllRoutersFailure', error)
+ return Promise.reject(error)
+ })
+}
+
+export function getRouterByName ({ commit }, name) {
+ commit('getRouterByNameRequest')
+ return UdpService.getRouterByName(name)
+ .then(body => {
+ commit('getRouterByNameSuccess', body)
+ return body
+ })
+ .catch(error => {
+ commit('getRouterByNameFailure', error)
+ return Promise.reject(error)
+ })
+}
+
+export function getAllServices ({ commit }, params) {
+ commit('getAllServicesRequest')
+ return UdpService.getAllServices(params)
+ .then(body => {
+ commit('getAllServicesSuccess', { body, ...params })
+ return body
+ })
+ .catch(error => {
+ commit('getAllServicesFailure', error)
+ return Promise.reject(error)
+ })
+}
+
+export function getServiceByName ({ commit }, name) {
+ commit('getServiceByNameRequest')
+ return UdpService.getServiceByName(name)
+ .then(body => {
+ commit('getServiceByNameSuccess', body)
+ return body
+ })
+ .catch(error => {
+ commit('getServiceByNameFailure', error)
+ return Promise.reject(error)
+ })
+}
diff --git a/webui/src/store/udp/getters.js b/webui/src/store/udp/getters.js
new file mode 100644
index 000000000..2b9611e94
--- /dev/null
+++ b/webui/src/store/udp/getters.js
@@ -0,0 +1,27 @@
+// ----------------------------
+// all Routers
+// ----------------------------
+export function allRouters (state) {
+ return state.allRouters
+}
+
+// ----------------------------
+// Router by Name
+// ----------------------------
+export function routerByName (state) {
+ return state.routerByName
+}
+
+// ----------------------------
+// all Services
+// ----------------------------
+export function allServices (state) {
+ return state.allServices
+}
+
+// ----------------------------
+// Service by Name
+// ----------------------------
+export function serviceByName (state) {
+ return state.serviceByName
+}
diff --git a/webui/src/store/udp/index.js b/webui/src/store/udp/index.js
new file mode 100644
index 000000000..babab8ec5
--- /dev/null
+++ b/webui/src/store/udp/index.js
@@ -0,0 +1,12 @@
+import state from './state'
+import * as getters from './getters'
+import * as mutations from './mutations'
+import * as actions from './actions'
+
+export default {
+ namespaced: true,
+ getters,
+ mutations,
+ actions,
+ state
+}
diff --git a/webui/src/store/udp/mutations.js b/webui/src/store/udp/mutations.js
new file mode 100644
index 000000000..69df42013
--- /dev/null
+++ b/webui/src/store/udp/mutations.js
@@ -0,0 +1,105 @@
+import { withPagination } from '../../_helpers/Mutations'
+
+// ----------------------------
+// Get All Routers
+// ----------------------------
+export function getAllRoutersRequest (state) {
+ withPagination('request', { statePath: 'allRouters' })(state)
+}
+
+export function getAllRoutersSuccess (state, data) {
+ const { query = '', status = '' } = data
+ const currentState = state.allRouters
+
+ const isSameContext = currentState.currentQuery === query && currentState.currentStatus === status
+
+ state.allRouters = {
+ ...state.allRouters,
+ currentQuery: query,
+ currentStatus: status
+ }
+
+ withPagination('success', {
+ isSameContext,
+ statePath: 'allRouters'
+ })(state, data)
+}
+
+export function getAllRoutersFailure (state, error) {
+ withPagination('failure', { statePath: 'allRouters' })(state, error)
+}
+
+export function getAllRoutersClear (state) {
+ state.allRouters = {}
+}
+
+// ----------------------------
+// Get Router By Name
+// ----------------------------
+export function getRouterByNameRequest (state) {
+ state.routerByName.loading = true
+}
+
+export function getRouterByNameSuccess (state, body) {
+ state.routerByName = { item: body, loading: false }
+}
+
+export function getRouterByNameFailure (state, error) {
+ state.routerByName = { error }
+}
+
+export function getRouterByNameClear (state) {
+ state.routerByName = {}
+}
+
+// ----------------------------
+// Get All Services
+// ----------------------------
+export function getAllServicesRequest (state) {
+ withPagination('request', { statePath: 'allServices' })(state)
+}
+
+export function getAllServicesSuccess (state, data) {
+ const { query = '', status = '' } = data
+ const currentState = state.allServices
+
+ const isSameContext = currentState.currentQuery === query && currentState.currentStatus === status
+
+ state.allServices = {
+ ...state.allServices,
+ currentQuery: query,
+ currentStatus: status
+ }
+
+ withPagination('success', {
+ isSameContext,
+ statePath: 'allServices'
+ })(state, data)
+}
+
+export function getAllServicesFailure (state, error) {
+ withPagination('failure', { statePath: 'allServices' })(state, error)
+}
+
+export function getAllServicesClear (state) {
+ state.allServices = {}
+}
+
+// ----------------------------
+// Get Service By Name
+// ----------------------------
+export function getServiceByNameRequest (state) {
+ state.serviceByName.loading = true
+}
+
+export function getServiceByNameSuccess (state, body) {
+ state.serviceByName = { item: body, loading: false }
+}
+
+export function getServiceByNameFailure (state, error) {
+ state.serviceByName = { error }
+}
+
+export function getServiceByNameClear (state) {
+ state.serviceByName = {}
+}
diff --git a/webui/src/store/udp/mutations.spec.js b/webui/src/store/udp/mutations.spec.js
new file mode 100644
index 000000000..fa09e3d74
--- /dev/null
+++ b/webui/src/store/udp/mutations.spec.js
@@ -0,0 +1,197 @@
+import { expect } from 'chai'
+import store from './index.js'
+
+const {
+ getAllRoutersRequest,
+ getAllRoutersSuccess,
+ getAllRoutersFailure,
+ getAllServicesRequest,
+ getAllServicesSuccess,
+ getAllServicesFailure
+} = store.mutations
+
+describe('udp mutations', function () {
+ /* Routers */
+ describe('udp routers mutations', function () {
+ it('getAllRoutersRequest', function () {
+ const state = {
+ allRouters: {
+ items: [{}, {}, {}]
+ }
+ }
+
+ getAllRoutersRequest(state)
+
+ expect(state.allRouters.loading).to.equal(true)
+ expect(state.allRouters.items.length).to.equal(3)
+ })
+
+ it('getAllRoutersSuccess page 1', function () {
+ const state = {
+ allRouters: {
+ loading: true
+ }
+ }
+
+ const data = {
+ body: {
+ data: [{}, {}, {}],
+ total: 3
+ },
+ query: 'test query',
+ status: 'warning',
+ page: 1
+ }
+
+ getAllRoutersSuccess(state, data)
+
+ expect(state.allRouters.loading).to.equal(false)
+ expect(state.allRouters.total).to.equal(3)
+ expect(state.allRouters.items.length).to.equal(3)
+ expect(state.allRouters.currentPage).to.equal(1)
+ expect(state.allRouters.currentQuery).to.equal('test query')
+ expect(state.allRouters.currentStatus).to.equal('warning')
+ })
+
+ it('getAllRoutersSuccess page 2', function () {
+ const state = {
+ allRouters: {
+ loading: false,
+ items: [{ id: 1 }, { id: 2 }, { id: 3 }],
+ total: 3,
+ currentPage: 1,
+ currentQuery: 'test query',
+ currentStatus: 'warning'
+ }
+ }
+
+ const data = {
+ body: {
+ data: [{ id: 4 }, { id: 5 }, { id: 6 }, { id: 7 }],
+ total: 4
+ },
+ query: 'test query',
+ status: 'warning',
+ page: 2
+ }
+
+ getAllRoutersSuccess(state, data)
+
+ expect(state.allRouters.loading).to.equal(false)
+ expect(state.allRouters.total).to.equal(7)
+ expect(state.allRouters.items.length).to.equal(7)
+ expect(state.allRouters.currentPage).to.equal(2)
+ expect(state.allRouters.currentQuery).to.equal('test query')
+ expect(state.allRouters.currentStatus).to.equal('warning')
+ })
+
+ it('getAllRoutersFailing', function () {
+ const state = {
+ allRouters: {
+ items: [{}, {}, {}],
+ loading: true
+ }
+ }
+
+ const error = { message: 'invalid request: page: 3, per_page: 10' }
+
+ getAllRoutersFailure(state, error)
+
+ expect(state.allRouters.loading).to.equal(false)
+ expect(state.allRouters.endReached).to.equal(true)
+ expect(state.allRouters.items.length).to.equal(3)
+ })
+ })
+
+ /* Services */
+ describe('udp services mutations', function () {
+ it('getAllServicesRequest', function () {
+ const state = {
+ allServices: {
+ items: [{}, {}, {}]
+ }
+ }
+
+ getAllServicesRequest(state)
+
+ expect(state.allServices.loading).to.equal(true)
+ expect(state.allServices.items.length).to.equal(3)
+ })
+
+ it('getAllServicesSuccess page 1', function () {
+ const state = {
+ allServices: {
+ loading: true
+ }
+ }
+
+ const data = {
+ body: {
+ data: [{}, {}, {}],
+ total: 3
+ },
+ query: 'test query',
+ status: 'warning',
+ page: 1
+ }
+
+ getAllServicesSuccess(state, data)
+
+ expect(state.allServices.loading).to.equal(false)
+ expect(state.allServices.total).to.equal(3)
+ expect(state.allServices.items.length).to.equal(3)
+ expect(state.allServices.currentPage).to.equal(1)
+ expect(state.allServices.currentQuery).to.equal('test query')
+ expect(state.allServices.currentStatus).to.equal('warning')
+ })
+
+ it('getAllServicesSuccess page 2', function () {
+ const state = {
+ allServices: {
+ loading: false,
+ items: [{ id: 1 }, { id: 2 }, { id: 3 }],
+ total: 3,
+ currentPage: 1,
+ currentQuery: 'test query',
+ currentStatus: 'warning'
+ }
+ }
+
+ const data = {
+ body: {
+ data: [{ id: 4 }, { id: 5 }, { id: 6 }, { id: 7 }],
+ total: 4
+ },
+ query: 'test query',
+ status: 'warning',
+ page: 2
+ }
+
+ getAllServicesSuccess(state, data)
+
+ expect(state.allServices.loading).to.equal(false)
+ expect(state.allServices.total).to.equal(7)
+ expect(state.allServices.items.length).to.equal(7)
+ expect(state.allServices.currentPage).to.equal(2)
+ expect(state.allServices.currentQuery).to.equal('test query')
+ expect(state.allServices.currentStatus).to.equal('warning')
+ })
+
+ it('getAllServicesFailing', function () {
+ const state = {
+ allServices: {
+ items: [{}, {}, {}],
+ loading: true
+ }
+ }
+
+ const error = { message: 'invalid request: page: 3, per_page: 10' }
+
+ getAllServicesFailure(state, error)
+
+ expect(state.allServices.loading).to.equal(false)
+ expect(state.allServices.endReached).to.equal(true)
+ expect(state.allServices.items.length).to.equal(3)
+ })
+ })
+})
diff --git a/webui/src/store/udp/state.js b/webui/src/store/udp/state.js
new file mode 100644
index 000000000..0eb429a34
--- /dev/null
+++ b/webui/src/store/udp/state.js
@@ -0,0 +1,6 @@
+export default {
+ allRouters: {},
+ routerByName: {},
+ allServices: {},
+ serviceByName: {}
+}