zy-react-library 1.0.0

package/hooks/useTable/index.js

@@ -0,0 +1,162 @@
+import { tools } from "@cqsjjb/jjb-common-lib";
+import { useAntdTable } from "ahooks";
+
+const { query } = tools.router;
+
+/**
+ * 获取数据
+ */
+function getService(service, getExtraParams = {}, transform) {
+  // 获取额外的参数
+  const extraParams = (typeof getExtraParams === "function" ? getExtraParams() : getExtraParams) || {};
+  // 获取数据
+  return async ({ current, pageSize }, formData = {}) => {
+    // 如果提供了 transform 函数，则在请求之前调用它
+    let transformedFormData = formData;
+    if (typeof transform === "function") {
+      const transformResult = transform(formData);
+      // 如果 transform 函数有返回值，则将其与原始表单数据合并，transform 的优先级更高
+      if (transformResult && typeof transformResult === "object") {
+        transformedFormData = { ...formData, ...transformResult };
+      }
+    }
+
+    // 发起请求
+    const res = await service({
+      pageIndex: current,
+      pageSize,
+      ...transformedFormData,
+      ...extraParams,
+    });
+    // 返回数据
+    return {
+      list: res.data || [],
+      total: res.totalCount || 0,
+      ...res,
+    };
+  };
+}
+
+/**
+ * 将搜索表单项和分页参数保存到 URL 中
+ */
+function setQuery(searchForm, pagination) {
+  // 将对象转换为键值对字符串格式
+  const getJoinString = (data) => {
+    const keys = [];
+    const values = [];
+    Object.entries(data).forEach(([key, value]) => {
+      if (value) {
+        keys.push(key);
+        if (Array.isArray(value)) {
+          // 数组值使用方括号包裹，并用竖线分隔
+          values.push(`[${value.join("|")}]`);
+        }
+        else {
+          values.push(value);
+        }
+      }
+    });
+    return { keys: keys.join(","), values: values.join(",") };
+  };
+
+  // 获取搜索表单和分页数据的键值对字符串
+  const searchFormData = getJoinString(searchForm);
+  const paginationData = getJoinString(pagination);
+
+  // 将数据存储到 URL 查询参数中
+  query.searchFormKeys = searchFormData.keys;
+  query.searchFormValues = searchFormData.values;
+  query.paginationKeys = paginationData.keys;
+  query.paginationValues = paginationData.values;
+}
+
+/**
+ * 从 URL 中获取查询参数
+ */
+function getQuery(keysStr, valuesStr) {
+  // 将键值字符串分割为数组
+  const keys = keysStr ? keysStr.split(",") : [];
+  const values = valuesStr ? valuesStr.split(",") : [];
+
+  // 构建结果对象
+  const resultMap = {};
+  keys.forEach((key, index) => {
+    if (values[index]) {
+      // 处理数组值（方括号包裹的值）
+      if (values[index].startsWith("[") && values[index].endsWith("]")) {
+        const arrayContent = values[index].substring(1, values[index].length - 1);
+        resultMap[key] = arrayContent ? arrayContent.split("|") : [];
+      }
+      else {
+        // 处理普通值
+        resultMap[key] = values[index];
+      }
+    }
+  });
+  return resultMap;
+}
+
+/**
+ * 自定义 useTable，继承 ahooks 的 useAntdTable，根据需求进行扩展
+ */
+function useTable(service, options) {
+  // 获取额外参数和转换函数
+  const { params: extraParams, transform, ...restOptions } = options || {};
+
+  // 获取配置项
+  const {
+    useStorageQueryCriteria = true,
+    usePagination = true,
+    defaultType = "advance",
+    defaultCurrent = 1,
+    defaultPageSize = 10,
+    defaultPagination = { current: defaultCurrent, pageSize: defaultPageSize },
+    ...restRestOptions
+  } = restOptions;
+
+  // 获取存储的查询条件
+  const storageQueryCriteriaSearchForm = useStorageQueryCriteria ? getQuery(query.searchFormKeys, query.searchFormValues) : {};
+  const storageQueryCriteriaPagination = useStorageQueryCriteria && usePagination ? getQuery(query.paginationKeys, query.paginationValues) : {};
+
+  // 确定实际使用的搜索表单和分页参数
+  const actualSearchForm = Object.keys(storageQueryCriteriaSearchForm).length > 0 ? storageQueryCriteriaSearchForm : {};
+  /** @type {{current: number, pageSize: number}} */
+  const actualPagination = usePagination ? Object.keys(storageQueryCriteriaPagination).length > 0 ? storageQueryCriteriaPagination : defaultPagination : {};
+
+  // 调用 ahooks 的 useAntdTable
+  const res = useAntdTable(
+    getService(service, extraParams, transform),
+    {
+      ...restRestOptions,
+      defaultParams: [actualPagination, actualSearchForm],
+      defaultType,
+      onSuccess: (data, params) => {
+        // 执行成功回调，为了保留 ahooks 的 onSuccess 回调
+        restOptions.onSuccess && restOptions.onSuccess(data, params);
+        // 存储查询条件和分页到 URL
+        useStorageQueryCriteria && setQuery(
+          params[1] ?? {},
+          usePagination
+            ? { current: res.tableProps.pagination.current, pageSize: res.tableProps.pagination.pageSize }
+            : {},
+        );
+      },
+    },
+  );
+
+  // 执行回调函数
+  restOptions.callback && restOptions.callback(res?.data?.list || [], res?.data || {});
+
+  // 返回结果
+  return {
+    ...res,
+    tableProps: {
+      ...res.tableProps,
+      pagination: usePagination ? { ...res.tableProps.pagination, showQuickJumper: true, showSizeChanger: true } : false,
+    },
+    getData: res.search.submit,
+  };
+}
+
+export default useTable;

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "zy-react-library",
+  "private": false,
+  "version": "1.0.0",
+  "type": "module",
+  "description": "",
+  "author": "LiuJiaNan",
+  "license": "MIT",
+  "files": [
+    "components",
+    "enum",
+    "hooks",
+    "regular",
+    "utils",
+    "README.md"
+  ],
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "scripts": {
+    "postinstall": "echo 'Thanks for using our component library!'"
+  },
+  "dependencies": {
+    "@ant-design/icons": "^6.1.0",
+    "@ant-design/pro-components": "^2.8.10",
+    "@cqsjjb/jjb-common-lib": "latest",
+    "ahooks": "^3.9.5",
+    "antd": "^5.27.6",
+    "dayjs": "^1.11.18",
+    "lodash-es": "^4.17.21",
+    "react": "^18.3.1"
+  }
+}

package/regular/index.d.ts

@@ -0,0 +1,49 @@
+/**
+ * 匹配中国手机号码，可包含国家代码86，支持各种运营商号段。
+ */
+export const PHONE: RegExp;
+
+/**
+ * 匹配中国大陆的统一社会信用代码。
+ */
+export const UNIFIED_SOCIAL_CREDIT_CODE: RegExp;
+
+/**
+ * 匹配中国大陆的身份证号码，包括15位和18位号码，并验证最后一位校验码。
+ */
+export const ID_NUMBER: RegExp;
+
+/**
+ * 匹配中国大陆的移动电话号码，不包含国家代码。
+ */
+export const MOBILE_PHONE: RegExp;
+
+/**
+ * 匹配浮点数，允许整数、一位或两位小数，以及零的情况。
+ */
+export const FLOATING_POINT_NUMBER: RegExp;
+
+/**
+ * 两位小数。
+ */
+export const TWO_DECIMAL_PLACES: RegExp;
+
+/**
+ * 一位小数（非必须）。
+ */
+export const ONE_DECIMAL_PLACES: RegExp;
+
+/**
+ * 匹配中国大陆的车牌号码。
+ */
+export const LICENSE_PLATE_NUMBER: RegExp;
+
+/**
+ * 匹配强密码，要求至少8个字符，包含大小写字母、数字和特殊字符。
+ */
+export const STRONG_PASSWORD: RegExp;
+
+/**
+ * 匹配完整的HTML标签，包括开始标签和结束标签。
+ */
+export const HTML_TAG: RegExp;

package/regular/index.js

@@ -0,0 +1,56 @@
+/**
+ * 匹配中国手机号码，可包含国家代码86，支持各种运营商号段。
+ */
+export const PHONE
+  = /^(?:(?:\+|00)86)?1(?:3\d|4[5-7|9]|5[0-3|5-9]|6[5-7]|7[0-8]|8\d|9[1|89])\d{8}$/;
+
+/**
+ * 匹配中国大陆的统一社会信用代码。
+ */
+export const UNIFIED_SOCIAL_CREDIT_CODE
+  = /^[0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}$/;
+
+/**
+ * 匹配中国大陆的身份证号码，包括15位和18位号码，并验证最后一位校验码。
+ */
+export const ID_NUMBER
+  = /^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[12]\d|30|31)\d{3}[\dX]$/i;
+
+/**
+ * 匹配中国大陆的移动电话号码，不包含国家代码。
+ */
+export const MOBILE_PHONE
+  = /^(13\d|14[579]|15[0-3,5-9]|166|17[0135-8]|18\d|19[89])\d{8}$/;
+
+/**
+ * 匹配浮点数，允许整数、一位或两位小数，以及零的情况。
+ */
+export const FLOATING_POINT_NUMBER
+  = /(^[1-9](\d+)?(\.\d{1,2})?$)|(^(0)$)|(^\d\.\d(\d)?$)/;
+
+/**
+ * 两位小数。
+ */
+export const TWO_DECIMAL_PLACES = /^\d+\.\d{2}$/;
+
+/**
+ * 一位小数（非必须）。
+ */
+export const ONE_DECIMAL_PLACES = /^\d+(\.\d?)?$/;
+
+/**
+ * 匹配中国大陆的车牌号码。
+ */
+export const LICENSE_PLATE_NUMBER
+  = /^([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z][A-Z][A-Z0-9]{4}[A-Z0-9挂学警港澳])$/;
+
+/**
+ * 匹配强密码，要求至少8个字符，包含大小写字母、数字和特殊字符。
+ */
+export const STRONG_PASSWORD
+  = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[^a-zA-Z\d]).{8,}$/;
+
+/**
+ * 匹配完整的HTML标签，包括开始标签和结束标签。
+ */
+export const HTML_TAG = /<[^>]*>/g;

package/utils/index.d.ts

@@ -0,0 +1,265 @@
+import type { BasePaginationConfig } from "../hooks/useTable";
+
+// 定义 getDataType 函数可能返回的所有类型
+type DataType
+  = | "String"
+    | "Number"
+    | "Boolean"
+    | "Symbol"
+    | "Undefined"
+    | "Null"
+    | "Object"
+    | "Array"
+    | "Function"
+    | "Date"
+    | "RegExp"
+    | "Error"
+    | "Map"
+    | "Set"
+    | "WeakMap"
+    | "WeakSet"
+    | "ArrayBuffer"
+    | "DataView"
+    | "Promise"
+    | "Generator"
+    | "GeneratorFunction"
+    | "AsyncFunction"
+    | "Arguments"
+    | "Math"
+    | "JSON"
+    | "Window"
+    | "HTMLDocument"
+    | string; // 允许其他可能的类型
+
+// 为 findCharIndex 函数定义接口类型
+interface FindCharIndexOptions {
+  /** 查找的字符串 */
+  str: string;
+  /** 查找的字符 */
+  char: string;
+  /** 第几次出现 */
+  num: number;
+}
+
+// 为 paging 函数定义接口类型
+interface PagingOptions {
+  /** 分页的数组 */
+  list: any[];
+  /** 当前页 */
+  currentPage: number | string;
+  /** 每页条数 */
+  pageSize: number | string;
+}
+
+// 为 addingPrefixToFile 函数定义接口类型
+interface AddingPrefixToFileOptions {
+  /** 附件路径字段名 */
+  pathKey?: string;
+  /** 附件名称字段名 */
+  nameKey?: string;
+  /** 附件id字段名 */
+  idKey?: string;
+}
+
+// 为 getLabelName 函数定义接口类型
+interface GetLabelNameOptions {
+  /** 状态 */
+  status: number | string;
+  /** 翻译的数组 */
+  list: any[];
+  /** id字段名 */
+  idKey?: string;
+  /** name字段名 */
+  nameKey?: string;
+}
+
+// 为 getSelectAppointItemList 函数定义接口类型
+interface GetSelectAppointItemListOptions {
+  /** 获取的数组 */
+  list: any[];
+  /** 获取的值 */
+  value: any[];
+  /** 获取的id字段名 */
+  idKey?: string;
+}
+
+// 为 listTransTree 函数定义接口类型
+interface ListTransTreeOptions {
+  /** 需要转换的json */
+  json: any[];
+  /** id字段 */
+  idKey: string;
+  /** 父级id字段 */
+  parentIdKey: string;
+  /** 子级字段 */
+  childrenKey: string;
+}
+
+// 为 isEmptyToWhether 函数定义接口类型
+interface IsEmptyToWhetherOptions {
+  /** 真值时显示的文本 */
+  yesText?: string;
+  /** 假值时显示的文本 */
+  noText?: string;
+  /** 判断为真的值 */
+  yesValue?: string | number;
+}
+
+/**
+ * 计算序号
+ */
+export function serialNumber(
+  pagination: BasePaginationConfig,
+  index: number
+): number;
+
+/**
+ * 字符串数组转数组
+ */
+export function toArrayString(value: string): Array<string>;
+
+/**
+ * 判断文件后缀名是否符合
+ */
+export function interceptTheSuffix(name: string, suffix: string): boolean;
+
+/**
+ * 图片转base64
+ */
+export function image2Base64(imgUrl: string): Promise<string>;
+
+/**
+ * 图片转base64 (File对象版本)
+ */
+export function image2Base642(file: File): Promise<string>;
+
+/**
+ * 判断图片是否可访问成功
+ */
+export function checkImgExists(imgUrl: string): Promise<any>;
+
+/**
+ * 获取数据类型
+ */
+export function getDataType(data: any): DataType;
+
+/**
+ * 数组去重
+ */
+export function ArrayDeduplication<T extends number | string>(arr: T[]): T[];
+
+/**
+ * 数组对象去重
+ */
+export function arrayObjectDeduplication<T>(arr: T[], key: string): T[];
+
+/**
+ * 查找字符串中指定的值第几次出现的位置
+ */
+export function findCharIndex(options: FindCharIndexOptions): number;
+
+/**
+ * 生成指定两个值之间的随机数
+ */
+export function randoms(min: number, max: number): number;
+
+/**
+ * 千位分隔符
+ */
+export function numFormat(num: number | string): string;
+
+/**
+ * 验证是否为空
+ */
+export function isEmpty(value: any): boolean;
+
+/**
+ * 获取url参数
+ */
+export function getUrlParam(key: string): string;
+
+/**
+ * 数据分页
+ */
+export function paging<T>(options: PagingOptions): T[];
+
+/**
+ * 获取文件后缀
+ */
+export function getFileSuffix(name: string): string;
+
+/**
+ * 获取文件名称
+ */
+export function getFileName(name: string): string;
+
+/**
+ * 读取txt文档
+ */
+export function readTxtDocument(filePah: string): Promise<string>;
+
+/**
+ * 将秒转换成时分秒
+ */
+export function secondConversion(second: string | number): string;
+
+/**
+ * 附件添加前缀
+ */
+export function addingPrefixToFile<T extends Record<string, any>>(
+  list: T[],
+  options?: AddingPrefixToFileOptions
+): (T & { url: string; name: string; imgFilesId: any })[];
+
+/**
+ * 翻译状态
+ */
+export function getLabelName<T>(options: GetLabelNameOptions): string | undefined;
+
+/**
+ * 计算文件大小
+ */
+export function calculateFileSize(size: number | string): string;
+
+/**
+ * 根据身份证号获取出生日期和性别
+ */
+export function idCardGetDateAndGender(idCard: string): { sex: "1" | "0"; date: string };
+
+/**
+ * 获取select中指定项组成的数组
+ */
+export function getSelectAppointItemList<T>(options: GetSelectAppointItemListOptions): T[];
+
+/**
+ * json转换为树形结构
+ */
+export function listTransTree<T>(options: ListTransTreeOptions): T[];
+
+/**
+ * 将值转换为"是"/"否"显示文本
+ */
+export function isEmptyToWhether(
+  value: any,
+  options?: IsEmptyToWhetherOptions
+): string;
+
+/**
+ * 生成指定长度的guid
+ */
+export function createGuid(len?: number): string;
+
+/**
+ * 获取序号列
+ */
+export function getIndexColumn(pagination: false | BasePaginationConfig): {
+  title: string;
+  key: string;
+  width: number;
+  render: (...args: any[]) => number;
+};
+
+/**
+ * 获取文件url
+ */
+export function getFileUrl(): string;