health.applet/miniprogram/module/article/pages/order-detail/order-detail.wxml

<!--module/diet/pages/order-detail/order-detail.wxml-->
<t-navbar title="订单详情" left-arrow />

<scroll-view class="page-scroll__container" scroll-y>
  <!-- 订单号 -->
  <view class="info-box">
    <view class="order-no" wx:if="{{false}}">订单编号：0038532223</view>

    <!-- 收货人信息卡片 -->
    <view class="address-card" bindtap="changeAddress" wx:if="{{orderDetail.isDelivery==='Y'}}">
      <view class="delivery-address" wx:if="{{showDetail}}">
        请选择配送地址
      </view>
      <view class="address-header" wx:else>
        <text class="address-name" wx:if="{{name}}">{{name}}</text>
        <text class="address-phone" wx:if="{{phone}}">{{phone}}</text>
      </view>
      <view class="address-detail" wx:if="{{address}}">
        {{address}}
      </view>
    </view>
  </view>
  <view class="order-box">
    <view class="order-detail-scroll">
      <!-- 服务包信息 -->
      <view class="service-card">
        <t-image src="{{orderDetail.photo}}" class="service-img" wx:if="{{orderDetail.photo}}" />
        <view class="service-info">
          <view class="service-title">{{orderDetail.conditioningWrapName}}</view>
          <view class="service-doctor" wx:if="{{orderDetail.operateBy}}"><text style=" color: #888;">开具医生：</text>{{orderDetail.operateBy}}</view>
          <view class="service-time" wx:if="{{orderDetail.operateTime}}"><text style=" color: #888;">开具时间：</text>{{orderDetail.operateTime}}</view>

        </view>
      </view>
      <t-divider />
      <view class="service-date" wx:if="{{orderDetail.estimatedStartDate}}">开始日期：{{orderDetail.estimatedStartDate}}</view>
      <!-- 项目明细表格 -->
      <view class="item-table">
        <view class="table-header">
          <text class="table-cell">项目</text>
          <text class="table-cell">数量</text>
          <text class="table-cell">价格（元）</text>
        </view>
        <view class="table-row {{idx % 2 === 1 ? 'table-row-alt' : ''}}" wx:for="{{orderDetail.items}}" wx:for-index="idx" wx:key="name">
          <text class="table-cell">{{item.conditioningProgramDetail.name}}</text>
          <text class="table-cell">{{item.frequencyType==='不限'?'不限':item.totalMeasure}}{{item.conditioningProgramDetail.cpFixedPricingRule.pricingUnit}}</text>
          <text class="table-cell">{{item.totalPrice}}</text>
        </view>
        <view class="table-row table-total">
          <text class="table-cell total-title">合计</text>
          <text class="table-cell"></text>
          <text class="table-cell total-title">{{totalPrice}}</text>
        </view>
      </view>

      <!-- 订单金额 -->
      <view class="order-amount">
        <text>订单金额：</text>
        <text class="order-amount-value">￥{{totalPrice}}</text>
      </view>
    </view>
  </view>
  <t-dialog visible="{{showConfirm}}" content="确定要取消订单吗？" confirm-btn="{{ { content: '取消订单', variant: 'base', theme: 'primary' } }}" cancel-btn="再想想" bind:confirm="confirmDialog" bind:cancel="closeDialog" />
</scroll-view>


<!-- 底部按钮 -->
<view class="order-detail-footer">
  <!-- 待付款 -->
  <block wx:if="{{orderStatus === 'pending'}}">
    <t-button theme="default" block class="footer-btn" bindtap="cancelOrder">取消订单</t-button>
    <t-button theme="primary" block class="footer-btn" bindtap="payment" loading="{{isPaymentLoading}}" disabled="{{isPaymentLoading}}">
      立即支付
    </t-button>
  </block>
  <!-- 待收货 -->
  <block wx:elif="{{orderStatus === 'received'}}">
    <t-button theme="default" block class="footer-btn" bindtap="viewLogistics">查看物流</t-button>
    <t-button theme="primary" block class="footer-btn" bindtap="confirmReceipt" loading="{{isConfirmLoading}}" disabled="{{isConfirmLoading}}">
      确认收货
    </t-button>
  </block>
  <!-- 交易成功 -->
  <block wx:elif="{{orderStatus === 'completed'}}">
    <t-button theme="default" block class="footer-btn" bindtap="viewLogistics">查看物流</t-button>
  </block>
</view>