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

Merge pull request #7 from bipproduction/amalia/06-mar-25

Browse Source 
Amalia/06 mar 25
This commit is contained in:
Amalia
2025-03-06 15:38:43 +08:00
committed by GitHub
parent ca1e786a01 d3779fcf5d
commit a2288ac329
22 changed files with 477 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
app/(application)/_layout.tsx
View File

@@ -1,5 +1,6 @@
import ButtonBackHeader from "@/components/buttonBackHeader";
import HeaderDiscussionGeneral from "@/components/discussion_general/headerDiscussionGeneral";
import HeaderRightDivisionList from "@/components/division/headerDivisionList";
import HeaderMemberList from "@/components/member/headerMemberList";
import HeaderRightProjectList from "@/components/project/headerProjectList";
import { Headers } from "@/constants/Headers";
@@ -35,6 +36,12 @@ export default function RootLayout() {
headerTitleAlign: 'center',
headerRight: () => <HeaderRightProjectList />
}} />
<Stack.Screen name="division/index" options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
title: 'Divisi',
headerTitleAlign: 'center',
headerRight: () => <HeaderRightDivisionList />
}} />
</Stack>
<StatusBar style="light" />
</>

47
app/(application)/division/index.tsx Normal file
View File

@@ -0,0 +1,47 @@
import ButtonTab from "@/components/buttonTab"
import InputSearch from "@/components/inputSearch"
import Styles from "@/constants/Styles"
import { AntDesign, Feather, MaterialCommunityIcons } from "@expo/vector-icons"
import { router, useLocalSearchParams } from "expo-router"
import { useState } from "react"
import { Pressable, SafeAreaView, ScrollView, Text, View } from "react-native"
export default function ListDivision() {
const { active } = useLocalSearchParams<{ active?: string }>()
const [isList, setList] = useState(false)
return (
<SafeAreaView>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={active == "false" ? "false" : "true"}
value="true"
onPress={() => { router.push('/division?active=true') }}
label="Aktif"
icon={<Feather name="check-circle" color={active == "false" ? 'black' : 'white'} size={20} />}
n={2} />
<ButtonTab
active={active == "false" ? "false" : "true"}
value="false"
onPress={() => { router.push('/division?active=false') }}
label="Tidak Aktif"
icon={<AntDesign name="closecircleo" color={active == "true" ? 'black' : 'white'} size={20} />}
n={2} />
</View>
<View style={[Styles.rowSpaceBetween]}>
<InputSearch width={68} />
<Pressable onPress={() => { setList(!isList) }}>
<MaterialCommunityIcons name={isList ? 'format-list-bulleted' : 'view-grid'} color={"black"} size={30} />
</Pressable>
</View>
<View style={[Styles.mv05]}>
<Text>Filter : Dinas</Text>
</View>
</View>
</ScrollView>
</SafeAreaView>
)
}

2
app/(application)/feature.tsx
View File

@@ -17,7 +17,7 @@ export default function Feature() {
/>
<View style={[Styles.p15]}>
<View style={[Styles.rowSpaceBetween, Styles.mb15]}>
<ButtonFiturMenu icon={<MaterialIcons name="group" size={35} color="black" />} text="Divisi" />
<ButtonFiturMenu icon={<MaterialIcons name="group" size={35} color="black" />} text="Divisi" onPress={() => { router.push('/division?active=true') }} />
<ButtonFiturMenu icon={<AntDesign name="areachart" size={35} color="black" />} text="Kegiatan" onPress={() => { router.push('/project?status=0') }} />
<ButtonFiturMenu icon={<MaterialIcons name="campaign" size={35} color="black" />} text="Pengumuman" onPress={() => { router.push('/announcement') }} />
<ButtonFiturMenu icon={<Ionicons name="chatbubbles-sharp" size={35} color="black" />} text="Diskusi" onPress={() => { router.push('/discussion?active=true') }} />

59
app/(application)/project/[id]/add-file.tsx Normal file
View File

@@ -0,0 +1,59 @@
import AlertKonfirmasi from "@/components/alertKonfirmasi"
import BorderBottomItem from "@/components/borderBottomItem"
import ButtonBackHeader from "@/components/buttonBackHeader"
import { ButtonForm } from "@/components/buttonForm"
import ButtonSelect from "@/components/buttonSelect"
import Styles from "@/constants/Styles"
import { MaterialCommunityIcons } from "@expo/vector-icons"
import { router, Stack, useLocalSearchParams } from "expo-router"
import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native"
export default function ProjectAddFile() {
const { id } = useLocalSearchParams()
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Tambah File',
headerTitleAlign: 'center',
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<ButtonSelect value="Upload File" />
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>File</Text>
<View style={[Styles.wrapPaper]}>
<BorderBottomItem
borderType="all"
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
title="image_pertama.jpg"
titleWeight="normal"
/>
<BorderBottomItem
borderType="all"
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
title="file_kedua.pdf"
titleWeight="normal"
/>
</View>
</View>
<ButtonForm
text="SIMPAN"
onPress={() => {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin menambahkan data?',
onPress: () => {
ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
router.push('/project/4324')
}
})
}} />
</View>
</ScrollView>
</SafeAreaView>
)
}

74
app/(application)/project/[id]/add-task.tsx Normal file
View File

@@ -0,0 +1,74 @@
import AlertKonfirmasi from "@/components/alertKonfirmasi"
import ButtonBackHeader from "@/components/buttonBackHeader"
import { ButtonForm } from "@/components/buttonForm"
import { InputForm } from "@/components/inputForm"
import Styles from "@/constants/Styles"
import dayjs from "dayjs"
import { router, Stack, useLocalSearchParams } from "expo-router"
import { useState } from "react"
import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native"
import DateTimePicker, { DateType, getDefaultStyles } from 'react-native-ui-datepicker';
export default function ProjectAddTask() {
const { id } = useLocalSearchParams()
const [range, setRange] = useState<{ startDate: DateType; endDate: DateType; }>({ startDate: undefined, endDate: undefined });
const defaultStyles = getDefaultStyles()
const from = range.startDate
? dayjs(range.startDate).format('MMM DD, YYYY')
: '';
const to = range.endDate ? dayjs(range.endDate).format('MMM DD, YYYY') : '';
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Tambah Tugas',
headerTitleAlign: 'center',
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<View style={[Styles.wrapPaper, Styles.p10]}>
<DateTimePicker
mode="range"
startDate={range.startDate}
endDate={range.endDate}
onChange={(param) => setRange(param)}
styles={defaultStyles}
/>
</View>
<View style={[Styles.rowSpaceBetween, Styles.mv10]}>
<View style={[{ width: '48%' }]}>
<Text style={[Styles.mb05]}>Tanggal Mulai <Text style={Styles.cError}>*</Text></Text>
<View style={[Styles.wrapPaper, Styles.p10]}>
<Text style={{ textAlign: 'center' }}>{from}</Text>
</View>
</View>
<View style={[{ width: '48%' }]}>
<Text style={[Styles.mb05]}>Tanggal Berakhir <Text style={Styles.cError}>*</Text></Text>
<View style={[Styles.wrapPaper, Styles.p10]}>
<Text style={{ textAlign: 'center' }}>{to}</Text>
</View>
</View>
</View>
<InputForm label="Judul Tugas" type="default" placeholder="Judul Tugas" required bg="white" />
<ButtonForm
text="SIMPAN"
onPress={() => {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin menambahkan data?',
onPress: () => {
ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
router.push('/project/4324')
}
})
}} />
</View>
</ScrollView>
</SafeAreaView>
)
}

39
app/(application)/project/[id]/cancel.tsx Normal file
View File

@@ -0,0 +1,39 @@
import AlertKonfirmasi from "@/components/alertKonfirmasi"
import ButtonBackHeader from "@/components/buttonBackHeader"
import { ButtonForm } from "@/components/buttonForm"
import { InputForm } from "@/components/inputForm"
import Styles from "@/constants/Styles"
import { router, Stack, useLocalSearchParams } from "expo-router"
import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native"
export default function ProjectCancel() {
const { id } = useLocalSearchParams()
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Pembatalan Kegiatan',
headerTitleAlign: 'center',
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<InputForm label="Alasan Pembatalan" type="default" placeholder="Alasan Pembatalan" required bg="white" />
<ButtonForm
text="SIMPAN"
onPress={() => {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin membatalkan kegiatan? Pembatalan bersifat permanen',
onPress: () => {
ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
router.push('/project/4324')
}
})
}} />
</View>
</ScrollView>
</SafeAreaView>
)
}

39
app/(application)/project/[id]/edit.tsx Normal file
View File

@@ -0,0 +1,39 @@
import AlertKonfirmasi from "@/components/alertKonfirmasi"
import ButtonBackHeader from "@/components/buttonBackHeader"
import { ButtonForm } from "@/components/buttonForm"
import { InputForm } from "@/components/inputForm"
import Styles from "@/constants/Styles"
import { router, Stack, useLocalSearchParams } from "expo-router"
import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native"
export default function EditProject() {
const { id } = useLocalSearchParams()
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Edit Judul Kegiatan',
headerTitleAlign: 'center',
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<InputForm label="Judul Kegiatan" type="default" placeholder="Judul Kegiatan" required bg="white" />
<ButtonForm
text="SIMPAN"
onPress={() => {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin mengubah data?',
onPress: () => {
ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
router.push('/project/4324')
}
})
}} />
</View>
</ScrollView>
</SafeAreaView>
)
}

6
app/(application)/project/[id]/index.tsx
View File

@@ -1,5 +1,7 @@
import ButtonBackHeader from "@/components/buttonBackHeader";
import HeaderRightProjectDetail from "@/components/project/headerProjectDetail";
import SectionFile from "@/components/sectionFile";
import SectionMember from "@/components/sectionMember";
import SectionProgress from "@/components/sectionProgress";
import SectionTanggalTugas from "@/components/sectionTanggalTugas";
import Styles from "@/constants/Styles";
@@ -19,9 +21,11 @@ export default function DetailProject() {
}}
/>
<ScrollView>
<View style={[Styles.p15]}>
<View style={[Styles.p15, Styles.mb100]}>
<SectionProgress text="Kemajuan Kegiatan 50%" />
<SectionTanggalTugas />
<SectionFile/>
<SectionMember/>
</View>
</ScrollView>
</SafeAreaView>

BIN
bun.lockb
View File

Binary file not shown.

7
components/borderBottomItem.tsx
View File

@@ -14,16 +14,17 @@ type Props = {
borderType: 'all' | 'bottom' | 'none'
leftBottomInfo?: React.ReactNode | string
rightBottomInfo?: React.ReactNode | string
titleWeight?: 'normal' | 'bold'
}
export default function BorderBottomItem({ title, subtitle, icon, desc, onPress, rightTopInfo, borderType, leftBottomInfo, rightBottomInfo }: Props) {
export default function BorderBottomItem({ title, subtitle, icon, desc, onPress, rightTopInfo, borderType, leftBottomInfo, rightBottomInfo, titleWeight }: Props) {
return (
<Pressable style={[borderType == 'bottom' ? Styles.wrapItemBorderBottom : borderType == 'all' ? Styles.wrapItemBorderAll : Styles.wrapItemBorderNone]} onPressOut={onPress}>
<View style={[Styles.rowItemsCenter]}>
{icon}
<View style={[Styles.rowSpaceBetween, { width: '85%' }]}>
<View style={[Styles.ml10]}>
<Text style={[Styles.textDefaultSemiBold]}>{title}</Text>
<Text style={[titleWeight == 'normal' ? Styles.textDefault : Styles.textDefaultSemiBold]}>{title}</Text>
{
subtitle &&
typeof subtitle == "string"
@@ -41,7 +42,7 @@ export default function BorderBottomItem({ title, subtitle, icon, desc, onPress,
</View>
{desc && <Text style={[Styles.textDefault, Styles.mt05, { textAlign: 'justify' }]}>{desc}</Text>}
{
(leftBottomInfo || rightBottomInfo )&&
(leftBottomInfo || rightBottomInfo) &&
(
<View style={[Styles.rowSpaceBetween, Styles.mt10]}>
{

47
components/division/headerDivisionList.tsx Normal file
View File

@@ -0,0 +1,47 @@
import { useState } from "react"
import ButtonMenuHeader from "../buttonMenuHeader"
import DrawerBottom from "../drawerBottom"
import { View } from "react-native"
import Styles from "@/constants/Styles"
import MenuItemRow from "../menuItemRow"
import { AntDesign, MaterialCommunityIcons } from "@expo/vector-icons"
import ModalFilter from "../modalFilter"
export default function HeaderRightDivisionList() {
const [isVisible, setVisible] = useState(false)
const [isFilter, setFilter] = useState(false)
return (
<>
<ButtonMenuHeader onPress={() => { setVisible(true) }} />
<DrawerBottom animation="slide" isVisible={isVisible} setVisible={setVisible} title="Menu">
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<AntDesign name="pluscircle" color="black" size={25} />}
title="Tambah Kegiatan"
onPress={() => {
setVisible(false)
// router.push('/project/create')
}}
/>
<MenuItemRow
icon={<AntDesign name="filter" color="black" size={25} />}
title="Filter"
onPress={() => {
setVisible(false)
setFilter(true)
}}
/>
<MenuItemRow
icon={<MaterialCommunityIcons name="chart-bar" color="black" size={25} />}
title="Laporan"
onPress={() => {
setVisible(false)
// router.push('/project/create')
}}
/>
</View>
</DrawerBottom>
<ModalFilter close={() => { setFilter(false) }} open={isFilter} page="division" />
</>
)
}

2
components/home/fiturHome.tsx
View File

@@ -10,7 +10,7 @@ export default function FiturHome() {
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv10]}>Fitur</Text>
<View style={[Styles.rowSpaceBetween]}>
<ButtonFiturMenu icon={<MaterialIcons name="group" size={35} color="black" />} text="Divisi" />
<ButtonFiturMenu icon={<MaterialIcons name="group" size={35} color="black" />} text="Divisi" onPress={() => { router.push('/division?active=true') }} />
<ButtonFiturMenu icon={<AntDesign name="areachart" size={35} color="black" />} text="Kegiatan" onPress={() => { router.push('/project?status=0') }} />
<ButtonFiturMenu icon={<MaterialIcons name="campaign" size={35} color="black" />} text="Pengumuman" onPress={() => { router.push('/announcement') }} />
<ButtonFiturMenu icon={<MaterialCommunityIcons name="view-grid" size={35} color="black" />} text="Semua" onPress={() => { router.push('/feature') }} />

9
components/inputForm.tsx
View File

@@ -14,10 +14,11 @@ type Props = {
type: 'default' | 'visible-password' | 'numeric'
round?: boolean
width?: number
bg?: 'white' | 'transparent'
};
export function InputForm({ label, placeholder, onChange, info, error, errorText, required, itemLeft, itemRight, type, round, width }: Props) {
export function InputForm({ label, placeholder, onChange, info, error, errorText, required, itemLeft, itemRight, type, round, width, bg }: Props) {
const lebar = Dimensions.get("window").width;
if (itemLeft != undefined || itemRight != undefined) {
@@ -31,13 +32,13 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
</Text>
)
}
<View style={[Styles.inputRoundForm, itemRight != undefined ? Styles.inputRoundFormRight : Styles.inputRoundFormLeft, round && Styles.round30]}>
<View style={[Styles.inputRoundForm, itemRight != undefined ? Styles.inputRoundFormRight : Styles.inputRoundFormLeft, round && Styles.round30, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }]}>
{itemRight != undefined ? itemRight : itemLeft}
<TextInput
placeholder={placeholder}
keyboardType={type}
onChangeText={onChange}
style={{ width: width && lebar * width / 100 }}
style={{ width: width && lebar * width / 100}}
/>
</View>
{error && (<Text style={[Styles.textInformation, Styles.cError]}>{errorText}</Text>)}
@@ -61,7 +62,7 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
<TextInput
placeholder={placeholder}
keyboardType={type}
style={[Styles.inputRoundForm, error && { borderColor: "red" }, round && Styles.round30]}
style={[Styles.inputRoundForm, error && { borderColor: "red" }, round && Styles.round30, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }]}
onChangeText={onChange}
/>
{error && (<Text style={[Styles.textInformation, Styles.cError]}>{errorText}</Text>)}

1
components/inputSearch.tsx
View File

@@ -10,6 +10,7 @@ export default function InputSearch({ onChange, width }: { onChange?: (val: stri
itemLeft={<Feather name="search" size={20} color="grey" />}
onChange={onChange}
width={width}
bg="white"
/>
)
}

53
components/itemSectionTanggalTugas.tsx Normal file
View File

@@ -0,0 +1,53 @@
import Styles from "@/constants/Styles";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import { Text, View } from "react-native";
type Props = {
done: boolean
title: string
dateStart: string
dateEnd: string
}
export default function ItemSectionTanggalTugas({ done, title, dateStart, dateEnd }: Props) {
return (
<View style={[Styles.mb15, { borderBottomColor: '#d6d8f6', borderBottomWidth: 1 }]}>
<View style={[Styles.rowItemsCenter]}>
{
done ?
<>
<MaterialCommunityIcons name="checkbox-marked-circle-outline" size={22} color="gray" style={[Styles.mr10]} />
<Text style={[Styles.cGray]}>Selesai</Text>
</>
:
<>
<MaterialCommunityIcons name="checkbox-blank-circle-outline" size={22} color="gray" style={[Styles.mr10]} />
<Text style={[Styles.cGray]}>Belum Selesai</Text>
</>
}
</View>
<View style={[Styles.wrapPaper, Styles.mv10, Styles.p10]}>
<View style={[Styles.rowItemsCenter]}>
<MaterialCommunityIcons name="file-table-outline" size={25} color="black" style={[Styles.mr10]} />
<Text style={[Styles.textDefault]}>{title}</Text>
</View>
</View>
<View style={[Styles.rowSpaceBetween, Styles.mb15]}>
<View style={[{ width: '48%' }]}>
<Text style={[Styles.mb05]}>Tanggal Mulai</Text>
<View style={[Styles.wrapPaper, Styles.p10]}>
<Text style={{ textAlign: 'center' }}>{dateStart}</Text>
</View>
</View>
<View style={[{ width: '48%' }]}>
<Text style={[Styles.mb05]}>Tanggal Berakhir</Text>
<View style={[Styles.wrapPaper, Styles.p10]}>
<Text style={{ textAlign: 'center' }}>{dateEnd}</Text>
</View>
</View>
</View>
</View>
)
}

2
components/modalFilter.tsx
View File

@@ -9,7 +9,7 @@ import { router } from "expo-router"
type Props = {
open: boolean,
close: (value: boolean) => void
page: 'position' | 'member' | 'discussion' | 'project'
page: 'position' | 'member' | 'discussion' | 'project' | 'division'
}
export default function ModalFilter({ open, close, page }: Props) {

16
components/project/headerProjectDetail.tsx
View File

@@ -5,6 +5,7 @@ import { View } from "react-native"
import Styles from "@/constants/Styles"
import MenuItemRow from "../menuItemRow"
import { AntDesign, MaterialCommunityIcons, MaterialIcons } from "@expo/vector-icons"
import { router } from "expo-router"
type Props = {
id: string | string[]
@@ -22,14 +23,16 @@ export default function HeaderRightProjectDetail({ id }: Props) {
icon={<AntDesign name="pluscircle" color="black" size={25} />}
title="Tambah Tugas"
onPress={() => {
setVisible(false)
router.push(`/project/${id}/add-task`)
}}
/>
<MenuItemRow
icon={<MaterialCommunityIcons name="file-plus" color="black" size={25} />}
title="Tambah File"
onPress={() => {
setVisible(false)
router.push(`/project/${id}/add-file`)
}}
/>
@@ -37,8 +40,8 @@ export default function HeaderRightProjectDetail({ id }: Props) {
icon={<MaterialIcons name="groups" color="black" size={25} />}
title="Tambah Anggota"
onPress={() => {
setVisible(false)
// router.push(`/discussion/member/${id}`)
// setVisible(false)
}}
/>
@@ -49,14 +52,15 @@ export default function HeaderRightProjectDetail({ id }: Props) {
title="Edit"
onPress={() => {
setVisible(false)
// router.push(`/discussion/edit/${id}`)
router.push(`/project/${id}/edit`)
}}
/>
<MenuItemRow
icon={<MaterialIcons name="close" color="black" size={25} />}
title="Batal"
onPress={() => {
setVisible(false)
router.push(`/project/${id}/cancel`)
}}
/>
</View>

26
components/sectionFile.tsx Normal file
View File

@@ -0,0 +1,26 @@
import Styles from "@/constants/Styles";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import { Text, View } from "react-native";
import BorderBottomItem from "./borderBottomItem";
export default function SectionFile() {
return (
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>File</Text>
<View style={[Styles.wrapPaper]}>
<BorderBottomItem
borderType="all"
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
title="image_pertama.jpg"
titleWeight="normal"
/>
<BorderBottomItem
borderType="all"
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
title="file_kedua.pdf"
titleWeight="normal"
/>
</View>
</View>
)
}

45
components/sectionMember.tsx Normal file
View File

@@ -0,0 +1,45 @@
import Styles from "@/constants/Styles";
import { Image, Text, View } from "react-native";
import BorderBottomItem from "./borderBottomItem";
export default function SectionMember() {
return (
<View style={[Styles.mb15]}>
<View style={[Styles.rowSpaceBetween, Styles.mv05]}>
<Text style={[Styles.textDefaultSemiBold]}>Anggota</Text>
<Text style={[Styles.textDefault]}>Total 5 Anggota</Text>
</View>
<View style={[Styles.wrapPaper]}>
<BorderBottomItem
borderType="bottom"
icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
title="Amalia Dwi"
subtitle="Dinas - Bendahara"
rightTopInfo="Anggota"
/>
<BorderBottomItem
borderType="bottom"
icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
title="Amalia Dwi"
subtitle="Dinas - Bendahara"
rightTopInfo="Anggota"
/>
<BorderBottomItem
borderType="bottom"
icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
title="Amalia Dwi"
subtitle="Dinas - Bendahara"
rightTopInfo="Anggota"
/>
<BorderBottomItem
borderType="bottom"
icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
title="Amalia Dwi"
subtitle="Dinas - Bendahara"
rightTopInfo="Anggota"
/>
</View>
</View>
)
}

8
components/sectionTanggalTugas.tsx
View File

@@ -1,12 +1,14 @@
import Styles from "@/constants/Styles";
import { Text, View } from "react-native";
import ItemSectionTanggalTugas from "./itemSectionTanggalTugas";
export default function SectionTanggalTugas() {
return (
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv10]}>Tanggal Dan Tugas</Text>
<View style={[Styles.mb15, Styles.mt10]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>Tanggal & Tugas</Text>
<View style={[Styles.wrapPaper]}>
<ItemSectionTanggalTugas done={false} title="Pertama" dateStart="12-03-2023" dateEnd="15-03-2023" />
<ItemSectionTanggalTugas done={true} title="Kedua" dateStart="15-03-2023" dateEnd="20-03-2023" />
</View>
</View>
)

7
constants/Styles.ts
View File

@@ -120,6 +120,9 @@ const Styles = StyleSheet.create({
p15: {
padding: 15
},
p10: {
padding: 10
},
round30: {
borderRadius: 30
},
@@ -172,7 +175,7 @@ const Styles = StyleSheet.create({
},
inputRoundForm: {
borderRadius: 10,
borderColor: 'gray',
borderColor: '#d6d8f6',
borderWidth: 1,
paddingVertical: 10,
paddingHorizontal: 15,
@@ -259,6 +262,8 @@ const Styles = StyleSheet.create({
padding: 15,
backgroundColor: 'white',
borderRadius: 10,
borderWidth: 1,
borderColor: '#d6d8f6',
},
contentItemCenter: {
justifyContent: 'center',

2
package.json
View File

@@ -18,6 +18,7 @@
"@expo/vector-icons": "^14.0.2",
"@react-navigation/bottom-tabs": "^7.2.0",
"@react-navigation/native": "^7.0.14",
"dayjs": "^1.11.13",
"expo": "~52.0.37",
"expo-blur": "~14.0.3",
"expo-constants": "~17.0.7",
@@ -45,6 +46,7 @@
"react-native-safe-area-context": "4.12.0",
"react-native-screens": "~4.4.0",
"react-native-svg": "15.8.0",
"react-native-ui-datepicker": "^3.0.5",
"react-native-web": "~0.19.13",
"react-native-webview": "13.12.5"
},