# 27csms

**Repository Path**: violet27chen/27csms

## Basic Information

- **Project Name**: 27csms
- **Description**: 长租号码管理工具
- **Primary Language**: TypeScript
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-06-07
- **Last Updated**: 2026-06-07

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 27CSMS — Hero SMS 长租号码管理工具

基于 [Hero SMS](https://hero-sms.com) API 的个人长租号码管理面板，使用 Next.js + TailwindCSS 构建。

## 功能

- 浏览可用服务（Telegram、WhatsApp、Google 等）及库存
- 按国家、租期筛选，支持国旗图片展示
- 一键租用号码，号码格式化显示（区号 + 号码）
- 活跃租号管理：查看短信、刷新（每 5 秒自动轮询）、重新激活、取消
- 激活历史：按日期范围/号码搜索，支持重新激活

## 快速开始

```bash
# 安装依赖
npm install

# 启动开发服务器
npx next dev
```

浏览器打开 [http://localhost:3000](http://localhost:3000)，首次使用需填写 Hero SMS API Key。

## 配置

无需 `.env` 文件。API Key 存储在浏览器 `localStorage`（key: `27csms_api_key`），通过页面右上角设置入口填写。

## 技术栈

- **框架**：Next.js 14 App Router
- **样式**：TailwindCSS
- **图标**：Lucide React
- **服务图标**：Google Favicon API
- **国旗图片**：flagcdn.com

## 目录结构

```
app/
  api/rent/          # API 路由（Hero SMS 代理）
  page.tsx           # 主页面
components/
  ActiveRentals.tsx  # 活跃租号列表
  RentalHistory.tsx  # 激活历史弹窗
  ServiceGrid.tsx    # 服务卡片网格
  FilterPanel.tsx    # 国家/租期筛选
  RentModal.tsx      # 租号弹窗
  CountrySelect.tsx  # 带国旗的国家选择器
lib/
  constants.ts       # 服务名称/颜色映射
  service-icons.ts   # 服务图标 URL
  country-flags.ts   # 国旗图片 + 号码格式化
  hero-fetch.ts      # Hero SMS API 请求封装
```