Merge pull request #191 from bipproduction/lukman/4-september-2024

style : update style
This commit is contained in:
Amalia
2024-09-04 17:14:07 +08:00
committed by GitHub
6 changed files with 154 additions and 87 deletions

View File

@@ -142,7 +142,7 @@ export async function GET(request: Request, context: { params: { id: string } })
allData = diskusi.map((v: any) => ({ allData = diskusi.map((v: any) => ({
..._.omit(v, ["createdAt", "User"]), ..._.omit(v, ["createdAt", "User"]),
date: moment(v.dateStart).format("LL"), date: moment(v.dateStart).format("ll"),
user: v.User.name user: v.User.name
})) }))
} }

View File

@@ -336,7 +336,7 @@ export async function GET(request: Request) {
allData = data.map((v: any) => ({ allData = data.map((v: any) => ({
..._.omit(v, ["createdAt", "User"]), ..._.omit(v, ["createdAt", "User"]),
date: moment(v.dateStart).format("LL"), date: moment(v.dateStart).format("ll"),
user: v.User.name user: v.User.name
})) }))
} }

View File

@@ -1,6 +1,6 @@
"use client" "use client"
import { WARNA } from "@/module/_global"; import { WARNA } from "@/module/_global";
import { Box, Group, Skeleton, Stack, Text } from "@mantine/core"; import { Box, Grid, Group, Skeleton, Stack, Text } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks"; import { useShallowEffect } from "@mantine/hooks";
import { useParams, useRouter } from "next/navigation"; import { useParams, useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
@@ -50,7 +50,7 @@ export default function ListDiscussionOnDetailDivision() {
style={{ style={{
borderRadius: 10, borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`, border: `1px solid ${"#D6D8F6"}`,
padding: 20, padding: 10,
}} }}
> >
@@ -76,35 +76,52 @@ export default function ListDiscussionOnDetailDivision() {
} }
{data.map((v, i) => { {data.map((v, i) => {
return ( return (
<Box <Box key={i} p={10}>
key={i} <Box style={{
style={{ borderRadius: 10,
borderRadius: 10, border: `1px solid ${"#D6D8F6"}`,
border: `1px solid ${"#D6D8F6"}`, padding: 10,
padding: 10, }}
}} onClick={() => router.push(`${param.id}/discussion/${v.id}`)}
mb={10} >
onClick={() => router.push(`${param.id}/discussion/${v.id}`)} <Group>
> <GoDiscussionClosed size={25} />
<Group> <Box w={{ base: 230, md: 400 }}>
<GoDiscussionClosed size={25} /> <Text fw={"bold"} truncate="end">
<Box w={{ base: 230, md: 400 }}> {v.desc}
<Text fw={"bold"} truncate="end"> </Text>
{v.desc} </Box>
</Text>
</Box>
</Group>
<Group justify="space-between" mt={20} c={"#8C8C8C"}>
<Group gap={5} align="center">
<CiUser size={18} />
<Text fz={13}>{v.user}</Text>
</Group> </Group>
<Group gap={5} align="center"> <Grid align="center" mt={20}>
<CiClock2 size={18} /> <Grid.Col span={{
<Text fz={13}>{v.date}</Text> base: 7,
</Group> xl: 9
</Group> }}>
<Group gap={5} align="center">
<CiUser size={18} />
<Box w={{
base: 125,
xl: 300
}}>
<Text fz={13} lineClamp={1}>
{v.user}
</Text>
</Box>
</Group>
</Grid.Col>
<Grid.Col span={{
base: 5,
xl: 3
}}>
<Group gap={5} align="center" justify="flex-end">
<CiClock2 size={18} />
<Text fz={13}>{v.date}</Text>
</Group>
</Grid.Col>
</Grid>
</Box>
</Box> </Box>
); );
})} })}
</Box> </Box>

View File

@@ -1,6 +1,6 @@
'use client' 'use client'
import { WARNA } from "@/module/_global"; import { WARNA } from "@/module/_global";
import { Box, Group, Skeleton, Text } from "@mantine/core"; import { Box, Grid, Group, SimpleGrid, Skeleton, Text } from "@mantine/core";
import { GoDiscussionClosed } from "react-icons/go"; import { GoDiscussionClosed } from "react-icons/go";
import { CiClock2, CiUser } from "react-icons/ci"; import { CiClock2, CiUser } from "react-icons/ci";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
@@ -48,7 +48,7 @@ export default function ListDiscussion() {
<Box bg={"white"} style={{ <Box bg={"white"} style={{
borderRadius: 10, borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`, border: `1px solid ${"#D6D8F6"}`,
padding: 20 padding: 10
}}> }}>
{ {
@@ -71,11 +71,12 @@ export default function ListDiscussion() {
{ {
isData.map((v, i) => { isData.map((v, i) => {
return ( return (
<Box key={i} style={{ <Box key={i} p={10}>
<Box style={{
borderRadius: 10, borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`, border: `1px solid ${"#D6D8F6"}`,
padding: 10 padding: 10
}} mb={10} onClick={() => router.push(`/division/${v.idDivision}/discussion/${v.id}`)}> }} onClick={() => router.push(`/division/${v.idDivision}/discussion/${v.id}`)}>
<Group> <Group>
<GoDiscussionClosed size={25} /> <GoDiscussionClosed size={25} />
<Box w={{ base: 230, md: 400 }}> <Box w={{ base: 230, md: 400 }}>
@@ -84,16 +85,34 @@ export default function ListDiscussion() {
</Text> </Text>
</Box> </Box>
</Group> </Group>
<Group justify="space-between" mt={20} c={"#8C8C8C"}> <Grid align="center" mt={20}>
<Group gap={5} align="center"> <Grid.Col span={{
<CiUser size={18} /> base: 7,
<Text fz={13}>{v.user}</Text> xl: 9
</Group> }}>
<Group gap={5} align="center"> <Group gap={5} align="center">
<CiClock2 size={18} /> <CiUser size={18} />
<Text fz={13}>{v.date}</Text> <Box w={{
</Group> base: 125,
</Group> xl: 300
}}>
<Text fz={13} lineClamp={1}>
{v.user}
</Text>
</Box>
</Group>
</Grid.Col>
<Grid.Col span={{
base: 5,
xl: 3
}}>
<Group gap={5} align="center" justify="flex-end">
<CiClock2 size={18} />
<Text fz={13}>{v.date}</Text>
</Group>
</Grid.Col>
</Grid>
</Box>
</Box> </Box>
) )
}) })

View File

@@ -1,6 +1,6 @@
'use client' 'use client'
import { WARNA } from "@/module/_global" import { WARNA } from "@/module/_global"
import { Box, Divider, Group, Skeleton, Text } from "@mantine/core" import { Box, Divider, Flex, Group, Skeleton, Text } from "@mantine/core"
import { useRouter } from "next/navigation" import { useRouter } from "next/navigation"
import { useState } from "react" import { useState } from "react"
import { IDataHomeEvent } from "../lib/type_home" import { IDataHomeEvent } from "../lib/type_home"
@@ -68,16 +68,30 @@ export default function ListEventHome() {
const colorDivider = ['#535FCA', '#A7A7A7'][index % 2] const colorDivider = ['#535FCA', '#A7A7A7'][index % 2]
return ( return (
<Box key={event.id} mt={10}> <Box key={event.id} mt={10}>
<Box onClick={() => router.push(`/division/${event.idDivision}/calender/${event.id}`)} bg={bgColor} pl={15} p={10} style={{ <Box onClick={() => router.push(`/division/${event.idDivision}/calender/${event.id}`)} bg={bgColor} pl={15} p={10} style={{
borderRadius: 10 borderRadius: 10
}} h={113}> }} h={113}>
<Group> <Group>
<Divider h={92} size="lg" orientation="vertical" color={colorDivider} /> <Divider h={92} size="lg" orientation="vertical" color={colorDivider} />
<Box> <Flex direction={'column'}>
<Text>{event.timeStart} - {event.timeEnd}</Text> <Text>{event.timeStart} - {event.timeEnd}</Text>
<Text fw={"bold"}>{event.title}</Text> <Box w={{
<Text>Dibuat oleh : {event.user_name}</Text> base: 260,
</Box> xl: 430
}}>
<Text fw={"bold"} lineClamp={1}>
{_.startCase(event.title)}
</Text>
</Box>
<Box w={{
base: 260,
xl: 420
}}>
<Text lineClamp={1}>
Dibuat oleh : {event.user_name}
</Text>
</Box>
</Flex>
</Group> </Group>
</Box> </Box>
</Box> </Box>

View File

@@ -1,6 +1,6 @@
"use client" "use client"
import { LayoutIconBack, LayoutNavbarHome, SkeletonDetailProfile, WARNA } from "@/module/_global"; import { LayoutIconBack, LayoutNavbarHome, SkeletonDetailProfile, WARNA } from "@/module/_global";
import { ActionIcon, Anchor, Avatar, Box, Button, Flex, Group, Skeleton, Stack, Text } from "@mantine/core"; import { ActionIcon, Anchor, Avatar, Box, Button, Flex, Grid, Group, SimpleGrid, Skeleton, Stack, Text } from "@mantine/core";
import { HiUser } from "react-icons/hi2"; import { HiUser } from "react-icons/hi2";
import { RiIdCardFill } from "react-icons/ri"; import { RiIdCardFill } from "react-icons/ri";
import { FaSquarePhone } from "react-icons/fa6"; import { FaSquarePhone } from "react-icons/fa6";
@@ -61,7 +61,7 @@ export default function Profile() {
<Box > <Box >
<LayoutNavbarHome > <LayoutNavbarHome >
<Group justify="space-between"> <Group justify="space-between">
<LayoutIconBack back="/home"/> <LayoutIconBack back="/home" />
<ActionIcon onClick={() => { setOpenModal(true) }} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Info"> <ActionIcon onClick={() => { setOpenModal(true) }} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Info">
<LuLogOut size={20} color='white' /> <LuLogOut size={20} color='white' />
</ActionIcon> </ActionIcon>
@@ -72,7 +72,7 @@ export default function Profile() {
gap="xs" gap="xs"
> >
<Avatar <Avatar
size="150" size="100"
radius={"100"} radius={"100"}
src={img} src={img}
/> />
@@ -90,43 +90,60 @@ export default function Profile() {
? ?
<SkeletonDetailProfile /> <SkeletonDetailProfile />
: :
<Box p={20}> <Stack p={20}>
<Group justify="space-between" grow py={5}> <Group justify="space-between" grow py={5}>
<Text fw={'bold'} fz={20}>Informasi</Text> <Text fw={'bold'} fz={20}>Informasi</Text>
<Text style={{ cursor: 'pointer' }} ta={"right"} c={"blue"} onClick={() => router.push(`/profile/edit/`)}>Edit</Text> <Group justify="flex-end">
</Group> <Text style={{ cursor: 'pointer' }} ta={"right"} c={"blue"} onClick={() => router.push(`/profile/edit/`)}>Edit</Text>
<Group justify="space-between" grow py={5}>
<Group>
<RiIdCardFill size={28} />
<Text fz={18}>NIK</Text>
</Group> </Group>
<Text fz={18} fw={'bold'} ta={"right"}>{isData?.nik}</Text>
</Group> </Group>
<Group justify="space-between" grow py={5}> <Grid>
<Group> <Grid.Col span={4}>
<FaSquarePhone size={28} /> <Group>
<Text fz={18}>No Telepon</Text> <RiIdCardFill size={25} />
</Group> <Text fz={15}>NIK</Text>
<Text fz={18} fw={'bold'} ta={"right"}>+62{isData?.phone}</Text> </Group>
</Group> </Grid.Col>
<Group justify="space-between" grow py={5}> <Grid.Col span={8}>
<Group> <Text fz={15} fw={'bold'} ta={"right"}>{isData?.nik}</Text>
<MdEmail size={28} /> </Grid.Col>
<Text fz={18}>Email</Text> </Grid>
</Group> <Grid>
<Text fz={18} fw={'bold'} ta={"right"}>{isData?.email}</Text> <Grid.Col span={5}>
</Group> <Group>
<Group justify="space-between" grow py={5}> <FaSquarePhone size={25} />
<Group> <Text fz={15}>No Telpon</Text>
<IoMaleFemale size={28} /> </Group>
<Text fz={18}>Jenis Kelamin</Text> </Grid.Col>
</Group> <Grid.Col span={7}>
<Text fz={18} fw={'bold'} ta={"right"}> <Text fz={15} fw={'bold'} ta={"right"}>+62{isData?.phone}</Text>
{isData?.gender === 'M' ? 'Laki-laki' : isData?.gender === 'F' ? 'Perempuan' : ''} </Grid.Col>
</Text> </Grid>
</Group> <Grid>
<Grid.Col span={4}>
</Box> <Group>
<MdEmail size={25} />
<Text fz={15}>Email</Text>
</Group>
</Grid.Col>
<Grid.Col span={8}>
<Text fz={15} fw={'bold'} ta={"right"} lineClamp={1}>{isData?.email}</Text>
</Grid.Col>
</Grid>
<Grid>
<Grid.Col span={6}>
<Group>
<IoMaleFemale size={25} />
<Text fz={15}>Jenis Kelamin</Text>
</Group>
</Grid.Col>
<Grid.Col span={6}>
<Text fz={15} fw={'bold'} ta={"right"}>
{isData?.gender === 'M' ? 'Laki-laki' : isData?.gender === 'F' ? 'Perempuan' : ''}
</Text>
</Grid.Col>
</Grid>
</Stack>
} }
</Box> </Box>
<LayoutModal opened={openModal} onClose={() => setOpenModal(false)} <LayoutModal opened={openModal} onClose={() => setOpenModal(false)}