Преглед изворни кода

fix: 修复订单列表分页不生效问题,后端新增LIMIT/OFFSET分页支持

C пре 1 недеља
родитељ
комит
d737513f81
2 измењених фајлова са 15 додато и 7 уклоњено
  1. 11 4
      server/routes/orders.js
  2. 4 3
      web/src/views/OrderManagement.vue

+ 11 - 4
server/routes/orders.js

@@ -100,7 +100,7 @@ const STATUS_MAP = {
 // 动态查询订单
 router.post('/query', authMiddleware, async (req, res) => {
   try {
-    const { receiver_name, receiver_phone, order_no, start_date, end_date, status } = req.body;
+    const { receiver_name, receiver_phone, order_no, start_date, end_date, status, page = 1, pageSize = 20 } = req.body;
 
     let sql = `
       SELECT
@@ -173,12 +173,19 @@ router.post('/query', authMiddleware, async (req, res) => {
       paramIndex++;
     }
 
+    const countSql = sql.replace(/SELECT[\s\S]*?FROM/, 'SELECT COUNT(*) AS total FROM');
+    const countResult = await pool.query(countSql, params);
+    const total = parseInt(countResult.rows[0].total);
+
+    const pageNum = Math.max(1, parseInt(page));
+    const pageSizeNum = Math.max(1, Math.min(100, parseInt(pageSize)));
     sql += ' ORDER BY c.batch_no, o.create_time, o.order_no';
+    sql += ` LIMIT $${paramIndex} OFFSET $${paramIndex + 1}`;
+    params.push(pageSizeNum, (pageNum - 1) * pageSizeNum);
 
     const result = await pool.query(sql, params);
-    // 记录查询日志
-    await logOperation(req.user.username, req.user.role, '查询订单', `条件: 状态=${status||'全部'}, 收货人=${receiver_name||'-'}, 手机号=${receiver_phone||'-'}, 订单号=${order_no||'-'}, 日期=${start_date||'-'}~${end_date||'-'}`, req.ip);
-    res.json({ success: true, data: result.rows, total: result.rows.length });
+    await logOperation(req.user.username, req.user.role, '查询订单', `条件: 状态=${status||'全部'}, 收货人=${receiver_name||'-'}, 手机号=${receiver_phone||'-'}, 订单号=${order_no||'-'}, 日期=${start_date||'-'}~${end_date||'-'}, 第${pageNum}页`, req.ip);
+    res.json({ success: true, data: result.rows, total, page: pageNum, pageSize: pageSizeNum });
   } catch (err) {
     console.error('查询订单失败:', err);
     res.status(500).json({ success: false, message: err.message });

+ 4 - 3
web/src/views/OrderManagement.vue

@@ -58,7 +58,7 @@
         </div>
         <div class="filter-actions">
           <el-button @click="handleReset(); $emit('query')">重置</el-button>
-          <el-button type="primary" @click="$emit('query')">查询</el-button>
+          <el-button type="primary" @click="currentPage = 1; $emit('query')">查询</el-button>
         </div>
       </div>
     </div>
@@ -109,7 +109,7 @@
       </el-table>
       <div class="table-footer">
         <div class="table-footer-info">显示第 {{ (currentPage - 1) * pageSize + 1 }}-{{ Math.min(currentPage * pageSize, total) }} 条</div>
-        <el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[20, 50, 100]" :total="total" layout="prev, pager, next, sizes" @size-change="$emit('query')" @current-change="$emit('query')" />
+        <el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[20, 50, 100]" :total="total" layout="prev, pager, next, sizes" @size-change="currentPage = 1; $emit('query')" @current-change="$emit('query')" />
       </div>
     </div>
   </div>
@@ -140,7 +140,7 @@ const statCards = computed(() => [
 ])
 
 function getParams() {
-  const params = { ...form }
+  const params = { ...form, page: currentPage.value, pageSize: pageSize.value }
   if (dateRange.value?.length === 2) {
     params.start_date = dateRange.value[0]
     params.end_date = dateRange.value[1]
@@ -152,6 +152,7 @@ function getParams() {
 function handleReset() {
   form.receiver_name = ''; form.receiver_phone = ''; form.order_no = ''; form.status = 0
   dateRange.value = null
+  currentPage.value = 1
 }
 
 function getStatusClass(status) {