From e63daaecaa18c3a31317cb5b61ca6de773b71d34 Mon Sep 17 00:00:00 2001
From: serega6531 <S.Shkurov@bssys.com>
Date: Wed, 13 Jan 2021 00:39:32 +0300
Subject: [PATCH] =?UTF-8?q?=D0=9F=D0=BE=D0=BA=D0=B0=D0=B7=20=D0=BA=D0=BE?=
 =?UTF-8?q?=D0=BB=D0=B8=D1=87=D0=B5=D1=81=D1=82=D0=B2=D0=B0=20=D1=81=D1=82?=
 =?UTF-8?q?=D1=80=D0=B8=D0=BC=D0=BE=D0=B2=20=D0=B8=20=D0=BF=D0=B0=D0=BA?=
 =?UTF-8?q?=D0=B5=D1=82=D0=BE=D0=B2=20=D0=B2=20=D0=BC=D0=B8=D0=BD=D1=83?=
 =?UTF-8?q?=D1=82=D1=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                         |  7 +++++--
 src/components/Navbar.vue           | 26 ++++++++++++++++++++++++++
 src/components/PatternsDropdown.vue |  2 +-
 src/store.js                        | 10 +++++++++-
 4 files changed, 41 insertions(+), 4 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 30c4860..c5d6fc9 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -21,6 +21,7 @@
 	</div>
 </template>
 
+<!--suppress JSUnresolvedVariable -->
 <script>
 	export const DB_OBJSTORE_COUNTERS_HISTORY = 'countersHistory';
 
@@ -106,10 +107,12 @@
 							break;
 						}
 						case 'COUNTERS_UPDATE': {
+							const data = parsed.value;
+							this.$store.commit('setCurrentPacketsCount', data.totalPackets);
+							this.$store.commit('setCurrentStreamsCount', data.totalStreams);
+
 							console.debug('Adding new counters to DB', parsed.value);
 							const tx = this.db.transaction(DB_OBJSTORE_COUNTERS_HISTORY, 'readwrite');
-							const data = parsed.value;
-							// noinspection JSUnresolvedVariable,JSCheckFunctionSignatures
 							tx.store.add({
 								newPacketsCount: data.totalPackets,
 								newStreamsCount: data.totalStreams,
diff --git a/src/components/Navbar.vue b/src/components/Navbar.vue
index a2b3c92..da81778 100644
--- a/src/components/Navbar.vue
+++ b/src/components/Navbar.vue
@@ -1,5 +1,13 @@
 <template>
 	<nav class="navbar navbar-dark navbar-expand fixed-top bg-dark flex-md-nowrap p-0 shadow">
+		<span class="navbar-brand mb-0 ml-2">Packmate</span>
+		<span class="navbar-text">
+      {{ this.$store.state.currentStreamsCount }}
+			<u title="Streams per minute">SPM</u>
+			, {{ packetsPerStream }}
+			<u title="Packets per stream (average)">PPS</u>
+    </span>
+
 		<PatternsDropdown ref="patternsDropdown"/>
 
 		<div class="navbar-collapse collapse">
@@ -41,6 +49,19 @@
 
 	export default {
 		name: 'Navbar',
+		computed: {
+			packetsPerStream() {
+				let streams = this.$store.state.currentStreamsCount;
+				let packets = this.$store.state.currentPacketsCount;
+
+				if (streams === 0) {
+					return 0;
+				} else {
+					let pps = packets / streams;
+					return Math.round((pps + Number.EPSILON) * 10) / 10;
+				}
+			},
+		},
 		data() {
 			return {
 				serviceModalIsCreating: true,
@@ -110,6 +131,11 @@
 		overflow-x: auto;
 	}
 
+	u {
+		text-underline-position: under;
+		text-decoration-style: dotted;
+	}
+
 	::-webkit-scrollbar {
 		height: 0.2em
 	}
diff --git a/src/components/PatternsDropdown.vue b/src/components/PatternsDropdown.vue
index 20548f7..3bcac6a 100644
--- a/src/components/PatternsDropdown.vue
+++ b/src/components/PatternsDropdown.vue
@@ -1,5 +1,5 @@
 <template>
-	<b-dropdown no-flip text="Patterns" block variant="dark" class="col-sm-2 mr-0 p-0">
+	<b-dropdown no-flip text="Patterns" block variant="dark" class="col-sm-1 mr-0 p-0">
 		<li role="presentation" style="padding-left: 0.5em; padding-right: 0.5em;">
 			<button role="menuitem" type="button" class="btn btn-sm btn-primary btn-block"
 					@click.stop.prevent="showAddPattern">
diff --git a/src/store.js b/src/store.js
index a36ede7..7994cc0 100644
--- a/src/store.js
+++ b/src/store.js
@@ -22,6 +22,9 @@ export default new Vuex.Store({
 
 		patterns: [],
 		services: [],
+
+		currentPacketsCount: 0,
+		currentStreamsCount: 0,
 	},
 	mutations: {
 		setHexdumpBlockSize: (s, p) => s.hexdumpBlockSize = p,
@@ -44,6 +47,9 @@ export default new Vuex.Store({
 
 		setServices: (s, p) => s.services = p,
 		addService: (s, p) => s.services.push(p),
+
+		setCurrentPacketsCount: (s, p) => s.currentPacketsCount = p,
+		setCurrentStreamsCount: (s, p) => s.currentStreamsCount = p,
 	},
 	actions: {},
 	plugins: [
@@ -62,7 +68,9 @@ export default new Vuex.Store({
 					&& mName !== 'setPatterns'
 					&& mName !== 'addPattern'
 					&& mName !== 'setServices'
-					&& mName !== 'addService';
+					&& mName !== 'addService'
+					&& mName !== 'setCurrentPacketsCount'
+					&& mName !== 'setCurrentStreamsCount';
 				console.debug('Processing?', process);
 				return process;
 			},