Add auth service
This commit is contained in:
parent
8ec7ffcaf7
commit
ae609c034b
12 changed files with 184 additions and 49 deletions
62
frontend/package-lock.json
generated
62
frontend/package-lock.json
generated
|
@ -1382,6 +1382,11 @@
|
||||||
"@types/node": "*"
|
"@types/node": "*"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"@types/cookie": {
|
||||||
|
"version": "0.3.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.3.3.tgz",
|
||||||
|
"integrity": "sha512-LKVP3cgXBT9RYj+t+9FDKwS5tdI+rPBXaNSkma7hvqy35lc7mAokC2zsqWJH0LaqIt3B962nuYI77hsJoT1gow=="
|
||||||
|
},
|
||||||
"@types/express": {
|
"@types/express": {
|
||||||
"version": "4.17.11",
|
"version": "4.17.11",
|
||||||
"resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.11.tgz",
|
"resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.11.tgz",
|
||||||
|
@ -3103,6 +3108,14 @@
|
||||||
"integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==",
|
"integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"axios": {
|
||||||
|
"version": "0.21.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz",
|
||||||
|
"integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==",
|
||||||
|
"requires": {
|
||||||
|
"follow-redirects": "^1.10.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"babel-code-frame": {
|
"babel-code-frame": {
|
||||||
"version": "6.26.0",
|
"version": "6.26.0",
|
||||||
"resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
|
"resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
|
||||||
|
@ -4563,8 +4576,7 @@
|
||||||
"cookie": {
|
"cookie": {
|
||||||
"version": "0.4.0",
|
"version": "0.4.0",
|
||||||
"resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.0.tgz",
|
"resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.0.tgz",
|
||||||
"integrity": "sha512-+Hp8fLp57wnUSt0tY0tHEXh4voZRDnoIrZPqlo3DPiI4y9lwg/jqx+1Om94/W6ZaPDOUbnjOt/99w66zk+l1Xg==",
|
"integrity": "sha512-+Hp8fLp57wnUSt0tY0tHEXh4voZRDnoIrZPqlo3DPiI4y9lwg/jqx+1Om94/W6ZaPDOUbnjOt/99w66zk+l1Xg=="
|
||||||
"dev": true
|
|
||||||
},
|
},
|
||||||
"cookie-signature": {
|
"cookie-signature": {
|
||||||
"version": "1.0.6",
|
"version": "1.0.6",
|
||||||
|
@ -7238,8 +7250,7 @@
|
||||||
"follow-redirects": {
|
"follow-redirects": {
|
||||||
"version": "1.13.3",
|
"version": "1.13.3",
|
||||||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.13.3.tgz",
|
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.13.3.tgz",
|
||||||
"integrity": "sha512-DUgl6+HDzB0iEptNQEXLx/KhTmDb8tZUHSeLqpnjpknR70H0nC2t9N73BK6fN4hOvJ84pKlIQVQ4k5FFlBedKA==",
|
"integrity": "sha512-DUgl6+HDzB0iEptNQEXLx/KhTmDb8tZUHSeLqpnjpknR70H0nC2t9N73BK6fN4hOvJ84pKlIQVQ4k5FFlBedKA=="
|
||||||
"dev": true
|
|
||||||
},
|
},
|
||||||
"for-in": {
|
"for-in": {
|
||||||
"version": "1.0.2",
|
"version": "1.0.2",
|
||||||
|
@ -13088,6 +13099,18 @@
|
||||||
"tough-cookie": "~2.5.0",
|
"tough-cookie": "~2.5.0",
|
||||||
"tunnel-agent": "^0.6.0",
|
"tunnel-agent": "^0.6.0",
|
||||||
"uuid": "^3.3.2"
|
"uuid": "^3.3.2"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"tough-cookie": {
|
||||||
|
"version": "2.5.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.5.0.tgz",
|
||||||
|
"integrity": "sha512-nlLsUzgm1kfLXSXfRZMc1KLAugd4hqJHDTvc2hDIwS3mZAfMEuMbc03SujMF+GEcpaX/qboeycw6iO8JwVv2+g==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"psl": "^1.1.28",
|
||||||
|
"punycode": "^2.1.1"
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"request-progress": {
|
"request-progress": {
|
||||||
|
@ -13117,6 +13140,18 @@
|
||||||
"request-promise-core": "1.1.4",
|
"request-promise-core": "1.1.4",
|
||||||
"stealthy-require": "^1.1.1",
|
"stealthy-require": "^1.1.1",
|
||||||
"tough-cookie": "^2.3.3"
|
"tough-cookie": "^2.3.3"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"tough-cookie": {
|
||||||
|
"version": "2.5.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.5.0.tgz",
|
||||||
|
"integrity": "sha512-nlLsUzgm1kfLXSXfRZMc1KLAugd4hqJHDTvc2hDIwS3mZAfMEuMbc03SujMF+GEcpaX/qboeycw6iO8JwVv2+g==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"psl": "^1.1.28",
|
||||||
|
"punycode": "^2.1.1"
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"require-directory": {
|
"require-directory": {
|
||||||
|
@ -14683,16 +14718,6 @@
|
||||||
"integrity": "sha1-riF2gXXRVZ1IvvNUILL0li8JwzA=",
|
"integrity": "sha1-riF2gXXRVZ1IvvNUILL0li8JwzA=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"tough-cookie": {
|
|
||||||
"version": "2.5.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.5.0.tgz",
|
|
||||||
"integrity": "sha512-nlLsUzgm1kfLXSXfRZMc1KLAugd4hqJHDTvc2hDIwS3mZAfMEuMbc03SujMF+GEcpaX/qboeycw6iO8JwVv2+g==",
|
|
||||||
"dev": true,
|
|
||||||
"requires": {
|
|
||||||
"psl": "^1.1.28",
|
|
||||||
"punycode": "^2.1.1"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"tr46": {
|
"tr46": {
|
||||||
"version": "1.0.1",
|
"version": "1.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/tr46/-/tr46-1.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/tr46/-/tr46-1.0.1.tgz",
|
||||||
|
@ -15024,6 +15049,15 @@
|
||||||
"imurmurhash": "^0.1.4"
|
"imurmurhash": "^0.1.4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"universal-cookie": {
|
||||||
|
"version": "4.0.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/universal-cookie/-/universal-cookie-4.0.4.tgz",
|
||||||
|
"integrity": "sha512-lbRVHoOMtItjWbM7TwDLdl8wug7izB0tq3/YVKhT/ahB4VDvWMyvnADfnJI8y6fSvsjh51Ix7lTGC6Tn4rMPhw==",
|
||||||
|
"requires": {
|
||||||
|
"@types/cookie": "^0.3.3",
|
||||||
|
"cookie": "^0.4.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"universalify": {
|
"universalify": {
|
||||||
"version": "0.1.2",
|
"version": "0.1.2",
|
||||||
"resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
|
"resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
|
||||||
|
|
|
@ -10,8 +10,10 @@
|
||||||
"lint": "vue-cli-service lint"
|
"lint": "vue-cli-service lint"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"axios": "^0.21.1",
|
||||||
"core-js": "^3.6.5",
|
"core-js": "^3.6.5",
|
||||||
"register-service-worker": "^1.7.1",
|
"register-service-worker": "^1.7.1",
|
||||||
|
"universal-cookie": "^4.0.4",
|
||||||
"vue": "^2.6.11",
|
"vue": "^2.6.11",
|
||||||
"vue-router": "^3.2.0",
|
"vue-router": "^3.2.0",
|
||||||
"vuetify": "^2.4.0",
|
"vuetify": "^2.4.0",
|
||||||
|
|
25
frontend/src/api/login.ts
Normal file
25
frontend/src/api/login.ts
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
import axios, { AxiosResponse } from 'axios';
|
||||||
|
import Cookies from 'universal-cookie';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
register: async (email: string, password: string, symbol: string): Promise<AxiosResponse> => {
|
||||||
|
const cookies = new Cookies();
|
||||||
|
const response = await axios({
|
||||||
|
method: 'post',
|
||||||
|
url: 'http://localhost:8000/api/login',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
'X-CSRFToken': cookies.get('csrf-token'),
|
||||||
|
},
|
||||||
|
data: {
|
||||||
|
loginName: email,
|
||||||
|
Password: password,
|
||||||
|
Symbol: symbol,
|
||||||
|
diaryUrl: 'http://cufs.fakelog.cf/',
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
document.cookie = response.headers['Set-Cookie'];
|
||||||
|
return response;
|
||||||
|
},
|
||||||
|
};
|
49
frontend/src/components/Login/SelectStudent.vue
Normal file
49
frontend/src/components/Login/SelectStudent.vue
Normal file
|
@ -0,0 +1,49 @@
|
||||||
|
<template>
|
||||||
|
<v-row align="center">
|
||||||
|
<v-col cols="12">
|
||||||
|
<a>Select student to login!</a>
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="12">
|
||||||
|
<v-radio-group>
|
||||||
|
<v-radio
|
||||||
|
v-model="selectedStudent"
|
||||||
|
v-for="student in this.$store.data.data"
|
||||||
|
:key="student.UczenPelnaNazwa">
|
||||||
|
</v-radio>
|
||||||
|
</v-radio-group>
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="12">
|
||||||
|
<v-btn
|
||||||
|
class="login-button"
|
||||||
|
depressed
|
||||||
|
color="primary"
|
||||||
|
@click="chooseClicked()">
|
||||||
|
Choose</v-btn>
|
||||||
|
</v-col>
|
||||||
|
</v-row>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'SelectStudent',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
radioGroup: 1,
|
||||||
|
selectedStudent: '',
|
||||||
|
studentList: {
|
||||||
|
type: Array,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async chooseClicked() {
|
||||||
|
this.$store.state.selectedUser = this.selectedStudent;
|
||||||
|
this.$store.state.showStudentsList = true;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
|
@ -42,22 +42,34 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
// import LoginForm from '../../props/LoginForm.ts';
|
||||||
|
import login from '../../api/login';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'UserLogin',
|
name: 'UserLogin',
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
login: '',
|
login: '',
|
||||||
password: '',
|
password: '',
|
||||||
|
selectedSymbol: '',
|
||||||
domains: [
|
domains: [
|
||||||
'Vulcan',
|
'Vulcan',
|
||||||
'Fakelog',
|
'Fakelog',
|
||||||
],
|
],
|
||||||
selectedSymbol: '',
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
loginUser() {
|
async loginUser() {
|
||||||
this.$store.state.isLoading = true;
|
this.$store.state.isLoading = true;
|
||||||
|
const response = await login.register(this.login, this.password, this.selectedSymbol);
|
||||||
|
this.$store.state.loginData = response.data;
|
||||||
|
|
||||||
|
console.log(this.$store.state.isLoading);
|
||||||
|
|
||||||
|
if (response.data.data.students.data.length > 1) {
|
||||||
|
this.$store.state.isLoading = false;
|
||||||
|
this.$store.state.showStudentsList = true;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
itemSelected() {
|
itemSelected() {
|
||||||
if (this.selectedSymbol === 'Fakelog') {
|
if (this.selectedSymbol === 'Fakelog') {
|
||||||
|
|
6
frontend/src/props/LoginForm.ts
Normal file
6
frontend/src/props/LoginForm.ts
Normal file
|
@ -0,0 +1,6 @@
|
||||||
|
interface LoginForm {
|
||||||
|
login: String,
|
||||||
|
password: String,
|
||||||
|
domains: Array<String>,
|
||||||
|
selectedSymbol: String
|
||||||
|
}
|
|
@ -18,6 +18,11 @@ const routes: Array<RouteConfig> = [
|
||||||
// which is lazy-loaded when the route is visited.
|
// which is lazy-loaded when the route is visited.
|
||||||
component: () => import(/* webpackChunkName: "about" */ '../views/About.vue'),
|
component: () => import(/* webpackChunkName: "about" */ '../views/About.vue'),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: '/user',
|
||||||
|
name: 'User',
|
||||||
|
component: () => import('../views/Panel.vue'),
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
const router = new VueRouter({
|
const router = new VueRouter({
|
||||||
|
|
|
@ -6,6 +6,8 @@ Vue.use(Vuex);
|
||||||
export default new Vuex.Store({
|
export default new Vuex.Store({
|
||||||
state: {
|
state: {
|
||||||
isLoading: false,
|
isLoading: false,
|
||||||
|
loginData: null,
|
||||||
|
showStudentsList: false,
|
||||||
},
|
},
|
||||||
mutations: {
|
mutations: {
|
||||||
},
|
},
|
||||||
|
|
16
frontend/src/store/user.ts
Normal file
16
frontend/src/store/user.ts
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
import Vue from 'vue';
|
||||||
|
import Vuex from 'vuex';
|
||||||
|
|
||||||
|
Vue.use(Vuex);
|
||||||
|
|
||||||
|
export default new Vuex.Store({
|
||||||
|
state: {
|
||||||
|
selectedUser: '',
|
||||||
|
},
|
||||||
|
mutations: {
|
||||||
|
},
|
||||||
|
actions: {
|
||||||
|
},
|
||||||
|
modules: {
|
||||||
|
},
|
||||||
|
});
|
|
@ -1,25 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="home">
|
|
||||||
<img alt="Vue logo" src="../assets/logo.png">
|
|
||||||
<HelloWorld msg="Welcome to Your Vue.js + TypeScript App"/>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import Vue from 'vue';
|
|
||||||
import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src
|
|
||||||
|
|
||||||
export default Vue.extend({
|
|
||||||
name: 'Home',
|
|
||||||
components: {
|
|
||||||
HelloWorld,
|
|
||||||
},
|
|
||||||
beforeMount() {
|
|
||||||
if (!localStorage.getItem('session')) {
|
|
||||||
this.$router.push('/login');
|
|
||||||
} else {
|
|
||||||
this.$router.push('/user');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
});
|
|
||||||
</script>
|
|
|
@ -5,7 +5,8 @@
|
||||||
<v-card loading="isLoading" id="login-form" class="mx-auto mt-9">
|
<v-card loading="isLoading" id="login-form" class="mx-auto mt-9">
|
||||||
<form>
|
<form>
|
||||||
<v-container>
|
<v-container>
|
||||||
<UserLogin></UserLogin>
|
<UserLogin v-if="!this.$store.state.showStudentsList"></UserLogin>
|
||||||
|
<SelectStudent v-if="this.$store.state.showStudentsList"></SelectStudent>
|
||||||
</v-container>
|
</v-container>
|
||||||
</form>
|
</form>
|
||||||
</v-card>
|
</v-card>
|
||||||
|
@ -15,19 +16,14 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import UserLogin from '../components/Login/UserLogin.vue';
|
import UserLogin from '../components/Login/UserLogin.vue';
|
||||||
|
import SelectStudent from '../components/Login/SelectStudent.vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Login',
|
name: 'Login',
|
||||||
components: {
|
components: {
|
||||||
|
SelectStudent,
|
||||||
UserLogin,
|
UserLogin,
|
||||||
},
|
},
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
isLoading: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
},
|
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
13
frontend/src/views/Panel.vue
Normal file
13
frontend/src/views/Panel.vue
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
<template>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "Panel"
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
Loading…
Reference in a new issue