jako tako

This commit is contained in:
2024-11-06 14:44:34 +01:00
parent 40d0459de7
commit 3c91f2dddb
5 changed files with 169 additions and 97 deletions
@@ -8,78 +8,160 @@ import { useDateFormat, useValidation } from '@/shared/composables';
import { useAlertService } from '@/shared/alert/alert.service'; import { useAlertService } from '@/shared/alert/alert.service';
import UserService from '@/entities/user/user.service'; import UserService from '@/entities/user/user.service';
import AccountService from '@/account/account.service';
import EventService from '@/entities/event/event.service'; import EventService from '@/entities/event/event.service';
import { type IEvent } from '@/shared/model/event.model'; import { type IEvent } from '@/shared/model/event.model';
import { type IRegistration, Registration } from '@/shared/model/registration.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({ export default defineComponent({
compatConfig: { MODE: 3 }, compatConfig: { MODE: 3 },
name: 'RegistrationUpdate', name: 'RegistrationUpdate',
setup() { props: {
eventId: {
type: [Number, String],
required: false,
default: null,
},
},
setup(props) {
const registrationService = inject('registrationService', () => new RegistrationService()); const registrationService = inject('registrationService', () => new RegistrationService());
const alertService = inject('alertService', () => useAlertService(), true); 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 registration: Ref<IRegistration> = ref(new Registration());
const userService = inject('userService', () => new UserService());
const users: Ref<Array<any>> = ref([]); const users: Ref<Array<any>> = ref([]);
const eventService = inject('eventService', () => new EventService());
const events: Ref<IEvent[]> = ref([]); const events: Ref<IEvent[]> = ref([]);
const isSaving = ref(false); const isSaving = ref(false);
const currentLanguage = inject('currentLanguage', () => computed(() => navigator.language ?? 'en'), true); 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 route = useRoute();
const router = useRouter(); const router = useRouter();
const loggedUser: Ref<IUser> = ref(new User());
const previousState = () => router.go(-1); 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 { try {
const res = await registrationService().find(registrationId); const userResponse = await userService().retrieve();
res.dateTime = new Date(res.dateTime); users.value = userResponse.data;
registration.value = res;
} catch (error) { } 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) { console.log('events.value:', events.value); // Sprawdź czy dane wydarzeń zostały poprawnie pobrane
retrieveRegistration(route.params.registrationId); console.log('props.eventId:', props.eventId); // Sprawdź czy eventId jest przekazywany
// // 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);
} }
const initRelationships = () => {
userService()
.retrieve()
.then(res => {
users.value = res.data;
});
eventService()
.retrieve()
.then(res => {
events.value = res.data;
});
}; };
initRelationships(); 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 dataUtils = useDataUtils();
const validations = useValidation(); const { required } = useValidation();
const validationRules = { const validationRules = {
dateTime: { playerName: {
required: validations.required('This field is required.'), // required: required('This field is required.'),
}, },
active: { active: {
required: validations.required('This field is required.'), // required: required('This field is required.'),
}, },
playerName: {},
comment: {}, comment: {},
user: {},
event: {},
}; };
const v$ = useVuelidate(validationRules, registration as any); const v$ = useVuelidate(validationRules, registration);
v$.value.$validate();
return { return {
registrationService, registrationService,
@@ -93,9 +175,12 @@ export default defineComponent({
...dataUtils, ...dataUtils,
v$, v$,
...useDateFormat({ entityRef: registration }), ...useDateFormat({ entityRef: registration }),
eventName,
currentUserFullName,
currentDateTime,
isAdmin,
}; };
}, },
created(): void {},
methods: { methods: {
save(): void { save(): void {
this.isSaving = true; this.isSaving = true;
@@ -6,28 +6,35 @@
Create or edit a Registration Create or edit a Registration
</h2> </h2>
<div> <div>
<div class="form-group" v-if="registration.id"> <div class="form-group">
<label for="id">ID</label> <label class="form-control-label" for="registration-event">Event</label>
<input type="text" class="form-control" id="id" name="id" v-model="registration.id" readonly /> <input type="text" class="form-control" id="registration-event" name="eventName" :value="eventName" disabled />
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="form-control-label" for="registration-dateTime">Date Time</label> <label class="form-control-label" for="registration-user">User</label>
<div class="d-flex"> <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 <input
id="registration-dateTime" type="text"
data-cy="dateTime"
type="datetime-local"
class="form-control" class="form-control"
name="dateTime" id="registration-playerName"
:class="{ valid: !v$.dateTime.$invalid, invalid: v$.dateTime.$invalid }" name="playerName"
required :class="{ valid: !v$.playerName.$invalid, invalid: v$.playerName.$invalid }"
:value="convertDateTimeFromServer(v$.dateTime.$model)" v-model="v$.playerName.$model"
@change="updateZonedDateTimeField('dateTime', $event)"
/> />
</div> </div>
<div v-if="v$.dateTime.$anyDirty && v$.dateTime.$invalid"> <div class="form-group">
<small class="form-text text-danger" v-for="error of v$.dateTime.$errors" :key="error.$uid">{{ error.$message }}</small> <label class="form-control-label" for="registration-dateTime">Reservation Time</label>
</div> <input
type="datetime-local"
class="form-control"
id="registration-dateTime"
name="dateTime"
:value="currentDateTime"
disabled
/>
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="form-control-label" for="registration-active">Active</label> <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> <small class="form-text text-danger" v-for="error of v$.active.$errors" :key="error.$uid">{{ error.$message }}</small>
</div> </div>
</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"> <div class="form-group">
<label class="form-control-label" for="registration-comment">Comment</label> <label class="form-control-label" for="registration-comment">Comment</label>
<textarea <textarea
@@ -68,33 +63,6 @@
v-model="v$.comment.$model" v-model="v$.comment.$model"
></textarea> ></textarea>
</div> </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>
<div> <div>
<button type="button" id="cancel-save" data-cy="entityCreateCancelButton" class="btn btn-secondary" @click="previousState()"> <button type="button" id="cancel-save" data-cy="entityCreateCancelButton" class="btn btn-secondary" @click="previousState()">
@@ -1,6 +1,7 @@
import axios from 'axios'; 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 { export default class UserService {
public retrieve(): Promise<any> { 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);
});
});
}
} }
+5
View File
@@ -110,6 +110,11 @@ const app = createApp({
); );
provide('accountService', accountService); provide('accountService', accountService);
provide('isAdmin', accountService.hasAnyAuthorityAndCheckAuth('ADMIN'));
provide(
'currentUserFullName',
computed(() => store.account?.firstName + ' ' + store.account.lastName),
);
// jhipster-needle-add-entity-service-to-main - JHipster will import entities services here // jhipster-needle-add-entity-service-to-main - JHipster will import entities services here
}, },
}); });
+1 -2
View File
@@ -12,8 +12,7 @@ export const createRouter = () =>
routes: [ routes: [
{ {
path: '/', path: '/',
name: 'Home', redirect: '/event/3/view',
component: Home,
}, },
{ {
path: '/forbidden', path: '/forbidden',