@extends('views.layouts.master')
@section('content')

@php
    //var_dump($siseList['Page']);
    //var_dump($siseItems)
    $today = date('Y-m-d');
@endphp

<div class="sub golf">
	<div class="container">
		<div class="navi">
			<a href="/"><i class="fa-solid fa-house"></i> 홈</a> > {{ $title_dir }} > {{ $title }}
		</div>
		<div class="title">
			<h2> {{ $title }} </h2>
		</div>
	</div>

	<!-- 회원권 검색 시작 -->
	<div class="search_ticket">
		<div class="container">
			<label>회원권 검색</label>
			<input type="text" id="membership-name" placeholder="회원권명">
            <input type="date" id="date" value="{{$today}}">
			<button type="button" class="btn" onclick="searchMemberShip()">검색</button>
		</div>
	</div>
	<!--// 회원권 검색 끝 -->

	<!-- 시세 시작 -->
	<div class="quote">
		<div class="container">
			<ul class="tabs nav nav-tabs">
                <li class="{{ request('area', 'all') === 'all' ? 'active' : '' }}"><a href="{{ route('sise', [$siseType, 'all']) }}">전체</a></li>
                @if($siseType === 'golf')
                    <li class="{{ request('area', 'all') === '100' ? 'active' : '' }}"><a href="{{ route('sise', [$siseType, '100']) }}">수도권/강원/충청권</a></li>
                    <li class="{{ request('area', 'all') === '200' ? 'active' : '' }}"><a href="{{ route('sise', [$siseType, '200']) }}">영남/제주권</a></li>
                    <li class="{{ request('area', 'all') === '300' ? 'active' : '' }}"><a href="{{ route('sise', [$siseType, '300']) }}">호남권</a></li>
                @elseif($siseType === 'condo')
                    <li class="{{ request('area', 'all') === '400' ? 'active' : '' }}"><a href="{{ route('sise', [$siseType, '400']) }}">체인형콘도</a></li>
                    <li class="{{ request('area', 'all') === '500' ? 'active' : '' }}"><a href="{{ route('sise', [$siseType, '500']) }}">스키장콘도</a></li>
                @else
                    <li class="{{ request('area', 'all') === '600' ? 'active' : '' }}"><a href="{{ route('sise', [$siseType, '600']) }}">강남권</a></li>
                    <li class="{{ request('area', 'all') === '700' ? 'active' : '' }}"><a href="{{ route('sise', [$siseType, '700']) }}">강북권</a></li>
                @endif
			</ul>
			<div class="tab-content">
				<div class="tab-pane fade in active show">
					<div class="tb_res tb_vertical">
						<table cellspacing="0" cellpadding="0">
							<caption>단위: 만원</caption>
							<thead>
								<tr>
									<th>회원권명</th>
									<th>금일시세</th>
									<th>전일시세</th>
									<th>등락</th>
									<th>상담</th>
								</tr>
							</thead>
							<tbody id="sise-list">
                                @forelse($siseItems['Page'] ?? [] as $sise)
                                    <tr>
                                        <td scope="row "data-label="{{ $sise['PostTitle'] }}"> {{ $sise['PostTitle'] }} </td>
                                        <td data-label="{{$sise['Pc3']}}"> {{ number_format($sise['Pc3']) }} </td>
                                        <td data-label="{{$sise['Pc4']}}"> {{ number_format($sise['Pc4']) }} </td>
                                        <td data-label="등락" class="{{ isset($sise['fluctuation']) && $sise['fluctuation'] > 0 ? 'up' : (isset($sise['fluctuation']) && $sise['fluctuation'] < 0 ? 'down' : '') }}">
                                            @if (isset($sise['fluctuation']) && $sise['fluctuation'] != 0)
                                                <i class="fa-solid {{ $sise['fluctuation'] > 0 ? 'fa-sort-up' : 'fa-sort-down' }}"></i>
                                                {{ number_format(abs($sise['fluctuation'])) }}
                                            @else
                                                {{ number_format(abs($sise['fluctuation'])) }}
                                            @endif
                                        </td>
                                        <td data-label="상담신청">
                                            <button type="button" class="btn consult-btn"
                                                    onclick="window.location.href = '{{ route('contactus-custom', [$sise['Pc5'], $sise['PostTitle']]) }}'">상담신청
                                            </button>
                                        </td>
                                    </tr>
                                @empty
                                <tr>
                                    <td colspan="5">회원권이 존재하지 않습니다</td>
                                </tr>
                                @endforelse
							</tbody>
						</table>
					</div>
				</div>

			</div>
		</div>

        <!-- 페이지네이션 -->
        <div class="row">
            <div class="col-lg-12">
                <div class="bottom-paginate">
                    {{ $siseItems['Page']->appends(['limit' => request('limit'), 'sort' => request('sort')])->links() }}
                </div>
            </div>
        </div>
        <!--// 페이지네이션 끝 -->
	</div>
    <!--// 시세 끝 -->

</div>

@push('js')
<script>
    $(document).ready(function() {
        console.log('siseList : ', siseList);
        if ($('div').hasClass('chatbot') == true) {
            $('.main-footer').addClass('chatbot');
        }
    });

    // 회원권 검색
    function searchMemberShip() {
        var membershipName = document.getElementById('membership-name').value.toLowerCase();
        var date = document.getElementById('date').value;
        // console.log('date : ', date);
        // if (!membershipName) {
        //     alert('회원권명을 입력해주세요.');
        //     return;
        // }

        var formattedDate = '';
        if (date) {
            var parts = date.split('-');
            formattedDate = parts.join('');
        }

        console.log('siseList : ', siseList);
        if(siseList == null){
            alert('회원권이 존재하지 않습니다');
        }

        var filteredSiseList = siseList.filter(function(sise) {
            var postTitleMatch = sise['PostTitle'].toLowerCase().includes(membershipName);
            // var dateMatch = sise['Pc6'] && sise['Pc6'] === formattedDate;
            var dateMatch = date ? (sise['Pc6'] && sise['Pc6'] === formattedDate) : true;
            console.log('dateMatch : ', dateMatch);

            if(membershipName == ''){
                return dateMatch
            }else{
                return postTitleMatch && dateMatch;
            }
        });
        // console.log('filteredSiseList : ', filteredSiseList);
        renderSiseList(filteredSiseList);
    }
    // 동적으로 tbody 생ㄱ성
    function renderSiseList(siseList) {
    var tbody = $('#sise-list');
    tbody.empty(); // Clear existing rows
    console.log('siseList.length : ', siseList.length);

    if (siseList.length === 0) {
        tbody.html('<tr><td colspan="5">회원권이 존재하지 않습니다.</td></tr>');
        return;
    }

    siseList.forEach(function(sise) {
        var fluctuationClass = '';
        var fluctuationIcon = '';

        if (sise['fluctuation'] > 0) {
            fluctuationClass = 'up';
            fluctuationIcon = 'fa-sort-up';
        } else if (sise['fluctuation'] < 0) {
            fluctuationClass = 'down';
            fluctuationIcon = 'fa-sort-down';
        }

        var fluctuationText = sise['fluctuation'] !== 0 ? `
            <i class="fa-solid ${fluctuationIcon}"></i>
            ${number_format(Math.abs(sise['fluctuation']))}
        ` : `${number_format(sise['fluctuation'])}`;

        var tr = $('<tr>');
        tr.html(`
            <td scope="row" data-label="${sise['PostTitle']}">${sise['PostTitle']}</td>
            <td data-label="${sise['Pc3']}">${number_format(sise['Pc3'])}</td>
            <td data-label="${sise['Pc4']}">${number_format(sise['Pc4'])}</td>
            <td data-label="등락" class="${fluctuationClass}">
                ${fluctuationText}
            </td>
            <td data-label="상담신청">
                <button type="button" class="btn consult-btn"
                        data-post-title="${sise['PostTitle']}"
                        data-pc5="${sise['Pc5']}"
                        onclick="window.location.href = '/contactus-custom/${sise['Pc5']}/${encodeURIComponent(sise['PostTitle'])}'">상담신청
                </button>
            </td>
        `);
        tbody.append(tr);
    });
}

    function number_format(number) {
        return new Intl.NumberFormat().format(number);
    }
const siseList = {!! json_encode($siseList['Page']) !!}; // JavaScript에서 PHP 배열을 변환하여 변수에 할당
</script>
@endpush
@endsection