wibu/sistem-desa-mandiri
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

upd: diskusi

Browse Source 
Deskripsi:
- mati validasi form tambah diskusi

- mati validasi form edit diskusi
- loading pada saat tambah diskusi
- loading pada saat edit diskusi

No Issues:
This commit is contained in:
amel
2024-10-07 14:28:42 +08:00
parent e0c704a6ea
commit a561f21524
2 changed files with 87 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/module/discussion/ui/form_create_discussion.tsx
View File

@@ -13,6 +13,7 @@ import { funCreateDiscussion } from "../lib/api_discussion";
export default function FormCreateDiscussion({ id }: { id: string }) {
const [isValModal, setValModal] = useState(false)
const [loadingModal, setLoadingModal] = useState(false)
const router = useRouter()
const [isImg, setImg] = useState("")
const param = useParams<{ id: string, detail: string }>()
@@ -50,26 +51,25 @@ export default function FormCreateDiscussion({ id }: { id: string }) {
async function createDiscussion(val: boolean) {
try {
if (val) {
const response = await funCreateDiscussion({
desc: isData.desc,
idDivision: id
})
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/`)
setValModal(false)
} else {
toast.error(response.message)
}
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 {
setValModal(false)
setLoadingModal(false)
}
}
@@ -94,12 +94,12 @@ export default function FormCreateDiscussion({ id }: { id: string }) {
}}
value={isData.desc}
onChange={(e) => setData({ ...isData, desc: e.target.value })}
onBlur={() => setTouched({ ...touched, desc: true })}
error={
touched.desc && (
isData.desc == "" ? "Form Tidak Boleh Kosong" : null
)
}
// onBlur={() => setTouched({ ...touched, desc: true })}
// error={
// touched.desc && (
// isData.desc == "" ? "Form Tidak Boleh Kosong" : null
// )
// }
/>
</Box>
</Grid.Col>
@@ -130,9 +130,11 @@ export default function FormCreateDiscussion({ id }: { id: string }) {
</Button>
</Box>
<LayoutModal opened={isValModal} onClose={() => setValModal(false)}
<LayoutModal loading={loadingModal} opened={isValModal} onClose={() => setValModal(false)}
description="Apakah Anda yakin ingin menambah data?"
onYes={(val) => { createDiscussion(val) }} />
onYes={(val) => {
createDiscussion(val)
}} />
</Box>
)
}

121
src/module/discussion/ui/form_edit_discussion.tsx
View File

@@ -12,6 +12,7 @@ import { useHookstate } from "@hookstate/core"
export default function FormEditDiscussion() {
const [isValModal, setValModal] = useState(false)
const [loadingModal, setLoadingModal] = useState(false)
const router = useRouter()
const param = useParams<{ id: string, detail: string }>()
const [isDataOne, setDataOne] = useState("")
@@ -35,43 +36,43 @@ export default function FormEditDiscussion() {
}
}
async function fetchEditDiscussion(val: boolean) {
async function fetchEditDiscussion() {
try {
if (val) {
const response = await funEditDiscussion(param.detail, {
desc: isDataOne
})
if (response.success) {
toast.success(response.message)
setValModal(false)
router.push(`/division/${param.id}/discussion/${param.detail}`)
} else {
toast.error(response.message)
}
setLoadingModal(true)
const response = await funEditDiscussion(param.detail, {
desc: isDataOne
})
if (response.success) {
toast.success(response.message)
setValModal(false)
router.push(`/division/${param.id}/discussion/${param.detail}`)
} else {
toast.error(response.message)
}
setValModal(false)
} catch (error) {
console.error(error);
setValModal(false)
toast.error("Gagal menambahkan diskusi, coba lagi nanti");
} finally {
setValModal(false)
setLoadingModal(false)
}
}
async function getData() {
try {
setLoading(true)
const res = await funGetProfileByCookies()
setIMG(`https://wibu-storage.wibudev.com/api/files/${res.data.img}`)
setLoading(false)
setLoading(true)
const res = await funGetProfileByCookies()
setIMG(`https://wibu-storage.wibudev.com/api/files/${res.data.img}`)
setLoading(false)
} catch (error) {
console.error(error);
console.error(error);
} finally {
setLoading(false)
setLoading(false)
}
}
}
useShallowEffect(() => {
fetchGetOneDiscussion()
getData()
@@ -84,43 +85,43 @@ export default function FormEditDiscussion() {
<Box p={20}>
<Grid gutter={0} pt={10}>
<Grid.Col span={2}>
{loading ?
<Skeleton height={60} width={60} radius={100} />
:
<Avatar src={img} alt="it's me" size="lg" />
}
{loading ?
<Skeleton height={60} width={60} radius={100} />
:
<Avatar src={img} alt="it's me" size="lg" />
}
</Grid.Col>
<Grid.Col span={10}>
{loading ?
Array(10)
.fill(null)
.map((_, i) => (
<Box key={i} mb={20}>
<Skeleton height={20} radius={10} />
</Box>
))
:
<Box>
<Textarea
placeholder="Tuliskan apa yang ingin anda diskusikan"
styles={{
input: {
border: 'none',
backgroundColor: 'transparent',
height: "50vh"
}
}}
value={isDataOne}
onChange={(e) => setDataOne(e.target.value)}
onBlur={() => setTouched({ ...touched, desc: true })}
error={
touched.desc && (
isDataOne == "" ? "Form Tidak Boleh Kosong" : null
)
}
/>
</Box>
}
Array(10)
.fill(null)
.map((_, i) => (
<Box key={i} mb={20}>
<Skeleton height={20} radius={10} />
</Box>
))
:
<Box>
<Textarea
placeholder="Tuliskan apa yang ingin anda diskusikan"
styles={{
input: {
border: 'none',
backgroundColor: 'transparent',
height: "50vh"
}
}}
value={isDataOne}
onChange={(e) => setDataOne(e.target.value)}
// onBlur={() => setTouched({ ...touched, desc: true })}
// error={
// touched.desc && (
// isDataOne == "" ? "Form Tidak Boleh Kosong" : null
// )
// }
/>
</Box>
}
</Grid.Col>
</Grid>
</Box>
@@ -153,9 +154,15 @@ export default function FormEditDiscussion() {
}
</Box>
<LayoutModal opened={isValModal} onClose={() => setValModal(false)}
<LayoutModal loading={loadingModal} opened={isValModal} onClose={() => setValModal(false)}
description="Apakah Anda yakin ingin mengubah data?"
onYes={(val) => { fetchEditDiscussion(val) }} />
onYes={(val) => {
if (val) {
fetchEditDiscussion()
} else {
setValModal(false)
}
}} />
</Box>
)
}