---
name: jjb-base-component-library
description: 定义 JJB 项目基础组件库与通用工具库的组成与使用规范。在选用业务组件、调用工具函数、查阅 API 或遵循组件使用规范时使用。涵盖 jjb-react-admin-component、jjb-common-lib 及 tools/http/qs/crypto/color 等模块。
---

# 技术栈与基础

## 基础组件库

- **业务组件库**：@cqsjjb/jjb-react-admin-component

  - 提供企业级后台管理系统所需的业务组件，包括页面布局、表单、表格、上传等组件

  - 主要组件：`PageLayout`、`SearchForm`、`TableAction`、`Editor`、`ImageUploader`、`FileUploader`、`ImageCropper`、`AMap` 等

  - 使用规范：必须严格参考对应 MD 文档或 d.ts 文件，不得猜测组件属性

- **通用工具库**：@cqsjjb/jjb-common-lib

  - 提供基础工具函数、HTTP 请求、加解密、颜色值等通用功能模块

### @cqsjjb/jjb-common-lib 主要模块

`@cqsjjb/jjb-common-lib` 包含以下主要模块：

- **tools 模块**：包含大量基础工具函数，开发时应优先使用工具库中的工具，避免重复造轮子

  - 使用建议：在实现功能前，应先查找 `tools` 模块中是否有对应的工具函数

  - 导入方式：`import { tools } from '@cqsjjb/jjb-common-lib';`

  - 主要功能分类：

    - **JSON/数据解析与序列化**：`parseJSON`、`parseObject`、`parseArray`、`stringifyObject`、`stringifyArray`

    - **数据清洗**：`cleanArray`、`cleanObject`

    - **类型判断**：`isEmptyObject`、`isEmptyStringObject`、`isEmptyStringArray`、`isNativeEvent`、`getPrimaryType`、`isTrueEnum`、`isFalseEnum`、`isBoolEnum`

    - **类型转换**：`toObject`、`toFunction`、`toArray`、`toBoolEnum`

    - **数组处理**：`uniqueArray`、`cleanArray`

    - **字符串处理**：`classNames`、`toCamelCase`、`toPascalCase`

    - **环境检测**：`inIframe`、`inWxBrowser`

    - **异步处理**：`asyncWait`

    - **路由参数管理**：`router` 对象（包含 `values()`、`keys()`、`query`、`has()`、`add()`、`delete()`、`toString()` 等方法）

    - **文件处理**：`base64ToFile`、`fileToBase64`

    - **枚举处理**：`getEnumLabel`、`getEnumValue`

  - 详细文档：

    - 完整使用规范：参考 [`21-jjb-common-lib/01-tools模块使用规范`](../../21-jjb-common-lib/01-tools模块使用规范.md)

    - API 参考文档：参考 `reference/tools.md` 查看完整的 API 文档和使用示例

- **http 模块**：基于 axios 高度封装的请求库，专为微应用场景设计

  - 核心作用：`declareRequest` 的接口请求就是基于此模块实现

  - 导入方式：`import { http } from '@cqsjjb/jjb-common-lib';`

  - 主要方法：`Get`、`Post`、`Delete`、`Put`、`Patch`、`request`

  - 核心特性：自动 URL 处理、Token 自动注入、租户代码自动注入、401 自动处理、响应数据统一处理、请求/响应拦截器、错误提示

  - 详细文档：

    - 完整使用规范：参考 [`21-jjb-common-lib/02-http模块使用规范`](../../21-jjb-common-lib/02-http模块使用规范.md)

    - API 参考文档：参考 `reference/http.js` 查看完整的实现代码和 API 文档

- **qs 模块**：一个简化的 querystring 模块，用于处理 URL 查询字符串

  - 核心作用：`tools.router` 的核心技术基于此 `qs` 模块实现

  - 导入方式：`import { qs } from '@cqsjjb/jjb-common-lib';`

  - 主要方法：`parse(url)` - 解析 URL 获取 query 参数对象，`stringify(query, prefix?)` - 将对象序列化为 query string

  - 详细文档：

    - 完整使用规范：参考 [`21-jjb-common-lib/03-qs模块使用规范`](../../21-jjb-common-lib/03-qs模块使用规范.md)

    - API 参考文档：参考 `reference/qs.d.ts` 查看完整的类型定义和 API 文档

- **crypto 模块**：基于 cryptojs 实现的简化加解密模块

  - 导入方式：`import { crypto } from '@cqsjjb/jjb-common-lib';`

  - 主要方法：`AES_128_Encrypt` - AES-128 位加密，`AES_128_Decrypt` - AES-128 位解密，`MD5` - MD5 哈希加密

  - 详细文档：

    - 完整使用规范：参考 [`21-jjb-common-lib/04-crypto模块使用规范`](../../21-jjb-common-lib/04-crypto模块使用规范.md)

    - API 参考文档：参考 `reference/crypto.d.ts` 查看完整的类型定义和 API 文档

- **color 模块**：包含大量预定义的颜色值，提供统一的颜色管理

  - 导入方式：`import { color } from '@cqsjjb/jjb-common-lib';`

  - 主要颜色分类：基础颜色（BLUE、RED、GREEN 等）、灰色系（GRAY_333 到 GRAY_EEE）、浅灰色系（GRAY_F0 到 GRAY_FE）、特殊颜色（GRAYSKYBLUE、RED_10 等）

  - 详细文档：

    - 完整使用规范：参考 [`21-jjb-common-lib/05-color模块使用规范`](../../21-jjb-common-lib/05-color模块使用规范.md)

    - API 参考文档：参考 `reference/color.js` 查看完整的颜色值列表