修复mqtt消息历史分页问题

charging_web_app/src/app/(authenticated)/admin/mqtt-logs/page.tsx

@@ -31,24 +31,45 @@ const MqttCommunicationLogPage: React.FC = () => {
     showTotal: (total) => `共 ${total} 条记录`,
   });
 
-  const fetchData = useCallback(async (params: MqttLogQueryRequest = {}) => {
+  const fetchData = useCallback(async (params: Partial<MqttLogQueryRequest & { dateRange?: [dayjs.Dayjs, dayjs.Dayjs] | null, antdOrder?: 'ascend' | 'descend' | null }> = {}) => {
     setLoading(true);
-    const queryParams: MqttLogQueryRequest = {
-      current: pagination.current,
-      pageSize: pagination.pageSize,
-      ...form.getFieldsValue(), // Get values from the form
-      ...params, // Override with any explicitly passed params (like sorters)
+    
+    const formValues = form.getFieldsValue();
+
+    const currentPage = params.current !== undefined ? params.current : pagination.current;
+    const currentPageSize = params.pageSize !== undefined ? params.pageSize : pagination.pageSize;
+
+    const queryParamsBuild: Partial<MqttLogQueryRequest> = {
+      ...formValues,
+      ...params,
+      current: currentPage,
+      pageSize: currentPageSize,
     };
 
-    // Handle dateRange from AntD RangePicker
-    if (queryParams.dateRange && queryParams.dateRange[0] && queryParams.dateRange[1]) {
-      queryParams.startTime = queryParams.dateRange[0].toISOString();
-      queryParams.endTime = queryParams.dateRange[1].toISOString();
-      delete queryParams.dateRange; // Remove from params sent to backend
+    if (params.antdOrder) {
+      queryParamsBuild.sortOrder = params.antdOrder;
+    } else if (params.hasOwnProperty('antdOrder') && params.antdOrder === null) {
+      queryParamsBuild.sortOrder = undefined;
+      queryParamsBuild.sortField = undefined;
+    } else if (!params.sortField) {
+      queryParamsBuild.sortOrder = undefined;
     }
+    delete (queryParamsBuild as any).antdOrder;
+
+    const effectiveDateRange = params.dateRange !== undefined ? params.dateRange : formValues.dateRange;
+    if (effectiveDateRange && effectiveDateRange[0] && effectiveDateRange[1]) {
+      queryParamsBuild.startTime = effectiveDateRange[0].toISOString();
+      queryParamsBuild.endTime = effectiveDateRange[1].toISOString();
+    } else {
+      queryParamsBuild.startTime = undefined;
+      queryParamsBuild.endTime = undefined;
+    }
+    delete (queryParamsBuild as any).dateRange;
+
+    const finalQueryParams = queryParamsBuild as MqttLogQueryRequest;
 
     try {
-      const response: BaseResponse<PageResponse<MqttCommunicationLog>> = await fetchMqttLogs(queryParams);
+      const response: BaseResponse<PageResponse<MqttCommunicationLog>> = await fetchMqttLogs(finalQueryParams);
       if (response.code === 0 && response.data) {
         setLogs(response.data.records || []);
         setPagination(prev => ({
@@ -84,10 +105,17 @@ const MqttCommunicationLogPage: React.FC = () => {
     sorter: SorterResult<MqttCommunicationLog> | SorterResult<MqttCommunicationLog>[],
   ) => {
     const currentSorter = Array.isArray(sorter) ? sorter[0] : sorter;
-    const sortParams: MqttLogQueryRequest = {};
-    if (currentSorter && currentSorter.field && currentSorter.order) {
-      sortParams.sortField = String(currentSorter.field);
-      sortParams.sortOrder = currentSorter.order;
+    const paramsToFetch: Partial<MqttLogQueryRequest & { antdOrder?: 'ascend' | 'descend' | null }> = {
+      current: newPagination.current,
+      pageSize: newPagination.pageSize,
+    };
+
+    if (currentSorter && currentSorter.field) {
+      paramsToFetch.sortField = String(currentSorter.field);
+      paramsToFetch.antdOrder = currentSorter.order;
+    } else {
+      paramsToFetch.sortField = undefined;
+      paramsToFetch.antdOrder = null;
     }
 
     setPagination(prev => ({
@@ -96,22 +124,33 @@ const MqttCommunicationLogPage: React.FC = () => {
         pageSize: newPagination.pageSize,
     }));
     
-    // fetchData will pick up new pagination from state
-    // and form values, and will merge sortParams
-    fetchData(sortParams); 
+    fetchData(paramsToFetch); 
   };
 
-  const onFinish = () => {
-    // Reset to first page on new search
+  const onFinish = (values: MqttLogQueryRequest & { dateRange?: [dayjs.Dayjs, dayjs.Dayjs] | null }) => {
     setPagination(prev => ({ ...prev, current: 1 })); 
-    fetchData(); // fetchData will use current form values and new pagination
+    fetchData({
+        ...values,
+        current: 1,
+        sortField: undefined,
+        antdOrder: null,
+    });
   };
 
   const handleReset = () => {
     form.resetFields();
-    setPagination(prev => ({ ...prev, current: 1 }));
-    // After reset, fetch with default (cleared) form values
-    fetchData({}); // Pass empty object to ensure sortField/sortOrder are not persisted from previous state if any
+    setPagination(prev => ({ ...prev, current: 1, pageSize: 20 }));
+    fetchData({
+        current: 1, 
+        pageSize: 20, 
+        sortField: undefined, 
+        antdOrder: null,
+        clientId: undefined,
+        topic: undefined,
+        direction: undefined,
+        payloadContains: undefined,
+        dateRange: undefined,
+    });
   };
 
   if (!user && !loading) {
@@ -254,7 +293,7 @@ const MqttCommunicationLogPage: React.FC = () => {
           pagination={pagination}
           loading={loading}
           onChange={handleTableChange}
-          scroll={{ x: 1500 }} // Enable horizontal scroll if content is too wide
+          scroll={{ x: 1500 }}
           bordered
         />
       </Card>