feat: 进仓等级可多选并提示改密，升至1.1.19

src/components/storefabric/SearchSelectPopup.vue

@@ -19,9 +19,16 @@
 					v-for="item in filteredList"
 					:key="String(item.value)"
 					class="search-select__item"
-					@click="confirm(item)"
-				>{{ item.label }}</view>
+					:class="{ 'is-selected': multiple && isPicked(item) }"
+					@click="onItemClick(item)"
+				>
+					<text class="search-select__item-label">{{ item.label }}</text>
+					<text v-if="multiple && isPicked(item)" class="search-select__check">已选</text>
+				</view>
 			</scroll-view>
+			<view v-if="multiple" class="search-select__footer">
+				<view class="search-select__ok" @click="confirmMultiple">确定</view>
+			</view>
 		</view>
 	</u-popup>
 </template>
@@ -33,12 +40,15 @@ export default {
 		title: { type: String, default: '请选择' },
 		placeholder: { type: String, default: '请输入名称搜索' },
 		list: { type: Array, default: () => [] },
+		multiple: { type: Boolean, default: false },
+		selected: { type: Array, default: () => [] },
 	},
 	data() {
 		return {
 			keyword: '',
 			panelMaxHeight: 520,
 			listHeight: 360,
+			picked: [],
 		};
 	},
 	computed: {
@@ -56,6 +66,7 @@ export default {
 		show(val) {
 			if (val) {
 				this.keyword = '';
+				this.picked = (this.selected || []).map((item) => String(item));
 				this.calcHeight();
 			}
 		},
@@ -70,16 +81,37 @@ export default {
 				const winH = sys.windowHeight || 600;
 				// 弹层约占屏高 65%，列表为弹层去掉标题+搜索后的剩余高度
 				this.panelMaxHeight = Math.floor(winH * 0.65);
-				this.listHeight = Math.max(220, this.panelMaxHeight - 140);
+				const chrome = this.multiple ? 230 : 140;
+				this.listHeight = Math.max(220, this.panelMaxHeight - chrome);
 			} catch (e) {
 				this.panelMaxHeight = 520;
-				this.listHeight = 360;
+				this.listHeight = this.multiple ? 280 : 360;
 			}
 		},
+		isPicked(item) {
+			return this.picked.includes(String(item.value));
+		},
+		onItemClick(item) {
+			if (!this.multiple) {
+				this.confirm(item);
+				return;
+			}
+			const key = String(item.value);
+			if (this.picked.includes(key)) {
+				this.picked = this.picked.filter((value) => value !== key);
+				return;
+			}
+			this.picked = this.picked.concat(key);
+		},
 		confirm(item) {
 			this.visible = false;
 			this.$emit('confirm', item);
 		},
+		confirmMultiple() {
+			const selected = (this.list || []).filter((item) => this.isPicked(item));
+			this.visible = false;
+			this.$emit('confirm', selected);
+		},
 	},
 };
 </script>
@@ -126,9 +158,42 @@ export default {
 	font-size: $pda-font-popup-sub;
 }
 .search-select__item {
-	padding: 32rpx 30rpx;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	min-height: $pda-row-min-height;
+	padding: 20rpx 30rpx;
+	box-sizing: border-box;
 	font-size: $pda-font-popup-item;
 	color: #202328;
 	border-bottom: 1px solid #f2f2f2;
 }
+.search-select__item-label {
+	flex: 1;
+	min-width: 0;
+	font-size: $pda-font-popup-item;
+	color: #202328;
+}
+.search-select__item.is-selected .search-select__item-label {
+	color: #2f78e6;
+}
+.search-select__check {
+	flex-shrink: 0;
+	margin-left: 16rpx;
+	font-size: $pda-font-action;
+	color: #2f78e6;
+}
+.search-select__footer {
+	flex-shrink: 0;
+	padding: 16rpx 30rpx 8rpx;
+}
+.search-select__ok {
+	height: $pda-button-height;
+	line-height: $pda-button-height;
+	text-align: center;
+	font-size: $pda-font-button;
+	color: #fff;
+	background: #2979ff;
+	border-radius: 46rpx;
+}
 </style>