@extends('layouts.app')

@section('title', $city->city_name . ' ダッシュボード')

@section('content')
<div class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-6">
                <h1 class="m-0 text-dark">{{ $city->city_name }} ダッシュボード</h1>
            </div>
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="{{ route('information') }}">ホーム</a></li>
                    <li class="breadcrumb-item active">{{ $city->city_name }}</li>
                </ol>
            </div>
        </div>
    </div>
</div>

<section class="content">
    <div class="container-fluid">
        <!-- 統計情報カード -->
        <div class="row">
            <div class="col-lg-3 col-6">
                <div class="small-box bg-info">
                    <div class="inner">
                        <h3>{{ $stats['parks_count'] }}</h3>
                        <p>駐輪場数</p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-building"></i>
                    </div>
                    <a href="{{ route('parks', ['city_id' => $city->city_id]) }}" class="small-box-footer">
                        詳細を見る <i class="fa fa-arrow-circle-right"></i>
                    </a>
                </div>
            </div>

            <div class="col-lg-3 col-6">
                <div class="small-box bg-success">
                    <div class="inner">
                        <h3>{{ number_format($stats['contracts_count']) }}</h3>
                        <p>契約数</p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-file-text"></i>
                    </div>
                    <a href="{{ route('regularcontracts') }}" class="small-box-footer">
                        詳細を見る <i class="fa fa-arrow-circle-right"></i>
                    </a>
                </div>
            </div>

            <div class="col-lg-3 col-6">
                <div class="small-box bg-warning">
                    <div class="inner">
                        <h3>{{ number_format($stats['users_count']) }}</h3>
                        <p>利用者数</p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-users"></i>
                    </div>
                    <a href="{{ route('users') }}" class="small-box-footer">
                        詳細を見る <i class="fa fa-arrow-circle-right"></i>
                    </a>
                </div>
            </div>

            <div class="col-lg-3 col-6">
                <div class="small-box bg-danger">
                    <div class="inner">
                        <h3>{{ number_format($stats['waiting_count']) }}</h3>
                        <p>予約待ち人数</p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-clock-o"></i>
                    </div>
                    <a href="{{ route('reserves') }}" class="small-box-footer">
                        詳細を見る <i class="fa fa-arrow-circle-right"></i>
                    </a>
                </div>
            </div>
        </div>

        <!-- 第2行：追加情報 -->
        <div class="row">
            <div class="col-lg-3 col-6">
                <div class="small-box bg-purple">
                    <div class="inner">
                        <h3>{{ number_format($parks->sum('park_capacity') ?? 0) }}</h3>
                        <p>総収容台数</p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-bicycle"></i>
                    </div>
                    <div class="small-box-footer" style="height: 30px;">
                        &nbsp;
                    </div>
                </div>
            </div>

            <div class="col-lg-3 col-6">
                <div class="small-box bg-teal">
                    <div class="inner">
                        @php
                            $totalCapacity = $parks->sum('park_capacity') ?? 0;
                            $utilizationRate = $totalCapacity > 0 ? round(($stats['contracts_count'] / $totalCapacity) * 100, 1) : 0;
                        @endphp
                        <h3>{{ $utilizationRate }}%</h3>
                        <p>利用率</p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-pie-chart"></i>
                    </div>
                    <div class="small-box-footer" style="height: 30px;">
                        &nbsp;
                    </div>
                </div>
            </div>

            <div class="col-lg-3 col-6">
                <div class="small-box bg-secondary">
                    <div class="inner">
                        <h3>{{ number_format($totalCapacity - $stats['contracts_count']) }}</h3>
                        <p>空き台数</p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-square-o"></i>
                    </div>
                    <div class="small-box-footer" style="height: 30px;">
                        &nbsp;
                    </div>
                </div>
            </div>

            <div class="col-lg-3 col-6">
                <div class="small-box bg-navy">
                    <div class="inner">
                        @php
                            $waitingRate = $stats['contracts_count'] > 0 ? round(($stats['waiting_count'] / $stats['contracts_count']) * 100, 1) : 0;
                        @endphp
                        <h3>{{ $waitingRate }}%</h3>
                        <p>予約待ち率</p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-percent"></i>
                    </div>
                    <div class="small-box-footer" style="height: 30px;">
                        &nbsp;
                    </div>
                </div>
            </div>
        </div>

        <!-- 駐輪場一覧 -->
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">{{ $city->city_name }}の駐輪場一覧</h3>
                        <div class="card-tools">
                            <a href="{{ route('parks.add') }}" class="btn btn-primary btn-sm">
                                <i class="fa fa-plus"></i> 新規駐輪場追加
                            </a>
                        </div>
                    </div>
                    <div class="card-body">
                        @if($parks->count() > 0)
                            <div class="table-responsive">
                                <table class="table table-bordered table-striped">
                                    <thead>
                                        <tr>
                                            <th>駐輪場ID</th>
                                            <th>駐輪場名</th>
                                            <th>住所</th>
                                            <th>収容台数</th>
                                            <th>状態</th>
                                            <th>操作</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($parks as $park)
                                        <tr>
                                            <td>{{ $park->park_id }}</td>
                                            <td>{{ $park->park_name }}</td>
                                            <td>{{ $park->park_address ?? '-' }}</td>
                                            <td class="text-right">{{ number_format($park->park_capacity ?? 0) }}台</td>
                                            <td>
                                                @if($park->park_status == 1)
                                                    <span class="badge badge-success">稼働中</span>
                                                @else
                                                    <span class="badge badge-secondary">停止中</span>
                                                @endif
                                            </td>
                                            <td>
                                                <a href="{{ route('parks.edit', $park->park_id) }}" class="btn btn-sm btn-info">
                                                    <i class="fa fa-edit"></i> 編集
                                                </a>
                                            </td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        @else
                            <div class="alert alert-info">
                                <i class="fa fa-info-circle"></i> この自治体にはまだ駐輪場が登録されていません。
                            </div>
                        @endif
                    </div>
                </div>
            </div>
        </div>

        <!-- クイックアクション -->
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">{{ $city->city_name }}関連のクイックアクション</h3>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-3">
                                <a href="{{ route('parks', ['city_id' => $city->city_id]) }}" class="btn btn-block btn-outline-primary">
                                    <i class="fa fa-building"></i><br>
                                    駐輪場管理
                                </a>
                            </div>
                            <div class="col-md-3">
                                <a href="{{ route('users') }}" class="btn btn-block btn-outline-success">
                                    <i class="fa fa-users"></i><br>
                                    利用者管理
                                </a>
                            </div>
                            <div class="col-md-3">
                                <a href="{{ route('regularcontracts') }}" class="btn btn-block btn-outline-warning">
                                    <i class="fa fa-file-text"></i><br>
                                    契約管理
                                </a>
                            </div>
                            <div class="col-md-3">
                                <a href="{{ route('city_edit', $city->city_id) }}" class="btn btn-block btn-outline-info">
                                    <i class="fa fa-cog"></i><br>
                                    運営元設定
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection

@push('scripts')
<script>
$(document).ready(function() {
    // 必要に応じてJavaScriptを追加
});
</script>
@endpush