<!-- 爱发电赞助组件 -->
<div class="afdian-widget">
  <div class="author-content-item single reward" id="about-reward">
    <div class="author-content-item-tips">致谢</div>
    <span class="author-content-item-title"><%= config.afdian.title || '赞助名单' %></span>
    <div class="author-content-item-description">
      <%= config.afdian.description || '感谢赞赏的人，因为你们，让我感受到写博客这件事情能够给你们创造价值。' %>
    </div>
    <div class="about-reward">
      <div id="con"></div>
      <div id="TA-con" onclick="window.open('<%= config.afdian.sponsorUrl || 'https://afdian.com/' %>', '_blank')">
        <div id="text-con">
          <div id="linght"></div>
          <div id="TA"><%= config.afdian.buttonText || '赞赏作者' %></div>
        </div>
      </div>
      <div id="tube-con">
        <svg viewBox="0 0 1028 385" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M1 77H234.226L307.006 24H790" stroke="#e5e9ef" stroke-width="20"></path>
          <path d="M0 140H233.035L329.72 71H1028" stroke="#e5e9ef" stroke-width="20"></path>
          <path d="M1 255H234.226L307.006 307H790" stroke="#e5e9ef" stroke-width="20"></path>
          <path d="M0 305H233.035L329.72 375H1028" stroke="#e5e9ef" stroke-width="20"></path>
          <rect y="186" width="236" height="24" fill="#e5e9ef"></rect>
          <ellipse cx="790" cy="25.5" rx="25" ry="25.5" fill="#e5e9ef"></ellipse>
          <circle r="14" transform="matrix(1 0 0 -1 790 25)" fill="white"></circle>
          <ellipse cx="790" cy="307.5" rx="25" ry="25.5" fill="#e5e9ef"></ellipse>
          <circle r="14" transform="matrix(1 0 0 -1 790 308)" fill="white"></circle>
        </svg>
        <div id="mask">
          <svg viewBox="0 0 1028 385" fill="none" xmlns="http://www.w3.org/2000/svg">
            <path d="M1 77H234.226L307.006 24H790" stroke="#f25d8e" stroke-width="20"></path>
            <path d="M0 140H233.035L329.72 71H1028" stroke="#f25d8e" stroke-width="20"></path>
            <path d="M1 255H234.226L307.006 307H790" stroke="#f25d8e" stroke-width="20"></path>
            <path d="M0 305H233.035L329.72 375H1028" stroke="#f25d8e" stroke-width="20"></path>
            <rect y="186" width="236" height="24" fill="#f25d8e"></rect>
            <ellipse cx="790" cy="25.5" rx="25" ry="25.5" fill="#f25d8e"></ellipse>
            <circle r="14" transform="matrix(1 0 0 -1 790 25)" fill="white"></circle>
            <ellipse cx="790" cy="307.5" rx="25" ry="25.5" fill="#f25d8e"></ellipse>
            <circle r="14" transform="matrix(1 0 0 -1 790 308)" fill="white"></circle>
          </svg>
        </div>
        <div id="orange-mask">
          <svg viewBox="0 0 1028 385" fill="none" xmlns="http://www.w3.org/2000/svg">
            <path d="M1 77H234.226L307.006 24H790" stroke="#ffd52b" stroke-width="20"></path>
            <path d="M0 140H233.035L329.72 71H1028" stroke="#ffd52b" stroke-width="20"></path>
            <path d="M1 255H234.226L307.006 307H790" stroke="#ffd52b" stroke-width="20"></path>
            <path d="M0 305H233.035L329.72 375H1028" stroke="#ffd52b" stroke-width="20"></path>
            <rect y="186" width="236" height="24" fill="#ffd52b"></rect>
            <ellipse cx="790" cy="25.5" rx="25" ry="25.5" fill="#ffd52b"></ellipse>
            <circle r="14" transform="matrix(1 0 0 -1 790 25)" fill="white"></circle>
            <ellipse cx="790" cy="307.5" rx="25" ry="25.5" fill="#ffd52b"></ellipse>
            <circle r="14" transform="matrix(1 0 0 -1 790 308)" fill="white"></circle>
          </svg>
        </div>
        <p id="people">共<b><%= sponsors ? sponsors.length : 0 %></b>人</p>
      </div>
    </div>
    <div class="reward-list-all">
      <% if (sponsors && sponsors.length > 0) { %>
        <% sponsors.slice(0, 6).forEach(function(sponsor) { %>
          <div class="reward-list-item">
            <div>
              <div>
                <div class="reward-list-item-avatar">
                  <img alt="<%= sponsor.name %>" src="<%= sponsor.avatar %>" onerror="this.src='/afdian/images/default-avatar.svg'; this.onerror=null;">
                </div>
                <div style="z-index:20;float: left;" class="reward-list-item-avatar-group">
                  <div class="reward-list-item-name" title="<%= sponsor.name %>"><%= sponsor.name %></div>
                </div>
              </div>
              <div class="reward-list-bottom-group">
                <% const sponsorNumber = config.afdian.sponsorNumber || 66; %>
                <% if (parseFloat(sponsor.amount) >= parseFloat(sponsorNumber)) { %>
                  <div class="reward-list-item-money vip">
                    ¥ <b><%= sponsor.amount %></b>
                  </div>
                <% } else { %>
                  <div class="reward-list-item-money">
                    ¥ <b><%= sponsor.amount %></b>
                  </div>
                <% } %>
                <time class="datatime reward-list-item-time"><%= sponsor.time %></time>
              </div>
            </div>
          </div>
        <% }); %>
      <% } else { %>
        <div class="no-sponsor"><%= config.afdian.emptyText || '暂无赞助' %></div>
      <% } %>
    </div>
    <% if (sponsors && sponsors.length > 6) { %>
      <div class="more-sponsor">
        <a href="/afdian/" class="more-sponsor-link">查看更多赞助者</a>
      </div>
    <% } %>
  </div>
</div>
