feat: 库存看板 BOM 标签页改为可下拉选择指定 BOM

- 看板 BOM 物料齐套标签页顶部新增「选择 BOM」下拉框: 默认"全部 BOM(总览)"列出所有 BOM,
  选中某棵则只看该 BOM 的组成物料与齐套状态
- 卡片加 data-bid, 切换下拉时纯前端过滤显示; 右侧显示"共 N 棵 / 已选 1/N 棵"计数
- 新增 .bom-filter 样式(下拉框与标签同行, 不撑满整行)
- 教程同步更新 BOM 看板章节

static/style.css

@@ -73,6 +73,11 @@ button:hover, .btn:hover { filter: brightness(.96); }
 .card-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; font-size: 15px; }
 .card-head strong { font-size: 16px; }
 
+/* BOM 看板: 下拉选择器 */
+.bom-filter { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
+.bom-filter label { margin: 0; white-space: nowrap; }
+.bom-filter select { width: auto; min-width: 260px; }
+
 /* 批量导入窗口(模态) */
 .modal-mask {
   position: fixed; inset: 0; background: rgba(15,23,35,.5);

templates/dashboard.html

@@ -42,8 +42,19 @@
 {% if can_bom %}
 <!-- 标签二: BOM 物料齐套看板 -->
 <div id="tab-bom" style="display:none">
+  {% if bom_board %}
+  <div class="bom-filter">
+    <label for="bomSelect">选择 BOM</label>
+    <select id="bomSelect" onchange="filterBom()">
+      <option value="all">全部 BOM（总览）</option>
+      {% for bb in bom_board %}
+      <option value="{{ bb.b.id }}">{{ bb.b.code }}{% if bb.b.name %} · {{ bb.b.name }}{% endif %}</option>
+      {% endfor %}
+    </select>
+    <span class="muted" id="bomCount"></span>
+  </div>
   {% for bb in bom_board %}
-  <div class="card" style="margin-bottom:16px">
+  <div class="card" data-bid="{{ bb.b.id }}" style="margin-bottom:16px">
     <div class="card-head">
       <strong>{{ bb.b.code }}</strong>
       <span class="muted">{{ bb.b.name or '' }}</span>
@@ -75,9 +86,10 @@
       </tbody>
     </table>
   </div>
+  {% endfor %}
   {% else %}
   <p class="muted">暂无 BOM，请先到 BOM 页面导入或新建。</p>
-  {% endfor %}
+  {% endif %}
 </div>
 {% endif %}
 
@@ -87,6 +99,19 @@ function showTab(id, btn){
   document.getElementById('tab-bom').style.display = id==='bom' ? 'block' : 'none';
   document.querySelectorAll('.tabs .tab').forEach(b=>b.classList.remove('active'));
   btn.classList.add('active');
+  if(id==='bom') filterBom();
 }
+function filterBom(){
+  var sel = document.getElementById('bomSelect');
+  if(!sel) return;
+  var v = sel.value;
+  var cards = document.querySelectorAll('#tab-bom [data-bid]');
+  cards.forEach(function(c){
+    c.style.display = (v==='all' || c.getAttribute('data-bid')===v) ? 'block' : 'none';
+  });
+  var cnt = document.getElementById('bomCount');
+  if(cnt) cnt.textContent = (v==='all') ? ('共 ' + cards.length + ' 棵 BOM') : ('已选 1 / ' + cards.length + ' 棵');
+}
+filterBom();
 </script>
 {% endblock %}

物料入库出库系统_使用教程.md

@@ -77,7 +77,7 @@
 
 顶部会汇总「负库存数量」「低于安全库存数量」两个计数，方便快速排查。
 
-> **BOM 物料齐套标签页**：看板顶部有「📦 库存预警 / 🔧 BOM 物料齐套」两个标签（仅管理员、主管可见）。切到 **BOM 物料齐套** 后，会逐棵 BOM 列出其组成物料的「单套用量 / 当前在库 / 状态」，并在 BOM 标题处给出整体齐套结论（齐套 / 部分偏低 / 缺料）。点物料编号可跳到该料明细。这样不用进 BOM 列表就能在看板上直接看清每棵 BOM 里每颗料的库存情况。
+> **BOM 物料齐套标签页**：看板顶部有「📦 库存预警 / 🔧 BOM 物料齐套」两个标签（仅管理员、主管可见）。切到 **BOM 物料齐套** 后，顶部有一个「选择 BOM」下拉框：默认「全部 BOM（总览）」会逐棵列出其组成物料的「单套用量 / 当前在库 / 状态」；选中某棵 BOM 则只看那棵。右侧显示「共 N 棵 / 已选 1/N 棵」计数。每棵 BOM 标题处给出整体齐套结论（齐套 / 部分偏低 / 缺料），点物料编号可跳到该料明细。这样不用进 BOM 列表就能在看板上直接看清每棵 BOM 里每颗料的库存情况。
 
 ---