uview-plus组件库全面升级更新，订单结算判断支付方式是否可用代码调整，公众号关注二维码修改

2025-10-21 10:44:31 +08:00
parent 5d98b7efc2
commit 5f3a307fec
395 changed files with 31264 additions and 2477 deletions
--- a/uni_modules/uview-plus/components/u-picker/picker.js
+++ b/uni_modules/uview-plus/components/u-picker/picker.js
@@ -7,6 +7,7 @@
 * @lastTime     : 2021-08-20 17:18:20
 * @FilePath     : /u-view2.0/uview-ui/libs/config/props/picker.js
 */
+import { t } from '../../libs/i18n'
 export default {
    // picker
    picker: {
@@ -17,15 +18,25 @@ export default {
        columns: [],
        loading: false,
        itemHeight: 44,
-        cancelText: '取消',
-        confirmText: '确定',
+        cancelText: t("up.common.cancel"),
+        confirmText: t("up.common.confirm"),
        cancelColor: '#909193',
-        confirmColor: '#3c9cff',
+        confirmColor: '',
        visibleItemCount: 5,
        keyName: 'text',
+		valueName: 'value',
        closeOnClickOverlay: false,
        defaultIndex: [],
 		immediateChange: true,
 		zIndex: 10076,
+        disabled: false,
+        disabledColor: '',
+        placeholder: t("up.common.pleaseChoose"),
+        inputProps: {},
+        bgColor: '',
+        round: 0,
+        duration: 300,
+        overlayOpacity: 0.5,
+        pageInline: false
    }
 }
--- a/uni_modules/uview-plus/components/u-picker/props.js
+++ b/uni_modules/uview-plus/components/u-picker/props.js
@@ -10,9 +10,23 @@ export const props = defineMixin({
            type: Boolean,
            default: false
        },
+        inputProps: {
+            type: Object,
+            default: () => {
+                return {}
+            }
+        },
+        disabled: {
+            type: Boolean,
+            default: () => defProps.picker.disabled
+        },
+		disabledColor:{
+			type: String,
+			default: () => defProps.picker.disabledColor
+		},
        placeholder: {
            type: String,
-            default: () => '请选择'
+            default: () => defProps.picker.placeholder
        },
        // 是否展示picker弹窗
        show: {
@@ -79,6 +93,11 @@ export const props = defineMixin({
            type: String,
            default: () => defProps.picker.keyName
        },
+		// 选项对象中，需要获取的属性值键名
+		valueName: {
+		    type: String,
+		    default: () => defProps.picker.valueName
+		},
        // 是否允许点击遮罩关闭选择器
        closeOnClickOverlay: {
            type: Boolean,
@@ -104,5 +123,30 @@ export const props = defineMixin({
 		    type: [String, Number],
 		    default: () => defProps.picker.zIndex
 		},
+        // 弹窗背景色，设置为transparent可去除白色背景
+        bgColor: {
+            type: String,
+            default: () => defProps.picker.bgColor
+        },
+        // 是否显示圆角
+        round: {
+            type: [Boolean, String, Number],
+            default: () => defProps.picker.round
+        },
+        // 动画时长，单位ms
+        duration: {
+            type: [String, Number],
+            default: () => defProps.picker.duration
+        },
+        // 遮罩的透明度，0-1之间
+        overlayOpacity: {
+            type: [Number, String],
+            default: () => defProps.picker.overlayOpacity
+        },
+        // 是否页面内展示
+        pageInline:{
+			type: Boolean,
+			default: () => defProps.picker.pageInline
+		}
    }
 })
--- a/uni_modules/uview-plus/components/u-picker/u-picker.vue
+++ b/uni_modules/uview-plus/components/u-picker/u-picker.vue
@@ -1,15 +1,27 @@
 <template>
-    <view class="u-picker-warrper">
-		<view v-if="hasInput" class="u-picker-input cursor-pointer" @click="showByClickInput = !showByClickInput">
-			<slot>
-				<up-input :placeholder="placeholder" :readonly="true" border="surround" v-model="inputLabel"></up-input>
-				<div class="input-cover"></div>
+    <view class="u-picker-wraper">
+		<view v-if="hasInput" class="u-picker-input cursor-pointer" @click="onShowByClickInput">
+			<slot :value="inputLabel">
 			</slot>
+			<slot name="trigger" :value="inputLabel">
+			</slot>
+			<up-input
+				v-if="!$slots['default'] && !$slots['$default'] && !$slots['trigger']"
+				:readonly="true"
+				v-model="inputLabel"
+				v-bind="inputPropsInner">
+			</up-input>
+			<cover-view class="input-cover"></cover-view>
 		</view>
 		<u-popup
 			:show="show || (hasInput && showByClickInput)"
 			:mode="popupMode"
 			:zIndex="zIndex"
+			:bgColor="bgColor"
+			:round="round"
+			:duration="duration"
+			:pageInline="pageInline"
+			:overlayOpacity="overlayOpacity"
 			@close="closeHandler"
 		>
 			<view class="u-picker">
@@ -31,11 +43,11 @@
 				<slot name="toolbar-bottom"></slot>
 				<picker-view
 					class="u-picker__view"
-					:indicatorStyle="`height: ${addUnit(itemHeight)}`"
+					:indicatorStyle="`height: ${addUnit(itemHeight, 'px')}`"
 					:value="innerIndex"
 					:immediateChange="immediateChange"
 					:style="{
-						height: `${addUnit(visibleItemCount * itemHeight)}`
+						height: `${addUnit(visibleItemCount * itemHeight, 'px')}`
 					}"
 					@change="changeHandler"
 				>
@@ -51,8 +63,8 @@
 							v-for="(item1, index1) in item"
 							:key="index1"
 							:style="{
-								height: addUnit(itemHeight),
-								lineHeight: addUnit(itemHeight),
+								height: addUnit(itemHeight, 'px'),
+								lineHeight: addUnit(itemHeight, 'px'),
 								fontWeight: index1 === innerIndex[index] ? 'bold' : 'normal',
 								display: 'block'
 							}"
@@ -89,6 +101,10 @@
 * @property {Boolean}			closeOnClickOverlay	是否允许点击遮罩关闭选择器（默认 false ）
 * @property {Array}			defaultIndex		各列的默认索引
 * @property {Boolean}			immediateChange		是否在手指松开时立即触发change事件（默认 true ）
+ * @property {String | Number}	round				圆角值（默认 0）
+ * @property {String }	        bgColor				背景色值（默认 '' ）
+ * @property {String | Number}	duration			动画时长，单位ms （默认 300 ）
+ * @property {String | Number}	overlayDuration		遮罩层动画时长，单位ms （默认 350 ）
 * @event {Function} close		关闭选择器时触发
 * @event {Function} cancel		点击取消按钮触发
 * @event {Function} change		当选择值变化时触发
@@ -117,6 +133,14 @@ export default {
 		}
 	},
 	watch: {
+		// 监听columns参数的变化
+		columns: {
+			immediate: true,
+			deep:true,
+			handler(n) {
+				this.setColumns(n)
+			}
+		},
 		// 监听默认索引的变化，重新设置对应的值
 		defaultIndex: {
 			immediate: true,
@@ -130,17 +154,57 @@ export default {
 				}
 			}
 		},
-		// 监听columns参数的变化
-		columns: {
+		modelValue: {
 			immediate: true,
 			deep:true,
-			handler(n) {
-				this.setColumns(n)
+			handler(n,o) {
+				// 修复uniapp调用子组件直接:defaultIndex="[0]"这样写
+				// v-model的值变化时候导致defaultIndexwatch也会执行的问题
+				//单纯vue不会出现
+				if (!o || n.join("/") != o.join("/")) {
+					let arr = [];
+					if (n != null) {
+						n.forEach((element, index) => {
+							let currentCols = this.getColumnValues(index)
+							if(!Array.isArray(currentCols) && currentCols.length===0) {
+								return
+							}
+							if (typeof currentCols[0] === 'object') {
+								currentCols.forEach((item, index2) => {
+									if (item[this.valueName] == element) {
+										arr.push(index2)
+									}
+								})
+							} else {
+								currentCols.forEach((item, index2) => {
+									if (item == element) {
+										arr.push(index2)
+									}
+								})
+							}
+						});
+						// alert(arr)
+						if (arr.length == 0 && this.defaultIndex) {
+						} else {
+							this.setIndexs(arr, true)
+						}
+					}
+				}
 			}
-		},
+		}
 	},
 	emits: ['close', 'cancel', 'confirm', 'change', 'update:modelValue', 'update:show'],
    computed: {
+		// input的props
+		inputPropsInner() {
+			return {
+				border: this.inputBorder,
+				placeholder: this.placeholder,
+				disabled: this.disabled,
+				disabledColor: this.disabledColor,
+				...this.inputProps
+			}
+		},
 		//已选&&已确认的值显示在input上面的文案
 		inputLabel() {
 			let firstItem = this.innerColumns[0] && this.innerColumns[0][0];
@@ -161,9 +225,9 @@ export default {
 			let res = []
 			//区分是不是对象数组
 			if (items[0] && Object.prototype.toString.call(items[0]) === '[object Object]') {
-				//对象数组返回id集合
+				//对象数组返回属性值集合
 				items.forEach(element => {
-					res.push(element && element['id'])
+					res.push(element && element[this.valueName])
 				});
 			} else {
 				//非对象数组返回元素集合
@@ -177,6 +241,11 @@ export default {
 	methods: {
 		addUnit,
 		testArray: test.array,
+		onShowByClickInput(){
+			if(!this.disabled){
+				this.showByClickInput=!this.showByClickInput;
+			}
+		},
 		// 获取item需要显示的文字，判别为对象还是文本
 		getItemText(item) {
 			if (test.object(item)) {
@@ -191,6 +260,7 @@ export default {
                if (this.hasInput) {
                    this.showByClickInput = false
                }
+				this.setDefault()
 				this.$emit('update:show', false)
 				this.$emit('close')
 			}
@@ -200,14 +270,13 @@ export default {
            if (this.hasInput) {
                this.showByClickInput = false
            }
+			this.setDefault()
 			this.$emit('update:show', false)
 			this.$emit('cancel')
 		},
-		// 点击工具栏的确定按钮
-		confirm() {
-			//如果用户有没有触发过change
-			if (!this.currentActiveValue.length) {
-				let arr = [0]
+		setDefault() {
+			let arr = [0]
+			if (this.lastIndex.length == 0) {
 				//如果有默认值&&默认值的数组长度是正确的，就用默认值
 				if (Array.isArray(this.defaultIndex) && this.defaultIndex.length == this.innerColumns.length) {
 					arr = [...this.defaultIndex];
@@ -215,13 +284,23 @@ export default {
 					//否则默认都选中第一个
 					arr = Array(this.innerColumns.length).fill(0);
 				}
-				this.setLastIndex(arr)
-				this.setIndexs(arr)
+			} else {
+				arr = deepClone(this.lastIndex)
+			}
+			this.setLastIndex(arr)
+			this.setIndexs(arr)
+		},
+		// 点击工具栏的确定按钮
+		confirm() {
+			// 如果用户有没有触发过change
+			if (!this.currentActiveValue.length) {
+				this.setDefault()
 			}
            this.$emit('update:modelValue', this.inputValue)
            if (this.hasInput) {
                this.showByClickInput = false
            }
+			this.setLastIndex(this.innerIndex)
 			this.$emit('update:show', false)
 			this.$emit('confirm', {
 				indexs: this.innerIndex,
@@ -241,7 +320,7 @@ export default {
 			// 通过对比前后两次的列索引，得出当前变化的是哪一列
 			for (let i = 0; i < value.length; i++) {
 				let item = value[i]
-				if (item !== (this.lastIndex[i] || 0)) { // 把undefined转为合法假值0
+				if (item !== undefined && item !== (this.lastIndex[i] || 0)) { // 把undefined转为合法假值0
 					// 设置columnIndex为当前变化列的索引
 					columnIndex = i
 					// index则为变化列中的变化项的索引
@@ -252,13 +331,14 @@ export default {
 			this.columnIndex = columnIndex
 			const values = this.innerColumns
 			// 将当前的各项变化索引，设置为"上一次"的索引变化值
-			this.setLastIndex(value)
+			// this.setLastIndex(value)
 			this.setIndexs(value)
 			//如果是非自带输入框才会在change时候触发v-model绑值的变化
 			//否则会非常的奇怪，用户未确认，值就变了
-			if (!this.hasInput) {
-				this.$emit('update:modelValue', this.inputValue)
-			}
+			// if (!this.hasInput) {
+			// 	this.$emit('update:modelValue', this.inputValue)
+			// }
+			
 			this.$emit('change', {
 				// #ifndef MP-WEIXIN || MP-LARK
 				// 微信小程序不能传递this，会因为循环引用而报错
@@ -337,7 +417,6 @@ export default {
 </script>

 <style lang="scss" scoped>
-	@import "../../libs/css/components.scss";

 	.u-picker {
 		position: relative;