Remove "remove_addressee" history line

This commit is contained in:
Boris Waaub 2024-05-21 17:32:40 +02:00
parent 580a60c939
commit 0c914c9f9f
6 changed files with 128 additions and 103 deletions

View File

@ -148,7 +148,9 @@ export default defineComponent({
: ({} as Motive) : ({} as Motive)
); );
const content = ref("" as Comment["content"]); const content = ref("" as Comment["content"]);
const addressees = ref([] as Array<UserGroupOrUser>); const addressees = ref(
ticket.value.currentAddressees as Array<UserGroupOrUser>
);
async function submitAction() { async function submitAction() {
try { try {

View File

@ -13,7 +13,7 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { PropType, defineComponent, ref, watch } from "vue"; import { defineComponent, ref, watch } from "vue";
import CKEditor from "@ckeditor/ckeditor5-vue"; import CKEditor from "@ckeditor/ckeditor5-vue";
import ClassicEditor from "../../../../../../../ChillMainBundle/Resources/public/module/ckeditor5"; import ClassicEditor from "../../../../../../../ChillMainBundle/Resources/public/module/ckeditor5";

View File

@ -1,73 +1,68 @@
<template> <template>
<div class="row"> <div class="row">
<div class="col-12 col-lg-6 col-md-6 mb-2 text-center"> <div class="col-12 col-lg-6 col-md-6 text-center">
<span class="m-1"> <div class="mb-2">
<input <span
type="radio" v-for="userGroupItem in userGroups.filter(
class="btn-check" (userGroup) => userGroup.excludeKey == 'level'
name="options-outlined" )"
id="level-none" :key="userGroupItem.id"
autocomplete="off" class="m-1"
:value="{}"
v-model="userGroupLevel"
/>
<label :class="`btn btn-outline-primary`" for="level-none">
Aucun
</label>
</span>
<span
v-for="userGroupItem in userGroups.filter(
(userGroup) => userGroup.excludeKey == 'level'
)"
:key="userGroupItem.id"
class="m-1"
>
<input
type="radio"
class="btn-check"
name="options-outlined"
:id="`level-${userGroupItem.id}`"
autocomplete="off"
:value="userGroupItem"
v-model="userGroupLevel"
/>
<label
:class="`btn btn-${userGroupItem.id}`"
:for="`level-${userGroupItem.id}`"
:style="getUserGroupBtnColor(userGroupItem)"
> >
{{ userGroupItem.label.fr }} <input
</label> type="radio"
</span> class="btn-check"
</div> name="options-outlined"
<div class="col-12 col-lg-6 col-md-6 mb-2 text-center"> :id="`level-${userGroupItem.id}`"
<span autocomplete="off"
v-for="userGroupItem in userGroups.filter( :value="userGroupItem"
(userGroup) => userGroup.excludeKey == '' v-model="userGroupLevel"
)" @click="
:key="userGroupItem.id" Object.values(userGroupLevel).includes(
class="m-1" userGroupItem.id
> )
<input ? (userGroupLevel = {})
type="checkbox" : (userGroupLevel = userGroupItem)
class="btn-check" "
name="options-outlined" />
:id="`user-group-${userGroupItem.id}`" <label
autocomplete="off" :class="`btn btn-${userGroupItem.id}`"
:value="userGroupItem" :for="`level-${userGroupItem.id}`"
v-model="userGroup" :style="getUserGroupBtnColor(userGroupItem)"
/> >
<label {{ userGroupItem.label.fr }}
:class="`btn btn-${userGroupItem.id}`" </label>
:for="`user-group-${userGroupItem.id}`" </span>
:style="getUserGroupBtnColor(userGroupItem)" </div>
<div class="mb-2">
<span
v-for="userGroupItem in userGroups.filter(
(userGroup) => userGroup.excludeKey == ''
)"
:key="userGroupItem.id"
class="m-1"
> >
{{ userGroupItem.label.fr }} <input
</label> type="checkbox"
</span> class="btn-check"
name="options-outlined"
:id="`user-group-${userGroupItem.id}`"
autocomplete="off"
:value="userGroupItem"
v-model="userGroup"
/>
<label
:class="`btn btn-${userGroupItem.id}`"
:for="`user-group-${userGroupItem.id}`"
:style="getUserGroupBtnColor(userGroupItem)"
>
{{ userGroupItem.label.fr }}
</label>
</span>
</div>
</div> </div>
<div class="col-12 col-lg-6 col-md-6 mb-2 text-center"> <div class="col-12 col-lg-6 col-md-6 mb-2 mb-2 text-center">
<add-persons <add-persons
:options="addPersonsOptions" :options="addPersonsOptions"
key="add-person-ticket" key="add-person-ticket"
@ -76,11 +71,11 @@
ref="addPersons" ref="addPersons"
@addNewPersons="addNewEntity" @addNewPersons="addNewEntity"
/> />
</div> <div class="mb-2">
<div class="col-12 col-lg-6 col-md-6 mb-2 mb-2 text-center"> <span class="badge text-bg-light m-1" v-for="user in users">
<span class="badge text-bg-light m-1" v-for="user in users"> {{ user.username }}
{{ user.username }} </span>
</span> </div>
</div> </div>
</div> </div>
</template> </template>
@ -122,12 +117,26 @@ export default defineComponent({
emits: ["update:modelValue"], emits: ["update:modelValue"],
setup(props, ctx) { setup(props, ctx) {
// Cant use UserGroupOrUser[] because of TS2367 const addressees = ref(props.modelValue as UserGroupOrUser[]);
// TS2367: This comparison appears to be unintentional because the types '"user" | "chill_main_user_group"' and '"user_group"' have no overlap. const userGroups = props.modelValue.filter(
const addressees = ref(props.modelValue as any[]); (addressee) => addressee.type == "user_group"
const userGroupLevel = ref({} as UserGroupOrUser); ) as UserGroup[];
const userGroup = ref([] as UserGroupOrUser[]);
const users = ref([] as User[]); const userGroupLevel = ref(
userGroups.filter(
(userGroup) => userGroup.excludeKey == "level"
)[0] as UserGroup | {}
);
const userGroup = ref(
userGroups.filter((userGroup) => userGroup.excludeKey == "") as
| UserGroup[]
| []
);
const users = ref(
props.modelValue.filter((addressee) => addressee.type == "user") as
| User[]
| []
);
const addPersons = ref(); const addPersons = ref();
const { t } = useI18n(); const { t } = useI18n();
@ -167,16 +176,19 @@ export default defineComponent({
watch(userGroupLevel, (userGroupLevelAdd, userGroupLevelRem) => { watch(userGroupLevel, (userGroupLevelAdd, userGroupLevelRem) => {
if (userGroupLevelRem) { if (userGroupLevelRem) {
addressees.value.splice( addressees.value.splice(
addressees.value.indexOf(userGroupLevelRem), addressees.value.indexOf(userGroupLevelRem as UserGroup),
1 1
); );
} }
addressees.value.push(userGroupLevelAdd); addressees.value.push(userGroupLevelAdd as UserGroup);
ctx.emit("update:modelValue", addressees.value); ctx.emit("update:modelValue", addressees.value);
}); });
watch(userGroup, (userGroupAdd) => { watch(userGroup, (userGroupAdd) => {
addressees.value = addressees.value.filter( const userGroups = addressees.value.filter(
(addressee) => addressee.type === "user_group"
) as UserGroup[];
addressees.value = userGroups.filter(
(addressee) => addressee.excludeKey !== "" (addressee) => addressee.excludeKey !== ""
); );
addressees.value = [...addressees.value, ...userGroupAdd]; addressees.value = [...addressees.value, ...userGroupAdd];

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="col-12" > <div class="col-12">
<i class="fa fa-paper-plane" v-if="event_type === 'add_addressee'"></i> <i class="fa fa-paper-plane"></i>
<i class="fa fa-paper-plane-o" v-else></i>
<span class="mx-1" v-if="addressee.type == 'user_group'"> <span class="mx-1" v-if="addressee.type == 'user_group'">
{{ {{
$t(`history.${event_type}_user_group`, { $t(`history.${event_type}_user_group`, {

View File

@ -42,7 +42,10 @@
v-for="addressee in history_line" v-for="addressee in history_line"
:key="history_line.indexOf(addressee)" :key="history_line.indexOf(addressee)"
> >
<ticket-history-addressee-component :addresseeHistory="addressee.data" :event_type="addressee.event_type"/> <ticket-history-addressee-component
:addresseeHistory="addressee.data"
:event_type="addressee.event_type"
/>
</div> </div>
</template> </template>
</div> </div>

View File

@ -7,37 +7,45 @@ export interface State {
ticket: Ticket; ticket: Ticket;
} }
export const moduleTicket: Module<State, RootState> ={ export const moduleTicket: Module<State, RootState> = {
state: () => ({ state: () => ({
ticket: {} as Ticket, ticket: {} as Ticket,
}), }),
getters: { getters: {
getTicket(state) { getTicket(state) {
return state.ticket; return state.ticket;
}, },
getDistinctAddressesHistory(state) { getDistinctAddressesHistory(state) {
const addresseeHistory = state.ticket.history.reduce((result, item) => { const addresseeHistory = state.ticket.history.reduce(
const { datetime } = item.at; (result, item) => {
if (!["add_addressee","remove_addressee"].includes(item.event_type)) { const { datetime } = item.at;
result[datetime] = item if (
!["add_addressee", "remove_addressee"].includes(
item.event_type
)
) {
result[datetime] = item;
return result;
}
if (!result[datetime]) {
result[datetime] = [];
}
if (item.event_type === "add_addressee") {
result[datetime].push(item);
}
return result; return result;
} },
{} as any
if (!result[datetime]) { );
result[datetime] = [];
}
result[datetime].push(item);
return result;
}, {} as any);
return Object.values(addresseeHistory) as Array<Ticket["history"]>; return Object.values(addresseeHistory) as Array<Ticket["history"]>;
} },
}, },
mutations: { mutations: {
setTicket(state, ticket) { setTicket(state, ticket) {
state.ticket = ticket; state.ticket = ticket;
} },
},
actions: {
}, },
actions: {},
}; };