sh-tools 1.2.2 → 1.2.6

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "sh-tools",
-  "version": "1.2.2",
+  "version": "1.2.6",
   "description": "基于xe-ajax和xe-utils二次封装",
-  "main": "lib/sh-tools.common.js",
+  "main": "packages/index.js",
   "scripts": {
     "lib": "vue-cli-service build --target lib packages/index.js --name sh-tools --dest lib"
   },
@@ -13,9 +13,9 @@
   "license": "ISC",
   "dependencies": {
     "hot-formula-parser": "^4.0.0",
-    "view-ui-plus": "^1.3.1",
+    "view-ui-plus": "^1.3.14",
     "xe-ajax": "^4.0.5",
-    "xe-utils": "^3.5.10"
+    "xe-utils": "^3.5.11"
   },
   "devDependencies": {
     "@babel/core": "^7.12.16",
@@ -36,8 +36,6 @@
     "html-webpack-tags-plugin": "^3.0.2",
     "node-polyfill-webpack-plugin": "^2.0.1",
     "prettier": "^2.4.1",
-    "sass": "^1.32.7",
-    "sass-loader": "^12.0.0",
     "vue": "^3.3.4"
   }
 }

package/packages/api/index.js

@@ -0,0 +1,85 @@
+import XEAjax from 'xe-ajax'
+import { Notice } from 'view-ui-plus'
+
+class HttpRequest {
+	constructor(options = {}) {
+		this.instance = XEAjax
+		this.options = options
+		this.setOptions(options)
+		this.interceptors()
+	}
+	setOptions(options) {
+		this.instance.setup(options)
+	}
+	// 继承类重写方法 用于处理个性化业务 预留
+	setRequest(request) {}
+	setResponse(response) {}
+	request(options) {
+		return this.instance.ajax(options)
+	}
+	get(url, params, options) {
+		return this.instance.get(url, params, options)
+	}
+	post(url, params, options) {
+		return this.instance.post(url, params, options)
+	}
+	put(url, params, options) {
+		return this.instance.put(url, params, options)
+	}
+	delete(url, params, options) {
+		return this.instance.delete(url, params, options)
+	}
+	patch(url, params, options) {
+		return this.instance.patch(url, params, options)
+	}
+	head(url, params, options) {
+		return this.instance.head(url, params, options)
+	}
+	jsonp(url, params, options) {
+		return this.instance.jsonp(url, params, options)
+	}
+	// 拦截器
+	interceptors() {
+		// 请求拦截
+		this.instance.interceptors.request.use((request, next) => {
+			this.setRequest(request)
+			next()
+		})
+		// 响应拦截
+		this.instance.interceptors.response.use((response, next) => {
+			this.responseNext(response, next)
+		})
+	}
+	// 错误处理
+	async responseNext(response, next) {
+		const { status, statusText, headers } = response
+		const duration = 5
+		let resBody = null
+		try {
+			resBody = await response.json()
+		} catch (e) {
+			resBody = response.__response || {}
+		}
+		let errorMsg = resBody.error || resBody.msg || resBody.message || resBody.result || statusText || '系统错误'
+		switch (status) {
+			case 0:
+				Notice.error({ title: '请求错误', desc: errorMsg, duration: duration })
+				break
+			case 200:
+				break
+			case 401:
+				Notice.error({ title: '系统提示 401', desc: '未授权，请重新登录', duration: duration })
+				return
+			case 504:
+				Notice.error({ title: '系统提示 网络超时', desc: errorMsg, duration: duration })
+				break
+			default:
+				Notice.error({ title: `系统提示 ${status}`, desc: errorMsg, duration: duration })
+				break
+		}
+		this.setResponse(resBody)
+		next({ status: 200, body: resBody })
+	}
+}
+
+export default HttpRequest

package/packages/index.js

@@ -0,0 +1,5 @@
+import http from './api/index'
+
+import utils from './utils/index'
+
+export { http, utils }

package/packages/utils/boolean.js

@@ -0,0 +1,10 @@
+import XEUtils from 'xe-utils'
+
+export default {
+	isPromise(obj) {
+		return Object.prototype.toString.call(obj).slice(8, -1) === 'Promise'
+	},
+	isNone(value) {
+		return ['', null, undefined].includes(value)
+	}
+}

package/packages/utils/color.js

@@ -0,0 +1,395 @@
+const colorKeywords = new Map([
+	['transparent', 'rgba(0,0,0,0)'],
+	['black', '#000000'],
+	['silver', '#C0C0C0'],
+	['gray', '#808080'],
+	['white', '#FFFFFF'],
+	['maroon', '#800000'],
+	['red', '#FF0000'],
+	['purple', '#800080'],
+	['fuchsia', '#FF00FF'],
+	['green', '#008000'],
+	['lime', '#00FF00'],
+	['olive', '#808000'],
+	['yellow', '#FFFF00'],
+	['navy', '#000080'],
+	['blue', '#0000FF'],
+	['teal', '#008080'],
+	['aqua', '#00FFFF'],
+	['aliceblue', '#f0f8ff'],
+	['antiquewhite', '#faebd7'],
+	['aquamarine', '#7fffd4'],
+	['azure', '#f0ffff'],
+	['beige', '#f5f5dc'],
+	['bisque', '#ffe4c4'],
+	['blanchedalmond', '#ffebcd'],
+	['blueviolet', '#8a2be2'],
+	['brown', '#a52a2a'],
+	['burlywood', '#deb887'],
+	['cadetblue', '#5f9ea0'],
+	['chartreuse', '#7fff00'],
+	['chocolate', '#d2691e'],
+	['coral', '#ff7f50'],
+	['cornflowerblue', '#6495ed'],
+	['cornsilk', '#fff8dc'],
+	['crimson', '#dc143c'],
+	['cyan', '#00ffff'],
+	['darkblue', '#00008b'],
+	['darkcyan', '#008b8b'],
+	['darkgoldenrod', '#b8860b'],
+	['darkgray', '#a9a9a9'],
+	['darkgreen', '#006400'],
+	['darkgrey', '#a9a9a9'],
+	['darkkhaki', '#bdb76b'],
+	['darkmagenta', '#8b008b'],
+	['darkolivegreen', '#556b2f'],
+	['darkorange', '#ff8c00'],
+	['darkorchid', '#9932cc'],
+	['darkred', '#8b0000'],
+	['darksalmon', '#e9967a'],
+	['darkseagreen', '#8fbc8f'],
+	['darkslateblue', '#483d8b'],
+	['darkslategray', '#2f4f4f'],
+	['darkslategrey', '#2f4f4f'],
+	['darkturquoise', '#00ced1'],
+	['darkviolet', '#9400d3'],
+	['deeppink', '#ff1493'],
+	['deepskyblue', '#00bfff'],
+	['dimgray', '#696969'],
+	['dimgrey', '#696969'],
+	['dodgerblue', '#1e90ff'],
+	['firebrick', '#b22222'],
+	['floralwhite', '#fffaf0'],
+	['forestgreen', '#228b22'],
+	['gainsboro', '#dcdcdc'],
+	['ghostwhite', '#f8f8ff'],
+	['gold', '#ffd700'],
+	['goldenrod', '#daa520'],
+	['greenyellow', '#adff2f'],
+	['grey', '#808080'],
+	['honeydew', '#f0fff0'],
+	['hotpink', '#ff69b4'],
+	['indianred', '#cd5c5c'],
+	['indigo', '#4b0082'],
+	['ivory', '#fffff0'],
+	['khaki', '#f0e68c'],
+	['lavender', '#e6e6fa'],
+	['lavenderblush', '#fff0f5'],
+	['lawngreen', '#7cfc00'],
+	['lemonchiffon', '#fffacd'],
+	['lightblue', '#add8e6'],
+	['lightcoral', '#f08080'],
+	['lightcyan', '#e0ffff'],
+	['lightgoldenrodyellow', '#fafad2'],
+	['lightgray', '#d3d3d3'],
+	['lightgreen', '#90ee90'],
+	['lightgrey', '#d3d3d3'],
+	['lightpink', '#ffb6c1'],
+	['lightsalmon', '#ffa07a'],
+	['lightseagreen', '#20b2aa'],
+	['lightskyblue', '#87cefa'],
+	['lightslategray', '#778899'],
+	['lightslategrey', '#778899'],
+	['lightsteelblue', '#b0c4de'],
+	['lightyellow', '#ffffe0'],
+	['limegreen', '#32cd32'],
+	['linen', '#faf0e6'],
+	['magenta', '#ff00ff'],
+	['mediumaquamarine', '#66cdaa'],
+	['mediumblue', '#0000cd'],
+	['mediumorchid', '#ba55d3'],
+	['mediumpurple', '#9370db'],
+	['mediumseagreen', '#3cb371'],
+	['mediumslateblue', '#7b68ee'],
+	['mediumspringgreen', '#00fa9a'],
+	['mediumturquoise', '#48d1cc'],
+	['mediumvioletred', '#c71585'],
+	['midnightblue', '#191970'],
+	['mintcream', '#f5fffa'],
+	['mistyrose', '#ffe4e1'],
+	['moccasin', '#ffe4b5'],
+	['navajowhite', '#ffdead'],
+	['oldlace', '#fdf5e6'],
+	['olivedrab', '#6b8e23'],
+	['orange', '#ffa500'],
+	['orangered', '#ff4500'],
+	['orchid', '#da70d6'],
+	['palegoldenrod', '#eee8aa'],
+	['palegreen', '#98fb98'],
+	['paleturquoise', '#afeeee'],
+	['palevioletred', '#db7093'],
+	['papayawhip', '#ffefd5'],
+	['peachpuff', '#ffdab9'],
+	['peru', '#cd853f'],
+	['pink', '#ffc0cb'],
+	['plum', '#dda0dd'],
+	['powderblue', '#b0e0e6'],
+	['rosybrown', '#bc8f8f'],
+	['royalblue', '#4169e1'],
+	['saddlebrown', '#8b4513'],
+	['salmon', '#fa8072'],
+	['sandybrown', '#f4a460'],
+	['seagreen', '#2e8b57'],
+	['seashell', '#fff5ee'],
+	['sienna', '#a0522d'],
+	['skyblue', '#87ceeb'],
+	['slateblue', '#6a5acd'],
+	['slategray', '#708090'],
+	['slategrey', '#708090'],
+	['snow', '#fffafa'],
+	['springgreen', '#00ff7f'],
+	['steelblue', '#4682b4'],
+	['tan', '#d2b48c'],
+	['thistle', '#d8bfd8'],
+	['tomato', '#ff6347'],
+	['turquoise', '#40e0d0'],
+	['violet', '#ee82ee'],
+	['wheat', '#f5deb3'],
+	['whitesmoke', '#f5f5f5'],
+	['yellowgreen', '#9acd32']
+])
+
+const hexReg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/
+const rgbReg = /^(rgb|rgba|RGB|RGBA)/
+const rgbaReg = /^(rgba|RGBA)/
+
+/**
+ * @description Color validator
+ * @param {String} color Hex|Rgb|Rgba color or color keyword
+ * @return {String|Boolean} Valid color Or false
+ */
+function validator(color) {
+	const isHex = hexReg.test(color)
+	const isRgb = rgbReg.test(color)
+	if (isHex || isRgb) return color
+	color = getColorByKeyword(color)
+	if (!color) {
+		console.error('Color: Invalid color!')
+		return false
+	}
+	return color
+}
+
+/**
+ * @description Get color by keyword
+ * @param {String} keyword Color keyword like red, green and etc.
+ * @return {String|Boolean} Hex or rgba color (Invalid keyword will return false)
+ */
+function getColorByKeyword(keyword) {
+	if (!keyword) {
+		console.error('getColorByKeywords: Missing parameters!')
+		return false
+	}
+	if (!colorKeywords.has(keyword)) return false
+	return colorKeywords.get(keyword)
+}
+
+/**
+ * @description Get the Rgb value of the color
+ * @param {String} color Hex|Rgb|Rgba color or color keyword
+ * @return {Array<Number>|Boolean} Rgb value of the color (Invalid input will return false)
+ */
+export function getRgbValue(color) {
+	if (!color) {
+		console.error('getRgbValue: Missing parameters!')
+		return false
+	}
+	color = validator(color)
+	if (!color) return false
+	const isHex = hexReg.test(color)
+	const isRgb = rgbReg.test(color)
+	const lowerColor = color.toLowerCase()
+	if (isHex) return getRgbValueFromHex(lowerColor)
+	if (isRgb) return getRgbValueFromRgb(lowerColor)
+}
+
+/**
+ * @description Get the rgb value of the hex color
+ * @param {String} color Hex color
+ * @return {Array<Number>} Rgb value of the color
+ */
+function getRgbValueFromHex(color) {
+	color = color.replace('#', '')
+	if (color.length === 3)
+		color = Array.from(color)
+			.map(hexNum => hexNum + hexNum)
+			.join('')
+	color = color.split('')
+	return new Array(3).fill(0).map((t, i) => parseInt(`0x${color[i * 2]}${color[i * 2 + 1]}`))
+}
+
+/**
+ * @description Get the rgb value of the rgb/rgba color
+ * @param {String} color Hex color
+ * @return {Array} Rgb value of the color
+ */
+function getRgbValueFromRgb(color) {
+	return color
+		.replace(/rgb\(|rgba\(|\)/g, '')
+		.split(',')
+		.slice(0, 3)
+		.map(n => parseInt(n))
+}
+
+/**
+ * @description Get the Rgba value of the color
+ * @param {String} color Hex|Rgb|Rgba color or color keyword
+ * @return {Array<Number>|Boolean} Rgba value of the color (Invalid input will return false)
+ */
+export function getRgbaValue(color) {
+	if (!color) {
+		console.error('getRgbaValue: Missing parameters!')
+		return false
+	}
+
+	const colorValue = getRgbValue(color)
+	if (!colorValue) return false
+	colorValue.push(getOpacity(color))
+	return colorValue
+}
+
+/**
+ * @description Get the opacity of color
+ * @param {String} color Hex|Rgb|Rgba color or color keyword
+ * @return {Number|Boolean} Color opacity (Invalid input will return false)
+ */
+export function getOpacity(color) {
+	if (!color) {
+		console.error('getOpacity: Missing parameters!')
+		return false
+	}
+	color = validator(color)
+	if (!color) return false
+	const isRgba = rgbaReg.test(color)
+	if (!isRgba) return 1
+	color = color.toLowerCase()
+	return Number(
+		color
+			.split(',')
+			.slice(-1)[0]
+			.replace(/[)|\s]/g, '')
+	)
+}
+
+/**
+ * @description Convert color to Rgb|Rgba color
+ * @param {String} color   Hex|Rgb|Rgba color or color keyword
+ * @param {Number} opacity The opacity of color
+ * @return {String|Boolean} Rgb|Rgba color (Invalid input will return false)
+ */
+export function toRgb(color, opacity) {
+	if (!color) {
+		console.error('toRgb: Missing parameters!')
+		return false
+	}
+	const rgbValue = getRgbValue(color)
+	if (!rgbValue) return false
+	const addOpacity = typeof opacity === 'number'
+	if (addOpacity) return 'rgba(' + rgbValue.join(',') + `,${opacity})`
+	return 'rgb(' + rgbValue.join(',') + ')'
+}
+
+/**
+ * @description Convert color to Hex color
+ * @param {String} color Hex|Rgb|Rgba color or color keyword
+ * @return {String|Boolean} Hex color (Invalid input will return false)
+ */
+export function toHex(color) {
+	if (!color) {
+		console.error('toHex: Missing parameters!')
+		return false
+	}
+	if (hexReg.test(color)) return color
+	color = getRgbValue(color)
+	if (!color) return false
+	return (
+		'#' +
+		color
+			.map(n => Number(n).toString(16))
+			.map(n => (n === '0' ? '00' : n))
+			.join('')
+	)
+}
+
+/**
+ * @description Get Color from Rgb|Rgba value
+ * @param {Array<Number>} value Rgb|Rgba color value
+ * @return {String|Boolean} Rgb|Rgba color (Invalid input will return false)
+ */
+export function getColorFromRgbValue(value) {
+	if (!value) {
+		console.error('getColorFromRgbValue: Missing parameters!')
+		return false
+	}
+	const valueLength = value.length
+	if (valueLength !== 3 && valueLength !== 4) {
+		console.error('getColorFromRgbValue: Value is illegal!')
+		return false
+	}
+	let color = valueLength === 3 ? 'rgb(' : 'rgba('
+	color += value.join(',') + ')'
+	return color
+}
+
+/**
+ * @description Deepen color
+ * @param {String} color Hex|Rgb|Rgba color or color keyword
+ * @return {Number} Percent of Deepen (1-100)
+ * @return {String|Boolean} Rgba color (Invalid input will return false)
+ */
+export function darken(color, percent = 0) {
+	if (!color) {
+		console.error('darken: Missing parameters!')
+		return false
+	}
+	let rgbaValue = getRgbaValue(color)
+	if (!rgbaValue) return false
+	rgbaValue = rgbaValue.map((v, i) => (i === 3 ? v : v - Math.ceil(2.55 * percent))).map(v => (v < 0 ? 0 : v))
+	return getColorFromRgbValue(rgbaValue)
+}
+
+/**
+ * @description Brighten color
+ * @param {String} color Hex|Rgb|Rgba color or color keyword
+ * @return {Number} Percent of brighten (1-100)
+ * @return {String|Boolean} Rgba color (Invalid input will return false)
+ */
+export function lighten(color, percent = 0) {
+	if (!color) {
+		console.error('lighten: Missing parameters!')
+		return false
+	}
+	let rgbaValue = getRgbaValue(color)
+	if (!rgbaValue) return false
+	rgbaValue = rgbaValue.map((v, i) => (i === 3 ? v : v + Math.ceil(2.55 * percent))).map(v => (v > 255 ? 255 : v))
+	return getColorFromRgbValue(rgbaValue)
+}
+
+/**
+ * @description Adjust color opacity
+ * @param {String} color   Hex|Rgb|Rgba color or color keyword
+ * @param {Number} percent of opacity
+ * @return {String|Boolean} Rgba color (Invalid input will return false)
+ */
+export function fade(color, percent = 100) {
+	if (!color) {
+		console.error('fade: Missing parameters!')
+		return false
+	}
+	const rgbValue = getRgbValue(color)
+	if (!rgbValue) return false
+	const rgbaValue = [...rgbValue, percent / 100]
+	return getColorFromRgbValue(rgbaValue)
+}
+
+export default {
+	fade,
+	toHex,
+	toRgb,
+	darken,
+	lighten,
+	getOpacity,
+	getRgbValue,
+	getRgbaValue,
+	getColorFromRgbValue
+}

package/packages/utils/dom.js

@@ -0,0 +1,111 @@
+const getScrollEventTarget = element => {
+	let currentNode = element
+	while (currentNode && currentNode.tagName !== 'HTML' && currentNode.nodeType === 1) {
+		const overflowY = window.getComputedStyle(currentNode).overflowY
+		if (overflowY === 'scroll' || overflowY === 'auto') {
+			return currentNode
+		}
+		currentNode = currentNode.parentNode
+	}
+	return window
+}
+
+const getScrollTop = element => {
+	if (element === window) {
+		return Math.max(window.pageYOffset || 0, document.documentElement.scrollTop)
+	} else {
+		return element.scrollTop
+	}
+}
+
+const getOffset = el => {
+	const box = el.getBoundingClientRect()
+	const body = document.body
+	const clientTop = el.clientTop || body.clientTop || 0
+	const clientLeft = el.clientLeft || body.clientLeft || 0
+	const scrollTop = window.pageYOffset || el.scrollTop
+	const scrollLeft = window.pageXOffset || el.scrollLeft
+	return {
+		top: box.top + scrollTop - clientTop,
+		left: box.left + scrollLeft - clientLeft
+	}
+}
+
+const transitionEnd = (el, fun) => {
+	const arr = ['msTransitionEnd', 'mozTransitionEnd', 'oTransitionEnd', 'webkitTransitionEnd', 'transitionend']
+	const handler = {
+		handleEvent(event) {
+			arr.forEach(function (eventName) {
+				el.removeEventListener(eventName, handler, false)
+			})
+			fun.apply(el, arguments)
+		}
+	}
+	arr.forEach(function (eventName) {
+		el.addEventListener(eventName, handler, false)
+	})
+}
+
+const 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
+	}
+}
+
+const 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
+	}
+}
+
+const 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 = curClass ? curClass.trim() : curClass
+	}
+}
+
+export default {
+	getScrollEventTarget,
+	getScrollTop,
+	getOffset,
+	transitionEnd,
+	hasClass,
+	addClass,
+	removeClass
+}

package/packages/utils/index.js

@@ -0,0 +1,25 @@
+import XEUtils from 'xe-utils'
+
+XEUtils.setup({})
+
+import number from './number'
+import string from './string'
+import boolean from './boolean'
+import color from './color'
+import dom from './dom'
+import other from './other'
+import validate from './validate'
+import pattern from './pattern'
+
+XEUtils.mixin({
+	...number,
+	...string,
+	...boolean,
+	...color,
+	...dom,
+	...other,
+	...validate,
+	...pattern
+})
+
+export default XEUtils

package/packages/utils/number.js

@@ -0,0 +1,24 @@
+import XEUtils from 'xe-utils'
+import stringUtil from './string'
+import { Parser } from 'hot-formula-parser'
+const formulaParser = new Parser()
+
+export default {
+	truncate(num, digits) {
+		if (num < 0) {
+			let rnum = '-' + XEUtils.floor(String(num).replace('-', ''), digits)
+			return Number(rnum)
+		} else {
+			return XEUtils.floor(num, digits)
+		}
+	},
+
+	calculate(formula, data) {
+		if (!formula) return ''
+		if (data && XEUtils.isPlainObject(data)) {
+			formula = stringUtil.format(formula, data)
+		}
+		let { result } = formulaParser.parse(formula)
+		return result
+	}
+}

package/packages/utils/object.js

@@ -0,0 +1 @@
+export default {}