Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-13 22:04:23 +00:00
Code Issues Actions Projects Releases Wiki Activity

Use teleport for banner

Browse Source
This commit is contained in:
Boris Waaub 2024-05-06 18:03:04 +02:00
parent 473765366a
commit 3f9745d8cf
9 changed files with 142 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/Bundle/ChillTicketBundle/src/Entity/Ticket.php
View File

@ -69,6 +69,13 @@ class Ticket implements TrackCreationInterface, TrackUpdateInterface
#[ORM\OneToMany(targetEntity: PersonHistory::class, mappedBy: 'ticket')]
private Collection $personHistories;
#[ORM\ManyToOne(targetEntity: User::class)]
#[ORM\JoinColumn(nullable: true)]
private ?User $updatedBy = null;
#[ORM\Column(type: \Doctrine\DBAL\Types\Types::DATETIME_IMMUTABLE, nullable: true)]
private ?\DateTimeImmutable $createdAt = null;
public function __construct()
{
$this->addresseeHistory = new ArrayCollection();
@ -76,6 +83,7 @@ class Ticket implements TrackCreationInterface, TrackUpdateInterface
$this->motiveHistories = new ArrayCollection();
$this->personHistories = new ArrayCollection();
$this->inputHistories = new ArrayCollection();
}
public function getId(): ?int
@ -211,4 +219,16 @@ class Ticket implements TrackCreationInterface, TrackUpdateInterface
{
return $this->addresseeHistory;
}
public function getCreatedAt(): \DateTimeImmutable
{
return $this->createdAt;
}
public function getUpdatedBy(): ?User
{
return $this->updatedBy;
}
}

1
src/Bundle/ChillTicketBundle/src/Resources/public/types.ts
View File

@ -2,7 +2,6 @@ import {
DateTime,
TranslatableString,
User,
UserGroup,
UserGroupOrUser
} from "../../../../ChillMainBundle/Resources/public/types";
import { Person } from "../../../../ChillPersonBundle/Resources/public/types";

120
src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/App.vue
View File

@ -1,5 +1,75 @@
<template>
<div class="container-xxl p-3" style="padding-bottom: 55px;">
<Teleport to="#header-ticket-main">
<div class="container-xxl text-primary">
<div class="row">
<div class="col-md-6 col-sm-12 ps-md-5 ps-xxl-0">
<h2>#{{ ticket.externalRef }}</h2>
<h1 v-if="ticket.currentMotive">
{{ ticket.currentMotive.label.fr }}
</h1>
<p class="chill-no-data-statement" v-else>
{{ $t("banner.no_motive") }}
</p>
</div>
<div class="col-md-6 col-sm-12">
<div class="float-end">
<h1>
<span class="badge text-bg-chill-green text-white">
{{ $t("banner.open") }}
</span>
</h1>
<h3 class="fst-italic" v-if="ticket.createdAt">
{{
$t("banner.since", {
days: getSince(ticket.createdAt),
})
}}
</h3>
</div>
</div>
</div>
</div>
</Teleport>
<Teleport to="#header-ticket-details">
<div class="container-xxl">
<div class="row justify-content-between">
<!-- <div class="col-md-4 col-sm-12">
<h3 class="text-primary">{{ $t("concerned_patient") }}</h3>
</div> -->
<div class="col-md-6 col-sm-12 ps-md-5 ps-xxl-0">
<h3 class="text-primary">{{ $t("banner.caller") }}</h3>
<h2>
<span
class="badge text-bg-light m-1"
v-for="person in ticket.currentPersons"
:key="person.id"
>
{{ person.firstName }}
{{ person.lastName }}
</span>
</h2>
</div>
<div class="col-md-6 col-sm-12">
<h3 class="text-primary">{{ $t("banner.speaker") }}</h3>
<h2>
<span
class="badge text-bg-light m-1"
v-for="addressee in ticket.currentAddressees"
:key="addressee.id"
>
{{
typeof addressee.label == "string"
? addressee.label
: addressee.label.fr
}}
</span>
</h2>
</div>
</div>
</div>
</Teleport>
<div class="container-xxl pt-1" style="padding-bottom: 55px">
<ticket-selector-component :tickets="[]" />
<ticket-history-list-component :history="ticket.history" />
</div>
@ -7,50 +77,60 @@
</template>
<script lang="ts">
import { computed, defineComponent, inject, onMounted, ref } from 'vue';
import { useStore } from 'vuex';
import { computed, defineComponent, inject, onMounted, ref } from "vue";
import { useStore } from "vuex";
// Types
import { Motive, Ticket } from '../../types';
import { Motive, Ticket } from "../../types";
// Components
import TicketSelectorComponent from './components/TicketSelectorComponent.vue';
import TicketHistoryListComponent from './components/TicketHistoryListComponent.vue';
import ActionToolbarComponent from './components/ActionToolbarComponent.vue';
import TicketSelectorComponent from "./components/TicketSelectorComponent.vue";
import TicketHistoryListComponent from "./components/TicketHistoryListComponent.vue";
import ActionToolbarComponent from "./components/ActionToolbarComponent.vue";
import UserRenderBoxBadge from "../../../../../../ChillMainBundle/Resources/public/vuejs/_components/Entity/UserRenderBoxBadge.vue";
import { DateTime } from "../../../../../../ChillMainBundle/Resources/public/types";
export default defineComponent({
name: 'App',
name: "App",
components: {
TicketSelectorComponent,
TicketHistoryListComponent,
ActionToolbarComponent
ActionToolbarComponent,
UserRenderBoxBadge,
},
setup() {
const store = useStore();
const toast = inject('toast') as any;
const toast = inject("toast") as any;
const headline = ref({} as HTMLHeadingElement);
store.commit('setTicket', JSON.parse(window.initialTicket) as Ticket);
store.commit("setTicket", JSON.parse(window.initialTicket) as Ticket);
const motives = computed(() => store.getters.getMotives as Motive[])
const ticket = computed(() => store.getters.getTicket as Ticket)
const motives = computed(() => store.getters.getMotives as Motive[]);
const ticket = computed(() => store.getters.getTicket as Ticket);
function getSince(createdAt: DateTime) {
const today = new Date();
const date = new Date(createdAt.datetime);
const timeDiff = Math.abs(today.getTime() - date.getTime());
const daysDiff = Math.ceil(timeDiff / (1000 * 3600 * 24));
return daysDiff;
}
onMounted(async () => {
try {
await store.dispatch('fetchMotives')
await store.dispatch('fetchUserGroups')
await store.dispatch('fetchUsers')
await store.dispatch("fetchMotives");
await store.dispatch("fetchUserGroups");
await store.dispatch("fetchUsers");
} catch (error) {
toast.error(error)
};
toast.error(error);
}
});
return {
headline,
motives,
ticket,
getSince,
};
},
});

3
src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/TicketHistoryListComponent.vue
View File

@ -2,7 +2,7 @@
<div
class="card my-2 bg-light"
v-for="history_line in history"
:key="history_line.data.id"
:key="history.indexOf(history_line)"
>
<div class="card-header">
<span class="fw-bold fst-italic">
@ -12,7 +12,6 @@
history_line.by.username
}}</span>
</div>
{{history_line.event_type}}
<div class="card-body row fst-italic">
<ticket-history-person-component
:personHistory="history_line.data"

5
src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/TicketSelectorComponent.vue
View File

@ -1,5 +1,6 @@
<template>
<div class="btn-group" @click="handleClick">
<div class="d-flex justify-content-end">
<div class="btn-group" @click="handleClick">
<button type="button" class="btn btn-light dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
{{ $t('ticket.previous_tickets') }}
<span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-chill-green">
@ -9,6 +10,8 @@
</button>
</div>
</div>
</template>
<script lang="ts">

22
src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/i18n/messages.ts
View File

@ -1,4 +1,4 @@
import { multiSelectMessages } from"../../../../../../../ChillMainBundle/Resources/public/vuejs/_js/i18n";
import { multiSelectMessages } from "../../../../../../../ChillMainBundle/Resources/public/vuejs/_js/i18n";
const messages = {
fr: {
@ -18,21 +18,29 @@ const messages = {
label: "Ajouter un commentaire",
save: "Enregistrer",
succcess: "Commentaire enregistré",
},
motive: {
},
motive: {
title: "Motif",
label: "Choisir un motif",
save: "Enregistrer",
success: "Motif enregistré",
},
transfert: {
},
transfert: {
title: "Transfert",
user_group_label: "Transferer vers un groupe",
user_label: "Transferer vers un ou plusieurs utilisateurs",
save: "Enregistrer",
success: "Transfert effectué",
},
close: "Fermer"
},
close: "Fermer",
banner: {
concerned_patient: "Patient concerné",
caller: "Appelant",
speaker: "Intervenant",
open: "Ouvert",
since: "Depuis 1 jour | Depuis {days} jour(s)",
no_motive: "Pas de motif",
},
},
};
Object.assign(messages.fr, multiSelectMessages.fr);

57
src/Bundle/ChillTicketBundle/src/Resources/views/Banner/banner.html.twig
View File

@ -1,65 +1,8 @@
<div class="banner banner-ticket ">
<div id="header-ticket-main" class="header-name">
<div class="container-xxl text-primary">
<div class="row">
<div class="col-md-6 ps-md-5 ps-xxl-0 ">
<h2>
#{{ ticket.getExternalRef() }}
</h2>
<h1>
{% if ticket.getMotive() %}
{{ ticket.getMotive().label.fr }}
{% else %}
{{ ticket.getMotive() }}
<p class="chill-no-data-statement">
{{ "no_motive"|trans }}
</p>
{% endif %}
</h1>
</div>
<div class="col-md-6">
<div class="float-end">
<h1>
<span class="badge text-bg-chill-green text-white">{{'open' | trans}}</span>
</h1>
<h3 class="fst-italic">{{'since' | trans}}</h3>
</div>
</div>
</div>
</div>
</div>
<div id="header-ticket-details" class="header-details">
<div class="container-xxl">
<div class="row justify-content-between">
<div class="col-md-4 col-sm-12">
<h3 class="text-primary">{{'concerned_patient' | trans}}</h3>
<h2>
{% for person in ticket.getPersons() %}
<span class="badge text-bg-light">
{{ person.firstName }}
{{ person.lastName }}
</span>
{% endfor %}
</h2>
</div>
<div class="col-md-4 col-sm-12">
<h3 class="text-primary">{{'caller' | trans}}</h3>
<h2></h2>
</div>
<div class="col-md-4 col-sm-12">
<h3 class="text-primary">{{'speaker' | trans}}</h3>
<h2>
{% for addressee in ticket.getCurrentAddressee() %}
<span class="badge text-bg-light">
{{ addressee.label.fr }}
</span>
{% endfor %}
</h2>
</div>
</div>
</div>
</div>
</div>

2
src/Bundle/ChillTicketBundle/src/Serializer/Normalizer/TicketNormalizer.php
View File

@ -42,6 +42,8 @@ final class TicketNormalizer implements NormalizerInterface, NormalizerAwareInte
'currentInputs' => $this->normalizer->normalize($object->getCurrentInputs(), $format, ['groups' => 'read']),
'currentMotive' => $this->normalizer->normalize($object->getMotive(), $format, ['groups' => 'read']),
'history' => array_values($this->serializeHistory($object, $format, ['groups' => 'read'])),
'createdAt' => $object->getCreatedAt(),
'updatedBy' => $object->getUpdatedBy(),
];
}

6
src/Bundle/ChillTicketBundle/src/translations/messages.fr.yaml
View File

@ -1,6 +0,0 @@
concerned_patient: Patient concerné
caller: Appelant
speaker: Intervenant
open: Ouvert
since: Depuis
no_motive: Pas de motif