summaryrefslogtreecommitdiff
path: root/components/ModelReportsList.vue
diff options
context:
space:
mode:
Diffstat (limited to 'components/ModelReportsList.vue')
-rw-r--r--components/ModelReportsList.vue39
1 files changed, 39 insertions, 0 deletions
diff --git a/components/ModelReportsList.vue b/components/ModelReportsList.vue
new file mode 100644
index 0000000..a46e6d1
--- /dev/null
+++ b/components/ModelReportsList.vue
@@ -0,0 +1,39 @@
+<template lang="pug">
+ .shadow-sm.rounded-lg.bg-white.p-4.w-full.mb-5(v-if="warnings.length")
+ h2.text-xl.font-bold(v-if="me && me.is_staff") Reports
+ h2.text-xl.font-bold(v-else) My reports
+
+ ul.divide-y.divide-gray-200.rounded-md.border.border-gray-200.mt-3(role="list" v-if="me && !me.is_staff")
+ li.py-3.pl-3.pr-4.text-sm(v-for="warning in warnings" :key="warning.id")
+ h3.flex.leading-6.mb-2.float-right
+ <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="mr-2 w-6 h-6">
+ <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z" />
+ </svg>
+ | {{ warning.created|moment("DD/MM/YYYY HH:mm") }}
+ p {{ warning.note }}
+ ul.divide-y.divide-gray-200.rounded-md.border.border-gray-200.mt-3(role="list" v-else-if="me && me.is_staff")
+ li.py-3.pl-3.pr-4.text-sm(v-for="warning in warnings" :key="warning.id")
+ h3.flex.leading-6.mb-2.float-right
+ <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="mr-2 w-6 h-6">
+ <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z" />
+ </svg>
+ | {{ warning.created|moment("DD/MM/YYYY HH:mm") }}
+ p {{ warning.note }}
+
+</template>
+
+<script>
+import { mapGetters } from "vuex";
+
+export default {
+ name: "ModelReportsList",
+ props: ["model"],
+ computed: {
+ ...mapGetters("auth", ["me"]),
+ ...mapGetters("warnings", ["warnings"]),
+ },
+ mounted() {
+ this.$store.dispatch("warnings/filterWarnings", { model_id: this.model });
+ },
+};
+</script>