2
.env
2
.env
@@ -4,4 +4,4 @@
|
||||
# Prisma supports the native connection string format for PostgreSQL, MySQL, SQLite, SQL Server, MongoDB and CockroachDB.
|
||||
# See the documentation for all the connection string options: https://pris.ly/d/connection-strings
|
||||
|
||||
DATABASE_URL="postgresql://bip:Production_123d@localhost:5433/sdm?schema=public"
|
||||
DATABASE_URL="postgresql://bip:Production_123d@localhost:5433/sistem_desa_mandiri?schema=public"
|
||||
3
.gitignore
vendored
3
.gitignore
vendored
@@ -28,6 +28,9 @@ yarn-error.log*
|
||||
# local env files
|
||||
.env*.local
|
||||
|
||||
# env
|
||||
.env
|
||||
|
||||
# vercel
|
||||
.vercel
|
||||
|
||||
|
||||
3
.vscode/settings.json
vendored
Normal file
3
.vscode/settings.json
vendored
Normal file
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"WillLuke.nextjs.hasPrompted": true
|
||||
}
|
||||
7204
package-lock.json
generated
Normal file
7204
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
53
package.json
53
package.json
@@ -8,19 +8,58 @@
|
||||
"start": "next start",
|
||||
"lint": "next lint"
|
||||
},
|
||||
"prisma": {
|
||||
"seed": "tsx prisma/seed.ts"
|
||||
},
|
||||
"dependencies": {
|
||||
"@hookstate/core": "^4.0.1",
|
||||
"@mantine/carousel": "^7.11.1",
|
||||
"@mantine/charts": "^7.11.0",
|
||||
"@mantine/code-highlight": "^7.11.0",
|
||||
"@mantine/core": "^7.11.0",
|
||||
"@mantine/dates": "^7.11.0",
|
||||
"@mantine/dropzone": "^7.11.0",
|
||||
"@mantine/form": "^7.11.0",
|
||||
"@mantine/hooks": "^7.11.0",
|
||||
"@mantine/modals": "^7.11.0",
|
||||
"@mantine/notifications": "^7.11.0",
|
||||
"@mantine/nprogress": "^7.11.0",
|
||||
"@mantine/spotlight": "^7.11.0",
|
||||
"@mantine/tiptap": "^7.11.0",
|
||||
"@prisma/client": "5.16.1",
|
||||
"@tabler/icons-react": "^3.7.0",
|
||||
"@tiptap/extension-link": "^2.4.0",
|
||||
"@tiptap/react": "^2.4.0",
|
||||
"@tiptap/starter-kit": "^2.4.0",
|
||||
"@types/lodash": "^4.17.6",
|
||||
"dayjs": "^1.11.11",
|
||||
"embla-carousel-autoplay": "^7.1.0",
|
||||
"embla-carousel-react": "^7.1.0",
|
||||
"lodash": "^4.17.21",
|
||||
"next": "14.2.4",
|
||||
"react": "^18",
|
||||
"react-dom": "^18",
|
||||
"next": "14.2.4"
|
||||
"react-hot-toast": "^2.4.1",
|
||||
"react-icons": "^5.2.1",
|
||||
"recharts": "2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"typescript": "^5",
|
||||
"@types/node": "^20",
|
||||
"@types/node": "^20.14.9",
|
||||
"@types/react": "^18",
|
||||
"@types/react-dom": "^18",
|
||||
"postcss": "^8",
|
||||
"tailwindcss": "^3.4.1",
|
||||
"eslint": "^8",
|
||||
"eslint-config-next": "14.2.4"
|
||||
}
|
||||
"eslint-config-next": "14.2.4",
|
||||
"postcss": "^8.4.39",
|
||||
"postcss-preset-mantine": "^1.15.0",
|
||||
"postcss-simple-vars": "^7.0.1",
|
||||
"prisma": "^5.16.1",
|
||||
"tailwindcss": "^3.4.1",
|
||||
"ts-node": "^10.9.2",
|
||||
"typescript": "^5.5.3"
|
||||
},
|
||||
"description": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).",
|
||||
"main": "index.js",
|
||||
"keywords": [],
|
||||
"author": "",
|
||||
"license": "ISC"
|
||||
}
|
||||
|
||||
364
prisma/schema.prisma
Normal file
364
prisma/schema.prisma
Normal file
@@ -0,0 +1,364 @@
|
||||
// This is your Prisma schema file,
|
||||
// learn more about it in the docs: https://pris.ly/d/prisma-schema
|
||||
|
||||
// Looking for ways to speed up your queries, or scale easily with your serverless or edge functions?
|
||||
// Try Prisma Accelerate: https://pris.ly/cli/accelerate-init
|
||||
|
||||
generator client {
|
||||
provider = "prisma-client-js"
|
||||
}
|
||||
|
||||
datasource db {
|
||||
provider = "postgresql"
|
||||
url = env("DATABASE_URL")
|
||||
}
|
||||
|
||||
model UserRole {
|
||||
id String @id @default(cuid())
|
||||
name String
|
||||
desc String @db.Text
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
User User[]
|
||||
}
|
||||
|
||||
model Village {
|
||||
id String @id @default(cuid())
|
||||
name String
|
||||
desc String @db.Text
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
Group Group[]
|
||||
User User[]
|
||||
Annoucement Annoucement[]
|
||||
Project Project[]
|
||||
Division Division[]
|
||||
}
|
||||
|
||||
model Group {
|
||||
id String @id @default(cuid())
|
||||
Village Village @relation(fields: [idVillage], references: [id])
|
||||
idVillage String
|
||||
name String
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
Position Position[]
|
||||
User User[]
|
||||
Project Project[]
|
||||
Division Division[]
|
||||
AnnoucementMember AnnoucementMember[]
|
||||
}
|
||||
|
||||
model Position {
|
||||
id String @id @default(cuid())
|
||||
Group Group @relation(fields: [idGroup], references: [id])
|
||||
idGroup String
|
||||
name String
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
User User[]
|
||||
}
|
||||
|
||||
model User {
|
||||
id String @id @default(cuid())
|
||||
UserRole UserRole @relation(fields: [idUserRole], references: [id])
|
||||
idUserRole String
|
||||
Village Village? @relation(fields: [idVillage], references: [id])
|
||||
idVillage String?
|
||||
Group Group? @relation(fields: [idGroup], references: [id])
|
||||
idGroup String?
|
||||
Position Position? @relation(fields: [idPosition], references: [id])
|
||||
idPosition String?
|
||||
nik String @unique
|
||||
name String
|
||||
phone String @unique
|
||||
email String? @unique
|
||||
gender String @default("M") //M= Male, F= Female
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
Annoucement Annoucement[]
|
||||
Project Project[]
|
||||
ProjectMember ProjectMember[]
|
||||
ProjectComment ProjectComment[]
|
||||
UserLog UserLog[]
|
||||
Division Division[]
|
||||
DivisionMember DivisionMember[]
|
||||
DivisionProjectMember DivisionProjectMember[]
|
||||
DivisionProjectFile DivisionProjectFile[]
|
||||
DivisionDisscussion DivisionDisscussion[]
|
||||
DivisionDisscussionComment DivisionDisscussionComment[]
|
||||
DivisionDocumentFolderFile DivisionDocumentFolderFile[]
|
||||
DivisionCalendar DivisionCalendar[]
|
||||
}
|
||||
|
||||
model UserLog {
|
||||
id String @id @default(cuid())
|
||||
User User @relation(fields: [idUser], references: [id])
|
||||
idUser String
|
||||
action String
|
||||
desc String @db.Text
|
||||
idContent String
|
||||
tbContent String
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model Annoucement {
|
||||
id String @id @default(cuid())
|
||||
Village Village @relation(fields: [idVillage], references: [id])
|
||||
idVillage String
|
||||
title String
|
||||
desc String @db.Text
|
||||
isActive Boolean @default(true)
|
||||
User User @relation(fields: [createdBy], references: [id])
|
||||
createdBy String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
AnnoucementMember AnnoucementMember[]
|
||||
}
|
||||
|
||||
model AnnoucementMember {
|
||||
id String @id @default(cuid())
|
||||
Annoucement Annoucement @relation(fields: [idAnnoucement], references: [id])
|
||||
idAnnoucement String
|
||||
Group Group @relation(fields: [idGroup], references: [id])
|
||||
idGroup String
|
||||
Division Division @relation(fields: [idDivision], references: [id])
|
||||
idDivision String
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model Project {
|
||||
id String @id @default(cuid())
|
||||
Village Village @relation(fields: [idVillage], references: [id])
|
||||
idVillage String
|
||||
Group Group @relation(fields: [idGroup], references: [id])
|
||||
idGroup String
|
||||
name String
|
||||
desc String @db.Text
|
||||
isActive Boolean @default(true)
|
||||
User User @relation(fields: [createdBy], references: [id])
|
||||
createdBy String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
ProjectMember ProjectMember[]
|
||||
ProjectFile ProjectFile[]
|
||||
ProjectComment ProjectComment[]
|
||||
}
|
||||
|
||||
model ProjectMember {
|
||||
id String @id @default(cuid())
|
||||
Project Project @relation(fields: [idProject], references: [id])
|
||||
idProject String
|
||||
User User @relation(fields: [idUser], references: [id])
|
||||
idUser String
|
||||
isLeader Boolean @default(false)
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model ProjectFile {
|
||||
id String @id @default(cuid())
|
||||
Project Project @relation(fields: [idProject], references: [id])
|
||||
idProject String
|
||||
name String
|
||||
extension String
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model ProjectComment {
|
||||
id String @id @default(cuid())
|
||||
Project Project @relation(fields: [idProject], references: [id])
|
||||
idProject String
|
||||
User User @relation(fields: [createdBy], references: [id])
|
||||
createdBy String
|
||||
comment String @db.Text
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model Division {
|
||||
id String @id @default(cuid())
|
||||
Village Village @relation(fields: [idVillage], references: [id])
|
||||
idVillage String
|
||||
Group Group @relation(fields: [idGroup], references: [id])
|
||||
idGroup String
|
||||
name String
|
||||
desc String @db.Text
|
||||
isActive Boolean @default(true)
|
||||
User User @relation(fields: [createdBy], references: [id])
|
||||
createdBy String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
DivisionMember DivisionMember[]
|
||||
AnnoucementMember AnnoucementMember[]
|
||||
DivisionProject DivisionProject[]
|
||||
DivisionProjectTask DivisionProjectTask[]
|
||||
DivisionProjectMember DivisionProjectMember[]
|
||||
DivisionProjectFile DivisionProjectFile[]
|
||||
DivisionDisscussion DivisionDisscussion[]
|
||||
DivisionDocumentFolderFile DivisionDocumentFolderFile[]
|
||||
DivisionDocumentShare DivisionDocumentShare[]
|
||||
DivisionCalendar DivisionCalendar[]
|
||||
DivisionCalendarReminder DivisionCalendarReminder[]
|
||||
}
|
||||
|
||||
model DivisionMember {
|
||||
id String @id @default(cuid())
|
||||
Division Division @relation(fields: [idDivision], references: [id])
|
||||
idDivision String
|
||||
User User @relation(fields: [idUser], references: [id])
|
||||
idUser String
|
||||
isAdmin Boolean @default(false)
|
||||
isLeader Boolean @default(false)
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model DivisionProject {
|
||||
id String @id @default(cuid())
|
||||
Division Division @relation(fields: [idDivision], references: [id])
|
||||
idDivision String
|
||||
title String
|
||||
desc String @db.Text
|
||||
status Int @default(0)
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model DivisionProjectTask {
|
||||
id String @id @default(cuid())
|
||||
Division Division @relation(fields: [idDivision], references: [id])
|
||||
idDivision String
|
||||
title String
|
||||
desc String @db.Text
|
||||
status Int @default(0)
|
||||
dateStart DateTime @db.Date
|
||||
dateEnd DateTime @db.Date
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model DivisionProjectMember {
|
||||
id String @id @default(cuid())
|
||||
Division Division @relation(fields: [idDivision], references: [id])
|
||||
idDivision String
|
||||
User User @relation(fields: [idUser], references: [id])
|
||||
idUser String
|
||||
isLeader Boolean @default(false)
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model DivisionProjectFile {
|
||||
id String @id @default(cuid())
|
||||
Division Division @relation(fields: [idDivision], references: [id])
|
||||
idDivision String
|
||||
name String
|
||||
extension String
|
||||
isActive Boolean @default(true)
|
||||
User User @relation(fields: [createdBy], references: [id])
|
||||
createdBy String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model DivisionDisscussion {
|
||||
id String @id @default(cuid())
|
||||
Division Division @relation(fields: [idDivision], references: [id])
|
||||
idDivision String
|
||||
title String
|
||||
desc String @db.Text
|
||||
status Int @default(1) // 1 = open, 2 = close
|
||||
isActive Boolean @default(true)
|
||||
User User @relation(fields: [createdBy], references: [id])
|
||||
createdBy String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model DivisionDisscussionComment {
|
||||
id String @id @default(cuid())
|
||||
idDisscussion String
|
||||
comment String @db.Text
|
||||
isActive Boolean @default(true)
|
||||
User User @relation(fields: [createdBy], references: [id])
|
||||
createdBy String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model DivisionDocumentFolderFile {
|
||||
id String @id @default(cuid())
|
||||
Division Division @relation(fields: [idDivision], references: [id])
|
||||
idDivision String
|
||||
category String @default("FOLDER") // FOLDER OR FILE
|
||||
name String
|
||||
extension String
|
||||
path String
|
||||
isActive Boolean @default(true)
|
||||
User User @relation(fields: [createdBy], references: [id])
|
||||
createdBy String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
DivisionDocumentShare DivisionDocumentShare[]
|
||||
}
|
||||
|
||||
model DivisionDocumentShare {
|
||||
id String @id @default(cuid())
|
||||
DivisionDocumentFolderFile DivisionDocumentFolderFile @relation(fields: [idDocument], references: [id])
|
||||
idDocument String
|
||||
Division Division @relation(fields: [idDivision], references: [id])
|
||||
idDivision String
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
|
||||
model DivisionCalendar {
|
||||
id String @id @default(cuid())
|
||||
Division Division @relation(fields: [idDivision], references: [id])
|
||||
idDivision String
|
||||
title String
|
||||
desc String @db.Text
|
||||
dateStart DateTime @db.Date
|
||||
dateEnd DateTime @db.Date
|
||||
repeatEventTyper String
|
||||
reminderInterval String
|
||||
status Int @default(0)
|
||||
isActive Boolean @default(true)
|
||||
User User @relation(fields: [createdBy], references: [id])
|
||||
createdBy String
|
||||
createdAt DateTime @default(now())
|
||||
DivisionCalendarReminder DivisionCalendarReminder[]
|
||||
}
|
||||
|
||||
model DivisionCalendarReminder {
|
||||
id String @id @default(cuid())
|
||||
Division Division @relation(fields: [idDivision], references: [id])
|
||||
idDivision String
|
||||
DivisionCalendar DivisionCalendar @relation(fields: [idCalendar], references: [id])
|
||||
idCalendar String
|
||||
dateStart DateTime @db.Date
|
||||
dateEnd DateTime @db.Date
|
||||
status Int @default(0)
|
||||
isActive Boolean @default(true)
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
}
|
||||
51
prisma/seed.ts
Normal file
51
prisma/seed.ts
Normal file
@@ -0,0 +1,51 @@
|
||||
import { seederUser, seederUserRole } from '@/module/seeder';
|
||||
import { PrismaClient } from '@prisma/client';
|
||||
const prisma = new PrismaClient()
|
||||
|
||||
async function main() {
|
||||
// USER ROLE
|
||||
for (let data of seederUserRole) {
|
||||
await prisma.userRole.upsert({
|
||||
where: {
|
||||
id: data.id
|
||||
},
|
||||
update: {
|
||||
name: data.name
|
||||
},
|
||||
create: {
|
||||
id: data.id,
|
||||
name: data.name,
|
||||
desc: data.desc
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
// USER
|
||||
for (let data of seederUser) {
|
||||
await prisma.user.upsert({
|
||||
where: {
|
||||
id: data.id
|
||||
},
|
||||
update: {
|
||||
name: data.name
|
||||
},
|
||||
create: {
|
||||
id: data.id,
|
||||
idUserRole: data.idUserRole,
|
||||
nik: data.nik,
|
||||
name: data.name,
|
||||
phone: data.phone,
|
||||
email: data.email,
|
||||
gender: data.gender
|
||||
},
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
main().then(async () => {
|
||||
await prisma.$disconnect()
|
||||
}).catch(async (e) => {
|
||||
console.error(e)
|
||||
await prisma.$disconnect()
|
||||
process.exit(1)
|
||||
})
|
||||
0
public/assets/.gitkeep
Normal file
0
public/assets/.gitkeep
Normal file
BIN
public/assets/img/logo/logo-1.png
Normal file
BIN
public/assets/img/logo/logo-1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
BIN
public/assets/img/welcome/wellcome-1.png
Normal file
BIN
public/assets/img/welcome/wellcome-1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
BIN
public/assets/img/welcome/wellcome-2.png
Normal file
BIN
public/assets/img/welcome/wellcome-2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 73 KiB |
BIN
public/assets/img/welcome/wellcome-3.png
Normal file
BIN
public/assets/img/welcome/wellcome-3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 63 KiB |
9
src/app/(application)/announcement/[id]/page.tsx
Normal file
9
src/app/(application)/announcement/[id]/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewDetailAnnouncement } from "@/module/announcement";
|
||||
|
||||
function Page({ params }: { params: { id: string } }) {
|
||||
return (
|
||||
<ViewDetailAnnouncement data={params.id} />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
9
src/app/(application)/announcement/create/page.tsx
Normal file
9
src/app/(application)/announcement/create/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewCreateAnnouncement } from "@/module/announcement";
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewCreateAnnouncement />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
9
src/app/(application)/announcement/edit/[id]/page.tsx
Normal file
9
src/app/(application)/announcement/edit/[id]/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewEditAnnouncement } from "@/module/announcement";
|
||||
|
||||
function Page({ params }: { params: { id: any } }) {
|
||||
return (
|
||||
<ViewEditAnnouncement data={params.id} />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
9
src/app/(application)/announcement/page.tsx
Normal file
9
src/app/(application)/announcement/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewListAnnouncement } from "@/module/announcement";
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewListAnnouncement/>
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
10
src/app/(application)/detail-feature/page.tsx
Normal file
10
src/app/(application)/detail-feature/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { ViewDetailFeature } from '@/module/home';
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewDetailFeature/>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
10
src/app/(application)/group/page.tsx
Normal file
10
src/app/(application)/group/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { ViewGroup } from '@/module/group';
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewGroup />
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
14
src/app/(application)/home/page.tsx
Normal file
14
src/app/(application)/home/page.tsx
Normal file
@@ -0,0 +1,14 @@
|
||||
import LayoutNavbarHome from '@/module/_global/layout/layout_navbar_home';
|
||||
import { ViewHome } from '@/module/home';
|
||||
import { Flex, Group, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<>
|
||||
<ViewHome />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
10
src/app/(application)/member/[id]/page.tsx
Normal file
10
src/app/(application)/member/[id]/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { ViewDetailMember } from "@/module/user/member";
|
||||
|
||||
function Page({ params }: { params: { id: string } }) {
|
||||
return (
|
||||
<ViewDetailMember data={params.id} />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
|
||||
9
src/app/(application)/member/create/page.tsx
Normal file
9
src/app/(application)/member/create/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewCreateMember } from "@/module/user/member";
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewCreateMember />
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
9
src/app/(application)/member/edit/[id]/page.tsx
Normal file
9
src/app/(application)/member/edit/[id]/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewEditMember } from "@/module/user/member";
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewEditMember />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
9
src/app/(application)/member/page.tsx
Normal file
9
src/app/(application)/member/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewListMember } from "@/module/user/member";
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewListMember />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
10
src/app/(application)/notification/page.tsx
Normal file
10
src/app/(application)/notification/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { ViewNotification } from '@/module/notification';
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewNotification />
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
10
src/app/(application)/position/page.tsx
Normal file
10
src/app/(application)/position/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { ViewListPosition } from '@/module/position';
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewListPosition />
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
9
src/app/(application)/profile/edit/page.tsx
Normal file
9
src/app/(application)/profile/edit/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewEditProfile } from "@/module/user"
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewEditProfile />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page
|
||||
9
src/app/(application)/profile/page.tsx
Normal file
9
src/app/(application)/profile/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewProfile } from "@/module/user";
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewProfile />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
10
src/app/(application)/project/page.tsx
Normal file
10
src/app/(application)/project/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { ViewProject } from '@/module/project';
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewProject />
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
10
src/app/(application)/search/page.tsx
Normal file
10
src/app/(application)/search/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { ViewSearch } from '@/module/search';
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewSearch/>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
6
src/app/(auth)/verification/page.tsx
Normal file
6
src/app/(auth)/verification/page.tsx
Normal file
@@ -0,0 +1,6 @@
|
||||
import { ViewVerification } from "@/module/auth";
|
||||
import React from "react";
|
||||
|
||||
export default function Verification() {
|
||||
return <ViewVerification />;
|
||||
}
|
||||
8
src/app/(auth)/welcome/page.tsx
Normal file
8
src/app/(auth)/welcome/page.tsx
Normal file
@@ -0,0 +1,8 @@
|
||||
import { ViewWelcome } from "@/module/auth";
|
||||
import React from "react";
|
||||
|
||||
function Page() {
|
||||
return <ViewWelcome />;
|
||||
}
|
||||
|
||||
export default Page;
|
||||
0
src/app/api/.gitkeep
Normal file
0
src/app/api/.gitkeep
Normal file
@@ -1,22 +1,48 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Inter } from "next/font/google";
|
||||
import "./globals.css";
|
||||
import "@mantine/core/styles.css";
|
||||
import {
|
||||
Box,
|
||||
ColorSchemeScript,
|
||||
Container,
|
||||
MantineProvider,
|
||||
rem,
|
||||
} from "@mantine/core";
|
||||
import { WARNA } from "@/module/_global";
|
||||
import { Lato } from "next/font/google";
|
||||
import '@mantine/carousel/styles.css';
|
||||
import { Toaster } from 'react-hot-toast';
|
||||
|
||||
const inter = Inter({ subsets: ["latin"] });
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Create Next App",
|
||||
description: "Generated by create next app",
|
||||
export const metadata = {
|
||||
title: "SISTEM DESA MANDIRI",
|
||||
description: "I have followed setup instructions carefully",
|
||||
};
|
||||
|
||||
const LatoFont = Lato({
|
||||
subsets: ["latin"],
|
||||
weight: ["300", "400", "700", "900"],
|
||||
});
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: Readonly<{
|
||||
}: {
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
}) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body className={inter.className}>{children}</body>
|
||||
<head>
|
||||
<ColorSchemeScript />
|
||||
</head>
|
||||
<body className={`${LatoFont.className}`} suppressHydrationWarning>
|
||||
<MantineProvider>
|
||||
<Box bg={'#252A2F'} pos={"fixed"} w={"100%"} h={"100%"} style={{
|
||||
overflowY: "auto"
|
||||
}}>
|
||||
<Toaster/>
|
||||
<Container mih={'100vh'} p={0} size={rem(550)} bg={WARNA.bgWhite}>
|
||||
{children}
|
||||
</Container>
|
||||
</Box>
|
||||
</MantineProvider>
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
||||
5
src/app/loading.tsx
Normal file
5
src/app/loading.tsx
Normal file
@@ -0,0 +1,5 @@
|
||||
import { LoadingPage } from "@/module/_global";
|
||||
|
||||
export default function Loading() {
|
||||
return <LoadingPage />
|
||||
}
|
||||
113
src/app/page.tsx
113
src/app/page.tsx
@@ -1,113 +1,10 @@
|
||||
import Image from "next/image";
|
||||
import { ViewLogin } from "@/module/auth";
|
||||
import { Box, Image, rem, Stack, Text } from "@mantine/core";
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<main className="flex min-h-screen flex-col items-center justify-between p-24">
|
||||
<div className="z-10 w-full max-w-5xl items-center justify-between font-mono text-sm lg:flex">
|
||||
<p className="fixed left-0 top-0 flex w-full justify-center border-b border-gray-300 bg-gradient-to-b from-zinc-200 pb-6 pt-8 backdrop-blur-2xl dark:border-neutral-800 dark:bg-zinc-800/30 dark:from-inherit lg:static lg:w-auto lg:rounded-xl lg:border lg:bg-gray-200 lg:p-4 lg:dark:bg-zinc-800/30">
|
||||
Get started by editing
|
||||
<code className="font-mono font-bold">src/app/page.tsx</code>
|
||||
</p>
|
||||
<div className="fixed bottom-0 left-0 flex h-48 w-full items-end justify-center bg-gradient-to-t from-white via-white dark:from-black dark:via-black lg:static lg:size-auto lg:bg-none">
|
||||
<a
|
||||
className="pointer-events-none flex place-items-center gap-2 p-8 lg:pointer-events-auto lg:p-0"
|
||||
href="https://vercel.com?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
By{" "}
|
||||
<Image
|
||||
src="/vercel.svg"
|
||||
alt="Vercel Logo"
|
||||
className="dark:invert"
|
||||
width={100}
|
||||
height={24}
|
||||
priority
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="relative z-[-1] flex place-items-center before:absolute before:h-[300px] before:w-full before:-translate-x-1/2 before:rounded-full before:bg-gradient-radial before:from-white before:to-transparent before:blur-2xl before:content-[''] after:absolute after:-z-20 after:h-[180px] after:w-full after:translate-x-1/3 after:bg-gradient-conic after:from-sky-200 after:via-blue-200 after:blur-2xl after:content-[''] before:dark:bg-gradient-to-br before:dark:from-transparent before:dark:to-blue-700 before:dark:opacity-10 after:dark:from-sky-900 after:dark:via-[#0141ff] after:dark:opacity-40 sm:before:w-[480px] sm:after:w-[240px] before:lg:h-[360px]">
|
||||
<Image
|
||||
className="relative dark:drop-shadow-[0_0_0.3rem_#ffffff70] dark:invert"
|
||||
src="/next.svg"
|
||||
alt="Next.js Logo"
|
||||
width={180}
|
||||
height={37}
|
||||
priority
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-32 grid text-center lg:mb-0 lg:w-full lg:max-w-5xl lg:grid-cols-4 lg:text-left">
|
||||
<a
|
||||
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
||||
className="group rounded-lg border border-transparent px-5 py-4 transition-colors hover:border-gray-300 hover:bg-gray-100 hover:dark:border-neutral-700 hover:dark:bg-neutral-800/30"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<h2 className="mb-3 text-2xl font-semibold">
|
||||
Docs{" "}
|
||||
<span className="inline-block transition-transform group-hover:translate-x-1 motion-reduce:transform-none">
|
||||
->
|
||||
</span>
|
||||
</h2>
|
||||
<p className="m-0 max-w-[30ch] text-sm opacity-50">
|
||||
Find in-depth information about Next.js features and API.
|
||||
</p>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
||||
className="group rounded-lg border border-transparent px-5 py-4 transition-colors hover:border-gray-300 hover:bg-gray-100 hover:dark:border-neutral-700 hover:dark:bg-neutral-800/30"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<h2 className="mb-3 text-2xl font-semibold">
|
||||
Learn{" "}
|
||||
<span className="inline-block transition-transform group-hover:translate-x-1 motion-reduce:transform-none">
|
||||
->
|
||||
</span>
|
||||
</h2>
|
||||
<p className="m-0 max-w-[30ch] text-sm opacity-50">
|
||||
Learn about Next.js in an interactive course with quizzes!
|
||||
</p>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
||||
className="group rounded-lg border border-transparent px-5 py-4 transition-colors hover:border-gray-300 hover:bg-gray-100 hover:dark:border-neutral-700 hover:dark:bg-neutral-800/30"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<h2 className="mb-3 text-2xl font-semibold">
|
||||
Templates{" "}
|
||||
<span className="inline-block transition-transform group-hover:translate-x-1 motion-reduce:transform-none">
|
||||
->
|
||||
</span>
|
||||
</h2>
|
||||
<p className="m-0 max-w-[30ch] text-sm opacity-50">
|
||||
Explore starter templates for Next.js.
|
||||
</p>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
||||
className="group rounded-lg border border-transparent px-5 py-4 transition-colors hover:border-gray-300 hover:bg-gray-100 hover:dark:border-neutral-700 hover:dark:bg-neutral-800/30"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<h2 className="mb-3 text-2xl font-semibold">
|
||||
Deploy{" "}
|
||||
<span className="inline-block transition-transform group-hover:translate-x-1 motion-reduce:transform-none">
|
||||
->
|
||||
</span>
|
||||
</h2>
|
||||
<p className="m-0 max-w-[30ch] text-balance text-sm opacity-50">
|
||||
Instantly deploy your Next.js site to a shareable URL with Vercel.
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
</main>
|
||||
<>
|
||||
<ViewLogin/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
6
src/module/_global/fun/WARNA.ts
Normal file
6
src/module/_global/fun/WARNA.ts
Normal file
@@ -0,0 +1,6 @@
|
||||
export const WARNA = {
|
||||
bgWhite: "#F4F9FD",
|
||||
biruTua: "#19345E",
|
||||
bgIcon: "#384288",
|
||||
borderOrange: "#FCAA4B"
|
||||
}
|
||||
17
src/module/_global/index.ts
Normal file
17
src/module/_global/index.ts
Normal file
@@ -0,0 +1,17 @@
|
||||
import { WARNA } from "./fun/WARNA";
|
||||
import LayoutDrawer from "./layout/layout_drawer";
|
||||
import LayoutIconBack from "./layout/layout_icon_back";
|
||||
import LoadingPage from "./layout/layout_loading_page";
|
||||
import LayoutLogin from "./layout/layout_login";
|
||||
import LayoutNavbarHome from "./layout/layout_navbar_home";
|
||||
import { isDrawer } from "./val/isDrawer";
|
||||
import { isModal } from "./val/isModal";
|
||||
|
||||
export { WARNA }
|
||||
export { LayoutLogin }
|
||||
export { LayoutNavbarHome }
|
||||
export { LayoutIconBack }
|
||||
export { LoadingPage }
|
||||
export { LayoutDrawer }
|
||||
export { isDrawer }
|
||||
export { isModal }
|
||||
20
src/module/_global/layout/layout_drawer.tsx
Normal file
20
src/module/_global/layout/layout_drawer.tsx
Normal file
@@ -0,0 +1,20 @@
|
||||
import { Box, Drawer, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { WARNA } from '../fun/WARNA';
|
||||
|
||||
export default function LayoutDrawer({ opened, onClose, title, children, size }: { children: React.ReactNode, opened: boolean, size?: string, onClose: () => void, title: React.ReactNode }) {
|
||||
return (
|
||||
<Box>
|
||||
<Drawer opened={opened} title={<Text c={WARNA.biruTua} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '30%'}
|
||||
styles={{
|
||||
content: {
|
||||
backgroundColor: "white",
|
||||
borderRadius: "20px 20px 0px 0px",
|
||||
},
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
</Drawer>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
27
src/module/_global/layout/layout_icon_back.tsx
Normal file
27
src/module/_global/layout/layout_icon_back.tsx
Normal file
@@ -0,0 +1,27 @@
|
||||
'use client'
|
||||
import { ActionIcon, Box } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiChevronLeft } from 'react-icons/hi2';
|
||||
import { WARNA } from '../fun/WARNA';
|
||||
import _ from 'lodash';
|
||||
|
||||
function LayoutIconBack({ back }: { back?: string }) {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Box>
|
||||
<ActionIcon variant="light" onClick={() => {
|
||||
if (!_.isUndefined(back) && !_.isNull(back)) {
|
||||
return router.push(back)
|
||||
} else {
|
||||
return router.back()
|
||||
}
|
||||
|
||||
}} bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiChevronLeft size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default LayoutIconBack;
|
||||
33
src/module/_global/layout/layout_loading_page.tsx
Normal file
33
src/module/_global/layout/layout_loading_page.tsx
Normal file
@@ -0,0 +1,33 @@
|
||||
import { Box, Group, Skeleton, Text } from "@mantine/core";
|
||||
import LayoutNavbarHome from "./layout_navbar_home";
|
||||
|
||||
export default function LoadingPage() {
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Text></Text>
|
||||
</LayoutNavbarHome>
|
||||
<Box p={20}>
|
||||
<Skeleton width={"100%"} height={180} radius={"md"} />
|
||||
<Group my={20} justify="space-between" grow>
|
||||
<Skeleton height={50} radius={"md"} />
|
||||
<Skeleton height={50} radius={"md"} />
|
||||
<Skeleton height={50} radius={"md"} />
|
||||
</Group>
|
||||
<Group my={20} justify="space-between" grow>
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
</Group>
|
||||
<Group my={20} justify="space-between" grow>
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
</Group>
|
||||
<Group my={20} justify="space-between" grow>
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
</Group>
|
||||
</Box>
|
||||
</>
|
||||
|
||||
)
|
||||
}
|
||||
21
src/module/_global/layout/layout_login.tsx
Normal file
21
src/module/_global/layout/layout_login.tsx
Normal file
@@ -0,0 +1,21 @@
|
||||
import { Image, rem, Stack, Title } from "@mantine/core";
|
||||
import React from "react";
|
||||
import { WARNA } from "../fun/WARNA";
|
||||
|
||||
export default function LayoutLogin({
|
||||
children,
|
||||
}: {
|
||||
children: React.ReactNode;
|
||||
}) {
|
||||
return (
|
||||
<>
|
||||
<Stack justify="center" align="center" pt={rem(50)}>
|
||||
<Image w={102} h={103} src={"/assets/img/logo/logo-1.png"} alt="logo" />
|
||||
<Title c={WARNA.biruTua} order={4}>
|
||||
PERBEKAL DARMASABA
|
||||
</Title>
|
||||
</Stack>
|
||||
{children}
|
||||
</>
|
||||
);
|
||||
}
|
||||
30
src/module/_global/layout/layout_modal.tsx
Normal file
30
src/module/_global/layout/layout_modal.tsx
Normal file
@@ -0,0 +1,30 @@
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Box, Button, Flex, Modal, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { BsQuestionCircleFill } from 'react-icons/bs';
|
||||
import { isModal } from '../val/isModal';
|
||||
|
||||
export default function LayoutModal({ opened, onClose, description, onYes }: { opened: boolean, onClose: () => void, description: string, onYes: (val: boolean) => void }) {
|
||||
const openModal = useHookstate(isModal)
|
||||
return (
|
||||
<Modal styles={{
|
||||
body: {
|
||||
margin: 10,
|
||||
},
|
||||
content: {
|
||||
border: `2px solid ${'#828AFC'}`,
|
||||
borderRadius: 10
|
||||
}
|
||||
}} opened={opened} onClose={onClose} withCloseButton={false} centered closeOnClickOutside={false}>
|
||||
<Flex justify={"center"} align={"center"} direction={"column"}>
|
||||
<BsQuestionCircleFill size={100} color="red" />
|
||||
<Text mt={30} ta={"center"} fw={"bold"} fz={18}>{description}</Text>
|
||||
<Box mt={30} w={'100%'}>
|
||||
<Button mb={20} fullWidth size="lg" radius={'xl'} bg={'#4754F0'} onClick={() => onYes(true)}>YA</Button>
|
||||
<Button fullWidth size="lg" radius={'xl'} bg={'#DCE1FE'} c={'#4754F0'} onClick={() => openModal.set(false)}>TIDAK</Button>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Modal>
|
||||
);
|
||||
}
|
||||
|
||||
18
src/module/_global/layout/layout_navbar_home.tsx
Normal file
18
src/module/_global/layout/layout_navbar_home.tsx
Normal file
@@ -0,0 +1,18 @@
|
||||
import { Box, Grid, Group } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { WARNA } from '../fun/WARNA';
|
||||
|
||||
export const LayoutNavbarHome = ({ children }: { children: React.ReactNode }) => {
|
||||
return (
|
||||
<Box pt={25} pl={20} pr={20} m={0} pos={'sticky'} top={0} pb={25} bg={WARNA.biruTua}
|
||||
style={{
|
||||
borderBottomLeftRadius: 20,
|
||||
borderBottomRightRadius: 20,
|
||||
zIndex: 100
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
export default LayoutNavbarHome
|
||||
4
src/module/_global/val/isDrawer.ts
Normal file
4
src/module/_global/val/isDrawer.ts
Normal file
@@ -0,0 +1,4 @@
|
||||
'use client'
|
||||
import { hookstate } from '@hookstate/core';
|
||||
|
||||
export const isDrawer = hookstate(false)
|
||||
4
src/module/_global/val/isModal.ts
Normal file
4
src/module/_global/val/isModal.ts
Normal file
@@ -0,0 +1,4 @@
|
||||
'use client'
|
||||
import { hookstate } from '@hookstate/core';
|
||||
|
||||
export const isModal = hookstate(false)
|
||||
37
src/module/announcement/component/detail_announcement.tsx
Normal file
37
src/module/announcement/component/detail_announcement.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
import { Box, Group, Stack, Text } from "@mantine/core";
|
||||
import { BsCardText } from "react-icons/bs";
|
||||
import { TfiAnnouncement } from "react-icons/tfi";
|
||||
|
||||
export default function DetailAnnouncement() {
|
||||
return (
|
||||
<Box py={30} px={20}>
|
||||
<Box p={20} style={{ borderRadius: 10, border: '1px solid #E5E5E5' }} bg={'white'} >
|
||||
<Stack>
|
||||
<Group>
|
||||
<TfiAnnouncement size={25} />
|
||||
<Text fw={'bold'}>Pengumuman Dinas</Text>
|
||||
</Group>
|
||||
<Group>
|
||||
<BsCardText size={25} />
|
||||
<Text>Pengumuman agar menggunakan</Text>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
<Box my={15} p={20} style={{ borderRadius: 10, border: '1px solid #E5E5E5' }} bg={'white'} >
|
||||
<Stack>
|
||||
<Text fw={'bold'}>Anggota</Text>
|
||||
<Group>
|
||||
<Text>LPD</Text>
|
||||
</Group>
|
||||
<Group>
|
||||
<Text>PKK</Text>
|
||||
</Group>
|
||||
<Group>
|
||||
<Text>Karang Taruna</Text>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
)
|
||||
}
|
||||
92
src/module/announcement/component/list_announcement.tsx
Normal file
92
src/module/announcement/component/list_announcement.tsx
Normal file
@@ -0,0 +1,92 @@
|
||||
'use client'
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Anchor, Box, Group, Text, TextInput } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { TfiAnnouncement } from "react-icons/tfi";
|
||||
import { HiMagnifyingGlass } from 'react-icons/hi2';
|
||||
import { useRouter } from 'next/navigation';
|
||||
|
||||
const dataPengumuman = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
]
|
||||
|
||||
export default function ListAnnouncement() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<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"
|
||||
/>
|
||||
{dataPengumuman.map((v, i) => {
|
||||
return (
|
||||
<Box pt={20} key={i} onClick={() => {
|
||||
router.push(`/announcement/${v.id}`)
|
||||
}}>
|
||||
<Group align='center' style={{
|
||||
borderBottom: `1px solid #D9D9D9`,
|
||||
padding: 10,
|
||||
}} >
|
||||
<Box>
|
||||
<ActionIcon variant="light" bg={'#FCAA4B'} size={50} radius={100} aria-label="icon">
|
||||
<TfiAnnouncement color={WARNA.biruTua} size={25} />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
|
||||
</Box>
|
||||
</Group>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
48
src/module/announcement/component/ui/drawer_announcement.tsx
Normal file
48
src/module/announcement/component/ui/drawer_announcement.tsx
Normal file
@@ -0,0 +1,48 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
import { IoAddCircle } from "react-icons/io5";
|
||||
import { RiFilter2Line } from "react-icons/ri";
|
||||
|
||||
export default function DrawerAnnouncement() {
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
const router = useRouter()
|
||||
|
||||
function onCLose() {
|
||||
openDrawer.set(false)
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Stack pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
||||
>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'}
|
||||
onClick={() => {
|
||||
router.push('/announcement/create')
|
||||
onCLose()
|
||||
}}
|
||||
>
|
||||
<Box>
|
||||
<IoAddCircle size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Tambah Pengumuman</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} >
|
||||
<Box>
|
||||
<RiFilter2Line size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Filter</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,45 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
import { FaPencil, FaTrash } from 'react-icons/fa6';
|
||||
|
||||
export default function DrawerDetailAnnouncement() {
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
const router = useRouter()
|
||||
|
||||
function onCLose() {
|
||||
openDrawer.set(false)
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Stack pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
||||
>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'}>
|
||||
<Box>
|
||||
<FaTrash size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Hapus</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} onClick={() => {
|
||||
router.push('edit/123')
|
||||
onCLose()
|
||||
}}>
|
||||
<Box>
|
||||
<FaPencil size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Edit</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
37
src/module/announcement/component/ui/navbar_announcement.tsx
Normal file
37
src/module/announcement/component/ui/navbar_announcement.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
"use client"
|
||||
import { isDrawer, LayoutDrawer, LayoutIconBack, LayoutNavbarHome, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Drawer, Grid, Group, Text } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiMenu } from "react-icons/hi";
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import DrawerAnnouncement from './drawer_announcement';
|
||||
|
||||
export default function NavbarAnnouncement() {
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>PENGUMUMAN</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto">
|
||||
<Group justify='flex-end'>
|
||||
<ActionIcon onClick={() => openDrawer.set(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiMenu size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
<LayoutDrawer opened={openDrawer.get()} title={'MENU'} onClose={() => openDrawer.set(false)}>
|
||||
<DrawerAnnouncement />
|
||||
</LayoutDrawer>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,21 @@
|
||||
'use client'
|
||||
import { LayoutIconBack, LayoutNavbarHome } from "@/module/_global";
|
||||
import { Box, Grid, Text } from "@mantine/core";
|
||||
|
||||
export default function NavbarCreateAnnouncement() {
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>Tambah Pengumuman</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,34 @@
|
||||
'use client'
|
||||
import { isDrawer, LayoutDrawer, LayoutIconBack, LayoutNavbarHome, WARNA } from "@/module/_global";
|
||||
import { useHookstate } from "@hookstate/core";
|
||||
import { ActionIcon, Box, Grid, Group, Text } from "@mantine/core";
|
||||
import { HiMenu } from "react-icons/hi";
|
||||
import DrawerDetailAnnouncement from "./drawer_detail_announcement";
|
||||
|
||||
export default function NavbarDetailAnnouncement() {
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>PENGUMUMAN</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto">
|
||||
<Group justify='flex-end'>
|
||||
<ActionIcon onClick={() => openDrawer.set(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiMenu size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
<LayoutDrawer opened={openDrawer.get()} title={'MENU'} onClose={() => openDrawer.set(false)}>
|
||||
<DrawerDetailAnnouncement />
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
'use client'
|
||||
import { LayoutIconBack, LayoutNavbarHome } from "@/module/_global";
|
||||
import { Box, Grid, Text } from "@mantine/core";
|
||||
|
||||
export default function NavbarEditAnnouncement() {
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>Edit Pengumuman</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
9
src/module/announcement/index.ts
Normal file
9
src/module/announcement/index.ts
Normal file
@@ -0,0 +1,9 @@
|
||||
import ViewCreateAnnouncement from "./view/view_create_announcement";
|
||||
import ViewDetailAnnouncement from "./view/view_detail_anouncement";
|
||||
import ViewEditAnnouncement from "./view/view_edit_announcement";
|
||||
import ViewListAnnouncement from "./view/view_list_announcement";
|
||||
|
||||
export { ViewListAnnouncement }
|
||||
export { ViewCreateAnnouncement }
|
||||
export { ViewDetailAnnouncement }
|
||||
export { ViewEditAnnouncement }
|
||||
60
src/module/announcement/view/view_create_announcement.tsx
Normal file
60
src/module/announcement/view/view_create_announcement.tsx
Normal file
@@ -0,0 +1,60 @@
|
||||
import { WARNA } from "@/module/_global";
|
||||
import { Box, Stack, TextInput, Button, Textarea } from "@mantine/core";
|
||||
import { HiOutlineChevronRight, HiUser } from "react-icons/hi2";
|
||||
import NavbarCreateAnnouncement from "../component/ui/navbar_create_announcement";
|
||||
|
||||
export default function ViewCreateAnnouncement() {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarCreateAnnouncement />
|
||||
<Stack
|
||||
align="center"
|
||||
justify="center"
|
||||
gap="xs"
|
||||
pt={30}
|
||||
px={20}
|
||||
>
|
||||
<TextInput
|
||||
size="md" type="text" radius={30} placeholder="Judul Pengumuman" withAsterisk label="Judul" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<Textarea
|
||||
size="md"
|
||||
radius={20}
|
||||
w={"100%"}
|
||||
label="Pengumuman"
|
||||
withAsterisk
|
||||
placeholder="Deskripsi Pengumuman"
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
|
||||
<Button rightSection={<HiOutlineChevronRight size={14} />} variant="default" fullWidth radius={30} size="md" mt={10}>
|
||||
Pilih Anggota
|
||||
</Button>
|
||||
</Stack>
|
||||
<Box mt={30} mx={20}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="md"
|
||||
radius={30}
|
||||
fullWidth
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
12
src/module/announcement/view/view_detail_anouncement.tsx
Normal file
12
src/module/announcement/view/view_detail_anouncement.tsx
Normal file
@@ -0,0 +1,12 @@
|
||||
import { Box } from "@mantine/core";
|
||||
import DetailAnnouncement from "../component/detail_announcement";
|
||||
import NavbarDetailAnnouncement from "../component/ui/navbar_detail_announcement";
|
||||
|
||||
export default function ViewDetailAnnouncement({ data }: { data: string }) {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarDetailAnnouncement />
|
||||
<DetailAnnouncement />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
60
src/module/announcement/view/view_edit_announcement.tsx
Normal file
60
src/module/announcement/view/view_edit_announcement.tsx
Normal file
@@ -0,0 +1,60 @@
|
||||
import { Box, Button, Stack, Textarea, TextInput } from "@mantine/core";
|
||||
import NavbarEditAnnouncement from "../component/ui/navbar_edit_announcement";
|
||||
import { WARNA } from "@/module/_global";
|
||||
import { HiOutlineChevronRight } from "react-icons/hi2";
|
||||
|
||||
export default function ViewEditAnnouncement({ data }: { data: string }) {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarEditAnnouncement />
|
||||
<Stack
|
||||
align="center"
|
||||
justify="center"
|
||||
gap="xs"
|
||||
pt={30}
|
||||
px={20}
|
||||
>
|
||||
<TextInput
|
||||
size="md" type="text" radius={30} placeholder="Judul Pengumuman" withAsterisk label="Judul" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<Textarea
|
||||
size="md"
|
||||
radius={20}
|
||||
w={"100%"}
|
||||
label="Pengumuman"
|
||||
withAsterisk
|
||||
placeholder="Deskripsi Pengumuman"
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
|
||||
<Button rightSection={<HiOutlineChevronRight size={14} />} variant="default" fullWidth radius={30} size="md" mt={10}>
|
||||
Pilih Anggota
|
||||
</Button>
|
||||
</Stack>
|
||||
<Box mt={30} mx={20}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="md"
|
||||
radius={30}
|
||||
fullWidth
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
12
src/module/announcement/view/view_list_announcement.tsx
Normal file
12
src/module/announcement/view/view_list_announcement.tsx
Normal file
@@ -0,0 +1,12 @@
|
||||
import { Box } from "@mantine/core";
|
||||
import NavbarAnnouncement from "../component/ui/navbar_announcement";
|
||||
import ListAnnouncement from "../component/list_announcement";
|
||||
|
||||
export default function ViewListAnnouncement() {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarAnnouncement />
|
||||
<ListAnnouncement />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
7
src/module/auth/index.ts
Normal file
7
src/module/auth/index.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
import ViewLogin from "./login/view/view_login";
|
||||
import ViewVerification from "./varification/view/view_verification";
|
||||
import { ViewWelcome } from "./welcome/view_welcome";
|
||||
|
||||
export { ViewLogin }
|
||||
export { ViewVerification }
|
||||
export { ViewWelcome }
|
||||
78
src/module/auth/login/view/view_login.tsx
Normal file
78
src/module/auth/login/view/view_login.tsx
Normal file
@@ -0,0 +1,78 @@
|
||||
"use client"
|
||||
import { LayoutLogin, WARNA } from "@/module/_global";
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
Checkbox,
|
||||
Image,
|
||||
rem,
|
||||
Stack,
|
||||
Text,
|
||||
TextInput,
|
||||
Title,
|
||||
} from "@mantine/core";
|
||||
import { useRouter } from "next/navigation";
|
||||
import React from "react";
|
||||
|
||||
function ViewLogin() {
|
||||
const router = useRouter()
|
||||
const textInfo =
|
||||
"Kami akan mengirim kode verifikasi melalui WhatsApp, guna mengonfirmasikan nomor Anda.";
|
||||
|
||||
function onMasuk() {
|
||||
// router.push("/verification")
|
||||
window.location.href = "/verification"
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Box p={10}>
|
||||
<LayoutLogin>
|
||||
<Stack pt={30}>
|
||||
<Box p={10}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
type="number"
|
||||
radius={30}
|
||||
leftSection={<Text>+62</Text>}
|
||||
placeholder="XXX XXX XXX"
|
||||
/>
|
||||
<Text fz={10} mt={10} c={WARNA.biruTua}>
|
||||
{textInfo}
|
||||
</Text>
|
||||
<Checkbox
|
||||
mt={20}
|
||||
label={
|
||||
<Text fz={10} c={WARNA.biruTua}>
|
||||
Ingat saya
|
||||
</Text>
|
||||
}
|
||||
/>
|
||||
<Box mt={20}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="md"
|
||||
radius={30}
|
||||
fullWidth
|
||||
onClick={onMasuk}
|
||||
>
|
||||
MASUK
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</Stack>
|
||||
</LayoutLogin>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default ViewLogin;
|
||||
62
src/module/auth/varification/view/view_verification.tsx
Normal file
62
src/module/auth/varification/view/view_verification.tsx
Normal file
@@ -0,0 +1,62 @@
|
||||
"use client";
|
||||
import { LayoutLogin, WARNA } from "@/module/_global";
|
||||
import { Box, Button, PinInput, Stack, Text, Title } from "@mantine/core";
|
||||
import { useRouter } from "next/navigation";
|
||||
import React from "react";
|
||||
|
||||
export default function ViewVerification() {
|
||||
const router = useRouter();
|
||||
|
||||
function onNext() {
|
||||
// router.push("/welcome");
|
||||
window.location.href = "/welcome"
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<Box p={10}>
|
||||
<LayoutLogin>
|
||||
<Stack pt={30}>
|
||||
<Box p={10}>
|
||||
<Title order={5} c={WARNA.biruTua}>
|
||||
Verifikasi Nomor Telepon
|
||||
</Title>
|
||||
<Text fz={12} c={WARNA.biruTua}>
|
||||
Masukkan kode yang kami kirimkan melalui WhatsApp
|
||||
</Text>
|
||||
<Text fz={12} c={WARNA.biruTua} fw={"bold"}>
|
||||
+6287701790942
|
||||
</Text>
|
||||
<Box pt={30}>
|
||||
<PinInput
|
||||
style={{ justifyContent: "center" }}
|
||||
placeholder=""
|
||||
size="lg"
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
// backgroundColor: WARNA.biruTua,
|
||||
borderRadius: 15,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box mt={40}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="md"
|
||||
radius={30}
|
||||
fullWidth
|
||||
onClick={onNext}
|
||||
>
|
||||
Lanjut
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</Stack>
|
||||
</LayoutLogin>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
}
|
||||
120
src/module/auth/welcome/view_welcome.tsx
Normal file
120
src/module/auth/welcome/view_welcome.tsx
Normal file
@@ -0,0 +1,120 @@
|
||||
"use client";
|
||||
import {
|
||||
Anchor,
|
||||
Button,
|
||||
Center,
|
||||
Flex,
|
||||
Group,
|
||||
Image,
|
||||
Stack,
|
||||
Text,
|
||||
} from "@mantine/core";
|
||||
import { useState } from "react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { WARNA } from "@/module/_global";
|
||||
|
||||
const listTextWellcome = [
|
||||
{
|
||||
id: "1",
|
||||
text: "Selamat Datang di Aplikasi Desa Darmasaba Optimalkan Proyek Desa dengan Fitur Kolaboratif Manajemen Proyek yang Efisien untuk Masa Depan Yang Lebih Baik",
|
||||
img: "/assets/img/welcome/wellcome-1.png",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
text: "Monitor Progres Tugas Secara Real-time Kolaborasi Tim yang Dinamis untuk Sukses Bersama Perencanaan Tugas yang Terstruktur untuk Pertumbuhan Desa",
|
||||
img: "/assets/img/welcome/wellcome-2.png",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
text: "Mulai Membangun Desa dengan Teknologi Canggih Manfaatkan Fitur Analytics untuk Keputusan yang Lebih Baik Selamat Bergabung di Komunitas Desa Darmasaba yang Progresif",
|
||||
img: "/assets/img/welcome/wellcome-3.png",
|
||||
},
|
||||
];
|
||||
|
||||
export function ViewWelcome() {
|
||||
const [index, setIndex] = useState(0);
|
||||
const router = useRouter();
|
||||
|
||||
function onLanjutkan() {
|
||||
if (index === listTextWellcome.length - 1) {
|
||||
// return router.push("/home");
|
||||
return window.location.href = "/home"
|
||||
}
|
||||
setIndex(index + 1);
|
||||
}
|
||||
|
||||
function onSebelumnya() {
|
||||
if (index === 0) {
|
||||
return;
|
||||
}
|
||||
setIndex(index - 1);
|
||||
}
|
||||
return (
|
||||
<Stack>
|
||||
<Group pos={"absolute"} top={20} right={40}>
|
||||
<Anchor>Lewati</Anchor>
|
||||
</Group>
|
||||
<Stack gap={"xl"} p={"xl"} pt={50}>
|
||||
<WelcomeItem index={index} listTextWellcome={listTextWellcome} />
|
||||
</Stack>
|
||||
<Flex
|
||||
w={"100%"}
|
||||
pos={"absolute"}
|
||||
bottom={0}
|
||||
justify={"space-between"}
|
||||
left={0}
|
||||
right={0}
|
||||
p={"xl"}
|
||||
align={"center"}
|
||||
>
|
||||
<Button
|
||||
display={index === 0 ? "none" : "block"}
|
||||
onClick={onSebelumnya}
|
||||
radius={100}
|
||||
size="md"
|
||||
color={WARNA.biruTua}
|
||||
>
|
||||
Sebelumnya
|
||||
</Button>
|
||||
<Text>
|
||||
{index + 1}/{listTextWellcome.length}
|
||||
</Text>
|
||||
<Button
|
||||
onClick={onLanjutkan}
|
||||
radius={100}
|
||||
size="md"
|
||||
color={WARNA.biruTua}
|
||||
>
|
||||
Lanjutkan
|
||||
</Button>
|
||||
</Flex>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
function WelcomeItem({
|
||||
index,
|
||||
listTextWellcome,
|
||||
}: {
|
||||
index: number;
|
||||
listTextWellcome: any[];
|
||||
}) {
|
||||
return (
|
||||
<Stack align="center" justify="center">
|
||||
<Center>
|
||||
<Image
|
||||
w={"90%"}
|
||||
src={listTextWellcome[index].img}
|
||||
alt="gambar wellcome"
|
||||
/>
|
||||
</Center>
|
||||
<Text
|
||||
style={{
|
||||
textAlign: "center",
|
||||
}}
|
||||
>
|
||||
{listTextWellcome[index].text}
|
||||
</Text>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
0
src/module/division/calendar/index.ts
Normal file
0
src/module/division/calendar/index.ts
Normal file
0
src/module/division/discussion/index.ts
Normal file
0
src/module/division/discussion/index.ts
Normal file
0
src/module/division/document/index.ts
Normal file
0
src/module/division/document/index.ts
Normal file
0
src/module/division/index.ts
Normal file
0
src/module/division/index.ts
Normal file
0
src/module/division/project/index.ts
Normal file
0
src/module/division/project/index.ts
Normal file
88
src/module/group/components/list_group_active.tsx
Normal file
88
src/module/group/components/list_group_active.tsx
Normal file
@@ -0,0 +1,88 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Group, Text, TextInput } from '@mantine/core';
|
||||
import React, { useState } from 'react';
|
||||
import { HiOutlineOfficeBuilding } from 'react-icons/hi';
|
||||
import { HiMagnifyingGlass } from 'react-icons/hi2';
|
||||
import EditDrawerGroup from './ui/edit_drawer_group';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
|
||||
const dataGroup = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
]
|
||||
|
||||
export default function ListGroupActive() {
|
||||
// const openDrawerEdit = useHookstate(isDrawer)
|
||||
const [openDrawer, setOpenDrawer] = useState(false)
|
||||
return (
|
||||
<Box pt={20}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
/>
|
||||
{dataGroup.map((v, i) => {
|
||||
return (
|
||||
<Box pt={20} key={i}>
|
||||
<Group align='center' style={{
|
||||
border: `1px solid ${"#DCEED8"}`,
|
||||
padding: 10,
|
||||
borderRadius: 10
|
||||
}} onClick={() => setOpenDrawer(true)} >
|
||||
<Box>
|
||||
<ActionIcon variant="light" bg={'#DCEED8'} size={50} radius={100} aria-label="icon">
|
||||
<HiOutlineOfficeBuilding color={WARNA.biruTua} size={25} />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
|
||||
</Box>
|
||||
</Group>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
<LayoutDrawer opened={openDrawer} onClose={() => setOpenDrawer(false)} title="LEMBAGA PENGKREDITAN DESA">
|
||||
<EditDrawerGroup />
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
85
src/module/group/components/list_group_non_active.tsx
Normal file
85
src/module/group/components/list_group_non_active.tsx
Normal file
@@ -0,0 +1,85 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Group, Text, TextInput } from '@mantine/core';
|
||||
import React, { useState } from 'react';
|
||||
import { HiOutlineOfficeBuilding } from 'react-icons/hi';
|
||||
import { HiMagnifyingGlass } from 'react-icons/hi2';
|
||||
import EditDrawerGroup from './ui/edit_drawer_group';
|
||||
|
||||
const dataGroup = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'No Active Desa'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'No Active Desa'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'No Active Desa'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'No Active Desa'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: 'No Active Desa'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: 'No Active Desa'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: 'No Active Desa'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: 'No Active Desa'
|
||||
},
|
||||
]
|
||||
|
||||
export default function ListGroupNonActive() {
|
||||
const [openDrawer, setOpenDrawer] = useState(false)
|
||||
return (
|
||||
<Box pt={20}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
/>
|
||||
{dataGroup.map((v, i) => {
|
||||
return (
|
||||
<Box pt={20} key={i}>
|
||||
<Group align='center' style={{
|
||||
border: `1px solid ${"#DCEED8"}`,
|
||||
padding: 10,
|
||||
borderRadius: 10
|
||||
}} onClick={() => setOpenDrawer(true)}>
|
||||
<Box>
|
||||
<ActionIcon variant="light" bg={'#DCEED8'} size={50} radius={100} aria-label="icon">
|
||||
<HiOutlineOfficeBuilding color={WARNA.biruTua} size={25} />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
|
||||
</Box>
|
||||
</Group>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
<LayoutDrawer opened={openDrawer} onClose={() => setOpenDrawer(false)} title="LEMBAGA PENGKREDITAN DESA">
|
||||
<EditDrawerGroup />
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
38
src/module/group/components/tab_list_group.tsx
Normal file
38
src/module/group/components/tab_list_group.tsx
Normal file
@@ -0,0 +1,38 @@
|
||||
'use client'
|
||||
import { Box, Tabs, rem } from '@mantine/core';
|
||||
import { IoCloseCircleOutline } from "react-icons/io5"
|
||||
import { IoMdCheckmarkCircleOutline } from "react-icons/io"
|
||||
import ListGroupActive from './list_group_active';
|
||||
import ListGroupNonActive from './list_group_non_active';
|
||||
|
||||
export default function TabListGroup() {
|
||||
const iconStyle = { width: rem(20), height: rem(20) };
|
||||
|
||||
return (
|
||||
<Box p={20}>
|
||||
<Tabs variant="pills" color='#FF9861' radius="xl" defaultValue="aktif">
|
||||
<Tabs.List bg={"white"} style={{
|
||||
border: `1px solid ${"#EDEDED"}`,
|
||||
padding: 5,
|
||||
borderRadius: 100
|
||||
}}>
|
||||
<Tabs.Tab value="aktif" w={"45%"} leftSection={<IoMdCheckmarkCircleOutline style={iconStyle} />}>
|
||||
Aktif
|
||||
</Tabs.Tab>
|
||||
<Tabs.Tab value="tidak-aktif" w={"53%"} leftSection={<IoCloseCircleOutline style={iconStyle} />}>
|
||||
Tidak Aktif
|
||||
</Tabs.Tab>
|
||||
</Tabs.List>
|
||||
|
||||
<Tabs.Panel value="aktif">
|
||||
<ListGroupActive />
|
||||
</Tabs.Panel>
|
||||
|
||||
<Tabs.Panel value="tidak-aktif">
|
||||
<ListGroupNonActive />
|
||||
</Tabs.Panel>
|
||||
</Tabs>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
62
src/module/group/components/ui/drawer_group.tsx
Normal file
62
src/module/group/components/ui/drawer_group.tsx
Normal file
@@ -0,0 +1,62 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import React, { useState } from 'react';
|
||||
import { IoAddCircle } from "react-icons/io5";
|
||||
|
||||
export default function DrawerGroup() {
|
||||
const [openDrawerGroup, setOpenDrawerGroup] = useState(false)
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
|
||||
function onCLose() {
|
||||
setOpenDrawerGroup(false)
|
||||
openDrawer.set(false)
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Stack pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
||||
onClick={() => setOpenDrawerGroup(true)}
|
||||
>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} >
|
||||
<Box>
|
||||
<IoAddCircle size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua}>Tambah Group</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
<LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'TAMBAH GRUP'}>
|
||||
<Box pt={10}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="lg"
|
||||
radius={10}
|
||||
placeholder="Tambah Grup"
|
||||
/>
|
||||
<Box mt={'xl'}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="lg"
|
||||
radius={30}
|
||||
fullWidth
|
||||
onClick={onCLose}
|
||||
>
|
||||
MASUK
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
72
src/module/group/components/ui/edit_drawer_group.tsx
Normal file
72
src/module/group/components/ui/edit_drawer_group.tsx
Normal file
@@ -0,0 +1,72 @@
|
||||
'use client'
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import React, { useState } from 'react';
|
||||
import { IoAddCircle, IoCloseCircleOutline } from "react-icons/io5";
|
||||
|
||||
export default function EditDrawerGroup() {
|
||||
const [openDrawerGroup, setOpenDrawerGroup] = useState(false)
|
||||
const openDrawerEdit = useHookstate(isDrawer)
|
||||
|
||||
function onCLose() {
|
||||
setOpenDrawerGroup(false)
|
||||
openDrawerEdit.set(false)
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Stack pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
||||
|
||||
>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} >
|
||||
<Box>
|
||||
<IoCloseCircleOutline size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua}>Tidak Aktif</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} onClick={() => setOpenDrawerGroup(true)}>
|
||||
<Box>
|
||||
<IoAddCircle size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua}>Edit</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
<LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'EDIT GRUP'}>
|
||||
<Box pt={10}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="lg"
|
||||
radius={10}
|
||||
placeholder="Edit Grup"
|
||||
/>
|
||||
<Box mt={'xl'}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="lg"
|
||||
radius={30}
|
||||
fullWidth
|
||||
onClick={onCLose}
|
||||
>
|
||||
EDIT
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
36
src/module/group/components/ui/navbar_group.tsx
Normal file
36
src/module/group/components/ui/navbar_group.tsx
Normal file
@@ -0,0 +1,36 @@
|
||||
"use client"
|
||||
import { isDrawer, LayoutDrawer, LayoutIconBack, LayoutNavbarHome, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Drawer, Grid, Group, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { HiMenu } from "react-icons/hi";
|
||||
import DrawerGroup from './drawer_group';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
|
||||
export default function NavbarGroup() {
|
||||
const openDrawerMenu = useHookstate(isDrawer)
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>GROUP</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto">
|
||||
<Group justify='flex-end'>
|
||||
<ActionIcon onClick={() => openDrawerMenu.set(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiMenu size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
<LayoutDrawer opened={openDrawerMenu.get()} title={'MENU'} onClose={() => openDrawerMenu.set(false)}>
|
||||
<DrawerGroup />
|
||||
</LayoutDrawer>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
3
src/module/group/index.ts
Normal file
3
src/module/group/index.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
import ViewGroup from "./view/view_group";
|
||||
|
||||
export {ViewGroup}
|
||||
15
src/module/group/view/view_group.tsx
Normal file
15
src/module/group/view/view_group.tsx
Normal file
@@ -0,0 +1,15 @@
|
||||
import React from 'react';
|
||||
import NavbarGroup from '../components/ui/navbar_group';
|
||||
import { Box } from '@mantine/core';
|
||||
import ListGroupActive from '../components/list_group_active';
|
||||
import TabListGroup from '../components/tab_list_group';
|
||||
|
||||
export default function ViewGroup() {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarGroup />
|
||||
<TabListGroup/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
36
src/module/home/components/carosole.tsx
Normal file
36
src/module/home/components/carosole.tsx
Normal file
@@ -0,0 +1,36 @@
|
||||
'use client'
|
||||
import React, { useRef } from 'react';
|
||||
import { Carousel } from '@mantine/carousel';
|
||||
import { WARNA } from '@/module/_global';
|
||||
import Autoplay from 'embla-carousel-autoplay';
|
||||
import { Flex, Text } from '@mantine/core';
|
||||
export default function Carosole() {
|
||||
const autoplay = useRef(Autoplay({ delay: 5000 }));
|
||||
return (
|
||||
<>
|
||||
<Carousel
|
||||
withIndicators
|
||||
height={150}
|
||||
plugins={[autoplay.current]}
|
||||
onMouseEnter={autoplay.current.stop}
|
||||
onMouseLeave={autoplay.current.reset}
|
||||
>
|
||||
<Carousel.Slide bg={WARNA.biruTua} style={{ borderRadius: 10 }}>
|
||||
<Flex justify={'center'} h={"100%"} align={'center'}>
|
||||
<Text c={"white"}>INFORMASI DARMASABA</Text>
|
||||
</Flex>
|
||||
</Carousel.Slide>
|
||||
<Carousel.Slide bg={WARNA.biruTua} style={{ borderRadius: 10 }}>
|
||||
<Flex justify={'center'} h={"100%"} align={'center'}>
|
||||
<Text c={"white"}>INFORMASI DARMASABA</Text>
|
||||
</Flex>
|
||||
</Carousel.Slide>
|
||||
<Carousel.Slide bg={WARNA.biruTua} style={{ borderRadius: 10 }}>
|
||||
<Flex justify={'center'} h={"100%"} align={'center'}>
|
||||
<Text c={"white"}>INFORMASI DARMASABA</Text>
|
||||
</Flex>
|
||||
</Carousel.Slide>
|
||||
</Carousel>
|
||||
</>
|
||||
);
|
||||
}
|
||||
79
src/module/home/components/features.tsx
Normal file
79
src/module/home/components/features.tsx
Normal file
@@ -0,0 +1,79 @@
|
||||
'use client'
|
||||
import { WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Center, Grid, SimpleGrid, Text } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiMiniUserGroup, HiMiniPresentationChartBar, HiMegaphone, HiSquares2X2 } from "react-icons/hi2";
|
||||
|
||||
export default function Features() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<>
|
||||
<Box pt={10}>
|
||||
<Text c={WARNA.biruTua} mb={10} fw={'bold'} fz={16}>Features</Text>
|
||||
<SimpleGrid
|
||||
cols={{ base: 4, sm: 4, lg: 4 }}
|
||||
>
|
||||
<Box>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
aria-label="Gradient action icon"
|
||||
radius={100}
|
||||
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
|
||||
<HiMiniUserGroup size={35} color={WARNA.biruTua} />
|
||||
</ActionIcon>
|
||||
</Center>
|
||||
<Center>
|
||||
<Text fz={15} c={WARNA.biruTua}>Divisi</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box onClick={() => router.push('/project')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
aria-label="Gradient action icon"
|
||||
radius={100}
|
||||
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
|
||||
<HiMiniPresentationChartBar size={35} color={WARNA.biruTua} />
|
||||
</ActionIcon>
|
||||
</Center>
|
||||
<Center>
|
||||
<Text fz={15} c={WARNA.biruTua}>Proyek</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box onClick={() => router.push('/announcement')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
aria-label="Gradient action icon"
|
||||
radius={100}
|
||||
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
|
||||
<HiMegaphone size={35} color={WARNA.biruTua} />
|
||||
</ActionIcon>
|
||||
</Center>
|
||||
<Center>
|
||||
<Text fz={15} c={WARNA.biruTua}>Pengumuman</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box onClick={() => router.push('detail-feature')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
aria-label="Gradient action icon"
|
||||
radius={100}
|
||||
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
|
||||
<HiSquares2X2 size={35} color={WARNA.biruTua} />
|
||||
</ActionIcon>
|
||||
</Center>
|
||||
<Center>
|
||||
<Text fz={15} c={WARNA.biruTua}>Semua</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
26
src/module/home/components/ui/icon_navbar.tsx
Normal file
26
src/module/home/components/ui/icon_navbar.tsx
Normal file
@@ -0,0 +1,26 @@
|
||||
"use client"
|
||||
import { WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Group } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiMagnifyingGlass, HiOutlineBell, HiOutlineUser } from 'react-icons/hi2';
|
||||
|
||||
export default function IconNavbar() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Box>
|
||||
<Group>
|
||||
<ActionIcon onClick={()=> router.push('/search')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiMagnifyingGlass size={20} color='white' />
|
||||
</ActionIcon>
|
||||
<ActionIcon onClick={()=> router.push('/notification')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiOutlineBell size={20} color='white' />
|
||||
</ActionIcon>
|
||||
<ActionIcon onClick={()=> router.push('/profile')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiOutlineUser size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
5
src/module/home/index.ts
Normal file
5
src/module/home/index.ts
Normal file
@@ -0,0 +1,5 @@
|
||||
import ViewDetailFeature from "./view/view_detail_feature";
|
||||
import ViewHome from "./view/view_home";
|
||||
|
||||
export { ViewHome }
|
||||
export {ViewDetailFeature}
|
||||
120
src/module/home/view/view_detail_feature.tsx
Normal file
120
src/module/home/view/view_detail_feature.tsx
Normal file
@@ -0,0 +1,120 @@
|
||||
'use client'
|
||||
import { LayoutNavbarHome, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Center, Grid, Group, SimpleGrid, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { HiMiniUserGroup, HiMiniPresentationChartBar, HiMegaphone, HiSquares2X2, HiChevronLeft, HiUserGroup, HiUsers } from "react-icons/hi2";
|
||||
import { PiUsersFourFill } from "react-icons/pi";
|
||||
import { FaUsersRays, FaUserTie } from "react-icons/fa6";
|
||||
import { useRouter } from 'next/navigation';
|
||||
import LayoutIconBack from '@/module/_global/layout/layout_icon_back';
|
||||
|
||||
export default function ViewDetailFeature() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'} >SEMUA FITUR</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
<Box p={20}>
|
||||
<Box >
|
||||
<SimpleGrid
|
||||
cols={{ base: 4, sm: 4, lg: 4 }}
|
||||
>
|
||||
<Box>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
aria-label="Gradient action icon"
|
||||
radius={100}
|
||||
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
|
||||
<HiMiniUserGroup size={35} color={WARNA.biruTua} />
|
||||
</ActionIcon>
|
||||
</Center>
|
||||
<Center>
|
||||
<Text fz={15} c={WARNA.biruTua}>Divisi</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box onClick={() => router.push('/project')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
aria-label="Gradient action icon"
|
||||
radius={100}
|
||||
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
|
||||
<HiMiniPresentationChartBar size={35} color={WARNA.biruTua} />
|
||||
</ActionIcon>
|
||||
</Center>
|
||||
<Center>
|
||||
<Text fz={15} c={WARNA.biruTua}>Proyek</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box onClick={() => router.push('/announcement')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
aria-label="Gradient action icon"
|
||||
radius={100}
|
||||
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
|
||||
<HiMegaphone size={35} color={WARNA.biruTua} />
|
||||
</ActionIcon>
|
||||
</Center>
|
||||
<Center>
|
||||
<Text fz={15} c={WARNA.biruTua}>Pengumuman</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box onClick={() => router.push('/member')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
aria-label="Gradient action icon"
|
||||
radius={100}
|
||||
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
|
||||
<PiUsersFourFill size={35} color={WARNA.biruTua} />
|
||||
</ActionIcon>
|
||||
</Center>
|
||||
<Center>
|
||||
<Text fz={15} c={WARNA.biruTua}>Anggota</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box onClick={() => router.push('/group')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
aria-label="Gradient action icon"
|
||||
radius={100}
|
||||
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
|
||||
<HiUsers size={35} color={WARNA.biruTua} />
|
||||
</ActionIcon>
|
||||
</Center>
|
||||
<Center>
|
||||
<Text fz={15} c={WARNA.biruTua}>Group</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box onClick={() => router.push('/position')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
aria-label="Gradient action icon"
|
||||
radius={100}
|
||||
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
|
||||
<FaUserTie size={35} color={WARNA.biruTua} />
|
||||
</ActionIcon>
|
||||
</Center>
|
||||
<Center>
|
||||
<Text fz={15} c={WARNA.biruTua}>Jabatan</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
}
|
||||
30
src/module/home/view/view_home.tsx
Normal file
30
src/module/home/view/view_home.tsx
Normal file
@@ -0,0 +1,30 @@
|
||||
import { LayoutNavbarHome, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Anchor, Box, Group, rem, Stack, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { HiMagnifyingGlass, HiOutlineBell, HiOutlineUser } from "react-icons/hi2";
|
||||
import Carosole from '../components/carosole';
|
||||
import Features from '../components/features';
|
||||
import IconNavbar from '../components/ui/icon_navbar';
|
||||
|
||||
|
||||
|
||||
export default function ViewHome() {
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Group justify='space-between'>
|
||||
<Text fw={'bold'} c={'white'} >Perbekal Darmasaba</Text>
|
||||
<IconNavbar/>
|
||||
</Group>
|
||||
</LayoutNavbarHome>
|
||||
<Box p={20}>
|
||||
<Stack >
|
||||
<Carosole />
|
||||
<Features />
|
||||
</Stack>
|
||||
</Box>
|
||||
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
94
src/module/notification/components/list_notification.tsx
Normal file
94
src/module/notification/components/list_notification.tsx
Normal file
@@ -0,0 +1,94 @@
|
||||
"use client"
|
||||
import { WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Center, Grid, Group, Text } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiUser } from 'react-icons/hi2';
|
||||
|
||||
const dataNotification = [
|
||||
{
|
||||
id: 1,
|
||||
title: 'Rapat Kamis',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: 'Rapat Jumat',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: 'Rapat Senin',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: 'Rapat Selasa',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
]
|
||||
|
||||
export default function ListNotification() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Box>
|
||||
{dataNotification.map((v, i) => {
|
||||
return (
|
||||
<Grid style={{
|
||||
border: `1px solid ${WARNA.borderOrange}`,
|
||||
padding: 15,
|
||||
borderRadius: 15
|
||||
}} gutter={1} key={i} mb={"sm"}>
|
||||
<Grid.Col span={3} pl={'xs'}>
|
||||
<ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
|
||||
<HiUser size={30} color='white' />
|
||||
</ActionIcon>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={9}>
|
||||
<Box>
|
||||
<Text fw={'bold'} fz={18}>{v.title}</Text>
|
||||
<Text fz={15}>{v.description}</Text>
|
||||
</Box>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
)
|
||||
})}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,23 @@
|
||||
"use client"
|
||||
import { LayoutIconBack, LayoutNavbarHome } from '@/module/_global';
|
||||
import { Box, Grid, Text } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
|
||||
export default function NavbarNotification() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'} >NOTIFIKASI</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
);
|
||||
}
|
||||
|
||||
3
src/module/notification/index.ts
Normal file
3
src/module/notification/index.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
import ViewNotification from "./view/view_notification";
|
||||
|
||||
export {ViewNotification}
|
||||
16
src/module/notification/view/view_notification.tsx
Normal file
16
src/module/notification/view/view_notification.tsx
Normal file
@@ -0,0 +1,16 @@
|
||||
import { LayoutIconBack, LayoutNavbarHome } from '@/module/_global'
|
||||
import { Box, Grid, Text } from '@mantine/core'
|
||||
import React from 'react'
|
||||
import NavbarNotification from '../components/ui/navbar_notification'
|
||||
import ListNotification from '../components/list_notification'
|
||||
|
||||
export default function ViewNotification() {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarNotification />
|
||||
<Box p={20}>
|
||||
<ListNotification />
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
38
src/module/position/component/tab_list_position.tsx
Normal file
38
src/module/position/component/tab_list_position.tsx
Normal file
@@ -0,0 +1,38 @@
|
||||
'use client'
|
||||
import { Box, Tabs, rem } from '@mantine/core';
|
||||
import { IoCloseCircleOutline } from "react-icons/io5"
|
||||
import { IoMdCheckmarkCircleOutline } from "react-icons/io"
|
||||
import ListPositionActive from './ui/list_position_active';
|
||||
import ListPositionNonActive from './ui/list_position_nonactive';
|
||||
|
||||
export default function TabListGroup() {
|
||||
const iconStyle = { width: rem(20), height: rem(20) };
|
||||
|
||||
return (
|
||||
<Box p={20}>
|
||||
<Tabs variant="pills" color='#FF9861' radius="xl" defaultValue="aktif">
|
||||
<Tabs.List bg={"white"} style={{
|
||||
border: `1px solid ${"#EDEDED"}`,
|
||||
padding: 5,
|
||||
borderRadius: 100
|
||||
}}>
|
||||
<Tabs.Tab value="aktif" w={"45%"} leftSection={<IoMdCheckmarkCircleOutline style={iconStyle} />}>
|
||||
Aktif
|
||||
</Tabs.Tab>
|
||||
<Tabs.Tab value="tidak-aktif" w={"53%"} leftSection={<IoCloseCircleOutline style={iconStyle} />}>
|
||||
Tidak Aktif
|
||||
</Tabs.Tab>
|
||||
</Tabs.List>
|
||||
|
||||
<Tabs.Panel value="aktif">
|
||||
<ListPositionActive />
|
||||
</Tabs.Panel>
|
||||
|
||||
<Tabs.Panel value="tidak-aktif">
|
||||
<ListPositionNonActive />
|
||||
</Tabs.Panel>
|
||||
</Tabs>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
92
src/module/position/component/ui/drawer_detail_position.tsx
Normal file
92
src/module/position/component/ui/drawer_detail_position.tsx
Normal file
@@ -0,0 +1,92 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from "@/module/_global"
|
||||
import { useHookstate } from "@hookstate/core"
|
||||
import { Box, Stack, SimpleGrid, Flex, Text, Select, TextInput, Button } from "@mantine/core"
|
||||
import router from "next/router"
|
||||
import { useState } from "react"
|
||||
import { FaPencil } from "react-icons/fa6"
|
||||
import { ImUserCheck } from "react-icons/im"
|
||||
|
||||
export default function DrawerDetailPosition() {
|
||||
const [openDrawerGroup, setOpenDrawerGroup] = useState(false)
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
function onCLose() {
|
||||
setOpenDrawerGroup(false)
|
||||
openDrawer.set(false)
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Stack pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
||||
>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'}>
|
||||
<Box>
|
||||
<ImUserCheck size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Status</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
|
||||
<Flex justify={'center'} align={'center'} direction={'column'}
|
||||
onClick={() => setOpenDrawerGroup(true)}
|
||||
>
|
||||
<Box>
|
||||
<FaPencil size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Edit</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
|
||||
<LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'Edit Jabatan'} size="lg">
|
||||
<Box pt={10}>
|
||||
<Select
|
||||
label="Grup"
|
||||
placeholder="Pilih grup"
|
||||
data={['Dinas', 'Adat', 'LPD']}
|
||||
size="md"
|
||||
radius={10}
|
||||
mb={5}
|
||||
withAsterisk
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Jabatan"
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
my={15}
|
||||
size="md"
|
||||
radius={10}
|
||||
placeholder="Nama Jabatan"
|
||||
/>
|
||||
<Box mt={'xl'}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="lg"
|
||||
radius={30}
|
||||
fullWidth
|
||||
onClick={onCLose}
|
||||
>
|
||||
EDIT
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
80
src/module/position/component/ui/drawer_list_position.tsx
Normal file
80
src/module/position/component/ui/drawer_list_position.tsx
Normal file
@@ -0,0 +1,80 @@
|
||||
import { isDrawer, WARNA, LayoutDrawer } from "@/module/_global";
|
||||
import { useHookstate } from "@hookstate/core";
|
||||
import { Box, Stack, SimpleGrid, Flex, TextInput, Button, Text, Select } from "@mantine/core";
|
||||
import { useState } from "react";
|
||||
import { IoAddCircle } from "react-icons/io5";
|
||||
|
||||
export default function DrawerListPosition() {
|
||||
const [openDrawerGroup, setOpenDrawerGroup] = useState(false)
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
|
||||
function onCLose() {
|
||||
setOpenDrawerGroup(false)
|
||||
openDrawer.set(false)
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Stack pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
||||
onClick={() => setOpenDrawerGroup(true)}
|
||||
>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} >
|
||||
<Box>
|
||||
<IoAddCircle size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text ta={'center'} c={WARNA.biruTua}>Tambah Jabatan</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
<LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'Tambah Jabatan'} size="lg">
|
||||
<Box pt={0}>
|
||||
<Select
|
||||
label="Grup"
|
||||
placeholder="Pilih grup"
|
||||
data={['Dinas', 'Adat', 'LPD']}
|
||||
size="md"
|
||||
radius={10}
|
||||
mb={5}
|
||||
withAsterisk
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Jabatan"
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
my={15}
|
||||
size="md"
|
||||
radius={10}
|
||||
placeholder="Nama Jabatan"
|
||||
/>
|
||||
<Box mt={'xl'}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="lg"
|
||||
radius={30}
|
||||
fullWidth
|
||||
onClick={onCLose}
|
||||
>
|
||||
MASUK
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
85
src/module/position/component/ui/list_position_active.tsx
Normal file
85
src/module/position/component/ui/list_position_active.tsx
Normal file
@@ -0,0 +1,85 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Group, Text, TextInput } from '@mantine/core';
|
||||
import React, { useState } from 'react';
|
||||
import { FaUserTie } from 'react-icons/fa6';
|
||||
import { HiMagnifyingGlass } from 'react-icons/hi2';
|
||||
import DrawerDetailPosition from './drawer_detail_position';
|
||||
|
||||
const dataGroup = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'Kepala'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Sekretaris'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Bendahara'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'Anggota'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: 'Kepala Urusan Kemasyarakatan'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: 'Kepala Urusan Pemerintahan'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: 'Kepala Urusan Kependudukan'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: 'Anggota'
|
||||
},
|
||||
]
|
||||
|
||||
export default function ListPositionActive() {
|
||||
const [openDrawer, setOpenDrawer] = useState(false)
|
||||
return (
|
||||
<Box pt={20}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
/>
|
||||
{dataGroup.map((v, i) => {
|
||||
return (
|
||||
<Box pt={20} key={i}>
|
||||
<Group align='center' style={{
|
||||
border: `1px solid ${"#DCEED8"}`,
|
||||
padding: 10,
|
||||
borderRadius: 10
|
||||
}} onClick={() => setOpenDrawer(true)} >
|
||||
<Box>
|
||||
<ActionIcon variant="light" bg={'#DCEED8'} size={50} radius={100} aria-label="icon">
|
||||
<FaUserTie color={WARNA.biruTua} size={25} />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
|
||||
</Box>
|
||||
</Group>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
<LayoutDrawer opened={openDrawer} onClose={() => setOpenDrawer(false)} title="LEMBAGA PENGKREDITAN DESA">
|
||||
<DrawerDetailPosition />
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
85
src/module/position/component/ui/list_position_nonactive.tsx
Normal file
85
src/module/position/component/ui/list_position_nonactive.tsx
Normal file
@@ -0,0 +1,85 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Group, Text, TextInput } from '@mantine/core';
|
||||
import React, { useState } from 'react';
|
||||
import { FaUserTie } from 'react-icons/fa6';
|
||||
import { HiMagnifyingGlass } from 'react-icons/hi2';
|
||||
import DrawerDetailPosition from './drawer_detail_position';
|
||||
|
||||
const dataGroup = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'Anggota'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Anggota'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Anggota'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'Anggota'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: 'Anggota'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: 'Anggota'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: 'Anggota'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: 'Anggota'
|
||||
},
|
||||
]
|
||||
|
||||
export default function ListPositionNonActive() {
|
||||
const [openDrawer, setOpenDrawer] = useState(false)
|
||||
return (
|
||||
<Box pt={20}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
/>
|
||||
{dataGroup.map((v, i) => {
|
||||
return (
|
||||
<Box pt={20} key={i}>
|
||||
<Group align='center' style={{
|
||||
border: `1px solid ${"#DCEED8"}`,
|
||||
padding: 10,
|
||||
borderRadius: 10
|
||||
}} onClick={() => setOpenDrawer(true)}>
|
||||
<Box>
|
||||
<ActionIcon variant="light" bg={'#DCEED8'} size={50} radius={100} aria-label="icon">
|
||||
<FaUserTie color={WARNA.biruTua} size={25} />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
|
||||
</Box>
|
||||
</Group>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
<LayoutDrawer opened={openDrawer} onClose={() => setOpenDrawer(false)} title="LEMBAGA PENGKREDITAN DESA">
|
||||
<DrawerDetailPosition />
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
34
src/module/position/component/ui/navbar_list_position.tsx
Normal file
34
src/module/position/component/ui/navbar_list_position.tsx
Normal file
@@ -0,0 +1,34 @@
|
||||
'use client'
|
||||
import { LayoutNavbarHome, LayoutIconBack, WARNA, LayoutDrawer, isDrawer } from "@/module/_global";
|
||||
import { useHookstate } from "@hookstate/core";
|
||||
import { Grid, Group, ActionIcon, Box, Text } from "@mantine/core";
|
||||
import { HiMenu } from "react-icons/hi";
|
||||
import DrawerListPosition from "./drawer_list_position";
|
||||
|
||||
export default function NavbarListPosition() {
|
||||
const openDrawerMenu = useHookstate(isDrawer)
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>Jabatan</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto">
|
||||
<Group justify='flex-end'>
|
||||
<ActionIcon onClick={() => openDrawerMenu.set(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiMenu size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
<LayoutDrawer opened={openDrawerMenu.get()} title={'MENU'} onClose={() => openDrawerMenu.set(false)}>
|
||||
<DrawerListPosition />
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
3
src/module/position/index.ts
Normal file
3
src/module/position/index.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
import ViewListPosition from "./view/view_list_position";
|
||||
|
||||
export { ViewListPosition }
|
||||
12
src/module/position/view/view_list_position.tsx
Normal file
12
src/module/position/view/view_list_position.tsx
Normal file
@@ -0,0 +1,12 @@
|
||||
import { Box } from "@mantine/core";
|
||||
import NavbarListPosition from "../component/ui/navbar_list_position";
|
||||
import TabListGroup from "../component/tab_list_position";
|
||||
|
||||
export default function ViewListPosition() {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarListPosition />
|
||||
<TabListGroup />
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
3
src/module/project/index.ts
Normal file
3
src/module/project/index.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
import ViewProject from "./view/view_project";
|
||||
|
||||
export {ViewProject}
|
||||
10
src/module/project/view/view_project.tsx
Normal file
10
src/module/project/view/view_project.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import React from 'react';
|
||||
|
||||
export default function ViewProject() {
|
||||
return (
|
||||
<div>
|
||||
ViewProject
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
25
src/module/search/components/ui/navbar_search.tsx
Normal file
25
src/module/search/components/ui/navbar_search.tsx
Normal file
@@ -0,0 +1,25 @@
|
||||
"use client"
|
||||
import { LayoutIconBack, LayoutNavbarHome } from '@/module/_global';
|
||||
import { Box, Grid, Text } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
|
||||
export default function NavbarSearch() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'} >PENCARIAN</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
3
src/module/search/index.ts
Normal file
3
src/module/search/index.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
import ViewSearch from "./view/view_search";
|
||||
|
||||
export {ViewSearch}
|
||||
31
src/module/search/view/view_search.tsx
Normal file
31
src/module/search/view/view_search.tsx
Normal file
@@ -0,0 +1,31 @@
|
||||
|
||||
import { LayoutIconBack, LayoutNavbarHome, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Grid, Text, TextInput } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiChevronLeft, HiMagnifyingGlass } from 'react-icons/hi2';
|
||||
import NavbarSearch from '../components/ui/navbar_search';
|
||||
|
||||
export default function ViewSearch() {
|
||||
return (
|
||||
<>
|
||||
<NavbarSearch />
|
||||
<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"
|
||||
/>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
29
src/module/seeder/data/user.json
Normal file
29
src/module/seeder/data/user.json
Normal file
@@ -0,0 +1,29 @@
|
||||
[
|
||||
{
|
||||
"id": "devAmalia",
|
||||
"idUserRole": "dev",
|
||||
"nik": "1111111",
|
||||
"name": "Amalia",
|
||||
"phone": "6298980185458",
|
||||
"email": "amalia@bip.com",
|
||||
"gender": "F"
|
||||
},
|
||||
{
|
||||
"id": "devLukman",
|
||||
"idUserRole": "dev",
|
||||
"nik": "2222222",
|
||||
"name": "Lukman",
|
||||
"phone": "6287701790942",
|
||||
"email": "lukman@bip.com",
|
||||
"gender": "M"
|
||||
},
|
||||
{
|
||||
"id": "devMalik",
|
||||
"idUserRole": "dev",
|
||||
"nik": "3333333",
|
||||
"name": "Malik",
|
||||
"phone": "6289697338821",
|
||||
"email": "malik@bip.com",
|
||||
"gender": "M"
|
||||
}
|
||||
]
|
||||
32
src/module/seeder/data/user_role.json
Normal file
32
src/module/seeder/data/user_role.json
Normal file
@@ -0,0 +1,32 @@
|
||||
[
|
||||
{
|
||||
"id": "dev",
|
||||
"name": "Developer",
|
||||
"desc": "-"
|
||||
},
|
||||
{
|
||||
"id": "supadmin",
|
||||
"name": "Super Admin",
|
||||
"desc": "-"
|
||||
},
|
||||
{
|
||||
"id": "cosupadmin",
|
||||
"name": "Wakil Super Admin",
|
||||
"desc": "-"
|
||||
},
|
||||
{
|
||||
"id": "admin",
|
||||
"name": "Admin",
|
||||
"desc": "-"
|
||||
},
|
||||
{
|
||||
"id": "coadmin",
|
||||
"name": "Wakil Admin",
|
||||
"desc": "-"
|
||||
},
|
||||
{
|
||||
"id": "user",
|
||||
"name": "User",
|
||||
"desc": "-"
|
||||
}
|
||||
]
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user