Shopify开发技术求助：如何通过条件语句终止循环，实现客户账户页预约信息的正确展示

Hey Julien, let's get this upcoming booking display sorted out for your Shopify store—your current code is having issues because it's not properly separating the "check for future bookings" logic from the "display nothing or show a message" step. Let's break down the problem and fix it cleanly.

The Issue with Your Current Code #

Right now, your code only shows the "no bookings" message if the customer has no orders at all. If they have past bookings but no upcoming ones, your loops just run through all old orders without displaying anything, and the message never triggers. Worse, if you accidentally nested the message inside one of the inner loops, it would repeat for every past order—exactly what you're seeing.

A Clean, Fixed Solution #

Instead of checking for future bookings while looping, let's first collect all valid upcoming bookings into an array, then decide what to display based on that array. This keeps the logic clear and avoids duplicate messages.

Here's the revised code you can drop into your customer/account.liquid file:

{% comment %} Initialize an empty array to hold upcoming bookings {% endcomment %}
{% assign upcoming_bookings = '' | split: '' %}
{% assign today_timestamp = 'now' | date: '%s' %}

{% comment %} Loop through all customer orders and collect future bookings {% endcomment %}
{% if customer.orders != blank %}
  {% for order in customer.orders %}
    {% for line_item in order.line_items %}
      {% comment %} Grab the first property (your Sesami booking date) {% endcomment %}
      {% assign booking_date = line_item.properties | first %}
      
      {% if booking_date %}
        {% assign booking_timestamp = booking_date.last | date: '%s' %}
        {% comment %} Only keep bookings that are today or later {% endcomment %}
        {% if booking_timestamp >= today_timestamp %}
          {% assign upcoming_bookings = upcoming_bookings | push: line_item %}
        {% endif %}
      {% endif %}
    {% endfor %}
  {% endfor %}
{% endif %}

{% comment %} Now display either the bookings or the no-bookings message {% endcomment %}
{% if upcoming_bookings.size > 0 %}
  <h3>Your Upcoming Bookings</h3>
  {% for booking in upcoming_bookings %}
    <div class="booking-card">
      <!-- Booking product title with link -->
      {{ booking.product.title | link_to: booking.product.url }}
      
      <!-- Booking date -->
      {% assign date_property = booking.properties | first %}
      {% if date_property %}
        <p class="booking-date">
          {{ date_property.last | date: format: 'abbreviated_date' }} {{ 'customer.orders.at' | t }}
        </p>
      {% endif %}
      
      <!-- Additional booking details from properties -->
      {% for property in booking.properties offset:1 %}
        {% if property.last != blank %}
          <p class="booking-detail">{{ property.last }}</p>
        {% endif %}
      {% endfor %}
      
      <!-- Booking product image -->
      {% if booking.image %}
        {{ booking.image | img_url: 'small' | img_tag: booking.product.title, 'booking-image' }}
      {% endif %}
      
      <!-- Booking status -->
      <p class="booking-status">{{ booking.order.fulfillment_status_label }}</p>
    </div>
  {% endfor %}
{% else %}
  <p>You don't have any upcoming bookings yet. Head over to our booking page to schedule your next service!</p>
{% endif %}

Key Improvements #

• Centralized Collection: We first gather all future bookings into an array, so we only check once if there's anything to show.
• Avoids Duplicate Logic: Calculating the current timestamp once (instead of in every loop iteration) is more efficient.
• Clearer Structure: Separating the "data collection" and "display" steps makes the code easier to debug and modify later.
• Covers All Cases: This works whether the customer has no orders, past orders only, or upcoming orders.

This should fix your duplicate message issue and properly show either upcoming bookings or a friendly prompt when there are none.

内容的提问来源于stack exchange，提问作者JulienA