{include file="app/index/view/public/header"}

<div class="blog-hotbar">
  <span class="blog-hotbar-label">品牌中心</span>
  <div class="blog-hotbar-list">
    <span class="blog-hotbar-item"><b>🏷️</b>精选品牌</span>
    <span class="blog-hotbar-item"><b>💎</b>品质保证</span>
    <span class="blog-hotbar-item"><b>💰</b>品牌折扣</span>
  </div>
</div>

{if !empty($tips)}
<div class="mb-20" style="background:#fff7f7 ; border:1px solid #ffd6d6 ; color:#c0392b ; padding:12px 16px ; border-radius:10px ; font-size:14px">
  ⚠️ {$tips}
</div>
{/if}

<div class="row">
  <div class="column-big">
    {if !empty($Page['list'])}
      <div class="d-flex" style="flex-wrap:wrap ; gap:16px ; margin-bottom:24px">
      {foreach $Page['list'] as $vo}
      <article class="shadow-theme mobile-card-full minw-280 mw-380 of-hidden" style="flex:1 ; border-radius:16px ; border:1px solid rgba(0,0,0,0.06) ; transition:all 0.3s ease">
        <a href="{url($route='index/brand/view/id=<id>', $params=array('id'=>$vo['brandId']))}" target="_blank" class="d-block">
          <div class="pos-rel h-180 of-hidden">
            {if !empty($vo['brandLogo'])}
            <img src="{$vo['brandLogo']}" alt="{$vo['brandName']}" class="w-full h-full" style="object-fit:cover ; transition:transform 0.4s ease">
            {else}
            <div class="w-full h-full d-flex" style="background:linear-gradient(135deg,#667eea,#764ba2) ; align-items:center ; justify-content:center">
              <span style="font-size:48px;color:#fff;">🏷️</span>
            </div>
            {/if}
            <div class="pos-abs" style="bottom:0 ; left:0 ; right:0 ; height:40% ; background:linear-gradient(transparent, rgba(0,0,0,0.5))"></div>
            <div class="pos-abs" style="bottom:12px ; left:12px ; color:#fff">
              <h3 style="font-size:20px;font-weight:700;">{$vo['brandName']}</h3>
            </div>
          </div>
        </a>
          <div style="padding:16px;">
          {if !empty($vo['brandFeatures'])}
          <p class="mb-12 of-hidden" style="color:#666 ; font-size:13px ; line-height:1.6 ; display:-webkit-box ; -webkit-line-clamp:2 ; -webkit-box-orient:vertical">{$vo['brandFeatures']}</p>
          {/if}
          {if !empty($vo['goodsList'])}
          <div class="d-flex of-hidden" style="gap:6px ; margin-bottom:14px">
            {foreach $vo['goodsList'] as $g}
            {if $n <= 3}
            <a href="{url($route='index/view/detail', $params=array('id'=>$g['goodsId'], 'type'=>'taobao'))}" target="_blank" style="flex:1;min-width:0;">
              <img src="{$g['mainPic']}" alt="{$g['title']}" class="w-full h-74" style="object-fit:cover ; border-radius:8px ; background:#f5f5f5">
            </a>
            {/if}
            {/foreach}
          </div>
          {/if}
          <div class="d-flex" style="flex-wrap:wrap ; gap:8px ; margin-bottom:14px">
            {if !empty($vo['sales'])}
            <span style="background:#f0f5ff;color:#4080ff;padding:4px 10px;border-radius:6px;font-size:12px;">销量 {$vo['sales']}</span>
            {/if}
            {if !empty($vo['maxDiscountAmount'])}
            <span style="background:#fff0f0;color:#ff4757;padding:4px 10px;border-radius:6px;font-size:12px;">最高减¥{$vo['maxDiscountAmount']}</span>
            {/if}
            {if !empty($vo['maxDiscount'])}
            <span style="background:#fff8f0;color:#ff8c00;padding:4px 10px;border-radius:6px;font-size:12px;">{$vo['maxDiscount']}折</span>
            {/if}
            {if !empty($vo['commissionRate'])}
            <span style="background:#f0fff0;color:#30b060;padding:4px 10px;border-radius:6px;font-size:12px;">佣金{$vo['commissionRate']}%</span>
            {/if}
          </div>
          <a href="{url($route='index/brand/view/id=<id>', $params=array('id'=>$vo['brandId']))}" class="btn btn-buy w-full text-center" target="_blank" style="padding:10px ; background:linear-gradient(135deg,#667eea,#764ba2) ; color:#fff ; border:none ; border-radius:10px ; font-size:14px ; font-weight:600">查看品牌商品</a>
        </div>
      </article>
      {/foreach}
      </div>
      
      <div class="pagination text-center" style="margin-top:24px">{$Page['pages']}</div>
    {else}
      <div class="text-center" style="padding:80px 20px ; background:var(--conBgcolor) ; border-radius:20px ; box-shadow:var(--shadow) ; border:1px solid var(--borderColor)">
        <div class="mb-20" style="font-size:80px">🏷️</div>
        <h3 class="mb-12" style="font-size:24px ; color:var(--aColor) ; font-weight:700">暂无品牌</h3>
        <p style="color:var(--lightColor);margin-bottom:24px;font-size:15px;">
          {if !empty($cid)}该分类暂时没有品牌，去看看其他分类吧！
          {else}暂无品牌数据，请稍后再来查看！
          {/if}
        </p>
        <a href="{url($route='index/brand/index', $params=array())}" class="btn btn-buy" style="padding:12px 32px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:15px;font-weight:600;">查看全部品牌</a>
      </div>
    {/if}
  </div>
  {include file="app/index/view/public/sidebar"}
</div>

{include file="app/index/view/public/footer"}