From 9b2cfc95090acef8add4397e0be5e99f906da159 Mon Sep 17 00:00:00 2001 From: lld <15027638633@163.com> Date: Sun, 28 Dec 2025 23:59:04 +0800 Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=97=A5=E5=BF=97=E8=BF=87?= =?UTF-8?q?=E6=BB=A4=E6=A1=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pages/demo/index.vue | 109 +++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 105 insertions(+), 4 deletions(-) diff --git a/pages/demo/index.vue b/pages/demo/index.vue index c699eb5..8df9969 100644 --- a/pages/demo/index.vue +++ b/pages/demo/index.vue @@ -126,17 +126,51 @@ + 消息日志 + + + + + + + × + + + + + + + + + + {{messageLogs.length === 0 ? '暂无消息日志' : '未找到匹配的日志内容'}} + + + @@ -211,14 +245,29 @@ export default { publishMessage: '', // 消息日志 messageLogs: [], - logHeight: 300 // 日志区域高度 + logHeight: 300, // 日志区域高度 + // 日志过滤 + logFilterKeyword: '' // 日志过滤关键词 + } + }, + computed: { + // 过滤后的日志列表 + filteredLogs() { + if (!this.logFilterKeyword) { + return this.messageLogs + } + // 模糊匹配主题(不区分大小写) + const keyword = this.logFilterKeyword.toLowerCase() + return this.messageLogs.filter(log => { + return log.topic.toLowerCase().includes(keyword) + }) } }, onReady() { // 计算日志区域高度 uni.getSystemInfo({ success: (res) => { - this.logHeight = res.windowHeight - 600 + this.logHeight = res.windowHeight - 650 // 调整高度适配过滤栏 } }) }, @@ -238,6 +287,25 @@ export default { } }, + // 清空所有消息日志 + clearAllLogs() { + uni.showModal({ + title: '确认清空', + content: '是否确定清空所有消息日志?', + success: (res) => { + if (res.confirm) { + this.messageLogs = [] + this.logFilterKeyword = '' // 清空过滤关键词 + uni.showToast({ + title: '日志已清空', + icon: 'success', + duration: 1500 + }) + } + } + }) + }, + // 添加日志 addLog(type, topic, message) { const time = new Date().toLocaleTimeString() @@ -446,10 +514,31 @@ export default { .section-title { font-size: 16px; font-weight: bold; - margin-bottom: 15px; color: #333; border-bottom: 1px solid #eee; padding-bottom: 8px; + margin-bottom: 15px; +} + +/* 日志过滤和清空区域 */ +.log-filter-wrapper { + display: flex; + align-items: center; + gap: 10px; + margin-bottom: 15px; +} + +/* 过滤输入框 */ +.filter-input { + flex: 1; +} + +/* 清空日志按钮 */ +.clear-log-btn { + height: 40px; + line-height: 40px; + padding: 0 15px; + white-space: nowrap; } .form-item { @@ -478,6 +567,10 @@ export default { border-radius: 4px; padding: 0 30px 0 10px; /* 右侧留出清除按钮空间 */ font-size: 14px; + /* 开启横向滚动 */ + white-space: nowrap; + overflow-x: auto; + -webkit-overflow-scrolling: touch; /* 顺滑滚动 */ } /* 文本域容器 */ @@ -561,6 +654,14 @@ export default { padding: 10px; } +/* 空日志提示 */ +.empty-log-tip { + text-align: center; + color: #999; + padding: 20px 0; + font-size: 14px; +} + .log-item { padding: 8px; border-bottom: 1px solid #eee;