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

upd: project

Browse Source 
Deskripsi:
- detail project
- batal project
- edit project
- tambah tugas project
- update status tugas project

No Issues'
This commit is contained in:
amel
2025-05-09 17:36:22 +08:00
parent c04c1de119
commit a9368e3e32
19 changed files with 1013 additions and 265 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,9 +1,9 @@
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 SectionFileTask from "@/components/task/sectionFileTask";
import SectionMemberTask from "@/components/task/sectionMemberTask";
import SectionTanggalTugasTask from "@/components/task/sectionTanggalTugasTask";
import Styles from "@/constants/Styles";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { SafeAreaView, ScrollView, View } from "react-native";
@@ -24,10 +24,10 @@ export default function DetailTaskDivision() {
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<SectionProgress text="Kemajuan Kegiatan 50%" />
<SectionTanggalTugas category="task" />
<SectionFile />
<SectionMember />
<SectionProgress text="Kemajuan Kegiatan 50%" progress={50} />
<SectionTanggalTugasTask />
<SectionFileTask />
<SectionMemberTask />
</View>
</ScrollView>
</SafeAreaView>

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

@@ -1,35 +1,104 @@
import ButtonBackHeader from "@/components/buttonBackHeader"
import ButtonSaveHeader from "@/components/buttonSaveHeader"
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'
import ButtonBackHeader from "@/components/buttonBackHeader";
import ButtonSaveHeader from "@/components/buttonSaveHeader";
import { InputForm } from "@/components/inputForm";
import Styles from "@/constants/Styles";
import { apiCreateProjectTask } from "@/lib/api";
import { setUpdateProject } from "@/lib/projectUpdate";
import { useAuthSession } from "@/providers/AuthProvider";
import dayjs from "dayjs";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import {
SafeAreaView,
ScrollView,
Text,
ToastAndroid,
View,
} from "react-native";
import DateTimePicker, {
DateType
} from "react-native-ui-datepicker";
import { useDispatch, useSelector } from "react-redux";
export default function ProjectAddTask() {
const { id } = useLocalSearchParams()
const [range, setRange] = useState<{ startDate: DateType; endDate: DateType; }>({ startDate: undefined, endDate: undefined });
const defaultStyles = getDefaultStyles()
const { token, decryptToken } = useAuthSession()
const dispatch = useDispatch()
const update = useSelector((state: any) => state.projectUpdate)
const { id } = useLocalSearchParams<{ id: string }>();
const [disable, setDisable] = useState(true);
const [range, setRange] = useState<{
startDate: DateType;
endDate: DateType;
}>({ startDate: undefined, endDate: undefined });
const [error, setError] = useState({
startDate: false,
endDate: false,
title: false,
})
const [title, setTitle] = useState('');
const from = range.startDate
? dayjs(range.startDate).format('MMM DD, YYYY')
: '';
const to = range.endDate ? dayjs(range.endDate).format('MMM DD, YYYY') : '';
? dayjs(range.startDate).format("DD-MM-YYYY")
: "";
const to = range.endDate ? dayjs(range.endDate).format("DD-MM-YYYY") : "";
function checkAll() {
if (from == "" || to == "" || title == "" || title == "null" || error.startDate || error.endDate || error.title) {
setDisable(true)
} else {
setDisable(false)
}
}
function onValidation(cat: string, val: string) {
if (cat == "title") {
setTitle(val)
if (val == "" || val == "null") {
setError(error => ({ ...error, title: true }))
} else {
setError(error => ({ ...error, title: false }))
}
}
}
useEffect(() => {
checkAll()
}, [from, to, title, error])
async function handleCreate() {
try {
const hasil = await decryptToken(String(token?.current));
const response = await apiCreateProjectTask({ data: { name: title, dateStart: new Date(from), dateEnd: new Date(to), user: hasil }, id });
if (response.success) {
dispatch(setUpdateProject({ ...update, task: !update.task, progress: !update.progress }))
ToastAndroid.show("Berhasil menambah data", ToastAndroid.SHORT);
router.back();
}
} catch (error) {
console.error(error);
}
}
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Tambah Tugas',
headerTitleAlign: 'center',
headerRight: () => <ButtonSaveHeader category="create" onPress={() => {
ToastAndroid.show('Berhasil menambah data', ToastAndroid.SHORT)
router.push('/project/4324')
}} />
headerLeft: () => (
<ButtonBackHeader
onPress={() => {
router.back();
}}
/>
),
headerTitle: "Tambah Tugas",
headerTitleAlign: "center",
headerRight: () => (
<ButtonSaveHeader
disable={disable}
category="create"
onPress={() => { handleCreate() }}
/>
),
}}
/>
<ScrollView>
@@ -40,7 +109,6 @@ export default function ProjectAddTask() {
startDate={range.startDate}
endDate={range.endDate}
onChange={(param) => setRange(param)}
// styles={defaultStyles}
styles={{
selected: Styles.selectedDate,
selected_label: Styles.cWhite,
@@ -48,35 +116,44 @@ export default function ProjectAddTask() {
}}
/>
</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 style={[Styles.mv10]}>
<View style={[Styles.rowSpaceBetween]}>
<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>
{
(error.endDate || error.startDate) && <Text style={[Styles.textInformation, Styles.cError, Styles.mt05]}>Tanggal tidak boleh kosong</Text>
}
</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')
}
})
}} /> */}
<InputForm
label="Judul Tugas"
type="default"
placeholder="Judul Tugas"
required
bg="white"
value={title}
error={error.title}
errorText="Judul tidak boleh kosong"
onChange={(e) => {
onValidation("title", e)
}}
/>
</View>
</ScrollView>
</SafeAreaView>
)
}
);
}

117
app/(application)/project/[id]/cancel.tsx
View File

@@ -1,42 +1,101 @@
import ButtonBackHeader from "@/components/buttonBackHeader"
import ButtonSaveHeader from "@/components/buttonSaveHeader"
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"
import ButtonBackHeader from "@/components/buttonBackHeader";
import ButtonSaveHeader from "@/components/buttonSaveHeader";
import { InputForm } from "@/components/inputForm";
import Styles from "@/constants/Styles";
import { apiCancelProject } from "@/lib/api";
import { setUpdateProject } from "@/lib/projectUpdate";
import { useAuthSession } from "@/providers/AuthProvider";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native";
import { useDispatch, useSelector } from "react-redux";
export default function ProjectCancel() {
const { id } = useLocalSearchParams()
const { token, decryptToken } = useAuthSession();
const { id } = useLocalSearchParams<{ id: string }>();
const dispatch = useDispatch();
const update = useSelector((state: any) => state.projectUpdate);
const [reason, setReason] = useState("");
const [error, setError] = useState(false);
const [disable, setDisable] = useState(false);
function onValidation(val: string) {
setReason(val)
if (val == "" || val == "null") {
setError(true)
}else{
setError(false)
}
}
function checkAll() {
if (reason == "" || reason == "null" || error) {
setDisable(true)
} else {
setDisable(false)
}
}
useEffect(() => {
checkAll()
}, [reason, error]);
async function handleCancel() {
try {
const hasil = await decryptToken(String(token?.current));
const response = await apiCancelProject({
reason: reason,
user: hasil,
}, id);
if (response.success) {
dispatch(setUpdateProject({ ...update, data: !update.data }))
ToastAndroid.show("Berhasil membatalkan kegiatan", ToastAndroid.SHORT);
router.back();
}
} catch (error) {
console.error(error);
}
}
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Pembatalan Kegiatan',
headerTitleAlign: 'center',
headerRight: () => <ButtonSaveHeader category="cancel" onPress={() => {
ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
router.push('/project/4324')
}} />
headerLeft: () => (
<ButtonBackHeader
onPress={() => {
router.back();
}}
/>
),
headerTitle: "Pembatalan Kegiatan",
headerTitleAlign: "center",
headerRight: () => (
<ButtonSaveHeader
disable={disable}
category="cancel"
onPress={() => {
handleCancel();
}}
/>
),
}}
/>
<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')
}
})
}} /> */}
<InputForm
label="Alasan Pembatalan"
type="default"
placeholder="Alasan Pembatalan"
required
bg="white"
error={error}
errorText="Alasan pembatalan harus diisi"
onChange={(val) => onValidation(val)}
/>
</View>
</ScrollView>
</SafeAreaView>
)
}
);
}

133
app/(application)/project/[id]/edit.tsx
View File

@@ -1,42 +1,117 @@
import ButtonBackHeader from "@/components/buttonBackHeader"
import ButtonSaveHeader from "@/components/buttonSaveHeader"
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"
import ButtonBackHeader from "@/components/buttonBackHeader";
import ButtonSaveHeader from "@/components/buttonSaveHeader";
import { InputForm } from "@/components/inputForm";
import Styles from "@/constants/Styles";
import { apiEditProject, apiGetProjectOne } from "@/lib/api";
import { setUpdateProject } from "@/lib/projectUpdate";
import { useAuthSession } from "@/providers/AuthProvider";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native";
import { useDispatch, useSelector } from "react-redux";
export default function EditProject() {
const { id } = useLocalSearchParams()
const { token, decryptToken } = useAuthSession();
const { id } = useLocalSearchParams<{ id: string }>();
const dispatch = useDispatch()
const update = useSelector((state: any) => state.projectUpdate)
const [judul, setJudul] = useState("");
const [error, setError] = useState(false);
const [disable, setDisable] = useState(false);
async function handleLoad() {
try {
const hasil = await decryptToken(String(token?.current));
const response = await apiGetProjectOne({
user: hasil,
cat: "data",
id: id,
});
setJudul(response.data.title);
} catch (error) {
console.error(error);
}
}
useEffect(() => {
handleLoad();
}, []);
function onValidation(val: string) {
setJudul(val)
if (val == "" || val == "null") {
setError(true)
}
}
function checkAll() {
if (judul == "" || judul == "null" || error) {
setDisable(true)
} else {
setDisable(false)
}
}
useEffect(() => {
checkAll()
}, [judul, error]);
async function handleUpdate() {
try {
const hasil = await decryptToken(String(token?.current));
const response = await apiEditProject({
name: judul,
user: hasil,
}, id);
if (response.success) {
dispatch(setUpdateProject({ ...update, data: !update.data }))
ToastAndroid.show("Berhasil mengubah data", ToastAndroid.SHORT);
router.back();
}
} catch (error) {
console.error(error);
}
}
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Edit Judul Kegiatan',
headerTitleAlign: 'center',
headerRight: () => <ButtonSaveHeader category="update" onPress={() => {
ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
router.push('/project/4324')
}} />
headerLeft: () => (
<ButtonBackHeader
onPress={() => {
router.back();
}}
/>
),
headerTitle: "Edit Judul Kegiatan",
headerTitleAlign: "center",
headerRight: () => (
<ButtonSaveHeader
disable={disable}
category="update"
onPress={() => { handleUpdate() }}
/>
),
}}
/>
<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')
}
})
}} /> */}
<InputForm
label="Judul Kegiatan"
type="default"
placeholder="Judul Kegiatan"
required
bg="white"
value={judul}
onChange={(val) => { onValidation(val) }}
error={error}
errorText="Judul Kegiatan harus diisi"
/>
</View>
</ScrollView>
</SafeAreaView>
)
}
);
}

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

@@ -1,29 +1,78 @@
import ButtonBackHeader from "@/components/buttonBackHeader";
import HeaderRightProjectDetail from "@/components/project/headerProjectDetail";
import SectionFile from "@/components/sectionFile";
import SectionMember from "@/components/sectionMember";
import SectionFile from "@/components/project/sectionFile";
import SectionMember from "@/components/project/sectionMember";
import SectionTanggalTugasProject from "@/components/project/sectionTanggalTugas";
import SectionCancel from "@/components/sectionCancel";
import SectionProgress from "@/components/sectionProgress";
import SectionTanggalTugas from "@/components/sectionTanggalTugas";
import Styles from "@/constants/Styles";
import { apiGetProjectOne } from "@/lib/api";
import { useAuthSession } from "@/providers/AuthProvider";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { SafeAreaView, ScrollView, View } from "react-native";
import { useSelector } from "react-redux";
type Props = {
id: string,
idVillage: string,
idGroup: string,
title: string,
status: number,
desc: string,
reason: string,
isActive: string,
createdBy: string,
createdAt: string,
updatedAt: string,
}
export default function DetailProject() {
const { id } = useLocalSearchParams()
const { token, decryptToken } = useAuthSession()
const { id } = useLocalSearchParams<{ id: string }>();
const [data, setData] = useState<Props>()
const [progress, setProgress] = useState(0)
const [loading, setLoading] = useState(true)
const update = useSelector((state: any) => state.projectUpdate)
async function handleLoad() {
try {
setLoading(true)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetProjectOne({ user: hasil, cat: 'data', id: id })
setData(response.data)
const responseProgress = await apiGetProjectOne({ user: hasil, cat: 'progress', id: id })
setProgress(responseProgress.data.progress)
} catch (error) {
console.error(error)
} finally {
setLoading(false)
}
}
useEffect(() => {
handleLoad()
}, [update.data, update.progress])
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Judul Kegiatan',
headerTitle: loading ? '' : data?.title,
headerTitleAlign: 'center',
headerRight: () => <HeaderRightProjectDetail id={id} />,
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<SectionProgress text="Kemajuan Kegiatan 50%" />
<SectionTanggalTugas category="project" />
{
data?.reason != null && data?.reason != "" && <SectionCancel text={data?.reason} />
}
<SectionProgress text={`Kemajuan Kegiatan ${progress}%`} progress={progress} />
<SectionTanggalTugasProject />
<SectionFile />
<SectionMember />
</View>

166
app/(application)/project/index.tsx
View File

@@ -29,9 +29,10 @@ type Props = {
};
export default function ListProject() {
const { status, group } = useLocalSearchParams<{
const { status, group, cat } = useLocalSearchParams<{
status?: string;
group?: string;
cat?: string;
}>();
const { token, decryptToken } = useAuthSession();
const entityUser = useSelector((state: any) => state.user);
@@ -48,6 +49,7 @@ export default function ListProject() {
status: String(status),
search: search,
group: String(group),
kategori: String(cat),
});
if (response.success) {
@@ -61,7 +63,7 @@ export default function ListProject() {
useEffect(() => {
handleLoad();
}, [status, search, group]);
}, [status, search, group, cat]);
return (
<SafeAreaView>
@@ -73,7 +75,7 @@ export default function ListProject() {
value="0"
onPress={() => {
router.push(
`/project?status=0&group=${group}&search=${search}`
`/project?status=0&group=${group}&search=${search}&cat=${cat}`
);
}}
label="Segera"
@@ -91,7 +93,7 @@ export default function ListProject() {
value="1"
onPress={() => {
router.push(
`/project?status=1&group=${group}&search=${search}`
`/project?status=1&group=${group}&search=${search}&cat=${cat}`
);
}}
label="Dikerjakan"
@@ -109,7 +111,7 @@ export default function ListProject() {
value="2"
onPress={() => {
router.push(
`/project?status=2&group=${group}&search=${search}`
`/project?status=2&group=${group}&search=${search}&cat=${cat}`
);
}}
label="Selesai"
@@ -127,7 +129,7 @@ export default function ListProject() {
value="3"
onPress={() => {
router.push(
`/project?status=3&group=${group}&search=${search}`
`/project?status=3&group=${group}&search=${search}&cat=${cat}`
);
}}
label="Batal"
@@ -155,77 +157,91 @@ export default function ListProject() {
/>
</Pressable>
</View>
{(entityUser.role == "supadmin" ||
entityUser.role == "developer") && (
<View style={[Styles.mv05]}>
<Text>Filter : {nameGroup}</Text>
</View>
)}
{isList ? (
<View>
{data.map((item, index) => {
return (
<BorderBottomItem
key={index}
onPress={() => { }}
borderType="bottom"
icon={
<View
style={[Styles.iconContent, ColorsStatus.lightGreen]}
>
<AntDesign
name="areachart"
size={25}
color={"#384288"}
/>
</View>
}
title={item.title}
/>
);
})}
</View>
) : (
<View>
{data.map((item, index) => {
return (
<PaperGridContent
key={index}
onPress={() => {
router.push(`/project/${item.id}`);
}}
content="page"
title={item.title}
headerColor="primary"
>
<ProgressBar value={item.progress} category="page" />
<View style={[Styles.rowSpaceBetween]}>
<Text style={[Styles.textDefault, Styles.cGray]}>
{item.createdAt}
</Text>
<LabelStatus
size="default"
category={
item.status === 0 ? 'primary' :
item.status === 1 ? 'warning' :
item.status === 2 ? 'success' :
item.status === 3 ? 'error' :
'primary'
}
text={
item.status === 0 ? 'SEGERA' :
item.status === 1 ? 'DIKERJAKAN' :
item.status === 2 ? 'SELESAI' :
item.status === 3 ? 'DIBATALKAN' :
'SEGERA'
<View style={[Styles.mv05]}>
<Text>Filter :
{
(entityUser.role == "supadmin" || entityUser.role == "developer") && nameGroup
}
{
(entityUser.role == 'user' || entityUser.role == 'coadmin')
? (cat == 'null' || cat == 'undefined' || cat == undefined || cat == '' || cat == 'data-saya') ? 'Kegiatan Saya' : 'Semua Kegiatan'
: ''
}
</Text>
</View>
{
data.length > 0
?
isList ? (
<View>
{data.map((item, index) => {
return (
<BorderBottomItem
key={index}
onPress={() => { router.push(`/project/${item.id}`); }}
borderType="bottom"
icon={
<View
style={[Styles.iconContent, ColorsStatus.lightGreen]}
>
<AntDesign
name="areachart"
size={25}
color={"#384288"}
/>
</View>
}
title={item.title}
/>
</View>
</PaperGridContent>
);
})}
</View>
)}
);
})}
</View>
) : (
<View>
{data.map((item, index) => {
return (
<PaperGridContent
key={index}
onPress={() => {
router.push(`/project/${item.id}`);
}}
content="page"
title={item.title}
headerColor="primary"
>
<ProgressBar value={item.progress} category="page" />
<View style={[Styles.rowSpaceBetween]}>
<Text style={[Styles.textDefault, Styles.cGray]}>
{item.createdAt}
</Text>
<LabelStatus
size="default"
category={
item.status === 0 ? 'primary' :
item.status === 1 ? 'warning' :
item.status === 2 ? 'success' :
item.status === 3 ? 'error' :
'primary'
}
text={
item.status === 0 ? 'SEGERA' :
item.status === 1 ? 'DIKERJAKAN' :
item.status === 2 ? 'SELESAI' :
item.status === 3 ? 'DIBATALKAN' :
'SEGERA'
}
/>
</View>
</PaperGridContent>
);
})}
</View>
)
:
<View style={[Styles.mt15]}>
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada kegiatan</Text>
</View>
}
</View>
</ScrollView>
</SafeAreaView>

35
components/modalSelect.tsx
View File

@@ -35,6 +35,16 @@ export default function ModalSelect({ open, close, title, category, idParent, on
const [search, setSearch] = useState('')
const [selectMember, setSelectMember] = useState<any[]>([])
const entitiesMember = useSelector((state: any) => state.memberChoose)
const dataStatus = [
{
val: 0,
label: 'Belum Selesai',
},
{
val: 1,
label: 'Selesai',
}
]
async function handleLoadGroup() {
const hasil = await decryptToken(String(token?.current))
@@ -108,7 +118,7 @@ export default function ModalSelect({ open, close, title, category, idParent, on
}
return (
<DrawerBottom animation="none" isVisible={open} setVisible={close} title={title} height={category == 'gender' ? 25 : category == 'member' ? 100 : 75}>
<DrawerBottom animation="none" isVisible={open} setVisible={close} title={title} height={(category == 'gender' || category == 'status-task') ? 25 : category == 'member' ? 100 : 75}>
{
category == 'member' &&
<>
@@ -166,16 +176,19 @@ export default function ModalSelect({ open, close, title, category, idParent, on
<Text style={[Styles.textDefault, { textAlign: 'center' }]}>Tidak ada data</Text>
:
<>
<Pressable style={[Styles.itemSelectModal]} onPress={() => {
onSelect({ val: 'blm-dikerjakan', label: 'Belum Dikerjakan' })
close(false)
}}>
<Text style={[Styles.textDefaultSemiBold]}>Belum Dikerjakan</Text>
<AntDesign name="check" size={20} />
</Pressable>
<Pressable style={[Styles.itemSelectModal]}>
<Text>Selesai</Text>
</Pressable>
{
dataStatus.map((item: any, index: any) => (
<Pressable key={index} style={[Styles.itemSelectModal]} onPress={() => {
onSelect(item)
close(false)
}}>
<Text style={[chooseValue.val == item.val ? Styles.textDefaultSemiBold : Styles.textDefault]}>{item.label}</Text>
{
valChoose == item.val && <AntDesign name="check" size={20} />
}
</Pressable>
))
}
</>
}

105
components/project/sectionFile.tsx Normal file
View File

@@ -0,0 +1,105 @@
import Styles from "@/constants/Styles";
import { apiGetProjectOne } from "@/lib/api";
import { useAuthSession } from "@/providers/AuthProvider";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
import { useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { Text, ToastAndroid, View } from "react-native";
import AlertKonfirmasi from "../alertKonfirmasi";
import BorderBottomItem from "../borderBottomItem";
import DrawerBottom from "../drawerBottom";
import MenuItemRow from "../menuItemRow";
type Props = {
id: string
name: string
extension: string
idStorage: string
}
export default function SectionFile() {
const [isModal, setModal] = useState(false)
const { token, decryptToken } = useAuthSession();
const { id } = useLocalSearchParams<{ id: string }>();
const [data, setData] = useState<Props[]>([]);
async function handleLoad() {
try {
const hasil = await decryptToken(String(token?.current));
const response = await apiGetProjectOne({
user: hasil,
cat: "file",
id: id,
});
setData(response.data);
} catch (error) {
console.error(error);
}
}
useEffect(() => {
handleLoad();
}, []);
return (
<>
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>File</Text>
<View style={[Styles.wrapPaper]}>
{
data.length > 0 ?
data.map((item, index) => {
return (
<BorderBottomItem
key={index}
borderType="all"
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
title={item.name + '.' + item.extension}
titleWeight="normal"
onPress={() => { setModal(true) }}
/>
)
})
:
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada file</Text>
}
</View>
</View>
<DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Menu">
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<MaterialCommunityIcons name="file-eye" color="black" size={25} />}
title="Lihat File"
onPress={() => {
setModal(false)
}}
/>
<MenuItemRow
icon={<MaterialCommunityIcons name="download" color="black" size={25} />}
title="Download"
onPress={() => {
setModal(false)
}}
/>
<MenuItemRow
icon={<Ionicons name="trash" color="black" size={25} />}
title="Hapus"
onPress={() => {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah Anda yakin ingin menghapus file ini? File yang dihapus tidak dapat dikembalikan',
onPress: () => {
setModal(false)
ToastAndroid.show('Berhasil menghapus data', ToastAndroid.SHORT)
}
})
}}
/>
</View>
</DrawerBottom>
</>
)
}

129
components/project/sectionMember.tsx Normal file
View File

@@ -0,0 +1,129 @@
import Styles from "@/constants/Styles";
import { apiGetProjectOne } from "@/lib/api";
import { useAuthSession } from "@/providers/AuthProvider";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import { router, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { Text, ToastAndroid, View } from "react-native";
import AlertKonfirmasi from "../alertKonfirmasi";
import BorderBottomItem from "../borderBottomItem";
import DrawerBottom from "../drawerBottom";
import ImageUser from "../imageNew";
import MenuItemRow from "../menuItemRow";
type Props = {
id: string;
idUser: string;
name: string;
email: string;
img: string;
position: string;
};
export default function SectionMember() {
const [isModal, setModal] = useState(false);
const { token, decryptToken } = useAuthSession();
const { id } = useLocalSearchParams<{ id: string }>();
const [data, setData] = useState<Props[]>([]);
async function handleLoad() {
try {
const hasil = await decryptToken(String(token?.current));
const response = await apiGetProjectOne({
user: hasil,
cat: "member",
id: id,
});
setData(response.data);
} catch (error) {
console.error(error);
}
}
useEffect(() => {
handleLoad();
}, []);
return (
<>
<View style={[Styles.mb15]}>
<View style={[Styles.rowSpaceBetween, Styles.mv05]}>
<Text style={[Styles.textDefaultSemiBold]}>Anggota</Text>
<Text style={[Styles.textDefault]}>Total {data.length} Anggota</Text>
</View>
<View style={[Styles.wrapPaper]}>
{
data.length > 0
?
data.map((item, index) => {
return (
<BorderBottomItem
key={index}
borderType="bottom"
icon={<ImageUser src={`https://wibu-storage.wibudev.com/api/files/${item.img}`} />}
title={item.name}
subtitle={item.position}
rightTopInfo="Anggota"
onPress={() => {
setModal(true);
}}
/>
);
})
:
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada anggota</Text>
}
</View>
</View>
<DrawerBottom
animation="slide"
isVisible={isModal}
setVisible={setModal}
title="Menu"
>
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={
<MaterialCommunityIcons
name="account-eye"
color="black"
size={25}
/>
}
title="Lihat Profil"
onPress={() => {
setModal(false);
router.push("/member/123");
}}
/>
<MenuItemRow
icon={
<MaterialCommunityIcons
name="account-remove"
color="black"
size={25}
/>
}
title="Keluarkan"
onPress={() => {
AlertKonfirmasi({
title: "Konfirmasi",
desc: "Apakah Anda yakin ingin mengeluarkan anggota?",
onPress: () => {
setModal(false);
ToastAndroid.show(
"Berhasil mengeluarkan anggota",
ToastAndroid.SHORT
);
},
});
}}
/>
</View>
</DrawerBottom>
</>
);
}

179
components/project/sectionTanggalTugas.tsx Normal file
View File

@@ -0,0 +1,179 @@
import Styles from "@/constants/Styles";
import { apiGetProjectOne, apiUpdateStatusProjectTask } from "@/lib/api";
import { setUpdateProject } from "@/lib/projectUpdate";
import { useAuthSession } from "@/providers/AuthProvider";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
import { router, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { Text, ToastAndroid, View } from "react-native";
import { useDispatch, useSelector } from "react-redux";
import AlertKonfirmasi from "../alertKonfirmasi";
import DrawerBottom from "../drawerBottom";
import ItemSectionTanggalTugas from "../itemSectionTanggalTugas";
import MenuItemRow from "../menuItemRow";
import ModalSelect from "../modalSelect";
type Props = {
id: string;
title: string;
desc: string;
status: 1;
dateStart: string;
dateEnd: string;
createdAt: string;
};
export default function SectionTanggalTugasProject() {
const dispatch = useDispatch()
const update = useSelector((state: any) => state.projectUpdate)
const [isModal, setModal] = useState(false);
const [isSelect, setSelect] = useState(false);
const { token, decryptToken } = useAuthSession();
const { id } = useLocalSearchParams<{ id: string }>();
const [data, setData] = useState<Props[]>([]);
const [tugas, setTugas] = useState({
id: '',
status: 0,
})
async function handleLoad() {
try {
const hasil = await decryptToken(String(token?.current));
const response = await apiGetProjectOne({
user: hasil,
cat: "task",
id: id,
});
setData(response.data);
} catch (error) {
console.error(error);
}
}
useEffect(() => {
handleLoad();
}, [update.task]);
async function handleUpdate(status: number) {
try {
const hasil = await decryptToken(String(token?.current));
const response = await apiUpdateStatusProjectTask({
user: hasil,
idProject: id,
status: status,
}, tugas.id);
if (response.success) {
dispatch(setUpdateProject({ ...update, progress: !update.progress, task: !update.task }))
setSelect(false);
ToastAndroid.show("Berhasil mengubah data", ToastAndroid.SHORT);
}
} catch (error) {
console.error(error);
}
}
return (
<>
<View style={[Styles.mb15, Styles.mt10]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>
Tanggal & Tugas
</Text>
<View style={[Styles.wrapPaper]}>
{
data.length > 0
?
data.map((item, index) => {
return (
<ItemSectionTanggalTugas
key={index}
done={item.status === 1}
title={item.title}
dateStart={item.dateStart}
dateEnd={item.dateEnd}
onPress={() => {
setTugas({
id: item.id,
status: item.status
})
setModal(true)
}}
/>
);
})
:
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada tugas</Text>
}
</View>
</View>
<DrawerBottom
animation="slide"
isVisible={isModal}
setVisible={setModal}
title="Menu"
>
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={
<MaterialCommunityIcons
name="list-status"
color="black"
size={25}
/>
}
title="Update Status"
onPress={() => {
setModal(false);
setSelect(true);
}}
/>
<MenuItemRow
icon={
<MaterialCommunityIcons
name="pencil-outline"
color="black"
size={25}
/>
}
title="Edit Tugas"
onPress={() => {
setModal(false);
router.push(`/project/update/124`);
}}
/>
<MenuItemRow
icon={<Ionicons name="trash" color="black" size={25} />}
title="Hapus Tugas"
onPress={() => {
AlertKonfirmasi({
title: "Konfirmasi",
desc: "Apakah anda yakin ingin menghapus data ini?",
onPress: () => {
setModal(false);
ToastAndroid.show(
"Berhasil menghapus data",
ToastAndroid.SHORT
);
},
});
}}
/>
</View>
</DrawerBottom>
<ModalSelect
category="status-task"
close={setSelect}
onSelect={(value) => {
handleUpdate(Number(value.val))
}}
title="Status"
open={isSelect}
valChoose={String(tugas.status)}
/>
</>
);
}

22
components/sectionCancel.tsx Normal file
View File

@@ -0,0 +1,22 @@
import { ColorsStatus } from "@/constants/ColorsStatus";
import Styles from "@/constants/Styles";
import { AntDesign } from "@expo/vector-icons";
import { Text, View } from "react-native";
type Props = {
text: string,
}
export default function SectionCancel({ text }: Props) {
return (
<View style={[ColorsStatus.lightRed, Styles.p10, Styles.round10, Styles.mb15]}>
<View style={[Styles.rowItemsCenter]}>
<AntDesign name="warning" size={22} style={[Styles.mr10]} />
<Text style={[Styles.textDefaultSemiBold]}>Kegiatan Dibatalkan</Text>
</View>
<View>
<Text style={[Styles.mt05]}>{text}</Text>
</View>
</View>
)
}

7
components/sectionProgress.tsx
View File

@@ -5,10 +5,11 @@ import { Text, View } from "react-native";
import ProgressBar from "./progressBar";
type Props = {
text: string
text: string,
progress: number
}
export default function SectionProgress({ text }: Props) {
export default function SectionProgress({ text, progress }: Props) {
return (
<View style={[ColorsStatus.lightGreen, Styles.p15, { flexDirection: 'row', borderRadius: 10, alignItems: 'center' }]}>
<View style={[Styles.iconContent, ColorsStatus.orange, { alignItems: 'center', justifyContent: 'center' }]}>
@@ -16,7 +17,7 @@ export default function SectionProgress({ text }: Props) {
</View>
<View style={[Styles.ml10, { flex: 1 }]}>
<Text style={[Styles.mb05]}>{text}</Text>
<ProgressBar margin={0} category="page" value={50} />
<ProgressBar margin={0} category="page" value={progress} />
</View>
</View>
)

13
components/sectionFile.tsx → components/task/sectionFileTask.tsx
View File

@@ -1,14 +1,13 @@
import Styles from "@/constants/Styles";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
import { Text, ToastAndroid, View } from "react-native";
import BorderBottomItem from "./borderBottomItem";
import { useState } from "react";
import { router } from "expo-router";
import AlertKonfirmasi from "./alertKonfirmasi";
import DrawerBottom from "./drawerBottom";
import MenuItemRow from "./menuItemRow";
import { Text, ToastAndroid, View } from "react-native";
import AlertKonfirmasi from "../alertKonfirmasi";
import BorderBottomItem from "../borderBottomItem";
import DrawerBottom from "../drawerBottom";
import MenuItemRow from "../menuItemRow";
export default function SectionFile() {
export default function SectionFileTask() {
const [isModal, setModal] = useState(false)
return (

49
components/sectionMember.tsx → components/task/sectionMemberTask.tsx
View File

@@ -1,14 +1,15 @@
import Styles from "@/constants/Styles";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import { useState } from "react";
import { Image, Text, ToastAndroid, View } from "react-native";
import AlertKonfirmasi from "./alertKonfirmasi";
import BorderBottomItem from "./borderBottomItem";
import DrawerBottom from "./drawerBottom";
import MenuItemRow from "./menuItemRow";
import { router } from "expo-router";
import Styles from "@/constants/Styles"
import { MaterialCommunityIcons } from "@expo/vector-icons"
import { router } from "expo-router"
import { useState } from "react"
import { Image, Text, ToastAndroid, View } from "react-native"
import AlertKonfirmasi from "../alertKonfirmasi"
import BorderBottomItem from "../borderBottomItem"
import DrawerBottom from "../drawerBottom"
import MenuItemRow from "../menuItemRow"
export default function SectionMember() {
export default function SectionMemberTask() {
const [isModal, setModal] = useState(false)
return (
@@ -22,31 +23,9 @@ export default function SectionMember() {
<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"
onPress={() => { setModal(true) }}
/>
<BorderBottomItem
borderType="bottom"
icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
title="Amalia Dwi"
subtitle="Dinas - Bendahara"
rightTopInfo="Anggota"
onPress={() => { setModal(true) }}
/>
<BorderBottomItem
borderType="bottom"
icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
title="Amalia Dwi"
subtitle="Dinas - Bendahara"
rightTopInfo="Anggota"
onPress={() => { setModal(true) }}
/>
<BorderBottomItem
borderType="bottom"
icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
icon={
<></>
}
title="Amalia Dwi"
subtitle="Dinas - Bendahara"
rightTopInfo="Anggota"

19
components/sectionTanggalTugas.tsx → components/task/sectionTanggalTugasTask.tsx
View File

@@ -3,17 +3,14 @@ import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
import { router } from "expo-router";
import { useState } from "react";
import { Text, ToastAndroid, View } from "react-native";
import AlertKonfirmasi from "./alertKonfirmasi";
import DrawerBottom from "./drawerBottom";
import ItemSectionTanggalTugas from "./itemSectionTanggalTugas";
import MenuItemRow from "./menuItemRow";
import ModalSelect from "./modalSelect";
import ItemSectionTanggalTugas from "../itemSectionTanggalTugas";
import DrawerBottom from "../drawerBottom";
import MenuItemRow from "../menuItemRow";
import AlertKonfirmasi from "../alertKonfirmasi";
import ModalSelect from "../modalSelect";
type Props = {
category: 'project' | 'task'
}
export default function SectionTanggalTugas({ category }: Props) {
export default function SectionTanggalTugasTask() {
const [isModal, setModal] = useState(false)
const [isSelect, setSelect] = useState(false)
const [choose, setChoose] = useState({ val: '', label: '' })
@@ -43,9 +40,7 @@ export default function SectionTanggalTugas({ category }: Props) {
title="Edit Tugas"
onPress={() => {
setModal(false)
category == 'project'
? router.push(`/project/update/124`)
: router.push(`./update/124`)
router.push(`./update/124`)
}}
/>

3
constants/ColorsStatus.ts
View File

@@ -25,5 +25,8 @@ export const ColorsStatus = {
},
gray: {
backgroundColor: '#d9d9d9'
},
lightRed: {
backgroundColor: '#ffcdcd'
}
}

25
lib/api.ts
View File

@@ -236,4 +236,29 @@ export const apiDeleteAnnouncement = async (data: { user: string }, id: string)
export const apiGetProject = async ({ user, status, search, group, kategori }: { user: string, status: string, search: string, group?: string, kategori?: string }) => {
const response = await api.get(`mobile/project?user=${user}&status=${status}&group=${group}&search=${search}&cat=${kategori}`);
return response.data;
};
export const apiGetProjectOne = async ({ user, cat, id }: { user: string, cat: 'data' | 'progress' | 'task' | 'file' | 'member', id: string }) => {
const response = await api.get(`mobile/project/${id}?user=${user}&cat=${cat}`);
return response.data;
};
export const apiEditProject = async (data: { name: string, user: string }, id: string) => {
const response = await api.put(`/mobile/project/${id}`, data)
return response.data;
};
export const apiCreateProjectTask = async ({ data, id }: { data: { name: string, dateStart: Date, user: string, dateEnd: Date }, id: string }) => {
const response = await api.post(`/mobile/project/${id}`, data)
return response.data;
};
export const apiCancelProject = async (data: { user: string, reason: string }, id: string) => {
const response = await api.delete(`mobile/project/${id}`, { data })
return response.data
};
export const apiUpdateStatusProjectTask = async (data: { user: string, status: number, idProject: string }, id: string) => {
const response = await api.put(`mobile/project/detail/${id}`, data)
return response.data
};

20
lib/projectUpdate.ts Normal file
View File

@@ -0,0 +1,20 @@
import { createSlice } from '@reduxjs/toolkit';
const projectUpdate = createSlice({
name: 'projectUpdate',
initialState: {
data: false,
progress: false,
task: false,
file: false,
member: false
},
reducers: {
setUpdateProject: (state, action) => {
return action.payload;
},
},
});
export const { setUpdateProject } = projectUpdate.actions;
export default projectUpdate.reducer;

4
lib/store.ts
View File

@@ -8,6 +8,7 @@ import groupUpdate from './groupSlice';
import memberChoose from './memberChoose';
import memberUpdate from './memberSlice';
import positionUpdate from './positionSlice';
import projectUpdate from './projectUpdate';
import userReducer from './userSlice';
const store = configureStore({
@@ -21,7 +22,8 @@ const store = configureStore({
filterGroup: filterSlice,
discussionGeneralDetailUpdate: discussionGeneralDetailUpdate,
memberChoose: memberChoose,
announcementUpdate: announcementUpdate
announcementUpdate: announcementUpdate,
projectUpdate: projectUpdate,
}
});