{extend name="layout" /}
{block name="main"}
<section class="section">
    <div class="container">
        <h1 class="section-title">{$crumb_name|default='产品中心'}</h1>
        {if condition="$cat"}
        <p class="cat-desc">{$cat.seo_description|default=''}</p>
        {/if}
        <div class="card-grid">
            {foreach $list as $pr}
            <article class="card">
                <a href="/product/{$pr.name}.html">
                    <img src="{$pr.cover|default='/static/img/placeholder.svg'}" loading="lazy" alt="{$pr.title}" width="320" height="200">
                </a>
                <div class="card-body">
                    <h3><a href="/product/{$pr.name}.html">{$pr.title}</a></h3>
                    <p>{$pr.summary|default=''}</p>
                    {if condition="$pr.price"}
                    <p class="price">¥{$pr.price}</p>
                    {/if}
                </div>
            </article>
            {/foreach}
        </div>
        <div class="pager">
            {$list->render()|raw}
        </div>
    </div>
</section>
{/block}