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

refactor:테넌트 리스트 레이아웃 재구성

Browse Source 
- 진행 현황을 2분할 grid로 변경 (영업/매니저 | 본사진행)
- 담당자 드롭다운을 업체명 옆 왼쪽으로 이동 (overflow 방지)
- 모든 @click → x-on:click 변경 (Blade 충돌 방지)
- 본사 진행 비활성화 시 "대기" 간략 표시

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
pro
2026-01-29 14:31:08 +09:00
parent aa89be21fc
commit 7b347aae38
2 changed files with 68 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -53,8 +53,8 @@
}" class="relative">
{{-- 드롭다운 트리거 --}}
<button
@click="toggle()"
@click.outside="close()"
x-on:click="toggle()"
x-on:click.outside="close()"
type="button"
class="inline-flex items-center gap-1 px-2.5 py-1 rounded text-xs font-medium transition-colors"
:class="isOpen ? 'bg-blue-100 text-blue-800 border border-blue-300' : 'bg-blue-50 text-blue-700 border border-blue-200 hover:bg-blue-100'">
@@ -79,12 +79,12 @@ class="inline-flex items-center gap-1 px-2.5 py-1 rounded text-xs font-medium tr
x-transition:leave-start="transform opacity-100 scale-100"
x-transition:leave-end="transform opacity-0 scale-95"
class="absolute z-50 mt-1 w-56 bg-white rounded-lg shadow-lg border border-gray-200 py-1"
@click.stop
x-on:click.stop
>
{{-- 본인 옵션 --}}
<button
type="button"
@click="selectManager(0, '{{ auth()->user()->name }}')"
x-on: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">
@@ -110,7 +110,7 @@ class="w-full flex items-center gap-3 px-4 py-2 text-left text-sm hover:bg-gray-
<template x-for="manager in managers" :key="manager.id">
<button
type="button"
@click="selectManager(manager.id, manager.name)"
x-on: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">

128
resources/views/sales/dashboard/partials/tenant-list.blade.php
View File

@@ -75,10 +75,8 @@
@else
<!-- 테이블 헤더 -->
<div class="hidden lg:grid lg:grid-cols-12 gap-2 px-4 py-3 text-xs font-medium text-gray-500 border-b border-gray-200">
<div class="col-span-2">업체명</div>
<div class="col-span-1">담당자</div>
<div class="col-span-2 text-center">영업/매니저</div>
<div class="col-span-3 text-center">본사 진행</div>
<div class="col-span-3">업체명 / 담당자</div>
<div class="col-span-5 text-center">진행 현황 (영업/매니저 | 본사)</div>
<div class="col-span-1 text-center">수당</div>
<div class="col-span-3 text-center">관리</div>
</div>
@@ -97,76 +95,76 @@
<div class="tenant-row" data-tenant-id="{{ $tenant->id }}">
<!-- 메인 행 -->
<div class="grid grid-cols-1 lg:grid-cols-12 gap-2 px-4 py-3 items-center hover:bg-gray-50 transition-colors">
<!-- 업체명 -->
<div class="col-span-2 flex items-center gap-2">
<button type="button" @click="toggleDetail($event)" class="text-gray-400 hover:text-gray-600 transition-colors flex-shrink-0">
<!-- 업체명 + 담당자 (왼쪽) -->
<div class="col-span-3 flex items-center gap-2">
<button type="button" x-on:click="toggleDetail($event)" class="text-gray-400 hover:text-gray-600 transition-colors flex-shrink-0">
<svg class="w-4 h-4 transform transition-transform" 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>
<div class="min-w-0">
<div class="min-w-0 flex-1">
<div class="font-semibold text-gray-900 text-sm truncate">{{ $tenant->company_name }}</div>
<div class="text-xs text-gray-500 truncate">
{{ $tenant->phone ?? '-' }}
</div>
<div class="text-xs text-gray-500 truncate">{{ $tenant->phone ?? '-' }}</div>
</div>
{{-- 담당자 드롭다운 (왼쪽 배치) --}}
<div class="flex-shrink-0">
@include('sales.dashboard.partials.manager-dropdown', ['tenant' => $tenant])
</div>
</div>
<!-- 담당자 -->
<div class="col-span-1">
@include('sales.dashboard.partials.manager-dropdown', ['tenant' => $tenant])
</div>
<!-- 영업/매니저 진행률 (1행 표시) -->
<div class="col-span-2 flex items-center gap-3" id="progress-{{ $tenant->id }}">
{{-- 영업 --}}
<div class="flex-1 flex items-center gap-1" title="영업 {{ $progress['sales']['percentage'] }}%">
<span class="text-xs font-medium text-blue-600 w-6 flex-shrink-0">영업</span>
<div class="flex-1 bg-gray-200 rounded-full h-1.5 min-w-0">
<div class="bg-blue-500 h-1.5 rounded-full transition-all" id="sales-bar-{{ $tenant->id }}" style="width: {{ $progress['sales']['percentage'] }}%"></div>
</div>
<span class="text-xs text-gray-500 w-7 text-right flex-shrink-0" id="sales-pct-{{ $tenant->id }}">{{ $progress['sales']['percentage'] }}%</span>
</div>
{{-- 매니저 --}}
<div class="flex-1 flex items-center gap-1" title="매니저 {{ $progress['manager']['percentage'] }}%">
<span class="text-xs font-medium text-green-600 w-6 flex-shrink-0">매니</span>
<div class="flex-1 bg-gray-200 rounded-full h-1.5 min-w-0">
<div class="bg-green-500 h-1.5 rounded-full transition-all" id="manager-bar-{{ $tenant->id }}" style="width: {{ $progress['manager']['percentage'] }}%"></div>
</div>
<span class="text-xs text-gray-500 w-7 text-right flex-shrink-0" id="manager-pct-{{ $tenant->id }}">{{ $progress['manager']['percentage'] }}%</span>
</div>
</div>
<!-- 본사 진행 상태 (7단계 스텝 인디케이터) -->
<div class="col-span-3">
@if($isHqEnabled)
<div class="flex items-center gap-0.5">
@foreach($hqStatuses as $statusKey => $statusLabel)
@php
$stepNum = $hqStatusOrder[$statusKey];
$isCompleted = $stepNum < $currentHqStep;
$isCurrent = $stepNum === $currentHqStep;
@endphp
<div class="group relative flex-1">
<div class="h-1.5 rounded-full transition-all {{ $isCompleted ? 'bg-purple-500' : ($isCurrent ? 'bg-purple-300' : 'bg-gray-200') }}"></div>
{{-- 툴팁 --}}
<div class="absolute bottom-full left-1/2 -translate-x-1/2 mb-1 px-2 py-1 bg-gray-800 text-white text-xs rounded opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap z-10 pointer-events-none">
{{ $statusLabel }}
</div>
<!-- 진행 현황 (영업/매니저 | 본사) - 2분할 -->
<div class="col-span-5" id="progress-{{ $tenant->id }}">
<div class="grid grid-cols-2 gap-4">
{{-- 좌측: 영업/매니저 진행률 --}}
<div class="space-y-1">
{{-- 영업 --}}
<div class="flex items-center gap-1" title="영업 {{ $progress['sales']['percentage'] }}%">
<span class="text-xs font-medium text-blue-600 w-6 flex-shrink-0">영업</span>
<div class="flex-1 bg-gray-200 rounded-full h-1.5 min-w-0">
<div class="bg-blue-500 h-1.5 rounded-full transition-all" id="sales-bar-{{ $tenant->id }}" style="width: {{ $progress['sales']['percentage'] }}%"></div>
</div>
@endforeach
<span class="text-xs text-gray-500 w-8 text-right flex-shrink-0" id="sales-pct-{{ $tenant->id }}">{{ $progress['sales']['percentage'] }}%</span>
</div>
{{-- 매니저 --}}
<div class="flex items-center gap-1" title="매니저 {{ $progress['manager']['percentage'] }}%">
<span class="text-xs font-medium text-green-600 w-6 flex-shrink-0">매니</span>
<div class="flex-1 bg-gray-200 rounded-full h-1.5 min-w-0">
<div class="bg-green-500 h-1.5 rounded-full transition-all" id="manager-bar-{{ $tenant->id }}" style="width: {{ $progress['manager']['percentage'] }}%"></div>
</div>
<span class="text-xs text-gray-500 w-8 text-right flex-shrink-0" id="manager-pct-{{ $tenant->id }}">{{ $progress['manager']['percentage'] }}%</span>
</div>
</div>
<div class="text-xs text-purple-600 font-medium mt-1 text-center">{{ $management->hq_status_label }}</div>
@else
<div class="text-xs text-gray-400 text-center">
<span class="inline-flex items-center gap-1">
<svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
</svg>
매니저 100% 완료 시 활성화
</span>
{{-- 우측: 본사 진행 상태 --}}
<div>
@if($isHqEnabled)
<div class="flex items-center gap-0.5">
@foreach($hqStatuses as $statusKey => $statusLabel)
@php
$stepNum = $hqStatusOrder[$statusKey];
$isCompleted = $stepNum < $currentHqStep;
$isCurrent = $stepNum === $currentHqStep;
@endphp
<div class="group relative flex-1">
<div class="h-1.5 rounded-full transition-all {{ $isCompleted ? 'bg-purple-500' : ($isCurrent ? 'bg-purple-300' : 'bg-gray-200') }}"></div>
<div class="absolute bottom-full left-1/2 -translate-x-1/2 mb-1 px-2 py-1 bg-gray-800 text-white text-xs rounded opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap z-10 pointer-events-none">
{{ $statusLabel }}
</div>
</div>
@endforeach
</div>
<div class="text-xs text-purple-600 font-medium mt-0.5 text-center">{{ $management->hq_status_label }}</div>
@else
<div class="flex items-center h-full">
<span class="text-xs text-gray-400 flex items-center gap-1">
<svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
</svg>
대기
</span>
</div>
@endif
</div>
@endif
</div>
</div>
<!-- 수당 지급 상태 -->
@@ -193,7 +191,7 @@
<div class="col-span-3 flex items-center justify-center gap-1">
{{-- 영업 진행 버튼 --}}
<button
@click="openScenarioModal({{ $tenant->id }}, 'sales')"
x-on:click="openScenarioModal({{ $tenant->id }}, 'sales')"
class="inline-flex items-center gap-1 px-2 py-1 rounded text-xs font-medium bg-blue-600 text-white hover:bg-blue-700 transition-colors"
title="영업 시나리오">
<svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -204,7 +202,7 @@ class="inline-flex items-center gap-1 px-2 py-1 rounded text-xs font-medium bg-b
{{-- 매니저 진행 버튼 --}}
<button
@click="openScenarioModal({{ $tenant->id }}, 'manager')"
x-on:click="openScenarioModal({{ $tenant->id }}, 'manager')"
class="inline-flex items-center gap-1 px-2 py-1 rounded text-xs font-medium bg-green-600 text-white hover:bg-green-700 transition-colors"
title="매니저 시나리오">
<svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">