Compare commits
No commits in common. "7dfce2e38b540b7ac6491feaff0707bee7fb8fed" and "be5b440d18c7b03a833ea2921a79658176386a4d" have entirely different histories.
7dfce2e38b
...
be5b440d18
20 changed files with 176 additions and 367 deletions
|
@ -1,23 +0,0 @@
|
||||||
steps:
|
|
||||||
- name: build-docker
|
|
||||||
image: docker:latest
|
|
||||||
commands:
|
|
||||||
- docker build -f backend.Dockerfile -t backend .
|
|
||||||
|
|
||||||
- name: login-forgejo
|
|
||||||
image: docker:latest
|
|
||||||
commands:
|
|
||||||
- docker login -u $$FORGEJO_USERNAME -p $$FORGEJO_PASSWORD git.mixel.cloud
|
|
||||||
environment:
|
|
||||||
FORGEJO_USERNAME:
|
|
||||||
from_secret: FORGEJO_USERNAME
|
|
||||||
FORGEJO_PASSWORD:
|
|
||||||
from_secret: FORGEJO_PASSWORD
|
|
||||||
|
|
||||||
|
|
||||||
- name: publish-forgejo
|
|
||||||
image: docker:latest
|
|
||||||
commands:
|
|
||||||
- export IMAGE_NAME=git.mixel.cloud/Turbo/peer-group-grading:$${CI_COMMIT_SHA:0:8}
|
|
||||||
- docker tag backend $$IMAGE_NAME
|
|
||||||
- docker push $$IMAGE_NAME
|
|
30
Cargo.lock
generated
30
Cargo.lock
generated
|
@ -1045,6 +1045,16 @@ dependencies = [
|
||||||
"cipher",
|
"cipher",
|
||||||
]
|
]
|
||||||
|
|
||||||
|
[[package]]
|
||||||
|
name = "ctrlc"
|
||||||
|
version = "3.4.5"
|
||||||
|
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||||
|
checksum = "90eeab0aa92f3f9b4e87f258c72b139c207d251f9cbc1080a0086b86a8870dd3"
|
||||||
|
dependencies = [
|
||||||
|
"nix",
|
||||||
|
"windows-sys 0.59.0",
|
||||||
|
]
|
||||||
|
|
||||||
[[package]]
|
[[package]]
|
||||||
name = "darling"
|
name = "darling"
|
||||||
version = "0.20.10"
|
version = "0.20.10"
|
||||||
|
@ -2078,6 +2088,18 @@ version = "0.1.0"
|
||||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||||
checksum = "e94e1e6445d314f972ff7395df2de295fe51b71821694f0b0e1e79c4f12c8577"
|
checksum = "e94e1e6445d314f972ff7395df2de295fe51b71821694f0b0e1e79c4f12c8577"
|
||||||
|
|
||||||
|
[[package]]
|
||||||
|
name = "nix"
|
||||||
|
version = "0.29.0"
|
||||||
|
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||||
|
checksum = "71e2746dc3a24dd78b3cfcb7be93368c6de9963d30f43a6a73998a9cf4b17b46"
|
||||||
|
dependencies = [
|
||||||
|
"bitflags",
|
||||||
|
"cfg-if",
|
||||||
|
"cfg_aliases",
|
||||||
|
"libc",
|
||||||
|
]
|
||||||
|
|
||||||
[[package]]
|
[[package]]
|
||||||
name = "num-bigint"
|
name = "num-bigint"
|
||||||
version = "0.4.6"
|
version = "0.4.6"
|
||||||
|
@ -4156,6 +4178,14 @@ dependencies = [
|
||||||
"tap",
|
"tap",
|
||||||
]
|
]
|
||||||
|
|
||||||
|
[[package]]
|
||||||
|
name = "xtask"
|
||||||
|
version = "0.1.0"
|
||||||
|
dependencies = [
|
||||||
|
"clap",
|
||||||
|
"ctrlc",
|
||||||
|
]
|
||||||
|
|
||||||
[[package]]
|
[[package]]
|
||||||
name = "yansi"
|
name = "yansi"
|
||||||
version = "1.0.1"
|
version = "1.0.1"
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
[workspace]
|
[workspace]
|
||||||
members = ["crates/backend", "crates/migration"]
|
members = ["crates/backend", "crates/migration", "crates/xtask"]
|
||||||
resolver = "3"
|
resolver = "3"
|
||||||
|
|
||||||
[workspace.package]
|
[workspace.package]
|
||||||
|
|
|
@ -1,52 +0,0 @@
|
||||||
# ---- Stage 1: Build (Static Linking) ----
|
|
||||||
FROM rust:latest as builder
|
|
||||||
|
|
||||||
WORKDIR /usr/src/app
|
|
||||||
|
|
||||||
# Install the musl target and musl-tools
|
|
||||||
RUN rustup target add x86_64-unknown-linux-musl
|
|
||||||
RUN apt-get update && apt-get install -y musl-tools
|
|
||||||
|
|
||||||
# Create a .cargo directory and configure for static linking with musl
|
|
||||||
RUN mkdir -p .cargo
|
|
||||||
RUN echo '[target.x86_64-unknown-linux-musl]' > .cargo/config.toml
|
|
||||||
RUN echo 'linker = "rust-lld"' >> .cargo/config.toml
|
|
||||||
|
|
||||||
# Copy configuration and lock files needed to resolve dependencies
|
|
||||||
COPY Cargo.toml ./Cargo.toml
|
|
||||||
COPY Cargo.lock ./Cargo.lock
|
|
||||||
COPY crates/backend/Cargo.toml crates/backend/Cargo.toml
|
|
||||||
COPY crates/migration/Cargo.toml crates/migration/Cargo.toml
|
|
||||||
|
|
||||||
# Fetch dependencies based on the lock file.
|
|
||||||
RUN cargo fetch
|
|
||||||
|
|
||||||
# Copy the actual source code for all workspace members
|
|
||||||
COPY crates/backend/ crates/backend/
|
|
||||||
COPY crates/migration/ crates/migration/
|
|
||||||
|
|
||||||
# Build the release binary for the musl target
|
|
||||||
RUN cargo build --release --target x86_64-unknown-linux-musl
|
|
||||||
|
|
||||||
# Debug: List the built binaries to verify what we have
|
|
||||||
RUN ls -la /usr/src/app/target/x86_64-unknown-linux-musl/release/
|
|
||||||
|
|
||||||
# ---- Stage 2: Runtime ----
|
|
||||||
FROM alpine:latest
|
|
||||||
|
|
||||||
# Install minimal runtime dependencies (ca-certificates is often needed)
|
|
||||||
RUN apk add --no-cache ca-certificates
|
|
||||||
|
|
||||||
WORKDIR /app
|
|
||||||
|
|
||||||
# Copy only the statically linked compiled binary from the builder stage
|
|
||||||
COPY --from=builder /usr/src/app/target/x86_64-unknown-linux-musl/release/backend /app/backend
|
|
||||||
|
|
||||||
# Verify the binary exists and is executable
|
|
||||||
RUN ls -la /app && chmod +x /app/backend
|
|
||||||
|
|
||||||
# Expose the port the application listens on
|
|
||||||
EXPOSE 8080
|
|
||||||
|
|
||||||
# Set the command to run the application
|
|
||||||
CMD ["/app/backend"]
|
|
|
@ -1,11 +0,0 @@
|
||||||
meta {
|
|
||||||
name: Logout User
|
|
||||||
type: http
|
|
||||||
seq: 5
|
|
||||||
}
|
|
||||||
|
|
||||||
post {
|
|
||||||
url: {{api_base}}/auth/logout
|
|
||||||
body: none
|
|
||||||
auth: inherit
|
|
||||||
}
|
|
|
@ -32,9 +32,6 @@ dotenvy = "0.15"
|
||||||
[dev-dependencies]
|
[dev-dependencies]
|
||||||
temp-env = "*"
|
temp-env = "*"
|
||||||
|
|
||||||
|
|
||||||
[features]
|
[features]
|
||||||
serve = []
|
serve = []
|
||||||
|
|
||||||
[[bin]]
|
|
||||||
name = "backend"
|
|
||||||
path = "src/main.rs"
|
|
||||||
|
|
|
@ -1,12 +1,12 @@
|
||||||
use actix_session::Session;
|
use actix_session::Session;
|
||||||
use actix_web::{
|
use actix_web::{
|
||||||
HttpRequest, HttpResponse, Responder, post,
|
post,
|
||||||
web::{self, ServiceConfig},
|
web::{self, ServiceConfig},
|
||||||
|
HttpResponse, Responder,
|
||||||
};
|
};
|
||||||
use log::debug;
|
|
||||||
use serde::Deserialize;
|
use serde::Deserialize;
|
||||||
|
|
||||||
use crate::{Database, error::ApiError};
|
use crate::{error::ApiError, Database};
|
||||||
|
|
||||||
#[derive(Deserialize)]
|
#[derive(Deserialize)]
|
||||||
struct LoginRequest {
|
struct LoginRequest {
|
||||||
|
@ -15,7 +15,7 @@ struct LoginRequest {
|
||||||
}
|
}
|
||||||
|
|
||||||
pub fn setup(cfg: &mut ServiceConfig) {
|
pub fn setup(cfg: &mut ServiceConfig) {
|
||||||
cfg.service(login).service(logout);
|
cfg.service(login);
|
||||||
}
|
}
|
||||||
|
|
||||||
#[post("/login")]
|
#[post("/login")]
|
||||||
|
@ -30,20 +30,7 @@ async fn login(
|
||||||
.verify_local_user(&login_request.username, &login_request.password)
|
.verify_local_user(&login_request.username, &login_request.password)
|
||||||
.await?;
|
.await?;
|
||||||
|
|
||||||
if session.get::<String>("user").is_ok() {
|
|
||||||
return Err(ApiError::AlreadyLoggedIn);
|
|
||||||
}
|
|
||||||
|
|
||||||
session.insert("user", user_id)?;
|
session.insert("user", user_id)?;
|
||||||
|
|
||||||
Ok(HttpResponse::Ok())
|
Ok(HttpResponse::Ok())
|
||||||
}
|
}
|
||||||
|
|
||||||
#[post("/logout")]
|
|
||||||
async fn logout(session: Session, request: HttpRequest) -> Result<impl Responder, ApiError> {
|
|
||||||
debug!("request cookies: {:?}", request.cookies());
|
|
||||||
debug!("Session entries: {:?}", session.entries());
|
|
||||||
session.purge();
|
|
||||||
debug!("Session entries after purge: {:?}", session.entries());
|
|
||||||
Ok(HttpResponse::Ok().body("Logged out successfully"))
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
use actix_web::{HttpResponse, ResponseError, cookie::time::error, http::StatusCode};
|
use actix_web::{cookie::time::error, http::StatusCode, HttpResponse, ResponseError};
|
||||||
use sea_orm::TransactionError;
|
use sea_orm::TransactionError;
|
||||||
use thiserror::Error;
|
use thiserror::Error;
|
||||||
|
|
||||||
|
@ -18,8 +18,6 @@ pub enum ApiError {
|
||||||
Argon2Error(String),
|
Argon2Error(String),
|
||||||
#[error("Session insert error: {0}")]
|
#[error("Session insert error: {0}")]
|
||||||
SessionInsertError(#[from] actix_session::SessionInsertError),
|
SessionInsertError(#[from] actix_session::SessionInsertError),
|
||||||
#[error("Already logged in")]
|
|
||||||
AlreadyLoggedIn,
|
|
||||||
}
|
}
|
||||||
|
|
||||||
impl ResponseError for ApiError {
|
impl ResponseError for ApiError {
|
||||||
|
@ -32,7 +30,6 @@ impl ResponseError for ApiError {
|
||||||
ApiError::ValidationError(..) => StatusCode::BAD_REQUEST,
|
ApiError::ValidationError(..) => StatusCode::BAD_REQUEST,
|
||||||
ApiError::Argon2Error(..) => StatusCode::INTERNAL_SERVER_ERROR,
|
ApiError::Argon2Error(..) => StatusCode::INTERNAL_SERVER_ERROR,
|
||||||
ApiError::SessionInsertError(..) => StatusCode::INTERNAL_SERVER_ERROR,
|
ApiError::SessionInsertError(..) => StatusCode::INTERNAL_SERVER_ERROR,
|
||||||
ApiError::AlreadyLoggedIn => StatusCode::BAD_REQUEST,
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,5 @@
|
||||||
use actix_files::NamedFile;
|
use actix_files::NamedFile;
|
||||||
use actix_session::Session;
|
|
||||||
use actix_session::{SessionMiddleware, storage::RedisSessionStore};
|
use actix_session::{SessionMiddleware, storage::RedisSessionStore};
|
||||||
use actix_web::cookie::SameSite;
|
|
||||||
use actix_web::{App, HttpResponse, HttpServer, cookie::Key, middleware::Logger, web};
|
use actix_web::{App, HttpResponse, HttpServer, cookie::Key, middleware::Logger, web};
|
||||||
use log::debug;
|
use log::debug;
|
||||||
|
|
||||||
|
@ -42,23 +40,14 @@ async fn main() -> std::io::Result<()> {
|
||||||
debug!("Secret Key {:?}", secret_key.master());
|
debug!("Secret Key {:?}", secret_key.master());
|
||||||
|
|
||||||
HttpServer::new(move || {
|
HttpServer::new(move || {
|
||||||
let session_middleware = SessionMiddleware::builder(redis_conn.clone(), secret_key.clone());
|
|
||||||
|
|
||||||
let session_middleware = if cfg!(debug_assertions) {
|
|
||||||
session_middleware.cookie_secure(false)
|
|
||||||
} else {
|
|
||||||
session_middleware
|
|
||||||
.cookie_same_site(SameSite::Strict)
|
|
||||||
.cookie_secure(true)
|
|
||||||
};
|
|
||||||
|
|
||||||
let session_middleware = session_middleware.build();
|
|
||||||
|
|
||||||
let app = App::new()
|
let app = App::new()
|
||||||
.app_data(web::Data::new(database.clone()))
|
.app_data(web::Data::new(database.clone()))
|
||||||
.app_data(web::Data::new(app_config.clone()))
|
.app_data(web::Data::new(app_config.clone()))
|
||||||
.wrap(Logger::default())
|
.wrap(Logger::default())
|
||||||
.wrap(session_middleware)
|
.wrap(SessionMiddleware::new(
|
||||||
|
redis_conn.clone(),
|
||||||
|
secret_key.clone(),
|
||||||
|
))
|
||||||
.service(web::scope("/api/v1").configure(controller::register_controllers));
|
.service(web::scope("/api/v1").configure(controller::register_controllers));
|
||||||
|
|
||||||
#[cfg(feature = "serve")]
|
#[cfg(feature = "serve")]
|
||||||
|
|
|
@ -52,26 +52,6 @@ services:
|
||||||
interval: 30s
|
interval: 30s
|
||||||
retries: 3
|
retries: 3
|
||||||
|
|
||||||
backend:
|
|
||||||
build:
|
|
||||||
context: .
|
|
||||||
dockerfile: ./backend.Dockerfile
|
|
||||||
image: peer-group-grading:latest
|
|
||||||
restart: unless-stopped
|
|
||||||
environment:
|
|
||||||
DB_NAME: ${DB_NAME}
|
|
||||||
DB_USER: ${DB_USER}
|
|
||||||
DB_PASSWORD: ${DB_PASSWORD}
|
|
||||||
DB_HOST: db
|
|
||||||
DB_PORT: 5432
|
|
||||||
REDIS_HOST: redis
|
|
||||||
REDIS_PORT: 6379
|
|
||||||
ports:
|
|
||||||
- "8080:8080"
|
|
||||||
depends_on:
|
|
||||||
- db
|
|
||||||
- redis
|
|
||||||
|
|
||||||
volumes:
|
volumes:
|
||||||
postgres_data:
|
postgres_data:
|
||||||
redis:
|
redis:
|
||||||
|
|
|
@ -1,28 +1,23 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { RouterLink, RouterView } from 'vue-router';
|
||||||
import HeaderNav from './components/HeaderNav.vue'
|
import HeaderNav from './components/HeaderNav.vue';
|
||||||
import SideBar from './components/SideBar.vue'
|
import { BoltIcon } from 'lucide-vue-next';
|
||||||
import { RouterLink, RouterView } from 'vue-router'
|
|
||||||
|
|
||||||
const isTeacher = ref(true)
|
const isTeacher = true;
|
||||||
const isLoggedIn = ref(true)
|
const isLoggedIn = true;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="sticky top-0">
|
<header class="sticky top-0 z-50 bg-black w-full">
|
||||||
<header>
|
<HeaderNav :isLoggedIn="isLoggedIn" :isTeacher="isTeacher">
|
||||||
<HeaderNav :isLoggedIn="isLoggedIn" :isTeacher="isTeacher">
|
<template #left-icon>
|
||||||
<template #left-icon>
|
<BoltIcon class="icon" />
|
||||||
<BoltIcon class="icon" />
|
</template>
|
||||||
<!--Hier dann ein richtiges Logo rein-->
|
</HeaderNav>
|
||||||
</template>
|
</header>
|
||||||
</HeaderNav>
|
<div id="app" class="flex flex-col min-h-screen overflow-x-hidden">
|
||||||
</header>
|
<main class="flex-grow p-4">
|
||||||
</div>
|
<RouterView />
|
||||||
<SideBar :isLoggedIn="isLoggedIn" :isTeacher="isTeacher" />
|
</main>
|
||||||
<div>
|
|
||||||
<RouterView />
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped></style>
|
|
||||||
|
|
|
@ -1,7 +1,10 @@
|
||||||
@import './base.css';
|
@import './base.css';
|
||||||
|
|
||||||
#app {
|
#app {
|
||||||
margin-left: 325px;
|
max-width: 1280px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 2rem;
|
||||||
|
font-weight: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
a,
|
a,
|
||||||
|
|
68
frontend/src/components/ClassBar.vue
Normal file
68
frontend/src/components/ClassBar.vue
Normal file
|
@ -0,0 +1,68 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import TieredMenu from 'primevue/tieredmenu';
|
||||||
|
|
||||||
|
|
||||||
|
import { ref } from "vue";
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
|
const items = ref([
|
||||||
|
{
|
||||||
|
label: 'HomeViw',
|
||||||
|
//icon: 'pi pi-home',
|
||||||
|
route: '/'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Student',
|
||||||
|
//icon: 'pi pi-graduation-cap',
|
||||||
|
route: '/Student'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Programmatic',
|
||||||
|
//icon: 'pi pi-link'
|
||||||
|
command: () => {
|
||||||
|
router.push('/introduction');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'External',
|
||||||
|
//icon: 'pi pi-home',
|
||||||
|
items: [
|
||||||
|
{
|
||||||
|
label: 'Vue.js',
|
||||||
|
url: 'https://vuejs.org/'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Vite.js',
|
||||||
|
url: 'https://vuejs.org/'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<main>
|
||||||
|
<div class="card flex justify-center">
|
||||||
|
<TieredMenu :model="items">
|
||||||
|
<template #item="{ item, props, hasSubmenu }">
|
||||||
|
<router-link v-if="item.route" v-slot="{ href, navigate }" :to="item.route" custom>
|
||||||
|
<a v-ripple :href="href" v-bind="props.action" @click="navigate">
|
||||||
|
<span :class="item.icon" />
|
||||||
|
<!--span class="ml-2">{{ item.label }}</span-->
|
||||||
|
</a>
|
||||||
|
</router-link>
|
||||||
|
<a v-else v-ripple :href="item.url" :target="item.target" v-bind="props.action">
|
||||||
|
<!--span :class="item.icon" /-->
|
||||||
|
<span class="ml-2">{{ item.label }}</span>
|
||||||
|
<span v-if="hasSubmenu" class="pi pi-angle-right ml-auto" />
|
||||||
|
</a>
|
||||||
|
</template>
|
||||||
|
</TieredMenu>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</template>
|
|
@ -1,31 +1,26 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { LogInIcon, LogOutIcon, BoltIcon } from 'lucide-vue-next'
|
|
||||||
|
|
||||||
defineProps<{
|
|
||||||
isLoggedIn: boolean
|
|
||||||
isTeacher: boolean
|
|
||||||
}>()
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<nav class="header-container">
|
<nav class="header-container">
|
||||||
<div class="left-icon">
|
<div class="left-icon">
|
||||||
<!-- Platzhalter für ein Icon -->
|
|
||||||
<slot name="left-icon"></slot>
|
<slot name="left-icon"></slot>
|
||||||
</div>
|
</div>
|
||||||
<div class="nav-items">
|
<div class="nav-items">
|
||||||
<button v-if="!isLoggedIn" class="nav-button">
|
<button
|
||||||
|
v-if="!isLoggedIn"
|
||||||
|
class="nav-button"
|
||||||
|
>
|
||||||
<component :is="LogInIcon" class="icon" />
|
<component :is="LogInIcon" class="icon" />
|
||||||
Login
|
Login
|
||||||
</button>
|
</button>
|
||||||
|
<template v-if="isLoggedIn">
|
||||||
<template v-else>
|
|
||||||
<button class="nav-button">
|
<button class="nav-button">
|
||||||
<component :is="LogOutIcon" class="icon" />
|
<component :is="LogOutIcon" class="icon" />
|
||||||
Logout
|
Logout
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<button v-if="isTeacher" class="nav-button">
|
<button
|
||||||
|
v-if="isTeacher"
|
||||||
|
class="nav-button"
|
||||||
|
>
|
||||||
<component :is="BoltIcon" class="icon" />
|
<component :is="BoltIcon" class="icon" />
|
||||||
Lehrerverwaltung
|
Lehrerverwaltung
|
||||||
</button>
|
</button>
|
||||||
|
@ -34,17 +29,35 @@ defineProps<{
|
||||||
</nav>
|
</nav>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { LogInIcon, LogOutIcon, BoltIcon } from 'lucide-vue-next';
|
||||||
|
|
||||||
|
defineProps<{
|
||||||
|
isLoggedIn: boolean;
|
||||||
|
isTeacher: boolean;
|
||||||
|
}>();
|
||||||
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.header-container {
|
.header-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left-icon {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav-items {
|
.nav-items {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 1rem;
|
gap: 1rem;
|
||||||
|
align-items: center;
|
||||||
|
margin-left: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav-button {
|
.nav-button {
|
||||||
|
@ -55,6 +68,7 @@ defineProps<{
|
||||||
border: none;
|
border: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
.icon {
|
.icon {
|
||||||
|
|
|
@ -1,80 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="card">
|
|
||||||
<Menubar :model="items">
|
|
||||||
<template #item="{ item, props, hasSubmenu }">
|
|
||||||
<router-link v-if="item.route" v-slot="{ href, navigate }" :to="item.route" custom>
|
|
||||||
<a v-ripple :href="href" v-bind="props.action" @click="navigate">
|
|
||||||
<span :class="item.icon" />
|
|
||||||
<span>{{ item.label }}</span>
|
|
||||||
</a>
|
|
||||||
</router-link>
|
|
||||||
<a v-else v-ripple :href="item.url" :target="item.target" v-bind="props.action">
|
|
||||||
<span :class="item.icon" />
|
|
||||||
<span> n/A {{ item.label }}</span>
|
|
||||||
<span v-if="hasSubmenu" class="pi pi-fw pi-angle-down" />
|
|
||||||
</a>
|
|
||||||
</template>
|
|
||||||
</Menubar>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import Menubar from 'primevue/menubar';
|
|
||||||
|
|
||||||
import { ref } from "vue";
|
|
||||||
import { useRouter } from 'vue-router';
|
|
||||||
|
|
||||||
const items = ref([
|
|
||||||
{
|
|
||||||
label: 'Home',
|
|
||||||
icon: 'pi pi-home',
|
|
||||||
route: '/'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Student',
|
|
||||||
icon: 'pi pi-graduation-cap',
|
|
||||||
route: '/Student'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Login',
|
|
||||||
icon: 'pi pi-graduation-cap',
|
|
||||||
route: '/Login'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Projects',
|
|
||||||
icon: 'pi pi-search',
|
|
||||||
items: [
|
|
||||||
{
|
|
||||||
label: 'Components',
|
|
||||||
icon: 'pi pi-bolt'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Blocks',
|
|
||||||
icon: 'pi pi-server'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'UI Kit',
|
|
||||||
icon: 'pi pi-pencil'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Templates',
|
|
||||||
icon: 'pi pi-palette',
|
|
||||||
items: [
|
|
||||||
{
|
|
||||||
label: 'Apollo',
|
|
||||||
icon: 'pi pi-palette'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Ultima',
|
|
||||||
icon: 'pi pi-palette'
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Contact',
|
|
||||||
icon: 'pi pi-envelope'
|
|
||||||
}
|
|
||||||
]);
|
|
||||||
</script>
|
|
|
@ -1,55 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import Drawer from 'primevue/drawer'
|
|
||||||
import { ref } from 'vue'
|
|
||||||
import { useClassStore } from '@/stores/classStore'
|
|
||||||
import router from '@/router'
|
|
||||||
|
|
||||||
const store = useClassStore()
|
|
||||||
|
|
||||||
store.loadClasses()
|
|
||||||
|
|
||||||
defineProps<{
|
|
||||||
isLoggedIn: boolean
|
|
||||||
isTeacher: boolean
|
|
||||||
}>()
|
|
||||||
|
|
||||||
var elements = store.classInfoList
|
|
||||||
var visible = ref(true)
|
|
||||||
var closeIcon = ref(false)
|
|
||||||
|
|
||||||
function setClass(input: number) {
|
|
||||||
store.setActiveClass(input)
|
|
||||||
router.push({ name: 'about' })
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<Drawer
|
|
||||||
v-model:visible="visible"
|
|
||||||
:showCloseIcon="closeIcon"
|
|
||||||
:modal="false"
|
|
||||||
:dismissable="false"
|
|
||||||
v-on:hide="visible = true"
|
|
||||||
header="Sidebar"
|
|
||||||
v-if="isLoggedIn"
|
|
||||||
>
|
|
||||||
<h1 v-if="store.classInfo != null">{{ store.classInfo.name }}</h1>
|
|
||||||
<div v-if="isTeacher">
|
|
||||||
<ul>
|
|
||||||
<li v-for="item in elements">
|
|
||||||
<p href="/about" @click="setClass(item.id)">{{ item.name }}</p>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<a href="/about">Offene/Abgegebene Evaluaionsbögen</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="/about">Notenübersicht</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</Drawer>
|
|
||||||
</template>
|
|
|
@ -1,23 +1,25 @@
|
||||||
import './assets/main.css'
|
import './assets/main.css'
|
||||||
|
|
||||||
|
|
||||||
import { createApp } from 'vue'
|
import { createApp } from 'vue'
|
||||||
import { createPinia } from 'pinia'
|
import { createPinia } from 'pinia'
|
||||||
import PrimeVue from 'primevue/config'
|
import PrimeVue from 'primevue/config'
|
||||||
import Aura from '@primeuix/themes/aura'
|
import Aura from '@primeuix/themes/aura'
|
||||||
import Ripple from 'primevue/ripple'
|
import Ripple from 'primevue/ripple'
|
||||||
import ToastService from 'primevue/toastservice';
|
import ToastService from 'primevue/toastservice';
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
import App from './App.vue'
|
import App from './App.vue'
|
||||||
import router from './router'
|
import router from './router'
|
||||||
|
|
||||||
const app = createApp(App)
|
const app = createApp(App)
|
||||||
const pinia = createPinia()
|
|
||||||
|
|
||||||
app.use(PrimeVue, {
|
app.use(PrimeVue, {
|
||||||
theme: {
|
theme: {
|
||||||
preset: Aura,
|
preset: Aura,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
app.use(pinia)
|
|
||||||
app.use(ToastService);
|
app.use(ToastService);
|
||||||
app.use(createPinia())
|
app.use(createPinia())
|
||||||
app.use(router)
|
app.use(router)
|
||||||
|
|
|
@ -1,39 +0,0 @@
|
||||||
import { ref, computed } from 'vue'
|
|
||||||
import { defineStore } from 'pinia'
|
|
||||||
interface State {
|
|
||||||
classInfoList: ClassInfo[]
|
|
||||||
classInfo: ClassInfo | null
|
|
||||||
}
|
|
||||||
|
|
||||||
export const useClassStore = defineStore('class', {
|
|
||||||
state: (): State => {
|
|
||||||
return {
|
|
||||||
classInfoList: [],
|
|
||||||
classInfo: null,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
actions: {
|
|
||||||
loadClasses() {
|
|
||||||
/* Beispieldaten */
|
|
||||||
if (this.classInfoList.length < 1) {
|
|
||||||
this.classInfoList.push({ name: 'Steve', id: 1 })
|
|
||||||
this.classInfoList.push({ name: 'Garett', id: 2 })
|
|
||||||
this.classInfoList.push({ name: 'Natalie', id: 3 })
|
|
||||||
this.classInfoList.push({ name: 'Henry', id: 4 })
|
|
||||||
this.classInfoList.push({ name: 'Dawn', id: 5 })
|
|
||||||
}
|
|
||||||
},
|
|
||||||
setActiveClass(id: number) {
|
|
||||||
this.classInfoList.map((item) => {
|
|
||||||
if (item.id == id) {
|
|
||||||
this.classInfo = item
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
interface ClassInfo {
|
|
||||||
name: string
|
|
||||||
id: number
|
|
||||||
}
|
|
|
@ -1,12 +1,15 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { useClassStore } from '@/stores/classStore'
|
|
||||||
|
|
||||||
const store = useClassStore()
|
|
||||||
</script>
|
|
||||||
<template>
|
<template>
|
||||||
<div class="about">
|
<div class="about">
|
||||||
<h1>This is an about page</h1>
|
<h1>This is an about page</h1>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style></style>
|
<style>
|
||||||
|
@media (min-width: 1024px) {
|
||||||
|
.about {
|
||||||
|
min-height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
|
@ -16,6 +16,8 @@
|
||||||
</FormField>
|
</FormField>
|
||||||
<Button type="submit" severity="secondary" label="Submit" />
|
<Button type="submit" severity="secondary" label="Submit" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</Form>
|
</Form>
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
<Checkbox v-model="remember" inputId="rememberme" binary/>
|
<Checkbox v-model="remember" inputId="rememberme" binary/>
|
||||||
|
@ -56,6 +58,8 @@
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
@media (min-width: 1024px) {
|
@media (min-width: 1024px) {
|
||||||
.about {
|
.about {
|
||||||
|
|
Loading…
Add table
Reference in a new issue