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/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": {
|
||||
"version": "4.17.11",
|
||||
"resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.11.tgz",
|
||||
|
@ -3103,6 +3108,14 @@
|
|||
"integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==",
|
||||
"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": {
|
||||
"version": "6.26.0",
|
||||
"resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
|
||||
|
@ -4563,8 +4576,7 @@
|
|||
"cookie": {
|
||||
"version": "0.4.0",
|
||||
"resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.0.tgz",
|
||||
"integrity": "sha512-+Hp8fLp57wnUSt0tY0tHEXh4voZRDnoIrZPqlo3DPiI4y9lwg/jqx+1Om94/W6ZaPDOUbnjOt/99w66zk+l1Xg==",
|
||||
"dev": true
|
||||
"integrity": "sha512-+Hp8fLp57wnUSt0tY0tHEXh4voZRDnoIrZPqlo3DPiI4y9lwg/jqx+1Om94/W6ZaPDOUbnjOt/99w66zk+l1Xg=="
|
||||
},
|
||||
"cookie-signature": {
|
||||
"version": "1.0.6",
|
||||
|
@ -7238,8 +7250,7 @@
|
|||
"follow-redirects": {
|
||||
"version": "1.13.3",
|
||||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.13.3.tgz",
|
||||
"integrity": "sha512-DUgl6+HDzB0iEptNQEXLx/KhTmDb8tZUHSeLqpnjpknR70H0nC2t9N73BK6fN4hOvJ84pKlIQVQ4k5FFlBedKA==",
|
||||
"dev": true
|
||||
"integrity": "sha512-DUgl6+HDzB0iEptNQEXLx/KhTmDb8tZUHSeLqpnjpknR70H0nC2t9N73BK6fN4hOvJ84pKlIQVQ4k5FFlBedKA=="
|
||||
},
|
||||
"for-in": {
|
||||
"version": "1.0.2",
|
||||
|
@ -13088,6 +13099,18 @@
|
|||
"tough-cookie": "~2.5.0",
|
||||
"tunnel-agent": "^0.6.0",
|
||||
"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": {
|
||||
|
@ -13117,6 +13140,18 @@
|
|||
"request-promise-core": "1.1.4",
|
||||
"stealthy-require": "^1.1.1",
|
||||
"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": {
|
||||
|
@ -14683,16 +14718,6 @@
|
|||
"integrity": "sha1-riF2gXXRVZ1IvvNUILL0li8JwzA=",
|
||||
"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": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/tr46/-/tr46-1.0.1.tgz",
|
||||
|
@ -15024,6 +15049,15 @@
|
|||
"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": {
|
||||
"version": "0.1.2",
|
||||
"resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
|
||||
|
|
|
@ -10,8 +10,10 @@
|
|||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.21.1",
|
||||
"core-js": "^3.6.5",
|
||||
"register-service-worker": "^1.7.1",
|
||||
"universal-cookie": "^4.0.4",
|
||||
"vue": "^2.6.11",
|
||||
"vue-router": "^3.2.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>
|
||||
|
||||
<script>
|
||||
// import LoginForm from '../../props/LoginForm.ts';
|
||||
import login from '../../api/login';
|
||||
|
||||
export default {
|
||||
name: 'UserLogin',
|
||||
data() {
|
||||
return {
|
||||
login: '',
|
||||
password: '',
|
||||
selectedSymbol: '',
|
||||
domains: [
|
||||
'Vulcan',
|
||||
'Fakelog',
|
||||
],
|
||||
selectedSymbol: '',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
loginUser() {
|
||||
async loginUser() {
|
||||
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() {
|
||||
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.
|
||||
component: () => import(/* webpackChunkName: "about" */ '../views/About.vue'),
|
||||
},
|
||||
{
|
||||
path: '/user',
|
||||
name: 'User',
|
||||
component: () => import('../views/Panel.vue'),
|
||||
},
|
||||
];
|
||||
|
||||
const router = new VueRouter({
|
||||
|
|
|
@ -6,6 +6,8 @@ Vue.use(Vuex);
|
|||
export default new Vuex.Store({
|
||||
state: {
|
||||
isLoading: false,
|
||||
loginData: null,
|
||||
showStudentsList: false,
|
||||
},
|
||||
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">
|
||||
<form>
|
||||
<v-container>
|
||||
<UserLogin></UserLogin>
|
||||
<UserLogin v-if="!this.$store.state.showStudentsList"></UserLogin>
|
||||
<SelectStudent v-if="this.$store.state.showStudentsList"></SelectStudent>
|
||||
</v-container>
|
||||
</form>
|
||||
</v-card>
|
||||
|
@ -15,19 +16,14 @@
|
|||
|
||||
<script>
|
||||
import UserLogin from '../components/Login/UserLogin.vue';
|
||||
import SelectStudent from '../components/Login/SelectStudent.vue';
|
||||
|
||||
export default {
|
||||
name: 'Login',
|
||||
components: {
|
||||
SelectStudent,
|
||||
UserLogin,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
},
|
||||
};
|
||||
</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