Вывод SPM сервисов

src/App.vue

@@ -108,6 +108,8 @@
 							const data = parsed.value;
 							this.$store.commit('setCurrentPacketsCount', data.totalPackets);
 							this.$store.commit('setCurrentStreamsCount', data.totalStreams);
+							this.$store.commit('setCurrentServicesPacketsCount', data.servicesPackets);
+							this.$store.commit('setCurrentServicesStreamsCount', data.servicesStreams);
 
 							console.debug('Adding new counters to DB', parsed.value);
 							const tx = this.db.transaction(DB_OBJSTORE_COUNTERS_HISTORY, 'readwrite');

src/components/Navbar.vue

@@ -18,7 +18,11 @@
 				<template v-for="service in this.$store.state.services">
 					<router-link :key="service.name" tag="li" class="nav-item text-nowrap edit-button"
 								 :to="{name:'stream', params: {servicePort: service.port}, query: $route.query}">
-						<a class="nav-link">{{service.name}} #{{service.port}}</a>
+						<a class="nav-link">
+							{{service.name}} #{{service.port}}
+							({{ getSpmForService(service.port) }}
+							<u title="Streams per minute">SPM</u>)
+						</a>
 
 						<a class="nav-link pl-0" style="cursor: pointer" @click.stop.prevent="editService(service)">
 							<i class="fas fa-pencil-alt"/>
@@ -72,6 +76,9 @@
 			this.updateServices();
 		},
 		methods: {
+			getSpmForService(port) {
+				return this.$store.state.currentServicesStreamsCount[port] ?? 0;
+			},
 			editService(service) {
 				this.serviceModalIsCreating = false;
 				this.serviceModalEditingService = {};

src/store.js

@@ -25,6 +25,8 @@ export default new Vuex.Store({
 
 		currentPacketsCount: 0,
 		currentStreamsCount: 0,
+		currentServicesPacketsCount: {},
+		currentServicesStreamsCount: {},
 	},
 	mutations: {
 		setHexdumpBlockSize: (s, p) => s.hexdumpBlockSize = p,
@@ -50,6 +52,8 @@ export default new Vuex.Store({
 
 		setCurrentPacketsCount: (s, p) => s.currentPacketsCount = p,
 		setCurrentStreamsCount: (s, p) => s.currentStreamsCount = p,
+		setCurrentServicesPacketsCount: (s, p) => s.currentServicesPacketsCount = p,
+		setCurrentServicesStreamsCount: (s, p) => s.currentServicesStreamsCount = p,
 	},
 	actions: {},
 	plugins: [
@@ -70,7 +74,9 @@ export default new Vuex.Store({
 					&& mName !== 'setServices'
 					&& mName !== 'addService'
 					&& mName !== 'setCurrentPacketsCount'
-					&& mName !== 'setCurrentStreamsCount';
+					&& mName !== 'setCurrentStreamsCount'
+					&& mName !== 'setCurrentServicesPacketsCount'
+					&& mName !== 'setCurrentServicesStreamsCount';
 				console.debug('Processing?', process);
 				return process;
 			},