torsten/yourpart3
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

added login, first preparation for menu

Browse Source
This commit is contained in:
Torsten Schulz
2024-07-21 13:09:56 +02:00
parent bbf4a2deb3
commit 597761cb15
10 changed files with 391 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
backend/app.js
View File

@@ -3,6 +3,7 @@ import path from 'path';
import { fileURLToPath } from 'url';
import chatRouter from './routers/chatRouter.js';
import authRouter from './routers/authRouter.js';
import navigationRouter from './routers/navigationRouter.js'
import cors from 'cors';
const __filename = fileURLToPath(import.meta.url);
@@ -15,10 +16,11 @@ app.use(express.json()); // To handle JSON request bodies
app.use('/api/chat', chatRouter);
app.use('/api/auth', authRouter);
app.use('/api/navigation', navigationRouter);
app.use('/images', express.static(path.join(__dirname, '../frontend/public/images')));
app.get('*', (req, res) => {
res.sendFile(path.join(__dirname, '../frontend/dist/index.html'));
app.use((req, res) => {
res.status(404).send('404 Not Found');
});
export default app;

82
backend/controllers/authController.js
View File

@@ -1,40 +1,11 @@
import bcrypt from 'bcrypt';
import { v4 as uuidv4 } from 'uuid';
import User from '../models/community/user.js';
import UserParam from '../models/community/user_param.js';
import UserParamType from '../models/type/user_param.js';
import { sendAccountActivationEmail, sendPasswordResetEmail } from '../services/emailService.js';
import i18n from '../utils/i18n.js';
const saltRounds = 10;
import * as userService from '../services/authService.js';
export const register = async (req, res) => {
const { email, username, password, language } = req.body;
try {
const hashedPassword = await bcrypt.hash(password, saltRounds);
const resetToken = uuidv4();
const user = await User.create({
email,
username,
password: hashedPassword,
resetToken: resetToken,
active: false,
registration_date: new Date()
});
const languageType = await UserParamType.findOne({ where: { description: 'language' } });
if (!languageType) {
return res.status(500).json({ error: 'Language type not found' });
}
console.log(user.id, languageType.id);
await UserParam.create({
userId: user.id,
paramTypeId: languageType.id,
value: language
});
const activationLink = `${process.env.FRONTEND_URL}/activate?token=${resetToken}`;
await sendAccountActivationEmail(email, activationLink, username, resetToken, language);
res.status(201).json({ id: user.hashedId, username: user.username, active: user.active });
const result = await userService.registerUser({ email, username, password, language });
res.status(201).json(result);
} catch (error) {
console.log(error);
res.status(500).json({ error: error.message });
@@ -42,56 +13,33 @@ export const register = async (req, res) => {
};
export const login = async (req, res) => {
const { email, password } = req.body;
const { username, password } = req.body;
try {
const user = await User.findOne({ where: { email } });
if (!user) {
return res.status(401).json({ error: 'Invalid email or password' });
}
if (!user.active) {
return res.status(403).json({ error: 'Account not activated' });
}
const match = await bcrypt.compare(password, user.password);
if (!match) {
return res.status(401).json({ error: 'Invalid email or password' });
}
res.status(200).json({ id: user.hashed_id, username: user.username });
const result = await userService.loginUser({ username, password });
res.status(200).json(result);
} catch (error) {
res.status(500).json({ error: 'Error logging in' });
res.status(500).json({ error: error.message });
}
};
export const forgotPassword = async (req, res) => {
const { email } = req.body;
try {
const user = await User.findOne({ where: { email } });
if (!user) {
return res.status(404).json({ error: 'Email not found' });
}
const resetToken = uuidv4();
const resetLink = `${process.env.FRONTEND_URL}/reset-password?token=${resetToken}`;
await user.update({ reset_token: resetToken });
const languageParam = await UserParam.findOne({ where: { user_id: user.id, param_type_id: languageType.id } });
const userLanguage = languageParam ? languageParam.value : 'en';
await sendPasswordResetEmail(email, resetLink, userLanguage);
res.status(200).json({ message: 'Password reset email sent' });
const result = await userService.handleForgotPassword({ email });
res.status(200).json(result);
} catch (error) {
res.status(500).json({ error: 'Error processing forgot password' });
res.status(500).json({ error: error.message });
}
};
export const activateAccount = async (req, res) => {
const { token } = req.body;
try {
const user = await User.findOne({ where: { reset_token: token } });
if (!user) {
return res.status(404).json({ error: 'Invalid token' });
}
await user.update({ active: true, reset_token: null });
res.status(200).json({ message: 'Account activated' });
const result = await userService.activateUserAccount({ token });
res.status(200).json(result);
} catch (error) {
res.status(500).json({ error: 'Error activating account' });
res.status(500).json({ error: error.message });
}
};

208
backend/controllers/navigationController.js Normal file
View File

@@ -0,0 +1,208 @@
const menuStructure = {
home: {
visible: ["all"],
children: {},
path: "/"
},
friends: {
visible: ["all"],
children: {
manageFriends : {
visible: ["all"],
path: "/socialnetwork/friends"
}
},
showLoggedinFriends: 1
},
socialnetwork: {
visible: ["all"],
children: {
guestbook: {
visible: ["all"],
path: "/socialnetwork/guestbook"
},
usersearch: {
visible: ["all"],
path: "/socialnetwork/search"
},
forum: {
visible: ["all"],
path: "/socialnetwork/forum",
showForums: 1
},
gallery: {
visible: ["all"],
path: "/socialnetwork/gallery"
},
blockedUsers: {
visible: ["all"],
path: "/socialnetwork/blocked"
},
oneTimeInvitation: {
visible: ["all"],
path: "/socialnetwork/onetimeinvitation"
},
diary: {
visible: ["all"],
path: "/socialnetwork/diary"
}
}
},
chats: {
visible: ["all"],
children: {
multiChat: {
visible: ["over12"],
action: "openMultiChat"
},
randomChat: {
visible: ["over12"],
action: "openRanomChat"
}
}
},
falukant: {
visible: ["all"],
children: {
create: {
visible: ["nofalukantaccount"],
path: "/falukant/create"
},
overview: {
visible: ["hasfalukantaccount"],
path: "/falukant/home"
},
towns: {
visible: ["hasfalukantaccount"],
path: "/falukant/towns"
},
directors: {
visible: ["hasfalukantaccount"],
path: "/falukant/directors"
},
factory: {
visible: ["hasfalukantaccount"],
path: "/falukant/factory"
},
family: {
visible: ["hasfalukantaccount"],
path: "/falukant/family"
},
house: {
visible: ["hasfalukantaccount"],
path: "/falukant/house"
},
nobility: {
visible: ["hasfalukantaccount"],
path: "/falukant/nobility"
},
politics: {
visible: ["hasfalukantaccount"],
path: "/falukant/politics"
},
education: {
visible: ["hasfalukantaccount"],
path: "/falukant/education"
},
bank: {
visible: ["hasfalukantaccount"],
path: "/falukant/bank"
},
darknet: {
visible: ["hasfalukantaccount"],
path: "/falukant/darknet"
},
reputation: {
visible: ["hasfalukantaccount"],
path: "/falukant/reputation"
},
moneyhistory: {
visible: ["hasfalukantaccount"],
path: "/falukant/moneyhistory"
}
}
},
minigames: {
visible: ["all"],
},
settings: {
visible: ["all"],
children: {
homepage: {
visible: ["all"],
path: "/settings/homepage"
},
account: {
visible: ["all"],
path: "/settings/account"
},
personal: {
visible: ["all"],
path: "/settings/account"
},
view: {
visible: ["all"],
path: "/settings/account"
},
interrests: {
visible: ["all"],
path: "/settings/interrests"
},
sexuality: {
visible: ["over14"],
path: "/setting/sexuality"
},
notifications: {
visible: ["all"],
path: "/settings/notifications"
}
}
},
administration: {
visible: ["anyadmin"],
children: {
contactrequests: {
visible: ["mainadmin", "contactrequests"],
path: "/admin/contacts"
},
useradministration: {
visible: ["mainadmin", "useradministration"],
path: "/admin/users"
},
forum: {
visible: ["mainadmin", "forum"],
path: "/admin/forum"
},
userrights: {
visible: ["mainadmin", "rights"],
path: "/admin/rights"
},
interrests: {
visible: ["mainadmin", "interrests"],
path: "/admin/interrests"
},
falukant: {
visible: ["mainadmin", "falukant"],
children: {
logentries: {
visible: ["mainadmin", "falukant"],
path: "/admin/falukant/logentries"
},
edituser: {
visible: ["mainadmin", "falukant"],
path: "/admin/falukant/edituser"
},
database: {
visible: ["mainadmin", "falukant"],
path: "/admin/falukant/database"
},
}
}
}
}
};
export const menu = async (req, res) => {
const { userid } = req.params;
res.status(200).json({ userId: userid });
}

3
backend/models/community/user.js
View File

@@ -19,9 +19,6 @@ const User = sequelize.define('user', {
password: {
type: DataTypes.STRING,
allowNull: false,
set(value) {
this.setDataValue('password', bcrypt.hashSync(value, 10));
}
},
registrationDate: {
type: DataTypes.DATE,

7
backend/routers/navigationRouter.js Normal file
View File

@@ -0,0 +1,7 @@
import { Router } from 'express';
import { menu } from '../controllers/navigationController.js';
const router = Router();
router.get('/:userid', menu);
export default router;

78
backend/services/authService.js Normal file
View File

@@ -0,0 +1,78 @@
import bcrypt from 'bcrypt';
import { v4 as uuidv4 } from 'uuid';
import User from '../models/community/user.js';
import UserParam from '../models/community/user_param.js';
import UserParamType from '../models/type/user_param.js';
import { sendAccountActivationEmail, sendPasswordResetEmail } from './emailService.js';
const saltRounds = 10;
export const registerUser = async ({ email, username, password, language }) => {
const hashedPassword = await bcrypt.hash(password, saltRounds);
const resetToken = uuidv4();
const user = await User.create({
email,
username,
password: hashedPassword,
resetToken: resetToken,
active: false,
registration_date: new Date()
});
const languageType = await UserParamType.findOne({ where: { description: 'language' } });
if (!languageType) {
throw new Error('Language type not found');
}
await UserParam.create({
userId: user.id,
paramTypeId: languageType.id,
value: language
});
const activationLink = `${process.env.FRONTEND_URL}/activate?token=${resetToken}`;
await sendAccountActivationEmail(email, activationLink, username, resetToken, language);
return { id: user.hashedId, username: user.username, active: user.active };
};
export const loginUser = async ({ username, password }) => {
console.log('check login');
const user = await User.findOne({ where: { username } });
if (!user) {
throw new Error('credentialsinvalid');
}
const match = await bcrypt.compare(password, user.password);
if (!match) {
throw new Error('credentialsinvalid');
}
return { id: user.hashedId, username: user.username, active: user.active };
};
export const handleForgotPassword = async ({ email }) => {
const user = await User.findOne({ where: { email } });
if (!user) {
throw new Error('Email not found');
}
const resetToken = uuidv4();
const resetLink = `${process.env.FRONTEND_URL}/reset-password?token=${resetToken}`;
await user.update({ reset_token: resetToken });
const languageParam = await UserParam.findOne({ where: { user_id: user.id, param_type_id: languageType.id } });
const userLanguage = languageParam ? languageParam.value : 'en';
await sendPasswordResetEmail(email, resetLink, userLanguage);
return { message: 'Password reset email sent' };
};
export const activateUserAccount = async ({ token }) => {
const user = await User.findOne({ where: { reset_token: token } });
if (!user) {
throw new Error('Invalid token');
}
await user.update({ active: true, reset_token: null });
return { message: 'Account activated' };
};

26
frontend/src/components/AppNavigation.vue
View File

@@ -1,7 +1,7 @@
<template>
<nav>
<ul>
<li v-for="item in menuItems" :key="item.text">
<li v-for="item in menu" :key="item.text">
<a href="#">{{ $t(`navigation.${item.text}`) }}</a>
<ul v-if="item.submenu">
<li v-for="subitem in item.submenu" :key="subitem.text">
@@ -18,16 +18,17 @@
</template>
<script>
import { mapGetters } from 'vuex';
export default {
name: 'AppNavigation',
data() {
return {
menuItems: [
{ text: 'home' },
{ text: 'about', submenu: [{ text: 'team' }, { text: 'company' }] },
{ text: 'services', submenu: [{ text: 'consulting' }, { text: 'development' }] }
]
};
computed: {
...mapGetters('menu'),
},
created() {
if(this.$store.getters.hashedId) {
this.$store.dispatch('loadMenu');
}
},
methods: {
accessMailbox() {
@@ -43,11 +44,12 @@ export default {
<style lang="scss" scoped>
@import '../assets/styles.scss';
nav,
nav > ul{
display: flex;
justify-content: space-between;
background-color: #343a40;
color: white;
background-color: #F9A22C;
color: #000000;
padding: 10px;
flex-direction: row;
}
@@ -59,7 +61,7 @@ li {
margin: 5px 0;
}
a {
color: white;
color: #000000;
text-decoration: none;
}
.right-block {

27
frontend/src/store/index.js
View File

@@ -1,11 +1,13 @@
import { createStore } from 'vuex';
import dialogs from './modules/dialogs';
import loadMenu from '../utils/menuLoader.js';
const store = createStore({
state: {
isLoggedIn: false,
user: null,
language: navigator.language.startsWith('de') ? 'de' : 'en',
menu: [],
},
mutations: {
dologin(state, user) {
@@ -13,6 +15,7 @@ const store = createStore({
state.user = user;
localStorage.setItem('isLoggedIn', 'true');
localStorage.setItem('user', JSON.stringify(user));
console.log(state.user);
},
dologout(state) {
state.isLoggedIn = false;
@@ -25,7 +28,7 @@ const store = createStore({
let userData = {};
try {
userData = localStorage.getItem('user') ? JSON.parse(localStorage.getItem('user')) : {};
} catch(e) {
} catch (e) {
}
const user = userData;
@@ -34,11 +37,16 @@ const store = createStore({
},
setLanguage(state, language) {
state.language = language;
},
setMenu(state, menu) {
state.menu = menu;
}
},
actions: {
login({ commit }, user) {
async login({ commit, dispatch }, user) { // Dispatch hinzufügen
commit('dologin', user);
await dispatch('loadMenu'); // Korrekte Verwendung von dispatch
dispatch('startMenuReload');
},
logout({ commit }) {
commit('dologout');
@@ -49,11 +57,26 @@ const store = createStore({
setLanguage({ commit }, language) {
commit('setLanguage', language);
},
async loadMenu({ commit }) {
try {
const menu = await loadMenu();
commit('setMenu', menu);
} catch (err) {
console.error(err);
commit('setMenu', []);
}
},
startMenuReload({ dispatch }) {
setInterval(() => {
dispatch('loadMenu');
}, 5000);
},
},
getters: {
isLoggedIn: state => state.isLoggedIn,
user: state => state.user,
language: state => state.language,
menu: state => state.menu,
},
modules: {
dialogs,

19
frontend/src/utils/menuLoader.js Normal file
View File

@@ -0,0 +1,19 @@
import axios from 'axios';
import store from '../store';
const loadMenu = async () => {
try {
console.log(store.getters.user);
const userId = store.getters.user ? store.getters.user.id : null;
if (!userId) {
throw new Error('User ID not found');
}
const response = await axios.get('/api/navigation/' + userId);
return response.data;
} catch (err) {
console.error(err);
return [];
}
};
export default loadMenu;

33
frontend/src/views/home/NoLoginView.vue
View File

@@ -11,30 +11,24 @@
<div>
<div>
<div>
<input data-object-name="user-name" size="20" type="text"
<input v-model="username" size="20" type="text"
:placeholder="$t('home.nologin.login.name')"
:title="$t('home.nologin.login.namedescription')">
</div>
<div>
<input data-object-name="password" size="20" type="password"
<input v-model="password" size="20" type="password"
:placeholder="$t('home.nologin.login.password')"
:title="$t('home.nologin.login.passworddescription')">
</div>
<div>
<label id="o1p5irxv" name="o1p5irxv" class="Wt-valid" title=""><input id="ino1p5irxv"
data-object-name="remember-me" name="ino1p5irxv" type="checkbox"
onchange="var e=event||window.event,o=this;Wt._p_.update(o,'s53',e,true);"><span
id="to1p5irxv" name="to1p5irxv" style="white-space:normal;">Eingeloggt bleiben</span></label>
<label><input type="checkbox"><span>Eingeloggt bleiben</span></label>
</div>
</div>
<div class="Wt-buttons">
<button id="o1p5irxz" data-object-name="login" type="button"
onclick="var e=event||window.event,o=this;if(o.classList.contains('Wt-disabled')){Wt4_9_1.cancelEvent(e);return;}Wt._p_.update(o,'s56',e,true);"
class="Wt-btn with-label">Einloggen</button>
<div>
<button type="button" @click="doLogin">Einloggen</button>
</div>
<div class="Wt-buttons">
<span id="o1p5iry0" data-object-name="lost-password" @click="openPasswordResetDialog"
class="link">{{
<div>
<span @click="openPasswordResetDialog" class="link">{{
$t('home.nologin.login.lostpassword') }}</span> | <span id="o1p5iry1"
@click="openRegisterDialog" class="link">{{ $t('home.nologin.login.register') }}</span>
</div>
@@ -51,15 +45,24 @@
import RandomChatDialog from '@/dialogues/chat/RandomChatDialog.vue';
import RegisterDialog from '@/dialogues/auth/RegisterDialog.vue';
import PasswordResetDialog from '@/dialogues/auth/PasswordResetDialog.vue';
import apiClient from '@/utils/axios.js';
import { mapActions } from 'vuex';
export default {
name: 'HomeNoLoginView',
data() {
return {
username: '',
password: '',
};
},
components: {
RandomChatDialog,
RegisterDialog,
PasswordResetDialog,
},
methods: {
...mapActions(['login']),
openRandomChat() {
this.$refs.randomChatDialog.open();
},
@@ -68,6 +71,10 @@ export default {
},
openPasswordResetDialog() {
this.$refs.passwordResetDialog.open();
},
async doLogin() {
const response = await apiClient.post('/api/auth/login', { username: this.username, password: this.password });
this.login(response.data);
}
}
};