ai.touchui-vue 1.31.3 → 1.32.0

package/src/utils/dom.js

@@ -1,301 +1,301 @@
-/* istanbul ignore next */
-
-import Vue from 'vue';
-
-const isServer = Vue.prototype.$isServer;
-const SPECIAL_CHARS_REGEXP = /([\:\-\_]+(.))/g;
-const MOZ_HACK_REGEXP = /^moz([A-Z])/;
-const ieVersion = isServer ? 0 : Number(document.documentMode);
-
-/* istanbul ignore next */
-const trim = function(string) {
-	return (string || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '');
-};
-/* istanbul ignore next */
-const camelCase = function(name) {
-	return name.replace(SPECIAL_CHARS_REGEXP, function(_, separator, letter, offset) {
-		return offset ? letter.toUpperCase() : letter;
-	}).replace(MOZ_HACK_REGEXP, 'Moz$1');
-};
-
-/* istanbul ignore next */
-export const on = (function() {
-	if (!isServer && document.addEventListener) {
-		return function(element, event, handler) {
-			if (element && event && handler) {
-				element.addEventListener(event, handler, false);
-			}
-		};
-	} else {
-		return function(element, event, handler) {
-			if (element && event && handler) {
-				element.attachEvent('on' + event, handler);
-			}
-		};
-	}
-})();
-
-/* istanbul ignore next */
-export const off = (function() {
-	if (!isServer && document.removeEventListener) {
-		return function(element, event, handler) {
-			if (element && event) {
-				element.removeEventListener(event, handler, false);
-			}
-		};
-	} else {
-		return function(element, event, handler) {
-			if (element && event) {
-				element.detachEvent('on' + event, handler);
-			}
-		};
-	}
-})();
-
-/* istanbul ignore next */
-export const once = function(el, event, fn) {
-	var listener = function() {
-		if (fn) {
-			fn.apply(this, arguments);
-		}
-		off(el, event, listener);
-	};
-	on(el, event, listener);
-};
-
-/* istanbul ignore next */
-export function hasClass(el, cls) {
-	if (!el || !cls) return false;
-	if (cls.indexOf(' ') !== -1) throw new Error('className should not contain space.');
-	if (el.classList) {
-		return el.classList.contains(cls);
-	} else {
-		return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1;
-	}
-}
-
-/* istanbul ignore next */
-export function addClass(el, cls) {
-	if (!el) return;
-	var curClass = el.className;
-	var classes = (cls || '').split(' ');
-
-	for (var i = 0, j = classes.length; i < j; i++) {
-		var clsName = classes[i];
-		if (!clsName) continue;
-
-		if (el.classList) {
-			el.classList.add(clsName);
-		} else if (!hasClass(el, clsName)) {
-			curClass += ' ' + clsName;
-		}
-	}
-	if (!el.classList) {
-		el.className = curClass;
-	}
-}
-
-/* istanbul ignore next */
-export function removeClass(el, cls) {
-	if (!el || !cls) return;
-	var classes = cls.split(' ');
-	var curClass = ' ' + el.className + ' ';
-
-	for (var i = 0, j = classes.length; i < j; i++) {
-		var clsName = classes[i];
-		if (!clsName) continue;
-
-		if (el.classList) {
-			el.classList.remove(clsName);
-		} else if (hasClass(el, clsName)) {
-			curClass = curClass.replace(' ' + clsName + ' ', ' ');
-		}
-	}
-	if (!el.classList) {
-		el.className = trim(curClass);
-	}
-}
-
-/* istanbul ignore next */
-export const getStyle = function(element, styleName) {
-	if (isServer) return;
-	if (!element || !styleName) return null;
-	styleName = camelCase(styleName);
-	if (styleName === 'float') {
-		styleName = 'cssFloat';
-	}
-	var currentStyle = element.currentStyle || document.defaultView.getComputedStyle(element, '');
-	return currentStyle[styleName] || '';
-};
-
-/* istanbul ignore next */
-export function setStyle(element, styleName, value) {
-	if (!element || !styleName) return;
-
-	if (typeof styleName === 'object') {
-		for (var prop in styleName) {
-			if (Object.prototype.hasOwnProperty.call(styleName, prop)) {
-				setStyle(element, prop, styleName[prop]);
-			}
-		}
-	} else {
-		styleName = camelCase(styleName);
-		if (styleName === 'opacity' && ieVersion < 9) {
-			element.style.filter = isNaN(value) ? '' : 'alpha(opacity=' + value * 100 + ')';
-		} else {
-			element.style[styleName] = value;
-		}
-	}
-}
-
-export const isScroll = (el, vertical) => {
-	if (isServer) return;
-
-	const determinedDirection = vertical !== null || vertical !== undefined;
-	const overflow = determinedDirection
-		? vertical
-			? getStyle(el, 'overflow-y')
-			: getStyle(el, 'overflow-x')
-		: getStyle(el, 'overflow');
-
-	return overflow.match(/(scroll|auto)/);
-};
-
-export const getScrollContainer = (el, vertical) => {
-	if (isServer) return;
-
-	let parent = el;
-	while (parent) {
-		if ([window, document, document.documentElement].includes(parent)) {
-			return window;
-		}
-		if (isScroll(parent, vertical)) {
-			return parent;
-		}
-		parent = parent.parentNode;
-	}
-
-	return parent;
-};
-
-export const isInContainer = (el, container) => {
-	if (isServer || !el || !container) return false;
-
-	const elRect = el.getBoundingClientRect();
-	let containerRect;
-
-	if ([window, document, document.documentElement, null, undefined].includes(container)) {
-		containerRect = {
-			top: 0,
-			right: window.innerWidth,
-			bottom: window.innerHeight,
-			left: 0
-		};
-	} else {
-		containerRect = container.getBoundingClientRect();
-	}
-
-	return elRect.top < containerRect.bottom &&
-		elRect.bottom > containerRect.top &&
-		elRect.right > containerRect.left &&
-		elRect.left < containerRect.right;
-};
-
-/* get event composedPath */
-export function getEventPath(evt) {
-	const path = Array.isArray(evt) ? evt : (evt.composedPath && evt.composedPath()) || evt.path;
-	const target = path ? path[0] : evt.target;
-	if (path != null) {
-		return (path.indexOf(window) < 0) ? path.concat(window) : path;
-	}
-	if (target === window) {
-		return [window];
-	}
-	function getParents(node, memo) {
-		memo = memo || [];
-		const parentNode = node.parentNode;
-		if (!parentNode) {
-			return memo;
-		} else {
-			return getParents(parentNode, memo.concat(parentNode));
-		}
-	}
-	return [target].concat(getParents(target), window);
-}
-
-/**
-   *  兼容获取document element的dataset
-   * @param {DocumentElement} ele
-   * @returns
-   */
-export function getDataSet(ele) {
-	if (!ele) return
-	if (ele.dataset) return ele.dataset
-	else {
-		// 以下是兼容代码
-		var dataset = {}
-		var ele_split = ele.outerHTML.split(' ')
-		for (var i = 0, element; i < ele_split.length; i++) {
-			element = ele_split[i]
-			if (element.substring(0, 4) === 'data') {
-				if (element.indexOf('>') !== -1) {
-					element = element.split('>')[0]
-				}
-				var ele_key = element.split('=')[0].slice(5)
-				var ele_value = element.split('=')[1].slice(1, -1)
-				if (ele_key.indexOf('-') === -1) {
-					dataset[ele_key] = ele_value
-				} else {
-					var ele_keys = ele_key.split('-')
-					ele_key = ele_keys[0]
-					for (i = 1; i < ele_keys.length; i++) {
-						ele_key += __replaceReg__(ele_keys[i])
-					}
-				}
-			}
-		}
-		return dataset
-	}
-}
-
-// 正则表达式变换首字母大写
-function __replaceReg__(str) {
-	var reg = /\b(\w)|\s(\w)/g
-	str = str.toLowerCase()
-	return str.replace(reg, function(m) {
-		return m.toUpperCase()
-	})
-}
-
-/**
- * 根据名称查找 Vue 组件
- *
- * 此函数尝试从给定的 DOM 节点开始，向上遍历 DOM 树，以查找具有指定名称的 Vue 组件
- * 它主要用于在复杂的 DOM 结构中定位特定的 Vue 组件实例
- *
- * @param {HTMLElement} dom - 开始查找的 DOM 节点必须是 Vue 组件的关联 DOM 节点
- * @param {string} targetName - 目标 Vue 组件的名称
- * @returns {Object|null} - 返回找到的 Vue 组件实例，如果没有找到则返回 null
- */
-export function queryVm(dom, targetName) {
-	// 基础检查，确保传入的是 DOM 节点
-	if (!dom || !(dom instanceof HTMLElement)) {
-		return null;
-	}
-
-	// 获取当前 DOM 节点关联的 Vue 实例
-	let vueInstance = dom.__vue__;
-
-	// 如果找到 Vue 实例
-	while (vueInstance) {
-		// 检查组件的 name 是否符合要求
-		if (vueInstance.$options.name === targetName) {
-			return vueInstance;
-		}
-		// 如果不符合要求，向上查找 $parent
-		vueInstance = vueInstance.$parent;
-	}
-
-	// 如果未找到，递归向上查找父 DOM 节点
-	return queryVm(dom.parentElement, targetName);
-}
+/* istanbul ignore next */
+
+import Vue from 'vue';
+
+const isServer = Vue.prototype.$isServer;
+const SPECIAL_CHARS_REGEXP = /([\:\-\_]+(.))/g;
+const MOZ_HACK_REGEXP = /^moz([A-Z])/;
+const ieVersion = isServer ? 0 : Number(document.documentMode);
+
+/* istanbul ignore next */
+const trim = function(string) {
+	return (string || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '');
+};
+/* istanbul ignore next */
+const camelCase = function(name) {
+	return name.replace(SPECIAL_CHARS_REGEXP, function(_, separator, letter, offset) {
+		return offset ? letter.toUpperCase() : letter;
+	}).replace(MOZ_HACK_REGEXP, 'Moz$1');
+};
+
+/* istanbul ignore next */
+export const on = (function() {
+	if (!isServer && document.addEventListener) {
+		return function(element, event, handler) {
+			if (element && event && handler) {
+				element.addEventListener(event, handler, false);
+			}
+		};
+	} else {
+		return function(element, event, handler) {
+			if (element && event && handler) {
+				element.attachEvent('on' + event, handler);
+			}
+		};
+	}
+})();
+
+/* istanbul ignore next */
+export const off = (function() {
+	if (!isServer && document.removeEventListener) {
+		return function(element, event, handler) {
+			if (element && event) {
+				element.removeEventListener(event, handler, false);
+			}
+		};
+	} else {
+		return function(element, event, handler) {
+			if (element && event) {
+				element.detachEvent('on' + event, handler);
+			}
+		};
+	}
+})();
+
+/* istanbul ignore next */
+export const once = function(el, event, fn) {
+	var listener = function() {
+		if (fn) {
+			fn.apply(this, arguments);
+		}
+		off(el, event, listener);
+	};
+	on(el, event, listener);
+};
+
+/* istanbul ignore next */
+export function hasClass(el, cls) {
+	if (!el || !cls) return false;
+	if (cls.indexOf(' ') !== -1) throw new Error('className should not contain space.');
+	if (el.classList) {
+		return el.classList.contains(cls);
+	} else {
+		return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1;
+	}
+}
+
+/* istanbul ignore next */
+export function addClass(el, cls) {
+	if (!el) return;
+	var curClass = el.className;
+	var classes = (cls || '').split(' ');
+
+	for (var i = 0, j = classes.length; i < j; i++) {
+		var clsName = classes[i];
+		if (!clsName) continue;
+
+		if (el.classList) {
+			el.classList.add(clsName);
+		} else if (!hasClass(el, clsName)) {
+			curClass += ' ' + clsName;
+		}
+	}
+	if (!el.classList) {
+		el.className = curClass;
+	}
+}
+
+/* istanbul ignore next */
+export function removeClass(el, cls) {
+	if (!el || !cls) return;
+	var classes = cls.split(' ');
+	var curClass = ' ' + el.className + ' ';
+
+	for (var i = 0, j = classes.length; i < j; i++) {
+		var clsName = classes[i];
+		if (!clsName) continue;
+
+		if (el.classList) {
+			el.classList.remove(clsName);
+		} else if (hasClass(el, clsName)) {
+			curClass = curClass.replace(' ' + clsName + ' ', ' ');
+		}
+	}
+	if (!el.classList) {
+		el.className = trim(curClass);
+	}
+}
+
+/* istanbul ignore next */
+export const getStyle = function(element, styleName) {
+	if (isServer) return;
+	if (!element || !styleName) return null;
+	styleName = camelCase(styleName);
+	if (styleName === 'float') {
+		styleName = 'cssFloat';
+	}
+	var currentStyle = element.currentStyle || document.defaultView.getComputedStyle(element, '');
+	return currentStyle[styleName] || '';
+};
+
+/* istanbul ignore next */
+export function setStyle(element, styleName, value) {
+	if (!element || !styleName) return;
+
+	if (typeof styleName === 'object') {
+		for (var prop in styleName) {
+			if (Object.prototype.hasOwnProperty.call(styleName, prop)) {
+				setStyle(element, prop, styleName[prop]);
+			}
+		}
+	} else {
+		styleName = camelCase(styleName);
+		if (styleName === 'opacity' && ieVersion < 9) {
+			element.style.filter = isNaN(value) ? '' : 'alpha(opacity=' + value * 100 + ')';
+		} else {
+			element.style[styleName] = value;
+		}
+	}
+}
+
+export const isScroll = (el, vertical) => {
+	if (isServer) return;
+
+	const determinedDirection = vertical !== null || vertical !== undefined;
+	const overflow = determinedDirection
+		? vertical
+			? getStyle(el, 'overflow-y')
+			: getStyle(el, 'overflow-x')
+		: getStyle(el, 'overflow');
+
+	return overflow.match(/(scroll|auto)/);
+};
+
+export const getScrollContainer = (el, vertical) => {
+	if (isServer) return;
+
+	let parent = el;
+	while (parent) {
+		if ([window, document, document.documentElement].includes(parent)) {
+			return window;
+		}
+		if (isScroll(parent, vertical)) {
+			return parent;
+		}
+		parent = parent.parentNode;
+	}
+
+	return parent;
+};
+
+export const isInContainer = (el, container) => {
+	if (isServer || !el || !container) return false;
+
+	const elRect = el.getBoundingClientRect();
+	let containerRect;
+
+	if ([window, document, document.documentElement, null, undefined].includes(container)) {
+		containerRect = {
+			top: 0,
+			right: window.innerWidth,
+			bottom: window.innerHeight,
+			left: 0
+		};
+	} else {
+		containerRect = container.getBoundingClientRect();
+	}
+
+	return elRect.top < containerRect.bottom &&
+		elRect.bottom > containerRect.top &&
+		elRect.right > containerRect.left &&
+		elRect.left < containerRect.right;
+};
+
+/* get event composedPath */
+export function getEventPath(evt) {
+	const path = Array.isArray(evt) ? evt : (evt.composedPath && evt.composedPath()) || evt.path;
+	const target = path ? path[0] : evt.target;
+	if (path != null) {
+		return (path.indexOf(window) < 0) ? path.concat(window) : path;
+	}
+	if (target === window) {
+		return [window];
+	}
+	function getParents(node, memo) {
+		memo = memo || [];
+		const parentNode = node.parentNode;
+		if (!parentNode) {
+			return memo;
+		} else {
+			return getParents(parentNode, memo.concat(parentNode));
+		}
+	}
+	return [target].concat(getParents(target), window);
+}
+
+/**
+   *  兼容获取document element的dataset
+   * @param {DocumentElement} ele
+   * @returns
+   */
+export function getDataSet(ele) {
+	if (!ele) return
+	if (ele.dataset) return ele.dataset
+	else {
+		// 以下是兼容代码
+		var dataset = {}
+		var ele_split = ele.outerHTML.split(' ')
+		for (var i = 0, element; i < ele_split.length; i++) {
+			element = ele_split[i]
+			if (element.substring(0, 4) === 'data') {
+				if (element.indexOf('>') !== -1) {
+					element = element.split('>')[0]
+				}
+				var ele_key = element.split('=')[0].slice(5)
+				var ele_value = element.split('=')[1].slice(1, -1)
+				if (ele_key.indexOf('-') === -1) {
+					dataset[ele_key] = ele_value
+				} else {
+					var ele_keys = ele_key.split('-')
+					ele_key = ele_keys[0]
+					for (i = 1; i < ele_keys.length; i++) {
+						ele_key += __replaceReg__(ele_keys[i])
+					}
+				}
+			}
+		}
+		return dataset
+	}
+}
+
+// 正则表达式变换首字母大写
+function __replaceReg__(str) {
+	var reg = /\b(\w)|\s(\w)/g
+	str = str.toLowerCase()
+	return str.replace(reg, function(m) {
+		return m.toUpperCase()
+	})
+}
+
+/**
+ * 根据名称查找 Vue 组件
+ *
+ * 此函数尝试从给定的 DOM 节点开始，向上遍历 DOM 树，以查找具有指定名称的 Vue 组件
+ * 它主要用于在复杂的 DOM 结构中定位特定的 Vue 组件实例
+ *
+ * @param {HTMLElement} dom - 开始查找的 DOM 节点必须是 Vue 组件的关联 DOM 节点
+ * @param {string} targetName - 目标 Vue 组件的名称
+ * @returns {Object|null} - 返回找到的 Vue 组件实例，如果没有找到则返回 null
+ */
+export function queryVm(dom, targetName) {
+	// 基础检查，确保传入的是 DOM 节点
+	if (!dom || !(dom instanceof HTMLElement)) {
+		return null;
+	}
+
+	// 获取当前 DOM 节点关联的 Vue 实例
+	let vueInstance = dom.__vue__;
+
+	// 如果找到 Vue 实例
+	while (vueInstance) {
+		// 检查组件的 name 是否符合要求
+		if (vueInstance.$options.name === targetName) {
+			return vueInstance;
+		}
+		// 如果不符合要求，向上查找 $parent
+		vueInstance = vueInstance.$parent;
+	}
+
+	// 如果未找到，递归向上查找父 DOM 节点
+	return queryVm(dom.parentElement, targetName);
+}