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

fix:수당지급현황통계 필터 UI 개선 (헤더+필터 통합, 컴팩트 1줄 레이아웃, 토글 제거)

Browse Source 
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
김보곤
2026-02-20 14:13:58 +09:00
parent fb47badb18
commit 8a397b1bc6
1 changed files with 62 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

125
resources/views/finance/settlement/payment-stats.blade.php
View File

@@ -3,74 +3,68 @@
@section('title', '수당지급현황통계')
@section('content')
<div class="px-4 py-6" x-data="{ showFilters: false, activeTab: 'monthly' }">
{{-- 페이지 헤더 --}}
<div class="flex flex-col lg:flex-row lg:justify-between lg:items-center gap-4 mb-6">
<div>
<h1 class="text-2xl font-bold text-gray-800">수당지급현황통계</h1>
<p class="text-sm text-gray-500 mt-1">
{{ $filters['startYear'] }}년 {{ $filters['startMonth'] }}월 ~ {{ $filters['endYear'] }}년 {{ $filters['endMonth'] }}월 수당 종합 통계
</p>
</div>
<div class="flex items-center gap-2">
<div class="px-4 py-6" x-data="{ activeTab: 'monthly' }">
{{-- 페이지 헤더 + 필터 통합 --}}
<div class="bg-white rounded-lg shadow-sm px-4 pt-4 pb-3 mb-4">
<div class="flex items-center justify-between mb-3">
<div>
<h1 class="text-lg font-bold text-gray-800">수당지급현황통계</h1>
<p class="text-xs text-gray-400">
{{ $filters['startYear'] }}년 {{ $filters['startMonth'] }}월 ~ {{ $filters['endYear'] }}년 {{ $filters['endMonth'] }}월
</p>
</div>
<a href="{{ route('finance.settlement', ['tab' => 'payment']) }}"
class="inline-flex items-center gap-1 px-4 py-2 text-gray-600 bg-gray-100 hover:bg-gray-200 rounded-lg transition-colors text-sm">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
class="inline-flex items-center gap-1 px-3 py-1.5 text-gray-500 hover:text-gray-700 bg-gray-50 hover:bg-gray-100 rounded text-xs transition-colors">
<svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"/>
</svg>
정산관리
</a>
<button @click="showFilters = !showFilters"
class="inline-flex items-center gap-1 px-4 py-2 text-sm rounded-lg transition-colors"
:class="showFilters ? 'bg-indigo-600 text-white' : 'bg-white text-gray-700 border border-gray-300 hover:bg-gray-50'">
<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="M3 4a1 1 0 011-1h16a1 1 0 011 1v2.586a1 1 0 01-.293.707l-6.414 6.414a1 1 0 00-.293.707V17l-4 4v-6.586a1 1 0 00-.293-.707L3.293 7.293A1 1 0 013 6.586V4z"/>
</svg>
필터
</button>
</div>
</div>
{{-- 필터 패널 --}}
<div x-show="showFilters" x-collapse class="mb-6">
<form method="GET" action="{{ route('finance.settlement.payment-stats') }}" class="bg-white rounded-lg shadow-sm p-6">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4 mb-4">
<form method="GET" action="{{ route('finance.settlement.payment-stats') }}">
<div class="flex flex-wrap items-end gap-x-3 gap-y-2">
{{-- 시작 기간 --}}
<div>
<label class="block text-xs font-medium text-gray-500 mb-1">시작 기간</label>
<div class="flex gap-2">
<select name="start_year" class="flex-1 border-gray-300 rounded-lg shadow-sm text-sm focus:ring-indigo-500 focus:border-indigo-500">
<div class="flex items-end gap-1">
<div>
<label class="block text-[11px] text-gray-400 mb-0.5">시작</label>
<select name="start_year" class="h-8 rounded border-gray-300 text-sm pl-2 pr-7 focus:border-indigo-500 focus:ring-indigo-500">
@for ($y = now()->year; $y >= now()->year - 3; $y--)
<option value="{{ $y }}" {{ $filters['startYear'] == $y ? 'selected' : '' }}>{{ $y }}년</option>
@endfor
</select>
<select name="start_month" class="flex-1 border-gray-300 rounded-lg shadow-sm text-sm focus:ring-indigo-500 focus:border-indigo-500">
@for ($m = 1; $m <= 12; $m++)
<option value="{{ $m }}" {{ $filters['startMonth'] == $m ? 'selected' : '' }}>{{ $m }}월</option>
@endfor
</select>
</div>
<select name="start_month" class="h-8 rounded border-gray-300 text-sm pl-2 pr-7 focus:border-indigo-500 focus:ring-indigo-500">
@for ($m = 1; $m <= 12; $m++)
<option value="{{ $m }}" {{ $filters['startMonth'] == $m ? 'selected' : '' }}>{{ $m }}월</option>
@endfor
</select>
</div>
<span class="text-gray-300 pb-1 text-sm">~</span>
{{-- 종료 기간 --}}
<div>
<label class="block text-xs font-medium text-gray-500 mb-1">종료 기간</label>
<div class="flex gap-2">
<select name="end_year" class="flex-1 border-gray-300 rounded-lg shadow-sm text-sm focus:ring-indigo-500 focus:border-indigo-500">
<div class="flex items-end gap-1">
<div>
<label class="block text-[11px] text-gray-400 mb-0.5">종료</label>
<select name="end_year" class="h-8 rounded border-gray-300 text-sm pl-2 pr-7 focus:border-indigo-500 focus:ring-indigo-500">
@for ($y = now()->year; $y >= now()->year - 3; $y--)
<option value="{{ $y }}" {{ $filters['endYear'] == $y ? 'selected' : '' }}>{{ $y }}년</option>
@endfor
</select>
<select name="end_month" class="flex-1 border-gray-300 rounded-lg shadow-sm text-sm focus:ring-indigo-500 focus:border-indigo-500">
@for ($m = 1; $m <= 12; $m++)
<option value="{{ $m }}" {{ $filters['endMonth'] == $m ? 'selected' : '' }}>{{ $m }}월</option>
@endfor
</select>
</div>
<select name="end_month" class="h-8 rounded border-gray-300 text-sm pl-2 pr-7 focus:border-indigo-500 focus:ring-indigo-500">
@for ($m = 1; $m <= 12; $m++)
<option value="{{ $m }}" {{ $filters['endMonth'] == $m ? 'selected' : '' }}>{{ $m }}월</option>
@endfor
</select>
</div>
<div class="w-px h-6 bg-gray-200 self-end mb-1"></div>
{{-- 상태 --}}
<div>
<label class="block text-xs font-medium text-gray-500 mb-1">상태</label>
<select name="status" class="w-full border-gray-300 rounded-lg shadow-sm text-sm focus:ring-indigo-500 focus:border-indigo-500">
<label class="block text-[11px] text-gray-400 mb-0.5">상태</label>
<select name="status" class="h-8 rounded border-gray-300 text-sm pl-2 pr-7 focus:border-indigo-500 focus:ring-indigo-500">
<option value="">전체</option>
<option value="pending" {{ $filters['status'] === 'pending' ? 'selected' : '' }}>대기</option>
<option value="approved" {{ $filters['status'] === 'approved' ? 'selected' : '' }}>승인</option>
@@ -78,21 +72,21 @@ class="inline-flex items-center gap-1 px-4 py-2 text-sm rounded-lg transition-co
<option value="cancelled" {{ $filters['status'] === 'cancelled' ? 'selected' : '' }}>취소</option>
</select>
</div>
{{-- 지급유형 --}}
<div>
<label class="block text-xs font-medium text-gray-500 mb-1">지급유형</label>
<select name="payment_type" class="w-full border-gray-300 rounded-lg shadow-sm text-sm focus:ring-indigo-500 focus:border-indigo-500">
<label class="block text-[11px] text-gray-400 mb-0.5">유형</label>
<select name="payment_type" class="h-8 rounded border-gray-300 text-sm pl-2 pr-7 focus:border-indigo-500 focus:ring-indigo-500">
<option value="">전체</option>
<option value="deposit" {{ $filters['paymentType'] === 'deposit' ? 'selected' : '' }}>계약금(1차)</option>
<option value="balance" {{ $filters['paymentType'] === 'balance' ? 'selected' : '' }}>잔금(2차)</option>
<option value="deposit" {{ $filters['paymentType'] === 'deposit' ? 'selected' : '' }}>1차</option>
<option value="balance" {{ $filters['paymentType'] === 'balance' ? 'selected' : '' }}>2차</option>
</select>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
{{-- 파트너 --}}
<div>
<label class="block text-xs font-medium text-gray-500 mb-1">파트너</label>
<select name="partner_id" class="w-full border-gray-300 rounded-lg shadow-sm text-sm focus:ring-indigo-500 focus:border-indigo-500">
<label class="block text-[11px] text-gray-400 mb-0.5">파트너</label>
<select name="partner_id" class="h-8 rounded border-gray-300 text-sm pl-2 pr-7 focus:border-indigo-500 focus:ring-indigo-500">
<option value="">전체</option>
@foreach ($partners as $partner)
<option value="{{ $partner->id }}" {{ $filters['partnerId'] == $partner->id ? 'selected' : '' }}>
@@ -101,10 +95,11 @@ class="inline-flex items-center gap-1 px-4 py-2 text-sm rounded-lg transition-co
@endforeach
</select>
</div>
{{-- 매니저 --}}
<div>
<label class="block text-xs font-medium text-gray-500 mb-1">매니저</label>
<select name="manager_user_id" class="w-full border-gray-300 rounded-lg shadow-sm text-sm focus:ring-indigo-500 focus:border-indigo-500">
<label class="block text-[11px] text-gray-400 mb-0.5">매니저</label>
<select name="manager_user_id" class="h-8 rounded border-gray-300 text-sm pl-2 pr-7 focus:border-indigo-500 focus:ring-indigo-500">
<option value="">전체</option>
@foreach ($managers as $manager)
<option value="{{ $manager->id }}" {{ $filters['managerUserId'] == $manager->id ? 'selected' : '' }}>
@@ -113,18 +108,22 @@ class="inline-flex items-center gap-1 px-4 py-2 text-sm rounded-lg transition-co
@endforeach
</select>
</div>
{{-- 검색어 --}}
<div>
<label class="block text-xs font-medium text-gray-500 mb-1">검색어</label>
<input type="text" name="search" value="{{ $filters['search'] }}" placeholder="파트너명, 코드, 고객사..."
class="w-full border-gray-300 rounded-lg shadow-sm text-sm focus:ring-indigo-500 focus:border-indigo-500">
<label class="block text-[11px] text-gray-400 mb-0.5">검색</label>
<input type="text" name="search" value="{{ $filters['search'] }}" placeholder="파트너, 고객사..."
class="h-8 w-36 rounded border-gray-300 text-sm pl-2 pr-2 focus:border-indigo-500 focus:ring-indigo-500">
</div>
{{-- 버튼 --}}
<div class="flex items-end gap-2">
<button type="submit" class="flex-1 px-4 py-2 bg-indigo-600 hover:bg-indigo-700 text-white rounded-lg transition-colors text-sm">
{{-- 조회 / 초기화 --}}
<div class="flex items-end gap-1 ml-auto">
<button type="submit"
class="h-8 px-5 bg-indigo-600 hover:bg-indigo-700 text-white text-sm rounded transition-colors">
조회
</button>
<a href="{{ route('finance.settlement.payment-stats') }}" class="px-4 py-2 bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-lg transition-colors text-sm">
<a href="{{ route('finance.settlement.payment-stats') }}"
class="h-8 px-3 inline-flex items-center bg-gray-100 hover:bg-gray-200 text-gray-600 text-sm rounded transition-colors">
초기화
</a>
</div>