From 2f47c2a4ec2093b1bb9d06f5b3669c37f1dcbc75 Mon Sep 17 00:00:00 2001 From: Tevin <tingquanren@163.com> Date: Thu, 16 May 2024 17:29:57 +0800 Subject: [PATCH] 列表页面筛选组件,调整横条日期选择样式 --- common/Tools.js | 99 +++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 78 insertions(+), 21 deletions(-) diff --git a/common/Tools.js b/common/Tools.js index 251ef03..72d2079 100644 --- a/common/Tools.js +++ b/common/Tools.js @@ -7,7 +7,6 @@ import Taro from '@tarojs/taro'; export class Tools { - /** * 显示消息 * @param msg @@ -48,9 +47,9 @@ * @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); + return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) { + let r = (Math.random() * 16) | 0, + v = c === 'x' ? r : (r & 0x3) | 0x8; return v.toString(16); }); } @@ -342,9 +341,13 @@ if (/^\d+$/.test(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(); + 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) { @@ -354,19 +357,19 @@ // 日期 else { try { - timestamp = (new Date(timestamp)).getTime(); - } catch (e) { - } + timestamp = new Date(timestamp).getTime(); + } catch (e) {} } } // 数值转换:8位整型日期 转 时间戳 if (timestamp < 9 * 10e6) { const timeStr = timestamp + ''; - const dateStr = timeStr.slice(0, 4) + '-' + timeStr.slice(4, 6) + '-' + timeStr.slice(6); + const dateStr = + timeStr.slice(0, 4) + '-' + timeStr.slice(4, 6) + '-' + timeStr.slice(6); if (type === 'date') { return dateStr; } - timestamp = (new Date(dateStr)).getTime(); + timestamp = new Date(dateStr).getTime(); } // 数值转换:时间戳 秒 转 毫秒 else if (timestamp < 9 * 10e8) { @@ -375,12 +378,22 @@ // 数值转换: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); + 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(); + timestamp = new Date(dateStr).getTime(); } const curMoment = moment(timestamp); if (type === 'date') { @@ -492,8 +505,7 @@ let t = 0; try { t = num.toString().split('.')[1].length; - } catch (e) { - } + } catch (e) {} return t; } @@ -523,21 +535,66 @@ return moment(dayTimestamp).format('YYYY-MM-DD'); } + /** + * 防抖函数(一段时间周期内,仅执行最后一次回调) + * 当持续触发事件时,只在事件最后一次触发后的一段时间内执行回调函数 + * 如果在这个时间内再次触发事件,就重新计算时间 + * @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, + x: parseFloat(Taro.pxTransform(10, 750)), + y: 10, }; const p2 = { - x: parseFloat(Taro.pxTransform(1000, 750)), y: 1000, + 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; + const px = ((value - p1.x) * (p2.y - p1.y)) / (p2.x - p1.x) + p1.y; console.info(Math.round(px) + 'px'); }; } -global.Tools = Tools; \ No newline at end of file -- Gitblit v1.9.1