管理后台

<!-- 订单统计 -->
<div style="background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); color: white; padding: 1.5rem; border-radius: 0.5rem;">
  <div style="display: flex; justify-content: space-between; align-items: center;">
    <div>
      <div style="font-size: 2rem; font-weight: bold; margin-bottom: 0.5rem;" x-text="stats.orders || 0"></div>
      <div style="opacity: 0.9;">订单总数</div>
    </div>
    <div style="font-size: 2rem; opacity: 0.8;">📝</div>
  </div>
</div>

<!-- 用户统计 -->
<div style="background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%); color: white; padding: 1.5rem; border-radius: 0.5rem;">
  <div style="display: flex; justify-content: space-between; align-items: center;">
    <div>
      <div style="font-size: 2rem; font-weight: bold; margin-bottom: 0.5rem;" x-text="stats.users || 0"></div>
      <div style="opacity: 0.9;">用户总数</div>
    </div>
    <div style="font-size: 2rem; opacity: 0.8;">👥</div>
  </div>
</div>

<!-- 收入统计 -->
<div style="background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%); color: white; padding: 1.5rem; border-radius: 0.5rem;">
  <div style="display: flex; justify-content: space-between; align-items: center;">
    <div>
      <div style="font-size: 2rem; font-weight: bold; margin-bottom: 0.5rem;" x-text="formatMoney(stats.revenue || 0)"></div>
      <div style="opacity: 0.9;">总收入</div>
    </div>
    <div style="font-size: 2rem; opacity: 0.8;">💰</div>
  </div>
</div>

快速操作

<div x-show="loading" style="text-align: center; padding: 2rem; color: #6c757d;">
  正在加载...
</div>

<div x-show="!loading && recentOrders.length === 0" style="text-align: center; padding: 2rem; color: #6c757d;">
  暂无订单
</div>

<div x-show="!loading && recentOrders.length > 0" class="table-container">
  <table class="table">
    <thead>
      <tr>
        <th>订单号</th>
        <th>用户</th>
        <th>金额</th>
        <th>状态</th>
        <th>时间</th>
      </tr>
    </thead>
    <tbody>
      <template x-for="order in recentOrders" :key="order.id">
        <tr>
          <td>
            <a :href="'/manager/orders/' + order.order_no" style="color: #007bff; text-decoration: none;" x-text="order.order_no"></a>
          </td>
          <td x-text="order.user_info?.nickname || order.user_info?.email || '用户' + order.user_id"></td>
          <td x-text="formatMoney(order.amount)"></td>
          <td>
            <span x-show="order.is_paid" style="color: #28a745;">✓ 已支付</span>
            <span x-show="!order.is_paid" style="color: #ffc107;">⏳ 未支付</span>
          </td>
          <td x-text="formatDate(order.created_at)"></td>
        </tr>
      </template>
    </tbody>
  </table>
</div>