From 243c89b459fbf5c48c211be18fc9d46af46adaa3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=AE=B8=E6=99=93=E4=B8=9C?= <763795151@qq.com> Date: Tue, 28 Dec 2021 20:39:07 +0800 Subject: [PATCH] =?UTF-8?q?topic=E6=A8=A1=E7=B3=8A=E6=9F=A5=E8=AF=A2?= =?UTF-8?q?=EF=BC=8C=E6=B6=88=E6=81=AF=E8=BF=87=E6=BB=A4=E9=A1=B5=E9=9D=A2?= =?UTF-8?q?=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ui/src/views/message/SearchByTime.vue | 133 ++++++++++++++++++++++++++ ui/src/views/topic/Topic.vue | 39 ++++++-- 2 files changed, 162 insertions(+), 10 deletions(-) diff --git a/ui/src/views/message/SearchByTime.vue b/ui/src/views/message/SearchByTime.vue index 401ec6a..92fa3fb 100644 --- a/ui/src/views/message/SearchByTime.vue +++ b/ui/src/views/message/SearchByTime.vue @@ -59,6 +59,78 @@ +
+ + + + + 不启用过滤 + + 根据消息体过滤 + + + 根据消息头过滤 + + + + +
+ + + + + + + + + + {{ v }} + + + String类型模糊匹配,数字类型绝对匹配,其它不支持 + + +
+
+ + + + + + + + + 消息头的value不是字符串类型,就不要输入用来过滤了 + + +
+

@@ -97,6 +169,9 @@ export default { rules: [{ type: "array", required: true, message: "请选择时间!" }], }, data: defaultData, + deserializerList: [], + showBodyFilter: false, + showHeaderFilter: false, }; }, methods: { @@ -151,6 +226,40 @@ export default { this.selectPartition = -1; this.getPartitionInfo(topic); }, + onFilterChange(e) { + switch (e) { + case "body": + this.showBodyFilter = true; + this.showHeaderFilter = false; + break; + case "header": + this.showHeaderFilter = true; + this.showBodyFilter = false; + break; + default: + this.showBodyFilter = false; + this.showHeaderFilter = false; + break; + } + }, + getDeserializerList() { + request({ + url: KafkaMessageApi.deserializerList.url, + method: KafkaMessageApi.deserializerList.method, + }).then((res) => { + if (res.code != 0) { + notification.error({ + message: "error", + description: res.msg, + }); + } else { + this.deserializerList = res.data; + } + }); + }, + }, + created() { + this.getDeserializerList(); }, }; const defaultData = { realNum: 0, maxNum: 0 }; @@ -195,7 +304,31 @@ const defaultData = { realNum: 0, maxNum: 0 }; width: 400px !important; } +.filter-select { + width: 160px !important; +} + +.body-type { + width: 120px; +} + +.msg-body { + width: 400px; +} + .type-select { width: 150px !important; } +.hint { + font-size: smaller; + color: green; +} +.ant-advanced-search-form { + padding-bottom: 0px; +} +.hr { + height: 1px; + border: none; + border-top: 1px dashed #0066cc; +} diff --git a/ui/src/views/topic/Topic.vue b/ui/src/views/topic/Topic.vue index 66b9eb4..9703acd 100644 --- a/ui/src/views/topic/Topic.vue +++ b/ui/src/views/topic/Topic.vue @@ -15,6 +15,7 @@ placeholder="topic" class="input-w" v-decorator="['topic']" + @change="onTopicUpdate" /> @@ -22,8 +23,9 @@ 所有 普通 @@ -34,10 +36,10 @@ - 搜索 - - 重置 - + 刷新 + + + @@ -48,7 +50,12 @@ >新增 - +

{{ text }} @@ -215,6 +222,9 @@ export default { showUpdateReplicaDialog: false, showThrottleDialog: false, showSendStatsDialog: false, + filterTopic: "", + filteredData: [], + type: "normal", }; }, methods: { @@ -222,13 +232,12 @@ export default { e.preventDefault(); this.getTopicList(); }, - handleReset() { this.form.resetFields(); }, - getTopicList() { - Object.assign(this.queryParam, this.form.getFieldsValue()); + Object.assign(this.queryParam, { type: this.type }); + // delete this.queryParam.topic; this.loading = true; request({ url: KafkaTopicApi.getTopicList.url, @@ -237,6 +246,7 @@ export default { }).then((res) => { this.loading = false; this.data = res.data; + this.filter(); }); }, deleteTopic(topic) { @@ -255,6 +265,15 @@ export default { } }); }, + onTopicUpdate(input) { + this.filterTopic = input.target.value; + this.filter(); + }, + filter() { + this.filteredData = this.data.filter( + (e) => e.name.indexOf(this.filterTopic) != -1 + ); + }, openPartitionInfoDialog(topic) { this.selectDetail.resourceName = topic; this.showPartitionInfo = true;