{% extends "base.html" %}
{% block title %}{{ '编辑 BOM' if b else '新增 BOM' }}{% endblock %}
{% block content %}
<form method="post" class="card form-card" style="max-width:640px">
  <h3>{{ '编辑 BOM' if b else '新增 BOM' }}</h3>
  <label>BOM 型号 *</label>
  <input name="code" value="{{ form_code if form_code is defined else (b.code if b else '') }}" required>
  <label>名称</label>
  <input name="name" value="{{ b.name if b else '' }}">
  <label>备注</label>
  <input name="note" value="{{ b.note if b else '' }}">

  <h3>组成物料 (单套用量)</h3>
  <div id="items">
    {% for it in items %}
    <div class="item-row" style="display:flex;gap:8px;margin-bottom:6px">
      <input name="pn" placeholder="物料编号" value="{{ it.pn }}" style="flex:2">
      <input name="qty" type="number" step="0.01" min="0" placeholder="单套用量" value="{{ it.qty }}" style="flex:1">
      <button type="button" class="del" onclick="this.parentNode.remove()">✕</button>
    </div>
    {% else %}
    <div class="item-row" style="display:flex;gap:8px;margin-bottom:6px">
      <input name="pn" placeholder="物料编号" style="flex:2">
      <input name="qty" type="number" step="0.01" min="0" placeholder="单套用量" style="flex:1">
      <button type="button" class="del" onclick="this.parentNode.remove()">✕</button>
    </div>
    {% endfor %}
  </div>
  <button type="button" class="btn" onclick="addRow()">+ 添加一行</button>
  <div class="row-actions"><button class="primary">保存</button></div>
</form>

<script>
function addRow(){
  const d=document.createElement('div');
  d.className='item-row';
  d.style='display:flex;gap:8px;margin-bottom:6px';
  d.innerHTML='<input name="pn" placeholder="物料编号" style="flex:2">'+
    '<input name="qty" type="number" step="0.01" min="0" placeholder="单套用量" style="flex:1">'+
    '<button type="button" class="del" onclick="this.parentNode.remove()">✕</button>';
  document.getElementById('items').appendChild(d);
}
</script>
{% endblock %}