{% do view.registerTranslations('commerce', [
    'Name',
]) %}

<div class="commerce-widget-table-wrapper">
  <div id="{{ id }}"></div>
</div>

{% set tableData = [] %}
{% for stat in stats %}
  {% set tableData = tableData|merge([{
    title: (stat.productType ? stat.productType.name : stat.name),
    qty: stat.qty,
    revenue: stat.revenue|commerceCurrency(craft.commerce.paymentCurrencies.getPrimaryPaymentCurrencyIso()),
  }]) %}
{% endfor %}

{% js %}
var columns = [
    { name: '__slot:title', title: Craft.escapeHtml(Craft.t('commerce', 'Name')) },
    { name: '{{ type }}', title: '{{ typeLabel|e }}' }
];

new Craft.VueAdminTable({
    columns: columns,
    container: '#{{ id }}',
    tableData: {{ tableData|json_encode|raw }}
});
{% endjs %}