diff --git a/package-lock.json b/package-lock.json index 50fe424..3d761ed 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,6 +12,8 @@ "@emotion/styled": "^11.11.0", "@mui/icons-material": "^5.15.3", "@mui/material": "^5.15.3", + "@mui/x-data-grid": "^6.18.7", + "@prisma/client": "^5.7.1", "axios": "^1.6.2", "next": "^14.0.4", "prisma": "^5.7.1", @@ -754,6 +756,31 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz", "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==" }, + "node_modules/@mui/x-data-grid": { + "version": "6.18.7", + "resolved": "https://registry.npmjs.org/@mui/x-data-grid/-/x-data-grid-6.18.7.tgz", + "integrity": "sha512-K1A3pMUPxI4/Mt5A4vrK45fBBQK5rZvBVqRMrB5n8zX++Bj+WLWKvLTtfCmlriUtzuadr/Hl7Z+FDRXUJAx6qg==", + "dependencies": { + "@babel/runtime": "^7.23.2", + "@mui/utils": "^5.14.16", + "clsx": "^2.0.0", + "prop-types": "^15.8.1", + "reselect": "^4.1.8" + }, + "engines": { + "node": ">=14.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@mui/material": "^5.4.1", + "@mui/system": "^5.4.1", + "react": "^17.0.0 || ^18.0.0", + "react-dom": "^17.0.0 || ^18.0.0" + } + }, "node_modules/@next/env": { "version": "14.0.4", "resolved": "https://registry.npmjs.org/@next/env/-/env-14.0.4.tgz", @@ -947,6 +974,23 @@ "url": "https://opencollective.com/popperjs" } }, + "node_modules/@prisma/client": { + "version": "5.7.1", + "resolved": "https://registry.npmjs.org/@prisma/client/-/client-5.7.1.tgz", + "integrity": "sha512-TUSa4nUcC4nf/e7X3jyO1pEd6XcI/TLRCA0KjkA46RDIpxUaRsBYEOqITwXRW2c0bMFyKcCRXrH4f7h4q9oOlg==", + "hasInstallScript": true, + "engines": { + "node": ">=16.13" + }, + "peerDependencies": { + "prisma": "*" + }, + "peerDependenciesMeta": { + "prisma": { + "optional": true + } + } + }, "node_modules/@prisma/debug": { "version": "5.7.1", "resolved": "https://registry.npmjs.org/@prisma/debug/-/debug-5.7.1.tgz", @@ -4000,6 +4044,11 @@ "resolved": "https://registry.npmjs.org/remove-accents/-/remove-accents-0.4.2.tgz", "integrity": "sha512-7pXIJqJOq5tFgG1A2Zxti3Ht8jJF337m4sowbuHsW30ZnkQFnDzy9qBNhgzX8ZLW4+UBcXiiR7SwR6pokHsxiA==" }, + "node_modules/reselect": { + "version": "4.1.8", + "resolved": "https://registry.npmjs.org/reselect/-/reselect-4.1.8.tgz", + "integrity": "sha512-ab9EmR80F/zQTMNeneUr4cv+jSwPJgIlvEmVwLerwrWVbpLlBuls9XHzIeTFy4cegU2NHBp3va0LKOzU5qFEYQ==" + }, "node_modules/resolve": { "version": "1.22.8", "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz", diff --git a/package.json b/package.json index f7b6f9d..84e6373 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "0.1.0", "private": true, "scripts": { - "dev": "next dev", + "dev": "next dev -H 100.101.64.38", "build": "next build", "start": "next start", "lint": "next lint" @@ -13,6 +13,8 @@ "@emotion/styled": "^11.11.0", "@mui/icons-material": "^5.15.3", "@mui/material": "^5.15.3", + "@mui/x-data-grid": "^6.18.7", + "@prisma/client": "^5.7.1", "axios": "^1.6.2", "next": "^14.0.4", "prisma": "^5.7.1", diff --git a/prisma/schema.prisma b/prisma/schema.prisma index d205f42..39d45e0 100644 --- a/prisma/schema.prisma +++ b/prisma/schema.prisma @@ -1,6 +1,3 @@ -// This is your Prisma schema file, -// learn more about it in the docs: https://pris.ly/d/prisma-schema - generator client { provider = "prisma-client-js" } @@ -9,3 +6,11 @@ datasource db { provider = "postgresql" url = env("DATABASE_URL") } + +model Mitarbeiter { + ID String @id @default(dbgenerated("uuid_generate_v4()")) @db.Uuid + Vorname String + Nachname String + Anstelldatum DateTime @db.Date + Geburtstag DateTime @db.Date +} diff --git a/src/app/app.tsx b/src/app/app.tsx index 6451cfd..094e68d 100644 --- a/src/app/app.tsx +++ b/src/app/app.tsx @@ -1,14 +1,13 @@ import { Routes, Route } from "react-router-dom"; // @Pages -import Login from "./login"; -import Dashboard from "./dashboard"; +import Dashboard from "./dashboard/page"; function App() { return ( - } /> - } /> + } /> + ); } diff --git a/src/app/dashboard.tsx b/src/app/dashboard.tsx deleted file mode 100644 index aa8c5ea..0000000 --- a/src/app/dashboard.tsx +++ /dev/null @@ -1,10 +0,0 @@ -import { Typography } from "@mui/material"; - -export default function dashboard() { - - return ( - - Welcome to the Admin panel - - ) -} \ No newline at end of file diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx new file mode 100644 index 0000000..72907fa --- /dev/null +++ b/src/app/dashboard/page.tsx @@ -0,0 +1,122 @@ +'use client' +import { Box, Button, Typography, } from "@mui/material"; +import { DataGrid, GridColDef } from '@mui/x-data-grid'; +import { PrismaClient } from "@prisma/client"; +import axios from "axios"; + + +import { useEffect, useState } from "react"; + +// ... + + +const columns: GridColDef[] = [ + { + field: 'Vorname', + headerName: 'Vorname', + width: 150, + }, + { + field: 'Nachname', + headerName: 'Nachname', + width: 150, + }, + { + field: 'Anstelldatum', + headerName: 'Anstelldatum', + width: 110, + }, + { + field: 'Geburtstag', + headerName: 'Geburtstag', + description: 'This column has a value getter and is not sortable.', + sortable: false, + width: 160, + }, +]; + + +const URL= "http://100.101.64.38:3000/api/hello"; + +export default function Page() { + + + + const [data, setData] = useState([]); + useEffect(() => { + async function getData() { + const response = await fetch(URL); + const data = await response.json(); + setData(data); + } + getData(); + }, []) + + + const rows = [ + { id: "1", Vorname:{data}, Nachname: "test", Anstelldatum: "test", Geburtstag: "test" } + ]; + + return ( + + + Welcome to the Admin panel + + + + + + + + + + + ); +} + + diff --git a/src/app/page.tsx b/src/app/page.tsx index 9bb42df..dc69dde 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -77,7 +77,7 @@ export default function Home() { }, }} onClick={() => { - useHref("/dashboard"); + }} > diff --git a/src/pages/api/hello.ts b/src/pages/api/hello.ts new file mode 100644 index 0000000..aef2a60 --- /dev/null +++ b/src/pages/api/hello.ts @@ -0,0 +1,12 @@ +import type { NextApiRequest, NextApiResponse } from 'next' + +type ResponseData = { + message: string +} + +export default function handler( + req: NextApiRequest, + res: NextApiResponse +) { + res.status(200).send({ Vorname: 'test' }) +} diff --git a/tsconfig.json b/tsconfig.json index e59724b..54698a4 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,6 +1,6 @@ { "compilerOptions": { - "target": "es5", + "target": "es2017", "lib": ["dom", "dom.iterable", "esnext"], "allowJs": true, "skipLibCheck": true,