Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 rsgltzyd
|
550f8f82c7 | ||
 LingandRX
|
36b6bfd20d |
@@ -669,7 +669,7 @@ src/pages/StorageCleaner/useStorageCleaner.ts — 页面级 Hook
|
|||||||
|
|
||||||
### 9.1 功能元数据
|
### 9.1 功能元数据
|
||||||
|
|
||||||
功能名称与描述在 `config/features.tsx` 的 `FEATURES` 数组中定义：
|
功能名称与描述在 `config/featureMeta.ts` 的 `FEATURES` 数组中定义：
|
||||||
|
|
||||||
```typescript
|
```typescript
|
||||||
{
|
{
|
||||||
@@ -677,10 +677,11 @@ src/pages/StorageCleaner/useStorageCleaner.ts — 页面级 Hook
|
|||||||
label: '时间戳转换',
|
label: '时间戳转换',
|
||||||
description: '日期与时间戳互转',
|
description: '日期与时间戳互转',
|
||||||
defaultVisible: true,
|
defaultVisible: true,
|
||||||
component: TimestampPage,
|
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
|
页面组件通过 `config/pageLoaders/` 按需加载，不在 `FEATURES` 中引用。
|
||||||
|
|
||||||
Dashboard 卡片、TopBar 搜索等功能从此处读取 `label` / `description`。
|
Dashboard 卡片、TopBar 搜索等功能从此处读取 `label` / `description`。
|
||||||
|
|
||||||
### 9.2 页面与组件文案
|
### 9.2 页面与组件文案
|
||||||
|
|||||||
@@ -382,14 +382,14 @@ function loadRule(ruleId: string): void {
|
|||||||
|
|
||||||
使用 `localStorage`，键名 `testDataGenerator_rules`。API 为**命名导出函数**（见 `src/utils/ruleStorage.ts`）：
|
使用 `localStorage`，键名 `testDataGenerator_rules`。API 为**命名导出函数**（见 `src/utils/ruleStorage.ts`）：
|
||||||
|
|
||||||
| 函数 | 说明 |
|
| 函数 | 说明 |
|
||||||
| ---- | ---- |
|
| ------------------------------------------------------ | ---------------------------------- |
|
||||||
| `getAll()` / `getById()` / `getByName()` | 读取 |
|
| `getAll()` / `getById()` / `getByName()` | 读取 |
|
||||||
| `save()` / `update()` / `deleteRule()` / `duplicate()` | 写入；失败时返回 `null` 或 `false` |
|
| `save()` / `update()` / `deleteRule()` / `duplicate()` | 写入；失败时返回 `null` 或 `false` |
|
||||||
| `recordUse()` | 递增 `useCount`、更新 `lastUsedAt` |
|
| `recordUse()` | 递增 `useCount`、更新 `lastUsedAt` |
|
||||||
| `search()` / `getRecent()` | 搜索与最近使用 |
|
| `search()` / `getRecent()` | 搜索与最近使用 |
|
||||||
| `exportRules()` / `importRules()` | 导入导出 JSON 数组 |
|
| `exportRules()` / `importRules()` | 导入导出 JSON 数组 |
|
||||||
| `clear()` | 清空全部规则 |
|
| `clear()` | 清空全部规则 |
|
||||||
|
|
||||||
写入失败（如 `QuotaExceededError`）时，内部 `setAll()` 返回 `false`，`save`/`update` 返回 `null`，`deleteRule` 返回 `false`，并在控制台输出 `[ruleStorage] 保存规则失败`。调用方须检查返回值，避免误报成功。
|
写入失败（如 `QuotaExceededError`）时，内部 `setAll()` 返回 `false`，`save`/`update` 返回 `null`，`deleteRule` 返回 `false`，并在控制台输出 `[ruleStorage] 保存规则失败`。调用方须检查返回值，避免误报成功。
|
||||||
|
|
||||||
|
|||||||
@@ -1505,9 +1505,7 @@ export class DataExporter {
|
|||||||
```typescript
|
```typescript
|
||||||
// src/types/testDataGenerator.ts
|
// src/types/testDataGenerator.ts
|
||||||
|
|
||||||
type WorkerRequestMessage =
|
type WorkerRequestMessage = { type: 'start'; payload: WorkerStartPayload } | { type: 'cancel' };
|
||||||
| { type: 'start'; payload: WorkerStartPayload }
|
|
||||||
| { type: 'cancel' };
|
|
||||||
|
|
||||||
type WorkerResponseMessage =
|
type WorkerResponseMessage =
|
||||||
| { type: 'progress'; generationId: number; payload: GenerateProgress }
|
| { type: 'progress'; generationId: number; payload: GenerateProgress }
|
||||||
|
|||||||
+13
-13
@@ -4,20 +4,20 @@
|
|||||||
|
|
||||||
## 组件列表
|
## 组件列表
|
||||||
|
|
||||||
| 组件 | 用途 |
|
| 组件 | 用途 |
|
||||||
| ----------------------- | ------------------------------------------------------------------------------ |
|
| ----------------------- | ------------------------------------------------------------------------------------------------------ |
|
||||||
| `RouterContainer.tsx` | 路由容器，根据当前路由动态渲染对应页面组件，集成错误边界和骨架屏 |
|
| `RouterContainer.tsx` | 路由容器，根据当前路由动态渲染对应页面组件，集成错误边界和骨架屏 |
|
||||||
| `SwitchButtonGroup.tsx` | 通用切换按钮组，支持 `small/medium/large` 三种尺寸，用于页面子模式切换 |
|
| `SwitchButtonGroup.tsx` | 通用切换按钮组，支持 `small/medium/large` 三种尺寸，用于页面子模式切换 |
|
||||||
| `EmptyPlaceholder.tsx` | 虚线边框空状态占位，统一工具页「暂无结果」提示样式 |
|
| `EmptyPlaceholder.tsx` | 虚线边框空状态占位，统一工具页「暂无结果」提示样式 |
|
||||||
| `TextInputArea.tsx` | 增强文本输入区域，支持校验规则、工具栏操作、字符计数、清空 |
|
| `TextInputArea.tsx` | 增强文本输入区域，支持校验规则、工具栏操作、字符计数、清空 |
|
||||||
| `CopyButton.tsx` | 一键复制按钮：复制成功后 1.5s 内切换为 Check 图标并应用 `text-emerald-500`；空内容/失败时 `toast` 提示 |
|
| `CopyButton.tsx` | 一键复制按钮：复制成功后 1.5s 内切换为 Check 图标并应用 `text-emerald-500`；空内容/失败时 `toast` 提示 |
|
||||||
| `ImageUploader.tsx` | 图片上传组件，支持拖拽上传、文件选择和预览 |
|
| `ImageUploader.tsx` | 图片上传组件，支持拖拽上传、文件选择和预览 |
|
||||||
| `QrCodePreview.tsx` | 二维码预览组件，展示生成的二维码图片，提供复制和下载操作 |
|
| `QrCodePreview.tsx` | 二维码预览组件，展示生成的二维码图片，提供复制和下载操作 |
|
||||||
| `DecodeResultPaper.tsx` | Base64 解码结果展示面板，显示 MIME 类型、文件大小、文件名输入和下载按钮 |
|
| `DecodeResultPaper.tsx` | Base64 解码结果展示面板，显示 MIME 类型、文件大小、文件名输入和下载按钮 |
|
||||||
| `GlobalSnackbar.tsx` | 全局消息提示组件 + Context Provider，支持受控/Hook/全局单例三种使用方式 |
|
| `GlobalSnackbar.tsx` | 全局消息提示组件 + Context Provider，支持受控/Hook/全局单例三种使用方式 |
|
||||||
| `ErrorBoundary.tsx` | 全局错误边界（类组件），捕获子组件树 JS 错误并展示友好错误页面 |
|
| `ErrorBoundary.tsx` | 全局错误边界（类组件），捕获子组件树 JS 错误并展示友好错误页面 |
|
||||||
| `PageErrorBoundary.tsx` | 页面级错误边界，适配 shadcn 暗黑模式，支持 `resetKey` 自动恢复 |
|
| `PageErrorBoundary.tsx` | 页面级错误边界，适配 shadcn 暗黑模式，支持 `resetKey` 自动恢复 |
|
||||||
| `PageSkeleton.tsx` | 页面骨架屏，提供 `dashboard` 和 `tool` 两种变体，用于 Suspense fallback |
|
| `PageSkeleton.tsx` | 页面骨架屏，提供 `dashboard` 和 `tool` 两种变体，用于 Suspense fallback |
|
||||||
|
|
||||||
## 使用约定
|
## 使用约定
|
||||||
|
|
||||||
|
|||||||
+8
-8
@@ -7,8 +7,8 @@
|
|||||||
| 文件 | 用途 |
|
| 文件 | 用途 |
|
||||||
| ------------------------ | --------------------------------------------------------------------------------------------------- |
|
| ------------------------ | --------------------------------------------------------------------------------------------------- |
|
||||||
| `chromeStorage.ts` | Chrome Storage API 封装：类型安全的 `StorageUtils` 类，提供 `get/set/remove` 方法 |
|
| `chromeStorage.ts` | Chrome Storage API 封装：类型安全的 `StorageUtils` 类，提供 `get/set/remove` 方法 |
|
||||||
| `syncSnapshot.ts` | 通用 `localStorage` 快照读取（`snapshot/{key}`），用于 Router 与 `useStorageState` 首屏防闪烁 |
|
| `syncSnapshot.ts` | 通用 `localStorage` 快照读取（`snapshot/{key}`），用于 Router 与 `useStorageState` 首屏防闪烁 |
|
||||||
| `themeSnapshot.ts` | 主题专用快照读写与 `document.documentElement` class 切换 |
|
| `themeSnapshot.ts` | 主题专用快照读写与 `document.documentElement` class 切换 |
|
||||||
| `restrictedUrls.ts` | 受限 URL 检测（`chrome://`、`about:` 等），供 Storage Cleaner 等模块复用 |
|
| `restrictedUrls.ts` | 受限 URL 检测（`chrome://`、`about:` 等），供 Storage Cleaner 等模块复用 |
|
||||||
| `chromeTabs.ts` | Chrome Tabs API 封装：获取活动标签页、获取域名、在新标签页打开扩展页面 |
|
| `chromeTabs.ts` | Chrome Tabs API 封装：获取活动标签页、获取域名、在新标签页打开扩展页面 |
|
||||||
| `clipboard.ts` | 剪贴板操作：`copyTextToClipboard`（文本）、`copyImageToClipboard`（图片） |
|
| `clipboard.ts` | 剪贴板操作：`copyTextToClipboard`（文本）、`copyImageToClipboard`（图片） |
|
||||||
@@ -42,12 +42,12 @@
|
|||||||
|
|
||||||
写入经内部 `setAll()` 完成；`localStorage.setItem` 抛错（如配额超限）时返回 `false`，并 `console.error`，**不会部分提交**：
|
写入经内部 `setAll()` 完成；`localStorage.setItem` 抛错（如配额超限）时返回 `false`，并 `console.error`，**不会部分提交**：
|
||||||
|
|
||||||
| 方法 | 写入失败返回值 | 常见失败原因 |
|
| 方法 | 写入失败返回值 | 常见失败原因 |
|
||||||
| ---- | -------------- | ------------ |
|
| -------------- | ---------------------------- | ------------------------------------------------------ |
|
||||||
| `save()` | `null` | 达上限、规则不存在（更新时）、`setItem` 异常 |
|
| `save()` | `null` | 达上限、规则不存在（更新时）、`setItem` 异常 |
|
||||||
| `update()` | `null` | 规则不存在、`setItem` 异常 |
|
| `update()` | `null` | 规则不存在、`setItem` 异常 |
|
||||||
| `deleteRule()` | `false` | 规则不存在、`setItem` 异常 |
|
| `deleteRule()` | `false` | 规则不存在、`setItem` 异常 |
|
||||||
| `duplicate()` | 仍可能返回对象但数据未持久化 | 见源码：`duplicate` 未检查 `setAll` 返回值（已知缺口） |
|
| `duplicate()` | 仍可能返回对象但数据未持久化 | 见源码：`duplicate` 未检查 `setAll` 返回值（已知缺口） |
|
||||||
|
|
||||||
调用方应检查返回值后再展示成功 Toast。页面层参考 `FieldList.tsx`：`save`/`update` 返回非空才提示「规则已保存/已更新」。
|
调用方应检查返回值后再展示成功 Toast。页面层参考 `FieldList.tsx`：`save`/`update` 返回非空才提示「规则已保存/已更新」。
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user