123

doc/店铺后台/库存管理/商品出库/商品出库前端技术方案.md

@@ -0,0 +1,241 @@
+# 商品出库 — 前端技术方案
+
+> **依据：** 《商品出库功能需求.md》v1.0.1、《商品出库技术方案.md》v1.0.1  
+> **前端规范：** `doc/前端设计/前端设计.md`  
+> **范围：** 仅 **ruoyi-ui 商家端** 当前店铺出库单列表、高级检索、**手工出库**、详情查看；**不含** 支付扣减写入、C 端、平台端、库存调整页。  
+> **实现状态：** `index.vue`、`detail.vue`、`form.vue`、`api/agri/seller/stock/outbound.js` **已按 v1.0.1 落地**；待菜单配置及 `/agri/seller/stock/outbound` 联调。
+
+---
+
+## 1. 技术栈与写法约定
+
+| 项 | 说明 |
+|----|------|
+| 框架 | Vue 2 + Element UI |
+| 请求 | `@/utils/request` + `sellerShopHeaders()` 携带 **`X-Shop-Id`** |
+| 参考页面 | `agri/seller/stock/inbound/*`（对称实现） |
+| 布局 | 检索 `el-card` + `<br/>` + 列表 `el-card` + `border` 表格 |
+| 详情 | 右侧 `el-drawer`（`size="72%"`，`append-to-body`） |
+| 手工出库 | 右侧 `el-drawer`（`size="85%"`，底部固定「取消/确认」） |
+| 图片 | 全局 `image-preview` |
+| 店铺切换 | **仅 Navbar**；业务页禁止展示店铺选择器 |
+
+---
+
+## 2. 业务要点（前端需体现）
+
+| 项 | 说明 |
+|----|------|
+| 出库类型 | `0` 下单扣减 / `1` 删除产品规格（自动）/ `2` 订单出库 / `3` 过期出库 / `4` 其他出库 |
+| 手工表单 | **仅 2～4**；默认 **过期出库（3）**（对齐 UI 稿） |
+| 命名 | **「下单扣减」≠「订单出库」**；列表/详情统一后端 `outboundTypeText` |
+| 自动出库 | 支付扣减、删规格 **仅留痕**；详情展示提示文案 |
+| 手工出库 | 确认后 **减少可用库存**；单据 **不可编辑/删除** |
+| 库存校验 | 选品 **stock>0**；出库数量 **≤ 当前可用库存** |
+| 关联订单 | 类型 `0` 详情展示 `refOrderNo`（只读文本） |
+
+---
+
+## 3. 文件清单
+
+| 类型 | 路径 | 说明 |
+|------|------|------|
+| 列表页 | `ruoyi-ui/src/views/agri/seller/stock/outbound/index.vue` | 检索、表格、分页、打开出库/详情抽屉 |
+| 详情抽屉 | `ruoyi-ui/src/views/agri/seller/stock/outbound/detail.vue` | 基本信息 + 出库明细（只读） |
+| 出库抽屉 | `ruoyi-ui/src/views/agri/seller/stock/outbound/form.vue` | 手工出库表单、选品、条码、明细编辑 |
+| 出库 API | `ruoyi-ui/src/api/agri/seller/stock/outbound.js` | list、detail、create、operators、goods/options、goods/byBarcode |
+| 店铺上下文 | `api/agri/seller/context.js` + `utils/sellerShop.js` | X-Shop-Id |
+
+**组件 name（keep-alive）：**
+
+| 组件 | name |
+|------|------|
+| 列表页 | `AgriSellerStockOutbound` |
+| 详情抽屉 | `SellerStockOutboundDetail` |
+| 出库抽屉 | `SellerStockOutboundForm` |
+
+---
+
+## 4. 菜单与路由
+
+| 菜单名称 | 组件路径 | 路由 path（建议） | 权限标识 |
+|----------|----------|-------------------|----------|
+| 商品出库 | `agri/seller/stock/outbound/index` | `seller/stock/outbound` | `agri:seller:stock:outbound:list` |
+
+**上级菜单：** 店铺经营管理端 → **库存管理**
+
+| 按钮权限 | 标识 | 页面落点 |
+|----------|------|----------|
+| 列表 | `agri:seller:stock:outbound:list` | 进入列表页、经办人下拉 |
+| 详情 | `agri:seller:stock:outbound:query` | 操作列「详情」 |
+| 手工出库 | `agri:seller:stock:outbound:add` | 「商品出库」、选品、条码 |
+
+---
+
+## 5. 页面结构（与代码一致）
+
+```text
+商品出库 index.vue
+├── 检索区 search-card
+│   ├── 出库搜索 keyword（单号/商品名/关联订单号模糊）
+│   ├── 出库时间 dateRange → beginTime/endTime
+│   ├── 出库类型 outboundType（0～4 下拉）
+│   ├── 经办人 operatorId
+│   └── 搜索 / 重置
+├── 列表区 table-card
+│   ├── 商品出库按钮（add 权限）+ right-toolbar
+│   ├── el-table border
+│   │   ├── 出库单号 outboundNo
+│   │   ├── 出库类型 outboundTypeText
+│   │   ├── 出库时间 outboundTime
+│   │   ├── 备注 remark
+│   │   ├── 经办人 operatorName
+│   │   └── 操作：详情
+│   └── pagination
+├── 详情抽屉 SellerStockOutboundDetail（见 §6）
+└── 出库抽屉 SellerStockOutboundForm（见 §7）
+```
+
+**不提供：** 页内店铺选择、出库单编辑/作废、打印/导出、跳转订单详情（非本期）。
+
+---
+
+## 6. 详情抽屉 detail.vue
+
+### 6.1 对外接口
+
+| 类型 | 名称 | 说明 |
+|------|------|------|
+| props | `visible` | 抽屉显隐（`.sync`） |
+| props | `outboundId` | 出库单主键 |
+| emit | `update:visible` | 关闭抽屉 |
+| 方法 | `reload()` | 预留重载 |
+
+### 6.2 分区结构
+
+| 区块 | 内容 |
+|------|------|
+| 基本信息 | 出库单号、类型、关联订单号（有则展示）、时间、经办人、备注 |
+| 系统提示 | type=`0` 支付留痕；type=`1` 删规格留痕（变化量可能为 0） |
+| 出库明细 | 商品信息、规格、出库数量、变化前/后库存 |
+
+**无底部操作栏**（确认后只读）。
+
+---
+
+## 7. 手工出库抽屉 form.vue
+
+### 7.1 基本信息
+
+| 字段 | 组件 | 校验 |
+|------|------|------|
+| 出库类型 | `el-radio-group`：过期(3)/订单(2)/其他(4)，默认 **3** | 必选 |
+| 备注 | `textarea`，maxlength=200 | ≤200 字 |
+
+### 7.2 出库商品区
+
+| 能力 | 实现 |
+|------|------|
+| 选择商品 | 分页多选 → `GET /goods/options`（**仅 stock>0**） |
+| 导入商品 | 按钮占位，提示暂未开放 |
+| 条码录入 | Enter/确定 → `GET /goods/byBarcode`；无库存提示 |
+| 明细表格 | 商品信息、规格、当前可用库存、出库数量（`:max=stock`）、删除 |
+
+### 7.3 提交 payload
+
+```json
+{
+  "outboundType": "3",
+  "remark": "optional",
+  "items": [{ "goodsId": 1001, "skuId": null, "quantity": 5 }]
+}
+```
+
+| 前端校验 | 说明 |
+|----------|------|
+| 明细至少一行 | OUT2 |
+| quantity 为正整数 | OUT3 |
+| quantity ≤ stock | 库存不足提示 |
+| 重复商品合并数量 | 合并时校验不超 stock |
+
+成功：`msgSuccess('出库成功')` → 关闭抽屉 → 刷新列表与经办人下拉。
+
+---
+
+## 8. 店铺上下文（X-Shop-Id）
+
+| 步骤 | 说明 |
+|------|------|
+| `created` | `GET /agri/seller/context` → `setSellerShopContext` |
+| 全部 API | `sellerShopHeaders()` |
+| Navbar 切店 | `location.reload()` 整页刷新 |
+
+---
+
+## 9. API 封装
+
+**模块：** `@/api/agri/seller/stock/outbound.js`
+
+| 方法 | HTTP | 路径 | 权限 |
+|------|------|------|------|
+| `listSellerStockOutbound` | GET | `/list` | list |
+| `getSellerStockOutbound` | GET | `/{outboundId}` | query |
+| `createSellerStockOutbound` | POST | `/` | add |
+| `listStockOutboundOperators` | GET | `/operators` | list |
+| `listStockOutboundGoodsOptions` | GET | `/goods/options` | add |
+| `getStockOutboundGoodsByBarcode` | GET | `/goods/byBarcode?barcode=` | add |
+
+**列表 Query：** `pageNum`、`pageSize`、`keyword`、`outboundType`、`operatorId`、`beginTime`、`endTime`。
+
+**排序：** 后端固定 `outbound_time DESC`。
+
+---
+
+## 10. 空状态与错误提示
+
+| 场景 | 前端表现 |
+|------|----------|
+| 无数据 | 「暂无出库记录」 |
+| 有筛选无结果 | 「未找到符合条件的出库单」 |
+| 未选商品 | 「请添加出库商品」 |
+| 数量非法 | 「请输入正确的出库数量」 |
+| 超库存 | 「出库数量不能大于可用库存」 |
+| 条码无库存 | 「该商品无可用库存」 |
+| 提交成功 | 「出库成功」 |
+
+---
+
+## 11. 与兄弟模块边界（前端）
+
+| 模块 | 关系 |
+|------|------|
+| **商品入库** | 对称模块；退货加库存走入库 |
+| **库存日志** | 出库成功后写入流水；日志页只读展示 |
+| **全部订单** | 支付成功自动出库单在本列表可见；**不在** 订单页手工出库 |
+| **商品列表** | 删规格自动出库单（type=1）在本列表可见 |
+
+---
+
+## 12. 联调检查清单
+
+- [ ] 菜单挂载 `agri/seller/stock/outbound/index`
+- [ ] 列表含自动单（下单扣减/删规格）与手工单
+- [ ] 关键词可搜出库单号、商品名、关联订单号
+- [ ] 手工出库：过期/订单/其他类型提交后库存减少
+- [ ] 出库数量大于可用库存时前后端均拦截
+- [ ] 详情 type=0 展示 refOrderNo 与留痕提示
+- [ ] 详情 type=1 明细 quantity 可能为 0
+- [ ] Navbar 切店后列表仅当前店数据
+- [ ] 权限：无 `add` 不显示「商品出库」
+
+---
+
+## 13. 版本记录
+
+| 版本 | 说明 |
+|------|------|
+| **v1.0** | 首版：列表/检索/详情抽屉/手工出库抽屉/API 封装；对齐需求 v1.0.1、入库对称实现与 UI 稿 |
+
+---
+
+*文档版本：v1.0 · 依据《商品出库功能需求.md》v1.0.1、《商品出库技术方案.md》v1.0.1*

doc/店铺后台/库存管理/库存日志/库存日志前端技术方案.md

@@ -0,0 +1,172 @@
+# 库存日志 — 前端技术方案
+
+> **依据：** 《库存日志功能需求.md》v1.0、《库存日志技术方案.md》v1.0  
+> **前端规范：** `doc/前端设计/前端设计.md`  
+> **范围：** 仅 **ruoyi-ui 商家端** 当前店铺库存变化流水 **只读列表**、方向 Tab 筛选、关键词检索；**不含** 写入/编辑/删除、详情页、导出、平台端。  
+> **实现状态：** `index.vue`、`api/agri/seller/stock/log.js` **已按 v1.0 落地**；待菜单配置及 `/agri/seller/stock/log` 联调。
+
+---
+
+## 1. 技术栈与写法约定
+
+| 项 | 说明 |
+|----|------|
+| 框架 | Vue 2 + Element UI |
+| 请求 | `@/utils/request` + `sellerShopHeaders()` 携带 **`X-Shop-Id`** |
+| 参考页面 | `agri/seller/stock/inbound/index.vue`（检索+页签+列表）、`agri/seller/aftersale/index.vue`（Tab 方向筛选） |
+| 布局 | 检索 `el-card` + `<br/>` + 列表 `el-card` + `border` 表格 |
+| 店铺切换 | **仅 Navbar**；业务页禁止展示店铺选择器 |
+
+---
+
+## 2. 业务要点（前端需体现）
+
+| 项 | 说明 |
+|----|------|
+| 只读 | **无** 创建/编辑/删除/跳转单据；日志由入/出库、调整、订单等模块写入 |
+| 方向 Tab | 全部 / 入库（`direction=1`）/ 出库（`direction=2`） |
+| 关键词 | 模糊匹配 **商品名称**、**商品规格** |
+| 「操作」列 | 展示 **变化原因** 文案（`changeReasonText`），**非** 业务按钮 |
+| 变化量 | 非负整数展示；**删除产品规格** 可能为 **0** |
+| 排序 | 后端固定 **操作时间倒序** |
+| 勾选列 | **预留** 导出等非本期能力；**无** 批量操作 |
+
+---
+
+## 3. 文件清单
+
+| 类型 | 路径 | 说明 |
+|------|------|------|
+| 列表页 | `ruoyi-ui/src/views/agri/seller/stock/log/index.vue` | 关键词检索、方向 Tab、表格、分页 |
+| 日志 API | `ruoyi-ui/src/api/agri/seller/stock/log.js` | list（只读） |
+| 店铺上下文 | `api/agri/seller/context.js` + `utils/sellerShop.js` | X-Shop-Id |
+
+**组件 name（keep-alive）：** `AgriSellerStockLog`
+
+**不提供：** 详情抽屉、入/出库跳转、导出、时间区间筛选、变化原因下拉。
+
+---
+
+## 4. 菜单与路由
+
+| 菜单名称 | 组件路径 | 路由 path（建议） | 权限标识 |
+|----------|----------|-------------------|----------|
+| 库存日志 | `agri/seller/stock/log/index` | `seller/stock/log` | `agri:seller:stock:log:list` |
+
+**上级菜单：** 店铺经营管理端 → **库存管理**
+
+| 按钮权限 | 标识 | 说明 |
+|----------|------|------|
+| 列表查看 | `agri:seller:stock:log:list` | 进入页面、GET /list |
+
+---
+
+## 5. 页面结构（与代码一致）
+
+```text
+库存日志 index.vue
+├── 检索区 search-card（v-show 受 right-toolbar 控制）
+│   ├── 关键词 keyword（商品名称/规格模糊，Enter 或搜索图标）
+│   └── 重置
+├── 列表区 table-card
+│   ├── 方向页签 directionTab：全部(all) | 入库(1) | 出库(2)
+│   ├── right-toolbar
+│   ├── el-table border（empty-text 动态）
+│   │   ├── selection（预留，无批量操作）
+│   │   ├── 商品名称（ID + 名称快照）
+│   │   ├── 商品规格 specText（空则 —）
+│   │   ├── 变化前库存 stockBefore
+│   │   ├── 变化后库存 stockAfter
+│   │   ├── 变化量 changeQty
+│   │   ├── 操作 → changeReasonText（变化原因）
+│   │   └── 操作时间 createTime
+│   └── pagination
+```
+
+---
+
+## 6. 变化原因展示（操作列）
+
+后端 `StockSupport.changeReasonText` 返回完整文案；前端仅对 **`ORDER_CANCEL`** 简写为 **「取消订单返库」**（对齐需求 §3.3 UI 说明）。
+
+| code | 典型文案 |
+|------|----------|
+| `NEW_SPEC` | 新增商品规格 |
+| `PURCHASE_IN` | 采购入库 |
+| `RETURN_IN` | 退货入库 |
+| `OTHER_IN` | 其他入库 |
+| `ORDER_CANCEL` | 取消订单返库（前端简写） |
+| `STOCK_EDIT` | 库存编辑 |
+| `ORDER_DEDUCT` | 下单扣减库存 |
+| `DELETE_SPEC` | 删除产品规格 |
+| `MANUAL_ORDER_OUT` | 订单出库 |
+| `EXPIRED_OUT` | 过期出库 |
+| `OTHER_OUT` | 其他出库 |
+
+---
+
+## 7. 店铺上下文（X-Shop-Id）
+
+| 步骤 | 说明 |
+|------|------|
+| `created` | `GET /agri/seller/context` → `setSellerShopContext` |
+| GET /list | `sellerShopHeaders()` |
+| Navbar 切店 | `location.reload()` 整页刷新 |
+
+---
+
+## 8. API 封装
+
+**模块：** `@/api/agri/seller/stock/log.js`
+
+| 方法 | HTTP | 路径 | 权限 |
+|------|------|------|------|
+| `listSellerStockLog` | GET | `/list` | list |
+
+**Query：** `pageNum`、`pageSize`、`keyword`、`direction`（空=全部，`1`=入库，`2`=出库）。
+
+**Row 字段：** `logId`、`goodsId`、`goodsName`、`specText`、`stockBefore`、`stockAfter`、`changeQty`、`direction`、`changeReason`、`changeReasonText`、`createTime`。
+
+---
+
+## 9. 空状态
+
+| 场景 | 文案 |
+|------|------|
+| 无流水 | 「暂无库存日志」 |
+| 有筛选无结果 | 「未找到符合条件的库存日志」 |
+
+---
+
+## 10. 与兄弟模块边界（前端）
+
+| 模块 | 关系 |
+|------|------|
+| **商品入库 / 出库** | 确认后写入日志；本页只读展示 |
+| **库存调整** | 库存编辑写入日志；本页只读 |
+| **库存查询** | 按商品查明细复用同源 `biz_stock_log`；本页为 **全店时间序** |
+| **全部订单** | 支付扣减、关单回滚经后端写日志；**非本期** 从日志行跳转订单 |
+
+---
+
+## 11. 联调检查清单
+
+- [ ] 菜单挂载 `agri/seller/stock/log/index`
+- [ ] 列表默认按操作时间倒序，仅当前店铺
+- [ ] Tab：全部 / 入库 / 出库 与 `direction` 联动
+- [ ] 关键词：商品名称、规格组合过滤
+- [ ] 「操作」列展示变化原因，无点击行为
+- [ ] 勾选列可见但无批量按钮
+- [ ] Navbar 切店后列表刷新
+
+---
+
+## 12. 版本记录
+
+| 版本 | 说明 |
+|------|------|
+| **v1.0** | 首版：只读列表、方向 Tab、关键词检索、API 封装；对齐需求 v1.0 与 UI 稿 |
+
+---
+
+*文档版本：v1.0 · 依据《库存日志功能需求.md》v1.0、《库存日志技术方案.md》v1.0*

ruoyi-ui/src/api/agri/seller/stock/log.js

@@ -0,0 +1,12 @@
+import request from '@/utils/request'
+import { sellerShopHeaders } from '@/utils/sellerShop'
+
+// 库存日志列表（只读）
+export function listSellerStockLog(query) {
+  return request({
+    url: '/agri/seller/stock/log/list',
+    method: 'get',
+    params: query,
+    headers: sellerShopHeaders()
+  })
+}

ruoyi-ui/src/api/agri/seller/stock/outbound.js

@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+import { sellerShopHeaders } from '@/utils/sellerShop'
+
+// 出库单列表
+export function listSellerStockOutbound(query) {
+  return request({
+    url: '/agri/seller/stock/outbound/list',
+    method: 'get',
+    params: query,
+    headers: sellerShopHeaders()
+  })
+}
+
+// 出库单详情
+export function getSellerStockOutbound(outboundId) {
+  return request({
+    url: '/agri/seller/stock/outbound/' + outboundId,
+    method: 'get',
+    headers: sellerShopHeaders()
+  })
+}
+
+// 手工创建出库单
+export function createSellerStockOutbound(data) {
+  return request({
+    url: '/agri/seller/stock/outbound',
+    method: 'post',
+    data: data,
+    headers: sellerShopHeaders()
+  })
+}
+
+// 经办人下拉
+export function listStockOutboundOperators() {
+  return request({
+    url: '/agri/seller/stock/outbound/operators',
+    method: 'get',
+    headers: sellerShopHeaders()
+  })
+}
+
+// 商品选择器（stock>0）
+export function listStockOutboundGoodsOptions(query) {
+  return request({
+    url: '/agri/seller/stock/outbound/goods/options',
+    method: 'get',
+    params: query,
+    headers: sellerShopHeaders()
+  })
+}
+
+// 条码/商品编号录入
+export function getStockOutboundGoodsByBarcode(barcode) {
+  return request({
+    url: '/agri/seller/stock/outbound/goods/byBarcode',
+    method: 'get',
+    params: { barcode },
+    headers: sellerShopHeaders()
+  })
+}

ruoyi-ui/src/views/agri/seller/stock/log/index.vue

@@ -0,0 +1,192 @@
+<template>
+  <div class="app-container">
+    <!-- 检索区 -->
+    <el-card shadow="never" class="search-card">
+      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="70px">
+        <el-form-item label="关键词" prop="keyword">
+          <el-input
+            v-model="queryParams.keyword"
+            placeholder="输入关键词"
+            clearable
+            style="width: 220px"
+            @keyup.enter.native="handleQuery"
+          >
+            <el-button slot="append" icon="el-icon-search" @click="handleQuery" />
+          </el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+
+    <br/>
+
+    <!-- 列表区 -->
+    <el-card shadow="never" class="table-card">
+      <el-tabs v-model="directionTab" @tab-click="handleTabClick">
+        <el-tab-pane label="全部" name="all" />
+        <el-tab-pane label="入库" name="1" />
+        <el-tab-pane label="出库" name="2" />
+      </el-tabs>
+
+      <el-row :gutter="10" class="mb8">
+        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table border v-loading="loading" :data="logList" :empty-text="emptyTableText">
+        <!-- <el-table-column type="selection" width="50" align="center" /> -->
+        <el-table-column label="商品名称" align="left" min-width="100" :show-overflow-tooltip="true">
+          <template slot-scope="scope">
+            <div class="goods-name-cell">
+              <div v-if="scope.row.goodsId" class="goods-id">ID {{ scope.row.goodsId }}</div>
+              <div>{{ scope.row.goodsName || '—' }}</div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="商品规格" align="center" min-width="280" :show-overflow-tooltip="true">
+          <template slot-scope="scope">
+            <span>{{ specText(scope.row.specText) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="变化前库存" align="center" prop="stockBefore" width="160">
+          <template slot-scope="scope">
+            <span>{{ scope.row.stockBefore != null ? scope.row.stockBefore : '—' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="变化后库存" align="center" prop="stockAfter" width="160">
+          <template slot-scope="scope">
+            <span>{{ scope.row.stockAfter != null ? scope.row.stockAfter : '—' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="变化量" align="center" prop="changeQty" width="160">
+          <template slot-scope="scope">
+            <span>{{ scope.row.changeQty != null ? scope.row.changeQty : '—' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" min-width="130" :show-overflow-tooltip="true">
+          <template slot-scope="scope">
+            <span>{{ operationText(scope.row) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作时间" align="center" width="180">
+          <template slot-scope="scope">
+            <span>{{ parseTime(scope.row.createTime) || '—' }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { listSellerStockLog } from "@/api/agri/seller/stock/log"
+import { getSellerContext } from "@/api/agri/seller/context"
+import { setSellerShopContext } from "@/utils/sellerShop"
+
+/** UI 可将「取消订单返库存」简写 */
+const REASON_TEXT_MAP = {
+  ORDER_CANCEL: "取消订单返库"
+}
+
+export default {
+  name: "AgriSellerStockLog",
+  data() {
+    return {
+      loading: false,
+      showSearch: true,
+      total: 0,
+      logList: [],
+      directionTab: "all",
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        keyword: undefined,
+        direction: undefined
+      }
+    }
+  },
+  computed: {
+    hasSearchFilter() {
+      return !!(this.queryParams.keyword || this.queryParams.direction)
+    },
+    emptyTableText() {
+      return this.hasSearchFilter ? "未找到符合条件的库存日志" : "暂无库存日志"
+    }
+  },
+  created() {
+    this.initPage()
+  },
+  methods: {
+    specText(text) {
+      const val = text ? String(text).trim() : ""
+      return val && val !== "—" ? val : "—"
+    },
+    operationText(row) {
+      if (row.changeReasonText) {
+        if (row.changeReason === "ORDER_CANCEL") {
+          return REASON_TEXT_MAP.ORDER_CANCEL
+        }
+        return row.changeReasonText
+      }
+      return row.changeReason || "—"
+    },
+    initPage() {
+      this.loadShopContext().then(() => {
+        this.getList()
+      }).catch(() => {
+        this.getList()
+      })
+    },
+    loadShopContext() {
+      return getSellerContext().then(response => {
+        const data = response.data || {}
+        if (data.shopId != null) {
+          setSellerShopContext(data.shopId, data.shopName)
+        }
+      })
+    },
+    getList() {
+      this.loading = true
+      listSellerStockLog(this.queryParams).then(response => {
+        this.logList = response.rows || []
+        this.total = response.total || 0
+        this.loading = false
+      }).catch(() => {
+        this.loading = false
+      })
+    },
+    handleTabClick() {
+      this.queryParams.direction = this.directionTab === "all" ? undefined : this.directionTab
+      this.queryParams.pageNum = 1
+      this.getList()
+    },
+    handleQuery() {
+      this.queryParams.pageNum = 1
+      this.getList()
+    },
+    resetQuery() {
+      this.resetForm("queryForm")
+      this.directionTab = "all"
+      this.queryParams.direction = undefined
+      this.queryParams.pageNum = 1
+      this.getList()
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.mb8 {
+  margin-bottom: 8px;
+}
+.goods-name-cell {
+  line-height: 1.4;
+}
+.goods-id {
+  font-size: 12px;
+  color: #909399;
+}
+</style>

ruoyi-ui/src/views/agri/seller/stock/outbound/detail.vue

@@ -0,0 +1,150 @@
+<template>
+  <el-drawer
+    :title="'出库单详情 · ' + (detail.outboundNo || '')"
+    :visible.sync="localVisible"
+    direction="rtl"
+    size="72%"
+    append-to-body
+    custom-class="detail-drawer"
+  >
+    <div v-loading="loading" class="drawer-content">
+      <h4 class="section-header">基本信息</h4>
+      <el-descriptions :column="2" border size="small" class="mb16">
+        <el-descriptions-item label="出库单号">{{ detail.outboundNo || '—' }}</el-descriptions-item>
+        <el-descriptions-item label="出库类型">{{ detail.outboundTypeText || outboundTypeLabel(detail.outboundType) }}</el-descriptions-item>
+        <el-descriptions-item v-if="detail.refOrderNo" label="关联订单">{{ detail.refOrderNo }}</el-descriptions-item>
+        <el-descriptions-item label="出库时间">{{ parseTime(detail.outboundTime) || '—' }}</el-descriptions-item>
+        <el-descriptions-item label="经办人">{{ detail.operatorName || '—' }}</el-descriptions-item>
+        <el-descriptions-item label="备注" :span="detail.refOrderNo ? 1 : 2">{{ detail.remark || '—' }}</el-descriptions-item>
+      </el-descriptions>
+      <p v-if="detail.outboundType === '0'" class="section-tip">系统自动出库：库存已在支付成功时扣减，本单仅留痕。</p>
+      <p v-if="detail.outboundType === '1'" class="section-tip">删除产品规格留痕：变化量可能为 0，库存不在本单再次扣减。</p>
+
+      <h4 class="section-header">出库明细</h4>
+      <el-table border size="small" :data="detail.items || []" empty-text="暂无明细">
+        <el-table-column label="商品信息" min-width="220">
+          <template slot-scope="scope">
+            <div class="goods-cell">
+              <image-preview v-if="scope.row.mainPic" :src="scope.row.mainPic" :width="44" :height="44" />
+              <span>{{ scope.row.goodsName || '—' }}</span>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="商品规格" width="120" align="center">
+          <template slot-scope="scope">
+            <span>{{ specText(scope.row.specText) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="出库数量" width="100" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.quantity != null ? scope.row.quantity : '—' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="变化前库存" width="100" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.stockBefore != null ? scope.row.stockBefore : '—' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="变化后库存" width="100" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.stockAfter != null ? scope.row.stockAfter : '—' }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+  </el-drawer>
+</template>
+
+<script>
+import { getSellerStockOutbound } from "@/api/agri/seller/stock/outbound"
+
+const OUTBOUND_TYPE_MAP = {
+  "0": "下单扣减",
+  "1": "删除产品规格",
+  "2": "订单出库",
+  "3": "过期出库",
+  "4": "其他出库"
+}
+
+export default {
+  name: "SellerStockOutboundDetail",
+  props: {
+    visible: { type: Boolean, default: false },
+    outboundId: { type: [Number, String], default: null }
+  },
+  data() {
+    return {
+      localVisible: false,
+      loading: false,
+      detail: {}
+    }
+  },
+  watch: {
+    visible(val) {
+      this.localVisible = val
+      if (val && this.outboundId) {
+        this.loadDetail()
+      }
+    },
+    localVisible(val) {
+      this.$emit("update:visible", val)
+    },
+    outboundId(val) {
+      if (val && this.localVisible) {
+        this.loadDetail()
+      }
+    }
+  },
+  methods: {
+    outboundTypeLabel(type) {
+      return OUTBOUND_TYPE_MAP[type] || "—"
+    },
+    specText(text) {
+      const val = text ? String(text).trim() : ""
+      return val || "—"
+    },
+    loadDetail() {
+      if (!this.outboundId) {
+        return
+      }
+      this.loading = true
+      getSellerStockOutbound(this.outboundId).then(response => {
+        this.detail = response.data || {}
+        this.loading = false
+      }).catch(() => {
+        this.loading = false
+      })
+    },
+    reload() {
+      this.loadDetail()
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.drawer-content {
+  padding: 0 20px 20px;
+}
+.section-header {
+  margin: 16px 0 10px;
+  font-size: 15px;
+  color: #303133;
+  border-left: 3px solid #409EFF;
+  padding-left: 8px;
+}
+.section-tip {
+  margin: -8px 0 12px;
+  font-size: 12px;
+  color: #909399;
+  line-height: 1.5;
+}
+.mb16 {
+  margin-bottom: 16px;
+}
+.goods-cell {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+</style>

ruoyi-ui/src/views/agri/seller/stock/outbound/form.vue

@@ -0,0 +1,467 @@
+<template>
+  <el-drawer
+    title="商品出库"
+    :visible.sync="localVisible"
+    direction="rtl"
+    size="85%"
+    append-to-body
+    :wrapper-closable="false"
+    custom-class="outbound-form-drawer"
+    @close="handleClose"
+  >
+    <div class="drawer-body">
+      <h4 class="section-header">基本信息</h4>
+      <el-form ref="baseFormRef" :model="form" :rules="baseRules" label-width="90px" size="small" class="base-form">
+        <el-form-item label="出库类型" prop="outboundType">
+          <el-radio-group v-model="form.outboundType">
+            <el-radio label="3">过期出库</el-radio>
+            <el-radio label="2">订单出库</el-radio>
+            <el-radio label="4">其他出库</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            v-model="form.remark"
+            type="textarea"
+            :rows="3"
+            placeholder="请输入备注"
+            maxlength="200"
+            show-word-limit
+            style="max-width: 640px"
+          />
+        </el-form-item>
+      </el-form>
+
+      <h4 class="section-header">出库商品</h4>
+      <div class="goods-toolbar">
+        <el-button type="primary" size="mini" icon="el-icon-goods" @click="openGoodsPicker">选择商品</el-button>
+        <!-- <el-button size="mini" icon="el-icon-upload2" @click="handleImportTip">导入商品</el-button>
+        <div class="barcode-wrap">
+          <el-input
+            v-model="barcodeInput"
+            placeholder="请输入商品条码"
+            clearable
+            size="small"
+            style="width: 280px"
+            @keyup.enter.native="handleBarcodeConfirm"
+          >
+            <i slot="prefix" class="el-input__icon el-icon-full-screen" />
+            <el-button slot="append" type="primary" @click="handleBarcodeConfirm">确定(Enter)</el-button>
+          </el-input>
+        </div> -->
+      </div>
+
+      <el-table border size="small" :data="formItems" class="items-table" empty-text="请添加出库商品">
+        <el-table-column label="商品信息" min-width="220">
+          <template slot-scope="scope">
+            <div class="goods-cell">
+              <image-preview v-if="scope.row.mainPic" :src="scope.row.mainPic" :width="44" :height="44" />
+              <span>{{ scope.row.goodsName || '—' }}</span>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="商品规格" width="120" align="center">
+          <template slot-scope="scope">
+            <span>{{ specText(scope.row.specText) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="当前可用库存" width="120" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.stock != null ? scope.row.stock : '—' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="出库数量" width="160" align="center">
+          <template slot-scope="scope">
+            <el-input-number
+              v-model="scope.row.quantity"
+              :min="1"
+              :max="scope.row.stock != null ? scope.row.stock : undefined"
+              :precision="0"
+              controls-position="right"
+              size="small"
+              style="width: 120px"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" width="80" align="center">
+          <template slot-scope="scope">
+            <el-button type="text" size="mini" @click="removeItem(scope.$index)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+
+    <div class="drawer-footer">
+      <el-button @click="handleCancel">取 消</el-button>
+      <el-button type="primary" :loading="submitting" @click="handleSubmit">确 认</el-button>
+    </div>
+
+    <!-- 商品选择器 -->
+    <el-dialog title="选择商品" :visible.sync="pickerOpen" width="820px" append-to-body @close="resetPicker">
+      <p class="pick-tip">仅展示当前可用库存 &gt; 0 的商品</p>
+      <el-form :inline="true" size="small" @submit.native.prevent>
+        <el-form-item label="商品名称">
+          <el-input v-model="pickerQuery.keyword" placeholder="名称/编号" clearable style="width: 200px" @keyup.enter.native="searchGoodsOptions" />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" @click="searchGoodsOptions">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <el-table
+        ref="pickerTable"
+        border
+        v-loading="pickerLoading"
+        :data="pickerList"
+        max-height="360"
+        @selection-change="handlePickerSelection"
+      >
+        <el-table-column type="selection" width="50" align="center" />
+        <el-table-column label="商品信息" min-width="200">
+          <template slot-scope="scope">
+            <div class="goods-cell">
+              <image-preview v-if="scope.row.mainPic" :src="scope.row.mainPic" :width="40" :height="40" />
+              <span>{{ scope.row.goodsName || '—' }}</span>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="规格" width="100" align="center">
+          <template slot-scope="scope">
+            <span>{{ specText(scope.row.specText) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="编号" prop="goodsSn" width="120" :show-overflow-tooltip="true" />
+        <el-table-column label="可用库存" prop="stock" width="90" align="center" />
+      </el-table>
+      <pagination
+        v-show="pickerTotal > 0"
+        :total="pickerTotal"
+        :page.sync="pickerQuery.pageNum"
+        :limit.sync="pickerQuery.pageSize"
+        @pagination="loadGoodsOptions"
+      />
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="confirmPicker">确 定</el-button>
+        <el-button @click="pickerOpen = false">取 消</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 条码多匹配选择 -->
+    <el-dialog title="选择商品规格" :visible.sync="barcodePickOpen" width="640px" append-to-body>
+      <p class="pick-tip">该条码匹配到多个商品，请选择其一：</p>
+      <el-table border :data="barcodeCandidates" @row-click="selectBarcodeCandidate">
+        <el-table-column label="商品信息" min-width="180">
+          <template slot-scope="scope">
+            <div class="goods-cell">
+              <image-preview v-if="scope.row.mainPic" :src="scope.row.mainPic" :width="40" :height="40" />
+              <span>{{ scope.row.goodsName || '—' }}</span>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="规格" width="100" align="center">
+          <template slot-scope="scope">
+            <span>{{ specText(scope.row.specText) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="可用库存" prop="stock" width="90" align="center" />
+        <el-table-column label="操作" width="80" align="center">
+          <template slot-scope="scope">
+            <el-button type="text" size="mini" @click.stop="selectBarcodeCandidate(scope.row)">选择</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-dialog>
+  </el-drawer>
+</template>
+
+<script>
+import {
+  createSellerStockOutbound,
+  listStockOutboundGoodsOptions,
+  getStockOutboundGoodsByBarcode
+} from "@/api/agri/seller/stock/outbound"
+
+export default {
+  name: "SellerStockOutboundForm",
+  props: {
+    visible: { type: Boolean, default: false }
+  },
+  data() {
+    return {
+      localVisible: false,
+      submitting: false,
+      form: {
+        outboundType: "3",
+        remark: undefined
+      },
+      formItems: [],
+      barcodeInput: "",
+      baseRules: {
+        outboundType: [{ required: true, message: "请选择出库类型", trigger: "change" }]
+      },
+      pickerOpen: false,
+      pickerLoading: false,
+      pickerList: [],
+      pickerTotal: 0,
+      pickerSelection: [],
+      pickerQuery: {
+        pageNum: 1,
+        pageSize: 10,
+        keyword: undefined
+      },
+      barcodePickOpen: false,
+      barcodeCandidates: []
+    }
+  },
+  watch: {
+    visible(val) {
+      this.localVisible = val
+      if (val) {
+        this.resetForm()
+      }
+    },
+    localVisible(val) {
+      this.$emit("update:visible", val)
+    }
+  },
+  methods: {
+    specText(text) {
+      const val = text ? String(text).trim() : ""
+      return val || "—"
+    },
+    resetForm() {
+      this.form = {
+        outboundType: "3",
+        remark: undefined
+      }
+      this.formItems = []
+      this.barcodeInput = ""
+      this.submitting = false
+      this.$nextTick(() => {
+        if (this.$refs.baseFormRef) {
+          this.$refs.baseFormRef.clearValidate()
+        }
+      })
+    },
+    handleClose() {
+      this.resetForm()
+    },
+    handleCancel() {
+      this.localVisible = false
+    },
+    openGoodsPicker() {
+      this.pickerOpen = true
+      this.pickerQuery.pageNum = 1
+      this.loadGoodsOptions()
+    },
+    resetPicker() {
+      this.pickerSelection = []
+      this.pickerQuery.keyword = undefined
+      if (this.$refs.pickerTable) {
+        this.$refs.pickerTable.clearSelection()
+      }
+    },
+    searchGoodsOptions() {
+      this.pickerQuery.pageNum = 1
+      this.loadGoodsOptions()
+    },
+    loadGoodsOptions() {
+      this.pickerLoading = true
+      listStockOutboundGoodsOptions(this.pickerQuery).then(response => {
+        this.pickerList = response.rows || []
+        this.pickerTotal = response.total || 0
+        this.pickerLoading = false
+      }).catch(() => {
+        this.pickerLoading = false
+      })
+    },
+    handlePickerSelection(rows) {
+      this.pickerSelection = rows || []
+    },
+    confirmPicker() {
+      if (!this.pickerSelection.length) {
+        this.$modal.msgWarning("请选择商品")
+        return
+      }
+      this.pickerSelection.forEach(row => {
+        this.appendGoodsRow(row)
+      })
+      this.pickerOpen = false
+    },
+    handleImportTip() {
+      this.$modal.msgWarning("批量导入功能暂未开放，请使用选择商品或条码录入")
+    },
+    handleBarcodeConfirm() {
+      const code = this.barcodeInput ? String(this.barcodeInput).trim() : ""
+      if (!code) {
+        this.$modal.msgWarning("请输入商品条码")
+        return
+      }
+      getStockOutboundGoodsByBarcode(code).then(response => {
+        const rows = response.data || []
+        if (!rows.length) {
+          this.$modal.msgError("未找到该条码对应的商品")
+          return
+        }
+        const validRows = rows.filter(row => row.stock != null && row.stock > 0)
+        if (!validRows.length) {
+          this.$modal.msgError("该商品无可用库存")
+          return
+        }
+        if (validRows.length === 1) {
+          this.appendGoodsRow(validRows[0])
+          this.barcodeInput = ""
+          return
+        }
+        this.barcodeCandidates = validRows
+        this.barcodePickOpen = true
+      })
+    },
+    selectBarcodeCandidate(row) {
+      this.appendGoodsRow(row)
+      this.barcodePickOpen = false
+      this.barcodeCandidates = []
+      this.barcodeInput = ""
+    },
+    itemKey(row) {
+      const skuId = row.skuId != null ? row.skuId : ""
+      return `${row.goodsId}_${skuId}`
+    },
+    appendGoodsRow(row) {
+      if (!row || row.goodsId == null) {
+        return
+      }
+      if (row.stock == null || row.stock <= 0) {
+        this.$modal.msgWarning("该商品无可用库存")
+        return
+      }
+      const key = this.itemKey(row)
+      const exist = this.formItems.find(item => this.itemKey(item) === key)
+      if (exist) {
+        const nextQty = (exist.quantity || 0) + 1
+        if (nextQty > exist.stock) {
+          this.$modal.msgWarning("出库数量不能大于可用库存")
+          return
+        }
+        exist.quantity = nextQty
+        this.$modal.msgSuccess("该商品已在明细中，已合并数量")
+        return
+      }
+      this.formItems.push({
+        goodsId: row.goodsId,
+        skuId: row.skuId || null,
+        goodsName: row.goodsName,
+        mainPic: row.mainPic,
+        specText: row.specText,
+        stock: row.stock,
+        quantity: 1
+      })
+    },
+    removeItem(index) {
+      this.formItems.splice(index, 1)
+    },
+    validateItems() {
+      if (!this.formItems.length) {
+        this.$modal.msgWarning("请添加出库商品")
+        return false
+      }
+      for (let i = 0; i < this.formItems.length; i++) {
+        const item = this.formItems[i]
+        const qty = item.quantity
+        if (qty == null || !Number.isInteger(Number(qty)) || Number(qty) < 1) {
+          this.$modal.msgWarning("请输入正确的出库数量")
+          return false
+        }
+        if (item.stock != null && Number(qty) > Number(item.stock)) {
+          this.$modal.msgWarning("出库数量不能大于可用库存")
+          return false
+        }
+      }
+      return true
+    },
+    handleSubmit() {
+      this.$refs.baseFormRef.validate(valid => {
+        if (!valid || !this.validateItems()) {
+          return
+        }
+        const payload = {
+          outboundType: this.form.outboundType,
+          remark: this.form.remark ? String(this.form.remark).trim() : undefined,
+          items: this.formItems.map(item => ({
+            goodsId: item.goodsId,
+            skuId: item.skuId || null,
+            quantity: Number(item.quantity)
+          }))
+        }
+        this.submitting = true
+        createSellerStockOutbound(payload).then(response => {
+          const data = response.data || {}
+          this.$modal.msgSuccess("出库成功")
+          this.localVisible = false
+          this.$emit("success", data)
+          this.submitting = false
+        }).catch(() => {
+          this.submitting = false
+        })
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.drawer-body {
+  padding: 0 20px 72px;
+}
+.section-header {
+  margin: 8px 0 12px;
+  font-size: 15px;
+  color: #303133;
+  border-left: 3px solid #409EFF;
+  padding-left: 8px;
+}
+.base-form {
+  margin-bottom: 8px;
+}
+.goods-toolbar {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 12px;
+}
+.barcode-wrap {
+  margin-left: auto;
+}
+.items-table {
+  margin-top: 4px;
+}
+.goods-cell {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.drawer-footer {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 10;
+  padding: 12px 20px;
+  text-align: right;
+  background: #fff;
+  border-top: 1px solid #EBEEF5;
+}
+.pick-tip {
+  margin: 0 0 12px;
+  font-size: 13px;
+  color: #606266;
+}
+</style>
+
+<style lang="scss">
+.outbound-form-drawer .el-drawer__body {
+  position: relative;
+  padding: 0;
+  overflow: auto;
+}
+</style>

ruoyi-ui/src/views/agri/seller/stock/outbound/index.vue

@@ -0,0 +1,232 @@
+<template>
+  <div class="app-container">
+    <!-- 检索区 -->
+    <el-card shadow="never" class="search-card">
+      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
+        <el-form-item label="出库搜索" prop="keyword">
+          <el-input
+            v-model="queryParams.keyword"
+            placeholder="出库单号/商品名称/订单号"
+            clearable
+            style="width: 200px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="出库时间">
+          <el-date-picker
+            v-model="dateRange"
+            type="daterange"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            style="width: 240px"
+          />
+        </el-form-item>
+        <el-form-item label="出库类型" prop="outboundType">
+          <el-select v-model="queryParams.outboundType" placeholder="全部" clearable style="width: 150px">
+            <el-option v-for="item in outboundTypeOptions" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="经办人" prop="operatorId">
+          <el-select v-model="queryParams.operatorId" placeholder="全部" clearable filterable style="width: 140px">
+            <el-option
+              v-for="item in operatorOptions"
+              :key="item.operatorId"
+              :label="item.operatorName"
+              :value="item.operatorId"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+
+    <br/>
+
+    <!-- 列表区 -->
+    <el-card shadow="never" class="table-card">
+      <el-row :gutter="10" class="mb8">
+        <el-col :span="1.5">
+          <el-button type="primary" icon="el-icon-minus" size="mini" @click="handleCreate" v-hasPermi="['agri:seller:stock:outbound:add']">商品出库</el-button>
+        </el-col>
+        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table border v-loading="loading" :data="outboundList" :empty-text="emptyTableText">
+        <el-table-column label="出库单号" align="center" prop="outboundNo" min-width="180" :show-overflow-tooltip="true" />
+        <el-table-column label="出库类型" align="center" width="130">
+          <template slot-scope="scope">
+            <span>{{ scope.row.outboundTypeText || outboundTypeLabel(scope.row.outboundType) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="出库时间" align="center" width="160">
+          <template slot-scope="scope">
+            <span>{{ parseTime(scope.row.outboundTime) || '—' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="备注" align="center" min-width="120" :show-overflow-tooltip="true">
+          <template slot-scope="scope">
+            <span>{{ scope.row.remark || '—' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="经办人" align="center" prop="operatorName" width="100" :show-overflow-tooltip="true">
+          <template slot-scope="scope">
+            <span>{{ scope.row.operatorName || '—' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" width="90" fixed="right">
+          <template slot-scope="scope">
+            <el-button size="mini" type="text" icon="el-icon-view" @click="handleDetail(scope.row)" v-hasPermi="['agri:seller:stock:outbound:query']">详情</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
+    </el-card>
+
+    <!-- 详情抽屉 -->
+    <seller-stock-outbound-detail
+      ref="outboundDetail"
+      :visible.sync="detailOpen"
+      :outbound-id="currentOutboundId"
+    />
+
+    <!-- 手工出库抽屉 -->
+    <seller-stock-outbound-form
+      :visible.sync="formOpen"
+      @success="handleFormSuccess"
+    />
+  </div>
+</template>
+
+<script>
+import {
+  listSellerStockOutbound,
+  listStockOutboundOperators
+} from "@/api/agri/seller/stock/outbound"
+import { getSellerContext } from "@/api/agri/seller/context"
+import { setSellerShopContext } from "@/utils/sellerShop"
+import SellerStockOutboundDetail from "./detail"
+import SellerStockOutboundForm from "./form"
+
+const OUTBOUND_TYPE_MAP = {
+  "0": "下单扣减",
+  "1": "删除产品规格",
+  "2": "订单出库",
+  "3": "过期出库",
+  "4": "其他出库"
+}
+
+export default {
+  name: "AgriSellerStockOutbound",
+  components: { SellerStockOutboundDetail, SellerStockOutboundForm },
+  data() {
+    return {
+      loading: false,
+      showSearch: true,
+      total: 0,
+      outboundList: [],
+      dateRange: [],
+      operatorOptions: [],
+      detailOpen: false,
+      formOpen: false,
+      currentOutboundId: null,
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        keyword: undefined,
+        outboundType: undefined,
+        operatorId: undefined
+      },
+      outboundTypeOptions: [
+        { value: "0", label: "下单扣减" },
+        { value: "1", label: "删除产品规格" },
+        { value: "2", label: "订单出库" },
+        { value: "3", label: "过期出库" },
+        { value: "4", label: "其他出库" }
+      ]
+    }
+  },
+  computed: {
+    hasSearchFilter() {
+      return !!(this.queryParams.keyword || this.queryParams.outboundType || this.queryParams.operatorId || (this.dateRange && this.dateRange.length))
+    },
+    emptyTableText() {
+      return this.hasSearchFilter ? "未找到符合条件的出库单" : "暂无出库记录"
+    }
+  },
+  created() {
+    this.initPage()
+  },
+  methods: {
+    outboundTypeLabel(type) {
+      return OUTBOUND_TYPE_MAP[type] || "—"
+    },
+    initPage() {
+      this.loadShopContext().then(() => {
+        this.loadOperators()
+        this.getList()
+      }).catch(() => {
+        this.loadOperators()
+        this.getList()
+      })
+    },
+    loadShopContext() {
+      return getSellerContext().then(response => {
+        const data = response.data || {}
+        if (data.shopId != null) {
+          setSellerShopContext(data.shopId, data.shopName)
+        }
+      })
+    },
+    loadOperators() {
+      listStockOutboundOperators().then(response => {
+        this.operatorOptions = response.data || []
+      }).catch(() => {
+        this.operatorOptions = []
+      })
+    },
+    getList() {
+      this.loading = true
+      listSellerStockOutbound(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
+        this.outboundList = response.rows || []
+        this.total = response.total || 0
+        this.loading = false
+      }).catch(() => {
+        this.loading = false
+      })
+    },
+    handleQuery() {
+      this.queryParams.pageNum = 1
+      this.getList()
+    },
+    resetQuery() {
+      this.dateRange = []
+      this.resetForm("queryForm")
+      this.queryParams.pageNum = 1
+      this.getList()
+    },
+    handleCreate() {
+      this.formOpen = true
+    },
+    handleDetail(row) {
+      this.currentOutboundId = row.outboundId
+      this.detailOpen = true
+    },
+    handleFormSuccess() {
+      this.loadOperators()
+      this.getList()
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.mb8 {
+  margin-bottom: 8px;
+}
+</style>