Files
sasiedzi/src/main/webapp/app/entities/event/event-details.vue
T
2024-12-02 20:02:55 +01:00

233 lines
10 KiB
Vue

<template>
<div class="row justify-content-center">
<div class="col-12">
<div v-if="event">
<!-- <h2 class="jh-entity-heading" data-cy="eventDetailsHeading"><span>Event</span> {{ event.id }}</h2>-->
<dl class="row jh-entity-details">
<dt>
<span>Nazwa</span>
</dt>
<dd>
<span>{{ event.name }}</span>
</dd>
<dt>
<span>Data</span>
</dt>
<dd>
<span>{{ event.date }}</span>
</dd>
<dt>
<span>Limit graczy</span>
</dt>
<dd>
<span>{{ event.playersLimit }}</span>
</dd>
<dt>
<span>Koszt do podziału</span>
</dt>
<dd>
<span>{{ event.cost }}</span>
</dd>
<dt>
<span>Komentarz</span>
</dt>
<dd>
<span>{{ event.comment }}</span>
</dd>
</dl>
<router-link
:to="{ name: 'RegistrationCreateForEvent', params: { eventId: event.id } }"
custom
v-slot="{ navigate }"
v-if="event.active"
>
<button @click="navigate" class="btn btn-primary">
<font-awesome-icon icon="plus"></font-awesome-icon>&nbsp;<span>Dołącz do wydarzenia</span>
</button>
</router-link>
<!-- <router-link-->
<!-- :to="{ name: 'TransactionFieldPayment', params: { paymentForFieldByEventId: event.id } }"-->
<!-- custom-->
<!-- v-slot="{ navigate }"-->
<!-- v-if="hasAnyAuthority(['ROLE_ADMIN', 'ROLE_COUNTER'])"-->
<!-- >-->
<!-- <button @click="navigate" class="btn btn-primary">-->
<!-- <font-awesome-icon icon="plus"></font-awesome-icon>&nbsp;<span>Opłać boisko</span>-->
<!-- </button>-->
<!-- </router-link>-->
<div class="table-responsive" v-if="event.registrations && event.registrations.length > 0">
<table class="table table-striped" aria-describedby="event.registrations">
<thead>
<tr>
<th scope="col"><span>#</span></th>
<th scope="col"><span>Czas zapisu</span></th>
<th scope="col"><span>Gracz</span></th>
<th scope="col"><span>Komentarz</span></th>
<!-- <th scope="col"><span>Active</span></th>-->
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr v-for="(registration, index) in sortedAndIndexedRegistrations" :key="registration.id" data-cy="entityTable">
<td>
<!-- Display row number or empty if not active -->
{{ getRegistrationIndex(index) }}
</td>
<td>
<span :class="{ strikethrough: registration.active === false }">{{ formatDateShort(registration.dateTime) || '' }}</span>
</td>
<td>
<span :class="{ strikethrough: registration.active === false }">{{ registration.playerName }}</span>
<b-button
@click="prepareRemove(registration)"
variant="danger"
class="btn btn-sm"
data-cy="entityDeleteButton"
v-if="
((registration.id && registration.user?.id == currentUserId && isCurrentEvent) ||
hasAnyAuthority(['ROLE_ADMIN', 'ROLE_COUNTER'])) &&
registration.active !== false &&
(event.active || (event.editable && hasAnyAuthority(['ROLE_COUNTER'])) || hasAnyAuthority(['ROLE_ADMIN']))
"
v-b-modal.removeEntity
>
<font-awesome-icon icon="times"></font-awesome-icon>
<span class="d-none d-md-inline">Delete</span>
</b-button>
</td>
<td>{{ registration.comment }}</td>
<!-- <td>{{ registration.active }}</td>-->
<td class="text-right">
<div class="btn-group">
<router-link
:to="{ name: 'RegistrationView', params: { registrationId: registration.id } }"
custom
v-slot="{ navigate }"
>
<button @click="navigate" class="btn btn-info btn-sm details" data-cy="entityDetailsButton">
<font-awesome-icon icon="eye"></font-awesome-icon>
<span class="d-none d-md-inline">View</span>
</button>
</router-link>
<!-- <b-button-->
<!-- @click="prepareRemove(registration)"-->
<!-- variant="danger"-->
<!-- class="btn btn-sm"-->
<!-- data-cy="entityDeleteButton"-->
<!-- v-b-modal.removeEntity-->
<!-- >-->
<!-- <font-awesome-icon icon="times"></font-awesome-icon>-->
<!-- <span class="d-none d-md-inline">Delete</span>-->
<!-- </b-button>-->
</div>
</td>
</tr>
</tbody>
</table>
</div>
<b-modal ref="removeEntity" id="removeEntity">
<template #modal-title>
<span id="sasiedziApp.registration.delete.question" data-cy="registrationDeleteDialogHeading">Confirm delete operation</span>
</template>
<div class="modal-body">
<p id="jhi-delete-registration-heading">Are you sure you want to delete Registration {{ removeId }}?</p>
</div>
<template #modal-footer>
<div>
<button type="button" class="btn btn-secondary" @click="closeDialog()">Cancel</button>
<button
type="button"
class="btn btn-primary"
id="jhi-confirm-delete-registration"
data-cy="entityConfirmDeleteButton"
@click="removeRegistration()"
>
Delete
</button>
</div>
</template>
</b-modal>
<!-- <button type="submit" @click.prevent="previousState()" class="btn btn-info" data-cy="entityDetailsBackButton">-->
<!-- <font-awesome-icon icon="arrow-left"></font-awesome-icon>&nbsp;<span>Back</span>-->
<!-- </button>-->
<!-- <router-link v-if="event.id" :to="{ name: 'EventEdit', params: { eventId: event.id } }" custom v-slot="{ navigate }">-->
<!-- <button @click="navigate" class="btn btn-primary">-->
<!-- <font-awesome-icon icon="pencil-alt"></font-awesome-icon>&nbsp;<span>Edit</span>-->
<!-- </button>-->
<!-- </router-link>-->
</div>
</div>
</div>
<button
class="btn btn-primary float-right"
v-if="(event.editable && hasAnyAuthority(['ROLE_COUNTER'])) || hasAnyAuthority(['ROLE_ADMIN'])"
@click="settle()"
>
<font-awesome-icon icon="sync"></font-awesome-icon> <span v-if="!event.charged">Rozlicz wydarzenie</span
><span v-if="event.charged">Przelicz ponownie zobowiązania</span>
</button>
<router-link
v-if="event.id && event.paid == false"
:to="{ name: 'TransactionFieldPayment', params: { paymentForFieldByEventId: event.id } }"
custom
v-slot="{ navigate }"
><!-- <router-link
v-if="transaction.id"
:to="{ name: 'TransactionCreateOpposite', params: { opposingTransactionId: transaction.id } }"
custom
v-slot="{ navigate }"
>-->
<button @click="navigate" class="btn btn-primary" v-if="hasAnyAuthority(['ROLE_ADMIN', 'ROLE_COUNTER'])">
<font-awesome-icon icon="pencil-alt"></font-awesome-icon>&nbsp;<span>Dodaj płatność za boisko</span>
</button>
</router-link>
<router-link
v-if="event.charged && event.editable"
:to="{ name: 'TransactionPaymentsForTransaction', params: { paymentsForTransactionId: event.chargeTransactionId } }"
custom
v-slot="{ navigate }"
><!-- <router-link
v-if="transaction.id"
:to="{ name: 'TransactionCreateOpposite', params: { opposingTransactionId: transaction.id } }"
custom
v-slot="{ navigate }"
>-->
<button @click="navigate" class="btn btn-primary" v-if="hasAnyAuthority(['ROLE_ADMIN', 'ROLE_COUNTER'])">
<font-awesome-icon icon="pencil-alt"></font-awesome-icon>&nbsp;<span>Dodaj wpłaty na konto</span>
</button>
</router-link>
<div class="table-responsive" v-if="event.transactions && event.transactions.length > 0">
Rozliczenie:
<table class="table table-striped" aria-describedby="transactions">
<thead>
<tr>
<!-- <th/>-->
<!-- <th/>-->
<!-- <th/>-->
<th />
</tr>
</thead>
<tbody>
<tr v-for="transaction in event.transactions" :key="transaction.id" data-cy="entityTable">
<td>
<router-link :to="{ name: 'TransactionView', params: { transactionId: transaction.id } }"
>{{ transaction.date }} {{ transaction.type }}
</router-link>
<div v-if="transaction.comment">{{ transaction.comment }}</div>
</td>
<!-- <td>{{ transaction.type }}</td>-->
<!-- <td>{{ transaction.date }}</td>-->
<!-- <td>{{ transaction.comment }}</td>-->
</tr>
</tbody>
</table>
</div>
</template>
<script lang="ts" src="./event-details.component.ts"></script>