upd: divisi
Deskripsi: - load data divisi - user role pada page list divisi - detail divisi - info divisi - tambah anggota divisi - hapus anggota divisi - update status admin divisi No Issues
This commit is contained in:
@@ -3,31 +3,109 @@ import BorderBottomItem from "@/components/borderBottomItem"
|
||||
import ButtonBackHeader from "@/components/buttonBackHeader"
|
||||
import HeaderRightDivisionInfo from "@/components/division/headerDivisionInfo"
|
||||
import DrawerBottom from "@/components/drawerBottom"
|
||||
import ImageUser from "@/components/imageNew"
|
||||
import { ColorsStatus } from "@/constants/ColorsStatus"
|
||||
import Styles from "@/constants/Styles"
|
||||
import { apiDeleteMemberDivision, apiGetDivisionOneDetail, apiUpdateStatusAdminDivision } from "@/lib/api"
|
||||
import { useAuthSession } from "@/providers/AuthProvider"
|
||||
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"
|
||||
import { useEffect, useState } from "react"
|
||||
import { Pressable, SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native"
|
||||
|
||||
type PropsDetail = {
|
||||
id: string,
|
||||
idVillage: string,
|
||||
idGroup: string,
|
||||
name: string,
|
||||
desc: string,
|
||||
isActive: boolean,
|
||||
}
|
||||
|
||||
type PropsMember = {
|
||||
id: string,
|
||||
isAdmin: boolean,
|
||||
isLeader: boolean,
|
||||
idUser: string,
|
||||
name: string,
|
||||
img: string
|
||||
}
|
||||
|
||||
export default function InformationDivision() {
|
||||
const { id } = useLocalSearchParams()
|
||||
const { id } = useLocalSearchParams<{ id: string }>()
|
||||
const [isModal, setModal] = useState(false)
|
||||
const { token, decryptToken } = useAuthSession()
|
||||
const [dataDetail, setDataDetail] = useState<PropsDetail>()
|
||||
const [dataMember, setDataMember] = useState<PropsMember[]>([])
|
||||
const [refresh, setRefresh] = useState(false)
|
||||
const [dataMemberChoose, setDataMemberChoose] = useState({
|
||||
id: '',
|
||||
name: '',
|
||||
isAdmin: false
|
||||
})
|
||||
|
||||
function handleMemberOut() {
|
||||
AlertKonfirmasi({
|
||||
title: 'Konfirmasi',
|
||||
desc: 'Apakah anda yakin ingin mengeluarkan anggota?',
|
||||
onPress: () => {
|
||||
ToastAndroid.show('Berhasil mengeluarkan anggota', ToastAndroid.SHORT)
|
||||
setModal(false)
|
||||
}
|
||||
onPress: () => { memberOut() }
|
||||
})
|
||||
}
|
||||
|
||||
function handleMemberAdmin() {
|
||||
ToastAndroid.show('Berhasil memberhentikan admin', ToastAndroid.SHORT)
|
||||
setModal(false)
|
||||
async function memberOut() {
|
||||
try {
|
||||
const hasil = await decryptToken(String(token?.current))
|
||||
const response = await apiDeleteMemberDivision({ user: hasil, id: dataMemberChoose.id }, id)
|
||||
if (response.success) {
|
||||
setRefresh(!refresh)
|
||||
ToastAndroid.show('Berhasil mengeluarkan anggota', ToastAndroid.SHORT)
|
||||
} else {
|
||||
ToastAndroid.show(response.message, ToastAndroid.SHORT)
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
ToastAndroid.show('Terjadi kesalahan', ToastAndroid.SHORT)
|
||||
} finally {
|
||||
setModal(false)
|
||||
}
|
||||
}
|
||||
|
||||
async function handleMemberAdmin() {
|
||||
try {
|
||||
const hasil = await decryptToken(String(token?.current))
|
||||
const response = await apiUpdateStatusAdminDivision({ user: hasil, id: dataMemberChoose.id, isAdmin: dataMemberChoose.isAdmin }, id)
|
||||
if (response.success) {
|
||||
setRefresh(!refresh)
|
||||
ToastAndroid.show(dataMemberChoose.isAdmin ? 'Berhasil memberhentikan admin' : 'Berhasil menjadi admin', ToastAndroid.SHORT)
|
||||
} else {
|
||||
ToastAndroid.show(response.message, ToastAndroid.SHORT)
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
ToastAndroid.show('Terjadi kesalahan', ToastAndroid.SHORT)
|
||||
} finally {
|
||||
setModal(false)
|
||||
}
|
||||
}
|
||||
|
||||
async function handleLoad() {
|
||||
try {
|
||||
const hasil = await decryptToken(String(token?.current))
|
||||
const response = await apiGetDivisionOneDetail({ user: hasil, id })
|
||||
setDataDetail(response.data.division)
|
||||
setDataMember(response.data.member)
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
handleLoad()
|
||||
}, [refresh])
|
||||
|
||||
function handleChooseMember(item: PropsMember) {
|
||||
setDataMemberChoose(item)
|
||||
setModal(true)
|
||||
}
|
||||
|
||||
return (
|
||||
@@ -45,13 +123,14 @@ export default function InformationDivision() {
|
||||
<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>
|
||||
<Text>{dataDetail?.desc}</Text>
|
||||
</View>
|
||||
</View>
|
||||
<View style={[Styles.mb15]}>
|
||||
<Text style={[Styles.textDefault, Styles.mv05]}>5 Anggota</Text>
|
||||
<Text style={[Styles.textDefault, Styles.mv05]}>{dataMember.length} Anggota</Text>
|
||||
<View style={[Styles.wrapPaper]}>
|
||||
<BorderBottomItem
|
||||
onPress={() => { router.push(`/division/${id}/add-member`) }}
|
||||
borderType="none"
|
||||
icon={
|
||||
<View style={[Styles.iconContent, ColorsStatus.gray]}>
|
||||
@@ -60,73 +139,29 @@ export default function InformationDivision() {
|
||||
}
|
||||
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"
|
||||
/>
|
||||
{
|
||||
dataMember.map((item, index) => {
|
||||
return (
|
||||
<BorderBottomItem
|
||||
width={55}
|
||||
key={index}
|
||||
borderType="bottom"
|
||||
onPress={() => { handleChooseMember(item) }}
|
||||
icon={
|
||||
<ImageUser src={`https://wibu-storage.wibudev.com/api/files/${item.img}`} size="sm" />
|
||||
}
|
||||
title={item.name}
|
||||
rightTopInfo={item.isAdmin ? "Admin" : "Anggota"}
|
||||
/>
|
||||
)
|
||||
})
|
||||
}
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</ScrollView>
|
||||
|
||||
<DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Amalia">
|
||||
<DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title={dataMemberChoose.name}>
|
||||
<View>
|
||||
<Pressable style={[Styles.wrapItemBorderBottom]} onPress={() => { handleMemberAdmin() }}>
|
||||
<View style={[Styles.rowItemsCenter]}>
|
||||
@@ -135,7 +170,7 @@ export default function InformationDivision() {
|
||||
</View>
|
||||
<View style={[Styles.rowSpaceBetween, { width: '88%' }]}>
|
||||
<View style={[Styles.ml10]}>
|
||||
<Text style={[Styles.textDefault]}>Memberhentikan sebagai admin</Text>
|
||||
<Text style={[Styles.textDefault]}>{dataMemberChoose.isAdmin ? 'Memberhentikan sebagai admin' : 'Jadikan admin'}</Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
Reference in New Issue
Block a user