Add auth service

This commit is contained in:
MRmlik12 2021-04-11 00:12:21 +02:00
parent 8ec7ffcaf7
commit ae609c034b
12 changed files with 184 additions and 49 deletions

View file

@ -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",

View file

@ -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
View 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;
},
};

View 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>

View file

@ -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') {

View file

@ -0,0 +1,6 @@
interface LoginForm {
login: String,
password: String,
domains: Array<String>,
selectedSymbol: String
}

View file

@ -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({

View file

@ -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: {
}, },

View 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: {
},
});

View file

@ -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>

View file

@ -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>

View file

@ -0,0 +1,13 @@
<template>
</template>
<script>
export default {
name: "Panel"
}
</script>
<style scoped>
</style>