dingdanquanliucheng/frontend/mini-app/pages/manager/approve-detail/approve-detail.wxml

<view class="page detail-page">
  <view class="custom-header" style="padding-top: {{statusBarHeight}}px;">
    <view class="back-btn" bindtap="handleBack"><view class="back-arrow"></view></view>
    <view class="header-title">审批详情</view>
  </view>

  <view wx:if="{{message}}" class="message card">{{message}}</view>

  <view wx:if="{{loading}}" class="card empty-card">
    <view class="page-subtitle">正在加载...</view>
  </view>

  <view wx:elif="{{orderInfo}}" class="detail-body">
    <view class="card overview-card">
      <view class="overview-head">
        <view class="overview-left">
          <view class="order-no">{{orderInfo.order_no}}</view>
          <view class="order-customer">{{orderInfo.customer_name}} · {{orderInfo.customer_mobile}}</view>
        </view>
        <view class="badge {{orderInfo.badgeClass}}">{{orderInfo.statusText}}</view>
      </view>
      <view class="profit-highlight">
        <view class="profit-label">利润</view>
        <view class="profit-value">{{orderInfo.profitTotalText}}</view>
        <view class="profit-rate" wx:if="{{orderInfo.profitRate}}">利润率 {{orderInfo.profitRate}}</view>
      </view>
      <view class="summary-grid">
        <view class="summary-item">
          <view class="summary-label">销售额</view>
          <view class="summary-value">{{orderInfo.salePriceTotalText}}</view>
        </view>
        <view class="summary-item">
          <view class="summary-label">成本</view>
          <view class="summary-value">{{orderInfo.costPriceTotalText}}</view>
        </view>
        <view class="summary-item">
          <view class="summary-label">回扣</view>
          <view class="summary-value">{{orderInfo.rebateTotalText}}</view>
        </view>
        <view class="summary-item">
          <view class="summary-label">运费</view>
          <view class="summary-value">{{orderInfo.freightTotalText}}</view>
        </view>
      </view>
      <view wx:if="{{orderInfo.remark}}" class="remark-row">
        <text class="remark-label">备注：</text>
        <text class="remark-text">{{orderInfo.remark}}</text>
      </view>
    </view>

    <view wx:if="{{pricingItems.length}}" class="card pricing-card">
      <view class="section-title">报价明细</view>
      <view wx:for="{{pricingItems}}" wx:key="index" class="pricing-item">
        <view class="pricing-item-header">
          <text class="pricing-product">{{item.product_name}}</text>
          <text wx:if="{{item.pricing_type}}" class="pricing-type-badge">{{item.pricing_type === 'area' ? '按面积' : item.pricing_type}}</text>
        </view>
        <view wx:if="{{item.length_m || item.width_m}}" class="pricing-dims">
          <text wx:if="{{item.length_m}}">长度: {{item.length_m}}m</text>
          <text wx:if="{{item.width_m}}"> × 宽度: {{item.width_m}}m</text>
          <text wx:if="{{item.area_sqm}}"> = {{item.area_sqm}}㎡</text>
        </view>
        <view wx:if="{{item.calcDetail}}" class="pricing-calc">
          <view class="calc-row">
            <text class="calc-label">基础成本</text>
            <text class="calc-value">¥{{item.baseCost}}</text>
          </view>
          <view wx:for="{{item.surchargeItems}}" wx:for-item="sc" wx:key="key" class="calc-row calc-sub">
            <text class="calc-label">+ {{sc.name}}</text>
            <text class="calc-value">¥{{sc.amount}}</text>
          </view>
          <view wx:if="{{item.totalSurcharge > 0}}" class="calc-row calc-sub">
            <text class="calc-label">附加费合计</text>
            <text class="calc-value">¥{{item.totalSurcharge}}</text>
          </view>
          <view class="calc-row calc-total">
            <text class="calc-label">成本价</text>
            <text class="calc-value">¥{{item.costPrice}}</text>
          </view>
        </view>
        <view wx:if="{{item.formula_detail}}" class="formula-text">
          <text>{{item.formula_detail}}</text>
        </view>
        <view wx:if="{{item.tierPrices.length}}" class="tier-row">
          <view wx:for="{{item.tierPrices}}" wx:for-item="tier" wx:key="code" class="tier-chip">
            <text>{{tier.name}}: ¥{{tier.price}}</text>
          </view>
        </view>
      </view>
    </view>

    <!-- 利润计算过程 -->
    <view class="card calc-card">
      <view class="section-title">利润计算</view>
      <view wx:if="{{calcFormula}}" class="calc-formula">{{calcFormula}}</view>
      <view wx:if="{{calcRateFormula}}" class="calc-formula calc-rate-formula">{{calcRateFormula}}</view>
      <view class="calc-steps">
        <view class="calc-step-row">
          <text class="calc-step-label">销售价合计</text>
          <text class="calc-step-value">¥{{calcSaleTotal}}</text>
        </view>
        <view class="calc-step-row calc-step-minus">
          <text class="calc-step-label">- 成本价合计</text>
          <text class="calc-step-value">¥{{calcCostTotal}}</text>
        </view>
        <view class="calc-step-row calc-step-minus">
          <text class="calc-step-label">- 回扣合计</text>
          <text class="calc-step-value">¥{{calcRebateTotal}}</text>
        </view>
        <view class="calc-step-row calc-step-minus">
          <text class="calc-step-label">- 运费合计</text>
          <text class="calc-step-value">¥{{calcFreightTotal}}</text>
        </view>
        <view class="calc-step-row calc-step-minus">
          <text class="calc-step-label">- 税费合计</text>
          <text class="calc-step-value">¥{{calcTaxTotal}}</text>
        </view>
        <view wx:if="{{calcTaxDesc}}" class="calc-tax-note">{{calcTaxDesc}}</view>
        <view class="calc-step-row calc-step-minus">
          <text class="calc-step-label">- 其他费用合计</text>
          <text class="calc-step-value">¥{{calcOtherFeeTotal}}</text>
        </view>
        <view class="calc-step-row calc-step-result">
          <text class="calc-step-label">= 利润</text>
          <text class="calc-step-value">¥{{calcProfitTotal}}</text>
        </view>
        <view class="calc-step-row calc-step-rate">
          <text class="calc-step-label">利润率</text>
          <text class="calc-step-value">{{calcProfitRate}}%</text>
        </view>
      </view>
    </view>

    <!-- 订单明细 -->
    <view wx:if="{{orderItems.length}}" class="card order-items-card">
      <view class="section-title">订单明细</view>
      <view class="order-items-scroll">
        <view class="order-items-table">
          <view class="order-items-header">
            <text class="oi-col oi-product">产品</text>
            <text class="oi-col oi-num">数量</text>
            <text class="oi-col oi-num">售价</text>
            <text class="oi-col oi-num">成本</text>
            <text class="oi-col oi-num">销售金额</text>
            <text class="oi-col oi-num">成本金额</text>
          </view>
          <view wx:for="{{orderItems}}" wx:key="index" class="order-items-row">
            <text class="oi-col oi-product">{{item.product_name}}</text>
            <text class="oi-col oi-num">{{item.quantity}}</text>
            <text class="oi-col oi-num">¥{{item.sale_price}}</text>
            <text class="oi-col oi-num">¥{{item.cost_price}}</text>
            <text class="oi-col oi-num">¥{{item.sale_amount}}</text>
            <text class="oi-col oi-num">¥{{item.cost_amount}}</text>
          </view>
        </view>
      </view>
    </view>

    <view wx:if="{{orderAttachments.length}}" class="card attachment-card">
      <view class="section-title">订单附件</view>
      <view class="attachment-grid">
        <view wx:for="{{orderAttachments}}" wx:key="attachment_id" class="attachment-item" data-url="{{item.file_url}}" bindtap="handlePreviewAttachment">
          <image class="attachment-thumb" src="{{item.file_url}}" mode="aspectFill" />
          <text class="attachment-name">{{item.file_name}}</text>
        </view>
      </view>
    </view>

    <view class="card opinion-card">
      <view class="section-title">审批意见</view>
      <textarea class="textarea" placeholder="请输入审批意见（可选）" bindinput="handleOpinionInput" value="{{approveOpinion}}"></textarea>
    </view>
  </view>

  <view wx:if="{{orderInfo}}" class="action-bar">
    <button class="action-btn reject-btn" loading="{{actionLoading}}" data-result="reject" bindtap="handleApprove">
      {{ orderInfo.order_status === 'cancel_pending' ? '驳回取消' : '退回' }}
    </button>
    <button class="action-btn pass-btn" type="primary" loading="{{actionLoading}}" data-result="pass" bindtap="handleApprove">
      {{ orderInfo.order_status === 'cancel_pending' ? '同意取消' : '通过' }}
    </button>
  </view>
</view>