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

Merge pull request 'fix : ios dan tampilan' (#9) from amalia/30-jul-25 into join

Browse Source 
Reviewed-on: bip/mobile-darmasaba#9
This commit is contained in:
amalia
2025-07-31 17:46:29 +08:00
parent 4394219f2a 5898655fac
commit ea29785a34
28 changed files with 545 additions and 441 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
app/(application)/announcement/[id].tsx
View File

@@ -7,7 +7,7 @@ import { apiGetAnnouncementOne } from "@/lib/api";
import { useAuthSession } from "@/providers/AuthProvider";
import { Entypo, MaterialIcons } from "@expo/vector-icons";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import React, { useEffect, useState } from "react";
import { Dimensions, SafeAreaView, ScrollView, View } from "react-native";
import RenderHTML from 'react-native-render-html';
import { useSelector } from "react-redux";
@@ -51,6 +51,11 @@ export default function DetailAnnouncement() {
handleLoad(true)
}, [])
function hasHtmlTags(text: string) {
const htmlRegex = /<[a-z][\s\S]*>/i;
return htmlRegex.test(text);
};
return (
<SafeAreaView>
<Stack.Screen
@@ -84,10 +89,15 @@ export default function DetailAnnouncement() {
<Text style={[Styles.textDefaultSemiBold]}>{data?.title}</Text>
</View>
<View style={[Styles.mt10]}>
<RenderHTML
contentWidth={contentWidth}
source={{ html: data?.desc }}
/>
{
hasHtmlTags(data?.desc) ?
<RenderHTML
contentWidth={contentWidth}
source={{ html: data?.desc }}
/>
:
<Text>{data?.desc}</Text>
}
</View>
</>
}

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

@@ -119,7 +119,7 @@ export default function BannerList() {
onRefresh={handleRefresh}
/>
}
style={[{height:'100%'}]}
style={[Styles.h100]}
>
<View style={[Styles.p15, Styles.mb100]}>
{entities.map((index: any, key: number) => (

56
app/(application)/discussion/[id].tsx
View File

@@ -6,6 +6,7 @@ import { InputForm } from "@/components/inputForm";
import LabelStatus from "@/components/labelStatus";
import Skeleton from "@/components/skeleton";
import SkeletonContent from "@/components/skeletonContent";
import Text from '@/components/Text';
import { ColorsStatus } from "@/constants/ColorsStatus";
import Styles from "@/constants/Styles";
import { apiGetDiscussionGeneralOne, apiSendDiscussionGeneralCommentar } from "@/lib/api";
@@ -14,8 +15,7 @@ import { Ionicons, MaterialIcons } from "@expo/vector-icons";
import { firebase } from '@react-native-firebase/database';
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { Pressable, ScrollView, View } from "react-native";
import Text from '@/components/Text';
import { KeyboardAvoidingView, Platform, Pressable, ScrollView, View } from "react-native";
import { useSelector } from "react-redux";
type Props = {
@@ -195,30 +195,34 @@ export default function DetailDiscussionGeneral() {
</View>
</View>
</ScrollView>
<View style={[
Styles.contentItemCenter,
Styles.absolute0,
Styles.w100,
{ backgroundColor: "#f4f4f4" },
]}>
<InputForm
disable={(data?.status === 2 || !data?.isActive || (!memberDiscussion && (entityUser.role == "user" || entityUser.role == "coadmin")))}
type="default"
round
placeholder="Kirim Komentar"
bg="white"
onChange={setKomentar}
value={komentar}
itemRight={
<Pressable onPress={() => {
(komentar != '' && data?.status === 1 && data?.isActive && (memberDiscussion || (entityUser.role != "user" && entityUser.role != "coadmin")))
&& handleKomentar()
}}>
<MaterialIcons name="send" size={25} style={(komentar == '' || data?.status === 2 || !data?.isActive || (!memberDiscussion && (entityUser.role == "user" || entityUser.role == "coadmin"))) ? Styles.cGray : Styles.cDefault} />
</Pressable>
}
/>
</View>
<KeyboardAvoidingView
behavior={Platform.OS === 'ios' ? 'padding' : undefined}
keyboardVerticalOffset={110}
>
<View style={[
Styles.contentItemCenter,
Styles.w100,
{ backgroundColor: "#f4f4f4" },
]}>
<InputForm
disable={(data?.status === 2 || !data?.isActive || (!memberDiscussion && (entityUser.role == "user" || entityUser.role == "coadmin")))}
type="default"
round
placeholder="Kirim Komentar"
bg="white"
onChange={setKomentar}
value={komentar}
itemRight={
<Pressable onPress={() => {
(komentar != '' && data?.status === 1 && data?.isActive && (memberDiscussion || (entityUser.role != "user" && entityUser.role != "coadmin")))
&& handleKomentar()
}}>
<MaterialIcons name="send" size={25} style={(komentar == '' || data?.status === 2 || !data?.isActive || (!memberDiscussion && (entityUser.role == "user" || entityUser.role == "coadmin"))) ? Styles.cGray : Styles.cDefault} />
</Pressable>
}
/>
</View>
</KeyboardAvoidingView>
</View >
</>
)

2
app/(application)/discussion/add-member/[id].tsx
View File

@@ -114,7 +114,7 @@ export default function AddMemberDiscussionDetail() {
<ImageWithLabel
key={index}
label={item.name}
src={item.img}
src={`https://wibu-storage.wibudev.com/api/files/${item.img}`}
onClick={() => onChoose(item.idUser, item.name, item.img)}
/>
))

3
app/(application)/discussion/create.tsx
View File

@@ -101,9 +101,12 @@ export default function CreateDiscussionGeneral() {
dispatch(setUpdateDiscussionGeneralDetail(!update))
Toast.show({ type: 'small', text1: 'Berhasil menambahkan data', })
router.back()
}else{
Toast.show({ type: 'small', text1: response.message, })
}
} catch (error) {
console.error(error);
Toast.show({ type: 'small', text1: 'Terjadi kesalahan', })
}
}

4
app/(application)/division/[id]/(fitur-division)/calendar/index.tsx
View File

@@ -144,7 +144,9 @@ export default function CalendarDivision() {
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}>
}
style={[Styles.h100]}
>
<View style={[Styles.p15]}>
<View style={[Styles.wrapPaper, Styles.p10]}>
<Datepicker

2
app/(application)/division/[id]/(fitur-division)/document/index.tsx
View File

@@ -351,7 +351,7 @@ export default function DocumentDivision() {
/>
<ModalLoading isVisible={loadingOpen} setVisible={setLoadingOpen} />
<ScrollView
style={{ height: "100%" }}
style={[Styles.h100]}
refreshControl={
<RefreshControl
refreshing={refreshing}

6
app/(application)/division/index.tsx
View File

@@ -4,6 +4,7 @@ import InputSearch from "@/components/inputSearch";
import PaperGridContent from "@/components/paperGridContent";
import Skeleton from "@/components/skeleton";
import SkeletonTwoItem from "@/components/skeletonTwoItem";
import Text from "@/components/Text";
import { ColorsStatus } from "@/constants/ColorsStatus";
import Styles from "@/constants/Styles";
import { apiGetDivision } from "@/lib/api";
@@ -18,7 +19,6 @@ import {
import { router, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { Pressable, RefreshControl, View, VirtualizedList } from "react-native";
import Text from "@/components/Text";
import { useSelector } from "react-redux";
type Props = {
@@ -218,7 +218,7 @@ export default function ListDivision() {
</View>
) : (
isList ? (
<View style={[Styles.mb50]}>
<View style={[Styles.h100]}>
<VirtualizedList
data={data}
style={[{ paddingBottom: 100 }]}
@@ -253,7 +253,7 @@ export default function ListDivision() {
/>
</View>
) : (
<View>
<View style={[Styles.h100]}>
<VirtualizedList
data={data}
style={[{ paddingBottom: 100 }]}

59
app/(application)/group/index.tsx
View File

@@ -112,32 +112,33 @@ export default function Index() {
return (
<SafeAreaView>
<ScrollView
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}
>
<View style={[Styles.p15]}>
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={status == "false" ? "false" : "true"}
value="true"
onPress={() => { setStatus("true") }}
label="Aktif"
icon={<Feather name="check-circle" color={status == "true" ? 'white' : 'black'} size={20} />}
n={2} />
<ButtonTab
active={status == "false" ? "false" : "true"}
value="false"
onPress={() => { setStatus("false") }}
label="Tidak Aktif"
icon={<AntDesign name="closecircleo" color={status == "false" ? 'white' : 'black'} size={20} />}
n={2} />
</View>
<InputSearch onChange={setSearch} />
<View style={[Styles.p15]}>
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={status == "false" ? "false" : "true"}
value="true"
onPress={() => { setStatus("true") }}
label="Aktif"
icon={<Feather name="check-circle" color={status == "true" ? 'white' : 'black'} size={20} />}
n={2} />
<ButtonTab
active={status == "false" ? "false" : "true"}
value="false"
onPress={() => { setStatus("false") }}
label="Tidak Aktif"
icon={<AntDesign name="closecircleo" color={status == "false" ? 'white' : 'black'} size={20} />}
n={2} />
</View>
<InputSearch onChange={setSearch} />
<ScrollView
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}
style={[Styles.h100]}
>
<View>
{
@@ -173,8 +174,8 @@ export default function Index() {
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada data</Text>
}
</View>
</View>
</ScrollView>
</ScrollView>
</View>
<DrawerBottom animation="slide" isVisible={isModal} setVisible={() => setModal(false)} title={titleChoose}>
<View style={Styles.rowItemsCenter}>
@@ -203,7 +204,7 @@ export default function Index() {
</View>
</DrawerBottom>
<DrawerBottom animation="none" height={30} isVisible={isVisibleEdit} setVisible={() => setVisibleEdit(false)} title="Edit Lembaga Desa">
<DrawerBottom animation="none" keyboard height={30} isVisible={isVisibleEdit} setVisible={() => setVisibleEdit(false)} title="Edit Lembaga Desa">
<View style={{ flex: 1 }}>
<View>
<InputForm type="default" placeholder="Nama Lembaga Desa" required label="Lembaga Desa" value={titleChoose} onChange={setTitleChoose} />

101
app/(application)/member/[id].tsx
View File

@@ -9,7 +9,7 @@ import Styles from "@/constants/Styles";
import { apiGetProfile } from "@/lib/api";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { SafeAreaView, ScrollView, View } from "react-native";
import { RefreshControl, SafeAreaView, ScrollView, View } from "react-native";
import { useSelector } from "react-redux";
type Props = {
@@ -34,10 +34,11 @@ export default function MemberDetail() {
const [isEdit, setEdit] = useState(true)
const arrSkeleton = Array.from({ length: 5 }, (_, index) => index)
const [loading, setLoading] = useState(true)
const [refreshing, setRefreshing] = useState(false)
async function handleLoad() {
async function handleLoad(loading: boolean) {
try {
setLoading(true)
setLoading(loading)
const response = await apiGetProfile({ id: id })
setData(response.data)
setEdit(valueRoleUser.filter((v) => v.login == entityUser.role)[0]?.data.some((i: any) => i.id == response.data.idUserRole))
@@ -50,9 +51,17 @@ export default function MemberDetail() {
useEffect(() => {
handleLoad()
handleLoad(true)
}, []);
const handleRefresh = async () => {
setRefreshing(true)
handleLoad(false)
await new Promise(resolve => setTimeout(resolve, 2000));
setRefreshing(false)
};
return (
<SafeAreaView>
<Stack.Screen
@@ -64,48 +73,54 @@ export default function MemberDetail() {
headerShadowVisible: false
}}
/>
<ScrollView>
<View style={{ flexDirection: 'column' }}>
<View style={[Styles.wrapHeadViewMember]}>
{
loading ?
<>
<Skeleton width={100} height={100} borderRadius={100} />
<Skeleton width={200} height={10} borderRadius={5} />
<Skeleton width={150} height={10} borderRadius={5} />
</>
:
<>
<ImageUser src={`https://wibu-storage.wibudev.com/api/files/${data?.img}`} size="lg" />
<Text style={[Styles.textSubtitle, Styles.cWhite, Styles.mt10]}>{data?.name}</Text>
<Text style={[Styles.textMediumNormal, Styles.cWhite]}>{data?.role}</Text>
</>
<ScrollView
style={[Styles.h100]}
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}
>
<View style={[Styles.wrapHeadViewMember,]}>
{
loading ?
<>
<Skeleton width={100} height={100} borderRadius={100} />
<Skeleton width={200} height={10} borderRadius={5} />
<Skeleton width={150} height={10} borderRadius={5} />
</>
:
<>
<ImageUser src={`https://wibu-storage.wibudev.com/api/files/${data?.img}`} size="lg" />
<Text style={[Styles.textSubtitle, Styles.cWhite, Styles.mt10]}>{data?.name}</Text>
<Text style={[Styles.textMediumNormal, Styles.cWhite]}>{data?.role}</Text>
</>
}
}
</View>
<View style={[Styles.p15]}>
<View style={[Styles.rowSpaceBetween]}>
<Text style={[Styles.textDefaultSemiBold]}>Informasi</Text>
</View>
<View style={[Styles.p15]}>
<View style={[Styles.rowSpaceBetween]}>
<Text style={[Styles.textDefaultSemiBold]}>Informasi</Text>
</View>
{
loading ?
arrSkeleton.map((item, index) => {
return (
<Skeleton key={index} width={100} widthType="percent" height={25} borderRadius={5} />
)
})
:
<>
<ItemDetailMember category="nik" value={data?.nik} />
<ItemDetailMember category="group" value={data?.group} />
<ItemDetailMember category="position" value={data?.position} />
<ItemDetailMember category="phone" value={`+62${data?.phone}`} />
<ItemDetailMember category="email" value={data?.email} />
<ItemDetailMember category="gender" value={data?.gender == "F" ? "Perempuan" : "Laki-Laki"} />
</>
}
{
loading ?
arrSkeleton.map((item, index) => {
return (
<Skeleton key={index} width={100} widthType="percent" height={25} borderRadius={5} />
)
})
:
<>
<ItemDetailMember category="nik" value={data?.nik} />
<ItemDetailMember category="group" value={data?.group} />
<ItemDetailMember category="position" value={data?.position} />
<ItemDetailMember category="phone" value={`+62${data?.phone}`} />
<ItemDetailMember category="email" value={data?.email} />
<ItemDetailMember category="gender" value={data?.gender == "F" ? "Perempuan" : "Laki-Laki"} />
</>
}
</View>
</View>
</ScrollView>
</SafeAreaView>

251
app/(application)/member/create.tsx
View File

@@ -15,6 +15,8 @@ import { router, Stack } from "expo-router";
import { useEffect, useState } from "react";
import {
Image,
KeyboardAvoidingView,
Platform,
Pressable,
SafeAreaView,
ScrollView,
@@ -213,132 +215,139 @@ export default function CreateMember() {
),
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<View style={{ justifyContent: "center", alignItems: "center" }}>
{selectedImage != undefined ? (
<Pressable onPress={pickImageAsync}>
<Image src={selectedImage} style={[Styles.userProfileBig]} />
</Pressable>
) : (
<Pressable
onPress={pickImageAsync}
style={[Styles.iconContent, ColorsStatus.gray]}
>
<MaterialCommunityIcons
name="account-tie"
size={100}
color={"gray"}
<KeyboardAvoidingView
style={[Styles.h100]}
behavior={Platform.OS === 'ios' ? 'padding' : undefined}
keyboardVerticalOffset={110}
>
<ScrollView>
<View style={[Styles.p15]}>
<View style={{ justifyContent: "center", alignItems: "center" }}>
{selectedImage != undefined ? (
<Pressable onPress={pickImageAsync}>
<Image src={selectedImage} style={[Styles.userProfileBig]} />
</Pressable>
) : (
<Pressable
onPress={pickImageAsync}
style={[Styles.iconContent, ColorsStatus.gray]}
>
<MaterialCommunityIcons
name="account-tie"
size={100}
color={"gray"}
/>
</Pressable>
)}
</View>
{(entityUser.role == "supadmin" ||
entityUser.role == "developer") && (
<SelectForm
label="Lembaga Desa"
placeholder="Pilih Lembaga Desa"
value={chooseGroup.label}
required
onPress={() => {
setValChoose(chooseGroup.val);
setValSelect("group");
setSelect(true);
}}
error={error.group}
errorText="Lembaga Desa tidak boleh kosong"
/>
</Pressable>
)}
)}
<SelectForm
label="Jabatan"
placeholder="Pilih Jabatan"
value={choosePosition.label}
required
onPress={() => {
setValChoose(choosePosition.val);
setValSelect("position");
setSelect(true);
}}
error={error.position}
errorText="Jabatan tidak boleh kosong"
/>
<SelectForm
label="User Role"
placeholder="Pilih Role"
value={chooseRole.label}
required
onPress={() => {
setValChoose(chooseRole.val);
setValSelect("role");
setSelect(true);
}}
error={error.role}
errorText="Role tidak boleh kosong"
/>
<InputForm
label="NIK"
type="numeric"
placeholder="NIK"
required
error={error.nik}
errorText="NIK Harus 16 Karakter"
onChange={val => {
validationForm("nik", val)
}}
/>
<InputForm
label="Nama"
type="default"
placeholder="Nama"
required
error={error.name}
errorText="Nama tidak boleh kosong"
onChange={val => {
validationForm("name", val)
}}
/>
<InputForm
label="Email"
type="default"
placeholder="Email"
required
error={error.email}
errorText="Email tidak valid"
onChange={val => {
validationForm("email", val)
}}
/>
<InputForm
label="Nomor Telepon"
type="numeric"
placeholder="8XX-XXX-XXX"
required
itemLeft={<Text>+62</Text>}
error={error.phone}
errorText="Nomor Telepon tidak valid"
onChange={val => {
validationForm("phone", val)
}}
/>
<SelectForm
label="Jenis Kelamin"
placeholder="Pilih Jenis Kelamin"
value={chooseGender.label}
required
onPress={() => {
setValChoose(chooseGender.val);
setValSelect("gender");
setSelect(true);
}}
error={error.gender}
errorText="Jenis Kelamin tidak boleh kosong"
/>
</View>
{(entityUser.role == "supadmin" ||
entityUser.role == "developer") && (
<SelectForm
label="Lembaga Desa"
placeholder="Pilih Lembaga Desa"
value={chooseGroup.label}
required
onPress={() => {
setValChoose(chooseGroup.val);
setValSelect("group");
setSelect(true);
}}
error={error.group}
errorText="Lembaga Desa tidak boleh kosong"
/>
)}
<SelectForm
label="Jabatan"
placeholder="Pilih Jabatan"
value={choosePosition.label}
required
onPress={() => {
setValChoose(choosePosition.val);
setValSelect("position");
setSelect(true);
}}
error={error.position}
errorText="Jabatan tidak boleh kosong"
/>
<SelectForm
label="User Role"
placeholder="Pilih Role"
value={chooseRole.label}
required
onPress={() => {
setValChoose(chooseRole.val);
setValSelect("role");
setSelect(true);
}}
error={error.role}
errorText="Role tidak boleh kosong"
/>
<InputForm
label="NIK"
type="numeric"
placeholder="NIK"
required
error={error.nik}
errorText="NIK Harus 16 Karakter"
onChange={val => {
validationForm("nik", val)
}}
/>
<InputForm
label="Nama"
type="default"
placeholder="Nama"
required
error={error.name}
errorText="Nama tidak boleh kosong"
onChange={val => {
validationForm("name", val)
}}
/>
<InputForm
label="Email"
type="default"
placeholder="Email"
required
error={error.email}
errorText="Email tidak valid"
onChange={val => {
validationForm("email", val)
}}
/>
<InputForm
label="Nomor Telepon"
type="numeric"
placeholder="8XX-XXX-XXX"
required
itemLeft={<Text>+62</Text>}
error={error.phone}
errorText="Nomor Telepon tidak valid"
onChange={val => {
validationForm("phone", val)
}}
/>
<SelectForm
label="Jenis Kelamin"
placeholder="Pilih Jenis Kelamin"
value={chooseGender.label}
required
onPress={() => {
setValChoose(chooseGender.val);
setValSelect("gender");
setSelect(true);
}}
error={error.gender}
errorText="Jenis Kelamin tidak boleh kosong"
/>
</View>
</ScrollView>
</ScrollView>
</KeyboardAvoidingView>
<ModalSelect
category={valSelect}
close={setSelect}
close={() => { setSelect(false) }}
onSelect={(value) => {
validationForm(valSelect, value.val, value.label);
}}

253
app/(application)/member/edit/[id].tsx
View File

@@ -13,6 +13,8 @@ import { router, Stack, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import {
Image,
KeyboardAvoidingView,
Platform,
Pressable,
SafeAreaView,
ScrollView,
@@ -249,131 +251,138 @@ export default function EditMember() {
),
}}
/>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<View style={{ justifyContent: "center", alignItems: "center" }}>
{
errorImg ?
<Pressable onPress={pickImageAsync}>
{
<Image
source={errorImg ? require("../../../../assets/images/user.jpg") : { uri: `https://wibu-storage.wibudev.com/api/files/${data?.img}` }}
style={[Styles.userProfileBig]}
onError={() => { setErrorImg(true) }}
/>
}
</Pressable>
:
selectedImage != undefined ? (
<KeyboardAvoidingView
style={[Styles.h100]}
behavior={Platform.OS === 'ios' ? 'padding' : undefined}
keyboardVerticalOffset={110}
>
<ScrollView>
<View style={[Styles.p15, Styles.mb100]}>
<View style={{ justifyContent: "center", alignItems: "center" }}>
{
errorImg ?
<Pressable onPress={pickImageAsync}>
<Image
src={
typeof selectedImage === "string"
? selectedImage
: selectedImage.uri
}
style={[Styles.userProfileBig]}
onError={() => { setErrorImg(true) }}
/>
{
<Image
source={errorImg ? require("../../../../assets/images/user.jpg") : { uri: `https://wibu-storage.wibudev.com/api/files/${data?.img}` }}
style={[Styles.userProfileBig]}
onError={() => { setErrorImg(true) }}
/>
}
</Pressable>
) : (
<Image
source={require("../../../../assets/images/user.jpg")}
style={[Styles.userProfileBig]}
/>
)
}
:
selectedImage != undefined ? (
<Pressable onPress={pickImageAsync}>
<Image
src={
typeof selectedImage === "string"
? selectedImage
: selectedImage.uri
}
style={[Styles.userProfileBig]}
onError={() => { setErrorImg(true) }}
/>
</Pressable>
) : (
<Image
source={require("../../../../assets/images/user.jpg")}
style={[Styles.userProfileBig]}
/>
)
}
</View>
<SelectForm
label="Jabatan"
placeholder="Pilih Jabatan"
value={choosePosition.label}
required
onPress={() => {
setValChoose(choosePosition.val);
setValSelect("position");
setSelect(true);
}}
error={error.position}
errorText="Jabatan tidak boleh kosong"
/>
<SelectForm
label="User Role"
placeholder="Pilih Role"
value={chooseRole.label}
required
onPress={() => {
setValChoose(chooseRole.val);
setValSelect("role");
setSelect(true);
}}
error={error.role}
errorText="Role tidak boleh kosong"
/>
<InputForm
label="NIK"
type="numeric"
placeholder="NIK"
required
value={data?.nik}
error={error.nik}
errorText="NIK Harus 16 Karakter"
onChange={val => {
validationForm("nik", val)
}}
/>
<InputForm
label="Nama"
type="default"
placeholder="Nama"
required
value={data?.name}
error={error.name}
errorText="Nama tidak boleh kosong"
onChange={val => {
validationForm("name", val)
}}
/>
<InputForm
label="Email"
type="default"
placeholder="Email"
required
value={data?.email}
error={error.email}
errorText="Email tidak valid"
onChange={val => {
validationForm("email", val)
}}
/>
<InputForm
label="Nomor Telepon"
type="numeric"
placeholder="8XX-XXX-XXX"
required
itemLeft={<Text>+62</Text>}
value={data?.phone}
error={error.phone}
errorText="Nomor Telepon tidak valid"
onChange={val => {
validationForm("phone", val)
}}
/>
<SelectForm
label="Jenis Kelamin"
placeholder="Pilih Jenis Kelamin"
value={chooseGender.label}
required
onPress={() => {
setValChoose(chooseGender.val);
setValSelect("gender");
setSelect(true);
}}
error={error.gender}
errorText="Jenis Kelamin tidak boleh kosong"
/>
</View>
<SelectForm
label="Jabatan"
placeholder="Pilih Jabatan"
value={choosePosition.label}
required
onPress={() => {
setValChoose(choosePosition.val);
setValSelect("position");
setSelect(true);
}}
error={error.position}
errorText="Jabatan tidak boleh kosong"
/>
<SelectForm
label="User Role"
placeholder="Pilih Role"
value={chooseRole.label}
required
onPress={() => {
setValChoose(chooseRole.val);
setValSelect("role");
setSelect(true);
}}
error={error.role}
errorText="Role tidak boleh kosong"
/>
<InputForm
label="NIK"
type="numeric"
placeholder="NIK"
required
value={data?.nik}
error={error.nik}
errorText="NIK Harus 16 Karakter"
onChange={val => {
validationForm("nik", val)
}}
/>
<InputForm
label="Nama"
type="default"
placeholder="Nama"
required
value={data?.name}
error={error.name}
errorText="Nama tidak boleh kosong"
onChange={val => {
validationForm("name", val)
}}
/>
<InputForm
label="Email"
type="default"
placeholder="Email"
required
value={data?.email}
error={error.email}
errorText="Email tidak valid"
onChange={val => {
validationForm("email", val)
}}
/>
<InputForm
label="Nomor Telepon"
type="numeric"
placeholder="8XX-XXX-XXX"
required
itemLeft={<Text>+62</Text>}
value={data?.phone}
error={error.phone}
errorText="Nomor Telepon tidak valid"
onChange={val => {
validationForm("phone", val)
}}
/>
<SelectForm
label="Jenis Kelamin"
placeholder="Pilih Jenis Kelamin"
value={chooseGender.label}
required
onPress={() => {
setValChoose(chooseGender.val);
setValSelect("gender");
setSelect(true);
}}
error={error.gender}
errorText="Jenis Kelamin tidak boleh kosong"
/>
</View>
</ScrollView>
</ScrollView>
</KeyboardAvoidingView>
<ModalSelect
category={valSelect}

68
app/(application)/position/index.tsx
View File

@@ -131,38 +131,38 @@ export default function Index() {
return (
<SafeAreaView>
<ScrollView
style={{ height: '100%' }}
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}>
<View style={[Styles.p15]}>
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={status == "false" ? "false" : "true"}
value="true"
onPress={() => { setStatus("true") }}
label="Aktif"
icon={<Feather name="check-circle" color={status == "true" ? 'white' : 'black'} size={20} />}
n={2} />
<ButtonTab
active={status == "false" ? "false" : "true"}
value="false"
onPress={() => { setStatus("false") }}
label="Tidak Aktif"
icon={<AntDesign name="closecircleo" color={status == "false" ? 'white' : 'black'} size={20} />}
n={2} />
<View style={[Styles.p15]}>
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={status == "false" ? "false" : "true"}
value="true"
onPress={() => { setStatus("true") }}
label="Aktif"
icon={<Feather name="check-circle" color={status == "true" ? 'white' : 'black'} size={20} />}
n={2} />
<ButtonTab
active={status == "false" ? "false" : "true"}
value="false"
onPress={() => { setStatus("false") }}
label="Tidak Aktif"
icon={<AntDesign name="closecircleo" color={status == "false" ? 'white' : 'black'} size={20} />}
n={2} />
</View>
<InputSearch onChange={setSearch} />
{
(entityUser.role == "supadmin" || entityUser.role == "developer") &&
<View style={[Styles.mv05]}>
<Text>Filter : {nameGroup}</Text>
</View>
<InputSearch onChange={setSearch} />
{
(entityUser.role == "supadmin" || entityUser.role == "developer") &&
<View style={[Styles.mv05]}>
<Text>Filter : {nameGroup}</Text>
</View>
}
}
<ScrollView
style={[Styles.h100]}
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}>
<View>
{
loading ?
@@ -193,8 +193,8 @@ export default function Index() {
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada data</Text>
}
</View>
</View>
</ScrollView>
</ScrollView>
</View>
<DrawerBottom animation="slide" isVisible={isModal} setVisible={() => setModal(false)} title={chooseData.name}>
<View style={Styles.rowItemsCenter}>
@@ -224,7 +224,7 @@ export default function Index() {
</DrawerBottom>
<DrawerBottom animation="none" height={30} backdropPressable={false} isVisible={isVisibleEdit} setVisible={() => setVisibleEdit(false)} title="Edit Jabatan">
<DrawerBottom animation="none" keyboard height={30} backdropPressable={false} isVisible={isVisibleEdit} setVisible={() => setVisibleEdit(false)} title="Edit Jabatan">
<View style={{ justifyContent: 'space-between', flex: 1 }}>
<View>
<InputForm

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

@@ -10,7 +10,7 @@ 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 { RefreshControl, SafeAreaView, ScrollView, View } from "react-native";
import { useSelector } from "react-redux";
@@ -37,6 +37,7 @@ export default function DetailProject() {
const update = useSelector((state: any) => state.projectUpdate)
const [isMember, setIsMember] = useState(false)
const entityUser = useSelector((state: any) => state.user)
const [refreshing, setRefreshing] = useState(false)
async function handleLoad(cat: 'data' | 'progress') {
try {
@@ -79,6 +80,14 @@ export default function DetailProject() {
}, [])
const handleRefresh = async () => {
setRefreshing(true)
await handleLoad('data')
await handleLoad('progress')
await new Promise(resolve => setTimeout(resolve, 2000));
setRefreshing(false)
};
return (
<SafeAreaView>
<Stack.Screen
@@ -89,15 +98,22 @@ export default function DetailProject() {
headerRight: () => (entityUser.role == "user" || entityUser.role == "coadmin") && !isMember ? null : <HeaderRightProjectDetail id={id} status={data?.status} />,
}}
/>
<ScrollView>
<ScrollView
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={handleRefresh}
/>
}
>
<View style={[Styles.p15, Styles.mb100]}>
{
data?.reason != null && data?.reason != "" && <SectionCancel text={data?.reason} />
}
<SectionProgress text={`Kemajuan Kegiatan ${progress}%`} progress={progress} />
<SectionTanggalTugasProject status={data?.status} member={isMember} />
<SectionFile status={data?.status} member={isMember} />
<SectionMember status={data?.status} />
<SectionTanggalTugasProject status={data?.status} member={isMember} refreshing={refreshing}/>
<SectionFile status={data?.status} member={isMember} refreshing={refreshing} />
<SectionMember status={data?.status} refreshing={refreshing} />
</View>
</ScrollView>
</SafeAreaView>

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

@@ -220,7 +220,7 @@ export default function ListProject() {
data.length > 0
?
isList ? (
<View>
<View style={[Styles.h100]}>
<VirtualizedList
data={data}
getItemCount={() => data.length}
@@ -280,7 +280,7 @@ export default function ListProject() {
} */}
</View>
) : (
<View>
<View style={[Styles.h100]}>
<VirtualizedList
data={data}
getItemCount={() => data.length}

2
components/buttonTab.tsx
View File

@@ -17,7 +17,7 @@ export default function ButtonTab({ active, value, onPress, label, n, icon }: Pr
return (
<TouchableOpacity style={[Styles.btnTab, (active == value) && ColorsStatus.orange, { width: n == 2 ? '50%' : 'auto' }]} onPress={() => { onPress() }}>
{icon}
<Text style={[Styles.textMediumSemiBold, Styles.ml10, { color: active == value ? 'white' : 'black' }]}>{label}</Text>
<Text numberOfLines={1} style={[Styles.textMediumSemiBold, Styles.ml10, { color: active == value ? 'white' : 'black' }]}>{label}</Text>
</TouchableOpacity>
)
}

4
components/discussion_general/headerDiscussionGeneral.tsx
View File

@@ -34,7 +34,9 @@ export default function HeaderDiscussionGeneral() {
title="Filter"
onPress={() => {
setVisible(false)
setFilter(true)
setTimeout(() => {
setFilter(true)
}, 600)
}}
/>
}

4
components/division/headerDivisionList.tsx
View File

@@ -37,7 +37,9 @@ export default function HeaderRightDivisionList() {
title="Filter"
onPress={() => {
setVisible(false)
setFilter(true)
setTimeout(() => {
setFilter(true)
}, 600);
}}
/>
}

71
components/drawerBottom.tsx
View File

@@ -1,8 +1,8 @@
import Styles from "@/constants/Styles";
import { MaterialIcons } from "@expo/vector-icons";
import { Pressable, View } from "react-native";
import Text from "./Text";
import { Dimensions, KeyboardAvoidingView, Platform, Pressable, View } from "react-native";
import Modal from 'react-native-modal';
import Text from "./Text";
type Props = {
isVisible: boolean
@@ -12,28 +12,15 @@ type Props = {
animation?: 'slide' | 'none' | 'fade'
height?: number
backdropPressable?: boolean
keyboard?: boolean
}
export default function DrawerBottom({ isVisible, setVisible, title, children, animation, height, backdropPressable = true }: Props) {
return (
// <Modal
// animationType={animation}
// transparent={true} visible={isVisible}>
// <View style={[Styles.modalBgTransparant]}>
// <View style={[Styles.modalContent, height != undefined && { height: `${height}%` }]}>
// <View style={Styles.titleContainer}>
// <Text style={Styles.textDefault}>{title}</Text>
// <Pressable onPress={() => setVisible(false)}>
// <MaterialIcons name="close" color="black" size={22} />
// </Pressable>
// </View>
// <View style={Styles.contentContainer}>
// {children}
// </View>
// </View>
// </View>
// </Modal>
export default function DrawerBottom({ isVisible, setVisible, title, children, animation, height, backdropPressable = true, keyboard = false }: Props) {
const tinggiScreen = Dimensions.get("window").height;
const tinggiInput = height != undefined ? height : 25
const tinggiFix = tinggiScreen * tinggiInput / 100;
return (
<Modal
animationIn={"slideInUp"}
animationOut={"slideOutDown"}
@@ -49,17 +36,37 @@ export default function DrawerBottom({ isVisible, setVisible, title, children, a
backdropTransitionOutTiming={500}
useNativeDriverForBackdrop={true}
>
<View style={[Styles.modalContentNew, height != undefined ? { height: `${height}%` } : { height: '25%' }]}>
<View style={[Styles.titleContainerNew]}>
<Text style={Styles.textDefault}>{title}</Text>
<Pressable onPress={() => setVisible(false)}>
<MaterialIcons name="close" color="black" size={22} />
</Pressable>
</View>
<View style={Styles.contentContainer}>
{children}
</View>
</View>
{
keyboard ?
<KeyboardAvoidingView
behavior={Platform.OS === 'ios' ? 'padding' : undefined}
keyboardVerticalOffset={0}
>
<View style={[Styles.modalContentNew, { height: tinggiFix }]}>
<View style={[Styles.titleContainerNew]}>
<Text style={Styles.textDefault}>{title}</Text>
<Pressable onPress={() => setVisible(false)}>
<MaterialIcons name="close" color="black" size={22} />
</Pressable>
</View>
<View style={Styles.contentContainer}>
{children}
</View>
</View>
</KeyboardAvoidingView>
:
<View style={[Styles.modalContentNew, { height: tinggiFix }]}>
<View style={[Styles.titleContainerNew]}>
<Text style={Styles.textDefault}>{title}</Text>
<Pressable onPress={() => setVisible(false)}>
<MaterialIcons name="close" color="black" size={22} />
</Pressable>
</View>
<View style={Styles.contentContainer}>
{children}
</View>
</View>
}
</Modal>
)
}

2
components/group/headerGroupList.tsx
View File

@@ -78,7 +78,7 @@ export default function HeaderRightGroupList() {
</View>
</DrawerBottom>
<DrawerBottom animation="none" height={30} isVisible={isVisibleTambah} setVisible={() => setVisibleTambah(false)} title="Tambah Lembaga Desa">
<DrawerBottom animation="none" keyboard height={30} isVisible={isVisibleTambah} setVisible={() => setVisibleTambah(false)} title="Tambah Lembaga Desa">
<View style={{ flex: 1 }}>
<View>
<InputForm

6
components/member/headerMemberList.tsx
View File

@@ -17,7 +17,7 @@ export default function HeaderMemberList() {
return (
<>
<ButtonMenuHeader onPress={() => { setVisible(true) }} />
<DrawerBottom animation="slide" isVisible={isVisible} setVisible={setVisible} title="Menu">
<DrawerBottom animation="slide" isVisible={isVisible} setVisible={() => setVisible(false)} title="Menu">
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<AntDesign name="pluscircle" color="black" size={25} />}
@@ -34,7 +34,9 @@ export default function HeaderMemberList() {
title="Filter"
onPress={() => {
setVisible(false)
setFilter(true)
setTimeout(() => {
setFilter(true)
}, 600)
}}
/>
}

2
components/modalSelect.tsx
View File

@@ -126,7 +126,7 @@ export default function ModalSelect({ open, close, title, category, idParent, on
}
return (
<DrawerBottom animation="none" isVisible={open} setVisible={close} title={title} height={(category == 'gender' || category == 'status-task') ? 25 : category == 'member' ? 100 : 75}>
<DrawerBottom animation="none" isVisible={open} setVisible={close} title={title} height={(category == 'gender' || category == 'status-task') ? 25 : category == 'member' ? 90 : 75}>
{
category == 'member' &&
<>

2
components/position/headerRightPositionList.tsx
View File

@@ -123,7 +123,7 @@ export default function HeaderRightPositionList() {
</View>
</DrawerBottom>
<DrawerBottom animation="slide" height={45} isVisible={isVisibleTambah} setVisible={() => setVisibleTambah(false)} title="Tambah Jabatan">
<DrawerBottom animation="slide" height={45} keyboard isVisible={isVisibleTambah} setVisible={() => setVisibleTambah(false)} title="Tambah Jabatan">
<View style={{ flex: 1, justifyContent: 'space-between' }}>
<View>
{

4
components/project/headerProjectList.tsx
View File

@@ -37,7 +37,9 @@ export default function HeaderRightProjectList() {
title="Filter"
onPress={() => {
setVisible(false)
setFilter(true)
setTimeout(() => {
setFilter(true)
}, 600)
}}
/>
}

7
components/project/sectionFile.tsx
View File

@@ -28,7 +28,7 @@ type Props = {
idStorage: string
}
export default function SectionFile({ status, member }: { status: number | undefined, member: boolean }) {
export default function SectionFile({ status, member, refreshing }: { status: number | undefined, member: boolean, refreshing?: boolean }) {
const entityUser = useSelector((state: any) => state.user)
const [isModal, setModal] = useState(false)
const { token, decryptToken } = useAuthSession();
@@ -62,6 +62,11 @@ export default function SectionFile({ status, member }: { status: number | undef
handleLoad(false);
}, [update.file]);
useEffect(() => {
if (refreshing)
handleLoad(false);
}, [refreshing]);
useEffect(() => {
handleLoad(true);

9
components/project/sectionMember.tsx
View File

@@ -25,7 +25,7 @@ type Props = {
position: string;
};
export default function SectionMember({ status }: { status: number | undefined }) {
export default function SectionMember({ status, refreshing }: { status: number | undefined, refreshing?: boolean }) {
const dispatch = useDispatch()
const entityUser = useSelector((state: any) => state.user)
const update = useSelector((state: any) => state.projectUpdate)
@@ -62,6 +62,11 @@ export default function SectionMember({ status }: { status: number | undefined }
handleLoad(false);
}, [update.member]);
useEffect(() => {
if (refreshing)
handleLoad(false);
}, [refreshing]);
useEffect(() => {
handleLoad(true);
}, []);
@@ -75,7 +80,7 @@ export default function SectionMember({ status }: { status: number | undefined }
}, id)
if (response.success) {
Toast.show({ type: 'small', text1: 'Berhasil menghapus anggota', })
dispatch(setUpdateProject({ ...update, member: !update.progress }))
dispatch(setUpdateProject({ ...update, member: !update.member }))
setModal(false);
}
} catch (error) {

13
components/project/sectionTanggalTugas.tsx
View File

@@ -26,7 +26,7 @@ type Props = {
createdAt: string;
};
export default function SectionTanggalTugasProject({ status, member }: { status: number | undefined, member: boolean }) {
export default function SectionTanggalTugasProject({ status, member, refreshing }: { status: number | undefined, member: boolean, refreshing?: boolean }) {
const entityUser = useSelector((state: any) => state.user)
const dispatch = useDispatch()
const update = useSelector((state: any) => state.projectUpdate)
@@ -63,6 +63,11 @@ export default function SectionTanggalTugasProject({ status, member }: { status:
handleLoad(false);
}, [update.task]);
useEffect(() => {
if (refreshing)
handleLoad(false);
}, [refreshing]);
useEffect(() => {
handleLoad(true);
}, []);
@@ -163,7 +168,9 @@ export default function SectionTanggalTugasProject({ status, member }: { status:
title="Update Status"
onPress={() => {
setModal(false);
setSelect(true);
setTimeout(() => {
setSelect(true);
}, 600)
}}
/>
<MenuItemRow
@@ -198,7 +205,7 @@ export default function SectionTanggalTugasProject({ status, member }: { status:
<ModalSelect
category="status-task"
close={setSelect}
close={() => { setSelect(false) }}
onSelect={(value) => {
handleUpdate(Number(value.val))
}}

3
constants/Styles.ts
View File

@@ -188,6 +188,9 @@ const Styles = StyleSheet.create({
round10: {
borderRadius: 10
},
h100: {
height: '100%'
},
w100: {
width: '100%'
},