From 56567703191504c3d06af8dffbcce542c6e0f683 Mon Sep 17 00:00:00 2001 From: saber-nyan Date: Mon, 6 May 2019 21:42:20 +0300 Subject: [PATCH] =?UTF-8?q?=D0=98=D1=81=D0=BF=D1=80=D0=B0=D0=B2=D0=B8?= =?UTF-8?q?=D0=BB=20=D0=B1=D0=B5=D1=81=D0=BA=D0=BE=D0=BD=D0=B5=D1=87=D0=BD?= =?UTF-8?q?=D1=83=D1=8E=20=D0=B7=D0=B0=D0=B3=D1=80=D1=83=D0=B7=D0=BA=D1=83?= =?UTF-8?q?,=20=D0=B4=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D0=BB=20=D0=BD=D0=B0?= =?UTF-8?q?=D1=81=D1=82=D1=80=D0=BE=D0=B9=D0=BA=D0=B8=20=D1=80=D0=B0=D0=B7?= =?UTF-8?q?=D0=BC=D0=B5=D1=80=D0=B0=20=D1=81=D1=82=D1=80=D0=B0=D0=BD=D0=B8?= =?UTF-8?q?=D1=86=20=D0=B8=20hdump?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Content.vue | 15 +++++++-- src/components/Packet.vue | 7 +++-- src/components/SettingsModal.vue | 53 ++++++++++++++++++++++++++------ src/components/Sidebar.vue | 15 +++++++-- src/store.js | 4 +++ 5 files changed, 76 insertions(+), 18 deletions(-) diff --git a/src/components/Content.vue b/src/components/Content.vue index 054a793..6ed85ef 100644 --- a/src/components/Content.vue +++ b/src/components/Content.vue @@ -44,11 +44,20 @@ export default { 'Content-Type': 'application/json', }, }); + + const packets = this.packets; + let startsFrom; + if (packets && packets.length && packets[packets.length - 1]) { + startsFrom = packets[packets.length - 1].id; + } else { + startsFrom = 0; + } + instance.post(`/packet/${this.streamId}`, { - fetchLatest: true, + fetchLatest: false, direction: 'ASC', - startingFrom: this.packets.length, - pageSize: 50, + startingFrom: startsFrom, + pageSize: parseInt(this.$store.state.pageSize), }).then(response => { const data = response.data; if (data.length === 0) return $state.complete(); diff --git a/src/components/Packet.vue b/src/components/Packet.vue index da4ce8d..a211642 100644 --- a/src/components/Packet.vue +++ b/src/components/Packet.vue @@ -13,13 +13,14 @@ export default { name: 'Packet', props: ['id', 'content', 'timestamp',], methods: { - hexdump(buffer, blockSize) { + hexdump(buffer, blockSize, lineNumberBase) { blockSize = parseInt(blockSize, 10) || 16; + lineNumberBase = parseInt(lineNumberBase, 10) || 10; let lines = []; const hex = "0123456789ABCDEF"; for (let b = 0; b < buffer.length; b += blockSize) { let block = buffer.slice(b, Math.min(b + blockSize, buffer.length)); - let addr = ("0000000000" + b.toString(10)).slice(-10); + let addr = ("0000000000" + b.toString(lineNumberBase)).slice(-10); let codes = block.split('').map(ch => { let code = ch.charCodeAt(0); return " " + hex[(0xF0 & code) >> 4] + hex[0x0F & code]; @@ -37,7 +38,7 @@ export default { hexdata() { // const dataString = decodeURIComponent(escape(atob(this.$props.content))); const dataString = atob(this.$props.content); - return this.hexdump(dataString, this.$store.state.hexdumpBlockSize); + return this.hexdump(dataString, this.$store.state.hexdumpBlockSize, this.$store.state.hexdumpLineNumberBase); }, }, } diff --git a/src/components/SettingsModal.vue b/src/components/SettingsModal.vue index 72fc046..52fa217 100644 --- a/src/components/SettingsModal.vue +++ b/src/components/SettingsModal.vue @@ -7,18 +7,37 @@ -
- - + +
+
+ + +
+
+ + +
-
- - + +
+
+ + +
+
+ + +
+
- - + +
+ @@ -77,6 +96,22 @@ export default { this.$store.commit('setHexdumpBlockSize', value); }, }, + hexdumpLineNumberBase: { + get() { + return this.$store.state.hexdumpLineNumberBase; + }, + set(value) { + this.$store.commit('setHexdumpLineNumberBase', value); + }, + }, + pageSize: { + get() { + return this.$store.state.pageSize; + }, + set(value) { + this.$store.commit('setPageSize', value); + }, + }, }, } @@ -100,7 +135,7 @@ export default { } .modal-container { - width: 300px; + width: 500px; margin: 0 auto; padding: 20px 30px; background-color: #fff; diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue index efdba4e..0713e6e 100644 --- a/src/components/Sidebar.vue +++ b/src/components/Sidebar.vue @@ -48,11 +48,20 @@ export default { 'Content-Type': 'application/json', }, }); + + const streams = this.streams; + let startsFrom; + if (streams && streams.length && streams[streams.length - 1]) { + startsFrom = streams[streams.length - 1].id; + } else { + startsFrom = Number.MAX_SAFE_INTEGER; // FIXME -_- + } + instance.post(`/stream/${this.$props.servicePort || 'all'}`, { - fetchLatest: true, + fetchLatest: false, direction: 'DESC', - startingFrom: this.streams.length, - pageSize: 50, + startingFrom: startsFrom, + pageSize: parseInt(this.$store.state.pageSize), }).then(response => { const data = response.data; if (data.length === 0) return $state.complete(); diff --git a/src/store.js b/src/store.js index 6ff1a39..5dd8873 100644 --- a/src/store.js +++ b/src/store.js @@ -10,12 +10,16 @@ export default new Vuex.Store({ apiLogin: 'BinaryBears', apiPassword: '123456', hexdumpBlockSize: 16, + hexdumpLineNumberBase: 10, + pageSize: 50, }, mutations: { setApiUrl: (state, payload) => state.apiUrl = payload, setApiLogin: (state, payload) => state.apiLogin = payload, setApiPassword: (state, payload) => state.apiPassword = payload, setHexdumpBlockSize: (state, payload) => state.hexdumpBlockSize = payload, + setHexdumpLineNumberBase: (state, payload) => state.hexdumpLineNumberBase = payload, + setPageSize: (state, payload) => state.pageSize = payload, }, plugins: [createPersistedState(),], })