portal/app/resources/js/components/projects/ProjectLimitOverloadDialog.vue

<script setup lang="ts">
/**
 * Диалог «Проект не запущен» (Billing v2 Spec C §6.2, Task 12).
 *
 * Открывается, когда POST/PATCH /api/projects вернул 409 `balance_insufficient`.
 * Сообщает: «Проект создан, но НЕ запущен — не хватает баланса».
 * Предлагает три исхода:
 *  - «Пополнить баланс» (data-test="topup")  → закрыть + перейти в /billing;
 *  - «Уменьшить объём» (data-test="reduce")  → set-zero (родитель ставит daily_limit_target=0);
 *  - «Понятно» (data-test="close")           → закрыть без действий.
 *
 * Backward compat: события save-blocked и set-zero сохранены.
 */
export interface OverloadPayload {
    current_balance_rub: string;
    current_capacity_leads: number;
    would_be_required_leads: number;
    deficit_leads: number;
    /** Task 12: сумма пополнения в рублях, рассчитанная бэкендом */
    topup_rub?: string;
}

import { useRouter } from 'vue-router';

defineProps<{
    modelValue: boolean;
    payload: OverloadPayload | null;
}>();

const emit = defineEmits<{
    'update:modelValue': [value: boolean];
    'save-blocked': [];
    'set-zero': [];
}>();

// Косяк 06: «Пополнить» прямо из окна — закрываем и ведём в биллинг.
const router = useRouter();
function goTopup(): void {
    emit('update:modelValue', false);
    router?.push('/billing');
}
</script>

<template>
    <v-dialog :model-value="modelValue" max-width="520" @update:model-value="$emit('update:modelValue', $event)">
        <v-card v-if="payload" data-testid="overload-dialog">
            <v-card-title>Проект не запущен</v-card-title>
            <v-card-text>
                <p>
                    Проект создан, но <strong>не запущен</strong> — на балансе недостаточно средств для запуска.
                </p>
                <p class="text-medium-emphasis mt-2">
                    Чтобы запустить — пополните примерно на
                    <strong>{{ payload.topup_rub ?? payload.deficit_leads }} ₽</strong>
                    или уменьшите объём.
                </p>
                <p class="text-caption text-medium-emphasis mt-1">
                    Текущий баланс: {{ payload.current_balance_rub }} ₽
                    ({{ payload.current_capacity_leads }} лидов), нужно {{ payload.would_be_required_leads }} лидов.
                </p>
            </v-card-text>
            <v-card-actions class="flex-wrap justify-end ga-2">
                <v-btn variant="text" data-test="close" data-testid="overload-cancel" @click="$emit('update:modelValue', false)">
                    Понятно
                </v-btn>
                <v-btn variant="text" data-test="reduce" data-testid="overload-set-zero" @click="$emit('set-zero')">
                    Уменьшить объём
                </v-btn>
                <v-btn color="primary" variant="flat" data-test="topup" data-testid="overload-topup" @click="goTopup">
                    Пополнить баланс
                </v-btn>
            </v-card-actions>
        </v-card>
    </v-dialog>
</template>