TODO: Tái cấu trúc các componet và style trong modal list work

src/screens/list_send_document/view.js

@@ -207,33 +207,32 @@ const ListSendView = props => {
       </View>
     );
   };
-  const renderFilter = () =>{
+  const renderFilter = () => {
     return (
-      
-        <View style={styles.box_3}>
-          <View style={styles.searchBox}>
-            <Image source={R.images.icSearch} style={{width: 20, height: 20}} />
-            <View style={{flex: 1}}>
-              <TextInput
-                placeholder="Tìm kiếm"
-                style={[styles.text, {padding: 0}]}
-                value={searchQuery}
-                onChangeText={setSearchQuery}
-              />
-            </View>
+      <View style={styles.box_3}>
+        <View style={styles.searchBox}>
+          <Image source={R.images.icSearch} style={{width: 20, height: 20}} />
+          <View style={{flex: 1}}>
+            <TextInput
+              placeholder="Tìm kiếm"
+              style={[styles.text, {padding: 0}]}
+              value={searchQuery}
+              onChangeText={setSearchQuery}
+            />
           </View>
-          <View style={{flex: 0.1}}></View>
+        </View>
+        <View style={{flex: 0.1}}></View>
 
-          <View style={styles.boxFilter}>
-            <Dropdown title={'Tìm kiếm'} height={35} />
-          </View>
+        <View style={styles.boxFilter}>
+          <Dropdown title={'Tìm kiếm'} height={35} />
         </View>
-    )
-  }
+      </View>
+    );
+  };
 
   const renderCard = () => {
     return (
-      <View >
+      <View>
         <View style={styles.card}>
           <TouchableOpacity style={styles.btnCard}>
             <Text
@@ -250,7 +249,7 @@ const ListSendView = props => {
             </Text>
           </TouchableOpacity>
         </View>
-            {renderFilter()}
+        {renderFilter()}
       </View>
     );
   };

src/screens/list_work/deliver_to_me/detail/modal_add_report/index.js

@@ -22,8 +22,6 @@ const WorkReportModal = ({visible, onClose, onSubmit}) => {
   };
 
   const handleAddAttachment = () => {
-    // Handle add attachment logic
-    console.log('Add attachment');
   };
 
   return (

src/screens/list_work/deliver_to_me/detail/modal_add_report/style.js

-import { StyleSheet } from "react-native";
-import R from "../../../../../assets/R";
+import {StyleSheet} from 'react-native';
+import R from '../../../../../assets/R';
 
 const styles = StyleSheet.create({
-    overlay: {
-      flex: 1,
-      backgroundColor: R.colors.blackShadow,
-      justifyContent: 'center',
-      alignItems: 'center',
-    },
-    modalContainer: {
-      backgroundColor: 'white',
-      borderRadius: 12,
-      padding: 20,
-      width: '90%',
-      maxWidth: 400,
-    },
-    title: {
-      fontSize: R.fontsize.fontsSizeTitle,
-      fontWeight: '600',
-      color: R.colors.blue,
-      textAlign: 'center',
-    },
-    required: {
-      color: R.colors.red,
-      fontSize: 14,
-      fontWeight: '500',
-    },
-    label: {
-      fontSize: R.fontsize.fontSizeContent,
-      fontWeight: '600',
-      fontFamily: R.fonts.fontMedium,
-      color: R.colors.black,
-    },
-    textInput: {
-      borderWidth: 1,
-      borderColor: R.colors.gray,
-      borderRadius: 8,
-      padding: 12,
-      fontSize: 14,
-      color: R.colors.black,
-      marginBottom: 16,
-      minHeight: 120,
-    },
-    attachmentContainer: {
-      borderWidth: 1,
-      borderColor: R.colors.blue,
-      borderRadius: 8,
-      padding: 20,
-      alignItems: 'center',
-      marginBottom: 20,
-    },
-    uploadIcon: {
-      width: 23,
-      height: 28,
-      tintColor: R.colors.blue,
-      marginBottom: 5,
-    },
-    attachmentText: {
-      fontSize: R.fontsize.fontSizeContent,
-      color: R.colors.blue,
-      fontWeight: '500',
-    },
-    buttonContainer: {
-      flexDirection: 'row',
-      justifyContent: 'flex-end',
-    },
-    cancelButton: {
-      flex: 1,
-      backgroundColor: R.colors.orange,
-      borderRadius: 8,
-      paddingVertical: 12,
-      alignItems: 'center',
-    },
-    submitButton: {
-      flex: 1,
-      backgroundColor: R.colors.blue,
-      borderRadius: 8,
-      paddingVertical: 12,
-      alignItems: 'center',
-    },
-    disabledButton: {
-      backgroundColor: R.colors.gray,
-    },
-    cancelButtonText: {
-      color: 'white',
-      fontSize: 16,
-      fontWeight: '600',
-    },
-    submitButtonText: {
-      color: 'white',
-      fontSize: 16,
-      fontWeight: '600',
-    },
-  });
+  overlay: {
+    flex: 1,
+    backgroundColor: R.colors.blackShadow,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  modalContainer: {
+    backgroundColor: 'white',
+    borderRadius: 12,
+    padding: 20,
+    width: '90%',
+    maxWidth: 400,
+  },
+  title: {
+    fontSize: R.fontsize.fontsSizeTitle,
+    fontWeight: '600',
+    color: R.colors.blue,
+    textAlign: 'center',
+  },
+  required: {
+    color: R.colors.red,
+    fontSize: 14,
+    fontWeight: '500',
+  },
+  label: {
+    fontSize: R.fontsize.fontSizeContent,
+    fontWeight: '600',
+    fontFamily: R.fonts.fontMedium,
+    color: R.colors.black,
+  },
+  textInput: {
+    borderWidth: 1,
+    borderColor: R.colors.gray,
+    borderRadius: 8,
+    padding: 12,
+    fontSize: 14,
+    color: R.colors.black,
+    marginBottom: 16,
+    minHeight: 120,
+  },
+  attachmentContainer: {
+    borderWidth: 1,
+    borderColor: R.colors.blue,
+    borderRadius: 8,
+    padding: 20,
+    alignItems: 'center',
+    marginBottom: 20,
+  },
+  uploadIcon: {
+    width: 23,
+    height: 28,
+    tintColor: R.colors.blue,
+    marginBottom: 5,
+  },
+  attachmentText: {
+    fontSize: R.fontsize.fontSizeContent,
+    color: R.colors.blue,
+    fontWeight: '500',
+  },
+  buttonContainer: {
+    flexDirection: 'row',
+    justifyContent: 'flex-end',
+  },
+  cancelButton: {
+    flex: 1,
+    backgroundColor: R.colors.orange,
+    borderRadius: 8,
+    paddingVertical: 12,
+    alignItems: 'center',
+  },
+  submitButton: {
+    flex: 1,
+    backgroundColor: R.colors.blue,
+    borderRadius: 8,
+    paddingVertical: 12,
+    alignItems: 'center',
+  },
+  disabledButton: {
+    backgroundColor: R.colors.gray,
+  },
+  cancelButtonText: {
+    color: 'white',
+    fontSize: 16,
+    fontWeight: '600',
+  },
+  submitButtonText: {
+    color: 'white',
+    fontSize: 16,
+    fontWeight: '600',
+  },
+});
 
 export default styles;

src/screens/list_work/deliver_to_me/detail/modal_add_report/view.js

@@ -14,7 +14,6 @@ const WorkReportModalView = ({
   onCancel,
   onAddAttachment,
 }) => {
-
   return (
     <Modal
       visible={visible}
@@ -34,7 +33,9 @@ const WorkReportModalView = ({
           />
 
           <Text style={styles.label}>Tài liệu đính kèm</Text>
-          <TouchableOpacity style={styles.attachmentContainer} onPress={onAddAttachment}>
+          <TouchableOpacity
+            style={styles.attachmentContainer}
+            onPress={onAddAttachment}>
             <Image source={R.images.icDocument} style={styles.uploadIcon} />
             <Text style={styles.attachmentText}>Thêm tài liệu</Text>
           </TouchableOpacity>

src/screens/list_work/deliver_to_me/detail/modal_edit_report/index.js

@@ -4,7 +4,6 @@ import EditReportModalView from './view';
 const EditReportModal = ({visible, onClose, onSubmit, initialContent = ''}) => {
   const [reportContent, setReportContent] = useState(initialContent);
 
-  // Update reportContent when initialContent changes
   useEffect(() => {
     setReportContent(initialContent);
   }, [initialContent]);
@@ -26,13 +25,9 @@ const EditReportModal = ({visible, onClose, onSubmit, initialContent = ''}) => {
   };
 
   const handleDeleteAttachment = () => {
-    // Handle attachment deletion logic
-    console.log('Delete attachment');
   };
 
   const handleAddAttachment = () => {
-    // Handle add attachment logic
-    console.log('Add attachment');
   };
 
   return (

src/screens/list_work/deliver_to_me/detail/modal_edit_report/style.js

@@ -4,12 +4,12 @@ import R from "../../../../../assets/R";
 const styles = StyleSheet.create({
   overlay: {
     flex: 1,
-    backgroundColor: 'rgba(0, 0, 0, 0.5)',
+    backgroundColor: R.colors.blackShadow,
     justifyContent: 'center',
     alignItems: 'center',
   },
   modalContainer: {
-    backgroundColor: 'white',
+    backgroundColor: R.colors.white,
     borderRadius: 12,
     padding: 20,
     width: '90%',
@@ -98,12 +98,12 @@ const styles = StyleSheet.create({
     alignItems: 'center',
   },
   cancelButtonText: {
-    color: 'white',
+    color: R.colors.white,
     fontSize: 16,
     fontWeight: '600',
   },
   submitButtonText: {
-    color: 'white',
+    color: R.colors.white,
     fontSize: 16,
     fontWeight: '600',
   },

src/screens/list_work/deliver_to_me/detail/modal_edit_report/view.js

@@ -14,7 +14,6 @@ const EditReportModalView = ({
   onDeleteAttachment,
   onAddAttachment,
 }) => {
-
   return (
     <Modal
       visible={visible}
@@ -44,7 +43,9 @@ const EditReportModalView = ({
             </TouchableOpacity>
           </View>
 
-          <TouchableOpacity style={styles.attachmentContainer} onPress={onAddAttachment}>
+          <TouchableOpacity
+            style={styles.attachmentContainer}
+            onPress={onAddAttachment}>
             <Image source={R.images.icDocument} style={styles.uploadIcon} />
             <Text style={styles.attachmentText}>Thêm tài liệu</Text>
           </TouchableOpacity>

src/screens/list_work/modal_add_deliver_to_me/view.js

@@ -34,7 +34,9 @@ const AddWorkModalView = props => {
   const renderItem_1 = ({item, onPress}) => {
     return (
       <View style={styles.chip}>
-        <TouchableOpacity style={styles.containerIcon} onPress={() => handleItemPress(item)}>
+        <TouchableOpacity
+          style={styles.containerIcon}
+          onPress={() => handleItemPress(item)}>
           <Image
             resizeMode="cover"
             source={R.images.icCancel}
@@ -64,7 +66,7 @@ const AddWorkModalView = props => {
                 title="Tiêu đề"
                 required
                 value={formData.title}
-                onChangeText={(value) => updateFormData('title', value)}
+                onChangeText={value => updateFormData('title', value)}
                 containerMarginBottom={10}
               />
 
@@ -72,7 +74,7 @@ const AddWorkModalView = props => {
                 title="Mô tả"
                 required
                 value={formData.content}
-                onChangeText={(value) => updateFormData('content', value)}
+                onChangeText={value => updateFormData('content', value)}
                 containerMarginBottom={10}
                 fontFamily={R.fonts.fontMedium}
                 titleFontSize={R.fontsize.fontSizeContent}
@@ -158,7 +160,7 @@ const AddWorkModalView = props => {
                 title="Ngày đến hạn"
                 required
                 value={formData.deadline}
-                onChangeText={(value) => updateFormData('deadline', value)}
+                onChangeText={value => updateFormData('deadline', value)}
                 containerMarginBottom={10}
               />
 

src/screens/list_work/modal_add_monitoring/index.js

@@ -47,7 +47,7 @@ const AddMonitoringModal = ({visible, onClose, onSave}) => {
       const workData = {
         ...formData,
         selectedImplementers: selectedItems,
-        type: 'monitoring', // Đánh dấu đây là công việc giám sát
+        type: 'monitoring', 
       };
       onSave(workData);
       resetForm();

src/screens/list_work/modal_add_monitoring/style.js

@@ -52,10 +52,9 @@ const styles = StyleSheet.create({
     justifyContent: 'space-between',
     paddingHorizontal: 5,
   },
- chip: {
+  chip: {
     flexDirection: 'row',
     alignItems: 'center',
-    // position: 'relative',
     paddingLeft: 10,
     paddingRight: 10,
     height: 25,

src/screens/list_work/modal_add_monitoring/view.js

@@ -20,12 +20,9 @@ const AddMonitoringModalView = props => {
     visible,
     formData,
     dataList,
-    selectedItems,
     updateFormData,
     handleSave,
     handleClose,
-    handleSelectItem,
-    handleRemoveItem,
   } = props;
 
   const renderItem_1 = ({item, onPress}) => {

src/screens/list_work/monitoring/modal_request_report/index.js

@@ -9,7 +9,6 @@ const ModalRequestReport = props => {
   const [reportDeadline, setReportDeadline] = useState('');
 
   const handleSubmit = () => {
-    // Validation
     if (!reportTitle.trim()) {
       alert('Vui lòng nhập tiêu đề báo cáo');
       return;
@@ -23,7 +22,6 @@ const ModalRequestReport = props => {
       return;
     }
 
-    // Tạo data để submit
     const reportData = {
       title: reportTitle.trim(),
       content: reportContent.trim(),
@@ -32,10 +30,8 @@ const ModalRequestReport = props => {
       implementers: workData?.implementer || [],
     };
 
-    // Gọi callback để submit
     onSubmitReport(reportData);
 
-    // Reset form
     resetForm();
   };
 

src/screens/list_work/monitoring/modal_request_report/style.js

@@ -21,7 +21,7 @@ const styles = StyleSheet.create({
       height: 2,
     },
     shadowOpacity: 0.25,
-    padding:10
+    padding: 10,
   },
   modalHeader: {
     flexDirection: 'row',
@@ -36,7 +36,7 @@ const styles = StyleSheet.create({
     fontWeight: '600',
     fontFamily: R.fonts.fontMedium,
     color: R.colors.blue,
-    textAlign:'center'
+    textAlign: 'center',
   },
   closeButton: {
     padding: 5,
@@ -151,16 +151,16 @@ const styles = StyleSheet.create({
     fontFamily: R.fonts.fontMedium,
     color: R.colors.white,
   },
-  buttonContainerStyle:{
-    borderRadius:15,
-    color:R.colors.white,
+  buttonContainerStyle: {
+    borderRadius: 15,
+    color: R.colors.white,
+  },
+  containerButton: {
+    flexDirection: 'row',
+    justifyContent: 'flex-end',
+    alignItems: 'center',
+    marginTop: 10,
   },
-  containerButton:{
-    flexDirection:'row',
-    justifyContent:'flex-end',
-    alignItems:'center',
-    marginTop:10
-  }
 });
 
 export default styles;

src/screens/list_work/monitoring/modal_request_report/view.js

@@ -3,10 +3,6 @@ import {
   Modal,
   View,
   Text,
-  TouchableOpacity,
-  Image,
-  TextInput,
-  ScrollView,
 } from 'react-native';
 import styles from './style';
 import R from '../../../../assets/R';
@@ -18,13 +14,8 @@ const ModalRequestReportView = props => {
     visible,
     onClose,
     onSubmit,
-    reportTitle,
-    setReportTitle,
-    reportContent,
-    setReportContent,
     reportDeadline,
     setReportDeadline,
-    implementers,
   } = props;
 
   return (
@@ -35,40 +26,36 @@ const ModalRequestReportView = props => {
       onRequestClose={onClose}>
       <View style={styles.modalOverlay}>
         <View style={styles.modalContainer}>
-            <Text style={styles.modalTitle}>
-                Yêu cầu báo cáo
-            </Text>
-            <TextField
-                title={'Hạn nộp báo cáo'}
-                required={true}
-                value={reportDeadline}
-                onChangeText={setReportDeadline}
+          <Text style={styles.modalTitle}>Yêu cầu báo cáo</Text>
+          <TextField
+            title={'Hạn nộp báo cáo'}
+            required={true}
+            value={reportDeadline}
+            onChangeText={setReportDeadline}
+          />
+          <View style={styles.containerButton}>
+            <Button
+              title={'Huỷ'}
+              onPress={onClose}
+              backgroundColor={R.colors.orange}
+              textColor={R.colors.white}
+              fontSize={R.fontsize.fontSizeContent}
+              height={30}
+              width={100}
+              marginRight={10}
+              containerStyle={styles.buttonContainerStyle}
             />
-            <View style={styles.containerButton}>
-                <Button
-                    title={'Huỷ'}
-                    onPress={onClose}
-                    backgroundColor={R.colors.orange}
-                    textColor={R.colors.white}
-                    fontSize={R.fontsize.fontSizeContent}
-                    height={30}
-                    width={100}
-                    marginRight={10}
-                    containerStyle={styles.buttonContainerStyle}
-                />
-                    <Button
-                    title={'Yêu cầu báo cáo'}
-                    onPress={onSubmit}
-                    backgroundColor={R.colors.blue}
-                    textColor={R.colors.white}
-                    fontSize={R.fontsize.fontSizeContent}
-                    height={30}
-                    width={130}
-                    containerStyle={styles.buttonContainerStyle}
-                />
-            </View>
-          
-
+            <Button
+              title={'Yêu cầu báo cáo'}
+              onPress={onSubmit}
+              backgroundColor={R.colors.blue}
+              textColor={R.colors.white}
+              fontSize={R.fontsize.fontSizeContent}
+              height={30}
+              width={130}
+              containerStyle={styles.buttonContainerStyle}
+            />
+          </View>
         </View>
       </View>
     </Modal>

src/screens/list_work/monitoring/view.js

@@ -230,7 +230,7 @@ const DetailListWorkMonitoringView = props => {
 
   return (
     <View style={styles.container}>
-      <Header title={'Chi tiết công việc giám sát'} />
+      <Header title={'Chi tiết công việc giám sát'}  isBack={true}/>
       <ScrollView showsVerticalScrollIndicator={false}>
         {renderBody()}
       </ScrollView>

src/screens/notification/view.js

@@ -24,7 +24,6 @@ const NotificationView = props => {
     onSearchChange,
   } = props;
   const navigate = useNavigation();
-  //Xử lý render item cho tab view
   const getRenderItemFunction = () => {
     switch (activeTab) {
       case 'Tuition':
@@ -33,7 +32,6 @@ const NotificationView = props => {
         return renderNotificationItemView;
     }
   };
-  //Xử lý màu trạng thái khi ở tab view
   const getStatusColor = status => {
     switch (status) {
       case 'Đã gửi':
@@ -44,7 +42,6 @@ const NotificationView = props => {
         return R.colors.gray || '#9E9E9E';
     }
   };
-  //TabView
   const renderTabViewItem = ({item}) => {
     const isActivity = activeTab === item.key;
     return (
@@ -68,7 +65,6 @@ const NotificationView = props => {
       </View>
     );
   };
-  //Search
   const renderSearchBox = () => {
     return (
       <View style={styles.containerSearchBox}>
@@ -92,7 +88,6 @@ const NotificationView = props => {
       </View>
     );
   };
-  //List Notification View
   const renderNotificationItemView = ({item}) => {
     return (
       <View style={styles.cardItem}>
@@ -110,7 +105,6 @@ const NotificationView = props => {
       </View>
     );
   };
-  //List Notification Tution
   const renderNotificationItemTution = ({item}) => {
     const statusColor = getStatusColor(item.status);
     return (
@@ -194,7 +188,6 @@ const NotificationView = props => {
       />
     );
   };
-  //Empty
   const renderItemEmpty = () => {
     return (
       <View style={styles.containerEmpty}>
@@ -206,7 +199,6 @@ const NotificationView = props => {
   const renderList = () =>{
     return (
          <View style={styles.containerBody}>
-        {/* {(dataNotifi[activeTab] && dataNotifi[activeTab].length > 0) && renderSearchBox()} */}
 
         {dataNotifi[activeTab].length === 0
           ? renderItemEmpty()