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

Merge branch 'join' into lukman/15-agustus-2024

Browse Source
This commit is contained in:
Moh Alif Al Lukman
2024-08-15 17:32:28 +08:00
committed by GitHub
parent e608bf70bc a27684f3ac
commit 4c83402d72
18 changed files with 772 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
prisma/schema.prisma
View File

@@ -274,7 +274,7 @@ model DivisionProjectTask {
DivisionProject DivisionProject @relation(fields: [idProject], references: [id])
idProject String
title String
desc String @db.Text
desc String? @db.Text
status Int @default(0) // 0 = todo, 1 = done
dateStart DateTime @db.Date
dateEnd DateTime @db.Date

17
src/app/(application)/division/[id]/(fitur-division)/task/create/page.tsx
View File

@@ -1,16 +1,11 @@
import { ViewCreateTaskDivision } from "@/module/division_new";
import { ViewDateEndTask, CreateUsersProject, ViewFileSave } from "@/module/project";
import { CreateTask, FileSave } from "@/module/task";
function Page({ searchParams }: { searchParams: any }) {
if (searchParams.page == "task")
return <ViewDateEndTask kategori="task"/>;
if (searchParams.page == "create-users")
return <CreateUsersProject kategori="task"/>
if (searchParams.page == "file-save")
return <ViewFileSave kategori="task"/>
return <ViewCreateTaskDivision searchParams={searchParams} />
if (searchParams.page == "file-save")
return <FileSave kategori="task" />
return <CreateTask />
}
export default Page
// onClick={() => router.push('/document?page=list-document')}
export default Page

2
src/app/api/calender/[id]/route.ts
View File

@@ -1,3 +1,4 @@
import { prisma } from "@/module/_global";
import { funGetUserByCookies } from "@/module/auth";
import _, { result } from "lodash";
@@ -91,3 +92,4 @@ export async function GET(request: Request, context: { params: { id: string } })
);
}
}

3
src/app/api/task/route.ts
View File

@@ -67,9 +67,6 @@ export async function GET(request: Request) {
member: v.DivisionProjectMember.length
}))
console.log('amalia', formatData)
return NextResponse.json({ success: true, message: "Berhasil mendapatkan divisi", data, }, { status: 200 });
} catch (error) {

7
src/module/division_new/_division_fitur/task/view/view_create_division_task.tsx
View File

@@ -1,7 +0,0 @@
import CreateTask from "../component/create_task";
export default function ViewCreateTaskDivision({ searchParams }: { searchParams: any }) {
return (
<CreateTask searchParams={searchParams} />
);
}

4
src/module/division_new/index.ts
View File

@@ -9,7 +9,6 @@ import ViewDivisionCalender from "./_division_fitur/calender/view/view_division_
import ViewHistoryDivisionCalender from "./_division_fitur/calender/view/view_history_division_calender";
import ViewUpdateDivisionCalender from "./_division_fitur/calender/view/view_update_division_calender";
import ViewDocumentDivision from "./_division_fitur/document/view/view_document_division";
import ViewCreateTaskDivision from "./_division_fitur/task/view/view_create_division_task";
import ViewDetailDivisionTask from "./_division_fitur/task/view/view_detail_division_task";
import ViewUpdateProgressDivisionTask from "./_division_fitur/task/view/view_update_progress_division_task";
import CreateAdminDivision from "./ui/create_admin_division";
@@ -27,6 +26,7 @@ import CreateAnggotaDivision from './ui/create_anggota_division';
import EditDivision from './ui/edit_division';
import CreateReport from './ui/create_report';
import ReportDivisionId from './ui/report_division_id';
import { funGetDivisionById } from './lib/api_division';
export { CreateUsers };
export { CreateAdminDivision };
@@ -34,7 +34,6 @@ export { ViewDetailDivisionTask };
export { ViewUpdateProgressDivisionTask };
export { ViewDivisionCalender };
export { ViewCreateDivisionCalender };
export { ViewCreateTaskDivision };
export { UlangiEvent };
export { CreateUserDivisionCalender };
export { ViewHistoryDivisionCalender };
@@ -57,3 +56,4 @@ export { CreateAnggotaDivision }
export { EditDivision }
export { CreateReport }
export { ReportDivisionId }
export { funGetDivisionById }

10
src/module/task/index.ts
View File

@@ -1,5 +1,13 @@
import ViewDateEndTask from "./ui/create_date_end_task";
import CreateTask from "./ui/create_task";
import CreateUsersProject from "./ui/create_users_project";
import FileSave from "./ui/file_save";
import NavbarDivisionTask from "./ui/navbar_division_task";
import TabsDivisionTask from "./ui/tabs_division_task";
export { NavbarDivisionTask }
export { TabsDivisionTask }
export { TabsDivisionTask }
export { CreateTask }
export { ViewDateEndTask }
export { CreateUsersProject }
export { FileSave }

20
src/module/task/lib/type_task.ts
View File

@@ -0,0 +1,20 @@
export interface IDataTask {
id: string
title: string
desc: string,
status: number,
progress: number,
member: number
}
export interface IFormMemberTask {
idUser: string,
name: string
}
export interface IFormDateTask {
dateStart: Date,
dateEnd: Date,
title: string
}

4
src/module/task/lib/val_task.ts Normal file
View File

@@ -0,0 +1,4 @@
import { hookstate } from "@hookstate/core";
import { IFormMemberTask } from "./type_task";
export const globalMemberTask = hookstate<IFormMemberTask[]>([]);

116
src/module/task/ui/create_date_end_task.tsx Normal file
View File

@@ -0,0 +1,116 @@
"use client";
import { LayoutNavbarNew, WARNA } from "@/module/_global";
import {
Avatar,
Box,
Button,
Flex,
Group,
Input,
SimpleGrid,
Stack,
Text,
} from "@mantine/core";
import React, { useState } from "react";
import { DatePicker } from "@mantine/dates";
import { useRouter } from "next/navigation";
import toast from "react-hot-toast";
import { IFormDateTask } from "../lib/type_task";
import moment from "moment";
export default function ViewDateEndTask({ onClose }: { onClose: (val: IFormDateTask) => void }) {
const [value, setValue] = useState<[Date | null, Date | null]>([null, null]);
const router = useRouter()
const [title, setTitle] = useState("")
function onSubmit() {
if (value[0] == null || value[1] == null)
return toast.error("Error! harus memilih tanggal")
if (title == "")
return toast.error("Error! harus memasukkan judul tugas")
onClose(
{
dateStart: value[0],
dateEnd: value[1],
title: title
}
)
}
return (
<Box>
<LayoutNavbarNew back="" title={"Tanggal Tugas"} menu />
<Box p={20}>
<Group
justify="center"
bg={"white"}
py={20}
style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}
>
<DatePicker
styles={{}}
type="range"
value={value}
onChange={setValue}
size="md"
c={WARNA.biruTua}
/>
</Group>
<SimpleGrid cols={{ base: 2, sm: 2, lg: 2 }} mt={20}>
<Box>
<Text>Tanggal Mulai</Text>
<Group
justify="center"
bg={"white"}
h={45}
style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}
>
<Text>{value[0] ? `${moment(value[0]).format('DD-MM-YYYY')}` : ""}</Text>
</Group>
</Box>
<Box>
<Text c={WARNA.biruTua}>Tanggal Berakhir</Text>
<Group
justify="center"
bg={"white"}
h={45}
style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}
>
<Text>{value[1] ? `${moment(value[1]).format('DD-MM-YYYY')}` : ""}</Text>
</Group>
</Box>
</SimpleGrid>
<Stack pt={15}>
<Input
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
placeholder="Input Nama Tahapan"
size="md"
value={title}
onChange={(e) => setTitle(e.target.value)}
/>
</Stack>
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => { onSubmit() }}
>
Simpan
</Button>
</Box>
</Box>
</Box>
);
}

205
src/module/task/ui/create_task.tsx Normal file
View File

@@ -0,0 +1,205 @@
"use client";
import { LayoutDrawer, LayoutNavbarNew, WARNA } from "@/module/_global";
import { Avatar, Box, Button, Center, Flex, Group, Input, Stack, Text } from "@mantine/core";
import { useRouter } from "next/navigation";
import React, { useState } from "react";
import { IoIosArrowDropright } from "react-icons/io";
import { BsFiletypeCsv } from "react-icons/bs";
import CreateUsersProject from "./create_users_project";
import ResultsDateAndTask from "./results_date-and_task";
import ResultsFile from "./results_file";
import { useHookstate } from "@hookstate/core";
import { globalMemberTask } from "../lib/val_task";
import ViewDateEndTask from "./create_date_end_task";
import { IFormDateTask } from "../lib/type_task";
export default function CreateTask() {
const router = useRouter();
const [openDrawer, setOpenDrawer] = useState(false)
const [openMember, setOpenMember] = useState(false)
const [openTugas, setOpenTugas] = useState(false)
const member = useHookstate(globalMemberTask)
const [dataTask, setDataTask] = useState<IFormDateTask[]>([])
if (openTugas) return <ViewDateEndTask onClose={(val) => {
setDataTask([...dataTask, val])
setOpenTugas(false)
}} />;
if (openMember) return <CreateUsersProject onClose={() => setOpenMember(false)} />
return (
<Box>
<LayoutNavbarNew back="" title="tambah tugas" menu />
<Box p={20}>
<Stack>
<Input
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
placeholder="Nama Proyek"
size="md"
/>
<Box onClick={() => { setOpenTugas(true) }}>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
>
<Text>Tambah Tanggal & Tugas</Text>
<IoIosArrowDropright size={25} />
</Group>
</Box>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
onClick={() => setOpenDrawer(true)}
>
<Text>Upload File</Text>
<IoIosArrowDropright size={25} />
</Group>
<Box onClick={() => setOpenMember(true)}>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
>
<Text c={WARNA.biruTua}>Tambah Anggota</Text>
<IoIosArrowDropright size={25} />
</Group>
</Box>
</Stack>
{
dataTask.length > 0 &&
<Box pt={20}>
<Text fw={'bold'} c={WARNA.biruTua}>Tanggal & Tugas</Text>
{
dataTask.map((v, i) => {
return (
<Box key={i}>
<ResultsDateAndTask dateStart={v.dateStart} dateEnd={v.dateEnd} title={v.title} />
</Box>
)
})
}
</Box>
}
{/* <ResultsFile /> */}
{
member.length > 0 &&
<Box pt={30}>
<Group justify="space-between">
<Text c={WARNA.biruTua}>Anggota Terpilih</Text>
<Text c={WARNA.biruTua}>Total {member.length} Anggota</Text>
</Group>
<Box pt={10}>
<Box mb={20}>
<Box
style={{
border: `1px solid ${"#C7D6E8"}`,
borderRadius: 10,
}}
px={20}
py={10}
>
{member.get().map((v: any, i: any) => {
return (
<Flex
justify={"space-between"}
align={"center"}
mt={20}
key={i}
>
<Group>
<Avatar src={"v.image"} alt="it's me" size="lg" />
<Box>
<Text c={WARNA.biruTua} fw={"bold"}>
{v.name}
</Text>
</Box>
</Group>
<Text c={WARNA.biruTua} fw={"bold"}>
Anggota
</Text>
</Flex>
);
})}
</Box>
</Box>
</Box>
</Box>
}
<Box mt="xl">
<Button color="white" bg={WARNA.biruTua} size="lg" radius={30} fullWidth onClick={() => router.push('/task')}>
Simpan
</Button>
</Box>
</Box>
<LayoutDrawer
opened={openDrawer}
onClose={() => setOpenDrawer(false)}
title={"Pilih File"}
>
<Flex justify={"space-around"}>
<Box onClick={() => ""}>
<Box
bg={"#DCEED8"}
style={{
border: `1px solid ${"#D6D8F6"}`,
padding: 20,
borderRadius: 10,
}}
>
<Center>
<BsFiletypeCsv size={40} />
</Center>
</Box>
<Text mt={10} ta={"center"}>
Pilih file
</Text>
<Text ta={"center"}>diperangkat</Text>
</Box>
<Box onClick={() => router.push("/task/create?page=file-save")}>
<Box
bg={"#DCEED8"}
style={{
border: `1px solid ${"#D6D8F6"}`,
padding: 20,
borderRadius: 10,
}}
>
<Center>
<BsFiletypeCsv size={40} />
</Center>
</Box>
<Text mt={10} ta={"center"}>
Pilih file yang
</Text>
<Text ta={"center"}>sudah ada</Text>
</Box>
</Flex>
</LayoutDrawer>
</Box >
);
}

166
src/module/task/ui/create_users_project.tsx Normal file
View File

@@ -0,0 +1,166 @@
"use client"
import { LayoutNavbarNew, WARNA } from "@/module/_global";
import { funGetDivisionById, IDataMemberDivision } from "@/module/division_new";
import { useHookstate } from "@hookstate/core";
import {
Anchor,
Avatar,
Box,
Button,
Checkbox,
Divider,
Flex,
Group,
Text,
TextInput,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useParams, useRouter } from "next/navigation";
import React, { useState } from "react";
import toast from "react-hot-toast";
import { globalMemberTask } from "../lib/val_task";
import { FaCheck } from "react-icons/fa6";
export default function CreateUsersProject({ onClose }: { onClose: (val: any) => void }) {
const router = useRouter()
const param = useParams<{ id: string }>()
const [selectedFiles, setSelectedFiles] = useState<any>([])
const [isData, setData] = useState<IDataMemberDivision[]>([])
const member = useHookstate(globalMemberTask)
const [selectAll, setSelectAll] = useState(false)
async function getData() {
try {
const response = await funGetDivisionById(param.id)
if (response.success) {
setData(response.data.member)
if (member.length > 0) {
setSelectedFiles(JSON.parse(JSON.stringify(member.get())))
}
} else {
toast.error(response.message)
}
} catch (error) {
console.log(error)
toast.error("Gagal mendapatkan anggota, coba lagi nanti");
}
}
useShallowEffect(() => {
getData()
}, []);
const handleFileClick = (index: number) => {
if (selectedFiles.some((i: any) => i.idUser == isData[index].idUser)) {
setSelectedFiles(selectedFiles.filter((i: any) => i.idUser != isData[index].idUser))
} else {
setSelectedFiles([...selectedFiles, { idUser: isData[index].idUser, name: isData[index].name }])
}
};
const handleSelectAll = () => {
setSelectAll(!selectAll);
if (!selectAll) {
for (let index = 0; index < isData.length; index++) {
if (!selectedFiles.some((i: any) => i.idUser == isData[index].idUser)) {
const newArr = {
idUser: isData[index].idUser, name: isData[index].name
}
setSelectedFiles((selectedFiles: any) => [...selectedFiles, newArr])
}
}
} else {
setSelectedFiles([]);
}
};
function onSubmit() {
if (selectedFiles.length == 0) {
return toast.error("Error! silahkan pilih anggota")
}
member.set(selectedFiles)
onClose(true)
}
return (
<Box>
<LayoutNavbarNew
// back=""
title="Pilih Anggota"
menu
/>
<Box p={20}>
{/* <TextInput
styles={{
input: {
color: WARNA.biruTua,
borderRadius: WARNA.biruTua,
borderColor: WARNA.biruTua,
},
}}
size="md"
radius={30}
leftSection={<HiMagnifyingGlass size={20} />}
placeholder="Pencarian"
/> */}
<Group justify="space-between" mt={20} onClick={handleSelectAll}>
<Text c={WARNA.biruTua} fw={"bold"}>
Pilih Semua Anggota
</Text>
{selectAll ? <FaCheck style={{ marginRight: 10 }} /> : ""}
</Group>
<Box mt={15}>
{isData.map((v, i) => {
const isSelected = selectedFiles.some((i: any) => i?.idUser == v.idUser);
return (
<Box mb={15} key={i} onClick={() => handleFileClick(i)}>
<Flex justify={"space-between"} align={"center"}>
<Group>
<Avatar src={"v.image"} alt="it's me" size="lg" />
<Text style={{
cursor: 'pointer',
display: 'flex',
alignItems: 'center',
}}>
{v.name}
</Text>
</Group>
<Text
style={{
cursor: 'pointer',
display: 'flex',
alignItems: 'center',
paddingLeft: 20,
}}
>
{isSelected ? <FaCheck style={{ marginRight: 10 }} /> : ""}
</Text>
</Flex>
<Divider my={"md"} />
</Box>
);
})}
</Box>
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => {onSubmit()}}
>
Simpan
</Button>
</Box>
</Box>
</Box>
);
}

2
src/module/task/ui/drawer_division_task.tsx
View File

@@ -9,7 +9,7 @@ export default function DrawerDivisionTask() {
<SimpleGrid
cols={{ base: 3, sm: 3, lg: 3 }}
>
<Flex onClick={() => window.location.href = "/task/create"} justify={'center'} align={'center'} direction={'column'} >
<Flex onClick={() => window.location.href = "task/create"} justify={'center'} align={'center'} direction={'column'} >
<Box>
<IoAddCircle size={30} color={WARNA.biruTua} />
</Box>

88
src/module/task/ui/file_save.tsx Normal file
View File

@@ -0,0 +1,88 @@
'use client'
import { LayoutNavbarNew, WARNA } from "@/module/_global";
import { Box, Button, Center, SimpleGrid, Text } from "@mantine/core";
import { useRouter } from "next/navigation";
import React, { useState } from "react";
import { BsFiletypeCsv } from "react-icons/bs";
const dataFile = [
{
id: 1,
name: "Semua_Proyek.csv",
},
{
id: 2,
name: "Proyek_Dinas.csv",
},
{
id: 3,
name: "Proyek_Lpd.csv",
},
{
id: 4,
name: "Proyek_Lembaga1.csv",
},
{
id: 5,
name: "Proyek_Lembaga2.csv",
},
{
id: 6,
name: "Proyek_Lembaga3.csv",
},
];
export default function FileSave({ kategori }: { kategori: string }) {
const router = useRouter()
const [selectedFiles, setSelectedFiles] = useState<Record<number, boolean>>({});
const handleFileClick = (index: number) => {
setSelectedFiles((prevSelectedFiles) => ({
...prevSelectedFiles,
[index]: !prevSelectedFiles[index],
}));
};
return (
<Box>
<LayoutNavbarNew back="" title="File Tersimpan" menu />
<Box p={20}>
<SimpleGrid
cols={{ base: 2, sm: 2, lg: 2 }}
spacing={{ base: 20, sm: "xl" }}
verticalSpacing={{ base: "md", sm: "xl" }}
>
{dataFile.map((file, index) => {
const isSelected = selectedFiles[index];
return (
<Box key={index} mb={20}>
<Box
bg={"#DCEED8"}
style={{
border: `${isSelected ? "2px solid #FFC107" : "1px solid #D6D8F6"}`,
borderRadius: 10,
}}
py={30}
onClick={() => handleFileClick(index)}
>
<Center>
<BsFiletypeCsv size={80} />
</Center>
</Box>
<Text mt={10} ta="center">
{file.name}
</Text>
</Box>
);
})}
</SimpleGrid>
<Box mt="xl">
<Button color="white" bg={WARNA.biruTua} size="lg" radius={30} fullWidth onClick={() => router.push(`/${kategori}/create?anggota=yes&files=yes&button=yes`)}>
Simpan
</Button>
</Box>
</Box>
</Box>
);
}

52
src/module/task/ui/list_division_task.tsx
View File

@@ -1,9 +1,13 @@
import { WARNA } from "@/module/_global";
import { ActionIcon, Avatar, Badge, Box, Card, Center, Divider, Flex, Grid, Group, Progress, Text, TextInput, Title } from "@mantine/core";
import { useRouter } from "next/navigation";
import { useParams, useRouter, useSearchParams } from "next/navigation";
import { useState } from "react";
import { HiMagnifyingGlass, HiMiniPresentationChartBar, HiOutlineListBullet, HiSquares2X2 } from "react-icons/hi2";
import { MdAccountCircle } from "react-icons/md";
import { IDataTask } from "../lib/type_task";
import { funGetAllTask } from "../lib/api_task";
import toast from "react-hot-toast";
import { useShallowEffect } from "@mantine/hooks";
const dataProject = [
@@ -51,14 +55,47 @@ const dataProject = [
},
]
export default function ListDivisionTask({ status }: { status: string }) {
export default function ListDivisionTask() {
const [isList, setIsList] = useState(false)
const router = useRouter()
const [isData, setData] = useState<IDataTask[]>([])
const param = useParams<{ id: string }>()
const searchParams = useSearchParams()
const status = searchParams.get('status')
const [searchQuery, setSearchQuery] = useState('')
const [loading, setLoading] = useState(true);
const handleList = () => {
setIsList(!isList)
}
const fetchData = async () => {
try {
setData([]);
setLoading(true);
const response = await funGetAllTask('?division=' + param.id + '&status=' + status + '&search=' + searchQuery)
if (response.success) {
setData(response?.data)
} else {
toast.error(response.message);
}
setLoading(false);
} catch (error) {
toast.error("Gagal mendapatkan tugas divisi, coba lagi nanti");
console.error(error);
} finally {
setLoading(false);
}
};
useShallowEffect(() => {
fetchData();
}, [status, searchQuery]);
return (
<Box py={20}>
<Grid justify='center' align='center'>
@@ -91,12 +128,12 @@ export default function ListDivisionTask({ status }: { status: string }) {
<Box bg={"#DCEED8"} p={10} style={{ borderRadius: 10 }}>
<Text fw={'bold'} c={WARNA.biruTua}>Total Proyek</Text>
<Flex justify={'center'} align={'center'} h={'100%'}>
<Text fz={40} fw={'bold'} c={WARNA.biruTua}>35</Text>
<Text fz={40} fw={'bold'} c={WARNA.biruTua}>{isData.length}</Text>
</Flex>
</Box>
{isList ? (
<Box pt={20}>
{dataProject.map((v, i) => {
{isData.map((v, i) => {
return (
<Box key={i}>
<Group justify="space-between" mb={10} onClick={() => router.push(`/task/${v.id}`)}>
@@ -118,9 +155,6 @@ export default function ListDivisionTask({ status }: { status: string }) {
</Center>
<Text>{v.title}</Text>
</Group>
{/* <Box>
<RiCircleFill size={12} color={v.color} />
</Box> */}
</Group>
<Divider my="sm" />
</Box>
@@ -129,7 +163,7 @@ export default function ListDivisionTask({ status }: { status: string }) {
</Box>
) : (
<Box pt={20}>
{dataProject.map((v, i) => {
{isData.map((v: any, i: any) => {
return (
<Box key={i} mb={20}>
<Card shadow="sm" padding="md" component="a" radius={10} onClick={() => router.push(`/task/${v.id}`)}>
@@ -146,7 +180,7 @@ export default function ListDivisionTask({ status }: { status: string }) {
<Progress.Label>{(status == 'segera') ? 0 : (status == 'dikerjakan') ? 42 : (status == 'selesai') ? 100 : 0}%</Progress.Label>
</Progress.Section>
</Progress.Root>
<Text my={10}>{v.description}</Text>
<Text my={10}>{v.desc}</Text>
<Group align='center' pt={10} justify='space-between'>
<Badge color={'dark'}>{status}</Badge>
<Avatar.Group>

56
src/module/task/ui/results_date-and_task.tsx Normal file
View File

@@ -0,0 +1,56 @@
import { WARNA } from '@/module/_global';
import { Box, Group, SimpleGrid, Text } from '@mantine/core';
import React from 'react';
import { AiOutlineFileSync } from "react-icons/ai";
import { IFormDateTask } from '../lib/type_task';
import moment from 'moment';
export default function ResultsDateAndTask(data: IFormDateTask) {
return (
<Box pt={5}>
<Box bg={"white"} style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 20
}}>
<Box style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10
}}>
<Group>
<AiOutlineFileSync size={25} />
<Text>{data.title}</Text>
</Group>
</Box>
<Box>
<SimpleGrid cols={{ base: 2, sm: 2, lg: 2 }} mt={20}>
<Box>
<Text>Tanggal Mulai</Text>
<Group
justify="center"
bg={"white"}
h={45}
style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}
>
<Text>{moment(data.dateStart).format('DD-MM-YYYY')}</Text>
</Group>
</Box>
<Box>
<Text c={WARNA.biruTua}>Tanggal Berakhir</Text>
<Group
justify="center"
bg={"white"}
h={45}
style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}
>
<Text>{moment(data.dateEnd).format('DD-MM-YYYY')}</Text>
</Group>
</Box>
</SimpleGrid>
</Box>
</Box>
</Box>
);
}

38
src/module/task/ui/results_file.tsx Normal file
View File

@@ -0,0 +1,38 @@
import { WARNA } from '@/module/_global';
import { Box, Group, Text } from '@mantine/core';
import React from 'react';
import { BsFiletypeCsv } from 'react-icons/bs';
export default function ResultsFile() {
return (
<Box pt={20}>
<Text fw={'bold'} c={WARNA.biruTua}>File</Text>
<Box bg={"white"} style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 20
}}>
<Box style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10
}} mb={10}>
<Group>
<BsFiletypeCsv size={25} />
<Text>Proyek Laporan Permasyarakatan</Text>
</Group>
</Box>
<Box style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10
}}>
<Group>
<BsFiletypeCsv size={25} />
<Text>Proyek Laporan Permasyarakatan</Text>
</Group>
</Box>
</Box>
</Box>
);
}

23
src/module/task/ui/tabs_division_task.tsx
View File

@@ -5,11 +5,11 @@ import { IoCloseCircleOutline } from "react-icons/io5";
import { RiProgress3Line } from "react-icons/ri";
import { TbClockPause } from "react-icons/tb";
import ListDivisionTask from "./list_division_task";
import { useParams, useSearchParams } from "next/navigation";
import { useRouter, useSearchParams } from "next/navigation";
export default function TabsDivisionTask() {
const iconStyle = { width: rem(20), height: rem(20) };
const param = useParams<{ id: string }>()
const router = useRouter()
const searchParams = useSearchParams()
const status = searchParams.get('status')
@@ -21,21 +21,28 @@ export default function TabsDivisionTask() {
padding: 5,
borderRadius: 100
}}>
<Tabs.Tab value="0" w={"23%"} leftSection={<TbClockPause style={iconStyle} />}>
<Tabs.Tab value="0" w={"23%"}
leftSection={<TbClockPause style={iconStyle} />}
onClick={() => { router.push("?status=0") }}>
Segera
</Tabs.Tab>
<Tabs.Tab value="1" w={"28%"} leftSection={<RiProgress3Line style={iconStyle} />}>
<Tabs.Tab value="1" w={"28%"}
leftSection={<RiProgress3Line style={iconStyle} />}
onClick={() => { router.push("?status=1") }}>
Dikerjakan
</Tabs.Tab>
<Tabs.Tab value="2" w={"23%"} leftSection={<IoIosCheckmarkCircleOutline style={iconStyle} />}>
<Tabs.Tab value="2" w={"23%"}
leftSection={<IoIosCheckmarkCircleOutline style={iconStyle} />}
onClick={() => { router.push("?status=2") }}>
Selesai
</Tabs.Tab>
<Tabs.Tab value="3" w={"20%"} leftSection={<IoCloseCircleOutline style={iconStyle} />}>
<Tabs.Tab value="3" w={"20%"}
leftSection={<IoCloseCircleOutline style={iconStyle} />}
onClick={() => { router.push("?status=3") }}>
Batal
</Tabs.Tab>
</Tabs.List>
<ListDivisionTask status="segera" />
<ListDivisionTask />
</Tabs>
</Box>
)