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

fix:영업관리 대시보드 기간 설정 기능 추가

Browse Source
This commit is contained in:
pro
2026-01-27 19:06:36 +09:00
parent d1fb001e28
commit 7fbd04f4ee
2 changed files with 91 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -21,6 +21,15 @@ public function index(Request $request): View
$year = $request->input('year', now()->year);
$month = $request->input('month', now()->month);
// 기간 설정 모드일 경우
if ($period === 'custom') {
$startDate = $request->input('start_date', now()->startOfMonth()->format('Y-m-d'));
$endDate = $request->input('end_date', now()->format('Y-m-d'));
} else {
$startDate = now()->startOfMonth()->format('Y-m-d');
$endDate = now()->endOfMonth()->format('Y-m-d');
}
// 통계 데이터 (임시 데이터 - 추후 실제 데이터로 교체)
$stats = [
'total_membership_fee' => 0, // 총 가입비
@@ -62,7 +71,9 @@ public function index(Request $request): View
'totalCommissionRatio',
'period',
'year',
'month'
'month',
'startDate',
'endDate'
));
}
}

87
resources/views/sales/dashboard/index.blade.php
View File

@@ -109,20 +109,44 @@
<h2 class="text-lg font-bold text-gray-800">기간별 조회</h2>
</div>
<div class="flex items-center gap-3">
<div class="flex flex-wrap items-center gap-3">
<div class="inline-flex rounded-lg border border-gray-200 p-1">
<button type="button"
class="px-4 py-2 text-sm font-medium rounded-md {{ $period === 'month' ? 'bg-blue-600 text-white' : 'text-gray-600 hover:bg-gray-100' }}"
onclick="setPeriod('month')">
id="btn-month"
class="px-4 py-2 text-sm font-medium rounded-md transition-colors {{ $period === 'month' ? 'bg-blue-600 text-white' : 'text-gray-600 hover:bg-gray-100' }}"
onclick="togglePeriodMode('month')">
당월
</button>
<button type="button"
class="px-4 py-2 text-sm font-medium rounded-md {{ $period === 'custom' ? 'bg-blue-600 text-white' : 'text-gray-600 hover:bg-gray-100' }}"
onclick="setPeriod('custom')">
id="btn-custom"
class="px-4 py-2 text-sm font-medium rounded-md transition-colors {{ $period === 'custom' ? 'bg-blue-600 text-white' : 'text-gray-600 hover:bg-gray-100' }}"
onclick="togglePeriodMode('custom')">
기간 설정
</button>
</div>
<span class="text-sm text-gray-600">{{ $year }}년 {{ $month }}월</span>
<!-- 당월 표시 -->
<div id="month-display" class="{{ $period === 'custom' ? 'hidden' : '' }}">
<span class="text-sm text-gray-600">{{ $year }}년 {{ $month }}월</span>
</div>
<!-- 기간 설정 입력 -->
<div id="custom-period" class="flex items-center gap-2 {{ $period === 'month' ? 'hidden' : '' }}">
<input type="date"
id="start-date"
value="{{ $startDate ?? now()->startOfMonth()->format('Y-m-d') }}"
class="px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<span class="text-gray-500">~</span>
<input type="date"
id="end-date"
value="{{ $endDate ?? now()->format('Y-m-d') }}"
class="px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<button type="button"
onclick="applyCustomPeriod()"
class="px-4 py-2 text-sm font-medium text-white bg-blue-600 rounded-lg hover:bg-blue-700 transition-colors">
조회
</button>
</div>
</div>
</div>
@@ -197,9 +221,56 @@ class="px-4 py-2 text-sm font-medium rounded-md {{ $period === 'custom' ? 'bg-bl
@push('scripts')
<script>
function setPeriod(period) {
function togglePeriodMode(mode) {
const btnMonth = document.getElementById('btn-month');
const btnCustom = document.getElementById('btn-custom');
const monthDisplay = document.getElementById('month-display');
const customPeriod = document.getElementById('custom-period');
if (mode === 'month') {
// 당월 모드
btnMonth.classList.add('bg-blue-600', 'text-white');
btnMonth.classList.remove('text-gray-600', 'hover:bg-gray-100');
btnCustom.classList.remove('bg-blue-600', 'text-white');
btnCustom.classList.add('text-gray-600', 'hover:bg-gray-100');
monthDisplay.classList.remove('hidden');
customPeriod.classList.add('hidden');
// 당월로 이동
const url = new URL(window.location);
url.searchParams.set('period', 'month');
url.searchParams.delete('start_date');
url.searchParams.delete('end_date');
window.location = url;
} else {
// 기간 설정 모드
btnCustom.classList.add('bg-blue-600', 'text-white');
btnCustom.classList.remove('text-gray-600', 'hover:bg-gray-100');
btnMonth.classList.remove('bg-blue-600', 'text-white');
btnMonth.classList.add('text-gray-600', 'hover:bg-gray-100');
customPeriod.classList.remove('hidden');
monthDisplay.classList.add('hidden');
}
}
function applyCustomPeriod() {
const startDate = document.getElementById('start-date').value;
const endDate = document.getElementById('end-date').value;
if (!startDate || !endDate) {
alert('시작일과 종료일을 모두 선택해주세요.');
return;
}
if (startDate > endDate) {
alert('시작일은 종료일보다 이전이어야 합니다.');
return;
}
const url = new URL(window.location);
url.searchParams.set('period', period);
url.searchParams.set('period', 'custom');
url.searchParams.set('start_date', startDate);
url.searchParams.set('end_date', endDate);
window.location = url;
}
</script>