Commit fa147e2a by tungnq

TODO: Tối ưu hóa màu sắc cho các trạng thái trong các component: cập nhật mã màu…

TODO: Tối ưu hóa màu sắc cho các trạng thái trong các component: cập nhật mã màu cho 'Đã phê duyệt', 'Hạn chế' và 'Chờ xác nhận'
parent 445b4c46
...@@ -8,7 +8,7 @@ const DetailSendDocument = props => { ...@@ -8,7 +8,7 @@ const DetailSendDocument = props => {
title: 'Văn bản thông báo lịch nộp thời khoá biểu của học kỳ 2 năm 2025', title: 'Văn bản thông báo lịch nộp thời khoá biểu của học kỳ 2 năm 2025',
status: 'Hạn chế', status: 'Hạn chế',
symbol_number: '2038475', symbol_number: '2038475',
regime: 'Đã phê duyệt ', regime: 'Đã phê duyệt',
number_entry_book: '12493-fh544', number_entry_book: '12493-fh544',
term: '29/07/2025', term: '29/07/2025',
term_display: '09/07/2025', term_display: '09/07/2025',
......
...@@ -33,25 +33,28 @@ const DetailSendDocumentView = props => { ...@@ -33,25 +33,28 @@ const DetailSendDocumentView = props => {
const getColor = status => { const getColor = status => {
switch (status) { switch (status) {
case 'Hạn chế': case 'Hạn chế':
return R.colors.brown; return R.colors.orange;
case 'Công khai': case 'Công khai':
return R.colors.blue; return R.colors.blue;
} }
}; };
const getColorRegime = regime => { const getColorRegime = regime => {
console.log("Checking regime:", regime);
switch (regime) { switch (regime) {
case 'Đã phê duyệt': case 'Đã phê duyệt':
return R.colors.green; return R.colors.green1;
case 'Chờ xét duyệt': case 'Chờ xét duyệt':
return R.colors.blue; return R.colors.blue;
case 'Cần chỉnh sửa': case 'Cần chỉnh sửa':
return R.colors.orange; return R.colors.orange;
case 'Dự thảo': case 'Dự thảo':
return R.colors.orange; return R.colors.orange;
default:
console.log("No match, returning R.colors.black (default)"); // Log khi không khớp
return R.colors.black; // Màu mặc định nếu không khớp
} }
}; };
const renderItem = ({item}) => { const renderItem = ({item}) => {
console.log(item);
return ( return (
<View style={{marginVertical: 7.5}}> <View style={{marginVertical: 7.5}}>
<View style={{flexDirection: 'row', marginBottom: 5}}> <View style={{flexDirection: 'row', marginBottom: 5}}>
...@@ -67,6 +70,8 @@ const DetailSendDocumentView = props => { ...@@ -67,6 +70,8 @@ const DetailSendDocumentView = props => {
); );
}; };
const body = () => { const body = () => {
console.log('regime',icomingDocument.regime);
return ( return (
<ScrollView showsVerticalScrollIndicator={false}> <ScrollView showsVerticalScrollIndicator={false}>
<View style={styles.body}> <View style={styles.body}>
...@@ -94,7 +99,7 @@ const DetailSendDocumentView = props => { ...@@ -94,7 +99,7 @@ const DetailSendDocumentView = props => {
<Text style={styles.text}> <Text style={styles.text}>
Trng thái:{' '} Trng thái:{' '}
<Text style={[styles.text_2, {color: R.colors.green}]}> <Text style={[styles.text_2, {color: getColorRegime(icomingDocument.regime)}]}>
{icomingDocument.regime} {icomingDocument.regime}
</Text> </Text>
</Text> </Text>
......
import React, {useState} from 'react'; import React, {useState} from 'react';
import {Text, View, StyleSheet} from 'react-native'; import {Text, View, StyleSheet} from 'react-native';
import ListSendDocumentView from './view'; import ListSendDocumentView from './view';
import R from '../../assets/R';
const ListSendDocument = props => { const ListSendDocument = props => {
const [activeTab, setActiveTab] = useState('all'); const [activeTab, setActiveTab] = useState('all');
...@@ -93,6 +94,27 @@ const ListSendDocument = props => { ...@@ -93,6 +94,27 @@ const ListSendDocument = props => {
return matchTab && matchSearch; return matchTab && matchSearch;
}); });
const getColorStatus = status => {
switch (status) {
case 'Chờ xét duyệt':
return R.colors.blue;
case 'Cần chỉnh sửa':
return R.colors.orange;
case 'Đã phê duyệt':
return R.colors.green1;
case 'Dự thảo':
return R.colors.orange;
}
};
const getColorRegime = regime => {
switch (regime) {
case 'Hạn chế':
return R.colors.orange;
case 'Công khai':
return R.colors.blue;
}
};
return ( return (
<ListSendDocumentView <ListSendDocumentView
activeTab={activeTab} activeTab={activeTab}
...@@ -101,6 +123,9 @@ const ListSendDocument = props => { ...@@ -101,6 +123,9 @@ const ListSendDocument = props => {
searchQuery={searchQuery} searchQuery={searchQuery}
setSearchQuery={setSearchQuery} setSearchQuery={setSearchQuery}
handleTabKey={handleTabKey} handleTabKey={handleTabKey}
getColorStatus={getColorStatus}
getColorRegime={getColorRegime}
/> />
); );
}; };
......
...@@ -25,29 +25,11 @@ const ListSendView = props => { ...@@ -25,29 +25,11 @@ const ListSendView = props => {
searchQuery, searchQuery,
setSearchQuery, setSearchQuery,
handleTabKey, handleTabKey,
getColorStatus,
getColorRegime
} = props; } = props;
const navigation = useNavigation(); const navigation = useNavigation();
LogBox.ignoreLogs(['VirtualizedLists should never be nested']); LogBox.ignoreLogs(['VirtualizedLists should never be nested']);
const getColorStatus = status => {
switch (status) {
case 'Chờ xét duyệt':
return R.colors.blue;
case 'Cần chỉnh sửa':
return R.colors.orange;
case 'Đã phê duyệt':
return R.colors.green;
case 'Dự thảo':
return R.colors.orange;
}
};
const getColorRegime = regime => {
switch (regime) {
case 'Hạn chế':
return R.colors.brown;
case 'Công khai':
return R.colors.blue;
}
};
const hasRelatedWork = n => Number(n) > 0; const hasRelatedWork = n => Number(n) > 0;
const getHiddenButton = n => (hasRelatedWork(n) ? true : false); const getHiddenButton = n => (hasRelatedWork(n) ? true : false);
......
...@@ -466,7 +466,7 @@ const ListWork = props => { ...@@ -466,7 +466,7 @@ const ListWork = props => {
}, },
{ {
title: 'Phê duyệt', title: 'Phê duyệt',
backgroundColor: R.colors.green, backgroundColor: R.colors.orange,
action: 'approve', action: 'approve',
}, },
{title: 'Chi tiết', backgroundColor: R.colors.blue, action: 'detail'}, {title: 'Chi tiết', backgroundColor: R.colors.blue, action: 'detail'},
......
...@@ -7,7 +7,6 @@ import { ...@@ -7,7 +7,6 @@ import {
FlatList, FlatList,
ScrollView, ScrollView,
LogBox, LogBox,
ActivityIndicator,
} from 'react-native'; } from 'react-native';
import styles from './style'; import styles from './style';
import FAB from '../../../components/FAB/fab'; import FAB from '../../../components/FAB/fab';
......
...@@ -15,7 +15,7 @@ const styles = StyleSheet.create({ ...@@ -15,7 +15,7 @@ const styles = StyleSheet.create({
borderWidth: 1, borderWidth: 1,
borderRadius: 10, borderRadius: 10,
marginVertical: 10, marginVertical: 10,
backgroundColor: R.colors.brown, backgroundColor: R.colors.orange,
}, },
txtInput: { txtInput: {
color: R.colors.white, color: R.colors.white,
......
import React, {useState, useMemo} from 'react'; import React, {useState, useMemo} from 'react';
import {Text, View, StyleSheet} from 'react-native'; import {Text, View, StyleSheet} from 'react-native';
import NotificationView from './view'; import NotificationView from './view';
import R from '../../assets/R';
const Notification = props => { const Notification = props => {
//Xử lý tabView //Xử lý tabView
...@@ -179,6 +180,17 @@ const Notification = props => { ...@@ -179,6 +180,17 @@ const Notification = props => {
setSearchText(text); setSearchText(text);
}; };
const getStatusColor = status => {
switch (status) {
case 'Đã gửi':
return R.colors.green1 ;
case 'Chưa gửi':
return R.colors.orange;
default:
return R.colors.gray ;
}
};
const fitlerSearch = useMemo(() => { const fitlerSearch = useMemo(() => {
const list = dataNotifi[activeTab] || []; const list = dataNotifi[activeTab] || [];
if (!searchText.trim()) return list; if (!searchText.trim()) return list;
...@@ -198,6 +210,7 @@ const Notification = props => { ...@@ -198,6 +210,7 @@ const Notification = props => {
return ( return (
<NotificationView <NotificationView
getStatusColor={getStatusColor}
dataTitleListTabView={dataListTabView} dataTitleListTabView={dataListTabView}
activeTab={activeTab} activeTab={activeTab}
onTabChange={handleTabChange} onTabChange={handleTabChange}
......
...@@ -22,6 +22,7 @@ const NotificationView = props => { ...@@ -22,6 +22,7 @@ const NotificationView = props => {
getEmptyMessage, getEmptyMessage,
searchText, searchText,
onSearchChange, onSearchChange,
getStatusColor
} = props; } = props;
const navigate = useNavigation(); const navigate = useNavigation();
const getRenderItemFunction = () => { const getRenderItemFunction = () => {
...@@ -32,16 +33,7 @@ const NotificationView = props => { ...@@ -32,16 +33,7 @@ const NotificationView = props => {
return renderNotificationItemView; return renderNotificationItemView;
} }
}; };
const getStatusColor = status => {
switch (status) {
case 'Đã gửi':
return R.colors.green || '#4CAF50';
case 'Chưa gửi':
return R.colors.brown || '#8D6E63';
default:
return R.colors.gray || '#9E9E9E';
}
};
const renderTabViewItem = ({item}) => { const renderTabViewItem = ({item}) => {
const isActivity = activeTab === item.key; const isActivity = activeTab === item.key;
return ( return (
......
...@@ -108,6 +108,12 @@ const styles = StyleSheet.create({ ...@@ -108,6 +108,12 @@ const styles = StyleSheet.create({
fontWeight: '400', fontWeight: '400',
color: R.colors.black, color: R.colors.black,
}, },
txtView:{
fontSize: R.fontsize.fontSizeContent,
fontFamily: R.fonts.fontMedium,
fontWeight: '600',
color: R.colors.black,
}
}); });
export default styles; export default styles;
...@@ -174,7 +174,7 @@ const SubTeacherView = props => { ...@@ -174,7 +174,7 @@ const SubTeacherView = props => {
case 'Chờ xác nhận': case 'Chờ xác nhận':
return R.colors.blue; return R.colors.blue;
case 'Đã xác nhận': case 'Đã xác nhận':
return R.colors.green; return R.colors.green1;
case 'Từ chối': case 'Từ chối':
return R.colors.orange; return R.colors.orange;
} }
......
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