Commit dc4f6a60 by tungnq

TODO: Hoàn thiện chi tiết đánh giá giảng dạy test giao diện ios

parent 7a5629c1
......@@ -6,6 +6,7 @@ const colors = {
gray: 'rgba(217, 217, 217, 1)',
gray1: 'rgba(204, 204, 204, 1)',
gray2:'rgba(196, 196, 196, 1)',
grayBorderInputTextHeader:'rgba(204, 204, 204, 0.36)',
grayButton:'rgba(217, 217, 217, 0.56)',
......@@ -13,6 +14,7 @@ const colors = {
blue: 'rgba(47, 107, 255, 1)',
blue1: 'rgba(47, 107, 255, 0.1)',
blue2: 'rgba(158, 187, 255, 1)',
blue3:'rgba(191, 210, 255, 1)',
blueTextChip: 'rgba(47, 107, 255, 1)',
orange: 'rgba(243, 154, 43, 1)',
......
......@@ -21,7 +21,7 @@ function MyStack(props) {
headerStatusBarHeight: 0,
}}
headerMode={'none'}
initialRouteName={ScreenName.TABNAVIGATOR}>
initialRouteName={ScreenName.DETAILFEEDACK}>
<Stack.Screen name={ScreenName.HOMESCREEN} component={Home} />
<Stack.Screen name={ScreenName.TABNAVIGATOR} component={TabNavigator} />
<Stack.Screen name={ScreenName.DETAILNOTIFICATION} component={NotificationDetail} />
......
import React from 'react';
import React, {useState} from 'react';
import {Text, View, StyleSheet} from 'react-native';
import DetailFeedBackView from './view';
const DetailFeedBack = (props) => {
const DetailFeedBack = props => {
const [teacher, setTeacher] = useState({
class: 'ATTT2024.1',
subject: 'An ninh thông tin',
teacher: 'Nguyễn Minh Đức',
});
const [dataListQuestion, setDataListQuestion] = useState({
question: [
{
id: '1',
question: 'Giảng viên có đảm bảo đúng thời gian giảng dạy không? ',
},
{
id: '2',
question: 'Giảng viên có đảm bảo đúng thời gian giảng dạy không? ',
},
{
id: '3',
question: 'Đảm bảo khối lượng của chương trình giảng dạy?',
},
{
id: '4',
question: 'Sự hỗ trợ của giảng viên trong và ngoài giờ?',
}
],
results: [
{ "id": 1, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 4, "GPA": 4, "comment": "Tuyệt vời" },
{ "id": 2, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 4, "GPA": 4, "comment": "Học với thầy em cảm thấy tiếp thu được nhiều và bổ ích" },
{ "id": 3, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 4, "GPA": 4, "comment": "Giảng viên giảng dễ hiểu, tận tình" },
{ "id": 4, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 4, "GPA": 4, "comment": "Bài giảng rõ ràng, mạch lạc" },
{ "id": 5, "Q1": 3, "Q2": 4, "Q3": 4, "Q4": 3, "GPA": 3.5, "comment": "Một số chỗ hơi nhanh, cần giảng chậm lại" },
{ "id": 6, "Q1": 4, "Q2": 3, "Q3": 4, "Q4": 4, "GPA": 3.75, "comment": "Ổn nhưng cần thêm ví dụ thực tế" },
{ "id": 7, "Q1": 4, "Q2": 4, "Q3": 3, "Q4": 4, "GPA": 3.75, "comment": "Rất dễ hiểu, nên có thêm bài tập nhóm" },
{ "id": 8, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 3, "GPA": 3.75, "comment": "Phong cách giảng dạy gần gũi" },
{ "id": 9, "Q1": 4, "Q2": 3, "Q3": 3, "Q4": 4, "GPA": 3.5, "comment": "Hài hước, dễ tiếp thu" },
{ "id": 10, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 4, "GPA": 4, "comment": "Rất tận tình và hỗ trợ sinh viên" },
{ "id": 11, "Q1": 3, "Q2": 4, "Q3": 4, "Q4": 3, "GPA": 3.5, "comment": "Nên chậm lại phần kiến thức nâng cao" },
{ "id": 12, "Q1": 4, "Q2": 4, "Q3": 3, "Q4": 4, "GPA": 3.75, "comment": "Cách giải thích dễ hiểu" },
{ "id": 13, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 4, "GPA": 4, "comment": "Giảng viên nhiệt huyết" },
{ "id": 14, "Q1": 4, "Q2": 4, "Q3": 3, "Q4": 3, "GPA": 3.5, "comment": "Có thêm tài liệu tham khảo thì tốt" },
{ "id": 15, "Q1": 4, "Q2": 3, "Q3": 4, "Q4": 4, "GPA": 3.75, "comment": "Thầy luôn trả lời câu hỏi tận tình" },
{ "id": 16, "Q1": 4, "Q2": 4, "Q3": 3, "Q4": 4, "GPA": 3.75, "comment": "Nội dung sát thực tế" },
{ "id": 17, "Q1": 3, "Q2": 4, "Q3": 4, "Q4": 3, "GPA": 3.5, "comment": "Bài giảng cần nhiều ví dụ minh họa hơn" },
{ "id": 18, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 3, "GPA": 3.75, "comment": "Phong thái chuyên nghiệp" },
{ "id": 19, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 4, "GPA": 4, "comment": "Rất dễ hiểu, rõ ràng" },
{ "id": 20, "Q1": 4, "Q2": 4, "Q3": 3, "Q4": 3, "GPA": 3.5, "comment": "Một số phần khó nhưng thầy đã hỗ trợ nhiều" },
{ "id": 21, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 4, "GPA": 4, "comment": "Không khí lớp học vui vẻ" },
{ "id": 22, "Q1": 4, "Q2": 3, "Q3": 4, "Q4": 3, "GPA": 3.5, "comment": "Có thể tăng thêm thời gian luyện tập" },
{ "id": 23, "Q1": 4, "Q2": 4, "Q3": 3, "Q4": 4, "GPA": 3.75, "comment": "Cách truyền đạt dễ tiếp cận" },
{ "id": 24, "Q1": 3, "Q2": 3, "Q3": 4, "Q4": 4, "GPA": 3.5, "comment": "Thầy luôn động viên sinh viên" },
{ "id": 25, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 4, "GPA": 4, "comment": "Bài giảng rất chất lượng" },
{ "id": 26, "Q1": 3, "Q2": 4, "Q3": 3, "Q4": 4, "GPA": 3.5, "comment": "Thầy thân thiện và hỗ trợ nhiệt tình" },
{ "id": 27, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 3, "GPA": 3.75, "comment": "Phương pháp giảng hiện đại" },
{ "id": 28, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 4, "GPA": 4, "comment": "Thầy giải thích kỹ càng" },
{ "id": 29, "Q1": 3, "Q2": 3, "Q3": 4, "Q4": 3, "GPA": 3.25, "comment": "Một vài chỗ khó theo kịp" },
{ "id": 30, "Q1": 4, "Q2": 4, "Q3": 4, "Q4": 4, "GPA": 4, "comment": "Thầy truyền cảm hứng học tập" },
{ "id": 31, "Q1": 4, "Q2": 3, "Q3": 4, "Q4": 3, "GPA": 3.5, "comment": "Cần nhiều buổi ôn tập hơn" },
{ "id": 32, "Q1": 4, "Q2": 4, "Q3": 3, "Q4": 4, "GPA": 3.75, "comment": "Thầy luôn khuyến khích đặt câu hỏi" }
],
});
return (
<DetailFeedBackView />
<DetailFeedBackView teacher={teacher} dataListQuestion={dataListQuestion} />
);
};
......
import { StyleSheet, Text, View } from 'react-native'
import R from '../../../assets/R'
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: R.colors.white,
},
body:{
flex:1,
paddingHorizontal:15,
paddingVertical:10,
},
textSubTitle:{
fontSize:R.sizes.sm,
fontFamily:R.fonts.fontRegular,
fontWeight:'400',
color:R.colors.black,
},
boxFeedBack:{
backgroundColor:R.colors.grayButton,
paddingVertical:5,
borderLeftWidth:3,
paddingLeft:10,
paddingRight:10,
borderLeftColor:R.colors.gray2,
},
containerQuestion:{
marginVertical:10,
},
tableContainer: {
borderWidth: 1,
borderColor: R.colors.grayBorderInputTextHeader,
backgroundColor: R.colors.white,
},
tableRow: {
flexDirection: 'row',
borderBottomWidth: 1,
borderBottomColor: R.colors.grayBorderInputTextHeader,
},
tableHeaderCellSmall: {
flex: 0.5,
padding: 8,
backgroundColor: R.colors.blue3,
borderRightWidth: 1,
borderRightColor: R.colors.gray1,
justifyContent: 'center',
alignItems: 'center',
},
tableHeaderCell: {
flex: 1,
padding: 8,
borderRightWidth: 1,
backgroundColor: R.colors.blue3,
borderRightColor: R.colors.gray1,
justifyContent: 'center',
alignItems: 'center',
},
tableCellSmall: {
flex: 0.5,
padding: 8,
borderRightWidth: 1,
borderRightColor: R.colors.gray1,
justifyContent: 'center',
alignItems: 'center',
},
tableCell: {
flex: 1,
padding: 8,
borderRightWidth: 1,
borderRightColor: R.colors.gray1,
justifyContent: 'center',
alignItems: 'center',
},
tableHeaderText: {
fontSize: R.sizes.sm,
fontWeight: 'bold',
color: R.colors.black,
textAlign: 'center',
},
tableCellText: {
fontSize: R.sizes.xs,
color: R.colors.black,
textAlign: 'center',
flexWrap: 'wrap',
},
})
export default styles
import React from 'react';
import {Text, View, TouchableOpacity, StyleSheet} from 'react-native';
import {Text, View, TouchableOpacity, StyleSheet, FlatList, ScrollView} from 'react-native';
import styles from './style';
import Header from '../../../components/Header/Header';
import R from '../../../assets/R';
const DetailFeedBackView = (props) => {
const { } = props;
const {teacher,dataListQuestion} = props;
console.log(props);
const renderTableRow = (item, index) => {
return (
<View key={item.id} style={styles.tableRow}>
<View style={styles.tableCellSmall}>
<Text style={styles.tableCellText}>{item.id}</Text>
</View>
<View style={styles.tableCell}>
<Text style={styles.tableCellText}>{item.Q1}</Text>
</View>
<View style={styles.tableCell}>
<Text style={styles.tableCellText}>{item.Q2}</Text>
</View>
<View style={styles.tableCell}>
<Text style={styles.tableCellText}>{item.Q3}</Text>
</View>
<View style={styles.tableCell}>
<Text style={styles.tableCellText}>{item.Q4}</Text>
</View>
<View style={styles.tableCell}>
<Text style={styles.tableCellText}>{item.GPA}</Text>
</View>
<View style={styles.tableCell}>
<Text style={styles.tableCellText}>{item.comment}</Text>
</View>
</View>
);
};
const renderItem = ({item}) => {
return (
<View style={styles.boxFeedBack}>
<Text style={[styles.textSubTitle,{fontFamily:R.fonts.fontRegular,fontWeight:'400',color:R.colors.black,}]}>{item.question}</Text>
</View>
);
};
return (
<View
style={{
flex: 1,
justifyContent: 'center',
alignItems: 'center',
}}>
<TouchableOpacity>
<Text>DetailFeedBack</Text>
</TouchableOpacity>
<View style={styles.container}>
<Header title={'Đánh giá giảng dạy'} isBack/>
<View style={styles.body}>
<Text style={styles.textSubTitle}>Feedback ca sinh viên lp {teacher.class} môn {teacher.subject} đối vi ging viên {teacher.teacher}.</Text>
<View style={styles.containerQuestion}>
<FlatList
data={dataListQuestion?.question || []}
renderItem={renderItem}
keyExtractor={(item) => item.id.toString()}
showsVerticalScrollIndicator={false}
vertical
/>
</View>
<ScrollView
showsVerticalScrollIndicator={false}
style={styles.tableContainer}>
<View style={styles.tableRow}>
<View style={styles.tableHeaderCellSmall}>
<Text style={styles.tableHeaderText}>#</Text>
</View>
<View style={styles.tableHeaderCell}>
<Text style={styles.tableHeaderText}>Q1</Text>
</View>
<View style={styles.tableHeaderCell}>
<Text style={styles.tableHeaderText}>Q2</Text>
</View>
<View style={styles.tableHeaderCell}>
<Text style={styles.tableHeaderText}>Q3</Text>
</View>
<View style={styles.tableHeaderCell}>
<Text style={styles.tableHeaderText}>Q4</Text>
</View>
<View style={styles.tableHeaderCell}>
<Text style={styles.tableHeaderText}>GPA</Text>
</View>
<View style={styles.tableHeaderCell}>
<Text style={styles.tableHeaderText}>N.Xét</Text>
</View>
</View>
{dataListQuestion?.results?.map((item, index) => renderTableRow(item, index))}
</ScrollView>
</View>
</View>
);
};
export default DetailFeedBackView;
const styles = StyleSheet.create({})
\ No newline at end of file
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