TODO: Tái cấu trúc component ListWork để bổ sung modal yêu cầu báo cáo và cải…

TODO: Tái cấu trúc component ListWork để bổ sung modal yêu cầu báo cáo và cải thiện xử lý sự kiện liên quan

src/screens/list_work/index.js

@@ -10,6 +10,7 @@ const ListWork = props => {
   const [searchQuery, setSearchQuery] = useState('');
   const [modalDeliverToMeVisible, setModalDeliverToMeVisible] = useState(false);
   const [modalMonitoringVisible, setModalMonitoringVisible] = useState(false);
+  const [modalRequestReportVisible, setModalRequestReportVisible] = useState(false);
   const [currentTabKey, setCurrentTabKey] = useState(ROLE.ALL);
   const [currentDropDownKey, setCurrentDropDownKey] = useState(
     WORK_PROGRESS.ALL_WORK_PROGRESS,
@@ -310,6 +311,10 @@ const ListWork = props => {
     }
   };
 
+  const handleRequestReport = () =>{
+    setModalRequestReportVisible(true);
+  }
+
   // Đóng modal "Giao cho tôi"
   const handleCloseDeliverToMeModal = () => {
     setModalDeliverToMeVisible(false);
@@ -580,6 +585,17 @@ const ListWork = props => {
     {key: ROLE.SUPERVISOR, label: 'Đang giám sát'},
   ]);
 
+  const handleSubmitReport = reportData => {
+    // Xử lý submit yêu cầu báo cáo
+    console.log('Report data:', reportData);
+    setShowModal(false);
+    // TODO: Gọi API để gửi yêu cầu báo cáo
+  };
+
+  const handleCloseModalRequestReport = () => {
+    setModalRequestReportVisible(false);
+  };
+
   // Kiểm tra có hiển thị FAB hay không
   const shouldShowFAB = () => {
     return currentTabKey !== ROLE.ALL;
@@ -593,6 +609,7 @@ const ListWork = props => {
       searchQuery={searchQuery}
       setSearchQuery={setSearchQuery}
       dataList={filterList}
+      modalRequestReport={modalRequestReportVisible}
       modalDeliverToMeVisible={modalDeliverToMeVisible}
       modalMonitoringVisible={modalMonitoringVisible}
       tabView={tabView}
@@ -601,9 +618,12 @@ const ListWork = props => {
       // Sự kiện
       onFilterChange={handleFilterChange}
       onAddWork={handleAddWork}
+      onOpenModalRequestReport={handleRequestReport}
       onSaveDeliverToMeWork={handleSaveDeliverToMeWork}
       onSaveMonitoringWork={handleSaveMonitoringWork}
+      onSaveSumbitReport={handleSubmitReport}
       onCloseDeliverToMeModal={handleCloseDeliverToMeModal}
+      onCloseRequestReport={handleCloseModalRequestReport}
       onCloseMonitoringModal={handleCloseMonitoringModal}
       onViewDetailDeliverToMe={handleViewDetailDeliverToMe}
       onReportAction={handleReportAction}

src/screens/list_work/monitoring/view.js

@@ -20,7 +20,8 @@ import ModalRequestReport from './modal_request_report';
 const DetailListWorkMonitoringView = props => {
   LogBox.ignoreLogs(['VirtualizedLists should never be nested']);
   const {data, dataList, dataReport, onHandleReportPress, setShowRequestReport, showModal, onCloseModal, onSubmitReport} = props;
-
+  console.log('data', props.data);
+  
   const getColor = status => {
     switch (status) {
       case 'Chờ duyệt':

src/screens/list_work/view.js

@@ -18,6 +18,7 @@ import AddWorkModal from './modal_add_deliver_to_me/index';
 import AddMonitoringModal from './modal_add_monitoring/index';
 import Button from '../../components/Button';
 import {ROLE} from '../../actions/actionTypes';
+import ModalRequestReport from './monitoring/modal_request_report';
 
 const ListWorkView = props => {
   const {
@@ -26,6 +27,8 @@ const ListWorkView = props => {
     dataList,
     modalDeliverToMeVisible,
     modalMonitoringVisible,
+    modalRequestReport,
+
     tabView,
     currentTabKey,
     shouldShowFAB,
@@ -33,6 +36,7 @@ const ListWorkView = props => {
     onAddWork,
     onSaveDeliverToMeWork,
     onSaveMonitoringWork,
+    onSaveSumbitReport,
     onCloseDeliverToMeModal,
     onCloseMonitoringModal,
     onViewDetailDeliverToMe,
@@ -40,6 +44,8 @@ const ListWorkView = props => {
     onApprovalAction,
     getStatusColor,
     getButtonsForStatus,
+    onCloseRequestReport,
+    onOpenModalRequestReport,
   } = props;
 
   const renderTabView = () => {
@@ -70,8 +76,8 @@ const ListWorkView = props => {
           if (button.action === 'detail') {
             // Conditional navigation for "Chi tiết" button
             onViewDetailDeliverToMe(item);
-          } else if (button.action === 'approve' || button.action === 'needsEdit') {
-            onApprovalAction(item, button.action);
+          } else if (button.action === 'requestReport') {
+            onOpenModalRequestReport(item);
           } else {
             onReportAction(item, button.action);
           }
@@ -88,18 +94,13 @@ const ListWorkView = props => {
 
   const renderListView = ({item}) => {
     return (
-      <TouchableOpacity
-        style={styles.listItemContainer}
-        onPress={() => onViewDetailDeliverToMe(item)}
-        activeOpacity={0.7}>
+      <View style={styles.listItemContainer}>
         <View
           style={[
             styles.statusHeader,
             {backgroundColor: getStatusColor(item.status)},
           ]}>
-          <Text style={[styles.subText, styles.statusText]}>
-            {item.status}
-          </Text>
+          <Text style={[styles.subText, styles.statusText]}>{item.status}</Text>
         </View>
         <View style={styles.containerCard}>
           <View style={styles.cardContent}>
@@ -126,7 +127,7 @@ const ListWorkView = props => {
             {renderActionButtons(item)}
           </View>
         </View>
-      </TouchableOpacity>
+      </View>
     );
   };
 
@@ -173,10 +174,9 @@ const ListWorkView = props => {
       />
     );
   };
-  const renderBody = () =>{
+  const renderBody = () => {
     return (
-       <View style={styles.body}>
-     
+      <View style={styles.body}>
         {renderTabView()}
         {renderCard()}
         <View style={styles.listContainer}>
@@ -184,8 +184,8 @@ const ListWorkView = props => {
           {renderListItem()}
         </View>
       </View>
-    )
-  }
+    );
+  };
 
   return (
     <View style={styles.container}>
@@ -204,7 +204,7 @@ const ListWorkView = props => {
           />
         </FAB>
       )}
-      
+
       <AddWorkModal
         visible={modalDeliverToMeVisible}
         onClose={onCloseDeliverToMeModal}
@@ -216,6 +216,13 @@ const ListWorkView = props => {
         onClose={onCloseMonitoringModal}
         onSave={onSaveMonitoringWork}
       />
+
+       <ModalRequestReport
+        visible={modalRequestReport}
+        onClose={onCloseRequestReport}
+        onSubmitReport={onSaveSumbitReport}
+        workData={dataList}
+      />
     </View>
   );
 };