@extends('layouts.dashboard.main')

{{-- content --}}
@section('content')

<!-- nav -->
<ul class="nav nav-tabs nav-justified mb-5">
	<li class="nav-item">
		<a
			class="nav-link active"
			href="#"
			aria-current="page"
		>
			<span class="fw-bold">
				自部署
			</span>
		</a>
	</li>
	<li class="nav-item">
		<a
			class="nav-link"
			href="#"
		>
			<span class="fw-bold">
				共有
			</span>
		</a>
	</li>
</ul>
<!-- /.nav -->

<div class="row g-4">

	<!-- aside -->
	<aside class="col col-lg-3">

		<div class="d-flex justify-content-between align-items-center mb-3">
			<div>
				<h5>
					{!! __("lang.board.title") !!}
				</h5>
			</div>
			<div></div>
		</div>

		<!-- toolbar -->
		<div class="d-flex justify-content-between align-items-center mb-3">
			<div>
				{!! __("lang.common.count") !!} : <span class="fw-bold">{!! $board_list_count !!}</span>
			</div>
			<div>
				<div
					class="btn-group btn-group-sm"
					role="group"
				>
					<a
						class="btn btn-outline-secondary"
						href="{!! route('report.board.update') !!}"
					>
						{!! __("lang.button.create") !!}
					</a>
				</div>
			</div>
		</div>
		<!-- /.toolbar -->

		<div class="card mb-0">
			@if($board_list_count > 0)
				<ul class="list-group list-group-flush">
					@foreach($board_list as $key => $value)
						<a
							class="list-group-item list-group-item-action d-flex justify-content-start align-items-center {!! ($value['board_code'] == $board_code) ? 'active' : '' !!}"
							href="{!! route('report.board.index', [
								$value['board_code']
							]) !!}"
							aria-current="{!! ($value['board_code'] == $board_code) ? 'true' : 'false' !!}"
						>
							<div class="me-auto">
								{!! $value['board_title'] !!}
							</div>
							<div class="">
								<span class="fw-bold">
									（{!! $value['thread_list_count'] !!}）
								</span>
							</div>
							<div>
								<i class="fa-solid fa-angle-right fa-fw fa-lg"></i>
							</div>
						</a>
					@endforeach
				</ul>
			@else
				<div class="card-body">
					<p class="text-center mb-0">
						{!! __("lang.error.empty") !!}
					</p>
				</div>
			@endif
		</div>

	</aside>
	<!-- /.aside -->

	<!-- main -->
	<main class="col col-lg-9">

		@if(isset($board))

			<!-- section -->
			<section class="mb-5">

				<div class="section-title d-flex justify-content-between align-items-center mb-3">
					<div>
						<h5>
							スレッド一覧
						</h5>
					</div>
					<div></div>
				</div>

				<!-- toolbar -->
				<div class="d-flex justify-content-between align-items-center mb-3">
					<div>
						{!! __("lang.common.count") !!} : <span class="fw-bold">{!! $thread_list_count !!}</span>
					</div>
					<div>
						<div
							class="btn-group btn-group-sm"
							role="group"
						>
							<a
								class="btn btn-outline-secondary"
								href="{!! route('report.board.update', [
									$board_code,
								]) !!}"
							>
								{!! implode('', [
									__("lang.board.title"),
									__("lang.button.update"),
								]) !!}
							</a>
							<a
								class="btn btn-outline-secondary"
								href="{!! route('report.thread.update', [
									$board_code,
								]) !!}"
							>
								{!! implode('', [
									__("lang.thread.title"),
									__("lang.button.create"),
								]) !!}
							</a>
						</div>
					</div>
				</div>
				<!-- /.toolbar -->

				@if($thread_list_count > 0)
					<div class="row row-cols-1 row-cols-lg-3 g-3">
						@foreach($thread_list as $key => $value)
							<div class="col">
								<div class="d-grid">
									<a
										class="btn btn-outline-primary py-3"
										href="{!! route('report.topic.index', [
											$board_code,
											$value['thread_code'],
										]) !!}"
									>
										<span class="fw-bold">
											{!! $value['thread_title'] !!}（{!! $value['topic_list_count'] !!}）
										</span>
									</a>
								</div>
							</div>
						@endforeach
					</div>
				@else
					<div
						class="alert alert-secondary"
						role="alert"
					>
						<p class="fw-bold text-center mb-0">
							{!! __("lang.error.empty") !!}
						</p>
					</div>
				@endif

			</section>
			<!-- /.section -->

		@endif

	</main>
	<!-- /.main -->

</div>
@endsection

{{-- css --}}
@section('css')
<style>

</style>
@stop

{{-- js --}}
@section('js')
<script>
$(function() {


});
</script>
@stop