feat: terapkan design baru pada halaman create project dan create task divisi

- Ganti file list (BorderBottomItem) dengan fileGrid/fileCard bergaya baru
  dengan icon berwarna sesuai tipe file
- Ganti member section dengan card individual per anggota (avatar + nama + badge jabatan)
- Header anggota: label kiri + jumlah orang di kanan
- Simpan field position saat memilih anggota di modalSelect
- Hapus wrapper wrapPaper di SectionListAddTask

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-05-06 16:50:54 +08:00
parent 97726609e1
commit 11bb1ddc98
4 changed files with 190 additions and 110 deletions

View File

@@ -108,12 +108,12 @@ export default function ModalSelect({ open, close, title, category, idParent, on
setChooseValue({ ...chooseValue, val: valChoose })
}, [dispatch, open, search]);
function onChoose(val: string, label: string, img?: string) {
function onChoose(val: string, label: string, img?: string, position?: string) {
if (category == "member") {
if (selectMember.some((i: any) => i.idUser == val)) {
setSelectMember(selectMember.filter((i: any) => i.idUser != val))
} else {
setSelectMember([...selectMember, { idUser: val, name: label, img }])
setSelectMember([...selectMember, { idUser: val, name: label, img, position }])
}
} else {
setChooseValue({ val, label })
@@ -144,7 +144,7 @@ export default function ModalSelect({ open, close, title, category, idParent, on
key={index}
label={item.name}
src={`${ConstEnv.url_storage}/files/${item.img}`}
onClick={() => onChoose(item.idUser, item.name, item.img)}
onClick={() => onChoose(item.idUser, item.name, item.img, item.position)}
/>
))
}
@@ -162,7 +162,7 @@ export default function ModalSelect({ open, close, title, category, idParent, on
category != 'status-task' ?
data.length > 0 ?
data.map((item: any, index: any) => (
<Pressable key={index} style={[Styles.itemSelectModal, {borderColor:colors.icon+'20'}]} onPress={() => { onChoose(item.id, item.name, item.img) }}>
<Pressable key={index} style={[Styles.itemSelectModal, {borderColor:colors.icon+'20'}]} onPress={() => { onChoose(item.id, item.name, item.img, item.position) }}>
{
category == 'member'
?

View File

@@ -32,25 +32,22 @@ export default function SectionListAddTask() {
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>
Tanggal & Tugas
</Text>
<View style={[Styles.wrapPaper, { backgroundColor: colors.card, borderColor: colors.background }]}>
{
taskCreate.map((item: { status: number; title: string; dateStart: string; dateEnd: string; }, index: Key | null | undefined) => {
return (
<ItemSectionTanggalTugas
key={index}
title={item.title}
dateStart={item.dateStart}
dateEnd={item.dateEnd}
onPress={() => {
setSelect(index)
setModal(true)
}}
/>
);
})
}
</View>
{
taskCreate.map((item: { status: number; title: string; dateStart: string; dateEnd: string; }, index: Key | null | undefined) => {
return (
<ItemSectionTanggalTugas
key={index}
title={item.title}
dateStart={item.dateStart}
dateEnd={item.dateEnd}
onPress={() => {
setSelect(index)
setModal(true)
}}
/>
);
})
}
</View>
<DrawerBottom
animation="slide"