# tools_common

**Repository Path**: FullStackDamon/tools_common

## Basic Information

- **Project Name**: tools_common
- **Description**: 更新常用工具页面
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: dev
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-05-19
- **Last Updated**: 2026-06-06

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Web Tools - 开发者工具集

基于 Vue 3 + Vite + Element Plus 构建的在线开发者工具网站，提供校验计算、数据转换、编码解码等常用工具。

## 功能特性

### 用户系统
- **登录认证** - 测试账号登录，登录后显示用户头像
- **项目切换** - 登录后可切换项目

### 校验工具
- **BCC 校验** - 异或校验计算，支持 XOR 和 LRC 模式
- **CRC 校验** - CRC-16/CRC-32 校验计算

### 转换工具
- **Float ⇄ Hex** - IEEE 754 浮点数与十六进制互转
- **时间戳转换** - 时间戳与日期时间互转
- **进制互转** - 二进制、八进制、十进制、十六进制实时互转

### 编码工具
- **Base64 编码** - 文本与 Base64 双向转换
- **UTF-8 编码** - 文本与 UTF-8 编码互转
- **ASCII 编码** - 标准 ASCII 字符与编码互转
- **GBK/GB2312 编码** - 文本与 GBK 十六进制编码互转

### 硬件工具
- **电路仿真** - 在线电路仿真工具
- **芯片手册** - 芯片数据手册查询
- **电池方案选型** - 电池续航时间计算

### 设计工具
- **配色选择** - 颜色选择与转换
- **二维码生成** - 二维码生成工具
- **Markdown 编辑器** - Markdown 实时编辑预览

## 技术栈

- **前端框架**：Vue 3 (Composition API)
- **构建工具**：Vite
- **UI 组件**：Element Plus
- **路由**：Vue Router 4
- **样式**：SCSS
- **后端框架**：Fastify（可选，仅用于认证功能）

## 配置文件说明

**配置文件路径**：`../settings/common_tools/config.json`（项目外部，不入库）

**CA 证书目录**：`../settings/common_tools/ca/`（与配置文件同目录）

首次运行前需要创建配置文件：

```bash
# 创建配置目录
mkdir -p ../settings/common_tools/ca

# 创建配置文件（参考示例格式）
# 示例格式见项目内 config/config.example.json
```

配置文件格式（示例）：
```json
{
  "server": {
    "host": "<YOUR_SERVER_HOST>",
    "httpPort": "<YOUR_HTTP_PORT>",
    "httpsPort": "<YOUR_HTTPS_PORT>",
    "backendPort": "<YOUR_BACKEND_PORT>"
  },
  "domains": {
    "primary": "<YOUR_PRIMARY_DOMAIN>",
    "allowedHosts": ["<YOUR_DOMAIN_1>", "<YOUR_DOMAIN_2>"]
  },
  "ssl": {
    "enabled": true,
    "certPath": "ca/<YOUR_CERT_FILE>.pem",
    "keyPath": "ca/<YOUR_KEY_FILE>.key"
  }
}
```

## 快速开始

### 安装依赖

```bash
# 安装所有依赖
npm run install:all

# 或单独安装
cd frontend && npm install
cd backend && npm install
```

### 开发模式

```bash
# 从根目录启动前端
npm run dev

# 或进入 frontend 目录启动
cd frontend && npm run dev -- --host 0.0.0.0

# 启动后端（仅需要认证功能时）
npm run backend
```

### 生产构建

```bash
npm run frontend:build
npm run frontend:preview
```

## 项目结构

```
common_tools/
├── frontend/              # 前端代码（Vue 3 + Vite）
│   ├── src/               # 源代码
│   ├── public/            # 静态资源
│   ├── vite.config.js     # Vite 配置
│   └── package.json       # 前端依赖
│
├── backend/               # 后端代码（Fastify + SQLite）
│   ├── src/               # 源代码
│   ├── data/              # 数据库文件
│   └── package.json       # 后端依赖
│
├── config/                # 配置模块（项目内）
│   ├── config.js          # 配置读取模块
│   └── config.example.json # 配置示例
│
├── docs/                  # 项目文档
│   ├── dev_readme.md      # 开发文档
│   ├── ops_readme.md      # 运维文档
│   └ security_readme.md   # 安全文档
│   └── rules/             # 应用规则
│
├── package.json           # 项目管理脚本
├── start.sh               # 启动脚本
├── CLAUDE.md              # Claude Code 指导文档
└── README.md              # 项目说明

外部配置（不入库）：
../settings/common_tools/
├── config.json            # 实际配置文件
└── ca/                    # CA 证书目录
```

## 添加新工具

1. 在 `frontend/src/utils/toolsConfig.js` 添加配置
2. 在 `frontend/src/components/Layout/SideNav.vue` 导入图标
3. 创建组件 `frontend/src/views/tools/NewTool.vue`
4. 在 `frontend/src/router/index.js` 添加路由

## Git 工作流程

- **dev 分支**：日常开发提交
- **master 分支**：稳定版本

## 许可证

MIT