feat: 默认测试环境并优化出仓与网络提示

2026-09-24 17:56:06 +08:00
parent 53a059f16b
commit 26c7085ab2
10 changed files with 182 additions and 43 deletions
@@ -0,0 +1,100 @@
+<template>
+	<u-popup v-model="visible" mode="bottom" :safe-area-inset-bottom="true" border-radius="16">
+		<view class="search-select">
+			<view class="search-select__bar">
+				<text class="search-select__title">{{ title }}</text>
+				<text class="search-select__cancel" @click="visible = false">取消</text>
+			</view>
+			<view class="search-select__search">
+				<u-search v-model="keyword" :placeholder="placeholder" :show-action="false" />
+			</view>
+			<scroll-view scroll-y class="search-select__list">
+				<view v-if="!filteredList.length" class="search-select__empty">暂无匹配数据</view>
+				<view
+					v-for="item in filteredList"
+					:key="String(item.value)"
+					class="search-select__item"
+					@click="confirm(item)"
+				>{{ item.label }}</view>
+			</scroll-view>
+		</view>
+	</u-popup>
+</template>
+
+<script>
+export default {
+	props: {
+		show: { type: Boolean, default: false },
+		title: { type: String, default: '请选择' },
+		placeholder: { type: String, default: '请输入名称搜索' },
+		list: { type: Array, default: () => [] },
+	},
+	data() {
+		return {
+			keyword: '',
+		};
+	},
+	computed: {
+		visible: {
+			get() { return this.show; },
+			set(val) { this.$emit('update:show', val); },
+		},
+		filteredList() {
+			const keyword = (this.keyword || '').trim().toLowerCase();
+			if (!keyword) return this.list;
+			return this.list.filter((item) => String(item.label || '').toLowerCase().includes(keyword));
+		},
+	},
+	watch: {
+		show(val) {
+			if (val) this.keyword = '';
+		},
+	},
+	methods: {
+		confirm(item) {
+			this.visible = false;
+			this.$emit('confirm', item);
+		},
+	},
+};
+</script>
+
+<style scoped>
+.search-select {
+	background: #fff;
+	padding-bottom: 20rpx;
+}
+.search-select__bar {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	padding: 24rpx 30rpx 12rpx;
+}
+.search-select__title {
+	font-size: 32rpx;
+	font-weight: bold;
+	color: #202328;
+}
+.search-select__cancel {
+	font-size: 28rpx;
+	color: #888;
+}
+.search-select__search {
+	padding: 0 24rpx 12rpx;
+}
+.search-select__list {
+	height: 640rpx;
+}
+.search-select__empty {
+	padding: 80rpx 0;
+	text-align: center;
+	color: #999;
+	font-size: 28rpx;
+}
+.search-select__item {
+	padding: 28rpx 30rpx;
+	font-size: 30rpx;
+	color: #202328;
+	border-bottom: 1px solid #f2f2f2;
+}
+</style>