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

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

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 %}