Orders Customer Dashboard with Infinite Scroll & Timeline, Search form, & holding area for Pending Orders.

gistfile1.txt

<div id="service-orders">
  <h1>Orders</h1>
  <div>
    <%= search_form_for @orders_search, url: service_orders_path, method: :get, class: 'search-form', builder: TailwindBuilder do |f| %>
      <div class='fields'>
        <%= f.select :property_id_eq,
        [['All Properties', nil]] + @properties.map{ |property| [property.address, property.id] },
        { label_text: 'Property' },
        { include_blank: false } %>
        <%= f.select :schedule_date_eq, [
            ['Last 30 days', 'scheduled_last_30_days'],
            ['Last 90 days', 'scheduled_last_90_days'],
            ['Last 12 months', 'scheduled_last_12_months'],
            ['This year', 'scheduled_this_year'],
            ['Last year', 'scheduled_last_year'],
            ['All Time', 'all']],
            { label_text: 'Timeframe' }, selected: 'all' %>
        <%= f.select :status_matches, [
            ['Scheduled', OrderStatus::SCHEDULED],
            ['In Progress', OrderStatus::PAPERWORK],
            ['Finished', OrderStatus::FINISHED],
            ['Cancelled', OrderStatus::CANCELLED],
            ['All Statuses', 'all']],
            { label_text: 'Status' }, selected: 'all' %>
      </div>
      <div class='actions'>
        <%= f.button 'Search', class: 'btn btn-small btn-primary' %>
      </div>
      <div class='flex-1 text-right actions'>
        <%= link_to 'Create a New Order', new_service_internet_order_path, class: 'btn btn-info' %>
      </div>
    <% end %>
  </div>

  <div>
    <h2>Pending Orders</h2>
    <% if @internet_orders.any? %>
      <div class='p-2'>
        <table class="datatable">
          <thead>
            <tr>
              <th>Address</th>
              <th>Service Requested</th>
              <th>Bill To</th>
              <th>Submitted</th>
            </tr>
          </thead>
          <tbody>
            <% @internet_orders.each do |order| %>
              <tr>
                <td><%= order&.short_address %></td>
                <td><%= order&.service_requested %></td>
                <td><%= order&.bill_to %></td>
                <td><%= date_and_time(order.created_at) %></td>
              </tr>
            <% end %>
          </tbody>
        </table>
      </div>
    <% end %>
  </div>

  <div>
    <h2>All Orders</h2>
    <% if @order_results.empty? %>
      <div class='text-center text-pn-dark'>No Orders Found</div>
    <% else %>
      <%= turbo_frame_tag "my-order-page-#{@pagy.page}" do %>
        <div id="orders">
          <div class='mx-auto'>
            <% @order_results.each do |result| %>
              <% if result[:year] %>
                <div class="year"><%= result[:year] %></div>
              <% else %>
                <block>
                  <div class='actions'>
                    <%= link_to "Reschedule", scheduling_service_order_path(result.id, reload: '/orders'), class: "btn btn-warning btn-small", data: { turbo_stream: true }  if result.can_reschedule && Time.zone.now <= result.schedule_date.in_time_zone.beginning_of_day - 14.hours %>
                    <%= link_to "Make Payment", new_service_payment_path(order_id: result.id), data: { turbo_stream: true }, class: "btn btn-danger btn-small" if result.current_balance.negative? %>

                    <% if result.order_document_path.present? %>
                      <%= link_to 'Download Order Documents', "/file?path=#{result.order_document_path}", class: 'btn btn-action', target: '_pdf' %>
                    <% end %>
                    <%= link_to "Order Details", service_order_path(id: result.id), data: { turbo: false }, class: "btn btn-action" %>
                  </div>
                  <row>
                    <field>
                      <label>Order Id</label>
                      <span><%= result&.id %></span>
                    </field>
                    <field>
                      <label>Address</label>
                      <span><%= result['address']%></span>
                    </field>
                  </row>
                  <row>
                    <field>
                      <label>Service</label>
                      <span><%= result&.service_code['service_group']['public_description'] || 'Unknown' if result.service_code.present?%></span>
                    </field>
                    <field>
                      <label>Status</label>
                      <span><%= result&.status %></span>
                    </field>
                  </row>
                  <row>
                    <field class='<%= 'text-red-800 font-semibold' if result.schedule_date >= Time.zone.now %>'>
                      <label>Service Scheduled</label>
                      <span ><%= order_schedule(result.id) %></span>
                    </field>
                  </row>
                  <row>
                    <field>
                      <label>Total Price</label>
                      <span><%= currency_text(result&.total_price) %></span>
                    </field>
                    <field>
                      <label>Amount Due</label>
                      <span><%= currency_text(result&.current_balance) %></span>
                    </field>
                  </row>
                </block>
              <% end %>
            <% end %>
          </div>
          <% if @pagy.next %>
            <%= turbo_frame_tag "my-order-page-#{@pagy.next}",
                        loading: :lazy,
                         src: pagy_url_for_year(@pagy, @pagy.next, @current_year) do %>
              <div class="bg-blue-600">Loading...</div>
            <% end %>
          <% else %>
            <div class="text-sm italic text-center text-slate-700">End of Results</div>
          <% end %>
        </div>
      <%  end %>
    <% end %>
  </div>
</div>