Tài liệu xStore

Hướng dẫn phát triển giao diện storefront

account/product-views

Sản phẩm khách đã xem gần đây.

Ngoài những biến dưới đây, slot này còn nhận toàn bộ biến toàn cục.

Biến của trang

Biến Kiểu Mô tả Từ phiên bản
views ProductView[] Lượt xem, mỗi mục kèm đối tượng product đã dựng sẵn. 1.0
has_more boolean Còn trang tiếp theo hay không. 1.0
next_cursor string | null Con trỏ để tải trang kế; null khi đã hết. 1.0

Mã đầy đủ

Toàn bộ tệp account/product-views.html của bộ giao diện mặc định. Chép về templates/<bộ giao diện của bạn>/account/product-views.html rồi sửa theo ý muốn.

<div class="container page-content">
  <h1 class="page-title">Sản phẩm đã xem</h1>
  <div class="account-layout">
    {% assign active_page = 'views' %}
    {% include 'account/_sidebar' %}
    <div class="account-main">
      {% if views %}
        <div class="product-grid">
          {% for item in views %}
            <div class="product-card">
              {% if item.product.url %}
                <a href="{{ item.product.url }}" class="product-card__link">{{ item.product.title }}</a>
              {% else %}
                <span class="product-card__link">{{ item.product.title }}</span>
              {% endif %}
              <p class="product-card__meta">Xem {{ item.view_count }} lần · lần cuối {{ item.last_viewed_at | date: '%d/%m/%Y' }}</p>
            </div>
          {% endfor %}
        </div>
        {% if has_more %}
          <a href="/tai-khoan/san-pham-da-xem?cursor={{ next_cursor }}" class="btn btn--outline">Xem thêm</a>
        {% endif %}
      {% else %}
        <p class="empty-state">Bạn chưa xem sản phẩm nào.</p>
      {% endif %}
    </div>
  </div>
</div>