SamProject/sam-manage
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix:매니저 드롭다운 API 호출 제거, 서버사이드 렌더링으로 변경

Browse Source 
- 기존: 드롭다운 열 때 API 호출 → 로딩 스피너 문제
- 변경: 컨트롤러에서 allManagers 전달 → 즉시 렌더링
- 로딩 상태 제거로 UX 개선

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
pro
2026-01-29 07:05:45 +09:00
parent f1f9ff4148
commit 0a0afe1df0
2 changed files with 48 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
app/Http/Controllers/Sales/SalesDashboardController.php
View File

@@ -117,6 +117,12 @@ private function getDashboardData(Request $request): array
->get()
->keyBy('tenant_id');
// HQ 매니저 목록 (드롭다운용) - 본인 제외
$allManagers = User::whereHas('tenants', function ($query) {
$query->where('tenant_type', 'HQ');
})->where('id', '!=', auth()->id())
->get(['id', 'name', 'email']);
return compact(
'stats',
'commissionByRole',
@@ -124,6 +130,7 @@ private function getDashboardData(Request $request): array
'tenantStats',
'tenants',
'managements',
'allManagers',
'period',
'year',
'month',

112
resources/views/sales/dashboard/partials/manager-dropdown.blade.php
View File

@@ -4,9 +4,11 @@
$assignedManager = $management?->manager;
$isSelf = !$assignedManager || $assignedManager->id === auth()->id();
$managerName = $assignedManager?->name ?? '본인';
// 매니저 목록 JSON (본인 제외는 컨트롤러에서 처리됨)
$managersJson = $allManagers->map(fn($m) => ['id' => $m->id, 'name' => $m->name, 'email' => $m->email])->values()->toJson();
@endphp
<div x-data="managerDropdown({{ $tenant->id }}, {{ json_encode($assignedManager ? ['id' => $assignedManager->id, 'name' => $assignedManager->name, 'is_self' => $isSelf] : null) }})" class="relative">
<div x-data="managerDropdown({{ $tenant->id }}, {{ json_encode($assignedManager ? ['id' => $assignedManager->id, 'name' => $assignedManager->name, 'is_self' => $isSelf] : null) }}, {{ $managersJson }})" class="relative">
{{-- 드롭다운 트리거 --}}
<button
@click="toggle()"
@@ -36,106 +38,74 @@ class="inline-flex items-center gap-1 px-2.5 py-1 rounded text-xs font-medium tr
class="absolute z-50 mt-1 w-56 bg-white rounded-lg shadow-lg border border-gray-200 py-1"
@click.stop
>
{{-- 로딩 상태 --}}
<div x-show="loading" class="px-4 py-3 text-center">
<svg class="w-5 h-5 mx-auto animate-spin text-blue-600" fill="none" viewBox="0 0 24 24">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
{{-- 본인 옵션 --}}
<button
@click="selectManager(0, '{{ auth()->user()->name }}')"
class="w-full flex items-center gap-3 px-4 py-2 text-left text-sm hover:bg-gray-50 transition-colors"
:class="(currentManager?.is_self || !currentManager) && 'bg-blue-50'">
<div class="flex-shrink-0 w-8 h-8 bg-blue-100 rounded-full flex items-center justify-center">
<svg class="w-4 h-4 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
</svg>
</div>
<div class="flex-1">
<div class="font-medium text-gray-900">본인</div>
<div class="text-xs text-gray-500">{{ auth()->user()->name }}</div>
</div>
<svg x-show="currentManager?.is_self || !currentManager" class="w-4 h-4 text-blue-600" 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>
</div>
</button>
{{-- 매니저 목록 --}}
<div x-show="!loading">
{{-- 본인 옵션 --}}
{{-- 구분선 (다른 매니저가 있을 때만) --}}
<template x-if="managers.length > 0">
<div class="border-t border-gray-100 my-1"></div>
</template>
{{-- 다른 매니저 목록 --}}
<template x-for="manager in managers" :key="manager.id">
<button
@click="selectManager(0, '{{ auth()->user()->name }}')"
@click="selectManager(manager.id, manager.name)"
class="w-full flex items-center gap-3 px-4 py-2 text-left text-sm hover:bg-gray-50 transition-colors"
:class="(currentManager?.is_self || !currentManager) && 'bg-blue-50'">
<div class="flex-shrink-0 w-8 h-8 bg-blue-100 rounded-full flex items-center justify-center">
<svg class="w-4 h-4 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
</svg>
:class="currentManager?.id === manager.id && !currentManager?.is_self && 'bg-blue-50'">
<div class="flex-shrink-0 w-8 h-8 bg-gray-100 rounded-full flex items-center justify-center">
<span class="text-sm font-medium text-gray-600" x-text="manager.name.charAt(0)"></span>
</div>
<div class="flex-1">
<div class="font-medium text-gray-900">본인</div>
<div class="text-xs text-gray-500">{{ auth()->user()->name }}</div>
<div class="font-medium text-gray-900" x-text="manager.name"></div>
<div class="text-xs text-gray-500" x-text="manager.email"></div>
</div>
<svg x-show="currentManager?.is_self || !currentManager" class="w-4 h-4 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<svg x-show="currentManager?.id === manager.id && !currentManager?.is_self" class="w-4 h-4 text-blue-600" 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>
</template>
{{-- 구분선 --}}
<div class="border-t border-gray-100 my-1"></div>
{{-- 다른 매니저 목록 --}}
<template x-for="manager in managers" :key="manager.id">
<button
@click="selectManager(manager.id, manager.name)"
class="w-full flex items-center gap-3 px-4 py-2 text-left text-sm hover:bg-gray-50 transition-colors"
:class="currentManager?.id === manager.id && !currentManager?.is_self && 'bg-blue-50'">
<div class="flex-shrink-0 w-8 h-8 bg-gray-100 rounded-full flex items-center justify-center">
<span class="text-sm font-medium text-gray-600" x-text="manager.name.charAt(0)"></span>
</div>
<div class="flex-1">
<div class="font-medium text-gray-900" x-text="manager.name"></div>
<div class="text-xs text-gray-500" x-text="manager.email"></div>
</div>
<svg x-show="currentManager?.id === manager.id && !currentManager?.is_self" class="w-4 h-4 text-blue-600" 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>
</template>
{{-- 매니저가 없을 때 --}}
<div x-show="managers.length === 0 && !loading" class="px-4 py-3 text-sm text-gray-500 text-center">
{{-- 매니저가 없을 때 --}}
<template x-if="managers.length === 0">
<div class="px-4 py-3 text-sm text-gray-500 text-center border-t border-gray-100">
등록된 매니저가 없습니다.
</div>
</div>
</template>
</div>
</div>
<script>
function managerDropdown(tenantId, initialManager) {
function managerDropdown(tenantId, initialManager, initialManagers) {
return {
tenantId: tenantId,
isOpen: false,
loading: false,
managers: [],
managers: initialManagers || [],
currentManager: initialManager,
toggle() {
this.isOpen = !this.isOpen;
if (this.isOpen && this.managers.length === 0) {
this.loadManagers();
}
},
close() {
this.isOpen = false;
},
async loadManagers() {
this.loading = true;
try {
// HQ 테넌트의 매니저 목록 조회 (본인 제외)
const response = await fetch('{{ route('sales.managers.list') }}', {
headers: {
'Accept': 'application/json',
'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content,
},
});
const result = await response.json();
// 본인을 제외한 목록
this.managers = (result.managers || []).filter(m => m.id !== {{ auth()->id() }});
} catch (error) {
console.error('매니저 목록 조회 실패:', error);
this.managers = [];
} finally {
this.loading = false;
}
},
async selectManager(managerId, managerName) {
try {
const response = await fetch(`/sales/tenants/${this.tenantId}/assign-manager`, {