mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-07 18:44:08 +00:00
display table with notifications datas, prepare others tabs to render datas
This commit is contained in:
parent
2144b247b3
commit
fc1ed8b71e
@ -12,7 +12,7 @@
|
||||
<a class="nav-link"
|
||||
:class="{'active': activeTab === 'MyWorks'}"
|
||||
@click="selectTab('MyWorks')">
|
||||
{{ $t('my_works') }}
|
||||
{{ $t('my_works.tab') }}
|
||||
<!-- <span class="badge rounded-pill bg-danger counter">2</span> -->
|
||||
</a>
|
||||
</li>
|
||||
@ -20,28 +20,28 @@
|
||||
<a class="nav-link"
|
||||
:class="{'active': activeTab === 'MyEvaluations'}"
|
||||
@click="selectTab('MyEvaluations')">
|
||||
{{ $t('my_evaluations') }}
|
||||
{{ $t('my_evaluations.tab') }}
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link"
|
||||
:class="{'active': activeTab === 'MyTasks'}"
|
||||
@click="selectTab('MyTasks')">
|
||||
{{ $t('my_task') }}
|
||||
{{ $t('my_tasks.tab') }}
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link"
|
||||
:class="{'active': activeTab === 'MyAccompanyingCourses'}"
|
||||
@click="selectTab('MyAccompanyingCourses')">
|
||||
{{ $t('my_accompanying_courses') }}
|
||||
{{ $t('my_accompanying_courses.tab') }}
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link"
|
||||
:class="{'active': activeTab === 'MyNotifications'}"
|
||||
@click="selectTab('MyNotifications')">
|
||||
{{ $t('my_notifications') }}
|
||||
{{ $t('my_notifications.tab') }}
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item loading ms-auto py-2" v-if="loading">
|
||||
@ -106,8 +106,8 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
selectTab(tab) {
|
||||
this.activeTab = tab;
|
||||
this.$store.dispatch('getByTab', tab);
|
||||
this.activeTab = tab;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,12 +1,23 @@
|
||||
<template>
|
||||
MyAccompanyingCourses
|
||||
<h3>{{ $t('my_accompanying_courses.title') }}</h3>
|
||||
<tab-table>
|
||||
<template v-slot:thead>
|
||||
</template>
|
||||
<template v-slot:tbody>
|
||||
<tr></tr>
|
||||
</template>
|
||||
</tab-table>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState, mapGetters } from "vuex";
|
||||
import TabTable from "./TabTable";
|
||||
|
||||
export default {
|
||||
name: "MyAccompanyingCourses",
|
||||
components: {
|
||||
TabTable
|
||||
},
|
||||
computed: {
|
||||
...mapState([
|
||||
'accompanyingCourses',
|
||||
|
||||
@ -1,12 +1,23 @@
|
||||
<template>
|
||||
MyEvaluations
|
||||
<h3>{{ $t('my_evaluations.title') }}</h3>
|
||||
<tab-table>
|
||||
<template v-slot:thead>
|
||||
</template>
|
||||
<template v-slot:tbody>
|
||||
<tr></tr>
|
||||
</template>
|
||||
</tab-table>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState, mapGetters } from "vuex";
|
||||
import TabTable from "./TabTable";
|
||||
|
||||
export default {
|
||||
name: "MyEvaluations",
|
||||
components: {
|
||||
TabTable
|
||||
},
|
||||
computed: {
|
||||
...mapState([
|
||||
'evaluations',
|
||||
|
||||
@ -1,12 +1,44 @@
|
||||
<template>
|
||||
MyNotifications
|
||||
<h3>{{ $t('my_notifications.title') }}</h3>
|
||||
<tab-table>
|
||||
<template v-slot:thead>
|
||||
<th scope="col">#</th>
|
||||
<th scope="col">{{ $t('Date') }}</th>
|
||||
<th scope="col">{{ $t('Subject') }}</th>
|
||||
<th scope="col">{{ $t('Entity') }}</th>
|
||||
</template>
|
||||
<template v-slot:tbody>
|
||||
<tr v-for="(n, i) in notifications.results" :key="`notify-${i}`">
|
||||
<th scope="row">{{ i+1 }}</th>
|
||||
<td>{{ $d(n.date.datetime, 'short') }}</td>
|
||||
<td>
|
||||
<span class="unread">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
{{ n.title }}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<a class="btn btn-sm btn-show"
|
||||
:href="linkEntity(n)">
|
||||
{{ $t('show_entity', { entity: getEntityName(n) }) }}
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</template>
|
||||
</tab-table>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState, mapGetters } from "vuex";
|
||||
import TabTable from "./TabTable";
|
||||
import { appMessages } from 'ChillMainAssets/vuejs/HomepageWidget/js/i18n';
|
||||
|
||||
|
||||
export default {
|
||||
name: "MyNotifications",
|
||||
components: {
|
||||
TabTable
|
||||
},
|
||||
computed: {
|
||||
...mapState([
|
||||
'notifications',
|
||||
@ -15,9 +47,36 @@ export default {
|
||||
'isNotificationsLoaded',
|
||||
])
|
||||
},
|
||||
methods: {
|
||||
getEntityName(n) {
|
||||
switch (n.relatedEntityClass) {
|
||||
case 'Chill\\ActivityBundle\\Entity\\Activity':
|
||||
return appMessages.fr.the_activity;
|
||||
case 'Chill\\PersonBundle\\Entity\\AccompanyingPeriod':
|
||||
return appMessages.fr.the_course;
|
||||
default:
|
||||
throw 'notification type unknown';
|
||||
}
|
||||
},
|
||||
linkEntity(n) {
|
||||
switch (n.relatedEntityClass) {
|
||||
case 'Chill\\ActivityBundle\\Entity\\Activity':
|
||||
return `/fr/activity/${n.relatedEntityId}/show`
|
||||
case 'Chill\\PersonBundle\\Entity\\AccompanyingPeriod':
|
||||
return `/fr/parcours/${n.relatedEntityId}`
|
||||
default:
|
||||
throw 'notification type unknown';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
span.unread {
|
||||
font-weight: bold;
|
||||
i {
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,12 +1,34 @@
|
||||
<template>
|
||||
MyTasks
|
||||
<h3>{{ $t('my_tasks.title_warning') }}</h3>
|
||||
|
||||
<tab-table>
|
||||
<template v-slot:thead>
|
||||
</template>
|
||||
<template v-slot:tbody>
|
||||
<tr></tr>
|
||||
</template>
|
||||
</tab-table>
|
||||
|
||||
<h3>{{ $t('my_tasks.title_alert') }}</h3>
|
||||
<tab-table>
|
||||
<template v-slot:thead>
|
||||
</template>
|
||||
<template v-slot:tbody>
|
||||
<tr></tr>
|
||||
</template>
|
||||
</tab-table>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState, mapGetters } from "vuex";
|
||||
import TabTable from "./TabTable";
|
||||
|
||||
export default {
|
||||
name: "MyTasks",
|
||||
components: {
|
||||
TabTable
|
||||
},
|
||||
computed: {
|
||||
...mapState([
|
||||
'tasks',
|
||||
|
||||
@ -1,12 +1,23 @@
|
||||
<template>
|
||||
MyWorks
|
||||
<h3>{{ $t('my_works.title') }}</h3>
|
||||
<tab-table>
|
||||
<template v-slot:thead>
|
||||
</template>
|
||||
<template v-slot:tbody>
|
||||
<tr></tr>
|
||||
</template>
|
||||
</tab-table>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState, mapGetters } from "vuex";
|
||||
import TabTable from "./TabTable";
|
||||
|
||||
export default {
|
||||
name: "MyWorks",
|
||||
components: {
|
||||
TabTable
|
||||
},
|
||||
computed: {
|
||||
...mapState([
|
||||
'works',
|
||||
|
||||
@ -0,0 +1,21 @@
|
||||
<template>
|
||||
<table class="table table-striped table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<slot name="thead"></slot>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<slot name="tbody"></slot>
|
||||
</tbody>
|
||||
</table>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TabTable",
|
||||
props: []
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
@ -1,10 +1,32 @@
|
||||
const appMessages = {
|
||||
fr: {
|
||||
my_works: "Actions d'accompagnement",
|
||||
my_evaluations: "Évaluations",
|
||||
my_task: "Tâches",
|
||||
my_accompanying_courses: "Parcours",
|
||||
my_notifications: "Notifications",
|
||||
my_works: {
|
||||
tab: "Actions d'accompagnement",
|
||||
title: "Mes actions d'accompagnement qui arrivent à échéance",
|
||||
},
|
||||
my_evaluations: {
|
||||
tab: "Évaluations",
|
||||
title: "Mes évaluations qui arrivent à échéance",
|
||||
},
|
||||
my_tasks: {
|
||||
tab: "Tâches",
|
||||
title_warning: "Mes tâches avec date d'échéance dépassée",
|
||||
title_alert: "Mes tâches avec date de rappel dépassée",
|
||||
},
|
||||
my_accompanying_courses: {
|
||||
tab: "Parcours",
|
||||
title: "Les parcours que l'on vient de m'attribuer",
|
||||
},
|
||||
my_notifications: {
|
||||
tab: "Notifications",
|
||||
title: "Mes notifications reçues (et non lues)",
|
||||
},
|
||||
Date: "Date",
|
||||
Subject: "Objet",
|
||||
Entity: "Associé à",
|
||||
show_entity: "Voir {entity}",
|
||||
the_activity: "l'échange",
|
||||
the_course: "le parcours"
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user