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

upd: diskusi umum

Browse Source 
- tambah diskusi umum
- tambah member pada diskusi umum

No Issues
This commit is contained in:
amel
2025-05-07 14:30:55 +08:00
parent 957812fb49
commit dee684fb88
7 changed files with 296 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -0,0 +1,163 @@
import ButtonBackHeader from "@/components/buttonBackHeader";
import ButtonSaveHeader from "@/components/buttonSaveHeader";
import ImageUser from "@/components/imageNew";
import ImageWithLabel from "@/components/imageWithLabel";
import InputSearch from "@/components/inputSearch";
import Styles from "@/constants/Styles";
import { apiAddMemberDiscussionGeneral, apiGetDiscussionGeneralOne, apiGetUser } from "@/lib/api";
import { setUpdateDiscussionGeneralDetail } from "@/lib/discussionGeneralDetail";
import { useAuthSession } from "@/providers/AuthProvider";
import { AntDesign } from "@expo/vector-icons";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { Pressable, SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native";
import { useDispatch, useSelector } from "react-redux";
type Props = {
idUser: string,
name: string,
img: string
}
export default function AddMemberDiscussionDetail() {
const dispatch = useDispatch()
const update = useSelector((state: any) => state.discussionGeneralDetailUpdate)
const { token, decryptToken } = useAuthSession()
const { id } = useLocalSearchParams<{ id: string }>()
const [dataOld, setDataOld] = useState<Props[]>([])
const [data, setData] = useState<Props[]>([])
const [idGroup, setIdGroup] = useState('')
const [selectMember, setSelectMember] = useState<any[]>([])
const [search, setSearch] = useState('')
async function handleLoad() {
try {
const hasil = await decryptToken(String(token?.current))
const response = await apiGetDiscussionGeneralOne({ id: id, user: hasil, cat: 'anggota' })
setDataOld(response.data)
const responseGroup = await apiGetDiscussionGeneralOne({ id: id, user: hasil, cat: 'detail' })
setIdGroup(responseGroup.data.idGroup)
} catch (error) {
console.error(error)
}
}
async function handleLoadMember() {
const hasil = await decryptToken(String(token?.current))
const response = await apiGetUser({ user: hasil, active: "true", search: search, group: String(idGroup) })
setData(response.data.filter((i: any) => i.idUserRole != 'supadmin'))
}
useEffect(() => {
handleLoad()
}, []);
useEffect(() => {
handleLoadMember()
}, [search])
function onChoose(val: string, label: string, img?: string) {
if (selectMember.some((i: any) => i.idUser == val)) {
setSelectMember(selectMember.filter((i: any) => i.idUser != val))
} else {
setSelectMember([...selectMember, { idUser: val, name: label, img }])
}
}
async function handleAddMember() {
try {
const hasil = await decryptToken(String(token?.current))
const response = await apiAddMemberDiscussionGeneral({ id: id, data: { user: hasil, member: selectMember } })
if (response.success) {
ToastAndroid.show('Berhasil menambahkan anggota', ToastAndroid.SHORT)
dispatch(setUpdateDiscussionGeneralDetail(!update))
router.back()
}
} catch (error) {
console.error(error)
}
}
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Tambah Anggota Diskusi',
headerTitleAlign: 'center',
headerRight: () => (
<ButtonSaveHeader
category="update"
disable={selectMember.length > 0 ? false : true}
onPress={() => {
handleAddMember()
}}
/>
)
}}
/>
<View style={[Styles.p15]}>
<InputSearch onChange={setSearch} value={search} />
{
selectMember.length > 0
?
<View>
<ScrollView horizontal style={[Styles.mb10, Styles.pv10]}>
{
selectMember.map((item: any, index: any) => (
<ImageWithLabel
key={index}
label={item.name}
src={item.img}
onClick={() => onChoose(item.idUser, item.name, item.img)}
/>
))
}
</ScrollView>
</View>
:
<Text style={[Styles.textDefault, Styles.cGray, Styles.pv05, { textAlign: 'center' }]}>Tidak ada member yang dipilih</Text>
}
<ScrollView>
{
data.length > 0 ?
data.map((item: any, index: any) => {
const found = dataOld.some((i: any) => i.idUser == item.id)
return (
<Pressable
key={index}
style={[Styles.itemSelectModal]}
onPress={() => {
!found && onChoose(item.id, item.name, item.img)
}}
>
<View style={[Styles.rowItemsCenter]}>
<ImageUser src={`https://wibu-storage.wibudev.com/api/files/${item.img}`} border />
<View style={[Styles.ml10]}>
<Text style={[Styles.textDefault]}>{item.name}</Text>
{
found && <Text style={[Styles.textInformation, Styles.cGray]}>sudah menjadi anggota</Text>
}
</View>
</View>
{
selectMember.some((i: any) => i.idUser == item.id) && <AntDesign name="check" size={20} />
}
</Pressable>
)
}
)
:
<Text style={[Styles.textDefault, { textAlign: 'center' }]}>Tidak ada data</Text>
}
</ScrollView>
</View>
</SafeAreaView>
)
}

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

@@ -1,27 +1,32 @@
import BorderBottomItem from "@/components/borderBottomItem";
import ButtonBackHeader from "@/components/buttonBackHeader";
import ButtonSaveHeader from "@/components/buttonSaveHeader";
import ButtonSelect from "@/components/buttonSelect";
import ImageUser from "@/components/imageNew";
import { InputForm } from "@/components/inputForm";
import ModalSelect from "@/components/modalSelect";
import SelectForm from "@/components/selectForm";
import Styles from "@/constants/Styles";
import { apiCreateDiscussionGeneral } from "@/lib/api";
import { setUpdateDiscussionGeneralDetail } from "@/lib/discussionGeneralDetail";
import { setMemberChoose } from "@/lib/memberChoose";
import { useAuthSession } from "@/providers/AuthProvider";
import { router, Stack } from "expo-router";
import { useEffect, useState } from "react";
import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native";
import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native";
import { useDispatch, useSelector } from "react-redux";
type Props = {
idUser: string;
name: string;
img: string;
};
export default function CreateDiscussionGeneral() {
const { token, decryptToken } = useAuthSession()
const [chooseGroup, setChooseGroup] = useState({ val: "", label: "" });
const [valChoose, setValChoose] = useState("")
const [valSelect, setValSelect] = useState<"group" | "member">("group");
const [member, setMember] = useState<Props[]>([]);
const dispatch = useDispatch()
const [disableBtn, setDisableBtn] = useState(true);
const [isSelect, setSelect] = useState(false);
const entitiesMember = useSelector((state: any) => state.memberChoose)
const update = useSelector((state: any) => state.discussionGeneralDetailUpdate)
const [dataForm, setDataForm] = useState({
idGroup: "",
title: "",
@@ -36,7 +41,7 @@ export default function CreateDiscussionGeneral() {
function validationForm(cat: string, val: any, label?: string) {
if (cat == "group") {
setChooseGroup({ val, label: String(label) });
setMember([]);
dispatch(setMemberChoose([]))
setDataForm({ ...dataForm, idGroup: val });
if (val == "" || val == "null") {
setError({ ...error, group: true });
@@ -75,15 +80,36 @@ export default function CreateDiscussionGeneral() {
checkForm();
}, [error, dataForm]);
function handleBack() {
dispatch(setMemberChoose([]))
router.back()
}
async function handleCreate() {
try {
const hasil = await decryptToken(String(token?.current))
const response = await apiCreateDiscussionGeneral({
data: { ...dataForm, user: hasil, member: entitiesMember },
})
if (response.success) {
dispatch(setMemberChoose([]))
dispatch(setUpdateDiscussionGeneralDetail(!update))
ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
router.back()
}
} catch (error) {
console.error(error);
}
}
return (
<SafeAreaView>
<Stack.Screen
options={{
headerLeft: () => (
<ButtonBackHeader
onPress={() => {
router.back();
}}
onPress={() => { handleBack() }}
/>
),
headerTitle: "Tambah Diskusi",
@@ -93,11 +119,12 @@ export default function CreateDiscussionGeneral() {
category="create"
disable={disableBtn}
onPress={() => {
ToastAndroid.show(
"Berhasil menambahkan data",
ToastAndroid.SHORT
);
router.push("/discussion?active=true");
entitiesMember.length == 0
? ToastAndroid.show(
"Anda belum memilih anggota",
ToastAndroid.SHORT
)
: handleCreate()
}}
/>
),
@@ -116,12 +143,23 @@ export default function CreateDiscussionGeneral() {
setSelect(true);
}}
/>
<InputForm label="Nama" type="default" placeholder="Nama" required />
<InputForm
label="Judul"
type="default"
placeholder="Judul"
required
error={error.title}
errorText="Judul tidak boleh kosong"
onChange={(val) => { validationForm("title", val) }}
/>
<InputForm
label="Diskusi"
type="default"
placeholder="Hal yang didiskusikan"
required
error={error.desc}
errorText="Diskusi tidak boleh kosong"
onChange={(val) => { validationForm("desc", val) }}
/>
<ButtonSelect
value="Pilih Anggota"
@@ -137,6 +175,32 @@ export default function CreateDiscussionGeneral() {
}
}}
/>
{
entitiesMember.length > 0 &&
<View>
<View style={[Styles.rowSpaceBetween, Styles.mv05]}>
<Text>Anggota</Text>
<Text>Total {entitiesMember.length} Anggota</Text>
</View>
<View style={[Styles.borderAll, Styles.round10, Styles.p10]}>
{
entitiesMember.map((item: { img: any; name: any; }, index: any) => {
return (
<BorderBottomItem
key={index}
borderType="bottom"
icon={
<ImageUser src={`https://wibu-storage.wibudev.com/api/files/${item.img}`} size="sm" />
}
title={item.name}
/>
)
})
}
</View>
</View>
}
</View>
</ScrollView>

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

@@ -29,6 +29,7 @@ export default function Discussion() {
const [search, setSearch] = useState('')
const [nameGroup, setNameGroup] = useState('')
const [data, setData] = useState<Props[]>([])
const update = useSelector((state: any) => state.discussionGeneralDetailUpdate)
async function handleLoad() {
try {
@@ -43,7 +44,7 @@ export default function Discussion() {
useEffect(() => {
handleLoad()
}, [active, search, group])
}, [active, search, group, update])
return (
<SafeAreaView>

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

@@ -27,6 +27,7 @@ export default function MemberDiscussionDetail() {
const [data, setData] = useState<Props[]>([])
const [isModal, setModal] = useState(false)
const [chooseUser, setChooseUser] = useState({ idUser: '', name: '', img: '' })
const update = useSelector((state: any) => state.discussionGeneralDetailUpdate)
async function handleLoad() {
try {
@@ -41,7 +42,7 @@ export default function MemberDiscussionDetail() {
useEffect(() => {
handleLoad()
}, []);
}, [update]);
async function handleDeleteUser() {
try {
@@ -56,7 +57,6 @@ export default function MemberDiscussionDetail() {
}
}
return (
<SafeAreaView>
<Stack.Screen
@@ -73,6 +73,7 @@ export default function MemberDiscussionDetail() {
{
entityUser.role != "user" && entityUser.role != "coadmin" &&
<BorderBottomItem
onPress={() => { router.push(`/discussion/add-member/${id}`) }}
borderType="none"
icon={
<View style={[Styles.iconContent, ColorsStatus.gray]}>

3
components/inputSearch.tsx
View File

@@ -1,7 +1,7 @@
import { Feather } from "@expo/vector-icons";
import { InputForm } from "./inputForm";
export default function InputSearch({ onChange, width }: { onChange?: (val: string) => void, width?: number }) {
export default function InputSearch({ onChange, width, value }: { onChange?: (val: string) => void, width?: number, value?: string }) {
return (
<InputForm
type="default"
@@ -11,6 +11,7 @@ export default function InputSearch({ onChange, width }: { onChange?: (val: stri
onChange={onChange}
width={width}
bg="white"
value={value}
/>
)
}

48
components/modalSelect.tsx
View File

@@ -3,11 +3,13 @@ import { valueRoleUser } from "@/constants/RoleUser"
import Styles from "@/constants/Styles"
import { apiGetGroup, apiGetPosition, apiGetUser } from "@/lib/api"
import { setEntityFilterGroup } from "@/lib/filterSlice"
import { setMemberChoose } from "@/lib/memberChoose"
import { useAuthSession } from "@/providers/AuthProvider"
import { AntDesign } from "@expo/vector-icons"
import { useEffect, useState } from "react"
import { Pressable, ScrollView, Text, View } from "react-native"
import { useDispatch, useSelector } from "react-redux"
import { ButtonForm } from "./buttonForm"
import DrawerBottom from "./drawerBottom"
import ImageUser from "./imageNew"
import ImageWithLabel from "./imageWithLabel"
@@ -84,7 +86,7 @@ export default function ModalSelect({ open, close, title, category, idParent, on
handleLoadMember()
}
setChooseValue({ ...chooseValue, val: valChoose })
}, [dispatch, open]);
}, [dispatch, open, search]);
function onChoose(val: string, label: string, img?: string) {
if (category == "member") {
@@ -100,29 +102,37 @@ export default function ModalSelect({ open, close, title, category, idParent, on
}
}
function handleChooseMember() {
dispatch(setMemberChoose(selectMember))
close(false)
}
return (
<DrawerBottom animation="none" isVisible={open} setVisible={close} title={title} height={category == 'gender' ? 25 : category == 'member' ? 100 : 75}>
{
category == 'member' &&
<>
<InputSearch onChange={setSearch} />
<InputSearch onChange={setSearch} value={search} />
{
selectMember.length > 0
?
<ScrollView horizontal style={[Styles.mb10, Styles.pv10]}>
{
selectMember.map((item: any, index: any) => (
<ImageWithLabel
key={index}
label={item.name}
src={item.img}
onClick={() => onChoose(item.idUser, item.name, item.img)}
/>
))
}
</ScrollView>
<View>
<ScrollView horizontal style={[Styles.mb10, Styles.pv10]}>
{
selectMember.map((item: any, index: any) => (
<ImageWithLabel
key={index}
label={item.name}
src={item.img}
onClick={() => onChoose(item.idUser, item.name, item.img)}
/>
))
}
</ScrollView>
</View>
:
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada member yang dipilih</Text>
<Text style={[Styles.textDefault, Styles.cGray, Styles.pv05, { textAlign: 'center' }]}>Tidak ada member yang dipilih</Text>
}
</>
}
@@ -171,6 +181,14 @@ export default function ModalSelect({ open, close, title, category, idParent, on
</View>
</ScrollView>
{
category == 'member' &&
<ButtonForm
onPress={() => { handleChooseMember() }}
text="PILIH MEMBER"
disabled={selectMember.length == 0}
/>
}
</DrawerBottom >
)
}

12
lib/api.ts
View File

@@ -191,3 +191,15 @@ export const apiEditDiscussionGeneral = async (data: { user: string, title: stri
const response = await api.put(`/mobile/discussion-general/${id}`, data)
return response.data;
};
export const apiCreateDiscussionGeneral = async ({ data }: { data: { idGroup: string, title: string, desc: string, user: string, member: [] } }) => {
const response = await api.post(`/mobile/discussion-general/`, data)
return response.data;
};
export const apiAddMemberDiscussionGeneral = async ({ data, id }: { data: { user: string, member: any[] }, id: string }) => {
const response = await api.post(`/mobile/discussion-general/${id}/member`, data)
return response.data;
};