jako tako
This commit is contained in:
@@ -8,78 +8,160 @@ import { useDateFormat, useValidation } from '@/shared/composables';
|
||||
import { useAlertService } from '@/shared/alert/alert.service';
|
||||
|
||||
import UserService from '@/entities/user/user.service';
|
||||
import AccountService from '@/account/account.service';
|
||||
import EventService from '@/entities/event/event.service';
|
||||
import { type IEvent } from '@/shared/model/event.model';
|
||||
import { type IRegistration, Registration } from '@/shared/model/registration.model';
|
||||
import type LoginService from '@/account/login.service';
|
||||
import { type IUser, User } from '@/shared/model/user.model';
|
||||
|
||||
export default defineComponent({
|
||||
compatConfig: { MODE: 3 },
|
||||
name: 'RegistrationUpdate',
|
||||
setup() {
|
||||
props: {
|
||||
eventId: {
|
||||
type: [Number, String],
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
},
|
||||
setup(props) {
|
||||
const registrationService = inject('registrationService', () => new RegistrationService());
|
||||
const alertService = inject('alertService', () => useAlertService(), true);
|
||||
const userService = inject('userService', () => new UserService());
|
||||
const eventService = inject('eventService', () => new EventService());
|
||||
const loginService = inject<LoginService>('loginService');
|
||||
const accountService = inject<AccountService>('accountService');
|
||||
const isAdmin = inject<boolean>('isAdmin');
|
||||
const currentUserFullName = ref(''); //inject<string>('currentUserFullName');
|
||||
const currentUsername = ref(''); // nject<string>('currentUsername');
|
||||
|
||||
const registration: Ref<IRegistration> = ref(new Registration());
|
||||
const userService = inject('userService', () => new UserService());
|
||||
const users: Ref<Array<any>> = ref([]);
|
||||
|
||||
const eventService = inject('eventService', () => new EventService());
|
||||
|
||||
const events: Ref<IEvent[]> = ref([]);
|
||||
const isSaving = ref(false);
|
||||
const currentLanguage = inject('currentLanguage', () => computed(() => navigator.language ?? 'en'), true);
|
||||
const eventName = ref('');
|
||||
const currentDateTime = ref(new Date().toISOString().slice(0, 16));
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const loggedUser: Ref<IUser> = ref(new User());
|
||||
|
||||
const previousState = () => router.go(-1);
|
||||
|
||||
const retrieveRegistration = async registrationId => {
|
||||
// const setCurrentUser = async () => {
|
||||
// const userResponse = await userService().retrieve();
|
||||
// users.value = userResponse.data;
|
||||
//
|
||||
// console.log('1users:', users.value);
|
||||
// console.log('2currentUsername:', currentUsername);
|
||||
// console.log('4users:', users.value);
|
||||
// console.log('5currentUsername:', currentUsername);
|
||||
// console.log('6currentUserFullName2:', currentUserFullName2);
|
||||
//
|
||||
// }
|
||||
|
||||
const initRelationships = async () => {
|
||||
try {
|
||||
const res = await registrationService().find(registrationId);
|
||||
res.dateTime = new Date(res.dateTime);
|
||||
registration.value = res;
|
||||
const userResponse = await userService().retrieve();
|
||||
users.value = userResponse.data;
|
||||
} catch (error) {
|
||||
alertService.showHttpError(error.response);
|
||||
console.error('Error fetching users:', error);
|
||||
}
|
||||
};
|
||||
try {
|
||||
const eventResponse = await eventService().retrieve();
|
||||
events.value = eventResponse.data;
|
||||
|
||||
if (route.params?.registrationId) {
|
||||
retrieveRegistration(route.params.registrationId);
|
||||
}
|
||||
console.log('events.value:', events.value); // Sprawdź czy dane wydarzeń zostały poprawnie pobrane
|
||||
console.log('props.eventId:', props.eventId); // Sprawdź czy eventId jest przekazywany
|
||||
|
||||
const initRelationships = () => {
|
||||
userService()
|
||||
.retrieve()
|
||||
.then(res => {
|
||||
users.value = res.data;
|
||||
});
|
||||
eventService()
|
||||
.retrieve()
|
||||
.then(res => {
|
||||
events.value = res.data;
|
||||
});
|
||||
// // Find and set the event name for the eventId from props
|
||||
// const event = events.value.find((e: IEvent) => String(e.id) === props.eventId);
|
||||
//
|
||||
// console.log('Found event:', event); // Sprawdź czy event został znaleziony
|
||||
//
|
||||
// if (event) {
|
||||
// eventName.value = event.name;
|
||||
// registration.value.event = event;
|
||||
// console.log('Event name set:', eventName.value); // Sprawdź czy nazwa wydarzenia została ustawiona
|
||||
// } else {
|
||||
// console.log('No event found for id:', props.eventId); // Jeśli event nie został znaleziony
|
||||
// }
|
||||
} catch (error) {
|
||||
console.error('Error fetching events:', error);
|
||||
}
|
||||
};
|
||||
|
||||
initRelationships();
|
||||
|
||||
// // Fetch user details from the /api/account endpoint
|
||||
// userService().fetchAccountDetails().then(account => {
|
||||
// currentUserFullName.value = `${account.firstName} ${account.lastName}`;
|
||||
// registration.value.user = account; // Assuming that account includes the user details
|
||||
// });
|
||||
|
||||
const retrieveRegistration = async (registrationId: string) => {
|
||||
try {
|
||||
const res = await registrationService().find(registrationId);
|
||||
res.dateTime = new Date(res.dateTime);
|
||||
registration.value = res;
|
||||
// Assuming you can retrieve event details here
|
||||
eventName.value = '' + registration.value.event?.name; // Set this from the event details
|
||||
} catch (error) {
|
||||
alertService.showHttpError(error.response);
|
||||
}
|
||||
};
|
||||
const initEvent = async (eventId: number) => {
|
||||
console.log('init');
|
||||
if (eventId) {
|
||||
const event = await eventService().find(eventId);
|
||||
registration.value.event = event;
|
||||
eventName.value = '' + registration.value.event?.name;
|
||||
}
|
||||
registration.value.active = true;
|
||||
registration.value.dateTime = new Date();
|
||||
userService()
|
||||
.fetchAccountDetails()
|
||||
.then(account => {
|
||||
currentUserFullName.value = `${account.firstName} ${account.lastName}`;
|
||||
currentUsername.value = `${account.id}`;
|
||||
userService()
|
||||
.retrieve()
|
||||
.then(users => {
|
||||
const user = users.data.find((e: IUser) => e.id === currentUsername.value);
|
||||
console.log('7user:', user);
|
||||
if (user) {
|
||||
loggedUser.value = user;
|
||||
}
|
||||
registration.value.user = loggedUser.value;
|
||||
});
|
||||
console.log('resetting player');
|
||||
registration.value.playerName = currentUserFullName.value;
|
||||
});
|
||||
};
|
||||
|
||||
if (route.params?.registrationId) {
|
||||
retrieveRegistration(route.params.registrationId as string);
|
||||
} else {
|
||||
if (route.params?.eventId) {
|
||||
initEvent(Number(route.params?.eventId));
|
||||
}
|
||||
}
|
||||
|
||||
const dataUtils = useDataUtils();
|
||||
|
||||
const validations = useValidation();
|
||||
const { required } = useValidation();
|
||||
const validationRules = {
|
||||
dateTime: {
|
||||
required: validations.required('This field is required.'),
|
||||
playerName: {
|
||||
// required: required('This field is required.'),
|
||||
},
|
||||
active: {
|
||||
required: validations.required('This field is required.'),
|
||||
// required: required('This field is required.'),
|
||||
},
|
||||
playerName: {},
|
||||
comment: {},
|
||||
user: {},
|
||||
event: {},
|
||||
};
|
||||
const v$ = useVuelidate(validationRules, registration as any);
|
||||
v$.value.$validate();
|
||||
const v$ = useVuelidate(validationRules, registration);
|
||||
|
||||
return {
|
||||
registrationService,
|
||||
@@ -93,9 +175,12 @@ export default defineComponent({
|
||||
...dataUtils,
|
||||
v$,
|
||||
...useDateFormat({ entityRef: registration }),
|
||||
eventName,
|
||||
currentUserFullName,
|
||||
currentDateTime,
|
||||
isAdmin,
|
||||
};
|
||||
},
|
||||
created(): void {},
|
||||
methods: {
|
||||
save(): void {
|
||||
this.isSaving = true;
|
||||
|
||||
@@ -6,28 +6,35 @@
|
||||
Create or edit a Registration
|
||||
</h2>
|
||||
<div>
|
||||
<div class="form-group" v-if="registration.id">
|
||||
<label for="id">ID</label>
|
||||
<input type="text" class="form-control" id="id" name="id" v-model="registration.id" readonly />
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="registration-event">Event</label>
|
||||
<input type="text" class="form-control" id="registration-event" name="eventName" :value="eventName" disabled />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="registration-dateTime">Date Time</label>
|
||||
<div class="d-flex">
|
||||
<input
|
||||
id="registration-dateTime"
|
||||
data-cy="dateTime"
|
||||
type="datetime-local"
|
||||
class="form-control"
|
||||
name="dateTime"
|
||||
:class="{ valid: !v$.dateTime.$invalid, invalid: v$.dateTime.$invalid }"
|
||||
required
|
||||
:value="convertDateTimeFromServer(v$.dateTime.$model)"
|
||||
@change="updateZonedDateTimeField('dateTime', $event)"
|
||||
/>
|
||||
</div>
|
||||
<div v-if="v$.dateTime.$anyDirty && v$.dateTime.$invalid">
|
||||
<small class="form-text text-danger" v-for="error of v$.dateTime.$errors" :key="error.$uid">{{ error.$message }}</small>
|
||||
</div>
|
||||
<label class="form-control-label" for="registration-user">User</label>
|
||||
<input type="text" class="form-control" id="registration-user" name="userName" :value="currentUserFullName" disabled />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="registration-playerName">Player Name</label>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
id="registration-playerName"
|
||||
name="playerName"
|
||||
:class="{ valid: !v$.playerName.$invalid, invalid: v$.playerName.$invalid }"
|
||||
v-model="v$.playerName.$model"
|
||||
/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="registration-dateTime">Reservation Time</label>
|
||||
<input
|
||||
type="datetime-local"
|
||||
class="form-control"
|
||||
id="registration-dateTime"
|
||||
name="dateTime"
|
||||
:value="currentDateTime"
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="registration-active">Active</label>
|
||||
@@ -45,18 +52,6 @@
|
||||
<small class="form-text text-danger" v-for="error of v$.active.$errors" :key="error.$uid">{{ error.$message }}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="registration-playerName">Player Name</label>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
name="playerName"
|
||||
id="registration-playerName"
|
||||
data-cy="playerName"
|
||||
:class="{ valid: !v$.playerName.$invalid, invalid: v$.playerName.$invalid }"
|
||||
v-model="v$.playerName.$model"
|
||||
/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="registration-comment">Comment</label>
|
||||
<textarea
|
||||
@@ -68,33 +63,6 @@
|
||||
v-model="v$.comment.$model"
|
||||
></textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="registration-user">User</label>
|
||||
<select class="form-control" id="registration-user" data-cy="user" name="user" v-model="registration.user">
|
||||
<option :value="null"></option>
|
||||
<option
|
||||
:value="registration.user && userOption.id === registration.user.id ? registration.user : userOption"
|
||||
v-for="userOption in users"
|
||||
:key="userOption.id"
|
||||
>
|
||||
{{ userOption.login }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="registration-event">Event</label>
|
||||
<select class="form-control" id="registration-event" data-cy="event" name="event" v-model="registration.event">
|
||||
<option :value="null">Please select an event</option>
|
||||
<option
|
||||
:value="eventOption.id === eventId ? eventOption : registration.event"
|
||||
v-for="eventOption in events"
|
||||
:key="eventOption.id"
|
||||
:selected="eventOption.id === eventId"
|
||||
>
|
||||
{{ eventOption.name }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<button type="button" id="cancel-save" data-cy="entityCreateCancelButton" class="btn btn-secondary" @click="previousState()">
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import axios from 'axios';
|
||||
|
||||
const baseApiUrl = 'api/users';
|
||||
const baseApiUrl = 'api/users'; // Uwaga: ścieżka do konta użytkownika to /api/account
|
||||
const accountApiUrl = 'api/account'; // Dodajemy nową ścieżkę dla konta użytkownika
|
||||
|
||||
export default class UserService {
|
||||
public retrieve(): Promise<any> {
|
||||
@@ -15,4 +16,18 @@ export default class UserService {
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
public fetchAccountDetails(): Promise<{ firstName: string; lastName: string; id: string }> {
|
||||
return new Promise<{ firstName: string; lastName: string; id: string }>((resolve, reject) => {
|
||||
axios
|
||||
.get(accountApiUrl)
|
||||
.then(res => {
|
||||
const { firstName, lastName, id } = res.data; // Zakładamy, że JSON z /api/account ma takie pola
|
||||
resolve({ firstName, lastName, id });
|
||||
})
|
||||
.catch(err => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user