feat: add time range selector for worklist with today/7days/all options

- Add TimeRangeSelector component in src/pages/patient/components/TimeRangeSelector.tsx
- Update searchSlice.ts to support timeRangeType state management with RFC3339Nano format
- Integrate time range selector into SearchPanel.tsx with DatePicker synchronization
- Remove custom option and implement automatic time calculation for today/7days/all ranges

config/dev.ts

@@ -11,7 +11,7 @@ export default {
     stats: true,
   },
   defineConstants: {
-    MQTT_BROKER_URL_FROM_WEBPACK: '"ws://192.168.110.13:8083/mqtt"',
+    MQTT_BROKER_URL_FROM_WEBPACK: '"ws://192.168.110.112:8083/mqtt"',
   },
   mini: {},
   h5: {
@@ -20,7 +20,7 @@ export default {
     devServer: {
       proxy: {
         '/dr': {
-          target: 'http://192.168.110.13:6001', // 你的后端服务地址
+          target: 'http://192.168.110.112:6001', // 你的后端服务地址
           changeOrigin: true, // 允许跨域
           // pathRewrite: {
           //   '^/dr/api': '' // 可选，用于重写路径

src/pages/patient/components/SearchPanel.tsx

@@ -17,6 +17,7 @@ import {
 import { fetchWorkThunk } from '../../../states/patient/worklist/slices/workSlice';
 import { AppDispatch, RootState } from '../../../states/store';
 import { WorkFilter } from '@/states/patient/worklist/types/workfilter';
+import TimeRangeSelector from './TimeRangeSelector';
 // import { AnyAction } from '@reduxjs/toolkit';
 
 const { RangePicker } = DatePicker;
@@ -32,6 +33,7 @@ const SearchPanel: React.FC = () => {
 
   return (
     <div className="flex flex-col gap-2 w-full">
+      <TimeRangeSelector />
       <Input
         placeholder={intl.formatMessage({
           id: 'searchPanel.name',
@@ -75,11 +77,19 @@ const SearchPanel: React.FC = () => {
           }),
         ]}
         size="small"
-        value={[dayjs(startTime), dayjs(endTime)]}
+        value={startTime && endTime ? [dayjs(startTime), dayjs(endTime)] : null}
         onChange={(dates) => {
           if (dates && dates[0] && dates[1]) {
-            dispatch(setStartTime(dates[0].toISOString()));
-            dispatch(setEndTime(dates[1].toISOString()));
+            // 使用RFC3339Nano格式
+            dispatch(
+              setStartTime(dates[0].format('YYYY-MM-DDTHH:mm:ss.SSS[+08:00]'))
+            );
+            dispatch(
+              setEndTime(dates[1].format('YYYY-MM-DDTHH:mm:ss.SSS[+08:00]'))
+            );
+          } else {
+            dispatch(setStartTime(''));
+            dispatch(setEndTime(''));
           }
         }}
       />

src/pages/patient/components/TimeRangeSelector.tsx

@@ -0,0 +1,41 @@
+import React from 'react';
+import { Radio, Space, RadioChangeEvent } from 'antd';
+import { FormattedMessage } from 'react-intl';
+import { useSelector, useDispatch } from 'react-redux';
+import { RootState, AppDispatch } from '../../../states/store';
+import {
+  setTimeRangeType,
+  TimeRangeType,
+} from '../../../states/patient/worklist/slices/searchSlice';
+
+const TimeRangeSelector: React.FC = () => {
+  const dispatch = useDispatch<AppDispatch>();
+
+  const timeRangeType = useSelector(
+    (state: RootState) => state.search.timeRangeType
+  );
+
+  const handleChange = (e: RadioChangeEvent): void => {
+    dispatch(setTimeRangeType(e.target.value as TimeRangeType));
+  };
+
+  return (
+    <div className="mb-2">
+      <Radio.Group value={timeRangeType} onChange={handleChange} size="small">
+        <Space direction="vertical">
+          <Radio value="today">
+            <FormattedMessage id="timeRange.today" defaultMessage="今天" />
+          </Radio>
+          <Radio value="7days">
+            <FormattedMessage id="timeRange.7days" defaultMessage="7天" />
+          </Radio>
+          <Radio value="all">
+            <FormattedMessage id="timeRange.all" defaultMessage="所有" />
+          </Radio>
+        </Space>
+      </Radio.Group>
+    </div>
+  );
+};
+
+export default TimeRangeSelector;

src/states/patient/worklist/slices/searchSlice.ts

@@ -1,6 +1,8 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 import dayjs from 'dayjs';
 
+export type TimeRangeType = 'today' | '7days' | 'all';
+
 interface SearchState {
   id: string;
   name: string;
@@ -10,17 +12,19 @@ interface SearchState {
   status: string;
   page: number;
   page_size: number;
+  timeRangeType: TimeRangeType;
 }
 
 const initialState: SearchState = {
   id: '',
   name: '',
   acc_no: '',
-  start_time: dayjs().format('YYYY-MM-DD'),
-  end_time: dayjs().format('YYYY-MM-DD'),
+  start_time: '',
+  end_time: '',
   status: 'Arrived,InProgress',
   page: 1,
   page_size: 10,
+  timeRangeType: 'all',
 };
 
 const searchSlice = createSlice({
@@ -51,6 +55,36 @@ const searchSlice = createSlice({
     setPageSize: (state, action: PayloadAction<number>) => {
       state.page_size = action.payload;
     },
+    setTimeRangeType: (state, action: PayloadAction<TimeRangeType>) => {
+      state.timeRangeType = action.payload;
+
+      // 根据时间范围类型自动计算开始和结束时间 (RFC3339Nano格式)
+      const today = dayjs();
+
+      switch (action.payload) {
+        case 'today':
+          state.start_time = today
+            .startOf('day')
+            .format('YYYY-MM-DDTHH:mm:ss.SSS[+08:00]');
+          state.end_time = today
+            .endOf('day')
+            .format('YYYY-MM-DDTHH:mm:ss.SSS[+08:00]');
+          break;
+        case '7days':
+          state.start_time = today
+            .subtract(6, 'days')
+            .startOf('day')
+            .format('YYYY-MM-DDTHH:mm:ss.SSS[+08:00]');
+          state.end_time = today
+            .endOf('day')
+            .format('YYYY-MM-DDTHH:mm:ss.SSS[+08:00]');
+          break;
+        case 'all':
+          state.start_time = '';
+          state.end_time = '';
+          break;
+      }
+    },
   },
 });
 
@@ -63,6 +97,7 @@ export const {
   setStatus,
   setPage,
   setPageSize,
+  setTimeRangeType,
 } = searchSlice.actions;
 
 export default searchSlice.reducer;