TODO: Tái cấu trúc các component để cải thiện hiển thị và xử lý sự kiện trong ứng dụng

src/screens/incoming_document/detail/view.js

@@ -130,11 +130,11 @@ const DetailIncomingDocumentView = props => {
             </Text>
           </View>
           <Text style={[styles.text, styles.textWithMargin]}>
-            Loại văn bản:
+            Loại văn bản:{' '}
             <Text style={styles.text_2}>{icomingDocument.document_type}</Text>
           </Text>
           <Text style={[styles.text, styles.textWithMargin]}>
-            Lĩnh vực văn bản:
+            Lĩnh vực văn bản:{' '}
             <Text style={styles.text_2}>{icomingDocument.field}</Text>
           </Text>
           <View style={styles.signerContainer}>

src/screens/list_rest_report/detail/style.js

@@ -18,7 +18,7 @@ const styles = StyleSheet.create({
   },
   card: {
     borderRadius: 10,
-    marginVertical: 10,
+    marginVertical: 7.5,
     backgroundColor: R.colors.white,
     shadowColor: R.colors.black,
     shadowOffset: {width: 0, height: 2},
@@ -36,6 +36,7 @@ const styles = StyleSheet.create({
   statusHeader: {
     borderTopRightRadius: 10,
     borderTopLeftRadius: 10,
+    paddingLeft:10
   },
   statusText: {
     fontSize: R.sizes.sm,
@@ -48,6 +49,8 @@ const styles = StyleSheet.create({
   statusTextInner: {
     fontSize: R.sizes.sm,
     color: R.colors.white,
+    fontFamily: R.fonts.fontMedium,
+    fontWeight: '600',
   },
   // Styles cho card content
   cardContent: {

src/screens/list_rest_report/detail/view.js

@@ -32,11 +32,9 @@ const AbsenceListByCourseView = props => {
       <View style={styles.card}>
         <View style={styles.statusHeaderContainer}>
           <View style={[styles.statusHeader, {backgroundColor: getColor(item.status)}]}>
-            <Text style={[styles.text, styles.statusText]}>
               <Text style={styles.statusTextInner}>
                 {item.status}
               </Text>
-            </Text>
           </View>
         </View>
 
@@ -61,14 +59,14 @@ const AbsenceListByCourseView = props => {
                 {item.periods.map((item, index) => {
                   return <Text key={index}>{item.time},</Text>;
                 })}{' '}
-                - Ngày:{item.dateStudy}
+                - Ngày: {' '}{item.dateStudy}
               </Text>
             </Text>
           </View>
           {/* Row 3 */}
           <View>
             <Text style={[styles.text, styles.labelText]}>
-              Địa điểm:
+              Địa điểm:{' '}
               <Text style={[styles.text, styles.valueText]}>
                 {item.location}
               </Text>
@@ -77,7 +75,7 @@ const AbsenceListByCourseView = props => {
           {/* Row 4 */}
           <View>
             <Text style={[styles.text, styles.labelText]}>
-              Giảng viên thay thế:
+              Giảng viên thay thế:{' '}
               <Text style={[styles.text, styles.valueText]}>
                 {item.teacher}
               </Text>
@@ -99,9 +97,9 @@ const AbsenceListByCourseView = props => {
                 onPress={() => navigation.navigate(SCREENNAME.LISTMAKEUPCLASSES)}
                 backgroundColor={R.colors.blue}
                 textColor={R.colors.white}
-                height={25}
+                height={35}
                 width={90}
-                borderRadius={15}
+                borderRadius={50}
                 fontSize={11}
                 fontWeight={'600'}
                 fontFamily={R.fonts.fontMedium}
@@ -116,9 +114,9 @@ const AbsenceListByCourseView = props => {
                 onPress={() => {}}
                 backgroundColor={R.colors.orange}
                 textColor={R.colors.white}
-                height={25}
+                height={35}
                 width={90}
-                borderRadius={15}
+                borderRadius={50}
                 fontSize={11}
                 fontWeight={'600'}
                 fontFamily={R.fonts.fontMedium}

src/screens/list_send_document/detail/style.js

@@ -35,7 +35,7 @@ const styles = StyleSheet.create({
     fontSize: R.fontsize.fontSizeContent,
     fontWeight: '400',
     fontFamily: R.fonts.fontRegular,
-    color: R.colors.black,
+    color: R.colors.gray4,
   },
   textBtn: {
     color: R.colors.black,
@@ -60,8 +60,10 @@ const styles = StyleSheet.create({
     borderWidth: 1,
     borderColor: R.colors.grayBorderInputTextHeader,
     borderRadius: 100,
-    padding: 10,
+    paddingHorizontal: 5,
+    height:35,
     alignSelf: 'flex-start',
+    justifyContent: 'center',
     backgroundColor: R.colors.orange,
     marginHorizontal: 5,
   },
@@ -72,8 +74,9 @@ const styles = StyleSheet.create({
     marginVertical: 10,
     borderRadius: 10,
     backgroundColor: R.colors.blue1,
-    padding: 10,
+    height:35,
     width: 300,
+    alignItems: 'center',
   },
   //MODAL Thêm Bút Phê
   modalOverlay: {

src/screens/list_send_document/detail/view.js

@@ -106,11 +106,11 @@ const DetailSendDocumentView = props => {
               marginBottom: 5,
             }}>
             <Text style={styles.text}>
-              Số ký hiệu:
+              Số ký hiệu:{' '}
               <Text style={styles.text_2}>{icomingDocument.symbol_number}</Text>
             </Text>
             <Text style={styles.text}>
-              Số vào sổ:
+              Số vào sổ:{' '}
               <Text style={styles.text_2}>
                 {icomingDocument.number_entry_book}
               </Text>
@@ -123,47 +123,39 @@ const DetailSendDocumentView = props => {
               marginBottom: 5,
             }}>
             <Text style={styles.text}>
-              Ngày đến:
+              Ngày đến:{' '}
               <Text style={styles.text_2}>{icomingDocument.term}</Text>
             </Text>
             <Text style={styles.text}>
-              Ngày văn bản:
+              Ngày văn bản:{' '}
               <Text style={styles.text_2}>{icomingDocument.term_display}</Text>
             </Text>
           </View>
           <Text style={[styles.text, {marginBottom: 5}]}>
-            Loại văn bản:
+            Loại văn bản:{' '}
             <Text style={styles.text_2}>{icomingDocument.document_type}</Text>
           </Text>
           <Text style={[styles.text, {marginBottom: 5}]}>
-            Lĩnh vực văn bản:
+            Lĩnh vực văn bản:{' '}
             <Text style={styles.text_2}>{icomingDocument.field}</Text>
           </Text>
-          <View
-            style={{
-              flexDirection: 'row',
-              justifyContent: 'space-between',
-              marginBottom: 5,
-            }}>
-            <Text style={styles.text}>
-              Người ký:
-              <Text style={styles.text_2}>{icomingDocument.signer_name}</Text>
-            </Text>
-            <Text style={styles.text}>
-              Đối tác gửi:
-              <Text style={styles.text_2}>
-                {icomingDocument.sender_partner}
-              </Text>
-            </Text>
-          </View>
+
+          <Text style={[styles.text, {marginBottom: 5}]}>
+            Người ký:{' '}
+            <Text style={styles.text_2}>{icomingDocument.signer_name}</Text>
+          </Text>
+          <Text style={[styles.text, {marginBottom: 5}]}>
+            Đối tác gửi:{' '}
+            <Text style={styles.text_2}>{icomingDocument.sender_partner}</Text>
+          </Text>
           <TextMulti title="Ghi chú" />
           <View style={{marginTop: 5}}></View>
-          <Text style={[styles.text, {marginBottom: 3}]}>Nội dung</Text>
+          <Text style={[styles.text, {marginBottom: 5}]}>Nội dung</Text>
           <View style={[styles.containerContent, {marginBottom: 5}]}>
             <Text style={styles.text_2}>{icomingDocument.content}</Text>
           </View>
           <Text style={[styles.text, {marginBottom: 5}]}>
-            Ý kiến của BGH:
+            Ý kiến của BGH:{' '}
             <Text style={styles.text_2}>{icomingDocument.opinion_bgh}</Text>
           </Text>
           <View

src/screens/list_send_document/style.js

@@ -61,11 +61,12 @@ const styles = StyleSheet.create({
     justifyContent: 'center',
     borderColor: R.colors.grayBorderInputTextHeader,
   },
-  text: {
+  textCardTitle: {
     fontSize: R.sizes.sm,
-    color: R.colors.black,
-    fontFamily: R.fonts.fontRegular,
-    fontWeight: '400',
+    color: R.colors.white,
+    fontFamily: R.fonts.fontMedium,
+    fontWeight: '600',
+    
   },
   box_3: {
     flexDirection: 'row',
@@ -86,17 +87,24 @@ const styles = StyleSheet.create({
   boxFilter: {
     flex: 1,
   },
-  cardIncomingDocument: {
-    borderRadius: 10,
-    padding: 10,
+  boxIncomingDocument: {
     marginHorizontal: 15,
     marginVertical:7.5,
+    borderRadius: 15,
+    borderWidth: 1,
+    borderColor: R.colors.grayBorderInputTextHeader,
     backgroundColor: R.colors.white,
     shadowColor: R.colors.black,
     shadowOffset: {width: 0.5, height: 2},
     shadowOpacity: Platform.OS === 'ios' ? 0.25 : 1,
     elevation: Platform.OS === 'ios' ? 1 : 2,
   },
+  cardIncomingDocument: {
+    padding: 10,
+    borderBottomLeftRadius: 15,
+    borderBottomRightRadius: 15,
+    
+  },
   textSubTitle: {
     fontSize: R.fontsize.fontSizeContent,
     fontWeight: '500',

src/screens/list_send_document/view.js

@@ -69,102 +69,106 @@ const ListSendView = props => {
   const renderItemIncomingDocument = ({item}) => {
     const showRelatedWork = getHiddenButton(item?.total_head_of_work);
     return (
-      <View style={styles.cardIncomingDocument}>
-        <Text style={styles.textSubTitle}>{item.title}</Text>
-
-        <View style={{flexDirection: 'row', justifyContent: 'space-between'}}>
-          <Text style={styles.textSubTitle}>
-            Ngày tạo: <Text style={styles.text}>{item.term}</Text>
-          </Text>
-          <Text style={styles.textSubTitle}>
-            Trạng thái:{' '}
-            <Text style={[{color: getColorStatus(item.status)}]}>
+      <View style={styles.boxIncomingDocument}>
+        <View style={{paddingLeft:10, borderTopLeftRadius:15, borderTopRightRadius:15, backgroundColor:getColorStatus(item.status)}}>
+            <Text style= {styles.textCardTitle }>
               {item.status}
             </Text>
-          </Text>
         </View>
-        <Text style={styles.textSubTitle}>
-          Chế độ:{' '}
-          <Text style={[{color: getColorRegime(item.regime)}]}>
-            {item.regime}
-          </Text>
-        </Text>
 
-        <View
-          style={{
-            flexDirection: 'row',
-            alignSelf: 'flex-end',
-            marginVertical: 5,
-          }}>
-          {showRelatedWork && (
-            <Button
-              title="Công việc"
-              onPress={() => {}}
-              backgroundColor={R.colors.orange}
-              textColor={R.colors.white}
-              height={25}
-              borderRadius={15}
-              fontSize={11}
-              fontWeight={'600'}
-              fontFamily={R.fonts.fontMedium}
-              paddingHorizontal={15}
-            />
-          )}
+        <View style={styles.cardIncomingDocument}>
+          <Text style={styles.textSubTitle}>{item.title}</Text>
 
-          {item.status === 'Cần chỉnh sửa' && (
-            <>
-              <View style={{flex: 0.1}}></View>
-              <Button
-                title="Chỉnh sửa"
-                onPress={() => navigation.navigate(ScreenName.EDITSENDDOCUMENT)}
-                backgroundColor={R.colors.orange}
-                textColor={R.colors.white}
-                width={150}
-                height={30}
-                borderRadius={15}
-                fontSize={R.sizes.sm}
-                fontWeight={'600'}
-                fontFamily={R.fonts.fontMedium}
-                paddingHorizontal={15}
-              />
-            </>
-          )}
+          <View style={{flexDirection: 'row', justifyContent: 'space-between'}}>
+            <Text style={styles.textSubTitle}>
+              Ngày tạo: <Text style={styles.text}>{item.term}</Text>
+            </Text>
+          </View>
+          <Text style={styles.textSubTitle}>
+            Chế độ:{' '}
+            <Text style={[{color: getColorRegime(item.regime)}]}>
+              {item.regime}
+            </Text>
+          </Text>
 
-          {item.status === 'Dự thảo' && (
-            <>
-              <View style={{flex: 0.1}}></View>
+          <View
+            style={{
+              flexDirection: 'row',
+              alignSelf: 'flex-end',
+              marginVertical: 5,
+            }}>
+            {showRelatedWork && (
               <Button
-                title="Yêu cầu phê duyệt"
-                onPress={() =>
-                  navigation.navigate(ScreenName.STATUSSENDDOCUMENT)
-                }
+                title="Công việc"
+                onPress={() => {}}
                 backgroundColor={R.colors.orange}
                 textColor={R.colors.white}
-                height={30}
-                width={160}
+                height={25}
                 borderRadius={15}
-                fontSize={R.sizes.sm}
+                fontSize={11}
                 fontWeight={'600'}
                 fontFamily={R.fonts.fontMedium}
                 paddingHorizontal={15}
               />
-            </>
-          )}
+            )}
+
+            {item.status === 'Cần chỉnh sửa' && (
+              <>
+                <View style={{flex: 0.1}}></View>
+                <Button
+                  title="Chỉnh sửa"
+                  onPress={() =>
+                    navigation.navigate(ScreenName.EDITSENDDOCUMENT)
+                  }
+                  backgroundColor={R.colors.orange}
+                  textColor={R.colors.white}
+                  width={150}
+                  height={30}
+                  borderRadius={15}
+                  fontSize={R.sizes.sm}
+                  fontWeight={'600'}
+                  fontFamily={R.fonts.fontMedium}
+                  paddingHorizontal={15}
+                />
+              </>
+            )}
 
-          <View style={{flex: 0.1}}></View>
-          <Button
-            title="Chi tiết"
-            onPress={() => navigation.navigate(ScreenName.DETAILSENDDOCUMENT)}
-            backgroundColor={R.colors.blue}
-            textColor={R.colors.white}
-            height={30}
-            width={90}
-            borderRadius={15}
-            fontSize={R.sizes.sm}
-            fontWeight={'600'}
-            fontFamily={R.fonts.fontMedium}
-            paddingHorizontal={15}
-          />
+            {item.status === 'Dự thảo' && (
+              <>
+                <View style={{flex: 0.1}}></View>
+                <Button
+                  title="Yêu cầu phê duyệt"
+                  onPress={() =>
+                    navigation.navigate(ScreenName.STATUSSENDDOCUMENT)
+                  }
+                  backgroundColor={R.colors.orange}
+                  textColor={R.colors.white}
+                  height={30}
+                  width={160}
+                  borderRadius={15}
+                  fontSize={R.sizes.sm}
+                  fontWeight={'600'}
+                  fontFamily={R.fonts.fontMedium}
+                  paddingHorizontal={15}
+                />
+              </>
+            )}
+
+            <View style={{flex: 0.1}}></View>
+            <Button
+              title="Chi tiết"
+              onPress={() => navigation.navigate(ScreenName.DETAILSENDDOCUMENT)}
+              backgroundColor={R.colors.blue}
+              textColor={R.colors.white}
+              height={30}
+              width={90}
+              borderRadius={15}
+              fontSize={R.sizes.sm}
+              fontWeight={'600'}
+              fontFamily={R.fonts.fontMedium}
+              paddingHorizontal={15}
+            />
+          </View>
         </View>
       </View>
     );

src/screens/list_work/deliver_to_me/view.js

@@ -58,7 +58,7 @@ const DetailListWorkDeliverToMeView = props => {
             borderRadius: 10,
             marginBottom: 5,
           }}>
-          <Text style={[styles.text, {color: R.colors.gray}]}>
+          <Text style={[styles.text, {color: R.colors.gray4}]}>
             {item.content}
           </Text>
         </View>
@@ -111,7 +111,7 @@ const DetailListWorkDeliverToMeView = props => {
             padding: 10,
             borderRadius: 10,
           }}>
-          <Text style={[styles.text, {color: R.colors.gray}]}>
+          <Text style={[styles.text, {color: R.colors.gray4}]}>
             {item.content}
           </Text>
         </View>
@@ -158,7 +158,7 @@ const DetailListWorkDeliverToMeView = props => {
         </Text>
         <Text style={styles.text}>Nội dung công việc:</Text>
         <View style={styles.containerContent}>
-          <Text style={[styles.text, {color: R.colors.gray}]}>
+          <Text style={[styles.text, {color: R.colors.gray4}]}>
             {data.content}
           </Text>
         </View>

src/screens/list_work/monitoring/view.js

@@ -109,7 +109,7 @@ const DetailListWorkMonitoringView = props => {
         </Text>
         <Text style={[styles.text, {marginBottom: 3}]}>Nội dung công việc</Text>
         <View style={styles.containerContent}>
-          <Text style={[styles.text, {color: R.colors.gray}]}>
+          <Text style={[styles.text, {color: R.colors.gray4}]}>
             {data.content}
           </Text>
         </View>