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

Merge pull request #9 from bipproduction/amalia/10-mar-25

Browse Source 
Amalia/10 mar 25
This commit is contained in:
Amalia
2025-03-10 15:19:27 +08:00
committed by GitHub
parent fa64c0a955 5bc702928b
commit 503f04566f
35 changed files with 1064 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -42,6 +42,7 @@ export default function RootLayout() {
headerTitleAlign: 'center',
headerRight: () => <HeaderRightDivisionList />
}} />
<Stack.Screen name="division/[id]/(fitur-division)" options={{ headerShown: false }} />
</Stack>
<StatusBar style="light" />
</>

2
app/(application)/banner/[id].tsx
View File

@@ -47,7 +47,7 @@ export default function EditBanner() {
<Pressable onPress={pickImageAsync} style={[Styles.wrapPaper, Styles.contentItemCenter]}>
<View style={{ justifyContent: 'center', alignItems: 'center' }}>
<Entypo name="image" size={50} color={'#aeaeae'} />
<Text style={[Styles.textInformation]}>Mohon unggah gambar dalam resolusi 1535 x 450 piksel untuk memastikan</Text>
<Text style={[Styles.textInformation, Styles.mt05]}>Mohon unggah gambar dalam resolusi 1535 x 450 piksel untuk memastikan</Text>
</View>
</Pressable>
)

2
app/(application)/banner/create.tsx
View File

@@ -47,7 +47,7 @@ export default function CreateBanner() {
<Pressable onPress={pickImageAsync} style={[Styles.wrapPaper, Styles.contentItemCenter]}>
<View style={{justifyContent:'center', alignItems:'center'}}>
<Entypo name="image" size={50} color={'#aeaeae'} />
<Text style={[Styles.textInformation]}>Mohon unggah gambar dalam resolusi 1535 x 450 piksel untuk memastikan</Text>
<Text style={[Styles.textInformation, Styles.mt05]}>Mohon unggah gambar dalam resolusi 1535 x 450 piksel untuk memastikan</Text>
</View>
</Pressable>
)

21
app/(application)/division/[id]/(fitur-division)/_layout.tsx Normal file
View File

@@ -0,0 +1,21 @@
import ButtonBackHeader from "@/components/buttonBackHeader"
import HeaderRightTaskList from "@/components/task/headerTaskList"
import { Headers } from "@/constants/Headers"
import { router, Stack } from "expo-router"
import { StatusBar } from "expo-status-bar"
export default function RootLayout() {
return (
<>
<Stack screenOptions={Headers.shadow}>
<Stack.Screen name="task/index" options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
title: 'Tugas Divisi',
headerTitleAlign: 'center',
headerRight: () => <HeaderRightTaskList />
}} />
</Stack>
<StatusBar style="light" />
</>
)
}

58
app/(application)/division/[id]/(fitur-division)/task/[detail]/add-file.tsx Normal file
View File

@@ -0,0 +1,58 @@
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 TaskDivisionAddFile() {
const { id, detail } = 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('./')
}
})
}} />
</View>
</ScrollView>
</SafeAreaView>
)
}

74
app/(application)/division/[id]/(fitur-division)/task/[detail]/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, View, ToastAndroid, Text } from "react-native";
import DateTimePicker, { DateType, getDefaultStyles } from "react-native-ui-datepicker";
export default function TaskDivisionAddTask() {
const { id, detail } = 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('./')
}
})
}} />
</View>
</ScrollView>
</SafeAreaView>
)
}

39
app/(application)/division/[id]/(fitur-division)/task/[detail]/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 TaskDivisionCancel(){
const { id, detail } = useLocalSearchParams()
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Pembatalan Tugas',
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 tugas? Pembatalan bersifat permanen',
onPress: () => {
ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
router.push('./')
}
})
}} />
</View>
</ScrollView>
</SafeAreaView>
)
}

39
app/(application)/division/[id]/(fitur-division)/task/[detail]/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 TaskDivisionEdit() {
const { id, detail } = useLocalSearchParams()
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Edit Judul Tugas',
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('./')
}
})
}} />
</View>
</ScrollView>
</SafeAreaView>
)
}

35
app/(application)/division/[id]/(fitur-division)/task/[detail]/index.tsx Normal file
View File

@@ -0,0 +1,35 @@
import ButtonBackHeader from "@/components/buttonBackHeader";
import SectionFile from "@/components/sectionFile";
import SectionMember from "@/components/sectionMember";
import SectionProgress from "@/components/sectionProgress";
import SectionTanggalTugas from "@/components/sectionTanggalTugas";
import HeaderRightTaskDetail from "@/components/task/headerTaskDetail";
import Styles from "@/constants/Styles";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { SafeAreaView, ScrollView, View } from "react-native";
export default function DetailTaskDivision() {
const { id, detail } = useLocalSearchParams()
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Judul Tugas',
headerTitleAlign: 'center',
headerRight: () => <HeaderRightTaskDetail id={detail} />,
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<SectionProgress text="Kemajuan Kegiatan 50%" />
<SectionTanggalTugas />
<SectionFile />
<SectionMember />
</View>
</ScrollView>
</SafeAreaView>
)
}

44
app/(application)/division/[id]/(fitur-division)/task/create.tsx Normal file
View File

@@ -0,0 +1,44 @@
import AlertKonfirmasi from "@/components/alertKonfirmasi";
import ButtonBackHeader from "@/components/buttonBackHeader";
import { ButtonForm } from "@/components/buttonForm";
import ButtonSelect from "@/components/buttonSelect";
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 CreateTaskDivision() {
const { id } = useLocalSearchParams()
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: `Tambah Tugas`,
headerTitleAlign: 'center',
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<InputForm label="Judul Tugas" type="default" placeholder="Judul Tugas" required />
<ButtonSelect value="Tambah Tanggal & Tugas" />
<ButtonSelect value="Upload File" />
<ButtonSelect value="Tambah Anggota" />
<ButtonForm
text="SIMPAN"
onPress={() => {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin menambahkan data?',
onPress: () => {
ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
router.push('../task?status=0')
}
})
}} />
</View>
</ScrollView>
</SafeAreaView>
)
}

134
app/(application)/division/[id]/(fitur-division)/task/index.tsx Normal file
View File

@@ -0,0 +1,134 @@
import BorderBottomItem from "@/components/borderBottomItem";
import ButtonTab from "@/components/buttonTab";
import InputSearch from "@/components/inputSearch";
import LabelStatus from "@/components/labelStatus";
import PaperGridContent from "@/components/paperGridContent";
import ProgressBar from "@/components/progressBar";
import { ColorsStatus } from "@/constants/ColorsStatus";
import Styles from "@/constants/Styles";
import { AntDesign, Ionicons, 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 ListTask() {
const { status } = useLocalSearchParams<{ status: string }>()
const [isList, setList] = useState(false)
return (
<SafeAreaView>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<ScrollView horizontal style={[Styles.mb10]}>
<ButtonTab
active={status}
value="0"
onPress={() => { router.push('./task?status=0') }}
label="Segera"
icon={<MaterialCommunityIcons name="clock-alert-outline" color={status == "0" ? 'white' : 'black'} size={20} />}
n={4} />
<ButtonTab
active={status}
value="1"
onPress={() => { router.push('./task?status=1') }}
label="Dikerjakan"
icon={<MaterialCommunityIcons name="progress-check" color={status == "1" ? 'white' : 'black'} size={20} />}
n={4} />
<ButtonTab
active={status}
value="2"
onPress={() => { router.push('./task?status=2') }}
label="Selesai"
icon={<Ionicons name="checkmark-done-circle-outline" color={status == "2" ? 'white' : 'black'} size={20} />}
n={4} />
<ButtonTab
active={status}
value="3"
onPress={() => { router.push('./task?status=3') }}
label="Batal"
icon={<AntDesign name="closecircleo" color={status == "3" ? 'white' : 'black'} size={20} />}
n={4} />
</ScrollView>
<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>
{
isList
?
<View>
<BorderBottomItem
onPress={() => { }}
borderType="bottom"
icon={
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
<AntDesign name="areachart" size={25} color={'#384288'} />
</View>
}
title="Pembangunan Jembatan"
/>
<BorderBottomItem
onPress={() => { }}
borderType="bottom"
icon={
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
<AntDesign name="areachart" size={25} color={'#384288'} />
</View>
}
title="Pembangunan Jembatan"
/>
<BorderBottomItem
onPress={() => { }}
borderType="bottom"
icon={
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
<AntDesign name="areachart" size={25} color={'#384288'} />
</View>
}
title="Pembangunan Jembatan"
/>
<BorderBottomItem
onPress={() => { }}
borderType="bottom"
icon={
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
<AntDesign name="areachart" size={25} color={'#384288'} />
</View>
}
title="Pembangunan Jembatan"
/>
</View>
:
<View>
<PaperGridContent onPress={() => { router.push('./task/321') }} content="page" title="Pembangunan Jembatan" headerColor="primary">
<ProgressBar />
<View style={[Styles.rowSpaceBetween]}>
<Text style={[Styles.textDefault, Styles.cGray]}>13 Februari 2025</Text>
<LabelStatus size="default" category="primary" text="SEGERA" />
</View>
</PaperGridContent>
<PaperGridContent content="page" title="Pembangunan Jembatan" headerColor="primary">
<ProgressBar />
<View style={[Styles.rowSpaceBetween]}>
<Text style={[Styles.textDefault, Styles.cGray]}>13 Februari 2025</Text>
<LabelStatus size="default" category="primary" text="SEGERA" />
</View>
</PaperGridContent>
<PaperGridContent content="page" title="Pembangunan Jembatan" headerColor="primary">
<ProgressBar />
<View style={[Styles.rowSpaceBetween]}>
<Text style={[Styles.textDefault, Styles.cGray]}>13 Februari 2025</Text>
<LabelStatus size="default" category="primary" text="SEGERA" />
</View>
</PaperGridContent>
</View>
}
</View>
</ScrollView>
</SafeAreaView>
)
}

41
app/(application)/division/[id]/edit.tsx Normal file
View File

@@ -0,0 +1,41 @@
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 EditDivision() {
const { id } = useLocalSearchParams()
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Edit Divisi',
headerTitleAlign: 'center',
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<InputForm label="Nama Divisi" type="default" placeholder="Nama Divisi" required />
<InputForm label="Deskripsi" type="default" placeholder="Deskripsi Divisi" />
<ButtonForm
text="SIMPAN"
onPress={() => {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin mengubah data?',
onPress: () => {
ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
router.push('/division/123/info')
}
})
}} />
</View>
</ScrollView>
</SafeAreaView>
)
}

160
app/(application)/division/[id]/info.tsx Normal file
View File

@@ -0,0 +1,160 @@
import AlertKonfirmasi from "@/components/alertKonfirmasi"
import BorderBottomItem from "@/components/borderBottomItem"
import ButtonBackHeader from "@/components/buttonBackHeader"
import HeaderRightDivisionInfo from "@/components/division/headerDivisionInfo"
import DrawerBottom from "@/components/drawerBottom"
import { ColorsStatus } from "@/constants/ColorsStatus"
import Styles from "@/constants/Styles"
import { Feather, MaterialCommunityIcons, MaterialIcons } from "@expo/vector-icons"
import { router, Stack, useLocalSearchParams } from "expo-router"
import { useState } from "react"
import { Image, Pressable, SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native"
export default function InformationDivision() {
const { id } = useLocalSearchParams()
const [isModal, setModal] = useState(false)
function handleMemberOut() {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin mengeluarkan anggota?',
onPress: () => {
ToastAndroid.show('Berhasil mengeluarkan anggota', ToastAndroid.SHORT)
setModal(false)
}
})
}
function handleMemberAdmin() {
ToastAndroid.show('Berhasil memberhentikan admin', ToastAndroid.SHORT)
setModal(false)
}
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Informasi Divisi',
headerTitleAlign: 'center',
headerRight: () => <HeaderRightDivisionInfo id={id} />,
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mb05]}>Deskripsi Divisi</Text>
<View style={[Styles.wrapPaper]}>
<Text>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</Text>
</View>
</View>
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefault, Styles.mv05]}>5 Anggota</Text>
<View style={[Styles.wrapPaper]}>
<BorderBottomItem
borderType="none"
icon={
<View style={[Styles.iconContent, ColorsStatus.gray]}>
<Feather name="user-plus" size={25} color={'#384288'} />
</View>
}
title="Tambah Anggota"
/>
<BorderBottomItem
borderType="bottom"
onPress={() => { setModal(true) }}
icon={
<Image
source={require("../../../../assets/images/user.jpeg")}
style={[Styles.userProfileSmall]}
/>
}
title="Amalia Dwi"
rightTopInfo="Admin"
/>
<BorderBottomItem
borderType="bottom"
onPress={() => { setModal(true) }}
icon={
<Image
source={require("../../../../assets/images/user.jpeg")}
style={[Styles.userProfileSmall]}
/>
}
title="Amalia Dwi"
rightTopInfo="Admin"
/>
<BorderBottomItem
borderType="bottom"
onPress={() => { setModal(true) }}
icon={
<Image
source={require("../../../../assets/images/user.jpeg")}
style={[Styles.userProfileSmall]}
/>
}
title="Amalia Dwi"
rightTopInfo="Anggota"
/>
<BorderBottomItem
borderType="bottom"
onPress={() => { setModal(true) }}
icon={
<Image
source={require("../../../../assets/images/user.jpeg")}
style={[Styles.userProfileSmall]}
/>
}
title="Amalia Dwi"
rightTopInfo="Anggota"
/>
<BorderBottomItem
borderType="bottom"
onPress={() => { setModal(true) }}
icon={
<Image
source={require("../../../../assets/images/user.jpeg")}
style={[Styles.userProfileSmall]}
/>
}
title="Amalia Dwi"
rightTopInfo="Anggota"
/>
</View>
</View>
</View>
</ScrollView>
<DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Amalia">
<View>
<Pressable style={[Styles.wrapItemBorderBottom]} onPress={() => { handleMemberAdmin() }}>
<View style={[Styles.rowItemsCenter]}>
<View style={[Styles.iconContent, ColorsStatus.info]}>
<MaterialIcons name="verified-user" size={25} color='#19345E' />
</View>
<View style={[Styles.rowSpaceBetween, { width: '88%' }]}>
<View style={[Styles.ml10]}>
<Text style={[Styles.textDefault]}>Memberhentikan sebagai admin</Text>
</View>
</View>
</View>
</Pressable>
<Pressable style={[Styles.wrapItemBorderBottom]} onPress={() => { handleMemberOut() }}>
<View style={[Styles.rowItemsCenter]}>
<View style={[Styles.iconContent, ColorsStatus.info]}>
<MaterialCommunityIcons name="close-circle" size={25} color='#19345E' />
</View>
<View style={[Styles.rowSpaceBetween, { width: '88%' }]}>
<View style={[Styles.ml10]}>
<Text style={[Styles.textDefault]}>Keluarkan dari divisi</Text>
</View>
</View>
</View>
</Pressable>
</View>
</DrawerBottom>
</SafeAreaView>
)
}

33
app/(application)/division/[id]/report.tsx Normal file
View File

@@ -0,0 +1,33 @@
import ButtonBackHeader from "@/components/buttonBackHeader"
import ReportChartDocument from "@/components/division/reportChartDocument"
import ReportChartEvent from "@/components/division/reportChartEvent"
import ReportChartProgress from "@/components/division/reportChartProgress"
import { InputForm } from "@/components/inputForm"
import Styles from "@/constants/Styles"
import { router, Stack, useLocalSearchParams } from "expo-router"
import { SafeAreaView, ScrollView, View } from "react-native"
export default function ReportDivision() {
const { id } = useLocalSearchParams()
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Laporan Divisi',
headerTitleAlign: 'center',
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<InputForm bg="white" label="Tanggal Awal" type="default" placeholder="Pilih Tanggal Awal" required />
<InputForm bg="white" label="Tanggal Akhir" type="default" placeholder="Pilih Tanggal Akhir" required />
<ReportChartProgress />
<ReportChartDocument />
<ReportChartEvent />
</View>
</ScrollView>
</SafeAreaView>
)
}

46
app/(application)/division/create.tsx Normal file
View File

@@ -0,0 +1,46 @@
import AlertKonfirmasi from "@/components/alertKonfirmasi"
import ButtonBackHeader from "@/components/buttonBackHeader"
import { ButtonForm } from "@/components/buttonForm"
import ButtonSelect from "@/components/buttonSelect"
import { InputForm } from "@/components/inputForm"
import SelectForm from "@/components/selectForm"
import Styles from "@/constants/Styles"
import { router, Stack } from "expo-router"
import { useState } from "react"
import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native"
export default function CreateDivision() {
const [chooseGroup, setChooseGroup] = useState({ val: '', label: '' })
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Tambah Divisi',
headerTitleAlign: 'center',
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<SelectForm label="Lembaga Desa" placeholder="Pilih Lembaga Desa" value={chooseGroup.label} required onPress={() => { }} />
<InputForm label="Nama Divisi" type="default" placeholder="Nama Divisi" required />
<InputForm label="Deskripsi" type="default" placeholder="Deskripsi Divisi" />
<ButtonSelect value="Pilih Anggota" />
<ButtonForm
text="SIMPAN"
onPress={() => {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin menambahkan data?',
onPress: () => {
ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
router.push('/division/123')
}
})
}} />
</View>
</ScrollView>
</SafeAreaView>
)
}

36
app/(application)/division/report.tsx Normal file
View File

@@ -0,0 +1,36 @@
import ButtonBackHeader from "@/components/buttonBackHeader";
import ReportChartDocument from "@/components/division/reportChartDocument";
import ReportChartEvent from "@/components/division/reportChartEvent";
import ReportChartProgress from "@/components/division/reportChartProgress";
import { InputForm } from "@/components/inputForm";
import SelectForm from "@/components/selectForm";
import Styles from "@/constants/Styles";
import { router, Stack } from "expo-router";
import { useState } from "react";
import { SafeAreaView, ScrollView, View } from "react-native";
export default function Report() {
const [chooseGroup, setChooseGroup] = useState({ val: '', label: '' })
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Laporan Divisi',
headerTitleAlign: 'center',
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<SelectForm bg="white" label="Lembaga Desa" placeholder="Pilih Lembaga Desa" value={chooseGroup.label} required onPress={() => { }} />
<InputForm bg="white" label="Tanggal Awal" type="default" placeholder="Pilih Tanggal Awal" required />
<InputForm bg="white" label="Tanggal Akhir" type="default" placeholder="Pilih Tanggal Akhir" required />
<ReportChartProgress />
<ReportChartDocument />
<ReportChartEvent />
</View>
</ScrollView>
</SafeAreaView>
)
}

2
app/verification.tsx
View File

@@ -46,7 +46,7 @@ export default function Index() {
)}
/>
<ButtonForm text="SUBMIT" onPress={() => { router.push("/home") }} />
<Text style={[Styles.textInformation, Styles.cDefault, { textAlign: 'center' }]}>
<Text style={[Styles.textInformation, Styles.mt05, Styles.cDefault, { textAlign: 'center' }]}>
Tidak Menerima kode verifikasi? Kirim Ulang
</Text>
</SafeAreaView>

4
components/borderBottomItem.tsx
View File

@@ -41,7 +41,7 @@ export default function BorderBottomItem({ title, subtitle, icon, desc, onPress,
}
</View>
{
rightTopInfo && <Text style={[Styles.textInformation]}>{rightTopInfo}</Text>
rightTopInfo && <Text style={[Styles.textInformation, Styles.mt05]}>{rightTopInfo}</Text>
}
</View>
@@ -59,7 +59,7 @@ export default function BorderBottomItem({ title, subtitle, icon, desc, onPress,
}
{
typeof rightBottomInfo == 'string' ?
<Text style={[Styles.textInformation, Styles.cGray, { textAlign: 'right' }]}>{rightBottomInfo}</Text>
<Text style={[Styles.textInformation, Styles.mt05, Styles.cGray, { textAlign: 'right' }]}>{rightBottomInfo}</Text>
:
rightBottomInfo
}

20
components/division/fileDivisionDetail.tsx
View File

@@ -16,7 +16,7 @@ export default function FileDivisionDetail() {
<Carousel
ref={ref}
width={width}
height={100}
height={115}
data={data}
loop={true}
autoPlay={false}
@@ -24,12 +24,22 @@ export default function FileDivisionDetail() {
pagingEnabled={true}
snapEnabled={true}
vertical={false}
style={{
width: width,
}}
mode="parallax"
modeConfig={{
parallaxScrollingScale: 1,
parallaxScrollingOffset: 280,
}}
renderItem={({ index }) => (
<View style={{ width: '30%' }}>
<View style={[Styles.wrapPaper, { alignItems: 'center' }]}>
<Feather name="file-text" size={50} color="black" style={Styles.mr05} />
<View style={{ margin: 'auto', width:'28%' }}>
<View style={{alignItems:'center'}}>
<View style={[Styles.wrapPaper, { alignItems: 'center' }]}>
<Feather name="file-text" size={50} color="black" style={Styles.mr05} />
</View>
</View>
<Text style={[Styles.textMediumNormal, { textAlign: 'center' }]}>File_Pertama.png</Text>
<Text style={[Styles.textMediumNormal, { textAlign: 'center' }]} numberOfLines={1}>File_Pertama.png Amalia Dwi</Text>
</View>
)}

2
components/division/fiturDivisionDetail.tsx
View File

@@ -3,6 +3,7 @@ import Styles from "@/constants/Styles"
import { AntDesign, MaterialIcons, SimpleLineIcons } from "@expo/vector-icons"
import { Text, View } from "react-native"
import BorderBottomItem from "../borderBottomItem"
import { router } from "expo-router"
export default function FiturDivisionDetail() {
return (
@@ -21,6 +22,7 @@ export default function FiturDivisionDetail() {
title="Tugas"
subtitle='15 Tugas'
width={28}
onPress={() => {router.push('/division/123/task?status=0')}}
/>
<BorderBottomItem

4
components/division/headerDivisionDetail.tsx
View File

@@ -5,6 +5,7 @@ import { View } from "react-native"
import ButtonMenuHeader from "../buttonMenuHeader"
import DrawerBottom from "../drawerBottom"
import MenuItemRow from "../menuItemRow"
import { router } from "expo-router"
type Props = {
id: string | string[]
@@ -23,7 +24,7 @@ export default function HeaderRightDivisionDetail({ id }: Props) {
title="Informasi Divisi"
onPress={() => {
setVisible(false)
// router.push('/project/create')
router.push('/division/123/info')
}}
/>
<MenuItemRow
@@ -31,6 +32,7 @@ export default function HeaderRightDivisionDetail({ id }: Props) {
title="Laporan Divisi"
onPress={() => {
setVisible(false)
router.push('/division/123/report')
}}
/>
</View>

48
components/division/headerDivisionInfo.tsx Normal file
View File

@@ -0,0 +1,48 @@
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 { MaterialCommunityIcons } from "@expo/vector-icons"
import AlertKonfirmasi from "../alertKonfirmasi"
import { router } from "expo-router"
type Props = {
id: string | string[]
}
export default function HeaderRightDivisionInfo({ id }: Props) {
const [isVisible, setVisible] = useState(false)
return (
<>
<ButtonMenuHeader onPress={() => { setVisible(true) }} />
<DrawerBottom animation="slide" isVisible={isVisible} setVisible={setVisible} title="Menu">
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<MaterialCommunityIcons name="pencil-outline" color="black" size={25} />}
title="Edit Divisi"
onPress={() => {
setVisible(false)
router.push(`/division/${id}/edit`)
}}
/>
<MenuItemRow
icon={<MaterialCommunityIcons name="toggle-switch-off-outline" color="black" size={25} />}
title="Non Aktifkan"
onPress={() => {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin menonaktifkan divisi?',
onPress: () => {
setVisible(false)
router.push('/division')
}
})
}}
/>
</View>
</DrawerBottom>
</>
)
}

7
components/division/headerDivisionList.tsx
View File

@@ -6,6 +6,7 @@ import Styles from "@/constants/Styles"
import MenuItemRow from "../menuItemRow"
import { AntDesign, MaterialCommunityIcons } from "@expo/vector-icons"
import ModalFilter from "../modalFilter"
import { router } from "expo-router"
export default function HeaderRightDivisionList() {
const [isVisible, setVisible] = useState(false)
@@ -17,10 +18,10 @@ export default function HeaderRightDivisionList() {
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<AntDesign name="pluscircle" color="black" size={25} />}
title="Tambah Kegiatan"
title="Tambah Divisi"
onPress={() => {
setVisible(false)
// router.push('/project/create')
router.push('/division/create')
}}
/>
<MenuItemRow
@@ -36,7 +37,7 @@ export default function HeaderRightDivisionList() {
title="Laporan"
onPress={() => {
setVisible(false)
// router.push('/project/create')
router.push('/division/report')
}}
/>
</View>

39
components/division/reportChartDocument.tsx Normal file
View File

@@ -0,0 +1,39 @@
import Styles from "@/constants/Styles";
import { Dimensions, Text, View } from "react-native";
import { BarChart } from "react-native-gifted-charts";
export default function ReportChartDocument() {
const barData = [
{ value: 23, label: 'Gambar', frontColor: '#fac858' },
{ value: 12, label: 'Dokumen', frontColor: '#92cc76' },
];
const width = Dimensions.get("window").width;
return (
<View style={[Styles.wrapPaper, Styles.contentItemCenter, Styles.mb15]}>
<Text style={[Styles.textSubtitle, Styles.mv15]}>JUMLAH DOKUMEN</Text>
<BarChart
showFractionalValues={false}
showYAxisIndices
noOfSections={4}
maxValue={25}
data={barData}
isAnimated
width={width - 140}
barWidth={width * 0.25}
renderTooltip={(item: any, index: any) => {
return (
<View
style={{
alignItems: 'center',
justifyContent: 'center',
width: width * 0.25
}}>
<Text>{item.value}</Text>
</View>
);
}}
/>
</View>
)
}

39
components/division/reportChartEvent.tsx Normal file
View File

@@ -0,0 +1,39 @@
import Styles from "@/constants/Styles";
import { Dimensions, Text, View } from "react-native";
import { BarChart } from "react-native-gifted-charts";
export default function ReportChartEvent() {
const width = Dimensions.get("window").width;
const barData = [
{ value: 23, label: 'Akan Datang', frontColor: 'gray' },
{ value: 12, label: 'Selesai', frontColor: '#177AD5' },
];
return (
<View style={[Styles.wrapPaper, Styles.contentItemCenter, Styles.mb15]}>
<Text style={[Styles.textSubtitle, Styles.mv15]}>ACARA DIVISI</Text>
<BarChart
showFractionalValues={false}
showYAxisIndices
noOfSections={4}
maxValue={25}
data={barData}
isAnimated
width={width - 140}
barWidth={width * 0.25}
renderTooltip={(item: any, index: any) => {
return (
<View
style={{
alignItems: 'center',
justifyContent: 'center',
width: width * 0.25
}}>
<Text>{item.value}</Text>
</View>
);
}}
/>
</View>
)
}

31
components/division/reportChartProgress.tsx Normal file
View File

@@ -0,0 +1,31 @@
import Styles from "@/constants/Styles";
import { Text, View } from "react-native";
import { PieChart } from "react-native-gifted-charts";
export default function ReportChartProgress() {
const pieData = [
{ value: 54, text: "54%", color: '#177AD5' },
{ value: 40, text: "40%", color: '#92cc76' },
{ value: 20, text: "20%", color: '#ED6665' },
{ value: 0, text: "0%", color: '#fac858' },
];
return (
<View style={[Styles.wrapPaper, Styles.contentItemCenter, Styles.mb15]}>
<Text style={[Styles.textSubtitle, Styles.mv15]}>PROGRES KEGIATAN</Text>
<PieChart
data={pieData}
showText
showValuesAsTooltipText
textColor="black"
radius={120}
textSize={15}
focusOnPress={false}
showValuesAsLabels
showTextBackground={false}
textBackgroundRadius={0}
isAnimated
/>
</View>
)
}

5
components/division/taskDivisionDetail.tsx
View File

@@ -14,7 +14,8 @@ export default function TaskDivisionDetail() {
<Text style={[Styles.textDefaultSemiBold, Styles.mb05]}>Tugas Hari Ini</Text>
<Carousel
ref={ref}
width={width}
style={{ width: "100%" }}
width={width * 0.8}
height={100}
data={data}
loop={true}
@@ -24,7 +25,7 @@ export default function TaskDivisionDetail() {
snapEnabled={true}
vertical={false}
renderItem={({ index }) => (
<View style={[Styles.wrapPaper, { width: '80%'}]}>
<View style={[Styles.wrapPaper, { width: '95%'}]}>
<Text style={[Styles.textDefaultSemiBold]}>Rancangan Laporan - Laporan 1</Text>
<View style={[Styles.rowItemsCenter, Styles.mt10]}>
<Feather name="clock" size={18} color="grey" style={Styles.mr05} />

3
components/home/divisionHome.tsx
View File

@@ -15,7 +15,8 @@ export default function DivisionHome() {
<Text style={[Styles.textDefaultSemiBold, Styles.mv10]}>Divisi Teraktif</Text>
<Carousel
ref={ref}
width={width}
style={{ width: "100%" }}
width={width * 0.8}
height={235}
data={data}
loop={true}

3
components/home/projectHome.tsx
View File

@@ -16,7 +16,8 @@ export default function ProjectHome() {
<Text style={[Styles.textDefaultSemiBold, Styles.mv10]}>Kegiatan Terupdate</Text>
<Carousel
ref={ref}
width={width}
style={{ width: "100%" }}
width={width * 0.8}
height={235}
data={data}
loop={true}

8
components/inputForm.tsx
View File

@@ -41,8 +41,8 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
style={{ width: width && lebar * width / 100}}
/>
</View>
{error && (<Text style={[Styles.textInformation, Styles.cError]}>{errorText}</Text>)}
{info != undefined && (<Text style={[Styles.textInformation, Styles.cGray]}>{info}</Text>)}
{error && (<Text style={[Styles.textInformation, Styles.cError, Styles.mt05]}>{errorText}</Text>)}
{info != undefined && (<Text style={[Styles.textInformation, Styles.cGray, Styles.mt05]}>{info}</Text>)}
</View>
)
}
@@ -65,8 +65,8 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
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>)}
{info != undefined && (<Text style={[Styles.textInformation, , Styles.cGray]}>{info}</Text>)}
{error && (<Text style={[Styles.textInformation, Styles.cError, Styles.mt05]}>{errorText}</Text>)}
{info != undefined && (<Text style={[Styles.textInformation, Styles.mt05 , Styles.cGray]}>{info}</Text>)}
</View>
)
}

9
components/selectForm.tsx
View File

@@ -14,9 +14,10 @@ type Props = {
errorText?: string;
required?: boolean;
round?: boolean
bg?: 'white' | 'transparent'
};
export default function SelectForm({ label, value, placeholder, onPress, info, error, errorText, required, itemLeft, round }: Props) {
export default function SelectForm({ label, value, placeholder, onPress, info, error, errorText, required, itemLeft, round, bg }: Props) {
return (
<View style={[Styles.mb10]}>
{
@@ -28,7 +29,7 @@ export default function SelectForm({ label, value, placeholder, onPress, info, e
)
}
<Pressable onPressOut={onPress}>
<View style={[Styles.inputRoundForm, Styles.inputRoundFormRight, error && { borderColor: "red" }, round && Styles.round30, Styles.pv10]}>
<View style={[Styles.inputRoundForm, Styles.inputRoundFormRight, error && { borderColor: "red" }, round && Styles.round30, Styles.pv10, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }]}>
<Feather name="chevron-right" size={20} color="grey" />
{
value ? (
@@ -39,8 +40,8 @@ export default function SelectForm({ label, value, placeholder, onPress, info, e
}
</View>
</Pressable>
{error && (<Text style={[Styles.textInformation, Styles.cError]}>{errorText}</Text>)}
{info != undefined && (<Text style={[Styles.textInformation, , Styles.cGray]}>{info}</Text>)}
{error && (<Text style={[Styles.textInformation, Styles.mt05, Styles.cError]}>{errorText}</Text>)}
{info != undefined && (<Text style={[Styles.textInformation, Styles.mt05, Styles.cGray]}>{info}</Text>)}
</View>
)
}

70
components/task/headerTaskDetail.tsx Normal file
View File

@@ -0,0 +1,70 @@
import Styles from "@/constants/Styles"
import { AntDesign, MaterialCommunityIcons, MaterialIcons } from "@expo/vector-icons"
import { useState } from "react"
import { View } from "react-native"
import ButtonMenuHeader from "../buttonMenuHeader"
import DrawerBottom from "../drawerBottom"
import MenuItemRow from "../menuItemRow"
import { router } from "expo-router"
type Props = {
id: string | string[]
}
export default function HeaderRightTaskDetail({ id }: Props) {
const [isVisible, setVisible] = 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 Tugas"
onPress={() => {
setVisible(false)
router.push(`./${id}/add-task`)
}}
/>
<MenuItemRow
icon={<MaterialCommunityIcons name="file-plus" color="black" size={25} />}
title="Tambah File"
onPress={() => {
setVisible(false)
router.push(`./${id}/add-file`)
}}
/>
<MenuItemRow
icon={<MaterialIcons name="groups" color="black" size={25} />}
title="Tambah Anggota"
onPress={() => {
// setVisible(false)
}}
/>
</View>
<View style={[Styles.rowItemsCenter, Styles.mt15]}>
<MenuItemRow
icon={<MaterialCommunityIcons name="pencil-outline" color="black" size={25} />}
title="Edit"
onPress={() => {
setVisible(false)
router.push(`./${id}/edit`)
}}
/>
<MenuItemRow
icon={<MaterialIcons name="close" color="black" size={25} />}
title="Batal"
onPress={() => {
setVisible(false)
router.push(`./${id}/cancel`)
}}
/>
</View>
</DrawerBottom>
</>
)
}

29
components/task/headerTaskList.tsx Normal file
View File

@@ -0,0 +1,29 @@
import Styles from "@/constants/Styles"
import { AntDesign } from "@expo/vector-icons"
import { useState } from "react"
import { View } from "react-native"
import ButtonMenuHeader from "../buttonMenuHeader"
import DrawerBottom from "../drawerBottom"
import MenuItemRow from "../menuItemRow"
import { router } from "expo-router"
export default function HeaderRightTaskList() {
const [isVisible, setVisible] = 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 Tugas Divisi"
onPress={() => {
setVisible(false)
router.push('./task/create')
}}
/>
</View>
</DrawerBottom>
</>
)
}

2
constants/ColorsStatus.ts
View File

@@ -6,7 +6,7 @@ export const ColorsStatus = {
backgroundColor: '#40c057'
},
info: {
backgroundColor: 'blue'
backgroundColor: '#eaf3fd'
},
warning: {
backgroundColor: '#FCAA4B'

3
constants/Styles.ts
View File

@@ -46,7 +46,6 @@ const Styles = StyleSheet.create({
textInformation: {
fontSize: 12,
fontWeight: 'light',
marginTop: 5,
},
cError: {
color: '#DB1514'
@@ -223,7 +222,7 @@ const Styles = StyleSheet.create({
marginBottom:15
},
wrapGridCaraousel: {
width: '80%',
width: '95%',
height: 200,
shadowColor: '#171717',
shadowOffset: { width: -2, height: 4 },