From 2dfa5e2bfb96784df0342a52f1584e9e3e069361 Mon Sep 17 00:00:00 2001
From: Tevin <tingquanren@163.com>
Date: Wed, 31 Jul 2024 15:01:02 +0800
Subject: [PATCH] 小程序图片压缩，第二部分
---
common/Tools.js | 394 +++++++++++++++++++++++++++++---------------------------
1 files changed, 203 insertions(+), 191 deletions(-)
diff --git a/common/Tools.js b/common/Tools.js
index cebd493..a99856a 100644
--- a/common/Tools.js
+++ b/common/Tools.js
@@ -1,11 +1,26 @@
/**
- * Tools
+ * Tools - 工具集
* @author Tevin
*/
import moment from 'moment';
+import Taro from '@tarojs/taro';
export class Tools {
+ /**
+ * 显示消息
+ * @param msg
+ * @param [duration=2000]
+ * @param [mask=false]
+ */
+ static toast(msg, duration = 2000, mask = false) {
+ Taro.showToast({
+ title: msg,
+ icon: 'none',
+ mask,
+ duration,
+ });
+ }
/**
* URL参数解析
@@ -13,7 +28,11 @@
* @param {String} [search]
* @return {String|Null}
*/
- static getUrlParam(name, search = window.location.search) {
+ static getUrlParam(name, search) {
+ if (process.env.TARO_ENV === 'weapp') {
+ return null;
+ }
+ search = search || window.location.search;
const reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
const r = search.substr(1).match(reg);
if (r !== null) {
@@ -24,152 +43,31 @@
}
/**
- * 深度获取 url 参数
- * @param {String} name
- * @return {String}
- */
- static getTopUrlParam(name) {
- if (window.top !== window) {
- return Tools.getUrlParam(name, window.top.location.search);
- } else {
- return Tools.getUrlParam(name);
- }
- }
-
- /**
- * 读取文件 base64
- * @param {File} file
- * @return {Promise<string>}
- */
- static getFileBase64(file) {
- return new Promise((resolve, reject) => {
- const reader = new FileReader();
- reader.onload = () => resolve(reader.result);
- reader.onerror = error => reject(error);
- reader.readAsDataURL(file);
- });
- }
-
- /**
- * 关闭页面 loading
- */
- static closePageLoading() {
- const $Loading = document.getElementById('loading');
- $Loading.className = 'loading off';
- setTimeout(() => {
- if ($Loading.parentNode) {
- $Loading.parentNode.removeChild($Loading);
- }
- }, 300);
- }
-
- /**
- * 计算浏览器滚动条宽度
- * @param {HTMLElement} elm
- * @return {Number}
- */
- static getScrollbarWidth(elm) {
- // 传入了元素，计算元素滚动条宽度
- if (elm) {
- return elm.offsetWidth - elm.clientWidth;
- }
- // 没传入元素，计算系统滚动条宽度
- else {
- let dom = document.createElement('div'),
- styles = {
- width: '100px',
- height: '100px',
- // 设置滚动条
- overflowY: 'scroll',
- }, i, scrollbarWidth;
- for (i in styles) dom.style[i] = styles[i];
- document.body.appendChild(dom);
- scrollbarWidth = dom.offsetWidth - dom.clientWidth;
- dom.remove();
- return scrollbarWidth;
- }
- }
-
- /**
- * 设置元素样式
- * @param {HTMLElement} elm
- * @param {Object} styles
- */
- static setElementStyles(elm, styles) {
- Object.keys(styles).forEach(prop => {
- elm.style[prop] = styles[prop];
- });
- }
-
- /**
- * 创建 css 带前缀样式
- * @param {String} key
- * @param {String} value
- * @return {Object}
- */
- static createPrefixesCss(key, value) {
- return {
- ['Webkit' + key.substr(0, 1).toUpperCase() + key.substr(1)]: value,
- ['Moz' + key.substr(0, 1).toUpperCase() + key.substr(1)]: value,
- key: value,
- };
- }
-
- /**
- * 创建 transform translate3d 样式
- * @param {Number} x = 0
- * @param {Number} y = 0
- * @param {Number} z = 0
- * @return {Object}
- */
- static createTransformTs3d(x = 0, y = 0, z = 0) {
- return Tools.createPrefixesCss('transform', `translate3d(${x}px, ${y}px, ${z}px)`);
- }
-
- /**
- * 获取元素计算后的样式
- * @param {HTMLElement} element
- * @param {String} styleName
- * @return {String}
- */
- static getComputedStyle(element, styleName) {
- if (element.currentStyle) {
- return element.currentStyle[styleName];
- } else {
- return window.getComputedStyle(element, null)[styleName] ||
- document.defaultView.getComputedStyle(element, null)[styleName];
- }
- }
-
- /**
- * 判断元素是否在容器内
- * @param {HTMLElement} targetElm
- * @param {HTMLElement} containerElm
- * @return {Boolean}
- */
- static isElementInsideContainer(targetElm, containerElm) {
- let inside = false;
- while (targetElm.parentElement) {
- if (targetElm.parentElement === containerElm) {
- inside = true;
- break;
- } else {
- targetElm = targetElm.parentElement;
- }
- }
- return inside;
- }
-
- /**
* 生成 GUID
* @return {string}
*/
static createGUID() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
- let r = Math.random() * 16 | 0,
- v = c === 'x' ? r : ((r & 0x3) | 0x8);
+ let r = (Math.random() * 16) | 0,
+ v = c === 'x' ? r : (r & 0x3) | 0x8;
return v.toString(16);
});
+ }
+
+ /**
+ * 获取随机字符串
+ * @param {number} long
+ * @return {string}
+ */
+ static getRandomString(long) {
+ long = long || 32;
+ const template = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
+ const count = template.length;
+ let result = '';
+ for (let i = 0; i < long; i++) {
+ result += template.charAt(Math.floor(Math.random() * count));
+ }
+ return result;
}
/**
@@ -227,12 +125,21 @@
}
/**
+ * 判断是否为未定义
+ * @param {*} data
+ * @return {Boolean}
+ */
+ static isUndefined(data) {
+ return Object.prototype.toString.call(data) === '[object Undefined]';
+ }
+
+ /**
* 判断是否为 null
* @param {*} data
* @return {Boolean}
*/
static isNull(data) {
- return data === null;
+ return Object.prototype.toString.call(data) === '[object Null]';
}
/**
@@ -271,33 +178,6 @@
}
}
return true;
- }
-
- static getObjDataByPath(obj, path) {
- const arr = path.split('.');
- const reg2 = /\[(.*)]/g;
- const reg4 = /\w+(?=\[)|(?<=\[)(.*?)(?=])/g;
- let stack = [];
- let temp;
- arr.forEach(item => {
- if (reg2.test(item)) {
- while ((temp = reg4.exec(item))) {
- stack.push(temp[0]);
- }
- } else {
- stack.push(item);
- }
- });
- stack = stack.map(item => {
- return item.replace(/^['"`]|['"`]$/g, '');
- });
- try {
- return stack.reduce((pre, next) => {
- return pre[next];
- }, obj);
- } catch (err) {
- return undefined;
- }
}
/**
@@ -428,12 +308,20 @@
/**
* 数组元素交换位置
* @param {array} arr 数组
- * @param {number} index1 要交换项目的位置
- * @param {number} index2 被交换项目的位置
- * @tutorial 例如：1，5就是数组中下标为1和5的两个元素交换位置
+ * @param {number} fromIndex 要交换项目的位置
+ * @param {number} toIndex 被交换项目的位置
*/
- static swapArray(arr, index1, index2) {
- arr[index1] = arr.splice(index2, 1, arr[index1])[0];
+ static swapArray(arr, fromIndex, toIndex) {
+ // 先在目标位置新增一个和当前元素一样的元素，再把当前元素删除掉
+ arr.splice(toIndex, 0, arr[fromIndex]);
+ // 如果拖动元素上移动，当前元素下标为 fromIndex+1
+ if (fromIndex > toIndex) {
+ arr.splice(fromIndex + 1, 1);
+ }
+ // 如果拖动元素下移，当前元素下标还是 fromIndex
+ else {
+ arr.splice(fromIndex, 1);
+ }
return arr;
}
@@ -451,18 +339,61 @@
if (Tools.isString(timestamp)) {
// 全数值
if (/^\d+$/.test(timestamp)) {
- timestamp = parseInt(timestamp);
+ // 8位视为无连接符日期
+ if (timestamp.length === 8) {
+ const day =
+ timestamp.substr(0, 4) +
+ '-' +
+ timestamp.substr(4, 2) +
+ '-' +
+ timestamp.substr(6, 2);
+ timestamp = new Date(timestamp).getTime();
+ }
+ // 超过8位，视为时间戳
+ else if (timestamp.length > 8) {
+ timestamp = parseInt(timestamp);
+ }
}
// 日期
else {
try {
- timestamp = (new Date(timestamp)).getTime();
- } catch (e) {
- }
+ timestamp = new Date(timestamp).getTime();
+ } catch (e) {}
}
}
- if (timestamp < 9 * 10e8) {
+ // 数值转换：8位整型日期 转 时间戳
+ if (timestamp < 9 * 10e6) {
+ const timeStr = timestamp + '';
+ const dateStr =
+ timeStr.slice(0, 4) + '-' + timeStr.slice(4, 6) + '-' + timeStr.slice(6);
+ if (type === 'date') {
+ return dateStr;
+ }
+ timestamp = new Date(dateStr).getTime();
+ }
+ // 数值转换：时间戳 秒 转 毫秒
+ else if (timestamp < 9 * 10e8) {
timestamp *= 1000;
+ }
+ // 数值转换：14位整型日期 转 时间戳
+ else if (/^2[012]\d{2}[01]\d[0123]\d[012]\d[0-5]\d[0-5]\d/.test(timestamp + '')) {
+ const timeStr = timestamp + '';
+ const dateStr =
+ timeStr.slice(0, 4) +
+ '-' +
+ timeStr.slice(4, 6) +
+ '-' +
+ timeStr.slice(6, 8) +
+ ' ' +
+ timeStr.slice(8, 10) +
+ ':' +
+ timeStr.slice(10, 12) +
+ ':' +
+ timeStr.slice(12, 14);
+ if (type === 'dateTimeFull') {
+ return dateStr;
+ }
+ timestamp = new Date(dateStr).getTime();
}
const curMoment = moment(timestamp);
if (type === 'date') {
@@ -495,7 +426,7 @@
if (minutes) {
words = minutes + '分' + words;
}
- const hours = duration.get('hours');
+ const hours = parseInt(duration.as('hours'));
if (hours) {
words = hours + '小时' + words;
}
@@ -505,19 +436,24 @@
/**
* 数值转换为金钱格式
* @param {Number|String} number
+ * @param {String} [forRead=''] 便于阅读财务金额模式
* @return {string}
*/
- static moneyFormat(number) {
- if (typeof number !== 'number' && !number) {
+ static moneyFormat(number, forRead = '') {
+ if (!number && typeof number !== 'number' && typeof number !== 'string') {
return '';
}
if (typeof number === 'string') {
- number = parseInt(number) || 0;
+ number = Number(number) || 0;
}
- const numFixed = number.toFixed(2);
- const integer = parseInt(numFixed);
- const decimal = numFixed.split('.')[1];
- return integer.toLocaleString() + '.' + decimal;
+ if (forRead === 'forRead') {
+ return number.toLocaleString('zh-cn', {
+ minimumFractionDigits: 2,
+ maximumFractionDigits: 2,
+ });
+ } else {
+ return number.toFixed(2);
+ }
}
/**
@@ -571,14 +507,13 @@
/**
* 求小数点后的数据长度
* @param {Number|String} num
- * @private
+ * @return {Number}
*/
static getDecimalLength(num) {
let t = 0;
try {
t = num.toString().split('.')[1].length;
- } catch (e) {
- }
+ } catch (e) {}
return t;
}
@@ -591,5 +526,82 @@
return /^1[3456789]\d{9}$/.test('' + phone);
}
+ /**
+ * 转换周数到日期
+ * @param {Number} year
+ * @param {Number} week
+ * @param {Number} weekDay 需要输出星期几对应的日期 (1~7)
+ * @return {String}
+ */
+ static transWeekIndexToDate(year, week, weekDay) {
+ const yearStart = moment([year, 0, 1]);
+ const dayLong = 24 * 60 * 60 * 1000;
+ const firstWeekLong = (7 - yearStart.day()) * dayLong;
+ const weeksLong = (week - 1) * 7 * dayLong;
+ const weekDayLong = weekDay * dayLong;
+ const dayTimestamp = yearStart.valueOf() + firstWeekLong + weeksLong + weekDayLong;
+ return moment(dayTimestamp).format('YYYY-MM-DD');
+ }
-}
\ No newline at end of file
+ /**
+ * 防抖函数（一段时间周期内，仅执行最后一次回调）
+ * 当持续触发事件时，只在事件最后一次触发后的一段时间内执行回调函数
+ * 如果在这个时间内再次触发事件，就重新计算时间
+ * @param {Function} fnc
+ * @param {Number} wait
+ * @returns {Function}
+ * @tutorial Tools.debounce(<fnc>, <wait>)(<DebounceKey>)
+ */
+ static debounce(fnc, wait = 200) {
+ return key => {
+ if (!key || !Tools.isString(key)) {
+ throw 'Debounce function need a key!';
+ }
+ const timer = Tools.debounce['dKey-' + key];
+ if (timer) {
+ clearTimeout(timer);
+ }
+ Tools.debounce['dKey-' + key] = setTimeout(fnc, wait);
+ };
+ }
+
+ /**
+ * 节流函数（本段时间内，仅执行第一次回调）
+ * 在一定时间内只能触发一次函数执行
+ * 如果这个时间内再次触发，则忽略，直到下一个时间段再次触发
+ * @param {Function} fnc
+ * @param {Number} wait
+ * @returns {function(key):void}
+ * @tutorial Tools.throttle(<fnc>, <wait>)(<ThrottleKey>)
+ */
+ static throttle(fnc, wait = 200) {
+ return key => {
+ if (!key || !Tools.isString(key)) {
+ throw 'Throttle function need a key!';
+ }
+ const previous = Tools.throttle['tKey-' + key] || 0;
+ const now = Date.now();
+ if (now - previous > wait) {
+ Tools.throttle['tKey-' + key] = now;
+ fnc();
+ }
+ };
+ }
+}
+
+// h5 中，实现 rem 转换 px
+if (process.env.NODE_ENV === 'development' && process.env.TARO_ENV === 'h5') {
+ window.rem = val => {
+ const p1 = {
+ x: parseFloat(Taro.pxTransform(10, 750)),
+ y: 10,
+ };
+ const p2 = {
+ x: parseFloat(Taro.pxTransform(1000, 750)),
+ y: 1000,
+ };
+ const value = typeof val === 'number' ? val : parseFloat(val);
+ const px = ((value - p1.x) * (p2.y - p1.y)) / (p2.x - p1.x) + p1.y;
+ console.info(Math.round(px) + 'px');
+ };
+}
--
Gitblit v1.9.1