# Quality Dashboard

**Repository Path**: dovepan_git/quality-dashboard

## Basic Information

- **Project Name**: Quality Dashboard
- **Description**: 一个基于 Next.js 16 的供应商来料质量分析数据看板，用于展示和分析供应商来料质量数据，支持个性化阈值设置、多维度数据分析和文件上传管理。
特别申明：
1.项目主要功能由扣子编程实现，TRAE完成部分BUG的修复。

- **Primary Language**: TypeScript
- **License**: MIT
- **Default Branch**: by-mysql
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-03-09
- **Last Updated**: 2026-04-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 质量仪表盘 (Quality Dashboard)

供应商来料质量分析看板，支持 Excel 数据上传、多维度可视化分析、个性化阈值配置和访问密码保护。

## 功能特性

- **数据上传**: 支持上传 Excel 文件（.xlsx/.xls），自动解析供应商来料质量数据
- **可视化分析**: 
  - 整体合格率趋势图
  - 供应商合格率排名
  - 不合格品类别分布
  - 需关注供应商列表
- **交互功能**:
  - 点击供应商查看不合格品详情
  - 自定义合格率预警阈值
  - 供应商个性化阈值配置
- **安全防护**: 访问密码保护功能

## 快速开始

### 环境要求

| 软件 | 版本 |
|------|------|
| Docker | 20.10+ |
| Docker Compose | 2.0+ |

### 本地调试

```bash
# 启动本地调试环境
pnpm dev

# 访问应用
# http://localhost:5000
```


### Docker 部署（推荐）

```bash
# 1. 克隆项目
git clone <项目地址>
cd quality-dashboard

# 2. 创建环境变量文件
cp .env.example .env
# 编辑 .env 填写数据库和存储配置

# 3. 启动服务
docker compose up -d

# 4. 访问应用
# http://localhost:5000
```

> 详细部署步骤请参考 [DEPLOYMENT.md](./DEPLOYMENT.md)


## 环境变量

### 必需配置

### 可选配置

| 变量名 | 说明 | 默认值 |
|--------|------|--------|
| `ACCESS_PASSWORD` | 访问密码 | 无 |

## 数据库初始化

首次部署需要在 Mysql 控制台执行 SQL：

```sql
-- 质量设置表
CREATE TABLE IF NOT EXISTS quality_settings (
    id INTEGER PRIMARY KEY DEFAULT 1,
    excellent_threshold REAL NOT NULL DEFAULT 100,
    qualified_threshold REAL NOT NULL DEFAULT 95,
    excellent_label TEXT NOT NULL DEFAULT '优秀',
    qualified_label TEXT NOT NULL DEFAULT '合格',
    need_improve_label TEXT NOT NULL DEFAULT '需改进',
    updated_at TIMESTAMPTZ DEFAULT NOW()
);

-- 供应商设置表
CREATE TABLE IF NOT EXISTS supplier_settings (
    id SERIAL PRIMARY KEY,
    supplier_name TEXT UNIQUE NOT NULL,
    target_rate REAL,
    level TEXT NOT NULL DEFAULT 'normal',
    custom_level_name TEXT,
    notes TEXT,
    excluded BOOLEAN NOT NULL DEFAULT false,
    updated_at TIMESTAMPTZ DEFAULT NOW()
);

-- 上传文件表
CREATE TABLE IF NOT EXISTS uploaded_files (
    id SERIAL PRIMARY KEY,
    file_name TEXT NOT NULL,
    file_size INTEGER NOT NULL,
    storage_key TEXT NOT NULL,
    uploaded_at TIMESTAMPTZ DEFAULT NOW()
);

-- 创建索引
CREATE INDEX IF NOT EXISTS idx_supplier_settings_name ON supplier_settings(supplier_name);
CREATE INDEX IF NOT EXISTS idx_uploaded_files_uploaded_at ON uploaded_files(uploaded_at);
```

## Excel 文件格式

上传的 Excel 文件需包含以下列：

| 列名 | 说明 |
|------|------|
| 供应商 | 供应商名称 |
| 物料名称 | 来料名称 |
| 批次号 | 来料批次 |
| 来料日期 | 检验日期 |
| 来料数量 | 来料总数量 |
| 合格数量 | 检验合格数量 |
| 不合格数量 | 不合格品数量 |
| 不合格原因 | 不合格原因描述 |

## 技术栈

| 类别 | 技术 |
|------|------|
| 框架 | Next.js 16 (App Router) |
| 前端 | React 19 |
| 语言 | TypeScript 5 |
| UI 组件 | shadcn/ui |
| 样式 | Tailwind CSS 4 |
| 图表 | Recharts |
| 数据库 | Supabase (PostgreSQL) |
| 文件存储 | 对象存储 (S3) |

## 项目结构

```
.
├── src/
│   ├── app/                    # Next.js App Router
│   │   ├── api/               # API 路由
│   │   ├── layout.tsx         # 根布局
│   │   └── page.tsx           # 主页面
│   ├── components/            # React 组件
│   │   ├── ui/               # shadcn/ui 组件
│   │   ├── file-upload-dialog.tsx
│   │   └── password-lock.tsx
│   └── storage/              # 存储服务
│       ├── database/         # 数据库客户端
│       └── storage-service.ts
├── Dockerfile                # Docker 构建文件
├── docker-compose.yml        # Docker Compose 配置
├── .env.example             # 环境变量示例
├── DEPLOYMENT.md            # 详细部署指南
└── package.json
```

## 常用命令

```bash
# Docker 部署
docker compose up -d          # 启动服务
docker compose down           # 停止服务
docker compose logs -f        # 查看日志
```

## 许可证

MIT