ai.touchui-vue 1.38.0 → 1.39.0

package/lib/utils/validate.js

@@ -318,11 +318,7 @@ var validate = function validate(dom) {
 					} else {
 						reg = new RegExp(rule);
 						if (!reg.test(value)) {
-							if (desc.indexOf('-label') > -1) {
-								formVue.errorTip = (0, _locale.t)('to.validate.tip.custom', desc, formVue.validateTip ? '\uFF0C' + formVue.validateTip : '');
-							} else {
-								formVue.errorTip = (0, _locale.t)('to.validate.tip.customRemark', desc, formVue.validateTip ? '\uFF0C' + formVue.validateTip : '');
-							}
+							formVue.errorTip = (0, _locale.t)('to.validate.tip.custom', desc, formVue.validateTip ? '\uFF0C' + formVue.validateTip : '');
 							allPass = false;
 							setHiddenErrorNodes(formEl);
 							return 'continue';
@@ -335,12 +331,7 @@ var validate = function validate(dom) {
 				}
 			} else if (required) {
 				formVue.errorType = 'required';
-				if (desc.indexOf('-label') > -1) {
-					var desc_label = desc.replace('-label', '');
-					formVue.errorTip = (0, _locale.t)('to.validate.tip.required', desc_label);
-				} else {
-					formVue.errorTip = (0, _locale.t)('to.validate.tip.requiredRemark', desc);
-				}
+				formVue.errorTip = (0, _locale.t)('to.validate.tip.required', desc);
 				allPass = false;
 				setHiddenErrorNodes(formEl);
 				return 'continue';
@@ -366,11 +357,7 @@ var validate = function validate(dom) {
 					} else {
 						_reg = new RegExp(rule);
 						if (!_reg.test(value)) {
-							if (desc.indexOf('-label') > -1) {
-								showTip(formEl, (0, _locale.t)('to.validate.tip.custom', desc, formVue.validateTip ? '\uFF0C' + formVue.validateTip : ''));
-							} else {
-								showTip(formEl, (0, _locale.t)('to.validate.tip.customRemark', desc, formVue.validateTip ? '\uFF0C' + formVue.validateTip : ''));
-							}
+							showTip(formEl, (0, _locale.t)('to.validate.tip.custom', desc, formVue.validateTip ? '\uFF0C' + formVue.validateTip : ''));
 							return {
 								v: false
 							};
@@ -382,12 +369,7 @@ var validate = function validate(dom) {
 					return 'continue';
 				}
 			} else if (required) {
-				if (desc.indexOf('-label') > -1) {
-					var _desc_label = desc.replace('-label', '');
-					showTip(formEl, (0, _locale.t)('to.validate.tip.required', _desc_label));
-				} else {
-					showTip(formEl, (0, _locale.t)('to.validate.tip.requiredRemark', desc));
-				}
+				showTip(formEl, (0, _locale.t)('to.validate.tip.required', desc));
 				return {
 					v: false
 				};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "ai.touchui-vue",
-	"version": "1.38.0",
+	"version": "1.39.0",
 	"description": "TouchUI Component Library for Vue.js.",
 	"main": "lib/ai.touchui-vue.common.js",
 	"files": [

package/packages/date-picker/src/date-picker.vue

@@ -201,6 +201,12 @@ export default {
 			},
 			immediate: true
 		},
+		iValue: {
+			handler(val) {
+				this.$emit('change', val)
+			},
+			immediate: true
+		},
 		displayFormat: {
 			handler(fmt) {
 				this.displayFormatRegExp = new RegExp(`^${String(fmt).replace(/\-|\//g, '\\-').replace(/[a-zA-Z]/g, '\\d')}$`)
@@ -215,7 +221,7 @@ export default {
 		}
 		if (this.value) {
 			this.iValue = this.value
-			this.$emit('change', this.value)
+			// this.$emit('change', this.value)
 		}
 	},
 	mounted() {
@@ -228,7 +234,7 @@ export default {
 		},
 		handleDisplayChange(value) {
 			this.datedisplay = value
-			this.$emit('change', this.datedisplay)
+			// this.$emit('change', this.datedisplay)
 		},
 		handleDisplayBlur() {
 			setTimeout(() => {
@@ -243,7 +249,7 @@ export default {
 					if (!this.displayFormatRegExp.test(this.datedisplay)) {
 						this.datedisplay = this.formatDate(new Date(this.datedisplay), this.displayFormat, this.datedisplay)
 						this.iValue = this.formatDate(new Date(this.datedisplay), this.displayFormat, this.datedisplay)
-						this.$emit('change', this.iValue)
+						// this.$emit('change', this.iValue)
 					} else {
 						this.changeValue(this.getDateFromValue(this.datedisplay, this.displayFormat), this.datedisplay)
 					}
@@ -271,7 +277,7 @@ export default {
 					this.datedisplay = value.split(' ').length > 1 ? value.split(' ')[1] : value
 					this.iValue = value.split(' ').length > 1 ? value.split(' ')[1] : value
 				}
-				this.$emit('change', this.iValue)
+				// this.$emit('change', this.iValue)
 			} else {
 				const flag = isNaN(new Date(value).getTime()) // 判断是否可以使用 2022-05 如果不可用，则替换为 2022/05
 				if (flag) {
@@ -279,15 +285,15 @@ export default {
 				}
 				this.datedisplay = this.formatDate(new Date(value), this.displayFormat, oldVal)
 				this.iValue = this.formatDate(new Date(value), this.valueFormat, oldVal)
-				this.$emit('change', this.iValue)
+				// this.$emit('change', this.iValue)
 			}
 		},
 		clear() {
-			const oldVal = this.iValue // 失去焦点时原本就是空的情况不应该 change
+			// const oldVal = this.iValue // 失去焦点时原本就是空的情况不应该 change
 			this.iValue = ''
-			if (oldVal) {
-				this.$emit('change', this.iValue)
-			}
+			// if (oldVal) {
+			// 	this.$emit('change', this.iValue)
+			// }
 			if (!this.$pc) {
 				this.$refs.layer.close()
 			}

package/packages/float/src/main.vue

@@ -88,6 +88,10 @@ export default {
 		dy: {
 			type: [String, Number],
 			default: 0
+		},
+		maxHeight: {
+			type: [Number, String],
+			default: ''
 		}
 	},
 	data() {
@@ -262,7 +266,7 @@ export default {
 					clearTimeout(timer)
 				}, 0);
 			} else if (this.link) {
-				this.$refs.content.style.height = ''
+				// this.$refs.content.style.height = '100em'
 				this.$nextTick(()=>{
 					// 宽度设置
 					if (!this.width) {
@@ -423,9 +427,35 @@ export default {
 						}
 
 						// 设置内容高度
+						let flag = true
+						if (this.maxHeight) {
+							let heig = this.maxHeight * this.$TouchUI.em()
+							if (useSpace > heig) {
+								flag = false
+								this.$refs.content.style.height = heig + 'px'
+							}
+						}
+						if (!flag) {
+							return false
+						}
 						if (useSpace < contentHeight) {
 							this.isOver = true
 							this.$refs.content.style.height = useSpace + 'px'
+						} else {
+							if (this.$refs.content.children[0] && this.$refs.content.children[0].className.includes('to-scroll')) {
+								let count = 0
+								let arr = this.$refs.content.children[0].children[0].children
+								for (let i = 0; i < arr.length; i++) {
+									count += arr[i].offsetHeight
+								}
+								if (useSpace > count) {
+									this.isOver = false
+									this.$refs.content.style.height = (count + 2) + 'px'
+								} else {
+									this.isOver = true
+									this.$refs.content.style.height = useSpace + 'px'
+								}
+							}
 						}
 					}
 				})
@@ -456,9 +486,9 @@ export default {
 		},
 		closeAction() {
 			// 重置 content 高度，这样下次打开的时候才好重新计算是否超过整体高度
-			if (!this.height) {
-				this.$refs.content.style.height = ''
-			}
+			// if (!this.height) {
+			// 	this.$refs.content.style.height = ''
+			// }
 			this.isOver = false
 
 			// 关闭 float 后，移除事件监听
@@ -469,9 +499,9 @@ export default {
 			this.$emit('beforeClose')
 			this.show = false;
 			this.opened = false;
-			if (this.$refs.content && this.$refs.content.style.height !== 'auto' && (this.iposition === 'top' || this.iposition === 'bottom') && !this.height) {
-				this.$refs.content.style.height = 'auto'
-			}
+			// if (this.$refs.content && this.$refs.content.style.height !== 'auto' && (this.iposition === 'top' || this.iposition === 'bottom') && !this.height) {
+			// 	this.$refs.content.style.height = 'auto'
+			// }
 			this.$emit('closed')
 			setTimeout(() => {
 				if (this.lazy) {

package/packages/import/src/import.vue

@@ -1,7 +1,7 @@
 <template>
 	<span class="to-button-import to-form-readonly">
 		<to-button v-if="!iconMode" ref="button" :fillet="fillet" :disabled="disabled" unfold :icon="$attrs.icon || 'import'" v-bind="$attrs" :progress="progress" @click.stop="$refs.float.toggle('button')">{{ buttonText ? buttonText : t('to.import.button') }}</to-button>
-		<to-icon v-else ref="button" link value="import" mode="none" @click.stop="$refs.float.toggle('button')"></to-icon>
+		<to-icon v-else ref="button" link value="import" mode="none" v-bind="$attrs" @click.stop="$refs.float.toggle('button')"></to-icon>
 		<to-float ref="float" :width="30" :lazy="false" :slide="$phone ? true : false" :position="$phone ? 'bottom' : 'auto'" @closed="$emit('closed')" @beforeClose="$emit('beforeClose')" @opened="$emit('opened')" @beforeOpen="$emit('beforeOpen')">
 			<to-padding>
 				<to-input ref="filename" v-model="importFileName" :fillet="fillet" v-bind="inputProps" width="full" type="text" :placeholder="t('to.import.tip.placeholder')" readonly>

package/packages/input/src/input.vue

@@ -386,11 +386,7 @@ export default {
 			if (this.desc) {
 				return this.desc;
 			} else if (this.ToFormItem && this.ToFormItem.label) {
-				if (typeof this.rule === 'string') {
-					return this.ToFormItem.label + '-label';
-				} else {
-					return this.ToFormItem.label;
-				}
+				return this.ToFormItem.label;
 			} else {
 				return ''
 			}
@@ -464,6 +460,7 @@ export default {
 		}
 	},
 	mounted() {
+		// console.log('input mounted')
 		if (this.$platform === 'pc') {
 			this.$el.addEventListener('mouseover', this.showClear);
 			this.$el.addEventListener('mouseout', this.hideClear);

package/packages/progress/src/progress.vue

@@ -5,6 +5,7 @@
 				<circle :r="offsetWidth / 2 - strokeWidth / 2" :cy="offsetWidth / 2" :cx="offsetWidth / 2" :stroke-width="strokeWidth" class="to-progressBg" stroke-linejoin="round" stroke-linecap="round" fill="none" />
 				<circle
 					class="to-progressBar"
+					:class="animation?'animation':''"
 					:r="radius"
 					:cy="offsetWidth / 2"
 					:cx="offsetWidth / 2"
@@ -116,6 +117,10 @@ export default {
 		barSize: {
 			type: [Number, String],
 			default: 1
+		},
+		animation: {
+			type: Boolean,
+			default: true
 		}
 	},
 	data() {

package/packages/select/src/select.vue

@@ -12,7 +12,7 @@
 			>
 		</span>
 		<span v-if="$slots.prefix" class="to-selectPrefix"><slot name="prefix"></slot></span>
-		<span class="to-selectContent" :class="setContentClass" @click="click">
+		<span ref="selectContentRef" class="to-selectContent" :class="setContentClass" @click="click">
 
 			<!-- 前缀文本/图标 -->
 			<to-icon v-if="icon" v-bind="iconProps" :value="icon" mode="none" class="to-selectIcon"></to-icon>
@@ -46,18 +46,19 @@
 
 				<!-- 多选 -->
 				<template v-else>
-					<span v-if="selected.filter(item => !item.hide).length === 0 && !inputable && !filterable && !setDataFn" class="to-selectValue">{{ placeholder }}</span>
+					<span v-if="conTags.filter(item => !item.hide).length === 0 && !inputable && !filterable && !setDataFn" class="to-selectValue">{{ placeholder }}</span>
 					<span v-if="(isAll && useAllText)" v-color="allTextColor" class="to-selectValue">{{ allText }}</span>
 					<span class="to-selectTag">
-						<template v-if="selected.length > 0 && !(isAll && useAllText)">
-							<template v-for="(item, index) in selected">
-								<to-tag v-if="!item.hide" :key="index" color="fg" mode="plain" :deletable="!disabled" @delete="removeTag(item)">{{ item[iLabelText] }}</to-tag>
+						<template v-if="conTags.length > 0 && !(isAll && useAllText) || (showCount && count > 0)">
+							<template v-for="(item, index) in conTags">
+								<to-tag v-if="!item.hide" :key="index" :class="{'show-count': isNeedMin}" color="fg" mode="plain" :deletable="!disabled" @delete="removeTag(item)">{{ item[iLabelText] }}</to-tag>
 							</template>
+							<to-tag v-if="showCount && count > 0" class="tag-count" color="fg" mode="plain">+{{ count }}</to-tag>
 						</template>
-						<template v-if="!$phone || ($phone && selected.length === 0)">
-							<to-input v-if="inputable && !filterable" ref="input" v-model="multipleInputValue" :sp-chars="spChars" :readonly="$phone" prevent-focus mode="none" :placeholder="selected.filter(item => !item.hide).length > 0 ? '' : placeholder " @focus="multipleInputFocus" @blur="multipleInputBlur"></to-input>
-							<to-input v-if="filterable" ref="filter" v-model="multipleFilterValue" :sp-chars="inputable ? spChars : false" :readonly="$phone" prevent-focus mode="none" :placeholder="selected.filter(item => !item.hide).length > 0 ? '' : placeholder " @focus="multipleFilterFocus" @blur="multipleFilterBlur"></to-input>
-							<to-input v-if="setDataFn" ref="filter" v-model="setDataInputValue" :sp-chars="inputable ? spChars : false" prevent-focus mode="none" :placeholder="selected.filter(item => !item.hide).length > 0 ? '' : placeholder " @focus="multipleFilterFocus" @blur="multipleFilterBlur"></to-input>
+						<template v-if="!$phone || ($phone && conTags.length === 0)">
+							<to-input v-if="inputable && !filterable" ref="input" v-model="multipleInputValue" :sp-chars="spChars" :readonly="$phone" prevent-focus mode="none" :placeholder="conTags.filter(item => !item.hide).length > 0 ? '' : placeholder " @focus="multipleInputFocus" @blur="multipleInputBlur"></to-input>
+							<to-input v-if="filterable" ref="filter" v-model="multipleFilterValue" :sp-chars="inputable ? spChars : false" :readonly="$phone" prevent-focus mode="none" :placeholder="conTags.filter(item => !item.hide).length > 0 ? '' : placeholder " @focus="multipleFilterFocus" @blur="multipleFilterBlur"></to-input>
+							<to-input v-if="setDataFn" ref="filter" v-model="setDataInputValue" :sp-chars="inputable ? spChars : false" prevent-focus mode="none" :placeholder="conTags.filter(item => !item.hide).length > 0 ? '' : placeholder " @focus="multipleFilterFocus" @blur="multipleFilterBlur"></to-input>
 						</template>
 					</span>
 				</template>
@@ -86,7 +87,7 @@
 				不能为空
 			</template>
 		</span>
-		<to-float v-if="optionDisplay !== 'none'" ref="layer" :align="optionAlign" class="to-selectLayer" :lazy="lazy" :slide="layerSlide" :width="iOptionWidth" :position="layerPosition" @closed="layerClose" @mousedown="layerMousedown">
+		<to-float v-if="optionDisplay !== 'none'" ref="layer" :align="optionAlign" class="to-selectLayer" :lazy="lazy" :slide="layerSlide" :width="iOptionWidth" :position="layerPosition" :max-height="maxHeight" @closed="layerClose" @mousedown="layerMousedown">
 
 			<to-padding v-if="dataLoading" v-align="'center'" :value="2">
 				<to-icon value="loading"></to-icon>
@@ -485,6 +486,14 @@ export default {
 		valueType: {
 			type: String,
 			default: ''
+		},
+		showCount: {
+			type: Boolean,
+			default: false
+		},
+		maxHeight: {
+			type: [Number, String],
+			default: ''
 		}
 	},
 	data() {
@@ -511,7 +520,10 @@ export default {
 			layerPosition: 'auto',
 			disabled: this.readonly,
 			iApiHeaders: {},
-			inputing: false
+			inputing: false,
+			count: 0,
+			conTags: [],
+			isNeedMin: false
 		}
 	},
 	computed: {
@@ -655,6 +667,9 @@ export default {
 			} else {
 				arr.push('to-box-mode-toast')
 			}
+			// if (this.showCount) {
+			// 	arr.push('to-select-showCount')
+			// }
 			return arr
 		},
 		validateRequired() {
@@ -670,11 +685,7 @@ export default {
 			if (this.desc) {
 				return this.desc
 			} else if (this.ToFormItem && this.ToFormItem.label) {
-				if (typeof this.rule === 'string') {
-					return this.ToFormItem.label + '-label';
-				} else {
-					return this.ToFormItem.label;
-				}
+				return this.ToFormItem.label;
 			} else {
 				return ''
 			}
@@ -715,8 +726,10 @@ export default {
 			handler(val) {
 				if (val) {
 					this.selected = []
+					this.conTags = []
 				} else {
 					this.selected = {}
+					this.conTags = {}
 				}
 			},
 			immediate: true
@@ -769,7 +782,9 @@ export default {
 				} else {
 					this.$emit('change', val, this.selected)
 				}
-
+				if (this.showCount && this.multiple) {
+					this.getAllTag()
+				}
 				const detail = {
 					name: 'ToSelect',
 					value: val,
@@ -818,6 +833,11 @@ export default {
 		}
 	},
 	created() {
+		this.$nextTick(() => {
+			if (this.showCount && this.multiple) {
+				this.getAllTag()
+			}
+		})
 		this.iLabelText = this.labelText
 		this.iValueText = this.valueText
 		this.iResPath = this.resPath
@@ -842,6 +862,59 @@ export default {
 		}
 	},
 	methods: {
+		calculateTagLayout(isRecalculate = false) {
+			this.$nextTick(() => {
+				const tags = this.$el.querySelectorAll('.to-selectTag .to-tag')
+				const selectContent = this.$refs.selectContentRef
+				const gap = selectContent.scrollWidth - selectContent.clientWidth
+				if (gap > 0) {
+					this.isNeedMin = true
+					return false
+				}
+				this.isNeedMin = false
+				let firstTagTop = 0
+				if (tags.length > 1) {
+					for (let i = 0; i < tags.length; i++) {
+						if (i === 0) {
+							firstTagTop = tags[i].offsetTop
+						} else {
+							if (tags[i].offsetTop !== firstTagTop) {
+								if (!tags[i].className.includes('tag-count')) {
+									const index = isRecalculate && this.count > 0 ? (i - 1) : i
+									this.conTags = this.selected.filter((item, idx) => idx < index)
+									let arrs = this.selected.filter((item, idx) => idx >= index)
+									this.count = arrs.length
+									if (!isRecalculate) {
+										this.layoutCount()
+									}
+									break
+								} else {
+									if (i >= 2) {
+										const index = isRecalculate && this.count > 0 ? (i - 1) : i
+										this.conTags = this.selected.filter((item, idx) => idx < index)
+										let arrs = this.selected.filter((item, idx) => idx >= index)
+										this.count = arrs.length
+										if (!isRecalculate) {
+											this.layoutCount()
+										}
+										break
+									} else {
+										this.isNeedMin = true
+									}
+								}
+							}
+						}
+					}
+				}
+			})
+		},
+		getAllTag() {
+			this.count = 0
+			this.calculateTagLayout(false)
+		},
+		layoutCount() {
+			this.calculateTagLayout(true)
+		},
 		valueChange(val) {
 			if (!this.multiple) {
 				if (this.inputable) {
@@ -903,14 +976,17 @@ export default {
 				if (fn && fn.then) {
 					fn.then(flag => {
 						this.selected = selected
+						this.conTags = selected
 					}).catch((e)=>{})
 				} else {
 					if (fn) {
 						this.selected = selected
+						this.conTags = selected
 					}
 				}
 			} else {
 				this.selected = selected
+				this.conTags = selected
 			}
 
 		},
@@ -1191,9 +1267,9 @@ export default {
 		},
 		adjustLayer() {
 			if (this.optionDisplay !== 'none' && this.$refs.layer.show) {
-				this.$nextTick(()=>{
+				setTimeout(()=>{
 					this.$refs.layer.set(this.$refs.link)
-				})
+				}, 10)
 			}
 		},
 		openLayer() {