socrates/duty-schedule-fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Included user-information in employee model

Browse Source
This commit is contained in:
Sockenklaus
2021-11-04 14:00:52 +01:00
parent cfcfeba170
commit b41ff6515d
3 changed files with 70 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
src/stores/employee.ts
View File

@@ -4,21 +4,17 @@ import { useUser } from './user'
import { useNotifications } from './notifications'
type ResultData = {
employee: {
id: number,
firstName: string,
lastName: string,
shorthand: string,
phone: string,
mobile: string,
email: string,
contractHours: number,
hasUser: boolean,
},
user?: {
id?: number,
username?: string
}
id: number,
firstName: string,
lastName: string | undefined,
shorthand: string,
phone: string | undefined,
mobile: string | undefined,
email: string | undefined,
contractHours: number | undefined,
isActive: boolean,
username: string | undefined,
role: string
}
const user = useUser()
@@ -39,14 +35,11 @@ export const useEmployee = defineStore({
mobile: '',
email: '',
contractHours: NaN,
hasUser: false
},
user: {
id: NaN,
isActive: false,
username: '',
password: '',
passwordConfirm: '',
}
passwordConfirm: ''
},
},
employee: {
@@ -58,15 +51,11 @@ export const useEmployee = defineStore({
mobile: '',
email: '',
contractHours: NaN,
hasUser: false
},
user: {
id: NaN,
isActive: false,
username: '',
password: '',
passwordConfirm: ''
}
},
}
},
@@ -75,15 +64,14 @@ export const useEmployee = defineStore({
try {
const data : ResultData = await <ResultData>(await axios.get('employees/'+id, {
headers: {
'Authorization': 'Bearer '+user.token
}
headers: user.header
})).data
Object.assign(this.clean.employee, data.employee)
Object.assign(this.clean.user, data.user)
Object.assign(this.employee, data.employee),
Object.assign(this.user, data.user)
console.log(this.clean.employee)
console.log(data)
Object.assign(this.clean.employee, data)
Object.assign(this.employee, data)
}
catch(err){
if(err instanceof Error) notifications.add('danger', err.message, -1)
@@ -92,7 +80,6 @@ export const useEmployee = defineStore({
},
reset() {
Object.assign(this.user, this.clean.user)
Object.assign(this.employee, this.clean.employee)
},
@@ -101,30 +88,6 @@ export const useEmployee = defineStore({
try {
let result
if(isNaN(this.user.id) && this.user.username.length > 0){
result = await axios.post(
'users',
{
username: this.user.username,
password: this.user.password
},
{
headers: user.header
}
)
}
else if (this.user.password.length > 0 && this.user.password === this.user.passwordConfirm){
result = await axios.patch(
'users/'+this.user.id,
{
password: this.user.password
},
{
headers: user.header
}
)
}
result = await axios.patch(
'employees/'+this.employee.id,
this.employee,
@@ -134,7 +97,6 @@ export const useEmployee = defineStore({
)
Object.assign(this.clean.employee, this.employee)
Object.assign(this.clean.user, this.user)
notifications.add('success', result.statusText)
}
catch(error) {

11
src/stores/user.ts
View File

@@ -33,11 +33,12 @@ export const useUser = defineStore({
},
actions: {
async login(username: string, password: string): Promise<
boolean |
'E_INVALID_AUTH_PASSWORD: Password mis-match' |
'E_INVALID_AUTH_UID: User not found'
> {
async login(username: string, password: string):
Promise<
boolean |
'E_INVALID_AUTH_PASSWORD: Password mis-match' |
'E_INVALID_AUTH_UID: User not found'
> {
const notifications = useNotifications()

93
src/views/EmployeesDetails.vue
View File

@@ -3,10 +3,10 @@
<VProfileControls class="mb-5" :isActive="editEmployee || createUser" @save="onUpdateEmployee" @toggleEdit="onToggleEdit" />
<h5>Clean State</h5>
{{ state.clean.user }}
{{ state.clean.employee }}
<br>
<h5>Dirty State</h5>
{{ state.user }}
{{ state.employee }}
<form @keydown.enter="onEnter" class="text-start">
<div class="row mb-5">
@@ -19,11 +19,11 @@
v-model.trim="state.employee.firstName"
id="first-name"
class="form-control"
:class="classIsInvalid(v$.employee.firstName)"
:class="classIsInvalid(v$.firstName)"
:disabled="!editEmployee"
>
<div
v-for="(error) in v$.employee.firstName.$errors"
v-for="(error) in v$.firstName.$errors"
class="invalid-feedback"
id="firstNameFeedback">
{{error.$message}}
@@ -38,10 +38,10 @@
v-model.trim="state.employee.shorthand"
id="shorthand"
class="form-control"
:class="classIsInvalid(v$.employee.shorthand)"
:class="classIsInvalid(v$.shorthand)"
:disabled="!editEmployee"
>
<div v-for="(error) in v$.employee.shorthand.$errors" class="invalid-feedback" id="shorthandFeedback">
<div v-for="(error) in v$.shorthand.$errors" class="invalid-feedback" id="shorthandFeedback">
{{ error.$message }}
</div>
</div>
@@ -57,10 +57,10 @@
v-model.trim="state.employee.email"
id="email"
class="form-control"
:class="classIsInvalid(v$.employee.email)"
:class="classIsInvalid(v$.email)"
:disabled="!editEmployee"
>
<div v-for="(error) in v$.employee.email.$errors" class="invalid-feedback" id="emailFeedback">
<div v-for="(error) in v$.email.$errors" class="invalid-feedback" id="emailFeedback">
{{error.$message}}
</div>
</div>
@@ -75,57 +75,57 @@
v-model.number="state.employee.contractHours"
id="contract-hours"
class="form-control"
:class="classIsInvalid(v$.employee.contractHours)"
:class="classIsInvalid(v$.contractHours)"
:disabled="!editEmployee"
>
<div v-for="(error) in v$.employee.contractHours.$errors" class="invalid-feedback" id="contractHoursFeedback">
<div v-for="(error) in v$.contractHours.$errors" class="invalid-feedback" id="contractHoursFeedback">
{{error.$message}}
</div>
</div>
<div class="col ps-5 border-start">
<h4>Benutzerinformationen:</h4>
<template v-if="state.employee.hasUser || createUser">
<template v-if="state.employee.username || createUser">
<label for="username" class="form-label">Benutzername:</label>
<input
type="text"
v-model.trim="state.user.username"
v-model.trim="state.employee.username"
id="username"
class="form-control"
:class="classIsInvalid(v$.user.username)"
:class="classIsInvalid(v$.username)"
:disabled="!createUser"
>
<div v-for="(error) in v$.user.username.$errors" class="invalid-feedback" id="usernameFeedback">
<div v-for="(error) in v$.username.$errors" class="invalid-feedback" id="usernameFeedback">
{{ error.$message }}
</div>
<label for="password" class="form-label">Neues Passwort:</label>
<input
type="password"
v-model="state.user.password"
v-model="state.employee.password"
id="password"
class="form-control"
:class="classIsInvalid(v$.user.password)"
:class="classIsInvalid(v$.password)"
:disabled="!editEmployee && !createUser"
>
<div v-for="(error) in v$.user.password.$errors" id="passwordFeedback" class="invalid-feedback">
<div v-for="(error) in v$.password.$errors" id="passwordFeedback" class="invalid-feedback">
{{error.$message}}
</div>
<label for="password-repeat" class="form-label">Neues Passwort wiederholen:</label>
<input
type="password"
v-model="state.user.passwordConfirm"
v-model="state.employee.passwordConfirm"
id="password-repeat"
class="form-control mb-3"
:class="classIsInvalid(v$.user.passwordConfirm)"
:class="classIsInvalid(v$.passwordConfirm)"
:disabled="!editEmployee && !createUser"
>
<div v-for="(error) in v$.user.passwordConfirm.$errors" class="invalid-feedback" id="passwordRepeatFeedback">
<div v-for="(error) in v$.passwordConfirm.$errors" class="invalid-feedback" id="passwordRepeatFeedback">
{{error.$message}}
</div>
</template>
<template v-else>
<p>Kein Benutzer vorhanden</p>
<button class="btn btn-primary" @click="onCreateUser()">Benutzer erstellen</button>
<button class="btn btn-primary" @click.prevent="onCreateUser()">Benutzer erstellen</button>
</template>
</div>
</div>
@@ -151,41 +151,32 @@ const state = useEmployee()
const editEmployee = ref(false)
const rules = computed(() => ({
employee: {
firstName: {
required: required
},
shorthand: {
required: required
},
email: {
email: email
},
contractHours: {
decimal,
betweenValue: between(0, 40)
}
firstName: {
required: required
},
user: {
username: {
requiredIf: requiredIf(() => createUser.value && isNaN(state.user.id))
},
password: {
requiredIf: requiredIf(() => createUser.value && isNaN(state.user.id))
},
passwordConfirm: {
sameAs: sameAs(state.user.password)
}
shorthand: {
required: required
},
email: {
email: email
},
contractHours: {
decimal,
betweenValue: between(0, 40)
},
username: {
requiredIf: requiredIf(() => createUser.value)
},
password: {
requiredIf: requiredIf(() => state.employee.username !== '')
},
passwordConfirm: {
sameAs: sameAs(state.employee.password)
}
}))
const v$ = useVuelidate(rules,
{
employee: state.employee,
user: state.user
}
)
const v$ = useVuelidate(rules, state.employee)
const createUser = ref(false)