{
  "assignee_id": "8ddccf1d-9ed4-469e-a335-a14d0b72d025",
  "assignee_type": "agent",
  "created_at": "2026-05-21T15:41:50Z",
  "creator_id": "d1e4fe91-fb56-4c47-95d0-818d5f22b5bd",
  "creator_type": "agent",
  "description": "## 任务描述\n在管理员包裹页面添加详情 Modal，实现报价和发货功能。\n\n## 技术细节\n- **文件位置**：`frontend/src/views/admin/AdminParcels.vue`\n- **新增组件**：包裹详情 Modal\n- **API 调用**：\n  - `GET /api/v1/admin/parcels/{id}/details` - 获取详情\n  - `POST /api/v1/admin/parcels/{id}/quote` - 提交报价\n  - `POST /api/v1/admin/parcels/{id}/ship` - 提交发货\n\n## UI 设计\n\n### 1. 表格中添加\"详情\"按钮\n```vue\n\u003cbutton @click=\"openParcelDetail(parcel.id)\" class=\"text-blue-600\"\u003e\n  详情\n\u003c/button\u003e\n```\n\n### 2. 详情 Modal 结构\n```vue\n\u003cdiv v-if=\"showDetailModal\" class=\"fixed inset-0 bg-black/50 z-50\"\u003e\n  \u003cdiv class=\"bg-white rounded-2xl max-w-4xl mx-auto mt-20 p-6\"\u003e\n    \u003c!-- 包裹基本信息 --\u003e\n    \u003cdiv\u003e包裹编号、重量、尺寸、客户信息\u003c/div\u003e\n    \n    \u003c!-- 商品列表 --\u003e\n    \u003cdiv\u003e商品名称、数量、敏感品标记、滞留费\u003c/div\u003e\n    \n    \u003c!-- 收货地址 --\u003e\n    \u003cdiv\u003e完整地址、国家、城市\u003c/div\u003e\n    \n    \u003c!-- 报价表单（awaiting_shipment 状态）--\u003e\n    \u003cdiv v-if=\"parcelDetail.parcel.parcel_status === 'awaiting_shipment'\"\u003e\n      \u003cinput v-model=\"shippingFee\" placeholder=\"运输费（USD）\" /\u003e\n      \u003cinput v-model=\"remoteAreaFee\" placeholder=\"偏远附加费（USD）\" /\u003e\n      \u003cdiv\u003e滞留费：${{ storageFee }} (自动计算)\u003c/div\u003e\n      \u003cdiv\u003e总费用：${{ totalFee }}\u003c/div\u003e\n      \u003cbutton @click=\"submitQuote\"\u003e提交报价\u003c/button\u003e\n    \u003c/div\u003e\n    \n    \u003c!-- 发货表单（shipped_waiting 状态）--\u003e\n    \u003cdiv v-else-if=\"parcelDetail.parcel.parcel_status === 'shipped_waiting'\"\u003e\n      \u003cdiv\u003e中间物流单号：{{ parcelDetail.parcel.internal_tracking_no }}\u003c/div\u003e\n      \u003cinput v-model=\"internationalTrackingNo\" placeholder=\"国际物流单号\" /\u003e\n      \u003cbutton @click=\"submitShip\"\u003e提交发货\u003c/button\u003e\n    \u003c/div\u003e\n  \u003c/div\u003e\n\u003c/div\u003e\n```\n\n## 业务逻辑\n\n### 1. 打开详情\n```javascript\nconst openParcelDetail = async (parcelId) =\u003e {\n  loading.value = true\n  try {\n    const data = await adminService.getParcelDetails(parcelId)\n    parcelDetail.value = data\n    storageFee.value = data.storage_fees.total_fee_usd\n    showDetailModal.value = true\n  } catch (err) {\n    error.value = '获取包裹详情失败'\n  } finally {\n    loading.value = false\n  }\n}\n```\n\n### 2. 提交报价\n```javascript\nconst submitQuote = async () =\u003e {\n  try {\n    await adminService.quoteParcel(parcelDetail.value.parcel.id, {\n      shipping_fee_usd: parseFloat(shippingFee.value),\n      remote_area_fee_usd: parseFloat(remoteAreaFee.value) || 0\n    })\n    successMessage.value = '报价提交成功'\n    showDetailModal.value = false\n    await fetchParcels()\n  } catch (err) {\n    error.value = '报价提交失败'\n  }\n}\n```\n\n### 3. 提交发货\n```javascript\nconst submitShip = async () =\u003e {\n  try {\n    await adminService.shipParcel(parcelDetail.value.parcel.id, {\n      international_tracking_no: internationalTrackingNo.value\n    })\n    successMessage.value = '发货成功'\n    showDetailModal.value = false\n    await fetchParcels()\n  } catch (err) {\n    error.value = '发货失败'\n  }\n}\n```\n\n## 完成标准\n- [ ] 详情 Modal UI 实现完成且美观\n- [ ] 报价表单实现（自动计算总费用）\n- [ ] 发货表单实现\n- [ ] 商品列表显示敏感品标记\n- [ ] 滞留费明细显示清晰\n- [ ] API 调用正确\n- [ ] 错误处理完善\n- [ ] 前端类型定义更新（`frontend/src/types/api.d.ts`）\n- [ ] 前端服务更新（`frontend/src/services/admin.js`）\n\n## 参考\n- 设计文档：`docs/PARCEL_MANAGEMENT_DESIGN.md` 第 4.3.2 节\n- 现有代码：`frontend/src/views/parcel/ParcelPage.vue` 的费用显示",
  "due_date": null,
  "id": "10c4cba9-f16a-48bd-983c-15ae3d177399",
  "identifier": "FET-29",
  "metadata": {},
  "number": 29,
  "parent_issue_id": "857e476e-26f8-4097-8da0-4100f121cb5c",
  "position": 0,
  "priority": "high",
  "project_id": null,
  "start_date": null,
  "status": "todo",
  "title": "[前端] 管理员报价和发货 UI",
  "updated_at": "2026-05-22T03:12:37Z",
  "workspace_id": "b5fdce19-2a82-455d-b644-5b83da2b3078"
}