From 7adec1b9604b17d4a7cc57ceabcbc2e669547ef7 Mon Sep 17 00:00:00 2001
From: HongxuanG <1359774872@qq.com>
Date: Sat, 31 Oct 2026 22:20:44 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E7=99=BB=E5=BD=95?=
 =?UTF-8?q?=E7=8E=AF=E5=A2=83=E9=80=89=E6=8B=A9=E5=99=A8=E9=80=89=E4=B8=AD?=
 =?UTF-8?q?=E6=A1=86=E9=94=99=E4=BD=8D=E5=B9=B6=E5=8D=87=E8=87=B31.1.16?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/u-select/u-select.vue | 589 +++++++++++++++++++++++++++
 src/manifest.json                    |   4 +-
 src/pages.json                       |   1 +
 src/pages/sys/login/index.vue        |  28 +-
 4 files changed, 608 insertions(+), 14 deletions(-)
 create mode 100644 src/components/u-select/u-select.vue

diff --git a/src/components/u-select/u-select.vue b/src/components/u-select/u-select.vue
new file mode 100644
index 0000000..a05b2bd
--- /dev/null
+++ b/src/components/u-select/u-select.vue
@@ -0,0 +1,589 @@
+<template>
+	<view class="u-select">
+		<u-popup :maskCloseAble="maskCloseAble" mode="bottom" :popup="false" v-model="value" length="auto" :safeAreaInsetBottom="safeAreaInsetBottom" @close="close" :z-index="uZIndex">
+			<view class="u-select">
+				<view class="u-select__header" @touchmove.stop.prevent="">
+					<view
+						class="u-select__header__cancel u-select__header__btn"
+						:style="{ color: cancelColor }"
+						hover-class="u-hover-class"
+						:hover-stay-time="150"
+						@tap="getResult('cancel')"
+					>
+						{{cancelText}}
+					</view>
+					<view class="u-select__header__title">
+						{{title}}
+					</view>
+					<view
+						class="u-select__header__confirm u-select__header__btn"
+						:style="{ color: moving ? cancelColor : confirmColor }"
+						hover-class="u-hover-class"
+						:hover-stay-time="150"
+						@touchmove.stop=""
+						@tap.stop="getResult('confirm')"
+					>
+						{{confirmText}}
+					</view>
+				</view>
+				<view class="u-select__search" v-if="showSearch" @tap.stop>
+					<u-icon name="search" size="32" color="#909399"></u-icon>
+					<input
+						class="u-select__search__input"
+						:value="keyword"
+						:placeholder="searchPlaceholder"
+						confirm-type="search"
+						:adjust-position="true"
+						@input="onSearchInput"
+						@confirm="onSearchConfirm"
+					/>
+					<u-icon
+						v-if="keyword"
+						name="close-circle-fill"
+						size="28"
+						color="#c0c4cc"
+						@tap.stop="clearSearch"
+					></u-icon>
+				</view>
+				<view v-if="loading" class="u-select__loading">搜索中...</view>
+				<view class="u-select__body" :style="hasCustomItemHeight ? bodyStyle : null">
+					<view v-if="isColumnEmpty && !loading" class="u-select__empty">无匹配选项</view>
+					<picker-view
+						v-else-if="value && !isColumnEmpty"
+						:key="pickerKey"
+						@change="columnChange"
+						class="u-select__body__picker-view"
+						:style="pickerViewStyle"
+						:indicator-style="indicatorStyle"
+						:value="defaultSelector"
+						@pickstart="pickstart"
+						@pickend="pickend"
+					>
+						<picker-view-column v-for="(item, index) in columnData" :key="'col-' + pickerKey + '-' + index">
+							<view
+								class="u-select__body__picker-view__item"
+								:style="hasCustomItemHeight ? itemStyle : null"
+								v-for="(item1, index1) in item"
+								:key="item1[valueName] != null ? item1[valueName] : index1"
+							>
+								<view class="u-line-1" :style="hasCustomItemHeight ? itemStyle : null">{{ item1[labelName] }}</view>
+							</view>
+						</picker-view-column>
+					</picker-view>
+				</view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+
+<script>
+	/**
+	 * select 列选择器（本地覆盖：选项支持搜索）
+	 * @description 此选择器用于单列，多列，多列联动的选择场景。
+	 * @tutorial http://uviewui.com/components/select.html
+	 * @property {String} mode 模式选择，"single-column"-单列模式，"mutil-column"-多列模式，"mutil-column-auto"-多列联动模式
+	 * @property {Array} list 列数据，数组形式，见官网说明
+	 * @property {Boolean} v-model 布尔值变量，用于控制选择器的弹出与收起
+	 * @property {Boolean} show-search 是否显示搜索框(默认true)
+	 * @property {String} search-placeholder 搜索框占位文字
+	 * @event {Function} confirm 点击确定按钮，返回当前选择的值
+	 * @example <u-select v-model="show" :list="list"></u-select>
+	 */
+
+export default {
+	props: {
+		list: {
+			type: Array,
+			default() {
+				return [];
+			}
+		},
+		border: {
+			type: Boolean,
+			default: true
+		},
+		value: {
+			type: Boolean,
+			default: false
+		},
+		cancelColor: {
+			type: String,
+			default: '#606266'
+		},
+		confirmColor: {
+			type: String,
+			default: '#2979ff'
+		},
+		zIndex: {
+			type: [String, Number],
+			default: 0
+		},
+		safeAreaInsetBottom: {
+			type: Boolean,
+			default: false
+		},
+		maskCloseAble: {
+			type: Boolean,
+			default: true
+		},
+		defaultValue: {
+			type: Array,
+			default() {
+				return [0];
+			}
+		},
+		mode: {
+			type: String,
+			default: 'single-column'
+		},
+		valueName: {
+			type: String,
+			default: 'value'
+		},
+		labelName: {
+			type: String,
+			default: 'label'
+		},
+		childName: {
+			type: String,
+			default: 'children'
+		},
+		title: {
+			type: String,
+			default: ''
+		},
+		cancelText: {
+			type: String,
+			default: '取消'
+		},
+		confirmText: {
+			type: String,
+			default: '确认'
+		},
+		showSearch: {
+			type: Boolean,
+			default: true
+		},
+		searchPlaceholder: {
+			type: String,
+			default: '搜索'
+		},
+		remote: {
+			type: Boolean,
+			default: false
+		},
+		loading: {
+			type: Boolean,
+			default: false
+		},
+		debounce: {
+			type: Number,
+			default: 400
+		},
+		/** 选项行高（rpx）。App 端需与 indicator 同步，避免选中框错位 */
+		itemHeight: {
+			type: [Number, String],
+			default: 0
+		},
+		/** 可见行数，用于计算滚轮高度；需为奇数，选中行才能居中 */
+		visibleItemCount: {
+			type: [Number, String],
+			default: 5
+		}
+	},
+	data() {
+		return {
+			defaultSelector: [0],
+			columnData: [],
+			selectValue: [],
+			lastSelectIndex: [],
+			columnNum: 0,
+			moving: false,
+			keyword: '',
+			pickerKey: 0,
+			// 勿用 _ 前缀：Vue2 不会把 data 代理到 this
+			searchTimer: null,
+			lastSearchEmit: '',
+			lastSearchAt: 0
+		};
+	},
+	watch: {
+		value: {
+			immediate: true,
+			handler(val) {
+				if (val) {
+					this.keyword = '';
+					this.applyPickerData();
+					if (this.remote) this.emitRemoteSearch('');
+				} else {
+					this.clearSearchTimer();
+					this.lastSearchEmit = '';
+					this.lastSearchAt = 0;
+				}
+			}
+		},
+		list: {
+			handler() {
+				if (!this.value) return;
+				this.applyPickerData();
+			},
+		},
+		loading(val) {
+			// loading 从 true→false 时再刷一次滚轮，避免原生 picker-view 漏更
+			if (!val && this.value && this.remote) this.applyPickerData();
+		},
+	},
+	beforeDestroy() {
+		this.clearSearchTimer();
+	},
+	computed: {
+		uZIndex() {
+			return this.zIndex ? this.zIndex : this.$u.zIndex.popup;
+		},
+		isColumnEmpty() {
+			return !this.columnData || !this.columnData.length || !this.columnData[0] || !this.columnData[0].length;
+		},
+		hasCustomItemHeight() {
+			return Number(this.itemHeight) > 0;
+		},
+		itemHeightRpx() {
+			return Number(this.itemHeight) || 70;
+		},
+		itemHeightPx() {
+			return uni.upx2px(this.itemHeightRpx);
+		},
+		visibleCount() {
+			const n = Number(this.visibleItemCount) || 5;
+			return n % 2 === 0 ? n + 1 : n;
+		},
+		indicatorStyle() {
+			if (!this.hasCustomItemHeight) return '';
+			return `height: ${this.itemHeightPx}px;`;
+		},
+		itemStyle() {
+			return {
+				height: `${this.itemHeightPx}px`,
+				lineHeight: `${this.itemHeightPx}px`,
+			};
+		},
+		pickerViewStyle() {
+			if (!this.hasCustomItemHeight) return null;
+			return { height: `${this.itemHeightPx * this.visibleCount}px` };
+		},
+		bodyStyle() {
+			return this.pickerViewStyle;
+		},
+	},
+	methods: {
+		pickstart() {
+			// #ifdef MP-WEIXIN
+			this.moving = true;
+			// #endif
+		},
+		pickend() {
+			// #ifdef MP-WEIXIN
+			this.moving = false;
+			// #endif
+		},
+		readInputValue(e) {
+			if (typeof e === 'string' || typeof e === 'number') return String(e);
+			if (e && e.detail && e.detail.value != null) return String(e.detail.value);
+			if (e && e.target && e.target.value != null) return String(e.target.value);
+			return '';
+		},
+		clearSearchTimer() {
+			if (this.searchTimer) {
+				clearTimeout(this.searchTimer);
+				this.searchTimer = null;
+			}
+		},
+		emitRemoteSearch(keyword) {
+			this.clearSearchTimer();
+			const key = keyword == null ? '' : String(keyword).trim();
+			const now = Date.now();
+			if (key === this.lastSearchEmit && now - this.lastSearchAt < 80) return;
+			this.lastSearchEmit = key;
+			this.lastSearchAt = now;
+			this.$emit('search', key);
+		},
+		scheduleRemoteSearch() {
+			this.clearSearchTimer();
+			this.searchTimer = setTimeout(() => {
+				this.emitRemoteSearch(this.keyword);
+			}, this.debounce);
+		},
+		onSearchInput(e) {
+			this.keyword = this.readInputValue(e);
+			if (this.remote) this.scheduleRemoteSearch();
+			else this.applyFilter();
+		},
+		onSearchConfirm(e) {
+			this.keyword = this.readInputValue(e);
+			if (this.remote) this.emitRemoteSearch(this.keyword);
+			else this.applyFilter();
+		},
+		clearSearch() {
+			this.keyword = '';
+			if (this.remote) this.emitRemoteSearch('');
+			else this.applyFilter();
+		},
+		matchKeyword(text) {
+			const keyword = (this.keyword || '').trim().toLowerCase();
+			if (!keyword) return true;
+			return String(text == null ? '' : text).toLowerCase().indexOf(keyword) !== -1;
+		},
+		filterItems(list) {
+			if (!Array.isArray(list)) return [];
+			if (this.remote) return list.slice();
+			const keyword = (this.keyword || '').trim();
+			if (!keyword) return list.slice();
+			return list.filter(item => {
+				return this.matchKeyword(item && item[this.labelName]) || this.matchKeyword(item && item[this.valueName]);
+			});
+		},
+		applyPickerData() {
+			this.init();
+			this.pickerKey += 1;
+		},
+		applyFilter() {
+			this.applyPickerData();
+		},
+		init() {
+			this.setColumnNum();
+			this.setDefaultSelector();
+			this.setColumnData();
+			this.setSelectValue();
+		},
+		setDefaultSelector() {
+			const columnNum = this.columnNum || 1;
+			const defaultValue = Array.isArray(this.defaultValue) ? this.defaultValue.slice() : [];
+			this.defaultSelector = defaultValue.length === columnNum
+				? defaultValue
+				: Array(columnNum).fill(0);
+			this.lastSelectIndex = this.defaultSelector.slice();
+		},
+		setColumnNum() {
+			if(this.mode == 'single-column') this.columnNum = 1;
+			else if(this.mode == 'mutil-column') this.columnNum = this.list.length;
+			else if(this.mode == 'mutil-column-auto') {
+				let num = 1;
+				let column = this.list;
+				while(column[0] && column[0][this.childName]) {
+					column = column[0] ? column[0][this.childName] : {};
+					num ++;
+				}
+				this.columnNum = num;
+			}
+		},
+		setColumnData() {
+			let data = [];
+			this.selectValue = [];
+			if(this.mode == 'mutil-column-auto') {
+				const sourceList = this.filterItems(this.list);
+				if (!sourceList.length) {
+					this.columnData = [[]];
+					return;
+				}
+				let selector = this.defaultSelector.length ? this.defaultSelector[0] : 0;
+				if (selector >= sourceList.length) selector = 0;
+				let column = sourceList[selector];
+				for (let i = 0; i < this.columnNum; i++) {
+					if (i == 0) {
+						data[i] = sourceList;
+						column = column ? column[this.childName] : [];
+					} else {
+						data[i] = column || [];
+						const nextIndex = this.defaultSelector[i] || 0;
+						column = (column && column[nextIndex]) ? column[nextIndex][this.childName] : [];
+					}
+				}
+			} else if(this.mode == 'single-column') {
+				data[0] = this.filterItems(this.list);
+			} else {
+				data = (this.list || []).map(col => this.filterItems(Array.isArray(col) ? col : []));
+			}
+			this.columnData = data.slice();
+		},
+		setSelectValue() {
+			let tmp = null;
+			for(let i = 0; i < this.columnNum; i++) {
+				const col = this.columnData[i] || [];
+				tmp = col[this.defaultSelector[i]];
+				let data = {
+					value: tmp ? tmp[this.valueName] : null,
+					label: tmp ? tmp[this.labelName] : null
+				};
+				if(tmp && tmp.extra !== undefined) data.extra = tmp.extra;
+				this.selectValue.push(data)
+			}
+		},
+		columnChange(e) {
+			let index = null;
+			let columnIndex = e.detail.value;
+			this.selectValue = [];
+			this.defaultSelector = columnIndex;
+			if(this.mode == 'mutil-column-auto') {
+				this.lastSelectIndex.map((val, idx) => {
+					if (val != columnIndex[idx]) index = idx;
+				});
+				
+				for (let i = index + 1; i < this.columnNum; i++) {
+					this.columnData[i] = this.columnData[i - 1][i - 1 == index ? columnIndex[index] : 0][this.childName];
+					this.defaultSelector[i] = 0;
+				}
+				columnIndex.map((item, idx) => {
+					let data = this.columnData[idx][columnIndex[idx]];
+					let tmp = {
+						value: data ? data[this.valueName] : null,
+						label: data ? data[this.labelName] : null,
+					};
+					if(data && data.extra !== undefined) tmp.extra = data.extra;
+					this.selectValue.push(tmp);
+
+				})
+				this.lastSelectIndex = columnIndex;
+			} else if(this.mode == 'single-column') {
+				let data = this.columnData[0][columnIndex[0]];
+				let tmp = {
+					value: data ? data[this.valueName] : null,
+					label: data ? data[this.labelName] : null,
+				};
+				if(data && data.extra !== undefined) tmp.extra = data.extra;
+				this.selectValue.push(tmp);
+			} else if(this.mode == 'mutil-column') {
+				columnIndex.map((item, idx) => {
+					let data = this.columnData[idx][columnIndex[idx]];
+					let tmp = {
+						value: data ? data[this.valueName] : null,
+						label: data ? data[this.labelName] : null,
+					};
+					if(data && data.extra !== undefined) tmp.extra = data.extra;
+					this.selectValue.push(tmp);
+				})
+			}
+		},
+		close() {
+			this.$emit('input', false);
+			this.$set(this, 'defaultSelector', [0]);
+			this.keyword = '';
+			this.lastSearchEmit = '';
+			this.lastSearchAt = 0;
+		},
+		getResult(event = null) {
+			// #ifdef MP-WEIXIN
+			if (this.moving) return;
+			// #endif
+			if (event === 'confirm' && this.isColumnEmpty) {
+				this.$u.toast && this.$u.toast('无匹配选项');
+				return;
+			}
+			if (event) this.$emit(event, this.selectValue);
+			this.close();
+		},
+		selectHandler() {
+			this.$emit('click');
+		}
+	}
+};
+</script>
+
+<style scoped lang="scss">
+@import "~uview-ui/libs/css/style.components.scss";
+
+.u-select {
+
+	&__action {
+		position: relative;
+		line-height: $u-form-item-height;
+		height: $u-form-item-height;
+
+		&__icon {
+			position: absolute;
+			right: 20rpx;
+			top: 50%;
+			transition: transform .4s;
+			transform: translateY(-50%);
+			z-index: 1;
+
+			&--reverse {
+				transform: rotate(-180deg) translateY(50%);
+			}
+		}
+	}
+
+	&__hader {
+		&__title {
+			color: $u-content-color;
+		}
+	}
+
+	&--border {
+		border-radius: 6rpx;
+		border-radius: 4px;
+		border: 1px solid $u-form-item-border-color;
+	}
+
+	&__header {
+		@include vue-flex;
+		align-items: center;
+		justify-content: space-between;
+		height: 80rpx;
+		padding: 0 40rpx;
+	}
+
+	&__search {
+		@include vue-flex;
+		align-items: center;
+		margin: 0 24rpx 16rpx;
+		padding: 0 24rpx;
+		height: 80rpx;
+		background-color: #f5f5f5;
+		border-radius: 12rpx;
+		box-sizing: border-box;
+
+		&__input {
+			flex: 1;
+			height: 80rpx;
+			margin-left: 12rpx;
+			font-size: 30rpx;
+			color: #303133;
+		}
+	}
+
+	&__loading {
+		padding: 0 24rpx 8rpx;
+		font-size: 26rpx;
+		color: #909399;
+	}
+
+	&__empty {
+		@include vue-flex;
+		align-items: center;
+		justify-content: center;
+		height: 100%;
+		font-size: 30rpx;
+		color: #909399;
+	}
+
+	&__body {
+		width: 100%;
+		height: 500rpx;
+		overflow: hidden;
+		background-color: #fff;
+
+		&__picker-view {
+			height: 100%;
+			box-sizing: border-box;
+
+			&__item {
+				@include vue-flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 32rpx;
+				color: $u-main-color;
+				padding: 0 8rpx;
+			}
+		}
+	}
+}
+</style>
diff --git a/src/manifest.json b/src/manifest.json
index 71349ba..5960be7 100644
--- a/src/manifest.json
+++ b/src/manifest.json
@@ -2,8 +2,8 @@
     "name" : "浩拓织厂",
     "appid" : "__UNI__F79F300",
     "description" : "周尚-浩拓织厂",
-    "versionName" : "1.1.15",
-    "versionCode" : 115,
+    "versionName" : "1.1.16",
+    "versionCode" : 116,
     "transformPx" : false,
     "app-plus" : {
         "optimization" : {
diff --git a/src/pages.json b/src/pages.json
index f5b6e6f..0d68aca 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -1,5 +1,6 @@
 {
 	"easycom": {
+		"^u-select$": "@/components/u-select/u-select.vue",
 		"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
 	},
 	"pages": [
diff --git a/src/pages/sys/login/index.vue b/src/pages/sys/login/index.vue
index ce324c1..c7bd0a9 100644
--- a/src/pages/sys/login/index.vue
+++ b/src/pages/sys/login/index.vue
@@ -104,8 +104,9 @@
 		<!--				</view>-->
 		<!--			</view>-->
 		<!--		</div>-->
-		<u-picker class="login-env-picker" v-model="showApiUrlPicker" mode="selector" :range="apiUrlList" range-key="label"
-			@confirm="onApiUrlConfirm" @cancel="showApiUrlPicker = false"></u-picker>
+		<u-select class="login-env-picker" v-model="showApiUrlPicker" :list="apiUrlList" :default-value="apiUrlDefaultIndex"
+			title="选择服务器" :show-search="false" :item-height="88" :visible-item-count="5"
+			@confirm="onApiUrlConfirm" @cancel="showApiUrlPicker = false"></u-select>
 		<!-- 版本信息显示 -->
 		<view class="version-info">
 			<text class="version-text">版本: {{ appVersion }}</text>
@@ -165,6 +166,12 @@ export default {
 		},
 		envName() {
 			return process.env.VUE_APP_ENV_NAME || '';
+		},
+		apiUrlDefaultIndex() {
+			const list = this.apiUrlList || [];
+			let index = list.findIndex(item => item.value === this.selectedApiUrl);
+			if (index < 0) index = list.findIndex(item => item.label === '正式环境');
+			return [index >= 0 ? index : 0];
 		}
 	},
 
@@ -212,9 +219,8 @@ export default {
 		},
 
 		onApiUrlConfirm(e) {
-			console.log('e', JSON.stringify(e));
-			const selectedValue = this.apiUrlList[e[0]].value;
-			console.log('selectedValue', selectedValue)
+			const selectedValue = e && e[0] && e[0].value;
+			if (selectedValue == null) return;
 			this.selectedApiUrl = selectedValue;
 			this.showApiUrlPicker = false;
 
@@ -598,21 +604,19 @@ export default {
 </style>
 <style lang="scss" scoped>
 .login-env-picker {
-	::v-deep .u-picker-header,
-	::v-deep .u-btn-picker {
+	::v-deep .u-select__header,
+	::v-deep .u-select__header__btn {
 		height: 100rpx;
 		font-size: 36rpx;
 	}
 
-	::v-deep .u-picker-body {
-		height: 560rpx;
+	::v-deep .u-select__header__title {
+		font-size: 36rpx;
 	}
 
-	::v-deep .u-column-item,
+	::v-deep .u-select__body__picker-view__item,
 	::v-deep .u-line-1 {
-		height: 88rpx;
 		font-size: 40rpx;
-		line-height: 88rpx;
 	}
 }
 </style>