【<%= @product.title %>】 - 价格: ￥<%= @product.price %>，销量: <%= @product.sold_count %>，评价: <%= @product.review_count %>，评分: <%= @product.rating %> - 购买

                <li class="list-group-item"><label>价格</label><em>￥</em><span><%= @product.price %></span></li>
                <li class="list-group-item d-flex justify-content-between">
                  <div>
                    累计销量 <span class="count"><%= @product.sold_count %></span>
                  </div>
                  <div>
                  累计评价 <span class="count"><%= @product.review_count %></span>
                  </div>
                  <div  <%= @product.rating %>>
                    评分 <span class="count"><%= '★' * @product.rating.floor %><%= '☆' * (5 - @product.rating.floor) %></span>
                  </div>
                </li>
                <li class="list-group-item">
                  <label>选择</label>
                  <div class="btn-group" data-bs-toggle="buttons">
                    <% @product.product_skus.each do |product_sku|%>
                      <label class="btn btn-default sku-btn" title="<%= product_sku.description %>"
                        data-stock="<%= product_sku.stock %>">
                        <input type="radio" name="skus" autocomplete="off" value="<%= product_sku.id %>">
                        <%= product_sku.title %>
                      </label>
                    <% end %>
                  </div>
                </li>
                <li class="list-group-item  d-flex justify-content-between">
                  <label>数量</label>
                  <input type="text" class="form-control" value="1"><span>件</span>
                  <span>库存</span><span class="stock"><%= @product.product_skus.first.stock %></span><span>件</span>
                </li>
              </ul>

             
            </div>

            <script>
              const skuButtons = document.querySelectorAll('.sku-btn');

              skuButtons.forEach(button => {
                button.addEventListener('change', () => {
                  const selectedSku = document.querySelector('input[name="skus"]:checked');
                  const stock = selectedSku.parentElement.dataset.stock;
                  const stockElement = document.querySelector('.list-group-item .stock');
                  stockElement.textContent = stock;
                });
              });
            </script>