diff --git a/pages/plugin/handList.vue b/pages/plugin/handList.vue index be7ea2f..f9b4f70 100644 --- a/pages/plugin/handList.vue +++ b/pages/plugin/handList.vue @@ -3,14 +3,33 @@ 返回交接列表 + + + + 🔍 + + + 📭 本日医废数据为空 + + + 📭 + 未找到匹配的科室 + + - + @@ -63,7 +82,8 @@ data() { return { handDetailsInfo: [], - groupedHandData: [] + groupedHandData: [], + searchKeyword: '' } }, computed: { @@ -92,6 +112,15 @@ totalCount: Math.round(group.totalCount), totalWeight: group.totalWeight.toFixed(2) })); + }, + // 过滤后的分组数据 + filteredGroupedData() { + if (!this.searchKeyword) { + return this.groupedHandData; + } + return this.groupedHandData.filter(dept => { + return dept.department && dept.department.includes(this.searchKeyword); + }); } }, mounted(){ @@ -133,6 +162,10 @@ uni.navigateTo({ url: `/pages/plugin/sign?id=${item.id}&handName=${item.handName}` }) + }, + // 清空搜索 + clearSearch() { + this.searchKeyword = ''; } } } @@ -181,6 +214,39 @@ color: #999; } + /* 搜索框 */ + .search-box { + margin: 12rpx; + padding: 0 24rpx; + background-color: #fff; + border-radius: 30rpx; + display: flex; + align-items: center; + box-shadow: 0 2rpx 12rpx rgba(74, 144, 226, 0.15); + border: 1px solid #e1e8f0; + } + + .search-input { + flex: 1; + height: 70rpx; + font-size: 26rpx; + color: #333; + } + + .search-placeholder { + color: #999; + } + + .search-icon, .clear-icon { + font-size: 28rpx; + margin-left: 10rpx; + } + + .clear-icon { + color: #999; + padding: 10rpx; + } + /* 数据包裹层 */ .data-wrapper { margin-bottom: 40rpx; @@ -317,40 +383,35 @@ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; + flex: 1; + min-width: 0; } .table-cell-type { - flex: 1.8; justify-content: flex-start; padding-left: 12rpx; - min-width: 120rpx; + flex: 1.5; } .table-cell-count { - flex: 0.7; color: #2980b9; font-weight: 600; - min-width: 60rpx; } .table-cell-weight { - flex: 0.7; color: #c0392b; font-weight: 600; - min-width: 60rpx; } .table-cell-hand { - flex: 1.2; color: #666; font-weight: 500; font-size: 20rpx; - min-width: 90rpx; } .table-cell-action { flex: 0.8; - min-width: 70rpx; + justify-content: center; } /* 类型图标 */