Skip to content

A
AppUms_Lecturer
Commit 61131c30 by tungnq
Options

TODO: Đã hoàn thiện giao diện chi tiết điểm danh theo từng lớp

parent 2e1a6c91
Showing with 82 additions and 72 deletions
src/screens/roll_call/detail/index.js
import React from 'react';
import React, {useState} from 'react';
import {Text, View, StyleSheet} from 'react-native';
import DetailRollCallView from './view';
const DetailRollCall = (props) => {
// Mock data - in real app this would come from API
const [sessionDates] = useState([
'30/06/2025', '06/07/2025', '13/07/2025', '20/07/2025', '27/07/2025',
'04/08/2025', '11/08/2025', '18/08/2025', '25/08/2025', '04/09/2025'
]);
const [studentsData] = useState([
{
id: 1,
studentCode: '85964',
name: 'Hoàng Lâm Anh',
attendance: [1, 1, 1, 1, 1, 1, 1, 1, 1, '*'],
percentage: '0%(0/18)'
},
{
id: 2,
studentCode: '85964',
name: 'Vũ Tuấn Khải',
attendance: [1, 1, 1, 1, 1, 1, 1, 1, 1, '*'],
percentage: '0%(0/18)'
},
{
id: 3,
studentCode: '85964',
name: 'Huỳnh Ngọc Lâm',
attendance: [1, 1, 0, 1, 0, 1, 1, 1, 1, '*'],
percentage: '22%(2/18)'
},
{
id: 4,
studentCode: '85964',
name: 'Nguyễn Đức Mạnh',
attendance: [1, 0, 0, 0, 0, 0, 1, 1, 1, '*'],
percentage: '50%(9/18)'
},
{
id: 5,
studentCode: '85964',
name: 'Vũ Thúy Linh',
attendance: [1, 1, 1, 1, 1, 0, 0, 0, 0, '*'],
percentage: '50%(9/18)'
},
{
id: 6,
studentCode: '85964',
name: 'Vũ Hồng Nhung',
attendance: [1, 1, 0, 0, 1, 1, 0, 1, 0, '*'],
percentage: '50%(9/18)'
}
]);
return (
<DetailRollCallView />
<DetailRollCallView sessionDates={sessionDates} studentsData={studentsData} />
);
};
......
src/screens/roll_call/detail/style.js
......@@ -18,7 +18,7 @@ const styles = StyleSheet.create({
marginBottom:15,
},
sectionTitle: {
fontSize: R.fontsize.fontsSizeTitle,
fontSize: R.fontsize.fontSizeSubTitle,
fontWeight: '600',
fontFamily: R.fonts.fontMedium,
color: R.colors.blue,
......@@ -28,11 +28,10 @@ const styles = StyleSheet.create({
attendanceTableContainer: {
borderWidth: 1,
borderColor: R.colors.gray3,
borderRadius: 8,
marginBottom: 20,
},
attendanceTable: {
minWidth: 800, // Minimum width to accommodate all columns
minWidth: 800,
},
attendanceHeaderRow: {
flexDirection: 'row',
......@@ -103,6 +102,12 @@ const styles = StyleSheet.create({
fontWeight: '700',
textAlign: 'center',
},
txt:{
fontSize: R.fontsize.fontSizeContent,
fontFamily: R.fonts.fontRegular,
fontWeight: '400',
color: R.colors.black,
}
})
export default styles
\ No newline at end of file
src/screens/roll_call/detail/view.js
......@@ -6,63 +6,15 @@ import Button from '../../../components/Button';
import R from '../../../assets/R';
const DetailRollCallView = props => {
const {} = props;
const { sessionDates, studentsData } = props;
// Mock data - in real app this would come from API
const [sessionDates] = useState([
'30/06/2025', '06/07/2025', '13/07/2025', '20/07/2025', '27/07/2025',
'04/08/2025', '11/08/2025', '18/08/2025', '25/08/2025', '04/09/2025'
]);
const [studentsData] = useState([
{
id: 1,
studentCode: '85964',
name: 'Hoàng Lâm Anh',
attendance: [1, 1, 1, 1, 1, 1, 1, 1, 1, '*'],
percentage: '0%(0/18)'
},
{
id: 2,
studentCode: '85964',
name: 'Vũ Tuấn Khải',
attendance: [1, 1, 1, 1, 1, 1, 1, 1, 1, '*'],
percentage: '0%(0/18)'
},
{
id: 3,
studentCode: '85964',
name: 'Huỳnh Ngọc Lâm',
attendance: [1, 1, 0, 1, 0, 1, 1, 1, 1, '*'],
percentage: '22%(2/18)'
},
{
id: 4,
studentCode: '85964',
name: 'Nguyễn Đức Mạnh',
attendance: [1, 0, 0, 0, 0, 0, 1, 1, 1, '*'],
percentage: '50%(9/18)'
},
{
id: 5,
studentCode: '85964',
name: 'Vũ Thúy Linh',
attendance: [1, 1, 1, 1, 1, 0, 0, 0, 0, '*'],
percentage: '50%(9/18)'
},
{
id: 6,
studentCode: '85964',
name: 'Vũ Hồng Nhung',
attendance: [1, 1, 0, 0, 1, 1, 0, 1, 0, '*'],
percentage: '50%(9/18)'
}
]);
return (
<View style={styles.container}>
<Header title={'Thống kê: ATTT2024.P1'} isBack />
<View style={styles.body}>
<View style={styles.btnGroup}>
<View style={styles.body}>
<ScrollView vertical showsVerticalScrollIndicator={false}>
<View style={styles.btnGroup}>
<Button
title="Tạo QR điểm danh"
onPress={() => {}}
......@@ -74,7 +26,7 @@ const DetailRollCallView = props => {
backgroundColor={R.colors.orange}
textColor={R.colors.white}
fontSize={12}
height={40}
height={35}
width={150}
/>
<Button />
......@@ -90,26 +42,26 @@ const DetailRollCallView = props => {
backgroundColor={R.colors.blue}
textColor={R.colors.white}
fontSize={12}
height={40}
height={35}
width={150}
/>
<Button />
</View>
<View>
<Text>
<Text style={styles.txt}>
SL sinh viên nghỉ quá số lượng cho phép: {' '}
<Text>
3
</Text>
</Text>
<Text>
<Text style={styles.txt}>
SL sinh viên đang bị cảnh báo: {' '}
<Text>
1
</Text>
</Text>
<Text>
<Text style={styles.txt}>
SL sinh viên đủ điều kiện: {' '}
<Text>
3
......@@ -118,30 +70,30 @@ const DetailRollCallView = props => {
</View>
<View>
<Text>
<Text style={[styles.txt, {fontSize: R.fontsize.fontSizeSubTitle, fontFamily: R.fonts.fontMedium, fontWeight:'600' , color: R.colors.blue}]}>
Kí hiệu
</Text>
<View style={{flexDirection:'row', justifyContent:'space-between'}}>
<View>
<Text>
(1)
<Text>
<Text style={[styles.txt, {color: R.colors.blue}]}>
(1) {' '}
<Text style={[styles.txt, {color: R.colors.black, fontFamily: R.fonts.fontMedium, fontWeight:'600'}]}>
Có mặt
</Text>
</Text>
</View>
<View>
<Text>
(0)
<Text>
<Text style={[styles.txt, {color: R.colors.red}]}>
(0) {' '}
<Text style={[styles.txt, {color: R.colors.black, fontFamily: R.fonts.fontMedium, fontWeight:'600'}]}>
Vắng mặt
</Text>
</Text>
</View>
<View>
<Text>
(*)
<Text>
<Text style={[styles.txt, {color: R.colors.blue}]}>
(*) {' '}
<Text style={[styles.txt, {color: R.colors.black, fontFamily: R.fonts.fontMedium, fontWeight:'600'}]}>
Chưa đến ngày
</Text>
</Text>
......@@ -203,6 +155,8 @@ const DetailRollCallView = props => {
</ScrollView>
</View>
</View>
</ScrollView>
</View>
</View>
);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment