ff-ui-plus 2.0.7

package/packages/utils/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "@ff-ui-plus/utils",
+  "version": "0.0.2",
+  "description": "utils of ff-ui-plus",
+  "license": "MIT",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org"
+  },
+  "scripts": {
+    "build": "npx unbuild",
+    "stub": "npx unbuild --stub"
+  },
+  "dependencies": {
+    "accounting": "^0.4.1",
+    "axios": "^1.4.0",
+    "crypto-js": "^4.1.1",
+    "dayjs": "^1.11.7",
+    "file-saver": "^2.0.5",
+    "good-storage": "^1.1.1",
+    "js-cookie": "^3.0.5",
+    "lodash-es": "^4.17.21",
+    "numeral": "^2.0.6",
+    "qs": "^6.11.1"
+  },
+  "devDependencies": {
+    "@types/accounting": "^0.4.2",
+    "@types/crypto-js": "^4.1.1",
+    "@types/file-saver": "^2.0.5",
+    "@types/good-storage": "^1.1.0",
+    "@types/js-cookie": "^3.0.3",
+    "@types/lodash-es": "^4.17.7",
+    "@types/numeral": "^2.0.2",
+    "@types/qs": "^6.9.7"
+  }
+}

package/packages/utils/src/cookie.ts

@@ -0,0 +1,24 @@
+import Cookies from "js-cookie"
+
+/**
+ * 获取 cookie
+ * @returns
+ */
+export function getCookie(key: string): string | undefined {
+  return Cookies.get(key)
+}
+
+/**
+ * 设置 cookie
+ * @returns
+ */
+export function setCookie(key: string, data: any): string | undefined {
+  return Cookies.set(key, data)
+}
+
+/**
+ * 移除 cookie
+ */
+export function removeCookie(key: string): void {
+  Cookies.remove(key)
+}

package/packages/utils/src/day.ts

@@ -0,0 +1,66 @@
+import dayjs from "dayjs"
+import type { QUnitType, OpUnitType, ConfigType } from "dayjs"
+
+/**
+ *
+ * @param {string | number | Date | Dayjs | null | undefined} date
+ * @param format 默认 YYYY-MM-DD HH:mm:ss
+ * @returns YYYY-MM-DD HH:mm:ss
+ */
+export function formatDate(date?: ConfigType, format = "YYYY-MM-DD HH:mm:ss"): string {
+  return dayjs(date || new Date()).format(format)
+}
+
+/**
+ * 格式化时间到天
+ * @param  {string | number | Date | Dayjs | null | undefined} date
+ * @returns YYYY-MM-DD
+ */
+export const formatDateToDay = (date: ConfigType): string => formatDate(date, "YYYY-MM-DD")
+
+/**
+ * 格式化时间到分钟
+ * @param  {string | number | Date | Dayjs | null | undefined} date
+ * @returns YYYY-MM-DD HH:mm
+ */
+export const formatDateToMinute = (date: ConfigType): string => formatDate(date, "YYYY-MM-DD HH:mm")
+
+/**
+ * 获取两个 Dayjs 对象的时间差，默认秒。
+ * @param date1
+ * @param date2
+ * @param format
+ * @returns {*}
+ */
+export function diffDate(
+  date1: ConfigType,
+  date2: ConfigType = dayjs(),
+  format: QUnitType | OpUnitType = "second"
+): number | string | undefined {
+  if (!date1) return
+  return dayjs(date1).diff(dayjs(date2), format)
+}
+
+/**
+ * @desc 获取距离当前时间差，返回多少年（月/天/小时/分钟/秒）前
+ * @param date  秒数
+ * @returns
+ */
+export function diffDateFromCurrent(date: number): string {
+  if (date >= 60 * 60 * 24 * 365) {
+    return `${parseInt(String(date / (60 * 60 * 24 * 365)))}年前`
+  }
+  if (date >= 60 * 60 * 24 * 30) {
+    return `${parseInt(String(date / (60 * 60 * 24 * 30)))}月前`
+  }
+  if (date >= 60 * 60 * 24) {
+    return `${parseInt(String(date / (60 * 60 * 24)))}天前`
+  }
+  if (date >= 60 * 60) {
+    return `${parseInt(String(date / (60 * 60)))}小时前`
+  }
+  if (date >= 60) {
+    return `${parseInt(String(date / 60))}分钟前`
+  }
+  return `${parseInt(String(date))}秒前`
+}

package/packages/utils/src/file.ts

@@ -0,0 +1,173 @@
+import type { FileSaverOptions } from "file-saver"
+
+const toLower = (str: string) => str.toLowerCase()
+
+/**
+ * 获取文件类型
+ * @param path
+ * @returns
+ */
+const getFileType = (path: string) => path && path.slice(path.lastIndexOf("."))
+
+/**
+ *
+ * @desc 限制文件类型
+ * @param {file|Blob} file 源文件
+ * "默认限制图"片
+ * @return 合法文件返回true否则返回false
+ */
+export const isLegalFile = (file: File | Blob, types: string[]): boolean => {
+  const filterTypes = types.filter(item => item && item !== "*").map(item => toLower(item))
+  if (!filterTypes.length) {
+    return true
+  }
+  const type = getFileType(file.name)
+
+  const isLegal = filterTypes.includes(toLower(type))
+  if (!isLegal) {
+    // 上传文件格式有误!
+    return false
+  }
+  return true
+}
+
+/**
+ *  @desc 限制文件上传大小
+ * @param {file|Blob} file 源文件
+ * @param {number} fileMaxSize  图片限制大小单位（MB）
+ * @return 在限制内返回true否则返回false
+ */
+export const isMaxFileSize = (file: File | Blob, fileMaxSize?: number): boolean => {
+  if (!fileMaxSize) {
+    return true
+  }
+  const isMaxSize = file.size / 1024 / 1024 < fileMaxSize
+  if (!isMaxSize) {
+    // 上传文件大小不能超过 {size} MB!
+    return false
+  }
+  return true
+}
+
+/**
+ *
+ * @desc 读取文件为DataURL文件格式  （base64）
+ * @param {file|Blob} file 源文件
+ * @return 返回DataURL文件 （base64）
+ */
+export const fileToDataURL = (file: File | Blob): Promise<string> => {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader()
+    reader.onload = (e: ProgressEvent<FileReader>) => {
+      const data = (e.target as any).result
+      resolve(data)
+    }
+    reader.onerror = e => {
+      // 读取文件失败
+      reject(new Error(e as any))
+    }
+    reader.readAsDataURL(file)
+  })
+}
+
+/**
+ * @desc 读取文件为text文件格式
+ * @param {file} file 源文件
+ * @return 返回text文件
+ */
+export const fileToText = (file: File | Blob): Promise<string> => {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader()
+    reader.onload = (e: ProgressEvent<FileReader>) => {
+      const data = (e.target as any).result
+      resolve(data)
+    }
+    reader.onerror = e => {
+      // 读取文件失败
+      // 读取文件失败
+      reject(new Error(e as any))
+    }
+    reader.readAsText(file, "utf-8")
+  })
+}
+
+/**
+ * @desc 加载真实图片，读取成功返回图片真实宽高和图片本身对象 ag: { width: 100,height: 100,image: '' }
+ * @param {string} src  图片地址
+ * @return `{ width: ,height: , image:  }`
+ */
+export const loadImage = (
+  src: string
+): Promise<{ width: number; height: number; image: HTMLImageElement }> => {
+  return new Promise((resolve, reject) => {
+    const image = new Image()
+    image.src = src
+    image.onload = () => {
+      const data = { width: image.width, height: image.height, image }
+      resolve(data)
+    }
+    image.onerror = () => {
+      // 加载文件失败
+      const err = new Error("load file error")
+      reject(err)
+    }
+  })
+}
+
+/**
+ * @desc  判断图片文件的分辨率是否在限定范围之内，分辨率不在限定范围之内则抛出异常
+ * @param {file} file 源文件
+ * @param {object} props   文件分辨率的宽和高   ag: props={width:100, height :100}
+ */
+export const isLegalResolutionRatio = async (
+  file: File | Blob,
+  props: { width: number; height: number }
+): Promise<boolean> => {
+  try {
+    const { width, height } = props
+    const base64 = await fileToDataURL(file)
+    const image = await loadImage(base64)
+    if (image.width !== width || image.height !== height) {
+      // 上传图片的分辨率必须为
+      return Promise.reject(false)
+    }
+    return true
+  } catch (error) {
+    return Promise.reject(false)
+  }
+}
+
+interface Download<T = Blob | string> {
+  (data: T, filename: string, options?: FileSaverOptions): Promise<T>
+}
+
+/**
+ * @description 下载文件
+ * @param {Blob | string} data  文件 Blob
+ * @param  {string} filename 文件名称
+ * @param  {object} options 可选参数
+ */
+export const download: Download = async (data, filename, options) => {
+  // 处理没有数据的情况
+  if (!data) {
+    return Promise.reject("download fail: data is empt!")
+  }
+
+  // 处理二进制数据接口异常
+  try {
+    const text = await (data as Blob).text()
+    const res = JSON.parse(text)
+    if (res) {
+      return Promise.reject("download fail: server error!")
+    }
+  } catch (error) {}
+
+  // 下载文件
+  try {
+    const { default: FileSaver } = await import("file-saver")
+    FileSaver.saveAs(data, filename, options)
+    return Promise.resolve(data)
+  } catch (error) {
+    return Promise.reject("download fail: server error!")
+  }
+}

package/packages/utils/src/index.ts

@@ -0,0 +1,10 @@
+export * from "./cookie"
+export * from "./day"
+export * from "./file"
+export * from "./is"
+export * from "./letter"
+export * from "./number"
+export * from "./openExe"
+export * from "./storage"
+export * from "./validate"
+export * from "./ws"

package/packages/utils/src/is.ts

@@ -0,0 +1,159 @@
+/**
+ * Object.prototype.toString 别名
+ */
+export const objectToString = Object.prototype.toString
+
+/**
+ * 获取类型
+ * @param value
+ * @returns
+ */
+export const toTypeString = (value: any) => objectToString.call(value)
+
+/**
+ * 拿到类型字符串
+ * @param value
+ * @returns
+ */
+export const toRawType = (value: any) => {
+  return toTypeString(value).slice(8, -1)
+}
+
+/**
+ * 判断是否是数组
+ */
+export const isArray = Array.isArray
+
+/**
+ * 判断是否是Map
+ * @param val
+ * @returns
+ */
+export const isMap = (val: any): val is Map<any, any> => toTypeString(val) === "[object Map]"
+
+/**
+ * 判断是否是Set
+ * @param val
+ * @returns
+ */
+export const isSet = (val: any): val is Set<any> => toTypeString(val) === "[object Set]"
+
+/**
+ * 判断是否是Date
+ * @param val
+ * @returns
+ */
+export const isDate = (val: any): val is Date => toTypeString(val) === "[object Date]"
+
+/**
+ * 判断是否是Reg
+ * @param val
+ * @returns
+ */
+export const isRegExp = (val: any): val is RegExp => toTypeString(val) === "[object RegExp]"
+
+/**
+ * 判断是否是函数
+ * @param val
+ * @returns
+ */
+// eslint-disable-next-line @typescript-eslint/ban-types
+export const isFunction = (val: any): val is Function => typeof val === "function"
+
+/**
+ * 判断是否是字符串
+ * @param val
+ * @returns
+ */
+export const isString = (val: any): val is string => typeof val === "string"
+
+/**
+ * 判断是否是Symbol
+ * @param val
+ * @returns
+ */
+export const isSymbol = (val: any): val is symbol => typeof val === "symbol"
+
+/**
+ * 判断是否是boolean
+ * @param val
+ * @returns
+ */
+export const isBoolean = (val: any): val is boolean => typeof val === "boolean"
+
+/**
+ * 判断是否是object
+ * @param val
+ * @returns
+ */
+export const isObject = (val: any): val is Record<keyof any, any> =>
+  val !== null && typeof val === "object"
+
+/**
+ * 判断是否是Promise
+ * @param val
+ * @returns
+ */
+export const isPromise = <T = any>(val: any): val is Promise<T> => {
+  return isObject(val) && isFunction(val.then) && isFunction(val.catch)
+}
+
+/**
+ * 判断是否是 纯对象 object
+ * @param val
+ * @returns
+ */
+export const isPlainObject = (val: any): val is Record<keyof any, any> =>
+  toTypeString(val) === "[object Object]"
+
+/**
+ * 是否是空对象
+ * @param val
+ * @returns
+ */
+export const isEmptyObject = (val: any): val is Record<keyof any, any> =>
+  isPlainObject(val) && Object.keys(val).length === 0
+
+/**
+ * 是否是链接
+ * @param url
+ * @returns
+ */
+export function isUrl(url: string): url is string {
+  const regex = new RegExp(
+    "^(https?:\\/\\/)?" + // protocol
+      "((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|" + // domain name
+      "((\\d{1,3}\\.){3}\\d{1,3}))" + // OR ip (v4) address
+      "(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*" + // port and path
+      "(\\?[;&a-z\\d%_.~+=-]*)?" + // query string
+      "(\\#[-a-z\\d_]*)?$",
+    "i"
+  )
+  return regex.test(url)
+}
+
+/**
+ * 是否是SVGElement
+ * @param tag
+ * @returns
+ */
+export const isSVGElement = (tag: any): tag is SVGElement =>
+  typeof SVGElement !== "undefined" && tag instanceof SVGElement
+
+/**
+ * 是否是vue 组件
+ * @param val
+ * @returns
+ */
+export const isComponent = (val: any) =>
+  isPlainObject(val) && (isFunction(val.render) || isFunction(val.setup))
+
+/**
+ * 是否是ios
+ * @returns {boolean}
+ */
+export function isIOS(): boolean {
+  const isIphone = navigator.userAgent.includes("iPhone")
+  const isIpad = navigator.userAgent.includes("iPad")
+  return isIphone || isIpad
+}

package/packages/utils/src/letter.ts

@@ -0,0 +1,15 @@
+/**
+ * @desc 生成大写字母
+ * @returns
+ */
+export const getBigLetter = () => {
+  return Array.from({ length: 26 }).map((_, index) => String.fromCharCode(65 + index))
+}
+
+/**
+ * @desc 生成小写字母
+ * @returns
+ */
+export const getSmallLetter = () => {
+  return Array.from({ length: 26 }).map((_, index) => String.fromCharCode(97 + index))
+}

package/packages/utils/src/number.ts

@@ -0,0 +1,37 @@
+import numeral from "numeral"
+import accounting from "accounting"
+
+/**
+ * 格式化金钱  $12,345,678.00
+ * @param val
+ * @param format 默认 '￥'
+ * @returns
+ */
+export function formatMoney(val: string | number, format = "￥"): string {
+  return accounting.formatMoney(val, format)
+}
+
+/**
+ * 格式化数字
+ * @param number
+ * @param format   默认格式 '0.00'
+ * @returns
+ */
+export function formatNumber(number: number | string, format = "0.00"): string {
+  return numeral(number).format(format)
+}
+
+/**
+ * 格式化数字
+ * @param value
+ * @param decimal 默认2位小数
+ * @returns x.xx
+ */
+export function formatNumberFixed(value: string, decimal = 2): string {
+  let temp = String(value)
+  if (String(value).includes(".")) {
+    temp = value.slice(0, value.indexOf(".") + decimal + 1)
+  }
+  const format = "0." + "0".repeat(decimal)
+  return formatNumber(temp, format)
+}

package/packages/utils/src/openExe.ts

@@ -0,0 +1,45 @@
+/**
+ * @description 打开电脑本地软件
+ * @param protocol  本地软件协议， 如 vscode 的协议 `vscode://`
+ * @param event  点击按钮事件， `el-button` 或者原生 `button`
+ * @param timeout 默认`1000`ms，没响应则认为打开失败
+ */
+export const openExe = (protocol: string, event: Event, timeout = 1000): Promise<FocusEvent> => {
+  event.stopPropagation()
+  event.preventDefault()
+  window.location.href = protocol
+  const target = event.target as EventTarget & {
+    localName: string
+    parentElement: HTMLButtonElement
+    onblur: (e: FocusEvent) => void
+  }
+  return new Promise((resolve, reject) => {
+    if (target) {
+      const element =
+        target.localName === "button"
+          ? target
+          : target.localName === "span"
+          ? target.parentElement
+          : document
+      // 防止重复注册
+      if (element.onblur === null) {
+        // 1秒没有响应 则认为软件打开失败
+        const timer = setTimeout(() => {
+          element.onblur = null
+          reject("error")
+        }, timeout)
+
+        element.onblur = (focusEvent: FocusEvent) => {
+          // 判断焦点失去是否是按钮  防止点击界面其他地方导致失去焦点
+          if (element === document.activeElement) {
+            clearTimeout(timer)
+            element.onblur = null
+            resolve(focusEvent)
+          }
+        }
+      }
+    } else {
+      reject("error")
+    }
+  })
+}

package/packages/utils/src/storage.ts

@@ -0,0 +1,77 @@
+import storage from "good-storage"
+import CryptoJS from "crypto-js"
+
+/**
+ * AES加密
+ * @param key 加密的key
+ * @param data 需要加密的字符串
+ * @returns encrypted 加密的字符串
+ */
+export function encrypt(
+  key: string | CryptoJS.lib.WordArray,
+  data: string | CryptoJS.lib.WordArray
+): string {
+  const encrypted = CryptoJS.AES.encrypt(data, key).toString()
+  return encrypted
+}
+
+/**
+ * AES 解密
+ * @param key 解密的key 需要和加密的key 一致
+ * @param encrypted 加密后字符串
+ * @returns data  解密后的字符串
+ */
+export function decrypt(
+  key: string | CryptoJS.lib.WordArray,
+  encrypted: string | CryptoJS.lib.CipherParams
+): string {
+  const decrypted = CryptoJS.AES.decrypt(encrypted, key)
+  const data = decrypted.toString(CryptoJS.enc.Utf8)
+  return data
+}
+
+/**
+ * 获取storage
+ * @returns storage
+ */
+export function getStorage(key: string): string {
+  return storage.get(key)
+}
+/**
+ * 设置storage
+ * @returns storage
+ */
+export function setStorage(key: string, data: any): string {
+  return storage.set(key, data)
+}
+
+/**
+ * 移除storage
+ */
+export function removeStorage(key: string): void {
+  storage.remove(key)
+}
+
+/**
+ * 获取token  带AES解密
+ * @returns token
+ */
+export function getToken(key: string): string {
+  const data = storage.get(key)
+  const res = data ? decrypt(key, data) : ""
+  return res
+}
+/**
+ * 设置token  带AES加密
+ * @returns token
+ */
+export function setToken(key: string, token: string): string {
+  const data = encrypt(key, token)
+  return storage.set(key, data)
+}
+/**
+ * 移除token
+ */
+export function removeToken(key: string): void {
+  storage.remove(key)
+}