hy-app 0.1.2 → 0.1.4

package/utils/colorGradient.ts

@@ -0,0 +1,112 @@
+/**
+ * @description 求两个颜色之间的渐变值
+ * @param {string} startColor 开始的颜色
+ * @param {string} endColor 结束的颜色
+ * @param {number} step 颜色等分的份额
+ * */
+export const colorGradient = (
+  startColor: string = "rgb(0, 0, 0)",
+  endColor: string = "rgb(255, 255, 255)",
+  step: number = 10,
+): any[] => {
+  const startRGB = hexToRgb(startColor, false); // 转换为rgb数组模式
+
+  const endRGB = hexToRgb(endColor, false);
+
+  if (typeof startRGB !== "string" && typeof endRGB !== "string") {
+    const startR = startRGB[0];
+    const startG = startRGB[1];
+    const startB = startRGB[2];
+
+    const endR = endRGB[0];
+    const endG = endRGB[1];
+    const endB = endRGB[2];
+
+    const sR = (endR - startR) / step; // 总差值
+    const sG = (endG - startG) / step;
+    const sB = (endB - startB) / step;
+    const colorArr = [];
+    for (let i = 0; i < step; i++) {
+      // 计算每一步的hex值
+      let hex = rgbToHex(
+        `rgb(${Math.round(sR * i + startR)},${Math.round(sG * i + startG)},${Math.round(
+          sB * i + startB,
+        )})`,
+      );
+      // 确保第一个颜色值为startColor的值
+      if (i === 0) hex = rgbToHex(startColor);
+      // 确保最后一个颜色值为endColor的值
+      if (i === step - 1) hex = rgbToHex(endColor);
+      colorArr.push(hex);
+    }
+    return colorArr;
+  }
+
+  return [];
+};
+
+// 将hex表示方式转换为rgb表示方式(这里返回rgb数组模式)
+export function hexToRgb(sColor: string, str = true): string | number[] {
+  const reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
+  sColor = String(sColor).toLowerCase();
+  if (sColor && reg.test(sColor)) {
+    if (sColor.length === 4) {
+      let sColorNew = "#";
+      for (let i = 1; i < 4; i += 1) {
+        sColorNew += sColor.slice(i, i + 1).concat(sColor.slice(i, i + 1));
+      }
+      sColor = sColorNew;
+    }
+    // 处理六位的颜色值
+    const sColorChange = [];
+    for (let i = 1; i < 7; i += 2) {
+      sColorChange.push(parseInt(`0x${sColor.slice(i, i + 2)}`));
+    }
+    if (!str) {
+      return sColorChange;
+    }
+    return `rgb(${sColorChange[0]},${sColorChange[1]},${sColorChange[2]})`;
+  }
+  if (/^(rgb|RGB)/.test(sColor)) {
+    const arr = sColor.replace(/(?:\(|\)|rgb|RGB)*/g, "").split(",");
+    return arr.map((val) => Number(val));
+  }
+  return sColor;
+}
+
+// 将rgb表示方式转换为hex表示方式
+export function rgbToHex(rgb: string) {
+  const _this = rgb;
+  const reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
+  if (/^(rgb|RGB)/.test(_this)) {
+    const aColor = _this.replace(/(?:\(|\)|rgb|RGB)*/g, "").split(",");
+    let strHex = "#";
+    for (let i = 0; i < aColor.length; i++) {
+      let hex = Number(aColor[i]).toString(16);
+      hex = String(hex).length == 1 ? `${0}${hex}` : hex; // 保证每个rgb的值为2位
+      if (hex === "0") {
+        hex += hex;
+      }
+      strHex += hex;
+    }
+    if (strHex.length !== 7) {
+      strHex = _this;
+    }
+    return strHex;
+  }
+  if (reg.test(_this)) {
+    const aNum = _this.replace(/#/, "").split("");
+    if (aNum.length === 6) {
+      return _this;
+    }
+    if (aNum.length === 3) {
+      let numHex = "#";
+      for (let i = 0; i < aNum.length; i += 1) {
+        numHex += aNum[i] + aNum[i];
+      }
+      return numHex;
+    }
+  } else {
+    return _this;
+  }
+}

package/utils/index.ts

@@ -1,3 +1,5 @@
 export * from "./utils";
+export * from "./inspect";
 export * from "./base64";
 export * from "./inside";
+export * from "./colorGradient";

package/utils/inside.ts

@@ -1,16 +1,6 @@
 // 内部使用方法
 import { inject } from "vue";
 
-/**
- * 是否视频格式
- * @param {String} value
- */
-export function isVideo(value: string): boolean {
-  const VIDEO_REGEXP =
-    /\.(mp4|mpg|mpeg|dat|asf|avi|rm|rmvb|mov|wmv|flv|mkv|m3u8)/i;
-  return VIDEO_REGEXP.test(value);
-}
-
 /**
  * 生成bem规则类名
  * 由于微信小程序，H5，nvue之间绑定class的差异，无法通过:class="[bem()]"的形式进行同用
@@ -25,7 +15,7 @@ export const bem = (
   name: string,
   props: Record<string, any>,
   fixed: string[],
-  change?: string[]
+  change?: string[],
 ): string | string[] => {
   // 类名前缀
   const prefix = `hy-${name}--`;
@@ -123,25 +113,22 @@ export function guid(len = 32, firstU = true, radix = null) {
   return uuid.join("");
 }
 
-export function sys() {
-  return uni.getSystemSetting();
-}
-export function getWindowInfo() {
-  let ret = {};
+/**
+ * @description 获取设备信息
+ * */
+export const getWindowInfo = (): UniNamespace.GetWindowInfoResult => {
+  let ret: UniNamespace.GetWindowInfoResult;
   // #ifdef APP || H5 || MP-WEIXIN
   ret = uni.getWindowInfo();
   // #endif
-  // #ifndef APP || H5 || MP-WEIXIN
-  ret = sys();
-  // #endif
   return ret;
-}
+};
 
 function pickExclude(obj, keys) {
   // 某些情况下，type可能会为
   if (
     !["[object Object]", "[object File]"].includes(
-      Object.prototype.toString.call(obj)
+      Object.prototype.toString.call(obj),
     )
   ) {
     return {};
@@ -163,7 +150,7 @@ function formatImage(res) {
     size: item.size,
     // #ifdef H5
     name: item.name,
-    file: item
+    file: item,
     // #endif
   }));
 }
@@ -178,9 +165,9 @@ function formatVideo(res) {
       size: res.size,
       // #ifdef H5
       name: res.name,
-      file: res
+      file: res,
       // #endif
-    }
+    },
   ];
 }
 
@@ -192,7 +179,7 @@ function formatMedia(res) {
     thumb: res.type === "video" ? item.thumbTempFilePath : item.tempFilePath,
     size: item.size,
     // #ifdef H5
-    file: item
+    file: item,
     // #endif
   }));
 }
@@ -205,7 +192,7 @@ function formatFile(res) {
     // #ifdef H5
     name: item.name,
     type: item.type,
-    file: item
+    file: item,
     // #endif
   }));
 }
@@ -219,7 +206,7 @@ export function chooseFile({
   sizeType,
   camera,
   maxCount,
-  extension
+  extension,
 }: any) {
   return new Promise((resolve, reject) => {
     switch (accept) {
@@ -229,7 +216,7 @@ export function chooseFile({
           sourceType: capture,
           sizeType,
           success: (res) => resolve(formatImage(res)),
-          fail: reject
+          fail: reject,
         });
         break;
       // #ifdef MP-WEIXIN
@@ -242,7 +229,7 @@ export function chooseFile({
           sizeType,
           camera,
           success: (res) => resolve(formatMedia(res)),
-          fail: reject
+          fail: reject,
         });
         break;
       // #endif
@@ -253,7 +240,7 @@ export function chooseFile({
           maxDuration,
           camera,
           success: (res) => resolve(formatVideo(res)),
-          fail: reject
+          fail: reject,
         });
         break;
       // #ifdef MP-WEIXIN || H5
@@ -264,7 +251,7 @@ export function chooseFile({
           count: multiple ? maxCount : 1,
           type: accept,
           success: (res) => resolve(formatFile(res)),
-          fail: reject
+          fail: reject,
         });
         // #endif
         // #ifdef H5
@@ -273,7 +260,7 @@ export function chooseFile({
           count: multiple ? maxCount : 1,
           type: accept,
           success: (res) => resolve(formatFile(res)),
-          fail: reject
+          fail: reject,
         };
         if (extension.length && extension.length > 0) {
           params.extension = extension;
@@ -289,7 +276,7 @@ export function chooseFile({
           count: multiple ? maxCount : 1,
           type: "all",
           success: (res) => resolve(formatFile(res)),
-          fail: reject
+          fail: reject,
         });
         // #endif
         // #ifdef H5
@@ -298,7 +285,7 @@ export function chooseFile({
           count: multiple ? maxCount : 1,
           type: "all",
           success: (res) => resolve(formatFile(res)),
-          fail: reject
+          fail: reject,
         };
         if (extension.length && extension.length > 0) {
           paramsFile.extension = extension;
@@ -308,3 +295,62 @@ export function chooseFile({
     }
   });
 }
+
+/**
+ * @description 数字格式化
+ * @param {number|string} number 要格式化的数字
+ * @param {number} decimals 保留几位小数
+ * @param {string} decimalPoint 小数点符号
+ * @param {string} thousandsSeparator 千分位符号
+ * @returns {string} 格式化后的数字
+ */
+export function priceFormat(
+  number: string | number,
+  decimals = 0,
+  decimalPoint = ".",
+  thousandsSeparator = ",",
+) {
+  number = `${number}`.replace(/[^0-9+-Ee.]/g, "");
+  const n = !isFinite(+number) ? 0 : +number;
+  const prec = !isFinite(+decimals) ? 0 : Math.abs(decimals);
+  const sep =
+    typeof thousandsSeparator === "undefined" ? "," : thousandsSeparator;
+  const dec = typeof decimalPoint === "undefined" ? "." : decimalPoint;
+  let s = "";
+
+  s = (prec ? n + "" : `${Math.round(n)}`).split(".");
+  const re = /(-?\d+)(\d{3})/;
+  while (re.test(s[0])) {
+    s[0] = s[0].replace(re, `$1${sep}$2`);
+  }
+
+  if ((s[1] || "").length < prec) {
+    s[1] = s[1] || "";
+    s[1] += new Array(prec - s[1].length + 1).join("0");
+  }
+  return s.join(dec);
+}
+
+/**
+ * @description 默认的姓名脱敏规则
+ * @param name 名字
+ * @return {string}
+ * */
+export const formatName = (name: string): string => {
+  let value = "";
+  if (name.length === 2) {
+    value = name.substring(0, 1) + "*";
+  } else if (name.length > 2) {
+    let char = "";
+    for (let i = 0, len = name.length - 2; i < len; i++) {
+      char += "*";
+    }
+    value =
+      name.substring(0, 1) +
+      char +
+      name.substring(name.length - 1, name.length);
+  } else {
+    value = name;
+  }
+  return value;
+};

package/utils/inspect.ts

@@ -0,0 +1,115 @@
+/**
+ * @description 判断字符串是否是数字
+ * @param {string | number} text 值
+ * @return {boolean}
+ * */
+export const isNumericString = (text: string | number): boolean => {
+  return typeof text === "string" && !isNaN(Number(text));
+};
+
+/**
+ * @description 判断是否是数字
+ * @param {string | number} text 值
+ * @return {boolean}
+ * */
+export const isNumber = (text: string | number): boolean => {
+  return typeof text === "number" || isNumericString(text);
+};
+
+/**
+ * @description 判断是否数组
+ * @param arr 传入数组值
+ * @return {boolean}
+ */
+export const isArray = (arr: any): boolean => {
+  if (typeof Array.isArray === "function") {
+    return Array.isArray(arr);
+  }
+  return Object.prototype.toString.call(arr) === "[object Array]";
+};
+
+/**
+ * @description 判断是否对象
+ * @param obj 传入对象值
+ * @return {boolean}
+ */
+export const isObject = (obj: any): boolean => {
+  return Object.prototype.toString.call(obj) === "[object Object]";
+};
+
+/**
+ * 是否视频格式
+ * @param {String} value
+ */
+export function isVideo(value: string): boolean {
+  const VIDEO_REGEXP =
+    /\.(mp4|mpg|mpeg|dat|asf|avi|rm|rmvb|mov|wmv|flv|mkv|m3u8)/i;
+  return VIDEO_REGEXP.test(value);
+}
+
+/**
+ * 判断是否是日期格式
+ * @param {number | string} value yyyy-mm-dd hh:mm:ss 或 时间戳
+ */
+export const isDate = (value: string | number) => {
+  if (!value) return false;
+  // number类型，判断是否是时间戳
+  if (typeof value === "number") {
+    // len === 10 秒级时间戳 len === 13 毫秒级时间戳
+    if (value.toString().length !== 10 && value.toString().length !== 13) {
+      return false;
+    }
+    return !isNaN(new Date(value).getTime());
+  }
+  if (typeof value === "string") {
+    // 是否为string类型时间戳
+    const numV = Number(value);
+    if (!isNaN(numV)) {
+      if (numV.toString().length === 10 || numV.toString().length === 13) {
+        return !isNaN(new Date(numV).getTime());
+      }
+    }
+    // 非时间戳，且长度在yyyy-mm-dd 至 yyyy-mm-dd hh:mm:ss 之间
+    if (value.length < 10 || value.length > 19) {
+      return false;
+    }
+    const dateRegex = /^\d{4}[-\/]\d{2}[-\/]\d{2}( \d{1,2}:\d{2}(:\d{2})?)?$/;
+    if (!dateRegex.test(value)) {
+      return false;
+    }
+    // 检查是否为有效日期
+    const dateValue = new Date(value);
+    return !isNaN(dateValue.getTime());
+  }
+  // 非number和string类型，不做校验
+  return false;
+};
+
+/**
+ * @description 验证是否是手机号格式
+ * @param phone {string} 手机号
+ */
+export const isPhone = (phone: string): boolean => {
+  return /^1[23456789]\d{9}$/.test(phone);
+};
+
+/**
+ * @description 验证身份证号码
+ * @param idCard {string} 身份证号
+ * @return {boolean}
+ */
+export const isIdCard = (idCard: string): boolean => {
+  return /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/.test(
+    idCard,
+  );
+};
+
+/**
+ * @description 验证是否是中文
+ * @param {string} zh 校验值
+ * @return {boolean}
+ */
+export const isChinese = (zh: string): boolean => {
+  const reg = /^[\u4e00-\u9fa5]+$/gi;
+  return reg.test(zh);
+};

package/utils/utils.ts

@@ -1,6 +1,6 @@
 import Base64 from "./base64";
-import { getCurrentInstance } from "vue";
 import type { CSSProperties } from "vue";
+import { isNumber } from "./index";
 let base64: any = new Base64();
 
 /**
@@ -57,10 +57,6 @@ const addUnit = (
   // 用内置验证规则中的number判断是否为数值
   return isNumber(value) ? `${value}${unit}` : value;
 };
-function isNumber(value: string) {
-  // 检查是否是数值类型或可以被解析为数值的字符串
-  return !isNaN(parseFloat(value)) && isFinite(Number(value));
-}
 
 /**
  * @description 日期的月或日补零操作
@@ -250,7 +246,7 @@ const imageToBase64 = (path: string) => {
  * @returns {void}
  * @constructor
  */
-function debounce(fn: () => void, t?: number) {
+function debounce(fn: Function, t?: number) {
   const delay = t || 500;
   let timer: any;
   let that = this;
@@ -265,17 +261,19 @@ function debounce(fn: () => void, t?: number) {
     }, delay);
   };
 }
+
+let timer;
+let flag: boolean | undefined;
 /**
  * 函数节流: 一段时间执行一次
  * @param {void} fn 回调函数
- * @param {number} t 节流时间
+ * @param {number} wait 节流等待时间
+ * @param {boolean} immediate 是否立马执行
  * @returns {void}
  * @constructor
  */
-let timer;
-let flag: boolean | undefined;
 const throttle = (
-  func: Function,
+  fn: Function,
   wait: number = 500,
   immediate: boolean = true,
 ): void => {
@@ -283,7 +281,7 @@ const throttle = (
     if (!flag) {
       flag = true;
       // 如果是立即执行，则在wait毫秒内开始时执行
-      typeof func === "function" && func();
+      typeof fn === "function" && fn();
       timer = setTimeout(() => {
         flag = false;
       }, wait);
@@ -293,7 +291,7 @@ const throttle = (
     // 如果是非立即执行，则在wait毫秒内的结束处执行
     timer = setTimeout(() => {
       flag = false;
-      typeof func === "function" && func();
+      typeof fn === "function" && fn();
     }, wait);
   }
 };
@@ -367,13 +365,13 @@ const range = (min = 0, max = 0, value = 0) => {
   return Math.max(min, Math.min(max, Number(value)));
 };
 let instance: any;
-// #ifndef H5
-instance = getCurrentInstance();
-// #endif
 /**
  * 查询节点信息
  * 目前此方法在支付宝小程序中无法获取组件跟接点的尺寸，为支付宝的bug(2020-07-21)
  * 解决办法为在组件根部再套一个没有任何作用的view元素
+ * @param selector 元素类名或id
+ * @param all 是否获取多个相同元素数值
+ * @param ins 在微信小程序里，因为utils文件里面获取不到instance值所以必须通过ins这个传过来
  */
 const getRect = (
   selector: string,
@@ -382,8 +380,8 @@ const getRect = (
 ): Promise<UniApp.NodeInfo | UniApp.NodeInfo[]> => {
   return new Promise((resolve) => {
     // TODO: 在微信小程序里，因为utils文件里面获取不到instance值所以必须通过ins这个传过来
-    // #ifndef H5
-    instance = instance || ins;
+    // #ifdef MP-WEIXIN
+    instance = ins;
     // #endif
     // #ifndef APP-NVUE
     uni
@@ -412,7 +410,7 @@ const getRect = (
 function getPx(value: string | number, unit: true): string;
 function getPx(value: string | number, unit?: false): number;
 function getPx(value: string | number, unit: boolean = false): string | number {
-  if (typeof value === "number") {
+  if (isNumber(value) || typeof value === "number") {
     return unit ? `${value}px` : Number(value);
   }
   // 如果带有rpx，先取出其数值部分，再转为px值
@@ -420,8 +418,11 @@ function getPx(value: string | number, unit: boolean = false): string | number {
     return unit
       ? `${uni.rpx2px(parseInt(value))}px`
       : Number(uni.rpx2px(parseInt(value)));
+  } else if (/(px)$/.test(value)) {
+    return unit ? value : Number(value.replace("px", ""));
+  } else {
+    return unit ? `${parseInt(value)}px` : Number(value);
   }
-  return unit ? `${parseInt(value)}px` : parseInt(value);
 }
 
 /**