Commit ce49f291 by tungnq

TODO: Đã thêm chức năng check box

parent 5345fd17
......@@ -5,131 +5,137 @@ import CompensateRegisterView from './view';
const CompensateRegister = (props) => {
const [isShow, setShowSchedule] = useState(false);
const scheduleData = [
const [scheduleData, setScheduleData] = useState([
{
date: 'Thứ 2\n28/07/2025',
periods: [
{ period: 1, percent: '3%', totalSession: '24' , breakTime:'1'},
{ period: 2, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 3, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 4, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 8, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 12, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24'}
{ period: 1, percent: '3%', totalSession: '24' , breakTime:'1', available: false},
{ period: 2, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 3, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 4, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 8, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 12, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24', available: false}
] },
{
date: 'Thứ 3\n29/07/2025',
periods: [
{ period: 1, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 2, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 3, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 4, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 8, percent: '3%', totalSession: '24' , breakTime:'1'},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 12, percent: '3%', totalSession: '24' , breakTime:'1'},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24'}
{ period: 1, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 2, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 3, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 4, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 8, percent: '3%', totalSession: '24' , breakTime:'1', available: false},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 12, percent: '3%', totalSession: '24' , breakTime:'1', available: false},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24', available: false}
] },
{
date: 'Thứ 4\n30/07/2025',
periods: [
{ period: 1, percent: '3%', totalSession: '24' , breakTime:'1'},
{ period: 2, percent: '3%', totalSession: '24' , breakTime:'1'},
{ period: 3, percent: '3%', totalSession: '24' , breakTime:'1'},
{ period: 4, percent: '3%', totalSession: '24' , breakTime:'1'},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 8, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 12, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24'}
{ period: 1, percent: '3%', totalSession: '24' , breakTime:'1', available: false},
{ period: 2, percent: '3%', totalSession: '24' , breakTime:'1', available: false},
{ period: 3, percent: '3%', totalSession: '24' , breakTime:'1', available: false},
{ period: 4, percent: '3%', totalSession: '24' , breakTime:'1', available: false},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 8, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 12, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24', available: false}
] },
{
date: 'Thứ 5\n31/07/2025',
periods: [
{ period: 1, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 2, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 3, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 4, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 8, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 12, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24'}
{ period: 1, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 2, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 3, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 4, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 8, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 12, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24', available: false}
] },
{
date: 'Thứ 6\n01/08/2025',
periods: [
{ period: 1, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 2, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 3, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 4, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 8, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 12, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24'}
{ period: 1, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 2, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 3, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 4, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 8, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 12, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24', available: false}
] },
{
date: 'Thứ 7\n02/08/2025',
periods: [
{ period: 1, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 2, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 3, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 4, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 8, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 12, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24'},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24'}
{ period: 1, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 2, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 3, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 4, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 5, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 6, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 7, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 8, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 9, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 10, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 11, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 12, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 13, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 14, percent: '100%', totalSession: '24' , breakTime:'24', available: false},
{ period: 15, percent: '100%', totalSession: '24' , breakTime:'24', available: false}
] }
];
]);
const handleCheckboxChange = (dayIndex, periodIndex, newValue) => {
setScheduleData(prevData => {
const updatedData = [...prevData];
updatedData[dayIndex].periods[periodIndex].available = newValue;
return updatedData;
});
};
return (
<CompensateRegisterView
isShow={isShow}
setShowSchedule={setShowSchedule}
scheduleData={scheduleData}
onCheckboxChange={handleCheckboxChange}
/>
);
};
......
......@@ -110,8 +110,8 @@ container:{
},
dateText:{
fontSize: R.sizes.sm,
fontWeight: '500',
fontFamily: R.fonts.fontMedium,
fontWeight: '400',
fontFamily: R.fonts.fontRegular,
color: R.colors.black,
},
percentText:{
......
......@@ -15,7 +15,7 @@ import TextMulti from '../../../components/Input/TextMulti';
import Button from '../../../components/Button';
import CheckBox from '../../../components/CheckBox';
const CompensateRegisterView = props => {
const {isShow, setShowSchedule, scheduleData} = props;
const {isShow, setShowSchedule, scheduleData, onCheckboxChange} = props;
const getCheckColor = (item) => {
console.log(item?.totalSession);
......@@ -67,8 +67,13 @@ const CompensateRegisterView = props => {
period.available && styles.availableCell,
]}>
<CheckBox
size={20}
checked={period.available}
value={period.available}
onValueChange={value => onCheckboxChange(index, periodIndex, value)}
size={20}
labelStyle={styles.label}
checkedColor={R.colors.main}
tickColor={R.colors.white}
/>
<View style={{flexDirection:'row'}}>
<Text
......
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