From b698e3b2147a46fd4adb168aea5df892236cc0e0 Mon Sep 17 00:00:00 2001
From: wanshenmean <cathay_xy@163.com>
Date: 星期一, 30 三月 2026 12:06:56 +0800
Subject: [PATCH] docs: 添加库存3D查看器设计文档
---
Code/WMS/docs/superpowers/specs/2026-03-30-stock-chat-3d-design.md | 233 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 233 insertions(+), 0 deletions(-)
diff --git a/Code/WMS/docs/superpowers/specs/2026-03-30-stock-chat-3d-design.md b/Code/WMS/docs/superpowers/specs/2026-03-30-stock-chat-3d-design.md
new file mode 100644
index 0000000..b70fc23
--- /dev/null
+++ b/Code/WMS/docs/superpowers/specs/2026-03-30-stock-chat-3d-design.md
@@ -0,0 +1,233 @@
+# 搴撳瓨3D鏌ョ湅鍣� (stockChat) 璁捐鏂囨。
+
+## 1. 姒傝堪
+
+- **鍔熻兘鍚嶇О**锛氬簱瀛�3D浠撳簱鏌ョ湅鍣� (stockChat)
+- **鏂囦欢璺緞**锛歚WIDESEA_WMSClient/src/views/stock/stockChat.vue`
+- **鏍稿績鍔熻兘**锛氫娇鐢� Three.js + WebGL 瀹炵幇浠撳簱3D鍙鍖栵紝鐢ㄦ埛鍙湪3D鍦烘櫙涓贰瑙嗕粨搴撱�佹煡鐪嬭揣浣嶇姸鎬併�佺偣鍑昏揣浣嶆煡鐪嬪簱瀛樿鎯�
+- **鐩爣鐢ㄦ埛**锛氫粨搴撶鐞嗗憳銆佽皟搴︿汉鍛樸�佽川妫�浜哄憳
+
+## 2. 鎶�鏈�夊瀷
+
+| 鎶�鏈� | 閫夊瀷 | 璇存槑 |
+|------|------|------|
+| 3D寮曟搸 | Three.js | WebGL 涓绘祦搴擄紝Vue 3 鍙嬪ソ |
+| 娓叉煋绛栫暐 | InstancedMesh | 鎵归噺娓叉煋澶ч噺璐т綅锛屽崟娆� drawcall |
+| 鐘舵�佺鐞� | Vue 3 Composition API | `ref/reactive` |
+| UI缁勪欢 | Element Plus | 涓庨」鐩幇鏈夋妧鏈爤涓�鑷� |
+| 瀹炴椂閫氫俊 | SignalR | 涓庡悗绔� WebSocket 閰嶅悎瀹炵幇搴撳瓨鍔ㄦ�佹洿鏂� |
+
+## 3. 鍔熻兘闇�姹�
+
+### 3.1 鏍稿績鍔熻兘
+
+1. **浠撳簱3D甯冨眬灞曠ず**
+ - 鍏ㄩ儴璐т綅鍧囨覆鏌擄紝鎸夌姸鎬佺潃鑹�
+ - 璐ф灦寮忔帓鍒楋紝鍖呭惈宸烽亾
+ - 鍦伴潰缃戞牸鑳屾櫙
+
+2. **澶氫粨搴� Tab 鍒囨崲**
+ - Element Plus Tabs 缁勪欢
+ - 姣忎釜浠撳簱鐙珛鍔犺浇鏁版嵁
+ - Tab 鍒囨崲鏃堕噸缃�3D鍦烘櫙
+
+3. **璐т綅鐐瑰嚮璇︽儏寮圭獥**
+ - 鍏ㄥ睆 Dialog 灞曠ず
+ - 鏄剧ず锛氳揣浣嶄俊鎭�佸簱瀛樼姸鎬併�佹墭鐩樼紪鍙枫�佺墿鏂欐槑缁嗗垪琛�
+ - 鏀寔鏌ョ湅鎵规銆佷繚璐ㄦ湡棰勮
+
+4. **3D鍦烘櫙浜や簰**
+ - 榧犳爣鏃嬭浆锛圤rbitControls锛�
+ - 婊氳疆缂╂斁
+ - 涓敭骞崇Щ
+ - 鐐瑰嚮璐т綅楂樹寒 + 鐩告満鑱氱劍
+
+5. **瀹炴椂搴撳瓨鐘舵�佹洿鏂�**
+ - SignalR 鐩戝惉搴撳瓨鍙樺寲
+ - 璐т綅棰滆壊鍔ㄦ�佹洿鏂�
+
+6. **绛涢�夎繃婊�**
+ - 鎸夌墿鏂欑被鍨�/鎵规/搴撳瓨鐘舵�佽繃婊�
+ - 楂樹寒鏄剧ず鍖归厤璐т綅
+
+7. **鐘舵�佸浘渚�**
+ - 鍙充笂瑙�/搴曢儴棰滆壊鍥句緥
+ - 璇存槑姣忕棰滆壊浠ｈ〃鐨勮揣浣嶇姸鎬�
+
+### 3.2 璐т綅鐘舵�侀鑹茬紪鐮�
+
+| 鐘舵�� | 棰滆壊 | Hex |
+|------|------|-----|
+| 绌鸿揣浣� | 鏆楃伆 | `#4a4a4a` |
+| 鏈夊簱瀛� | 钃濊壊 | `#409EFF` |
+| 搴撳瓨绱у紶 (<10%) | 姗欒壊 | `#E6A23C` |
+| 宸叉弧 | 缁胯壊 | `#67C23A` |
+| 閿佸畾/鍐荤粨 | 绾㈣壊 | `#F56C6C` |
+| 绂佺敤 | 娣辩伆 | `#2d2d2d` |
+
+## 4. 鍚庣 API
+
+### 4.1 鏂板鎺ュ彛
+
+```
+GET /api/StockInfo/Get3DLayout?warehouseId={id}
+```
+
+**鍝嶅簲缁撴瀯**锛�
+```json
+{
+ "status": true,
+ "data": {
+ "warehouseId": 1,
+ "warehouseName": "涓讳粨搴�",
+ "maxRow": 10,
+ "maxColumn": 20,
+ "maxLayer": 5,
+ "locations": [
+ {
+ "locationId": 1,
+ "locationCode": "A-01-02-03",
+ "row": 1,
+ "column": 2,
+ "layer": 3,
+ "locationStatus": 0,
+ "stockStatus": 2,
+ "stockQuantity": 50,
+ "maxCapacity": 100,
+ "palletCode": "PLT-001",
+ "materielCode": "M001",
+ "materielName": "鐗╂枡A",
+ "batchNo": "B20260301"
+ }
+ ]
+ }
+}
+```
+
+**璇存槑**锛�
+- `locationStatus`: 0=绌�, 1=鍗犵敤, 2=閿佸畾, 3=绂佺敤
+- `stockStatus`: 0=鏃犺揣, 1=鏈夎揣, 2=搴撳瓨绱у紶, 3=宸叉弧
+- `maxCapacity`: 璐т綅鏈�澶у閲忥紙鐢ㄤ簬璁＄畻濉厖鐜囷級
+
+### 4.2 SignalR 瀹炴椂鎺ㄩ��
+
+**Hub 璺緞**锛歚/stockHub`
+
+**鎺ㄩ�佷簨浠�**锛�
+```javascript
+// 搴撳瓨鍙樺寲浜嬩欢
+stockUpdated: { locationId, warehouseId, stockQuantity, stockStatus }
+```
+
+## 5. 鍓嶇鏂囦欢缁撴瀯
+
+```
+WIDESEA_WMSClient/src/
+鈹溾攢鈹� views/stock/
+鈹� 鈹斺攢鈹� stockChat.vue # 涓婚〉闈㈢粍浠�
+鈹溾攢鈹� extension/stock/
+鈹� 鈹斺攢鈹� stockChat.js # ViewGrid 鎵╁睍閰嶇疆
+鈹斺攢鈹� api/
+ 鈹斺攢鈹� http.js # 澶嶇敤鐜版湁 http 灏佽
+```
+
+## 6. 缁勪欢缁撴瀯 (stockChat.vue)
+
+```vue
+<template>
+ <div class="stock-chat-container">
+ <!-- 浠撳簱 Tabs -->
+ <el-tabs v-model="activeWarehouse" @tab-change="onWarehouseChange">
+ <el-tab-pane
+ v-for="wh in warehouseList"
+ :key="wh.warehouseId"
+ :label="wh.warehouseName"
+ :name="wh.warehouseId"
+ />
+ </el-tabs>
+
+ <!-- 宸ュ叿鏍� -->
+ <div class="toolbar">
+ <el-select v-model="filterStatus" placeholder="搴撳瓨鐘舵�佺瓫閫�" clearable />
+ <el-select v-model="filterMateriel" placeholder="鐗╂枡绛涢��" clearable />
+ <el-button @click="resetCamera">閲嶇疆瑙嗚</el-button>
+ </div>
+
+ <!-- 3D Canvas -->
+ <div ref="canvasContainer" class="canvas-container" />
+
+ <!-- 鐘舵�佸浘渚� -->
+ <div class="legend">
+ <div v-for="item in legendItems" :key="item.status" class="legend-item">
+ <span class="color-box" :style="{ background: item.color }" />
+ <span>{{ item.label }}</span>
+ </div>
+ </div>
+
+ <!-- 璇︽儏寮圭獥 -->
+ <el-dialog v-model="detailDialogVisible" title="搴撳瓨璇︽儏" fullscreen>
+ <!-- 璇︽儏鍐呭 -->
+ </el-dialog>
+ </div>
+</template>
+```
+
+## 7. Three.js 鍦烘櫙璁捐
+
+### 7.1 鍒濆鍖栨祦绋�
+
+1. 鍒涘缓 `WebGLRenderer`锛屾寕杞藉埌 `canvasContainer`
+2. 鍒涘缓 `PerspectiveCamera`锛堥�忚鐩告満锛�
+3. 鍒涘缓 `Scene` 鍦烘櫙
+4. 娣诲姞鍏夌収锛堢幆澧冨厜 + 瀹氬悜鍏夛級
+5. 鍒涘缓鍦伴潰锛坄PlaneGeometry` + 缃戞牸鏉愯川锛�
+6. 鍒涘缓璐ф灦璐т綅锛坄InstancedMesh`锛�
+7. 娣诲姞 `OrbitControls` 鎺у埗鍣�
+8. 鍚姩娓叉煋寰幆
+
+### 7.2 璐т綅瀹氫綅绠楁硶
+
+```
+x = (column - maxColumn/2) * CELL_SIZE_X
+y = layer * CELL_SIZE_Y
+z = (row - maxRow/2) * CELL_SIZE_Z
+```
+
+### 7.3 鐐瑰嚮鎷惧彇
+
+- 浣跨敤 `Raycaster` 杩涜灏勭嚎妫�娴�
+- 閫氳繃 `instanceId` 璇嗗埆琚偣鍑荤殑璐т綅瀹炰緥
+- 楂樹寒锛氫复鏃舵浛鎹㈡潗璐ㄩ鑹�
+
+### 7.4 鐩告満鑱氱劍鍔ㄧ敾
+
+- 浣跨敤 `TWEEN` 鎴栨墜鍔ㄦ彃鍊煎钩婊戠Щ鍔ㄧ浉鏈�
+- 鐩爣浣嶇疆锛氳揣浣嶅潗鏍� + 鍋忕Щ閲�
+
+## 8. 鎬ц兘浼樺寲
+
+| 绛栫暐 | 璇存槑 |
+|------|------|
+| InstancedMesh | 鍗曟 drawcall 娓叉煋鎵�鏈夎揣浣� |
+| 瑙嗛敟浣撳墧闄� | 鐩告満澶栫殑璐т綅涓嶆覆鏌� |
+| 棰滆壊缂撳瓨 | 鏉愯川澶嶇敤锛岄伩鍏嶉绻佸垱寤� |
+| requestAnimationFrame | 娓叉煋寰幆浣跨敤 RAF |
+| 鏁版嵁鍒嗛〉 | 澶т粨搴撳彲鑰冭檻鎸夊尯鍩熷垎鐗囧姞杞� |
+
+## 9. 璺敱娉ㄥ唽
+
+鍦� `viewGird.js` 涓敞鍐岃矾鐢憋細
+```javascript
+{
+ path: '/stockChat',
+ name: 'stockChat',
+ component: () => import('@/views/stock/stockChat.vue')
+}
+```
+
+## 10. 寰呰ˉ鍏�
+
+- [ ] 鍚庣 `Get3DLayout` API 瀹炵幇
+- [ ] SignalR Hub 閰嶇疆
+- [ ] 璐т綅棰滆壊涓庡悗绔姸鎬佹灇涓惧榻�
+- [ ] 绛涢�夊姛鑳藉叿浣撳瓧娈电‘璁�
--
Gitblit v1.9.3