wibu/hipmi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

upd: profile dan katalog

Browse Source 
Deskripsi:
- mecah dan ganti ke api

No Issues
This commit is contained in:
amel
2024-12-05 17:21:59 +08:00
parent 2fa96d47ba
commit 66c65bc937
14 changed files with 444 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
src/app/api/new/portofolio/route.ts Normal file
View File

@@ -0,0 +1,55 @@
import { prisma } from "@/app/lib";
import { NextResponse } from "next/server";
// GET ALL DATA PORTOFOLIO BY PROFILE ID
export async function GET(request: Request) {
try {
let fixData
const { searchParams } = new URL(request.url)
const profile = searchParams.get("profile")
const page = searchParams.get("page")
if (page == "profile") {
fixData = await prisma.portofolio.findMany({
take: 2,
orderBy: {
createdAt: "desc",
},
where: {
profileId: profile,
active: true,
},
select: {
id: true,
id_Portofolio: true,
namaBisnis: true,
profileId: true,
},
});
} else if (page == "portofolio") {
fixData = await prisma.portofolio.findMany({
orderBy: {
createdAt: "desc",
},
where: {
profileId: profile,
active: true,
},
select: {
id: true,
id_Portofolio: true,
namaBisnis: true,
profileId: true,
},
});
}
return NextResponse.json({ success: true, message: "Berhasil mendapatkan data", data: fixData }, { status: 200 });
}
catch (error) {
console.error(error);
return NextResponse.json({ success: false, message: "Gagal mendapatkan data, coba lagi nanti ", reason: (error as Error).message, }, { status: 500 });
}
}

61
src/app/api/new/user/route.ts
View File

@@ -1,53 +1,50 @@
import { prisma } from "@/app/lib";
import { funGetUserIdByToken } from "@/app_modules/_global/fun/get";
import { NextResponse } from "next/server";
// GET DATA USER LOGIN
// GET ONE DATA USER PROFILE BY PROFILE ID
export async function GET(request: Request) {
try {
const userLoginId = await funGetUserIdByToken()
if (userLoginId == null) {
return NextResponse.json({ success: false, message: "Gagal mendapatkan data, user id tidak ada" }, { status: 500 });
}
const { searchParams } = new URL(request.url)
const profile = searchParams.get("profile")
const data = await prisma.user.findFirst({
const data = await prisma.profile.findUnique({
where: {
id: userLoginId,
id: String(profile),
},
select: {
id: true,
username: true,
nomor: true,
active: true,
masterUserRoleId: true,
Profile: {
name: true,
email: true,
alamat: true,
jenisKelamin: true,
imageId: true,
imageBackgroundId: true,
userId: true,
User: {
select: {
id: true,
name: true,
email: true,
alamat: true,
jenisKelamin: true,
imageId: true,
imageBackgroundId: true
username: true,
nomor: true,
active: true,
masterUserRoleId: true
}
}
}
});
const dataFix = {
id: data?.id,
username: data?.username,
nomor: data?.nomor,
active: data?.active,
masterUserRoleId: data?.masterUserRoleId,
idProfile: data?.Profile?.id,
name: data?.Profile?.name,
email: data?.Profile?.email,
alamat: data?.Profile?.alamat,
jenisKelamin: data?.Profile?.jenisKelamin,
imageId: data?.Profile?.imageId,
imageBackgroundId: data?.Profile?.imageBackgroundId
id: data?.userId,
username: data?.User?.username,
nomor: data?.User?.nomor,
active: data?.User?.active,
masterUserRoleId: data?.User?.masterUserRoleId,
idProfile: data?.id,
name: data?.name,
email: data?.email,
alamat: data?.alamat,
jenisKelamin: data?.jenisKelamin,
imageId: data?.imageId,
imageBackgroundId: data?.imageBackgroundId
}

8
src/app/dev/katalog/[id]/page.tsx
View File

@@ -1,5 +1,5 @@
import { funGetUserIdByToken } from "@/app_modules/_global/fun/get";
import { Katalog_MainView } from "@/app_modules/katalog";
import { Katalog_MainView, ViewKatalogNew } from "@/app_modules/katalog";
import { funGetListPortofolio } from "@/app_modules/katalog/portofolio/fun/get/get_list_portofolio";
import { Profile_getOneProfileAndUserById } from "@/app_modules/katalog/profile/fun/get/get_one_user_profile";
@@ -12,11 +12,13 @@ export default async function Page({ params }: { params: { id: string } }) {
return (
<>
<Katalog_MainView
{/* <Katalog_MainView
profile={dataProfile as any}
listPorto={listPorto as any}
userLoginId={userLoginId as any}
/>
/> */}
<ViewKatalogNew />
</>
);
}

2
src/app_modules/katalog/index.ts
View File

@@ -1,2 +1,4 @@
import ViewKatalogNew from "./view_katalog_new";
export { Katalog_MainView } from "./view_katalog";
export { ViewKatalogNew }

4
src/app_modules/katalog/portofolio/index.ts
View File

@@ -1,3 +1,5 @@
import { IListPortofolio } from './lib/type_portofolio';
import { apiGetPortofolioByProfile } from './lib/api_portofolio';
import CreatePortofolio from "./create/view";
import CreatePortofolioLayout from "./create/layout";
import PortofolioLayout from "./ui/ui_layout";
@@ -20,6 +22,8 @@ export {
LayoutPortofolio_EditDataBisnis,
LayoutPortofolio_EditLogoBisnis,
LayoutPortofolio_EditMedsosBisnis,
apiGetPortofolioByProfile
};
export type { IListPortofolio };
export { Portofolio_ViewListDetail } from "./view/view_list_detail_portofolio";

4
src/app_modules/katalog/portofolio/lib/api_portofolio.ts Normal file
View File

@@ -0,0 +1,4 @@
export const apiGetPortofolioByProfile = async (path?: string) => {
const response = await fetch(`/api/new/portofolio${(path) ? path : ''}`)
return await response.json().catch(() => null)
}

6
src/app_modules/katalog/portofolio/lib/type_portofolio.ts Normal file
View File

@@ -0,0 +1,6 @@
export interface IListPortofolio {
id: string
id_Portofolio: string
profileId: string
namaBisnis: string
}

139
src/app_modules/katalog/ui/list_portolio_new.tsx Normal file
View File

@@ -0,0 +1,139 @@
import { AccentColor, MainColor } from "@/app_modules/_global/color";
import { Box, Center, Group, Paper, Skeleton, Stack, Text, Title } from "@mantine/core";
import { apiGetPortofolioByProfile, IListPortofolio } from "../portofolio";
import { useState } from "react";
import { useParams, useRouter } from "next/navigation";
import { useShallowEffect } from "@mantine/hooks";
import _ from "lodash";
import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog";
import { IconCaretRight } from "@tabler/icons-react";
export default function ListPortofolioProfileNew() {
const router = useRouter();
const param = useParams<{ id: string }>()
const [loading, setLoading] = useState(true)
const [dataPortofolio, setDataPortofolio] = useState<IListPortofolio[]>([])
async function getPortofolio() {
try {
setLoading(true)
const response = await apiGetPortofolioByProfile(`?profile=${param.id}&page=profile`)
if (response.success) {
setDataPortofolio(response.data);
}
} catch (error) {
console.error(error);
} finally {
setLoading(false)
}
}
useShallowEffect(() => {
getPortofolio()
}, []);
return (
<>
<Box
style={{
backgroundColor: AccentColor.darkblue,
border: `2px solid ${AccentColor.blue}`,
borderRadius: "10px ",
padding: "15px",
color: "white",
}}
>
<Stack spacing={"sm"}>
<Group position="center">
<Title order={4}>Portofolio</Title>
</Group>
<Stack
style={{
height: "auto",
}}
>
{
loading ?
<>
<Skeleton height={70} radius={"md"} width={"100%"} />
<Skeleton height={70} radius={"md"} width={"100%"} />
</>
:
_.isEmpty(dataPortofolio) ? (
<Center>
<Text fs={"italic"} fz={"xs"} c={"gray"}>
- Belum Ada Portofolio -
</Text>
</Center>
) : (
<Stack>
{dataPortofolio.map((e, i) => (
<Paper
shadow="sm"
key={i}
radius={"md"}
onClick={() => {
router.push(RouterPortofolio.main_detail + e?.id);
}}
style={{
backgroundColor: MainColor.darkblue,
border: `2px solid ${AccentColor.blue}`,
borderRadius: "10px ",
padding: "15px",
color: "white",
}}
>
<Group position="apart">
<Stack spacing={0} w={"80%"}>
<Text fw={"bold"} lineClamp={1}>
{e?.namaBisnis}
</Text>
<Text fz={10} c={MainColor.yellow}>
#{e.id_Portofolio}
</Text>
</Stack>
<Stack>
<IconCaretRight color="white" size={25} />
</Stack>
</Group>
</Paper>
))}
</Stack>
)
}
{
loading ? <></>
:
_.isEmpty(dataPortofolio) ? (
""
) : (
<Group position="right">
<Text
style={{
cursor: "pointer",
}}
onClick={() =>
router.push(
RouterPortofolio.daftar_portofolio + param.id,
{ scroll: false }
)
}
fw={"bold"}
fz={"sm"}
>
Lihat semua
</Text>
</Group>
)
}
</Stack>
</Stack>
</Box>
</>
)
}

131
src/app_modules/katalog/ui/profile_detail.tsx Normal file
View File

@@ -0,0 +1,131 @@
import { AccentColor } from "@/app_modules/_global/color";
import { apiGetUserProfile, IUserProfile } from "@/app_modules/user";
import { Box, Center, Group, Stack, Text, ThemeIcon } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconBrandGmail, IconGenderFemale, IconGenderMale, IconHome, IconPhone } from "@tabler/icons-react";
import { useParams } from "next/navigation";
import { useState } from "react";
import { Profile_ComponentAvatarProfile, Profile_ComponentLoadBackgroundImage } from "../profile/_component";
import SkeletonProfile from "./skeleton_profile";
export default function ProfileDetail() {
const param = useParams<{ id: string }>()
const [loading, setLoading] = useState(true)
const [dataProfile, setDataProfile] = useState<IUserProfile>()
const listInformation = [
{
icon: <IconPhone />,
value: "+" + dataProfile?.nomor,
},
{
icon: <IconBrandGmail />,
value: dataProfile?.email,
},
{
icon: <IconHome />,
value: dataProfile?.alamat,
},
{
icon:
dataProfile?.jenisKelamin === "Laki-laki" ? (
<IconGenderMale />
) : (
<IconGenderFemale />
),
value: dataProfile?.jenisKelamin,
},
];
async function getProfile() {
try {
setLoading(true)
const response = await apiGetUserProfile(`?profile=${param.id}`)
if (response.success) {
setDataProfile(response.data);
}
} catch (error) {
console.error(error);
} finally {
setLoading(false)
}
}
useShallowEffect(() => {
getProfile()
}, []);
return <>
<Stack
spacing={0}
style={{
backgroundColor: AccentColor.darkblue,
border: `2px solid ${AccentColor.blue}`,
borderRadius: "10px ",
padding: "15px",
color: "white",
}}
>
{
loading ?
<SkeletonProfile /> :
<>
<Box>
<Profile_ComponentLoadBackgroundImage
fileId={dataProfile?.imageBackgroundId as any}
size={500}
/>
<Box
sx={{
position: "relative",
bottom: 60,
margin: "auto",
width: "100%",
marginBottom: -30,
}}
>
<Center>
<Profile_ComponentAvatarProfile
fileId={dataProfile?.imageId as any}
style={{
borderStyle: "solid",
borderColor: AccentColor.darkblue,
borderWidth: "2px",
}}
/>
</Center>
<Stack align="center" c={"white"} mt={"xs"} spacing={0}>
<Text fw={"bold"} lineClamp={1}>
{dataProfile?.name}
</Text>
<Text fs={"italic"} fz={"sm"} lineClamp={1}>
@{dataProfile?.username}
</Text>
</Stack>
</Box>
</Box>
<Box>
<Stack spacing={"xs"}>
{listInformation.map((e, i) => (
<Group key={i} align="flex-start">
<ThemeIcon
style={{
backgroundColor: "transparent",
}}
>
{e.icon}
</ThemeIcon>
<Box w={"85%"}>
<Text fw={"bold"}>{e?.value}</Text>
</Box>
</Group>
))}
</Stack>
</Box>
</>
}
</Stack>
</>;
}

42
src/app_modules/katalog/ui/skeleton_profile.tsx Normal file
View File

@@ -0,0 +1,42 @@
import { Avatar, Box, Center, Grid, Skeleton, Stack } from "@mantine/core";
export default function SkeletonProfile() {
return (
<>
<Box mb={"lg"}>
<Skeleton height={200} radius={"md"} />
<Box
sx={{
position: "relative",
bottom: 60,
width: "100%",
marginBottom: -30,
}}
>
<Center>
<Avatar radius={"50%"} size={100} bg={"gray"} />
</Center>
</Box>
<Stack align="center" justify="center" spacing={"xs"}>
<Skeleton height={15} radius={"md"} width={"50%"} />
<Skeleton height={15} radius={"md"} width={"20%"} />
</Stack>
<Box mt={"lg"}>
{[...Array(4)].map((_, index) => (
<Box key={index} py={5}>
<Grid align="center">
<Grid.Col span={1}>
<Skeleton w={25} h={25} />
</Grid.Col>
<Grid.Col span={11}>
<Skeleton w={"100%"} h={15} />
</Grid.Col>
</Grid>
</Box>
))}
</Box>
</Box>
</>
)
}

20
src/app_modules/katalog/view_katalog_new.tsx Normal file
View File

@@ -0,0 +1,20 @@
'use client'
import { Stack } from "@mantine/core";
import ProfileDetail from "./ui/profile_detail";
import ListPortofolioProfileNew from "./ui/list_portolio_new";
export default function ViewKatalogNew() {
return (
<>
<Stack mb={"lg"}>
<ProfileDetail />
{/* <Portofolio_UiListView
listPorto={listPorto as any}
profile={profile}
userLoginId={userLoginId}
/> */}
<ListPortofolioProfileNew />
</Stack>
</>
)
}

8
src/app_modules/user/index.ts
View File

@@ -1,5 +1,5 @@
import { IUserLogin } from './lib/type_user';
import { apiGetUserLogin } from "./lib/api_user";
import { IUserProfile } from './lib/type_user';
import { apiGetUserProfile } from "./lib/api_user";
export { apiGetUserLogin };
export type { IUserLogin };
export { apiGetUserProfile };
export type { IUserProfile };

4
src/app_modules/user/lib/api_user.ts
View File

@@ -1,4 +1,4 @@
export const apiGetUserLogin = async () => {
const response = await fetch(`/api/new/user`)
export const apiGetUserProfile = async (path?: string) => {
const response = await fetch(`/api/new/user${(path) ? path : ''}`)
return await response.json().catch(() => null)
}

2
src/app_modules/user/lib/type_user.ts
View File

@@ -1,4 +1,4 @@
export interface IUserLogin {
export interface IUserProfile {
id: string
username: string
nomor: string