添加订单功能和测试页面

app.json

@@ -29,6 +29,7 @@
     "pages/cooperation/index",
     "pages/goods/index",
     "pages/order/index",
+    "pages/order/detail/index",
     "pages/company/company"
   ],     
   "subpackages": [
@@ -57,7 +58,8 @@
         "phone-test",
         "clear-storage",
         "gross-weight-tester",
-        "fix-connection"
+        "fix-connection",
+        "order-test"
       ],
       "independent": false
     }

pages/order/detail/index.js

@@ -0,0 +1,75 @@
+// pages/order/detail/index.js
+const API = require('../../../utils/api.js');
+
+Page({
+  // 分享给朋友/群聊
+  onShareAppMessage() {
+    return {
+      title: '鸡蛋贸易平台 - 订单详情',
+      path: '/pages/order/detail/index',
+      imageUrl: '/images/你有好蛋.png'
+    }
+  },
+
+  // 分享到朋友圈
+  onShareTimeline() {
+    return {
+      title: '鸡蛋贸易平台 - 订单详情',
+      query: '',
+      imageUrl: '/images/你有好蛋.png'
+    }
+  },
+
+  data: {
+    orderId: '',
+    orderDetail: null,
+    loading: false,
+    error: ''
+  },
+
+  onLoad(options) {
+    if (options.orderId) {
+      this.setData({ orderId: options.orderId });
+      this.loadOrderDetail();
+    }
+  },
+
+  // 加载订单详情
+  loadOrderDetail() {
+    const orderId = this.data.orderId;
+    if (!orderId) {
+      this.setData({ error: '订单ID不能为空' });
+      return;
+    }
+
+    this.setData({ loading: true, error: '' });
+
+    API.request(`/api/orders/detail/${orderId}`, 'GET', {}) 
+      .then(res => {
+        console.log('获取订单详情成功:', res);
+        if (res.success) {
+          this.setData({
+            orderDetail: res.data,
+            loading: false
+          });
+        } else {
+          this.setData({
+            error: res.message || '获取订单详情失败',
+            loading: false
+          });
+        }
+      })
+      .catch(err => {
+        console.error('获取订单详情失败:', err);
+        this.setData({
+          error: err.message || '网络请求失败，请稍后重试',
+          loading: false
+        });
+      });
+  },
+
+  // 返回上一页
+  goBack() {
+    wx.navigateBack();
+  }
+})

pages/order/detail/index.json

@@ -0,0 +1,4 @@
+{
+  "navigationBarTitleText": "订单详情",
+  "usingComponents": {}
+}

pages/order/detail/index.wxml

@@ -0,0 +1,106 @@
+<view class="order-detail-page">
+  <!-- 加载中 -->
+  <view wx:if="{{loading}}" class="loading">
+    <text>加载中...</text>
+  </view>
+
+  <!-- 错误提示 -->
+  <view wx:elif="{{error}}" class="error">
+    <text>{{error}}</text>
+    <button bindtap="loadOrderDetail">重新加载</button>
+  </view>
+
+  <!-- 订单详情 -->
+  <view wx:elif="{{orderDetail}}" class="order-content">
+    <!-- 订单头部 -->
+    <view class="order-header">
+      <view class="order-no">订单号: {{orderDetail.sales_no}}</view>
+      <view class="order-date">{{orderDetail.order_date}}</view>
+    </view>
+
+    <!-- 客户信息 -->
+    <view class="section">
+      <view class="section-title">客户信息</view>
+      <view class="customer-info">
+        <view class="info-item">
+          <view class="label">公司名称:</view>
+          <view class="value">{{orderDetail.customer_company}}</view>
+        </view>
+        <view class="info-item">
+          <view class="label">联系人:</view>
+          <view class="value">{{orderDetail.contact_person}}</view>
+        </view>
+        <view class="info-item">
+          <view class="label">联系电话:</view>
+          <view class="value">{{orderDetail.phone}}</view>
+        </view>
+        <view class="info-item">
+          <view class="label">联系地址:</view>
+          <view class="value">{{orderDetail.address}}</view>
+        </view>
+      </view>
+    </view>
+
+    <!-- 订单摘要 -->
+    <view class="section">
+      <view class="section-title">订单摘要</view>
+      <view class="order-summary">
+        <view class="info-item">
+          <view class="label">总金额:</view>
+          <view class="value total-amount">¥{{orderDetail.total_amount}}</view>
+        </view>
+        <view class="info-item">
+          <view class="label">总件数:</view>
+          <view class="value">{{orderDetail.total_pieces}}</view>
+        </view>
+        <view class="info-item">
+          <view class="label">总斤数:</view>
+          <view class="value">{{orderDetail.total_weight}}</view>
+        </view>
+        <view class="info-item">
+          <view class="label">支付状态:</view>
+          <view class="value payment-status">{{orderDetail.payment_status}}</view>
+        </view>
+        <view class="info-item">
+          <view class="label">订单状态:</view>
+          <view class="value order-status">{{orderDetail.order_status}}</view>
+        </view>
+      </view>
+    </view>
+
+    <!-- 产品详情 -->
+    <view class="section">
+      <view class="section-title">产品详情</view>
+      <view class="products-list">
+        <view wx:for="{{orderDetail.subItems}}" wx:key="sub_id" class="product-item">
+          <view class="product-header">
+            <view class="product-name">{{item.product_name}}</view>
+          </view>
+          <view class="product-details">
+            <view class="info-item">
+              <view class="label">销售件数:</view>
+              <view class="value">{{item.sales_pieces}}</view>
+            </view>
+            <view class="info-item">
+              <view class="label">销售斤数:</view>
+              <view class="value">{{item.sales_weight}}</view>
+            </view>
+            <view class="info-item">
+              <view class="label">单价:</view>
+              <view class="value">¥{{item.unit_price}}</view>
+            </view>
+            <view class="info-item">
+              <view class="label">小计:</view>
+              <view class="value">¥{{item.sales_amount}}</view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+
+  <!-- 无数据提示 -->
+  <view wx:else class="no-data">
+    <text>暂无订单详情</text>
+  </view>
+</view>

pages/order/detail/index.wxss

@@ -0,0 +1,206 @@
+/* pages/order/detail/index.wxss */
+.order-detail-page {
+  min-height: 100vh;
+  background-color: #f5f5f5;
+  padding: 20rpx;
+}
+
+/* 加载中 */
+.loading {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 120rpx 0;
+  background-color: #fff;
+  border-radius: 12rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+  font-size: 32rpx;
+  color: #666;
+}
+
+/* 错误提示 */
+.error {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  padding: 120rpx 40rpx;
+  background-color: #fff;
+  border-radius: 12rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+  font-size: 32rpx;
+  color: #ff4d4f;
+  text-align: center;
+}
+
+.error button {
+  margin-top: 40rpx;
+  background-color: #1677ff;
+  color: #fff;
+  border: none;
+  padding: 20rpx 80rpx;
+  border-radius: 60rpx;
+  font-size: 28rpx;
+  font-weight: bold;
+}
+
+/* 订单内容 */
+.order-content {
+  background-color: #fff;
+  border-radius: 12rpx;
+  padding: 30rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+}
+
+/* 订单头部 */
+.order-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 30rpx;
+  padding-bottom: 30rpx;
+  border-bottom: 1rpx solid #f0f0f0;
+}
+
+.order-no {
+  font-size: 28rpx;
+  color: #333;
+  font-weight: bold;
+}
+
+.order-date {
+  font-size: 26rpx;
+  color: #999;
+}
+
+/* 区块样式 */
+.section {
+  margin-bottom: 30rpx;
+}
+
+.section-title {
+  font-size: 30rpx;
+  color: #333;
+  font-weight: bold;
+  margin-bottom: 20rpx;
+  padding-left: 20rpx;
+  border-left: 6rpx solid #1677ff;
+}
+
+/* 客户信息 */
+.customer-info {
+  background-color: #f9f9f9;
+  border-radius: 8rpx;
+  padding: 20rpx;
+}
+
+/* 订单摘要 */
+.order-summary {
+  background-color: #f9f9f9;
+  border-radius: 8rpx;
+  padding: 20rpx;
+}
+
+/* 信息项 */
+.info-item {
+  display: flex;
+  margin-bottom: 16rpx;
+  align-items: flex-start;
+}
+
+.info-item:last-child {
+  margin-bottom: 0;
+}
+
+.label {
+  width: 140rpx;
+  font-size: 26rpx;
+  color: #666;
+  font-weight: bold;
+  flex-shrink: 0;
+}
+
+.value {
+  flex: 1;
+  font-size: 26rpx;
+  color: #333;
+  word-break: break-all;
+  line-height: 1.4;
+}
+
+/* 总金额样式 */
+.total-amount {
+  font-size: 28rpx;
+  color: #ff4d4f;
+  font-weight: bold;
+}
+
+/* 状态样式 */
+.payment-status {
+  color: #52c41a;
+  font-weight: bold;
+}
+
+.order-status {
+  color: #1677ff;
+  font-weight: bold;
+}
+
+/* 产品列表 */
+.products-list {
+  background-color: #f9f9f9;
+  border-radius: 8rpx;
+  padding: 20rpx;
+}
+
+/* 产品项 */
+.product-item {
+  background-color: #fff;
+  border-radius: 8rpx;
+  padding: 20rpx;
+  margin-bottom: 16rpx;
+  box-shadow: 0 1rpx 4rpx rgba(0, 0, 0, 0.05);
+}
+
+.product-item:last-child {
+  margin-bottom: 0;
+}
+
+/* 产品头部 */
+.product-header {
+  margin-bottom: 16rpx;
+  padding-bottom: 16rpx;
+  border-bottom: 1rpx solid #f0f0f0;
+}
+
+.product-name {
+  font-size: 28rpx;
+  color: #333;
+  font-weight: bold;
+}
+
+/* 产品详情 */
+.product-details {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 16rpx;
+}
+
+@media (max-width: 375px) {
+  .product-details {
+    grid-template-columns: 1fr;
+  }
+}
+
+/* 无数据提示 */
+.no-data {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 120rpx 0;
+  background-color: #fff;
+  border-radius: 12rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+  font-size: 32rpx;
+  color: #999;
+}

pages/order/index.js

@@ -1,4 +1,6 @@
 // pages/order/index.js
+const API = require('../../utils/api.js');
+
 Page({
   // 分享给朋友/群聊
   onShareAppMessage() {
@@ -20,38 +22,293 @@ Page({
 
   data: {
     userInfo: {},
-    orders: []
+    orders: [],
+    loading: false,
+    error: '',
+    // 订单状态标签
+    activeTab: 'all',
+    // 时间筛选相关
+    dateRange: {
+      start: '',
+      end: ''
+    },
+    // 分页相关
+    page: 1,
+    pageSize: 10,
+    hasMore: true,
+    loadingMore: false,
+    // 统计信息
+    statistics: {
+      totalOrders: 0,
+      totalAmount: 0,
+      totalPieces: 0,
+      totalWeight: 0,
+      unpaidAmount: 0,
+      paidAmount: 0
+    }
   },
 
   onLoad() {
     // 页面加载时的初始化逻辑
-    this.loadUserInfo();
+    this.loadUserInfo(() => {
+      this.loadOrders();
+    });
   },
 
   onShow() {
     // 页面显示时的逻辑
-    this.loadUserInfo();
-    // 更新自定义tabBar状态
-    if (typeof this.getTabBar === 'function' && this.getTabBar()) {
-      this.getTabBar().setData({
-        selected: 4 // 保持与个人中心相同的选中状态
-      });
-    }
+    this.loadUserInfo(() => {
+      // 更新自定义tabBar状态
+      if (typeof this.getTabBar === 'function' && this.getTabBar()) {
+        this.getTabBar().setData({
+          selected: 4 // 保持与个人中心相同的选中状态
+        });
+      }
+    });
   },
 
   // 加载用户信息
-  loadUserInfo() {
+  loadUserInfo(callback) {
     const app = getApp();
+    let userInfo = {};
+    
     if (app.globalData.userInfo) {
-      this.setData({ userInfo: app.globalData.userInfo });
+      userInfo = app.globalData.userInfo;
     } else {
-      const localUserInfo = wx.getStorageSync('userInfo') || {};
-      this.setData({ userInfo: localUserInfo });
+      userInfo = wx.getStorageSync('userInfo') || {};
     }
+    
+    // 同步更新用户信息，确保loadOrders能获取到最新数据
+    this.data.userInfo = userInfo;
+    
+    // 同时异步更新UI
+    this.setData({ userInfo: userInfo }, () => {
+      if (callback) callback();
+    });
+  },
+
+  // 加载订单数据
+  loadOrders(isLoadMore = false, activeTab = this.data.activeTab) {
+    const userInfo = this.data.userInfo;
+    const phoneNumber = userInfo.phoneNumber;
+    
+    if (!phoneNumber) {
+      this.setData({
+        error: '请先登录并绑定电话号码',
+        orders: []
+      });
+      return;
+    }
+
+    if (isLoadMore) {
+      this.setData({ loadingMore: true });
+    } else {
+      this.setData({ loading: true, error: '' });
+    }
+
+    const page = isLoadMore ? this.data.page + 1 : 1;
+    const pageSize = this.data.pageSize;
+    
+    // 根据标签确定付款状态
+    let paymentStatus = '';
+    if (activeTab === 'unpaid') {
+      paymentStatus = '未收款';
+    } else if (activeTab === 'completed') {
+      paymentStatus = '全款';
+    }
+    
+    console.log('loadOrders - activeTab:', activeTab, 'paymentStatus:', paymentStatus, 'page:', page);
+
+    // 并行请求订单列表和统计数据
+    const orderRequest = API.request('/api/orders/list', 'POST', {
+      phoneNumber: phoneNumber,
+      startDate: this.data.dateRange.start,
+      endDate: this.data.dateRange.end,
+      paymentStatus: paymentStatus,
+      page: page,
+      pageSize: pageSize
+    }).then(res => {
+      return { data: res };
+    }).catch(err => {
+      throw err;
+    });
+
+    // 只有在非加载更多时才请求统计数据（加载更多时统计数据不变）
+    const statisticsRequest = isLoadMore ? Promise.resolve(null) : API.request('/api/orders/statistics', 'POST', {
+      phoneNumber: phoneNumber,
+      startDate: this.data.dateRange.start,
+      endDate: this.data.dateRange.end,
+      paymentStatus: paymentStatus
+    }).then(res => {
+      return { data: res };
+    }).catch(err => {
+      throw err;
+    });
+
+    // 处理所有请求
+    Promise.all([orderRequest, statisticsRequest])
+      .then(([orderRes, statisticsRes]) => {
+        console.log('获取订单列表成功:', orderRes.data);
+        if (orderRes.data.success) {
+          const newOrders = orderRes.data.data.orders || [];
+          const totalOrders = isLoadMore ? [...this.data.orders, ...newOrders] : newOrders;
+          const hasMore = newOrders.length === pageSize;
+          
+          // 处理统计数据
+          let statistics = this.data.statistics;
+          if (statisticsRes && statisticsRes.data && statisticsRes.data.success) {
+            statistics = statisticsRes.data.data;
+            console.log('获取统计数据成功:', statistics);
+          }
+          
+          this.setData({
+            orders: totalOrders,
+            page: page,
+            hasMore: hasMore,
+            loading: false,
+            loadingMore: false,
+            statistics: statistics
+          });
+        } else {
+          this.setData({
+            error: orderRes.data.message || '获取订单失败',
+            loading: false,
+            loadingMore: false
+          });
+        }
+      })
+      .catch((err) => {
+        console.error('请求失败:', err);
+        this.setData({
+          error: err.message || '网络请求失败，请稍后重试',
+          loading: false,
+          loadingMore: false
+        });
+      });
   },
 
   // 返回上一页
   goBack() {
     wx.navigateBack();
+  },
+
+  // 查看订单详情
+  viewOrderDetail(e) {
+    const orderId = e.currentTarget.dataset.orderId;
+    wx.navigateTo({
+      url: `/pages/order/detail/index?orderId=${orderId}`
+    });
+  },
+
+  // 去首页购物
+  goToHome() {
+    wx.switchTab({
+      url: '/pages/index/index'
+    });
+  },
+
+  // 选择开始日期
+  bindStartDateChange(e) {
+    const startDate = e.detail.value;
+    this.setData({
+      'dateRange.start': startDate
+    });
+  },
+
+  // 选择结束日期
+  bindEndDateChange(e) {
+    const endDate = e.detail.value;
+    this.setData({
+      'dateRange.end': endDate
+    });
+  },
+
+  // 重置日期筛选
+  resetDateFilter() {
+    this.setData({
+      'dateRange.start': '',
+      'dateRange.end': ''
+    });
+    this.loadOrders();
+  },
+
+  // 应用日期筛选
+  applyDateFilter() {
+    this.loadOrders();
+  },
+
+  // 切换订单状态标签
+  switchTab(e) {
+    const tab = e.currentTarget.dataset.tab;
+    console.log('switchTab - tab:', tab);
+    this.setData({
+      activeTab: tab,
+      page: 1,
+      orders: []
+    }, () => {
+      console.log('switchTab - after setData, activeTab:', this.data.activeTab);
+      this.loadOrders(false, tab);
+    });
+  },
+
+  // 计算统计信息
+  calculateStatistics() {
+    const orders = this.data.orders;
+    if (!orders || orders.length === 0) {
+      this.setData({
+        statistics: {
+          totalOrders: 0,
+          totalAmount: 0,
+          totalPieces: 0,
+          unpaidAmount: 0,
+          paidAmount: 0
+        }
+      });
+      return;
+    }
+
+    let totalOrders = orders.length;
+    let totalAmount = 0;
+    let totalPieces = 0;
+    let unpaidAmount = 0;
+    let paidAmount = 0;
+
+    orders.forEach(order => {
+      // 累加总金额和总件数
+      if (order.total_amount) {
+        totalAmount += parseFloat(order.total_amount) || 0;
+      }
+      if (order.total_pieces) {
+        totalPieces += parseInt(order.total_pieces) || 0;
+      }
+
+      // 区分未付款和已付款
+      if (order.payment_status === '未收款') {
+        if (order.total_amount) {
+          unpaidAmount += parseFloat(order.total_amount) || 0;
+        }
+      } else if (order.payment_status === '全款') {
+        if (order.total_amount) {
+          paidAmount += parseFloat(order.total_amount) || 0;
+        }
+      }
+    });
+
+    this.setData({
+      statistics: {
+        totalOrders,
+        totalAmount: Math.round(totalAmount * 100) / 100,
+        totalPieces,
+        unpaidAmount: Math.round(unpaidAmount * 100) / 100,
+        paidAmount: Math.round(paidAmount * 100) / 100
+      }
+    });
+  },
+
+  // 滚动到底部的预加载逻辑
+  onReachBottom() {
+    if (!this.data.loadingMore && this.data.hasMore) {
+      this.loadOrders(true, this.data.activeTab);
+    }
   }
 })

pages/order/index.wxml

@@ -1,21 +1,123 @@
 <view class="order-page">
   <!-- 订单状态标签栏 -->
   <view class="order-tabs">
-    <view class="tab-item active">全部</view>
-    <view class="tab-item">待付款</view>
-    <view class="tab-item">待发货</view>
-    <view class="tab-item">待收货</view>
-    <view class="tab-item">已完成</view>
+    <view class="tab-item {{activeTab === 'all' ? 'active' : ''}}" bindtap="switchTab" data-tab="all">全部</view>
+    <view class="tab-item {{activeTab === 'unpaid' ? 'active' : ''}}" bindtap="switchTab" data-tab="unpaid">待付款</view>
+    <view class="tab-item {{activeTab === 'completed' ? 'active' : ''}}" bindtap="switchTab" data-tab="completed">已完成</view>
+  </view>
+
+  <!-- 时间筛选组件 -->
+  <view class="date-filter">
+    <view class="date-filter-row">
+      <view class="date-picker">
+        <view class="date-label">开始日期:</view>
+        <picker mode="date" value="{{dateRange.start}}" bindchange="bindStartDateChange">
+          <view class="picker">
+            {{dateRange.start || '请选择'}}
+          </view>
+        </picker>
+      </view>
+      <view class="date-picker">
+        <view class="date-label">结束日期:</view>
+        <picker mode="date" value="{{dateRange.end}}" bindchange="bindEndDateChange">
+          <view class="picker">
+            {{dateRange.end || '请选择'}}
+          </view>
+        </picker>
+      </view>
+    </view>
+    <view class="filter-actions">
+      <button class="reset-btn" bindtap="resetDateFilter">重置</button>
+      <button class="apply-btn" bindtap="applyDateFilter">应用筛选</button>
+    </view>
+  </view>
+
+  <!-- 统计信息 -->
+  <view class="statistics-card">
+    <view class="statistics-header">
+      <text class="statistics-title">订单统计</text>
+    </view>
+    <view class="statistics-body">
+      <view class="stat-item">
+        <view class="stat-label">总订单数</view>
+        <view class="stat-value">{{statistics.totalOrders}}</view>
+      </view>
+      <view class="stat-item">
+        <view class="stat-label">总件数</view>
+        <view class="stat-value">{{statistics.totalPieces}}</view>
+      </view>
+      <view class="stat-item">
+        <view class="stat-label">总斤数</view>
+        <view class="stat-value">{{statistics.totalWeight}}</view>
+      </view>
+      <view class="stat-item">
+        <view class="stat-label">已消费</view>
+        <view class="stat-value paid">¥{{statistics.paidAmount}}</view>
+      </view>
+    </view>
   </view>
 
   <!-- 订单列表 -->
   <view class="order-list">
-    <!-- 暂无订单提示 -->
-    <view class="no-orders">
+    <!-- 加载中 -->
+    <view wx:if="{{loading}}" class="loading">
+      <text>加载中...</text>
+    </view>
+
+    <!-- 错误提示 -->
+    <view wx:elif="{{error}}" class="error">
+      <text>{{error}}</text>
+    </view>
+
+    <!-- 无订单提示 -->
+    <view wx:elif="{{orders.length === 0}}" class="no-orders">
       <view class="no-orders-icon">📦</view>
       <view class="no-orders-title">空空如也~</view>
       <view class="no-orders-subtitle">您还没有任何订单，快去选购吧</view>
       <button class="go-shopping-btn" bindtap="goToHome">去首页购物</button>
     </view>
+
+    <!-- 订单列表 -->
+    <view wx:else class="orders">
+      <view wx:for="{{orders}}" wx:key="dataid" class="order-card" bindtap="viewOrderDetail" data-order-id="{{item.dataid}}">
+        <!-- 订单头部 -->
+        <view class="order-header">
+          <view class="order-no">订单号: {{item.sales_no}}</view>
+          <view class="order-date">{{item.order_date}}</view>
+        </view>
+        
+        <!-- 订单主体 -->
+        <view class="order-body">
+          <view class="customer-info">
+            <view class="customer-company">{{item.customer_company}}</view>
+            <view class="contact-person">{{item.contact_person}} {{item.phone}}</view>
+          </view>
+          <view class="order-summary">
+            <view class="total-amount">总金额: ¥{{item.total_amount}}</view>
+            <view class="total-pieces">总件数: {{item.total_pieces}}</view>
+            <view class="total-weight">总斤数: {{item.total_weight}}</view>
+          </view>
+        </view>
+        
+        <!-- 订单底部 -->
+        <view class="order-footer">
+          <view class="status-container">
+            <view class="payment-status">{{item.payment_status}}</view>
+            <view class="order-status">{{item.order_status}}</view>
+          </view>
+          <view class="arrow-icon">→</view>
+        </view>
+      </view>
+      
+      <!-- 分页加载状态 -->
+      <view class="load-more">
+        <view wx:if="{{loadingMore}}" class="loading-more">
+          <text>加载中...</text>
+        </view>
+        <view wx:elif="{{!hasMore && orders.length > 0}}" class="no-more">
+          <text>没有更多数据了</text>
+        </view>
+      </view>
+    </view>
   </view>
 </view>

pages/order/index.wxss

@@ -9,23 +9,25 @@
   display: flex;
   background-color: #fff;
   border-bottom: 1rpx solid #e0e0e0;
-  overflow-x: auto;
-  white-space: nowrap;
 }
 
 .tab-item {
   flex: 1;
-  min-width: 160rpx;
   text-align: center;
-  padding: 24rpx 0;
-  font-size: 32rpx;
+  padding: 20rpx 0;
+  font-size: 28rpx;
   color: #666;
   position: relative;
+  transition: all 0.2s ease;
+}
+
+.tab-item:hover {
+  color: #1677ff;
 }
 
 .tab-item.active {
   color: #1677ff;
-  font-weight: bold;
+  font-weight: 500;
 }
 
 .tab-item.active::after {
@@ -34,10 +36,186 @@
   bottom: 0;
   left: 50%;
   transform: translateX(-50%);
-  width: 60rpx;
-  height: 6rpx;
+  width: 50rpx;
+  height: 5rpx;
   background-color: #1677ff;
   border-radius: 3rpx;
+  transition: all 0.2s ease;
+}
+
+
+/* 时间筛选组件 */
+.date-filter {
+  background-color: #fff;
+  padding: 16rpx;
+  margin: 8rpx;
+  border-radius: 10rpx;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04);
+}
+
+.date-filter-row {
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 16rpx;
+  gap: 12rpx;
+}
+
+.date-picker {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+}
+
+.date-label {
+  font-size: 22rpx;
+  color: #666;
+  margin-bottom: 6rpx;
+  font-weight: 500;
+}
+
+.picker {
+  border: 1rpx solid #e8e8e8;
+  border-radius: 6rpx;
+  padding: 14rpx;
+  font-size: 22rpx;
+  color: #333;
+  background-color: #f9f9f9;
+  transition: all 0.2s ease;
+}
+
+.picker:hover {
+  border-color: #1677ff;
+  background-color: #f0f7ff;
+}
+
+.filter-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 12rpx;
+  padding-top: 12rpx;
+  border-top: 1rpx solid #f5f5f5;
+}
+
+.reset-btn {
+  padding: 12rpx 32rpx;
+  border-radius: 24rpx;
+  font-size: 22rpx;
+  border: 1rpx solid #d9d9d9;
+  color: #666;
+  background-color: #f9f9f9;
+  transition: all 0.2s ease;
+}
+
+.reset-btn:hover {
+  border-color: #999;
+  background-color: #f0f0f0;
+}
+
+.apply-btn {
+  padding: 12rpx 32rpx;
+  border-radius: 24rpx;
+  font-size: 22rpx;
+  border: 1rpx solid #1677ff;
+  color: #1677ff;
+  background-color: #fff;
+  font-weight: 500;
+  transition: all 0.2s ease;
+}
+
+.apply-btn:hover {
+  background-color: #1677ff;
+  color: #fff;
+}
+
+/* 统计信息卡片 */
+.statistics-card {
+  background-color: #fff;
+  margin: 10rpx;
+  border-radius: 12rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+  overflow: hidden;
+}
+
+.statistics-header {
+  background-color: #1677ff;
+  color: #fff;
+  padding: 20rpx;
+  font-size: 28rpx;
+  font-weight: bold;
+}
+
+.statistics-body {
+  padding: 20rpx;
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 20rpx;
+}
+
+.stat-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 15rpx;
+  background-color: #f9f9f9;
+  border-radius: 8rpx;
+}
+
+.stat-label {
+  font-size: 24rpx;
+  color: #666;
+  font-weight: 500;
+}
+
+.stat-value {
+  font-size: 28rpx;
+  font-weight: bold;
+  color: #333;
+}
+
+.stat-value.unpaid {
+  color: #ff4d4f;
+}
+
+.stat-value.paid {
+  color: #52c41a;
+}
+
+/* 响应式设计 */
+@media (max-width: 375px) {
+  .date-filter-row {
+    flex-direction: column;
+  }
+  
+  .date-picker {
+    flex-direction: row;
+    align-items: center;
+  }
+  
+  .date-label {
+    margin-bottom: 0;
+    margin-right: 10rpx;
+    min-width: 120rpx;
+  }
+  
+  .picker {
+    flex: 1;
+  }
+  
+  .statistics-body {
+    grid-template-columns: 1fr;
+  }
+  
+  .stat-item {
+    padding: 12rpx;
+  }
+  
+  .stat-label {
+    font-size: 22rpx;
+  }
+  
+  .stat-value {
+    font-size: 26rpx;
+  }
 }
 
 /* 订单列表 */
@@ -45,6 +223,33 @@
   padding: 20rpx;
 }
 
+/* 加载中 */
+.loading {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 120rpx 0;
+  background-color: #fff;
+  border-radius: 12rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+  font-size: 32rpx;
+  color: #666;
+}
+
+/* 错误提示 */
+.error {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 120rpx 40rpx;
+  background-color: #fff;
+  border-radius: 12rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+  font-size: 32rpx;
+  color: #ff4d4f;
+  text-align: center;
+}
+
 /* 暂无订单提示 */
 .no-orders {
   display: flex;
@@ -85,13 +290,19 @@
   font-weight: bold;
 }
 
-/* 订单卡片样式（预留） */
+/* 订单卡片样式 */
 .order-card {
   background-color: #fff;
   border-radius: 12rpx;
   padding: 30rpx;
   margin-bottom: 20rpx;
   box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+  transition: transform 0.2s ease, box-shadow 0.2s ease;
+}
+
+.order-card:active {
+  transform: translateY(2rpx);
+  box-shadow: 0 1rpx 5rpx rgba(0, 0, 0, 0.05);
 }
 
 .order-header {
@@ -103,60 +314,75 @@
   border-bottom: 1rpx solid #f0f0f0;
 }
 
-.order-info {
+.order-no {
   font-size: 28rpx;
-  color: #666;
+  color: #333;
+  font-weight: bold;
 }
 
-.order-status {
-  font-size: 28rpx;
-  color: #1677ff;
-  font-weight: bold;
+.order-date {
+  font-size: 26rpx;
+  color: #999;
 }
 
-.order-goods {
+.order-body {
   margin-bottom: 20rpx;
 }
 
-.goods-item {
-  display: flex;
+.customer-info {
   margin-bottom: 20rpx;
 }
 
-.goods-image {
-  width: 120rpx;
-  height: 120rpx;
-  border-radius: 8rpx;
-  margin-right: 20rpx;
+.customer-company {
+  font-size: 30rpx;
+  color: #333;
+  font-weight: bold;
+  margin-bottom: 10rpx;
 }
 
-.goods-info {
-  flex: 1;
+.contact-person {
+  font-size: 26rpx;
+  color: #666;
+}
+
+.order-summary {
   display: flex;
-  flex-direction: column;
-  justify-content: space-between;
+  flex-wrap: wrap;
+  gap: 30rpx;
+  padding: 20rpx;
+  background-color: #f9f9f9;
+  border-radius: 8rpx;
 }
 
-.goods-name {
-  font-size: 32rpx;
+.total-amount {
+  font-size: 28rpx;
   color: #333;
-  margin-bottom: 10rpx;
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
+  font-weight: bold;
 }
 
-.goods-spec {
-  font-size: 26rpx;
-  color: #999;
-  margin-bottom: 10rpx;
+.total-amount::before {
+  content: "💰 ";
+  font-size: 24rpx;
 }
 
-.goods-price {
-  font-size: 32rpx;
-  color: #ff4d4f;
-  font-weight: bold;
+.total-pieces {
+  font-size: 28rpx;
+  color: #666;
+}
+
+.total-pieces::before {
+  content: "📦 ";
+  font-size: 24rpx;
+}
+
+.total-weight {
+  font-size: 28rpx;
+  color: #666;
+}
+
+.total-weight::before {
+  content: "⚖️ ";
+  font-size: 24rpx;
 }
 
 .order-footer {
@@ -167,31 +393,61 @@
   border-top: 1rpx solid #f0f0f0;
 }
 
-.total-price {
-  font-size: 32rpx;
-  color: #333;
+.status-container {
+  display: flex;
+  gap: 20rpx;
+  align-items: center;
 }
 
-.total-price .price {
-  color: #ff4d4f;
+.payment-status {
+  font-size: 26rpx;
+  color: #52c41a;
+  font-weight: bold;
+  padding: 6rpx 16rpx;
+  background-color: #f6ffed;
+  border-radius: 20rpx;
+  border: 1rpx solid #b7eb8f;
+}
+
+.order-status {
+  font-size: 26rpx;
+  color: #1677ff;
+  font-weight: bold;
+  padding: 6rpx 16rpx;
+  background-color: #e6f7ff;
+  border-radius: 20rpx;
+  border: 1rpx solid #91d5ff;
+}
+
+.arrow-icon {
+  font-size: 32rpx;
+  color: #999;
   font-weight: bold;
 }
 
-.order-actions {
+/* 分页加载相关样式 */
+.load-more {
+  padding: 30rpx 0;
+  text-align: center;
+}
+
+.loading-more {
   display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 20rpx 0;
 }
 
-.action-btn {
-  padding: 12rpx 30rpx;
-  border-radius: 40rpx;
+.loading-more text {
   font-size: 28rpx;
-  margin-left: 20rpx;
-  border: 2rpx solid #1677ff;
-  color: #1677ff;
-  background-color: #fff;
+  color: #666;
 }
 
-.action-btn.primary {
-  background-color: #1677ff;
-  color: #fff;
+.no-more {
+  padding: 20rpx 0;
+}
+
+.no-more text {
+  font-size: 26rpx;
+  color: #999;
 }

project.private.config.json

@@ -1,6 +1,6 @@
 {
   "libVersion": "3.10.3",
-  "projectname": "wxxcx1",
+  "projectname": "Mini-Program",
   "setting": {
     "urlCheck": false,
     "coverView": true,
@@ -19,5 +19,17 @@
     "ignoreDevUnusedFiles": true,
     "bigPackageSizeSupport": false
   },
-  "condition": {}
+  "condition": {
+    "miniprogram": {
+      "list": [
+        {
+          "name": "pages/test-tools/order-test",
+          "pathName": "pages/test-tools/order-test",
+          "query": "",
+          "scene": null,
+          "launchMode": "default"
+        }
+      ]
+    }
+  }
 }