upd: diskusi umum

This commit is contained in:
2025-01-03 12:14:00 +08:00
parent de9706bcfe
commit b51f122845
3 changed files with 87 additions and 125 deletions

View File

@@ -1,140 +1,86 @@
'use client' 'use client'
import { keyWibu, TEMA } from "@/module/_global"; import { funGetAllGroup, IDataGroup } from "@/module/group";
import LayoutModal from "@/module/_global/layout/layout_modal"; import { Box, Group, Select, Text, TextInput } from "@mantine/core";
import { funGetProfileByCookies } from "@/module/user/profile/lib/api_profile";
import { useHookstate } from "@hookstate/core";
import { Avatar, Box, Button, Grid, rem, Textarea } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks"; import { useShallowEffect } from "@mantine/hooks";
import { useParams, useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import toast from "react-hot-toast"; import toast from "react-hot-toast";
import { useWibuRealtime } from "wibu-realtime"; import { IoIosArrowDropright } from "react-icons/io";
export default function FormCreateDiscussionGeneral() { export default function FormCreateDiscussionGeneral() {
const [isValModal, setValModal] = useState(false) const [dataGroup, setDataGroup] = useState<IDataGroup[]>([]);
const [loadingModal, setLoadingModal] = useState(false)
const router = useRouter()
const param = useParams<{ id: string, detail: string }>()
const [loading, setLoading] = useState(true)
const [img, setIMG] = useState<any | null>()
const tema = useHookstate(TEMA)
const [touched, setTouched] = useState({
desc: false,
});
const [isData, setData] = useState({
desc: "",
idDivision: param.id
})
const [data, setDataRealtime] = useWibuRealtime({
WIBU_REALTIME_TOKEN: keyWibu,
project: "sdm"
})
async function getData() { async function loadData() {
try { const loadGroup = await funGetAllGroup('?active=true')
setLoading(true) if (loadGroup.success) {
const res = await funGetProfileByCookies() setDataGroup(loadGroup.data);
setIMG(`https://wibu-storage.wibudev.com/api/files/${res.data.img}`) } else {
setLoading(false) toast.error(loadGroup.message);
} catch (error) {
console.error(error);
} finally {
setLoading(false)
} }
} }
useShallowEffect(() => { useShallowEffect(() => {
getData() loadData();
}, []) }, []);
// async function createDiscussion(val: boolean) {
// try {
// if (val) {
// setLoadingModal(true)
// const response = await funCreateDiscussion({
// desc: isData.desc,
// idDivision: id
// })
// if (response.success) {
// setDataRealtime(response.notif)
// toast.success(response.message)
// router.push(`/division/${param.id}/discussion/`)
// } else {
// toast.error(response.message)
// }
// }
// } catch (error) {
// console.error(error);
// toast.error("Gagal menambahkan diskusi, coba lagi nanti");
// } finally {
// setLoadingModal(false)
// setValModal(false)
// }
// }
return ( return (
<Box >
<Box p={20}> <Box p={20}>
<Grid pt={10}>
<Grid.Col span={2}>
<Avatar src={img} alt="it's me" size="lg" />
</Grid.Col>
<Grid.Col span={10}>
<Box> <Box>
<Textarea <Select
placeholder="Tuliskan apa yang ingin anda diskusikan" placeholder="Grup"
label="Grup"
size="md"
styles={{ styles={{
input: { input: {
border: 'none', border: `1px solid ${"#D6D8F6"}`,
backgroundColor: 'transparent', borderRadius: 10,
height: "50vh" },
}
}} }}
value={isData.desc} required
onChange={(e) => setData({ ...isData, desc: e.target.value })} data={dataGroup?.map((pro: any) => ({
// onBlur={() => setTouched({ ...touched, desc: true })} value: String(pro.id),
// error={ label: pro.name
// touched.desc && ( }))}
// isData.desc == "" ? "Form Tidak Boleh Kosong" : null
// )
// }
/> />
</Box> <TextInput
</Grid.Col> label="Judul"
</Grid> styles={{
</Box> input: {
<Box pos={'fixed'} bottom={0} p={rem(20)} w={"100%"} style={{ border: `1px solid ${"#D6D8F6"}`,
maxWidth: rem(550), borderRadius: 10,
zIndex: 999, },
backgroundColor: `${tema.get().bgUtama}`, }}
}}> mt={10}
<Button required withAsterisk
color="white" placeholder="Judul"
bg={tema.get().utama} size="md"
size="lg" />
radius={30} <TextInput
fullWidth label="Diskusi"
onClick={() => { styles={{
if ( input: {
isData.desc !== "" border: `1px solid ${"#D6D8F6"}`,
) { borderRadius: 10,
setValModal(true) },
} else { }}
toast.error("Form Tidak Boleh Kosong"); mt={10}
} required withAsterisk
placeholder="Hal yg akan didiskusikan"
size="md"
/>
<Box mt={15}>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}} }}
> >
Simpan <Text>Pilih Anggota</Text>
</Button> <IoIosArrowDropright size={25} />
</Group>
</Box>
</Box> </Box>
<LayoutModal loading={loadingModal} opened={isValModal} onClose={() => setValModal(false)}
description="Apakah Anda yakin ingin menambah data?"
onYes={(val) => {
// createDiscussion(val)
}} />
</Box> </Box>
) )
} }

View File

@@ -4,7 +4,7 @@ import { useHookstate } from '@hookstate/core';
import { ActionIcon, Box, Center, SimpleGrid, Text } from '@mantine/core'; import { ActionIcon, Box, Center, SimpleGrid, Text } from '@mantine/core';
import { useMediaQuery } from '@mantine/hooks'; import { useMediaQuery } from '@mantine/hooks';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import { FaUserTag, FaUserTie } from 'react-icons/fa6'; import { FaComments, FaUserTag, FaUserTie } from 'react-icons/fa6';
import { HiMegaphone, HiMiniPresentationChartBar, HiMiniUserGroup } from "react-icons/hi2"; import { HiMegaphone, HiMiniPresentationChartBar, HiMiniUserGroup } from "react-icons/hi2";
import { IoColorPalette } from 'react-icons/io5'; import { IoColorPalette } from 'react-icons/io5';
import { PiUsersFourFill } from "react-icons/pi"; import { PiUsersFourFill } from "react-icons/pi";
@@ -72,6 +72,22 @@ export default function ViewDetailFeature() {
<Text fz={isMobile ? 13 : 15} c={tema.get().utama}>Pengumuman</Text> <Text fz={isMobile ? 13 : 15} c={tema.get().utama}>Pengumuman</Text>
</Center> </Center>
</Box> </Box>
<Box onClick={() => router.push('/discussion')}>
<Center>
<ActionIcon variant="gradient"
size={isMobile ? 50 : 68}
aria-label="Gradient action icon"
radius={100}
// gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}
bg={tema.get().bgFiturHome}
>
<FaComments size={isMobile ? 25 : 35} color={tema.get().utama} />
</ActionIcon>
</Center>
<Center>
<Text fz={isMobile ? 13 : 15} c={tema.get().utama}>Diskusi</Text>
</Center>
</Box>
<Box onClick={() => router.push('/member')}> <Box onClick={() => router.push('/member')}>
<Center> <Center>
<ActionIcon variant="gradient" <ActionIcon variant="gradient"