82 lines
2.8 KiB
Vue
82 lines
2.8 KiB
Vue
<script setup>
|
||
import {NFlex, NTag, NTooltip} from 'naive-ui'
|
||
import {percentType, typePlan} from "../../../Utils/numbers.js";
|
||
|
||
const props = defineProps({
|
||
isTotalRow: {
|
||
type: Boolean,
|
||
default: false
|
||
},
|
||
value: {
|
||
type: [Number, String],
|
||
default: ''
|
||
},
|
||
plan: {
|
||
type: Object,
|
||
default: () => ({
|
||
actual_to_date: 0,
|
||
cumulative_plan: 0,
|
||
current_mouth_dept: 0,
|
||
debt_from_year: 0,
|
||
month_plan: 0,
|
||
outcome_in_current_mouth: 0,
|
||
total_debt: 0,
|
||
year_plan: 0,
|
||
})
|
||
}
|
||
})
|
||
</script>
|
||
|
||
<template>
|
||
<NFlex align="center" justify="center" class="relative!">
|
||
<!-- <NTooltip v-if="needCompletedToPlan && !isTotalRow"-->
|
||
<!-- trigger="hover"-->
|
||
<!-- :arrow="false"-->
|
||
<!-- >-->
|
||
<!-- <template #trigger>-->
|
||
<!-- <NTag :type="typePlan(planOfYear, needCompletedToPlan)"-->
|
||
<!-- round-->
|
||
<!-- :bordered="false"-->
|
||
<!-- size="tiny"-->
|
||
<!-- class="absolute! -left-1.5 bottom-2.5 text-xs"-->
|
||
<!-- >-->
|
||
<!-- {{ needCompletedToPlan }}-->
|
||
<!-- </NTag>-->
|
||
<!-- </template>-->
|
||
<!-- Требуется выписать в текущем месяце-->
|
||
<!-- </NTooltip>-->
|
||
<div>
|
||
{{ value }}
|
||
</div>
|
||
<NTooltip v-if="plan && !isTotalRow"
|
||
trigger="hover"
|
||
:arrow="false"
|
||
>
|
||
<template #trigger>
|
||
<NTag :type="percentType(plan.cumulative_percent)"
|
||
round
|
||
:bordered="false"
|
||
size="tiny"
|
||
class="absolute! -right-1.5 bottom-2.5 text-xs"
|
||
>
|
||
{{ plan.cumulative_percent }}%
|
||
</NTag>
|
||
</template>
|
||
<NFlex align="center" justify="start" :wrap="false" size="small">
|
||
<NTag size="small" round type="info" :bordered="false">План на месяц: {{ plan.month_plan }}</NTag>
|
||
<NTag v-if="plan.current_mouth_dept === 0" size="small" round type="success" :bordered="false">Выполнен</NTag>
|
||
<NTag v-else size="small" round type="warning" :bordered="false">Не выполнен</NTag>
|
||
</NFlex>
|
||
Сначала года + текущий месяц:
|
||
<br>План:
|
||
<span class="font-medium">{{ plan.cumulative_plan }}</span>, долг:
|
||
<span class="font-medium">{{ plan.debt_from_year }}</span> +
|
||
<span class="font-medium">{{ plan.current_mouth_dept }}</span>
|
||
</NTooltip>
|
||
</NFlex>
|
||
</template>
|
||
|
||
<style scoped>
|
||
|
||
</style>
|