wibu/mobile-darmasaba
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: tambah fitur pilih semua pada modal pilih divisi

Browse Source 
Menambahkan baris "Pilih Semua" / "Batalkan Semua" di atas list pada
ModalSelectMultiple untuk kedua kategori choose-division dan share-division.
This commit is contained in:
amaliadwiy
2026-06-08 16:26:26 +08:00
parent 9dc4d8dc8d
commit 2cf5c8d960
1 changed files with 56 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
components/modalSelectMultiple.tsx
View File

@@ -128,6 +128,35 @@ export default function ModalSelectMultiple({ open, close, title, category, choo
};
const groupsWithDivisions = data.filter((group: any) => group.Division?.length > 0)
const isAllSelected = category === 'choose-division'
? groupsWithDivisions.length > 0 && groupsWithDivisions.every((group: any) =>
checked[group.id]?.length === group.Division?.length
)
: data.length > 0 && selectedDivision.length === data.length
const handleSelectAll = () => {
if (category === 'choose-division') {
if (isAllSelected) {
setChecked({})
} else {
const newChecked: CheckedState = {}
data.forEach((group: any) => {
if (group.Division?.length > 0) {
newChecked[group.id] = group.Division.map((d: any) => d.id)
}
})
setChecked(newChecked)
}
} else {
if (isAllSelected) {
setSelectedDivision([])
} else {
setSelectedDivision(data.map((d: any) => ({ id: d.id, name: d.name })))
}
}
}
const handleSubmit = () => {
if (category == "choose-division") {
const selectedGroups: GroupData[] = [];
@@ -154,25 +183,32 @@ export default function ModalSelectMultiple({ open, close, title, category, choo
{
category == 'share-division' ?
<>
{
data.map((item: any, index: number) => {
return (
<Pressable key={index} style={[Styles.itemSelectModal, { borderColor: colors.icon + 20 }]} onPress={() => {
handleDivisionClick(index)
}}>
<Text numberOfLines={1} style={[Styles.w80]}>{item.name}</Text>
{
selectedDivision.some((i: any) => i.id == item.id)
? <AntDesign name="check" size={17} color={colors.text} />
: <></>
}
</Pressable>
)
})
}
<Pressable style={[Styles.itemSelectModal, { borderColor: colors.icon + 20 }]} onPress={handleSelectAll}>
<Text style={[Styles.textMediumSemiBold]}>{isAllSelected ? 'Batalkan Semua' : 'Pilih Semua'}</Text>
{isAllSelected && <AntDesign name="check" size={17} color={colors.text} />}
</Pressable>
{data.map((item: any, index: number) => {
return (
<Pressable key={index} style={[Styles.itemSelectModal, { borderColor: colors.icon + 20 }]} onPress={() => {
handleDivisionClick(index)
}}>
<Text numberOfLines={1} style={[Styles.w80]}>{item.name}</Text>
{
selectedDivision.some((i: any) => i.id == item.id)
? <AntDesign name="check" size={17} color={colors.text} />
: <></>
}
</Pressable>
)
})}
</>
:
data.map((item: any, index: number) => {
<>
<Pressable style={[Styles.itemSelectModal, { borderColor: colors.icon + 20 }]} onPress={handleSelectAll}>
<Text style={[Styles.textMediumSemiBold]}>{isAllSelected ? 'Batalkan Semua' : 'Pilih Semua'}</Text>
{isAllSelected && <AntDesign name="check" size={17} color={colors.text} />}
</Pressable>
{data.map((item: any, index: number) => {
return (
<View key={index}>
<Pressable style={[Styles.itemSelectModal, { borderColor: colors.icon + 20 }]} onPress={() => { handleGroupCheck(item.id) }}>
@@ -199,7 +235,8 @@ export default function ModalSelectMultiple({ open, close, title, category, choo
}
</View>
)
})
})}
</>
}
</ScrollView>
<View style={[Styles.absolute0, { width: '100%' }]}>
@@ -207,4 +244,4 @@ export default function ModalSelectMultiple({ open, close, title, category, choo
</View>
</DrawerBottom>
)
}
}