TODO: Đã hoàn thiện xong giao diện bảng có chức năng switch

src/screens/roll_call/list_student_roll_call/style.js

@@ -56,8 +56,18 @@ const styles = StyleSheet.create({
         flexDirection: 'row',
         backgroundColor: R.colors.blue2,
         height: 50,
+    },
+    headerCell: {
+        height: 50,
         paddingVertical: 12,
-        paddingHorizontal: 8,
+        paddingHorizontal: 4,
+        borderRightWidth: 1,
+        borderRightColor: R.colors.gray3,
+        borderBottomWidth: 1,
+        borderBottomColor: R.colors.gray3,
+        justifyContent: 'center',
+        alignItems: 'center',
+        backgroundColor: R.colors.blue2,
     },
     headerText: {
         fontSize: 12,

src/screens/roll_call/list_student_roll_call/view.js

@@ -55,11 +55,21 @@ const ListStudentRollCallView = props => {
 
   const renderTableHeader = () => (
     <View style={styles.tableHeader}>
-      <Text style={[styles.headerText, styles.codeColumn]}>Mã sv</Text>
-      <Text style={[styles.headerText, styles.nameColumn]}>Họ và tên</Text>
-      <Text style={[styles.headerText, styles.dateColumn]}>Ngày học</Text>
-      <Text style={[styles.headerText, styles.statusColumn]}>Trạng thái</Text>
-      <Text style={[styles.headerText, styles.noteColumn]}>Ghi chú</Text>
+      <View style={[styles.headerCell, styles.codeColumn]}>
+        <Text style={styles.headerText}>Mã sv</Text>
+      </View>
+      <View style={[styles.headerCell, styles.nameColumn]}>
+        <Text style={styles.headerText}>Họ và tên</Text>
+      </View>
+      <View style={[styles.headerCell, styles.dateColumn]}>
+        <Text style={styles.headerText}>Ngày học</Text>
+      </View>
+      <View style={[styles.headerCell, styles.statusColumn]}>
+        <Text style={styles.headerText}>Trạng thái</Text>
+      </View>
+      <View style={[styles.headerCell, styles.noteColumn]}>
+        <Text style={styles.headerText}>Ghi chú</Text>
+      </View>
     </View>
   );