116 lines
3.6 KiB
Vue
116 lines
3.6 KiB
Vue
<script setup>
|
|
import {
|
|
NModal, NList, NListItem, NThing, NAvatar, NIcon,
|
|
NText, NDivider, NFlex, NButton, NScrollbar, NEmpty, NSpin
|
|
} from 'naive-ui'
|
|
import {useReportStore} from "../../../Stores/report.js";
|
|
import { TbAlertCircle, TbPencil, TbTrashX } from 'vue-icons-plus/tb'
|
|
import {ref, watch} from "vue";
|
|
|
|
const props = defineProps({
|
|
departmentId: {
|
|
required: true
|
|
},
|
|
startAt: {
|
|
required: true
|
|
},
|
|
endAt: {
|
|
required: true
|
|
}
|
|
})
|
|
|
|
const open = defineModel('open')
|
|
const loading = ref(true)
|
|
|
|
const unwantedEvents = ref([])
|
|
const fetchUnwantedEvents = () => {
|
|
loading.value = true
|
|
axios.get('/api/statistics/reports/unwanted-events', {
|
|
params: {
|
|
departmentId: props.departmentId,
|
|
startAt: props.startAt,
|
|
endAt: props.endAt
|
|
}
|
|
})
|
|
.then(res => {
|
|
unwantedEvents.value = res.data
|
|
})
|
|
.finally(() => {
|
|
loading.value = false
|
|
})
|
|
}
|
|
|
|
watch(() => [props.departmentId, props.endAt, props.startAt], () => {
|
|
if (props.departmentId && props.endAt && props.startAt) {
|
|
fetchUnwantedEvents()
|
|
}
|
|
}, {
|
|
immediate: true,
|
|
deep: true
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<NModal v-model:show="open"
|
|
title="Нежелательные события"
|
|
preset="card"
|
|
:mask-closable="false"
|
|
:close-on-esc="false"
|
|
class="max-w-4xl overflow-clip h-[calc(100vh-220px)]"
|
|
>
|
|
<template v-if="loading">
|
|
<div class="flex items-center justify-center h-full">
|
|
<NSpin />
|
|
</div>
|
|
</template>
|
|
<template v-else-if="unwantedEvents.length">
|
|
<NScrollbar class="max-h-[calc(100vh-282px)] pr-3">
|
|
<NList>
|
|
<NListItem v-for="event in unwantedEvents">
|
|
<NThing>
|
|
<template #avatar>
|
|
<NAvatar>
|
|
<NIcon>
|
|
<TbAlertCircle class="text-red-400" />
|
|
</NIcon>
|
|
</NAvatar>
|
|
</template>
|
|
<template #header>
|
|
{{ event.title }}
|
|
</template>
|
|
<template #description>
|
|
<NText depth="3">
|
|
{{ event.created_at }}
|
|
</NText>
|
|
</template>
|
|
<NText>
|
|
{{ event.comment }}
|
|
</NText>
|
|
</NThing>
|
|
</NListItem>
|
|
</NList>
|
|
</NScrollbar>
|
|
</template>
|
|
<template v-else>
|
|
<div class="h-full flex items-center justify-center">
|
|
<NEmpty description="Нежелательные события не найдены!" />
|
|
</div>
|
|
</template>
|
|
|
|
<!-- <template #action>-->
|
|
<!-- <NFlex id="modal-action" align="center" justify="space-between">-->
|
|
<!-- <NButton type="primary" secondary @click="onCreateEvent()">-->
|
|
<!-- <template #icon>-->
|
|
<!-- <TbCirclePlus />-->
|
|
<!-- </template>-->
|
|
<!-- Создать событие-->
|
|
<!-- </NButton>-->
|
|
<!-- </NFlex>-->
|
|
<!-- </template>-->
|
|
</NModal>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|