feat:订阅Recall、日期查询

This commit is contained in:
吉浩茹
2025-10-11 10:03:58 +08:00
parent 4e66592cf8
commit 8b1a84f739
7 changed files with 777 additions and 349 deletions

View File

@ -7,16 +7,23 @@
<!-- 内容区域 -->
<view class="tabbar-content">
<!-- <view class="filter-item">
<text class="filter-label">时间范围</text>
<picker mode="date" :value="logDate" @change="onDateChange">
<view class="picker-view">
<text>{{ logDate }}</text>
<text class="picker-arrow"></text>
</view>
</picker>
</view> -->
<SystemLog ref="systemLog" />
<!-- 日期查询区域 -->
<!-- <view class="query-section">
<view class="query-row">
<view class="query-item">
<text class="query-label">查询日期</text>
<picker mode="date" :value="selectedDate" @change="onDateChange">
<view class="picker-view">
<text>{{ selectedDate }}</text>
<text class="picker-arrow">📅</text>
</view>
</picker>
</view>
<button class="query-button" @click="queryLogs">查询</button>
</view>
</view> -->
<SystemLog ref="systemLog" :query-date="selectedDate" />
<!-- 筛选区域 -->
<!-- <view class="filter-section">
@ -95,73 +102,17 @@ export default {
},
data() {
return {
selectedDate: this.getTodayDate(), // 默认选择今天
levelIndex: 0,
levelOptions: ['全部级别', '错误', '警告', '信息', '调试'],
logDate: '2025-09-29',
searchKeyword: '',
totalLogs: 1248,
errorLogs: 23,
warningLogs: 156,
infoLogs: 1069,
totalLogs: 0,
errorLogs: 0,
warningLogs: 0,
infoLogs: 0,
hasMore: true,
logs: [
{
level: 'error',
levelText: 'ERROR',
time: '2025-09-29 15:45:33',
message: 'MQTT连接失败',
details: 'Connection timeout after 5000ms'
},
{
level: 'warning',
levelText: 'WARN',
time: '2025-09-29 15:44:15',
message: '温度传感器读数异常',
details: 'Temperature reading: 999.9°C (超出正常范围)'
},
{
level: 'info',
levelText: 'INFO',
time: '2025-09-29 15:43:22',
message: '系统启动完成',
details: '所有服务已启动,系统运行正常'
},
{
level: 'error',
levelText: 'ERROR',
time: '2025-09-29 15:42:10',
message: '数据库连接失败',
details: 'Failed to connect to database: Connection refused'
},
{
level: 'info',
levelText: 'INFO',
time: '2025-09-29 15:41:55',
message: '用户登录成功',
details: '用户 admin 登录系统'
},
{
level: 'warning',
levelText: 'WARN',
time: '2025-09-29 15:40:33',
message: '内存使用率过高',
details: 'Memory usage: 85% (建议清理缓存)'
},
{
level: 'info',
levelText: 'INFO',
time: '2025-09-29 15:39:18',
message: '数据同步完成',
details: '同步了 156 条记录到云端'
},
{
level: 'error',
levelText: 'ERROR',
time: '2025-09-29 15:38:45',
message: '文件上传失败',
details: 'File size exceeds limit: 50MB > 10MB'
}
]
logs: [],
}
},
onLoad() {
@ -173,12 +124,50 @@ export default {
this.$refs.systemLog?.refreshData?.()
},
methods: {
// 获取今天的日期
getTodayDate() {
const today = new Date()
const year = today.getFullYear()
const month = String(today.getMonth() + 1).padStart(2, '0')
const day = String(today.getDate()).padStart(2, '0')
return `${year}-${month}-${day}`
},
// 日期选择变化
onDateChange(e) {
this.selectedDate = e.detail.value
console.log('选择日期:', this.selectedDate)
},
// 查询日志
queryLogs() {
console.log('查询日期:', this.selectedDate)
// 显示加载提示
uni.showLoading({
title: '查询中...'
})
// 调用子组件的查询方法
if (this.$refs.systemLog && this.$refs.systemLog.queryByDate) {
this.$refs.systemLog.queryByDate(this.selectedDate).finally(() => {
uni.hideLoading()
})
} else {
// 如果子组件方法不存在,则刷新数据
if (this.$refs.systemLog && this.$refs.systemLog.refreshData) {
this.$refs.systemLog.refreshData().finally(() => {
uni.hideLoading()
})
} else {
uni.hideLoading()
}
}
},
onLevelChange(e) {
this.levelIndex = e.detail.value
},
onDateChange(e) {
this.logDate = e.detail.value
},
searchLogs() {
console.log('搜索日志', {
level: this.levelOptions[this.levelIndex],
@ -246,6 +235,83 @@ export default {
overflow: hidden;
}
.header-title {
font-size: 32rpx;
font-weight: bold;
color: #333;
text-align: center;
}
/* 查询区域样式 */
.query-section {
background: white;
border-radius: 12rpx;
padding: 25rpx;
margin-bottom: 20rpx;
box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.05);
}
.query-row {
display: flex;
align-items: flex-end;
gap: 20rpx;
}
.query-item {
flex: 1;
display: flex;
flex-direction: column;
gap: 10rpx;
}
.query-label {
font-size: 24rpx;
color: #666;
font-weight: 500;
}
.picker-view {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20rpx;
background-color: #f8f8f8;
border-radius: 10rpx;
border: 2rpx solid #e0e0e0;
transition: all 0.2s ease;
}
.picker-view:active {
background-color: #f0f0f0;
border-color: #3f51b5;
}
.picker-arrow {
color: #3f51b5;
font-size: 24rpx;
}
.query-button {
background: linear-gradient(135deg, #3f51b5 0%, #5c6bc0 100%);
color: white;
padding: 20rpx 30rpx;
border-radius: 10rpx;
font-size: 28rpx;
font-weight: 500;
border: none;
box-shadow: 0 4rpx 12rpx rgba(63, 81, 181, 0.3);
transition: all 0.2s ease;
}
.query-button:active {
transform: translateY(1rpx);
box-shadow: 0 2rpx 8rpx rgba(63, 81, 181, 0.4);
}
.query-button::after {
border: none;
}
.filter-section {
background: white;
border-radius: 12rpx;