Commit cbd22b47 by tungnq

TODO: Tái cấu trúc component ListWork và ListWorkView để bổ sung modal báo cáo…

TODO: Tái cấu trúc component ListWork và ListWorkView để bổ sung modal báo cáo và cải thiện xử lý sự kiện liên quan
parent 52722428
...@@ -4,8 +4,7 @@ import DetailListWorkMonitoringView from './view'; ...@@ -4,8 +4,7 @@ import DetailListWorkMonitoringView from './view';
const DetailListWorkMonitoring = props => { const DetailListWorkMonitoring = props => {
const {route} = props; const {route} = props;
const workItem = route?.params?.workItem || {}; const workItem = route?.params?.workItem || {};
const [showRequestReport, setShowRequyestReport] = useState(false); const [showRequestReport, setShowRequestReport] = useState(false);
const [showModal, setShowModal] = useState(false);
const [data, setData] = useState({ const [data, setData] = useState({
id: workItem.id || 1, id: workItem.id || 1,
...@@ -37,24 +36,6 @@ const DetailListWorkMonitoring = props => { ...@@ -37,24 +36,6 @@ const DetailListWorkMonitoring = props => {
workItem.content || workItem.content ||
'Nội dung công việc đang được giám sát và theo dõi tiến độ thực hiện', 'Nội dung công việc đang được giám sát và theo dõi tiến độ thực hiện',
}); });
const handleReportPress = () => {
if (data.status === 'Đang thực hiện') {
setShowModal(true);
}
};
const handleCloseModal = () => {
setShowModal(false);
};
const handleSubmitReport = (reportData) => {
// Xử lý submit yêu cầu báo cáo
console.log('Report data:', reportData);
setShowModal(false);
// TODO: Gọi API để gửi yêu cầu báo cáo
};
const [dataList, setDataList] = useState([ const [dataList, setDataList] = useState([
{id: 1, name: 'Nguyễn Minh Đức'}, {id: 1, name: 'Nguyễn Minh Đức'},
...@@ -107,16 +88,29 @@ const DetailListWorkMonitoring = props => { ...@@ -107,16 +88,29 @@ const DetailListWorkMonitoring = props => {
}, },
]); ]);
const handleReportPress = () => {
if (data.status === 'Đang thực hiện') {
setShowRequestReport(true);
}
};
const handleCloseModalRequestReport = () => {
setShowRequestReport(false);
};
const handleSubmitRequestReport = reportData => {
setShowRequestReport(false);
};
return ( return (
<DetailListWorkMonitoringView <DetailListWorkMonitoringView
data={data} data={data}
dataList={dataList} dataList={dataList}
dataReport={dataReport} dataReport={dataReport}
onHandleReportPress={handleReportPress} onOpenModalRequestReport={handleReportPress}
setShowRequyestReport={setShowRequyestReport} showModalRequestReport={showRequestReport}
showModal={showModal} onCloseModalRequestReport={handleCloseModalRequestReport}
onCloseModal={handleCloseModal} onSubmitRequestReport={handleSubmitRequestReport}
onSubmitReport={handleSubmitReport}
/> />
); );
}; };
......
...@@ -4,7 +4,6 @@ import ModalRequestReportView from './view'; ...@@ -4,7 +4,6 @@ import ModalRequestReportView from './view';
const ModalRequestReport = props => { const ModalRequestReport = props => {
const {visible, onClose, onSubmitReport, workData} = props; const {visible, onClose, onSubmitReport, workData} = props;
// State cho form trong modal
const [reportTitle, setReportTitle] = useState(''); const [reportTitle, setReportTitle] = useState('');
const [reportContent, setReportContent] = useState(''); const [reportContent, setReportContent] = useState('');
const [reportDeadline, setReportDeadline] = useState(''); const [reportDeadline, setReportDeadline] = useState('');
......
...@@ -80,7 +80,7 @@ const styles = StyleSheet.create({ ...@@ -80,7 +80,7 @@ const styles = StyleSheet.create({
borderRadius: 10, borderRadius: 10,
padding: 20, padding: 20,
alignItems: 'center', alignItems: 'center',
marginTop:3, marginTop: 3,
marginBottom: 50, marginBottom: 50,
}, },
uploadIcon: { uploadIcon: {
......
...@@ -19,8 +19,16 @@ import ModalRequestReport from './modal_request_report'; ...@@ -19,8 +19,16 @@ import ModalRequestReport from './modal_request_report';
const DetailListWorkMonitoringView = props => { const DetailListWorkMonitoringView = props => {
LogBox.ignoreLogs(['VirtualizedLists should never be nested']); LogBox.ignoreLogs(['VirtualizedLists should never be nested']);
const {data, dataList, dataReport, onHandleReportPress, setShowRequestReport, showModal, onCloseModal, onSubmitReport} = props; const {
console.log('data', props.data); data,
dataList,
dataReport,
onOpenModalRequestReport,
showModalRequestReport,
onCloseModalRequestReport,
onSubmitRequestReport,
} = props;
const getColor = status => { const getColor = status => {
switch (status) { switch (status) {
...@@ -38,6 +46,7 @@ const DetailListWorkMonitoringView = props => { ...@@ -38,6 +46,7 @@ const DetailListWorkMonitoringView = props => {
return R.colors.gray; return R.colors.gray;
} }
}; };
const shouldShowFAB = () => { const shouldShowFAB = () => {
return data.status === 'Đang thực hiện'; return data.status === 'Đang thực hiện';
}; };
...@@ -67,7 +76,7 @@ const DetailListWorkMonitoringView = props => { ...@@ -67,7 +76,7 @@ const DetailListWorkMonitoringView = props => {
title={'Cập nhật thông tin công việc'} title={'Cập nhật thông tin công việc'}
backgroundColor={R.colors.blue} backgroundColor={R.colors.blue}
textColor={R.colors.white} textColor={R.colors.white}
onPress={() => handleReportPress()} onPress={() => ({})}
fontSize={R.sizes.sm} fontSize={R.sizes.sm}
fontFamily={R.fonts.fontMedium} fontFamily={R.fonts.fontMedium}
height={35} height={35}
...@@ -219,7 +228,6 @@ const DetailListWorkMonitoringView = props => { ...@@ -219,7 +228,6 @@ const DetailListWorkMonitoringView = props => {
); );
}; };
return ( return (
<View style={styles.container}> <View style={styles.container}>
<Header title={'Chi tiết công việc giám sát'} /> <Header title={'Chi tiết công việc giám sát'} />
...@@ -230,7 +238,7 @@ const DetailListWorkMonitoringView = props => { ...@@ -230,7 +238,7 @@ const DetailListWorkMonitoringView = props => {
{shouldShowFAB() && ( {shouldShowFAB() && (
<FAB> <FAB>
<SubButton <SubButton
onPress={onHandleReportPress} onPress={onOpenModalRequestReport}
label={'Yêu cầu báo cáo'} label={'Yêu cầu báo cáo'}
images={R.images.icEdit} images={R.images.icEdit}
backgroundColor={R.colors.orange} backgroundColor={R.colors.orange}
...@@ -239,9 +247,9 @@ const DetailListWorkMonitoringView = props => { ...@@ -239,9 +247,9 @@ const DetailListWorkMonitoringView = props => {
)} )}
<ModalRequestReport <ModalRequestReport
visible={showModal} visible={showModalRequestReport}
onClose={onCloseModal} onClose={onCloseModalRequestReport}
onSubmitReport={onSubmitReport} onSubmitReport={onSubmitRequestReport}
workData={data} workData={data}
/> />
</View> </View>
......
...@@ -103,7 +103,6 @@ const styles = StyleSheet.create({ ...@@ -103,7 +103,6 @@ const styles = StyleSheet.create({
fontWeight: '400', fontWeight: '400',
color: R.colors.black, color: R.colors.black,
}, },
// New styles moved from inline styles
listItemContainer: { listItemContainer: {
marginHorizontal: 15, marginHorizontal: 15,
marginBottom:10 marginBottom:10
......
...@@ -86,8 +86,6 @@ const ListWorkView = props => { ...@@ -86,8 +86,6 @@ const ListWorkView = props => {
onOpenModalReport(item); onOpenModalReport(item);
} else if (button.action === 'approve') { } else if (button.action === 'approve') {
onApprovalAction(item, 'approve'); onApprovalAction(item, 'approve');
} else {
onReportAction(item, button.action);
} }
}} }}
backgroundColor={button.backgroundColor} backgroundColor={button.backgroundColor}
......
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