refactor(patient->worklist): use idName in list template for post-deletion filtering and implement deletion of selected items

src/API/patient/workActions.ts

@@ -311,3 +311,29 @@ const copyImage = async (instanceUid: string): Promise<dview[]> => {
 };
 
 export { copyImage, fetchTaskDetails };
+
+export interface DeleteStudiesResponse {
+  code: string;
+  description: string;
+  solution: string;
+  data: {
+    total: number;
+    exposed: number;
+  };
+}
+
+const deleteStudies = async (
+  studyIds: string[]
+): Promise<DeleteStudiesResponse> => {
+  try {
+    const response = await axiosInstance.delete('/auth/study', {
+      data: studyIds,
+    });
+    return response.data;
+  } catch (error) {
+    console.error('Error deleting studies:', error);
+    throw error;
+  }
+};
+
+export { deleteStudies };

src/pages/patient/components/ActionPanel.tsx

@@ -1,20 +1,37 @@
 import React from 'react';
 import { Button, Tooltip } from 'antd';
 import { DeleteOutlined } from '@ant-design/icons';
+import { useDispatch, useSelector } from 'react-redux';
+import { deleteWorkThunk } from '@/states/patient/worklist/slices/workSlice';
 import { FormattedMessage } from 'react-intl';
+import { AppDispatch, RootState } from '@/states/store';
 
 interface ActionButtonProps {
   icon: React.ReactNode;
   tooltip: React.ReactNode;
+  onClick?: () => void;
 }
 
-const ActionButton: React.FC<ActionButtonProps> = ({ icon, tooltip }) => (
+const ActionButton: React.FC<ActionButtonProps> = ({
+  icon,
+  tooltip,
+  onClick,
+}) => (
   <Tooltip title={tooltip}>
-    <Button icon={icon} />
+    <Button icon={icon} onClick={onClick} />
   </Tooltip>
 );
 
 const ActionPanel: React.FC = () => {
+  const dispatch = useDispatch<AppDispatch>();
+  const selectedIds = useSelector(
+    (state: RootState) => state.workSelection.selectedIds
+  );
+
+  const handleDelete = () => {
+    dispatch(deleteWorkThunk(selectedIds)); // Use the selected IDs from the Redux state
+  };
+
   return (
     <div className="flex flex-wrap gap-2 w-full">
       <ActionButton
@@ -25,6 +42,7 @@ const ActionPanel: React.FC = () => {
             defaultMessage="actionPanel.deleteTask"
           />
         }
+        onClick={handleDelete}
       />
       <ActionButton
         icon={<DeleteOutlined />}

src/pages/patient/components/WorklistTable.tsx

@@ -429,14 +429,14 @@ const WorklistTable: React.FC<WorklistTableProps> = ({
       scroll={{ x: 'max-content' }}
       components={{ header: { cell: ResizableTitle } }}
       dataSource={worklistData}
-      rowKey="StudyInstanceUID"
+      rowKey="StudyID"
       onRow={(record) => ({
         onClick: () => handleRowClick(record),
         onDoubleClick: () => handleRowDoubleClick(record),
       })}
       rowHoverable={false}
       rowClassName={(record) =>
-        selectedIds.includes(record.StudyInstanceUID)
+        selectedIds.includes(record.StudyID)
           ? 'bg-yellow-500 hover:bg-yellow-800'
           : ''
       }

src/pages/patient/worklist.tsx

@@ -46,10 +46,8 @@ const WorklistPage: React.FC = () => {
 
   const handleRowClick = (record: Task) => {
     console.log('Row clicked:', JSON.stringify(record, null, 2));
-    console.log('Selected IDs before:', record.StudyInstanceUID);
-    dispatch(
-      workSelectionSlice.actions.setSelectedIds([record.StudyInstanceUID])
-    );
+    console.log('Selected IDs before:', record.StudyID);
+    dispatch(workSelectionSlice.actions.setSelectedIds([record.StudyID]));
   };
 
   const handleRowDoubleClick = (record: Task) => {

src/states/list_template/createListSlices.ts

@@ -11,6 +11,7 @@ export function createEntityListSlices<T, F extends object>(
   namespace: string,
   fetchThunk,
   deleteThunk,
+  idName: string,
   extraReducersForFilter?: (builder) => void,
   initialFilter?: F
 ) {
@@ -34,8 +35,9 @@ export function createEntityListSlices<T, F extends object>(
       builder.addCase(
         deleteThunk.fulfilled,
         (state, action: PayloadAction<string[]>) => {
+          console.log('Deleted IDs:', action.payload);
           state.data = state.data.filter(
-            (item) => !action.payload.includes((item as { id: string }).id)
+            (item) => !action.payload.includes(item[idName])
           );
         }
       );

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

@@ -106,6 +106,7 @@ const {
   'historylist',
   fetchWorkThunk,
   deleteWorkThunk,
+  'StudyID',
   extraReducersForFilter,
   {
     patient_id: '',

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

@@ -18,7 +18,10 @@ import {
 } from '../slices/searchSlice';
 
 // Define the fetch thunk
-import { fetchTaskList } from '../../../../API/patient/workActions';
+import {
+  deleteStudies,
+  fetchTaskList,
+} from '../../../../API/patient/workActions';
 
 export const fetchWorkThunk = createFetchThunk<WorkFilter, work>(
   'worklist',
@@ -30,19 +33,10 @@ export const fetchWorkThunk = createFetchThunk<WorkFilter, work>(
 );
 
 // Define the delete thunk
-const deleteWorkThunk = createDeleteThunk(
+export const deleteWorkThunk = createDeleteThunk(
   'worklist',
-  // eslint-disable-next-line
-  async (ids) => {
-    // todo 还没有实现API
-    // Implement the deleter function to delete worklist items
-    // await fetch(`/api/worklist`, {
-    //   method: 'DELETE',
-    //   headers: {
-    //     'Content-Type': 'application/json',
-    //   },
-    //   body: JSON.stringify({ ids }),
-    // });
+  async (ids: string[]) => {
+    await deleteStudies(ids);
   }
 );
 const extraReducersForFilter = (builder) => {
@@ -106,6 +100,7 @@ const {
   'worklist',
   fetchWorkThunk,
   deleteWorkThunk,
+  'StudyID',
   extraReducersForFilter,
   {
     patient_id: '',