–新增页面出库列表页面 和 出库详情页面，出库列表带搜索功能

pages/plugin/inList.vue

@@ -3,10 +3,23 @@
 		<scroll-view scroll-y class="page">
 			<cu-custom bgColor="bg-blue" :isBack="true"><block slot="backText">返回</block><block slot="content">入库列表</block></cu-custom>
 			
+			<!-- 搜索框 -->
+			<view class="search-box">
+				<input
+					class="search-input"
+					type="text"
+					v-model="searchKeyword"
+					placeholder="请输入入库批次"
+					placeholder-class="search-placeholder"
+				/>
+				<text class="search-icon" v-if="!searchKeyword">🔍</text>
+				<text class="clear-icon" v-else @click="clearSearch">✕</text>
+			</view>
+			
 			<!-- 空数据提示 -->
-			<view v-if="!inListData || inListData.length === 0" class="empty-container">
+			<view v-if="!filteredInListData || filteredInListData.length === 0" class="empty-container">
 				<text class="empty-icon">📦</text>
-				<text class="empty-text">暂无入库数据</text>
+				<text class="empty-text">{{searchKeyword ? '未找到匹配的入库批次' : '暂无入库数据'}}</text>
 			</view>
 			
 			<!-- 表格展示 -->
@@ -57,6 +70,7 @@
 				name: '',
 				duty: '',
 				inListData: [],
+				searchKeyword: '',
 				currentPage: 1,
 				pageSize: 20,
 				totalItems: 0,
@@ -64,14 +78,28 @@
 			}
 		},
 		computed: {
+			filteredInListData() {
+				if (!this.searchKeyword) {
+					return this.inListData
+				}
+				return this.inListData.filter(item => {
+					return item.in_ware_batch && item.in_ware_batch.includes(this.searchKeyword)
+				})
+			},
 			currentPageData() {
 				const start = (this.currentPage - 1) * this.pageSize
 				const end = start + this.pageSize
-				return this.inListData.slice(start, end)
+				return this.filteredInListData.slice(start, end)
 			}
 		},
 		watch: {
 			inListData(newVal) {
+				this.currentPage = 1
+			},
+			searchKeyword() {
+				this.currentPage = 1
+			},
+			filteredInListData(newVal) {
 				this.totalItems = newVal.length
 				this.totalPages = Math.ceil(this.totalItems / this.pageSize)
 				if (this.currentPage > this.totalPages && this.totalPages > 0) {
@@ -122,6 +150,10 @@
 				} else if (direction === 'next' && this.currentPage < this.totalPages) {
 					this.currentPage++
 				}
+			},
+			// 清空搜索
+			clearSearch() {
+				this.searchKeyword = ''
 			}
 		}
 	}
@@ -133,6 +165,39 @@
 		height: 100vh;
 	}
 	
+	/* 搜索框 */
+	.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;
+	}
+	
 	/* 空数据容器 */
 	.empty-container {
 		display: flex;