# 📋 库存动态可视化Tab优化更新

## ✅ 更新内容

### 1. ✅ 去掉库存结构化建议
**位置**：资产管理 → 可视化报表 → 库存动态可视化 Tab

**删除内容**：
- 库存结构优化建议卡片（整个模块）
  - 补货建议
    - 紧急补货：地膜
    - 建议补货：农药
  - 优化建议
    - 库存过高：种子
    - 周转优化

**原因**：
- 该建议与"全局概览核心指标"tab中的"智能优化建议"功能重复
- 简化页面，聚焦核心库存动态展示
- 避免功能冗余，提升用户体验

---

### 2. ✅ 开发呆滞库存预警查看明细弹窗

已开发3个详细的呆滞库存预警明细弹窗：

#### 1️⃣ 超180天未动销物资明细弹窗
- **触发按钮**：呆滞库存预警 → 超180天未动销 → "查看明细"
- **功能**：展示超180天未动销的物资详情和处理建议

#### 2️⃣ 91-180天缓慢周转物资明细弹窗
- **触发按钮**：呆滞库存预警 → 91-180天缓慢周转 → "查看明细"
- **功能**：展示周转缓慢物资的促销消化建议

#### 3️⃣ 健康周转物资明细弹窗
- **触发按钮**：呆滞库存预警 → 健康周转 → "查看明细"
- **功能**：展示周转良好物资的保持策略

---

## 🎯 呆滞库存预警明细弹窗详解

### 1️⃣ 超180天未动销物资明细弹窗

#### 功能结构
```
超180天未动销物资明细
├── 关键统计信息（4个卡片）
│   ├── 呆滞物资数量：8项
│   ├── 占用资金：¥7.8万
│   ├── 最长库龄：245天
│   └── 占总库存比：27.3%
├── 呆滞物资清单（表格，8项）
│   ├── 过期种子-玉米A型（245天，极高风险，报废处理）
│   ├── 老旧农药-除草剂B（228天，极高风险，安全销毁）
│   ├── 淘汰地膜-薄型（215天，高风险，折价处理）
│   ├── 滞销有机肥-特殊配方（198天，高风险，促销清理）
│   ├── 库存积压复合肥（186天，中风险，内部消化）
│   ├── 老款喷灌配件（192天，中风险，捆绑销售）
│   ├── 过时农具零件（203天，中风险，折价清仓）
│   └── 淘汰灌溉管件（188天，中风险，捐赠处理）
├── 紧急处理建议（4条）
└── 操作按钮
    ├── 关闭
    └── 批量处理
```

#### 表格字段
- **序号**：物资编号
- **物资名称**：物资完整名称
- **库龄(天)**：存放天数（红色徽章）
- **库存数量**：当前数量
- **单位**：计量单位
- **库存价值**：占用资金金额
- **风险等级**：极高/高/中（徽章颜色区分）
- **建议处理**：具体处理方式
- **操作**：处理按钮

#### 处理建议
- **报废处理**：过期种子和老旧农药必须尽快报废和安全销毁
- **折价清理**：地膜、有机肥等通过7折促销清理，预计回收¥4.2万
- **捐赠处理**：老款配件和管件可捐赠周边小型农场
- **预期效益**：释放仓储空间27.3%，节约仓储成本¥0.8万/月

---

### 2️⃣ 91-180天缓慢周转物资明细弹窗

#### 功能结构
```
91-180天缓慢周转物资明细
├── 关键统计信息（4个卡片）
│   ├── 缓周转物资：12项
│   ├── 占用资金：¥15.6万
│   ├── 平均库龄：135天
│   └── 建议促销力度：8-9折
├── 缓周转物资清单（表格，12项）
│   ├── 复合肥-非主流配方（165天，9折，回收¥2.43万）
│   ├── 农药-低效型（152天，8.5折，回收¥1.84万）
│   ├── 地膜-厚型（148天，9折，回收¥2.39万）
│   ├── 种子-小众品种（138天，8折，回收¥1.58万）
│   ├── 有机肥-散装（132天，9折，回收¥2.81万）
│   ├── 灌溉管-老款（128天，8.5折，回收¥1.15万）
│   ├── 喷雾器配件（124天，8折，回收¥0.82万）
│   ├── 农具-传统款（118天，8折，回收¥0.72万）
│   ├── 温室薄膜（112天，9折，回收¥1.51万）
│   ├── 肥料添加剂（106天，8.5折，回收¥0.82万）
│   ├── 杀菌剂-普通型（98天，9折，回收¥1.03万）
│   └── 育苗基质（92天，9折，回收¥1.26万）
├── 促销消化建议（4条）
└── 操作按钮
    ├── 关闭
    └── 启动促销
```

#### 表格字段
- **序号**：物资编号
- **物资名称**：物资完整名称
- **库龄(天)**：存放天数（黄色徽章）
- **库存数量**：当前数量
- **单位**：计量单位
- **库存价值**：原价金额
- **建议折扣**：促销折扣比例（蓝色徽章）
- **预计回收**：促销后回收金额（绿色）
- **操作**：促销按钮

#### 促销建议
- **阶梯促销**：8-9折阶梯促销，预计2-3周内清理60-70%库存
- **捆绑销售**：与畅销品捆绑销售，提高整体销售速度
- **内部消化**：优先推荐给自有农场和合作伙伴
- **预期回收**：预计回收资金¥13.5-14.2万，回收率87-91%

---

### 3️⃣ 健康周转物资明细弹窗

#### 功能结构
```
健康周转物资明细
├── 关键统计信息（4个卡片）
│   ├── 健康周转物资：73项
│   ├── 库存总值：¥189.5万
│   ├── 平均库龄：45天
│   └── 月均周转率：5.8次
├── 健康周转物资清单（表格，显示Top 15）
│   ├── 复合肥(N-P-K 15-15-15)（18天，8.5次/月，优秀）
│   ├── 有机肥(腐熟鸡粪)（24天，7.2次/月，优秀）
│   ├── 尿素(N 46%)（28天，6.8次/月，良好）
│   ├── 杀虫剂(吡虫啉)（32天，5.5次/月，良好）
│   ├── 地膜(0.01mm)（38天，4.7次/月，良好）
│   ├── 玉米种子-优质（22天，7.8次/月，优秀）
│   ├── 除草剂-高效型（35天，5.2次/月，良好）
│   ├── 滴灌管-优质（42天，4.3次/月，良好）
│   ├── 农膜-标准型（48天，3.8次/月，正常）
│   ├── 喷雾器-电动（52天，3.5次/月，正常）
│   ├── 水稻种子（30天，6.2次/月，良好）
│   ├── 钾肥(K2O 60%)（26天，6.8次/月，良好）
│   ├── 杀菌剂-广谱型（44天，4.1次/月，正常）
│   ├── 温室覆膜（36天，5.1次/月，良好）
│   └── 育苗盘-标准（40天，4.5次/月，正常）
├── 保持策略建议（4条）
└── 操作按钮
    ├── 关闭
    └── 导出报表
```

#### 表格字段
- **序号**：物资编号
- **物资名称**：物资完整名称
- **库龄(天)**：存放天数（绿色徽章）
- **库存数量**：当前数量
- **单位**：计量单位
- **库存价值**：库存金额
- **周转率**：月均周转次数（徽章颜色区分：绿≥6，蓝≥4，灰<4）
- **状态**：优秀/良好/正常（徽章颜色区分）

#### 保持策略
- **维持库存**：周转健康，保持当前库存水平和补货策略
- **优化采购**：周转率≥6次/月的物资可适当增加备货量
- **监控波动**：持续监控周转率变化，及时调整库存策略
- **资金效率**：健康周转物资占总库存66.3%，资金利用效率良好

---

## 🎨 视觉设计

### 弹窗通用设计规范

#### 尺寸和布局
- **宽度**：max-w-4xl（最大4xl宽度，比之前的弹窗更宽，适合表格展示）
- **高度**：max-h-[80vh]（最大80%视口高度）
- **滚动**：overflow-y-auto（内容超出时可滚动）

#### 颜色方案
```tsx
// 超180天未动销 - 红色主题
标题图标：text-red-600
关键卡片：bg-red-50 border-red-200
建议区域：bg-red-50 border-red-200
主要按钮：bg-red-600 hover:bg-red-700

// 91-180天缓慢周转 - 黄色主题
标题图标：text-yellow-600
关键卡片：bg-yellow-50 border-yellow-200
建议区域：bg-yellow-50 border-yellow-200
主要按钮：bg-yellow-600 hover:bg-yellow-700

// 健康周转 - 绿色主题
标题图标：text-green-600
关键卡片：bg-green-50 border-green-200
建议区域：bg-green-50 border-green-200
主要按钮：bg-green-600 hover:bg-green-700
```

#### 徽章（Badge）样式

##### 超180天未动销
- **极高风险**：`variant="destructive"`（红色）
- **高风险**：`bg-orange-100 text-orange-700 border-orange-300`（橙色）
- **中风险**：`bg-yellow-100 text-yellow-700 border-yellow-300`（黄色）

##### 91-180天缓慢周转
- **库龄**：`bg-yellow-50 text-yellow-700 border-yellow-300`（黄色）
- **建议折扣**：`bg-blue-100 text-blue-700 border-blue-300`（蓝色）

##### 健康周转
- **库龄**：`bg-green-50 text-green-700 border-green-300`（绿色）
- **周转率≥6次/月**：`bg-green-100 text-green-700`（绿色）
- **周转率≥4次/月**：`bg-blue-100 text-blue-700`（蓝色）
- **周转率<4次/月**：`bg-gray-100 text-gray-700`（灰色）
- **优秀状态**：`bg-green-100 text-green-700 border-green-300`
- **良好状态**：`bg-blue-100 text-blue-700 border-blue-300`
- **正常状态**：`bg-gray-100 text-gray-700 border-gray-300`

#### 表格样式
```tsx
// 表格头部
<thead>
  <tr className="border-b">
    <th className="text-left py-2 px-3 text-sm font-medium">...</th>
  </tr>
</thead>

// 表格行
<tbody>
  <tr className="border-b hover:bg-gray-50">
    <td className="py-3 px-3 text-sm">...</td>
  </tr>
</tbody>
```

---

## 🚀 测试指南

### 访问路径
```
登录系统
  ↓
点击顶部「资产管理」
  ↓
点击左侧「可视化报表」
  ↓
点击「库存动态可视化」Tab
  ↓
向下滚动到「呆滞库存预警」区域
```

### 测试步骤

#### ✅ 测试1：确认库存结构优化建议已删除
1. 进入"库存动态可视化"Tab
2. ✅ 不应该看到"库存结构优化建议"卡片
3. ✅ 不应该有"补货建议"和"优化建议"内容
4. ✅ 页面应该更简洁

#### ✅ 测试2：超180天未动销物资明细弹窗
1. 找到"呆滞库存预警"区域
2. 点击第一个卡片"超180天未动销"的"查看明细"按钮
3. ✅ 弹窗应该打开，标题为"超180天未动销物资明细"
4. ✅ 显示4个关键统计卡片：8项、¥7.8万、245天、27.3%
5. ✅ 显示8行物资清单表格
6. ✅ 每行显示：序号、物资名称、库龄(天)、库存数量、单位、库存价值、风险等级、建议处理、操作
7. ✅ 风险等级徽章：极高(红色)、高(橙色)、中(黄色)
8. ✅ 显示"紧急处理建议"卡片（红色背景）
9. ✅ 底部显示2个按钮："关闭"和"批量处理"
10. 点击"关闭"或右上角X，弹窗关闭

#### ✅ 测试3：91-180天缓慢周转物资明细弹窗
1. 点击第二个卡片"91-180天缓慢周转"的"查看明细"按钮
2. ✅ 弹窗应该打开，标题为"91-180天缓慢周转物资明细"
3. ✅ 显示4个关键统计卡片：12项、¥15.6万、135天、8-9折
4. ✅ 显示12行物资清单表格
5. ✅ 每行显示：序号、物资名称、库龄(天)、库存数量、单位、库存价值、建议折扣、预计回收、操作
6. ✅ 库龄徽章为黄色
7. ✅ 建议折扣徽章为蓝色
8. ✅ 预计回收金额显示为绿色
9. ✅ 显示"促销消化建议"卡片（黄色背景）
10. ✅ 底部显示2个按钮："关闭"和"启动促销"

#### ✅ 测试4：健康周转物资明细弹窗
1. 点击第三个卡片"健康周转"的"查看明细"按钮
2. ✅ 弹窗应该打开，标题为"健康周转物资明细"
3. ✅ 显示4个关键统计卡片：73项、¥189.5万、45天、5.8次
4. ✅ 显示15行物资清单表格（Top 15）
5. ✅ 每行显示：序号、物资名称、库龄(天)、库存数量、单位、库存价值、周转率、状态
6. ✅ 库龄徽章为绿色
7. ✅ 周转率徽章颜色区分：≥6次(绿色)、≥4次(蓝色)、<4次(灰色)
8. ✅ 状态徽章：优秀(绿色)、良好(蓝色)、正常(灰色)
9. ✅ 表格底部显示"共73项健康周转物资，仅展示前15项"
10. ✅ 显示"保持策略建议"卡片（绿色背景）
11. ✅ 底部显示2个按钮："关闭"和"导出报表"

#### ✅ 测试5：弹窗通用功能
1. 测试每个弹窗的滚动功能
   - ✅ 表格内容超出时应该可以滚动
   - ✅ 标题栏应该保持固定
2. 测试弹窗关闭方式
   - ✅ 点击右上角X可以关闭
   - ✅ 点击"关闭"可以关闭
   - ✅ 点击弹窗外部区域可以关闭
3. 测试响应式布局
   - ✅ 在不同屏幕尺寸下弹窗应该自适应
   - ✅ 表格应该支持横向滚动（在小屏幕上）

---

## 💡 功能亮点

### 1. 数据可视化
- **表格展示**：清晰的表格布局，完整展示物资详情
- **颜色编码**：红色（严重）、黄色（警告）、绿色（正常）、蓝色（建议）
- **徽章标识**：风险等级、周转率、状态、折扣等

### 2. 分类管理
- **三个维度**：超180天、91-180天、健康周转
- **不同策略**：报废/促销/保持
- **精准建议**：每个类别都有针对性的处理建议

### 3. 详细信息
- **完整数据**：每个物资的库龄、数量、价值、风险等级
- **处理方案**：具体的处理方式和预期效益
- **操作引导**：明确的操作按钮

### 4. 用户体验
- **信息层级清晰**：关键指标 → 详细表格 → 处理建议
- **可滚动表格**：支持大量数据展示
- **响应式设计**：适配不同屏幕尺寸

---

## 🔧 技术实现

### Dialog状态管理
```tsx
// 在AssetReport组件中添加状态
const [showIdleStockDetail180Dialog, setShowIdleStockDetail180Dialog] = useState(false);
const [showIdleStockDetail90Dialog, setShowIdleStockDetail90Dialog] = useState(false);
const [showIdleStockDetailHealthyDialog, setShowIdleStockDetailHealthyDialog] = useState(false);
```

### 按钮触发
```tsx
// 超180天未动销
<Button onClick={() => setShowIdleStockDetail180Dialog(true)}>
  查看明细
</Button>

// 91-180天缓慢周转
<Button onClick={() => setShowIdleStockDetail90Dialog(true)}>
  查看明细
</Button>

// 健康周转
<Button onClick={() => setShowIdleStockDetailHealthyDialog(true)}>
  查看明细
</Button>
```

### Dialog组件
```tsx
<Dialog open={showIdleStockDetail180Dialog} onOpenChange={setShowIdleStockDetail180Dialog}>
  <DialogContent className="max-w-4xl max-h-[80vh] overflow-y-auto">
    <DialogHeader>
      <DialogTitle>...</DialogTitle>
      <DialogDescription>...</DialogDescription>
    </DialogHeader>
    {/* 弹窗内容：统计卡片 + 表格 + 建议 */}
  </DialogContent>
</Dialog>
```

---

## 📝 数据结构

### 超180天未动销数据
```typescript
interface IdleStock180Item {
  id: number;              // 序号
  name: string;            // 物资名称
  days: number;            // 库龄天数
  quantity: number;        // 库存数量
  unit: string;            // 单位
  value: number;           // 库存价值
  risk: '极高' | '高' | '中'; // 风险等级
  suggestion: string;      // 建议处理方式
}
```

### 91-180天缓慢周转数据
```typescript
interface IdleStock90Item {
  id: number;              // 序号
  name: string;            // 物资名称
  days: number;            // 库龄天数
  quantity: number;        // 库存数量
  unit: string;            // 单位
  value: number;           // 库存价值（原价）
  discount: string;        // 建议折扣
  recovery: number;        // 预计回收金额
}
```

### 健康周转数据
```typescript
interface HealthyStockItem {
  id: number;              // 序号
  name: string;            // 物资名称
  days: number;            // 库龄天数
  quantity: number;        // 库存数量
  unit: string;            // 单位
  value: number;           // 库存价值
  turnover: number;        // 周转率(次/月)
  status: '优秀' | '良好' | '正常'; // 状态
}
```

---

## 🎉 更新总结

### ✅ 已完成功能

1. **去掉库存结构优化建议**
   - 删除了整个"库存结构优化建议"卡片
   - 简化页面布局，聚焦核心库存动态展示
   - 避免与全局概览tab功能重复

2. **超180天未动销物资明细弹窗**
   - 完整的8项物资清单表格
   - 风险等级分类（极高/高/中）
   - 紧急处理建议（4条）
   - 批量处理功能按钮

3. **91-180天缓慢周转物资明细弹窗**
   - 完整的12项物资清单表格
   - 建议折扣和预计回收金额
   - 促销消化建议（4条）
   - 启动促销功能按钮

4. **健康周转物资明细弹窗**
   - Top 15物资清单表格（共73项）
   - 周转率和状态展示
   - 保持策略建议（4条）
   - 导出报表功能按钮

### ✅ 技术实现
- 使用ShadCN Dialog组件
- 宽屏布局（max-w-4xl）适合表格展示
- 可滚动内容（max-h-[80vh]）
- 状态管理（useState）
- 完整的表格样式
- 统一的视觉设计规范

### ✅ 用户体验
- 信息层级清晰（统计→表格→建议）
- 数据可视化（表格、徽章、颜色编码）
- 操作引导明确（处理建议、操作按钮）
- 响应式设计支持

---

## 📚 相关文档

- **可视化报表系统**：完整的3个Tab功能
- **呆滞库存预警**：3个详细明细弹窗
- **库存管理**：与库存动态监控联动
- **智能优化建议**：全局概览tab中的智能建议功能

---

## 🔍 页面结构（更新后）

```
库存动态可视化 Tab
├── 功能说明卡片
├── 库存水位监控
├── 品类分布与库龄分析
│   ├── 品类价值分布（饼图）
│   └── 库龄热力分析（柱状图）
├── 呆滞库存预警 ✨ 已增强
│   ├── 超180天未动销（8项）→ 查看明细弹窗 ✅
│   ├── 91-180天缓慢周转（12项）→ 查看明细弹窗 ✅
│   └── 健康周转（73项）→ 查看明细弹窗 ✅
├── 畅销品与滞销品对比
│   ├── 畅销品Top5
│   └── 滞销品Top5
└── 库存动态趋势（6个月折线图）

❌ 已删除：库存结构优化建议
```

---

**更新日期**：2025年1月22日  
**版本**：v2.6  
**状态**：✅ 已完成  
**影响范围**：资产管理 → 可视化报表 → 库存动态可视化 → 呆滞库存预警
