Skip to content

A
AppUms_Lecturer
Commit 1a4526ca by tungnq
Options

TODO: Bổ sung thêm trạng thái không có dữ liệu ở màn hình báo bù lịch dạy

parent c5884469
Showing with 200 additions and 117 deletions
src/screens/academic_advisor/list_student/detail/style.js
import {StyleSheet, Text, View} from 'react-native'; import {StyleSheet, Text, View, Platform} from 'react-native';
import R from '../../../../assets/R'; import R from '../../../../assets/R';
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
flex: 1, flex: 1,
backgroundColor: R.colors.white, backgroundColor: R.colors.white,
}, },
body: {
flex: 1,
},
// Card styles
cardWithMargin: {
marginHorizontal: 15,
marginTop: 10,
borderRadius: 10,
},
containerCard: { containerCard: {
marginHorizontal: 15, marginHorizontal: 15,
marginVertical: 5,
borderRadius: 10, borderRadius: 10,
}, },
card: { card: {
...@@ -15,7 +24,6 @@ const styles = StyleSheet.create({ ...@@ -15,7 +24,6 @@ const styles = StyleSheet.create({
borderBottomStartRadius: 10, borderBottomStartRadius: 10,
paddingHorizontal: 10, paddingHorizontal: 10,
paddingVertical: 5, paddingVertical: 5,
backgroundColor: R.colors.white, backgroundColor: R.colors.white,
shadowColor: R.colors.black, shadowColor: R.colors.black,
shadowOffset: {width: 0.5, height: 2}, shadowOffset: {width: 0.5, height: 2},
...@@ -24,6 +32,7 @@ const styles = StyleSheet.create({ ...@@ -24,6 +32,7 @@ const styles = StyleSheet.create({
elevation: Platform.OS === 'ios' ? 1 : 2, elevation: Platform.OS === 'ios' ? 1 : 2,
}, },
// Container styles for text rows
containerText: { containerText: {
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
...@@ -43,7 +52,14 @@ const styles = StyleSheet.create({ ...@@ -43,7 +52,14 @@ const styles = StyleSheet.create({
sizedBox: { sizedBox: {
flex: 3, flex: 3,
}, },
containerSubText: {
flexDirection: 'row',
marginBottom: 5,
},
containerSubTextItemLeft: {},
containerSubTextItemRight: {},
// Text styles
text: { text: {
fontSize: R.sizes.sm, fontSize: R.sizes.sm,
fontFamily: R.fonts.fontMedium, fontFamily: R.fonts.fontMedium,
...@@ -51,12 +67,10 @@ const styles = StyleSheet.create({ ...@@ -51,12 +67,10 @@ const styles = StyleSheet.create({
color: R.colors.black, color: R.colors.black,
textAlign: 'center', textAlign: 'center',
}, },
containerSubText: { regularText: {
flexDirection: 'row', fontFamily: R.fonts.fontRegular,
marginBottom: 5, fontWeight: '400',
}, },
containerSubTextItemLeft: {},
containerSubTextItemRight: {},
textTitle: { textTitle: {
fontSize: R.sizes.md, fontSize: R.sizes.md,
fontFamily: R.fonts.fontMedium, fontFamily: R.fonts.fontMedium,
...@@ -64,12 +78,32 @@ const styles = StyleSheet.create({ ...@@ -64,12 +78,32 @@ const styles = StyleSheet.create({
color: R.colors.blue, color: R.colors.blue,
marginHorizontal: 15, marginHorizontal: 15,
}, },
label: { textTitleWithMargin: {
marginVertical: 10,
},
// Status header styles
statusHeaderText: {
fontSize: R.sizes.sm,
fontFamily: R.fonts.fontMedium,
fontWeight: '600',
color: R.colors.white,
marginHorizontal: 10,
marginVertical: 3,
},
statusText: {
color: R.colors.white,
},
// History card text styles
historyCardText: {
fontSize: R.sizes.sm, fontSize: R.sizes.sm,
fontFamily: R.fonts.fontMedium, fontFamily: R.fonts.fontMedium,
fontWeight: '600', fontWeight: '600',
color: R.colors.black, color: R.colors.black,
}, },
// Checkbox styles
checkboxContainer: { checkboxContainer: {
flexDirection: 'row', flexDirection: 'row',
flexWrap: 'wrap', flexWrap: 'wrap',
...@@ -79,6 +113,13 @@ const styles = StyleSheet.create({ ...@@ -79,6 +113,13 @@ const styles = StyleSheet.create({
width: '50%', width: '50%',
marginBottom: 15, marginBottom: 15,
}, },
label: {
fontSize: R.sizes.sm,
fontFamily: R.fonts.fontMedium,
fontWeight: '600',
color: R.colors.black,
},
imageStyle: {},
}); });
export default styles; export default styles;
src/screens/academic_advisor/list_student/detail/view.js
...@@ -24,14 +24,12 @@ const DetailStudentView = props => { ...@@ -24,14 +24,12 @@ const DetailStudentView = props => {
}; };
const statusColor = getStatusColor(student.status); const statusColor = getStatusColor(student.status);
const renderCard = () => {
return ( return (
<View style={styles.container}>
<Header title={'Nguyễn Minh Đức - 2598671'} isBack />
<View style={styles.body}>
<View <View
style={[ style={[
styles.card, styles.card,
{marginHorizontal: 15, marginTop: 10, borderRadius: 10}, styles.cardWithMargin,
]}> ]}>
<View style={styles.containerText}> <View style={styles.containerText}>
<View style={styles.containerTextItemLeft}> <View style={styles.containerTextItemLeft}>
...@@ -53,7 +51,7 @@ const DetailStudentView = props => { ...@@ -53,7 +51,7 @@ const DetailStudentView = props => {
<Text <Text
style={[ style={[
styles.text, styles.text,
{fontFamily: R.fonts.fontRegular, fontWeight: '400'}, styles.regularText,
]}> ]}>
{student.date_student} {student.date_student}
</Text> </Text>
...@@ -66,7 +64,7 @@ const DetailStudentView = props => { ...@@ -66,7 +64,7 @@ const DetailStudentView = props => {
<Text <Text
style={[ style={[
styles.text, styles.text,
{fontFamily: R.fonts.fontRegular, fontWeight: '400'}, styles.regularText,
]}> ]}>
{student.tele_phone} {student.tele_phone}
</Text> </Text>
...@@ -81,7 +79,7 @@ const DetailStudentView = props => { ...@@ -81,7 +79,7 @@ const DetailStudentView = props => {
<Text <Text
style={[ style={[
styles.text, styles.text,
{fontFamily: R.fonts.fontRegular, fontWeight: '400'}, styles.regularText,
]}> ]}>
{student.gender} {student.gender}
</Text> </Text>
...@@ -94,7 +92,7 @@ const DetailStudentView = props => { ...@@ -94,7 +92,7 @@ const DetailStudentView = props => {
<Text <Text
style={[ style={[
styles.text, styles.text,
{fontFamily: R.fonts.fontRegular, fontWeight: '400'}, styles.regularText,
]}> ]}>
{student.average_score} {student.average_score}
</Text> </Text>
...@@ -110,7 +108,7 @@ const DetailStudentView = props => { ...@@ -110,7 +108,7 @@ const DetailStudentView = props => {
<Text <Text
style={[ style={[
styles.text, styles.text,
{fontFamily: R.fonts.fontRegular, fontWeight: '400'}, styles.regularText,
]}> ]}>
{student.average_score} {student.average_score}
</Text> </Text>
...@@ -125,7 +123,7 @@ const DetailStudentView = props => { ...@@ -125,7 +123,7 @@ const DetailStudentView = props => {
<Text <Text
style={[ style={[
styles.text, styles.text,
{fontFamily: R.fonts.fontRegular, fontWeight: '400'}, styles.regularText,
]}> ]}>
{student.training_average_score} {student.training_average_score}
</Text> </Text>
...@@ -151,102 +149,86 @@ const DetailStudentView = props => { ...@@ -151,102 +149,86 @@ const DetailStudentView = props => {
))} ))}
</View> </View>
</View> </View>
<Text style={[styles.textTitle, {marginTop: 10}]}> )
Lịch sử tình trạng của sinh viên }
</Text>
const renderCardHistory = () =>{
return (
<View <View
style={[ style={[
styles.containerCard, styles.containerCard,
{backgroundColor: getStatusColor(student.status)}, {backgroundColor: getStatusColor(student.status)},
]}> ]}>
<Text <Text
style={[ style={styles.statusHeaderText}>
{
fontSize: R.sizes.sm,
fontFamily: R.fonts.fontMedium,
fontWeight: '600',
color: R.colors.white,
marginHorizontal: 10,
marginVertical: 3,
},
]}>
Trạng thái học tập:{' '} Trạng thái học tập:{' '}
<Text style={[styles.text, {color: R.colors.white}]}> <Text style={[styles.text, styles.statusText]}>
{student.status} {student.status}
</Text> </Text>
</Text> </Text>
<View style={styles.card}> <View style={styles.card}>
<Text <Text
style={[ style={styles.historyCardText}>
{
fontSize: R.sizes.sm,
fontFamily: R.fonts.fontMedium,
fontWeight: '600',
color: R.colors.black,
},
]}>
Học kỳ 2, Năm học 2024 Học kỳ 2, Năm học 2024
</Text> </Text>
<Text <Text
style={[ style={styles.historyCardText}>
{
fontSize: R.sizes.sm,
fontFamily: R.fonts.fontMedium,
fontWeight: '600',
color: R.colors.black,
},
]}>
Ngày quyết định:{' '} Ngày quyết định:{' '}
<Text <Text
style={[ style={[
styles.text, styles.text,
{fontFamily: R.fonts.fontRegular, fontWeight: '400'}, styles.regularText,
]}> ]}>
{student.date_student} {student.date_student}
</Text> </Text>
</Text> </Text>
<Text <Text
style={[ style={styles.historyCardText}>
{
fontSize: R.sizes.sm,
fontFamily: R.fonts.fontMedium,
fontWeight: '600',
color: R.colors.black,
},
]}>
Lý do:{' '} Lý do:{' '}
<Text <Text
style={[ style={[
styles.text, styles.text,
{fontFamily: R.fonts.fontRegular, fontWeight: '400'}, styles.regularText,
]}> ]}>
{student.date_student} {student.date_student}
</Text> </Text>
</Text> </Text>
<Text <Text
style={[ style={styles.historyCardText}>
{
fontSize: R.sizes.sm,
fontFamily: R.fonts.fontMedium,
fontWeight: '600',
color: R.colors.black,
},
]}>
Ghi chú:{' '} Ghi chú:{' '}
<Text <Text
style={[ style={[
styles.text, styles.text,
{fontFamily: R.fonts.fontRegular, fontWeight: '400'}, styles.regularText,
]}> ]}>
{student.date_student} {student.date_student}
</Text> </Text>
</Text> </Text>
</View> </View>
</View> </View>
)
}
const renderBody = () => {
return (
<View style={styles.body}>
{renderCard()}
<Text style={[styles.textTitle, styles.textTitleWithMargin]}>
Lịch sử tình trạng của sinh viên
</Text>
{renderCardHistory()}
</View> </View>
)
};
return (
<View style={styles.container}>
<Header title={'Nguyễn Minh Đức - 2598671'} isBack />
{renderBody()}
</View> </View>
); );
}; };
......
src/screens/academic_advisor/list_student/style.js
...@@ -10,7 +10,7 @@ const styles = StyleSheet.create({ ...@@ -10,7 +10,7 @@ const styles = StyleSheet.create({
borderWidth: 1, borderWidth: 1,
borderRadius: 100, borderRadius: 100,
marginHorizontal: 15, marginHorizontal: 15,
marginVertical: 15, marginVertical: 10,
backgroundColor: R.colors.white, backgroundColor: R.colors.white,
flexDirection: 'row', flexDirection: 'row',
height: 35, height: 35,
...@@ -31,7 +31,7 @@ const styles = StyleSheet.create({ ...@@ -31,7 +31,7 @@ const styles = StyleSheet.create({
padding: 0, padding: 0,
}, },
statusContainer: { statusContainer: {
marginBottom: 15, marginBottom: 10,
marginHorizontal: 15, marginHorizontal: 15,
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-around', justifyContent: 'space-around',
...@@ -98,8 +98,7 @@ const styles = StyleSheet.create({ ...@@ -98,8 +98,7 @@ const styles = StyleSheet.create({
height: 15, height: 15,
marginHorizontal: 5, marginHorizontal: 5,
}, },
containerList: { containerList: {},
},
studentInfo: { studentInfo: {
flex: 1, flex: 1,
flexDirection: 'row', flexDirection: 'row',
......
src/screens/compensate/index.js
...@@ -4,41 +4,41 @@ import CompensateView from './view'; ...@@ -4,41 +4,41 @@ import CompensateView from './view';
const Compensate = props => { const Compensate = props => {
const [dataList, setDataList] = useState([ const [dataList, setDataList] = useState([
{id: 1, classCode: 'ATTT2024.1', rest: 5, compensate: 0, total: 25}, // {id: 1, classCode: 'ATTT2024.1', rest: 5, compensate: 0, total: 25},
{id: 2, classCode: 'ATTT2024.2', rest: 4, compensate: 1, total: 25}, // {id: 2, classCode: 'ATTT2024.2', rest: 4, compensate: 1, total: 25},
{id: 3, classCode: 'ATTT2024.3', rest: 6, compensate: 0, total: 25}, // {id: 3, classCode: 'ATTT2024.3', rest: 6, compensate: 0, total: 25},
{id: 4, classCode: 'ATTT2024.4', rest: 3, compensate: 2, total: 25}, // {id: 4, classCode: 'ATTT2024.4', rest: 3, compensate: 2, total: 25},
{id: 5, classCode: 'ATTT2024.5', rest: 5, compensate: 0, total: 25}, // {id: 5, classCode: 'ATTT2024.5', rest: 5, compensate: 0, total: 25},
{id: 6, classCode: 'CNTT2024.1', rest: 2, compensate: 1, total: 25}, // {id: 6, classCode: 'CNTT2024.1', rest: 2, compensate: 1, total: 25},
{id: 7, classCode: 'CNTT2024.2', rest: 4, compensate: 0, total: 25}, // {id: 7, classCode: 'CNTT2024.2', rest: 4, compensate: 0, total: 25},
{id: 8, classCode: 'CNTT2024.3', rest: 5, compensate: 0, total: 25}, // {id: 8, classCode: 'CNTT2024.3', rest: 5, compensate: 0, total: 25},
{id: 9, classCode: 'CNTT2024.4', rest: 3, compensate: 1, total: 25}, // {id: 9, classCode: 'CNTT2024.4', rest: 3, compensate: 1, total: 25},
{id: 10, classCode: 'CNTT2024.5', rest: 6, compensate: 0, total: 25}, // {id: 10, classCode: 'CNTT2024.5', rest: 6, compensate: 0, total: 25},
{id: 11, classCode: 'KTPM2024.1', rest: 4, compensate: 1, total: 25}, // {id: 11, classCode: 'KTPM2024.1', rest: 4, compensate: 1, total: 25},
{id: 12, classCode: 'KTPM2024.2', rest: 2, compensate: 2, total: 25}, // {id: 12, classCode: 'KTPM2024.2', rest: 2, compensate: 2, total: 25},
{id: 13, classCode: 'KTPM2024.3', rest: 5, compensate: 0, total: 25}, // {id: 13, classCode: 'KTPM2024.3', rest: 5, compensate: 0, total: 25},
{id: 14, classCode: 'KTPM2024.4', rest: 4, compensate: 0, total: 25}, // {id: 14, classCode: 'KTPM2024.4', rest: 4, compensate: 0, total: 25},
{id: 15, classCode: 'KTPM2024.5', rest: 3, compensate: 1, total: 25}, // {id: 15, classCode: 'KTPM2024.5', rest: 3, compensate: 1, total: 25},
{id: 16, classCode: 'HTTT2024.1', rest: 5, compensate: 0, total: 25}, // {id: 16, classCode: 'HTTT2024.1', rest: 5, compensate: 0, total: 25},
{id: 17, classCode: 'HTTT2024.2', rest: 6, compensate: 0, total: 25}, // {id: 17, classCode: 'HTTT2024.2', rest: 6, compensate: 0, total: 25},
{id: 18, classCode: 'HTTT2024.3', rest: 3, compensate: 2, total: 25}, // {id: 18, classCode: 'HTTT2024.3', rest: 3, compensate: 2, total: 25},
{id: 19, classCode: 'HTTT2024.4', rest: 4, compensate: 1, total: 25}, // {id: 19, classCode: 'HTTT2024.4', rest: 4, compensate: 1, total: 25},
{id: 20, classCode: 'HTTT2024.5', rest: 5, compensate: 0, total: 25}, // {id: 20, classCode: 'HTTT2024.5', rest: 5, compensate: 0, total: 25},
{id: 21, classCode: 'KHMT2024.1', rest: 4, compensate: 0, total: 25}, // {id: 21, classCode: 'KHMT2024.1', rest: 4, compensate: 0, total: 25},
{id: 22, classCode: 'KHMT2024.2', rest: 5, compensate: 1, total: 25}, // {id: 22, classCode: 'KHMT2024.2', rest: 5, compensate: 1, total: 25},
{id: 23, classCode: 'KHMT2024.3', rest: 6, compensate: 0, total: 25}, // {id: 23, classCode: 'KHMT2024.3', rest: 6, compensate: 0, total: 25},
{id: 24, classCode: 'KHMT2024.4', rest: 3, compensate: 1, total: 25}, // {id: 24, classCode: 'KHMT2024.4', rest: 3, compensate: 1, total: 25},
{id: 25, classCode: 'KHMT2024.5', rest: 5, compensate: 0, total: 25}, // {id: 25, classCode: 'KHMT2024.5', rest: 5, compensate: 0, total: 25},
{id: 26, classCode: 'MMT2024.1', rest: 4, compensate: 1, total: 25}, // {id: 26, classCode: 'MMT2024.1', rest: 4, compensate: 1, total: 25},
{id: 27, classCode: 'MMT2024.2', rest: 2, compensate: 0, total: 25}, // {id: 27, classCode: 'MMT2024.2', rest: 2, compensate: 0, total: 25},
{id: 28, classCode: 'MMT2024.3', rest: 5, compensate: 0, total: 25}, // {id: 28, classCode: 'MMT2024.3', rest: 5, compensate: 0, total: 25},
{id: 29, classCode: 'MMT2024.4', rest: 3, compensate: 2, total: 25}, // {id: 29, classCode: 'MMT2024.4', rest: 3, compensate: 2, total: 25},
{id: 30, classCode: 'MMT2024.5', rest: 6, compensate: 0, total: 25}, // {id: 30, classCode: 'MMT2024.5', rest: 6, compensate: 0, total: 25},
]); ]);
return <CompensateView dataList={dataList} />; return <CompensateView dataList={dataList} />;
}; };
......
src/screens/compensate/style.js
...@@ -13,8 +13,8 @@ const styles = StyleSheet.create({ ...@@ -13,8 +13,8 @@ const styles = StyleSheet.create({
card: { card: {
borderRadius: 10, borderRadius: 10,
padding: 5, padding: 5,
marginTop: 15, marginTop: 10,
marginBottom: 5, marginBottom: 10,
marginHorizontal: 15, marginHorizontal: 15,
alignItems: 'center', alignItems: 'center',
justifyContent: 'center', justifyContent: 'center',
...@@ -23,7 +23,7 @@ const styles = StyleSheet.create({ ...@@ -23,7 +23,7 @@ const styles = StyleSheet.create({
shadowColor: R.colors.black, shadowColor: R.colors.black,
shadowOffset: {width: 0.5, height: 2}, shadowOffset: {width: 0.5, height: 2},
shadowOpacity: Platform.OS === 'ios' ? 0.25 : 1, shadowOpacity: Platform.OS === 'ios' ? 0.25 : 1,
shadowRadius: 5, shadowRadius: 2,
elevation: Platform.OS === 'ios' ? 1 : 2, elevation: Platform.OS === 'ios' ? 1 : 2,
}, },
btnCard: { btnCard: {
...@@ -73,6 +73,20 @@ const styles = StyleSheet.create({ ...@@ -73,6 +73,20 @@ const styles = StyleSheet.create({
padding: 5, padding: 5,
height: 35, height: 35,
}, },
containerEmpty: {
alignItems: 'center',
},
textEmpty: {
color: R.colors.black,
fontSize: R.fontsize.fontSizeSubTitle,
fontWeight: '500',
fontFamily: R.fonts.fontMedium,
},
containerList:{
flex: 1,
justifyContent: 'center',
}
}); });
export default styles; export default styles;
src/screens/compensate/view.js
...@@ -72,10 +72,23 @@ const CompensateView = props => { ...@@ -72,10 +72,23 @@ const CompensateView = props => {
</TouchableOpacity> </TouchableOpacity>
); );
}; };
const renderListClass = () => {
return (
<FlatList
data={dataList || []}
renderItem={renderItem}
showsVerticalScrollIndicator={false}
vertical
keyExtractor={(item, index) => `${index}`}
/>
);
};
const renderHeaderBody = () => {
return ( return (
<View style={styles.container}>
<Header title={'Báo bù lịch dạy'} isBack />
<View style={styles.body}>
<View style={styles.card}> <View style={styles.card}>
<TouchableOpacity style={styles.btnCard}> <TouchableOpacity style={styles.btnCard}>
<Text <Text
...@@ -91,13 +104,11 @@ const CompensateView = props => { ...@@ -91,13 +104,11 @@ const CompensateView = props => {
</Text> </Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<FlatList );
data={dataList || []} };
renderItem={renderItem}
showsVerticalScrollIndicator={false} const renderButtonRegister = () => {
vertical return (
keyExtractor={(item, index) => `${index}`}
/>
<TouchableOpacity <TouchableOpacity
style={styles.btnRegister} style={styles.btnRegister}
onPress={() => navigation.navigate(SCREENNAME.REGISTERMAKEUP)}> onPress={() => navigation.navigate(SCREENNAME.REGISTERMAKEUP)}>
...@@ -105,7 +116,43 @@ const CompensateView = props => { ...@@ -105,7 +116,43 @@ const CompensateView = props => {
Đăng kí báo bù Đăng kí báo bù
</Text> </Text>
</TouchableOpacity> </TouchableOpacity>
);
};
const renderListEmpty = () =>{
return(
<View style={styles.containerEmpty}>
<View>
<Image
source={R.images.icNoData}
style={{width: 50, height: 50}}
resizeMode="contain"
/>
</View>
<Text style={[styles.text, {color: R.colors.red}]}>
Không có dữ liệu
</Text>
</View>
)
};
const renderBody = () => {
return (
<View style={styles.body }>
{renderHeaderBody()}
<View style={styles.containerList}>
{dataList.length > 0 ? renderListClass() : renderListEmpty()}
</View>
{renderButtonRegister()}
</View> </View>
);
};
return (
<View style={styles.container}>
<Header title={'Báo bù lịch dạy'} isBack />
{renderBody()}
</View> </View>
); );
}; };
......
src/screens/notification/style.js
...@@ -82,8 +82,8 @@ const styles = StyleSheet.create({ ...@@ -82,8 +82,8 @@ const styles = StyleSheet.create({
marginHorizontal: 15, marginHorizontal: 15,
shadowOffset: {width: 0.5, height: 2}, shadowOffset: {width: 0.5, height: 2},
shadowOpacity: Platform.OS === 'ios' ? 0.25 : 1, shadowOpacity: Platform.OS === 'ios' ? 0.25 : 1,
shadowRadius: 5, shadowRadius: 2,
elevation: Platform.OS === 'ios' ? 1 : 5, elevation: Platform.OS === 'ios' ? 1 : 2,
marginBottom: 15, marginBottom: 15,
}, },
cardItemTution: { cardItemTution: {
......
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