Files

T

yeuimu a903dd4903 feat(admin): redesign GoodsView with dual-tree UX, filter bar, inline CRUD

- Two-line good nodes with country + tag chips, hover tooltip
- Resizable dual-tree with fixed-height panels (no node overlap)
- Filter bar: search, country filter, tag filter (multi-select with rename)
- Mode switch (品类/国家) pushed to right via spacer
- Inline create country/tag in edit & config modals via quick-create buttons
- Right tree node height auto-fix for locate highlight
- Filter dropdown styles in global scope for teleported popper
- Backend: multi-tag (GoodTag junction), goodImage column, origin goods tree API
- Admin response interceptor unwraps {data, success} envelope
- Simplified sidebar to single 商品管理 entry with tabs
- SyncView simplified to product sync only

2026-06-22 01:47:20 +08:00

3.9 KiB

Raw Blame History

Goods Management Redesign

Date: 2026-06-21

Problem

Origin Good name not displayed: GoodsView doesn't show the origin product name/image/price
Single tag per good: Current schema only allows one tag per good via goods.tag_id FK
Easy to miss unconfigured origin products: Flat paginated table with no visibility into which origin products have been configured vs not

Solution

1. Multi-Tag Support (GoodTag Junction Table)

Schema change:

New good_tags junction table: (good_id, tag_id) composite PK
Migrate existing goods.tag_id data into good_tags
Set goods.tag_id to nullable (will be dropped in a future migration)

Backend:

CreateGoodDto: tagIds: number[] (replaces tagId)
UpdateGoodDto: tagIds?: number[] (replaces tagId)
BatchCreateGoodDto: tagIds?: number[] (replaces tagId)
QueryGoodDto: tagId filter queries tags.some instead of direct FK
GoodsService.create/update: manage good_tags records in transaction
GOOD_INCLUDE: include tags: { include: { tag: true } }

2. Origin Goods Tree API

New endpoint: GET /origin-goods/tree

Returns origin goods grouped by SDS category, with configuration status:

[
  {
    "sdsCategoryId": "4185",
    "categoryName": "（包邮）180g纯棉T恤-单面印花",
    "originGoods": [
      {
        "id": "123",
        "goodName": "产品A",
        "goodImage": "https://...",
        "goodPrice": "12.50",
        "sdsGoodId": "p-123",
        "configuredCount": 2,
        "configuredCountries": ["美国", "英国"]
      }
    ]
  }
]

Origin goods without sdsCategoryId are grouped under "未分类".

3. Admin UI: Dual Tree Layout

┌──────────────────────────────────────────────────────────┐
│  [搜索原产品]                          [210/439 已配置]   │
├───────────────────┬─────────────────────────────────────┤
│  首页分类树        │  原产品分类树                        │
│                   │                                     │
│  ▼ 美国            │  ▼ （包邮）180g纯棉T恤               │
│    ▼ T恤          │    ✓ 产品A [美国,英国]               │
│    ▼ 卫衣         │    ✗ 产品B [未配置]                  │
│  ▼ 英国            │  ▼ 未分类                           │
│  ▼ 韩国            │    ✗ 产品C [未配置]                  │
├───────────────────┴─────────────────────────────────────┤
│  详情/操作区域                                           │
│  - 选左侧分类: 该分类下所有 goods 表格                    │
│  - 选右侧原产品: 该原产品的配置详情 + 快捷配置按钮         │
│  - 多标签选择 (el-select multiple)                       │
└──────────────────────────────────────────────────────────┘

Key interactions:

Left tree click: filter goods by selected category
Right tree click: show origin good detail + all its goods configs
Right tree badges: ✓ configured / ✗ unconfigured
Quick configure: select country+category+tags, click origin goods to batch create
Statistics bar: configured/total count

4. Data Migration

-- Step 1: Create good_tags table
-- Step 2: Copy existing tag_id data
INSERT INTO good_tags (good_id, tag_id, created_at)
  SELECT good_id, tag_id, NOW() FROM goods WHERE tag_id IS NOT NULL;
-- Step 3: Good.tag_id becomes nullable (already nullable)

3.9 KiB Raw Blame History