Commit f1e4487a by tungnq

TODO: Cập nhật độ đậm phông chữ và kiểu dáng trực quan trên các màn hình chứng chỉ.

parent cc87980e
...@@ -103,7 +103,7 @@ const styles = StyleSheet.create({ ...@@ -103,7 +103,7 @@ const styles = StyleSheet.create({
title: { title: {
fontSize: R.fontsize.fontsSize12, fontSize: R.fontsize.fontsSize12,
fontFamily: R.fonts.InterMedium, fontFamily: R.fonts.InterMedium,
fontWeight: '600', fontWeight: '800',
color: R.colors.black, color: R.colors.black,
}, },
...@@ -121,7 +121,7 @@ const styles = StyleSheet.create({ ...@@ -121,7 +121,7 @@ const styles = StyleSheet.create({
borderRadius: 10, borderRadius: 10,
borderWidth: 1, borderWidth: 1,
borderColor: R.colors.grey_200, borderColor: R.colors.grey_200,
paddingHorizontal: 15, paddingHorizontal: 10,
height: 35, height: 35,
backgroundColor: R.colors.white, backgroundColor: R.colors.white,
}, },
......
import React from 'react'; import React from 'react';
import { import {Text, View, Image, ScrollView} from 'react-native';
Text,
View,
Image,
ScrollView,
} from 'react-native';
import R from '../../../assets/R'; import R from '../../../assets/R';
import Header from '../../../components/Header/Header'; import Header from '../../../components/Header/Header';
import styles from '../style'; import styles from '../style';
...@@ -18,44 +13,79 @@ const DetailCertificateView = props => { ...@@ -18,44 +13,79 @@ const DetailCertificateView = props => {
style={styles.container_detail}> style={styles.container_detail}>
<View style={styles.container_card_detail}> <View style={styles.container_card_detail}>
<View style={styles.status}> <View style={styles.status}>
<Text style={[styles.text_title, {color: R.colors.white}]}> <Text
style={[
styles.text_title,
{
color: R.colors.white,
fontWeight: '800',
fontSize: R.fontsize.fontsSize12,
},
]}>
Chng ch đang được đánh giá Chng ch đang được đánh giá
</Text> </Text>
</View> </View>
<View style={styles.card_item}> <View style={styles.card_item}>
<View style={styles.header_card_item}> <View style={styles.header_card_item}>
<Text style={styles.text_title}>Chng ch toeic</Text> <Text style={[styles.text_title, styles.text_bold]}>
Chng ch toeic
</Text>
</View> </View>
<View style={styles.image_container}> <View style={styles.image_container}>
<Image source={R.images.igProfileDemo} style={styles.imageDetail} /> <Image
source={R.images.igProfileDemo}
style={styles.imageDetail}
/>
</View> </View>
<View> <View>
<Text style={styles.sub_text}>Loi chng ch: TOEIC</Text> <Text style={[styles.sub_text_detail, styles.text_bold]}>
<Text style={styles.sub_text}>Ngày sinh: 23/10/2004</Text> Loi chng ch:{' '}
<Text style={styles.sub_text}> <Text style={[styles.sub_text_detail]}>TOEIC</Text>
CCCD/CMND đăng ký: 00228956325 </Text>
<Text style={[styles.sub_text_detail, styles.text_bold]}>
Ngày sinh:{' '}
<Text style={[styles.sub_text_detail]}>23/10/2004</Text>
</Text>
<Text style={[styles.sub_text_detail, styles.text_bold]}>
CCCD/CMND đăng ký:{' '}
<Text style={[styles.sub_text_detail]}>00228956325</Text>
</Text>
<Text style={[styles.sub_text_detail, styles.text_bold]}>
Ngày thi:{' '}
<Text style={[styles.sub_text_detail]}>23/10/2024</Text>
</Text>
<Text style={[styles.sub_text_detail, styles.text_bold]}>
Tng đim:{' '}
<Text style={[styles.sub_text_detail]}>875</Text>
</Text> </Text>
<Text style={styles.sub_text}>Ngày thi: 23/10/2024</Text>
<Text style={styles.sub_text}>Tng đim: 875</Text>
<View <View
style={{ style={{
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between', justifyContent: 'space-between',
}}> }}>
<Text style={styles.sub_text}>Đim nói: 0</Text> <Text style={[styles.sub_text_detail, styles.text_bold]}>Đim nói:{' '}
<Text style={styles.sub_text}>Đim nghe: 445</Text> <Text style={[styles.sub_text_detail]}>0</Text></Text>
<Text style={[styles.sub_text_detail, styles.text_bold]}>Đim nghe:{' '}
<Text style={[styles.sub_text_detail]}>445</Text></Text>
</View> </View>
<View <View
style={{ style={{
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between', justifyContent: 'space-between',
}}> }}>
<Text style={styles.sub_text}>Đim đọc: 430</Text> <Text style={[styles.sub_text_detail, styles.text_bold]}>Đim đọc:{' '}
<Text style={styles.sub_text}>Đim viết: 0</Text> <Text style={[styles.sub_text_detail]}>430</Text></Text>
<Text style={[styles.sub_text_detail, styles.text_bold]}>Đim viết:{' '}
<Text style={[styles.sub_text_detail]}>0</Text></Text>
</View> </View>
<Text style={styles.sub_text}>S TRF: 085692265852</Text> <Text style={[styles.sub_text_detail, styles.text_bold]}>S TRF:{' '}
<Text style={styles.sub_text}>Có hiu lc đến: 23/10/2026</Text> <Text style={[styles.sub_text_detail]}>085692265852</Text></Text>
<Text style={[styles.sub_text, {color: R.colors.main}]}> <Text style={[styles.sub_text_detail, styles.text_bold]}>
Có hiu lc đến:{' '}
<Text style={[styles.sub_text_detail]}>23/10/2026</Text>
</Text>
<Text style={[styles.sub_text_detail, {color: R.colors.main , fontWeight: '800'}]}>
Không dùng để đăng ký hc bng Không dùng để đăng ký hc bng
</Text> </Text>
</View> </View>
......
import React from 'react'; import React from 'react';
import {Text, View, StyleSheet} from 'react-native';
import ListCertificateView from './view'; import ListCertificateView from './view';
const ListCertificate = (props) => { const ListCertificate = (props) => {
return ( return (
<ListCertificateView /> <ListCertificateView
/>
); );
}; };
......
...@@ -3,17 +3,19 @@ import React from 'react'; ...@@ -3,17 +3,19 @@ import React from 'react';
import R from '../../../assets/R'; import R from '../../../assets/R';
import Button from '../../../components/Button'; import Button from '../../../components/Button';
import {useNavigation} from '@react-navigation/native'; import {useNavigation} from '@react-navigation/native';
import {DETAILCERTIFICATE} from '../../../routers/ScreenNames'; import * as ScreenName from '../../../routers/ScreenNames';
import styles from '../style'; import styles from '../style';
const ItemNav = () => { const ItemNav = () => {
const navigation = useNavigation(); const navigate = useNavigation();
return ( return (
<View style={styles.container_card}> <View style={styles.container_card}>
<View style={styles.header_card_item}> <View style={styles.header_card_item}>
<Text style={styles.text_title_left}>Chng ch toeic</Text> <Text style={styles.text_title_left}>Chng ch toeic</Text>
<Text <Text
onPress={() => navigation.navigate(DETAILCERTIFICATE)} onPress={() => {
navigate.navigate(ScreenName.DETAILCERTIFICATE);
}}
style={styles.text_title_right}> style={styles.text_title_right}>
Chi tiết Chi tiết
</Text> </Text>
...@@ -23,9 +25,11 @@ const ItemNav = () => { ...@@ -23,9 +25,11 @@ const ItemNav = () => {
</View> </View>
<View style={styles.footer_card_item}> <View style={styles.footer_card_item}>
<View> <View>
<Text style={styles.sub_text}>Trng thái: Đang đánh giá</Text> <Text style={[styles.sub_text,styles.text_bold]}>Trng thái:{' '}
<Text style={styles.sub_text}>Ngày đăng ký: 23/10/2024</Text> <Text style={{fontWeight: '400'}}>Đang đánh giá</Text></Text>
<Text style={[styles.sub_text, {color: R.colors.blue500}]}> <Text style={[styles.sub_text,styles.text_bold]}>Ngày đăng ký:{' '}
<Text style={{fontWeight: '400'}}>23/10/2024</Text></Text>
<Text style={[styles.sub_text,styles.text_bold, {color: R.colors.blue500}]}>
Không dùng để đăng ký hc bng Không dùng để đăng ký hc bng
</Text> </Text>
</View> </View>
......
...@@ -15,10 +15,10 @@ const ListCetificateView = props => { ...@@ -15,10 +15,10 @@ const ListCetificateView = props => {
return ( return (
<ScrollView style={styles.box}> <ScrollView style={styles.box}>
<View style={styles.container_header}> <View style={styles.container_header}>
<Text style={styles.text}>Các chng ch đã đăng kí</Text> <Text style={[styles.text, {fontWeight:'800',fontSize:R.fontsize.fontsSize14} ]}>Các chng ch đã đăng kí</Text>
<Button <Button
onPress={() => navigate.navigate(CERTIFICATEREGISTRATION)} onPress={() => navigate.navigate(CERTIFICATEREGISTRATION)}
height={27} height={30}
borderRadius={10} borderRadius={10}
textColor={R.colors.white} textColor={R.colors.white}
fontFamily={R.fonts.InterRegular} fontFamily={R.fonts.InterRegular}
......
...@@ -10,6 +10,13 @@ const styles = StyleSheet.create({ ...@@ -10,6 +10,13 @@ const styles = StyleSheet.create({
container_row: { container_row: {
flexDirection: 'row', flexDirection: 'row',
}, },
text_title_register:{
marginHorizontal: 15,
fontFamily: R.fonts.InterMedium,
fontSize: R.fontsize.fontsSize12,
fontWeight: '800',
color: R.colors.black,
},
container_row_body: { container_row_body: {
marginHorizontal: 15, marginHorizontal: 15,
}, },
...@@ -98,7 +105,7 @@ const styles = StyleSheet.create({ ...@@ -98,7 +105,7 @@ const styles = StyleSheet.create({
marginHorizontal: 15, marginHorizontal: 15,
}, },
text: { text: {
fontFamily: R.fonts.InterSemiBold, fontFamily: R.fonts.InterMedium,
color: R.colors.main, color: R.colors.main,
}, },
container_item: { container_item: {
...@@ -116,9 +123,9 @@ const styles = StyleSheet.create({ ...@@ -116,9 +123,9 @@ const styles = StyleSheet.create({
width: 0, width: 0,
height: 2, height: 2,
}, },
shadowOpacity: 0.5, shadowOpacity: Platform.OS === 'ios' ? 0.25 : 1,
shadowRadius: 1, shadowRadius: 5,
elevation: 1, elevation: Platform.OS === 'ios' ? 1 : 2,
paddingHorizontal: 15, paddingHorizontal: 15,
paddingVertical: 10, paddingVertical: 10,
}, },
...@@ -144,22 +151,22 @@ const styles = StyleSheet.create({ ...@@ -144,22 +151,22 @@ const styles = StyleSheet.create({
alignSelf: 'center', alignSelf: 'center',
}, },
text_title_left: { text_title_left: {
fontFamily: R.fonts.InterRegular, fontFamily: R.fonts.InterMedium,
fontSize: R.fontsize.fontsSize14, fontSize: R.fontsize.fontsSize12,
fontWeight: '400', fontWeight: '800',
color: R.colors.black, color: R.colors.black,
}, },
text_title_right: { text_title_right: {
fontFamily: R.fonts.InterRegular, fontFamily: R.fonts.InterMedium,
fontSize: R.fontsize.fontsSize14, fontSize: R.fontsize.fontsSize12,
fontWeight: '400', fontWeight: '800',
textDecorationLine: 'underline', textDecorationLine: 'underline',
color: R.colors.main, color: R.colors.main,
}, },
sub_text: { sub_text: {
fontFamily: R.fonts.InterRegular, fontFamily: R.fonts.InterRegular,
fontSize: R.fontsize.fontsSize12, fontSize: R.fontsize.fontsSize12,
fontWeight: '300', fontWeight: '400',
color: R.colors.black, color: R.colors.black,
}, },
/* -------------------------------------------------------------------------- */ /* -------------------------------------------------------------------------- */
...@@ -217,13 +224,17 @@ const styles = StyleSheet.create({ ...@@ -217,13 +224,17 @@ const styles = StyleSheet.create({
fontWeight: '400', fontWeight: '400',
color: R.colors.black, color: R.colors.black,
}, },
sub_text: { sub_text_detail: {
fontFamily: R.fonts.InterRegular, fontFamily: R.fonts.InterRegular,
fontSize: R.fontsize.fontsSize12, fontSize: R.fontsize.fontsSize12,
fontWeight: '300', fontWeight: '400',
lineHeight: 24, lineHeight: 24,
color: R.colors.black, color: R.colors.black,
}, },
text_bold: {
fontWeight: '800',
fontFamily: R.fonts.InterMedium,
},
}); });
export default styles; export default styles;
...@@ -22,7 +22,7 @@ const CertificateRegistrationView = props => { ...@@ -22,7 +22,7 @@ const CertificateRegistrationView = props => {
title={'Loại chứng chỉ *'} title={'Loại chứng chỉ *'}
titleFontFamily={R.fonts.InterRegular} titleFontFamily={R.fonts.InterRegular}
titleFontSize={R.fontsize.fontsSize12} titleFontSize={R.fontsize.fontsSize12}
titleFontWeight={'400'} titleFontWeight={'800'}
titleColor={R.colors.black} titleColor={R.colors.black}
data={dataList} data={dataList}
placeholder="HS" placeholder="HS"
...@@ -33,7 +33,7 @@ const CertificateRegistrationView = props => { ...@@ -33,7 +33,7 @@ const CertificateRegistrationView = props => {
borderRadius={10} borderRadius={10}
height={35} height={35}
marginHorizontal={15} marginHorizontal={15}
marginVertical={5} marginVertical={10}
iconColor={R.colors.black} iconColor={R.colors.black}
iconSize={10} iconSize={10}
/> />
...@@ -43,6 +43,7 @@ const CertificateRegistrationView = props => { ...@@ -43,6 +43,7 @@ const CertificateRegistrationView = props => {
backgroundColor={R.colors.gray400} backgroundColor={R.colors.gray400}
editable={false} editable={false}
height={35} height={35}
containerMarginBottom={10}
/> />
</View> </View>
<View style={styles.size_box_2}> <View style={styles.size_box_2}>
...@@ -51,6 +52,7 @@ const CertificateRegistrationView = props => { ...@@ -51,6 +52,7 @@ const CertificateRegistrationView = props => {
backgroundColor={R.colors.gray400} backgroundColor={R.colors.gray400}
editable={false} editable={false}
height={35} height={35}
containerMarginBottom={10}
/> />
</View> </View>
...@@ -60,6 +62,7 @@ const CertificateRegistrationView = props => { ...@@ -60,6 +62,7 @@ const CertificateRegistrationView = props => {
title={'Điểm nghe '} title={'Điểm nghe '}
height={35} height={35}
onChangeText={text => console.log(text)} onChangeText={text => console.log(text)}
containerMarginBottom={10}
/> />
</View> </View>
<View style={styles.size_box_4}></View> <View style={styles.size_box_4}></View>
...@@ -68,23 +71,24 @@ const CertificateRegistrationView = props => { ...@@ -68,23 +71,24 @@ const CertificateRegistrationView = props => {
title={'Điểm nói '} title={'Điểm nói '}
height={35} height={35}
onChangeText={text => console.log(text)} onChangeText={text => console.log(text)}
containerMarginBottom={10}
/> />
</View> </View>
</View> </View>
<View style={styles.container_row}> <View style={styles.container_row}>
<View style={styles.size_box_3}> <View style={styles.size_box_3}>
<CustomTextInput title={'Điểm đọc'} height={35} /> <CustomTextInput title={'Điểm đọc'} height={35} containerMarginBottom={10}/>
</View> </View>
<View style={styles.size_box_4}></View> <View style={styles.size_box_4}></View>
<View style={[styles.size_box_3, {marginRight: 15}]}> <View style={[styles.size_box_3, {marginRight: 15}]}>
<CustomTextInput title={'Điểm viết'} height={35} /> <CustomTextInput title={'Điểm viết'} height={35} containerMarginBottom={10}/>
</View> </View>
</View> </View>
<View style={styles.container_row}> <View style={styles.container_row}>
<View style={{flex: 0.85, marginBottom: 10, marginLeft: 15}}> <View style={{flex: 0.85, marginLeft: 15}}>
<CustomTextInput title={'Tổng điểm '} height={35} /> <CustomTextInput title={'Tổng điểm '} height={35} containerMarginBottom={10}/>
</View> </View>
<CheckBox <CheckBox
label={'Đăng kí học bổng'} label={'Đăng kí học bổng'}
...@@ -95,7 +99,7 @@ const CertificateRegistrationView = props => { ...@@ -95,7 +99,7 @@ const CertificateRegistrationView = props => {
size={15} size={15}
labelStyle={{ labelStyle={{
fontSize: R.fontsize.fontsSize12, fontSize: R.fontsize.fontsSize12,
fontWeight: '300', fontWeight: '800',
color: R.colors.black, color: R.colors.black,
fontFamily: R.fonts.InterRegular, fontFamily: R.fonts.InterRegular,
}} }}
...@@ -104,18 +108,18 @@ const CertificateRegistrationView = props => { ...@@ -104,18 +108,18 @@ const CertificateRegistrationView = props => {
</View> </View>
<View style={styles.container_row_body}> <View style={styles.container_row_body}>
<CustomTextInput title={'Ngày thi '} height={35} /> <CustomTextInput title={'Ngày thi '} height={35} containerMarginBottom={10}/>
</View> </View>
<View style={styles.container_row_body}> <View style={styles.container_row_body}>
<CustomTextInput title={'Có hiệu lực đến'} height={35} /> <CustomTextInput title={'Có hiệu lực đến'} height={35} containerMarginBottom={10}/>
</View> </View>
<View style={styles.container_row_body}> <View style={styles.container_row_body}>
<CustomTextInput title={'Số TRF'} height={35} /> <CustomTextInput title={'Số TRF'} height={35} containerMarginBottom={10}/>
</View> </View>
<Text style={{marginHorizontal: 15, color: R.colors.black}}> <Text style={styles.text_title_register}>
nh chng ch <Text style={{color: 'red', fontSize: R.fontsize.fontsSize12}}>*</Text> nh chng ch <Text style={{color: 'red',}}>*</Text>
</Text> </Text>
<CardButtonImage /> <CardButtonImage />
......
...@@ -17,8 +17,8 @@ const HOUR_HEIGHT = 80; ...@@ -17,8 +17,8 @@ const HOUR_HEIGHT = 80;
const DAY_COLUMN_WIDTH = (screenWidth - 70) / 3; const DAY_COLUMN_WIDTH = (screenWidth - 70) / 3;
const Filter3DateView = ({navigation}) => { const Filter3DateView = ({navigation}) => {
const [currentDate, setCurrentDate] = useState(new Date(2025, 6, 24)); const [currentDate, setCurrentDate] = useState(new Date());
const [selectedDate, setSelectedDate] = useState(new Date(2025, 6, 24)); const [selectedDate, setSelectedDate] = useState(new Date());
const [showMonthPicker, setShowMonthPicker] = useState(false); const [showMonthPicker, setShowMonthPicker] = useState(false);
const scrollViewRef = useRef(null); const scrollViewRef = useRef(null);
......
...@@ -3,8 +3,8 @@ import {DeviceEventEmitter, PanResponder} from 'react-native'; ...@@ -3,8 +3,8 @@ import {DeviceEventEmitter, PanResponder} from 'react-native';
import FilterDateView from './view'; import FilterDateView from './view';
const FilterDate = ({navigation}) => { const FilterDate = ({navigation}) => {
const [currentDate, setCurrentDate] = useState(new Date(2025, 6, 24)); const [currentDate, setCurrentDate] = useState(new Date());
const [selectedDate, setSelectedDate] = useState(new Date(2025, 6, 24)); const [selectedDate, setSelectedDate] = useState(new Date());
const [showMonthPicker, setShowMonthPicker] = useState(false); const [showMonthPicker, setShowMonthPicker] = useState(false);
const scrollViewRef = useRef(null); const scrollViewRef = useRef(null);
......
...@@ -10,7 +10,6 @@ import { ...@@ -10,7 +10,6 @@ import {
} from 'react-native'; } from 'react-native';
import R from '../../../assets/R'; import R from '../../../assets/R';
const {width: screenWidth, height: screenHeight} = Dimensions.get('window');
const HOUR_HEIGHT = 80; const HOUR_HEIGHT = 80;
const FilterDateView= ({ const FilterDateView= ({
...@@ -186,7 +185,11 @@ const styles = StyleSheet.create({ ...@@ -186,7 +185,11 @@ const styles = StyleSheet.create({
dayNumber: { dayNumber: {
fontSize: R.fontsize.fontsSize14, fontSize: R.fontsize.fontsSize14,
fontFamily: R.fonts.InterSemiBold, fontFamily: R.fonts.InterSemiBold,
color: R.colors.blue500, color: R.colors.white,
backgroundColor:R.colors.main,
borderRadius:15,
width:23,
textAlign:'center',
}, },
timeSlotsContainer: { timeSlotsContainer: {
flex: 1, flex: 1,
......
...@@ -17,8 +17,8 @@ const HOUR_HEIGHT = 80; ...@@ -17,8 +17,8 @@ const HOUR_HEIGHT = 80;
const DAY_COLUMN_WIDTH = (screenWidth - 70) / 7; const DAY_COLUMN_WIDTH = (screenWidth - 70) / 7;
const FilterWeekView = ({ navigation }) => { const FilterWeekView = ({ navigation }) => {
const [currentDate, setCurrentDate] = useState(new Date(2025, 6, 24)); const [currentDate, setCurrentDate] = useState(new Date());
const [selectedDate, setSelectedDate] = useState(new Date(2025, 6, 24)); const [selectedDate, setSelectedDate] = useState(new Date());
const [showMonthPicker, setShowMonthPicker] = useState(false); const [showMonthPicker, setShowMonthPicker] = useState(false);
const scrollViewRef = useRef(null); const scrollViewRef = useRef(null);
......
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