fix:단계 버튼 로직 완전 재작성

- @click → x-on:click (Blade 지시자 충돌 방지)
- 동적 색상 → 고정 색상 bg-indigo-600 (Tailwind JIT 문제 방지)
- 모든 조건 값을 @php에서 명시적 계산
- 조건 로직 단순화 ($isLastStep 불린 사용)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
pro
2026-01-29 13:59:02 +09:00
parent 20d8c774f6
commit 2fcd9c6724

View File

@@ -151,16 +151,21 @@ class="border-t border-gray-100">
{{-- 단계 이동 버튼 --}}
@php
// 버튼 조건을 위해 총 단계 수를 명시적으로 계산
$currentStepId = (int) $step['id'];
$totalSteps = count($steps);
$isLastStep = ($currentStepId >= $totalSteps);
$nextStepId = $currentStepId + 1;
$prevStepId = $currentStepId - 1;
$stepColor = $step['color'] ?? 'blue';
@endphp
<div class="flex items-center justify-between pt-4 border-t border-gray-200">
@if($step['id'] > 1)
{{-- 이전 단계 버튼 --}}
@if($currentStepId > 1)
<button type="button"
hx-get="{{ route('sales.scenarios.' . $scenarioType, $tenant->id) }}?step={{ $step['id'] - 1 }}"
hx-get="{{ route('sales.scenarios.' . $scenarioType, $tenant->id) }}?step={{ $prevStepId }}"
hx-target="#scenario-step-content"
hx-swap="innerHTML"
@click="window.dispatchEvent(new CustomEvent('step-changed', { detail: {{ $step['id'] - 1 }} }))"
x-on:click="window.dispatchEvent(new CustomEvent('step-changed', { detail: {{ $prevStepId }} }))"
class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 transition-colors">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
@@ -171,27 +176,28 @@ class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-70
<div></div>
@endif
@if($step['id'] < $totalSteps)
{{-- 다음 단계 / 완료 버튼 --}}
@if($isLastStep)
<button type="button"
hx-get="{{ route('sales.scenarios.' . $scenarioType, $tenant->id) }}?step={{ $step['id'] + 1 }}"
hx-target="#scenario-step-content"
hx-swap="innerHTML"
@click="window.dispatchEvent(new CustomEvent('step-changed', { detail: {{ $step['id'] + 1 }} }))"
class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-white bg-{{ $step['color'] }}-600 rounded-lg hover:bg-{{ $step['color'] }}-700 transition-colors">
다음 단계
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
</svg>
</button>
@else
<button type="button"
@click="window.dispatchEvent(new CustomEvent('scenario-completed', { detail: { tenantId: {{ $tenant->id }}, scenarioType: '{{ $scenarioType }}' } }))"
x-on:click="window.dispatchEvent(new CustomEvent('scenario-completed', { detail: { tenantId: {{ $tenant->id }}, scenarioType: '{{ $scenarioType }}' } }))"
class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-white bg-green-600 rounded-lg hover:bg-green-700 transition-colors">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
완료
</button>
@else
<button type="button"
hx-get="{{ route('sales.scenarios.' . $scenarioType, $tenant->id) }}?step={{ $nextStepId }}"
hx-target="#scenario-step-content"
hx-swap="innerHTML"
x-on:click="window.dispatchEvent(new CustomEvent('step-changed', { detail: {{ $nextStepId }} }))"
class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-white bg-indigo-600 rounded-lg hover:bg-indigo-700 transition-colors">
다음 단계
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
</svg>
</button>
@endif
</div>
</div>