feat: 卫生供应模块净菜内供/外售页面交互重构
- 净菜内供/外售:去掉列表溯源码和关联仓库/出库区域列 - 新建弹窗:净菜类型在前,包装批次号始终显示(非必填),选择后回显批次包装信息 - 备货完成:从二次确认改为补全备货信息弹窗(选择包装批次号) - 详情抽屉:按净菜类型定制渲染(净菜包显示溯源码,餐品净菜包显示批次号+明细表) - 外售弹窗字段顺序调整:净菜信息在前,客户信息在后,客户名称改为输入框 - sup-in-clean/cleanin/raw/pkg-label:列调整与交互优化 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,161 @@
|
||||
# 溯源总览模块优化方案
|
||||
|
||||
> 整理时间:2026-05-22 | 状态:待讨论 | 关联页面:trace-query.html、trace-timeline.html
|
||||
|
||||
---
|
||||
|
||||
## 一、核心问题诊断
|
||||
|
||||
### 问题 1:模块定位与内容严重不匹配
|
||||
|
||||
"溯源总览"作为营养管理的**第一个一级 Tab**,目前只有 2 个页面(查询 + 链路可视化)。对比其他模块(绿色种采 10+ 页、健康生产 10+ 页、营养用餐 8+ 页),内容极度单薄。更关键的是——**叫"总览"却没有总览 Dashboard**,用户进入后直接看到的是一个查询列表,完全没有全局视角。
|
||||
|
||||
### 问题 2:trace-query 的数据粒度混乱(最致命)
|
||||
|
||||
表格的每一行粒度定义混乱:
|
||||
|
||||
| 列名 | 粒度 | 矛盾点 |
|
||||
|------|------|--------|
|
||||
| 餐品溯源码 / 菜品名称 | 餐品级 | 一道菜一个码 |
|
||||
| 来源类型 / 产地/供应商 / 种植批次 | **食材级** | 一道菜有多种食材,各有不同来源 |
|
||||
|
||||
以"宫保鸡丁"为例,它包含 4 种食材(鸡胸肉=外采、花生=外采、辣椒=自种、葱姜蒜=自种),但表中只显示了一条记录,来源标记为"自产养殖"——这只对应了鸡胸肉一种食材,**其他 3 种食材的溯源信息完全丢失**。
|
||||
|
||||
如果某天的花生检出黄曲霉毒素超标,从这个表里根本看不出来。
|
||||
|
||||
### 问题 3:trace-timeline 的信息负荷过重
|
||||
|
||||
鸡胸肉链路有 **14 个节点**,水平排列后管道极长。分支节点(如净菜加工 x4、按单烹制 x3)本质上是一个节点分裂出多条并行链路,但当前设计**只用角标数字表示**,点击后详情是把所有分支挤在一个卡片里(`分支A/B/C/D`),无法直观理解分支走向和收敛。
|
||||
|
||||
### 问题 4:两个页面之间的衔接断裂
|
||||
|
||||
trace-query 中每行的"查看食材链路"都指向同一个 `trace-timeline.html`(硬编码的宫保鸡丁数据),无论点哪道菜都看到同样的内容。作为原型,至少应该在页面状态上表达"跳转后应展示对应菜品"的意图。
|
||||
|
||||
---
|
||||
|
||||
## 二、重构优化方案
|
||||
|
||||
建议将"溯源总览"模块从 2 页扩展为 **4~5 页**:
|
||||
|
||||
```
|
||||
溯源总览(一级菜单)
|
||||
├── 溯源看板 trace-dashboard.html 【新增】总览 Dashboard
|
||||
├── 餐品溯源查询 trace-query.html 【重构】修正数据粒度
|
||||
├── 食材溯源查询 trace-ingredient.html 【新增】食材维度独立页
|
||||
├── 链路可视化 trace-timeline.html 【优化】交互减负
|
||||
└── 溯源码管理 trace-code.html 【新增,可选】溯源码规则配置
|
||||
```
|
||||
|
||||
### 2.1 新增:溯源看板(trace-dashboard)
|
||||
|
||||
作为模块的**入口页和默认页**,提供全局统计视角。
|
||||
|
||||
**顶部统计卡片行(4~5 张):**
|
||||
- 今日溯源覆盖率(已溯源菜品数 / 总菜品数,如 95.2%)
|
||||
- 检测合格率(合格食材数 / 已检食材数,如 99.8%)
|
||||
- 自产食材占比(自种+自养数量 / 总食材数,如 42%)
|
||||
- 异常待处理数(检测不合格 + 链路断裂 + 数据缺失)
|
||||
- 可选:今日已完成溯源链路数
|
||||
|
||||
**中部双列布局:**
|
||||
- 左:近 7 天溯源趋势折线图(溯源覆盖率 + 合格率双曲线)
|
||||
- 右:食材来源分布饼图(自产种植 / 自产养殖 / 外采占比)
|
||||
|
||||
**底部:**
|
||||
- 近期异常事件列表(检测不合格的食材、链路中断记录、溯源码异常等)
|
||||
- 快捷入口卡片(跳转餐品查询、食材查询、链路可视化)
|
||||
|
||||
### 2.2 重构:餐品溯源查询(trace-query)
|
||||
|
||||
**核心改动:修正数据粒度为纯餐品级,食材信息下沉到展开行。**
|
||||
|
||||
表格列重设计:
|
||||
|
||||
| 餐品溯源码 | 菜品名称 | 就餐日期 | 餐次 | 食材数量 | 来源组成 | 检测结论 | 烹制厨师 | 上餐时间 | 操作 |
|
||||
|---|---|---|---|---|---|---|---|---|---|
|
||||
| TR-20260422-001 | 宫保鸡丁 | 2026-04-22 | 午餐 | 4种 | 自种2 外采2 | 全部合格 | 张厨师 | 11:30 | 展开 \| 查看链路 |
|
||||
|
||||
关键变化:
|
||||
- **删除**原来的"来源类型""产地/供应商""种植/养殖批次"(食材级信息不应出现在餐品级表中)
|
||||
- **新增**"食材数量"列 + "来源组成"列(标签组合展示,如 `自种×2 外采×2`)
|
||||
- **新增**"展开"操作:点击后在行下方展开食材子表
|
||||
|
||||
**展开后的食材子表示意:**
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────────────────────────────────┐
|
||||
│ 🥩 鸡胸肉 8.5kg 外采 鲜肉直供 批次:JXRJ-.. 检测:合格 │
|
||||
│ 🥜 花生 1.2kg 外采 华盛干货 批次:HS-.. 检测:合格 │
|
||||
│ 🌶️ 辣椒 0.8kg 自种 南郊基地 批次:LJ-.. 检测:合格 │
|
||||
│ 🧄 葱姜蒜 0.5kg 自种 南郊基地 批次:CJS-.. 检测:合格 │
|
||||
└─────────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
**筛选栏补充:**
|
||||
- 新增"餐次"筛选(早餐/午餐/晚餐/加餐)
|
||||
- "就餐日期"改为日期范围选择(默认今天)
|
||||
- 新增"食堂"筛选(对应多食堂场景)
|
||||
|
||||
### 2.3 新增:食材溯源查询(trace-ingredient)
|
||||
|
||||
**独立的食材维度查询页**,从 trace-timeline 的"食材维度 Tab"中抽离为完整页面。
|
||||
|
||||
表格列设计:
|
||||
|
||||
| 食材溯源码 | 食材名称 | 来源类型 | 产地/供应商 | 入库日期 | 入库量 | 剩余库存 | 关联菜品数 | 检测结论 | 操作 |
|
||||
|---|---|---|---|---|---|---|---|---|---|
|
||||
| ST-EX-XR01-MT-... | 鸡胸肉 | 外采 | 鲜肉直供公司 | 04-15 | 80kg | 32kg | 4道 | 合格 | 查看链路 \| 关联菜品 |
|
||||
|
||||
页面价值:
|
||||
- 追踪**一批食材被分配到了哪些菜品**(正向追溯)
|
||||
- 检测不合格时快速定位**受影响的所有菜品和订单**(反向召回)
|
||||
- 解决了 trace-query 中食材信息被压缩的问题
|
||||
|
||||
### 2.4 优化:链路可视化(trace-timeline)
|
||||
|
||||
**优化点 1:14 个节点太拥挤 → 分段折叠**
|
||||
|
||||
将 19 种节点归类为 5 个阶段,默认展示阶段概要,点击展开看细节:
|
||||
|
||||
```
|
||||
[采供阶段] ────→ [存储阶段] ────→ [加工阶段] ────→ [烹制上餐] ────→ [餐后追踪]
|
||||
采供入库 毛菜入库 净菜加工 按单烹制 余量处置
|
||||
卫生检测 毛菜存储 净菜入库 上餐监控 营养检验
|
||||
净菜内供 用户取餐
|
||||
净菜进柜
|
||||
净菜组配
|
||||
```
|
||||
|
||||
每个阶段用"超级节点"表示(阶段名 + 节点数 + 整体状态),点击展开该阶段详细节点管道。
|
||||
|
||||
**优化点 2:分支角标看不懂 → 分支卡片列表**
|
||||
|
||||
点击分支节点时,详情区域从单卡片改为**分支卡片列表**,每条分支单独一张卡片,标注分支走向(如"→ 宫保鸡丁""→ 辣子鸡"),用颜色/线条标注"当前追踪的是哪条分支"。
|
||||
|
||||
**优化点 3:食材维度数据不完整**
|
||||
|
||||
- 提供食材搜索框,支持按食材名称/溯源码搜索
|
||||
- 展示该食材的完整溯源链路(从源头到所有去向菜品)
|
||||
- 或者:将食材维度移到 trace-ingredient 页面,trace-timeline 专注餐品维度
|
||||
|
||||
### 2.5 可选新增:溯源码管理(trace-code)
|
||||
|
||||
管理溯源码的编码规则、前缀配置、批次规则等系统配置页面。当前溯源码格式 `ST-{来源}-{供应商编号}-{分类}-{品名}-{重量}-{日期}-{序号}` 是隐含在数据中的,如果需要运维人员管理这些规则,可以做一个配置页。优先级较低。
|
||||
|
||||
---
|
||||
|
||||
## 三、与文档 8.5 节已有建议的关系
|
||||
|
||||
文档 8.5 节的 8 条建议(导出筛选结果、快速预览浮层、PDF报告导出、数据一致性检查、视频播放器、食材历史链路、缩略图导航、分支收敛可视化)属于**细节优化**,可以在重构后的新页面中一并实现。但如果不先解决数据粒度混乱和模块定位不清的根本问题,单独做那些优化效果有限。
|
||||
|
||||
---
|
||||
|
||||
## 四、优先级
|
||||
|
||||
| 优先级 | 页面 | 工作量 | 理由 |
|
||||
|--------|------|--------|------|
|
||||
| P0 | trace-dashboard 新建 | 中 | 模块入口必须有总览 |
|
||||
| P0 | trace-query 重构 | 中 | 数据粒度问题是硬伤 |
|
||||
| P1 | trace-ingredient 新建 | 中 | 食材维度是溯源核心能力 |
|
||||
| P1 | trace-timeline 优化 | 大 | 可视化体验提升 |
|
||||
| P2 | trace-code 新建 | 小 | 系统配置,可后期补 |
|
||||
@@ -122,6 +122,10 @@ textarea.form-control{height:auto;padding:8px 12px;resize:vertical;min-height:60
|
||||
.drawer-field{display:flex;flex-direction:column;gap:2px;}
|
||||
.drawer-field__label{font-size:var(--font-xs);color:var(--text-placeholder);}
|
||||
.drawer-field__value{font-size:var(--font-sm);color:var(--text-primary);font-weight:500;min-height:22px;}
|
||||
/* 食材明细表格(抽屉内) */
|
||||
.ing-detail-table{width:100%;border-collapse:collapse;margin-top:8px;}
|
||||
.ing-detail-table th{background:#FAFAFA;padding:8px 12px;text-align:left;font-size:var(--font-xs);color:var(--text-secondary);font-weight:500;border:1px solid var(--border);}
|
||||
.ing-detail-table td{padding:6px 12px;font-size:var(--font-sm);color:var(--text-primary);border:1px solid var(--border);}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -206,17 +210,17 @@ textarea.form-control{height:auto;padding:8px 12px;resize:vertical;min-height:60
|
||||
<div class="table-card__content">
|
||||
<table>
|
||||
<thead><tr>
|
||||
<th>订单号</th><th>溯源码</th><th>客户名称</th><th>净菜类型</th><th>净菜/餐品</th><th>包装规格</th><th>售卖份数</th><th>计量(kg)</th><th>单价(元/kg)</th><th>小计金额</th><th>出库区域</th><th>下单时间</th><th>物流单号</th><th>订单状态</th><th>操作</th>
|
||||
<th>订单号</th><th>客户名称</th><th>净菜类型</th><th>净菜/餐品</th><th>包装规格</th><th>售卖份数</th><th>计量(kg)</th><th>单价(元/kg)</th><th>小计金额</th><th>下单时间</th><th>物流单号</th><th>订单状态</th><th>操作</th>
|
||||
</tr></thead>
|
||||
<tbody>
|
||||
<tr><td>EXT-001</td><td>NC-INT-BOCA-20260422-01</td><td>社区便民超市</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>土豆(土豆丝)</td><td>5kg/箱</td><td>10</td><td>50</td><td>¥3.5</td><td>¥175</td><td>A仓-蔬菜区-01</td><td>2026-04-22 08:00</td><td>SF1234567890</td><td><span class="tag tag-green">已完成</span></td><td class="td-actions"><span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-001</td><td>NC-INT-HLUB-20260422-01</td><td>社区便民超市</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>土豆(土豆块)</td><td>5kg/箱</td><td>6</td><td>30</td><td>¥3.5</td><td>¥105</td><td>A仓-蔬菜区-03</td><td>2026-04-22 08:00</td><td>SF1234567890</td><td><span class="tag tag-green">已完成</span></td><td class="td-actions"><span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-002</td><td>NC-INT-ZLRJ-20260422-01</td><td>周边餐饮企业</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>净猪里脊</td><td>1kg/箱</td><td>5</td><td>50</td><td>¥28</td><td>¥1,400</td><td>B仓-肉类区-01</td><td>2026-04-22 09:30</td><td>SF9876543210</td><td><span class="tag tag-blue">配送中</span></td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReceiveConfirm(this)">确认收货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-003</td><td>NC-INT-JXRJ-20260422-01</td><td>周边餐饮企业</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>宫保鸡丁</td><td>标准份(500g)</td><td>40</td><td>20</td><td>¥12</td><td>¥240</td><td>B仓-肉类区-02</td><td>2026-04-22 09:30</td><td>SF9876543210</td><td><span class="tag tag-blue">配送中</span></td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReceiveConfirm(this)">确认收货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-004</td><td>NC-INT-BCAI-20260422-01</td><td>学校食堂</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>鸡肉(鸡肉块)</td><td>1kg/箱</td><td>6</td><td>60</td><td>¥2.0</td><td>¥120</td><td>A仓-蔬菜区-02</td><td>2026-04-22 10:00</td><td>—</td><td><span class="tag tag-orange">待配送</span></td><td class="td-actions"><span class="link" style="color:var(--primary)" onclick="openShipModal('EXT-004')">立即发货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-004</td><td>NC-INT-XLHU-20260422-01</td><td>学校食堂</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>净西兰花</td><td>5kg/箱</td><td>8</td><td>40</td><td>¥4.5</td><td>¥180</td><td>A仓-蔬菜区-04</td><td>2026-04-22 10:00</td><td>—</td><td><span class="tag tag-orange">待配送</span></td><td class="td-actions"><span class="link" style="color:var(--primary)" onclick="openShipModal('EXT-004')">立即发货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-005</td><td>NC-INT-QZYU-20260422-01</td><td>职工家属区团购</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>清蒸鱼</td><td>标准份(500g)</td><td>20</td><td>10</td><td>¥15</td><td>¥150</td><td>C仓-水产区-01</td><td>2026-04-22 10:30</td><td>—</td><td><span class="tag tag-gray">备货中</span></td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReadyConfirm(this)">备货完成</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-006</td><td>NC-INT-SRBC-20260422-01</td><td>职工家属区团购</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>蒜蓉菠菜</td><td>标准份(500g)</td><td>30</td><td>15</td><td>¥8</td><td>¥120</td><td>A仓-蔬菜区-01</td><td>2026-04-22 10:30</td><td>—</td><td><span class="tag tag-gray">备货中</span></td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReadyConfirm(this)">备货完成</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-001</td><td>社区便民超市</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>土豆(土豆丝)</td><td>5kg/箱</td><td>10</td><td>50</td><td>¥3.5</td><td>¥175</td><td>2026-04-22 08:00</td><td>SF1234567890</td><td><span class="tag tag-green">已完成</span></td><td class="td-actions"><span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-001</td><td>社区便民超市</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>土豆(土豆块)</td><td>5kg/箱</td><td>6</td><td>30</td><td>¥3.5</td><td>¥105</td><td>2026-04-22 08:00</td><td>SF1234567890</td><td><span class="tag tag-green">已完成</span></td><td class="td-actions"><span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-002</td><td>周边餐饮企业</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>净猪里脊</td><td>1kg/箱</td><td>5</td><td>50</td><td>¥28</td><td>¥1,400</td><td>2026-04-22 09:30</td><td>SF9876543210</td><td><span class="tag tag-blue">配送中</span></td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReceiveConfirm(this)">确认收货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-003</td><td>周边餐饮企业</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>宫保鸡丁</td><td>标准份(500g)</td><td>40</td><td>20</td><td>¥12</td><td>¥240</td><td>2026-04-22 09:30</td><td>SF9876543210</td><td><span class="tag tag-blue">配送中</span></td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReceiveConfirm(this)">确认收货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-004</td><td>学校食堂</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>鸡肉(鸡肉块)</td><td>1kg/箱</td><td>6</td><td>60</td><td>¥2.0</td><td>¥120</td><td>2026-04-22 10:00</td><td>—</td><td><span class="tag tag-orange">待配送</span></td><td class="td-actions"><span class="link" style="color:var(--primary)" onclick="openShipModal('EXT-004')">立即发货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-004</td><td>学校食堂</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>净西兰花</td><td>5kg/箱</td><td>8</td><td>40</td><td>¥4.5</td><td>¥180</td><td>2026-04-22 10:00</td><td>—</td><td><span class="tag tag-orange">待配送</span></td><td class="td-actions"><span class="link" style="color:var(--primary)" onclick="openShipModal('EXT-004')">立即发货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-005</td><td>职工家属区团购</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>清蒸鱼</td><td>标准份(500g)</td><td>20</td><td>10</td><td>¥15</td><td>¥150</td><td>2026-04-22 10:30</td><td>—</td><td><span class="tag tag-gray">备货中</span></td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReadyConfirm(this)">备货完成</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>EXT-006</td><td>职工家属区团购</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>蒜蓉菠菜</td><td>标准份(500g)</td><td>30</td><td>15</td><td>¥8</td><td>¥120</td><td>2026-04-22 10:30</td><td>—</td><td><span class="tag tag-gray">备货中</span></td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReadyConfirm(this)">备货完成</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@@ -239,44 +243,15 @@ textarea.form-control{height:auto;padding:8px 12px;resize:vertical;min-height:60
|
||||
</div>
|
||||
<div class="modal__body">
|
||||
<div class="form-grid">
|
||||
<div class="form-group">
|
||||
<label class="form-label">溯源码<span class="required">*</span></label>
|
||||
<input class="form-control" id="orderTraceCode" placeholder="请输入溯源码">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">客户名称<span class="required">*</span></label>
|
||||
<select class="form-control" id="orderCustomer">
|
||||
<option value="">请选择客户</option>
|
||||
<option>社区便民超市</option>
|
||||
<option>周边餐饮企业</option>
|
||||
<option>学校食堂</option>
|
||||
<option>职工家属区团购</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">净菜类型<span class="required">*</span></label>
|
||||
<select class="form-control" id="orderType" onchange="toggleOrderName()">
|
||||
<select class="form-control" id="orderType">
|
||||
<option value="">请选择</option>
|
||||
<option value="nc">净菜包</option>
|
||||
<option value="cp">餐品净菜包</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">联系人</label>
|
||||
<input class="form-control" placeholder="请输入联系人姓名">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">联系电话</label>
|
||||
<input class="form-control" placeholder="请输入联系电话">
|
||||
</div>
|
||||
<div class="form-group full">
|
||||
<label class="form-label">收货地址</label>
|
||||
<input class="form-control" placeholder="请输入收货地址">
|
||||
</div>
|
||||
|
||||
<hr class="form-divider">
|
||||
|
||||
<div class="form-group" id="orderNameNC">
|
||||
<label class="form-label">净菜名称<span class="required">*</span></label>
|
||||
<select class="form-control" id="orderItem" onchange="onItemChange()">
|
||||
<option value="">请选择净菜</option>
|
||||
@@ -288,23 +263,34 @@ textarea.form-control{height:auto;padding:8px 12px;resize:vertical;min-height:60
|
||||
<option value="净胡萝卜" data-price="4.0" data-pkg="5kg/箱">净胡萝卜</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group" id="orderNameCP" style="display:none;">
|
||||
<label class="form-label">餐品名称<span class="required">*</span></label>
|
||||
<select class="form-control" id="orderItemCP" onchange="onItemChange()">
|
||||
<option value="">请选择餐品</option>
|
||||
<option value="宫保鸡丁" data-price="12" data-pkg="标准份(500g)">宫保鸡丁</option>
|
||||
<option value="清蒸鱼" data-price="15" data-pkg="标准份(500g)">清蒸鱼</option>
|
||||
<option value="蒜蓉菠菜" data-price="8" data-pkg="标准份(500g)">蒜蓉菠菜</option>
|
||||
<option value="炒胡萝卜" data-price="6" data-pkg="大份(800g)">炒胡萝卜</option>
|
||||
<option value="红烧排骨" data-price="25" data-pkg="标准份(500g)">红烧排骨</option>
|
||||
<div class="form-group">
|
||||
<label class="form-label">包装批次号</label>
|
||||
<select class="form-control" id="orderBatchSelect" onchange="onOrderBatchChange(this.value)">
|
||||
<option value="">请选择批次号(选填)</option>
|
||||
<option>BATCH-DH-20260415-01</option>
|
||||
<option>BATCH-DH-20260415-02</option>
|
||||
<option>BATCH-DH-20260415-03</option>
|
||||
<option>BATCH-DH-20260415-04</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group full" id="orderBatchInfoPanel" style="display:none;">
|
||||
<label class="form-label">批次包装信息</label>
|
||||
<div style="background:#FAFAFA;border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 16px;">
|
||||
<div style="display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;font-size:var(--font-sm);">
|
||||
<div><span style="color:var(--text-secondary);">包装餐品:</span><span id="obDish" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装规格:</span><span id="obSpec" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装方式:</span><span id="obMethod" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装份数:</span><span id="obQty" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装日期:</span><span id="obDate" style="font-weight:500;"></span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">包装规格</label>
|
||||
<input class="form-control" id="orderPkg" readonly placeholder="选择净菜后自动填充">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">申领份数<span class="required">*</span></label>
|
||||
<label class="form-label">售卖份数<span class="required">*</span></label>
|
||||
<input class="form-control" id="orderQty" type="number" min="1" value="1" oninput="calcOrder()">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
@@ -319,16 +305,24 @@ textarea.form-control{height:auto;padding:8px 12px;resize:vertical;min-height:60
|
||||
<label class="form-label">小计金额</label>
|
||||
<input class="form-control" id="orderSubtotal" readonly placeholder="自动计算">
|
||||
</div>
|
||||
|
||||
<hr class="form-divider">
|
||||
|
||||
<div class="form-group">
|
||||
<label class="form-label">出库区域<span class="required">*</span></label>
|
||||
<select class="form-control" id="orderArea">
|
||||
<option value="">请选择出库区域</option>
|
||||
<option>A仓-蔬菜区-01</option>
|
||||
<option>A仓-蔬菜区-02</option>
|
||||
<option>A仓-蔬菜区-03</option>
|
||||
<option>A仓-蔬菜区-04</option>
|
||||
<option>B仓-肉类区-01</option>
|
||||
</select>
|
||||
<label class="form-label">客户名称<span class="required">*</span></label>
|
||||
<input class="form-control" id="orderCustomer" placeholder="请输入客户名称">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">联系人</label>
|
||||
<input class="form-control" placeholder="请输入联系人姓名">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">联系电话</label>
|
||||
<input class="form-control" placeholder="请输入联系电话">
|
||||
</div>
|
||||
<div class="form-group full">
|
||||
<label class="form-label">收货地址</label>
|
||||
<input class="form-control" placeholder="请输入收货地址">
|
||||
</div>
|
||||
|
||||
<hr class="form-divider">
|
||||
@@ -402,27 +396,81 @@ textarea.form-control{height:auto;padding:8px 12px;resize:vertical;min-height:60
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 备货完成二次确认弹窗 -->
|
||||
<!-- 备货完成弹窗(补全备货信息) -->
|
||||
<div class="modal-mask" id="readyModal">
|
||||
<div class="modal" style="width:420px;">
|
||||
<div class="modal" style="width:520px;">
|
||||
<div class="modal__header">
|
||||
<div class="modal__title">确认备货完成</div>
|
||||
<div class="modal__title">补全备货信息</div>
|
||||
<button class="modal__close" onclick="closeReadyConfirm()">×</button>
|
||||
</div>
|
||||
<div class="modal__body" style="text-align:center;padding:32px 24px;">
|
||||
<div style="font-size:40px;margin-bottom:12px;">📦</div>
|
||||
<p style="font-size:15px;color:#333;font-weight:600;margin-bottom:8px;">确认订单 <span id="readyOrderNo"></span> 已备货完成?</p>
|
||||
<p style="font-size:13px;color:#999;line-height:1.6;">净菜/餐品:<span id="readyFoodName" style="color:#333;font-weight:500;"></span><br>确认后订单状态将变为「待配送」</p>
|
||||
<div class="modal__body">
|
||||
<div style="background:var(--primary-light);border-radius:var(--radius-md);padding:12px 16px;margin-bottom:20px;font-size:var(--font-sm);color:var(--primary);display:flex;align-items:center;gap:8px;">
|
||||
<span style="font-size:16px;">📋</span>
|
||||
<span>订单号:<strong id="readyOrderNo"></strong> | 净菜/餐品:<strong id="readyFoodName"></strong></span>
|
||||
</div>
|
||||
<div class="form-grid" style="grid-template-columns:1fr;">
|
||||
<div class="form-group">
|
||||
<label class="form-label">包装批次号<span class="required">*</span></label>
|
||||
<select class="form-control" id="readyBatchSelect" onchange="onReadyBatchChange(this.value)">
|
||||
<option value="">请选择批次号</option>
|
||||
<option>BATCH-DH-20260415-01</option>
|
||||
<option>BATCH-DH-20260415-02</option>
|
||||
<option>BATCH-DH-20260415-03</option>
|
||||
<option>BATCH-DH-20260415-04</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group" id="readyBatchInfoPanel" style="display:none;">
|
||||
<label class="form-label">批次包装信息</label>
|
||||
<div style="background:#FAFAFA;border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 16px;">
|
||||
<div style="display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;font-size:var(--font-sm);">
|
||||
<div><span style="color:var(--text-secondary);">包装餐品:</span><span id="readyBatchDish" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装规格:</span><span id="readyBatchSpec" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装方式:</span><span id="readyBatchMethod" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装份数:</span><span id="readyBatchQty" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装日期:</span><span id="readyBatchDate" style="font-weight:500;"></span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p style="font-size:var(--font-xs);color:var(--text-placeholder);margin-top:12px;">选择包装批次号后,订单状态将变为「待配送」</p>
|
||||
</div>
|
||||
<div class="modal__footer" style="justify-content:center;">
|
||||
<div class="modal__footer">
|
||||
<button class="btn btn-default" onclick="closeReadyConfirm()">取消</button>
|
||||
<button class="btn btn-primary" style="background:var(--success);" onclick="doReady()">确认完成</button>
|
||||
<button class="btn btn-primary" onclick="doReady()">确认备货完成</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
/* 新建订单弹窗 */
|
||||
/* ========== 数据 ========== */
|
||||
var batchInfo={
|
||||
'BATCH-DH-20260415-01':{dish:'宫保鸡丁',spec:'标准份(500g)',method:'冷鲜袋',qty:'10',date:'2026-04-15'},
|
||||
'BATCH-DH-20260415-02':{dish:'清蒸鱼',spec:'标准份(500g)',method:'保鲜盒',qty:'8',date:'2026-04-15'},
|
||||
'BATCH-DH-20260415-03':{dish:'蒜蓉菠菜',spec:'标准份(500g)',method:'冷鲜袋',qty:'12',date:'2026-04-15'},
|
||||
'BATCH-DH-20260415-04':{dish:'炒胡萝卜',spec:'大份(800g)',method:'保鲜盒',qty:'6',date:'2026-04-15'}
|
||||
};
|
||||
var dishIngredients={
|
||||
'宫保鸡丁':[{trace:'NC-PROC-JXR-20260415-01',name:'鸡胸肉',type:'主材',amount:'120g'},{trace:'NC-PROC-HUS-20260415-01',name:'花生',type:'辅材',amount:'20g'},{trace:'NC-PROC-GLJ-20260415-01',name:'干辣椒',type:'调料',amount:'5g'}],
|
||||
'清蒸鱼':[{trace:'NC-PROC-CYU-20260415-01',name:'草鱼',type:'主材',amount:'100g'},{trace:'NC-PROC-JPN-20260415-01',name:'姜片',type:'调料',amount:'适量'}],
|
||||
'蒜蓉菠菜':[{trace:'NC-PROC-BOC-20260415-01',name:'净菠菜',type:'主材',amount:'120g'},{trace:'NC-PROC-DSN-20260415-01',name:'大蒜',type:'调料',amount:'8g'}],
|
||||
'炒胡萝卜':[{trace:'NC-PROC-HLB-20260415-01',name:'净胡萝卜',type:'主材',amount:'260g'},{trace:'NC-PROC-CJG-20260415-01',name:'葱姜',type:'调料',amount:'适量'}]
|
||||
};
|
||||
var dishBatch={
|
||||
'宫保鸡丁':'BATCH-DH-20260415-01',
|
||||
'清蒸鱼':'BATCH-DH-20260415-02',
|
||||
'蒜蓉菠菜':'BATCH-DH-20260415-03',
|
||||
'炒胡萝卜':'BATCH-DH-20260415-04'
|
||||
};
|
||||
var traceMap={
|
||||
'净菠菜':'NC-PROC-BOC-20260415-01',
|
||||
'净胡萝卜':'NC-PROC-HLB-20260415-01',
|
||||
'净土豆丝':'NC-PROC-TDS-20260415-01',
|
||||
'净西兰花':'NC-PROC-XLH-20260415-01',
|
||||
'净白菜':'NC-PROC-BCA-20260415-01',
|
||||
'净黄瓜':'NC-PROC-HGU-20260415-01'
|
||||
};
|
||||
|
||||
/* ========== 新建订单弹窗 ========== */
|
||||
function openCreateOrder(){
|
||||
document.getElementById('createOrderModal').classList.add('show');
|
||||
}
|
||||
@@ -433,17 +481,23 @@ document.getElementById('createOrderModal').addEventListener('click',function(e)
|
||||
if(e.target===this) closeCreateOrder();
|
||||
});
|
||||
|
||||
/* 净菜类型切换:显示净菜名称或餐品名称 */
|
||||
function toggleOrderName(){
|
||||
var v=document.getElementById('orderType').value;
|
||||
document.getElementById('orderNameNC').style.display=(v==='cp'?'none':'block');
|
||||
document.getElementById('orderNameCP').style.display=(v==='cp'?'block':'none');
|
||||
/* 选择批次号后回显包装信息 */
|
||||
function onOrderBatchChange(val){
|
||||
var panel=document.getElementById('orderBatchInfoPanel');
|
||||
if(!val){panel.style.display='none';return;}
|
||||
var info=batchInfo[val];
|
||||
if(!info){panel.style.display='none';return;}
|
||||
document.getElementById('obDish').textContent=info.dish;
|
||||
document.getElementById('obSpec').textContent=info.spec;
|
||||
document.getElementById('obMethod').textContent=info.method;
|
||||
document.getElementById('obQty').textContent=info.qty;
|
||||
document.getElementById('obDate').textContent=info.date;
|
||||
panel.style.display='grid';
|
||||
}
|
||||
|
||||
/* 选择净菜后自动填充包装规格并计算 */
|
||||
function onItemChange(){
|
||||
var typeVal=document.getElementById('orderType').value;
|
||||
var sel=typeVal==='cp'?document.getElementById('orderItemCP'):document.getElementById('orderItem');
|
||||
var sel=document.getElementById('orderItem');
|
||||
var opt=sel.options[sel.selectedIndex];
|
||||
var pkg=opt.getAttribute('data-pkg')||'';
|
||||
document.getElementById('orderPkg').value=pkg;
|
||||
@@ -466,21 +520,19 @@ function calcOrder(){
|
||||
|
||||
/* 提交订单 */
|
||||
function submitOrder(){
|
||||
var traceCode=document.getElementById('orderTraceCode').value.trim();
|
||||
if(!traceCode){alert('请输入溯源码');return;}
|
||||
var customer=document.getElementById('orderCustomer').value;
|
||||
if(!customer){alert('请选择客户名称');return;}
|
||||
var typeVal=document.getElementById('orderType').value;
|
||||
if(!typeVal){alert('请选择净菜类型');return;}
|
||||
var item=document.getElementById('orderItem').value;
|
||||
if(!item){alert('请选择净菜名称');return;}
|
||||
var price=document.getElementById('orderPrice').value;
|
||||
if(!price){alert('请输入单价');return;}
|
||||
var area=document.getElementById('orderArea').value;
|
||||
if(!area){alert('请选择出库区域');return;}
|
||||
var customer=document.getElementById('orderCustomer').value.trim();
|
||||
if(!customer){alert('请输入客户名称');return;}
|
||||
alert('订单提交成功!');
|
||||
closeCreateOrder();
|
||||
}
|
||||
|
||||
/* 发货确认弹窗 */
|
||||
/* ========== 发货确认弹窗 ========== */
|
||||
function openShipModal(orderNo){
|
||||
document.getElementById('shipOrderNo').value=orderNo;
|
||||
document.getElementById('shipCompany').value='';
|
||||
@@ -502,12 +554,12 @@ function confirmShip(){
|
||||
closeShipModal();
|
||||
}
|
||||
|
||||
/* 确认收货 */
|
||||
/* ========== 确认收货 ========== */
|
||||
function openReceiveConfirm(el){
|
||||
var tr=el.closest('tr');
|
||||
var tds=tr.querySelectorAll('td');
|
||||
document.getElementById('receiveOrderNo').textContent=tds[0].textContent;
|
||||
document.getElementById('receiveFoodName').textContent=tds[4].textContent;
|
||||
document.getElementById('receiveFoodName').textContent=tds[3].textContent;
|
||||
document.getElementById('receiveModal').classList.add('show');
|
||||
}
|
||||
function closeReceiveConfirm(){document.getElementById('receiveModal').classList.remove('show');}
|
||||
@@ -517,22 +569,39 @@ function doReceive(){
|
||||
alert('收货确认成功,订单状态已变为「已完成」');
|
||||
}
|
||||
|
||||
/* 备货完成 */
|
||||
/* ========== 备货完成 — 补全备货信息 ========== */
|
||||
function openReadyConfirm(el){
|
||||
var tr=el.closest('tr');
|
||||
var tds=tr.querySelectorAll('td');
|
||||
document.getElementById('readyOrderNo').textContent=tds[0].textContent;
|
||||
document.getElementById('readyFoodName').textContent=tds[4].textContent;
|
||||
document.getElementById('readyFoodName').textContent=tds[3].textContent;
|
||||
// 重置批次选择和面板
|
||||
document.getElementById('readyBatchSelect').selectedIndex=0;
|
||||
document.getElementById('readyBatchInfoPanel').style.display='none';
|
||||
document.getElementById('readyModal').classList.add('show');
|
||||
}
|
||||
function closeReadyConfirm(){document.getElementById('readyModal').classList.remove('show');}
|
||||
document.getElementById('readyModal').addEventListener('click',function(e){if(e.target===this)closeReadyConfirm();});
|
||||
function onReadyBatchChange(val){
|
||||
var panel=document.getElementById('readyBatchInfoPanel');
|
||||
if(!val){panel.style.display='none';return;}
|
||||
var info=batchInfo[val];
|
||||
if(!info){panel.style.display='none';return;}
|
||||
document.getElementById('readyBatchDish').textContent=info.dish;
|
||||
document.getElementById('readyBatchSpec').textContent=info.spec;
|
||||
document.getElementById('readyBatchMethod').textContent=info.method;
|
||||
document.getElementById('readyBatchQty').textContent=info.qty;
|
||||
document.getElementById('readyBatchDate').textContent=info.date;
|
||||
panel.style.display='block';
|
||||
}
|
||||
function doReady(){
|
||||
var batch=document.getElementById('readyBatchSelect').value;
|
||||
if(!batch){alert('请选择包装批次号');return;}
|
||||
closeReadyConfirm();
|
||||
alert('备货已确认完成,订单状态已变为「待配送」');
|
||||
alert('备货信息已补全,订单状态已变为「待配送」\n包装批次号:'+batch);
|
||||
}
|
||||
|
||||
/* 右侧抽屉组件 */
|
||||
/* ========== 右侧抽屉组件 ========== */
|
||||
var Drawer={
|
||||
open:function(title,bodyHtml){
|
||||
this.close();
|
||||
@@ -550,17 +619,63 @@ var Drawer={
|
||||
}
|
||||
};
|
||||
|
||||
/* 详情抽屉 */
|
||||
/* ========== 详情抽屉(按净菜类型定制渲染) ========== */
|
||||
function showDetail(el){
|
||||
var tr=el.closest('tr');
|
||||
var ths=tr.closest('table').querySelectorAll('thead th');
|
||||
var tds=tr.querySelectorAll('td');
|
||||
var orderNo=tds[0].textContent;
|
||||
var orderNo=tds[0].textContent.trim();
|
||||
var customer=tds[1].textContent.trim();
|
||||
var ncType=tds[2].textContent.trim();
|
||||
var foodName=tds[3].textContent.trim();
|
||||
var pkg=tds[4].textContent.trim();
|
||||
var qty=tds[5].textContent.trim();
|
||||
var weight=tds[6].textContent.trim();
|
||||
var price=tds[7].textContent.trim();
|
||||
var subtotal=tds[8].textContent.trim();
|
||||
var orderTime=tds[9].textContent.trim();
|
||||
var logistics=tds[10].textContent.trim();
|
||||
var status=tds[11].innerHTML;
|
||||
|
||||
var html='<div class="drawer-section"><div class="drawer-section__title">订单信息</div><div class="drawer-fields">';
|
||||
for(var i=0;i<ths.length-1;i++){
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">'+ths[i].textContent+'</div><div class="drawer-field__value">'+tds[i].innerHTML+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">订单号</div><div class="drawer-field__value">'+orderNo+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">客户名称</div><div class="drawer-field__value">'+customer+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">净菜类型</div><div class="drawer-field__value">'+ncType+'</div></div>';
|
||||
|
||||
/* 根据净菜类型定制显示(去除 emoji 前缀影响) */
|
||||
var isCP=ncType.indexOf('餐品净菜包')!==-1;
|
||||
if(isCP){
|
||||
var batchNo=dishBatch[foodName]||'—';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">包装批次号</div><div class="drawer-field__value">'+batchNo+'</div></div>';
|
||||
}else{
|
||||
var trace=traceMap[foodName]||'—';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">溯源码</div><div class="drawer-field__value">'+trace+'</div></div>';
|
||||
}
|
||||
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">净菜/餐品</div><div class="drawer-field__value">'+foodName+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">包装规格</div><div class="drawer-field__value">'+pkg+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">售卖份数</div><div class="drawer-field__value">'+qty+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">计量(kg)</div><div class="drawer-field__value">'+weight+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">单价(元/kg)</div><div class="drawer-field__value">'+price+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">小计金额</div><div class="drawer-field__value">'+subtotal+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">下单时间</div><div class="drawer-field__value">'+orderTime+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">物流单号</div><div class="drawer-field__value">'+logistics+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">订单状态</div><div class="drawer-field__value">'+status+'</div></div>';
|
||||
html+='</div></div>';
|
||||
|
||||
/* 餐品净菜包显示净菜包明细 */
|
||||
if(isCP){
|
||||
var ings=dishIngredients[foodName];
|
||||
if(ings&&ings.length){
|
||||
html+='<div class="drawer-section"><div class="drawer-section__title">净菜包明细</div>';
|
||||
html+='<table class="ing-detail-table"><thead><tr><th>食材溯源码</th><th>食材名称</th><th>分类</th><th>每份用量</th></tr></thead><tbody>';
|
||||
for(var i=0;i<ings.length;i++){
|
||||
var tagClass=ings[i].type==='主材'?'tag-blue':ings[i].type==='辅材'?'tag-green':'tag-orange';
|
||||
html+='<tr><td>'+ings[i].trace+'</td><td>'+ings[i].name+'</td><td><span class="status-tag '+tagClass+'">'+ings[i].type+'</span></td><td>'+ings[i].amount+'</td></tr>';
|
||||
}
|
||||
html+='</tbody></table></div>';
|
||||
}
|
||||
}
|
||||
|
||||
Drawer.open('外售详情 — '+orderNo, html);
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -117,6 +117,10 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
.drawer-field{display:flex;flex-direction:column;gap:2px;}
|
||||
.drawer-field__label{font-size:var(--font-xs);color:var(--text-placeholder);}
|
||||
.drawer-field__value{font-size:var(--font-sm);color:var(--text-primary);font-weight:500;min-height:22px;}
|
||||
/* 食材明细表格(抽屉内) */
|
||||
.ing-detail-table{width:100%;border-collapse:collapse;margin-top:8px;}
|
||||
.ing-detail-table th{background:#FAFAFA;padding:8px 12px;text-align:left;font-size:var(--font-xs);color:var(--text-secondary);font-weight:500;border:1px solid var(--border);}
|
||||
.ing-detail-table td{padding:6px 12px;font-size:var(--font-sm);color:var(--text-primary);border:1px solid var(--border);}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -183,17 +187,17 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
<div class="table-card__content">
|
||||
<table>
|
||||
<thead><tr>
|
||||
<th>申领单号</th><th>溯源码</th><th>申领食堂</th><th>净菜类型</th><th>净菜/餐品</th><th>包装规格</th><th>申领份数</th><th>申领数量(kg)</th><th>订单状态</th><th>关联仓库区域</th><th>申领时间</th><th>预定配送时间</th><th>配送人</th><th>操作</th>
|
||||
<th>申领单号</th><th>申领食堂</th><th>净菜类型</th><th>净菜/餐品</th><th>包装规格</th><th>申领份数</th><th>申领数量(kg)</th><th>订单状态</th><th>申领时间</th><th>预定配送时间</th><th>配送人</th><th>操作</th>
|
||||
</tr></thead>
|
||||
<tbody>
|
||||
<tr><td>INT-001</td><td>NC-INT-BOCA-20260422-01</td><td>一号食堂厨房</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>菠菜</td><td>500g/袋</td><td>50</td><td>25</td><td><span class="tag tag-green">已完成</span></td><td>A仓-蔬菜区-01</td><td>2026-04-22 07:30</td><td>2026-04-22 09:00</td><td>李配送</td><td class="td-actions"><span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-001</td><td>NC-INT-BCAI-20260422-01</td><td>一号食堂厨房</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>玉米(玉米粒)</td><td>1kg/盒</td><td>20</td><td>20</td><td><span class="tag tag-green">已完成</span></td><td>A仓-蔬菜区-02</td><td>2026-04-22 07:30</td><td>2026-04-22 09:00</td><td>李配送</td><td class="td-actions"><span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-002</td><td>NC-INT-ZLRJ-20260422-01</td><td>二号食堂厨房</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>猪排骨</td><td>2kg/盘</td><td>20</td><td>40</td><td><span class="tag tag-blue">配送中</span></td><td>B仓-肉类区-01</td><td>2026-04-22 08:00</td><td>2026-04-22 10:00</td><td>王配送</td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReceiveConfirm(this)">确认收货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-003</td><td>NC-INT-JXRJ-20260422-01</td><td>二号食堂厨房</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>宫保鸡丁</td><td>标准份(500g)</td><td>30</td><td>15</td><td><span class="tag tag-blue">配送中</span></td><td>B仓-肉类区-02</td><td>2026-04-22 08:00</td><td>2026-04-22 10:00</td><td>王配送</td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReceiveConfirm(this)">确认收货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-004</td><td>NC-INT-CAYO-20260422-01</td><td>三号食堂厨房</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>草鱼(鱼片)</td><td>2kg/盘</td><td>20</td><td>40</td><td><span class="tag tag-orange">待配送</span></td><td>C仓-水产区-01</td><td>2026-04-22 08:30</td><td>2026-04-22 10:30</td><td>—</td><td class="td-actions"><span class="link" style="color:var(--primary)" onclick="openDeliverModal(this)">立即配送</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-005</td><td>NC-INT-QZYU-20260422-01</td><td>一号食堂厨房</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>清蒸鱼</td><td>标准份(500g)</td><td>15</td><td>7.5</td><td><span class="tag tag-orange">待配送</span></td><td>C仓-水产区-02</td><td>2026-04-22 09:00</td><td>2026-04-22 11:00</td><td>—</td><td class="td-actions"><span class="link" style="color:var(--primary)" onclick="openDeliverModal(this)">立即配送</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-006</td><td>NC-INT-TDSI-20260422-01</td><td>三号食堂厨房</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>土豆(土豆丝)</td><td>500g/袋</td><td>40</td><td>20</td><td><span class="tag tag-gray">备货中</span></td><td>A仓-蔬菜区-03</td><td>2026-04-22 09:15</td><td>2026-04-22 11:30</td><td>—</td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReadyConfirm(this)">备货完成</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-007</td><td>NC-INT-SRBC-20260422-01</td><td>二号食堂厨房</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>蒜蓉菠菜</td><td>标准份(500g)</td><td>25</td><td>12.5</td><td><span class="tag tag-gray">备货中</span></td><td>A仓-蔬菜区-01</td><td>2026-04-22 09:30</td><td>2026-04-22 12:00</td><td>—</td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReadyConfirm(this)">备货完成</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-001</td><td>一号食堂厨房</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>菠菜</td><td>500g/袋</td><td>50</td><td>25</td><td><span class="tag tag-green">已完成</span></td><td>2026-04-22 07:30</td><td>2026-04-22 09:00</td><td>李配送</td><td class="td-actions"><span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-001</td><td>一号食堂厨房</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>玉米(玉米粒)</td><td>1kg/盒</td><td>20</td><td>20</td><td><span class="tag tag-green">已完成</span></td><td>2026-04-22 07:30</td><td>2026-04-22 09:00</td><td>李配送</td><td class="td-actions"><span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-002</td><td>二号食堂厨房</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>猪排骨</td><td>2kg/盘</td><td>20</td><td>40</td><td><span class="tag tag-blue">配送中</span></td><td>2026-04-22 08:00</td><td>2026-04-22 10:00</td><td>王配送</td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReceiveConfirm(this)">确认收货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-003</td><td>二号食堂厨房</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>宫保鸡丁</td><td>标准份(500g)</td><td>30</td><td>15</td><td><span class="tag tag-blue">配送中</span></td><td>2026-04-22 08:00</td><td>2026-04-22 10:00</td><td>王配送</td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReceiveConfirm(this)">确认收货</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-004</td><td>三号食堂厨房</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>草鱼(鱼片)</td><td>2kg/盘</td><td>20</td><td>40</td><td><span class="tag tag-orange">待配送</span></td><td>2026-04-22 08:30</td><td>2026-04-22 10:30</td><td>—</td><td class="td-actions"><span class="link" style="color:var(--primary)" onclick="openDeliverModal(this)">立即配送</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-005</td><td>一号食堂厨房</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>清蒸鱼</td><td>标准份(500g)</td><td>15</td><td>7.5</td><td><span class="tag tag-orange">待配送</span></td><td>2026-04-22 09:00</td><td>2026-04-22 11:00</td><td>—</td><td class="td-actions"><span class="link" style="color:var(--primary)" onclick="openDeliverModal(this)">立即配送</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-006</td><td>三号食堂厨房</td><td><span class="tag tag-green">🥬 净菜包</span></td><td>土豆(土豆丝)</td><td>500g/袋</td><td>40</td><td>20</td><td><span class="tag tag-gray">备货中</span></td><td>2026-04-22 09:15</td><td>2026-04-22 11:30</td><td>—</td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReadyConfirm(this)">备货完成</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>INT-007</td><td>二号食堂厨房</td><td><span class="tag tag-orange">🍱 餐品净菜包</span></td><td>蒜蓉菠菜</td><td>标准份(500g)</td><td>25</td><td>12.5</td><td><span class="tag tag-gray">备货中</span></td><td>2026-04-22 09:30</td><td>2026-04-22 12:00</td><td>—</td><td class="td-actions"><span class="link" style="color:var(--success)" onclick="openReadyConfirm(this)">备货完成</span> <span class="link" onclick="showDetail(this)">详情</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@@ -218,25 +222,33 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
</div>
|
||||
<div class="modal__body">
|
||||
<div class="form-grid">
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">溯源码<span class="required">*</span></div>
|
||||
<input placeholder="输入溯源码可带出净菜信息以及仓库信息">
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">净菜类型<span class="required">*</span></div>
|
||||
<select id="claimType" onchange="toggleClaimName()"><option value="">请选择</option><option value="nc">净菜包</option><option value="cp">餐品净菜包</option></select>
|
||||
<select id="claimType"><option value="">请选择</option><option value="nc">净菜包</option><option value="cp">餐品净菜包</option></select>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">申领食堂<span class="required">*</span></div>
|
||||
<select><option value="">请选择</option><option>一号食堂厨房</option><option>二号食堂厨房</option><option>三号食堂厨房</option></select>
|
||||
</div>
|
||||
<div class="form-item" id="claimNameNC">
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">净菜名称<span class="required">*</span></div>
|
||||
<select><option value="">请选择净菜</option><option>菠菜</option><option>玉米(玉米粒)</option><option>猪排骨</option><option>鸡胸肉(鸡肉丝)</option><option>草鱼(鱼片)</option><option>土豆(土豆丝)</option></select>
|
||||
</div>
|
||||
<div class="form-item" id="claimNameCP" style="display:none;">
|
||||
<div class="form-item__label">餐品名称<span class="required">*</span></div>
|
||||
<select><option value="">请选择餐品</option><option>宫保鸡丁</option><option>清蒸鱼</option><option>蒜蓉菠菜</option><option>炒胡萝卜</option><option>红烧排骨</option></select>
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">包装批次号</div>
|
||||
<select id="claimBatchSelect" onchange="onBatchChange(this.value)"><option value="">请选择批次号(选填)</option><option>BATCH-DH-20260415-01</option><option>BATCH-DH-20260415-02</option><option>BATCH-DH-20260415-03</option><option>BATCH-DH-20260415-04</option></select>
|
||||
</div>
|
||||
<div class="form-item full" id="batchInfoPanel" style="display:none;">
|
||||
<div class="form-item__label">批次包装信息</div>
|
||||
<div style="background:#FAFAFA;border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 16px;">
|
||||
<div style="display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;font-size:var(--font-sm);">
|
||||
<div><span style="color:var(--text-secondary);">包装餐品:</span><span id="batchDish" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装规格:</span><span id="batchSpec" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装方式:</span><span id="batchMethod" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装份数:</span><span id="batchQty" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装日期:</span><span id="batchDate" style="font-weight:500;"></span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">包装规格<span class="required">*</span></div>
|
||||
@@ -250,10 +262,6 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
<div class="form-item__label">申领数量(kg)<span class="required">*</span></div>
|
||||
<input type="number" placeholder="请输入数量">
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">关联仓库区域</div>
|
||||
<select><option value="">请选择</option><option>A仓-蔬菜区-01</option><option>A仓-蔬菜区-02</option><option>B仓-肉类区-01</option><option>B仓-肉类区-02</option><option>C仓-水产区-01</option></select>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">预定配送时间</div>
|
||||
<input type="datetime-local" placeholder="请选择配送时间">
|
||||
@@ -320,21 +328,41 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 备货完成二次确认弹窗 -->
|
||||
<!-- 备货完成弹窗(补全备货信息) -->
|
||||
<div class="modal-mask" id="modal-ready">
|
||||
<div class="modal" style="width:420px;">
|
||||
<div class="modal" style="width:520px;">
|
||||
<div class="modal__header">
|
||||
<div class="modal__title">确认备货完成</div>
|
||||
<div class="modal__title">补全备货信息</div>
|
||||
<button class="modal__close" onclick="closeModal('modal-ready')">✕</button>
|
||||
</div>
|
||||
<div class="modal__body" style="text-align:center;padding:32px 24px;">
|
||||
<div style="font-size:40px;margin-bottom:12px;">📦</div>
|
||||
<p style="font-size:15px;color:#333;font-weight:600;margin-bottom:8px;">确认申领单 <span id="readyOrderNo"></span> 已备货完成?</p>
|
||||
<p style="font-size:13px;color:#999;line-height:1.6;">净菜/餐品:<span id="readyFoodName" style="color:#333;font-weight:500;"></span><br>确认后订单状态将变为「待配送」</p>
|
||||
<div class="modal__body">
|
||||
<div style="background:var(--primary-light);border-radius:var(--radius-md);padding:12px 16px;margin-bottom:20px;font-size:var(--font-sm);color:var(--primary);display:flex;align-items:center;gap:8px;">
|
||||
<span style="font-size:16px;">📋</span>
|
||||
<span>申领单号:<strong id="readyOrderNo"></strong> | 净菜/餐品:<strong id="readyFoodName"></strong></span>
|
||||
</div>
|
||||
<div class="form-grid" style="grid-template-columns:1fr;">
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">包装批次号<span class="required">*</span></div>
|
||||
<select id="readyBatchSelect" onchange="onReadyBatchChange(this.value)"><option value="">请选择批次号</option><option>BATCH-DH-20260415-01</option><option>BATCH-DH-20260415-02</option><option>BATCH-DH-20260415-03</option><option>BATCH-DH-20260415-04</option></select>
|
||||
</div>
|
||||
<div class="form-item" id="readyBatchInfoPanel" style="display:none;">
|
||||
<div class="form-item__label">批次包装信息</div>
|
||||
<div style="background:#FAFAFA;border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 16px;">
|
||||
<div style="display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;font-size:var(--font-sm);">
|
||||
<div><span style="color:var(--text-secondary);">包装餐品:</span><span id="readyBatchDish" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装规格:</span><span id="readyBatchSpec" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装方式:</span><span id="readyBatchMethod" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装份数:</span><span id="readyBatchQty" style="font-weight:500;"></span></div>
|
||||
<div><span style="color:var(--text-secondary);">包装日期:</span><span id="readyBatchDate" style="font-weight:500;"></span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p style="font-size:var(--font-xs);color:var(--text-placeholder);margin-top:12px;">选择包装批次号后,订单状态将变为「待配送」</p>
|
||||
</div>
|
||||
<div class="modal__footer" style="justify-content:center;">
|
||||
<div class="modal__footer">
|
||||
<button class="btn btn-default" onclick="closeModal('modal-ready')">取消</button>
|
||||
<button class="btn btn-primary" style="background:var(--success);" onclick="doReady()">确认完成</button>
|
||||
<button class="btn btn-primary" onclick="doReady()">确认备货完成</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -347,20 +375,50 @@ function closeModal(id){document.getElementById(id).classList.remove('show');}
|
||||
document.querySelectorAll('.modal-mask').forEach(m=>{
|
||||
m.addEventListener('click',e=>{if(e.target===m)m.classList.remove('show');});
|
||||
});
|
||||
// 净菜类型切换:显示净菜名称或餐品名称
|
||||
function toggleClaimName(){
|
||||
var v=document.getElementById('claimType').value;
|
||||
document.getElementById('claimNameNC').style.display=(v==='cp'?'none':'flex');
|
||||
document.getElementById('claimNameCP').style.display=(v==='cp'?'flex':'none');
|
||||
|
||||
/* ========== 批次包装信息数据 ========== */
|
||||
var batchInfo={
|
||||
'BATCH-DH-20260415-01':{dish:'宫保鸡丁',spec:'标准份(500g)',method:'冷鲜袋',qty:'10',date:'2026-04-15'},
|
||||
'BATCH-DH-20260415-02':{dish:'清蒸鱼',spec:'标准份(500g)',method:'保鲜盒',qty:'8',date:'2026-04-15'},
|
||||
'BATCH-DH-20260415-03':{dish:'蒜蓉菠菜',spec:'标准份(500g)',method:'冷鲜袋',qty:'12',date:'2026-04-15'},
|
||||
'BATCH-DH-20260415-04':{dish:'炒胡萝卜',spec:'大份(800g)',method:'保鲜盒',qty:'6',date:'2026-04-15'}
|
||||
};
|
||||
|
||||
// 新建申领单 — 选择批次号回显信息
|
||||
function onBatchChange(val){
|
||||
var panel=document.getElementById('batchInfoPanel');
|
||||
var info=batchInfo[val];
|
||||
if(!info){panel.style.display='none';return;}
|
||||
document.getElementById('batchDish').textContent=info.dish;
|
||||
document.getElementById('batchSpec').textContent=info.spec;
|
||||
document.getElementById('batchMethod').textContent=info.method;
|
||||
document.getElementById('batchQty').textContent=info.qty;
|
||||
document.getElementById('batchDate').textContent=info.date;
|
||||
panel.style.display='flex';
|
||||
}
|
||||
|
||||
// 备货完成弹窗 — 选择批次号回显信息
|
||||
function onReadyBatchChange(val){
|
||||
var panel=document.getElementById('readyBatchInfoPanel');
|
||||
var info=batchInfo[val];
|
||||
if(!info){panel.style.display='none';return;}
|
||||
document.getElementById('readyBatchDish').textContent=info.dish;
|
||||
document.getElementById('readyBatchSpec').textContent=info.spec;
|
||||
document.getElementById('readyBatchMethod').textContent=info.method;
|
||||
document.getElementById('readyBatchQty').textContent=info.qty;
|
||||
document.getElementById('readyBatchDate').textContent=info.date;
|
||||
panel.style.display='flex';
|
||||
}
|
||||
|
||||
/* ========== 列索引(去掉溯源码和关联仓库区域后) ========== */
|
||||
/* 0申领单号 1申领食堂 2净菜类型 3净菜/餐品 4包装规格 5申领份数 6申领数量 7订单状态 8申领时间 9预定配送时间 10配送人 11操作 */
|
||||
|
||||
/* 确认收货 */
|
||||
function openReceiveConfirm(el){
|
||||
var tr=el.closest('tr');
|
||||
var tds=tr.querySelectorAll('td');
|
||||
/* 列:0申领单号 4净菜/餐品 */
|
||||
document.getElementById('receiveOrderNo').textContent=tds[0].textContent;
|
||||
document.getElementById('receiveFoodName').textContent=tds[4].textContent;
|
||||
document.getElementById('receiveFoodName').textContent=tds[3].textContent;
|
||||
openModal('modal-receive');
|
||||
}
|
||||
function doReceive(){
|
||||
@@ -373,7 +431,7 @@ function openDeliverModal(el){
|
||||
var tr=el.closest('tr');
|
||||
var tds=tr.querySelectorAll('td');
|
||||
document.getElementById('deliverOrderNo').textContent=tds[0].textContent;
|
||||
document.getElementById('deliverFoodName').textContent=tds[4].textContent;
|
||||
document.getElementById('deliverFoodName').textContent=tds[3].textContent;
|
||||
document.getElementById('deliverPerson').value='';
|
||||
document.getElementById('deliverRemark').value='';
|
||||
openModal('modal-deliver');
|
||||
@@ -385,19 +443,52 @@ function doDeliver(){
|
||||
alert('配送任务已创建,配送人:'+person+',订单状态已变为「配送中」');
|
||||
}
|
||||
|
||||
/* 备货完成 */
|
||||
/* 备货完成 — 打开补全备货信息弹窗 */
|
||||
function openReadyConfirm(el){
|
||||
var tr=el.closest('tr');
|
||||
var tds=tr.querySelectorAll('td');
|
||||
document.getElementById('readyOrderNo').textContent=tds[0].textContent;
|
||||
document.getElementById('readyFoodName').textContent=tds[4].textContent;
|
||||
document.getElementById('readyFoodName').textContent=tds[3].textContent;
|
||||
// 重置批次选择和面板
|
||||
document.getElementById('readyBatchSelect').selectedIndex=0;
|
||||
document.getElementById('readyBatchInfoPanel').style.display='none';
|
||||
openModal('modal-ready');
|
||||
}
|
||||
function doReady(){
|
||||
var batch=document.getElementById('readyBatchSelect').value;
|
||||
if(!batch){alert('请选择包装批次号');return;}
|
||||
closeModal('modal-ready');
|
||||
alert('备货已确认完成,订单状态已变为「待配送」');
|
||||
alert('备货信息已补全,订单状态已变为「待配送」\n包装批次号:'+batch);
|
||||
}
|
||||
|
||||
/* ========== 餐品食材数据(与 sup-pkg-label 保持一致) ========== */
|
||||
var dishIngredients={
|
||||
'宫保鸡丁':[
|
||||
{trace:'NC-PROC-JXR-20260415-01',name:'鸡胸肉',type:'主材',amount:'120g'},
|
||||
{trace:'NC-PROC-HUS-20260415-01',name:'花生',type:'辅材',amount:'20g'},
|
||||
{trace:'NC-PROC-GLJ-20260415-01',name:'干辣椒',type:'调料',amount:'5g'}
|
||||
],
|
||||
'清蒸鱼':[
|
||||
{trace:'NC-PROC-CYU-20260415-01',name:'草鱼',type:'主材',amount:'100g'},
|
||||
{trace:'NC-PROC-JPN-20260415-01',name:'姜片',type:'调料',amount:'适量'}
|
||||
],
|
||||
'蒜蓉菠菜':[
|
||||
{trace:'NC-PROC-BOC-20260415-01',name:'净菠菜',type:'主材',amount:'120g'},
|
||||
{trace:'NC-PROC-DSN-20260415-01',name:'大蒜',type:'调料',amount:'8g'}
|
||||
],
|
||||
'炒胡萝卜':[
|
||||
{trace:'NC-PROC-HLB-20260415-01',name:'净胡萝卜',type:'主材',amount:'260g'},
|
||||
{trace:'NC-PROC-CJG-20260415-01',name:'葱姜',type:'调料',amount:'适量'}
|
||||
]
|
||||
};
|
||||
// 餐品净菜包对应的包装批次号
|
||||
var dishBatch={
|
||||
'宫保鸡丁':'BATCH-DH-20260415-01',
|
||||
'清蒸鱼':'BATCH-DH-20260415-02',
|
||||
'蒜蓉菠菜':'BATCH-DH-20260415-03',
|
||||
'炒胡萝卜':'BATCH-DH-20260415-04'
|
||||
};
|
||||
|
||||
/* 右侧抽屉组件 */
|
||||
var Drawer={
|
||||
open:function(title,bodyHtml){
|
||||
@@ -416,18 +507,69 @@ var Drawer={
|
||||
}
|
||||
};
|
||||
|
||||
/* 详情抽屉 */
|
||||
/* ========== 详情抽屉(定制化渲染) ========== */
|
||||
function showDetail(el){
|
||||
var tr=el.closest('tr');
|
||||
var ths=tr.closest('table').querySelectorAll('thead th');
|
||||
var tds=tr.querySelectorAll('td');
|
||||
var html='<div class="drawer-section"><div class="drawer-section__title">详细信息</div><div class="drawer-fields">';
|
||||
for(var i=0;i<ths.length-1;i++){
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">'+ths[i].textContent+'</div><div class="drawer-field__value">'+tds[i].innerHTML+'</div></div>';
|
||||
/* 列序:0申领单号 1申领食堂 2净菜类型 3净菜/餐品 4包装规格 5申领份数 6申领数量 7订单状态 8申领时间 9预定配送时间 10配送人 */
|
||||
var orderNo=tds[0].textContent;
|
||||
var canteen=tds[1].textContent;
|
||||
var typeHtml=tds[2].innerHTML;
|
||||
var typeText=tds[2].textContent.trim();
|
||||
var foodName=tds[3].textContent;
|
||||
var spec=tds[4].textContent;
|
||||
var qty=tds[5].textContent;
|
||||
var weight=tds[6].textContent;
|
||||
var statusHtml=tds[7].innerHTML;
|
||||
var claimTime=tds[8].textContent;
|
||||
var deliverTime=tds[9].textContent;
|
||||
var deliverPerson=tds[10].textContent;
|
||||
|
||||
var isCp=typeText.indexOf('餐品')>=0;
|
||||
|
||||
// 基础信息区
|
||||
var html='<div class="drawer-section"><div class="drawer-section__title">基础信息</div><div class="drawer-fields">';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">申领单号</div><div class="drawer-field__value">'+orderNo+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">净菜类型</div><div class="drawer-field__value">'+typeHtml+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">申领食堂</div><div class="drawer-field__value">'+canteen+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">净菜/餐品</div><div class="drawer-field__value">'+foodName+'</div></div>';
|
||||
|
||||
// 根据类型显示不同字段
|
||||
if(!isCp){
|
||||
// 净菜包 → 显示溯源码
|
||||
var traceMap={'菠菜':'NC-INT-BOCA-20260422-01','玉米(玉米粒)':'NC-INT-BCAI-20260422-01','猪排骨':'NC-INT-ZLRJ-20260422-01','草鱼(鱼片)':'NC-INT-CAYO-20260422-01','土豆(土豆丝)':'NC-INT-TDSI-20260422-01'};
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">溯源码</div><div class="drawer-field__value">'+(traceMap[foodName]||'—')+'</div></div>';
|
||||
} else {
|
||||
// 餐品净菜包 → 显示包装批次号
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">包装批次号</div><div class="drawer-field__value">'+(dishBatch[foodName]||'—')+'</div></div>';
|
||||
}
|
||||
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">包装规格</div><div class="drawer-field__value">'+spec+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">申领份数</div><div class="drawer-field__value">'+qty+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">申领数量(kg)</div><div class="drawer-field__value">'+weight+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">订单状态</div><div class="drawer-field__value">'+statusHtml+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">申领时间</div><div class="drawer-field__value">'+claimTime+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">预定配送时间</div><div class="drawer-field__value">'+deliverTime+'</div></div>';
|
||||
html+='<div class="drawer-field"><div class="drawer-field__label">配送人</div><div class="drawer-field__value">'+deliverPerson+'</div></div>';
|
||||
html+='</div></div>';
|
||||
var key=tds[0].textContent;
|
||||
Drawer.open('净菜内供详情 — '+key, html);
|
||||
|
||||
// 餐品净菜包 → 追加净菜包明细表格
|
||||
if(isCp){
|
||||
var ings=dishIngredients[foodName]||[];
|
||||
var tagCls={'主材':'tag-blue','辅材':'tag-green','调料':'tag-orange'};
|
||||
html+='<div class="drawer-section"><div class="drawer-section__title">净菜包明细</div>';
|
||||
html+='<table class="ing-detail-table"><thead><tr><th>食材溯源码</th><th>食材名称</th><th>分类</th><th>每份用量</th></tr></thead><tbody>';
|
||||
if(ings.length>0){
|
||||
ings.forEach(function(i){
|
||||
html+='<tr><td>'+i.trace+'</td><td>'+i.name+'</td><td><span class="tag '+(tagCls[i.type]||'')+'">'+i.type+'</span></td><td>'+i.amount+'</td></tr>';
|
||||
});
|
||||
} else {
|
||||
html+='<tr><td colspan="4" style="text-align:center;color:var(--text-placeholder);">暂无明细数据</td></tr>';
|
||||
}
|
||||
html+='</tbody></table></div>';
|
||||
}
|
||||
|
||||
Drawer.open('净菜内供详情 — '+orderNo, html);
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -198,29 +198,29 @@ tbody td.td-actions{white-space:nowrap;}
|
||||
<div class="table-card__content">
|
||||
<table>
|
||||
<thead><tr>
|
||||
<th>加工批次号</th><th>关联单号</th><th>溯源码</th><th>食材名称</th><th>净菜类型</th><th>加工步骤</th><th>毛菜重量(kg)</th><th>净菜重量(kg)</th><th>出净率(%)</th><th>加工人员</th><th>开始时间</th><th>结束时间</th><th>质检结果</th><th>入库状态</th><th>操作</th>
|
||||
<th>加工批次号</th><th>溯源码</th><th>食材名称</th><th>净菜类型</th><th>加工步骤</th><th>毛菜重量(kg)</th><th>净菜重量(kg)</th><th>出净率(%)</th><th>加工人员</th><th>开始时间</th><th>结束时间</th><th>质检结果</th><th>入库状态</th><th>操作</th>
|
||||
</tr></thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>PROC-001</td><td><span class="link">NC-IN-001</span></td><td>NC-PROC-BOCA-20260415-01</td><td>土豆</td><td>土豆丝</td><td>去皮/切割</td><td>100</td><td>86</td><td>86.0</td><td>李加工</td><td>2026-04-15 08:00</td><td>2026-04-15 08:45</td><td><span class="tag tag-green">合格</span></td><td><span class="tag tag-green">已入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>PROC-001</td><td>NC-PROC-BOCA-20260415-01</td><td>土豆</td><td>土豆丝</td><td>去皮/切割</td><td>100</td><td>86</td><td>86.0</td><td>李加工</td><td>2026-04-15 08:00</td><td>2026-04-15 08:45</td><td><span class="tag tag-green">合格</span></td><td><span class="tag tag-green">已入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>PROC-002</td><td><span class="link">—</span></td><td>NC-PROC-HLUB-20260415-01</td><td>土豆</td><td>土豆片</td><td>去皮/切割</td><td>140</td><td>120</td><td>85.7</td><td>王加工</td><td>2026-04-15 08:30</td><td>2026-04-15 09:20</td><td><span class="tag tag-green">合格</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="confirmGenStock(this)">生成入库单</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>PROC-002</td><td>NC-PROC-HLUB-20260415-01</td><td>土豆</td><td>土豆片</td><td>去皮/切割</td><td>140</td><td>120</td><td>85.7</td><td>王加工</td><td>2026-04-15 08:30</td><td>2026-04-15 09:20</td><td><span class="tag tag-green">合格</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="confirmGenStock(this)">生成入库单</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>PROC-003</td><td><span class="link">—</span></td><td>NC-PROC-XGUO-20260415-01</td><td>土豆</td><td>土豆泥</td><td>去皮/切割</td><td>56</td><td>48</td><td>85.7</td><td>李加工</td><td>2026-04-15 09:00</td><td>2026-04-15 09:40</td><td><span class="tag tag-green">合格</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="confirmGenStock(this)">生成入库单</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>PROC-003</td><td>NC-PROC-XGUO-20260415-01</td><td>土豆</td><td>土豆泥</td><td>去皮/切割</td><td>56</td><td>48</td><td>85.7</td><td>李加工</td><td>2026-04-15 09:00</td><td>2026-04-15 09:40</td><td><span class="tag tag-green">合格</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="confirmGenStock(this)">生成入库单</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>PROC-004</td><td><span class="link">—</span></td><td>NC-PROC-SJDOU-20260415-01</td><td>四季豆</td><td>段(5cm)</td><td>清洗</td><td>60</td><td>52</td><td>86.7</td><td>张加工</td><td>2026-04-15 09:30</td><td>2026-04-15 10:00</td><td><span class="tag tag-orange">待处理</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>PROC-004</td><td>NC-PROC-SJDOU-20260415-01</td><td>四季豆</td><td>段(5cm)</td><td>清洗</td><td>60</td><td>52</td><td>86.7</td><td>张加工</td><td>2026-04-15 09:30</td><td>2026-04-15 10:00</td><td><span class="tag tag-orange">待处理</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>PROC-005</td><td><span class="link">NC-IN-004</span></td><td>NC-PROC-BCAI-20260415-01</td><td>白菜</td><td>整棵</td><td>清洗</td><td>80</td><td>70</td><td>87.5</td><td>张加工</td><td>2026-04-15 07:30</td><td>2026-04-15 08:10</td><td><span class="tag tag-green">合格</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="confirmGenStock(this)">生成入库单</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>PROC-005</td><td>NC-PROC-BCAI-20260415-01</td><td>白菜</td><td>整棵</td><td>清洗</td><td>80</td><td>70</td><td>87.5</td><td>张加工</td><td>2026-04-15 07:30</td><td>2026-04-15 08:10</td><td><span class="tag tag-green">合格</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="confirmGenStock(this)">生成入库单</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>PROC-006</td><td><span class="link">NC-IN-005</span></td><td>NC-PROC-ZLRJ-20260415-01</td><td>猪里脊</td><td>丁(1.5cm)</td><td>切割</td><td>80</td><td>76</td><td>95.0</td><td>王加工</td><td>2026-04-15 09:30</td><td>2026-04-15 09:55</td><td><span class="tag tag-green">合格</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="confirmGenStock(this)">生成入库单</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>PROC-006</td><td>NC-PROC-ZLRJ-20260415-01</td><td>猪里脊</td><td>丁(1.5cm)</td><td>切割</td><td>80</td><td>76</td><td>95.0</td><td>王加工</td><td>2026-04-15 09:30</td><td>2026-04-15 09:55</td><td><span class="tag tag-green">合格</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="confirmGenStock(this)">生成入库单</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>PROC-007</td><td><span class="link">—</span></td><td>NC-PROC-ZLRJ-20260415-02</td><td>猪里脊</td><td>条(4cm)</td><td>切割</td><td>90</td><td>85</td><td>94.4</td><td>李加工</td><td>2026-04-15 10:00</td><td>2026-04-15 10:30</td><td><span class="tag tag-orange">待处理</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>PROC-007</td><td>NC-PROC-ZLRJ-20260415-02</td><td>猪里脊</td><td>条(4cm)</td><td>切割</td><td>90</td><td>85</td><td>94.4</td><td>李加工</td><td>2026-04-15 10:00</td><td>2026-04-15 10:30</td><td><span class="tag tag-orange">待处理</span></td><td><span class="tag tag-gray">未入库</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -273,7 +273,7 @@ tbody td.td-actions{white-space:nowrap;}
|
||||
<div class="form-grid">
|
||||
<!-- 交互说明:先输入/选择溯源码 → 根据溯源码自动带出食材名称(只读)→ 根据食材名称带出净菜类型(下拉选择) -->
|
||||
<div class="form-item"><label>溯源码<span class="required">*</span></label><input type="text" placeholder="请输入或扫描溯源码"></div>
|
||||
<div class="form-item"><label>食材名称</label><input type="text" placeholder="由溯源码自动带出" readonly style="background:#f5f5f5;"></div>
|
||||
<div class="form-item"><label>食材名称</label><input type="text" placeholder="由溯源码自动带出或下拉选择" readonly style="background:#f5f5f5;"></div>
|
||||
<div class="form-item"><label>净菜类型<span class="required">*</span></label><select><option>由食材名称带出</option><option>整棵</option><option>整朵</option><option>段</option><option>丁</option><option>条</option><option>片</option><option>丝</option><option>末</option><option>块</option><option>滚刀块</option><option>其他(备注说明)</option></select></div>
|
||||
<div class="form-item"><label>加工步骤<span class="required">*</span></label><select><option>请选择</option><option>清洗</option><option>去皮</option><option>切割</option><option>分拣</option><option>综合加工</option></select></div>
|
||||
<div class="form-item"><label>毛菜重量(kg)<span class="required">*</span></label><input type="number" placeholder="请输入毛菜重量"></div>
|
||||
@@ -324,13 +324,13 @@ var _stockRowData=null;
|
||||
function confirmGenStock(el){
|
||||
var tr=el.closest('tr');
|
||||
var tds=tr.querySelectorAll('td');
|
||||
/* 列序:0加工批次号 1关联单号 2溯源码 3食材名称 4净菜类型 5加工步骤 6毛菜重量 7净菜重量 */
|
||||
/* 列序:0加工批次号 1溯源码 2食材名称 3净菜类型 4加工步骤 5毛菜重量 6净菜重量 */
|
||||
_stockRowData={
|
||||
batch:tds[0].textContent,
|
||||
trace:tds[2].textContent,
|
||||
food:tds[3].textContent,
|
||||
cleanType:tds[4].textContent,
|
||||
weight:tds[7].textContent
|
||||
trace:tds[1].textContent,
|
||||
food:tds[2].textContent,
|
||||
cleanType:tds[3].textContent,
|
||||
weight:tds[6].textContent
|
||||
};
|
||||
document.getElementById('confirmStockModal').style.display='flex';
|
||||
}
|
||||
|
||||
@@ -194,23 +194,23 @@ tbody td.td-actions{white-space:nowrap;}
|
||||
<div class="table-card__content">
|
||||
<table>
|
||||
<thead><tr>
|
||||
<th>入库单号</th><th>关联单号</th><th>溯源码</th><th>食材名称</th><th>净菜类型</th><th>入库规格</th><th>入库数量</th><th>入库重量(kg)</th><th>当前库存(kg)</th><th>操作时间</th><th>保质期至</th><th>存放区域</th><th>存放温度(℃)</th><th>操作人</th><th>操作类型</th><th>操作</th>
|
||||
<th>入库单号</th><th>操作类型</th><th>溯源码</th><th>食材名称</th><th>净菜类型</th><th>入库规格</th><th>入库数量</th><th>入库重量(kg)</th><th>当前库存(kg)</th><th>操作时间</th><th>保质期至</th><th>存放区域</th><th>存放温度(℃)</th><th>操作人</th><th>操作</th>
|
||||
</tr></thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>NC-IN-001</td><td><span class="link">PROC-001</span></td><td>NC-PROC-BOCA-20260415-01</td><td>土豆</td><td>土豆丝</td><td>袋装/500g</td><td>86</td><td>43.0</td><td>31.0</td><td>2026-04-15 09:15</td><td>2026-04-17 09:15</td><td>A仓-蔬菜区-01</td><td>4.1</td><td>李入库</td><td><span class="tag tag-blue">设备自动</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="openOutModal('NC-IN-001')">出库明细</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>NC-IN-001</td><td><span class="tag tag-blue">设备自动</span></td><td>NC-PROC-BOCA-20260415-01</td><td>土豆</td><td>土豆丝</td><td>袋装/500g</td><td>86</td><td>43.0</td><td>31.0</td><td>2026-04-15 09:15</td><td>2026-04-17 09:15</td><td>A仓-蔬菜区-01</td><td>4.1</td><td>李入库</td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="openOutModal('NC-IN-001')">出库明细</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>NC-IN-002</td><td><span class="link">PROC-002</span></td><td>NC-PROC-HLUB-20260415-01</td><td>土豆</td><td>土豆片</td><td>袋装/500g</td><td>120</td><td>60.0</td><td>47.5</td><td>2026-04-15 09:45</td><td>2026-04-18 09:45</td><td>A仓-蔬菜区-02</td><td>4.2</td><td>王入库</td><td><span class="tag tag-blue">设备自动</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="openOutModal('NC-IN-002')">出库明细</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>NC-IN-002</td><td><span class="tag tag-blue">设备自动</span></td><td>NC-PROC-HLUB-20260415-01</td><td>土豆</td><td>土豆片</td><td>袋装/500g</td><td>120</td><td>60.0</td><td>47.5</td><td>2026-04-15 09:45</td><td>2026-04-18 09:45</td><td>A仓-蔬菜区-02</td><td>4.2</td><td>王入库</td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="openOutModal('NC-IN-002')">出库明细</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>NC-IN-003</td><td><span class="link">PROC-003</span></td><td>NC-PROC-XGUO-20260415-01</td><td>土豆</td><td>土豆泥</td><td>盒装/300g</td><td>48</td><td>14.4</td><td>9.0</td><td>2026-04-15 11:00</td><td>2026-04-17 11:00</td><td>A仓-蔬菜区-03</td><td>4.0</td><td>李入库</td><td><span class="tag tag-green">人工录入</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="openOutModal('NC-IN-003')">出库明细</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>NC-IN-003</td><td><span class="tag tag-green">人工录入</span></td><td>NC-PROC-XGUO-20260415-01</td><td>土豆</td><td>土豆泥</td><td>盒装/300g</td><td>48</td><td>14.4</td><td>9.0</td><td>2026-04-15 11:00</td><td>2026-04-17 11:00</td><td>A仓-蔬菜区-03</td><td>4.0</td><td>李入库</td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="openOutModal('NC-IN-003')">出库明细</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>NC-IN-004</td><td><span class="link">PROC-005</span></td><td>NC-PROC-BCAI-20260415-01</td><td>白菜</td><td>整棵</td><td>散装/整棵</td><td>70</td><td>35.0</td><td>22.5</td><td>2026-04-15 11:30</td><td>2026-04-18 11:30</td><td>A仓-蔬菜区-04</td><td>3.8</td><td>张入库</td><td><span class="tag tag-green">人工录入</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="openOutModal('NC-IN-004')">出库明细</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>NC-IN-004</td><td><span class="tag tag-green">人工录入</span></td><td>NC-PROC-BCAI-20260415-01</td><td>白菜</td><td>整棵</td><td>散装/整棵</td><td>70</td><td>35.0</td><td>22.5</td><td>2026-04-15 11:30</td><td>2026-04-18 11:30</td><td>A仓-蔬菜区-04</td><td>3.8</td><td>张入库</td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="openOutModal('NC-IN-004')">出库明细</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>NC-IN-005</td><td><span class="link">PROC-006</span></td><td>NC-PROC-ZLRJ-20260415-01</td><td>猪里脊</td><td>丁(1.5cm)</td><td>袋装/400g</td><td>76</td><td>30.4</td><td>18.8</td><td>2026-04-15 12:00</td><td>2026-04-16 12:00</td><td>B仓-肉类区-01</td><td>-2.0</td><td>王入库</td><td><span class="tag tag-blue">设备自动</span></td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="openOutModal('NC-IN-005')">出库明细</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
<td>NC-IN-005</td><td><span class="tag tag-blue">设备自动</span></td><td>NC-PROC-ZLRJ-20260415-01</td><td>猪里脊</td><td>丁(1.5cm)</td><td>袋装/400g</td><td>76</td><td>30.4</td><td>18.8</td><td>2026-04-15 12:00</td><td>2026-04-16 12:00</td><td>B仓-肉类区-01</td><td>-2.0</td><td>王入库</td><td class="td-actions"><span class="link" onclick="openVideoModal()">查看视频</span> <span class="link" onclick="openOutModal('NC-IN-005')">出库明细</span> <span class="action-more"><span class="more-btn">更多 ▾</span><div class="dropdown"><a href="javascript:;" onclick="showDetail(this)">详情</a><a href="javascript:;" onclick="openModal()">编辑</a><a href="javascript:;" class="danger" onclick="if(confirm('确认删除该记录?')){}">删除</a></div></span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -247,7 +247,6 @@ tbody td.td-actions{white-space:nowrap;}
|
||||
<div class="form-item"><label>存放区域<span class="required">*</span></label><input type="text" placeholder="请输入存放区域"></div>
|
||||
<div class="form-item"><label>存放温度(℃)</label><input type="number" step="0.1" placeholder="请输入温度"></div>
|
||||
<div class="form-item"><label>操作人<span class="required">*</span></label><input type="text" placeholder="请输入操作人"></div>
|
||||
<div class="form-item"><label>操作类型<span class="required">*</span></label><select><option>请选择</option><option>设备自动</option><option>人工录入</option></select></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
|
||||
@@ -240,7 +240,7 @@ tbody tr:hover{background:#F8FBFF;}
|
||||
<div class="form-grid">
|
||||
<div class="form-item"><label>溯源码<span class="required">*</span></label><input type="text" placeholder="请输入溯源码"></div>
|
||||
<div class="form-item"><label>来源类型<span class="required">*</span></label><select><option>请选择</option><option>外采</option><option>自产</option></select></div>
|
||||
<div class="form-item"><label>食材名称<span class="required">*</span></label><input type="text" placeholder="请输入食材名称"></div>
|
||||
<div class="form-item"><label>食材名称<span class="required">*</span></label><select><option>请选择</option><option>菠菜</option><option>土豆</option><option>胡萝卜</option><option>白菜</option><option>西蓝花</option><option>猪里脊</option><option>猪五花</option><option>牛腩</option><option>鸡胸肉</option><option>草鱼</option><option>基围虾</option></select></div>
|
||||
<div class="form-item"><label>供应商<span class="required">*</span></label><select><option>请选择</option><option>A区蔬菜基地</option><option>B区根茎基地</option><option>绿源蔬菜配送</option><option>鲜肉直供公司</option><option>海鲜水产配送</option></select></div>
|
||||
<div class="form-item"><label>入库规格<span class="required">*</span></label><select><option>请选择</option><option>25kg/件</option><option>20kg/箱</option><option>15kg/箱</option><option>10kg/筐</option><option>5kg/袋</option><option>1kg/包</option><option>散装(kg)</option></select></div>
|
||||
<div class="form-item"><label>入库数量<span class="required">*</span></label><input type="text" placeholder="请输入入库数量"></div>
|
||||
|
||||
@@ -112,6 +112,15 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
.ingredient-row .btn-icon.btn-del:hover{color:var(--danger);border-color:var(--danger);}
|
||||
.btn-add-row{display:inline-flex;align-items:center;gap:4px;font-size:var(--font-sm);color:var(--primary);cursor:pointer;border:none;background:none;padding:4px 0;margin-top:4px;}
|
||||
.btn-add-row:hover{color:#40a9ff;}
|
||||
/* 食材明细表格(弹窗内) */
|
||||
.ing-table{width:100%;border-collapse:collapse;margin-top:8px;}
|
||||
.ing-table th{background:#FAFAFA;padding:8px 12px;text-align:left;font-size:var(--font-xs);color:var(--text-secondary);font-weight:500;border:1px solid var(--border);}
|
||||
.ing-table td{padding:6px 12px;font-size:var(--font-sm);color:var(--text-primary);border:1px solid var(--border);}
|
||||
.ing-table td input,.ing-table td select{width:100%;height:30px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 8px;font-size:var(--font-xs);outline:none;background:#fff;}
|
||||
.ing-table td input:focus,.ing-table td select:focus{border-color:var(--primary);}
|
||||
.ing-table td select{appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23999'/%3E%3C/svg%3E") no-repeat right 6px center;padding-right:22px;}
|
||||
.ing-table .btn-row-del{width:24px;height:24px;border:none;background:none;color:var(--text-placeholder);cursor:pointer;font-size:14px;border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;}
|
||||
.ing-table .btn-row-del:hover{color:var(--danger);background:#FFF1F0;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -199,15 +208,15 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
<div class="table-card__content">
|
||||
<table>
|
||||
<thead><tr>
|
||||
<th>包装批次号</th><th>溯源码</th><th>净菜名称</th><th>包装方式</th><th>包装规格</th><th>包装份数</th><th>包装日期</th><th>保质期至</th><th>存放温度(℃)</th><th>关联单号</th><th>包装人</th><th>终端设备</th><th>操作</th>
|
||||
<th>包装批次号</th><th>溯源码</th><th>净菜名称</th><th>包装方式</th><th>包装规格</th><th>包装份数</th><th>包装日期</th><th>保质期至</th><th>存放温度(℃)</th><th>包装人</th><th>终端设备</th><th>操作</th>
|
||||
</tr></thead>
|
||||
<tbody>
|
||||
<tr><td>BATCH-NC-20260415-01</td><td>NC-PROC-BOCA-20260415-01</td><td>土豆(土豆丝)</td><td><span class="tag tag-gray">真空袋</span></td><td>500g/袋</td><td>20</td><td>2026-04-15</td><td>2026-04-17</td><td>4.1</td><td>INT-001</td><td>李包装</td><td>PKG-T01</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-NC-20260415-01</td><td>NC-PROC-BOCA-20260415-01</td><td>土豆(土豆泥)</td><td><span class="tag tag-gray">真空袋</span></td><td>500g/袋</td><td>20</td><td>2026-04-15</td><td>2026-04-17</td><td>4.1</td><td>INT-001</td><td>李包装</td><td>PKG-T01</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-NC-20260415-02</td><td>NC-PROC-HLUB-20260415-01</td><td>鸡肉(鸡爪)</td><td><span class="tag tag-gray">保鲜盒</span></td><td>1kg/盒</td><td>15</td><td>2026-04-15</td><td>2026-04-18</td><td>4.2</td><td>INT-002</td><td>王包装</td><td>PKG-T01</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-NC-20260415-02</td><td>NC-PROC-HLUB-20260415-01</td><td>鸡肉(鸡肉块)</td><td><span class="tag tag-gray">保鲜盒</span></td><td>1kg/盒</td><td>15</td><td>2026-04-15</td><td>2026-04-18</td><td>4.2</td><td>INT-002</td><td>王包装</td><td>PKG-T01</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-NC-20260415-03</td><td>NC-PROC-XGUO-20260415-01</td><td>菠菜</td><td><span class="tag tag-gray">散装托盘</span></td><td>2kg/盘</td><td>8</td><td>2026-04-15</td><td>2026-04-17</td><td>4.0</td><td>EXT-001</td><td>张包装</td><td>PKG-T02</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-NC-20260415-04</td><td>NC-PROC-LAJP-20260415-01</td><td>豆腐(豆腐块)</td><td><span class="tag tag-gray">真空袋</span></td><td>1kg/袋</td><td>12</td><td>2026-04-15</td><td>2026-04-17</td><td>4.3</td><td>INT-003</td><td>李包装</td><td>PKG-T02</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-NC-20260415-01</td><td>NC-PROC-BOCA-20260415-01</td><td>土豆(土豆丝)</td><td><span class="tag tag-gray">真空袋</span></td><td>500g/袋</td><td>20</td><td>2026-04-15</td><td>2026-04-17</td><td>4.1</td><td>李包装</td><td>PKG-T01</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-NC-20260415-01</td><td>NC-PROC-BOCA-20260415-01</td><td>土豆(土豆泥)</td><td><span class="tag tag-gray">真空袋</span></td><td>500g/袋</td><td>20</td><td>2026-04-15</td><td>2026-04-17</td><td>4.1</td><td>李包装</td><td>PKG-T01</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-NC-20260415-02</td><td>NC-PROC-HLUB-20260415-01</td><td>鸡肉(鸡爪)</td><td><span class="tag tag-gray">保鲜盒</span></td><td>1kg/盒</td><td>15</td><td>2026-04-15</td><td>2026-04-18</td><td>4.2</td><td>王包装</td><td>PKG-T01</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-NC-20260415-02</td><td>NC-PROC-HLUB-20260415-01</td><td>鸡肉(鸡肉块)</td><td><span class="tag tag-gray">保鲜盒</span></td><td>1kg/盒</td><td>15</td><td>2026-04-15</td><td>2026-04-18</td><td>4.2</td><td>王包装</td><td>PKG-T01</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-NC-20260415-03</td><td>NC-PROC-XGUO-20260415-01</td><td>菠菜</td><td><span class="tag tag-gray">散装托盘</span></td><td>2kg/盘</td><td>8</td><td>2026-04-15</td><td>2026-04-17</td><td>4.0</td><td>张包装</td><td>PKG-T02</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-NC-20260415-04</td><td>NC-PROC-LAJP-20260415-01</td><td>豆腐(豆腐块)</td><td><span class="tag tag-gray">真空袋</span></td><td>1kg/袋</td><td>12</td><td>2026-04-15</td><td>2026-04-17</td><td>4.3</td><td>李包装</td><td>PKG-T02</td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@@ -244,14 +253,14 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
<div class="table-card__content">
|
||||
<table>
|
||||
<thead><tr>
|
||||
<th>包装批次号</th><th>溯源码</th><th>包装餐品</th><th>包装规格</th><th>包装方式</th><th>包装份数</th><th>包含食材</th><th>包装日期</th><th>保质期至</th><th>存放温度(℃)</th><th>关联单号</th><th>包装人</th><th>终端设备</th><th>操作类型</th><th>操作</th>
|
||||
<th>包装批次号</th><th>包装餐品</th><th>包装规格</th><th>包装方式</th><th>包装份数</th><th>包含食材</th><th>包装日期</th><th>保质期至</th><th>存放温度(℃)</th><th>包装人</th><th>终端设备</th><th>操作类型</th><th>操作</th>
|
||||
</tr></thead>
|
||||
<tbody>
|
||||
<tr><td>BATCH-DH-20260415-01</td><td>NC-PROC-JXRJ-20260415-01</td><td>宫保鸡丁</td><td><span class="tag tag-green">标准份(500g)</span></td><td><span class="tag tag-gray">冷鲜袋</span></td><td>10</td><td>鸡胸肉 120g<br>花生 20g<br>干辣椒 5g</td><td>2026-04-15</td><td>2026-04-17</td><td>3.8</td><td>INT-001</td><td>赵配餐</td><td>PKG-T03</td><td><span class="tag tag-blue">设备自动</span></td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-DH-20260415-01</td><td>NC-PROC-JXRJ-20260415-01</td><td>宫保鸡丁</td><td><span class="tag tag-green">标准份(500g)</span></td><td><span class="tag tag-gray">冷鲜袋</span></td><td>10</td><td>鸡胸肉 120g<br>花生 20g<br>干辣椒 5g</td><td>2026-04-15</td><td>2026-04-17</td><td>3.8</td><td>INT-001</td><td>赵配餐</td><td>PKG-T03</td><td><span class="tag tag-blue">设备自动</span></td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-DH-20260415-02</td><td>NC-PROC-CAYO-20260415-01</td><td>清蒸鱼</td><td><span class="tag tag-green">标准份(500g)</span></td><td><span class="tag tag-gray">保鲜盒</span></td><td>8</td><td>草鱼 100g<br>姜片适量</td><td>2026-04-15</td><td>2026-04-17</td><td>3.5</td><td>INT-002</td><td>陈配餐</td><td>PKG-T03</td><td><span class="tag tag-green">人工录入</span></td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-DH-20260415-03</td><td>NC-PROC-BOCA-20260415-01</td><td>蒜蓉菠菜</td><td><span class="tag tag-green">标准份(500g)</span></td><td><span class="tag tag-gray">冷鲜袋</span></td><td>12</td><td>净菠菜 120g<br>大蒜 8g</td><td>2026-04-15</td><td>2026-04-17</td><td>4.0</td><td>EXT-001</td><td>陈配餐</td><td>PKG-T04</td><td><span class="tag tag-green">人工录入</span></td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-DH-20260415-04</td><td>NC-PROC-HLUB-20260415-01</td><td>炒胡萝卜</td><td><span class="tag tag-blue">大份(800g)</span></td><td><span class="tag tag-gray">保鲜盒</span></td><td>6</td><td>净胡萝卜 260g<br>葱姜适量</td><td>2026-04-15</td><td>2026-04-17</td><td>4.2</td><td>INT-003</td><td>赵配餐</td><td>PKG-T04</td><td><span class="tag tag-blue">设备自动</span></td><td class="td-actions"><span class="link">查看视频</span> <span class="link">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-DH-20260415-01</td><td>宫保鸡丁</td><td><span class="tag tag-green">标准份(500g)</span></td><td><span class="tag tag-gray">冷鲜袋</span></td><td>10</td><td><span class="link" onclick="showIngredients(0)">3种</span></td><td>2026-04-15</td><td>2026-04-17</td><td>3.8</td><td>赵配餐</td><td>PKG-T03</td><td><span class="tag tag-blue">设备自动</span></td><td class="td-actions"><span class="link">查看视频</span> <span class="link" onclick="openEditDh(this)">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-DH-20260415-01</td><td>宫保鸡丁</td><td><span class="tag tag-green">标准份(500g)</span></td><td><span class="tag tag-gray">冷鲜袋</span></td><td>10</td><td><span class="link" onclick="showIngredients(0)">3种</span></td><td>2026-04-15</td><td>2026-04-17</td><td>3.8</td><td>赵配餐</td><td>PKG-T03</td><td><span class="tag tag-blue">设备自动</span></td><td class="td-actions"><span class="link">查看视频</span> <span class="link" onclick="openEditDh(this)">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-DH-20260415-02</td><td>清蒸鱼</td><td><span class="tag tag-green">标准份(500g)</span></td><td><span class="tag tag-gray">保鲜盒</span></td><td>8</td><td><span class="link" onclick="showIngredients(1)">2种</span></td><td>2026-04-15</td><td>2026-04-17</td><td>3.5</td><td>陈配餐</td><td>PKG-T03</td><td><span class="tag tag-green">人工录入</span></td><td class="td-actions"><span class="link">查看视频</span> <span class="link" onclick="openEditDh(this)">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-DH-20260415-03</td><td>蒜蓉菠菜</td><td><span class="tag tag-green">标准份(500g)</span></td><td><span class="tag tag-gray">冷鲜袋</span></td><td>12</td><td><span class="link" onclick="showIngredients(2)">2种</span></td><td>2026-04-15</td><td>2026-04-17</td><td>4.0</td><td>陈配餐</td><td>PKG-T04</td><td><span class="tag tag-green">人工录入</span></td><td class="td-actions"><span class="link">查看视频</span> <span class="link" onclick="openEditDh(this)">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
<tr><td>BATCH-DH-20260415-04</td><td>炒胡萝卜</td><td><span class="tag tag-blue">大份(800g)</span></td><td><span class="tag tag-gray">保鲜盒</span></td><td>6</td><td><span class="link" onclick="showIngredients(3)">2种</span></td><td>2026-04-15</td><td>2026-04-17</td><td>4.2</td><td>赵配餐</td><td>PKG-T04</td><td><span class="tag tag-blue">设备自动</span></td><td class="td-actions"><span class="link">查看视频</span> <span class="link" onclick="openEditDh(this)">编辑</span> <span class="link" style="color:var(--danger)">删除</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@@ -364,20 +373,16 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
|
||||
<!-- 弹窗:新增餐品净菜包 -->
|
||||
<div class="modal-mask" id="modal-dh">
|
||||
<div class="modal">
|
||||
<div class="modal" style="width:780px;">
|
||||
<div class="modal__header">
|
||||
<div class="modal__title">新增餐品净菜包</div>
|
||||
<div class="modal__title" id="modalDhTitle">新增餐品净菜包</div>
|
||||
<button class="modal__close" onclick="closeModal('modal-dh')">✕</button>
|
||||
</div>
|
||||
<div class="modal__body">
|
||||
<div class="form-grid">
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">溯源码<span class="required">*</span></div>
|
||||
<input placeholder="请输入溯源码">
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">包装餐品<span class="required">*</span></div>
|
||||
<select><option value="">请选择餐品</option><option>宫保鸡丁</option><option>清蒸鱼</option><option>蒜蓉菠菜</option><option>炒胡萝卜</option><option>红烧排骨</option></select>
|
||||
<select id="dishSelect" onchange="onDishChange(this.value)"><option value="">请选择餐品</option><option>宫保鸡丁</option><option>清蒸鱼</option><option>蒜蓉菠菜</option><option>炒胡萝卜</option><option>红烧排骨</option></select>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">包装规格<span class="required">*</span></div>
|
||||
@@ -393,13 +398,19 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
</div>
|
||||
<div class="form-item full">
|
||||
<div class="form-item__label">包含食材<span class="required">*</span></div>
|
||||
<div class="ingredient-list" id="ingredientList">
|
||||
<div class="ingredient-row">
|
||||
<input placeholder="食材名称及用量,如:鸡胸肉 120g">
|
||||
<button class="btn-icon btn-del" onclick="removeIngredient(this)" title="删除">✕</button>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn-add-row" onclick="addIngredient()">+ 添加食材</button>
|
||||
<table class="ing-table" id="ingFormTable">
|
||||
<thead><tr><th>食材溯源码</th><th>食材名称</th><th>分类</th><th>每份用量</th><th style="width:40px;">操作</th></tr></thead>
|
||||
<tbody id="ingFormBody">
|
||||
<tr>
|
||||
<td><input placeholder="溯源码"></td>
|
||||
<td><select><option value="">请选择</option><option>鸡胸肉</option></select></td>
|
||||
<td><select><option value="">请选择</option><option>主材</option><option>辅材</option><option>调料</option></select></td>
|
||||
<td><input placeholder="如 120g"></td>
|
||||
<td><button class="btn-row-del" onclick="removeIngRow(this)" title="删除">✕</button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<button class="btn-add-row" onclick="addIngRow()">+ 添加食材</button>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__label">包装日期<span class="required">*</span></div>
|
||||
@@ -434,6 +445,25 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 弹窗:食材明细 -->
|
||||
<div class="modal-mask" id="modal-ing-detail">
|
||||
<div class="modal" style="width:640px;">
|
||||
<div class="modal__header">
|
||||
<div class="modal__title">食材明细 — <span id="ingDetailDish"></span></div>
|
||||
<button class="modal__close" onclick="closeModal('modal-ing-detail')">✕</button>
|
||||
</div>
|
||||
<div class="modal__body" style="padding:16px 24px;">
|
||||
<table class="ing-table" id="ingDetailTable">
|
||||
<thead><tr><th>食材溯源码</th><th>食材名称</th><th>分类</th><th>每份用量</th></tr></thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="modal__footer">
|
||||
<button class="btn btn-default" onclick="closeModal('modal-ing-detail')">关闭</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 弹窗:新增包装设备 -->
|
||||
<div class="modal-mask" id="modal-dev">
|
||||
<div class="modal" style="width:480px;">
|
||||
@@ -481,19 +511,94 @@ function closeModal(id){document.getElementById(id).classList.remove('show');}
|
||||
document.querySelectorAll('.modal-mask').forEach(m=>{
|
||||
m.addEventListener('click',e=>{if(e.target===m)m.classList.remove('show');});
|
||||
});
|
||||
// 食材动态行:添加
|
||||
function addIngredient(){
|
||||
var list=document.getElementById('ingredientList');
|
||||
var row=document.createElement('div');
|
||||
row.className='ingredient-row';
|
||||
row.innerHTML='<input placeholder="食材名称及用量,如:花生 20g"><button class="btn-icon btn-del" onclick="removeIngredient(this)" title="删除">✕</button>';
|
||||
list.appendChild(row);
|
||||
|
||||
/* ========== 餐品食材数据 ========== */
|
||||
var dishIngredients={
|
||||
'宫保鸡丁':[
|
||||
{trace:'NC-PROC-JXR-20260415-01',name:'鸡胸肉',type:'主材',amount:'120g'},
|
||||
{trace:'NC-PROC-HUS-20260415-01',name:'花生',type:'辅材',amount:'20g'},
|
||||
{trace:'NC-PROC-GLJ-20260415-01',name:'干辣椒',type:'调料',amount:'5g'}
|
||||
],
|
||||
'清蒸鱼':[
|
||||
{trace:'NC-PROC-CYU-20260415-01',name:'草鱼',type:'主材',amount:'100g'},
|
||||
{trace:'NC-PROC-JPN-20260415-01',name:'姜片',type:'调料',amount:'适量'}
|
||||
],
|
||||
'蒜蓉菠菜':[
|
||||
{trace:'NC-PROC-BOC-20260415-01',name:'净菠菜',type:'主材',amount:'120g'},
|
||||
{trace:'NC-PROC-DSN-20260415-01',name:'大蒜',type:'调料',amount:'8g'}
|
||||
],
|
||||
'炒胡萝卜':[
|
||||
{trace:'NC-PROC-HLB-20260415-01',name:'净胡萝卜',type:'主材',amount:'260g'},
|
||||
{trace:'NC-PROC-CJG-20260415-01',name:'葱姜',type:'调料',amount:'适量'}
|
||||
]
|
||||
};
|
||||
// 列表行对应的餐品名(与tbody行序一致)
|
||||
var dishNames=['宫保鸡丁','宫保鸡丁','清蒸鱼','蒜蓉菠菜','炒胡萝卜'];
|
||||
|
||||
/* ========== 食材明细弹窗 ========== */
|
||||
function showIngredients(idx){
|
||||
var dish=dishNames[idx];
|
||||
var ings=dishIngredients[dish]||[];
|
||||
document.getElementById('ingDetailDish').textContent=dish;
|
||||
var tagCls={'主材':'tag-blue','辅材':'tag-green','调料':'tag-orange'};
|
||||
var tbody=document.querySelector('#ingDetailTable tbody');
|
||||
tbody.innerHTML=ings.map(function(i){
|
||||
return '<tr><td>'+i.trace+'</td><td>'+i.name+'</td><td><span class="tag '+tagCls[i.type]+'">'+i.type+'</span></td><td>'+i.amount+'</td></tr>';
|
||||
}).join('');
|
||||
openModal('modal-ing-detail');
|
||||
}
|
||||
// 食材动态行:删除(至少保留一行)
|
||||
function removeIngredient(btn){
|
||||
var list=document.getElementById('ingredientList');
|
||||
if(list.children.length>1)btn.parentElement.remove();
|
||||
|
||||
/* ========== 新增/编辑餐品净菜包弹窗 ========== */
|
||||
// 构建食材行 HTML
|
||||
function buildIngRow(trace,name,type,amount){
|
||||
var foods=['鸡胸肉','花生','干辣椒','草鱼','姜片','净菠菜','大蒜','净胡萝卜','葱姜'];
|
||||
var fOpts='<option value="">请选择</option>';
|
||||
foods.forEach(function(f){fOpts+='<option'+(name===f?' selected':'')+'>'+f+'</option>';});
|
||||
var types=['主材','辅材','调料'];
|
||||
var tOpts='<option value="">请选择</option>';
|
||||
types.forEach(function(t){tOpts+='<option'+(type===t?' selected':'')+'>'+t+'</option>';});
|
||||
return '<tr><td><input value="'+(trace||'')+'" placeholder="溯源码"></td><td><select>'+fOpts+'</select></td><td><select>'+tOpts+'</select></td><td><input value="'+(amount||'')+'" placeholder="如 120g"></td><td><button class="btn-row-del" onclick="removeIngRow(this)" title="删除">✕</button></td></tr>';
|
||||
}
|
||||
// 餐品选择变化 → 自动填充食材表格
|
||||
function onDishChange(val){
|
||||
var ings=dishIngredients[val]||[];
|
||||
var tbody=document.getElementById('ingFormBody');
|
||||
if(ings.length===0){tbody.innerHTML=buildIngRow('','','','');return;}
|
||||
tbody.innerHTML=ings.map(function(i){return buildIngRow(i.trace,i.name,i.type,i.amount);}).join('');
|
||||
}
|
||||
// 添加食材行
|
||||
function addIngRow(){
|
||||
var tbody=document.getElementById('ingFormBody');
|
||||
tbody.insertAdjacentHTML('beforeend',buildIngRow('','','',''));
|
||||
}
|
||||
// 删除食材行(至少保留一行)
|
||||
function removeIngRow(btn){
|
||||
var tbody=document.getElementById('ingFormBody');
|
||||
if(tbody.children.length>1)btn.closest('tr').remove();
|
||||
}
|
||||
// 编辑按钮:从列表行读取数据并打开弹窗
|
||||
function openEditDh(el){
|
||||
var tr=el.closest('tr');
|
||||
var tds=tr.querySelectorAll('td');
|
||||
document.getElementById('modalDhTitle').textContent='编辑餐品净菜包';
|
||||
var dishSel=document.getElementById('dishSelect');
|
||||
var dishName=tds[1].textContent;
|
||||
for(var i=0;i<dishSel.options.length;i++){
|
||||
if(dishSel.options[i].text===dishName){dishSel.selectedIndex=i;break;}
|
||||
}
|
||||
onDishChange(dishName);
|
||||
openModal('modal-dh');
|
||||
}
|
||||
// 新增时重置弹窗标题
|
||||
var _origOpenModal=openModal;
|
||||
openModal=function(id){
|
||||
if(id==='modal-dh'){
|
||||
document.getElementById('modalDhTitle').textContent='新增餐品净菜包';
|
||||
document.getElementById('dishSelect').selectedIndex=0;
|
||||
document.getElementById('ingFormBody').innerHTML=buildIngRow('','','','');
|
||||
}
|
||||
_origOpenModal(id);
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user